:root {
  --bg:#0b0b12;
  --card:#141427;
  --text:#eef0f7;
  --muted:#a8adc1;
  --accent:#7c4dff;
  --accent-light:#9f86ff;
  --border:#2a2a44;

  /* Drawer positioning vars (JS updates these) */
  --drawerTop: 96px;
  --drawerTop2: 160px;
}

body {
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  background:linear-gradient(180deg,var(--bg) 0%,#0f0f1c 100%);
  color:var(--text);
}

.container { max-width:1000px; margin:24px auto; padding:0 16px; }

/* Header + Tabs (Option A: natural width, no shift) */
.header {
  display:flex;
  align-items:center;
  gap:16px;              /* space between logo and tabs */
  margin-bottom:16px;
}
.tabs {
  display:flex;
  gap:8px;
  flex-wrap:wrap;        /* wrap neatly on narrow screens */
}
a.tab { text-decoration:none; display:inline-block; }
.tab {
  padding:8px 14px;
  border-radius:12px;
  background:#1a1a2e;
  color:var(--muted);
  cursor:pointer;
  border:1px solid var(--border);   /* keep border on all states */
  flex:0 0 auto;                    /* prevent shrinking to keep spacing stable */
  line-height:1;
  transition:transform .08s ease, box-shadow .12s ease, background .12s ease, color .12s ease, border-color .12s ease;
  white-space:nowrap;
}
.tab:hover { color:#d9dcf0; border-color:#3a3a5a; }
.tab:active { transform:translateY(1px); }
.tab.active {
  background:var(--accent);
  color:#fff;
  border:1px solid var(--accent);   /* do NOT remove border to avoid width change */
  box-shadow:0 6px 20px rgba(124,77,255,.4);
}

/* Cards & Controls */
.card {
  background:var(--card);
  border-radius:14px;
  border:1px solid var(--border);
  padding:16px;
  box-shadow:0 8px 24px rgba(0,0,0,.3);
}

textarea,select,input[type=text] {
  width:100%;
  padding:10px;
  border-radius:10px;
  border:1px solid var(--border);
  background:#1a1a2e;
  color:var(--text);
}

button {
  background:var(--accent);
  color:#fff;
  border:none;
  border-radius:10px;
  padding:8px 14px;
  cursor:pointer;
}
button.secondary { background:#24243a; border:1px solid var(--border); }

/* PDF Viewer */
.viewer {
  margin-top:16px;
  height:65vh;
  border-radius:10px;
  border:1px solid var(--border);
  overflow:hidden;
}
.viewer iframe { width:100%; height:100%; border:none; }

.helper { color:var(--muted); font-size:12px; margin-top:6px; }

/* Tender Guide Styling */
.tg-grid { display:grid; gap:12px; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); }
.tg-card { border:1px solid var(--border); border-radius:12px; padding:14px; background:#0b0f14; color:var(--text); }
.tg-section { margin-top:14px; }
.tg-title { margin:0 0 8px 0; font-size:16px; font-weight:700; }
.tg-sub { margin:0 0 6px 0; font-weight:600; opacity:.9; }
.tg-list { margin:0; padding-left:18px; }
.tg-list li { margin:4px 0; }
.tg-helper { font-size:12px; opacity:.8; }
.tg-controls { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:10px; }
.tg-table { width:100%; border-collapse:collapse; border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.tg-table th, .tg-table td { padding:10px; border-bottom:1px solid var(--border); text-align:left; }
.tg-table th { background:#1a1a2e; font-weight:700; }
.tg-pill { display:inline-block; padding:2px 8px; border:1px solid var(--border); border-radius:999px; font-size:12px; }
.tg-muted { opacity:.85; }
.tg-hr { height:1px; background:var(--border); border:none; margin:10px 0; }
.tg-note { font-size:12px; opacity:.8; line-height:1.4; }
.tg-hide { display:none !important; }

/* Keep blue links for Tender/Admin cards (default) */
.tg-card a { color:#9cc5ff; text-decoration:none; }
.tg-card a:hover { text-decoration:underline; }

/* Optional: keyboard focus for accessibility */
.tab:focus-visible {
  outline:2px solid var(--accent-light);
  outline-offset:2px;
  box-shadow:0 0 0 3px rgba(124,77,255,.25), 0 6px 20px rgba(124,77,255,.35);
}

/* =========================================================
   Left-side drawers/toggles (Phonetic + Despacer)
   ========================================================= */

/* Keep tabs clickable above any side overlays */
.header, .tabs { position: relative; z-index: 5; }

.side-toggle{
  position:fixed;
  left:16px;
  z-index:1000;
  padding:10px 14px;
  border-radius:999px;                 /* pill like your tabs */
  background:var(--accent);            /* on-brand */
  color:#fff;
  border:1px solid var(--accent);
  cursor:pointer;
  box-shadow:0 8px 22px rgba(124,77,255,.35); /* soft purple glow */
  font-weight:600;
  letter-spacing:.2px;
  line-height:1;
  transition:transform .08s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease;
}
.side-toggle:hover{
  background:var(--accent-light);
  border-color:var(--accent-light);
  box-shadow:0 10px 28px rgba(124,77,255,.45);
}
.side-toggle:active{ transform:translateY(1px); }
.side-toggle:focus-visible{
  outline:2px solid var(--accent-light);
  outline-offset:2px;
  box-shadow:0 0 0 3px rgba(124,77,255,.25), 0 8px 24px rgba(124,77,255,.35);
}

/* Drawer matches card styling */
.drawer{
  position:fixed;
  left:16px;
  max-height:72vh;
  overflow:auto;
  z-index:1000;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:12px;
  box-shadow:0 10px 28px rgba(0,0,0,.45);
  display:none;
}
.drawer.open{ display:block; }

.drawer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 12px;
  border-bottom:1px solid var(--border);
  background:#141427;
  position:sticky;
  top:0;
}
.drawer-title{ font-weight:700; }
.drawer-close{
  background:#24243a;
  border:1px solid var(--border);
  color:var(--text);
  border-radius:8px;
  padding:2px 8px;
  cursor:pointer;
}

.drawer-body{ padding:10px 12px; }
.tg-table.small th, .tg-table.small td{ padding:8px 9px; font-size:13px; }

/* =========================================================
   Templates Section (smart list + white text + download button)
   ========================================================= */

.tpl-list {
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.tpl-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 12px;
  border:1px solid var(--border);
  border-radius:12px;
  background:#0f1021;
}

.tpl-left{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}

.tpl-title{
  color:var(--text);
  font-weight:700;
  font-size:14px;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.tpl-sub{
  color:var(--muted);
  font-size:12px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Make template links inherit white + remove blue */
.tpl-item a.tpl-link{
  color:inherit;
  text-decoration:none;
  display:block;
  min-width:0;
}
.tpl-item a.tpl-link:hover .tpl-title{
  text-decoration:underline;
}

/* Download button on right */
.tpl-btn{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid var(--accent);
  background:var(--accent);
  color:#fff;
  font-weight:700;
  font-size:13px;
  cursor:pointer;
  text-decoration:none;
  box-shadow:0 8px 18px rgba(124,77,255,.25);
}
.tpl-btn:hover{ background:var(--accent-light); border-color:var(--accent-light); }
.tpl-btn:active{ transform:translateY(1px); }

.tpl-ic{ width:16px; height:16px; display:inline-block; opacity:.95; }

/* IMPORTANT: force Templates section anchors to be white (override tg-card a blue rule) */
#tool-Templates .tpl-item a{
  color:var(--text) !important;
  text-decoration:none;
}

/* Mobile */
@media (max-width: 520px){
  .tpl-item{ flex-direction:column; align-items:stretch; }
  .tpl-btn{ justify-content:center; width:100%; }
  .tpl-title,.tpl-sub{ white-space:normal; }
}

/* =========================================================
   Supplier Master Spreadsheet
   ========================================================= */
.sm-intro{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:14px;}
.sm-intro h3{margin:0 0 4px;}
.sm-actions{display:flex;gap:8px;flex-wrap:wrap;}
.sm-download{display:inline-flex;align-items:center;justify-content:center;padding:9px 12px;border-radius:10px;background:#24243a;border:1px solid var(--border);color:#fff;text-decoration:none;font-size:13px;font-weight:700;}
.sm-download:hover{border-color:var(--accent-light);}
.sm-toolbar{display:grid;grid-template-columns:auto minmax(220px,1fr) minmax(190px,.65fr) auto;gap:10px;align-items:center;padding:12px;background:#0f1021;border:1px solid var(--border);border-radius:12px;}
.sm-fuels{display:flex;gap:6px;}
.sm-fuel{background:#24243a;border:1px solid var(--border);}
.sm-fuel.active{background:var(--accent);border-color:var(--accent);box-shadow:0 4px 14px rgba(124,77,255,.3);}
.sm-toolbar input,.sm-toolbar select{box-sizing:border-box;margin:0;}
.sm-meta{display:flex;justify-content:space-between;align-items:center;margin:12px 0 8px;color:var(--muted);font-size:12px;}
.sm-layout{display:grid;grid-template-columns:290px minmax(0,1fr);gap:12px;align-items:start;}
.sm-supplier-list{display:flex;flex-direction:column;gap:8px;max-height:72vh;overflow:auto;padding-right:2px;position:sticky;top:10px;}
.sm-supplier-card{display:flex;flex-direction:column;gap:5px;text-align:left;background:#0f1021;border:1px solid var(--border);padding:12px;border-radius:12px;color:var(--text);}
.sm-supplier-card:hover{border-color:#4b4b71;background:#15162c;}
.sm-supplier-card.active{border-color:var(--accent);box-shadow:0 0 0 1px rgba(124,77,255,.25),0 6px 18px rgba(0,0,0,.2);}
.sm-supplier-name{font-size:14px;font-weight:800;color:#fff;}
.sm-mini{font-size:11px;color:var(--muted);line-height:1.35;white-space:normal;}
.sm-detail{min-width:0;border:1px solid var(--border);border-radius:12px;background:#0f1021;padding:14px;}
.sm-detail-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;border-bottom:1px solid var(--border);padding-bottom:12px;margin-bottom:12px;}
.sm-detail-head h3{margin:2px 0 0;font-size:21px;}
.sm-eyebrow{text-transform:uppercase;letter-spacing:.08em;color:var(--accent-light);font-size:10px;font-weight:800;}
.sm-row-ref{font-size:11px;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:5px 8px;white-space:nowrap;}
.sm-detail-section{margin-top:14px;}
.sm-detail-section h4{margin:0 0 8px;font-size:13px;color:#fff;}
.sm-kv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
.sm-kv{border:1px solid #272740;background:#141427;border-radius:9px;padding:9px;min-width:0;}
.sm-key{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:4px;line-height:1.3;}
.sm-value{font-size:13px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere;}
.sm-empty{border:1px dashed var(--border);border-radius:12px;padding:18px;color:var(--muted);text-align:center;}
.sm-raw{margin-top:18px;border-top:1px solid var(--border);padding-top:12px;}
.sm-raw summary{cursor:pointer;color:#cfc8ff;font-weight:700;font-size:12px;}
.sm-raw-table-wrap{overflow:auto;max-height:55vh;margin-top:10px;border:1px solid var(--border);border-radius:10px;}
.sm-raw-table{width:100%;border-collapse:collapse;font-size:12px;}
.sm-raw-table th,.sm-raw-table td{padding:8px 9px;border-bottom:1px solid var(--border);vertical-align:top;text-align:left;}
.sm-raw-table th{background:#1a1a2e;position:sticky;top:0;z-index:1;}
.sm-raw-table td:first-child{width:44%;color:var(--muted);}
.sm-raw-table td:last-child{white-space:pre-wrap;overflow-wrap:anywhere;}
.sm-blank{opacity:.45;font-style:italic;}
@media(max-width:850px){.sm-toolbar{grid-template-columns:1fr 1fr}.sm-fuels{grid-column:1/-1}.sm-layout{grid-template-columns:1fr}.sm-supplier-list{position:static;max-height:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}.sm-kv-grid{grid-template-columns:1fr}}
@media(max-width:560px){.sm-intro{flex-direction:column}.sm-toolbar{grid-template-columns:1fr}.sm-fuels{grid-column:auto}.sm-kv-grid{grid-template-columns:1fr}}

/* =========================================================
   IPG TOOLS — LIGHT UI TEST REVAMP (September 2026)
   Visual-only overhaul. Existing tool IDs, JS and functionality retained.
   ========================================================= */
:root{
  --bg:#f6f7fb;
  --card:#ffffff;
  --text:#101126;
  --muted:#666b83;
  --accent:#7a24f6;
  --accent-light:#9b52ff;
  --border:#dde1eb;
  --soft-purple:#f5efff;
  --soft-panel:#f8f9fc;
  --navy:#171832;
}

*{box-sizing:border-box;}
html{background:var(--bg);}
body{
  background:linear-gradient(180deg,#ffffff 0,#f7f8fc 155px,#f6f7fb 100%) !important;
  color:var(--text) !important;
  min-height:100vh;
}
.container{max-width:1480px !important;margin:0 auto 40px !important;padding:0 28px !important;}

/* Top navigation */
.header{
  min-height:72px;
  margin:0 -28px 24px !important;
  padding:0 28px;
  display:flex;
  align-items:center;
  gap:32px !important;
  background:rgba(255,255,255,.97);
  border-bottom:1px solid #e6e8ef;
  box-shadow:0 2px 10px rgba(25,27,58,.035);
  position:sticky !important;
  top:0;
  z-index:900 !important;
}
.header img{height:46px !important;width:auto;display:block;}
.tabs{
  display:flex !important;
  flex:1;
  align-items:stretch;
  gap:4px !important;
  flex-wrap:wrap !important;
}
a.tab,.tab{
  position:relative;
  display:inline-flex !important;
  align-items:center;
  min-height:70px;
  padding:0 13px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:#363a55 !important;
  font-size:13px;
  font-weight:650;
  line-height:1.15 !important;
  box-shadow:none !important;
  text-decoration:none !important;
}
.tab:hover{color:var(--accent) !important;background:#fbf9ff !important;}
.tab.active{color:var(--accent) !important;background:transparent !important;}
.tab.active::after{
  content:"";
  position:absolute;
  height:3px;
  left:12px;
  right:12px;
  bottom:0;
  border-radius:4px 4px 0 0;
  background:var(--accent);
}

/* Main landing intro */
.tools-hero{
  margin:8px 0 22px;
  padding:8px 2px 4px;
}
.tools-eyebrow{
  color:var(--accent);
  font-size:12px;
  letter-spacing:.14em;
  font-weight:850;
}
.tools-hero h1{margin:6px 0 5px;font-size:34px;letter-spacing:-.03em;color:#101126;}
.tools-hero p{margin:0;color:var(--muted);font-size:15px;}

/* Universal cards / panels */
.card,.tg-card,.sm-detail,.sm-toolbar,.sm-supplier-card,.tpl-item{
  background:#fff !important;
  color:var(--text) !important;
  border-color:var(--border) !important;
  box-shadow:0 8px 28px rgba(29,31,67,.055) !important;
}
.card{border-radius:16px !important;padding:22px !important;}
.card h2,.card h3,.card h4,.tg-title,.tg-sub,.sm-supplier-name,.sm-detail-head h3{color:var(--text) !important;}
.helper,.tg-note,.tg-muted,.tg-helper,.sm-mini,.tpl-sub{color:var(--muted) !important;opacity:1 !important;}
.tg-hr{background:var(--border) !important;}

/* Inputs and controls */
textarea,select,input[type=text],input[type=search],.mini-field{
  background:#fff !important;
  color:var(--text) !important;
  border:1px solid #d7dbe6 !important;
  box-shadow:0 1px 2px rgba(25,27,58,.03);
}
textarea:focus,select:focus,input[type=text]:focus,input[type=search]:focus,.mini-field:focus{
  border-color:var(--accent) !important;
  outline:3px solid rgba(122,36,246,.10) !important;
}
button,.mini-btn,.tpl-btn{
  background:linear-gradient(135deg,#842ef7,#6427c8) !important;
  border:1px solid transparent !important;
  color:#fff !important;
  box-shadow:0 5px 15px rgba(122,36,246,.18) !important;
  font-weight:750;
}
button:hover,.mini-btn:hover,.tpl-btn:hover{filter:brightness(1.04);transform:translateY(-1px);}
button.secondary,.mini-btn.secondary,.sm-download,.mini-copy,.drawer-close{
  background:#fff !important;
  color:#343750 !important;
  border:1px solid var(--border) !important;
  box-shadow:none !important;
}

/* Tables */
.tg-table{background:#fff !important;border-color:var(--border) !important;}
.tg-table th{background:#f4f1fb !important;color:#272943 !important;border-color:var(--border) !important;}
.tg-table td{background:#fff !important;color:#33364f !important;border-color:#eceef3 !important;}
.tg-pill{background:#f5efff;color:#6522c7;border-color:#e3d3fb !important;}

/* Links */
.tg-card a{color:#6522c7 !important;font-weight:650;}

/* PDF viewer */
.viewer{background:#fff;border-color:var(--border) !important;box-shadow:0 8px 28px rgba(29,31,67,.055);}

/* Templates */
.tpl-item{background:#fff !important;box-shadow:none !important;padding:14px 16px !important;}
.tpl-title{color:var(--text) !important;}

/* Supplier Master */
.sm-toolbar{background:#fbfbfd !important;box-shadow:none !important;}
.sm-supplier-card{box-shadow:none !important;background:#fff !important;}
.sm-supplier-card:hover{background:#faf7ff !important;border-color:#c9a8fa !important;}
.sm-supplier-card.active{background:var(--soft-purple) !important;border-color:var(--accent) !important;box-shadow:0 0 0 1px rgba(122,36,246,.08) !important;}
.sm-supplier-name{color:#16172e !important;}
.sm-detail{background:#fff !important;}
.sm-eyebrow{color:var(--accent) !important;}
.sm-fuel{background:#fff !important;color:#484b64 !important;border:1px solid var(--border) !important;box-shadow:none !important;}
.sm-fuel.active{background:var(--accent) !important;color:#fff !important;border-color:var(--accent) !important;}

/* Side utilities */
.side-toggle{
  left:18px !important;
  border-radius:10px !important;
  background:#fff !important;
  color:#5e24b5 !important;
  border:1px solid #ddcef7 !important;
  box-shadow:0 7px 18px rgba(29,31,67,.10) !important;
}
.side-toggle:hover{background:#f7f1ff !important;border-color:#c69df7 !important;}
.drawer{
  background:#fff !important;
  border-color:var(--border) !important;
  box-shadow:0 18px 45px rgba(29,31,67,.16) !important;
  color:var(--text) !important;
}
.drawer-head{background:#f8f6fc !important;border-color:var(--border) !important;}
.drawer-title{color:var(--text) !important;}

/* Admin / generic hardcoded dark blocks */
#tool-Admin [style*="background:#0b0f14"],
#tool-Admin [style*="background:#0f1021"],
#tool-Admin [style*="background:#141427"],
[id^="tool-"] [style*="background:#0b0f14"],
[id^="tool-"] [style*="background:#0f1021"]{
  background:#fff !important;
  color:var(--text) !important;
  border-color:var(--border) !important;
}

@media(max-width:1200px){
  .header{align-items:flex-start;padding-top:12px;padding-bottom:8px;}
  .tabs{padding-top:2px;}
  a.tab,.tab{min-height:42px;padding:0 10px !important;border-radius:8px !important;}
  .tab.active{background:#f5efff !important;}
  .tab.active::after{display:none;}
}
@media(max-width:720px){
  .container{padding:0 14px !important;}
  .header{margin:0 -14px 18px !important;padding:10px 14px !important;gap:14px !important;position:relative !important;}
  .header img{height:38px !important;}
  .tabs{width:100%;}
  .tools-hero h1{font-size:28px;}
}


/* =========================================================
   SUPPLIER GUIDE HUB + EMBEDDED SCRIPTING TEST UPDATE
   ========================================================= */
.supplier-guide-nav{
  margin:0 0 18px;
  padding:20px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:0 8px 28px rgba(29,31,67,.055);
}
.supplier-guide-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:14px;}
.supplier-guide-head h2{margin:4px 0 0;font-size:24px;color:var(--text);letter-spacing:-.02em;}
.supplier-guide-head p{margin:0;max-width:560px;color:var(--muted);font-size:13px;line-height:1.45;text-align:right;}
.supplier-guide-eyebrow{font-size:10px;font-weight:850;letter-spacing:.14em;color:var(--accent);}
.supplier-guide-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
.supplier-guide-card{
  min-height:102px !important;
  display:flex !important;
  align-items:center;
  gap:14px;
  text-align:left;
  padding:15px 16px !important;
  background:#fff !important;
  color:var(--text) !important;
  border:1px solid var(--border) !important;
  border-radius:14px !important;
  box-shadow:none !important;
}
.supplier-guide-card:hover{background:#fbf8ff !important;border-color:#c9a8fa !important;transform:none !important;}
.supplier-guide-card.active{background:linear-gradient(135deg,#fbf7ff,#f4ecff) !important;border-color:#8a33f4 !important;box-shadow:0 6px 18px rgba(122,36,246,.08) !important;}
.supplier-guide-icon{flex:0 0 40px;height:40px;border-radius:11px;display:grid;place-items:center;background:#f1e7ff;color:#6d24d7;font-size:11px;font-weight:900;letter-spacing:.03em;}
.supplier-guide-card strong{display:block;font-size:14px;color:#171832;margin-bottom:4px;}
.supplier-guide-card small{display:block;color:#6e7289;font-size:11px;font-weight:550;line-height:1.35;}

/* Embedded Scripting: visually part of the existing IPG Tools page. */
.scripting-tool{padding:0 0 12px;scroll-margin-top:92px;}
#tool-Scripting .scripting-title{background:transparent !important;border:0 !important;box-shadow:none !important;padding:8px 2px 12px !important;margin:0 0 14px !important;}
#tool-Scripting .scripting-title .eyebrow{color:var(--accent) !important;font-size:12px;font-weight:850;letter-spacing:.12em;text-transform:uppercase;}
#tool-Scripting .scripting-title h1{margin:6px 0 8px;color:#101126 !important;font-size:40px !important;line-height:1.12;letter-spacing:-.035em;}
#tool-Scripting .scripting-title p{margin:0;color:#626780 !important;font-size:16px;line-height:1.55;max-width:1050px;}
#tool-Scripting .script-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:16px;}
#tool-Scripting .navbtn{min-height:112px !important;padding:18px !important;background:#fff !important;color:#171832 !important;border:1px solid #dde1eb !important;border-radius:14px !important;box-shadow:0 6px 22px rgba(29,31,67,.045) !important;text-align:left;cursor:pointer;font-weight:750;}
#tool-Scripting .navbtn span{display:block;color:#6c7087 !important;font-size:12px !important;font-weight:550;margin-top:7px !important;line-height:1.35;}
#tool-Scripting .navbtn:hover{background:#faf7ff !important;border-color:#cdaafb !important;transform:none !important;}
#tool-Scripting .navbtn.active{background:linear-gradient(135deg,#faf6ff,#f2e9ff) !important;color:#5f20bd !important;border-color:#8a33f4 !important;box-shadow:0 7px 22px rgba(122,36,246,.10) !important;}
#tool-Scripting .script-section{display:none;}
#tool-Scripting .script-section.active{display:block;}
#tool-Scripting .section-head{margin:18px 0 12px;}
#tool-Scripting .section-head h2{font-size:24px;margin:0;color:#15162d;}
#tool-Scripting .section-head p{color:#666b83;line-height:1.55;margin:6px 0 0;}
#tool-Scripting .intro-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:16px;margin-bottom:14px;line-height:1.6;box-shadow:0 7px 24px rgba(29,31,67,.05);}
#tool-Scripting .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
#tool-Scripting details.card{padding:0 !important;overflow:hidden;}
#tool-Scripting details.card summary{cursor:pointer;list-style:none;padding:15px 16px;font-weight:750;display:flex;justify-content:space-between;gap:10px;color:#272a43;}
#tool-Scripting details.card summary::-webkit-details-marker{display:none;}
#tool-Scripting details.card summary::after{content:'Open';color:var(--accent);font-size:11px;text-transform:uppercase;letter-spacing:.08em;}
#tool-Scripting details.card[open] summary{border-bottom:1px solid var(--border);}
#tool-Scripting details.card[open] summary::after{content:'Close';}
#tool-Scripting .card-body{padding:15px 16px;color:#272a43;line-height:1.6;}
#tool-Scripting .reaction{margin-top:10px;padding:11px 12px;border-radius:10px;background:#faf8fd;border:1px solid #e7e0ef;color:#343750;}
#tool-Scripting .reaction b{color:var(--accent);display:block;margin-bottom:5px;}
#tool-Scripting .reaction ul{margin:4px 0 0;padding-left:19px;}
#tool-Scripting .reaction li{margin:4px 0;}
#tool-Scripting .pitch-card{border:1px solid var(--border);background:#fff;border-radius:14px;padding:16px;box-shadow:0 7px 24px rgba(29,31,67,.05);}
#tool-Scripting .pitch-card h3{margin:0 0 9px;font-size:17px;color:#171832;}
#tool-Scripting .pitch-card p{margin:0;color:#272a43;line-height:1.6;}
#tool-Scripting .hint{margin-top:9px;color:var(--accent);font-weight:700;font-size:12px;}
#tool-Scripting .script-panel{border:1px solid var(--border);background:#fff;border-radius:14px;padding:18px;box-shadow:0 7px 24px rgba(29,31,67,.05);}
#tool-Scripting .script-panel h3{font-size:21px;margin:0 0 4px;color:#171832;}
#tool-Scripting .script-meta{color:#73778d;font-size:12px;margin-bottom:14px;}
#tool-Scripting .script-line{font-size:15px;line-height:1.65;padding:11px 13px;border-left:3px solid var(--accent);background:#f9f9fc;color:#22253d;border-radius:0 10px 10px 0;margin:9px 0;}
#tool-Scripting .script-line.question{border-left-color:#24a66a;}
#tool-Scripting .question-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
#tool-Scripting .question-item{border:1px solid var(--border);background:#fff;border-radius:12px;padding:13px 14px;line-height:1.45;font-weight:650;color:#242740;box-shadow:0 7px 24px rgba(29,31,67,.05);}
#tool-Scripting .note{color:#777b8f;font-size:12px;line-height:1.55;margin-top:14px;}

/* Make every Supplier Master detail field use the new light skin. */
#tool-SupplierMaster .sm-kv,
#tool-SupplierMaster .sm-raw-table th,
#tool-SupplierMaster .sm-raw-table td,
#tool-SupplierMaster .sm-detail-section,
#tool-SupplierMaster .sm-empty{
  background:#fff !important;
  color:#252840 !important;
  border-color:#e2e5ed !important;
}
#tool-SupplierMaster .sm-kv{background:#f9f9fc !important;}
#tool-SupplierMaster .sm-key{color:#74788e !important;}
#tool-SupplierMaster .sm-value{color:#20233b !important;}
#tool-SupplierMaster .sm-detail-section h4{color:#171832 !important;}
#tool-SupplierMaster .sm-raw summary{color:#6427c8 !important;}
#tool-SupplierMaster .sm-raw-table th{background:#f3f1f8 !important;color:#252840 !important;}

@media(max-width:1050px){
  .supplier-guide-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  #tool-Scripting .script-nav{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:650px){
  .supplier-guide-head{align-items:flex-start;flex-direction:column;}
  .supplier-guide-head p{text-align:left;}
  .supplier-guide-grid{grid-template-columns:1fr;}
  #tool-Scripting .script-nav,#tool-Scripting .grid,#tool-Scripting .question-list{grid-template-columns:1fr;}
  #tool-Scripting .scripting-title h1{font-size:30px !important;}
}

/* IPG UI cleanup: remove decorative eyebrow labels throughout the app */
.tools-eyebrow,
.supplier-guide-eyebrow,
.hub-eyebrow,
.sm-eyebrow,
.scripting-title .eyebrow,
.eyebrow {
  display:none !important;
}