/* The Tool Bakery — Labels to Print (Shipping Labels, 2x2 Avery 5168) */
:root {
  --primary-color:#0073e6;
  --secondary-color:#555;
  --background-color:#f5f7fa;
  --card:#fff;
  --border:#e0e6ed;
  --shadow:0 4px 6px rgba(0,0,0,.1);
}

.ttb-labels-container{
  background:var(--card);
  border-radius:12px;
  box-shadow:var(--shadow);
  padding:24px;
  max-width:940px;
  margin:24px auto;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color:var(--secondary-color);
}

.ttb-labels-container h2{
  margin:0 0 12px;
  color:var(--primary-color);
  font-size:24px;
}

.ttb-note{margin:4px 0 16px;font-size:14px;color:#666}

/* Tabs */
.ttb-mode-tabs{
  display:flex; gap:8px; margin:8px 0 16px;
}
.ttb-tab{
  padding:8px 12px; border:1px solid var(--border); background:#fff; border-radius:8px; cursor:pointer; border-color:#b9dcff; color:#084d85; font-weight:600;
}
.ttb-tab.active{ background:#e9f3ff; border-color:#b9dcff; color:#084d85; font-weight:600; }

.ttb-mode-panel{}

/* Quick uploads */
.ttb-upload-grid{
  display:grid;
  grid-template-columns: repeat(2,minmax(240px,1fr));
  gap:16px;
}
.ttb-upload-item label{font-weight:600;display:block;margin-bottom:6px}
.ttb-upload-item input[type="file"]{
  width:100%;
  padding:10px;
  border:1px solid var(--border);
  border-radius:8px;
  background:#fff;
}

.ttb-labels-buttons{
  display:flex;justify-content:flex-end;gap:12px;margin:18px 0;
}
#ttb-print-labels,#ttb-print-batch{
  background:var(--primary-color);
  color:#fff;border:0;border-radius:8px;padding:12px 18px;font-weight:600;cursor:pointer;
}
#ttb-print-batch[disabled]{ opacity:.5; cursor:not-allowed; }

.ttb-sample-heading{margin-top:12px;border-top:1px solid var(--border);padding-top:12px;font-weight:700}

/* Preview wrapper boxes */
#ttb-sample-display, #ttb-batch-preview{
  border:1px solid #000; background:#fafafa; padding:12px; margin-top:12px;
  min-height:120px; overflow:auto;
}

/* Avery 5168 sheet geometry — DO NOT CHANGE (printing aligned) */
.ttb-sample-sheet{
  width:7.5in;
  display:grid;
  grid-template-columns: repeat(2, 3.5in);
  column-gap:0.5in;
  grid-auto-rows:5in;
  margin:0 auto;
  padding:0;
  box-shadow:0 2px 5px rgba(0,0,0,.2);
  box-sizing:border-box;
}
.ttb-sample-label-box{
  position:relative; box-sizing:border-box;
  width:3.5in; height:5in;
  border:1px dashed #ccc; padding:0.125in; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:#fff;
}
.ttb-sample-label-box img, .ttb-sample-label-box canvas{
  max-width:100%; max-height:100%; object-fit:contain; display:block;
}

/* Batch Uploader */
.ttb-batch-uploader{ margin:8px 0; }
.ttb-dropzone{
  position:relative; display:flex; align-items:center; justify-content:center;
  min-height:120px; border:2px dashed #9ec7ff; background:#f6fbff; border-radius:10px; cursor:pointer;
  text-align:center; padding:16px;
}
.ttb-dropzone input[type=file]{ position:absolute; inset:0; opacity:0; cursor:pointer; }
.ttb-dropzone.drag{ background:#e9f3ff; border-color:#6db2ff; }
.ttb-batch-info{ margin-top:8px; font-size:14px; color:#333; }

/* Print — DO NOT CHANGE GEOMETRY */
@media print{
  @page{ size:8.5in 11in; margin:0.5in 0.5in; }
  body{ margin:0; padding:0; background:#fff; }
  .ttb-sample-sheet{ box-shadow:none !important; margin:0 !important; }
  .ttb-sample-label-box{ border:none !important; }
}