
:root{
  /* Trinity Onyx & Gold (dark, default) */
  --bg:#050505;--surface:#080808;--surface2:#0b0b0b;--line-strong:#3a3122;
  --ink:#F3EEDF;--hairline-rgb:255,255,255;--on-accent:#171614;
  --red:#D4AF37;--red2:#E9C767;--red-deep:#5C4415;--red-deep2:#7A5A1B;--red-deepest:#2E2109;
  --red-rgb:212,175,55;--muted:#a89f8a;--green:#8be29a;--amber:#ffc06c;--amber-rgb:255,192,108;
  --blue:#8fc8ff;--orange:#D4AF37;--danger:#D9524A;--danger-rgb:217,82,74;
  --line:rgba(var(--hairline-rgb),.13);
  color-scheme:dark;
}
[data-theme="light"]{
  /* Trinity Ivory (light) */
  --bg:#F7F1E1;--surface:#FBF6EA;--surface2:#F1E9D2;--line-strong:#CBB98A;
  --ink:#221D0F;--hairline-rgb:34,29,15;--on-accent:#171614;
  --red:#A97C0D;--red2:#8C6109;--red-deep:#B99429;--red-deep2:#C7A63D;--red-deepest:#8A6C1E;
  --red-rgb:169,124,13;--muted:#6b6248;--green:#2F7D3D;--amber:#8C6109;--amber-rgb:140,97,9;
  --blue:#2A6FA8;--orange:#A97C0D;--danger:#B23A33;--danger-rgb:178,58,51;
  --line:rgba(var(--hairline-rgb),.16);
  color-scheme:light;
}
[data-theme="light"] body:before{background:rgba(255,255,255,.35)}
*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--bg);font-family:Arial,sans-serif}body:before{content:"";position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:-1}
.hidden{display:none!important}.admin-shell{padding:28px;max-width:1600px;margin:auto}.admin-shell header{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:20px;padding:18px;background:var(--surface);border:1px solid var(--red)}
.theme-toggle-button{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;background:var(--surface2);color:var(--ink);border:1px solid var(--line-strong);cursor:pointer;border-radius:999px}
.theme-toggle-button:hover{color:var(--red2);border-color:var(--red2)}.admin-brand{display:flex}.admin-brand img{width:95px;height:95px}.admin-shell header p{color:var(--red2);text-transform:uppercase;letter-spacing:.15em;font-size:12px;margin:0}.admin-shell header h1{font:500 2.5rem Georgia,serif;margin:4px 0}.admin-shell header span{color:var(--muted)}.admin-shell header>a{padding:12px 16px;background:var(--surface2);border:1px solid #555;text-decoration:none}
.login-card{max-width:500px;margin:70px auto;padding:30px;background:var(--surface);border:1px solid var(--red);text-align:center}.login-card input{width:100%;height:48px;background:var(--bg);color:var(--ink);border:1px solid var(--line);padding:0 12px}.login-card button{width:100%;height:48px;margin-top:12px;background:var(--red);color:var(--on-accent);border:0;font-weight:900}
.admin-panel{margin-top:20px}.admin-toolbar{display:flex;gap:9px;flex-wrap:wrap}.admin-toolbar button,.upload-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 14px;background:var(--surface2);color:var(--ink);border:1px solid var(--line);font-weight:800;cursor:pointer}.upload-button input{display:none}.admin-toolbar button:nth-child(4){background:var(--red)}.admin-help{margin:14px 0;padding:14px;background:var(--surface2);border-left:4px solid var(--red);color:var(--muted)}.admin-search-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.admin-search-row input{width:min(500px,70vw);height:44px;background:var(--surface);color:var(--ink);border:1px solid var(--line);padding:0 12px}.admin-search-row strong{color:var(--red2)}
.editor-table-wrap{overflow:auto;border:1px solid var(--line);background:var(--surface)}table{width:100%;min-width:2250px;border-collapse:collapse}th,td{padding:8px;border-bottom:1px solid var(--line);text-align:left}th{position:sticky;top:0;background:#171717;border-bottom:2px solid var(--red);font-size:10px;text-transform:uppercase}td input,td select,td textarea{width:100%;min-height:38px;background:var(--bg);color:var(--ink);border:1px solid #444;padding:6px}td textarea{min-height:58px}.delete-row{background:var(--red-deepest);color:var(--on-accent);border:1px solid var(--red-deep2);padding:8px}
@media(max-width:800px){
  .admin-shell{padding:10px}
  .admin-shell header{grid-template-columns:1fr;justify-items:center;text-align:center;gap:10px;padding:20px 14px}
  .admin-brand{justify-content:center;width:100%}
  .admin-brand img{width:120px!important;height:120px!important}
  .admin-shell header>div:nth-of-type(2){width:100%}
  .admin-shell header h1{font-size:1.65rem!important;line-height:1.15}
  .admin-shell header p{text-align:center}
  .admin-shell header span{display:block;max-width:280px;margin:0 auto}
  .admin-shell header .theme-toggle-button{justify-self:center}
  .admin-shell header>a{justify-self:center;width:100%;max-width:280px;text-align:center}
  .admin-toolbar{display:grid}
  .admin-search-row{display:grid;gap:8px}
  .admin-search-row input{width:100%}
}

.admin-brand img{object-fit:contain;background:var(--bg);border:1px solid rgba(var(--hairline-rgb),.10)}

.admin-brand img{width:260px;height:100px;object-fit:contain}

.admin-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.admin-tabs button{min-height:43px;padding:0 16px;background:var(--surface);color:var(--muted);border:1px solid rgba(var(--hairline-rgb),.13);font-weight:900}
.admin-tabs button.active{background:var(--red);color:var(--on-accent);border-color:var(--red2)}
.admin-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:15px 0}
.admin-kpis article{padding:20px;background:linear-gradient(145deg,#121212,var(--surface));border:1px solid rgba(var(--hairline-rgb),.13)}
.admin-kpis span,.admin-kpis strong{display:block}.admin-kpis span{color:var(--muted);text-transform:uppercase;font-size:.72rem}.admin-kpis strong{margin-top:8px;color:var(--ink);font-size:2.1rem}
.dashboard-actions{display:flex;gap:10px;flex-wrap:wrap}.dashboard-actions a,.dashboard-actions button{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;background:var(--red);color:var(--on-accent);border:0;text-decoration:none;font-weight:900}
.leads-table-wrap table{min-width:1800px}.referral-table{min-width:1050px}
@media(max-width:800px){.admin-kpis{grid-template-columns:1fr 1fr}.admin-tabs{display:grid}.dashboard-actions{display:grid}}

.admin-order-banner{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;padding:22px;margin-bottom:16px;background:linear-gradient(135deg,rgba(var(--red-rgb),.18),var(--surface) 60%);border:1px solid var(--red2)}.admin-order-banner h2{margin:4px 0 8px;font:500 2rem Georgia,serif}.admin-order-banner p{color:var(--muted);line-height:1.55}.admin-order-banner>a{min-height:46px;display:flex;align-items:center;justify-content:center;padding:0 16px;background:var(--red);color:var(--on-accent);text-decoration:none;font-weight:900}.order-notification-setup{margin-bottom:16px;padding:18px;background:var(--surface);border-left:4px solid var(--red2)}.order-notification-setup h3{margin-top:0;font:500 1.35rem Georgia,serif}.order-notification-setup ol{color:#ddd;line-height:1.8}.order-notification-setup p{color:var(--muted)}.orders-table-wrap table{min-width:3100px}.orders-table-wrap textarea{min-width:170px}.order-kpis{margin-bottom:16px}@media(max-width:800px){.admin-order-banner{grid-template-columns:1fr}}

#syncRemoteOrders{background:#0c6430!important;border-color:#3dbd68!important}


/* Production 3.6 - Inventory Reports */
.inventory-report-banner{
  display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;
  padding:22px;margin-bottom:16px;
  background:linear-gradient(135deg,rgba(var(--red-rgb),.20),var(--surface) 60%);
  border:1px solid var(--red2)
}
.inventory-report-banner h2{margin:4px 0 8px;font:500 2rem Georgia,serif}
.inventory-report-banner p{color:var(--muted);line-height:1.55;margin-bottom:0}
.inventory-report-badges{display:grid;gap:8px}
.inventory-report-badges span{
  padding:9px 12px;background:var(--surface2);border:1px solid rgba(var(--hairline-rgb),.14);
  color:#ddd;font-size:.75rem;font-weight:800;text-align:center
}
.inventory-report-cards{
  display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px
}
.inventory-report-card{
  padding:18px;background:linear-gradient(145deg,#121212,var(--surface));
  border:1px solid rgba(var(--hairline-rgb),.14);cursor:pointer
}
.inventory-report-card.active{border-color:var(--red2);box-shadow:0 0 0 1px var(--red) inset}
.inventory-report-card>span{color:var(--red2);text-transform:uppercase;font-size:.68rem;font-weight:900;letter-spacing:.12em}
.inventory-report-card h3{margin:8px 0;font:500 1.25rem Georgia,serif}
.inventory-report-card p{min-height:44px;color:var(--muted);font-size:.82rem;line-height:1.45}
.internal-report-card{background:linear-gradient(145deg,var(--red-deepest),var(--surface))}
.report-card-links{display:flex;gap:6px;flex-wrap:wrap}
.report-card-links a{
  padding:8px 10px;background:var(--surface2);color:var(--ink);border:1px solid #444;
  text-decoration:none;font-size:.72rem;font-weight:900
}
.report-card-links a:first-child{background:var(--red);border-color:var(--red2)}
.inventory-report-toolbar{
  display:grid;grid-template-columns:230px 190px minmax(280px,1fr) auto;
  gap:10px;align-items:end;margin-bottom:12px;padding:14px;background:var(--surface2);
  border:1px solid rgba(var(--hairline-rgb),.13)
}
.inventory-report-toolbar label{display:grid;gap:6px;color:var(--muted);font-size:.72rem;text-transform:uppercase;font-weight:800}
.inventory-report-toolbar select,.inventory-report-toolbar input{
  width:100%;height:43px;background:var(--bg);color:var(--ink);border:1px solid #444;padding:0 10px
}
.inventory-report-toolbar button{
  min-height:43px;padding:0 14px;background:var(--red);color:var(--on-accent);border:1px solid var(--red2);font-weight:900
}
.inventory-report-summary{display:flex;justify-content:space-between;align-items:center;margin:12px 0}
.inventory-report-summary strong{font:500 1.4rem Georgia,serif}
.inventory-report-summary span{color:var(--red2);font-weight:900}
.inventory-report-table-wrap table{min-width:1150px}
.inventory-report-table-wrap td{font-size:.78rem;white-space:normal;min-width:95px}
.inventory-report-table-wrap th{font-size:.62rem}
.inventory-pdf-preview{
  display:grid;grid-template-columns:260px 1fr;gap:16px;align-items:start;
  margin-top:18px;padding:16px;background:var(--surface);border:1px solid rgba(var(--hairline-rgb),.13)
}
.inventory-pdf-preview h3{margin-top:0;font:500 1.35rem Georgia,serif}
.inventory-pdf-preview p{color:var(--muted);line-height:1.55}
.inventory-pdf-preview iframe{width:100%;height:720px;background:#fff;border:1px solid #444}
@media(max-width:1000px){
  .inventory-report-cards{grid-template-columns:1fr}
  .inventory-report-toolbar{grid-template-columns:1fr 1fr}
  .inventory-search-label{grid-column:1/-1}
  .inventory-report-toolbar button{grid-column:1/-1}
  .inventory-pdf-preview{grid-template-columns:1fr}
}
@media(max-width:600px){
  .inventory-report-banner{grid-template-columns:1fr}
  .inventory-report-toolbar{grid-template-columns:1fr}
  .inventory-search-label,.inventory-report-toolbar button{grid-column:auto}
  .inventory-pdf-preview iframe{height:520px}
}

.inventory-total-row td{
  background:var(--surface2)!important;
  color:var(--ink)!important;
  font-weight:900;
  border-top:2px solid var(--red2)!important;
  text-align:center;
}
.peptide-requests-table-wrap table{min-width:1180px}.peptide-requests-table-wrap textarea{min-width:260px;min-height:60px}

/* ==========================================================================
   Light theme (Trinity Ivory) corrections -- Production 3.9
   ==========================================================================
   The Inventory Reports tab was built dark-only. Several colours were written
   as literal hex values instead of theme variables, so in light mode the report
   cards kept a near-black gradient while the text switched to dark ink (dark on
   dark), and the badges kept a pale grey that vanished on cream.
   ========================================================================== */

/* Report cards: pale, tinted panels instead of a black gradient. */
[data-theme="light"] .inventory-report-card{
  background:linear-gradient(145deg,#FFFDF6,var(--surface2));
  border-color:var(--line-strong);
}
[data-theme="light"] .inventory-report-card.active{
  border-color:var(--red);box-shadow:0 0 0 1px var(--red) inset;
}
[data-theme="light"] .internal-report-card{
  background:linear-gradient(145deg,#F6EBCB,var(--surface2));
}
[data-theme="light"] .inventory-report-card>span{color:#6B4A06}
[data-theme="light"] .inventory-report-card h3{color:var(--ink)}
[data-theme="light"] .inventory-report-card p{color:#5E5643}

/* Badges: "201 public inventory rows" etc. were #ddd on cream. */
[data-theme="light"] .inventory-report-badges span{
  color:#3D3728;background:#FFFDF6;border-color:var(--line-strong);
}

/* "View PDF / Download PDF / Download Excel" buttons. */
[data-theme="light"] .report-card-links a{
  background:#FFFDF6;color:var(--ink);border-color:var(--line-strong);
}
[data-theme="light"] .report-card-links a:first-child{
  background:var(--red);color:#FFF9EC;border-color:var(--red2);
}

/* Toolbar and table controls used a hardcoded #444 border. */
[data-theme="light"] .inventory-report-toolbar{border-color:var(--line-strong)}
[data-theme="light"] .inventory-report-toolbar select,
[data-theme="light"] .inventory-report-toolbar input{
  border-color:var(--line-strong);background:var(--surface);
}
[data-theme="light"] .inventory-report-toolbar label{color:#5E5643}
[data-theme="light"] .inventory-report-summary span{color:#6B4A06}

/* Same hardcoded #ddd appears in the order-notification setup steps. */
[data-theme="light"] .order-notification-setup ol{color:#3D3728}
[data-theme="light"] .order-notification-setup p{color:#5E5643}

/* Banner body copy sits on a tinted gradient in both themes. */
[data-theme="light"] .inventory-report-banner p,
[data-theme="light"] .admin-order-banner p{color:#5E5643}
[data-theme="light"] .inventory-report-banner .eyebrow,
[data-theme="light"] .admin-order-banner .eyebrow{color:#6B4A06}

/* The gate reminder banner shown when ADMIN_PASSWORD is not set yet. */
.admin-gate-warning{
  border-left:3px solid var(--amber);
  background:rgba(var(--amber-rgb),.10);
  margin-bottom:14px;
}

/* The primary "View PDF" button was cream text on gold in BOTH themes -- 1.8:1
   in dark and 3.6:1 in light. Gold needs dark text; the light theme's darker
   gold needs cream text. */
.report-card-links a:first-child{
  background:var(--red);color:var(--on-accent);border-color:var(--red2);
}
[data-theme="light"] .report-card-links a:first-child{
  background:#6B4A06;color:#FFF9EC;border-color:#4E3604;
}

/* Touch targets on the report cards. These were 8px-padded links at .72rem,
   roughly 30px tall -- too small to tap reliably on a phone. */
.report-card-links a{
  min-height:44px;display:inline-flex;align-items:center;justify-content:center;
  padding:10px 14px;
}
@media(max-width:560px){
  .report-card-links{display:grid;grid-template-columns:1fr;gap:8px}
  .report-card-links a{width:100%}
  .inventory-report-badges{flex-wrap:wrap}
}

/* ---------------------------------------------------------------------------
   Certificate of Analysis uploads (Product Catalog tab)
   --------------------------------------------------------------------------- */
.coa-help{border-left:3px solid #d4af37}
.coa-store-state{display:block;margin-top:8px;font-size:.8rem;font-weight:600}
.coa-store-state.is-ok{color:#1c7c4a}
.coa-store-state.is-warn{color:#a3341f}
.coa-cell{min-width:210px}
.coa-cell-inner{display:grid;gap:6px;justify-items:start}
.coa-cell-empty{font-size:.76rem;color:#7a7368;line-height:1.5}
.coa-badge{
  display:inline-block;padding:3px 9px;border-radius:999px;
  font-size:.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  background:#eceae4;color:#6d6659;border:1px solid #d8d4cb;
}
.coa-badge.is-live{background:#e6f4ec;color:#14663c;border-color:#b9dfc9}
.coa-cell-link{
  font-size:.78rem;font-weight:600;color:#8a6a12;word-break:break-all;line-height:1.4;
}
.coa-cell-meta{font-size:.7rem;color:#7a7368}
.coa-cell-buttons{display:flex;flex-wrap:wrap;gap:6px}
.coa-upload-button{
  position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;
  min-height:34px;padding:0 12px;border:1px solid #c8a63a;border-radius:4px;
  background:linear-gradient(180deg,#f4d778,#d9b342);
  color:#241d0c;font-size:.74rem;font-weight:800;letter-spacing:.05em;
  text-transform:uppercase;cursor:pointer;
}
.coa-upload-button:hover{filter:brightness(1.06)}
.coa-upload-button input{
  position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;
}
.coa-remove-button{
  min-height:34px;padding:0 12px;border:1px solid #cbb9b4;border-radius:4px;
  background:#fff;color:#8c2f1c;font-size:.74rem;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;cursor:pointer;
}
.coa-remove-button:hover{background:#fbeeeb;border-color:#b1493a}
.coa-cell-status{font-size:.72rem;line-height:1.5;color:#5c564c}
.coa-cell-status.is-ok{color:#1c7c4a;font-weight:700}
.coa-cell-status.is-warn{color:#a3341f;font-weight:700}

@media (max-width:760px){
  .coa-cell{min-width:170px}
  .coa-upload-button,.coa-remove-button{min-height:42px;width:100%}
  .coa-cell-buttons{width:100%}
}

/* The upload column is pinned to the right edge of the scrolling table so the
   owner never has to scroll sideways to find it. */
.editor-table-wrap td.coa-cell,
.editor-table-wrap th.coa-head{
  position:sticky;right:0;z-index:3;
  background:#fffdf7;
  border-left:2px solid #d4af37;
  box-shadow:-8px 0 12px -8px rgba(0,0,0,.25);
}
.editor-table-wrap th.coa-head{z-index:4;background:#241f16;color:#f0e6cf}
[data-theme="dark"] .editor-table-wrap td.coa-cell{background:#171310}

/* Table headers keep a dark background in both themes, so they need an
   explicit light text colour. Without this the light theme inherited the dark
   body colour and every column heading was dark-on-dark. */
.editor-table-wrap th,
.inventory-report-table-wrap th,
table thead th{color:#F2E8CE}

/* ---------------------------------------------------------------------------
   Live vial counts in the catalog editor.
   ------------------------------------------------------------------------- */
.admin-state-note{
  margin:8px 0 4px;
  font-size:.82rem;
  color:#C9B98A;
  line-height:1.5;
}
.admin-state-note.state-warn{color:#F0B4B4}

.stock-head{white-space:nowrap}
.stock-cell{min-width:118px}
.stock-edit{display:flex;flex-direction:column;gap:3px}
.stock-edit input{
  width:100%;
  max-width:96px;
  text-align:center;
  font-weight:700;
  font-size:1rem;
  padding:7px 6px;
}
.stock-edit-tag{
  font-size:.66rem;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#C9B98A;
  white-space:nowrap;
}
.stock-edit-zero input{
  border-color:rgba(190,60,60,.65);
  background:rgba(190,60,60,.12);
  color:#FFD2D2;
}
.stock-edit-zero .stock-edit-tag{color:#F0B4B4}

@media (max-width:760px){
  .stock-cell{min-width:104px}
  .stock-edit input{min-height:42px;font-size:1.05rem}
}

/* Light theme: the dark-theme golds and pinks above are unreadable on a pale
   background, so the count field gets its own high-contrast palette. */
[data-theme="light"] .admin-state-note{color:#5A4A22}
[data-theme="light"] .admin-state-note.state-warn{color:#9A1F1F}
[data-theme="light"] .stock-edit input{color:#1E1A12;background:#FFFDF6}
[data-theme="light"] .stock-edit-tag{color:#6B5A2C}
[data-theme="light"] .stock-edit-zero input{
  border-color:rgba(150,30,30,.7);
  background:#FDECEC;
  color:#7A1010;
}
[data-theme="light"] .stock-edit-zero .stock-edit-tag{color:#9A1F1F;font-weight:700}
