:root{
  --gl-bg:#0f172a; --gl-panel:#ffffff; --gl-ink:#1e293b;
  --gl-accent:#2563eb; --gl-line:#e2e8f0;
}
.gl-body{background:#f1f5f9;color:var(--gl-ink);}
.gl-navbar{background:var(--gl-bg);}
.gl-navbar .navbar-brand,.gl-navbar a{color:#fff;}
.gl-sub{color:#60a5fa;font-weight:600;}
.gl-userchip{color:#cbd5e1;font-size:.9rem;}
.gl-role{display:inline-block;margin-left:.4rem;padding:.1rem .45rem;border-radius:6px;
  background:#1e293b;color:#93c5fd;font-size:.72rem;}
.gl-card{background:var(--gl-panel);border:1px solid var(--gl-line);border-radius:14px;
  padding:1.1rem 1.25rem;box-shadow:0 1px 2px rgba(15,23,42,.04);}
.gl-logo{font-size:1.4rem;font-weight:700;}
.gl-tabs .nav-link{background:#e2e8f0;color:#334155;}
.gl-tabs .nav-link.active{background:var(--gl-accent);color:#fff;}
.gl-cardinput{letter-spacing:.12em;}
.gl-stat{background:#fff;border:1px solid var(--gl-line);border-radius:14px;padding:.85rem 1rem;text-align:center;}
.gl-stat-n{font-size:1.6rem;font-weight:700;line-height:1;}
.gl-stat-l{font-size:.72rem;color:#64748b;text-transform:uppercase;letter-spacing:.04em;margin-top:.25rem;}
.gl-warn .gl-stat-n{color:#d97706;} .gl-danger .gl-stat-n{color:#dc2626;}
.gl-footer{margin-top:auto;padding:.9rem 1rem;text-align:center;color:#94a3b8;
  font-size:.78rem;border-top:1px solid var(--gl-line);background:#fff;}
.gl-ver{color:#2563eb;font-weight:600;}
.gl-foot-sep{margin:0 .4rem;color:#cbd5e1;}
.gl-body{min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden;}
html,body{max-width:100%;}

/* ── Layout shell with sidebar (v0.2) ── */
.gl-shell{display:flex;align-items:stretch;min-height:calc(100vh - 56px - 46px);
  width:100%;max-width:100%;}
.gl-main{flex:1 1 auto;padding:1.5rem 2rem;min-width:0;max-width:100%;overflow-x:hidden;}
/* Inner wrapper keeps content from stretching edge-to-edge on wide screens
   while staying fully fluid on tablets/laptops. */
.gl-main > *{max-width:1400px;}
@media (max-width:992px){
  .gl-main{padding:1rem 1.1rem;}
}
.gl-burger{background:transparent;border:0;color:#fff;font-size:1.25rem;
  line-height:1;cursor:pointer;padding:.25rem .5rem;border-radius:6px;}
.gl-burger:hover{background:rgba(255,255,255,.12);}

/* Sidebar */
.gl-sidebar{flex:0 0 230px;width:230px;background:#0f172a;border-right:1px solid #1e293b;
  transition:width .18s ease, flex-basis .18s ease;overflow:hidden;}
.gl-nav{display:flex;flex-direction:column;padding:.6rem .5rem;gap:.15rem;}
.gl-nav-item{display:flex;align-items:center;gap:.7rem;padding:.6rem .7rem;border-radius:8px;
  color:#cbd5e1;text-decoration:none;font-size:.92rem;white-space:nowrap;}
.gl-nav-item:hover{background:#1e293b;color:#fff;}
.gl-nav-item.active{background:#2563eb;color:#fff;}
.gl-nav-item.disabled{color:#64748b;cursor:default;}
.gl-nav-item.disabled:hover{background:transparent;color:#64748b;}
.gl-nav-ico{width:1.2rem;text-align:center;font-size:1rem;flex:0 0 auto;}
.gl-nav-txt{flex:1 1 auto;}
.gl-soon{font-size:.62rem;background:#1e293b;color:#94a3b8;border-radius:5px;
  padding:.05rem .35rem;text-transform:uppercase;letter-spacing:.04em;}

/* Collapsed state: hide labels, narrow rail */
.gl-collapsed .gl-sidebar{flex-basis:56px;width:56px;}
.gl-collapsed .gl-nav-txt,.gl-collapsed .gl-soon{display:none;}
.gl-collapsed .gl-nav-item{justify-content:center;gap:0;}

/* On small screens, sidebar overlays instead of squashing content */
@media (max-width:768px){
  .gl-sidebar{position:fixed;top:56px;bottom:0;left:0;z-index:1030;}
  .gl-collapsed .gl-sidebar{flex-basis:0;width:0;border:0;}
}

/* ── Tracker ── */
.gl-card{max-width:100%;}
.gl-card .table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.gl-tracker-table{margin-bottom:0;}
.gl-count-badge{font-size:.75rem;font-weight:600;padding:.25rem .7rem;border-radius:20px;
  background:#dbeafe;color:#1e40af;}
.gl-count-badge.all{background:#d1fae5;color:#065f46;}
.gl-tracker-table th{font-size:.72rem;text-transform:uppercase;letter-spacing:.03em;
  color:#64748b;border-bottom:2px solid var(--gl-line);}
.gl-tracker-table td a{text-decoration:none;font-weight:600;}
.gl-row-overdue{background:#fff5f5;}
.gl-prio{font-size:.72rem;font-weight:600;padding:.1rem .5rem;border-radius:6px;}
.gl-prio-routine{background:#e2e8f0;color:#475569;}
.gl-prio-urgent{background:#fef3c7;color:#92400e;}
.gl-prio-critical{background:#fee2e2;color:#991b1b;}
.gl-tag-mother,.gl-tag-aliquot{display:inline-block;font-size:.6rem;font-weight:700;
  border-radius:4px;padding:0 .3rem;margin-left:.3rem;vertical-align:middle;}
.gl-tag-mother{background:#ede9fe;color:#6d28d9;}
.gl-tag-aliquot{background:#cffafe;color:#0e7490;}
/* On narrower screens, drop the least-critical columns so the table fits.
   Columns: 1 AR, 2 Product, 3 Name, 4 Type, 5 Stage, 6 Status, 7 Priority,
            8 Due, 9 Expiry, 10 Registered By. */
@media (max-width:1100px){
  .gl-tracker-table th:nth-child(2),.gl-tracker-table td:nth-child(2),  /* Product */
  .gl-tracker-table th:nth-child(10),.gl-tracker-table td:nth-child(10) /* Registered By */
  {display:none;}
}
@media (max-width:850px){
  .gl-tracker-table th:nth-child(4),.gl-tracker-table td:nth-child(4),  /* Type */
  .gl-tracker-table th:nth-child(9),.gl-tracker-table td:nth-child(9)   /* Expiry */
  {display:none;}
}

/* ── Detail ── */
.gl-detail-head{border-left:5px solid #2563eb;}
.gl-detail-ar{font-size:1.4rem;font-weight:700;color:#1e293b;}
.gl-detail-name{font-size:1rem;color:#334155;margin-top:.15rem;}
.gl-detail-product{font-size:.82rem;color:#2563eb;font-weight:600;margin-top:.1rem;}
.gl-status{font-size:.78rem;font-weight:600;padding:.3rem .8rem;border-radius:20px;
  background:#d1fae5;color:#065f46;}
.gl-status-disposed,.gl-status-to-be-discarded{background:#fee2e2;color:#991b1b;}
.gl-status-archived{background:#e2e8f0;color:#475569;}
.gl-kv td{padding:.35rem 0;font-size:.86rem;border:0;}
.gl-kv td:first-child{color:#64748b;width:45%;}
.gl-tests,.gl-aliquots{font-size:.86rem;padding-left:1.1rem;}
.gl-tests li,.gl-aliquots li{margin:.15rem 0;}
.gl-aliquots a{text-decoration:none;}
.gl-instructions{background:#fef3c7;border-left:4px solid #d97706;padding:.6rem .8rem;
  border-radius:6px;font-size:.85rem;}

/* Timeline */
.gl-timeline{position:relative;padding-left:1rem;}
.gl-tl-item{position:relative;padding:.5rem 0 .5rem 1rem;border-left:2px solid #e2e8f0;}
.gl-tl-item::before{content:"";position:absolute;left:-7px;top:.7rem;width:12px;height:12px;
  border-radius:50%;background:#cbd5e1;border:2px solid #fff;}
.gl-tl-current::before{background:#10b981;}
.gl-tl-stage{font-weight:600;color:#1e293b;font-size:.9rem;}
.gl-tl-current .gl-tl-stage{color:#059669;}
.gl-tl-meta{font-size:.78rem;color:#64748b;margin-top:.15rem;}
.gl-tl-remark{font-size:.78rem;color:#475569;font-style:italic;margin-top:.15rem;}

/* ── Register wizard (v0.3) ── */
.gl-steps{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;}
.gl-step{display:flex;align-items:center;gap:.45rem;}
.gl-step-n{display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:50%;background:#e2e8f0;color:#64748b;
  font-size:.8rem;font-weight:700;flex:0 0 auto;}
.gl-step-l{font-size:.82rem;color:#94a3b8;white-space:nowrap;}
.gl-step.active .gl-step-n{background:#2563eb;color:#fff;}
.gl-step.active .gl-step-l{color:#1e293b;font-weight:600;}
.gl-step.past .gl-step-n{background:#10b981;color:#fff;}
.gl-step.past .gl-step-l{color:#475569;}
.gl-step-bar{flex:1 1 18px;min-width:18px;height:2px;background:#e2e8f0;}
.gl-step-bar.past{background:#10b981;}
@media (max-width:680px){.gl-step-l{display:none;}}

.gl-ar-banner{border-left:5px solid #2563eb;}
.gl-ar-big{font-size:1.7rem;font-weight:700;letter-spacing:.02em;color:#1e293b;}

.gl-aliquot-choice{display:flex;gap:.75rem;flex-wrap:wrap;}
.gl-radio-card{flex:1 1 220px;border:1px solid var(--gl-line);border-radius:10px;
  padding:.8rem 1rem;cursor:pointer;display:flex;align-items:center;gap:.6rem;}
.gl-radio-card:hover{border-color:#93c5fd;background:#f8fafc;}
.gl-radio-title{font-size:.92rem;}
.gl-ar-chip{display:inline-block;font-family:monospace;font-size:.8rem;
  background:#eff6ff;color:#1e40af;border:1px solid #bfdbfe;border-radius:6px;
  padding:.15rem .5rem;margin:.15rem .25rem .15rem 0;}
.gl-ar-chip.linkable{text-decoration:none;}
.gl-ar-chip.linkable:hover{background:#dbeafe;}

.gl-summary-banner{background:#f5f3ff;border:1px solid #ddd6fe;font-size:.9rem;}
.gl-badge-purple{background:#ede9fe;color:#6d28d9;border-radius:20px;
  padding:.1rem .6rem;font-size:.75rem;font-weight:600;}
.gl-badge-blue{background:#dbeafe;color:#1e40af;border-radius:20px;
  padding:.1rem .6rem;font-size:.75rem;font-weight:600;}

.gl-detail-tabs .nav-link{font-size:.85rem;padding:.4rem .8rem;}
.gl-tally-ok{color:#065f46;background:#d1fae5;border-radius:8px;padding:.5rem .8rem;
  font-size:.86rem;font-weight:600;}
.gl-tally-bad{color:#991b1b;background:#fee2e2;border-radius:8px;padding:.5rem .8rem;
  font-size:.86rem;font-weight:600;}

.gl-done-card{padding:2.2rem 1.5rem;}
.gl-done-check{width:64px;height:64px;border-radius:50%;background:#d1fae5;color:#059669;
  font-size:2rem;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;}
.gl-done-list{margin-top:1rem;}

/* ── Stage Movement (v0.4) ── */
.gl-move-tabs .nav-link{background:#e2e8f0;color:#334155;margin-right:.4rem;font-size:.9rem;}
.gl-move-tabs .nav-link.active{background:#2563eb;color:#fff;}
.gl-current-stage{font-size:1.1rem;font-weight:700;color:#2563eb;}

/* ── Discard (v0.5) ── */
.gl-review-badge{font-size:.68rem;background:#fef3c7;color:#92400e;border-radius:12px;
  padding:.1rem .5rem;margin-left:.4rem;font-weight:600;}
.gl-dcr{border:1px solid var(--gl-line);border-radius:10px;padding:.8rem 1rem;margin-bottom:.7rem;}
.gl-dcr:last-child{margin-bottom:0;}
.gl-dcr-status{font-size:.7rem;font-weight:600;border-radius:12px;padding:.1rem .55rem;margin-left:.4rem;}
.gl-dcr-status.pending{background:#fef3c7;color:#92400e;}
.gl-dcr-status.approved{background:#d1fae5;color:#065f46;}
.gl-dcr-status.rejected{background:#e2e8f0;color:#475569;}
.gl-dcr-ars{margin:.5rem 0;}
.gl-dcr-reason{font-size:.85rem;color:#475569;background:#f8fafc;border-radius:6px;
  padding:.4rem .6rem;margin-bottom:.5rem;}
.gl-dcr-actions{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;}
.gl-dcr-actions .form-control{max-width:260px;}

/* ── Admin (v0.6) ── */
.gl-pill-green{background:#d1fae5;color:#065f46;border-radius:12px;padding:.1rem .55rem;
  font-size:.72rem;font-weight:600;margin-left:.2rem;}
.gl-pill-grey{background:#e2e8f0;color:#475569;border-radius:12px;padding:.1rem .55rem;
  font-size:.72rem;font-weight:600;margin-left:.2rem;}
.gl-role-badge{background:#eff6ff;color:#1e40af;border:1px solid #bfdbfe;border-radius:6px;
  padding:.1rem .5rem;font-size:.76rem;font-weight:600;}
.gl-edit-cell{background:#f8fafc;}
.gl-master-area{font-family:monospace;font-size:.85rem;}
.gl-perm-table th{font-size:.72rem;white-space:nowrap;}
.gl-lvl{font-size:.68rem;font-weight:700;border-radius:5px;padding:.1rem .4rem;text-transform:uppercase;}
.gl-lvl-full{background:#d1fae5;color:#065f46;}
.gl-lvl-view{background:#dbeafe;color:#1e40af;}
.gl-lvl-create{background:#fef3c7;color:#92400e;}
.gl-lvl-none{background:#f1f5f9;color:#cbd5e1;}

/* ── Audit Trail (v0.7) ── */
.gl-interim-note{background:#fffbeb;border-left:4px solid #d97706;border-radius:6px;
  padding:.7rem 1rem;font-size:.85rem;color:#475569;}
.gl-audit-table th{font-size:.72rem;text-transform:uppercase;letter-spacing:.03em;color:#64748b;}
.gl-audit-action{font-size:.7rem;font-weight:600;border-radius:6px;padding:.1rem .5rem;white-space:nowrap;}
.gl-action-stage-move{background:#dbeafe;color:#1e40af;}
.gl-action-sample-receipt{background:#d1fae5;color:#065f46;}
.gl-action-discard-raised{background:#fef3c7;color:#92400e;}
.gl-action-discard-approved{background:#fee2e2;color:#991b1b;}
.gl-action-discard-rejected{background:#e2e8f0;color:#475569;}

/* ── Barcode & Label (v0.8) ── */
.gl-label-preview{width:177px;height:177px;border:1px solid var(--gl-line);
  border-radius:6px;image-rendering:pixelated;background:#fff;}
.gl-stage-preview{max-width:340px;width:100%;border:1px solid var(--gl-line);
  border-radius:8px;background:#fff;}
.gl-label-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:1rem;}
.gl-label-tile{text-align:center;border:1px solid var(--gl-line);border-radius:10px;
  padding:.6rem;background:#fff;}

/* ── Stage Movement v0.9 ── */
.gl-pill-amber{background:#fef3c7;color:#92400e;border-radius:12px;padding:.1rem .55rem;
  font-size:.72rem;font-weight:600;margin-left:.2rem;}

/* ── Editable role-permission grid (v0.10) ───────────────────────── */
.gl-perm-select{font-size:.72rem;font-weight:600;width:auto;min-width:78px;display:inline-block;text-transform:uppercase;}
.gl-perm-select.gl-lvl-full{background:#d1fae5;color:#065f46;}
.gl-perm-select.gl-lvl-view{background:#dbeafe;color:#1e40af;}
.gl-perm-select.gl-lvl-create{background:#fef3c7;color:#92400e;}
.gl-perm-select.gl-lvl-none{background:#f1f5f9;color:#64748b;}
