/* COSTIX_LAST_UPDATE offer_channel_cards_restore_20260531 */
/* COSTIX_LAST_UPDATE add_offer_recipe_modal_wide_no_horizontal_scroll_20260531 */
/* COSTIX_LAST_UPDATE offers_search_title_fix_20260531 */
/* COSTIX_LAST_UPDATE offers_view_switch_builder_selected_card_fix_20260531 */
/* ═══════════════════════════════════════════════════════════════
   COST PRO v4 — Premium Restaurant OS Stylesheet
   Aesthetic: Clean White Premium — Modern SaaS with Semantic Colors
   Font Pairing: Plus Jakarta Sans (Display) + Cairo (Arabic) + IBM Plex Mono
═══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;900&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

/* ── CSS VARIABLES ─────────────────────────────────────────── */
:root {
  /* ── Base Backgrounds ── */
  --bg:      #F0F2F5;
  --bg1:     #FFFFFF;
  --bg2:     #FFFFFF;
  --bg3:     #F7F8FA;
  --bg4:     #EEF0F4;
  --bg5:     #E4E7ED;
  --bg6:     #D8DCE6;

  /* ── Semantic: Dashboard → Blue ── */
  --blue:    #2563EB;
  --blue2:   #3B82F6;
  --blue3:   #60A5FA;
  --blueg:   linear-gradient(135deg, #2563EB 0%, #60A5FA 100%);
  --blueb:   rgba(37,99,235,.08);
  --blueb2:  rgba(37,99,235,.12);

  /* ── Semantic: POS → Green ── */
  --green:   #059669;
  --green2:  #10B981;
  --green3:  #34D399;
  --greeng:  linear-gradient(135deg, #059669 0%, #34D399 100%);
  --greenb:  rgba(5,150,105,.08);
  --greenb2: rgba(5,150,105,.12);

  /* ── Semantic: Inventory → Orange ── */
  --amber:   #D97706;
  --amber2:  #F59E0B;
  --amber3:  #FCD34D;
  --ambeg:   linear-gradient(135deg, #D97706 0%, #FCD34D 100%);
  --amberb:  rgba(217,119,6,.08);
  --amberb2: rgba(217,119,6,.12);

  /* ── Semantic: Production → Purple ── */
  --purple:  #7C3AED;
  --purple2: #8B5CF6;
  --purple3: #A78BFA;
  --purpleg: linear-gradient(135deg, #7C3AED 0%, #A78BFA 100%);
  --purpleb: rgba(124,58,237,.08);
  --purpleb2:rgba(124,58,237,.12);

  /* ── Semantic: Expenses → Red ── */
  --red:     #DC2626;
  --red2:    #EF4444;
  --red3:    #F87171;
  --redg:    linear-gradient(135deg, #DC2626 0%, #F87171 100%);
  --redb:    rgba(220,38,38,.08);
  --redb2:   rgba(220,38,38,.12);

  /* ── Semantic: Reports → Teal ── */
  --teal:    #0D9488;
  --teal2:   #14B8A6;
  --teal3:   #2DD4BF;
  --tealg:   linear-gradient(135deg, #0D9488 0%, #2DD4BF 100%);
  --tealb:   rgba(13,148,136,.08);
  --tealb2:  rgba(13,148,136,.12);

  /* ── Semantic: Settings → Gray ── */
  --gray:    #6B7280;
  --gray2:   #9CA3AF;
  --gray3:   #D1D5DB;
  --grayg:   linear-gradient(135deg, #6B7280 0%, #D1D5DB 100%);
  --grayb:   rgba(107,114,128,.08);

  /* ── Gold (legacy accent) ── */
  --gold:    #B8922A;
  --gold2:   #CCA840;
  --gold3:   #E0C060;
  --gold4:   #F0D880;
  --goldg:   linear-gradient(135deg, #B8922A 0%, #E0C060 60%, #CCA840 100%);
  --goldb:   rgba(184,146,42,.10);
  --goldb2:  rgba(184,146,42,.06);

  /* ── Text ── */
  --text:    #111827;
  --text2:   #4B5563;
  --text3:   #9CA3AF;
  --text4:   #D1D5DB;

  /* ── Borders ── */
  --bdr:     #F3F4F6;
  --bdr2:    #E5E7EB;
  --bdr3:    #D1D5DB;
  --bdr4:    #9CA3AF;

  /* ── Radius ── */
  --r:       16px;
  --r2:      10px;
  --r3:      7px;
  --r4:      4px;

  /* ── Shadows ── */
  --shadow:  0 1px 3px rgba(0,0,0,.06), 0 4px 16px rgba(0,0,0,.06);
  --shadow2: 0 4px 24px rgba(0,0,0,.10), 0 1px 4px rgba(0,0,0,.06);
  --shadow3: 0 8px 40px rgba(0,0,0,.14);
  --shadowup:0 -2px 12px rgba(0,0,0,.06);

  /* ── Fonts ── */
  --f:       'Cairo', sans-serif;
  --fd:      'Plus Jakarta Sans', sans-serif;
  --fm:      'IBM Plex Mono', monospace;
}

/* ── RESET & BASE ──────────────────────────────────────────── */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { 
  font-size:14px; 
  -webkit-text-size-adjust: 100%;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}
body {
  font-family: var(--f);
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  position: relative;
}
::selection { background: rgba(37,99,235,.15); color: var(--blue); }
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--bdr3); border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: var(--bdr4); }

/* ── SIDEBAR ───────────────────────────────────────────────── */
#sidebar {
  position: fixed; top: 0; right: 0; bottom: 0; width: 240px;
  background: var(--bg1);
  border-left: 1px solid var(--bdr2);
  display: flex; flex-direction: column;
  z-index: 100;
  transition: transform .3s cubic-bezier(.4,0,.2,1);
  box-shadow: -4px 0 24px rgba(0,0,0,.05);
}

.sb-brand {
  padding: 20px 18px 16px;
  border-bottom: 1px solid var(--bdr2);
  display: flex; align-items: center; gap: 12px;
}
.sb-logo {
  width: 40px; height: 40px; border-radius: 12px;
  background: var(--goldg);
  display: flex; align-items: center; justify-content: center;
  font-size: 19px; color: #fff; font-weight: 900;
  flex-shrink: 0;
  box-shadow: 0 4px 14px rgba(184,146,42,.35);
}
.sb-title {
  font-family: var(--fd);
  font-size: 15px; font-weight: 800;
  background: var(--goldg);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  letter-spacing: -.3px;
}
.sb-ver {
  font-size: 10px; color: var(--text3);
  font-family: var(--fm); margin-top: 1px;
}

.sb-scroll { flex: 1; overflow-y: auto; padding: 10px 10px; }
.sb-section {
  padding: 12px 10px 5px;
  font-size: 9px; font-weight: 700; color: var(--text3);
  text-transform: uppercase; letter-spacing: 1.2px;
  margin-top: 4px;
}
.sb-item {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px;
  font-size: 13px; font-weight: 600; color: var(--text2);
  cursor: pointer; transition: all .18s;
  border-radius: 10px; margin-bottom: 2px;
  position: relative; user-select: none;
  border: 1px solid transparent;
}
.sb-item:hover {
  color: var(--text);
  background: var(--bg3);
}
.sb-item.on {
  color: var(--blue);
  background: var(--blueb);
  border-color: rgba(37,99,235,.12);
  font-weight: 700;
}

/* Section-specific active colors */
.sb-item.on[data-section="pos"]        { color: var(--green);  background: var(--greenb);  border-color: rgba(5,150,105,.12); }
.sb-item.on[data-section="inventory"]  { color: var(--amber);  background: var(--amberb);  border-color: rgba(217,119,6,.12); }
.sb-item.on[data-section="production"] { color: var(--purple); background: var(--purpleb); border-color: rgba(124,58,237,.12); }
.sb-item.on[data-section="expenses"]   { color: var(--red);    background: var(--redb);    border-color: rgba(220,38,38,.12); }
.sb-item.on[data-section="reports"]    { color: var(--teal);   background: var(--tealb);   border-color: rgba(13,148,136,.12); }
.sb-item.on[data-section="settings"]   { color: var(--gray);   background: var(--grayb);   border-color: rgba(107,114,128,.12); }

.sb-item .si { font-size: 15px; flex-shrink: 0; opacity: .85; }
.sb-badge {
  position: absolute; left: 10px; top: 50%; transform: translateY(-50%);
  background: var(--red2); color: #fff;
  font-size: 9px; font-weight: 700; padding: 1px 5px;
  border-radius: 99px; font-family: var(--fm);
}

.sb-footer {
  padding: 14px 16px;
  border-top: 1px solid var(--bdr2);
  font-size: 10px; color: var(--text3);
  font-family: var(--fm);
}

/* ── MAIN CONTENT ──────────────────────────────────────────── */
#main { 
  margin-right: 240px; 
  min-height: 100vh; 
  display: flex; 
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
}

/* ── TOPBAR ────────────────────────────────────────────────── */
#topbar {
  position: sticky; top: 0; z-index: 90;
  background: rgba(255,255,255,.96);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--bdr2);
  padding: 0 24px; height: 56px;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  box-shadow: 0 1px 4px rgba(0,0,0,.04);
}
.tb-title {
  font-family: var(--fd);
  font-size: 15px; font-weight: 700; color: var(--text);
}
.tb-right { display: flex; align-items: center; gap: 8px; }

/* ── BUTTON SYSTEM ─────────────────────────────────────────── */
.btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 16px; border-radius: var(--r2);
  font-size: 12px; font-weight: 700;
  cursor: pointer; border: 1px solid transparent;
  transition: all .18s; font-family: var(--f);
  white-space: nowrap; text-decoration: none;
}
.btn:active { transform: scale(.97); }

/* Primary — Gradient Gold */
.btn-gold {
  background: var(--goldg); color: #fff; border-color: transparent;
  box-shadow: 0 2px 10px rgba(184,146,42,.3);
}
.btn-gold:hover { box-shadow: 0 4px 18px rgba(184,146,42,.4); filter: brightness(1.05); }

/* Primary — Blue (Dashboard) */
.btn-blue {
  background: var(--blueg); color: #fff; border-color: transparent;
  box-shadow: 0 2px 10px rgba(37,99,235,.25);
}
.btn-blue:hover { box-shadow: 0 4px 18px rgba(37,99,235,.35); filter: brightness(1.05); }

/* Ghost */
.btn-ghost {
  background: transparent; border-color: var(--bdr2); color: var(--text2);
}
.btn-ghost:hover { border-color: var(--bdr3); background: var(--bg3); color: var(--text); }

/* Soft semantic buttons */
.btn-teal   { background: var(--tealb);   border-color: rgba(13,148,136,.18); color: var(--teal);   }
.btn-teal:hover   { background: var(--tealb2); }
.btn-green  { background: var(--greenb);  border-color: rgba(5,150,105,.18);  color: var(--green);  }
.btn-green:hover  { background: var(--greenb2); }
.btn-purple { background: var(--purpleb); border-color: rgba(124,58,237,.18); color: var(--purple); }
.btn-purple:hover { background: var(--purpleb2); }
.btn-amber  { background: var(--amberb);  border-color: rgba(217,119,6,.18);  color: var(--amber);  }
.btn-amber:hover  { background: var(--amberb2); }
.btn-red    { background: transparent; border-color: transparent; color: var(--text3); }
.btn-red:hover    { color: var(--red2); background: var(--redb); }

.btn-xl { padding: 11px 26px; font-size: 14px; border-radius: var(--r); }
.btn-sm { padding: 5px 11px; font-size: 11px; border-radius: 8px; }

/* ── PAGE AREA ─────────────────────────────────────────────── */
.page-area { 
  flex: 1; 
  padding: 24px 26px;
  overflow-y: auto;
  overflow-x: hidden;
}
.page { display: none; }
.page.on { display: block; animation: pgIn .28s ease; }
@keyframes pgIn {
  from { opacity:0; transform:translateY(10px); }
  to   { opacity:1; transform:translateY(0); }
}

/* ── PAGE HEADER ───────────────────────────────────────────── */
.ph {
  margin-bottom: 22px;
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
}
.ph-title {
  font-family: var(--fd);
  font-size: 22px; font-weight: 800; letter-spacing: -.4px; color: var(--text);
}
.ph-title em { color: var(--blue); font-style: normal; }
.ph-sub { font-size: 11px; color: var(--text3); margin-top: 3px; }
.ph-right { display: flex; gap: 8px; flex-wrap: wrap; }

/* ── KPI CARDS ─────────────────────────────────────────────── */
.kpi-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(175px,1fr));
  gap: 14px; margin-bottom: 20px;
}

.kpi {
  background: var(--bg1);
  border: 1px solid var(--bdr2);
  border-radius: var(--r);
  padding: 18px 20px;
  position: relative; overflow: hidden;
  transition: all .22s;
  box-shadow: var(--shadow);
}
.kpi:hover { transform: translateY(-2px); box-shadow: var(--shadow2); border-color: var(--bdr3); }

/* Left colored border indicator */
.kpi::after {
  content: ''; position: absolute; top: 14px; bottom: 14px; right: 0; width: 3px;
  border-radius: 99px;
}
.kpi.cg::after  { background: var(--goldg); }
.kpi.ct::after  { background: var(--tealg); }
.kpi.cr::after  { background: var(--redg); }
.kpi.cgr::after { background: var(--greeng); }
.kpi.cp::after  { background: var(--purpleg); }
.kpi.cb::after  { background: var(--blueg); }
.kpi.ca::after  { background: var(--ambeg); }

/* Top subtle gradient tint */
.kpi.cb  { background: linear-gradient(160deg, #F0F4FF 0%, #FFFFFF 60%); }
.kpi.cgr { background: linear-gradient(160deg, #F0FDF8 0%, #FFFFFF 60%); }
.kpi.ca  { background: linear-gradient(160deg, #FFFBF0 0%, #FFFFFF 60%); }
.kpi.cp  { background: linear-gradient(160deg, #F5F0FF 0%, #FFFFFF 60%); }
.kpi.cr  { background: linear-gradient(160deg, #FFF0F0 0%, #FFFFFF 60%); }
.kpi.ct  { background: linear-gradient(160deg, #F0FAFA 0%, #FFFFFF 60%); }

.kpi-lbl {
  font-size: 10px; font-weight: 700; color: var(--text3);
  text-transform: uppercase; letter-spacing: .8px; margin-bottom: 8px;
}
.kpi-val {
  font-size: 26px; font-weight: 800; font-family: var(--fm);
  letter-spacing: -1px; line-height: 1.1; color: var(--text);
}
.kpi-unit { font-size: 13px; font-weight: 500; color: var(--text2); }
.kpi-note { font-size: 10px; margin-top: 5px; font-family: var(--fm); display: flex; align-items: center; gap: 3px; }
.kpi-note.up { color: var(--green); }
.kpi-note.dn { color: var(--red2); }
.kpi-note.wa { color: var(--amber); }
.kpi-icon {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  font-size: 36px; opacity: .06; pointer-events: none;
}

/* ── PANEL ─────────────────────────────────────────────────── */
.panel {
  background: var(--bg1);
  border: 1px solid var(--bdr2);
  border-radius: var(--r);
  overflow: hidden;
  box-shadow: var(--shadow);
  transition: box-shadow .2s;
}
.panel:hover { box-shadow: var(--shadow2); }

.phead {
  padding: 14px 18px;
  border-bottom: 1px solid var(--bdr2);
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; flex-wrap: wrap;
  background: var(--bg1);
}
.phead-title {
  font-size: 13px; font-weight: 800; display: flex; align-items: center; gap: 7px;
  color: var(--text);
}
.pbody { padding: 18px; }
.pbody-0 { padding: 0; }

/* ── GRID LAYOUTS ──────────────────────────────────────────── */
.g2  { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.g3  { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }
.g14 { display: grid; grid-template-columns: 1fr 370px; gap: 16px; }
.g41 { display: grid; grid-template-columns: 370px 1fr; gap: 16px; }
.mb  { margin-bottom: 16px; }

/* ── TABLE ─────────────────────────────────────────────────── */
.tbl-wrap { overflow-x: auto; }
table.t {
  width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12px;
}
table.t th {
  text-align: right; padding: 10px 14px;
  color: var(--text3); font-size: 10px; letter-spacing: .7px;
  text-transform: uppercase; border-bottom: 1px solid var(--bdr2);
  font-weight: 700; white-space: nowrap; background: var(--bg3);
}
table.t td {
  padding: 11px 14px;
  border-bottom: 1px solid var(--bdr);
  vertical-align: middle;
  background: var(--bg1);
  transition: background .15s;
}
table.t tr:last-child td { border-bottom: none; }
/* Alternating rows */
table.t tbody tr:nth-child(even) td { background: #FAFBFC; }
table.t tr:hover td { background: var(--blueb) !important; }
.td-n { font-weight: 700; color: var(--text); }
.td-m { font-family: var(--fm); font-weight: 600; }

/* ── TAGS & BADGES ─────────────────────────────────────────── */
.tag {
  display: inline-flex; align-items: center; gap: 3px;
  padding: 3px 10px; border-radius: 99px; font-size: 10px; font-weight: 700;
  white-space: nowrap;
}
.tag-g  { background: var(--greenb);  color: var(--green);  border: 1px solid rgba(5,150,105,.15); }
.tag-a  { background: var(--amberb);  color: var(--amber);  border: 1px solid rgba(217,119,6,.15); }
.tag-r  { background: var(--redb);    color: var(--red2);   border: 1px solid rgba(220,38,38,.15); }
.tag-t  { background: var(--tealb);   color: var(--teal);   border: 1px solid rgba(13,148,136,.15); }
.tag-p  { background: var(--purpleb); color: var(--purple); border: 1px solid rgba(124,58,237,.15); }
.tag-gold { background: var(--goldb); color: var(--gold);   border: 1px solid rgba(184,146,42,.15); }
.tag-b  { background: var(--blueb);   color: var(--blue);   border: 1px solid rgba(37,99,235,.15); }

.cbar-bg   { height: 5px; width: 70px; background: var(--bg4); border-radius: 3px; overflow: hidden; display: inline-block; vertical-align: middle; }
.cbar-fill { height: 100%; border-radius: 3px; transition: width .4s; }

/* ── FILTER BAR ────────────────────────────────────────────── */
.fbar {
  background: var(--bg1); border: 1px solid var(--bdr2);
  border-radius: var(--r); padding: 12px 16px;
  margin-bottom: 14px;
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
  box-shadow: var(--shadow);
}
.sw { flex: 1; min-width: 150px; position: relative; }
.sw input {
  width: 100%; background: var(--bg3); border: 1px solid var(--bdr2);
  border-radius: var(--r2); padding: 8px 34px 8px 12px;
  font-size: 13px; color: var(--text); font-family: var(--f);
  outline: none; transition: all .2s;
}
.sw input:focus {
  border-color: var(--blue2);
  background: var(--bg1);
  box-shadow: 0 0 0 3px rgba(37,99,235,.08);
}
.sw input::placeholder { color: var(--text3); }
.si2 { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--text3); font-size: 12px; pointer-events: none; }
select.fs {
  background: var(--bg3); border: 1px solid var(--bdr2);
  border-radius: var(--r2); padding: 8px 12px;
  font-size: 12px; color: var(--text); font-family: var(--f);
  outline: none; cursor: pointer; transition: all .2s;
}
select.fs:focus {
  border-color: var(--blue2);
  box-shadow: 0 0 0 3px rgba(37,99,235,.08);
}

/* ── FORM ELEMENTS ─────────────────────────────────────────── */
.fg { display: flex; flex-direction: column; gap: 5px; }
.fg.full { grid-column: 1/-1; }
.fgrid  { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.fgrid3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; margin-bottom: 14px; }

label.fl {
  font-size: 10px; font-weight: 700; color: var(--text2);
  text-transform: uppercase; letter-spacing: .6px;
}
input.fi, select.fi, textarea.fi {
  background: var(--bg3); border: 1px solid var(--bdr2);
  border-radius: var(--r2); padding: 9px 13px;
  font-size: 13px; color: var(--text); font-family: var(--f);
  outline: none; transition: all .2s; width: 100%;
}
input.fi:focus, select.fi:focus, textarea.fi:focus {
  border-color: var(--blue2);
  background: var(--bg1);
  box-shadow: 0 0 0 3px rgba(37,99,235,.08);
}
input.fi::placeholder, textarea.fi::placeholder { color: var(--text3); }
textarea.fi { resize: vertical; min-height: 80px; line-height: 1.5; }

/* Sub-section box */
.sbox {
  background: var(--bg3); border: 1px solid var(--bdr2);
  border-radius: var(--r2); padding: 15px;
  margin-bottom: 14px;
}
.sbox-title {
  font-size: 13px; font-weight: 800; color: var(--text);
  margin-bottom: 12px; display: flex; align-items: center; gap: 6px;
}

/* ── RECIPE ROW GRID ───────────────────────────────────────── */
.rg-head {
  display: grid;
  grid-template-columns: 2.5fr 90px 90px 90px 34px;
  gap: 7px; margin-bottom: 5px; padding: 0 2px;
}
.rgh { font-size: 9px; font-weight: 700; color: var(--text3); text-transform: uppercase; letter-spacing: .5px; }

.rg-row {
  display: grid;
  grid-template-columns: 2.5fr 90px 90px 90px 34px;
  gap: 7px; align-items: center; margin-bottom: 6px;
}
.rg-row input.fi, .rg-row select.fi { padding: 6px 8px; font-size: 12px; }

.btn-rem {
  background: none; border: none; cursor: pointer;
  color: var(--text3); font-size: 15px; padding: 0;
  line-height: 1; transition: color .15s;
  display: flex; align-items: center; justify-content: center;
}
.btn-rem:hover { color: var(--red2); }

.btn-add-row {
  display: inline-flex; align-items: center; gap: 5px;
  color: var(--teal); font-size: 12px; font-weight: 700;
  cursor: pointer; background: none; border: none;
  font-family: var(--f); padding: 6px 0; transition: color .15s;
}
.btn-add-row:hover { color: var(--teal2); }

/* Cost summary box */
.cost-box {
  background: linear-gradient(135deg, var(--blueb), rgba(37,99,235,.04));
  border: 1px solid rgba(37,99,235,.12);
  border-radius: var(--r2); padding: 13px 16px;
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 12px;
}
.cost-box-val { font-family: var(--fm); font-size: 22px; font-weight: 700; color: var(--blue); }
.cost-box-pct { font-family: var(--fm); font-size: 12px; color: var(--text2); }
.cost-box-sub { font-size: 11px; color: var(--text3); margin-top: 2px; }

/* ── CHART ─────────────────────────────────────────────────── */
.chart-wrap { display: flex; align-items: flex-end; gap: 6px; height: 140px; padding-bottom: 4px; }
.bcol { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 0; }
.brect {
  width: 100%; border-radius: 5px 5px 0 0;
  cursor: pointer; transition: filter .15s, opacity .15s; min-height: 3px;
}
.brect:hover { filter: brightness(1.1); opacity: .9; }
.blbl { font-size: 9px; color: var(--text3); font-family: var(--fm); text-align: center; overflow: hidden; max-width: 100%; white-space: nowrap; text-overflow: ellipsis; }
.bval { font-size: 9px; color: var(--text2); font-family: var(--fm); }

/* ── RECIPE CARDS ──────────────────────────────────────────── */
.rcards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px,1fr)); gap: 14px; }
.rcard {
  background: var(--bg1); border: 1px solid var(--bdr2);
  border-radius: var(--r); overflow: hidden;
  transition: all .22s; box-shadow: var(--shadow);
}
.rcard:hover { border-color: rgba(124,58,237,.2); transform: translateY(-3px); box-shadow: var(--shadow2); }
.rcard-h {
  padding: 14px 16px; border-bottom: 1px solid var(--bdr2);
  display: flex; align-items: center; gap: 11px;
  background: linear-gradient(135deg, var(--purpleb), rgba(124,58,237,.02));
}
.rcard-ico {
  width: 42px; height: 42px; border-radius: 11px;
  background: var(--purpleb2); border: 1px solid rgba(124,58,237,.15);
  display: flex; align-items: center; justify-content: center; font-size: 19px; flex-shrink: 0;
}
.rcard-nm { font-size: 13px; font-weight: 800; color: var(--text); }
.rcard-cat { font-size: 10px; color: var(--text3); margin-top: 2px; }
.rcard-b { padding: 13px 16px; }
.rcard-ing { display: flex; justify-content: space-between; font-size: 11px; margin-bottom: 5px; }
.rcard-ing-n { color: var(--text2); display: flex; align-items: center; gap: 4px; }
.rcard-ing-q { font-family: var(--fm); color: var(--text3); }
.rcard-f {
  padding: 11px 16px; border-top: 1px solid var(--bdr2);
  display: flex; justify-content: space-between; align-items: center;
  background: var(--bg3);
}
.rcard-cost { font-family: var(--fm); font-size: 13px; font-weight: 700; color: var(--purple); }

/* ── OFFER CARDS ───────────────────────────────────────────── */
.offer-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px,1fr)); gap: 16px; }
.offer-card {
  background: var(--bg1); border: 1px solid var(--bdr2);
  border-radius: var(--r); overflow: hidden;
  transition: all .22s; box-shadow: var(--shadow);
}
.offer-card:hover { border-color: rgba(184,146,42,.25); transform: translateY(-3px); box-shadow: var(--shadow2); }
.offer-card.inactive { opacity: .6; }

.offer-head {
  padding: 16px 18px;
  background: linear-gradient(135deg, rgba(184,146,42,.06), rgba(13,148,136,.04));
  border-bottom: 1px solid var(--bdr2);
  display: flex; justify-content: space-between; align-items: flex-start;
}
.offer-discount-badge {
  font-family: var(--fd);
  font-size: 30px; font-weight: 800;
  background: var(--goldg); -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  line-height: 1;
}
.offer-discount-label { font-size: 10px; color: var(--text3); margin-top: 2px; }
.offer-name { font-size: 15px; font-weight: 800; color: var(--text); }
.offer-desc { font-size: 11px; color: var(--text2); margin-top: 4px; }

.offer-body { padding: 14px 18px; }
.offer-item-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 7px 0; border-bottom: 1px solid var(--bdr);
  font-size: 12px;
}
.offer-item-row:last-child { border-bottom: none; }
.offer-item-name { display: flex; align-items: center; gap: 6px; color: var(--text); }
.offer-item-qty { font-family: var(--fm); font-size: 10px; background: var(--bg4); padding: 2px 7px; border-radius: 99px; color: var(--text2); }
.offer-item-price { font-family: var(--fm); color: var(--text2); }

.offer-foot {
  padding: 14px 18px;
  background: var(--bg3); border-top: 1px solid var(--bdr2);
}
.offer-price-grid {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-bottom: 10px;
}
.offer-price-cell { text-align: center; }
.offer-price-lbl { font-size: 9px; color: var(--text3); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 3px; }
.offer-price-val { font-family: var(--fm); font-size: 15px; font-weight: 700; color: var(--text); }
.offer-price-val.original { color: var(--text3); text-decoration: line-through; font-size: 13px; }
.offer-price-val.final { color: var(--green); font-size: 17px; }
.offer-price-val.cost  { color: var(--red2); }
.offer-margin-bar { height: 6px; background: var(--bg4); border-radius: 3px; overflow: hidden; margin-top: 8px; }
.offer-margin-fill { height: 100%; border-radius: 3px; transition: width .5s; }

/* ── MENU ENG MATRIX ───────────────────────────────────────── */
.me-matrix { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.me-quad { border-radius: var(--r2); padding: 15px; min-height: 130px; }
.me-q-star   { background: linear-gradient(160deg, rgba(184,146,42,.07) 0%, #fff 80%); border: 1px solid rgba(184,146,42,.18); }
.me-q-plow   { background: linear-gradient(160deg, rgba(37,99,235,.07) 0%, #fff 80%);  border: 1px solid rgba(37,99,235,.18);  }
.me-q-puzzle { background: linear-gradient(160deg, rgba(124,58,237,.07) 0%, #fff 80%); border: 1px solid rgba(124,58,237,.18); }
.me-q-dog    { background: linear-gradient(160deg, rgba(220,38,38,.07) 0%, #fff 80%);  border: 1px solid rgba(220,38,38,.18);  }
.me-q-title { font-size: 13px; font-weight: 800; margin-bottom: 8px; display: flex; align-items: center; gap: 5px; color: var(--text); }
.me-item {
  font-size: 11px; color: var(--text2);
  padding: 4px 9px; background: rgba(0,0,0,.04);
  border-radius: 5px; margin-bottom: 3px;
}

/* ── EXPENSES ──────────────────────────────────────────────── */
.exp-row { display: flex; align-items: center; gap: 10px; margin-bottom: 9px; }
.exp-lbl { flex: 1; font-size: 12px; color: var(--text2); }
.exp-inp {
  width: 130px; background: var(--bg3); border: 1px solid var(--bdr2);
  border-radius: var(--r2); padding: 7px 11px;
  font-size: 13px; color: var(--text); font-family: var(--fm);
  outline: none; direction: ltr; text-align: left; transition: all .2s;
}
.exp-inp:focus {
  border-color: var(--red2);
  background: var(--bg1);
  box-shadow: 0 0 0 3px var(--redb2);
}
.exp-unit { font-size: 11px; color: var(--text3); width: 24px; flex-shrink: 0; }
.exp-total {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 0 0; border-top: 1px solid var(--bdr2); margin-top: 5px;
}

/* Profit summary */
.pr-row { display: flex; justify-content: space-between; align-items: center; font-size: 12px; margin-bottom: 8px; }
.pr-lbl { color: var(--text2); }
.pr-val { font-family: var(--fm); font-weight: 700; color: var(--text); }
.pr-div { height: 1px; background: var(--bdr2); margin: 10px 0; }

/* ── AI PANEL ──────────────────────────────────────────────── */
.ai-wrap {
  background: var(--bg1); border: 1px solid var(--bdr2);
  border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow);
}
.ai-msgs {
  height: 340px; overflow-y: auto; padding: 16px;
  display: flex; flex-direction: column; gap: 10px;
  background: var(--bg3);
}
.ai-msg {
  max-width: 88%; padding: 11px 14px;
  border-radius: 14px; font-size: 13px; line-height: 1.6;
}
.ai-msg.user {
  background: var(--blueg); border: none;
  align-self: flex-start; color: #fff;
  border-bottom-right-radius: 4px;
}
.ai-msg.ai {
  background: var(--bg1); border: 1px solid var(--bdr2);
  align-self: flex-end; color: var(--text);
  border-bottom-left-radius: 4px;
  box-shadow: var(--shadow);
}
.ai-msg.loading { color: var(--text3); font-style: italic; background: var(--bg1); border: 1px solid var(--bdr2); }
.ai-footer {
  padding: 12px 14px; border-top: 1px solid var(--bdr2);
  display: flex; gap: 8px; background: var(--bg1);
}
.ai-inp {
  flex: 1; background: var(--bg3); border: 1px solid var(--bdr2);
  border-radius: var(--r2); padding: 9px 13px;
  font-size: 13px; color: var(--text); font-family: var(--f); outline: none; transition: all .2s;
}
.ai-inp:focus {
  border-color: var(--blue2);
  background: var(--bg1);
  box-shadow: 0 0 0 3px rgba(37,99,235,.08);
}
.ai-sugs { display: flex; gap: 5px; padding: 0 14px 10px; flex-wrap: wrap; }
.ai-sug {
  padding: 4px 11px; border-radius: 99px; font-size: 11px; font-weight: 600;
  background: var(--bg3); border: 1px solid var(--bdr2); color: var(--text2);
  cursor: pointer; transition: all .15s;
}
.ai-sug:hover { border-color: var(--blue2); color: var(--blue); background: var(--blueb); }

/* ── MODAL ─────────────────────────────────────────────────── */
.modal-bg {
  position: fixed; inset: 0;
  background: rgba(17,24,39,.5);
  backdrop-filter: blur(6px);
  z-index: 300; display: none; align-items: center; justify-content: center;
  padding: 16px;
}
.modal-bg.open { display: flex; animation: fadeIn .2s; }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
.modal {
  background: var(--bg1); border: 1px solid var(--bdr2);
  border-radius: 20px; padding: 26px;
  width: 100%; max-width: 600px; max-height: 88vh;
  overflow-y: auto;
  animation: modalIn .28s cubic-bezier(.34,1.56,.64,1);
  box-shadow: var(--shadow3);
}
.modal-wide { max-width: 800px; }
@keyframes modalIn {
  from { transform:scale(.93) translateY(12px); opacity:0; }
  to   { transform:none; opacity:1; }
}
.modal-title {
  font-family: var(--fd); font-size: 18px; font-weight: 800;
  margin-bottom: 18px; color: var(--text);
}
.mfoot { display: flex; gap: 8px; justify-content: flex-end; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--bdr2); }

/* ── IMPORT ZONE ───────────────────────────────────────────── */
.drop-zone {
  border: 2px dashed var(--bdr3); border-radius: var(--r);
  padding: 36px; text-align: center; cursor: pointer; transition: all .2s;
  background: var(--bg3);
}
.drop-zone:hover, .drop-zone.over {
  border-color: var(--blue2); background: var(--blueb);
}
.dz-icon { font-size: 40px; margin-bottom: 10px; }
.dz-text { font-size: 14px; font-weight: 600; color: var(--text2); }
.dz-sub  { font-size: 11px; color: var(--text3); margin-top: 5px; }

/* ── TOAST ─────────────────────────────────────────────────── */
#toast {
  position: fixed; bottom: 20px; left: 50%;
  transform: translateX(-50%) translateY(70px);
  background: var(--text); border: none;
  border-radius: var(--r2); padding: 10px 22px;
  font-size: 13px; font-weight: 700; color: #fff;
  z-index: 500; transition: transform .28s cubic-bezier(.34,1.56,.64,1);
  pointer-events: none; white-space: nowrap;
  box-shadow: 0 8px 28px rgba(17,24,39,.25);
}
#toast.show { transform: translateX(-50%) translateY(0); }

/* ── ALERT ITEMS ───────────────────────────────────────────── */
.alert-c {
  display: flex; align-items: center; gap: 11px;
  padding: 11px 14px; border-radius: var(--r2);
  background: var(--bg3); border: 1px solid var(--bdr2); margin-bottom: 7px;
}
.alert-c.wr { border-right: 3px solid var(--amber2); background: var(--amberb); }
.alert-c.er { border-right: 3px solid var(--red2);   background: var(--redb); }

/* ── EMPTY STATE ───────────────────────────────────────────── */
.empty { text-align: center; padding: 52px 20px; color: var(--text3); }
.empty .ei { font-size: 44px; margin-bottom: 12px; }
.empty .et { font-size: 15px; font-weight: 700; color: var(--text2); }
.empty .es { font-size: 12px; margin-top: 5px; }

/* ── DIVIDER ───────────────────────────────────────────────── */
.div { height: 1px; background: var(--bdr2); margin: 14px 0; }

/* ── OFFER BUILDER ─────────────────────────────────────────── */
.offer-item-selector {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(200px,1fr));
  gap: 8px; max-height: 250px; overflow-y: auto;
  padding: 10px; background: var(--bg3); border-radius: var(--r2);
  border: 1px solid var(--bdr2);
}
.ois-item {
  padding: 10px 12px; border-radius: var(--r2);
  background: var(--bg1); border: 1px solid var(--bdr2);
  cursor: pointer; transition: all .15s;
}
.ois-item:hover { border-color: rgba(184,146,42,.3); transform: translateY(-1px); }
.ois-item.selected { border-color: var(--gold2); background: var(--goldb); }
.ois-name  { font-size: 12px; font-weight: 700; color: var(--text); }
.ois-cat   { font-size: 10px; color: var(--text3); margin-top: 2px; }
.ois-price { font-family: var(--fm); font-size: 11px; color: var(--gold); margin-top: 3px; }

.offer-selected-rows { display: flex; flex-direction: column; gap: 7px; margin-top: 10px; }
.offer-sel-row {
  display: grid; grid-template-columns: 1fr 80px 80px 30px;
  gap: 8px; align-items: center;
  background: var(--bg3); border-radius: var(--r2); padding: 9px 12px;
  border: 1px solid var(--bdr2);
}

/* live price preview */
.offer-live {
  background: linear-gradient(135deg, rgba(184,146,42,.06), rgba(13,148,136,.04));
  border: 1px solid rgba(184,146,42,.15);
  border-radius: var(--r2); padding: 16px 18px;
  margin-top: 14px;
}
.offer-live-grid {
  display: grid; grid-template-columns: repeat(4,1fr); gap: 10px;
}
.olg-cell { text-align: center; }
.olg-lbl { font-size: 9px; color: var(--text3); text-transform: uppercase; letter-spacing: .5px; margin-bottom: 5px; }
.olg-val { font-family: var(--fm); font-size: 16px; font-weight: 700; color: var(--text); }

/* ── ANALYTICS TABS ────────────────────────────────────────── */
.atabs { display: flex; gap: 6px; margin-bottom: 14px; flex-wrap: wrap; }
.atab {
  padding: 7px 15px; border-radius: var(--r2);
  font-size: 12px; font-weight: 700; cursor: pointer;
  border: 1px solid var(--bdr2); color: var(--text2);
  background: var(--bg1); transition: all .15s; font-family: var(--f);
}
.atab.on {
  background: var(--blueg); color: #fff;
  border-color: transparent;
  box-shadow: 0 2px 10px rgba(37,99,235,.25);
}
.atab:hover:not(.on) { border-color: var(--bdr3); background: var(--bg3); color: var(--text); }

/* ── RESPONSIVE ────────────────────────────────────────────── */
@media (max-width: 900px) {
  #sidebar { transform: translateX(100%); }
  #sidebar.open { transform: translateX(0); }
  #main { margin-right: 0; }
  .g2, .g14, .g41 { grid-template-columns: 1fr; }
  .g3 { grid-template-columns: 1fr 1fr; }
  .fgrid, .fgrid3 { grid-template-columns: 1fr; }
  .kpi-grid { grid-template-columns: repeat(2,1fr); }
  .me-matrix { grid-template-columns: 1fr; }
}
@media (max-width: 500px) {
  .g3 { grid-template-columns: 1fr; }
  .kpi-grid { grid-template-columns: 1fr 1fr; }
}

/* ── CASHIER ──────────────────────────────────────────────────── */
.cashier-layout {
  display: grid;
  grid-template-columns: 1fr 390px;
  gap: 18px;
  height: calc(100vh - 148px);
}
.cashier-items-panel {
  overflow-y: auto;
  padding-right: 4px;
}
.cashier-items-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(135px, 1fr));
  gap: 12px;
}
.cashier-item-card {
  background: var(--bg1);
  border: 1px solid var(--bdr2);
  border-radius: var(--r);
  padding: 16px 12px 12px;
  cursor: pointer;
  transition: all .18s;
  text-align: center;
  position: relative;
  box-shadow: var(--shadow);
}
.cashier-item-card:hover {
  border-color: var(--green2);
  background: var(--greenb);
  transform: translateY(-3px);
  box-shadow: var(--shadow2);
}
.cashier-item-card.in-cart {
  border-color: var(--green2);
  background: linear-gradient(160deg, var(--greenb2), #fff);
}
.ci-icon { font-size: 28px; margin-bottom: 7px; }
.ci-name {
  font-size: 12px; font-weight: 700; line-height: 1.3; margin-bottom: 4px;
  overflow: hidden; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  color: var(--text);
}
.ci-namear { font-size: 10px; color: var(--text3); margin-bottom: 4px; }
.ci-price { font-family: var(--fm); font-size: 13px; font-weight: 900; color: var(--green); }
.ci-badge {
  position:absolute; top:7px; right:7px;
  background: var(--greeng); color:#fff;
  font-size:9px; font-weight:900; border-radius:99px; padding:2px 7px;
  font-family:var(--fm);
}
.cashier-right {
  overflow-y: auto; display: flex; flex-direction: column; gap: 0;
}
.cashier-cart {
  background: var(--bg1); border: 1px solid var(--bdr2);
  border-radius: var(--r); min-height: 120px; flex: 1; overflow-y: auto;
  max-height: 300px; box-shadow: var(--shadow);
}
.cart-row {
  display:flex; align-items:center; gap:8px; padding:10px 14px;
  border-bottom:1px solid var(--bdr); transition: background .15s;
}
.cart-row:hover { background: var(--bg3); }
.cart-row-name  { flex:1; font-size:12px; font-weight:700; color: var(--text); }
.cart-row-controls { display:flex; align-items:center; gap:5px; flex-shrink:0; }
.cart-row-price { font-family:var(--fm); font-size:12px; font-weight:700; color:var(--green); flex-shrink:0; min-width:60px; text-align:left; }

/* ── SYNC STATUS ─────────────────────────────────────────────── */
.sync-status {
  font-size: 10px; padding: 2px 7px; border-radius: 99px;
  font-weight: 600; transition: all .3s;
}
.sync-saving  { color: var(--amber);  background: var(--amberb); }
.sync-saved   { color: var(--green);  background: var(--greenb); }
.sync-error   { color: var(--red2);   background: var(--redb); }
.sync-offline { color: var(--text3);  background: var(--bg4); }

/* ── STATUS COLORS ────────────────────────────────────────────── */
.status-profit  { color: var(--green);  }
.status-loss    { color: var(--red2);   }
.status-warning { color: var(--amber);  }

/* ── MICRO INTERACTIONS ─────────────────────────────────────── */
.btn, .sb-item, .kpi, .panel, .rcard, .offer-card,
.cashier-item-card, .ois-item, .atab {
  will-change: auto;
}

/* Smooth transitions: never transition all properties globally. */
a, button { transition: background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease; }
input, select, textarea { transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease, color .16s ease; }

/* Focus ring */
*:focus-visible {
  outline: 2px solid var(--blue2);
  outline-offset: 2px;
}


/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE 2026-05-28 phase_cc_orders_forced_clean_light_cockpit
   Call Center Orders — clean forced replacement for old dark UI.
   Single source of truth for ccOrdersContent page styling.
   No sync/realtime/storage/order numbering behavior changes.
═══════════════════════════════════════════════════════════════ */
#page-callcenter_orders{
  background:radial-gradient(circle at 10% 0%,rgba(59,156,156,.14),transparent 32%),linear-gradient(180deg,#f3ffff 0%,#eafafa 46%,#f8ffff 100%)!important;
}
#page-callcenter_orders #ccOrdersContent{color:#173b45!important;direction:rtl;}
#page-callcenter_orders #ccOrdersContent *{box-sizing:border-box;}
.cc-cockpit-shell{display:flex;flex-direction:column;gap:14px;padding:0 2px 14px;}
.cc-cockpit-hero{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:16px 18px;border:1px solid rgba(20,184,198,.18);border-radius:22px;background:linear-gradient(135deg,#ffffff 0%,#eefdfd 62%,#e2f7f7 100%);box-shadow:0 16px 38px rgba(29,91,92,.10);}
.cc-hero-title{display:flex;align-items:center;gap:13px;min-width:260px;}.cc-hero-icon{width:52px;height:52px;border-radius:18px;display:grid;place-items:center;background:#fff7e6;color:#d99a16;border:1px solid #f4d89d;font-size:26px;box-shadow:0 10px 24px rgba(217,154,22,.14)}
.cc-hero-kicker{display:inline-flex;align-items:center;border:1px solid rgba(20,184,198,.18);background:#f8ffff;color:#0e7490;border-radius:999px;padding:4px 10px;font-size:11px;font-weight:1000}.cc-hero-title h2{margin:7px 0 2px;color:#0f2f3c;font-size:24px;font-weight:1000;letter-spacing:-.4px}.cc-hero-title p{margin:0;color:#64848b;font-size:12px;font-weight:850}.cc-hero-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.cc-action-btn,.cc-reset-btn,.cc-row-btn{appearance:none;border:1px solid #d7ecef;background:#fff;color:#0f5260;border-radius:13px;padding:10px 14px;font-weight:1000;cursor:pointer;box-shadow:0 8px 20px rgba(15,23,42,.045);line-height:1}.cc-action-btn.primary{background:linear-gradient(135deg,#c99524,#e8bb55);border-color:#d4a73a;color:#fff}.cc-action-btn.pdf{background:#effefe;border-color:#bde9ec;color:#08717d}.cc-action-btn.ghost{background:#fff;color:#0f5260}.cc-action-btn.danger{background:#fff1f2;border-color:#fecdd3;color:#be123c}.cc-action-btn:hover,.cc-reset-btn:hover,.cc-row-btn:hover{transform:translateY(-1px);box-shadow:0 12px 25px rgba(15,23,42,.08)}
.cc-kpi-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(160px,1fr))!important;gap:12px!important;margin:0!important}.cc-stat-card{position:relative;overflow:hidden;min-height:118px;background:#fff!important;border:1px solid #dceff2!important;border-radius:19px!important;padding:17px!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:space-between!important;gap:12px!important;box-shadow:0 13px 30px rgba(29,91,92,.08)!important;transition:.18s ease!important}.cc-stat-card:hover{transform:translateY(-2px);box-shadow:0 20px 40px rgba(29,91,92,.13)!important;border-color:#b8e3e7!important}.cc-stat-card::after{content:'';position:absolute;inset:auto -38px -42px auto;width:132px;height:132px;border-radius:50%;background:rgba(20,184,198,.10)}
.cc-stat-icon{width:48px!important;height:48px!important;min-width:48px!important;border-radius:50%!important;display:grid!important;place-items:center!important;background:#e8fbfb!important;color:#0e7490!important;border:1px solid #cceff1!important;font-size:22px!important;box-shadow:none!important}.cc-stat-label{font-size:12px!important;color:#0e7490!important;font-weight:1000!important}.cc-stat-value{font-size:28px!important;color:#0f172a!important;font-weight:1000!important;line-height:1.1!important;font-family:var(--fm)!important}.cc-stat-note{font-size:11px!important;color:#64748b!important;font-weight:900!important}.cc-stat-note.up{color:#16a34a!important}.cc-stat-note.down{color:#ef4444!important}.cc-stat-card.warn .cc-stat-icon{background:#fff7ed!important;color:#ea8a00!important;border-color:#fed7aa!important}.cc-stat-card.success .cc-stat-icon{background:#ecfdf3!important;color:#16a34a!important;border-color:#bbf7d0!important}.cc-stat-card.danger .cc-stat-icon{background:#fff1f2!important;color:#ef4444!important;border-color:#fecdd3!important}.cc-stat-card.accent-delivery .cc-stat-icon{background:#eff6ff!important;color:#0284c7!important;border-color:#bfdbfe!important}.cc-stat-card.accent-pending .cc-stat-icon{background:#f5f3ff!important;color:#6d5dfc!important;border-color:#ddd6fe!important}.cc-stat-card.accent-total .cc-stat-icon,.cc-stat-card.accent-time .cc-stat-icon{background:#ecfeff!important;color:#0d8b98!important;border-color:#a5f3fc!important}
.costix-pending-mini-card .costix-pending-mini{transform:scale(.92);transform-origin:right center;margin-top:2px}.cc-alert-danger{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border:1px solid #fecdd3;background:linear-gradient(135deg,#fff7f7,#fff);border-radius:20px;box-shadow:0 14px 28px rgba(220,38,38,.08)}.cc-alert-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#fff1f2;border:1px solid #fecdd3;color:#be123c}.cc-alert-copy{flex:1;display:grid;gap:3px}.cc-alert-copy b{color:#be123c;font-weight:1000}.cc-alert-copy span{color:#64748b;font-size:12px;font-weight:850}
.cc-filter-panel{background:#fff;border:1px solid #d9edf0;border-radius:22px;box-shadow:0 14px 34px rgba(29,91,92,.08);overflow:hidden}.cc-filter-title{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:15px 17px;border-bottom:1px solid #e5f2f4;color:#0e7490;font-weight:1000}.cc-filter-title b{font-size:18px}.cc-filter-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1.55fr;gap:12px;padding:14px 16px}.cc-field{display:grid;gap:7px;margin:0}.cc-field>span{color:#334155;font-size:12px;font-weight:1000}.cc-date-inline{display:flex;align-items:center;gap:8px}.cc-date-inline input{flex:1;min-width:0}.cc-date-inline em{font-style:normal;color:#94a3b8;font-weight:1000}.cc-search-field{min-width:210px}.cc-filter-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:0 16px 15px}.cc-date-chips{display:flex;gap:8px;flex-wrap:wrap}.cc-date-chip{border:1px solid #dbeafe;background:#fff;color:#475569;border-radius:999px;padding:8px 13px;font-weight:1000;cursor:pointer}.cc-date-chip.active{background:linear-gradient(135deg,#d4a73a,#f3cf73);border-color:#d4a73a;color:#fff}.cc-reset-btn{background:#f8ffff;border-color:#bde9ec;color:#0e7490}
#page-callcenter_orders .fi{min-height:40px!important;border:1px solid #d8e7eb!important;background:#fff!important;color:#0f172a!important;border-radius:12px!important;padding:8px 11px!important;font-size:12px!important;font-weight:900!important;box-shadow:none!important}#page-callcenter_orders .fi:focus{border-color:#14b8c6!important;box-shadow:0 0 0 3px rgba(20,184,198,.13)!important;outline:0!important}
.cc-workflow-tabs{display:grid!important;grid-template-columns:repeat(6,minmax(120px,1fr))!important;gap:10px!important}.cc-workflow-tab{border:1px solid #e2e8f0;background:#fff;color:#0f5260;border-radius:16px;padding:12px 14px;display:flex;align-items:center;justify-content:center;gap:10px;font-weight:1000;cursor:pointer;box-shadow:0 10px 24px rgba(29,91,92,.06)}.cc-workflow-tab b{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:999px;background:#eafafa;color:#0e7490;font-family:var(--fm)}.cc-workflow-tab em{font-style:normal;white-space:nowrap}.cc-workflow-tab.on{background:linear-gradient(135deg,#21aaa9,#3B9C9C);border-color:#2e9898;color:#fff}.cc-workflow-tab.on b{background:rgba(255,255,255,.22);color:#fff}.cc-workflow-tab.on span,.cc-workflow-tab.on em{color:#fff}
.cc-orders-table-panel{border:1px solid #d4ecef!important;background:#fff!important;border-radius:20px!important;box-shadow:0 17px 38px rgba(29,91,92,.10)!important;overflow:hidden!important}.cc-table-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;background:#f8ffff;border-bottom:1px solid #e2f1f3}.cc-table-head>div:first-child{display:grid;gap:3px}.cc-table-head b{color:#0f2f3c;font-weight:1000}.cc-table-head span{color:#64748b;font-size:11px;font-weight:900}.cc-table-head .cc-orders-pager{margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}.cc-table-head .cc-orders-pager-left span,.cc-table-head .cc-orders-pager-left b{display:none!important}.cc-table-head .cc-orders-pager-left{order:2}.cc-table-head .cc-orders-pager-right{order:1}.cc-table-foot{padding:12px;background:#fff}.cc-table-foot .cc-orders-pager{margin:0!important}
.cc-orders-pager{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:10px 12px;background:#f8ffff;border:1px solid #d4ecef;border-radius:16px}.cc-orders-pager-left,.cc-orders-pager-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.cc-orders-pager b,.cc-orders-pager span{color:#475569;font-size:12px;font-weight:1000}.cc-orders-pager .fi{width:82px;min-width:82px}.cc-orders-pager .btn{border-radius:10px!important;background:#fff!important;border-color:#d8e7eb!important;color:#0e7490!important;font-weight:1000!important}
.cc-orders-scroll{padding:0!important;overflow:auto!important;max-height:none!important}.cc-orders-compact{width:100%!important;min-width:1280px!important;border-collapse:separate!important;border-spacing:0!important;background:#fff!important;table-layout:auto!important}.cc-orders-compact thead th{position:sticky;top:0;z-index:5;background:linear-gradient(180deg,#45beb9,#31aaa5)!important;color:#fff!important;border:0!important;border-inline-start:1px solid rgba(255,255,255,.18)!important;padding:13px 10px!important;font-size:12px!important;font-weight:1000!important;text-align:right!important;white-space:nowrap}.cc-orders-compact tbody td{background:#fff!important;color:#0f172a!important;border-bottom:1px solid #e8f0f2!important;border-inline-start:1px solid rgba(15,23,42,.035)!important;padding:13px 10px!important;vertical-align:middle!important;font-size:12px!important;font-weight:850!important}.cc-orders-compact tbody tr:nth-child(even) td{background:#eefbfb!important}.cc-orders-compact tbody tr:hover td{background:#dff7f7!important}.cc-orders-compact tbody tr[data-late="1"] td{background:#fff8f8!important}.cc-orders-compact tbody tr[data-late="1"]:hover td{background:#fff1f2!important}.cc-orders-compact small{display:block;margin-top:4px;color:#64748b;font-size:10px;font-weight:850}.td-m{font-family:var(--fm),'Cairo',monospace!important;text-align:center!important}.cc-row-index{color:#64748b!important}.cc-order-link{display:inline-flex;color:#1e3a8a!important;font-weight:1000!important;text-decoration:none!important}.cc-mini-badge{display:inline-flex!important;margin:5px auto 0!important;width:max-content;border-radius:999px;background:#ede9fe;color:#6d28d9;padding:3px 8px!important;font-size:10px!important}.cc-customer-cell{display:grid;gap:3px}.cc-customer-cell b{color:#0f172a;font-weight:1000}.cc-phone-cell{direction:ltr;color:#0f172a!important;font-weight:1000!important}.cc-type-pill,.cc-workflow-badge,.cc-priority{display:inline-flex;align-items:center;justify-content:center;gap:5px;border-radius:999px;padding:6px 10px;font-weight:1000;font-size:11px;border:1px solid #dbeafe;background:#eff6ff;color:#1d4ed8;white-space:nowrap}.cc-type-pill.takeaway{background:#f5f3ff;color:#6d28d9;border-color:#ddd6fe}.cc-type-pill.delivery{background:#eff6ff;color:#0284c7;border-color:#bfdbfe}.cc-workflow-badge[data-status="pending"]{background:#f5f3ff;color:#6d28d9;border-color:#ddd6fe}.cc-workflow-badge[data-status="preparing"]{background:#fff7ed;color:#c2410c;border-color:#fed7aa}.cc-workflow-badge[data-status="out_for_delivery"]{background:#eff6ff;color:#0369a1;border-color:#bfdbfe}.cc-workflow-badge[data-status="delivered"]{background:#f0fdf4;color:#15803d;border-color:#bbf7d0}.cc-priority.normal{background:#f0fdf4;color:#15803d;border-color:#bbf7d0}.cc-priority.high{background:#fff7ed;color:#c2410c;border-color:#fed7aa}.cc-money{color:#059669!important;font-weight:1000!important}.cc-note-cell{color:#64748b;font-weight:900;line-height:1.45}.cc-duration{display:inline-flex!important;align-items:center!important;justify-content:center!important;border-radius:999px!important;padding:4px 8px!important;margin-top:5px!important;font-size:10px!important;font-weight:1000!important;background:#e0f2fe!important;color:#0369a1!important;border:1px solid #bae6fd!important}.cc-duration.late{background:#fff1f2!important;color:#be123c!important;border-color:#fecdd3!important}.cc-row-actions{display:flex;align-items:center;justify-content:center;gap:6px}.cc-row-btn{min-width:34px;height:32px;padding:0 9px!important;border-radius:10px!important}.cc-row-btn.view{background:#ecfeff;color:#0e7490;border-color:#a5f3fc}.cc-row-btn.next{background:#eff6ff;color:#1d4ed8;border-color:#bfdbfe}.cc-row-btn.more{background:#f8fafc;color:#475569;border-color:#e2e8f0}.cc-empty-state{display:grid;place-items:center;gap:8px;padding:44px;color:#64748b}.cc-empty-state b{font-size:16px;color:#0f172a}
.cc-order-modal{width:min(1020px,96vw)!important;max-height:92vh!important;overflow:hidden!important;border-radius:26px!important;background:linear-gradient(180deg,#ffffff,#f8ffff)!important;border:1px solid #d4ecef!important;box-shadow:0 30px 90px rgba(15,23,42,.24)!important;color:#0f172a!important}.cc-order-modal .modal-title{background:linear-gradient(135deg,#ecfeff,#fff)!important;border:1px solid #d4ecef!important;border-radius:20px!important;padding:14px!important;color:#0f2f3c!important}.cc-order-modal-grid{display:grid!important;grid-template-columns:1.15fr .85fr!important;gap:12px!important;max-height:calc(92vh - 150px)!important;overflow:auto!important}.cc-order-modal-card{border:1px solid #e2e8f0!important;background:#fff!important;border-radius:18px!important;padding:14px!important;box-shadow:0 10px 24px rgba(15,23,42,.05)!important}.cc-order-modal-card h4{font-size:13px!important;font-weight:1000!important;color:#0e7490!important;margin:0 0 10px!important}.cc-order-modal-total{display:flex!important;justify-content:space-between!important;align-items:center!important;padding:13px!important;border-radius:16px!important;background:#fffbeb!important;border:1px solid #fde68a!important;color:#92400e!important;font-size:18px!important;font-weight:1000!important;margin-top:10px!important}
@media(max-width:1200px){.cc-filter-grid{grid-template-columns:1fr 1fr 1fr}.cc-search-field{grid-column:span 2}.cc-workflow-tabs{grid-template-columns:repeat(3,1fr)!important}.cc-table-head{align-items:flex-start;flex-direction:column}.cc-table-head .cc-orders-pager{width:100%}}
@media(max-width:760px){.cc-cockpit-hero{align-items:stretch}.cc-hero-actions{width:100%}.cc-action-btn{flex:1}.cc-filter-grid{grid-template-columns:1fr}.cc-search-field{grid-column:auto}.cc-workflow-tabs{grid-template-columns:1fr 1fr!important}.cc-order-modal-grid{grid-template-columns:1fr!important}.cc-kpi-grid{grid-template-columns:1fr 1fr!important}.cc-stat-value{font-size:23px!important}}
@media(max-width:520px){.cc-kpi-grid,.cc-workflow-tabs{grid-template-columns:1fr!important}.cc-date-inline{flex-direction:column;align-items:stretch}.cc-date-inline em{display:none}.cc-filter-footer{align-items:stretch}.cc-reset-btn{width:100%}}

/* ═══════════════════════════════════════════════════════════════
   CALL CENTER PRO — Professional POS Layout
═══════════════════════════════════════════════════════════════ */
.cc-pos-shell {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: calc(100vh - 128px);
}
.cc-pos-toolbar {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  background: var(--bg1);
  border: 1px solid var(--bdr2);
  border-radius: 18px;
  padding: 12px;
  box-shadow: var(--shadow);
}
.cc-toolbar-main {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.cc-toolbar-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.cc-mini-kpi {
  min-width: 145px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 14px;
  background: var(--bg3);
  border: 1px solid var(--bdr2);
}
.cc-mini-kpi span {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: var(--bg1);
  box-shadow: var(--shadow);
  font-size: 18px;
}
.cc-mini-kpi b {
  display: block;
  font-family: var(--fm);
  font-size: 18px;
  color: var(--text);
  line-height: 1;
}
.cc-mini-kpi small {
  display: block;
  font-size: 10px;
  color: var(--text3);
  font-weight: 800;
  margin-top: 3px;
}
.cc-mini-kpi.warn { background: var(--amberb); border-color: rgba(245,158,11,.2); }
.cc-mini-kpi.success { background: var(--greenb); border-color: rgba(16,185,129,.2); }
.cc-pill-danger {
  display: inline-flex;
  min-width: 18px;
  height: 18px;
  padding: 0 6px;
  border-radius: 999px;
  align-items: center;
  justify-content: center;
  background: var(--red2);
  color: #fff;
  font-size: 10px;
  font-family: var(--fm);
}

.cc-pos-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  gap: 14px;
  align-items: start;
}
.cc-menu-zone {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.cc-order-zone {
  position: sticky;
  top: 72px;
  max-height: calc(100vh - 92px);
  overflow: hidden;
}

.cc-control-card {
  background: var(--bg1);
  border: 1px solid var(--bdr2);
  border-radius: 18px;
  padding: 12px;
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cc-channel-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 8px;
}
.cc-channel-btn {
  border: 1px solid var(--bdr2);
  background: var(--bg3);
  color: var(--text2);
  border-radius: 14px;
  padding: 10px 8px;
  cursor: pointer;
  font-family: var(--f);
  font-size: 12px;
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.cc-channel-btn:hover {
  border-color: var(--gold2);
  background: var(--goldb2);
  color: var(--gold);
}
.cc-channel-btn.on {
  background: var(--goldg);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 6px 18px rgba(184,146,42,.22);
}
.cc-search-row {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.cc-company-select {
  max-width: 190px;
  flex: 0 0 190px;
}
.cc-search-box {
  flex: 1;
  min-width: 220px;
  position: relative;
}
.cc-search-box span {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--text3);
}
.cc-search-box input {
  width: 100%;
  border: 1px solid var(--bdr2);
  background: var(--bg3);
  border-radius: 14px;
  padding: 11px 38px 11px 12px;
  font-family: var(--f);
  outline: none;
}
.cc-search-box input:focus {
  background: var(--bg1);
  border-color: var(--gold2);
  box-shadow: 0 0 0 3px var(--goldb2);
}

.cc-category-strip {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 2px 8px;
  scrollbar-width: thin;
}
.cc-cat-btn {
  border: 1px solid var(--bdr2);
  background: var(--bg1);
  color: var(--text2);
  border-radius: 999px;
  padding: 9px 14px;
  white-space: nowrap;
  cursor: pointer;
  font-family: var(--f);
  font-size: 12px;
  font-weight: 800;
  box-shadow: var(--shadow);
}
.cc-cat-btn:hover {
  color: var(--gold);
  border-color: rgba(184,146,42,.3);
  background: var(--goldb2);
}
.cc-cat-btn.on {
  color: #fff;
  background: var(--goldg);
  border-color: transparent;
}

.cc-items-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(165px, 1fr));
  gap: 14px;
  align-content: start;
  padding-bottom: 18px;
}
.cc-menu-card {
  position: relative;
  min-height: 168px;
  background: var(--bg1);
  border: 1px solid var(--bdr2);
  border-radius: 20px;
  padding: 15px;
  box-shadow: var(--shadow);
  cursor: pointer;
  transition: transform .18s, box-shadow .18s, border-color .18s, background .18s;
  display: flex;
  flex-direction: column;
}
.cc-menu-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow2);
  border-color: rgba(184,146,42,.35);
  background: linear-gradient(160deg, var(--goldb2), #fff 65%);
}
.cc-menu-card.selected {
  border-color: var(--gold2);
  background: linear-gradient(160deg, var(--goldb), #fff 65%);
}
.cc-card-qty {
  position: absolute;
  top: -8px;
  right: -8px;
  min-width: 26px;
  height: 26px;
  padding: 0 8px;
  display: grid;
  place-items: center;
  background: var(--goldg);
  color: #fff;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  font-family: var(--fm);
  box-shadow: var(--shadow2);
}
.cc-card-icon {
  width: 44px;
  height: 44px;
  border-radius: 16px;
  background: var(--bg3);
  display: grid;
  place-items: center;
  font-size: 24px;
  margin-bottom: 10px;
}
.cc-card-name {
  font-size: 13px;
  font-weight: 900;
  color: var(--text);
  line-height: 1.45;
  min-height: 56px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.cc-card-cat {
  font-size: 10px;
  color: var(--text3);
  font-weight: 700;
  margin-top: 4px;
}
.cc-card-foot {
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding-top: 12px;
}
.cc-card-foot span {
  color: var(--gold);
  font-family: var(--fm);
  font-weight: 900;
  font-size: 13px;
}
.cc-card-foot button {
  width: 30px;
  height: 30px;
  border: none;
  border-radius: 11px;
  background: var(--goldg);
  color: #fff;
  font-size: 18px;
  cursor: pointer;
}
.cc-empty-menu {
  grid-column: 1 / -1;
  min-height: 260px;
  border: 1px dashed var(--bdr3);
  border-radius: 20px;
  display: grid;
  place-items: center;
  text-align: center;
  color: var(--text3);
  background: var(--bg1);
}
.cc-empty-menu div { font-size: 40px; }
.cc-empty-menu b { display: block; color: var(--text2); margin-top: 6px; }
.cc-empty-menu span { display: block; font-size: 12px; margin-top: 4px; }

.cc-order-card {
  background: var(--bg1);
  border: 1px solid var(--bdr2);
  border-radius: 20px;
  box-shadow: var(--shadow2);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 92px);
}
.cc-order-head {
  padding: 14px 16px;
  border-bottom: 1px solid var(--bdr2);
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(160deg, var(--goldb2), #fff 70%);
}
.cc-order-title {
  font-size: 15px;
  font-weight: 900;
}
.cc-order-title span { color: var(--gold); font-family: var(--fm); }
.cc-order-sub { font-size: 11px; color: var(--text3); margin-top: 2px; }
.cc-customer-card {
  padding: 12px;
  border-bottom: 1px solid var(--bdr2);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cc-block-label {
  font-size: 10px;
  font-weight: 900;
  color: var(--text3);
  letter-spacing: .5px;
}
.cc-customer-grid {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
}
.cc-cart-list {
  flex: 1;
  overflow-y: auto;
  padding: 10px;
  background: var(--bg3);
}
.cc-cart-empty {
  height: 190px;
  display: grid;
  place-items: center;
  align-content: center;
  color: var(--text3);
  text-align: center;
}
.cc-cart-empty div { font-size: 42px; }
.cc-cart-empty b { display: block; color: var(--text2); }
.cc-cart-empty span { font-size: 12px; }
.cc-cart-item {
  background: var(--bg1);
  border: 1px solid var(--bdr2);
  border-radius: 16px;
  padding: 11px;
  margin-bottom: 9px;
}
.cc-cart-top {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}
.cc-cart-top b {
  font-size: 13px;
  color: var(--text);
}
.cc-cart-top strong {
  color: var(--gold);
  font-family: var(--fm);
  white-space: nowrap;
}
.cc-cart-mods {
  font-size: 10px;
  color: var(--teal);
  margin-top: 4px;
  line-height: 1.5;
}
.cc-cart-note {
  font-size: 10px;
  color: var(--amber);
  margin-top: 3px;
}
.cc-cart-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
}
.cc-qty {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.cc-qty button,
.cc-modal-qty button {
  width: 28px;
  height: 28px;
  border-radius: 9px;
  border: 1px solid var(--bdr2);
  background: var(--bg3);
  cursor: pointer;
  font-size: 16px;
}
.cc-qty span {
  min-width: 24px;
  text-align: center;
  font-weight: 900;
  font-family: var(--fm);
}
.cc-remove {
  border: none;
  color: var(--red2);
  background: var(--redb);
  padding: 5px 9px;
  border-radius: 9px;
  font-size: 10px;
  cursor: pointer;
}
.cc-order-options {
  padding: 10px 12px;
  border-top: 1px solid var(--bdr2);
  display: grid;
  grid-template-columns: 1fr 94px;
  gap: 8px;
}
.cc-total-card {
  padding: 12px;
  background: var(--bg3);
  border-top: 1px solid var(--bdr2);
}
.cc-total-line,
.cc-grand-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.cc-total-line {
  font-size: 12px;
  margin-bottom: 4px;
}
.cc-total-line.amber { color: var(--amber); }
.cc-total-line.teal { color: var(--teal); }
.cc-total-line b,
.cc-grand-total b { font-family: var(--fm); }
.cc-grand-total {
  padding-top: 8px;
  margin-top: 7px;
  border-top: 1px dashed var(--bdr3);
  font-size: 18px;
  font-weight: 900;
}
.cc-grand-total b { color: var(--gold); }
.cc-pay-box {
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cc-pay-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.cc-confirm-btn {
  width: 100%;
  padding: 14px;
  border: none;
  border-radius: 15px;
  background: var(--goldg);
  color: #fff;
  font-family: var(--f);
  font-size: 16px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(184,146,42,.24);
}
.cc-confirm-btn:disabled {
  background: var(--bg4);
  color: var(--text3);
  box-shadow: none;
  cursor: not-allowed;
}

.cc-item-modal { max-width: 560px; }
.cc-item-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 16px;
}
.cc-modal-x {
  border: none;
  background: var(--bg3);
  color: var(--text3);
  width: 34px;
  height: 34px;
  border-radius: 12px;
  cursor: pointer;
  font-size: 18px;
}
.cc-modal-section {
  margin-bottom: 14px;
}
.cc-addon-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px,1fr));
  gap: 8px;
  margin-top: 8px;
}
.cc-addon-chip {
  border: 1px solid var(--bdr2);
  background: var(--bg3);
  border-radius: 14px;
  padding: 9px 10px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 12px;
}
.cc-addon-chip input { margin-left: 5px; }
.cc-addon-chip span { font-weight: 800; color: var(--text); }
.cc-addon-chip b { font-family: var(--fm); color: var(--gold); font-size: 11px; }
.cc-no-addons {
  border: 1px dashed var(--bdr3);
  background: var(--bg3);
  border-radius: 14px;
  padding: 14px;
  color: var(--text3);
  font-size: 12px;
  margin-top: 8px;
}
.cc-modal-qty {
  display: grid;
  grid-template-columns: 36px 1fr 36px;
  gap: 8px;
  margin-top: 8px;
}
.cc-modal-qty button {
  width: 36px;
  height: 36px;
}

@media (max-width: 1100px) {
  .cc-pos-layout { grid-template-columns: 1fr; }
  .cc-order-zone {
    position: relative;
    top: auto;
    max-height: none;
  }
  .cc-order-card { max-height: none; }
}
@media (max-width: 680px) {
  .cc-items-grid { grid-template-columns: repeat(auto-fill, minmax(140px,1fr)); }
  .cc-channel-tabs { grid-template-columns: 1fr; }
  .cc-company-select { max-width: none; flex: 1 1 100%; }
  .cc-search-box { min-width: 100%; }
  .cc-toolbar-main { width: 100%; }
  .cc-mini-kpi { flex: 1 1 140px; }
}


/* ═══════════════════════════════════════════════════════════════
   CALL CENTER COMPACT UPDATE — smaller cards + visible cart
═══════════════════════════════════════════════════════════════ */
.cc-pos-layout {
  grid-template-columns: minmax(0, 1fr) 350px !important;
}
.cc-items-grid {
  grid-template-columns: repeat(auto-fill, minmax(135px, 1fr)) !important;
  gap: 10px !important;
}
.cc-menu-card {
  min-height: 128px !important;
  border-radius: 16px !important;
  padding: 11px !important;
}
.cc-card-icon {
  width: 34px !important;
  height: 34px !important;
  border-radius: 12px !important;
  font-size: 19px !important;
  margin-bottom: 7px !important;
}
.cc-card-name {
  font-size: 11.5px !important;
  line-height: 1.35 !important;
  min-height: 45px !important;
  -webkit-line-clamp: 3 !important;
}
.cc-card-cat {
  font-size: 9px !important;
  margin-top: 2px !important;
}
.cc-card-foot {
  padding-top: 7px !important;
}
.cc-card-foot span {
  font-size: 11px !important;
}
.cc-card-foot button {
  width: 25px !important;
  height: 25px !important;
  border-radius: 9px !important;
  font-size: 15px !important;
}
.cc-card-qty {
  min-width: 22px !important;
  height: 22px !important;
  font-size: 10px !important;
}
.cc-control-card {
  padding: 9px !important;
  gap: 8px !important;
}
.cc-channel-btn {
  padding: 8px 6px !important;
  font-size: 11px !important;
}
.cc-cat-btn {
  padding: 7px 11px !important;
  font-size: 11px !important;
}
.cc-order-card {
  max-height: calc(100vh - 88px) !important;
}
.cc-order-head.compact {
  padding: 10px 12px !important;
}
.cc-customer-card.compact {
  padding: 9px !important;
  gap: 6px !important;
}
.cc-customer-card.compact .fi {
  padding: 7px 10px !important;
  font-size: 12px !important;
}
.cc-live-customer-card:empty {
  display: none;
}
.cc-customer-found {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  background: var(--tealb);
  border: 1px solid rgba(20,184,166,.24);
  border-radius: 12px;
  padding: 8px;
}
.cc-cf-avatar {
  width: 30px;
  height: 30px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: var(--bg1);
  flex-shrink: 0;
}
.cc-cf-info b {
  display: block;
  font-size: 12px;
  color: var(--text);
}
.cc-cf-info span,
.cc-cf-info small {
  display: block;
  font-size: 10px;
  color: var(--text2);
  line-height: 1.5;
}
.cc-customer-new {
  background: var(--amberb);
  border: 1px solid rgba(245,158,11,.24);
  border-radius: 12px;
  padding: 7px 9px;
}
.cc-customer-new b {
  display: block;
  font-size: 11px;
  color: var(--amber);
}
.cc-customer-new span {
  display: block;
  font-size: 10px;
  color: var(--text2);
}
.cc-cart-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 11px;
  border-top: 1px solid var(--bdr2);
  border-bottom: 1px solid var(--bdr2);
  background: var(--bg1);
}
.cc-cart-header span {
  font-size: 11px;
  font-weight: 900;
  color: var(--text2);
}
.cc-cart-header b {
  font-size: 10px;
  font-family: var(--fm);
  color: var(--gold);
}
.cc-cart-list.compact {
  min-height: 145px;
  max-height: 260px;
  padding: 8px !important;
}
.cc-cart-empty.compact {
  height: 120px !important;
}
.cc-cart-empty.compact div {
  font-size: 30px !important;
}
.cc-cart-empty.compact b {
  font-size: 12px !important;
}
.cc-cart-empty.compact span {
  font-size: 10px !important;
}
.cc-cart-item.compact {
  padding: 8px !important;
  border-radius: 13px !important;
  margin-bottom: 7px !important;
}
.cc-cart-top b {
  font-size: 12px !important;
}
.cc-cart-top strong {
  font-size: 11px !important;
}
.cc-cart-mods,
.cc-cart-note {
  font-size: 9.5px !important;
}
.cc-cart-actions {
  margin-top: 7px !important;
}
.cc-qty button {
  width: 24px !important;
  height: 24px !important;
  border-radius: 8px !important;
}
.cc-qty span {
  min-width: 20px !important;
  font-size: 11px !important;
}
.cc-remove {
  padding: 4px 8px !important;
}
.cc-order-options.compact {
  padding: 8px !important;
}
.cc-order-options.compact .fi {
  padding: 7px 10px !important;
  font-size: 12px !important;
}
.cc-total-card.compact {
  padding: 9px !important;
}
.cc-total-line {
  font-size: 11px !important;
}
.cc-grand-total {
  font-size: 16px !important;
  padding-top: 6px !important;
  margin-top: 5px !important;
}
.cc-pay-box.compact {
  padding: 9px !important;
}
.cc-confirm-btn {
  padding: 11px !important;
  border-radius: 12px !important;
  font-size: 14px !important;
}
.cc-mini-kpi {
  min-width: 125px !important;
  padding: 7px 10px !important;
}
.cc-mini-kpi span {
  width: 30px !important;
  height: 30px !important;
  font-size: 16px !important;
}
.cc-mini-kpi b {
  font-size: 15px !important;
}
.cc-mini-kpi small {
  font-size: 9px !important;
}
@media (max-width: 1100px) {
  .cc-pos-layout {
    grid-template-columns: 1fr !important;
  }
  .cc-cart-list.compact {
    max-height: none;
  }
}


/* ═══════════════════════════════════════════════════════════════
   CALL CENTER SMART LAYOUT — Bigger order panel, smaller item grid
═══════════════════════════════════════════════════════════════ */
.cc-pos-layout {
  grid-template-columns: minmax(0, 1fr) 430px !important;
  gap: 12px !important;
}

/* أصغر وأكتر في الشاشة */
.cc-items-grid {
  grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)) !important;
  gap: 9px !important;
}
.cc-menu-card {
  min-height: 118px !important;
  padding: 9px !important;
  border-radius: 15px !important;
}
.cc-card-icon {
  width: 30px !important;
  height: 30px !important;
  border-radius: 11px !important;
  font-size: 17px !important;
  margin-bottom: 6px !important;
}
.cc-card-name {
  font-size: 10.5px !important;
  line-height: 1.32 !important;
  min-height: 38px !important;
  -webkit-line-clamp: 3 !important;
}
.cc-card-cat {
  font-size: 8.5px !important;
}
.cc-card-foot {
  padding-top: 5px !important;
}
.cc-card-foot span {
  font-size: 10px !important;
}
.cc-card-foot button {
  width: 23px !important;
  height: 23px !important;
  font-size: 14px !important;
  border-radius: 8px !important;
}

/* لوحة الأوردر أكبر وأوضح */
.cc-order-zone {
  max-height: calc(100vh - 84px) !important;
}
.cc-order-card.smart {
  max-height: calc(100vh - 84px) !important;
}
.cc-order-head.smart {
  padding: 9px 12px !important;
}
.cc-order-title {
  font-size: 14px !important;
}
.cc-order-sub {
  font-size: 10px !important;
}
.cc-smart-customer {
  padding: 8px;
  border-bottom: 1px solid var(--bdr2);
  background: var(--bg1);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.cc-smart-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px;
}
.cc-smart-row.two {
  grid-template-columns: 1.4fr .9fr;
}
.cc-smart-customer .fi,
.cc-order-options.smart .fi {
  padding: 7px 10px !important;
  font-size: 12px !important;
  border-radius: 10px !important;
}
.cc-live-customer-card.smart:empty {
  display: none;
}
.cc-customer-found.smart {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 6px 8px;
  background: var(--tealb);
  border: 1px solid rgba(20,184,166,.22);
  border-radius: 10px;
  white-space: nowrap;
  overflow: hidden;
}
.cc-customer-found.smart span {
  flex-shrink: 0;
}
.cc-customer-found.smart b {
  font-size: 11px;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
}
.cc-customer-found.smart small {
  font-size: 9.5px;
  color: var(--text2);
  overflow: hidden;
  text-overflow: ellipsis;
}
.cc-customer-new.smart {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--amberb);
  border: 1px solid rgba(245,158,11,.22);
  border-radius: 10px;
  padding: 6px 8px;
}
.cc-customer-new.smart b {
  font-size: 10px;
  color: var(--amber);
}
.cc-customer-new.smart span {
  font-size: 9.5px;
  color: var(--text2);
}

/* الأصناف المضافة أوضح وأوسع */
.cc-cart-header.smart {
  padding: 8px 10px !important;
  background: var(--bg3);
}
.cc-cart-header.smart span {
  font-size: 12px;
}
.cc-cart-list.smart {
  min-height: 260px !important;
  max-height: 360px !important;
  padding: 8px !important;
}
.cc-cart-empty.smart {
  height: 210px !important;
}
.cc-cart-empty.smart div {
  font-size: 34px !important;
}
.cc-cart-item.smart {
  padding: 9px !important;
  border-radius: 13px !important;
  margin-bottom: 7px !important;
}
.cc-cart-name-wrap {
  min-width: 0;
}
.cc-cart-top b {
  font-size: 12px !important;
}
.cc-cart-top strong {
  font-size: 12px !important;
}
.cc-order-options.smart {
  padding: 8px !important;
  grid-template-columns: 1fr 88px !important;
}
.cc-total-card.smart {
  padding: 8px 10px !important;
}
.cc-grand-total {
  font-size: 17px !important;
}
.cc-pay-box.smart {
  padding: 8px 10px 10px !important;
}
.cc-confirm-btn {
  padding: 12px !important;
}

/* تقليل المساحة فوق المنيو */
.cc-pos-toolbar {
  padding: 9px !important;
  margin-bottom: 0 !important;
}
.cc-control-card {
  padding: 8px !important;
}
.cc-channel-btn {
  padding: 7px 6px !important;
}
.cc-search-box input {
  padding-top: 8px !important;
  padding-bottom: 8px !important;
}
.cc-category-strip {
  padding-bottom: 5px !important;
}
.cc-cat-btn {
  padding: 6px 10px !important;
}

/* موبايل / شاشات ضيقة */
@media (max-width: 1150px) {
  .cc-pos-layout {
    grid-template-columns: 1fr !important;
  }
  .cc-cart-list.smart {
    max-height: none !important;
  }
}


/* ═══════════════════════════════════════════════════════════════
   CALL CENTER OPTIONAL ADDONS — add-ons from cart item only
═══════════════════════════════════════════════════════════════ */
.cc-item-tools {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.cc-tool-btn {
  width: 27px;
  height: 27px;
  border: 1px solid var(--bdr2);
  border-radius: 9px;
  cursor: pointer;
  display: grid;
  place-items: center;
  font-size: 12px;
  background: var(--bg3);
  transition: all .15s;
}
.cc-tool-btn.addon {
  color: var(--gold);
  background: var(--goldb2);
  border-color: rgba(184,146,42,.22);
}
.cc-tool-btn.note {
  color: var(--teal);
  background: var(--tealb);
  border-color: rgba(20,184,166,.22);
}
.cc-tool-btn:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow);
  filter: brightness(1.02);
}
.cc-addon-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 54vh;
  overflow-y: auto;
  padding: 2px;
}
.cc-addon-row {
  display: grid;
  grid-template-columns: 1fr 128px;
  gap: 10px;
  align-items: center;
  background: var(--bg3);
  border: 1px solid var(--bdr2);
  border-radius: 14px;
  padding: 10px;
}
.cc-addon-info b {
  display: block;
  font-size: 13px;
  color: var(--text);
}
.cc-addon-info span {
  display: block;
  font-size: 11px;
  color: var(--gold);
  font-family: var(--fm);
  margin-top: 2px;
}
.cc-addon-stepper {
  display: grid;
  grid-template-columns: 30px 1fr 30px;
  gap: 5px;
}
.cc-addon-stepper button {
  width: 30px;
  height: 30px;
  border-radius: 10px;
  border: 1px solid var(--bdr2);
  background: var(--bg1);
  cursor: pointer;
  font-size: 16px;
}
.cc-addon-stepper input {
  width: 100%;
  border: 1px solid var(--bdr2);
  border-radius: 10px;
  text-align: center;
  font-family: var(--fm);
  font-weight: 900;
  outline: none;
}
.cc-note-modal { max-width: 440px; }
@media (max-width: 520px) {
  .cc-addon-row {
    grid-template-columns: 1fr;
  }
  .cc-addon-stepper {
    max-width: 150px;
  }
}


/* ═══════════════════════════════════════════════════════════════
   CALL CENTER ORDER SCROLL FIX
   يجعل زر التأكيد ظاهر دائماً وجسم الأوردر يعمل Scroll
═══════════════════════════════════════════════════════════════ */
.cc-order-zone {
  height: calc(100vh - 84px) !important;
  max-height: calc(100vh - 84px) !important;
  overflow: hidden !important;
}

.cc-order-card,
.cc-order-card.smart {
  height: 100% !important;
  max-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

.cc-order-head,
.cc-order-head.smart,
.cc-smart-customer,
.cc-cart-header,
.cc-cart-header.smart,
.cc-order-options,
.cc-order-options.smart,
.cc-total-card,
.cc-total-card.smart,
.cc-pay-box,
.cc-pay-box.smart {
  flex-shrink: 0 !important;
}

.cc-cart-list,
.cc-cart-list.smart,
.cc-cart-list.compact {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
}

/* خلّي الجزء السفلي واضح وفوق أي محتوى */
.cc-total-card,
.cc-total-card.smart {
  box-shadow: 0 -4px 14px rgba(0,0,0,.04);
  z-index: 2;
}

.cc-pay-box,
.cc-pay-box.smart {
  background: var(--bg1);
  border-top: 1px solid var(--bdr2);
  z-index: 3;
}

/* الزرار ياخد مساحة واضحة */
.cc-confirm-btn {
  min-height: 44px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* لو الشاشة قصيرة جداً قلل الهوامش */
@media (max-height: 760px) {
  .cc-smart-customer {
    padding: 6px !important;
    gap: 5px !important;
  }

  .cc-order-head.smart {
    padding: 7px 10px !important;
  }

  .cc-cart-header.smart {
    padding: 6px 9px !important;
  }

  .cc-order-options.smart {
    padding: 6px !important;
  }

  .cc-total-card.smart {
    padding: 6px 8px !important;
  }

  .cc-pay-box.smart {
    padding: 7px 8px !important;
  }

  .cc-grand-total {
    font-size: 15px !important;
  }
}

/* في الشاشات الضيقة لما الأوردر ينزل تحت المنيو */
@media (max-width: 1150px) {
  .cc-order-zone {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .cc-order-card,
  .cc-order-card.smart {
    height: auto !important;
    max-height: none !important;
  }

  .cc-cart-list,
  .cc-cart-list.smart,
  .cc-cart-list.compact {
    max-height: 420px !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   PRO MAX UPGRADE — Dashboard + Menu Engineering 2.0
   Added: 2026-05-06
═══════════════════════════════════════════════════════════════ */
.cmx-section{margin-bottom:14px}.cmx-hero{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 20px;border-radius:18px;border:1px solid var(--bdr2);box-shadow:var(--shadow);margin-bottom:10px;background:linear-gradient(135deg,rgba(37,99,235,.10),rgba(255,255,255,.92))}.cmx-hero.cmx-success{background:linear-gradient(135deg,rgba(5,150,105,.14),#fff)}.cmx-hero.cmx-warning{background:linear-gradient(135deg,rgba(245,158,11,.16),#fff)}.cmx-hero.cmx-danger{background:linear-gradient(135deg,rgba(220,38,38,.14),#fff)}.cmx-kicker{font-size:10px;font-family:var(--fm);letter-spacing:.7px;text-transform:uppercase;color:var(--text3);font-weight:800}.cmx-hero-title{font-size:21px;font-weight:900;color:var(--text);line-height:1.2}.cmx-hero-sub{font-size:12px;color:var(--text2);margin-top:4px}.cmx-score{width:84px;height:84px;border-radius:24px;background:#fff;border:1px solid var(--bdr2);display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:var(--shadow2);flex-shrink:0}.cmx-score b{font-family:var(--fd);font-size:30px;line-height:1;color:var(--blue)}.cmx-score span{font-size:10px;color:var(--text3);font-family:var(--fm)}.cmx-decision-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-bottom:10px}.cmx-decision-card{border:1px solid var(--bdr2);border-radius:16px;background:#fff;padding:14px;text-align:right;cursor:pointer;transition:all .18s;display:grid;grid-template-columns:auto 1fr;gap:4px 10px;align-items:center;box-shadow:var(--shadow);font-family:var(--f)}.cmx-decision-card:hover{transform:translateY(-2px);box-shadow:var(--shadow2);border-color:var(--bdr3)}.cmx-decision-card span{font-size:24px;grid-row:1/4}.cmx-decision-card b{font-size:24px;font-family:var(--fd);line-height:1;color:var(--text)}.cmx-decision-card em{font-style:normal;font-size:12px;font-weight:800;color:var(--text)}.cmx-decision-card small{font-size:10px;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cmx-decision-card.cmx-danger{background:linear-gradient(135deg,var(--redb),#fff)}.cmx-decision-card.cmx-warning{background:linear-gradient(135deg,var(--amberb),#fff)}.cmx-decision-card.cmx-success{background:linear-gradient(135deg,var(--greenb),#fff)}.cmx-decision-card.cmx-gold{background:linear-gradient(135deg,var(--goldb),#fff)}.cmx-next-action{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-radius:14px;border:1px solid var(--bdr2);background:#fff;box-shadow:var(--shadow);margin-bottom:14px}.cmx-next-action span{font-weight:900}.cmx-next-action.cmx-danger{border-color:rgba(220,38,38,.2);background:var(--redb)}.cmx-next-action.cmx-warning{border-color:rgba(217,119,6,.2);background:var(--amberb)}.cmx-next-action.cmx-success{border-color:rgba(5,150,105,.2);background:var(--greenb)}.cmx-modal{max-width:920px!important;max-height:90vh;overflow:auto}.cmx-item-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px;border-radius:16px;border:1px solid var(--bdr2);margin-bottom:12px}.cmx-item-head p{margin-top:3px;color:var(--text2);font-size:12px}.cmx-item-head>span{font-family:var(--fm);font-size:11px;font-weight:900;padding:5px 9px;border-radius:999px;background:#fff;border:1px solid var(--bdr2)}.cmx-item-head.cmx-danger{background:var(--redb)}.cmx-item-head.cmx-warning{background:var(--amberb)}.cmx-item-head.cmx-success{background:var(--greenb)}.cmx-mini-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}.cmx-mini{padding:11px 12px;background:var(--bg3);border:1px solid var(--bdr2);border-radius:14px}.cmx-mini small{display:block;font-size:10px;color:var(--text3);margin-bottom:3px}.cmx-mini b{font-family:var(--fd);font-size:15px;color:var(--text)}.cmx-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;background:#fff;border:1px solid var(--bdr2);border-radius:16px;padding:10px 12px;margin-bottom:14px;box-shadow:var(--shadow)}.cmx-me-header{background:linear-gradient(135deg,rgba(184,146,42,.10),rgba(37,99,235,.06));border:1px solid var(--bdr2);border-radius:18px;padding:16px;margin-bottom:14px}.cmx-kpi-row{margin-bottom:14px}.cmx-matrix2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.cmx-quad{min-height:260px;border:1px solid var(--bdr2);border-radius:18px;padding:14px;background:#fff;box-shadow:var(--shadow)}.cmx-quad-title{display:flex;align-items:flex-start;justify-content:space-between;border-bottom:1px solid var(--bdr);padding-bottom:10px;margin-bottom:10px}.cmx-quad-title b{font-size:15px}.cmx-quad-title small{font-size:10px;color:var(--text3);max-width:140px;text-align:left}.cmx-quad button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;border:0;background:var(--bg3);border-radius:12px;padding:9px 10px;margin-bottom:6px;cursor:pointer;font-family:var(--f);transition:all .15s}.cmx-quad button:hover{transform:translateX(-3px);background:#fff;box-shadow:var(--shadow)}.cmx-quad button span{font-size:12px;font-weight:800;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cmx-quad button em{font-style:normal;font-size:10px;font-family:var(--fm);color:var(--text3)}.cmx-quad.cmx-star{background:linear-gradient(135deg,var(--goldb),#fff)}.cmx-quad.cmx-plowhorse{background:linear-gradient(135deg,var(--blueb),#fff)}.cmx-quad.cmx-puzzle{background:linear-gradient(135deg,var(--purpleb),#fff)}.cmx-quad.cmx-dog{background:linear-gradient(135deg,var(--redb),#fff)}.cmx-bar-row{display:grid;grid-template-columns:minmax(120px,1fr) 2fr auto;gap:10px;align-items:center;padding:9px;border-radius:12px;cursor:pointer}.cmx-bar-row:hover{background:var(--bg3)}.cmx-bar-row span{font-size:12px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cmx-bar-row div{height:8px;background:var(--bg4);border-radius:999px;overflow:hidden}.cmx-bar-row i{display:block;height:100%;background:var(--blueg);border-radius:999px}.cmx-bar-row b{font-size:11px;font-family:var(--fm);color:var(--text2)}
@media(max-width:900px){.cmx-matrix2{grid-template-columns:1fr}.cmx-hero{align-items:flex-start;flex-direction:column}.cmx-score{width:100%;height:62px;border-radius:16px}.cmx-toolbar{align-items:stretch}.cmx-next-action{align-items:flex-start;flex-direction:column}.cmx-bar-row{grid-template-columns:1fr}.cmx-decision-grid{grid-template-columns:1fr}}


/* ═════════ Smart PDF Export Modal ═════════ */
.smart-pdf-modal{max-width:760px;max-height:88vh;overflow-y:auto;}
.smart-pdf-note{background:linear-gradient(135deg,var(--blueb),var(--goldb2));border:1px solid var(--bdr2);border-radius:14px;padding:11px 13px;color:var(--text2);font-size:12px;margin-bottom:10px;}
.smart-pdf-meta{font-size:11px;color:var(--text3);margin-bottom:12px;}
.smart-pdf-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;}
.smart-pdf-card{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid var(--bdr2);border-radius:14px;background:var(--bg2);cursor:pointer;transition:all .18s;}
.smart-pdf-card:hover{transform:translateY(-1px);box-shadow:var(--shadow);border-color:var(--gold2);}
.smart-pdf-card.is-rec{background:linear-gradient(135deg,rgba(184,146,42,.09),rgba(37,99,235,.05));border-color:rgba(184,146,42,.28);}
.smart-pdf-card input{margin-top:3px;accent-color:var(--gold);}
.smart-pdf-card b{display:block;font-size:13px;color:var(--text);}
.smart-pdf-card small{display:block;font-size:11px;color:var(--text3);line-height:1.45;margin-top:2px;}

/* ═══════════════════════════════════════════════════════════════
   Offer PRO — Builder + Cards + Smart PDF
═══════════════════════════════════════════════════════════════ */
.offer-pro-head{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:12px;align-items:stretch}.offer-pro-stat{background:var(--bg2);border:1px solid var(--bdr2);border-radius:16px;padding:12px;box-shadow:var(--shadow)}.offer-pro-stat span{display:block;font-size:10px;color:var(--text3);font-weight:800}.offer-pro-stat b{display:block;font-size:23px;font-family:var(--fm);margin-top:3px;color:var(--text)}.offer-pro-stat.good b{color:var(--green)}.offer-pro-stat.gold b{color:var(--gold)}.offer-pro-stat.teal b{color:var(--teal)}.offer-pro-actions{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap;background:transparent}.offer-pro-card{border-radius:18px;box-shadow:var(--shadow);overflow:hidden}.offer-tags-row{margin-top:7px;display:flex;gap:5px;flex-wrap:wrap;align-items:center}.offer-cashier-toggle{display:inline-flex;align-items:center;gap:5px;font-size:10px;cursor:pointer;background:var(--bg3);padding:3px 9px;border-radius:999px;border:1px solid var(--bdr2);color:var(--text2);font-weight:800}.offer-cashier-toggle input{width:13px;height:13px}.offer-score{min-width:82px;border:1px solid;border-radius:16px;text-align:center;padding:8px 7px;background:var(--bg3);align-self:flex-start}.offer-score b{display:block;font-family:var(--fm);font-size:15px}.offer-score small{display:block;font-size:9px;font-weight:900;margin-top:2px}.offer-pro-price-grid{grid-template-columns:repeat(4,1fr)!important}.offer-company-line{margin:8px 0 6px;padding:7px 9px;border-radius:12px;background:var(--tealb);color:var(--teal);font-size:11px;font-weight:800;line-height:1.5}.offer-actions-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin-top:10px}.offer-picker-tools{display:grid;grid-template-columns:minmax(180px,1fr) 160px;gap:8px;margin-bottom:10px}.offer-item-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px;max-height:320px;overflow:auto;padding:2px}.offer-row-main{display:flex;align-items:center;gap:8px;min-width:0}.offer-row-name{font-size:12px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}.offer-row-meta{font-size:10px;color:var(--text3);font-family:var(--fm)}.offer-row-controls{display:flex;align-items:center;gap:4px}.offer-row-controls input{width:58px;text-align:center;padding:6px!important;font-size:12px!important}.offer-row-total{font-family:var(--fm);font-size:12px;color:var(--gold);font-weight:900;min-width:70px;text-align:left}.offer-company-preview{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:6px;background:var(--bg3);border:1px solid var(--bdr2);border-radius:14px;padding:10px;font-size:11px}.offer-company-preview b{color:var(--teal);grid-column:1/-1}.offer-company-preview span{font-family:var(--fm);font-weight:800;color:var(--text2)}.offer-company-preview.muted{display:block;color:var(--text3);font-family:var(--f)}@media(max-width:700px){.offer-picker-tools{grid-template-columns:1fr}.offer-pro-price-grid{grid-template-columns:repeat(2,1fr)!important}.offer-actions-row{grid-template-columns:1fr}.offer-sel-row{grid-template-columns:1fr!important}.offer-row-controls{justify-content:flex-start}}


/* ═══════════════════════════════════════════════════════════════
   COSTIX LOGIN - FULL RESPONSIVE FIX
   Mobile First Approach - Added: 2026-05-07
═══════════════════════════════════════════════════════════════ */

/* ────── GLOBAL SCROLL FIX ────── */
html, body {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  position: relative;
}

#main {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  height: 100vh;
  position: relative;
}

.page-area {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
  position: relative;
}

/* ────── MOBILE FIRST (0px - 767px) ────── */
@media (max-width: 767px) {
  /* إصلاح السايدبار والـ Main على الموبايل */
  #sidebar {
    width: 260px;
    transform: translateX(100%);
    transition: transform 0.3s ease;
  }

  #sidebar.open {
    transform: translateX(0);
  }

  #main {
    margin-right: 0 !important;
    width: 100% !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    height: 100vh;
    position: relative;
  }

  .page-area {
    padding: 16px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    height: auto;
    min-height: calc(100vh - 56px);
  }

  #topbar {
    padding: 0 16px !important;
  }

  /* Login Screen على الموبايل */
  #loginScreen.costix-login-screen {
    padding: 0 !important;
    height: 100vh;
    height: 100dvh;
  }

  .costix-login-shell {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto 1fr !important;
    height: 100vh !important;
    height: 100dvh !important;
    min-height: 100vh;
    border-radius: 0 !important;
    border: none !important;
  }

  /* Panel الأيمن (Brand) يروح فوق */
  .costix-brand-panel {
    order: 1 !important;
    padding: 16px 14px !important;
    gap: 14px !important;
    min-height: auto !important;
  }

  .costix-brand-logo {
    margin-bottom: 0 !important;
    gap: 10px !important;
  }

  .costix-brand-logo img {
    width: 50px !important;
    height: 50px !important;
  }

  .costix-brand-word {
    font-size: 20px !important;
  }

  .costix-brand-sub {
    font-size: 11px !important;
    margin-top: 3px !important;
  }

  .costix-brand-panel h2 {
    font-size: 16px !important;
    margin-bottom: 6px !important;
  }

  .costix-brand-line {
    width: 60px !important;
    height: 3px !important;
    margin-bottom: 12px !important;
  }

  .costix-brand-panel p {
    font-size: 12px !important;
    line-height: 1.6 !important;
  }

  /* إخفاء الـ Visual و Contact Card على الموبايل الصغير */
  .costix-visual,
  .costix-contact-card {
    display: none !important;
  }

  .costix-social {
    margin-top: 8px !important;
  }

  .costix-social-icons a {
    width: 32px !important;
    height: 32px !important;
    font-size: 14px !important;
  }

  .costix-copy {
    font-size: 10px !important;
    margin-top: 10px !important;
  }

  /* قسم اللوجين الرئيسي */
  .costix-login-main {
    order: 2 !important;
    padding: 20px 16px !important;
    border: none !important;
    overflow-y: auto;
  }

  .costix-login-card {
    width: 100% !important;
  }

  .costix-logo-center {
    margin-bottom: 20px !important;
  }

  .costix-logo-center img {
    width: 70px !important;
    height: 70px !important;
  }

  .costix-login-card h1 {
    font-size: 24px !important;
  }

  .costix-login-card .lead {
    font-size: 13px !important;
    margin: 10px 0 24px !important;
  }

  .costix-field {
    margin-bottom: 16px !important;
  }

  .costix-field label {
    font-size: 13px !important;
    margin-bottom: 7px !important;
  }

  .costix-input-wrap input {
    height: 50px !important;
    font-size: 14px !important;
    padding: 0 46px 0 40px !important;
  }

  .costix-inp-icon {
    right: 14px !important;
    font-size: 16px !important;
  }

  .costix-eye {
    left: 14px !important;
  }

  .costix-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
    margin-bottom: 18px !important;
  }

  .costix-login-btn {
    height: 52px !important;
    font-size: 15px !important;
  }

  .costix-secure {
    margin-top: 24px !important;
    padding-top: 20px !important;
  }

  .costix-secure-title {
    font-size: 14px !important;
  }

  .costix-secure p {
    font-size: 12px !important;
  }

  .costix-features {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }

  .costix-feature {
    padding: 10px 6px !important;
    font-size: 11px !important;
  }

  .costix-feature strong {
    font-size: 12px !important;
  }
}

/* ────── TABLET (768px - 1023px) ────── */
@media (min-width: 768px) and (max-width: 1023px) {
  #loginScreen.costix-login-screen {
    padding: 16px !important;
  }

  .costix-login-shell {
    grid-template-columns: 1fr 1.2fr !important;
    height: auto !important;
    min-height: 600px !important;
  }

  .costix-brand-panel {
    order: 2 !important;
    padding: 24px 18px !important;
    gap: 16px !important;
  }

  .costix-brand-logo img {
    width: 60px !important;
    height: 60px !important;
  }

  .costix-brand-word {
    font-size: 26px !important;
  }

  .costix-brand-panel h2 {
    font-size: 20px !important;
  }

  .costix-brand-line {
    width: 70px !important;
  }

  .costix-visual {
    display: block !important;
  }

  .costix-contact-card {
    display: none !important;
  }

  .costix-login-main {
    order: 1 !important;
    padding: 28px 20px !important;
    border-left: 1px solid rgba(123, 22, 232, 0.12) !important;
    border-right: none !important;
  }

  .costix-logo-center img {
    width: 80px !important;
    height: 80px !important;
  }

  .costix-login-card h1 {
    font-size: 32px !important;
  }

  .costix-input-wrap input {
    height: 54px !important;
  }

  .costix-features {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ────── DESKTOP SMALL (1024px - 1399px) ────── */
@media (min-width: 1024px) and (max-width: 1399px) {
  .costix-login-shell {
    grid-template-columns: minmax(240px, 0.8fr) minmax(380px, 1.4fr) minmax(280px, 1fr) !important;
  }

  .costix-brand-panel {
    padding: 22px 16px !important;
    gap: 18px !important;
  }

  .costix-brand-logo img {
    width: 66px !important;
    height: 66px !important;
  }

  .costix-brand-word {
    font-size: 32px !important;
  }

  .costix-brand-panel h2 {
    font-size: 24px !important;
  }

  .costix-chart {
    height: 100px !important;
  }

  .costix-contact-card {
    display: block !important;
  }

  .costix-login-main {
    padding: 28px 20px !important;
  }
}

/* ────── DESKTOP LARGE (1400px+) ────── */
@media (min-width: 1400px) {
  .costix-login-shell {
    grid-template-columns: minmax(280px, 0.88fr) minmax(430px, 1.45fr) minmax(330px, 1.05fr) !important;
  }

  .costix-brand-panel {
    padding: 24px 20px !important;
  }

  .costix-chart {
    height: 120px !important;
  }
}

/* ────── LANDSCAPE MOBILE FIX ────── */
@media (max-width: 900px) and (orientation: landscape) {
  .costix-login-shell {
    grid-template-columns: 1fr 1.3fr !important;
    height: auto !important;
  }

  .costix-brand-panel {
    padding: 16px 12px !important;
    gap: 10px !important;
  }

  .costix-brand-panel h2 {
    font-size: 16px !important;
  }

  .costix-brand-panel p {
    font-size: 12px !important;
  }

  .costix-visual,
  .costix-contact-card,
  .costix-social {
    display: none !important;
  }

  .costix-login-main {
    padding: 20px 16px !important;
  }

  .costix-secure {
    margin-top: 16px !important;
    padding-top: 16px !important;
  }

  .costix-features {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 6px !important;
  }

  .costix-feature {
    padding: 8px 6px !important;
    font-size: 10px !important;
  }
}

/* ────── VERY SMALL SCREENS (320px - 374px) ────── */
@media (max-width: 374px) {
  .costix-brand-panel {
    padding: 12px 10px !important;
  }

  .costix-brand-logo img {
    width: 42px !important;
    height: 42px !important;
  }

  .costix-brand-word {
    font-size: 18px !important;
  }

  .costix-login-main {
    padding: 16px 12px !important;
  }

  .costix-logo-center img {
    width: 60px !important;
    height: 60px !important;
  }

  .costix-login-card h1 {
    font-size: 20px !important;
  }

  .costix-input-wrap input {
    height: 48px !important;
    font-size: 13px !important;
  }

  .costix-login-btn {
    height: 48px !important;
    font-size: 14px !important;
  }

  .costix-features {
    grid-template-columns: 1fr !important;
  }
}
/* POS + Call Center delivery customer side panel */
.cc-pos-layout.delivery-mode {
  grid-template-columns: 300px minmax(0, 1fr) 390px !important;
}
.cc-customer-side-zone {
  position: sticky;
  top: 72px;
  max-height: calc(100vh - 92px);
  overflow: auto;
  min-width: 0;
}
.cc-customer-side.smart {
  border: 1px solid var(--bdr2);
  border-radius: 18px;
  box-shadow: var(--shadow);
  gap: 8px;
}
.cc-customer-side.smart .fi {
  width: 100%;
}
@media (max-width: 1200px) {
  .cc-pos-layout.delivery-mode {
    grid-template-columns: 1fr !important;
  }
  .cc-customer-side-zone {
    position: relative;
    top: auto;
    max-height: none;
  }
}
@media (max-width: 1100px) {
  .pos-delivery-layout.delivery-mode {
    grid-template-columns: 1fr !important;
    overflow: auto !important;
    height: auto !important;
  }
  #posDeliveryCustomerSide {
    order: -2;
    min-height: auto;
  }
}

/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE phase_cc_orders_light_saleslog_ui_20260528
   Workflow tabs + pending modal styled in the light SalesLog-like Call Center theme.
═══════════════════════════════════════════════════════════════ */
.cc-workflow-tabs{display:flex;gap:8px;align-items:center;flex-wrap:wrap;flex:1 1 100%;padding:4px 0}
.cc-workflow-tab{border:1px solid rgba(48,125,126,.20);background:#ffffff;color:#315f63;border-radius:999px;padding:8px 13px;font-family:var(--f);font-size:12px;font-weight:900;cursor:pointer;transition:.16s;box-shadow:0 7px 18px rgba(29,91,92,.06)}
.cc-workflow-tab:hover{border-color:rgba(48,125,126,.38);color:#307D7E;background:#ecfbfb;transform:translateY(-1px)}
.cc-workflow-tab.on{background:linear-gradient(135deg,#307D7E,#3B9C9C);border-color:transparent;color:#fff;box-shadow:0 10px 24px rgba(48,125,126,.24)}
.cc-workflow-badge{display:inline-flex;align-items:center;justify-content:center;min-width:90px;border:1px solid rgba(48,125,126,.16);border-radius:999px;padding:5px 10px;font-size:10px;font-weight:900;white-space:nowrap;background:#f5ffff;color:#123f46}
.cc-workflow-badge[data-status="pending"]{background:#fff6dd;color:#b88405;border-color:rgba(232,163,23,.24)}
.cc-workflow-badge[data-status="preparing"]{background:#f1ebff;color:#7C3AED;border-color:rgba(124,58,237,.18)}
.cc-workflow-badge[data-status="out_for_delivery"]{background:#e5f7ff;color:#0b7da0;border-color:rgba(14,165,233,.18)}
.cc-workflow-badge[data-status="delivered"]{background:#e5faef;color:#138b65;border-color:rgba(19,139,101,.18)}
.cc-next-btn{margin-top:5px;width:100%;justify-content:center;font-size:10px!important;padding:4px 7px!important}
.costix-pending-mini-wrap{display:flex;align-items:center;margin-inline-end:auto}
.costix-pending-mini{border:1px solid rgba(232,163,23,.28);background:#fff7dd;color:#b88405;border-radius:999px;padding:6px 11px;font-family:var(--f);font-size:11px;font-weight:900;cursor:pointer;white-space:nowrap;box-shadow:0 8px 18px rgba(184,146,42,.10)}
.costix-pending-mini:hover{background:#fff0bd;transform:translateY(-1px)}
.costix-pending-mini-modal{max-width:520px!important;padding:18px!important;border-radius:22px!important;background:#f8ffff!important;border:1px solid rgba(48,125,126,.20)!important}
.costix-pending-mini-list{display:flex;flex-direction:column;gap:8px;max-height:54vh;overflow:auto;padding:2px}
.costix-pending-mini-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;border:1px solid rgba(48,125,126,.16);background:#fff;border-radius:15px;padding:10px;box-shadow:0 8px 18px rgba(29,91,92,.06)}
.costix-pending-mini-row b{display:block;font-family:var(--fm);color:#123f46;font-size:12px}.costix-pending-mini-row small{display:block;color:#6d8b8e;font-size:10px;line-height:1.45}
.costix-pending-mini-actions{display:flex;gap:5px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:620px){.cc-workflow-tabs{overflow:auto;flex-wrap:nowrap}.cc-workflow-tab{flex:0 0 auto}.costix-pending-mini-row{grid-template-columns:1fr}.costix-pending-mini-actions{justify-content:flex-start}}

/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE phase5_pending_badge_mount_clean_20260519
   Clean relocation only: pending mini badge beside Call Center daily KPI and POS Audit Log.
   No sync, storage, numbering, or workflow architecture change.
═══════════════════════════════════════════════════════════════ */
.costix-pending-mini-card{
  min-height:72px;
  align-self:stretch;
}
.costix-pending-mini-card .cc-stat-value.small{
  font-size:12px!important;
  line-height:1.2!important;
}
.costix-pending-mini-card .costix-pending-mini{
  padding:6px 12px;
  font-size:11px;
}
.costix-pos-audit-actions{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.costix-pos-audit-actions .costix-pending-mini{
  padding:5px 10px;
  font-size:11px;
}
@media(max-width:640px){
  .costix-pos-audit-actions{width:100%;justify-content:flex-start;}
  .costix-pending-mini-card{min-height:auto;}
}

/* COSTIX_LAST_UPDATE phase6_pending_modal_always_visible_20260519 */
.costix-pending-mini.is-empty{opacity:.78;background:rgba(107,114,128,.08)!important;border-color:rgba(107,114,128,.2)!important;color:var(--text2)!important}
.costix-pending-mini-card .cc-stat-value.small{font-size:13px!important;line-height:1.2!important}
.costix-pending-mini-card{cursor:default}

/* COSTIX_LAST_UPDATE phase7_pending_badge_callcenter_toolbar_mount_20260519 */
.costix-pending-mini-inline{display:inline-flex;align-items:center;vertical-align:middle}
.cc-toolbar-actions .costix-pending-mini-inline{margin-inline-start:6px}
.cc-toolbar-actions .costix-pending-mini{min-height:32px;padding:5px 10px}
.costix-pos-audit-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.costix-pos-audit-actions .costix-pending-mini-inline{display:inline-flex}
.costix-pending-mini-callcenter-toolbar .costix-pending-mini,
.costix-pending-mini-pos-audit .costix-pending-mini{font-size:11px;line-height:1;box-shadow:none}

/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE phase_dashboard_deep_clean_20260528
   Dashboard deep clean: centralized shell/control/modal styles.
   No sync/realtime/storage/cache behavior changed.
═══════════════════════════════════════════════════════════════ */
.dsh-header-actions{display:flex;gap:8px;flex-wrap:wrap}
.dsh-quick-btn{font-size:11px!important}
.dsh-mini-btn{font-size:10px!important}
.dsh-mini-actions{display:flex;gap:4px;flex-wrap:wrap}
.dsh-section-gap{margin-bottom:14px}
.dsh-panel-sub{font-size:10px;color:var(--text3);margin-top:2px}
.dsh-no-pad{padding:0!important}
.dsh-filter-dirty{display:none;align-items:center;gap:5px;border:1px solid rgba(245,158,11,.28);background:rgba(245,158,11,.12);color:var(--amber);border-radius:999px;padding:5px 9px;font-size:10px;font-weight:900;white-space:nowrap}
.dsh-target-empty{text-align:left;margin-bottom:10px}
.dsh-target-panel{padding:14px 16px!important;margin-bottom:14px!important}
.dsh-target-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;gap:10px}
.dsh-target-title{font-size:13px;font-weight:700}
.dsh-detail-modal{max-width:760px!important;max-height:90vh;overflow-y:auto}
.dsh-detail-modal-sm{max-width:560px!important}
.dsh-modal-title{display:flex;justify-content:space-between;gap:10px;align-items:center}
.dsh-modal-close{background:none;border:0;font-size:20px;cursor:pointer;color:var(--text3);line-height:1;padding:0 4px}
.dsh-modal-close:hover{color:var(--text)}
.dsh-clickable{cursor:pointer}
.dsh-cmx-action-panel{padding:12px;margin:12px 0}
.dsh-cmx-action-note{margin-top:6px;color:var(--text2)}
.dsh-cmx-action-buttons{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
@media(max-width:680px){.dsh-header-actions{width:100%;justify-content:flex-start}.dsh-target-head{align-items:flex-start;flex-direction:column}.dsh-mini-actions{width:100%}}

/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE phase_dashboard_intelligence_boards_20260528
   Dashboard intelligence boards: Executive Summary, Problems Board,
   Profit Leak, Branch Health, Sales Quality, Timeline, and One Screen.
   No sync/realtime/storage/cache behavior changed.
═══════════════════════════════════════════════════════════════ */
.dsh-intel-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0}
.dsh-intel-card,.dsh-health-card,.dsh-problem-card{border:1px solid var(--bdr2);background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.03));color:var(--text);border-radius:18px;padding:13px;text-align:right;cursor:pointer;box-shadow:0 10px 24px rgba(0,0,0,.08);transition:.16s;min-height:118px;display:flex;flex-direction:column;gap:5px;align-items:flex-start;justify-content:space-between;font-family:var(--f)}
.dsh-intel-card:hover,.dsh-health-card:hover,.dsh-problem-card:hover,.cmx-hero:hover,.cmx-next-action:hover{transform:translateY(-2px);border-color:rgba(184,146,42,.45);box-shadow:0 14px 30px rgba(0,0,0,.13)}
.dsh-intel-card span{font-size:22px}.dsh-intel-card b,.dsh-health-card b,.dsh-problem-card b{font-size:12px;font-weight:900}.dsh-intel-card strong,.dsh-health-card span,.dsh-problem-card strong{font-family:var(--fm);font-size:19px;font-weight:950;color:var(--gold3)}
.dsh-intel-card small,.dsh-health-card small,.dsh-problem-card small{font-size:10px;color:var(--text3);line-height:1.45}.dsh-info{border-color:rgba(59,130,246,.25)}.dsh-success{border-color:rgba(34,197,94,.28);background:linear-gradient(180deg,rgba(34,197,94,.11),rgba(255,255,255,.025))}.dsh-warning{border-color:rgba(245,158,11,.32);background:linear-gradient(180deg,rgba(245,158,11,.13),rgba(255,255,255,.025))}.dsh-danger{border-color:rgba(239,68,68,.35);background:linear-gradient(180deg,rgba(239,68,68,.13),rgba(255,255,255,.025))}
.dsh-board-split{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:10px 0 12px}.dsh-health-card{min-height:96px}.dsh-board-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:10px 0;color:var(--text)}.dsh-board-head b{font-size:15px}.dsh-board-head span{font-size:10px;color:var(--text3)}
.dsh-problems-board{border:1px solid rgba(239,68,68,.22);background:linear-gradient(180deg,rgba(239,68,68,.08),rgba(255,255,255,.025));border-radius:20px;padding:14px;margin:12px 0}.dsh-problem-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.dsh-problem-card{min-height:102px}.dsh-problem-card strong{font-size:16px}
.cmx-hero{cursor:pointer}.cmx-next-action{cursor:pointer}.dsh-modal-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:9px;margin:0 0 12px}.dsh-modal-note{font-size:12px;color:var(--text2);line-height:1.8;background:var(--bg3);border:1px solid var(--bdr2);border-radius:14px;padding:10px 12px}.dsh-timeline{display:flex;flex-direction:column;gap:8px}.dsh-time-row{border:1px solid var(--bdr2);background:var(--bg3);color:var(--text);border-radius:14px;padding:10px 12px;text-align:right;cursor:pointer;display:grid;grid-template-columns:70px 1fr;gap:4px 10px;font-family:var(--f)}.dsh-time-row span{font-size:10px;color:var(--text3);font-family:var(--fm)}.dsh-time-row b{font-size:12px}.dsh-time-row small{grid-column:2;color:var(--text3);font-size:10px}.dsh-time-row:hover{border-color:rgba(184,146,42,.4)}
@media(max-width:1150px){.dsh-intel-grid,.dsh-problem-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dsh-board-split{grid-template-columns:1fr}}
@media(max-width:640px){.dsh-intel-grid,.dsh-problem-grid{grid-template-columns:1fr}.dsh-time-row{grid-template-columns:1fr}.dsh-time-row small{grid-column:1}.dsh-intel-card,.dsh-health-card,.dsh-problem-card{min-height:auto}}

/* ═══════════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE phase_dashboard_clean_cockpit_rebuild_20260528
   Dashboard cockpit rebuild styles — centralized CSS only.
   ═══════════════════════════════════════════════════════════════════ */
:root{
  --dsh-bg:#f5fbfc;
  --dsh-card:#ffffff;
  --dsh-ink:#0f172a;
  --dsh-muted:#64748b;
  --dsh-line:#e5edf2;
  --dsh-teal:#12b8c6;
  --dsh-blue:#2563eb;
  --dsh-green:#16a34a;
  --dsh-amber:#f59e0b;
  --dsh-red:#ef4444;
  --dsh-purple:#7c3aed;
  --dsh-c1:#12b8c6;
  --dsh-c2:#e91e63;
  --dsh-c3:#6f42c1;
  --dsh-c4:#fbbf24;
}
#page-dash{background:var(--dsh-bg)!important; padding:18px!important; color:var(--dsh-ink);}
.dsh-cockpit{font-family:'Cairo',Tahoma,Arial,sans-serif; max-width:1780px; margin:auto; color:var(--dsh-ink);}
.dsh-topline{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 20px; background:linear-gradient(135deg,#ffffff 0%,#eefcff 100%); border:1px solid var(--dsh-line); border-radius:24px; box-shadow:0 14px 40px rgba(15,23,42,.06); margin-bottom:14px;}
.dsh-title-block h2{margin:0; font-size:30px; font-weight:900; color:#0f172a;}
.dsh-title-block p{margin:4px 0 0; color:var(--dsh-muted); font-size:14px;}
.dsh-eyebrow{font-size:12px; color:var(--dsh-teal); font-weight:900; letter-spacing:.04em;}
.dsh-top-actions{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.dsh-icon-btn,.dsh-primary-btn,.dsh-soft-btn,.dsh-link-btn{border:0; cursor:pointer; font-family:inherit; transition:.18s ease;}
.dsh-icon-btn{height:42px; padding:0 14px; border-radius:14px; background:#fff; border:1px solid var(--dsh-line); color:#0f172a; font-weight:800; box-shadow:0 8px 22px rgba(15,23,42,.04);}
.dsh-icon-btn:hover,.dsh-soft-btn:hover,.dsh-kpi-card:hover,.dsh-card button:hover{transform:translateY(-1px); box-shadow:0 14px 30px rgba(15,23,42,.10);}
.dsh-icon-btn.is-danger{background:#fff1f2; color:#be123c; border-color:#fecdd3;}
.dsh-icon-btn.is-active{background:#fff7ed; color:#c2410c; border-color:#fed7aa;}
.dsh-primary-btn{height:42px; padding:0 18px; border-radius:14px; background:linear-gradient(135deg,#06b6d4,#14b8a6); color:#fff; font-weight:900; box-shadow:0 12px 26px rgba(20,184,166,.28);}
.dsh-soft-btn{height:38px; padding:0 14px; border-radius:12px; background:#f8fafc; color:#0f172a; border:1px solid var(--dsh-line); font-weight:800;}
.dsh-filter-card{display:grid; grid-template-columns:minmax(220px,1.3fr) repeat(4,minmax(150px,1fr)) auto; gap:10px; background:#fff; border:1px solid var(--dsh-line); border-radius:22px; padding:14px; margin-bottom:14px; box-shadow:0 10px 30px rgba(15,23,42,.045); align-items:end;}
.dsh-filter-field{position:relative; display:flex; flex-direction:column; gap:5px;}
.dsh-filter-field label{font-size:12px; color:var(--dsh-muted); font-weight:900;}
.dsh-filter-field input,.dsh-filter-field select,.dsh-select-btn{height:42px; border-radius:13px; border:1px solid #d9e6ec; background:#fff; padding:0 12px; font-family:inherit; color:#0f172a; font-weight:700; width:100%;}
.dsh-select-btn{text-align:right; cursor:pointer;}
.dsh-branch-pop{display:none; position:absolute; z-index:30; top:70px; right:0; min-width:260px; max-height:320px; overflow:auto; background:#fff; border:1px solid var(--dsh-line); border-radius:16px; box-shadow:0 18px 45px rgba(15,23,42,.14); padding:10px;}
.dsh-branch-pop.open{display:block;}
.dsh-branch-pop label{display:flex; align-items:center; gap:8px; padding:8px; border-radius:10px; color:#0f172a; cursor:pointer;}
.dsh-branch-pop label:hover{background:#f1fbfd;}
.dsh-filter-actions{display:flex; gap:8px; flex-wrap:wrap; align-items:end;}
.dsh-tabbar{display:flex; gap:8px; margin:0 0 14px; background:#fff; border:1px solid var(--dsh-line); padding:8px; border-radius:18px; width:max-content; max-width:100%; overflow:auto;}
.dsh-tabbar button{border:0; background:transparent; color:#64748b; font-family:inherit; font-weight:900; padding:10px 16px; border-radius:13px; cursor:pointer; white-space:nowrap;}
.dsh-tabbar button.is-active{background:#e8fbff; color:#0284a6;}
.dsh-kpi-row{display:grid; grid-template-columns:repeat(5,minmax(160px,1fr)); gap:14px; margin-bottom:14px;}
.dsh-kpi-card{text-align:right; border:1px solid var(--dsh-line); background:#fff; border-radius:22px; padding:18px; min-height:138px; position:relative; overflow:hidden; box-shadow:0 12px 32px rgba(15,23,42,.055); cursor:pointer; font-family:inherit;}
.dsh-kpi-card:before{content:""; position:absolute; inset:auto -30px -42px auto; width:120px; height:120px; border-radius:50%; opacity:.14; background:currentColor;}
.dsh-kpi-card strong{display:block; font-size:26px; font-weight:950; margin:10px 0 4px; color:#0f172a;}
.dsh-kpi-title{font-size:13px; color:#64748b; font-weight:900;}
.dsh-kpi-card small{font-size:12px; color:#64748b; font-weight:800;}
.dsh-kpi-icon{position:absolute; left:16px; top:16px; width:44px; height:44px; border-radius:16px; display:grid; place-items:center; background:#f8fafc; font-size:22px;}
.dsh-kpi-card.teal{color:var(--dsh-teal)} .dsh-kpi-card.green{color:var(--dsh-green)} .dsh-kpi-card.blue{color:var(--dsh-blue)} .dsh-kpi-card.amber{color:var(--dsh-amber)} .dsh-kpi-card.red{color:var(--dsh-red)}
.dsh-main-grid{display:grid; grid-template-columns:320px 1fr 330px; gap:14px; margin-bottom:14px;}
.dsh-small-grid{display:grid; grid-template-columns:repeat(4,minmax(220px,1fr)); gap:14px; margin-bottom:14px;}
.dsh-card{background:#fff; border:1px solid var(--dsh-line); border-radius:22px; padding:16px; box-shadow:0 12px 32px rgba(15,23,42,.055); min-width:0;}
.dsh-card-head{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px;}
.dsh-card-head h3{margin:0; font-size:16px; font-weight:950; color:#0f172a;}
.dsh-card-head span,.dsh-card-head button{font-size:12px; color:var(--dsh-muted); background:#f8fafc; border:1px solid var(--dsh-line); border-radius:999px; padding:6px 10px; font-weight:900;}
.dsh-problem-list{display:flex; flex-direction:column; gap:8px;}
.dsh-problem-row{display:grid; grid-template-columns:28px 1fr 18px; gap:8px; align-items:center; border:1px solid #eef2f7; background:#fff; border-radius:15px; padding:10px; text-align:right; cursor:pointer; font-family:inherit;}
.dsh-problem-row b{font-size:13px; color:#0f172a;}
.dsh-problem-row small{grid-column:2; color:#64748b; font-size:11px;}
.dsh-problem-row.critical{border-color:#fecdd3; background:#fff8f8;}
.dsh-problem-row.warn{border-color:#fed7aa; background:#fffaf4;}
.dsh-link-btn{margin-top:12px; background:transparent; color:#0891b2; font-weight:950;}
.dsh-line-chart{height:264px; position:relative; border-radius:18px; background:linear-gradient(#fff,#fbfdff); border:1px solid #edf4f7; overflow:hidden; padding:12px; cursor:pointer;}
.dsh-line-chart:before{content:""; position:absolute; inset:12px; background-image:linear-gradient(#e8eef3 1px,transparent 1px),linear-gradient(90deg,#e8eef3 1px,transparent 1px); background-size:100% 20%,8.33% 100%; opacity:.8;}
.dsh-line-chart svg{position:absolute; inset:16px 16px 34px 16px; width:calc(100% - 32px); height:calc(100% - 50px); overflow:visible;}
.dsh-line-chart polyline{fill:none; stroke:#06b6d4; stroke-width:3; vector-effect:non-scaling-stroke; filter:drop-shadow(0 4px 8px rgba(6,182,212,.22));}
.dsh-chart-labels{position:absolute; right:20px; left:20px; bottom:8px; height:18px; color:#64748b; font-size:11px;}
.dsh-chart-labels span{position:absolute; transform:translateX(50%);}
.dsh-donut-wrap{display:grid; grid-template-columns:150px 1fr; gap:12px; align-items:center; min-height:250px; cursor:pointer;}
.dsh-donut{width:150px; height:150px; border-radius:50%; display:grid; place-items:center; position:relative; margin:auto;}
.dsh-donut:after{content:""; width:72px; height:72px; border-radius:50%; background:#fff; position:absolute;}
.dsh-donut span{position:relative; z-index:1; font-weight:950; color:#0f172a;}
.dsh-donut-legend{display:flex; flex-direction:column; gap:8px;}
.dsh-donut-legend button{display:grid; grid-template-columns:14px 1fr auto; align-items:center; gap:8px; border:0; background:#f8fafc; border-radius:12px; padding:8px; font-family:inherit; text-align:right; cursor:pointer;}
.dsh-donut-legend i{width:10px; height:10px; border-radius:50%;}
.dsh-donut-legend b{font-size:12px; color:#0f172a;}
.dsh-mini-list{display:flex; flex-direction:column; gap:6px;}
.dsh-mini-list button{display:grid; grid-template-columns:28px 1fr auto; gap:8px; align-items:center; border:0; background:#fbfdff; border-radius:13px; padding:10px; text-align:right; cursor:pointer; font-family:inherit; border:1px solid #edf4f7;}
.dsh-mini-list span{width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:#e8fbff; color:#0891b2; font-weight:950;}
.dsh-mini-list b{font-size:13px; color:#0f172a; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.dsh-mini-list small{color:#64748b; font-size:11px;}
.dsh-mini-list strong{font-size:12px; color:#0f172a;}
.dsh-problems-board,.dsh-analytics-grid,.dsh-tables-grid{margin-bottom:14px;}
.dsh-section-title{background:#fff; border:1px solid var(--dsh-line); border-radius:20px; padding:16px; margin-bottom:12px;}
.dsh-section-title h3{margin:0; font-weight:950;}
.dsh-section-title p{margin:4px 0 0; color:#64748b;}
.dsh-problem-grid{display:grid; grid-template-columns:repeat(3,minmax(220px,1fr)); gap:14px;}
.dsh-problem-tile{min-height:180px; border:1px solid var(--dsh-line); border-radius:22px; background:#fff; padding:18px; text-align:right; cursor:pointer; font-family:inherit; box-shadow:0 12px 32px rgba(15,23,42,.055);}
.dsh-problem-tile.critical{border-color:#fecdd3; background:linear-gradient(180deg,#fff,#fff5f6);} .dsh-problem-tile.warn{border-color:#fed7aa; background:linear-gradient(180deg,#fff,#fffaf4);}
.dsh-problem-tile span{font-size:24px;} .dsh-problem-tile h4{margin:8px 0; font-size:16px; font-weight:950;} .dsh-problem-tile p{color:#64748b; margin:0 0 10px; min-height:42px;} .dsh-problem-tile strong{display:block; font-size:18px;} .dsh-problem-tile small{display:block; color:#64748b; margin-top:8px;}
.dsh-analytics-grid{display:grid; grid-template-columns:1fr 360px; gap:14px;}
.dsh-analytics-grid .wide{min-height:330px;}
.dsh-bars{display:flex; flex-direction:column; gap:9px;}
.dsh-bars button{display:grid; grid-template-columns:150px 1fr 95px; align-items:center; gap:10px; border:0; background:transparent; font-family:inherit; cursor:pointer; text-align:right;}
.dsh-bars span{font-size:12px; font-weight:900; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.dsh-bars div{height:14px; background:#edf5f8; border-radius:999px; overflow:hidden;}
.dsh-bars i{display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,#14b8a6,#06b6d4);}
.dsh-bars i.neg{background:linear-gradient(90deg,#fb7185,#ef4444);}
.dsh-bars b{font-size:12px; color:#0f172a;}
.dsh-tables-grid{display:grid; grid-template-columns:repeat(3,minmax(260px,1fr)); gap:14px;}
.dsh-table-wrap{overflow:auto; max-height:420px; border:1px solid #edf4f7; border-radius:16px;}
.dsh-table-wrap table{width:100%; border-collapse:collapse; min-width:520px;}
.dsh-table-wrap th,.dsh-table-wrap td{padding:10px 12px; border-bottom:1px solid #edf4f7; font-size:12px; text-align:right;}
.dsh-table-wrap th{position:sticky; top:0; background:#f8fafc; color:#475569; font-weight:950; z-index:1;}
.dsh-table-wrap td{color:#0f172a;}
.dsh-bottom-actions{display:flex; align-items:center; justify-content:flex-end; gap:10px; background:#fff; border:1px solid var(--dsh-line); border-radius:18px; padding:12px; color:#64748b; font-size:12px;}
.dsh-empty{padding:18px; text-align:center; color:#64748b; background:#f8fafc; border-radius:16px; font-weight:800;}
.dsh-empty.big{grid-column:1/-1; padding:50px;}
.dsh-modal-backdrop{display:none; position:fixed; inset:0; z-index:99999; background:rgba(15,23,42,.45); backdrop-filter:blur(6px); padding:28px; align-items:center; justify-content:center;}
.dsh-modal-backdrop.open{display:flex;}
.dsh-modal-card{position:relative; width:min(1100px,96vw); max-height:90vh; overflow:auto; background:#fff; border-radius:24px; padding:22px; box-shadow:0 30px 80px rgba(15,23,42,.3);}
.dsh-modal-close{position:absolute; left:16px; top:14px; width:36px; height:36px; border:0; border-radius:12px; background:#f1f5f9; cursor:pointer; font-size:22px;}
.dsh-modal-title h2{margin:0 0 16px; font-size:22px; font-weight:950;}
.dsh-detail-hero{border:1px solid var(--dsh-line); border-radius:20px; padding:18px; background:linear-gradient(135deg,#f8feff,#fff); margin-bottom:12px;}
.dsh-detail-hero.critical{background:#fff5f6; border-color:#fecdd3;} .dsh-detail-hero.warn{background:#fffaf4; border-color:#fed7aa;}
.dsh-detail-hero h3{margin:0 0 8px; font-weight:950;} .dsh-detail-hero p{margin:0 0 8px; color:#64748b;}
.dsh-detail-grid{display:grid; grid-template-columns:repeat(4,minmax(140px,1fr)); gap:10px; margin-bottom:12px;}
.dsh-detail-grid div{background:#f8fafc; border:1px solid #edf4f7; border-radius:16px; padding:14px;}
.dsh-detail-grid span{display:block; color:#64748b; font-size:12px; font-weight:900;} .dsh-detail-grid b{display:block; font-size:18px; margin-top:6px;}
.dsh-compact-mode #dsh_analytics,.dsh-compact-mode #dsh_tables,.dsh-compact-mode .dsh-bottom-actions{display:none!important;}
.dsh-compact-mode .dsh-main-grid{grid-template-columns:320px 1fr 320px;}
.dsh-compact-mode .dsh-small-grid{grid-template-columns:repeat(4,1fr);}
.dsh-problems-mode #dsh_executive,.dsh-problems-mode #dsh_analytics,.dsh-problems-mode #dsh_tables{display:none!important;}
@media(max-width:1200px){.dsh-filter-card{grid-template-columns:repeat(3,1fr)}.dsh-kpi-row{grid-template-columns:repeat(3,1fr)}.dsh-main-grid{grid-template-columns:1fr}.dsh-small-grid{grid-template-columns:repeat(2,1fr)}.dsh-analytics-grid{grid-template-columns:1fr}.dsh-tables-grid{grid-template-columns:1fr}.dsh-problem-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){#page-dash{padding:10px!important}.dsh-topline{align-items:flex-start; flex-direction:column}.dsh-top-actions{width:100%}.dsh-icon-btn,.dsh-primary-btn{flex:1}.dsh-filter-card{grid-template-columns:1fr}.dsh-kpi-row{grid-template-columns:1fr}.dsh-small-grid{grid-template-columns:1fr}.dsh-problem-grid{grid-template-columns:1fr}.dsh-donut-wrap{grid-template-columns:1fr}.dsh-bars button{grid-template-columns:1fr}.dsh-detail-grid{grid-template-columns:1fr}.dsh-tabbar{width:100%}}

/* COSTIX_LAST_UPDATE: dashboard_hourly_multibranch_modal_filter_polish_20260527 */
/* COSTIX_LAST_UPDATE: 2026-05-27 dashboard_branch_filter_real_premium_rebuild
   Replaces old raw checkbox branch picker with one clean premium multi-select component. */
.dsh-branches-field{min-width:300px; z-index:35}
.dsh-branch-select-btn{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto 34px;
  gap:12px;
  align-items:center;
  min-height:54px;
  height:auto!important;
  min-width:320px;
  padding:9px 12px!important;
  text-align:right;
  background:linear-gradient(135deg,#ffffff 0%,#f0fdff 52%,#ecfeff 100%)!important;
  border:1px solid #a7e8f2!important;
  box-shadow:inset 0 0 0 1px rgba(20,184,166,.08),0 14px 34px rgba(8,145,178,.12)!important;
}
.dsh-branch-select-btn:hover{border-color:#22c7da!important; transform:translateY(-1px); box-shadow:inset 0 0 0 1px rgba(20,184,166,.12),0 18px 42px rgba(8,145,178,.18)!important}
.dsh-branch-select-main{min-width:0; display:flex; flex-direction:column; gap:2px; line-height:1.2}
.dsh-branch-select-main strong,.dsh-branch-summary-text{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#0f172a; font-weight:950; font-size:13px}
.dsh-branch-select-main small{color:#64748b; font-size:10px; font-weight:900; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.dsh-branch-selected-chips{display:flex; align-items:center; gap:5px; min-width:0; max-width:260px; overflow:hidden}
.dsh-branch-chip{display:inline-flex; align-items:center; gap:5px; max-width:92px; height:24px; padding:0 8px; border-radius:999px; background:#f8fafc; border:1px solid #dceff3; color:#0f172a; font-size:10px; font-weight:950; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; box-shadow:0 6px 16px rgba(15,23,42,.06)}
.dsh-branch-chip i{width:7px; height:7px; border-radius:50%; flex:0 0 auto; background:var(--dsh-c1); box-shadow:0 0 0 3px rgba(18,184,198,.12)}
.dsh-branch-chip[style*="--bi:2"] i{background:var(--dsh-c2)}
.dsh-branch-chip[style*="--bi:3"] i{background:var(--dsh-c3)}
.dsh-branch-chip[style*="--bi:4"] i{background:var(--dsh-c4)}
.dsh-branch-chip[style*="--bi:5"] i{background:#22c55e}
.dsh-branch-chip[style*="--bi:6"] i{background:#f97316}
.dsh-branch-chip-more{justify-content:center; min-width:34px; background:#0f172a; color:#fff; border-color:#0f172a}
.dsh-branch-count{min-width:32px; height:32px; border-radius:13px; display:grid; place-items:center; background:linear-gradient(135deg,#0891b2,#14b8a6); color:#fff; font-size:13px; font-weight:950; box-shadow:0 10px 20px rgba(20,184,166,.25)}
.dsh-branch-pop{
  min-width:380px;
  max-width:min(460px,calc(100vw - 30px));
  max-height:430px;
  padding:14px;
  top:78px;
  border:1px solid #a7e8f2;
  border-radius:22px;
  background:linear-gradient(180deg,#ffffff 0%,#f8feff 100%);
  box-shadow:0 28px 70px rgba(8,145,178,.22),0 6px 18px rgba(15,23,42,.08);
  overflow:hidden;
}
.dsh-branch-pop.open{display:block; animation:dshBranchPop .14s ease-out}
@keyframes dshBranchPop{from{opacity:0; transform:translateY(-6px) scale(.98)}to{opacity:1; transform:translateY(0) scale(1)}}
.dsh-branch-pop-head{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:4px 4px 12px; border-bottom:1px solid #dff5f8; margin-bottom:10px}
.dsh-branch-pop-head div{display:flex; flex-direction:column; gap:2px}
.dsh-branch-pop-head strong{font-size:14px; font-weight:950; color:#0f172a}
.dsh-branch-pop-head small{font-size:10px; font-weight:900; color:#64748b}
.dsh-branch-pop-head button{border:0; border-radius:999px; background:linear-gradient(135deg,#e6fbff,#dffbf2); color:#027f92; padding:8px 13px; font-family:inherit; font-size:11px; font-weight:950; cursor:pointer; box-shadow:0 8px 18px rgba(8,145,178,.10)}
.dsh-branch-pop-head button:hover{background:linear-gradient(135deg,#cffafe,#ccfbf1)}
.dsh-branch-options{display:flex; flex-direction:column; gap:8px; max-height:330px; overflow:auto; padding:2px 2px 4px; scrollbar-width:thin; scrollbar-color:#99e4ef #eefcff}
.dsh-branch-option{display:grid!important; grid-template-columns:24px 14px minmax(0,1fr); align-items:center; gap:10px; padding:11px 12px!important; margin:0; border-radius:16px!important; border:1px solid transparent!important; background:#ffffff; color:#0f172a!important; cursor:pointer; font-weight:900; box-shadow:0 6px 18px rgba(15,23,42,.04); transition:.16s ease}
.dsh-branch-option:hover{background:#f0fdff!important; border-color:#c4eef5!important; transform:translateY(-1px)}
.dsh-branch-option input{position:absolute; opacity:0; pointer-events:none; width:1px; height:1px; margin:0}
.dsh-branch-check{width:24px; height:24px; border-radius:9px; border:2px solid #b6dce4; background:#fff; display:grid; place-items:center; box-shadow:inset 0 0 0 3px rgba(255,255,255,.9)}
.dsh-branch-check:after{content:'✓'; opacity:0; transform:scale(.7); color:#fff; font-size:14px; font-weight:950; line-height:1; transition:.12s ease}
.dsh-branch-dot{width:12px; height:12px; border-radius:50%; background:var(--dsh-c1); box-shadow:0 0 0 5px rgba(18,184,198,.12)}
.dsh-branch-option[style*="--bi:2"] .dsh-branch-dot{background:var(--dsh-c2)}
.dsh-branch-option[style*="--bi:3"] .dsh-branch-dot{background:var(--dsh-c3)}
.dsh-branch-option[style*="--bi:4"] .dsh-branch-dot{background:var(--dsh-c4)}
.dsh-branch-option[style*="--bi:5"] .dsh-branch-dot{background:#22c55e}
.dsh-branch-option[style*="--bi:6"] .dsh-branch-dot{background:#f97316}
.dsh-branch-option-text{min-width:0; display:flex; flex-direction:column; gap:2px}
.dsh-branch-option-text strong{font-size:13px; font-weight:950; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.dsh-branch-option-text small{font-size:10px; font-weight:850; color:#64748b}
.dsh-branch-option:has(input:checked){background:linear-gradient(135deg,#ecfeff,#f0fdfa)!important; border-color:#8fe3ed!important; box-shadow:0 12px 28px rgba(8,145,178,.12)}
.dsh-branch-option:has(input:checked) .dsh-branch-check{border-color:#0891b2; background:linear-gradient(135deg,#0891b2,#14b8a6)}
.dsh-branch-option:has(input:checked) .dsh-branch-check:after{opacity:1; transform:scale(1)}
.dsh-chart-labels.full-hours{right:14px; left:14px; font-size:9px; direction:ltr}
.dsh-chart-labels.full-hours span{transform:translateX(50%); color:#64748b; font-weight:800}
.dsh-line-chart polyline.dsh-line-s1{stroke:var(--dsh-c1)}
.dsh-line-chart polyline.dsh-line-s2{stroke:var(--dsh-c2)}
.dsh-line-chart polyline.dsh-line-s3{stroke:var(--dsh-c3)}
.dsh-line-chart polyline.dsh-line-s4{stroke:var(--dsh-c4)}
.dsh-line-chart polyline.dsh-line-s5{stroke:#22c55e}
.dsh-line-chart polyline.dsh-line-s6{stroke:#f97316}
.dsh-chart-legend{position:absolute; top:12px; right:14px; left:14px; display:flex; gap:8px; flex-wrap:wrap; z-index:3; pointer-events:none}
.dsh-chart-legend span{font-size:11px; color:#334155; font-weight:950; background:rgba(255,255,255,.84); border:1px solid #e2edf2; border-radius:999px; padding:4px 8px; margin-inline-start:-6px}
.dsh-line-key{width:18px; height:4px; border-radius:999px; align-self:center; background:var(--dsh-c1); margin-inline-start:6px}
.dsh-line-key-2{background:var(--dsh-c2)} .dsh-line-key-3{background:var(--dsh-c3)} .dsh-line-key-4{background:var(--dsh-c4)} .dsh-line-key-5{background:#22c55e} .dsh-line-key-6{background:#f97316}
.dsh-modal-backdrop.dsh-modal-problem .dsh-modal-card,.dsh-modal-backdrop.dsh-modal-losers .dsh-modal-card{background:linear-gradient(180deg,#fff,#fff7f8)}
.dsh-modal-backdrop.dsh-modal-branch .dsh-modal-card,.dsh-modal-backdrop.dsh-modal-hours .dsh-modal-card{background:linear-gradient(180deg,#ffffff,#f0fdff)}
.dsh-modal-backdrop.dsh-modal-expenses .dsh-modal-card,.dsh-modal-backdrop.dsh-modal-discount .dsh-modal-card{background:linear-gradient(180deg,#ffffff,#fffbeb)}
.modal-table table{border-spacing:0; overflow:hidden}
.modal-table th{background:#0f766e!important; color:#fff!important; border-color:rgba(255,255,255,.14)!important}
.modal-table td{background:#ffffff}
.modal-table tbody tr:nth-child(even) td{background:#f8fafc}
.modal-table tbody tr:hover td{background:#e8fbff!important}
.modal-table-hours th{background:#0369a1!important}.modal-table-hours tbody tr:hover td{background:#eff6ff!important}
.modal-table-channels th{background:#7c3aed!important}.modal-table-channels tbody tr:hover td{background:#f5f3ff!important}
.modal-table-stock th{background:#b45309!important}.modal-table-stock tbody tr:hover td{background:#fffbeb!important}
.dsh-detail-hero.channel{background:linear-gradient(135deg,#f5f3ff,#fff); border-color:#ddd6fe}
@media(max-width:760px){.dsh-chart-labels.full-hours span{font-size:8px}.dsh-branch-pop{min-width:min(330px,92vw)}}

/* COSTIX_LAST_UPDATE: branch_compare_cockpit_rebuild_20260528_0145 */
/* Branch Intelligence Center — clean branch comparison UI */
.cbp-page{direction:rtl;background:linear-gradient(180deg,#f7fdff 0%,#eef8fb 100%);min-height:100%;padding:18px;color:#0f172a;font-family:Cairo,system-ui,sans-serif}.cbp-wrap{max-width:1560px;margin:0 auto;display:flex;flex-direction:column;gap:16px}.cbp-hero,.cbp-filters,.cbp-card,.cbp-kpi{background:rgba(255,255,255,.92);border:1px solid rgba(14,165,183,.16);box-shadow:0 14px 36px rgba(15,23,42,.06);border-radius:24px}.cbp-hero{padding:22px;display:flex;justify-content:space-between;gap:20px;align-items:center;background:linear-gradient(135deg,rgba(236,254,255,.96),rgba(255,255,255,.96))}.cbp-eyebrow{font-size:11px;color:#0891b2;font-weight:900}.cbp-hero h1{margin:4px 0;font-size:30px;font-weight:950;color:#0f172a}.cbp-hero p{margin:0;color:#64748b;font-size:13px}.cbp-actions{display:flex;gap:10px;flex-wrap:wrap}.cbp-btn{border:none;border-radius:14px;padding:11px 16px;font-weight:900;cursor:pointer}.cbp-btn.primary{background:linear-gradient(135deg,#14b8a6,#0891b2);color:white}.cbp-btn.ghost{background:#f8fafc;border:1px solid #dbeafe;color:#0f172a}.cbp-filters{padding:14px}.cbp-filter-row{display:grid;grid-template-columns:1.5fr 130px repeat(2,150px) 150px 160px minmax(160px,1fr);gap:10px;align-items:end}.cbp-field{position:relative}.cbp-field label{display:block;font-size:11px;font-weight:900;color:#475569;margin-bottom:6px}.cbp-field input,.cbp-field select,.cbp-selectlike{width:100%;height:42px;border:1px solid #d9edf5;background:#fff;border-radius:14px;padding:0 12px;font-size:12px;font-weight:800;color:#0f172a;outline:none}.cbp-selectlike{display:flex;align-items:center;justify-content:space-between;cursor:pointer}.cbp-selectlike b{background:#0ea5b7;color:#fff;border-radius:999px;padding:2px 9px}.cbp-branch-menu{position:absolute;top:68px;right:0;width:330px;background:#fff;border:1px solid #bdeaf0;border-radius:20px;padding:10px;box-shadow:0 22px 60px rgba(15,23,42,.18);z-index:99;display:none;max-height:360px;overflow:auto}.cbp-branch-menu.open{display:block}.cbp-mini-btn{width:100%;border:none;background:#ecfeff;color:#0891b2;font-weight:900;border-radius:14px;padding:10px;margin-bottom:8px;cursor:pointer}.cbp-branch-option{display:grid;grid-template-columns:14px 1fr 32px;align-items:center;gap:10px;padding:10px;border-radius:14px;cursor:pointer;font-size:12px;font-weight:900}.cbp-branch-option:hover{background:#f0fdfa}.cbp-branch-option input{width:22px;height:22px;accent-color:#0ea5b7}.cbp-dot{width:10px;height:10px;border-radius:50%;background:var(--c);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 14%,transparent)}.cbp-kpis{display:grid;grid-template-columns:repeat(6,minmax(150px,1fr));gap:12px}.cbp-kpi{padding:14px;text-align:right;border:none;cursor:pointer;min-height:116px}.cbp-kpi span{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:15px;background:#eff6ff;margin-bottom:8px}.cbp-kpi small{display:block;color:#64748b;font-weight:900}.cbp-kpi b{display:block;font-size:22px;font-weight:950;color:#0f172a;margin-top:4px}.cbp-kpi em{display:block;font-style:normal;font-size:11px;color:#64748b;margin-top:4px}.cbp-kpi.green span,.cbp-signal.good span{background:#dcfce7}.cbp-kpi.red span,.cbp-signal.warn span{background:#fee2e2}.cbp-kpi.blue span{background:#dbeafe}.cbp-kpi.amber span{background:#fef3c7}.cbp-kpi.violet span{background:#ede9fe}.cbp-grid{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:16px}.cbp-card{padding:16px}.cbp-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.cbp-card h3{margin:0;font-size:16px;font-weight:950;color:#0f172a}.cbp-card p{margin:4px 0 0;color:#64748b;font-size:12px}.cbp-small-select{height:34px;border:1px solid #dbeafe;border-radius:12px;background:#fff;padding:0 10px;font-weight:800}.cbp-side{display:flex;flex-direction:column;gap:16px}.cbp-chart-scroll{overflow:auto}.cbp-line-chart{min-width:760px;width:100%;height:auto}.cbp-line-chart .grid line{stroke:#e2e8f0}.cbp-line-chart .grid text,.cbp-line-chart .hours text{font-size:10px;fill:#64748b}.cbp-line-chart .hours text{text-anchor:middle}.cbp-legend{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.cbp-legend button{border:1px solid #e2e8f0;background:#fff;border-radius:999px;padding:7px 11px;font-weight:900;font-size:11px;cursor:pointer}.cbp-legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-left:6px}.cbp-rank{width:100%;display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;border:none;background:#f8fafc;border-radius:16px;padding:10px;margin-bottom:9px;cursor:pointer;text-align:right}.cbp-rank:hover{background:#ecfeff}.cbp-rank>b{display:grid;place-items:center;width:30px;height:30px;border-radius:12px;background:#ede9fe;color:#6d28d9}.cbp-rank strong{display:block;color:#0f172a}.cbp-rank small{display:block;color:#64748b;font-size:10px}.cbp-rank span{display:block;height:6px;background:#e2e8f0;border-radius:99px;overflow:hidden;margin-top:7px}.cbp-rank span i{display:block;height:100%;border-radius:99px}.cbp-rank em{font-style:normal;font-weight:950;color:#0f172a}.cbp-signal{display:grid;grid-template-columns:40px 1fr;gap:10px;align-items:center;border-radius:16px;padding:11px;margin-bottom:9px;background:#f8fafc}.cbp-signal span{grid-row:span 2;display:grid;place-items:center;width:38px;height:38px;border-radius:14px}.cbp-signal b{font-size:13px}.cbp-signal small{color:#64748b}.cbp-panels{display:grid;grid-template-columns:1.3fr .9fr;gap:16px}.cbp-health-table{overflow:auto}.cbp-health-table table,.cbp-detail-table{width:100%;border-collapse:separate;border-spacing:0 8px;font-size:12px}.cbp-health-table th,.cbp-detail-table th{color:#64748b;font-size:11px;text-align:right;padding:8px}.cbp-health-table td,.cbp-detail-table td{background:#f8fafc;padding:11px;border-top:1px solid #edf2f7;border-bottom:1px solid #edf2f7}.cbp-health-table tr{cursor:pointer}.cbp-health-table tr:hover td{background:#ecfeff}.cbp-health-table td:first-child,.cbp-detail-table td:first-child{border-radius:0 14px 14px 0}.cbp-health-table td:last-child,.cbp-detail-table td:last-child{border-radius:14px 0 0 14px}.cbp-health-table td i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-left:8px}.pos{color:#059669;font-weight:900}.neg{color:#dc2626;font-weight:900}.cbp-score,.cbp-health-table mark{border-radius:999px;padding:5px 9px;font-weight:900;font-size:11px}.cbp-score.good,mark.good{background:#dcfce7;color:#047857}.cbp-score.warn,mark.warn{background:#fef3c7;color:#b45309}.cbp-score.danger,mark.danger{background:#fee2e2;color:#b91c1c}.cbp-score.muted,mark.muted{background:#f1f5f9;color:#64748b}.cbp-problem{width:100%;border:none;border-radius:16px;padding:12px;margin-bottom:9px;text-align:right;display:flex;justify-content:space-between;gap:10px;cursor:pointer}.cbp-problem.danger{background:#fff1f2;color:#be123c}.cbp-problem.warn{background:#fffbeb;color:#b45309}.cbp-problem.muted{background:#f1f5f9;color:#64748b}.cbp-insights{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.cbp-insights div{background:linear-gradient(135deg,#f8fafc,#ecfeff);border:1px solid #dbeafe;border-radius:18px;padding:14px;display:flex;gap:12px;align-items:flex-start}.cbp-insights span{font-size:24px}.cbp-insights p{margin:0;color:#334155;font-weight:800;line-height:1.8}.cbp-empty{text-align:center;color:#64748b;background:#f8fafc;border-radius:16px;padding:22px}.cbp-empty.good{background:#ecfdf5;color:#047857}.cbp-modal-bg{position:fixed;inset:0;background:rgba(15,23,42,.45);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;z-index:10000;padding:20px}.cbp-modal-bg.open{display:flex}.cbp-modal{position:relative;max-width:1080px;width:min(1080px,96vw);max-height:88vh;overflow:auto;background:#fff;border-radius:26px;padding:22px;box-shadow:0 30px 90px rgba(15,23,42,.26);direction:rtl}.cbp-close{position:absolute;left:16px;top:14px;width:34px;height:34px;border:none;border-radius:12px;background:#f1f5f9;font-size:22px;cursor:pointer}.cbp-modal header span{color:#0891b2;font-size:12px;font-weight:900}.cbp-modal header h2{margin:4px 0;font-size:26px}.cbp-modal header p{margin:0;color:#64748b}.modal-kpis{grid-template-columns:repeat(4,1fr);margin:16px 0}.cbp-modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.cbp-modal h3{margin:8px 0 10px}.cbp-detail-table.accent-blue td{background:#eff6ff}.cbp-detail-table.accent-green td{background:#ecfdf5}.cbp-modal-problems{margin-top:8px}@media(max-width:1200px){.cbp-filter-row{grid-template-columns:1fr 1fr 1fr}.cbp-kpis{grid-template-columns:repeat(3,1fr)}.cbp-grid,.cbp-panels{grid-template-columns:1fr}}@media(max-width:720px){.cbp-page{padding:10px}.cbp-hero{flex-direction:column;align-items:flex-start}.cbp-filter-row,.cbp-kpis,.modal-kpis,.cbp-modal-grid{grid-template-columns:1fr}.cbp-branch-menu{width:min(330px,90vw)}}

/* COSTIX_LAST_UPDATE: branch_compare_premium_chart_modals_20260528_0209
   Branch Compare Premium Chart + Modal polish. UI only; data/financial/sync untouched. */
.cbp-chart-card{background:linear-gradient(145deg,#ffffff 0%,#f8feff 70%,#eefbff 100%);overflow:hidden}.cbp-premium-chart{border:1px solid rgba(14,165,183,.14);border-radius:24px;background:radial-gradient(circle at 12% 10%,rgba(14,165,183,.10),transparent 30%),linear-gradient(180deg,#ffffff,#f8fbff);padding:12px;box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}.cbp-chart-scroll{overflow:auto;padding-bottom:4px}.cbp-line-chart-premium{min-width:980px;width:100%;filter:drop-shadow(0 16px 28px rgba(15,23,42,.06))}.cbp-line-chart-premium .chart-bg{fill:rgba(255,255,255,.74);stroke:rgba(148,163,184,.18);stroke-width:1}.cbp-line-chart-premium .grid line{stroke:#dbeafe;stroke-dasharray:4 8;stroke-width:1}.cbp-line-chart-premium .grid text{font-size:10px;fill:#64748b;font-weight:800}.cbp-line-chart-premium .hours text{font-size:10px;fill:#334155;font-weight:900;text-anchor:middle}.cbp-line-chart-premium .hours line{stroke:#cbd5e1}.cbp-line-chart-premium .series .line{paint-order:stroke;filter:drop-shadow(0 6px 10px rgba(15,23,42,.12));transition:stroke-width .18s ease,opacity .18s ease}.cbp-line-chart-premium .series .area{opacity:.95}.cbp-line-chart-premium .cbp-chart-point{cursor:pointer}.cbp-line-chart-premium .cbp-chart-point circle:not(.halo){opacity:.92;transition:r .16s ease,stroke-width .16s ease}.cbp-line-chart-premium .cbp-chart-point:hover circle:not(.halo){r:6;stroke-width:3.2}.cbp-chart-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:10px}.cbp-chart-note{font-size:11px;font-weight:900;color:#64748b;background:#f8fafc;border:1px solid #e2e8f0;border-radius:999px;padding:8px 12px}.cbp-legend button{display:flex;align-items:center;gap:6px;background:linear-gradient(180deg,#fff,#f8fafc);border-color:#dbeafe;box-shadow:0 8px 18px rgba(15,23,42,.04);transition:transform .15s ease,box-shadow .15s ease}.cbp-legend button:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(14,165,183,.10)}.cbp-legend button small{color:#64748b;font-weight:900;margin-right:4px}.cbp-kpi,.cbp-signal,.cbp-insights button,.cbp-empty[data-bd-detail]{transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.cbp-kpi:hover,.cbp-signal:hover,.cbp-insights button:hover,.cbp-empty[data-bd-detail]:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(15,23,42,.10);border-color:rgba(14,165,183,.24)}.cbp-signal{border:0;text-align:right;cursor:pointer;width:100%;font-family:inherit}.cbp-insights button{background:linear-gradient(135deg,#f8fafc,#ecfeff);border:1px solid #dbeafe;border-radius:18px;padding:14px;display:flex;gap:12px;align-items:flex-start;text-align:right;cursor:pointer;font-family:inherit}.cbp-insights button span{font-size:24px}.cbp-insights button p{margin:0;color:#334155;font-weight:800;line-height:1.8}.cbp-modal-bg{background:rgba(2,6,23,.58);backdrop-filter:blur(10px)}.cbp-modal{padding:0;overflow:hidden;border:1px solid rgba(255,255,255,.7);box-shadow:0 32px 100px rgba(15,23,42,.34)}.cbp-modal>header{padding:24px 26px 18px;border-bottom:1px solid rgba(226,232,240,.9);background:linear-gradient(135deg,#eff6ff,#ffffff)}.cbp-modal.theme-green>header{background:linear-gradient(135deg,#dcfce7,#ffffff)}.cbp-modal.theme-red>header{background:linear-gradient(135deg,#fee2e2,#ffffff)}.cbp-modal.theme-amber>header{background:linear-gradient(135deg,#fef3c7,#ffffff)}.cbp-modal.theme-violet>header{background:linear-gradient(135deg,#ede9fe,#ffffff)}.cbp-modal.theme-cyan>header{background:linear-gradient(135deg,#cffafe,#ffffff)}.cbp-modal header span{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 10px;background:rgba(255,255,255,.76);border:1px solid rgba(148,163,184,.22)}.cbp-modal .modal-kpis{padding:18px 22px 2px;margin:0}.cbp-modal .cbp-kpi{min-height:112px}.cbp-close{z-index:2;background:rgba(255,255,255,.88);border:1px solid rgba(148,163,184,.22);box-shadow:0 8px 22px rgba(15,23,42,.12)}.cbp-modal-sections{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:18px 22px 24px}.cbp-modal-section{border-radius:22px;padding:14px;border:1px solid rgba(226,232,240,.9);background:#fff;box-shadow:0 14px 32px rgba(15,23,42,.05);overflow:hidden}.cbp-modal-section.accent-blue{background:linear-gradient(180deg,#eff6ff,#fff)}.cbp-modal-section.accent-cyan{background:linear-gradient(180deg,#ecfeff,#fff)}.cbp-modal-section.accent-green{background:linear-gradient(180deg,#ecfdf5,#fff)}.cbp-modal-section.accent-red{background:linear-gradient(180deg,#fff1f2,#fff)}.cbp-modal-section.accent-violet{background:linear-gradient(180deg,#f5f3ff,#fff)}.cbp-modal-section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:10px}.cbp-modal-section h3{margin:0;font-size:15px;font-weight:950;color:#0f172a}.cbp-modal-section small{color:#64748b;font-weight:800}.cbp-detail-table-wrap{overflow:auto;border-radius:18px}.cbp-detail-table{border-spacing:0 7px}.cbp-detail-table thead th{background:rgba(255,255,255,.62);position:sticky;top:0;z-index:1}.cbp-detail-table td{font-weight:800}.cbp-detail-table.accent-blue td{background:#eff6ff;border-color:#dbeafe}.cbp-detail-table.accent-cyan td{background:#ecfeff;border-color:#bae6fd}.cbp-detail-table.accent-green td{background:#ecfdf5;border-color:#bbf7d0}.cbp-detail-table.accent-red td{background:#fff1f2;border-color:#fecdd3}.cbp-detail-table.accent-violet td{background:#f5f3ff;border-color:#ddd6fe}.cbp-modal-problems .cbp-problem{box-shadow:none;border:1px solid rgba(226,232,240,.8)}@media(max-width:980px){.cbp-modal-sections{grid-template-columns:1fr}.cbp-chart-footer{align-items:flex-start}.cbp-line-chart-premium{min-width:900px}}

/* COSTIX_LAST_UPDATE: branch_compare_intelligence_sections_20260528_0318 */
/* Branch Compare Intelligence Sections — clean cockpit widgets, no data/storage/sync changes */
.cbp-advanced-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cbp-mini-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.cbp-mini-card{border:1px solid rgba(226,232,240,.9);border-radius:18px;background:linear-gradient(180deg,#fff,#f8fafc);padding:13px;text-align:right;cursor:pointer;font-family:inherit;display:flex;flex-direction:column;gap:5px;min-height:112px;transition:transform .16s ease,box-shadow .16s ease}.cbp-mini-card:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(15,23,42,.09)}.cbp-mini-card span{font-size:22px}.cbp-mini-card small{font-size:11px;font-weight:900;color:#64748b}.cbp-mini-card b{font-size:14px;color:#0f172a}.cbp-mini-card em{font-style:normal;font-size:13px;font-weight:950;color:#0891b2}.cbp-mini-card.green{background:linear-gradient(180deg,#ecfdf5,#fff)}.cbp-mini-card.red{background:linear-gradient(180deg,#fff1f2,#fff)}.cbp-mini-card.blue{background:linear-gradient(180deg,#eff6ff,#fff)}.cbp-mini-card.violet{background:linear-gradient(180deg,#f5f3ff,#fff)}
.cbp-opportunity-list,.cbp-hour-list,.cbp-mix-list,.cbp-itemdiff-list{display:flex;flex-direction:column;gap:9px}.cbp-opportunity,.cbp-hour-card,.cbp-mix-row,.cbp-itemdiff{border:1px solid rgba(226,232,240,.85);border-radius:17px;padding:11px 12px;background:#fff;text-align:right;font-family:inherit;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}.cbp-opportunity:hover,.cbp-hour-card:hover,.cbp-mix-row:hover,.cbp-itemdiff:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(15,23,42,.08)}.cbp-opportunity b,.cbp-hour-card b,.cbp-itemdiff b{display:block;color:#0f172a;font-weight:950}.cbp-opportunity span,.cbp-itemdiff span{display:block;color:#334155;font-size:12px;font-weight:850;margin-top:4px}.cbp-opportunity em,.cbp-hour-card em,.cbp-itemdiff em{display:block;color:#64748b;font-size:11px;font-style:normal;font-weight:800;margin-top:4px}.cbp-opportunity.danger{background:linear-gradient(180deg,#fff1f2,#fff)}.cbp-opportunity.warn{background:linear-gradient(180deg,#fffbeb,#fff)}.cbp-opportunity.good{background:linear-gradient(180deg,#ecfdf5,#fff)}.cbp-opportunity.muted{background:linear-gradient(180deg,#f8fafc,#fff)}
.cbp-compare-box{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center}.cbp-compare-box select{height:42px;border:1px solid #dbeafe;border-radius:14px;padding:0 10px;background:#fff;font-weight:900}.cbp-compare-box span{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:#f5f3ff;color:#6d28d9;font-weight:950}.cbp-compare-box .cbp-btn{grid-column:1/-1;width:100%}
.cbp-hour-card{display:grid;grid-template-columns:14px 1fr auto;align-items:center;gap:10px;background:linear-gradient(180deg,#fff,#f8feff)}.cbp-hour-card i{width:11px;height:11px;border-radius:50%;background:var(--c);box-shadow:0 0 0 5px color-mix(in srgb,var(--c) 14%,transparent)}.cbp-hour-card span{font-weight:950;color:#0891b2;background:#ecfeff;border-radius:999px;padding:4px 9px}.cbp-hour-card em{grid-column:2/-1}
.cbp-mix-row{display:grid;grid-template-columns:1fr auto;gap:7px}.cbp-mix-row span{font-weight:950;color:#0f172a}.cbp-mix-row b{color:#0891b2}.cbp-mix-row i{grid-column:1/-1;display:block;height:8px;border-radius:999px;background:#e2e8f0;overflow:hidden}.cbp-mix-row i u{display:block;height:100%;border-radius:999px}.cbp-mix-row em{grid-column:1/-1;color:#64748b;font-style:normal;font-size:11px;font-weight:800}
.cbp-itemdiff{background:linear-gradient(180deg,#fff,#f8fafc)}.cbp-itemdiff em{color:#b45309}.cbp-modal-section .cbp-mini-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.cbp-detail-table tbody tr{cursor:pointer}.cbp-detail-table tbody tr:hover td{filter:brightness(.985);box-shadow:inset 0 0 0 999px rgba(255,255,255,.18)}
@media(max-width:1250px){.cbp-advanced-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.cbp-advanced-grid,.cbp-mini-cards,.cbp-compare-box{grid-template-columns:1fr}.cbp-compare-box span{width:100%}.cbp-hour-card{grid-template-columns:14px 1fr}.cbp-hour-card span{justify-self:start}}

/* COSTIX_LAST_UPDATE 2026-05-28 branch compare modal scroll/performance/shift fix */
.cbp-modal{width:min(1320px,96vw);max-width:1320px;max-height:88vh;display:flex;flex-direction:column;overflow:hidden;}
.cbp-modal>header{flex:0 0 auto;}
.cbp-modal .modal-kpis{flex:0 0 auto;}
.cbp-modal-sections{grid-template-columns:1fr 1fr;align-items:start;overflow-y:auto;overflow-x:hidden;padding-bottom:26px;scrollbar-gutter:stable;}
.cbp-modal-section-wide{grid-column:1 / -1;}
.cbp-modal-section-wide .cbp-detail-table-wrap{width:100%;max-width:100%;}
.cbp-modal-table-box{width:100%;display:flex;flex-direction:column;gap:10px;min-width:0;}
.cbp-detail-table-wrap{width:100%;max-width:100%;max-height:52vh;overflow:auto;border-radius:18px;border:1px solid rgba(186,230,253,.75);background:rgba(255,255,255,.64);scrollbar-gutter:stable;}
.cbp-detail-table{width:100%;min-width:760px;}
.cbp-modal-pager{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:10px 12px;border-radius:16px;background:linear-gradient(135deg,#ffffff,#f8fafc);border:1px solid rgba(226,232,240,.9);box-shadow:0 4px 12px rgba(15,23,42,.035);position:sticky;bottom:0;z-index:2;}
.cbp-pager-info{font-size:12px;font-weight:900;color:#475569;}
.cbp-pager-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.cbp-pager-controls label{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:900;color:#334155;}
.cbp-pager-controls select,.cbp-pager-controls button{height:32px;border-radius:11px;border:1px solid #cfe8f3;background:#fff;color:#0f172a;font-weight:900;padding:0 9px;font-family:inherit;}
.cbp-pager-controls button{cursor:pointer;background:linear-gradient(180deg,#fff,#eefbff);}
.cbp-pager-controls button:hover:not(:disabled){border-color:#0ea5b7;color:#0891b2;box-shadow:0 8px 18px rgba(14,165,183,.12);}
.cbp-pager-controls button:disabled{opacity:.45;cursor:not-allowed;background:#f1f5f9;}
.cbp-modal-section.accent-cyan .cbp-modal-pager{border-color:#bae6fd;background:linear-gradient(135deg,#ecfeff,#fff);}
.cbp-modal-section.accent-green .cbp-modal-pager{border-color:#bbf7d0;background:linear-gradient(135deg,#ecfdf5,#fff);}
.cbp-modal-section.accent-violet .cbp-modal-pager{border-color:#ddd6fe;background:linear-gradient(135deg,#f5f3ff,#fff);}
.cbp-modal-section.accent-red .cbp-modal-pager{border-color:#fecdd3;background:linear-gradient(135deg,#fff1f2,#fff);}
@media(max-width:980px){.cbp-modal{width:min(98vw,1320px);max-height:92vh}.cbp-modal-sections{grid-template-columns:1fr}.cbp-modal-section-wide{grid-column:auto}.cbp-pager-controls{width:100%;justify-content:flex-start}.cbp-modal-pager{align-items:flex-start}.cbp-detail-table-wrap{max-height:58vh}}



/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE: menu_engineering_dashboard_day_exact_fix_20260528
   Menu Engineering: clean single CSS owner matching Executive Dashboard light cockpit.
   Removed old dark ME2 block/override layering. UI/render only.
═══════════════════════════════════════════════════════════════ */
#page-menu_eng{background:var(--dsh-bg,#f5fbfc)!important;padding:18px!important;color:var(--dsh-ink,#0f172a)!important;}
#page-menu_eng .me2-cockpit{direction:rtl;max-width:1780px;margin:auto;padding:0;min-height:auto;background:transparent!important;color:var(--dsh-ink,#0f172a)!important;font-family:'Cairo',Tahoma,Arial,sans-serif;}
#page-menu_eng .me2-hero,#page-menu_eng .me2-filter-card,#page-menu_eng .me2-card,#page-menu_eng .me2-tabs,#page-menu_eng .me2-kpi{background:#fff!important;border:1px solid var(--dsh-line,#e5edf2)!important;box-shadow:0 12px 32px rgba(15,23,42,.055)!important;backdrop-filter:none!important;}
#page-menu_eng .me2-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;background:linear-gradient(135deg,#ffffff 0%,#eefcff 100%)!important;border-radius:24px;padding:18px 20px;margin-bottom:14px;}
#page-menu_eng .me2-hero-title{display:flex;align-items:center;gap:14px;min-width:0;}
#page-menu_eng .me2-logo{width:54px;height:54px;border-radius:18px;display:grid;place-items:center;font-size:28px;background:linear-gradient(135deg,#e8fbff,#d7fdf5)!important;border:1px solid #d9e6ec!important;color:#0284a6;}
#page-menu_eng .me2-hero h2{margin:0;font-size:30px;font-weight:900;color:#0f172a!important;letter-spacing:.2px;}
#page-menu_eng .me2-hero p{margin:4px 0 0;color:var(--dsh-muted,#64748b)!important;font-size:14px;}
#page-menu_eng .me2-hero-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;}
#page-menu_eng .me2-hero-actions .btn,#page-menu_eng .me2-card-head button{height:38px;border-radius:14px;background:#fff!important;color:#0f172a!important;border:1px solid var(--dsh-line,#e5edf2)!important;box-shadow:0 8px 22px rgba(15,23,42,.04);font-weight:900;cursor:pointer;}
#page-menu_eng .me2-hero-actions .btn-gold{background:linear-gradient(135deg,#f59e0b,#fbbf24)!important;color:#fff!important;border-color:#facc15!important;}
#page-menu_eng .me2-shift{padding:8px 12px;border-radius:999px;background:#ecfeff!important;border:1px solid #bae6fd!important;color:#0284a6!important;font-weight:900;font-size:12px;}
#page-menu_eng .me2-filter-card{border-radius:22px;padding:14px;margin-bottom:14px;}
#page-menu_eng .me2-filter-title{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;font-weight:900;color:#0f172a!important;margin-bottom:10px;}
#page-menu_eng .me2-filter-title small{color:#0891b2;font-size:11px;font-weight:900;background:#ecfeff;border:1px solid #bae6fd;border-radius:999px;padding:5px 9px;}
#page-menu_eng .me2-filters{display:grid;grid-template-columns:repeat(6,minmax(130px,1fr));gap:10px;}
#page-menu_eng .me2-filters label{display:flex;flex-direction:column;gap:5px;color:#64748b!important;font-size:12px;font-weight:900;}
#page-menu_eng .me2-filters .fi,#page-menu_eng .me2-pager select,#page-menu_eng .me2-pager input{height:42px;border-radius:13px!important;border:1px solid #d9e6ec!important;background:#fff!important;color:#0f172a!important;color-scheme:light!important;padding:7px 10px;outline:none;font-family:inherit;font-weight:800;box-shadow:none!important;}
#page-menu_eng .me2-filters select.fi option,#page-menu_eng .me2-pager select option{background:#fff!important;color:#0f172a!important;}
#page-menu_eng .me2-filters input.fi::placeholder{color:#94a3b8!important;}
#page-menu_eng .me2-filters input[type="date"].fi::-webkit-calendar-picker-indicator{filter:none!important;opacity:.75;}
#page-menu_eng .me2-filters .fi:focus{border-color:#12b8c6!important;box-shadow:0 0 0 3px rgba(18,184,198,.14)!important;}
#page-menu_eng .me2-kpis{display:grid;grid-template-columns:repeat(5,minmax(160px,1fr));gap:14px;margin-bottom:14px;}
#page-menu_eng .me2-kpi{text-align:right;min-height:136px;border-radius:22px;padding:18px;background:#fff!important;color:#0f172a!important;position:relative;overflow:hidden;cursor:pointer;transition:.18s ease;}
#page-menu_eng .me2-kpi:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(15,23,42,.10)!important;}
#page-menu_eng .me2-kpi:before{content:"";position:absolute;inset:auto -30px -42px auto;width:120px;height:120px;border-radius:50%;opacity:.14;background:currentColor;}
#page-menu_eng .me2-kpi small{display:block;color:#64748b!important;font-size:13px;font-weight:900;}
#page-menu_eng .me2-kpi b{display:block;color:#0f172a!important;font-size:25px;margin:8px 0 4px;line-height:1.15;}
#page-menu_eng .me2-kpi em{display:block;color:#64748b!important;font-style:normal;font-size:12px;}
#page-menu_eng .me2-kpi-profit{color:#16a34a!important;}#page-menu_eng .me2-kpi-risk,#page-menu_eng .me2-kpi-bad{color:#ef4444!important;}#page-menu_eng .me2-kpi-star,#page-menu_eng .me2-kpi-top{color:#f59e0b!important;}#page-menu_eng .me2-kpi-work{color:#2563eb!important;}#page-menu_eng .me2-kpi-puzzle{color:#7c3aed!important;}
#page-menu_eng .me2-tabs{display:flex;gap:8px;overflow:auto;width:max-content;max-width:100%;border-radius:18px;padding:8px;margin-bottom:14px;background:#fff!important;}
#page-menu_eng .me2-tabs button{border:0!important;border-radius:14px;padding:11px 16px;background:transparent!important;color:#64748b!important;font-weight:900;white-space:nowrap;cursor:pointer;}
#page-menu_eng .me2-tabs button.on{background:#e8fbff!important;color:#0284a6!important;box-shadow:none!important;}
#page-menu_eng .me2-grid-main,#page-menu_eng .me2-tab-grid{display:grid;grid-template-columns:1.2fr .8fr .9fr;gap:14px;}
#page-menu_eng .me2-tab-grid .wide{grid-column:span 2;}
#page-menu_eng .me2-card{border-radius:22px;padding:16px;background:#fff!important;color:#0f172a!important;min-width:0;}
#page-menu_eng .me2-card.flat{background:#f8fafc!important;margin-top:12px;}
#page-menu_eng .me2-card h3{margin:0;color:#0f172a!important;font-size:15px;font-weight:900;}
#page-menu_eng .me2-card-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;}
#page-menu_eng .me2-card-head button{border-radius:999px;padding:6px 10px;color:#64748b!important;}
#page-menu_eng .me2-matrix{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
#page-menu_eng .me2-quad{border:1px solid #e5edf2;border-radius:18px;min-height:145px;padding:14px;text-align:right;color:#0f172a;cursor:pointer;overflow:hidden;background:#fff;}
#page-menu_eng .me2-quad span{font-size:18px;font-weight:900;}#page-menu_eng .me2-quad small,#page-menu_eng .me2-quad em{display:block;color:#64748b;margin-top:4px;}#page-menu_eng .me2-quad b{display:block;font-size:30px;margin-top:12px;}#page-menu_eng .me2-quad i{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px;font-style:normal;}#page-menu_eng .me2-quad u{text-decoration:none;border-radius:999px;background:#f1f5f9;padding:3px 7px;font-size:10px;}
#page-menu_eng .me2-quad-star{background:linear-gradient(135deg,#ecfdf5,#fff)!important;}#page-menu_eng .me2-quad-workhorse{background:linear-gradient(135deg,#eff6ff,#fff)!important;}#page-menu_eng .me2-quad-puzzle{background:linear-gradient(135deg,#faf5ff,#fff)!important;}#page-menu_eng .me2-quad-dog{background:linear-gradient(135deg,#fff1f2,#fff)!important;}
#page-menu_eng .me2-donut-wrap{display:grid;grid-template-columns:160px 1fr;gap:12px;align-items:center;}
#page-menu_eng .me2-donut{width:148px;height:148px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#12b8c6 0 26%,#16a34a 26% 52%,#7c3aed 52% 74%,#f59e0b 74% 100%);box-shadow:inset 0 0 0 24px #fff;}
#page-menu_eng .me2-donut b{font-size:32px;}#page-menu_eng .me2-donut span{font-size:12px;color:#64748b;}
#page-menu_eng .me2-legend,#page-menu_eng .me2-mini-table,#page-menu_eng .me2-action-list,#page-menu_eng .me2-bars,#page-menu_eng .me2-trend{display:flex;flex-direction:column;gap:7px;}
#page-menu_eng .me2-mini-table button,#page-menu_eng .me2-action-list button,#page-menu_eng .me2-bars button,#page-menu_eng .me2-trend button,#page-menu_eng .me2-legend button{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;background:#fff!important;border:1px solid #eef2f7!important;color:#0f172a!important;border-radius:12px;padding:9px;cursor:pointer;text-align:right;}
#page-menu_eng .me2-legend button{grid-template-columns:14px 1fr auto auto;}#page-menu_eng .me2-legend i{width:10px;height:10px;border-radius:50%;}#page-menu_eng .me2-legend .c0{background:#12b8c6}#page-menu_eng .me2-legend .c1{background:#16a34a}#page-menu_eng .me2-legend .c2{background:#7c3aed}#page-menu_eng .me2-legend .c3{background:#f59e0b}
#page-menu_eng .me2-mini-table small,#page-menu_eng .me2-action-list small{display:block;color:#64748b!important;margin-top:2px;}#page-menu_eng .me2-mini-table em,#page-menu_eng .me2-mini-table u{text-decoration:none;color:#0891b2!important;font-style:normal;}#page-menu_eng .me2-action-list button{grid-template-columns:1fr auto;}
#page-menu_eng .me2-table-wrap{width:100%;overflow-x:hidden!important;overflow-y:auto;border-radius:16px;border:1px solid #e5edf2!important;background:#fff!important;}
#page-menu_eng .me2-table{width:100%;min-width:0!important;table-layout:fixed!important;border-collapse:separate;border-spacing:0;color:#0f172a!important;}
#page-menu_eng .me2-table th{position:sticky;top:0;background:#f8fafc!important;color:#334155!important;text-align:right;padding:11px;font-size:12px;z-index:1;border-bottom:1px solid #e5edf2!important;white-space:normal;overflow-wrap:anywhere;word-break:break-word;}
#page-menu_eng .me2-table td{padding:10px 11px;border-top:1px solid #eef2f7!important;background:#fff!important;color:#0f172a!important;vertical-align:middle;white-space:normal;overflow-wrap:anywhere;word-break:break-word;}
#page-menu_eng .me2-table th:nth-child(1),#page-menu_eng .me2-table td:nth-child(1){width:24%;}#page-menu_eng .me2-table th:nth-child(2),#page-menu_eng .me2-table td:nth-child(2){width:14%;}#page-menu_eng .me2-table th:nth-child(7),#page-menu_eng .me2-table td:nth-child(7){width:18%;}
#page-menu_eng .me2-table tr{cursor:pointer;}#page-menu_eng .me2-table tr:hover td{background:#f1fbfd!important;}#page-menu_eng .me2-table td small{display:block;color:#64748b!important;margin-top:3px;}#page-menu_eng .me2-table .good{color:#16a34a!important;}#page-menu_eng .me2-table .bad{color:#ef4444!important;}
#page-menu_eng .me2-bars button{grid-template-columns:130px 1fr 72px;}#page-menu_eng .me2-bars i,#page-menu_eng .me2-trend i{height:10px;background:#e5edf2;border-radius:999px;overflow:hidden;}#page-menu_eng .me2-bars u,#page-menu_eng .me2-trend u{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#12b8c6,#14b8a6);}#page-menu_eng .me2-trend button{grid-template-columns:90px 1fr 110px 80px;}
#page-menu_eng .me2-heat{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;}#page-menu_eng .me2-heat button{min-height:38px;border-radius:10px;border:1px solid #d9e6ec;color:#0f172a;background:#f8fafc;font-weight:900;}#page-menu_eng .me2-heat .lv1{background:#f8fafc}#page-menu_eng .me2-heat .lv2{background:#ecfeff}#page-menu_eng .me2-heat .lv3{background:#d7fdf5}#page-menu_eng .me2-heat .lv4{background:#fef3c7}#page-menu_eng .me2-heat .lv5{background:#fed7aa}
#page-menu_eng .me2-empty{color:#64748b!important;background:#f8fafc!important;border:1px dashed #d9e6ec!important;border-radius:16px;padding:22px;text-align:center;}
#page-menu_eng .me2-pager{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:10px;color:#64748b!important;}#page-menu_eng .me2-pager button{border:1px solid #d9e6ec!important;background:#f8fafc!important;color:#0f172a!important;border-radius:10px;padding:7px 10px;cursor:pointer;}#page-menu_eng .me2-pager button:disabled{opacity:.45;cursor:not-allowed;}
#page-menu_eng .me2-modal-bg{z-index:9999;}#page-menu_eng .me2-modal{width:min(1380px,98vw);max-height:88vh;overflow:hidden;background:#fff!important;border:1px solid #d9e6ec!important;border-radius:24px!important;box-shadow:0 24px 70px rgba(15,23,42,.22)!important;}#page-menu_eng .me2-modal .modal-title{display:flex;justify-content:space-between;align-items:center;gap:12px;color:#0f172a!important;border-bottom:1px solid #eef2f7;padding-bottom:10px;}#page-menu_eng .me2-modal-body{max-height:calc(88vh - 82px);overflow:auto;padding-inline-end:4px;color:#0f172a!important;}
#page-menu_eng .me2-item-head{display:flex;justify-content:space-between;align-items:center;gap:12px;border-radius:18px;padding:14px;margin-bottom:12px;border:1px solid #e5edf2;}#page-menu_eng .me2-item-head p{margin:5px 0 0;color:#334155;}#page-menu_eng .me2-item-head.danger{background:#fff1f2;}#page-menu_eng .me2-item-head.warning{background:#fffbeb;}#page-menu_eng .me2-item-head.success{background:#ecfdf5;}#page-menu_eng .me2-item-head.info{background:#eff6ff;}#page-menu_eng .me2-item-head.muted{background:#f8fafc;}
#page-menu_eng .me2-mini-grid{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:10px;margin-bottom:12px;}#page-menu_eng .me2-mini{border:1px solid #e5edf2!important;background:#f8fafc!important;border-radius:14px;padding:11px;}#page-menu_eng .me2-mini small{display:block;color:#64748b!important;}#page-menu_eng .me2-mini b{display:block;margin-top:5px;color:#0f172a!important;font-size:17px;}#page-menu_eng .me2-card ol{margin:8px 20px;color:#334155!important;}
@media(max-width:1200px){#page-menu_eng .me2-kpis{grid-template-columns:repeat(3,1fr)}#page-menu_eng .me2-filters{grid-template-columns:repeat(3,1fr)}#page-menu_eng .me2-grid-main,#page-menu_eng .me2-tab-grid{grid-template-columns:1fr}#page-menu_eng .me2-tab-grid .wide{grid-column:auto}}
@media(max-width:760px){#page-menu_eng{padding:10px!important}#page-menu_eng .me2-hero{align-items:flex-start;flex-direction:column}#page-menu_eng .me2-filters{grid-template-columns:1fr}#page-menu_eng .me2-kpis{grid-template-columns:1fr}#page-menu_eng .me2-matrix{grid-template-columns:1fr}#page-menu_eng .me2-donut-wrap{grid-template-columns:1fr}#page-menu_eng .me2-mini-grid{grid-template-columns:1fr 1fr}#page-menu_eng .me2-bars button,#page-menu_eng .me2-trend button,#page-menu_eng .me2-mini-table button{grid-template-columns:1fr;gap:5px}#page-menu_eng .me2-table{font-size:11px}#page-menu_eng .me2-table th,#page-menu_eng .me2-table td{padding:8px 6px}}




/* COSTIX_LAST_UPDATE 2026-05-30 Phase78 — SalesLog CSS paint/reflow cleanup.
   Scope: CSS-only performance cleanup for SalesLog.
   Removed global transition-all behavior, disabled broad will-change, reduced SalesLog shadows/blur paint cost, and added scoped containment.
   No JS, sync, storage, realtime, cache, routing, or data behavior changes. */
/* =====================================================================
   COSTIX_LAST_UPDATE phase_saleslog_design_a_light_system_migration_20260528
   SalesLog Design A light dashboard migration.
   Purpose: spread the dashboard-style light colors and clean table/modal formatting
   over the existing SalesLog UI without touching data, delete/edit, sync, storage,
   realtime, cache, or accounting logic.
   Replaces the previous dark SalesLog block completely; removed fake/unused tab styling.
===================================================================== */
#page-sales,#page-saleslog{
  background:linear-gradient(180deg,#f7fdff 0%,#edf8fb 48%,#f8fbff 100%)!important;
  color:#0f172a!important;
  padding:18px!important;
  min-height:100vh;
  overflow:auto;
}
#page-sales .sl-cockpit,#page-saleslog .sl-cockpit{
  --sl-page:#f7fdff;--sl-card:#ffffff;--sl-card2:#f8feff;--sl-soft:#ecfeff;--sl-cyan:#14b8c6;
  --sl-cyan2:#06b6d4;--sl-green:#16a34a;--sl-blue:#2563eb;--sl-amber:#d97706;--sl-red:#dc2626;
  --sl-ink:#0f172a;--sl-muted:#64748b;--sl-line:#dbeafe;--sl-line2:#e2e8f0;--sl-hover:#e0f7fb;
  display:flex;flex-direction:column;gap:16px;color:var(--sl-ink);font-family:Cairo,system-ui,sans-serif;
}
#page-sales .sl-design-a *,#page-saleslog .sl-design-a *{box-sizing:border-box;}
#page-sales .sl-hero,#page-saleslog .sl-hero{
  display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:22px;border-radius:26px;
  background:radial-gradient(circle at 12% 10%,rgba(20,184,198,.18),transparent 32%),linear-gradient(135deg,#ffffff 0%,#f8feff 62%,#ecfeff 100%)!important;
  border:1px solid rgba(203,213,225,.9);box-shadow:0 8px 18px rgba(15,23,42,.045),inset 0 1px 0 rgba(255,255,255,.9);
}
#page-sales .sl-badge,#page-saleslog .sl-badge{display:inline-flex;border:1px solid rgba(20,184,198,.22);background:#ecfeff;color:#0e7490;border-radius:999px;padding:6px 11px;font-size:12px;font-weight:1000;}
#page-sales .sl-hero h2,#page-saleslog .sl-hero h2{margin:8px 0 4px;color:#0f172a!important;font-size:28px;font-weight:1000;letter-spacing:-.4px;}
#page-sales .sl-hero p,#page-saleslog .sl-hero p{margin:0;color:#64748b!important;font-weight:900;}
#page-sales .sl-hero-meta,#page-saleslog .sl-hero-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;}
#page-sales .sl-hero-meta span,#page-saleslog .sl-hero-meta span{background:#ffffff;border:1px solid #e2e8f0;border-radius:999px;padding:7px 11px;color:#334155;font-size:12px;font-weight:900;box-shadow:0 3px 8px rgba(15,23,42,.035);}
#page-sales .sl-hero-actions,#page-saleslog .sl-hero-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;}
#page-sales .sl-kpi-grid,#page-saleslog .sl-kpi-grid{display:grid;grid-template-columns:repeat(9,minmax(116px,1fr));gap:10px;contain:layout paint;}
#page-sales .sl-kpi,#page-saleslog .sl-kpi{
  position:relative;text-align:right;border:1px solid #e2e8f0;border-radius:22px;padding:15px;min-height:136px;
  background:linear-gradient(145deg,#ffffff,#f8fbff)!important;color:#0f172a!important;box-shadow:0 6px 16px rgba(15,23,42,.045);cursor:pointer;transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease;overflow:hidden;
}
#page-sales .sl-kpi::after,#page-saleslog .sl-kpi::after{content:"";position:absolute;inset:auto -30px -50px auto;width:110px;height:110px;border-radius:50%;background:rgba(20,184,198,.09);}
#page-sales .sl-kpi:hover,#page-saleslog .sl-kpi:hover{transform:translateY(-3px);border-color:rgba(20,184,198,.32);box-shadow:0 8px 20px rgba(15,23,42,.07);background:linear-gradient(145deg,#ffffff,#ecfeff)!important;}
#page-sales .sl-kpi i,#page-saleslog .sl-kpi i{display:grid;place-items:center;width:42px;height:42px;border-radius:18px;background:#ecfeff;color:#0891b2;font-style:normal;font-size:21px;margin-bottom:10px;}
#page-sales .sl-kpi span,#page-saleslog .sl-kpi span{display:block;color:#475569!important;font-size:12px;font-weight:1000;}
#page-sales .sl-kpi b,#page-saleslog .sl-kpi b{display:block;margin-top:9px;font-size:20px;font-weight:1000;color:#0f172a!important;line-height:1.15;}
#page-sales .sl-kpi small,#page-saleslog .sl-kpi small{display:block;margin-top:8px;color:#64748b!important;font-size:11px;font-weight:900;}
#page-sales .sl-kpi.primary i,#page-saleslog .sl-kpi.primary i{background:#dcfce7;color:#16a34a}#page-sales .sl-kpi.good i,#page-saleslog .sl-kpi.good i{background:#dbeafe;color:#2563eb}#page-sales .sl-kpi.violet i,#page-saleslog .sl-kpi.violet i{background:#ede9fe;color:#7c3aed}#page-sales .sl-kpi.info i,#page-saleslog .sl-kpi.info i{background:#cffafe;color:#0891b2}#page-sales .sl-kpi.warn i,#page-saleslog .sl-kpi.warn i{background:#fef3c7;color:#d97706}#page-sales .sl-kpi.amber i,#page-saleslog .sl-kpi.amber i{background:#fff7ed;color:#ea580c}#page-sales .sl-kpi.danger i,#page-saleslog .sl-kpi.danger i{background:#fee2e2;color:#dc2626}#page-sales .sl-kpi.cost i,#page-saleslog .sl-kpi.cost i{background:#e0f2fe;color:#0284c7}#page-sales .sl-kpi.profit i,#page-saleslog .sl-kpi.profit i{background:#dcfce7;color:#15803d}
#page-sales .sl-filter-shell,#page-saleslog .sl-filter-shell{background:#ffffff!important;border:1px solid #e2e8f0;border-radius:24px;padding:16px;box-shadow:0 6px 16px rgba(15,23,42,.04);contain:layout paint;}
#page-sales .sl-filter-title,#page-saleslog .sl-filter-title{font-weight:1000;color:#0f172a!important;margin-bottom:12px;text-align:right;}
#page-sales .sl-filter-grid,#page-saleslog .sl-filter-grid{display:grid;grid-template-columns:repeat(6,minmax(145px,1fr));gap:10px;align-items:end;}
#page-sales .sl-filter-grid label,#page-saleslog .sl-filter-grid label{display:flex;flex-direction:column;gap:6px;color:#334155!important;font-weight:900;font-size:12px;position:relative;}
#page-sales .sl-filter-grid .fi,#page-saleslog .sl-filter-grid .fi,#page-sales .sl-pager .fi,#page-saleslog .sl-pager .fi,.sl-modal .fi{
  width:100%;height:43px;border-radius:14px!important;border:1px solid #cbd5e1!important;background:#f8fafc!important;color:#0f172a!important;padding:0 12px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.92)!important;font-weight:1000;color-scheme:light;
}
#page-sales .sl-filter-grid .fi:focus,#page-saleslog .sl-filter-grid .fi:focus,.sl-modal .fi:focus{outline:none!important;border-color:#14b8c6!important;box-shadow:0 0 0 3px rgba(20,184,198,.14)!important;background:#fff!important;}
#page-sales .sl-filter-grid select option,#page-saleslog .sl-filter-grid select option,.sl-modal select option{background:#fff!important;color:#0f172a!important;}
#page-sales input[type="date"].fi::-webkit-calendar-picker-indicator,#page-saleslog input[type="date"].fi::-webkit-calendar-picker-indicator{filter:none;opacity:.75;}
#page-sales .sl-branch-field,#page-saleslog .sl-branch-field{position:relative;}
#page-sales .sl-branch-select,#page-saleslog .sl-branch-select{height:43px;border-radius:14px;border:1px solid #cbd5e1;background:#f8fafc;color:#0f172a;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 12px;font-weight:1000;cursor:pointer;}
#page-sales .sl-branch-select em,#page-saleslog .sl-branch-select em{background:#14b8c6;color:#fff;border-radius:999px;min-width:25px;height:25px;display:grid;place-items:center;font-style:normal;}
#page-sales .sl-branch-menu,#page-saleslog .sl-branch-menu{display:none;position:absolute;z-index:70;top:68px;right:0;min-width:280px;background:#fff;border:1px solid #cbd5e1;border-radius:16px;padding:8px;box-shadow:0 10px 24px rgba(15,23,42,.10);}
#page-sales .sl-branch-menu.open,#page-saleslog .sl-branch-menu.open{display:flex;flex-direction:column;gap:6px;}
#page-sales .sl-branch-option,#page-saleslog .sl-branch-option{display:grid!important;grid-template-columns:14px 24px 1fr;align-items:center;gap:8px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:9px!important;color:#0f172a!important;}
#page-sales .sl-branch-dot,#page-saleslog .sl-branch-dot{width:10px;height:10px;border-radius:50%;background:#14b8c6;}
#page-sales .sl-mini,#page-saleslog .sl-mini{border:0;background:#ecfeff;color:#0e7490;border-radius:10px;padding:8px;font-weight:1000;cursor:pointer;}
#page-sales .sl-tabs,#page-saleslog .sl-tabs{display:flex;gap:8px;flex-wrap:wrap;background:#ffffff;border:1px solid #e2e8f0;border-radius:18px;padding:8px;box-shadow:0 4px 12px rgba(15,23,42,.035);}
#page-sales .sl-tabs button,#page-saleslog .sl-tabs button{border:1px solid #e2e8f0;background:#f8fafc;color:#334155!important;border-radius:14px;padding:10px 14px;font-weight:1000;cursor:pointer;}
#page-sales .sl-tabs button.active,#page-saleslog .sl-tabs button.active,#page-sales .sl-tabs button:hover,#page-saleslog .sl-tabs button:hover{background:#ecfeff!important;color:#0e7490!important;border-color:#14b8c6;}
#page-sales .sl-insight-grid,#page-saleslog .sl-insight-grid{display:grid;grid-template-columns:1.5fr .9fr;gap:12px;contain:layout paint;}
#page-sales .sl-analysis-grid,#page-saleslog .sl-analysis-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;contain:layout paint;}
#page-sales .sl-analysis-card.wide,#page-saleslog .sl-analysis-card.wide{grid-column:1/-1;}
#page-sales .sl-insight-panel,#page-saleslog .sl-insight-panel,#page-sales .sl-table-panel,#page-saleslog .sl-table-panel,#page-sales .sl-analysis-card,#page-saleslog .sl-analysis-card{background:#ffffff!important;border:1px solid #e2e8f0!important;border-radius:24px!important;padding:16px;box-shadow:0 6px 16px rgba(15,23,42,.04);color:#0f172a!important;}
#page-sales .sl-insight-panel h3,#page-saleslog .sl-insight-panel h3,#page-sales .sl-analysis-card h3,#page-saleslog .sl-analysis-card h3{margin:0 0 12px;color:#0f172a!important;font-size:16px;font-weight:1000;}
#page-sales .sl-mini-table,#page-saleslog .sl-mini-table{display:flex;flex-direction:column;gap:8px;}
#page-sales .sl-mini-table button,#page-saleslog .sl-mini-table button{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;text-align:right;border:1px solid #e2e8f0;background:#f8fafc;color:#0f172a;border-radius:16px;padding:10px;cursor:pointer;font-weight:900;}
#page-sales .sl-mini-table button:hover,#page-saleslog .sl-mini-table button:hover{background:#ecfeff;border-color:#14b8c6;}
#page-sales .sl-mini-table strong,#page-saleslog .sl-mini-table strong{color:#0f172a;}
#page-sales .sl-alert,#page-saleslog .sl-alert{display:flex;gap:8px;align-items:center;background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;padding:10px;margin-bottom:7px;color:#0f172a!important;}
#page-sales .sl-empty-mini,#page-saleslog .sl-empty-mini{border:1px dashed #cbd5e1;border-radius:16px;padding:18px;text-align:center;color:#64748b!important;background:#f8fafc;}
#page-sales .sl-table-head,#page-saleslog .sl-table-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;}
#page-sales .sl-table-head h3,#page-saleslog .sl-table-head h3{margin:0;color:#0f172a;font-size:17px;font-weight:1000;}
#page-sales .sl-table-head small,#page-saleslog .sl-table-head small{color:#64748b;margin-inline-start:8px;}
#page-sales .sl-table-wrap,#page-saleslog .sl-table-wrap{width:100%;overflow-x:hidden!important;overflow-y:auto;max-height:calc(100vh - 370px);border-radius:20px;border:1px solid #e2e8f0;background:#ffffff;contain:layout paint;}
#page-sales table.sl-compact-orders,#page-saleslog table.sl-compact-orders{width:100%!important;min-width:0!important;table-layout:fixed!important;border-collapse:separate;border-spacing:0;background:#ffffff!important;color:#0f172a!important;}
#page-sales .sl-compact-orders th,#page-saleslog .sl-compact-orders th{position:sticky;top:0;z-index:2;background:#f1f5f9!important;color:#334155!important;padding:11px 7px;font-size:11px;font-weight:1000;text-align:right;white-space:normal!important;word-break:break-word;border-bottom:1px solid #e2e8f0;}
#page-sales .sl-compact-orders td,#page-saleslog .sl-compact-orders td{background:#ffffff!important;color:#0f172a!important;padding:10px 7px;font-size:12px;font-weight:800;vertical-align:middle;border-bottom:1px solid #eef2f7;white-space:normal!important;overflow-wrap:anywhere;word-break:break-word;box-shadow:none!important;}
#page-sales .sl-compact-orders tbody tr:nth-child(even) td,#page-saleslog .sl-compact-orders tbody tr:nth-child(even) td{background:#f8fafc!important;}
#page-sales .sl-compact-orders tr:hover td,#page-saleslog .sl-compact-orders tr:hover td{background:#ecfeff!important;color:#0f172a!important;}
#page-sales .sl-compact-orders small,#page-saleslog .sl-compact-orders small{display:block;font-size:10px;color:inherit;opacity:.72;margin-top:3px;}
#page-sales .sl-order-cell .order-badge,#page-saleslog .sl-order-cell .order-badge{display:inline-flex!important;min-width:56px;justify-content:center;background:#ecfeff!important;color:#0e7490!important;border:1px solid rgba(20,184,198,.28)!important;}
#page-sales .sl-pill,#page-saleslog .sl-pill{display:inline-flex;align-items:center;gap:4px;background:#ecfeff;border:1px solid rgba(20,184,198,.18);border-radius:999px;padding:5px 8px;color:#0e7490!important;}
#page-sales .sl-actions,#page-saleslog .sl-actions{display:flex;gap:5px;flex-wrap:wrap;}
#page-sales .sl-total-row td,#page-saleslog .sl-total-row td{position:sticky;bottom:0;background:#f1f5f9!important;color:#0f172a!important;font-weight:1000;border-top:1px solid #e2e8f0;}
#page-sales .sl-pager,#page-saleslog .sl-pager{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:10px 12px;background:#ffffff;border:1px solid #e2e8f0;border-radius:16px;margin:0;color:#0f172a!important;box-shadow:0 4px 12px rgba(15,23,42,.035);}
#page-sales .sl-pager-side,#page-saleslog .sl-pager-side{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
#page-sales .sl-pager .fi,#page-saleslog .sl-pager .fi{width:auto!important;min-width:82px;}
.sl-modal-bg{z-index:99999!important;background:rgba(15,23,42,.48)!important;}
.sl-modal{width:min(1500px,98vw)!important;max-height:92vh!important;overflow:hidden!important;background:#ffffff!important;border:1px solid #e2e8f0!important;border-radius:24px!important;color:#0f172a!important;box-shadow:0 16px 42px rgba(15,23,42,.20)!important;padding:16px!important;}
.sl-modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;border-bottom:1px solid #e2e8f0;padding-bottom:12px;margin-bottom:12px;background:linear-gradient(135deg,#ffffff,#f8feff);}
.sl-modal-head h3{margin:0;color:#0f172a!important;font-size:22px;font-weight:1000;}.sl-modal-head p{margin:6px 0 0;color:#64748b!important;font-weight:800;}
.sl-modal-stats{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:10px;margin-bottom:12px;}.sl-modal-stats div{border:1px solid #e2e8f0;background:#f8fafc;border-radius:16px;padding:12px;}.sl-modal-stats small{display:block;color:#64748b;font-weight:900;}.sl-modal-stats b{display:block;margin-top:7px;color:#0f172a;font-size:18px;font-weight:1000;}.sl-modal-stats b.ok{color:#16a34a!important}.sl-modal-stats b.bad{color:#dc2626!important}
.sl-modal-table-wrap{width:100%;overflow-y:auto;overflow-x:hidden;max-height:calc(92vh - 245px);border-radius:18px;border:1px solid #e2e8f0;background:#fff;}.sl-modal-table-wrap.static{max-height:55vh;}.sl-modal-table{width:100%;min-width:0;table-layout:fixed;border-collapse:separate;border-spacing:0;background:#fff;color:#0f172a;}.sl-modal-table th{position:sticky;top:0;background:#f1f5f9;color:#334155;padding:11px 8px;text-align:right;font-weight:1000;white-space:normal;word-break:break-word;border-bottom:1px solid #e2e8f0;}.sl-modal-table td{padding:10px 8px;background:#fff;color:#0f172a;border-bottom:1px solid #eef2f7;font-weight:800;white-space:normal;overflow-wrap:anywhere;word-break:break-word;box-shadow:none!important;}.sl-modal-table tbody tr:nth-child(even) td{background:#f8fafc}.sl-modal-table tr:hover td{background:#ecfeff;color:#0f172a;}.sl-modal-table td.ok{color:#16a34a;font-weight:1000}.sl-modal-table td.bad{color:#dc2626;font-weight:1000}
.sl-modal-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:10px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:14px;padding:10px;font-weight:900;color:#0f172a}.sl-modal-pager>div{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.sl-modal-pager .fi{width:auto!important;min-width:110px!important;height:38px!important;}
.sl-detail-modal{width:min(1300px,98vw)!important}.sl-detail-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.sl-detail-chips span{border:1px solid #e2e8f0;background:#f8fafc;border-radius:999px;padding:7px 12px;font-weight:900;color:#334155}.sl-detail-items{max-height:34vh!important}.sl-detail-totals{display:grid;grid-template-columns:repeat(2,minmax(180px,1fr));gap:8px;margin-top:12px}.sl-detail-totals div{display:flex;justify-content:space-between;align-items:center;gap:12px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:10px;font-weight:900}.sl-detail-totals .final{grid-column:1/-1;background:#ecfeff;border-color:rgba(20,184,198,.22)}.sl-detail-audit{margin-top:12px;display:flex;flex-direction:column;gap:10px}.sl-detail-audit .sl-audit-grid{margin:0!important}.sl-detail-audit .btn{align-self:stretch;justify-content:center}.sl-modal .mfoot{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:12px;border-top:1px solid #e2e8f0;padding-top:12px;}
/* Compatibility skin for remaining legacy SalesLog blocks only. Prevents old .panel/.t/.tag from leaking dark or white artifact layers while preserving edit/delete/audit functions. */
#page-sales .kpi,#page-saleslog .kpi,#page-sales .panel,#page-saleslog .panel{background:#ffffff!important;color:#0f172a!important;border:1px solid #e2e8f0!important;box-shadow:0 4px 12px rgba(15,23,42,.035)!important;border-radius:20px!important;}
#page-sales .kpi *,#page-saleslog .kpi *,#page-sales .panel *,#page-saleslog .panel *{color:inherit;}
#page-sales .tbl-wrap,#page-saleslog .tbl-wrap{background:#ffffff!important;border:1px solid #e2e8f0!important;border-radius:18px!important;overflow:auto!important;box-shadow:none!important;}
#page-sales table.t,#page-saleslog table.t{background:#ffffff!important;color:#0f172a!important;min-width:0!important;width:100%!important;table-layout:fixed!important;border-collapse:separate!important;border-spacing:0!important;}
#page-sales table.t th,#page-saleslog table.t th{background:#f1f5f9!important;color:#334155!important;border-bottom:1px solid #e2e8f0!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-sales table.t td,#page-saleslog table.t td{background:#ffffff!important;color:#0f172a!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word!important;border-bottom:1px solid #eef2f7!important;box-shadow:none!important;}
#page-sales table.t tbody tr:nth-child(even) td,#page-saleslog table.t tbody tr:nth-child(even) td{background:#f8fafc!important;}
#page-sales table.t tr:hover td,#page-saleslog table.t tr:hover td{background:#ecfeff!important;color:#0f172a!important;}
.sl-modal .tag,#page-sales .tag,#page-saleslog .tag{background:#ecfeff!important;color:#0e7490!important;border:1px solid rgba(20,184,198,.22)!important;border-radius:999px!important;}
#page-sales .td-m,#page-saleslog .td-m{color:#0f172a!important;}#page-sales .td-n,#page-saleslog .td-n{color:#0f172a!important;}
@media(max-width:1500px){#page-sales .sl-kpi-grid,#page-saleslog .sl-kpi-grid{grid-template-columns:repeat(3,1fr)}#page-sales .sl-filter-grid,#page-saleslog .sl-filter-grid{grid-template-columns:repeat(3,1fr)}#page-sales .sl-analysis-grid,#page-saleslog .sl-analysis-grid{grid-template-columns:1fr}}
@media(max-width:900px){#page-sales .sl-insight-grid,#page-saleslog .sl-insight-grid{grid-template-columns:1fr}#page-sales .sl-kpi-grid,#page-saleslog .sl-kpi-grid,#page-sales .sl-filter-grid,#page-saleslog .sl-filter-grid{grid-template-columns:1fr}.sl-modal-stats{grid-template-columns:1fr 1fr}.sl-detail-totals{grid-template-columns:1fr}}
@media(max-width:760px){#page-sales,#page-saleslog{padding:10px!important}#page-sales .sl-hero,#page-saleslog .sl-hero,.sl-modal-head{flex-direction:column}#page-sales .sl-compact-orders th,#page-sales .sl-compact-orders td,#page-saleslog .sl-compact-orders th,#page-saleslog .sl-compact-orders td,.sl-modal-table th,.sl-modal-table td{font-size:10px;padding:7px 5px}#page-sales .sl-actions,#page-saleslog .sl-actions{flex-direction:column}.sl-modal-stats{grid-template-columns:1fr}}

/* COSTIX_LAST_UPDATE 2026-05-28 Phase5 — SalesLog table/audit/edit modal refinement.
   Scope: UI only for SalesLog. No sync/realtime/storage/cache/data/accounting changes. */
/* Phase7 removed: non-active SalesLog tabs must stay visible. */
#page-sales .sl-table-panel,
#page-saleslog .sl-table-panel{
  background:linear-gradient(180deg,#ffffff 0%,#f8fdff 100%)!important;
  border:1px solid rgba(20,184,198,.18)!important;
  border-radius:26px!important;
  box-shadow:0 7px 18px rgba(15,23,42,.05)!important;
  padding:14px!important;
}
#page-sales .sl-table-head,
#page-saleslog .sl-table-head{padding:0 2px 8px;border-bottom:1px solid rgba(20,184,198,.13);}
#page-sales .sl-table-head h3,
#page-saleslog .sl-table-head h3{font-size:18px!important;color:#12343b!important;letter-spacing:-.2px;}
#page-sales .sl-table-wrap,
#page-saleslog .sl-table-wrap{
  border-radius:22px!important;
  border:1px solid #d8edf0!important;
  background:#fff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
}
#page-sales table.sl-compact-orders,
#page-saleslog table.sl-compact-orders{border-spacing:0!important;background:#fff!important;}
#page-sales .sl-compact-orders thead th,
#page-saleslog .sl-compact-orders thead th{
  background:linear-gradient(180deg,#ebfbfc 0%,#dff6f8 100%)!important;
  color:#12343b!important;
  border-bottom:1px solid #c8e8ec!important;
  border-inline-start:1px solid rgba(20,184,198,.09)!important;
  padding:14px 8px!important;
  font-size:11.5px!important;
  letter-spacing:.1px;
}
#page-sales .sl-compact-orders tbody td,
#page-saleslog .sl-compact-orders tbody td{
  background:#ffffff!important;
  color:#102a36!important;
  border-bottom:1px solid #e7f0f2!important;
  border-inline-start:1px solid rgba(15,23,42,.035)!important;
  padding:12px 8px!important;
  line-height:1.45!important;
}
#page-sales .sl-compact-orders tbody tr:nth-child(even) td,
#page-saleslog .sl-compact-orders tbody tr:nth-child(even) td{background:#f7fcfd!important;}
#page-sales .sl-compact-orders tbody tr:hover td,
#page-saleslog .sl-compact-orders tbody tr:hover td{background:#e9fbfd!important;box-shadow:none!important;}
#page-sales .sl-compact-orders tbody tr:hover td:first-child,
#page-saleslog .sl-compact-orders tbody tr:hover td:first-child{box-shadow:inset -3px 0 0 #14b8c6!important;}
#page-sales .sl-compact-orders tfoot td,
#page-saleslog .sl-compact-orders tfoot td{
  background:linear-gradient(180deg,#eafcff,#daf4f7)!important;
  color:#102a36!important;
  border-top:1px solid #c7e9ed!important;
  padding:13px 8px!important;
}
#page-sales .sl-audit-cell,
#page-saleslog .sl-audit-cell{text-align:center!important;}
#page-sales .sl-audit-empty,
#page-saleslog .sl-audit-empty{
  display:inline-flex!important;align-items:center;justify-content:center;min-width:42px;height:26px;
  border-radius:999px;background:#f1f5f9!important;border:1px solid #e2e8f0!important;color:#64748b!important;
  font-weight:1000!important;box-shadow:none!important;
}
#page-sales .sl-audit-badge,
#page-saleslog .sl-audit-badge{
  appearance:none!important;border:1px solid rgba(20,184,198,.25)!important;background:#ecfeff!important;color:#0e7490!important;
  border-radius:999px!important;padding:6px 10px!important;display:inline-flex!important;align-items:center;justify-content:center;gap:0!important;
  min-width:74px!important;box-shadow:none!important;line-height:1!important;cursor:pointer!important;
}
#page-sales .sl-audit-badge b,
#page-saleslog .sl-audit-badge b{background:transparent!important;color:inherit!important;font-size:11px!important;font-weight:1000!important;box-shadow:none!important;}
#page-sales .sl-audit-badge * ,
#page-saleslog .sl-audit-badge *{background:transparent!important;box-shadow:none!important;}
#page-sales .sl-audit-badge.is-danger,
#page-saleslog .sl-audit-badge.is-danger{background:#fff1f2!important;border-color:#fecdd3!important;color:#be123c!important;}
#page-sales .sl-pay-cell,
#page-saleslog .sl-pay-cell{display:inline-flex;flex-direction:column;gap:2px;font-weight:1000;color:#102a36;}
#page-sales .sl-row-action,
#page-saleslog .sl-row-action,
.sl-row-action{
  border-radius:11px!important;border:1px solid #d8e8ed!important;background:#fff!important;color:#0f172a!important;
  padding:7px 10px!important;font-size:11px!important;font-weight:1000!important;cursor:pointer!important;line-height:1!important;
  display:inline-flex!important;align-items:center;justify-content:center;box-shadow:none!important;
}
#page-sales .sl-row-action.info,
#page-saleslog .sl-row-action.info,
.sl-row-action.info{background:#ecfeff!important;color:#0e7490!important;border-color:rgba(20,184,198,.28)!important;}
#page-sales .sl-row-action.edit,
#page-saleslog .sl-row-action.edit,
.sl-row-action.edit{background:#fffbeb!important;color:#b45309!important;border-color:#fde68a!important;}
#page-sales .sl-row-action.danger,
#page-saleslog .sl-row-action.danger,
.sl-row-action.danger{background:#fff1f2!important;color:#e11d48!important;border-color:#fecdd3!important;}
#page-sales .sl-actions,
#page-saleslog .sl-actions{gap:7px!important;align-items:center!important;justify-content:flex-start!important;}
#page-sales .sl-audit-card-panel,
#page-saleslog .sl-audit-card-panel{display:flex;flex-direction:column;gap:12px;}
#page-sales .sl-audit-timeline-card,
#page-saleslog .sl-audit-timeline-card{
  width:100%;text-align:right;border:1px solid rgba(20,184,198,.18);background:linear-gradient(135deg,#ffffff,#ecfeff);
  border-radius:20px;padding:16px;display:grid;gap:7px;color:#12343b;cursor:pointer;box-shadow:0 5px 14px rgba(15,23,42,.04);
}
#page-sales .sl-audit-timeline-card span,
#page-saleslog .sl-audit-timeline-card span{font-weight:1000;color:#0f172a;}
#page-sales .sl-audit-timeline-card b,
#page-saleslog .sl-audit-timeline-card b{font-size:32px;line-height:1;color:#14b8c6;font-weight:1000;}
#page-sales .sl-audit-timeline-card small,
#page-saleslog .sl-audit-timeline-card small{color:#64748b;font-weight:900;}
#page-sales .sl-audit-timeline-card em,
#page-saleslog .sl-audit-timeline-card em{font-style:normal;color:#0e7490;font-weight:1000;}
.sl-edit-modal{width:min(1180px,98vw)!important;}
.sl-edit-warning{border:1px solid #fde68a;background:#fffbeb;color:#92400e;border-radius:16px;padding:11px 14px;font-weight:1000;margin-bottom:12px;}
.sl-edit-grid{display:grid;grid-template-columns:1.4fr .8fr;gap:12px;align-items:start;}
.sl-edit-section{background:#ffffff;border:1px solid #e2e8f0;border-radius:18px;padding:12px;box-shadow:0 4px 12px rgba(15,23,42,.035);}
.sl-edit-section.wide{grid-row:span 2;}
.sl-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;}
.sl-section-head h4{margin:0;color:#12343b;font-size:15px;font-weight:1000;}.sl-section-head span{background:#ecfeff;color:#0e7490;border-radius:999px;padding:5px 10px;font-weight:1000;font-size:11px;}
.sl-edit-items-wrap{max-height:52vh!important;}.sl-edit-items-table th,.sl-edit-items-table td{font-size:12px!important;}
.sl-qty-control{display:inline-flex;align-items:center;gap:8px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:999px;padding:4px;}
.sl-qty-control button{width:26px;height:26px;border:0;border-radius:50%;background:#ecfeff;color:#0e7490;font-weight:1000;cursor:pointer;}.sl-qty-control b{min-width:26px;text-align:center;color:#0f172a;}
.sl-edit-search-box{position:relative;}.sl-edit-drop{display:none;position:fixed;z-index:100000;background:#fff;border:1px solid #d8e8ed;border-radius:16px;max-height:240px;overflow-y:auto;box-shadow:0 12px 28px rgba(15,23,42,.14);min-width:300px;padding:6px;}
.sl-edit-drop-row{width:100%;border:0;background:#fff;color:#0f172a;display:flex;align-items:center;justify-content:space-between;gap:12px;border-radius:12px;padding:10px 12px;cursor:pointer;font-weight:900;text-align:right;}
.sl-edit-drop-row:hover{background:#ecfeff;}.sl-edit-drop-row b{color:#0e7490;white-space:nowrap;}
.sl-audit-list-modal{width:min(1250px,98vw)!important;}.sl-audit-list-table th,.sl-audit-list-table td{text-align:right!important;}
@media(max-width:900px){.sl-edit-grid{grid-template-columns:1fr}.sl-edit-section.wide{grid-row:auto}}

/* COSTIX_LAST_UPDATE 2026-05-28 Phase6_from_phase5_audit_modal_restore
   SalesLog Audit Modal + cancelled orders view refinement only. No sync/storage/cache changes. */
#slOrderAuditModal .sl-audit-exec-modal,
#slAuditModal .sl-audit-exec-modal,
.sl-audit-exec-modal{
  width:min(1180px,96vw)!important;
  max-height:92vh!important;
  overflow:hidden!important;
  padding:18px!important;
  background:linear-gradient(180deg,#ffffff 0%,#f8feff 100%)!important;
  border:1px solid rgba(20,184,198,.18)!important;
  border-radius:28px!important;
  box-shadow:0 16px 44px rgba(15,23,42,.20)!important;
  color:#12343b!important;
}
.sl-audit-exec-head{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:14px!important;
  padding:16px 18px!important;
  margin-bottom:14px!important;
  border:1px solid rgba(20,184,198,.16)!important;
  border-radius:22px!important;
  background:linear-gradient(135deg,#ecfeff 0%,#ffffff 55%,#e8f7f8 100%)!important;
}
.sl-audit-kicker{display:inline-flex!important;align-items:center!important;gap:6px!important;border:1px solid rgba(20,184,198,.22)!important;background:#ffffff!important;color:#0e7490!important;border-radius:999px!important;padding:5px 11px!important;font-size:11px!important;font-weight:1000!important;}
.sl-audit-exec-head h3{margin:9px 0 4px!important;color:#12343b!important;font-size:24px!important;font-weight:1000!important;letter-spacing:-.4px!important;}
.sl-audit-exec-head p{margin:0!important;color:#64748b!important;font-size:13px!important;font-weight:900!important;}
.sl-audit-summary-exec{display:grid!important;grid-template-columns:repeat(4,minmax(130px,1fr))!important;gap:12px!important;margin:0 0 14px!important;}
.sl-audit-summary-exec .sl-audit-card{padding:14px!important;border-radius:20px!important;background:#ffffff!important;border:1px solid #e2e8f0!important;box-shadow:0 14px 32px rgba(15,23,42,.06)!important;min-height:86px!important;}
.sl-audit-summary-exec .sl-audit-card small{display:block!important;color:#64748b!important;font-weight:1000!important;font-size:12px!important;}
.sl-audit-summary-exec .sl-audit-card b{display:block!important;margin:7px 0 3px!important;color:#12343b!important;font-size:26px!important;font-weight:1000!important;line-height:1!important;}
.sl-audit-summary-exec .sl-audit-card em{font-style:normal!important;color:#94a3b8!important;font-size:11px!important;font-weight:900!important;}
.sl-audit-summary-exec .sl-audit-card.danger{background:#fff7f7!important;border-color:#fecaca!important;}
.sl-audit-summary-exec .sl-audit-card.danger b{color:#dc2626!important;}
.sl-audit-summary-exec .sl-audit-card.success{background:#f0fdf4!important;border-color:#bbf7d0!important;}
.sl-audit-summary-exec .sl-audit-card.success b{color:#16a34a!important;}
.sl-audit-summary-exec .sl-audit-card.info{background:#ecfeff!important;border-color:rgba(20,184,198,.22)!important;}
.sl-audit-summary-exec .sl-audit-card.info b{color:#0e7490!important;}
.sl-audit-filterbar{display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important;margin:0 0 12px!important;padding:10px!important;background:#f8fafc!important;border:1px solid #e2e8f0!important;border-radius:18px!important;}
.sl-audit-filterbar button{border:1px solid #e2e8f0!important;background:#ffffff!important;color:#334155!important;border-radius:999px!important;padding:8px 13px!important;font-weight:1000!important;cursor:pointer!important;box-shadow:none!important;}
.sl-audit-filterbar button b{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:22px!important;height:22px!important;margin-inline-start:6px!important;border-radius:999px!important;background:#ecfeff!important;color:#0e7490!important;font-size:11px!important;}
.sl-audit-filterbar button.active{background:#12343b!important;color:#ffffff!important;border-color:#12343b!important;}
.sl-audit-filterbar button.active b{background:#ffffff!important;color:#12343b!important;}
.sl-audit-table-shell{max-height:calc(92vh - 360px)!important;overflow:auto!important;border:1px solid #dbeafe!important;border-radius:22px!important;background:#ffffff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)!important;}
.sl-audit-exec-table{width:100%!important;border-collapse:separate!important;border-spacing:0!important;table-layout:fixed!important;background:#ffffff!important;color:#12343b!important;}
.sl-audit-exec-table th{position:sticky!important;top:0!important;z-index:2!important;text-align:right!important;padding:13px 12px!important;background:linear-gradient(180deg,#eafbfc,#dff4f6)!important;color:#12343b!important;border-bottom:1px solid rgba(20,184,198,.2)!important;font-size:12px!important;font-weight:1000!important;}
.sl-audit-exec-table td{padding:13px 12px!important;border-bottom:1px solid #edf2f7!important;background:#ffffff!important;color:#12343b!important;font-size:12px!important;font-weight:850!important;vertical-align:top!important;white-space:normal!important;overflow-wrap:anywhere!important;box-shadow:none!important;}
.sl-audit-exec-table tbody tr:nth-child(even) td{background:#f8feff!important;}
.sl-audit-exec-table tbody tr:hover td{background:#ecfeff!important;}
.sl-audit-op{display:inline-flex!important;align-items:center!important;gap:6px!important;border-radius:999px!important;padding:7px 10px!important;border:1px solid rgba(20,184,198,.18)!important;background:#ecfeff!important;color:#0e7490!important;font-weight:1000!important;white-space:nowrap!important;}
.sl-audit-op.danger{background:#fff1f2!important;border-color:#fecdd3!important;color:#be123c!important;}
.sl-audit-op.success{background:#f0fdf4!important;border-color:#bbf7d0!important;color:#15803d!important;}
.sl-audit-op.warn{background:#fffbeb!important;border-color:#fde68a!important;color:#b45309!important;}
.sl-audit-op.info{background:#eff6ff!important;border-color:#bfdbfe!important;color:#1d4ed8!important;}
.sl-audit-reason{display:inline-block!important;max-width:100%!important;border-radius:12px!important;padding:6px 9px!important;background:#f8fafc!important;border:1px solid #e2e8f0!important;color:#475569!important;font-weight:900!important;}
.sl-audit-empty-panel{padding:32px!important;text-align:center!important;background:#f8feff!important;border:1px dashed rgba(20,184,198,.28)!important;border-radius:20px!important;color:#64748b!important;font-weight:1000!important;}
.sl-audit-foot{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;flex-wrap:wrap!important;margin-top:12px!important;padding:12px!important;background:#f8fafc!important;border:1px solid #e2e8f0!important;border-radius:16px!important;color:#475569!important;font-weight:1000!important;}
#page-sales .sl-tabs button,
#page-saleslog .sl-tabs button{white-space:nowrap!important;}
#page-sales .sl-table-panel .sl-row-action,
#page-saleslog .sl-table-panel .sl-row-action{border-radius:999px!important;padding:7px 12px!important;font-weight:1000!important;}
#page-sales .sl-audit-badge,
#page-saleslog .sl-audit-badge{background:#ecfeff!important;border:1px solid rgba(20,184,198,.24)!important;color:#0e7490!important;border-radius:999px!important;padding:7px 10px!important;min-width:82px!important;box-shadow:none!important;}
#page-sales .sl-audit-badge.is-danger,
#page-saleslog .sl-audit-badge.is-danger{background:#fff1f2!important;border-color:#fecdd3!important;color:#be123c!important;}
@media(max-width:900px){.sl-audit-summary-exec{grid-template-columns:1fr 1fr!important}.sl-audit-exec-head{flex-direction:column!important}.sl-audit-exec-table th,.sl-audit-exec-table td{font-size:11px!important;padding:9px 7px!important}.sl-audit-table-shell{max-height:calc(92vh - 430px)!important}}
@media(max-width:620px){.sl-audit-summary-exec{grid-template-columns:1fr!important}.sl-audit-exec-modal{padding:10px!important}.sl-audit-exec-head h3{font-size:19px!important}.sl-audit-filterbar button{flex:1 1 42%!important}}

/* COSTIX_LAST_UPDATE 2026-05-28 Phase7_saleslog_pro_modals_deleted_restore
   Clean replacement styling for SalesLog professional modals/deleted orders view. */
#page-sales .sl-tabs button:not(.active),
#page-saleslog .sl-tabs button:not(.active){display:inline-flex!important;}
.sl-pro-modal-bg{background:rgba(15,23,42,.46)!important;z-index:99999!important;}
.sl-pro-modal{width:min(1450px,96vw)!important;max-height:92vh!important;overflow:hidden!important;background:linear-gradient(180deg,#ffffff 0%,#f8feff 100%)!important;border:1px solid #dbeafe!important;border-radius:24px!important;padding:18px!important;box-shadow:0 16px 44px rgba(15,23,42,.19)!important;color:#12343b!important;direction:rtl!important;}
.sl-pro-modal-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;margin-bottom:14px!important;padding-bottom:12px!important;border-bottom:1px solid #e2e8f0!important;}
.sl-pro-close{width:42px!important;height:42px!important;border-radius:14px!important;border:1px solid #dbeafe!important;background:#fff!important;color:#0f172a!important;font-size:24px!important;line-height:1!important;cursor:pointer!important;}
.sl-pro-title{display:flex!important;align-items:center!important;gap:12px!important;min-width:0!important;}.sl-pro-title h3{margin:0!important;font-size:24px!important;font-weight:1000!important;color:#0f172a!important;}.sl-pro-title p{margin:4px 0 0!important;color:#64748b!important;font-weight:850!important;font-size:13px!important;}.sl-pro-icon{width:42px!important;height:42px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;border-radius:16px!important;background:#ecfeff!important;border:1px solid rgba(20,184,198,.22)!important;font-size:20px!important;}
.sl-pro-status{display:flex!important;align-items:center!important;gap:10px!important;flex-wrap:wrap!important;}.sl-pro-status span{background:#dcfce7!important;color:#15803d!important;border:1px solid #bbf7d0!important;border-radius:999px!important;padding:7px 12px!important;font-weight:1000!important;}.sl-pro-status.danger span{background:#fff1f2!important;color:#be123c!important;border-color:#fecdd3!important}.sl-pro-status b{color:#0f172a!important;font-size:20px!important;font-weight:1000!important;}
.sl-pro-meta-line{display:flex!important;justify-content:flex-end!important;gap:14px!important;flex-wrap:wrap!important;color:#64748b!important;font-weight:900!important;margin:-4px 0 14px!important;}
.sl-pro-kpi-row{display:grid!important;grid-template-columns:repeat(4,minmax(150px,1fr))!important;gap:12px!important;margin-bottom:14px!important;}.sl-pro-kpi-row.compact{grid-template-columns:repeat(4,minmax(130px,1fr))!important}.sl-pro-kpi{background:#fff!important;border:1px solid #e2e8f0!important;border-radius:20px!important;padding:14px!important;min-height:92px!important;box-shadow:0 5px 14px rgba(15,23,42,.045)!important;}.sl-pro-kpi small{display:block!important;color:#64748b!important;font-size:12px!important;font-weight:1000!important;}.sl-pro-kpi b{display:block!important;margin-top:8px!important;color:#0f172a!important;font-size:22px!important;font-weight:1000!important;overflow-wrap:anywhere!important;}.sl-pro-kpi em{display:block!important;margin-top:4px!important;color:#94a3b8!important;font-style:normal!important;font-size:11px!important;font-weight:900!important;}.sl-pro-kpi.soft-blue{background:linear-gradient(135deg,#f0f9ff,#ffffff)!important;border-color:#bfdbfe!important}.sl-pro-kpi.soft-green{background:linear-gradient(135deg,#f0fdf4,#ffffff)!important;border-color:#bbf7d0!important}.sl-pro-kpi.soft-green b{color:#16a34a!important}.sl-pro-kpi.soft-amber{background:linear-gradient(135deg,#fffbeb,#ffffff)!important;border-color:#fde68a!important}.sl-pro-kpi.soft-amber b{color:#b45309!important}.sl-pro-kpi.soft-red{background:linear-gradient(135deg,#fff1f2,#ffffff)!important;border-color:#fecdd3!important}.sl-pro-kpi.soft-red b{color:#be123c!important}
.sl-pro-filterbar{display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important;background:#f8fafc!important;border:1px solid #e2e8f0!important;border-radius:18px!important;padding:10px!important;margin-bottom:12px!important;}.sl-pro-filterbar button,.sl-pro-export{border:1px solid #e2e8f0!important;background:#fff!important;color:#334155!important;border-radius:14px!important;padding:9px 14px!important;font-weight:1000!important;cursor:pointer!important;}.sl-pro-filterbar button.active{background:#14b8c6!important;color:#fff!important;border-color:#14b8c6!important;}.sl-pro-filterbar button b{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-width:22px!important;height:22px!important;border-radius:999px!important;background:#ecfeff!important;color:#0e7490!important;margin-inline-start:6px!important}.sl-pro-export{background:#04adc0!important;color:#fff!important;border-color:#04adc0!important;box-shadow:0 5px 12px rgba(4,173,192,.12)!important;}
.sl-pro-table-shell{width:100%!important;max-height:calc(92vh - 360px)!important;overflow:auto!important;background:#fff!important;border:1px solid #dbeafe!important;border-radius:20px!important;}.sl-pro-detail-items{max-height:38vh!important}.sl-pro-table{width:100%!important;border-collapse:separate!important;border-spacing:0!important;table-layout:fixed!important;background:#fff!important;color:#0f172a!important;}.sl-pro-table th{position:sticky!important;top:0!important;z-index:2!important;background:linear-gradient(180deg,#eafbfc,#dff4f6)!important;color:#12343b!important;border-bottom:1px solid rgba(20,184,198,.22)!important;text-align:right!important;padding:13px 11px!important;font-size:12px!important;font-weight:1000!important;white-space:normal!important;}.sl-pro-table td{padding:13px 11px!important;border-bottom:1px solid #edf2f7!important;color:#0f172a!important;background:#fff!important;font-size:12px!important;font-weight:850!important;vertical-align:middle!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word!important;box-shadow:none!important;}.sl-pro-table td small{display:block!important;margin-top:4px!important;color:#64748b!important;font-size:10px!important;font-weight:800!important;}.sl-pro-table tbody tr:nth-child(even) td{background:#f8feff!important;}.sl-pro-table tbody tr:hover td{background:#ecfeff!important;}.sl-pro-table td.ok{color:#16a34a!important;font-weight:1000!important}.sl-pro-table td.bad{color:#dc2626!important;font-weight:1000!important}
.sl-pro-op,.sl-pro-pill,.sl-pro-user,.sl-pro-time{display:inline-flex!important;align-items:center!important;gap:6px!important;border-radius:999px!important;padding:7px 10px!important;border:1px solid rgba(20,184,198,.2)!important;background:#ecfeff!important;color:#0e7490!important;font-weight:1000!important;white-space:nowrap!important;}.sl-pro-op.danger,.sl-pro-pill.danger{background:#fff1f2!important;border-color:#fecdd3!important;color:#be123c!important}.sl-pro-op.success{background:#f0fdf4!important;border-color:#bbf7d0!important;color:#15803d!important}.sl-pro-op.warn{background:#fffbeb!important;border-color:#fde68a!important;color:#b45309!important}.sl-pro-op.info{background:#eff6ff!important;border-color:#bfdbfe!important;color:#1d4ed8!important}.sl-pro-user{background:#f8fafc!important;color:#334155!important;border-color:#e2e8f0!important}.sl-pro-time{background:#f8fafc!important;color:#475569!important;border-color:#e2e8f0!important}
.sl-pro-total-strip{display:grid!important;grid-template-columns:repeat(4,minmax(160px,1fr))!important;gap:10px!important;margin-top:12px!important;}.sl-pro-total-strip div,.sl-pro-service-box div{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;border:1px solid #e2e8f0!important;background:#f8fafc!important;border-radius:16px!important;padding:12px!important;font-weight:1000!important;}.sl-pro-total-strip .final{background:#ecfeff!important;border-color:rgba(20,184,198,.24)!important}.sl-pro-service-box{display:grid!important;grid-template-columns:repeat(2,minmax(160px,1fr))!important;gap:8px!important;margin-top:10px!important}.sl-pro-modal-foot{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;flex-wrap:wrap!important;margin-top:12px!important;padding-top:12px!important;border-top:1px solid #e2e8f0!important;color:#64748b!important;font-weight:1000!important;}
.sl-pro-section-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin:0 0 14px!important;padding:16px!important;background:#fff!important;border:1px solid #dbeafe!important;border-radius:22px!important;box-shadow:0 5px 14px rgba(15,23,42,.045)!important;}.sl-pro-section-head h3{margin:0!important;color:#0f172a!important;font-size:24px!important;font-weight:1000!important}.sl-pro-section-head p{margin:4px 0 0!important;color:#64748b!important;font-weight:850!important}.sl-pro-warning{margin-top:12px!important;padding:14px!important;border:1px solid #fecdd3!important;background:#fff1f2!important;color:#be123c!important;border-radius:16px!important;text-align:center!important;font-weight:1000!important}.sl-pro-deleted-page{display:block!important;}
@media(max-width:980px){.sl-pro-modal{width:98vw!important;padding:12px!important}.sl-pro-kpi-row,.sl-pro-kpi-row.compact{grid-template-columns:1fr 1fr!important}.sl-pro-total-strip{grid-template-columns:1fr 1fr!important}.sl-pro-modal-head,.sl-pro-section-head{flex-direction:column!important;align-items:stretch!important}.sl-pro-table th,.sl-pro-table td{font-size:10px!important;padding:9px 7px!important}}
@media(max-width:620px){.sl-pro-kpi-row,.sl-pro-kpi-row.compact,.sl-pro-total-strip,.sl-pro-service-box{grid-template-columns:1fr!important}.sl-pro-filterbar button,.sl-pro-export{flex:1 1 42%!important}.sl-pro-title h3{font-size:19px!important}.sl-pro-table-shell{max-height:50vh!important}}

/* COSTIX_LAST_UPDATE 2026-05-28 Phase8_saleslog_modal_resize_smartpdf_cleanup
   Clean sizing replacement for SalesLog professional modals after removing per-modal PDF buttons.
   Scope: SalesLog modal UI only. No data/accounting/sync/cache behavior. */
.sl-pro-modal-bg{background:rgba(15,23,42,.48)!important;backdrop-filter:blur(10px)!important;z-index:99999!important;}
.sl-pro-modal{
  width:min(1720px,94vw)!important;
  max-width:94vw!important;
  height:auto!important;
  max-height:92vh!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  padding:20px!important;
  border-radius:26px!important;
}
.sl-pro-kpi-modal,.sl-pro-audit-modal,.sl-pro-detail-modal{width:min(1720px,94vw)!important;}
.sl-pro-modal-head{flex:0 0 auto!important;}
.sl-pro-kpi-row{flex:0 0 auto!important;grid-template-columns:repeat(auto-fit,minmax(185px,1fr))!important;}
.sl-pro-table-shell{
  flex:1 1 auto!important;
  width:100%!important;
  max-width:100%!important;
  min-height:260px!important;
  max-height:calc(92vh - 310px)!important;
  overflow:auto!important;
  border-radius:18px!important;
}
.sl-pro-detail-modal .sl-pro-table-shell{max-height:calc(92vh - 430px)!important;}
.sl-pro-audit-modal .sl-pro-table-shell{max-height:calc(92vh - 360px)!important;}
.sl-pro-table{
  width:100%!important;
  min-width:980px!important;
  table-layout:auto!important;
}
.sl-pro-table th,.sl-pro-table td{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  vertical-align:middle!important;
}
.sl-pro-modal-foot{flex:0 0 auto!important;}
.sl-pro-export{display:none!important;}
@media(max-width:1100px){.sl-pro-modal{width:98vw!important;max-width:98vw!important;padding:12px!important}.sl-pro-table{min-width:900px!important}.sl-pro-table-shell{max-height:calc(92vh - 300px)!important}}

/* COSTIX_LAST_UPDATE phase3_callcenter_audit_actions_20260528
   Call Center saved-order audit/actions/late modal styling.
   Central CSS only; no inline theme override or duplicate dark UI ownership. */
.cc-stat-card.audit{
  border:0; text-align:inherit; cursor:pointer; appearance:none;
  background:linear-gradient(135deg,#f6ffff 0%,#e2fbfb 50%,#fff7db 100%);
  box-shadow:0 18px 40px rgba(11,92,94,.13);
}
.cc-stat-card.audit:hover{transform:translateY(-2px);box-shadow:0 22px 48px rgba(11,92,94,.18)}
.cc-audit-badge{display:inline-flex;align-items:center;gap:6px;border:1px solid #b7eded;background:#efffff;color:#245f62;border-radius:999px;padding:5px 8px;font-weight:900;cursor:pointer;white-space:nowrap;max-width:135px;justify-content:center}
.cc-audit-badge b{font-family:var(--fm);font-size:12px}.cc-audit-badge span{font-size:11px;overflow:hidden;text-overflow:ellipsis}.cc-audit-badge.empty{background:#f8ffff;color:#7aa1a3;border-style:dashed}.cc-audit-badge.danger{background:#fff1f2;color:#b42318;border-color:#fecdd3}.cc-audit-badge.warn{background:#fff8e1;color:#946200;border-color:#fde68a}.cc-audit-badge.info{background:#eef7ff;color:#0f5f9b;border-color:#bfdbfe}.cc-audit-badge.ok{background:#ecfdf5;color:#067647;border-color:#bbf7d0}
.cc-row-btn.edit{background:#fff7d6;color:#7c5600;border-color:#f6d66c}.cc-row-btn.cancel{background:#fff1f2;color:#b42318;border-color:#fecdd3}.cc-row-btn.cancel:hover,.cc-row-btn.edit:hover{filter:brightness(.98);transform:translateY(-1px)}
.cc-action-modal,.cc-audit-modal,.cc-late-modal{width:min(980px,96vw);max-height:88vh;overflow:auto;border-radius:24px;background:#f6ffff;border:1px solid #c7f1f1;box-shadow:0 28px 70px rgba(4,67,69,.24)}
.cc-action-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid #cceeee}.cc-action-modal-head b{display:block;font-size:20px;color:#174f51}.cc-action-modal-head span{display:block;font-size:12px;color:#5c8688;margin-top:3px}.cc-action-modal-head button{width:36px;height:36px;border:0;border-radius:14px;background:#e7fbfb;color:#245f62;cursor:pointer;font-weight:900}
.cc-action-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}.cc-action-grid .wide{grid-column:1/-1}.cc-action-grid textarea.fi{min-height:84px;resize:vertical;line-height:1.7}
.cc-audit-list{display:grid;gap:10px;max-height:62vh;overflow:auto;padding-inline-end:4px}.cc-audit-list.compact-list{max-height:280px}.cc-audit-line{position:relative;display:grid;grid-template-columns:20px 1fr;gap:10px;padding:10px;border-radius:16px;background:#fff;border:1px solid #d7f0f0}.cc-audit-line.compact{padding:8px}.cc-audit-dot{width:12px;height:12px;border-radius:50%;margin-top:5px;background:#38b2ac;box-shadow:0 0 0 5px #e6fffb}.cc-audit-line.danger .cc-audit-dot{background:#ef4444;box-shadow:0 0 0 5px #fee2e2}.cc-audit-line.warn .cc-audit-dot{background:#f59e0b;box-shadow:0 0 0 5px #fef3c7}.cc-audit-line.info .cc-audit-dot{background:#3b82f6;box-shadow:0 0 0 5px #dbeafe}.cc-audit-top{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}.cc-audit-top b{color:#174f51}.cc-audit-top span,.cc-audit-body small{color:#6a8e90;font-size:11px}.cc-audit-reason,.cc-audit-details{margin-top:6px;font-size:12px;color:#2b696b;background:#f0ffff;border-radius:12px;padding:7px 9px}.cc-audit-changes{margin:7px 0 0;padding:0 18px 0 0;color:#245f62;font-size:12px}.cc-audit-order-ref{display:block}.cc-audit-order-ref>b{display:inline-flex;margin-bottom:6px;background:#307D7E;color:white;border-radius:999px;padding:4px 10px;font-family:var(--fm)}
.cc-modal-section-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.cc-modal-section-title h4{margin:0;color:#174f51}.cc-empty-state.mini{padding:14px;min-height:auto}.cc-late-list{max-height:65vh;overflow:auto}.cc-duration.late{color:#b42318;font-weight:900}.cc-order-modal .btn-red,.cc-action-modal .btn-red{background:#ef4444;color:#fff;border-color:#ef4444}.cc-order-modal .btn-red:hover,.cc-action-modal .btn-red:hover{background:#dc2626}
@media(max-width:760px){.cc-action-modal,.cc-audit-modal,.cc-late-modal{width:98vw;border-radius:20px}.cc-action-grid{grid-template-columns:1fr}.cc-audit-top{display:block}.cc-audit-badge{max-width:110px}}

/* COSTIX_LAST_UPDATE phase4_callcenter_alltab_item_edit_cancel_modal_20260528
   Clean extension for Call Center saved-order edit/cancel modals. */
.cc-edit-order-modal{width:min(1060px,96vw)}
.cc-edit-items-box{background:#ffffff;border:1px solid #d7f0f0;border-radius:18px;padding:12px;display:grid;gap:12px}
.cc-soft-hint{font-size:11px;color:#6a8e90;font-weight:900}
.cc-edit-items-list{display:grid;gap:8px;max-height:240px;overflow:auto;padding-inline-end:3px}
.cc-edit-item-row{display:grid;grid-template-columns:1fr 140px auto;gap:10px;align-items:end;background:#f7ffff;border:1px solid #d7f0f0;border-radius:15px;padding:10px}
.cc-edit-item-row b{display:block;color:#174f51;font-size:13px;font-weight:1000}
.cc-edit-item-row small{display:block;color:#6a8e90;font-size:11px;margin-top:3px}
.cc-edit-item-row label{display:grid;gap:4px;margin:0}.cc-edit-item-row label span{font-size:11px;color:#557a7d;font-weight:1000}
.cc-edit-add-item{display:grid;grid-template-columns:1fr 140px;gap:10px;background:#effefe;border:1px dashed #aee4e6;border-radius:16px;padding:10px}
.cc-reason-pin-modal{width:min(520px,94vw)}
.cc-pin-input{text-align:center!important;letter-spacing:8px!important;font-size:18px!important;font-family:var(--fm),'Cairo',monospace!important}
.cc-cancel-summary{display:grid;gap:4px;background:#fff1f2;border:1px solid #fecdd3;color:#9f1239;border-radius:14px;padding:8px 10px;font-size:11px;line-height:1.45}
.cc-cancel-summary b{color:#9f1239}.cc-cancel-summary span{color:#be123c}.cc-cancel-summary small{color:#64748b}
@media(max-width:760px){.cc-edit-item-row,.cc-edit-add-item{grid-template-columns:1fr}.cc-edit-items-list{max-height:320px}}

/* COSTIX_LAST_UPDATE: phase6_callcenter_edit_pin_and_item_replace_2026-05-28
   Clean extension for Call Center saved-order editor: item replacement selector + inline edit PIN. */
.cc-edit-item-row.cc-edit-item-row-pro{grid-template-columns:minmax(150px,1fr) minmax(220px,1.4fr) 120px auto;align-items:end}
.cc-edit-item-row.cc-edit-item-row-pro .cc-edit-item-menu{min-width:0;width:100%}
.cc-edit-order-modal .cc-pin-input{letter-spacing:7px;text-align:center;font-weight:900}
@media(max-width:980px){.cc-edit-item-row.cc-edit-item-row-pro{grid-template-columns:1fr 1fr}.cc-edit-item-row.cc-edit-item-row-pro .cc-row-btn{width:100%}}
@media(max-width:760px){.cc-edit-item-row.cc-edit-item-row-pro{grid-template-columns:1fr}}


/* COSTIX_LAST_UPDATE 2026-05-28 Phase12_order_details_premium_modal
   Unified premium Order Details modal for Call Center and SalesLog.
   Clean replacement CSS only; no sync/realtime/storage/order-numbering changes. */
.cc-detail-modal-bg,.costix-detail-modal-bg{background:rgba(15,23,42,.48)!important;backdrop-filter:blur(12px)!important;z-index:99999!important;align-items:center!important;justify-content:center!important;padding:18px!important;}
.costix-order-detail-modal{width:min(1720px,96vw)!important;height:min(920px,92vh)!important;max-height:92vh!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;background:linear-gradient(180deg,#ffffff 0%,#f8feff 100%)!important;border:1px solid #d8edf0!important;border-radius:28px!important;box-shadow:0 34px 90px rgba(15,23,42,.28)!important;color:#0f172a!important;padding:0!important;direction:rtl!important;}
.costix-detail-head{flex:0 0 auto;display:grid;grid-template-columns:64px minmax(330px,.8fr) minmax(420px,1.2fr);gap:18px;align-items:center;padding:22px 28px;background:linear-gradient(135deg,#ffffff 0%,#f2ffff 70%,#ecfeff 100%);border-bottom:1px solid #dbeafe;}
.costix-detail-close{width:48px;height:48px;border-radius:999px;border:1px solid #aee4e6;background:#f0ffff;color:#0e7490;font-size:28px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(20,184,198,.12)}
.costix-detail-title-block{justify-self:end;text-align:right}.costix-detail-title-block small{display:block;color:#64748b;font-weight:900;margin-bottom:3px}.costix-detail-title-block h2{margin:0;color:#0f172a;font-size:40px;line-height:1;font-weight:1000;letter-spacing:.5px}.costix-detail-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.costix-status-badge{display:inline-flex;align-items:center;gap:6px;border-radius:12px;border:1px solid #dbeafe;background:#fff;color:#334155;padding:8px 13px;font-weight:1000;font-size:13px}.costix-status-badge.success{background:#f0fdf4;border-color:#bbf7d0;color:#15803d}.costix-status-badge.danger{background:#fff1f2;border-color:#fecdd3;color:#be123c}.costix-status-badge.teal{background:#ecfeff;border-color:#a5f3fc;color:#0e7490}.costix-status-badge.soft{background:#f8fafc;border-color:#e2e8f0;color:#475569}
.costix-detail-meta{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));gap:10px}.costix-detail-meta>div{min-height:80px;border-inline-start:1px solid #e2e8f0;padding-inline-start:16px;display:flex;flex-direction:column;justify-content:center}.costix-detail-meta span{color:#64748b;font-size:12px;font-weight:900}.costix-detail-meta b{font-size:18px;color:#0f172a;margin-top:4px;overflow-wrap:anywhere}.costix-detail-meta small{color:#64748b;font-weight:800;margin-top:5px}
.costix-detail-tabs{flex:0 0 auto;display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:14px 28px;border-bottom:1px solid #e2e8f0;background:#ffffff}.costix-detail-tabs button{height:56px;border:0;border-bottom:4px solid transparent;border-radius:16px 16px 10px 10px;background:transparent;color:#334155;font-weight:1000;font-size:15px;cursor:default}.costix-detail-tabs button.active{background:#f8feff;border-color:#14b8c6;color:#0891b2;box-shadow:0 10px 24px rgba(20,184,198,.12)}
.costix-detail-body{flex:1 1 auto;min-height:0;overflow:auto;padding:20px 28px;display:grid;grid-template-columns:minmax(260px,.72fr) minmax(460px,1.2fr) minmax(320px,.82fr);gap:18px;background:linear-gradient(180deg,#ffffff,#f8feff)}
.costix-detail-side,.costix-detail-main,.costix-detail-timeline{min-width:0;display:flex;flex-direction:column;gap:14px}.costix-detail-card{background:#fff;border:1px solid #dbeafe;border-radius:22px;padding:18px;box-shadow:0 16px 38px rgba(15,23,42,.07);min-width:0}.costix-detail-card h3{margin:0 0 14px;color:#0e7490;font-size:18px;font-weight:1000}.costix-detail-card.danger-card h3{color:#dc2626}.costix-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.costix-card-head h3{margin:0}.costix-card-head span{display:inline-flex;min-width:34px;justify-content:center;border-radius:999px;background:#ecfeff;color:#0e7490;border:1px solid #a5f3fc;padding:5px 10px;font-weight:1000;font-size:12px}
.costix-money-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px dashed #e2e8f0;color:#334155;font-weight:900}.costix-money-row b{font-family:var(--fm,'IBM Plex Mono',monospace);color:#0f766e}.costix-money-row b.danger{color:#dc2626}.costix-total-final{margin-top:16px;border:1px solid #fde68a;background:#fffbeb;border-radius:18px;padding:16px;display:flex;align-items:center;justify-content:space-between;font-size:20px;font-weight:1000;color:#92400e}.costix-total-final b{font-size:26px;color:#0e7490;font-family:var(--fm,'IBM Plex Mono',monospace)}
.costix-cancel-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:10px;align-items:center}.costix-cancel-grid span{color:#64748b;font-size:12px;font-weight:900}.costix-cancel-grid b{color:#0f172a;font-size:13px;overflow-wrap:anywhere}.costix-soft-text{margin:0;color:#64748b;font-weight:850;line-height:1.8}.costix-info-line,.costix-info-note{margin-top:12px;background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe;border-radius:14px;padding:12px;font-weight:900}.costix-info-note{text-align:center;background:#ecfeff;color:#0e7490;border-color:#a5f3fc}
.costix-detail-table-shell{max-height:52vh;overflow:auto;border:1px solid #e2e8f0;border-radius:18px;background:#fff}.costix-detail-table{width:100%;border-collapse:separate;border-spacing:0;min-width:760px}.costix-detail-table th{position:sticky;top:0;z-index:2;background:#f1f5f9;color:#475569;padding:14px 12px;font-size:12px;font-weight:1000;text-align:right;border-bottom:1px solid #e2e8f0}.costix-detail-table td{padding:15px 12px;border-bottom:1px solid #edf2f7;color:#0f172a;font-size:13px;font-weight:900;vertical-align:middle}.costix-detail-table tbody tr:hover td{background:#ecfeff}.costix-detail-item-name b{display:block;color:#0f172a}.costix-detail-item-name small{display:block;color:#64748b;font-size:11px;margin-top:4px;font-weight:850}.cc-detail-empty-cell,.cc-detail-empty{padding:20px;text-align:center;color:#64748b;background:#f8fafc;border-radius:16px;font-weight:1000}
.costix-timeline-list,.costix-sl-timeline-list{display:grid;gap:12px;max-height:54vh;overflow:auto;padding-inline-end:5px}.costix-sl-timeline-card{display:grid;grid-template-columns:46px 1fr;gap:12px;align-items:flex-start;border:1px solid #e2e8f0;border-radius:18px;background:#fff;padding:14px;position:relative}.costix-sl-timeline-card:after{content:"";position:absolute;inset-inline-start:22px;top:52px;bottom:-14px;width:2px;background:#14b8c6}.costix-sl-timeline-card:last-child:after{display:none}.costix-sl-timeline-icon{width:42px;height:42px;border-radius:14px;background:#ecfeff;border:1px solid #a5f3fc;display:flex;align-items:center;justify-content:center;font-size:20px}.costix-sl-timeline-card b{color:#0f172a;font-weight:1000}.costix-sl-timeline-card p{margin:5px 0;color:#475569;font-weight:850;line-height:1.5}.costix-sl-timeline-card small,.costix-sl-timeline-card em{display:block;color:#64748b;font-style:normal;font-size:11px;font-weight:850;margin-top:4px}.costix-sl-timeline-card.danger .costix-sl-timeline-icon{background:#fff1f2;border-color:#fecdd3;color:#be123c}.costix-sl-timeline-card.warn .costix-sl-timeline-icon{background:#fffbeb;border-color:#fde68a;color:#b45309}.costix-sl-timeline-card.success .costix-sl-timeline-icon{background:#f0fdf4;border-color:#bbf7d0;color:#15803d}.costix-sl-timeline-card.info .costix-sl-timeline-icon{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}
.costix-outline-btn{width:100%;height:46px;border:1px solid #a5f3fc;background:#f8feff;color:#0891b2;border-radius:14px;font-weight:1000;cursor:pointer;margin-top:12px}.costix-outline-btn:hover{background:#ecfeff}.costix-detail-foot{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 28px;border-top:1px solid #e2e8f0;background:#ffffff}.costix-foot-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.cc-detail-premium-modal .cc-audit-line{box-shadow:none!important}.cc-detail-premium-modal .cc-audit-list{max-height:none!important}.cc-detail-premium-modal .timeline-card{height:100%}.cc-detail-premium-modal .cc-audit-line{grid-template-columns:18px 1fr;background:#fff;border-color:#e2e8f0}.cc-detail-premium-modal .cc-audit-top b{color:#0f172a}.cc-detail-premium-modal .cc-audit-reason,.cc-detail-premium-modal .cc-audit-details{background:#f8fafc;color:#334155}.sl-pro-detail-modal.costix-sales-detail-modal{width:min(1720px,96vw)!important;height:min(920px,92vh)!important;padding:0!important;max-width:96vw!important}.sl-pro-detail-modal.costix-sales-detail-modal .costix-detail-body{max-height:none!important}.sl-pro-detail-modal.costix-sales-detail-modal .costix-detail-table{min-width:760px!important}
@media(max-width:1200px){.costix-detail-head{grid-template-columns:52px 1fr}.costix-detail-meta{grid-column:1/-1}.costix-detail-body{grid-template-columns:1fr}.costix-detail-table-shell,.costix-timeline-list,.costix-sl-timeline-list{max-height:42vh}.costix-detail-tabs{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.costix-order-detail-modal{width:98vw!important;height:94vh!important;border-radius:20px!important}.costix-detail-head{padding:14px;gap:10px}.costix-detail-title-block h2{font-size:28px}.costix-detail-meta{grid-template-columns:1fr}.costix-detail-meta>div{border-inline-start:0;border-top:1px solid #e2e8f0;padding:10px 0 0}.costix-detail-tabs{padding:10px 14px;grid-template-columns:1fr 1fr}.costix-detail-tabs button{height:46px;font-size:12px}.costix-detail-body{padding:14px}.costix-detail-foot{padding:14px;align-items:stretch;flex-direction:column}.costix-foot-actions{justify-content:stretch}.costix-foot-actions .btn{flex:1 1 100%}.costix-cancel-grid{grid-template-columns:1fr}.costix-total-final{font-size:16px}.costix-total-final b{font-size:20px}}

/* COSTIX_LAST_UPDATE 2026-05-28 Phase13_cc_detail_modal_width_and_all_tab_cancel_filter
   Force Call Center order details modal to use the same wide premium size as SalesLog.
   This replaces the global .modal max-width:600px conflict for this modal only. */
.modal.cc-detail-premium-modal.costix-order-detail-modal,
.cc-detail-premium-modal.costix-order-detail-modal,
.cc-detail-modal-bg .cc-detail-premium-modal.costix-order-detail-modal{
  width:min(1720px,96vw)!important;
  max-width:96vw!important;
  min-width:min(1180px,96vw)!important;
  height:min(920px,92vh)!important;
  max-height:92vh!important;
  overflow:hidden!important;
  padding:0!important;
}
.cc-detail-premium-modal.costix-order-detail-modal .costix-detail-body{
  max-height:none!important;
  overflow:auto!important;
  grid-template-columns:minmax(300px,.72fr) minmax(560px,1.22fr) minmax(360px,.86fr)!important;
}
.cc-detail-premium-modal.costix-order-detail-modal .costix-detail-table{min-width:760px!important;}
@media(max-width:1200px){
  .modal.cc-detail-premium-modal.costix-order-detail-modal,
  .cc-detail-premium-modal.costix-order-detail-modal{
    min-width:0!important;
    width:98vw!important;
  }
  .cc-detail-premium-modal.costix-order-detail-modal .costix-detail-body{grid-template-columns:1fr!important;}
}


/* COSTIX_LAST_UPDATE Phase14 — Call Center detail modal: show selected add-ons only as clean chips; empty add-ons stay as dash. */
.cc-detail-addon-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center;max-width:260px}
.cc-detail-addon-chips span{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;background:#ecfeff;border:1px solid #a5f3fc;color:#0f766e;font-size:11px;font-weight:1000;line-height:1.2;white-space:normal}
.cc-detail-no-addons{display:inline-flex;color:#94a3b8;font-weight:1000;justify-content:center;min-width:28px}
.cc-detail-premium-modal .costix-detail-item-name b{white-space:normal;line-height:1.45;word-break:break-word}
.cc-detail-premium-modal .costix-detail-table td:nth-child(4){min-width:140px;max-width:280px}

/* COSTIX_LAST_UPDATE phase20_callcenter_branch_filter_compact_2026-05-28
   Compact Call Center multi-branch filter. Replaces phase17 oversized branch filter CSS; CSS only, no data/sync changes. */
.cc-branch-field-modern{grid-column:span 2;min-width:260px;align-self:end;}
.cc-branch-filter-card{background:linear-gradient(135deg,#f4ffff 0%,#e9fbfb 60%,#ffffff 100%);border:1px solid rgba(48,125,126,.18);box-shadow:0 8px 18px rgba(20,96,98,.07);border-radius:18px;padding:8px 10px;display:grid;grid-template-columns:minmax(112px,auto) 1fr auto;align-items:center;gap:8px;min-height:54px;overflow:hidden;}
.cc-branch-filter-top{display:flex;align-items:center;justify-content:flex-start;gap:8px;color:#164f52;min-width:0;}
.cc-branch-filter-top span{font-size:10px;font-weight:950;color:#307D7E;display:block;line-height:1.1;}
.cc-branch-filter-top b{font-size:11px;font-weight:950;color:#123f42;display:block;margin-top:1px;max-width:116px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25;}
.cc-branch-filter-top small{background:#307D7E;color:#fff;border-radius:999px;padding:3px 7px;font-size:10px;font-weight:950;white-space:nowrap;line-height:1.2;}
.cc-branch-pills{display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;overflow-y:hidden;max-height:34px;padding:1px 1px 3px;scrollbar-width:thin;min-width:0;}
.cc-branch-pill{display:inline-flex;align-items:center;gap:5px;max-width:112px;min-height:28px;padding:5px 8px;border-radius:999px;background:#fff;border:1px solid rgba(48,125,126,.18);color:#276164;font-size:10px;font-weight:950;cursor:pointer;transition:.16s ease;box-shadow:0 4px 10px rgba(20,96,98,.05);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:0 0 auto;}
.cc-branch-pill input{display:none;}
.cc-branch-pill .cc-branch-mark{width:16px;height:16px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#e8fbfb;color:#307D7E;font-weight:950;font-size:9px;border:1px solid rgba(48,125,126,.18);flex:0 0 auto;}
.cc-branch-pill.on{background:#307D7E;color:#fff;border-color:#216c6e;box-shadow:0 6px 14px rgba(48,125,126,.18);}
.cc-branch-pill.on .cc-branch-mark{background:#fff;color:#307D7E;border-color:#fff;}
.cc-branch-pill.current{outline:1px solid rgba(232,163,23,.30);}
.cc-branch-pill em{font-style:normal;background:#e8a317;color:#3c2800;border-radius:999px;padding:1px 5px;font-size:9px;font-weight:950;line-height:1.3;flex:0 0 auto;}
.cc-branch-actions{display:flex;gap:5px;flex-wrap:nowrap;justify-content:flex-end;}
.cc-branch-actions button{border:0;border-radius:999px;padding:5px 8px;background:#d7f4f4;color:#20686a;font-size:10px;font-weight:950;cursor:pointer;white-space:nowrap;line-height:1.2;}
.cc-branch-actions button:hover{background:#c2eeee;}
.cc-remote-branch-lock{display:inline-flex;align-items:center;justify-content:center;padding:5px 8px;border-radius:999px;background:#eef7f7;color:#307D7E;border:1px solid rgba(48,125,126,.18);font-size:10px;font-weight:950;white-space:nowrap;}
@media(max-width:1100px){.cc-branch-filter-card{grid-template-columns:1fr;align-items:stretch}.cc-branch-pills{flex-wrap:wrap;max-height:72px}.cc-branch-actions{justify-content:flex-start}.cc-branch-field-modern{grid-column:1/-1}}
@media(max-width:900px){.cc-branch-field-modern{grid-column:1/-1}.cc-branch-pills{flex-wrap:wrap;max-height:86px}.cc-branch-pill{max-width:140px}}

/* COSTIX_LAST_UPDATE 2026-05-28 Phase26_channels_operations_center
   Premium light UI for مركز القنوات والتشغيل. Central CSS only; no inline style ownership. */
.ops-center{direction:rtl;color:#123f42;font-family:var(--font,'Cairo',sans-serif);padding:4px 0 24px;}
.ops-hero{display:flex;align-items:stretch;justify-content:space-between;gap:18px;padding:22px 24px;margin-bottom:16px;border-radius:28px;background:linear-gradient(135deg,#f8ffff 0%,#e9fbfb 52%,#d8f3f3 100%);border:1px solid rgba(48,125,126,.18);box-shadow:0 18px 45px rgba(20,96,98,.12);}
.ops-eyebrow{display:inline-flex;border-radius:999px;background:#307D7E;color:#fff;padding:6px 12px;font-weight:1000;font-size:12px;margin-bottom:10px;letter-spacing:.4px;}
.ops-hero h1{margin:0;color:#123f42;font-size:32px;font-weight:1000;line-height:1.15;}
.ops-hero p{margin:10px 0 0;color:#276164;font-weight:850;line-height:1.8;max-width:860px;}
.ops-hero-badge{min-width:210px;border-radius:22px;background:#ffffff;border:1px solid rgba(48,125,126,.16);padding:18px;display:flex;flex-direction:column;justify-content:center;box-shadow:0 12px 28px rgba(20,96,98,.08);}
.ops-hero-badge b{font-size:18px;color:#0f4c4f;font-weight:1000}.ops-hero-badge small{color:#5f7e80;font-weight:900;margin-top:5px}
.ops-kpis{display:grid;grid-template-columns:repeat(6,minmax(130px,1fr));gap:12px;margin-bottom:14px}.ops-kpi{display:flex;gap:12px;align-items:center;padding:14px;border-radius:20px;background:#ffffff;border:1px solid rgba(48,125,126,.14);box-shadow:0 10px 22px rgba(20,96,98,.07)}.ops-kpi-icon{width:42px;height:42px;border-radius:16px;background:#e8fbfb;color:#307D7E;display:flex;align-items:center;justify-content:center;font-size:22px}.ops-kpi small{display:block;color:#5f7e80;font-size:11px;font-weight:950}.ops-kpi b{display:block;color:#123f42;font-size:23px;font-weight:1000;font-family:var(--fm,'IBM Plex Mono',monospace)}
.ops-tabs{display:flex;gap:8px;overflow:auto;padding:8px 2px 12px;margin-bottom:8px;scrollbar-width:thin}.ops-tab{border:1px solid rgba(48,125,126,.18);background:#f8ffff;color:#1e6063;border-radius:999px;padding:10px 15px;display:inline-flex;align-items:center;gap:7px;font-weight:1000;white-space:nowrap;cursor:pointer;transition:.16s ease;box-shadow:0 6px 16px rgba(20,96,98,.05)}.ops-tab:hover{background:#e9fbfb}.ops-tab.active{background:#307D7E;color:#fff;border-color:#216c6e;box-shadow:0 10px 24px rgba(48,125,126,.20)}
.ops-content{min-height:420px}.ops-grid-main{display:grid;grid-template-columns:2fr 1fr;gap:14px}.ops-wide{grid-row:span 2}.ops-panel,.ops-section{background:#ffffff;border:1px solid rgba(48,125,126,.15);border-radius:24px;box-shadow:0 16px 34px rgba(20,96,98,.08);padding:18px;min-width:0}.ops-panel-head,.ops-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.ops-panel-head h3,.ops-section-head h2{margin:0;color:#123f42;font-weight:1000}.ops-section-head p,.ops-muted{margin:6px 0 0;color:#5f7e80;font-weight:850;line-height:1.8}.ops-branch-card{display:grid;gap:8px;background:#e8fbfb;border:1px solid rgba(48,125,126,.14);border-radius:18px;padding:16px}.ops-branch-card b{font-size:19px;color:#0f4c4f}.ops-branch-card span{color:#276164;font-weight:850;line-height:1.7}.ops-ready-row{display:grid;grid-template-columns:1fr 80px 120px;gap:10px;align-items:center;padding:13px 0;border-bottom:1px dashed rgba(48,125,126,.18);font-weight:950;color:#164f52}.ops-ready-row:last-child{border-bottom:0}.ops-ready-row b{font-family:var(--fm,'IBM Plex Mono',monospace);font-size:20px;color:#0f766e}.ops-ready-row em{font-style:normal;text-align:center;border-radius:999px;padding:7px 10px;font-size:12px}.ops-ready-row em.ok{background:#dcfce7;color:#15803d}.ops-ready-row em.warn{background:#fff7ed;color:#c2410c}.ops-search{margin-bottom:12px}.ops-search input,.ops-form-grid input,.ops-form-grid select,.ops-printer input,.ops-printer select{width:100%;border:1px solid rgba(48,125,126,.18);background:#f8ffff;color:#123f42;border-radius:14px;padding:11px 12px;font-weight:900;outline:none}.ops-search input:focus,.ops-form-grid input:focus,.ops-form-grid select:focus,.ops-printer input:focus,.ops-printer select:focus{border-color:#307D7E;box-shadow:0 0 0 3px rgba(48,125,126,.12)}
.ops-table-shell{overflow:auto;border-radius:18px;border:1px solid rgba(48,125,126,.16);background:#78c7c7}.ops-table{width:100%;border-collapse:separate;border-spacing:0;min-width:760px}.ops-table th{position:sticky;top:0;z-index:2;background:#3B9C9C;color:#fff;padding:13px 12px;font-size:12px;font-weight:1000;text-align:right}.ops-table td{background:#f8ffff;border-bottom:1px solid rgba(48,125,126,.10);padding:13px 12px;color:#123f42;font-weight:900;vertical-align:middle}.ops-table tbody tr:hover td{background:#e8fbfb}.ops-table b{display:block;color:#0f4c4f;font-weight:1000}.ops-table small{display:block;color:#5f7e80;font-size:11px;margin-top:4px;font-weight:850}.ops-status,.ops-flag{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:6px 9px;font-size:11px;font-weight:1000;margin-inline-end:4px}.ops-status.on{background:#dcfce7;color:#15803d}.ops-status.off{background:#fee2e2;color:#b91c1c}.ops-flag{background:#e8fbfb;color:#0f766e;border:1px solid rgba(48,125,126,.15)}.ops-actions{display:flex;gap:6px;flex-wrap:wrap}.ops-actions button{border:0;border-radius:999px;background:#d7f4f4;color:#20686a;padding:7px 10px;font-weight:1000;cursor:pointer}.ops-actions button.danger{background:#fee2e2;color:#b91c1c}.ops-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;color:#5f7e80;font-weight:900}.ops-empty b{color:#123f42;font-size:18px;margin-bottom:5px}.ops-empty.small{padding:18px;width:100%}.ops-table-map{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin-bottom:12px}.ops-table-tile{min-height:78px;border:1px solid rgba(48,125,126,.18);background:linear-gradient(180deg,#ffffff,#e8fbfb);border-radius:18px;color:#123f42;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;box-shadow:0 8px 18px rgba(20,96,98,.06)}.ops-table-tile b{font-size:18px}.ops-table-tile span{font-size:11px;color:#5f7e80;font-weight:900}.ops-table-tile.off{opacity:.55}.ops-printer-grid{display:grid;grid-template-columns:repeat(3,minmax(220px,1fr));gap:14px}.ops-printer{display:grid;gap:10px}.ops-printer label,.ops-form-grid label{display:grid;gap:6px;color:#276164;font-size:12px;font-weight:1000}.ops-check{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center;gap:8px;background:#f8ffff;border:1px solid rgba(48,125,126,.13);border-radius:14px;padding:10px 12px}.ops-check input{width:auto!important}.ops-form-grid{display:grid;grid-template-columns:repeat(2,minmax(180px,1fr));gap:12px;margin-top:14px}.ops-modal-bg{position:fixed;inset:0;background:rgba(15,23,42,.40);backdrop-filter:blur(10px);z-index:99999;display:flex;align-items:center;justify-content:center;padding:18px;opacity:0;transition:.16s ease}.ops-modal-bg.open{opacity:1}.ops-modal{width:min(760px,96vw);max-height:90vh;overflow:auto;background:#ffffff;border:1px solid rgba(48,125,126,.18);border-radius:28px;box-shadow:0 30px 90px rgba(15,23,42,.28);padding:22px;position:relative}.ops-modal h2{margin:0;color:#123f42;font-weight:1000}.ops-modal-x{position:absolute;inset-inline-start:16px;top:16px;width:40px;height:40px;border-radius:999px;border:0;background:#e8fbfb;color:#307D7E;font-size:24px;cursor:pointer}.ops-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.ops-denied{background:#fff1f2;color:#be123c;border:1px solid #fecdd3;border-radius:20px;padding:24px;font-size:18px;font-weight:1000;text-align:center}
@media(max-width:1200px){.ops-kpis{grid-template-columns:repeat(3,1fr)}.ops-grid-main{grid-template-columns:1fr}.ops-printer-grid{grid-template-columns:1fr}}
@media(max-width:720px){.ops-hero{flex-direction:column;padding:16px}.ops-hero h1{font-size:25px}.ops-kpis{grid-template-columns:1fr 1fr}.ops-section-head,.ops-panel-head{flex-direction:column}.ops-form-grid{grid-template-columns:1fr}.ops-ready-row{grid-template-columns:1fr 50px 100px}.ops-tabs{padding-bottom:8px}}

/* COSTIX_LAST_UPDATE 2026-05-28 Phase23_pos_light_cockpit_ui
   Clean light POS cockpit style aligned with Call Center pages.
   Replaces dark/heavy POS look with centralized CSS classes; no sync/realtime/storage/numbering changes. */
.costix-pos-light-cockpit{height:100%;min-height:0;background:linear-gradient(180deg,#f7feff 0%,#eef8f9 100%);color:#0f172a;display:flex;flex-direction:column;overflow:hidden;padding:14px;gap:12px;direction:rtl;--cx-pos-main:#307D7E;--cx-pos-panel:#3B9C9C;--cx-pos-soft:#78c7c7;--cx-pos-hover:#41627E;--cx-pos-gold:#d5a533;--cx-pos-gold2:#f4c95d;}
.costix-pos-topbar{flex:0 0 auto;display:grid;grid-template-columns:minmax(230px,.9fr) minmax(420px,1.2fr) minmax(210px,.55fr);gap:12px;align-items:center;background:#fff;border:1px solid rgba(48,125,126,.16);border-radius:22px;padding:12px 14px;box-shadow:0 18px 44px rgba(15,23,42,.07)}
.costix-pos-brand{display:flex;align-items:center;gap:12px;min-width:0}.costix-pos-brand-icon{width:48px;height:48px;border-radius:18px;background:linear-gradient(135deg,#e8fbfb,#d7f4f4);display:flex;align-items:center;justify-content:center;font-size:24px;border:1px solid rgba(48,125,126,.14)}.costix-pos-brand b{display:block;font-size:20px;font-weight:1000;color:#103f42}.costix-pos-brand small{display:block;color:#64748b;font-weight:850;margin-top:3px}
.costix-pos-quick-actions{display:flex;align-items:center;justify-content:center;gap:9px;min-width:0;flex-wrap:wrap}.costix-pos-qbtn{height:44px;padding:0 16px;border-radius:15px;border:1px solid rgba(48,125,126,.18);background:#f8ffff;color:#164f52;font-weight:1000;cursor:pointer;box-shadow:0 8px 18px rgba(20,96,98,.05)}.costix-pos-qbtn:hover{background:#e9fbfb;border-color:rgba(48,125,126,.28)}
.costix-pos-confirm-top{height:64px;border:0;border-radius:18px;background:linear-gradient(135deg,#d39b24,#f2c75c);color:#fff;display:grid;grid-template-columns:38px 1fr;grid-template-rows:1fr 1fr;align-items:center;column-gap:10px;padding:8px 18px;box-shadow:0 18px 34px rgba(180,124,19,.25);cursor:pointer;text-align:right}.costix-pos-confirm-top span{grid-row:1/3;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;font-size:22px}.costix-pos-confirm-top b{font-size:20px;font-weight:1000;line-height:1}.costix-pos-confirm-top small{font-family:var(--fm,'IBM Plex Mono',monospace);font-weight:1000;opacity:.95}.costix-pos-confirm-top.is-disabled{filter:grayscale(.3);opacity:.55;cursor:not-allowed;background:#cbd5e1;box-shadow:none;color:#475569}
.costix-pos-workspace{flex:1 1 auto;min-height:0;display:grid;grid-template-columns:360px minmax(0,1fr);gap:12px;overflow:hidden}.costix-pos-order-dock{min-height:0;display:flex;flex-direction:column;background:#fff;border:1px solid rgba(48,125,126,.18);border-radius:24px;overflow:hidden;box-shadow:0 18px 44px rgba(15,23,42,.07)}
.costix-pos-menu-area{min-width:0;min-height:0;display:flex;flex-direction:column;gap:12px;overflow:hidden}.costix-pos-controls-row{flex:0 0 auto;display:flex;align-items:stretch;gap:10px;min-height:74px}.costix-pos-note-card,.costix-pos-delivery-card{min-width:210px;border:1px dashed rgba(48,125,126,.32);border-radius:18px;background:#f8ffff;color:#164f52;display:grid;grid-template-columns:38px 1fr;grid-template-rows:1fr 1fr;align-items:center;text-align:right;gap:2px 10px;padding:10px 12px;cursor:pointer}.costix-pos-note-card span,.costix-pos-delivery-card span{grid-row:1/3;width:38px;height:38px;border-radius:14px;background:#e8fbfb;display:flex;align-items:center;justify-content:center;font-size:20px}.costix-pos-note-card b,.costix-pos-delivery-card b{font-size:13px;font-weight:1000;color:#103f42}.costix-pos-note-card small,.costix-pos-delivery-card small{font-size:11px;font-weight:850;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.costix-pos-note-card.has-note{border-style:solid;background:#fffbeb;border-color:#fde68a}.costix-pos-note-card.has-note span{background:#fef3c7}
.costix-pos-compact-group,.costix-pos-payment-group{display:flex;align-items:center;gap:7px;background:#fff;border:1px solid rgba(48,125,126,.16);border-radius:18px;padding:9px;box-shadow:0 10px 24px rgba(15,23,42,.04)}.costix-pos-chip,.costix-pos-pay-chip{height:52px;min-width:88px;border:1px solid rgba(48,125,126,.16);background:#f8ffff;color:#164f52;border-radius:15px;padding:6px 12px;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;font-weight:1000}.costix-pos-chip span,.costix-pos-pay-chip span{font-size:17px}.costix-pos-chip.on,.costix-pos-pay-chip.on{background:linear-gradient(135deg,#307D7E,#3B9C9C);border-color:#2d8a8c;color:#fff;box-shadow:0 12px 24px rgba(48,125,126,.18)}.costix-pos-payment-group{margin-inline-start:auto}.costix-pos-mini-fields{display:flex;gap:8px;background:#fff;border:1px solid rgba(48,125,126,.16);border-radius:18px;padding:8px}.costix-pos-mini-fields label{display:flex;flex-direction:column;gap:4px;color:#64748b;font-size:10px;font-weight:950}.costix-pos-mini-fields .fi{height:32px;min-width:92px;font-size:12px;padding:5px 8px}
.costix-pos-delivery-strip{flex:0 0 auto;display:grid;grid-template-columns:280px 1fr;gap:10px;align-items:stretch}.costix-pos-delivery-card.ok{border-style:solid;background:#f0fdf4;border-color:#bbf7d0}.costix-pos-delivery-card.ok span{background:#dcfce7}.costix-pos-delivery-card.warn{background:#fff7ed;border-color:#fed7aa}.costix-pos-delivery-services-mini{background:#fff;border:1px solid rgba(48,125,126,.16);border-radius:18px;overflow:auto}.costix-pos-delivery-services-mini>div{border-top:0!important;padding:9px 12px!important}
.costix-pos-menu-card{flex:1 1 auto;min-height:0;background:#fff;border:1px solid rgba(48,125,126,.18);border-radius:24px;box-shadow:0 18px 44px rgba(15,23,42,.07);display:flex;flex-direction:column;overflow:hidden}.costix-pos-menu-toolbar{flex:0 0 auto;display:flex;align-items:center;gap:10px;padding:12px;border-bottom:1px solid #dbeafe;background:linear-gradient(135deg,#ffffff,#f0ffff)}.costix-pos-search-box{width:250px;position:relative;flex:0 0 auto}.costix-pos-search-box input{width:100%;height:46px;border-radius:15px;border:1px solid rgba(48,125,126,.18);background:#fff;padding:0 42px 0 12px;font-weight:900;color:#0f172a}.costix-pos-search-box span{position:absolute;right:14px;top:50%;transform:translateY(-50%);color:#307D7E}.costix-pos-cats{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;flex:1 1 auto}.costix-pos-cat{height:44px;white-space:nowrap;border:1px solid rgba(48,125,126,.18);background:#fff;color:#164f52;border-radius:14px;padding:0 15px;font-weight:1000;cursor:pointer}.costix-pos-cat.on{background:#307D7E;color:#fff;border-color:#216c6e}.costix-pos-cat:hover:not(.on){background:#e9fbfb}
.costix-pos-products-grid{flex:1 1 auto;min-height:0;overflow:auto;padding:14px;display:grid;grid-template-columns:repeat(auto-fill,minmax(154px,1fr));gap:12px;align-content:start;background:linear-gradient(180deg,#f8ffff,#eef8f9)}.costix-pos-product{position:relative;min-height:156px;border:1px solid rgba(48,125,126,.18);border-radius:20px;background:#fff;color:#0f172a;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:14px 10px 42px;gap:5px;box-shadow:0 12px 28px rgba(15,23,42,.06);cursor:pointer;transition:.15s ease}.costix-pos-product:hover{transform:translateY(-2px);border-color:#3B9C9C;box-shadow:0 18px 34px rgba(48,125,126,.14)}.costix-pos-product.in-cart{border-color:#d5a533;background:#fffdf4}.costix-pos-product em{position:absolute;top:9px;right:9px;min-width:24px;height:24px;border-radius:999px;background:#307D7E;color:#fff;font-style:normal;font-family:var(--fm,'IBM Plex Mono',monospace);font-weight:1000;display:flex;align-items:center;justify-content:center;font-size:12px}.costix-pos-product-icon{width:58px;height:58px;border-radius:20px;background:#e8fbfb;display:flex;align-items:center;justify-content:center;font-size:30px;margin-bottom:4px}.costix-pos-product b{font-size:13px;font-weight:1000;line-height:1.35;min-height:34px;display:flex;align-items:center}.costix-pos-product small{font-size:10px;color:#64748b;font-weight:850;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.costix-pos-product strong{font-family:var(--fm,'IBM Plex Mono',monospace);font-size:13px;color:#b7791f;font-weight:1000}.costix-pos-product>span{position:absolute;left:10px;bottom:10px;width:30px;height:30px;border-radius:11px;background:#ecfeff;border:1px solid #a5f3fc;color:#0e7490;font-size:20px;display:flex;align-items:center;justify-content:center}.costix-pos-empty-products{grid-column:1/-1;text-align:center;color:#64748b;font-weight:1000;padding:60px 20px;background:#fff;border:1px dashed #cbd5e1;border-radius:18px}
.costix-pos-order-head{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 16px 12px;background:linear-gradient(135deg,#f8ffff,#e9fbfb);border-bottom:1px solid #dbeafe}.costix-pos-order-head small{display:block;color:#64748b;font-weight:900}.costix-pos-order-head b{font-family:var(--fm,'IBM Plex Mono',monospace);font-size:28px;color:#0f172a;font-weight:1000}.costix-pos-clear-btn{height:38px;border:1px solid #fecdd3;background:#fff1f2;color:#be123c;border-radius:13px;font-weight:1000;cursor:pointer;padding:0 12px}.costix-pos-order-tags{flex:0 0 auto;display:flex;gap:7px;flex-wrap:wrap;padding:10px 14px;background:#fff;border-bottom:1px solid #edf2f7}.costix-pos-order-tags span{display:inline-flex;align-items:center;gap:5px;padding:6px 10px;border-radius:999px;background:#ecfeff;color:#0e7490;border:1px solid #a5f3fc;font-size:11px;font-weight:1000}.costix-pos-customer-summary,.costix-pos-order-note-preview{margin:10px 12px 0;border-radius:16px;border:1px solid #fed7aa;background:#fff7ed;color:#9a3412;display:flex;align-items:center;gap:10px;padding:10px 12px;text-align:right;cursor:pointer}.costix-pos-customer-summary.ok{background:#f0fdf4;border-color:#bbf7d0;color:#166534}.costix-pos-customer-summary span{font-size:22px}.costix-pos-customer-summary b{display:block;font-weight:1000}.costix-pos-customer-summary small{display:block;font-weight:850;font-size:11px;color:#64748b}.costix-pos-order-note-preview{background:#fffbeb;border-color:#fde68a;color:#92400e;font-weight:950;line-height:1.5}
.costix-pos-cart-list{flex:1 1 auto;min-height:0;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:9px;background:#f8ffff}.costix-pos-empty-cart{margin:auto;text-align:center;color:#64748b}.costix-pos-empty-cart div{font-size:44px;margin-bottom:8px}.costix-pos-empty-cart b{display:block;color:#164f52;font-size:16px}.costix-pos-empty-cart small{font-weight:850}.costix-pos-cart-item{display:grid;grid-template-columns:34px 1fr auto;grid-template-areas:'remove main price' 'qty qty actions';gap:8px;align-items:center;background:#fff;border:1px solid rgba(48,125,126,.16);border-radius:18px;padding:10px;box-shadow:0 8px 18px rgba(15,23,42,.045)}.costix-pos-cart-remove{grid-area:remove;width:32px;height:32px;border-radius:12px;border:1px solid #fecdd3;background:#fff1f2;color:#be123c;cursor:pointer}.costix-pos-cart-main{grid-area:main;min-width:0}.costix-pos-cart-main b{display:block;font-size:13px;font-weight:1000;color:#0f172a;line-height:1.35}.costix-pos-cart-main small{display:block;font-size:10.5px;font-weight:850;margin-top:3px;line-height:1.4}.costix-pos-cart-main .mods{color:#0e7490}.costix-pos-cart-main .note{color:#b45309}.costix-pos-cart-price{grid-area:price;text-align:left}.costix-pos-cart-price b{font-family:var(--fm,'IBM Plex Mono',monospace);font-size:14px;color:#b7791f;font-weight:1000}.costix-pos-cart-price small{font-size:10px;color:#64748b;margin-inline-start:3px}.costix-pos-qty-box{grid-area:qty;display:flex;align-items:center;gap:7px}.costix-pos-qty-box button,.costix-pos-cart-actions button{width:30px;height:30px;border-radius:11px;border:1px solid rgba(48,125,126,.18);background:#f8ffff;color:#0e7490;font-weight:1000;cursor:pointer}.costix-pos-qty-box strong{font-family:var(--fm,'IBM Plex Mono',monospace);min-width:28px;text-align:center;color:#0f172a}.costix-pos-cart-actions{grid-area:actions;display:flex;justify-content:flex-end;gap:6px}.costix-pos-totals-card{flex:0 0 auto;background:#fff;border-top:1px solid #dbeafe;padding:12px 14px;display:grid;gap:7px}.costix-pos-totals-card>div{display:flex;align-items:center;justify-content:space-between;color:#475569;font-weight:900;font-size:12px}.costix-pos-totals-card b{font-family:var(--fm,'IBM Plex Mono',monospace);color:#0f766e}.costix-pos-totals-card .discount b,.costix-pos-totals-card .discount span{color:#16a34a}.costix-pos-totals-card .final{margin-top:4px;background:linear-gradient(135deg,#ecfeff,#fff);border:1px solid #a5f3fc;border-radius:16px;padding:12px;color:#164f52;font-size:15px}.costix-pos-totals-card .final b{font-size:22px;color:#b7791f}.costix-pos-split-box{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px 14px;background:#fff;border-top:1px solid #edf2f7}.costix-pos-order-actions{flex:0 0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:7px;padding:12px 14px;background:#fff;border-top:1px solid #edf2f7}.costix-pos-order-actions button{height:42px;border-radius:13px;border:1px solid rgba(48,125,126,.18);background:#f8ffff;color:#164f52;font-weight:1000;cursor:pointer}.costix-pos-order-actions button.danger{background:#fff1f2;border-color:#fecdd3;color:#be123c}.costix-pos-order-actions button:hover{filter:brightness(.98)}
.costix-pos-modal-bg{background:rgba(15,23,42,.42)!important;backdrop-filter:blur(10px);z-index:999999!important}.costix-pos-mini-modal,.costix-pos-delivery-modal{background:#fff!important;border:1px solid #dbeafe!important;border-radius:24px!important;box-shadow:0 16px 44px rgba(15,23,42,.19)!important;color:#0f172a!important}.costix-pos-mini-modal{max-width:560px!important}.costix-pos-delivery-modal{max-width:760px!important}.costix-pos-modal-head{display:flex;align-items:center;gap:12px;margin-bottom:16px}.costix-pos-modal-icon{width:48px;height:48px;border-radius:18px;background:#ecfeff;border:1px solid #a5f3fc;display:flex;align-items:center;justify-content:center;font-size:24px}.costix-pos-modal-head b{display:block;font-size:20px;font-weight:1000;color:#103f42}.costix-pos-modal-head small{display:block;color:#64748b;font-weight:850;margin-top:4px}.costix-pos-note-textarea{width:100%;resize:vertical;min-height:150px;font-size:14px!important;line-height:1.8}.costix-pos-delivery-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}.costix-pos-delivery-form label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#475569;font-weight:1000}.costix-pos-delivery-form label.wide{grid-column:1/-1}.costix-pos-delivery-form textarea{resize:vertical;min-height:96px}.costix-pos-customer-hit{min-height:38px;border-radius:14px;background:#f8ffff;border:1px dashed #cbd5e1;padding:8px;color:#64748b;font-size:12px;font-weight:850}
@media(max-width:1320px){.costix-pos-workspace{grid-template-columns:330px minmax(0,1fr)}.costix-pos-controls-row{flex-wrap:wrap}.costix-pos-payment-group{margin-inline-start:0}.costix-pos-products-grid{grid-template-columns:repeat(auto-fill,minmax(138px,1fr))}.costix-pos-topbar{grid-template-columns:1fr auto}.costix-pos-confirm-top{grid-column:1/-1;justify-self:stretch}.costix-pos-quick-actions{justify-content:flex-end}}
@media(max-width:980px){.costix-pos-light-cockpit{overflow:auto}.costix-pos-workspace{grid-template-columns:1fr;overflow:visible}.costix-pos-order-dock{min-height:520px}.costix-pos-menu-card{min-height:620px}.costix-pos-topbar{grid-template-columns:1fr}.costix-pos-quick-actions{justify-content:flex-start}.costix-pos-controls-row{min-height:0}.costix-pos-compact-group,.costix-pos-payment-group{overflow:auto}.costix-pos-delivery-strip{grid-template-columns:1fr}.costix-pos-delivery-form{grid-template-columns:1fr}}

/* COSTIX_LAST_UPDATE 2026-05-28 Phase27_channels_operations_pos_binding
   POS selectors sourced from مركز القنوات والتشغيل: tables, delivery zones/services, payment methods. */
.costix-pos-delivery-picker-row{display:grid;grid-template-columns:repeat(2,minmax(150px,1fr));gap:10px;width:100%}
.costix-pos-mini-select,.costix-pos-table-select{border:1px solid rgba(255,255,255,.24);background:rgba(120,199,199,.72);border-radius:16px;padding:10px 12px;display:flex;align-items:center;gap:9px;text-align:right;cursor:pointer;color:#063b3c;box-shadow:0 10px 24px rgba(0,0,0,.08)}
.costix-pos-mini-select span{font-size:20px}.costix-pos-mini-select b{display:block;font-weight:900}.costix-pos-mini-select small{display:block;font-size:11px;opacity:.78}.costix-pos-mini-select.ok{background:rgba(120,199,199,.95);border-color:rgba(48,125,126,.35)}.costix-pos-mini-select.warn{background:rgba(245,158,11,.16);border-color:rgba(245,158,11,.35)}
.costix-pos-picker-modal{max-width:760px;width:min(760px,94vw);max-height:90vh;overflow:auto}.costix-pos-picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin:14px 0}.costix-pos-picker-tile{border:1px solid rgba(48,125,126,.25);background:linear-gradient(180deg,rgba(120,199,199,.96),rgba(59,156,156,.82));border-radius:18px;padding:14px;display:flex;flex-direction:column;gap:6px;text-align:right;cursor:pointer;color:#063b3c;min-height:110px;box-shadow:0 12px 26px rgba(0,0,0,.10)}.costix-pos-picker-tile:hover,.costix-pos-picker-tile.selected{transform:translateY(-1px);border-color:rgba(245,158,11,.65);box-shadow:0 16px 32px rgba(0,0,0,.14)}.costix-pos-picker-tile b{font-size:15px}.costix-pos-picker-tile small{opacity:.75}.costix-pos-picker-tile strong{margin-top:auto;color:#5b3a00}.costix-pos-picker-empty{grid-column:1/-1;padding:22px;border-radius:18px;background:rgba(120,199,199,.5);border:1px dashed rgba(48,125,126,.35);text-align:center;font-weight:900;color:#063b3c}.costix-pos-table-inline{align-items:stretch}.costix-pos-table-select{height:100%;font-weight:900;justify-content:center}.costix-pos-table-grid .costix-pos-picker-tile strong{color:#176b45}
@media(max-width:900px){.costix-pos-delivery-picker-row{grid-template-columns:1fr}.costix-pos-picker-grid{grid-template-columns:1fr 1fr}}

/* COSTIX_LAST_UPDATE 2026-05-28 Phase30_channels_operations_customer_lookup_ui
   Customer search suggestions and returning-customer autofill states for POS delivery modal. */
.costix-pos-customer-hint{
  padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.16);color:#ecfeff;font-size:12px;border:1px solid rgba(255,255,255,.22)
}
.costix-pos-customer-hit-ok{
  padding:8px 10px;border-radius:12px;background:rgba(120,199,199,.35);border:1px solid rgba(255,255,255,.28);font-size:12px;color:#053b3b;line-height:1.6
}
.costix-pos-customer-hit-new{
  padding:8px 10px;border-radius:12px;background:rgba(245,158,11,.16);border:1px solid rgba(245,158,11,.32);font-size:12px;color:#5f3300;line-height:1.6
}
.costix-pos-customer-suggestions{display:grid;gap:7px;max-height:190px;overflow:auto;padding:2px}
.costix-pos-customer-suggestion{
  width:100%;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.22);border-radius:14px;padding:9px 10px;text-align:right;cursor:pointer;display:grid;gap:3px;color:#073b3b
}
.costix-pos-customer-suggestion:hover{background:rgba(255,255,255,.34);transform:translateY(-1px)}
.costix-pos-customer-suggestion b{font-size:13px;color:#062f2f}
.costix-pos-customer-suggestion span{font-family:'IBM Plex Mono',monospace;font-size:12px;color:#0f5252;direction:ltr;text-align:right}
.costix-pos-customer-suggestion small{font-size:11px;color:#235f5f;line-height:1.4}


/* COSTIX_LAST_UPDATE 2026-05-29 Phase38_discount_rules_ops_pos */
.ops-discount-form .ops-form-wide{grid-column:1 / -1;}
.ops-check-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px;margin-top:8px;}
.ops-discount-target{border:1px solid var(--bdr2);border-radius:14px;padding:10px;background:rgba(255,255,255,.06);}
.costix-pos-totals-card .discount span::after{content:'';}

/* COSTIX_LAST_UPDATE 2026-05-29 Phase40_discount_item_picker
   Multi-select searchable menu item picker for Channels Operations discount rules. */
.ops-item-picker{display:grid;gap:10px;margin-top:8px;position:relative;}
.ops-field-hint{margin:4px 0 8px;color:#5f7e80;font-size:12px;font-weight:850;line-height:1.7;}
.ops-item-chips{display:flex;flex-wrap:wrap;gap:8px;min-height:38px;align-items:center;background:#f8ffff;border:1px dashed rgba(48,125,126,.22);border-radius:14px;padding:8px;}
.ops-item-chip{display:inline-flex;align-items:center;gap:7px;background:#e8fbfb;border:1px solid rgba(48,125,126,.20);color:#123f42;border-radius:999px;padding:7px 10px;font-weight:1000;}
.ops-item-chip small{font-family:var(--fm,'IBM Plex Mono',monospace);font-size:10px;color:#5f7e80;font-weight:900;}
.ops-item-chip button{width:22px;height:22px;border:0;border-radius:999px;background:#fee2e2;color:#b91c1c;font-weight:1000;cursor:pointer;line-height:1;}
.ops-item-chip-empty{color:#5f7e80;font-size:12px;font-weight:900;padding-inline:4px;}
.ops-item-results{display:grid;gap:6px;max-height:230px;overflow:auto;}
.ops-item-result{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;border:1px solid rgba(48,125,126,.16);background:#ffffff;color:#123f42;border-radius:14px;padding:10px 12px;text-align:right;cursor:pointer;font-weight:950;}
.ops-item-result:hover{background:#e8fbfb;border-color:#307D7E;}
.ops-item-result small{color:#5f7e80;font-weight:850;font-size:11px;}
.ops-item-nores{padding:12px;border-radius:14px;background:#fff7ed;color:#c2410c;font-weight:1000;text-align:center;}

/* COSTIX_LAST_UPDATE Phase42_CC_POS_SHAPE_OPS_BINDING_20260529
   Call Center create-order layout now mirrors POS customer/delivery panels for takeaway + delivery. */
.cc-pos-layout.cc-customer-mode{
  grid-template-columns:300px minmax(0,1fr) 390px !important;
}
.cc-customer-side{
  position:sticky;
  top:72px;
  max-height:calc(100vh - 92px);
  overflow:auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:8px;
  background:var(--bg2);
  border:1px solid var(--bdr2);
  border-radius:18px;
  box-shadow:var(--shadow);
  padding:10px;
}
.cc-customer-box{
  background:var(--bg1);
  border:1px solid var(--bdr2);
  border-radius:16px;
  padding:10px;
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
  gap:8px;
}
.cc-customer-headline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.cc-customer-headline div{
  font-size:13px;
  font-weight:900;
  color:var(--teal3);
}
.cc-customer-headline span{
  font-size:10px;
  color:var(--text3);
  font-weight:800;
}
.cc-customer-side .fi{width:100%;font-size:12px;}
.cc-customer-side textarea.fi{resize:vertical;min-height:86px;}
.cc-delivery-pickers{
  padding:10px;
  border:1px solid var(--bdr2);
  border-radius:16px;
  background:var(--bg1);
  box-shadow:var(--shadow);
  display:grid;
  gap:10px;
}
.cc-delivery-group{display:grid;gap:7px;}
.cc-delivery-group>b{font-size:11px;color:var(--text2);font-weight:900;}
.cc-delivery-chip-row{display:flex;gap:6px;flex-wrap:wrap;}
.cc-delivery-chip-row .btn{font-size:11px;}
.cc-delivery-chip-row .btn span{font-family:var(--fm);opacity:.85;margin-inline-start:4px;}
@media (max-width:1200px){
  .cc-pos-layout.cc-customer-mode{grid-template-columns:1fr !important;}
  .cc-customer-side{position:relative;top:auto;max-height:none;}
}

/* COSTIX_LAST_UPDATE: phase43_callcenter_exact_pos_layout_20260529
   Call Center new-order screen now reuses the POS cockpit layout/classes instead of the previous side-customer layout. */
.costix-cc-pos-page{min-height:calc(100vh - 105px)}
.costix-cc-pos-workspace{align-items:stretch;min-height:0}
.costix-cc-order-dock{min-height:0;display:flex;flex-direction:column;overflow:hidden}
.costix-cc-order-dock .costix-pos-cart-list{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain}
.costix-cc-menu-area{min-width:0;overflow:hidden}
.costix-cc-menu-card{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.costix-cc-products-grid{overflow:auto;min-height:0;align-content:start;padding-bottom:20px}
.costix-cc-top-kpi{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border-radius:14px;background:#f7fffe;border:1px solid #ccefed;font-weight:900;color:#176568;font-size:12px;white-space:nowrap}
.costix-cc-customer-strip{display:grid;grid-template-columns:minmax(190px,240px) 1fr;gap:10px;align-items:start}
.costix-cc-customer-card-static{cursor:default;text-align:right;justify-content:flex-start}
.costix-cc-customer-fields{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr)) auto;gap:8px;align-items:center;min-width:0}
.costix-cc-customer-fields .fi{height:42px;border-radius:13px;background:#fff;border:1px solid #d7eeee;font-size:12px;font-weight:800;color:#123;padding:0 11px;min-width:0}
.costix-cc-save-customer{height:42px;white-space:nowrap;justify-content:center}
.costix-cc-customer-info{grid-column:1/-1;border-radius:14px;background:#f8ffff;border:1px dashed #c9ecea;padding:8px 10px;font-size:12px;color:#587;min-height:34px}
.costix-cc-delivery-services-mini{grid-column:1/-1;width:100%}
.costix-cc-delivery-services-mini .cc-delivery-pickers{margin:0;box-shadow:none;border-radius:16px;background:#f8ffff;border:1px solid #d6eeee;padding:10px;display:grid;gap:8px}
.costix-cc-delivery-services-mini .cc-delivery-group b{font-size:12px;color:#176568}
.costix-cc-delivery-services-mini .cc-delivery-chip-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:7px}
.costix-cc-item-tools-inline{display:flex;gap:5px;align-items:center;justify-content:flex-end;grid-column:1/-1}
.costix-pos-mini-tool{border:1px solid #d7eeee;background:#f8ffff;border-radius:10px;min-width:30px;height:28px;cursor:pointer;font-weight:900}
.costix-pos-order-note-inline{display:grid;grid-template-columns:1fr 120px;gap:8px;padding:8px 10px;border-top:1px solid #e1f1f1;background:#f8ffff;flex:0 0 auto}
.costix-pos-order-note-inline .fi{height:38px;border-radius:12px;border:1px solid #d7eeee;background:#fff;font-weight:800;font-size:12px;padding:0 10px}
.costix-pos-pay-footer{padding:10px;border-top:1px solid #dfeeee;background:#fff;box-shadow:0 -10px 22px rgba(0,0,0,.07);flex:0 0 auto}
.costix-pos-confirm-bottom{width:100%;height:48px;border:0;border-radius:16px;background:linear-gradient(135deg,#d5a72e,#bf8e16);color:#fff;font-weight:1000;font-size:15px;box-shadow:0 10px 22px rgba(191,142,22,.24);cursor:pointer}
.costix-pos-confirm-bottom:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.3)}
.costix-cc-channel-group .costix-pos-chip{min-width:150px;justify-content:center}
@media(max-width:1100px){.costix-cc-customer-strip{grid-template-columns:1fr}.costix-cc-customer-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.costix-cc-save-customer{grid-column:1/-1}.costix-pos-order-note-inline{grid-template-columns:1fr}}
@media(max-width:760px){.costix-cc-customer-fields{grid-template-columns:1fr}.costix-cc-top-kpi{display:none}}

/* COSTIX_LAST_UPDATE: phase45_callcenter_compact_modal_pos_shape_20260529
   Clean Call Center visual owner: compact customer/delivery cards + modal, no old wide form. */
.costix-cc-pos-page{
  padding:16px !important;
  background:linear-gradient(180deg,#f7feff 0%,#edf8f9 100%) !important;
}
.costix-cc-pos-page .costix-pos-topbar{
  border-radius:26px !important;
  padding:14px 16px !important;
  box-shadow:0 18px 46px rgba(48,125,126,.10) !important;
}
.costix-cc-pos-page .costix-pos-workspace{
  gap:14px !important;
}
.costix-cc-pos-page .costix-pos-order-dock,
.costix-cc-pos-page .costix-pos-menu-card{
  border-radius:26px !important;
  border-color:rgba(48,125,126,.16) !important;
  box-shadow:0 18px 44px rgba(15,23,42,.08) !important;
}
.costix-cc-compact-cards{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:repeat(3,minmax(210px,1fr));
  gap:10px;
  align-items:stretch;
}
.costix-cc-compact-card{
  width:100%;
  min-height:82px;
  border:1px solid rgba(48,125,126,.18);
  background:linear-gradient(180deg,#ffffff,#f4ffff);
  border-radius:20px;
  display:grid;
  grid-template-columns:46px 1fr auto;
  gap:11px;
  align-items:center;
  padding:12px 14px;
  color:#123f42;
  cursor:pointer;
  text-align:right;
  box-shadow:0 12px 28px rgba(20,96,98,.07);
  transition:.16s ease;
}
.costix-cc-compact-card:hover{
  transform:translateY(-1px);
  border-color:#3B9C9C;
  box-shadow:0 18px 34px rgba(48,125,126,.12);
}
.costix-cc-compact-card>span{
  width:46px;height:46px;border-radius:17px;
  display:flex;align-items:center;justify-content:center;
  font-size:24px;background:#e8fbfb;border:1px solid rgba(48,125,126,.14);
}
.costix-cc-compact-card b{display:block;font-size:14px;font-weight:1000;color:#103f42;margin-bottom:4px;line-height:1.35}
.costix-cc-compact-card small{display:block;font-size:11px;font-weight:850;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px}
.costix-cc-compact-card em{font-style:normal;border-radius:999px;padding:7px 10px;font-size:11px;font-weight:1000;background:#e8fbfb;color:#176568;white-space:nowrap}
.costix-cc-compact-card.warn{border-color:#fed7aa;background:linear-gradient(180deg,#fff,#fff7ed)}
.costix-cc-compact-card.warn>span{background:#fff7ed;border-color:#fed7aa}
.costix-cc-compact-card.warn em{background:#ffedd5;color:#c2410c}
.costix-cc-compact-card.ok{border-color:#a7f3d0;background:linear-gradient(180deg,#fff,#f0fdf4)}
.costix-cc-compact-card.ok>span{background:#dcfce7;border-color:#bbf7d0}
.costix-cc-compact-card.ok em{background:#dcfce7;color:#15803d}
.costix-cc-compact-card.note{border-style:dashed}
.costix-cc-hidden-customer-info{display:none!important}
.costix-cc-modal-bg{
  position:fixed;inset:0;z-index:999999;
  background:rgba(15,23,42,.42);
  backdrop-filter:blur(12px);
  display:flex;align-items:center;justify-content:center;
  padding:18px;direction:rtl;
}
.costix-cc-customer-modal{
  width:min(860px,96vw);
  max-height:92vh;overflow:auto;
  background:linear-gradient(180deg,#ffffff,#f5ffff);
  border:1px solid rgba(48,125,126,.20);
  border-radius:30px;
  box-shadow:0 34px 95px rgba(15,23,42,.28);
  padding:22px;
  position:relative;
  color:#123f42;
}
.costix-cc-modal-x{
  position:absolute;top:16px;left:16px;
  width:42px;height:42px;border:0;border-radius:999px;
  background:#e8fbfb;color:#307D7E;font-size:25px;font-weight:1000;cursor:pointer;
}
.costix-cc-modal-head{display:flex;align-items:center;gap:14px;margin-bottom:16px;padding-inline-end:48px}
.costix-cc-modal-head>span{width:58px;height:58px;border-radius:22px;background:#e8fbfb;display:flex;align-items:center;justify-content:center;font-size:30px;border:1px solid rgba(48,125,126,.15)}
.costix-cc-modal-head h2{margin:0;font-size:24px;font-weight:1000;color:#103f42}
.costix-cc-modal-head p{margin:6px 0 0;color:#5f7e80;font-weight:850}
.costix-cc-modal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:12px}
.costix-cc-modal-grid label{display:grid;gap:6px;color:#276164;font-size:12px;font-weight:1000}
.costix-cc-modal-grid label.wide{grid-column:1/-1}
.costix-cc-modal-grid .fi{height:46px;border-radius:15px;border:1px solid rgba(48,125,126,.18);background:#fff;color:#123f42;padding:0 13px;font-weight:900;outline:none}
.costix-cc-modal-grid .fi:focus{border-color:#307D7E;box-shadow:0 0 0 3px rgba(48,125,126,.12)}
.costix-cc-modal-info{margin:8px 0 12px;border-radius:18px;background:#e8fbfb;border:1px dashed rgba(48,125,126,.25);padding:10px}
.costix-cc-modal-delivery{border-radius:20px;background:#f8ffff;border:1px solid rgba(48,125,126,.16);padding:12px;margin-top:10px}
.costix-cc-modal-delivery .cc-delivery-pickers{box-shadow:none;background:transparent;border:0;padding:0}
.costix-cc-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}
.costix-cc-modal-actions .costix-pos-confirm-bottom{width:auto;min-width:210px;padding:0 22px}
.costix-cc-pos-page .costix-pos-controls-row{
  min-height:auto !important;
  display:grid !important;
  grid-template-columns:minmax(260px,1fr) auto;
  align-items:center;
}
.costix-cc-pos-page .costix-pos-payment-group{margin-inline-start:0;justify-content:flex-end}
.costix-cc-channel-group{justify-content:flex-start;flex-wrap:wrap}
.costix-cc-channel-group .costix-pos-chip{height:56px;min-width:160px;border-radius:18px}
.costix-cc-pos-page .costix-pos-menu-toolbar{border-bottom:1px solid #d7eeee;background:#fff}
.costix-cc-pos-page .costix-pos-products-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;padding:16px;background:linear-gradient(180deg,#f8ffff,#eef8f9)}
.costix-cc-pos-page .costix-pos-product{min-height:168px;border-radius:22px}
@media(max-width:1200px){
  .costix-cc-compact-cards{grid-template-columns:1fr 1fr}
  .costix-cc-pos-page .costix-pos-controls-row{grid-template-columns:1fr}
}
@media(max-width:760px){
  .costix-cc-compact-cards,.costix-cc-modal-grid{grid-template-columns:1fr}
  .costix-cc-modal-actions{flex-direction:column}.costix-cc-modal-actions .costix-pos-confirm-bottom{width:100%}
}

/* COSTIX_LAST_UPDATE 2026-05-29 Phase46_callcenter_channels_operations_full_binding
   Call Center delivery/customer/payment UI now reads from Channels Operations with POS-style selection cards. */
.costix-cc-delivery-picker-pro{display:grid;gap:14px}
.costix-cc-delivery-picker-pro section{display:grid;gap:10px}
.costix-cc-delivery-picker-pro h4{margin:0;color:#145f62;font-size:13px;font-weight:1000}
.costix-cc-delivery-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:18px;background:linear-gradient(135deg,#e8fbfb,#fff7e4);border:1px solid rgba(48,125,126,.18)}
.costix-cc-delivery-summary b{display:block;color:#103f42;font-weight:1000}
.costix-cc-delivery-summary small{display:block;color:#5e7b7d;font-size:12px;font-weight:850;margin-top:3px}
.costix-cc-delivery-summary strong{white-space:nowrap;color:#b37a00;background:#fff;padding:8px 12px;border-radius:14px;border:1px solid rgba(211,158,28,.24);box-shadow:0 8px 18px rgba(211,158,28,.10)}
.costix-cc-delivery-choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:10px}
.costix-cc-delivery-choice{border:1px solid rgba(48,125,126,.18);background:#fff;border-radius:18px;min-height:82px;padding:12px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;text-align:right;cursor:pointer;box-shadow:0 10px 24px rgba(29,91,93,.07);transition:.16s ease}
.costix-cc-delivery-choice:hover{transform:translateY(-1px);border-color:#3B9C9C;box-shadow:0 14px 28px rgba(29,91,93,.12)}
.costix-cc-delivery-choice.on{background:linear-gradient(135deg,#dff8f8,#fff8e5);border-color:#d6a11f;box-shadow:0 14px 30px rgba(211,158,28,.16)}
.costix-cc-delivery-choice>span{width:42px;height:42px;border-radius:16px;background:#e8fbfb;display:flex;align-items:center;justify-content:center;font-size:22px;border:1px solid rgba(48,125,126,.12)}
.costix-cc-delivery-choice b{display:block;color:#113f42;font-weight:1000;font-size:13px;line-height:1.25}
.costix-cc-delivery-choice small{display:block;color:#678487;font-size:11px;font-weight:850;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.costix-cc-delivery-choice em{font-style:normal;color:#b37800;background:#fff7df;border:1px solid rgba(211,158,28,.18);border-radius:13px;padding:6px 8px;font-size:12px;font-weight:1000;white-space:nowrap}
.costix-cc-delivery-empty{padding:14px;border-radius:16px;background:#f8ffff;border:1px dashed rgba(48,125,126,.25);color:#5e7b7d;font-weight:900;text-align:center}
.costix-pos-pay-chip b{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:900px){.costix-cc-delivery-choice-grid{grid-template-columns:1fr}.costix-cc-delivery-summary{align-items:flex-start;flex-direction:column}.costix-cc-delivery-summary strong{width:100%;text-align:center}}

/* COSTIX_LAST_UPDATE 2026-05-29 Phase47_callcenter_pos_delivery_cards_split
   Call Center delivery now matches POS split cards: customer, zone, service. */
.costix-cc-pos-delivery-cards{
  grid-template-columns:repeat(4,minmax(180px,1fr));
  align-items:stretch;
}
.costix-cc-pos-delivery-cards .costix-cc-compact-card{
  min-height:76px;
}
.costix-cc-pick-modal{
  width:min(760px,calc(100vw - 32px));
  max-height:calc(100vh - 80px);
  overflow:auto;
}
.costix-cc-pick-modal .costix-cc-delivery-choice-grid{
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  margin-top:12px;
}
@media (max-width:1100px){
  .costix-cc-pos-delivery-cards{grid-template-columns:repeat(2,minmax(180px,1fr));}
}
@media (max-width:720px){
  .costix-cc-pos-delivery-cards{grid-template-columns:1fr;}
}

/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE 20260531phase_catalog_clean_ownership
   Catalog Command Center — centralized styling only; replaces old inline catalog layout.
   ═══════════════════════════════════════════════════════════════ */
.catalog-cockpit{display:flex;flex-direction:column;gap:14px;min-height:calc(100vh - 110px);}
.catalog-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border:1px solid rgba(255,255,255,.16);border-radius:24px;background:linear-gradient(135deg,rgba(48,125,126,.98),rgba(59,156,156,.92));box-shadow:0 16px 42px rgba(15,23,42,.18);color:#fff;}
.catalog-eyebrow{font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;opacity:.82;margin-bottom:5px;}
.catalog-hero h2{margin:0;font-size:24px;font-weight:950;line-height:1.25;}
.catalog-hero p{margin:6px 0 0;font-size:13px;line-height:1.75;color:rgba(255,255,255,.88);}
.catalog-hero-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.catalog-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;}
.catalog-stat-card{display:flex;flex-direction:column;gap:5px;min-height:88px;padding:14px 16px;border:1px solid rgba(255,255,255,.18);border-radius:20px;background:#3B9C9C;color:#fff;box-shadow:0 10px 28px rgba(15,23,42,.12);}
.catalog-stat-card span{font-size:20px;line-height:1;}
.catalog-stat-card b{font-size:22px;font-weight:950;line-height:1;color:#fff;}
.catalog-stat-card small{font-size:12px;color:rgba(255,255,255,.86);font-weight:800;}
.catalog-switchbar{display:flex;gap:10px;align-items:center;padding:10px;border:1px solid rgba(255,255,255,.16);border-radius:20px;background:#3B9C9C;}
.catalog-switch{display:flex;align-items:center;gap:9px;border:1px solid rgba(255,255,255,.2);border-radius:16px;background:rgba(255,255,255,.12);color:#fff;padding:10px 14px;cursor:pointer;font-family:inherit;transition:.18s ease;font-weight:900;}
.catalog-switch:hover{background:#41627E;transform:translateY(-1px);}
.catalog-switch.is-active{background:linear-gradient(135deg,#f8d66d,#d4a52c);color:#1f2937;border-color:rgba(255,255,255,.5);box-shadow:0 10px 24px rgba(212,165,44,.24);}
.catalog-switch span{font-size:18px;}
.catalog-switch b{font-size:13px;}
.catalog-switch em{font-style:normal;font-size:12px;min-width:28px;text-align:center;border-radius:999px;padding:3px 8px;background:rgba(0,0,0,.14);}
.catalog-official-note{padding:11px 14px;border:1px solid rgba(248,214,109,.42);background:rgba(248,214,109,.16);border-radius:18px;color:#fff;font-size:13px;line-height:1.75;}
.catalog-grid{display:grid;grid-template-columns:260px minmax(0,1fr);gap:14px;align-items:start;}
.catalog-sidebar{border:1px solid rgba(255,255,255,.18);border-radius:22px;background:#3B9C9C;padding:12px;position:sticky;top:76px;max-height:calc(100vh - 96px);overflow:auto;box-shadow:0 12px 30px rgba(15,23,42,.12);}
.catalog-sidebar-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 4px 12px;color:#fff;}
.catalog-sidebar-head b{font-size:14px;font-weight:950;}
.catalog-sidebar-head small{font-size:11px;color:rgba(255,255,255,.78);font-weight:800;}
.catalog-category-list{display:flex;flex-direction:column;gap:6px;}
.catalog-cat{display:flex;align-items:center;gap:10px;width:100%;border:1px solid rgba(255,255,255,.18);border-radius:16px;background:#78c7c7;color:#12343b;padding:10px;text-align:right;cursor:pointer;font-family:inherit;transition:.16s ease;}
.catalog-cat:hover{background:#41627E;color:#fff;transform:translateX(-2px);}
.catalog-cat.is-active{background:linear-gradient(135deg,#f8d66d,#d4a52c);color:#1f2937;border-color:rgba(255,255,255,.55);box-shadow:0 10px 22px rgba(212,165,44,.22);}
.catalog-cat-icon{font-size:20px;line-height:1;flex:0 0 auto;}
.catalog-cat-body{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1;}
.catalog-cat-body b{font-size:13px;font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.catalog-cat-body small{font-size:11px;font-weight:800;opacity:.78;}
.catalog-cat-del{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:rgba(185,28,28,.95);color:#fff;font-size:11px;font-weight:950;flex:0 0 auto;}
.catalog-main{min-width:0;border:1px solid rgba(255,255,255,.18);border-radius:22px;background:#3B9C9C;padding:14px;box-shadow:0 12px 30px rgba(15,23,42,.12);}
.catalog-empty{min-height:300px;border:1px dashed rgba(255,255,255,.38);border-radius:20px;background:#78c7c7;color:#12343b;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;}
.catalog-empty .ei{font-size:42px;margin-bottom:8px;}
.catalog-empty .et{font-size:18px;font-weight:950;margin-bottom:4px;}
.catalog-empty p{margin:0;font-size:13px;font-weight:800;opacity:.75;}
.catalog-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;color:#fff;}
.catalog-section-head>div{display:flex;align-items:center;gap:10px;min-width:0;}
.catalog-section-head span{font-size:24px;}
.catalog-section-head b{font-size:18px;font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.catalog-section-head small{font-size:12px;font-weight:900;border-radius:999px;background:rgba(255,255,255,.15);padding:5px 10px;}
.catalog-table-wrap{overflow:auto;border:1px solid rgba(255,255,255,.18);border-radius:18px;background:#78c7c7;}
.catalog-table{width:100%;min-width:720px;background:transparent;}
.catalog-table thead th{background:#3B9C9C;color:#fff;font-weight:950;}
.catalog-table tbody tr{background:#78c7c7;}
.catalog-table tbody tr:hover{background:#41627E;color:#fff;}
.catalog-move-select{font-size:12px!important;padding:6px 8px!important;min-width:150px;}
.catalog-cell-gold{color:#7c5800!important;font-weight:950;}
.catalog-cell-good,.catalog-margin-good{color:#0f766e!important;font-weight:950;}
.catalog-cell-bad,.catalog-margin-bad{color:#b91c1c!important;font-weight:950;}
.catalog-margin-warn{color:#92400e!important;font-weight:950;}
@media (max-width:1100px){.catalog-stats{grid-template-columns:repeat(3,minmax(0,1fr));}.catalog-grid{grid-template-columns:220px minmax(0,1fr);}}
@media (max-width:820px){.catalog-hero{flex-direction:column;align-items:flex-start;}.catalog-stats{grid-template-columns:repeat(2,minmax(0,1fr));}.catalog-switchbar{flex-direction:column;align-items:stretch;}.catalog-switch{justify-content:space-between;}.catalog-grid{grid-template-columns:1fr;}.catalog-sidebar{position:static;max-height:280px;}.catalog-table{min-width:640px;}}
@media (max-width:520px){.catalog-stats{grid-template-columns:1fr;}.catalog-hero h2{font-size:20px;}.catalog-hero,.catalog-main,.catalog-sidebar{border-radius:18px;padding:12px;}}


/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE 20260531phase_catalog_visibility_dashboard_ui
   Catalog Dashboard-like cockpit + category visibility controls.
   ═══════════════════════════════════════════════════════════════ */
.catalog-dashboard-cockpit{gap:14px;background:transparent;}
.catalog-dash-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid #dbeafe;border-radius:24px;background:linear-gradient(135deg,#f8ffff,#eefbfb);padding:26px 28px;box-shadow:0 14px 34px rgba(15,23,42,.08);color:#0f172a;}
.catalog-dash-title small{display:block;color:#0ea5a8;font-weight:900;font-size:12px;margin-bottom:4px;}
.catalog-dash-title h1{margin:0;font-size:32px;line-height:1.2;font-weight:950;color:#0f172a;}
.catalog-dash-title p{margin:8px 0 0;color:#64748b;font-size:14px;font-weight:700;}
.catalog-dash-actions{display:flex;gap:10px;align-items:center;}
.catalog-dash-tabs{display:flex;align-items:center;gap:12px;border:1px solid #dbeafe;border-radius:22px;background:#fff;padding:10px;box-shadow:0 12px 28px rgba(15,23,42,.06);}
.catalog-dash-tab{display:flex;align-items:center;justify-content:space-between;gap:14px;min-width:220px;border:1px solid #e2e8f0;background:#f8fafc;color:#334155;border-radius:16px;padding:13px 16px;font-family:inherit;cursor:pointer;font-weight:900;}
.catalog-dash-tab.is-active{background:#dff8fb;border-color:#99eef4;color:#075f66;box-shadow:inset 0 0 0 1px rgba(20,184,166,.14);}
.catalog-dash-tab span,.catalog-dash-health b{min-width:34px;text-align:center;border-radius:999px;padding:5px 10px;background:#fff;color:#0f172a;font-family:var(--fm);font-weight:950;}
.catalog-dash-health{margin-inline-start:auto;display:flex;align-items:center;gap:8px;border:1px solid #fed7aa;background:#fff7ed;border-radius:16px;padding:10px 14px;color:#9a3412;font-weight:900;}
.catalog-dash-health small{font-size:12px;}
.catalog-dash-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;}
.catalog-dash-kpi{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-height:116px;border:1px solid #e2e8f0;border-radius:22px;background:#fff;padding:18px 18px;box-shadow:0 12px 28px rgba(15,23,42,.06);font-family:inherit;color:#0f172a;text-align:right;overflow:hidden;}
.catalog-dash-kpi:after{content:'';position:absolute;left:-34px;bottom:-34px;width:96px;height:96px;border-radius:50%;background:#dff8fb;}
.catalog-dash-kpi i{position:relative;z-index:1;font-style:normal;font-size:25px;width:42px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:15px;background:#f1f5f9;}
.catalog-dash-kpi small{position:relative;z-index:1;color:#64748b;font-weight:900;font-size:12px;}
.catalog-dash-kpi b{position:relative;z-index:1;font-size:26px;font-family:var(--fm);font-weight:950;color:#0f172a;}
.catalog-dashboard-grid{display:grid;grid-template-columns:320px minmax(0,1fr);gap:14px;align-items:start;}
.catalog-dashboard-side,.catalog-dashboard-main{border:1px solid #e2e8f0;border-radius:24px;background:#fff;box-shadow:0 14px 34px rgba(15,23,42,.07);padding:16px;}
.catalog-dashboard-side{position:sticky;top:76px;max-height:calc(100vh - 96px);overflow:auto;}
.catalog-panel-head h3{margin:0;font-size:18px;color:#0f172a;font-weight:950;}
.catalog-panel-head p{margin:4px 0 12px;color:#64748b;font-size:12px;font-weight:800;}
.catalog-dash-cat{display:flex;align-items:center;gap:11px;width:100%;border:1px solid #e2e8f0;border-radius:18px;background:#f8fafc;color:#0f172a;padding:12px;margin-bottom:8px;text-align:right;cursor:pointer;font-family:inherit;transition:.16s ease;}
.catalog-dash-cat:hover{background:#eefbfb;border-color:#99eef4;transform:translateX(-2px);}
.catalog-dash-cat.is-active{background:#f8d66d;border-color:#d4a52c;box-shadow:0 10px 24px rgba(212,165,44,.18);}
.catalog-dash-cat.is-other{border-style:dashed;background:#fff7ed;border-color:#fdba74;}
.catalog-dash-cat .catalog-cat-body small{color:#64748b;opacity:1;}
.catalog-modern-head{color:#0f172a;border-bottom:1px solid #e2e8f0;padding-bottom:12px;}
.catalog-head-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.catalog-visibility-pill{display:inline-flex!important;align-items:center;font-size:12px!important;border-radius:999px;background:#e0f2fe!important;color:#075985!important;padding:7px 12px!important;font-weight:900;}
.catalog-table-wrap{border-color:#e2e8f0;background:#fff;}
.catalog-table thead th{background:#f8fafc!important;color:#334155!important;border-bottom:1px solid #e2e8f0;}
.catalog-table tbody tr{background:#fff!important;color:#0f172a;}
.catalog-table tbody tr:hover{background:#f1f5f9!important;color:#0f172a;}
.catalog-empty{background:#f8fafc;color:#334155;border-color:#cbd5e1;}
.catalog-visibility-modal{max-width:760px!important;border-radius:24px!important;}
.catalog-modal-title{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e5e7eb;padding-bottom:12px;margin-bottom:14px;}
.catalog-modal-title small{color:#0ea5a8;font-weight:950;font-size:11px;text-transform:uppercase;}
.catalog-modal-title h2{margin:4px 0 0;font-size:22px;font-weight:950;color:#0f172a;}
.catalog-modal-grid{display:grid;grid-template-columns:1fr 120px;gap:12px;}
.catalog-field span{display:block;margin-bottom:6px;font-size:12px;font-weight:900;color:#334155;}
.catalog-emoji-row{display:flex;gap:5px;flex-wrap:wrap;margin:10px 0 14px;}
.catalog-emoji-row button{border:1px solid #e2e8f0;background:#fff;border-radius:10px;width:30px;height:30px;cursor:pointer;}
.catalog-visibility-box{border:1px solid #e2e8f0;border-radius:20px;background:#f8fafc;padding:14px;margin:12px 0;}
.catalog-visibility-box h3{margin:0 0 10px;font-size:15px;font-weight:950;color:#0f172a;}
.catalog-visibility-box p{margin:0;color:#64748b;font-weight:800;}
.catalog-check-grid{display:flex;flex-wrap:wrap;gap:8px;}
.catalog-check-chip{display:inline-flex;align-items:center;gap:7px;border:1px solid #e2e8f0;background:#fff;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:900;color:#334155;cursor:pointer;}
.catalog-check-chip.strong{background:#ecfeff;border-color:#99f6e4;color:#115e59;}
.catalog-check-chip input{accent-color:#0ea5a8;}
.catalog-channel-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px;}
.catalog-channel-columns b{display:block;margin-bottom:8px;font-size:12px;color:#0f172a;}
@media (max-width:1200px){.catalog-dash-kpis{grid-template-columns:repeat(3,minmax(0,1fr));}.catalog-dashboard-grid{grid-template-columns:280px minmax(0,1fr);}}
@media (max-width:860px){.catalog-dash-hero,.catalog-dash-tabs{flex-direction:column;align-items:stretch;}.catalog-dash-kpis,.catalog-dashboard-grid,.catalog-channel-columns,.catalog-modal-grid{grid-template-columns:1fr;}.catalog-dashboard-side{position:static;max-height:320px;}.catalog-dash-tab{min-width:0;}.catalog-dash-health{margin-inline-start:0;}}

/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE 20260531phase_catalog_visibility_persistence_table_fix
   Catalog table final clean owner: dashboard-like table, no row dropdown clutter.
   ═══════════════════════════════════════════════════════════════ */
.catalog-dashboard-main{overflow:hidden;}
.catalog-command-table{width:100%;min-width:760px;border-collapse:separate!important;border-spacing:0;background:#fff!important;border-radius:18px;overflow:hidden;table-layout:fixed;}
.catalog-command-table thead th{height:46px;background:#f8fafc!important;color:#475569!important;font-size:12px;font-weight:950;text-align:right;border-bottom:1px solid #e2e8f0!important;padding:0 14px!important;white-space:nowrap;}
.catalog-command-table tbody td{height:54px;border-bottom:1px solid #eef2f7!important;padding:8px 14px!important;vertical-align:middle;background:#fff!important;color:#0f172a!important;font-size:13px;font-weight:800;}
.catalog-command-table tbody tr:nth-child(even) td{background:#fbfdff!important;}
.catalog-command-table tbody tr:hover td{background:#eefbfb!important;color:#0f172a!important;}
.catalog-command-table tbody tr:last-child td{border-bottom:0!important;}
.catalog-name-cell{display:flex;align-items:center;gap:9px;min-width:0;}
.catalog-name-cell span{width:28px;height:28px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:#eef2f7;flex:0 0 auto;}
.catalog-name-cell b{font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.catalog-num-cell{font-family:var(--fm, 'IBM Plex Mono', monospace);font-weight:950;text-align:center;white-space:nowrap;}
.catalog-num-cell small{font-family:inherit;color:#64748b;font-size:10px;font-weight:900;}
.catalog-action-cell{text-align:left;width:160px;}
.catalog-row-action{min-width:138px;max-width:100%;display:inline-flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid #dbeafe;background:#f8fafc;border-radius:999px;color:#0f172a;padding:7px 10px;font-family:inherit;cursor:pointer;transition:.16s ease;}
.catalog-row-action:hover{border-color:#14b8c6;background:#ecfeff;transform:translateY(-1px);}
.catalog-row-action span{font-size:11px;font-weight:950;color:#0891b2;}
.catalog-row-action b{font-size:11px;font-weight:950;color:#334155;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.catalog-move-modal{max-width:760px!important;border-radius:24px!important;}
.catalog-move-current{display:flex;align-items:center;gap:12px;border:1px solid #e2e8f0;border-radius:18px;background:#f8fafc;padding:12px;margin-bottom:14px;}
.catalog-move-current>span{width:42px;height:42px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:#fff;font-size:22px;}
.catalog-move-current b{display:block;color:#0f172a;font-weight:950;}
.catalog-move-current small{display:block;color:#64748b;font-size:12px;font-weight:800;margin-top:3px;}
.catalog-move-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-height:420px;overflow:auto;padding:2px;}
.catalog-move-choice{border:1px solid #e2e8f0;background:#fff;border-radius:16px;padding:11px 12px;display:flex;align-items:center;gap:9px;text-align:right;font-family:inherit;cursor:pointer;color:#0f172a;}
.catalog-move-choice:hover{background:#eefbfb;border-color:#99eef4;}
.catalog-move-choice.is-active{background:#f8d66d;border-color:#d4a52c;}
.catalog-move-choice span{width:28px;height:28px;border-radius:10px;background:#f8fafc;display:inline-flex;align-items:center;justify-content:center;}
.catalog-move-choice b{font-size:12px;font-weight:950;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
@media (max-width:860px){.catalog-command-table{min-width:680px}.catalog-move-grid{grid-template-columns:1fr 1fr;}.catalog-action-cell{width:130px}.catalog-row-action{min-width:116px;}}

/* COSTIX_LAST_UPDATE offers_deep_truth_owner_cleanup_20260531
   Offers builder single clean UI block. Replaces old stacked offer-builder CSS phases. */
#page-add_offer.offers-builder-clean-v2{background:#eef6f7!important;padding-bottom:28px!important;}
#page-add_offer.offers-builder-clean-v2 .ph.offers-builder-hero{background:#fff!important;border:1px solid #dcecef!important;border-radius:22px!important;box-shadow:0 12px 32px rgba(15,79,80,.08)!important;margin-bottom:14px!important;min-height:auto!important;padding:16px 18px!important;}
#page-add_offer.offers-builder-clean-v2 .offers-builder-grid{display:grid!important;grid-template-columns:minmax(420px,.92fr) minmax(560px,1.28fr)!important;gap:14px!important;align-items:start!important;}
#page-add_offer.offers-builder-clean-v2 .offers-builder-grid>div:first-child,#page-add_offer.offers-builder-clean-v2 .offers-builder-grid>div:last-child{display:flex!important;flex-direction:column!important;gap:12px!important;min-width:0!important;}
#page-add_offer.offers-builder-clean-v2 .offers-builder-panel{background:#fff!important;border:1px solid #dcecef!important;border-radius:22px!important;box-shadow:0 12px 28px rgba(15,79,80,.08)!important;padding:14px!important;color:#102a43!important;}
#page-add_offer.offers-builder-clean-v2 .offers-builder-panel.main-info{max-width:680px!important;align-self:stretch!important;}
#page-add_offer.offers-builder-clean-v2 .offers-builder-panel .sbox-title{font-size:15px!important;font-weight:950!important;color:#102a43!important;border-bottom:1px solid #edf3f5!important;padding-bottom:10px!important;margin-bottom:12px!important;background:transparent!important;}
#page-add_offer.offers-builder-clean-v2 .offers-builder-panel .fgrid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;}
#page-add_offer.offers-builder-clean-v2 .offers-builder-panel .fg.full{grid-column:1/-1!important;}
#page-add_offer.offers-builder-clean-v2 .offers-builder-panel .fl{font-size:11px!important;font-weight:900!important;color:#41627E!important;margin-bottom:5px!important;}
#page-add_offer.offers-builder-clean-v2 .offers-builder-panel .fi{background:#f8fbfc!important;border:1px solid #d8e8eb!important;border-radius:12px!important;min-height:36px!important;padding:7px 10px!important;color:#102a43!important;font-size:12px!important;}
#page-add_offer.offers-builder-clean-v2 .of-channel-head{display:flex!important;justify-content:space-between!important;align-items:center!important;gap:8px!important;margin-bottom:8px!important;}
#page-add_offer.offers-builder-clean-v2 .of-channel-head b{font-size:12px!important;color:#102a43!important;}#page-add_offer.offers-builder-clean-v2 .of-channel-head span{font-size:10px!important;color:#607d8b!important;}
#page-add_offer.offers-builder-clean-v2 .of-channel-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(132px,1fr))!important;gap:8px!important;}
#page-add_offer.offers-builder-clean-v2 .of-channel-pill{display:flex!important;align-items:center!important;gap:7px!important;background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:13px!important;padding:9px 10px!important;font-size:11px!important;font-weight:900!important;color:#102a43!important;cursor:pointer!important;}
#page-add_offer.offers-builder-clean-v2 .of-channel-pill:has(input:checked){background:#e8fbfd!important;border-color:#14b8c4!important;color:#0f6f75!important;box-shadow:0 0 0 2px rgba(20,184,196,.10) inset!important;}
#page-add_offer.offers-builder-clean-v2 .of-channel-pill input{width:15px!important;height:15px!important;accent-color:#14b8c4!important;}
#page-add_offer.offers-builder-clean-v2 .items-panel{grid-column:1/-1!important;margin-top:14px!important;width:100%!important;max-width:none!important;}
#page-add_offer.offers-builder-clean-v2 .of-item-search-tools{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:8px!important;align-items:center!important;margin-bottom:10px!important;}
#page-add_offer.offers-builder-clean-v2 .of-item-search-tools span{font-family:var(--fm)!important;font-size:11px!important;font-weight:900!important;color:#41627E!important;background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:999px!important;padding:7px 10px!important;white-space:nowrap!important;}
#page-add_offer.offers-builder-clean-v2 .of-items-workbench,.offers-builder-page .of-items-workbench.of-items-workbench-wide{display:grid!important;grid-template-columns:minmax(0,1.55fr) minmax(430px,.9fr)!important;gap:14px!important;align-items:start!important;direction:rtl!important;min-height:560px!important;}
#page-add_offer.offers-builder-clean-v2 .of-picker-pane,.offers-builder-page .of-picker-pane{background:linear-gradient(180deg,#fbfeff,#eefafa)!important;border:1px solid #dcecef!important;border-radius:20px!important;padding:12px!important;overflow:hidden!important;direction:rtl!important;min-height:560px!important;}
#page-add_offer.offers-builder-clean-v2 .of-selected-pane,.offers-builder-page .of-selected-pane{background:#fff!important;border:1px solid #dcecef!important;border-radius:20px!important;padding:12px!important;overflow:hidden!important;direction:rtl!important;min-height:560px!important;}
#page-add_offer.offers-builder-clean-v2 .of-selected-pane:before,.offers-builder-page .of-selected-pane:before{content:'الأصناف المختارة وتعديل الرسبي';display:block!important;font-size:13px!important;font-weight:950!important;color:#102a43!important;margin-bottom:10px!important;padding-bottom:9px!important;border-bottom:1px solid #edf3f5!important;}
#page-add_offer.offers-builder-clean-v2 .offer-selected-rows:empty:before,.offers-builder-page #offerSelectedRows:empty:before{content:'اختار صنفًا من القائمة ليظهر هنا، ثم عدّل رسبي العرض من نافذة مستقلة.';display:block!important;text-align:center!important;color:#78909c!important;font-size:12px!important;font-weight:850!important;padding:54px 12px!important;border:1px dashed #cfe1e5!important;border-radius:16px!important;background:#fbfeff!important;}
#page-add_offer.offers-builder-clean-v2 .offers-builder-panel .offer-item-selector,.offers-builder-page #offerItemSelector{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))!important;gap:10px!important;background:transparent!important;border:0!important;padding:2px 4px 6px!important;max-height:620px!important;overflow:auto!important;}
#page-add_offer.offers-builder-clean-v2 .offers-builder-panel .ois-item,.offers-builder-page .ois-item{min-height:92px!important;padding:12px!important;border-radius:17px!important;background:#fff!important;border:1px solid #dcecef!important;box-shadow:0 8px 18px rgba(15,79,80,.05)!important;cursor:pointer!important;}
#page-add_offer.offers-builder-clean-v2 .offers-builder-panel .ois-item:hover,.offers-builder-page .ois-item:hover{border-color:#14b8c4!important;background:#effdff!important;}
#page-add_offer.offers-builder-clean-v2 .offers-builder-panel .ois-item.selected,.offers-builder-page .ois-item.selected{background:#fff8dc!important;border-color:#d4a52c!important;}
#page-add_offer.offers-builder-clean-v2 .offer-selected-rows,.offers-builder-page #offerSelectedRows{max-height:620px!important;overflow:auto!important;display:flex!important;flex-direction:column!important;gap:10px!important;padding:2px!important;}
#page-add_offer.offers-builder-clean-v2 .offer-sel-row.of-builder-line-compact,.offers-builder-page .offer-sel-row.of-builder-line-compact{background:linear-gradient(180deg,#ffffff,#f8feff)!important;border:1px solid #dcecef!important;border-radius:18px!important;padding:12px!important;box-shadow:0 8px 18px rgba(15,79,80,.05)!important;}
#page-add_offer.offers-builder-clean-v2 .of-line-main,.offers-builder-page .of-line-main{display:grid!important;grid-template-columns:minmax(0,1fr) 72px 112px 32px!important;gap:8px!important;align-items:center!important;}
#page-add_offer.offers-builder-clean-v2 .of-line-title,.offers-builder-page .of-line-title{display:flex!important;align-items:center!important;gap:8px!important;min-width:0!important;}
#page-add_offer.offers-builder-clean-v2 .of-line-title b,.offers-builder-page .of-line-title b{font-size:13px!important;color:#102a43!important;display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
#page-add_offer.offers-builder-clean-v2 .of-line-title small,.offers-builder-page .of-line-title small{font-size:10px!important;color:#607d8b!important;display:block!important;margin-top:2px!important;}
#page-add_offer.offers-builder-clean-v2 .of-line-total,.offers-builder-page .of-line-total{font-family:var(--fm)!important;font-weight:950!important;color:#8a5d00!important;text-align:center!important;}
#page-add_offer.offers-builder-clean-v2 .of-line-cost-strip,.offers-builder-page .of-line-cost-strip{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:7px!important;margin:10px 0 8px!important;}
#page-add_offer.offers-builder-clean-v2 .of-line-cost-strip span,.offers-builder-page .of-line-cost-strip span{min-height:50px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:13px!important;padding:7px!important;font-size:10px!important;color:#607d8b!important;}
#page-add_offer.offers-builder-clean-v2 .of-line-cost-strip b,.offers-builder-page .of-line-cost-strip b{margin-top:3px!important;font-family:var(--fm)!important;font-size:12px!important;color:#102a43!important;}
#page-add_offer.offers-builder-clean-v2 .of-recipe-tools,.offers-builder-page .of-recipe-tools{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;flex-wrap:wrap!important;padding-top:9px!important;border-top:1px dashed #dcecef!important;margin-top:8px!important;}
#page-add_offer.offers-builder-clean-v2 .of-recipe-state,.offers-builder-page .of-recipe-state{font-size:11px!important;font-weight:950!important;color:#0f8b76!important;}
#page-add_offer.offers-builder-clean-v2 .of-hidden-recipe-store,.offers-builder-page .of-hidden-recipe-store{display:none!important;}
#page-add_offer.offers-builder-clean-v2 .offer-live{background:#fff!important;border:1px solid #dcecef!important;border-radius:22px!important;box-shadow:0 12px 28px rgba(15,79,80,.08)!important;color:#102a43!important;padding:14px!important;position:sticky!important;top:86px!important;}
#page-add_offer.offers-builder-clean-v2 .offer-live-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;}
#page-add_offer.offers-builder-clean-v2 .olg-cell{background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:14px!important;padding:9px!important;}
#page-add_offer.offers-builder-clean-v2 .olg-lbl{font-size:10px!important;color:#607d8b!important;font-weight:900!important;}#page-add_offer.offers-builder-clean-v2 .olg-val{font-size:14px!important;color:#102a43!important;}
#page-add_offer.offers-builder-clean-v2 .offer-cost-breakdown{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin-top:10px!important;}
#page-add_offer.offers-builder-clean-v2 .offer-cost-breakdown div{background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:13px!important;padding:9px!important;}#page-add_offer.offers-builder-clean-v2 .offer-cost-breakdown span{display:block!important;font-size:10px!important;color:#607d8b!important;font-weight:900!important;}#page-add_offer.offers-builder-clean-v2 .offer-cost-breakdown b{font-family:var(--fm)!important;font-size:13px!important;color:#102a43!important;}
.of-recipe-modal-backdrop{position:fixed!important;inset:0!important;z-index:999999!important;background:rgba(15,23,42,.48)!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:22px!important;}
.of-recipe-modal.of-recipe-modal-dashboard{width:min(1120px,96vw)!important;max-height:92vh!important;border-radius:26px!important;overflow:hidden!important;background:#fff!important;box-shadow:0 28px 80px rgba(15,23,42,.30)!important;border:1px solid rgba(14,165,166,.18)!important;display:flex!important;flex-direction:column!important;}
.of-recipe-modal-dashboard .modal-h.of-modal-hero{padding:20px 24px!important;background:linear-gradient(135deg,#ffffff,#f0fbfc)!important;border-bottom:1px solid #e2e8f0!important;display:flex!important;align-items:center!important;justify-content:space-between!important;}
.of-modal-title{display:flex!important;align-items:center!important;gap:12px!important;}.of-modal-title>span{width:42px!important;height:42px!important;border-radius:16px!important;background:#e8fbfd!important;display:flex!important;align-items:center!important;justify-content:center!important;font-size:22px!important;}
.of-recipe-modal-dashboard .modal-h b{font-size:20px!important;color:#102a43!important;}.of-recipe-modal-dashboard .modal-h small{display:block!important;font-size:11px!important;color:#64748b!important;margin-top:4px!important;}.of-recipe-modal-dashboard .btn-x{width:36px!important;height:36px!important;border-radius:13px!important;border:1px solid #e2e8f0!important;background:#fff!important;font-size:20px!important;cursor:pointer!important;}
.of-modal-summary.of-modal-summary-dashboard{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:10px!important;padding:16px 24px!important;border-bottom:1px solid #edf3f5!important;}.of-modal-summary-dashboard div{border-radius:17px!important;padding:13px 10px!important;background:#f8fbfc!important;border:1px solid #dcecef!important;text-align:center!important;}.of-modal-summary-dashboard span{display:block!important;font-size:11px!important;font-weight:900!important;color:#607d8b!important;margin-bottom:5px!important;}.of-modal-summary-dashboard b{font-size:16px!important;color:#102a43!important;font-family:var(--fm)!important;}
.of-modal-toolbar{display:flex!important;gap:8px!important;align-items:center!important;padding:13px 24px!important;background:#fbfeff!important;border-bottom:1px solid #edf3f5!important;}.of-modal-table{padding:0!important;overflow:hidden!important;}.of-modal-recipe-head,.of-modal-recipe-row{display:grid!important;grid-template-columns:minmax(360px,1fr) 120px 120px 140px 42px!important;gap:8px!important;align-items:center!important;}.of-modal-recipe-head{padding:12px 24px!important;background:#f8fbfc!important;border-bottom:1px solid #e2e8f0!important;font-size:11px!important;color:#64748b!important;font-weight:950!important;}.of-modal-recipe-rows{padding:16px 24px!important;min-height:280px!important;max-height:44vh!important;overflow:auto!important;display:flex!important;flex-direction:column!important;gap:9px!important;}.of-modal-recipe-row{border-radius:16px!important;padding:10px!important;background:#fff!important;box-shadow:0 6px 14px rgba(15,79,80,.04)!important;border:1px solid #e2e8f0!important;}.of-modal-recipe-row .fi{height:40px!important;border-radius:12px!important;background:#f8fbfc!important;border:1px solid #d8e8eb!important;}.of-modal-cost{font-family:var(--fm)!important;color:#8a5d00!important;font-weight:950!important;text-align:center!important;background:#fff8e1!important;border:1px solid rgba(215,170,40,.22)!important;border-radius:12px!important;padding:10px 6px!important;}.of-recipe-modal .modal-f{display:flex!important;justify-content:flex-end!important;gap:10px!important;padding:15px 24px!important;border-top:1px solid #e2e8f0!important;background:#fbfeff!important;position:sticky!important;bottom:0!important;}
@media(max-width:1180px){#page-add_offer.offers-builder-clean-v2 .offers-builder-grid{grid-template-columns:1fr!important;}#page-add_offer.offers-builder-clean-v2 .offer-live{position:static!important;}#page-add_offer.offers-builder-clean-v2 .of-items-workbench,.offers-builder-page .of-items-workbench.of-items-workbench-wide{grid-template-columns:1fr!important;}.of-modal-summary.of-modal-summary-dashboard{grid-template-columns:repeat(3,minmax(0,1fr))!important;}.of-modal-recipe-head,.of-modal-recipe-row{grid-template-columns:minmax(220px,1fr) 90px 90px 110px 36px!important;}}
@media(max-width:720px){#page-add_offer.offers-builder-clean-v2 .offers-builder-panel .fgrid,#page-add_offer.offers-builder-clean-v2 .offer-live-grid,#page-add_offer.offers-builder-clean-v2 .offer-cost-breakdown,#page-add_offer.offers-builder-clean-v2 .of-line-cost-strip{grid-template-columns:1fr!important;}#page-add_offer.offers-builder-clean-v2 .of-line-main{grid-template-columns:1fr 58px 78px 28px!important;}.of-modal-summary.of-modal-summary-dashboard{grid-template-columns:1fr 1fr!important;}.of-modal-recipe-head{display:none!important;}.of-modal-recipe-row{grid-template-columns:1fr!important;}}

/* COSTIX_LAST_UPDATE offers_command_center_builder_layout_v3_20260531
   Clean ownership for Offers UI only: Command Center list + Builder workspace + picked item cards.
   This block intentionally overrides previous accumulated Offers CSS without touching sync/storage/cache. */
#page-offers .ph{background:#fff!important;border:1px solid #dcecef!important;border-radius:22px!important;box-shadow:0 12px 28px rgba(15,79,80,.07)!important;margin:14px 18px!important;padding:18px 22px!important;}
#page-offers #offerCards{padding:0 18px 28px!important;display:block!important;}
.offers-command-hero{background:linear-gradient(135deg,#ffffff,#effcff)!important;border:1px solid #dcecef!important;border-radius:26px!important;padding:22px!important;display:grid!important;grid-template-columns:minmax(260px,1fr) auto!important;gap:18px!important;box-shadow:0 14px 32px rgba(15,79,80,.08)!important;margin-bottom:18px!important;}
.offers-command-title h3{font-size:28px!important;margin:8px 0!important;color:#102a43!important;font-weight:950!important;}.offers-command-title p{font-size:13px!important;color:#607d8b!important;margin:0!important;}.offers-command-kicker{display:inline-flex!important;background:#e8fbfd!important;color:#088b8f!important;border:1px solid #b7eef2!important;border-radius:999px!important;padding:6px 12px!important;font-size:11px!important;font-weight:950!important;}
.offers-command-actions{display:flex!important;align-items:start!important;justify-content:end!important;}.offers-command-metrics{grid-column:1/-1!important;display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px!important;}.offers-metric-card{background:#fff!important;border:1px solid #dcecef!important;border-radius:18px!important;min-height:86px!important;padding:14px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;box-shadow:0 8px 18px rgba(15,79,80,.04)!important;}.offers-metric-card span{font-size:11px!important;color:#607d8b!important;font-weight:900!important;}.offers-metric-card b{font-size:24px!important;color:#102a43!important;font-family:var(--fm)!important;margin-top:6px!important;}.offers-metric-card.good b{color:#16a34a!important}.offers-metric-card.teal b{color:#0891b2!important}.offers-metric-card.gold b{color:#b7791f!important}
.offers-risk-strip-v3{margin:0 0 14px!important;background:#fff7ed!important;border:1px solid #fed7aa!important;color:#9a3412!important;border-radius:18px!important;padding:12px 16px!important;display:flex!important;align-items:center!important;gap:10px!important;flex-wrap:wrap!important;font-size:12px!important;}.offers-risk-strip-v3 b{font-size:13px!important;}.offers-risk-strip-v3 span{background:#fff!important;border:1px solid #fed7aa!important;border-radius:999px!important;padding:6px 10px!important;font-weight:900!important;}
.offers-command-board-v3{background:#fff!important;border:1px solid #dcecef!important;border-radius:24px!important;padding:18px!important;box-shadow:0 12px 28px rgba(15,79,80,.07)!important;}.offers-section-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:14px!important;border-bottom:1px solid #edf3f5!important;padding-bottom:14px!important;margin-bottom:16px!important;}.offers-section-head b{display:block!important;font-size:18px!important;color:#102a43!important;}.offers-section-head span{display:block!important;color:#607d8b!important;font-size:12px!important;margin-top:3px!important;}
.offers-command-grid-v3{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(330px,1fr))!important;gap:14px!important;}.offer-command-card-v3{border:1px solid #dcecef!important;border-radius:22px!important;background:linear-gradient(180deg,#ffffff,#fbfeff)!important;padding:15px!important;box-shadow:0 9px 22px rgba(15,79,80,.05)!important;display:flex!important;flex-direction:column!important;gap:11px!important;}.offer-command-card-v3.is-inactive{opacity:.68!important;filter:grayscale(.15)!important;}.offer-card-top-v3{display:flex!important;justify-content:space-between!important;align-items:flex-start!important;gap:10px!important;}.offer-card-index{display:inline-flex!important;background:#edfafd!important;color:#088b8f!important;border:1px solid #b7eef2!important;border-radius:999px!important;padding:4px 9px!important;font-size:11px!important;font-weight:950!important;}.offer-card-top-v3 h4{font-size:17px!important;color:#102a43!important;margin:8px 0 2px!important;}.offer-card-top-v3 p{font-size:12px!important;color:#607d8b!important;margin:0!important;}.offer-card-tags-v3,.offer-card-items-v3{display:flex!important;gap:7px!important;flex-wrap:wrap!important;}.offer-card-tags-v3 span{background:#fff8e1!important;border:1px solid rgba(215,170,40,.25)!important;color:#8a5d00!important;border-radius:999px!important;padding:5px 9px!important;font-size:11px!important;font-weight:900!important;}.offer-card-items-v3 span,.offer-card-items-v3 small{background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:999px!important;padding:5px 9px!important;color:#334155!important;font-size:11px!important;font-weight:850!important;}.offer-card-metrics-v3{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;}.offer-card-metrics-v3 div{background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:15px!important;padding:9px!important;text-align:center!important;}.offer-card-metrics-v3 span{display:block!important;color:#607d8b!important;font-size:10px!important;font-weight:900!important;margin-bottom:4px!important;}.offer-card-metrics-v3 b{font-family:var(--fm)!important;color:#102a43!important;font-size:13px!important;}.offer-card-bar-v3{height:7px!important;background:#edf3f5!important;border-radius:999px!important;overflow:hidden!important;}.offer-card-bar-v3 div{height:100%!important;border-radius:999px!important;}.offer-card-actions-v3{display:flex!important;gap:8px!important;justify-content:flex-end!important;border-top:1px dashed #dcecef!important;padding-top:10px!important;}.offers-command-empty-v3{background:#fff!important;border:1px solid #dcecef!important;border-radius:24px!important;box-shadow:0 12px 28px rgba(15,79,80,.07)!important;min-height:280px!important;display:flex!important;align-items:center!important;justify-content:center!important;flex-direction:column!important;text-align:center!important;color:#102a43!important;}

#page-add_offer.offers-builder-command-v3{background:#eef7f8!important;min-height:calc(100vh - 120px)!important;padding:14px 18px 32px!important;}.offers-builder-command-v3 .offers-old-grid-empty{display:none!important;}.offers-builder-command-v3 .offers-builder-hero{background:#fff!important;border:1px solid #dcecef!important;border-radius:22px!important;box-shadow:0 12px 28px rgba(15,79,80,.07)!important;padding:16px 20px!important;margin:0 0 14px!important;}.offers-builder-shell-v3{display:flex!important;flex-direction:column!important;gap:16px!important;width:100%!important;}.offers-builder-top-v3{display:grid!important;grid-template-columns:minmax(540px,1.2fr) minmax(420px,.8fr)!important;gap:16px!important;align-items:start!important;}.offers-builder-form-stack-v3,.offers-builder-live-stack-v3{display:flex!important;flex-direction:column!important;gap:14px!important;}.offers-builder-workspace-v3{width:100%!important;}.offers-builder-command-v3 .offers-builder-panel{background:#fff!important;border:1px solid #dcecef!important;border-radius:24px!important;box-shadow:0 12px 28px rgba(15,79,80,.07)!important;color:#102a43!important;padding:16px!important;margin:0!important;}.offers-builder-command-v3 .sbox-title{font-size:17px!important;font-weight:950!important;color:#102a43!important;border-bottom:1px solid #edf3f5!important;padding-bottom:12px!important;margin-bottom:14px!important;}.offers-builder-command-v3 .fgrid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;}.offers-builder-command-v3 .fg.full{grid-column:1/-1!important;}.offers-builder-command-v3 .fi{height:42px!important;border-radius:13px!important;background:#f8fbfc!important;border:1px solid #d7e8eb!important;color:#102a43!important;box-shadow:none!important;}.offers-builder-command-v3 .fl{font-size:11px!important;color:#607d8b!important;font-weight:950!important;margin-bottom:6px!important;}.offers-builder-command-v3 .of-panel-live{position:sticky!important;top:82px!important;}.offers-builder-command-v3 .offer-live{position:static!important;box-shadow:none!important;border:0!important;padding:0!important;background:transparent!important;}.offers-builder-command-v3 .offer-live-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;}.offers-builder-command-v3 .olg-cell,.offers-builder-command-v3 .offer-cost-breakdown div{background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:16px!important;padding:12px!important;text-align:center!important;}.offers-builder-command-v3 .olg-lbl,.offers-builder-command-v3 .offer-cost-breakdown span{font-size:10px!important;color:#607d8b!important;font-weight:950!important;}.offers-builder-command-v3 .olg-val,.offers-builder-command-v3 .offer-cost-breakdown b{font-family:var(--fm)!important;color:#102a43!important;font-size:15px!important;}.offers-builder-command-v3 .offer-cost-breakdown{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important;margin:12px 0!important;}
.offers-builder-command-v3 .of-channel-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(120px,1fr))!important;gap:8px!important;}.offers-builder-command-v3 .of-channel-pill{height:42px!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;background:#e8fbfd!important;border:1px solid #19c4ca!important;border-radius:13px!important;color:#075b60!important;font-weight:950!important;}.offers-builder-command-v3 .of-channel-head{display:flex!important;justify-content:space-between!important;align-items:center!important;margin-bottom:10px!important;}.offers-builder-command-v3 .of-channel-head span{font-size:11px!important;color:#607d8b!important;}
.offers-builder-command-v3 .of-panel-items{padding:16px!important;}.offers-builder-command-v3 .of-item-search-tools{display:flex!important;align-items:center!important;gap:10px!important;margin-bottom:12px!important;}.offers-builder-command-v3 .of-search-box{display:flex!important;align-items:center!important;gap:8px!important;flex:1!important;background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:15px!important;padding:0 12px!important;}.offers-builder-command-v3 .of-search-box .fi{border:0!important;background:transparent!important;flex:1!important;}.offers-builder-command-v3 .of-search-count{min-width:84px!important;height:38px!important;border-radius:999px!important;background:#e8fbfd!important;color:#075b60!important;border:1px solid #b7eef2!important;display:flex!important;align-items:center!important;justify-content:center!important;font-family:var(--fm)!important;font-weight:950!important;}.offers-builder-command-v3 .of-items-workbench-v3{display:grid!important;grid-template-columns:minmax(520px,1.25fr) minmax(420px,.75fr)!important;gap:16px!important;align-items:start!important;min-height:520px!important;}.offers-builder-command-v3 .of-picker-pane,.offers-builder-command-v3 .of-selected-pane{background:#fbfeff!important;border:1px solid #dcecef!important;border-radius:20px!important;padding:14px!important;min-height:500px!important;}.offers-builder-command-v3 #offerItemSelector{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(190px,1fr))!important;gap:10px!important;max-height:620px!important;overflow:auto!important;padding:4px!important;}.offers-builder-command-v3 .ois-item{min-height:104px!important;border:1px solid #dcecef!important;border-radius:18px!important;background:#fff!important;padding:12px!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important;box-shadow:0 8px 18px rgba(15,79,80,.04)!important;cursor:pointer!important;}.offers-builder-command-v3 .ois-item.selected{background:#fff8e1!important;border-color:#d7aa28!important;box-shadow:0 0 0 2px rgba(215,170,40,.12)!important;}.offers-builder-command-v3 .ois-name{font-size:13px!important;font-weight:950!important;color:#102a43!important;}.offers-builder-command-v3 .ois-cat{font-size:11px!important;color:#607d8b!important;}.offers-builder-command-v3 .ois-price{font-family:var(--fm)!important;color:#8a5d00!important;font-size:12px!important;font-weight:900!important;}.offers-builder-command-v3 .of-selected-head{display:flex!important;align-items:center!important;justify-content:space-between!important;border-bottom:1px solid #edf3f5!important;padding-bottom:12px!important;margin-bottom:12px!important;}.offers-builder-command-v3 .of-selected-head b{font-size:15px!important;color:#102a43!important;}.offers-builder-command-v3 .of-selected-head span{background:#e8fbfd!important;color:#075b60!important;border:1px solid #b7eef2!important;border-radius:999px!important;padding:5px 10px!important;font-family:var(--fm)!important;font-weight:950!important;font-size:11px!important;}.offers-builder-command-v3 #offerSelectedRows{display:flex!important;flex-direction:column!important;gap:12px!important;max-height:620px!important;overflow:auto!important;padding:2px!important;}
.offers-builder-command-v3 .of-builder-line-card-v3{background:#fff!important;border:1px solid #dcecef!important;border-radius:20px!important;padding:13px!important;box-shadow:0 8px 18px rgba(15,79,80,.04)!important;}.offers-builder-command-v3 .of-picked-head-v3{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;}.offers-builder-command-v3 .of-picked-title-v3{display:flex!important;align-items:center!important;gap:9px!important;min-width:0!important;}.offers-builder-command-v3 .of-picked-icon{width:36px!important;height:36px!important;border-radius:13px!important;background:#f8fbfc!important;border:1px solid #dcecef!important;display:flex!important;align-items:center!important;justify-content:center!important;}.offers-builder-command-v3 .of-picked-title-v3 b{font-size:14px!important;color:#102a43!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;display:block!important;max-width:210px!important;}.offers-builder-command-v3 .of-picked-title-v3 small{font-size:10px!important;color:#607d8b!important;}.offers-builder-command-v3 .of-picked-controls-v3{display:grid!important;grid-template-columns:58px 96px 30px!important;gap:7px!important;align-items:center!important;}.offers-builder-command-v3 .of-line-qty{height:38px!important;text-align:center!important;font-family:var(--fm)!important;font-weight:950!important;}.offers-builder-command-v3 .of-line-total{height:38px!important;border-radius:12px!important;background:#fff8e1!important;border:1px solid rgba(215,170,40,.24)!important;display:flex!important;align-items:center!important;justify-content:center!important;font-family:var(--fm)!important;font-weight:950!important;color:#8a5d00!important;font-size:12px!important;}.offers-builder-command-v3 .of-picked-metrics-v3{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:7px!important;margin:12px 0!important;}.offers-builder-command-v3 .of-picked-metrics-v3 span{background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:14px!important;padding:8px 5px!important;text-align:center!important;min-height:56px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;}.offers-builder-command-v3 .of-picked-metrics-v3 em{font-style:normal!important;font-size:9px!important;color:#607d8b!important;font-weight:950!important;margin-bottom:3px!important;}.offers-builder-command-v3 .of-picked-metrics-v3 b{font-family:var(--fm)!important;color:#102a43!important;font-size:12px!important;}.offers-builder-command-v3 .of-picked-actions-v3{display:flex!important;align-items:center!important;justify-content:space-between!important;border-top:1px dashed #dcecef!important;padding-top:10px!important;gap:8px!important;}.offers-builder-command-v3 .of-recipe-state{font-size:11px!important;font-weight:950!important;color:#088b8f!important;}.offers-builder-command-v3 .of-hidden-recipe-store{display:none!important;}
.of-recipe-modal-backdrop{z-index:999999!important;}.of-recipe-modal.of-recipe-modal-dashboard{width:min(1180px,94vw)!important;max-height:90vh!important;border-radius:26px!important;box-shadow:0 30px 90px rgba(15,23,42,.32)!important;}.of-recipe-modal-dashboard .modal-h.of-modal-hero{background:linear-gradient(135deg,#ffffff,#effcff)!important;padding:20px 24px!important;}.of-modal-summary.of-modal-summary-dashboard{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:10px!important;padding:16px 24px!important;}.of-modal-summary-dashboard div{background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:16px!important;padding:13px!important;text-align:center!important;}.of-modal-recipe-head,.of-modal-recipe-row{grid-template-columns:minmax(420px,1fr) 120px 120px 140px 42px!important;}.of-modal-recipe-rows{min-height:340px!important;max-height:48vh!important;}
@media(max-width:1200px){.offers-command-metrics{grid-template-columns:repeat(3,minmax(0,1fr))!important;}.offers-builder-top-v3,.offers-builder-command-v3 .of-items-workbench-v3{grid-template-columns:1fr!important;}.offers-builder-command-v3 .of-panel-live{position:static!important;}.offers-builder-command-v3 #offerItemSelector{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))!important;}.of-modal-summary.of-modal-summary-dashboard{grid-template-columns:repeat(3,minmax(0,1fr))!important;}}
@media(max-width:760px){.offers-command-hero,.offers-command-metrics,.offer-card-metrics-v3,.offers-builder-command-v3 .fgrid,.offers-builder-command-v3 .offer-live-grid,.offers-builder-command-v3 .offer-cost-breakdown,.offers-builder-command-v3 .of-picked-metrics-v3{grid-template-columns:1fr!important;}.offers-builder-command-v3 .of-picked-head-v3{flex-direction:column!important;align-items:stretch!important;}.offers-builder-command-v3 .of-picked-controls-v3{grid-template-columns:1fr 1fr 32px!important;}.of-modal-recipe-head{display:none!important;}.of-modal-recipe-row{grid-template-columns:1fr!important;}.of-modal-summary.of-modal-summary-dashboard{grid-template-columns:1fr 1fr!important;}}

/* COSTIX_LAST_UPDATE offers_owner_audit_cards_table_layout_20260531
   Clean final ownership for Offers pages: one top add button, cards/table switcher,
   and a stacked selected-item card that does not inherit the old inline grid. */
#page-offers .offers-command-hero{
  display:grid!important;grid-template-columns:1fr!important;gap:18px!important;
  background:linear-gradient(135deg,#ffffff 0%,#f1fdff 100%)!important;
  border:1px solid #dcecef!important;border-radius:26px!important;padding:26px 28px!important;
  box-shadow:0 14px 34px rgba(15,79,80,.08)!important;margin:0 0 18px!important;color:#102a43!important;
}
#page-offers .offers-command-title{text-align:right!important;max-width:none!important;}
#page-offers .offers-command-kicker{display:inline-flex!important;align-items:center!important;gap:6px!important;background:#e8fbfd!important;color:#087782!important;border:1px solid #b7eef2!important;border-radius:999px!important;padding:6px 11px!important;font-size:11px!important;font-weight:950!important;margin-bottom:8px!important;}
#page-offers .offers-command-title h3{font-size:28px!important;line-height:1.2!important;margin:0 0 8px!important;color:#102a43!important;font-weight:950!important;}
#page-offers .offers-command-title p{font-size:13px!important;color:#607d8b!important;margin:0!important;}
#page-offers .offers-command-actions{display:none!important;}
#page-offers .offers-command-metrics{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px!important;}
#page-offers .offers-metric-card{background:#fff!important;border:1px solid #dcecef!important;border-radius:18px!important;padding:15px!important;min-height:74px!important;box-shadow:0 8px 20px rgba(15,79,80,.04)!important;display:flex!important;flex-direction:column!important;justify-content:center!important;}
#page-offers .offers-metric-card span{font-size:11px!important;color:#607d8b!important;font-weight:950!important;}
#page-offers .offers-metric-card b{font-family:var(--fm)!important;font-size:23px!important;color:#102a43!important;margin-top:4px!important;}
#page-offers .offers-command-board-v3{background:#fff!important;border:1px solid #dcecef!important;border-radius:26px!important;padding:18px!important;box-shadow:0 14px 34px rgba(15,79,80,.08)!important;}
#page-offers .offers-command-toolbar{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;border-bottom:1px solid #edf3f5!important;padding-bottom:14px!important;margin-bottom:16px!important;}
#page-offers .offers-command-toolbar b{display:block!important;font-size:18px!important;color:#102a43!important;font-weight:950!important;}
#page-offers .offers-command-toolbar span{display:block!important;font-size:12px!important;color:#607d8b!important;margin-top:3px!important;}
#page-offers .offers-view-switch{display:inline-flex!important;gap:6px!important;background:#f6fbfc!important;border:1px solid #dcecef!important;border-radius:16px!important;padding:5px!important;}
#page-offers .offers-view-switch button{border:0!important;background:transparent!important;border-radius:12px!important;height:36px!important;padding:0 14px!important;color:#41627E!important;font-weight:950!important;cursor:pointer!important;}
#page-offers .offers-view-switch button.is-on{background:#12bfc8!important;color:#fff!important;box-shadow:0 8px 18px rgba(18,191,200,.22)!important;}
#page-offers .offers-command-grid-v3{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(430px,1fr))!important;gap:14px!important;}
#page-offers .offer-command-card-v3{background:linear-gradient(180deg,#fff,#fbfeff)!important;border:1px solid #dcecef!important;border-radius:22px!important;padding:16px!important;box-shadow:0 10px 26px rgba(15,79,80,.06)!important;display:flex!important;flex-direction:column!important;gap:12px!important;min-height:0!important;}
#page-offers .offer-card-metrics-v3{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;}
#page-offers .offer-card-metrics-v3 div{background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:15px!important;padding:10px!important;text-align:center!important;}
#page-offers .offer-card-actions-v3{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;border-top:1px dashed #dcecef!important;padding-top:10px!important;}
#page-offers .offers-table-shell{overflow:auto!important;border:1px solid #dcecef!important;border-radius:20px!important;background:#fff!important;}
#page-offers .offers-command-table{width:100%!important;border-collapse:separate!important;border-spacing:0!important;min-width:980px!important;}
#page-offers .offers-command-table th{background:#f6fbfc!important;color:#41627E!important;font-size:11px!important;font-weight:950!important;padding:13px 10px!important;border-bottom:1px solid #dcecef!important;text-align:right!important;white-space:nowrap!important;}
#page-offers .offers-command-table td{padding:13px 10px!important;border-bottom:1px solid #edf3f5!important;color:#102a43!important;font-size:12px!important;vertical-align:top!important;}
#page-offers .offers-command-table td b{display:block!important;font-weight:950!important;}
#page-offers .offers-command-table td small{display:block!important;color:#607d8b!important;font-size:10px!important;margin-top:3px!important;}
#page-offers .offers-command-table td span{display:inline-flex!important;margin:2px!important;background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:999px!important;padding:4px 8px!important;font-size:10px!important;font-weight:850!important;}
#page-offers .offers-table-actions{display:flex!important;gap:6px!important;flex-wrap:wrap!important;}

#page-add_offer.offers-builder-command-v3 #offerSelectedRows{display:flex!important;flex-direction:column!important;gap:14px!important;max-height:620px!important;overflow:auto!important;padding:4px!important;}
#page-add_offer.offers-builder-command-v3 .offer-sel-row.of-builder-line-card-v3{
  display:block!important;grid-template-columns:none!important;background:#fff!important;border:1px solid #dcecef!important;border-radius:22px!important;
  padding:14px!important;box-shadow:0 10px 24px rgba(15,79,80,.06)!important;min-height:auto!important;overflow:hidden!important;
}
#page-add_offer.offers-builder-command-v3 .of-picked-head-v4{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:12px!important;margin-bottom:12px!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-title-v4{display:flex!important;align-items:center!important;gap:10px!important;min-width:0!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-title-v4 b{display:block!important;font-size:14px!important;color:#102a43!important;font-weight:950!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:260px!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-title-v4 small{display:block!important;font-size:10px!important;color:#607d8b!important;margin-top:3px!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-controls-v4{display:grid!important;grid-template-columns:96px 1fr!important;gap:8px!important;margin:0 0 12px!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-controls-v4 label,#page-add_offer.offers-builder-command-v3 .of-picked-controls-v4 div{background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:15px!important;padding:9px!important;min-height:58px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-controls-v4 span{font-size:10px!important;color:#607d8b!important;font-weight:950!important;margin-bottom:4px!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-controls-v4 b{font-family:var(--fm)!important;color:#8a5d00!important;font-size:14px!important;}
#page-add_offer.offers-builder-command-v3 .of-line-qty{width:100%!important;height:34px!important;text-align:center!important;font-family:var(--fm)!important;font-weight:950!important;border-radius:10px!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-metrics-v4{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin:0 0 12px!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-metrics-v4 div{background:#f8fbfc!important;border:1px solid #dcecef!important;border-radius:15px!important;padding:10px!important;min-height:62px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;text-align:center!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-metrics-v4 div:nth-child(5){grid-column:1/-1!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-metrics-v4 em{font-style:normal!important;font-size:10px!important;color:#607d8b!important;font-weight:950!important;margin-bottom:5px!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-metrics-v4 b{font-family:var(--fm)!important;color:#102a43!important;font-size:14px!important;line-height:1.4!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-actions-v4{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;border-top:1px dashed #dcecef!important;padding-top:11px!important;}
#page-add_offer.offers-builder-command-v3 .of-picked-actions-v4>div{display:flex!important;gap:8px!important;flex-wrap:wrap!important;}
#page-add_offer.offers-builder-command-v3 .of-recipe-state{font-size:11px!important;color:#088b8f!important;font-weight:950!important;}

@media(max-width:1200px){
  #page-offers .offers-command-metrics{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
  #page-offers .offers-command-grid-v3{grid-template-columns:1fr!important;}
}
@media(max-width:760px){
  #page-offers .offers-command-metrics,#page-offers .offer-card-metrics-v3{grid-template-columns:1fr!important;}
  #page-offers .offers-command-toolbar{flex-direction:column!important;align-items:stretch!important;}
  #page-add_offer.offers-builder-command-v3 .of-picked-controls-v4,#page-add_offer.offers-builder-command-v3 .of-picked-metrics-v4{grid-template-columns:1fr!important;}
}


/* Offers Search + Selected Title Fix — 2026-05-31
   Single owner for selected-items title: .of-selected-head in app.js.
   Search hiding uses class + !important to beat older .ois-item display:flex!important rules. */
#page-add_offer.offers-builder-clean-v2 .of-selected-pane:before,
.offers-builder-page .of-selected-pane:before{
  content:none!important;
  display:none!important;
}
#page-add_offer #offerItemSelector .ois-item.of-search-hidden,
.offers-builder-page #offerItemSelector .ois-item.of-search-hidden{
  display:none!important;
}

/* COSTIX_LAST_UPDATE offer_channel_cards_restore_20260531
   Offers: restored channel pricing cards instead of the old matrix.
   Clean replacement for offer_channel_pricing_matrix_20260531.
   No sync/storage/price calculation behavior changed. */
#page-add_offer.offers-builder-command-v3 .of-sales-channel-cards-field{grid-column:1/-1!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-cards-head{display:flex!important;justify-content:space-between!important;align-items:flex-start!important;gap:10px!important;margin-bottom:10px!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-cards-head b{font-size:13px!important;color:#102a43!important;font-weight:1000!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-cards-head span{font-size:11px!important;color:#607d8b!important;font-weight:850!important;line-height:1.6!important;text-align:left!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-cards{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(245px,1fr))!important;gap:12px!important;background:linear-gradient(180deg,#f8ffff,#eefafa)!important;border:1px solid #cfeaec!important;border-radius:22px!important;padding:12px!important;max-height:430px!important;overflow-y:auto!important;overflow-x:hidden!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-card{min-width:0!important;background:#fff!important;border:1px solid #dcecef!important;border-radius:20px!important;padding:13px!important;box-shadow:0 12px 28px rgba(29,91,92,.07)!important;display:flex!important;flex-direction:column!important;gap:11px!important;transition:.16s ease!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-card:hover{transform:translateY(-2px)!important;border-color:#9bdde1!important;box-shadow:0 18px 36px rgba(29,91,92,.12)!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-card:has(.of-channel-switch input:checked){border-color:#19c4ca!important;background:linear-gradient(180deg,#ffffff,#f0feff)!important;box-shadow:0 0 0 2px rgba(20,184,196,.10) inset,0 14px 30px rgba(29,91,92,.09)!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-card-top{display:flex!important;justify-content:space-between!important;align-items:center!important;gap:10px!important;padding-bottom:10px!important;border-bottom:1px solid #e6f1f3!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-card-title{display:flex!important;align-items:center!important;gap:8px!important;min-width:0!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-card-title span{width:34px!important;height:34px!important;border-radius:13px!important;display:grid!important;place-items:center!important;background:#e8fbfd!important;border:1px solid #c6eef1!important;color:#0f6f75!important;flex:0 0 auto!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-card-title strong{font-size:13px!important;color:#102a43!important;font-weight:1000!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-card-body{display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px!important;min-width:0!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-metric,
#page-add_offer.offers-builder-command-v3 .of-channel-price-box,
#page-add_offer.offers-builder-command-v3 .of-channel-profit-box{min-width:0!important;background:#f8fbfc!important;border:1px solid #e1eff1!important;border-radius:15px!important;padding:10px!important;display:flex!important;flex-direction:column!important;gap:5px!important;justify-content:center!important;text-align:center!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-price-box{grid-column:1/-1!important;background:#fffdf5!important;border-color:#ead38a!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-profit-box{grid-column:1/-1!important;background:#f7fffb!important;border-color:#ccefe0!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-metric small,
#page-add_offer.offers-builder-command-v3 .of-channel-price-box small{font-size:10px!important;color:#607d8b!important;font-weight:950!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-metric b{font-family:var(--fm)!important;font-size:14px!important;color:#102a43!important;font-weight:1000!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-price-input{height:38px!important;width:100%!important;text-align:center!important;font-family:var(--fm)!important;font-weight:1000!important;background:#fff!important;border-color:#ead38a!important;border-radius:12px!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-switch{display:flex!important;align-items:center!important;justify-content:center!important;cursor:pointer!important;flex:0 0 auto!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-switch input{display:none!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-switch span{width:46px!important;height:26px!important;border-radius:999px!important;background:#d7e3e6!important;position:relative!important;display:block!important;transition:.18s ease!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-switch span:before{content:'';position:absolute!important;width:20px!important;height:20px!important;border-radius:50%!important;background:#fff!important;top:3px!important;right:3px!important;box-shadow:0 2px 8px rgba(0,0,0,.18)!important;transition:.18s ease!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-switch input:checked+span{background:#14b8c4!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-switch input:checked+span:before{right:23px!important;}
#page-add_offer.offers-builder-command-v3 .ofch-profit{font-family:var(--fm)!important;}
#page-add_offer.offers-builder-command-v3 .ofch-profit b{font-size:14px!important;font-weight:1000!important;}
#page-add_offer.offers-builder-command-v3 .ofch-profit small{font-size:10px!important;color:#607d8b!important;font-weight:900!important;line-height:1.45!important;}
@media(max-width:760px){#page-add_offer.offers-builder-command-v3 .of-channel-cards{grid-template-columns:1fr!important;max-height:none!important;}#page-add_offer.offers-builder-command-v3 .of-channel-cards-head{flex-direction:column!important;}#page-add_offer.offers-builder-command-v3 .of-channel-cards-head span{text-align:right!important;}}

/* COSTIX_LAST_UPDATE add_offer_category_picker_scroll_20260531
   Add Offer: category-first item picker + scoped internal scrolling for selected items and recipe modal. */
#page-add_offer.offers-builder-command-v3 .of-items-workbench-v3,
#page-add_offer.offers-builder-clean-v2 .of-items-workbench{
  align-items:stretch!important;
  min-height:0!important;
}
#page-add_offer.offers-builder-command-v3 .of-picker-pane,
#page-add_offer.offers-builder-command-v3 .of-selected-pane,
#page-add_offer.offers-builder-clean-v2 .of-picker-pane,
#page-add_offer.offers-builder-clean-v2 .of-selected-pane{
  display:flex!important;
  flex-direction:column!important;
  height:clamp(390px,calc(100vh - 355px),610px)!important;
  min-height:0!important;
  max-height:610px!important;
  overflow:hidden!important;
}
#page-add_offer.offers-builder-command-v3 #offerItemSelector,
#page-add_offer.offers-builder-clean-v2 #offerItemSelector{
  flex:1 1 auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:auto!important;
  align-content:start!important;
}
#page-add_offer.offers-builder-command-v3 #offerSelectedRows,
#page-add_offer.offers-builder-clean-v2 #offerSelectedRows{
  flex:1 1 auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-inline-end:6px!important;
  scrollbar-gutter:stable!important;
}
#page-add_offer.offers-builder-command-v3 #offerItemSelector.of-picker-categories-mode,
#page-add_offer.offers-builder-clean-v2 #offerItemSelector.of-picker-categories-mode{
  display:grid!important;
  grid-template-columns:repeat(auto-fill,minmax(190px,1fr))!important;
  gap:12px!important;
}
#page-add_offer.offers-builder-command-v3 .of-category-card,
#page-add_offer.offers-builder-clean-v2 .of-category-card{
  border:1px solid #dcecef!important;
  border-radius:20px!important;
  background:linear-gradient(180deg,#ffffff,#f5fcfd)!important;
  min-height:118px!important;
  padding:14px!important;
  box-shadow:0 10px 22px rgba(15,79,80,.05)!important;
  cursor:pointer!important;
  text-align:right!important;
  color:#102a43!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:8px!important;
}
#page-add_offer.offers-builder-command-v3 .of-category-card:hover,
#page-add_offer.offers-builder-clean-v2 .of-category-card:hover{
  border-color:#14b8c4!important;
  background:#effdff!important;
  transform:translateY(-1px)!important;
}
#page-add_offer.offers-builder-command-v3 .of-category-card.selected,
#page-add_offer.offers-builder-clean-v2 .of-category-card.selected{
  border-color:#d4a52c!important;
  background:#fff8dc!important;
}
#page-add_offer.offers-builder-command-v3 .of-category-icon,
#page-add_offer.offers-builder-clean-v2 .of-category-icon{
  width:36px!important;height:36px!important;border-radius:14px!important;
  background:#e8fbfd!important;border:1px solid #b7eef2!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  font-size:18px!important;
}
#page-add_offer.offers-builder-command-v3 .of-category-card b,
#page-add_offer.offers-builder-clean-v2 .of-category-card b{
  font-size:14px!important;font-weight:950!important;color:#102a43!important;
}
#page-add_offer.offers-builder-command-v3 .of-category-card small,
#page-add_offer.offers-builder-clean-v2 .of-category-card small{
  color:#607d8b!important;font-size:11px!important;font-weight:850!important;
}
#page-add_offer.offers-builder-command-v3 #offerItemSelector.of-picker-items-mode,
#page-add_offer.offers-builder-clean-v2 #offerItemSelector.of-picker-items-mode{
  display:grid!important;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr))!important;
  gap:10px!important;
}
#page-add_offer.offers-builder-command-v3 .of-picker-nav,
#page-add_offer.offers-builder-clean-v2 .of-picker-nav{
  grid-column:1/-1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  position:sticky!important;
  top:0!important;
  z-index:3!important;
  background:#fbfeff!important;
  border:1px solid #dcecef!important;
  border-radius:16px!important;
  padding:9px 10px!important;
  box-shadow:0 8px 16px rgba(15,79,80,.05)!important;
}
#page-add_offer.offers-builder-command-v3 .of-picker-nav b,
#page-add_offer.offers-builder-clean-v2 .of-picker-nav b{
  font-size:13px!important;font-weight:950!important;color:#102a43!important;
}
#page-add_offer.offers-builder-command-v3 .of-picker-nav span,
#page-add_offer.offers-builder-clean-v2 .of-picker-nav span{
  font-family:var(--fm)!important;font-size:11px!important;font-weight:950!important;color:#075b60!important;
  background:#e8fbfd!important;border:1px solid #b7eef2!important;border-radius:999px!important;padding:5px 9px!important;
}
#page-add_offer.offers-builder-command-v3 .of-picker-empty,
#page-add_offer.offers-builder-clean-v2 .of-picker-empty{
  grid-column:1/-1!important;text-align:center!important;color:#78909c!important;font-size:12px!important;font-weight:850!important;
  padding:42px 12px!important;border:1px dashed #cfe1e5!important;border-radius:16px!important;background:#fbfeff!important;
}
/* COSTIX_LAST_UPDATE add_offer_selected_scroll_recipe_modal_polish_20260531
   Add Offer: fixed selected-items internal scroll and rebuilt recipe modal sizing without changing offer data logic. */
#page-add_offer.offers-builder-command-v3 .of-selected-head,
#page-add_offer.offers-builder-clean-v2 .of-selected-head{
  flex:0 0 auto!important;
}
#page-add_offer.offers-builder-command-v3 .of-builder-line-card-v3,
#page-add_offer.offers-builder-clean-v2 .of-builder-line-card-v3{
  flex:0 0 auto!important;
}
#page-add_offer.offers-builder-command-v3 .of-picked-actions-v4,
#page-add_offer.offers-builder-command-v3 .of-picked-actions-v3,
#page-add_offer.offers-builder-clean-v2 .of-picked-actions-v4,
#page-add_offer.offers-builder-clean-v2 .of-picked-actions-v3{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
#page-add_offer.offers-builder-command-v3 .of-picked-actions-v4 > div,
#page-add_offer.offers-builder-command-v3 .of-picked-actions-v3 > div,
#page-add_offer.offers-builder-clean-v2 .of-picked-actions-v4 > div,
#page-add_offer.offers-builder-clean-v2 .of-picked-actions-v3 > div{
  display:flex!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
#ofRecipeModal.of-recipe-modal-backdrop{
  align-items:center!important;
  justify-content:center!important;
  padding:24px!important;
}
#ofRecipeModal .of-recipe-modal{
  width:min(1240px,96vw)!important;
  height:min(820px,90vh)!important;
  max-height:calc(100vh - 44px)!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border-radius:28px!important;
}
#ofRecipeModal .of-modal-hero{
  flex:0 0 auto!important;
}
#ofRecipeModal .of-modal-summary-dashboard{
  flex:0 0 auto!important;
  grid-template-columns:repeat(6,minmax(120px,1fr))!important;
  padding:14px 24px!important;
}
#ofRecipeModal .of-modal-toolbar{
  flex:0 0 auto!important;
}
#ofRecipeModal .of-modal-table{
  flex:1 1 auto!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  background:#ffffff!important;
}
#ofRecipeModal .of-modal-recipe-head{
  flex:0 0 auto!important;
  position:sticky!important;
  top:0!important;
  z-index:2!important;
}
#ofRecipeModal #ofRecipeModalRows{
  flex:1 1 auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:18px 24px 22px!important;
  background:linear-gradient(180deg,#ffffff,#fbfeff)!important;
  scrollbar-gutter:stable!important;
}
#ofRecipeModal .of-modal-recipe-head,
#ofRecipeModal .of-modal-recipe-row{
  width:100%!important;
  min-width:0!important;
  grid-template-columns:minmax(0,2.6fr) minmax(96px,.62fr) minmax(96px,.62fr) minmax(112px,.7fr) 42px!important;
}
#ofRecipeModal .of-modal-recipe-row{
  min-height:62px!important;
}
#ofRecipeModal .of-modal-recipe-row > *,
#ofRecipeModal .of-modal-recipe-head > *{
  min-width:0!important;
}
#ofRecipeModal .of-modal-recipe-row .fi,
#ofRecipeModal .of-modal-recipe-row input,
#ofRecipeModal .of-modal-recipe-row select{
  width:100%!important;
  min-width:0!important;
}
#ofRecipeModal .of-modal-table,
#ofRecipeModal .of-modal-recipe-head{
  overflow-x:hidden!important;
}
#ofRecipeModal .modal-f{
  flex:0 0 auto!important;
  position:relative!important;
  bottom:auto!important;
  padding:16px 24px!important;
  background:#fbfeff!important;
  box-shadow:0 -12px 28px rgba(15,79,80,.05)!important;
}
@media(max-width:900px){
  #page-add_offer.offers-builder-command-v3 .of-picker-pane,
  #page-add_offer.offers-builder-command-v3 .of-selected-pane,
  #page-add_offer.offers-builder-clean-v2 .of-picker-pane,
  #page-add_offer.offers-builder-clean-v2 .of-selected-pane{height:520px!important;max-height:520px!important;}
  #ofRecipeModal .of-recipe-modal{width:96vw!important;height:88vh!important;}
  #ofRecipeModal .of-modal-summary-dashboard{grid-template-columns:repeat(2,minmax(0,1fr))!important;overflow:hidden!important;}
  #ofRecipeModal .of-modal-recipe-head{display:none!important;}
  #ofRecipeModal .of-modal-recipe-row{grid-template-columns:1fr!important;}
}

/* COSTIX_LAST_UPDATE add_offer_recipe_modal_split_raw_component_20260531
   Add Offer recipe modal: wide dashboard modal, separated raw material vs component add actions, vertical scroll only. */
#ofRecipeModal.of-recipe-modal-backdrop{
  align-items:center!important;
  justify-content:center!important;
  padding:22px!important;
  overflow:hidden!important;
}
#ofRecipeModal .modal.of-recipe-modal,
#ofRecipeModal .of-recipe-modal.of-recipe-modal-dashboard,
#ofRecipeModal .of-recipe-modal.of-recipe-modal-polished{
  width:min(1240px,96vw)!important;
  max-width:none!important;
  height:min(820px,90vh)!important;
  max-height:calc(100vh - 44px)!important;
  padding:0!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  border-radius:28px!important;
  background:#ffffff!important;
  border:1px solid rgba(14,165,166,.20)!important;
  box-shadow:0 34px 96px rgba(15,23,42,.34)!important;
}
#ofRecipeModal .of-modal-hero{
  flex:0 0 auto!important;
  padding:18px 24px!important;
  background:linear-gradient(135deg,#ffffff 0%,#ecfeff 100%)!important;
  border-bottom:1px solid #e2edf2!important;
}
#ofRecipeModal .of-modal-summary-dashboard{
  flex:0 0 auto!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:10px!important;
  padding:14px 24px!important;
  overflow:visible!important;
}
#ofRecipeModal .of-modal-summary-dashboard div{
  min-width:0!important;
  padding:12px 10px!important;
}
#ofRecipeModal .of-modal-toolbar{
  flex:0 0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  flex-wrap:wrap!important;
  padding:12px 24px!important;
  background:#fbfeff!important;
  border-top:1px solid #edf5f7!important;
  border-bottom:1px solid #e2edf2!important;
}
#ofRecipeModal .of-modal-table{
  flex:1 1 auto!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  background:#ffffff!important;
}
#ofRecipeModal .of-modal-recipe-head,
#ofRecipeModal .of-modal-recipe-row{
  display:grid!important;
  width:100%!important;
  min-width:0!important;
  grid-template-columns:118px minmax(0,2.4fr) 110px 110px 130px 40px!important;
  gap:8px!important;
  align-items:center!important;
}
#ofRecipeModal .of-modal-recipe-head{
  flex:0 0 auto!important;
  padding:12px 24px!important;
  background:#f8fbfc!important;
  border-bottom:1px solid #e2edf2!important;
  color:#607d8b!important;
  font-size:11px!important;
  font-weight:950!important;
  position:relative!important;
  top:auto!important;
  z-index:2!important;
}
#ofRecipeModal #ofRecipeModalRows{
  flex:1 1 auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:16px 24px 22px!important;
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
  background:linear-gradient(180deg,#ffffff 0%,#fbfeff 100%)!important;
  scrollbar-gutter:stable!important;
}
#ofRecipeModal .of-modal-recipe-row{
  min-height:62px!important;
  padding:10px!important;
  border-radius:16px!important;
  background:#ffffff!important;
  border:1px solid #dcecef!important;
  box-shadow:0 8px 18px rgba(15,79,80,.05)!important;
}
#ofRecipeModal .of-modal-kind{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  height:38px!important;
  border-radius:999px!important;
  font-size:11px!important;
  font-weight:950!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  border:1px solid #dcecef!important;
  background:#f8fbfc!important;
  color:#0f5260!important;
}
#ofRecipeModal .of-modal-kind.rm{
  background:#ecfeff!important;
  border-color:#a5f3fc!important;
  color:#0e7490!important;
}
#ofRecipeModal .of-modal-kind.sr{
  background:#f5f3ff!important;
  border-color:#ddd6fe!important;
  color:#6d28d9!important;
}
#ofRecipeModal .of-modal-recipe-row > *,
#ofRecipeModal .of-modal-recipe-head > *{
  min-width:0!important;
}
#ofRecipeModal .of-modal-recipe-row .fi,
#ofRecipeModal .of-modal-recipe-row input,
#ofRecipeModal .of-modal-recipe-row select{
  width:100%!important;
  min-width:0!important;
  height:40px!important;
  border-radius:12px!important;
  background:#f8fbfc!important;
  border:1px solid #d8e8eb!important;
  font-size:12px!important;
}
#ofRecipeModal .of-modal-cost{
  min-width:0!important;
  height:40px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:12px!important;
}
#ofRecipeModal .modal-f{
  flex:0 0 auto!important;
  position:relative!important;
  bottom:auto!important;
  display:flex!important;
  justify-content:flex-end!important;
  gap:10px!important;
  padding:15px 24px!important;
  background:#fbfeff!important;
  border-top:1px solid #e2edf2!important;
  box-shadow:0 -12px 28px rgba(15,79,80,.05)!important;
}
@media(max-width:980px){
  #ofRecipeModal .modal.of-recipe-modal,
  #ofRecipeModal .of-recipe-modal.of-recipe-modal-dashboard,
  #ofRecipeModal .of-recipe-modal.of-recipe-modal-polished{width:96vw!important;height:88vh!important;}
  #ofRecipeModal .of-modal-summary-dashboard{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  #ofRecipeModal .of-modal-recipe-head{display:none!important;}
  #ofRecipeModal .of-modal-recipe-row{grid-template-columns:1fr!important;}
  #ofRecipeModal #ofRecipeModalRows{padding:12px!important;}
}

/* COSTIX_LAST_UPDATE add_offer_channel_table_scroll_restore_20260531
   Restore offer sales channel pricing as a clean table instead of cards.
   UI only: keeps existing channel input ids, checkbox values, pricing/save logic. */
#page-add_offer.offers-builder-command-v3 .of-sales-channel-table-field{
  min-width:0!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table-head{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin-bottom:10px!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table-head b{
  color:#102a43!important;
  font-size:13px!important;
  font-weight:1000!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table-head span{
  color:#607d8b!important;
  font-size:11px!important;
  font-weight:850!important;
  line-height:1.6!important;
  text-align:left!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table-scroll{
  width:100%!important;
  max-height:278px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  border:1px solid #cfeaec!important;
  border-radius:20px!important;
  background:linear-gradient(180deg,#f8ffff,#eefafa)!important;
  padding:10px!important;
  box-shadow:inset 0 0 0 1px rgba(20,184,196,.04)!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table{
  width:100%!important;
  min-width:0!important;
  table-layout:fixed!important;
  border-collapse:separate!important;
  border-spacing:0 8px!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table thead th{
  position:sticky!important;
  top:0!important;
  z-index:2!important;
  background:#e8fbfd!important;
  color:#075b60!important;
  border-top:1px solid #c6eef1!important;
  border-bottom:1px solid #c6eef1!important;
  padding:10px 8px!important;
  font-size:11px!important;
  font-weight:1000!important;
  text-align:center!important;
  white-space:normal!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table thead th:first-child{border-radius:0 13px 13px 0!important;border-right:1px solid #c6eef1!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-table thead th:last-child{border-radius:13px 0 0 13px!important;border-left:1px solid #c6eef1!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-table tbody tr{
  background:#fff!important;
  box-shadow:0 8px 18px rgba(29,91,92,.055)!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table tbody td{
  background:#fff!important;
  border-top:1px solid #dcecef!important;
  border-bottom:1px solid #dcecef!important;
  padding:9px 8px!important;
  text-align:center!important;
  vertical-align:middle!important;
  color:#102a43!important;
  font-weight:900!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table tbody td:first-child{border-right:1px solid #dcecef!important;border-radius:0 15px 15px 0!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-table tbody td:last-child{border-left:1px solid #dcecef!important;border-radius:15px 0 0 15px!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-table tbody tr:hover td{
  background:#f0feff!important;
  border-color:#9bdde1!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-name{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  text-align:right!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-name span{
  width:30px!important;
  height:30px!important;
  border-radius:12px!important;
  display:grid!important;
  place-items:center!important;
  background:#e8fbfd!important;
  border:1px solid #c6eef1!important;
  flex:0 0 auto!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-name b{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:12px!important;
  font-weight:1000!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table .ofch-standalone,
#page-add_offer.offers-builder-command-v3 .of-channel-table .ofch-suggested{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:32px!important;
  width:100%!important;
  border-radius:12px!important;
  background:#f8fbfc!important;
  border:1px solid #e1eff1!important;
  font-family:var(--fm)!important;
  font-size:12px!important;
  font-weight:1000!important;
  color:#102a43!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table .of-channel-price-input{
  width:100%!important;
  max-width:130px!important;
  min-width:0!important;
  margin:auto!important;
  height:36px!important;
  text-align:center!important;
  border-radius:12px!important;
  border-color:#ead38a!important;
  background:#fffdf5!important;
  font-family:var(--fm)!important;
  font-weight:1000!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table .of-channel-profit-box{
  min-width:0!important;
  width:100%!important;
  min-height:38px!important;
  background:#f7fffb!important;
  border:1px solid #ccefe0!important;
  border-radius:13px!important;
  padding:6px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:center!important;
  gap:2px!important;
  text-align:center!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table .of-channel-profit-box b{
  font-family:var(--fm)!important;
  font-size:12px!important;
  font-weight:1000!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table .of-channel-profit-box small{
  display:block!important;
  font-size:9px!important;
  color:#607d8b!important;
  font-weight:850!important;
  line-height:1.25!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table .of-channel-switch{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:pointer!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table .of-channel-switch input{display:none!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-table .of-channel-switch span{
  width:46px!important;
  height:26px!important;
  border-radius:999px!important;
  background:#d7e3e6!important;
  position:relative!important;
  display:block!important;
  transition:.18s ease!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table .of-channel-switch span:before{
  content:'';
  position:absolute!important;
  width:20px!important;
  height:20px!important;
  border-radius:50%!important;
  background:#fff!important;
  top:3px!important;
  right:3px!important;
  box-shadow:0 2px 8px rgba(0,0,0,.18)!important;
  transition:.18s ease!important;
}
#page-add_offer.offers-builder-command-v3 .of-channel-table .of-channel-switch input:checked+span{background:#14b8c4!important;}
#page-add_offer.offers-builder-command-v3 .of-channel-table .of-channel-switch input:checked+span:before{right:23px!important;}
@media(max-width:900px){
  #page-add_offer.offers-builder-command-v3 .of-channel-table-scroll{max-height:340px!important;}
  #page-add_offer.offers-builder-command-v3 .of-channel-table{table-layout:auto!important;}
  #page-add_offer.offers-builder-command-v3 .of-channel-table thead th,
  #page-add_offer.offers-builder-command-v3 .of-channel-table tbody td{padding:8px 6px!important;font-size:10px!important;}
  #page-add_offer.offers-builder-command-v3 .of-channel-table .of-channel-profit-box small{font-size:8px!important;}
}

/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE expenses_cockpit_full_rebuild_20260531
   Daily Expenses Command Center UI rebuild.
   Centralized CSS only: no sync/storage/API behavior changes.
═══════════════════════════════════════════════════════════════ */
#page-expenses{background:linear-gradient(180deg,#f7fdff 0%,#eef8fb 100%)!important;color:#0f172a!important;padding:18px!important;}
#expContent{direction:rtl;color:#0f172a!important;font-family:Cairo,Tahoma,Arial,sans-serif;}
.exp-cockpit{max-width:1720px;margin:0 auto;display:flex;flex-direction:column;gap:14px;}
.exp-hero,.exp-filter-card,.exp-card,.exp-table-card,.exp-kpi{background:rgba(255,255,255,.94);border:1px solid rgba(14,165,183,.16);box-shadow:0 14px 36px rgba(15,23,42,.06);border-radius:24px;}
.exp-hero{padding:22px;display:flex;justify-content:space-between;align-items:flex-start;gap:18px;background:linear-gradient(135deg,#ffffff 0%,#ecfeff 100%);overflow:hidden;position:relative;}
.exp-hero:after{content:'';position:absolute;left:-70px;bottom:-80px;width:230px;height:230px;border-radius:50%;background:rgba(20,184,166,.10);pointer-events:none;}
.exp-hero-copy{position:relative;z-index:1;min-width:280px;}
.exp-eyebrow{display:inline-flex;border:1px solid #bdeaf0;background:#f0fdff;color:#0891b2;border-radius:999px;padding:5px 10px;font-size:11px;font-weight:950;letter-spacing:.04em;}
.exp-hero h2{margin:8px 0 4px;font-size:31px;font-weight:950;color:#0f172a;letter-spacing:-.5px;}
.exp-hero p{margin:0;color:#64748b;font-size:13px;font-weight:800;}
.exp-hero-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;}
.exp-hero-meta span,.exp-filter-active,.exp-card-head>span{display:inline-flex;align-items:center;border:1px solid #dbeafe;background:#fff;border-radius:999px;padding:7px 10px;color:#334155;font-size:11px;font-weight:950;}
.exp-hero-actions{position:relative;z-index:1;display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;max-width:680px;}
.exp-primary-btn,.exp-soft-btn,.exp-mini-btn{border:0;cursor:pointer;font-family:inherit;transition:.18s ease;font-weight:950;}
.exp-primary-btn{min-height:42px;padding:0 18px;border-radius:14px;background:linear-gradient(135deg,#d49f24,#f3cf73);color:#fff;box-shadow:0 12px 28px rgba(184,146,42,.22);}
.exp-primary-btn:hover,.exp-soft-btn:hover,.exp-mini-btn:hover,.exp-kpi:hover{transform:translateY(-1px);box-shadow:0 16px 32px rgba(15,23,42,.10);}
.exp-soft-btn{min-height:40px;padding:0 14px;border-radius:13px;background:#f8fafc;border:1px solid #dbeafe;color:#0f172a;}
.exp-filter-card{padding:15px;display:flex;flex-direction:column;gap:12px;}
.exp-filter-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;}
.exp-filter-head b{display:block;font-size:17px;font-weight:950;color:#0f172a;}
.exp-filter-head span,.exp-branch-title span{display:block;font-size:11px;color:#64748b;font-weight:850;margin-top:3px;}
.exp-filter-grid{display:grid;grid-template-columns:minmax(145px,1fr) minmax(145px,1fr) minmax(220px,1.4fr) repeat(3,minmax(150px,1fr));gap:10px;align-items:end;}
.exp-field{display:flex;flex-direction:column;gap:6px;min-width:0;}
.exp-field>span{font-size:11px;font-weight:950;color:#475569;}
.exp-field .fi,.exp-field input.fi,.exp-field select.fi,.exp-field textarea.fi{min-height:42px;border:1px solid #d9edf5;background:#fff;border-radius:14px;padding:9px 12px;font-size:12px;font-weight:850;color:#0f172a;box-shadow:none!important;}
.exp-field textarea.fi{min-height:104px;resize:vertical;}
.exp-field.big .fi{font-size:20px;font-family:var(--fm);font-weight:950;color:#dc2626;}
.exp-field.full{grid-column:1/-1;}
.exp-branch-filter{border:1px solid #e2f1f5;background:linear-gradient(180deg,#ffffff,#f8feff);border-radius:18px;padding:12px;display:grid;grid-template-columns:170px 1fr;gap:12px;align-items:center;}
.exp-branch-title b{display:block;color:#0f172a;font-weight:950;}
.exp-branch-chips{display:flex;gap:8px;flex-wrap:wrap;max-height:92px;overflow:auto;padding:2px;}
.exp-branch-chip{display:inline-flex;align-items:center;gap:7px;border:1px solid #dbeafe;background:#fff;border-radius:999px;padding:8px 11px;cursor:pointer;font-size:11px;font-weight:950;color:#334155;box-shadow:0 7px 18px rgba(15,23,42,.04);}
.exp-branch-chip input{position:absolute;opacity:0;pointer-events:none;}
.exp-branch-chip i{width:11px;height:11px;border-radius:50%;background:#12b8c6;box-shadow:0 0 0 4px rgba(18,184,198,.13);}
.exp-branch-chip[style*='--bi:2'] i{background:#e91e63}.exp-branch-chip[style*='--bi:3'] i{background:#6f42c1}.exp-branch-chip[style*='--bi:4'] i{background:#fbbf24}.exp-branch-chip[style*='--bi:5'] i{background:#22c55e}.exp-branch-chip[style*='--bi:6'] i{background:#f97316}
.exp-branch-chip:has(input:checked){background:linear-gradient(135deg,#ecfeff,#f0fdfa);border-color:#8fe3ed;color:#0f172a;box-shadow:0 12px 24px rgba(8,145,178,.10);}
.exp-filter-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;}
.exp-kpi-row{display:grid;grid-template-columns:repeat(6,minmax(150px,1fr));gap:12px;}
.exp-kpi{text-align:right;border:none;padding:16px;min-height:126px;cursor:pointer;font-family:inherit;position:relative;overflow:hidden;}
.exp-kpi:after{content:'';position:absolute;left:-42px;bottom:-48px;width:128px;height:128px;border-radius:50%;background:currentColor;opacity:.12;}
.exp-kpi span{display:grid;place-items:center;width:42px;height:42px;border-radius:15px;background:#f8fafc;font-size:22px;margin-bottom:9px;}
.exp-kpi small{display:block;color:#64748b;font-size:11px;font-weight:950;}
.exp-kpi b{display:block;color:#0f172a;font-size:21px;font-weight:950;margin-top:6px;line-height:1.2;}
.exp-kpi em{display:block;color:#64748b;font-style:normal;font-size:10px;font-weight:850;margin-top:5px;}
.exp-kpi.red{color:#ef4444}.exp-kpi.amber{color:#f59e0b}.exp-kpi.violet{color:#7c3aed}.exp-kpi.green{color:#16a34a}.exp-kpi.blue{color:#2563eb}.exp-kpi.teal{color:#0d9488}
.exp-main-grid{display:grid;grid-template-columns:320px minmax(0,1fr) 350px;gap:14px;}
.exp-card{padding:16px;min-width:0;}
.exp-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px;}
.exp-card-head h3{margin:0;color:#0f172a;font-size:16px;font-weight:950;}
.exp-card-head p{margin:4px 0 0;color:#64748b;font-size:12px;font-weight:800;}
.exp-problem-list{display:flex;flex-direction:column;gap:8px;}
.exp-problem{width:100%;display:grid;grid-template-columns:28px 1fr;gap:8px;text-align:right;border:1px solid #e2e8f0;background:#f8fafc;border-radius:15px;padding:10px;font-family:inherit;cursor:pointer;}
.exp-problem span{grid-row:span 2}.exp-problem b{font-size:12px;color:#0f172a}.exp-problem small{grid-column:2;color:#64748b;font-size:10px}.exp-problem.warn{background:#fffbeb;border-color:#fed7aa}.exp-problem.info{background:#ecfeff;border-color:#bae6fd}
.exp-bars{display:flex;flex-direction:column;gap:9px}.exp-bar-row{display:grid;grid-template-columns:120px 1fr 90px;gap:9px;align-items:center}.exp-bar-row span{font-size:12px;font-weight:900;color:#0f172a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.exp-bar-row div{height:12px;border-radius:999px;background:#edf5f8;overflow:hidden}.exp-bar-row i{display:block;height:100%;border-radius:999px}.exp-bar-row b{font-size:11px;color:#334155;font-weight:950;text-align:left;}
.exp-table-card{overflow:hidden;}
.exp-table-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 17px;border-bottom:1px solid #e2edf2;background:#fff;}
.exp-table-head h3{margin:0;font-size:17px;font-weight:950;color:#0f172a}.exp-table-head p{margin:4px 0 0;color:#64748b;font-size:11px;font-weight:850}.exp-table-actions{display:flex;gap:7px;flex-wrap:wrap}.exp-table-wrap{overflow:auto;max-height:520px;}
.exp-table{width:100%;min-width:1180px;border-collapse:separate;border-spacing:0;font-size:12px;}
.exp-table th{position:sticky;top:0;z-index:2;background:linear-gradient(180deg,#307D7E,#3B9C9C);color:#fff;text-align:right;padding:12px 11px;font-weight:950;border-inline-start:1px solid rgba(255,255,255,.18);}
.exp-table td{background:#fff;border-bottom:1px solid #e8f0f2;padding:11px;vertical-align:middle;font-weight:850;color:#0f172a;}
.exp-table tbody tr:nth-child(even) td{background:#eefbfb}.exp-table tbody tr:hover td{background:#dff7f7!important}.exp-table small{display:block;color:#64748b;font-size:10px;margin-top:3px}.exp-money{font-family:var(--fm);font-weight:950;color:#dc2626;white-space:nowrap}.exp-cat-pill,.exp-type-pill{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;font-size:10px;font-weight:950;white-space:nowrap}.exp-cat-pill{background:color-mix(in srgb,var(--cat) 14%,white);color:var(--cat);border:1px solid color-mix(in srgb,var(--cat) 30%,white)}.exp-type-pill{background:#f1f5f9;color:#475569;border:1px solid #e2e8f0}.exp-row-actions{display:flex;gap:5px;flex-wrap:wrap}.exp-mini-btn{min-height:30px;padding:0 9px;border-radius:10px;background:#f8fafc;border:1px solid #dbeafe;color:#0f172a;font-size:10px}.exp-mini-btn.gold{background:#fffbeb;border-color:#fde68a;color:#b45309}.exp-mini-btn.red{background:#fff1f2;border-color:#fecdd3;color:#be123c}.exp-reject-note{color:#be123c!important}.exp-empty-box{padding:22px;text-align:center;color:#64748b;background:#f8fafc;border:1px dashed #cbd5e1;border-radius:16px;font-weight:850}.exp-save-status{margin-top:10px;padding:10px 12px;border-radius:14px;font-size:12px;font-weight:950;border:1px solid #e2e8f0;background:#f8fafc;color:#334155}.exp-save-status.ok{background:#ecfdf5;color:#047857;border-color:#bbf7d0}.exp-save-status.warn{background:#fffbeb;color:#b45309;border-color:#fed7aa}.exp-save-status.error{background:#fff1f2;color:#be123c;border-color:#fecdd3}
.exp-modal-bg{z-index:12000}.exp-add-modal{width:min(1060px,96vw)!important;max-width:none!important;max-height:92vh!important;overflow:hidden!important;padding:0!important;border-radius:26px!important;background:#fff!important;border:1px solid #d4ecef!important;box-shadow:0 32px 100px rgba(15,23,42,.30)!important;display:flex!important;flex-direction:column!important}.exp-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:22px 24px;background:linear-gradient(135deg,#ecfeff,#fff);border-bottom:1px solid #e2edf2}.exp-modal-head span{display:inline-flex;border:1px solid #bdeaf0;background:#fff;color:#0891b2;border-radius:999px;padding:5px 10px;font-size:11px;font-weight:950}.exp-modal-head h3{margin:7px 0 3px;font-size:24px;font-weight:950}.exp-modal-head p{margin:0;color:#64748b;font-weight:850}.exp-modal-close{width:38px;height:38px;border:0;border-radius:13px;background:#f1f5f9;font-size:24px;cursor:pointer}.exp-modal-body{padding:18px 22px;overflow:auto}.exp-modal-foot{display:flex;justify-content:flex-end;gap:8px;padding:14px 22px;border-top:1px solid #e2edf2;background:#fff;flex-shrink:0}.exp-form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.exp-form-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))}.exp-approval-note{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding:12px 14px;border-radius:16px;background:#fffbeb;border:1px solid #fde68a;color:#92400e}.exp-approval-note b{font-weight:950}.exp-approval-note span{font-size:12px;font-weight:850}.exp-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.exp-settings-actions{display:flex;justify-content:flex-end;gap:8px;padding:14px;background:#fff;border:1px solid #e2edf2;border-radius:20px}.exp-switch{display:flex!important;align-items:center;gap:8px;padding:12px;border-radius:14px;background:#f8fafc;border:1px solid #e2e8f0;font-weight:950;color:#334155}.exp-switch input{accent-color:#0891b2;width:18px;height:18px}.exp-smart-card,.exp-alert{display:none!important}
@media(max-width:1300px){.exp-kpi-row{grid-template-columns:repeat(3,1fr)}.exp-main-grid{grid-template-columns:1fr}.exp-filter-grid{grid-template-columns:repeat(3,1fr)}.exp-settings-grid{grid-template-columns:1fr}}
@media(max-width:760px){#page-expenses{padding:10px!important}.exp-hero{flex-direction:column}.exp-hero-actions{width:100%;justify-content:flex-start}.exp-primary-btn,.exp-soft-btn{flex:1}.exp-filter-grid,.exp-form-grid,.exp-form-grid.compact{grid-template-columns:1fr}.exp-kpi-row{grid-template-columns:1fr}.exp-branch-filter{grid-template-columns:1fr}.exp-table{min-width:980px}.exp-modal-head{padding:18px}.exp-modal-body{padding:14px}.exp-modal-foot{padding:12px}}

/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE expenses_cockpit_filters_details_fix_20260531
   Expenses cockpit corrective pass: real branch options, detail modals,
   approval PIN button, deleted-log modal, and clickable KPI/cards.
═══════════════════════════════════════════════════════════════ */
.exp-detail-modal{width:min(1120px,96vw)!important;max-width:none!important;max-height:92vh!important;overflow:hidden!important;padding:0!important;border-radius:26px!important;background:#fff!important;border:1px solid #d4ecef!important;box-shadow:0 32px 100px rgba(15,23,42,.30)!important;display:flex!important;flex-direction:column!important}.exp-detail-modal .exp-modal-body{max-height:calc(92vh - 156px);overflow:auto}.exp-branch-chips{min-height:42px}.exp-branch-chip span{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.exp-bar-row{width:100%;display:grid;grid-template-columns:minmax(120px,1fr) 2fr auto;gap:10px;align-items:center;border:0;background:transparent;border-radius:12px;padding:8px;text-align:right;font-family:inherit;cursor:pointer}.exp-bar-row:hover{background:#f0fdff;box-shadow:0 8px 18px rgba(15,23,42,.05)}.exp-bar-row span{font-weight:950;color:#0f172a;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.exp-bar-row div{height:9px;border-radius:999px;background:#e2edf2;overflow:hidden}.exp-bar-row i{display:block;height:100%;border-radius:999px}.exp-bar-row b{font-size:11px;color:#0f172a;font-weight:950;white-space:nowrap}.exp-approval-note>div{display:flex;flex-direction:column;gap:3px}.exp-problem{font-family:inherit}.exp-table tbody tr{cursor:default}.exp-filter-active{max-width:360px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.exp-mini-btn.gold{background:linear-gradient(135deg,#d6a321,#f0cb55)!important;color:#fff!important;border-color:#d6a321!important}
@media(max-width:760px){.exp-detail-modal{width:96vw!important}.exp-detail-modal .exp-modal-body{max-height:calc(92vh - 142px)}.exp-filter-active{max-width:100%}.exp-bar-row{grid-template-columns:1fr}.exp-branch-chip span{max-width:120px}}

/* COSTIX_LAST_UPDATE profit_planning_profit_drivers_lab_mission_20260602 */
.pp-section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px;flex-wrap:wrap}.pp-section-head span{display:block;font-size:11px;letter-spacing:.14em;color:rgba(255,255,255,.72);font-weight:900}.pp-section-head h3{margin:4px 0 6px;font-size:24px}.pp-section-head p{margin:0;color:rgba(255,255,255,.72);max-width:760px}.pp-driver-kpis{margin-bottom:14px}.pp-driver-grid{display:grid;grid-template-columns:1fr;gap:16px}.pp-driver-box{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:22px;padding:14px;box-shadow:0 18px 40px rgba(0,0,0,.12)}.pp-driver-box h4{margin:0 0 10px;font-size:17px}.pp-driver-box .t tbody tr{cursor:pointer}.pp-driver-box .t tbody tr:hover{background:rgba(255,255,255,.12)}.pp-lab-preview,.pp-lab-result{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr));gap:12px;margin:14px 0}.pp-lab-preview>div,.pp-lab-result>div,.pp-mission-result{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:14px}.pp-lab-preview small,.pp-lab-result small{display:block;color:rgba(255,255,255,.68);font-weight:800}.pp-lab-preview b,.pp-lab-result b{display:block;font-size:20px;margin-top:4px}.pp-lab-modal{display:grid;gap:14px}.pp-lab-form{display:grid;grid-template-columns:repeat(3,minmax(160px,1fr));gap:12px}.pp-lab-form label span{display:block;margin-bottom:6px;color:rgba(255,255,255,.72);font-size:12px;font-weight:900}.pp-lab-items{max-height:360px;overflow:auto}.pp-lab-items input.fi{min-width:120px}.pp-lab-actions{display:flex;justify-content:flex-end}.pp-mission-mini{background:rgba(240,203,85,.09);border:1px solid rgba(240,203,85,.22);border-radius:22px;padding:16px}.pp-mission-mini h4{margin:0 0 12px}.pp-mission-result{display:grid;gap:6px;margin-top:12px}.pp-mission-result b{font-size:22px;color:#f0cb55}.pp-mission-result span,.pp-mission-result small{color:rgba(255,255,255,.78)}.pp-detail-modal .pp-lab-modal .t th,.pp-detail-modal .pp-lab-modal .t td{white-space:normal}@media(max-width:900px){.pp-lab-preview,.pp-lab-result{grid-template-columns:1fr 1fr}.pp-lab-form{grid-template-columns:1fr}.pp-section-head{display:block}}

/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE profit_planning_profit_ui_rebuild_drivers_lab_20260602
   Profit Planning UI Rebuild — restores the missing visual owner for:
   Diagnosis, Break-even Mission, Target Feasibility, Profit Drivers, and Profit Lab.
   Scoped only to #page-profit_plan and #ppDetailModal. No sync/storage/cache changes.
═══════════════════════════════════════════════════════════════ */
#page-profit_plan{
  --pp-bg:#f4fbfb;--pp-card:#ffffff;--pp-line:#d7edf0;--pp-ink:#0f2f3c;--pp-muted:#64748b;
  --pp-teal:#20aaa8;--pp-teal2:#0f8f91;--pp-gold:#d9aa36;--pp-gold2:#b87b00;
  --pp-red:#be123c;--pp-green:#15803d;--pp-amber:#b45309;--pp-blue:#0369a1;
  direction:rtl;background:radial-gradient(circle at 8% 0%,rgba(217,170,54,.13),transparent 34%),linear-gradient(180deg,#f8ffff 0%,#eefafa 50%,#f8ffff 100%);
  min-height:calc(100vh - 105px);padding:18px;border-radius:24px;box-sizing:border-box;color:#0f172a;overflow:visible;
}
#page-profit_plan *{box-sizing:border-box;}
#page-profit_plan .pp-shell{display:flex;flex-direction:column;gap:16px;width:100%;max-width:100%;}
#page-profit_plan .pp-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:22px 24px;border:1px solid rgba(32,170,168,.20);border-radius:28px;background:linear-gradient(135deg,#ffffff 0%,#eefdfd 58%,#fff7df 100%);box-shadow:0 18px 44px rgba(29,91,92,.11);}
#page-profit_plan .pp-kicker{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(217,170,54,.28);background:#fff9e8;color:#9a6500;border-radius:999px;padding:5px 11px;font-size:10px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;}
#page-profit_plan .pp-hero h2{margin:8px 0 5px;font-size:30px;font-weight:1000;color:var(--pp-ink);letter-spacing:-.5px;line-height:1.15;}
#page-profit_plan .pp-hero p{margin:0;color:#58717a;font-size:13px;font-weight:850;max-width:860px;line-height:1.7;}
#page-profit_plan .pp-actions{display:flex;gap:9px;flex-wrap:wrap;align-items:center;}
#page-profit_plan .pp-filter-panel{display:grid;grid-template-columns:repeat(3,minmax(170px,1fr)) auto;gap:12px;align-items:end;padding:15px;border:1px solid var(--pp-line);border-radius:24px;background:rgba(255,255,255,.96);box-shadow:0 14px 34px rgba(29,91,92,.08);}
#page-profit_plan .pp-filter-panel label,#page-profit_plan .pp-branch-filter,#page-profit_plan .pp-target,#page-profit_plan .pp-target-grid label,#page-profit_plan .pp-lab-form label{display:grid;gap:7px;margin:0;min-width:0;}
#page-profit_plan .pp-filter-panel span,#page-profit_plan .pp-branch-filter span,#page-profit_plan .pp-target span,#page-profit_plan .pp-target-grid span,#page-profit_plan .pp-lab-form span{font-size:11px;font-weight:1000;color:#314b57;}
#page-profit_plan .pp-filter-panel .fi,#page-profit_plan .pp-target .fi,#page-profit_plan .pp-target-grid .fi,#page-profit_plan .pp-lab-form .fi,#page-profit_plan .pp-table-tools .fi,#ppDetailModal .fi{width:100%;min-height:42px;border:1px solid #d9edf0!important;background:#fff!important;border-radius:14px!important;padding:8px 11px!important;font-weight:900!important;color:#0f172a!important;box-shadow:none!important;}
#page-profit_plan .pp-chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-start;}
#page-profit_plan .pp-chips button{appearance:none;border:1px solid #dbeafe;background:#fff;color:#475569;border-radius:999px;padding:10px 14px;font-weight:1000;cursor:pointer;font-family:var(--f,inherit);transition:.16s ease;white-space:nowrap;}
#page-profit_plan .pp-chips button:hover{background:#fff8e1;border-color:var(--pp-gold);color:#8a5a00;transform:translateY(-1px);}
#page-profit_plan .pp-nav-tabs{display:flex;gap:9px;flex-wrap:wrap;position:sticky;top:58px;z-index:22;padding:11px 12px;border:1px solid var(--pp-line);border-radius:20px;background:rgba(255,255,255,.95);backdrop-filter:blur(10px);box-shadow:0 12px 30px rgba(29,91,92,.08);}
#page-profit_plan .pp-nav-tabs button{appearance:none;border:1px solid #dbeafe;background:#fff;color:#0f5260;border-radius:999px;padding:10px 15px;font-weight:1000;font-family:var(--f,inherit);cursor:pointer;transition:.16s ease;}
#page-profit_plan .pp-nav-tabs button.on{background:linear-gradient(135deg,#f2c94c,#d9aa36);border-color:#c78c16;color:#172033;box-shadow:0 10px 22px rgba(217,170,54,.23);}
#page-profit_plan .pp-nav-tabs button:hover{transform:translateY(-1px);border-color:var(--pp-gold);}
#page-profit_plan .pp-view{display:none!important;width:100%;}
#page-profit_plan .pp-view.on{display:block!important;animation:ppViewIn .18s ease both;}
#page-profit_plan .pp-view.pp-grid.on{display:grid!important;}
@keyframes ppViewIn{from{opacity:.2;transform:translateY(6px)}to{opacity:1;transform:none}}
#page-profit_plan .pp-grid{display:grid;gap:16px;}#page-profit_plan .pp-grid.two{grid-template-columns:1fr 1fr;align-items:start;}
#page-profit_plan .pp-panel{border:1px solid var(--pp-line);border-radius:24px;background:var(--pp-card);box-shadow:0 16px 38px rgba(29,91,92,.08);padding:18px;overflow:hidden;}
#page-profit_plan .pp-panel h3{margin:0 0 10px;color:var(--pp-ink);font-size:18px;font-weight:1000;}
#page-profit_plan .pp-panel-sub{margin:0 0 14px;color:var(--pp-muted);font-size:12px;font-weight:850;line-height:1.7;}
#page-profit_plan .pp-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:13px;}
#page-profit_plan .pp-card{appearance:none;text-align:right;position:relative;overflow:hidden;min-height:132px;border:1px solid #dceff2;border-radius:24px;background:#fff;padding:17px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:9px;box-shadow:0 13px 30px rgba(29,91,92,.08);cursor:pointer;transition:.18s ease;font-family:var(--f,inherit);}
#page-profit_plan .pp-card:hover{transform:translateY(-2px);box-shadow:0 20px 42px rgba(29,91,92,.13);border-color:#b8e3e7;}
#page-profit_plan .pp-card:after{content:'';position:absolute;inset:auto -40px -45px auto;width:140px;height:140px;border-radius:50%;background:rgba(32,170,168,.10);}
#page-profit_plan .pp-card small{font-size:12px;color:#0e7490;font-weight:1000;z-index:1;}
#page-profit_plan .pp-card b{font-size:24px;color:#0f172a;font-family:var(--fm,inherit);font-weight:1000;line-height:1.1;z-index:1;}
#page-profit_plan .pp-card em{font-style:normal;font-size:11px;color:var(--pp-muted);font-weight:900;z-index:1;}
#page-profit_plan .pp-card-ico{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#ecfeff;color:#0e7490;border:1px solid #a5f3fc;font-size:21px;z-index:1;}
#page-profit_plan .pp-card.green .pp-card-ico{background:#ecfdf3;color:#16a34a;border-color:#bbf7d0}#page-profit_plan .pp-card.red .pp-card-ico{background:#fff1f2;color:#ef4444;border-color:#fecdd3}#page-profit_plan .pp-card.amber .pp-card-ico{background:#fff7ed;color:#c2410c;border-color:#fed7aa}#page-profit_plan .pp-card.blue .pp-card-ico{background:#eff6ff;color:#2563eb;border-color:#bfdbfe}#page-profit_plan .pp-card.teal .pp-card-ico{background:#ecfeff;color:#0d8b98;border-color:#a5f3fc}
#page-profit_plan .pp-diagnosis{display:grid;grid-template-columns:minmax(280px,1.25fr) 160px minmax(240px,.9fr) minmax(260px,1.05fr);gap:14px;align-items:stretch;padding:18px;border-radius:28px;border:1px solid var(--pp-line);background:linear-gradient(135deg,#ffffff 0%,#eefdfd 55%,#fff8e3 100%);box-shadow:0 16px 38px rgba(29,91,92,.08);}
#page-profit_plan .pp-diagnosis.danger{background:linear-gradient(135deg,#fff 0%,#fff5f6 60%,#fff8e3 100%);border-color:#ffd3dc}#page-profit_plan .pp-diagnosis.watch{background:linear-gradient(135deg,#fff 0%,#fff9e8 60%,#eefdfd 100%)}
#page-profit_plan .pp-dx-main span,#page-profit_plan .pp-mission-head span,#page-profit_plan .pp-section-head span{display:block;color:#0e7490;font-size:11px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;}
#page-profit_plan .pp-dx-main h3,#page-profit_plan .pp-mission-head h3,#page-profit_plan .pp-section-head h3{margin:6px 0 8px;color:var(--pp-ink);font-size:24px;font-weight:1000;line-height:1.2;}
#page-profit_plan .pp-dx-main p,#page-profit_plan .pp-mission-head p,#page-profit_plan .pp-section-head p{margin:0;color:#58717a;font-size:13px;font-weight:850;line-height:1.7;}
#page-profit_plan .pp-dx-score{display:grid;place-items:center;text-align:center;background:#fff;border:1px solid #d9edf0;border-radius:24px;padding:14px;box-shadow:0 12px 28px rgba(29,91,92,.06);}
#page-profit_plan .pp-dx-score b{font-size:42px;color:var(--pp-teal2);font-family:var(--fm,inherit);line-height:1;}#page-profit_plan .pp-dx-score small{font-weight:1000;color:var(--pp-muted)}#page-profit_plan .pp-dx-score em{font-style:normal;color:var(--pp-gold2);font-size:12px;font-weight:1000;}
#page-profit_plan .pp-dx-reasons{display:grid;gap:8px;align-content:start;background:rgba(255,255,255,.66);border:1px solid rgba(255,255,255,.7);border-radius:20px;padding:12px;color:#334155;font-size:12px;font-weight:900;}
#page-profit_plan .pp-dx-decisions{display:grid;gap:8px;}#page-profit_plan .pp-dx-decisions h4{margin:0;color:var(--pp-ink);font-size:14px;font-weight:1000;}
#page-profit_plan .pp-dx-decisions button,#page-profit_plan .pp-mission-paths button,#page-profit_plan .pp-target-decisions button{appearance:none;text-align:right;border:1px solid #e2e8f0;background:#fff;border-radius:16px;padding:10px 12px;display:flex;gap:10px;align-items:center;cursor:pointer;font-family:var(--f,inherit);transition:.16s ease;}
#page-profit_plan .pp-dx-decisions button:hover,#page-profit_plan .pp-mission-paths button:hover,#page-profit_plan .pp-target-decisions button:hover{transform:translateY(-1px);border-color:var(--pp-gold);box-shadow:0 10px 22px rgba(184,146,42,.10);}
#page-profit_plan .pp-dx-decisions button b{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#fff7df;color:#9a6500;flex:0 0 auto;}#page-profit_plan .pp-dx-decisions button span{font-size:12px;font-weight:900;color:#334155;}
#page-profit_plan .pp-diagnosis-cards{margin-top:14px;}
#page-profit_plan .pp-mission{border:1px solid var(--pp-line);border-radius:28px;background:linear-gradient(135deg,#fff 0%,#effdfd 60%,#fff8e8 100%);box-shadow:0 16px 38px rgba(29,91,92,.08);padding:18px;}
#page-profit_plan .pp-mission.danger{border-color:#fecdd3;background:linear-gradient(135deg,#fff 0%,#fff5f6 56%,#fff8e8 100%)}#page-profit_plan .pp-mission.success{border-color:#bbf7d0;background:linear-gradient(135deg,#fff 0%,#f0fdf4 56%,#effdfd 100%)}
#page-profit_plan .pp-mission-grid{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:12px;margin:15px 0;}#page-profit_plan .pp-mission-grid>div{background:#fff;border:1px solid #e2e8f0;border-radius:20px;padding:14px;box-shadow:0 10px 24px rgba(29,91,92,.05);}#page-profit_plan .pp-mission-grid small{display:block;color:var(--pp-muted);font-size:11px;font-weight:1000;}#page-profit_plan .pp-mission-grid b{display:block;font-family:var(--fm,inherit);font-size:22px;font-weight:1000;color:var(--pp-ink);margin-top:4px;}#page-profit_plan .pp-mission-grid em{font-style:normal;color:#64748b;font-size:11px;font-weight:850;}
#page-profit_plan .pp-mission-paths{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}#page-profit_plan .pp-mission-paths button{display:grid;gap:5px;align-items:start;}#page-profit_plan .pp-mission-paths b{color:var(--pp-ink);font-size:14px;font-weight:1000;}#page-profit_plan .pp-mission-paths span{color:#64748b;font-size:12px;font-weight:850;line-height:1.6;}
#page-profit_plan .pp-target-panel,#page-profit_plan .pp-target-how{min-height:100%;}#page-profit_plan .pp-target-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0;}
#page-profit_plan .pp-target-empty{border:1px dashed #cbd5e1;border-radius:18px;background:#f8fafc;padding:16px;display:grid;gap:5px;color:#64748b;font-weight:900;}#page-profit_plan .pp-target-empty b{color:var(--pp-ink);font-size:16px;}
#page-profit_plan .pp-target-feas{display:grid;gap:12px;border:1px solid #e2e8f0;border-radius:22px;background:#f8ffff;padding:14px;}#page-profit_plan .pp-target-feas.easy{background:#f0fdf4;border-color:#bbf7d0}#page-profit_plan .pp-target-feas.medium{background:#effdfd;border-color:#bae6fd}#page-profit_plan .pp-target-feas.hard{background:#fffbeb;border-color:#fde68a}#page-profit_plan .pp-target-feas.unrealistic{background:#fff1f2;border-color:#fecdd3}
#page-profit_plan .pp-target-verdict{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}#page-profit_plan .pp-target-verdict small{font-size:11px;color:var(--pp-muted);font-weight:1000;}#page-profit_plan .pp-target-verdict b{font-size:20px;color:var(--pp-ink);font-weight:1000;}#page-profit_plan .pp-target-verdict em{font-style:normal;border-radius:999px;background:#fff;padding:6px 10px;font-weight:1000;color:var(--pp-teal2);}
#page-profit_plan .pp-target-reason{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:12px;}#page-profit_plan .pp-target-reason b{display:block;color:var(--pp-ink);font-weight:1000;}#page-profit_plan .pp-target-reason span{display:block;color:#64748b;font-size:12px;font-weight:850;margin-top:4px;}
#page-profit_plan .pp-target-metrics,#page-profit_plan .pp-target-guide{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:9px;}#page-profit_plan .pp-target-metrics>div,#page-profit_plan .pp-target-guide>div,#page-profit_plan .pp-mini-cards>div{background:#fff;border:1px solid #e2e8f0;border-radius:17px;padding:12px;display:grid;gap:4px;}#page-profit_plan .pp-target-metrics small,#page-profit_plan .pp-mini-cards small{color:#64748b;font-size:10px;font-weight:1000;}#page-profit_plan .pp-target-metrics b,#page-profit_plan .pp-mini-cards b{font-family:var(--fm,inherit);font-size:18px;color:var(--pp-ink);font-weight:1000;}#page-profit_plan .pp-target-metrics span,#page-profit_plan .pp-mini-cards span,#page-profit_plan .pp-target-guide span{color:#64748b;font-size:10px;font-weight:850;}
#page-profit_plan .pp-target-decisions{display:grid;gap:8px;}#page-profit_plan .pp-target-decisions h4{margin:0;color:var(--pp-ink);}
#page-profit_plan .pp-section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px;flex-wrap:wrap;}
#page-profit_plan .pp-driver-kpis{margin-bottom:14px;grid-template-columns:repeat(3,minmax(150px,1fr));}
#page-profit_plan .pp-driver-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
#page-profit_plan .pp-driver-box{background:#fff;border:1px solid #d9edf0;border-radius:22px;padding:14px;box-shadow:0 12px 28px rgba(29,91,92,.07);}
#page-profit_plan .pp-driver-box h4{margin:0 0 10px;color:var(--pp-ink);font-size:17px;font-weight:1000;}
#page-profit_plan .pp-table-wrap{overflow:auto;border:1px solid #e2e8f0;border-radius:18px;background:#fff;max-height:520px;}#page-profit_plan .pp-table-wrap table.t{margin:0!important;min-width:860px;width:100%;border-collapse:separate;border-spacing:0;}#page-profit_plan table.t th{background:linear-gradient(180deg,#45beb9,#31aaa5)!important;color:#fff!important;font-weight:1000!important;padding:11px!important;white-space:nowrap;}#page-profit_plan table.t td{font-weight:850!important;padding:10px!important;border-bottom:1px solid #e7f2f3!important;background:#fff;}#page-profit_plan table.t td small{display:block;margin-top:3px;color:#64748b;font-size:10px;}#page-profit_plan .pp-table-wrap tbody tr{cursor:pointer;}#page-profit_plan .pp-table-wrap tbody tr:hover td{background:#dff7f7!important;}
#page-profit_plan .pp-lab-preview,#page-profit_plan .pp-lab-result{display:grid;grid-template-columns:repeat(4,minmax(140px,1fr));gap:12px;margin:14px 0;}#page-profit_plan .pp-lab-preview>div,#page-profit_plan .pp-lab-result>div,#ppDetailModal .pp-lab-result>div{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:14px;box-shadow:0 10px 22px rgba(29,91,92,.05);}#page-profit_plan .pp-lab-preview small,#page-profit_plan .pp-lab-result small,#ppDetailModal .pp-lab-result small{display:block;color:#64748b;font-weight:1000;font-size:11px;}#page-profit_plan .pp-lab-preview b,#page-profit_plan .pp-lab-result b,#ppDetailModal .pp-lab-result b{display:block;font-size:21px;margin-top:4px;color:var(--pp-ink);font-family:var(--fm,inherit);}
#page-profit_plan .pp-scenarios{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;margin-top:12px;}#page-profit_plan .pp-scenarios button{appearance:none;text-align:right;border:1px solid #e2e8f0;background:#fff;border-radius:18px;padding:14px;display:grid;gap:6px;cursor:pointer;font-family:var(--f,inherit);transition:.16s ease;box-shadow:0 10px 22px rgba(29,91,92,.05);}#page-profit_plan .pp-scenarios button:hover{transform:translateY(-2px);border-color:var(--pp-gold);background:#fffaf0;}#page-profit_plan .pp-scenarios b{font-size:14px;font-weight:1000;color:var(--pp-ink)}#page-profit_plan .pp-scenarios small{font-size:11px;font-weight:900;color:#64748b}#page-profit_plan .pp-scenarios strong{font-family:var(--fm,inherit);font-size:17px;font-weight:1000;}
#page-profit_plan .pp-info{padding:12px 14px;border:1px solid #bae6fd;background:#f0f9ff;border-radius:17px;color:#0369a1;font-size:12px;font-weight:850;margin-bottom:10px;}
#page-profit_plan .greentxt{color:#15803d!important;}#page-profit_plan .redtxt{color:#be123c!important;}#page-profit_plan .goldtxt{color:#b45309!important;}#page-profit_plan .td-m{text-align:left;font-family:var(--fm,inherit);direction:ltr;}#page-profit_plan .empty{padding:24px;text-align:center;color:#64748b;font-weight:900;background:#f8fafc;border-radius:16px;}
#ppDetailModal{z-index:65000!important;}#ppDetailModal .modal{direction:rtl;border-radius:26px!important;border:1px solid #d9edf0!important;box-shadow:0 30px 90px rgba(15,23,42,.28)!important;background:linear-gradient(180deg,#ffffff,#f8ffff)!important;max-width:980px!important;width:min(980px,calc(100vw - 34px))!important;max-height:calc(100vh - 50px)!important;overflow:auto!important;padding:18px!important;}#ppDetailModal .modal-title{font-size:22px;font-weight:1000;color:#0f2f3c;margin:0 0 14px;}#ppDetailModal .pp-detail-modal{display:grid;gap:14px;}#ppDetailModal .pp-detail-table{border:1px solid #e2e8f0;border-radius:18px;overflow:auto;background:#fff;}#ppDetailModal .pp-detail-table table{width:100%;border-collapse:collapse;}#ppDetailModal .pp-detail-table th{width:210px;background:#effdfd;color:#0f5260;text-align:right;padding:12px;font-weight:1000;}#ppDetailModal .pp-detail-table td{padding:12px;border-bottom:1px solid #edf5f6;font-weight:900;}#ppDetailModal .pp-detail-note{padding:13px 14px;border-radius:17px;background:#fff8e8;border:1px solid #fde68a;color:#92400e;font-weight:900;line-height:1.7;}#ppDetailModal .pp-health-modal,#ppDetailModal .pp-target-modal{display:flex;align-items:center;justify-content:space-between;gap:12px;border-radius:22px;padding:16px;background:#effdfd;border:1px solid #bae6fd;}#ppDetailModal .pp-health-modal b,#ppDetailModal .pp-target-modal b{font-size:28px;color:#0f8f91;font-family:var(--fm,inherit);}#ppDetailModal .pp-lab-modal{display:grid;gap:14px;}#ppDetailModal .pp-lab-form{display:grid;grid-template-columns:repeat(3,minmax(160px,1fr));gap:12px;}#ppDetailModal .pp-lab-items{max-height:360px;overflow:auto;}#ppDetailModal .pp-lab-actions{display:flex;justify-content:flex-end;}#ppDetailModal .pp-mission-mini{background:#fff8e8;border:1px solid #fde68a;border-radius:22px;padding:16px;}#ppDetailModal .pp-mission-mini h4{margin:0 0 12px;color:#0f2f3c;}#ppDetailModal .pp-mission-result{display:grid;gap:6px;margin-top:12px;background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:14px;}#ppDetailModal .pp-mission-result b{font-size:22px;color:#b87b00;}#ppDetailModal .pp-lab-result{display:grid;grid-template-columns:repeat(4,minmax(140px,1fr));gap:12px;margin:14px 0;}
@media(max-width:1200px){#page-profit_plan .pp-diagnosis{grid-template-columns:1fr 160px}#page-profit_plan .pp-dx-decisions{grid-column:1/-1}#page-profit_plan .pp-driver-grid{grid-template-columns:1fr}#page-profit_plan .pp-grid.two{grid-template-columns:1fr}}
@media(max-width:900px){#page-profit_plan{padding:10px;border-radius:0}#page-profit_plan .pp-filter-panel{grid-template-columns:1fr 1fr}#page-profit_plan .pp-mission-grid,#page-profit_plan .pp-lab-preview,#page-profit_plan .pp-lab-result,#ppDetailModal .pp-lab-result{grid-template-columns:1fr 1fr}#page-profit_plan .pp-mission-paths,#page-profit_plan .pp-scenarios{grid-template-columns:1fr}#ppDetailModal .pp-lab-form{grid-template-columns:1fr}}
@media(max-width:620px){#page-profit_plan .pp-filter-panel,#page-profit_plan .pp-diagnosis,#page-profit_plan .pp-mission-grid,#page-profit_plan .pp-card-grid,#page-profit_plan .pp-target-grid,#page-profit_plan .pp-driver-kpis{grid-template-columns:1fr}#page-profit_plan .pp-hero h2{font-size:24px}#page-profit_plan .pp-nav-tabs{position:relative;top:auto}#ppDetailModal .pp-detail-table th{width:auto}}

/* COSTIX_LAST_UPDATE profit_lab_wizard_rebuild_20260602
   Profit Lab is now a decision wizard: only the selected scenario tools are visible. */
#ppDetailModal .pp-lab-wizard{display:grid;gap:16px;direction:rtl;color:#0f2f3c;}
#ppDetailModal .pp-lab-intro{border:1px solid #d9edf0;border-radius:22px;padding:16px 18px;background:linear-gradient(135deg,#effdfd,#fff8e8);box-shadow:0 12px 26px rgba(29,91,92,.06);}
#ppDetailModal .pp-lab-intro span{display:block;color:#0e7490;font-size:11px;font-weight:1000;letter-spacing:.1em;text-transform:uppercase;}
#ppDetailModal .pp-lab-intro h3{margin:6px 0 8px;font-size:25px;font-weight:1000;color:#0f2f3c;}
#ppDetailModal .pp-lab-intro p{margin:0;color:#58717a;font-weight:850;line-height:1.7;}
#ppDetailModal .pp-lab-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
#ppDetailModal .pp-lab-modes button{appearance:none;border:1px solid #e2e8f0;background:#fff;border-radius:18px;padding:13px;text-align:right;cursor:pointer;display:grid;gap:5px;font-family:var(--f,inherit);transition:.16s ease;box-shadow:0 8px 20px rgba(29,91,92,.04);}
#ppDetailModal .pp-lab-modes button:hover{transform:translateY(-1px);border-color:#f0cb55;box-shadow:0 14px 28px rgba(184,146,42,.12);}
#ppDetailModal .pp-lab-modes button.on{background:linear-gradient(135deg,#fff8e8,#effdfd);border-color:#f0cb55;box-shadow:0 16px 34px rgba(184,146,42,.14);}
#ppDetailModal .pp-lab-modes b{font-size:14px;font-weight:1000;color:#0f2f3c;}
#ppDetailModal .pp-lab-modes small{font-size:11px;line-height:1.55;color:#64748b;font-weight:850;}
#ppDetailModal .pp-lab-baseline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
#ppDetailModal .pp-lab-baseline>div{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:13px;box-shadow:0 8px 20px rgba(29,91,92,.04);}
#ppDetailModal .pp-lab-baseline small{display:block;color:#64748b;font-size:11px;font-weight:1000;}
#ppDetailModal .pp-lab-baseline b{display:block;margin-top:4px;color:#0f2f3c;font-size:18px;font-weight:1000;font-family:var(--fm,inherit);}
#ppDetailModal .pp-lab-step{display:none;border:1px solid #d9edf0;background:#fff;border-radius:22px;padding:16px;box-shadow:0 12px 28px rgba(29,91,92,.06);}
#ppDetailModal .pp-lab-step.on{display:grid;gap:14px;}
#ppDetailModal .pp-lab-step-head h4{margin:0 0 6px;color:#0f2f3c;font-size:20px;font-weight:1000;}
#ppDetailModal .pp-lab-step-head p{margin:0;color:#58717a;font-weight:850;line-height:1.65;}
#ppDetailModal .pp-lab-form.two{grid-template-columns:repeat(2,minmax(180px,1fr));}
#ppDetailModal .pp-lab-form.three{grid-template-columns:repeat(3,minmax(160px,1fr));}
#ppDetailModal .pp-lab-form.one{grid-template-columns:minmax(180px,360px);}
#ppDetailModal .pp-lab-result-zone:empty{display:none;}
#ppDetailModal .pp-lab-result-title{font-size:13px;font-weight:1000;color:#0e7490;margin:2px 0 8px;}
#ppDetailModal .pp-lab-items{border:1px solid #e2e8f0;border-radius:18px;background:#fff;max-height:330px;overflow:auto;}
#ppDetailModal .pp-lab-items table{margin:0;}
#ppDetailModal .pp-lab-items td small{display:block;color:#64748b;font-size:11px;margin-top:3px;}
#ppDetailModal .pp-lab-items input.fi{min-width:130px;text-align:center;}
#ppDetailModal .pp-lab-actions{display:flex;justify-content:flex-start;gap:10px;}
#ppDetailModal .pp-mission-result{background:linear-gradient(135deg,#fff8e8,#ffffff);border:1px solid #fde68a;border-radius:20px;padding:15px;display:grid;gap:7px;}
#ppDetailModal .pp-mission-result b{font-size:24px;font-weight:1000;color:#b87b00;}
#ppDetailModal .pp-mission-result span{font-weight:900;color:#0f2f3c;}
#ppDetailModal .pp-mission-result small{font-weight:850;color:#64748b;line-height:1.7;}
@media(max-width:900px){#ppDetailModal .pp-lab-modes{grid-template-columns:repeat(2,1fr)}#ppDetailModal .pp-lab-baseline,#ppDetailModal .pp-lab-form.three{grid-template-columns:1fr 1fr}#ppDetailModal .pp-lab-form.two{grid-template-columns:1fr}}
@media(max-width:620px){#ppDetailModal .pp-lab-modes,#ppDetailModal .pp-lab-baseline,#ppDetailModal .pp-lab-form.three{grid-template-columns:1fr}}


/* COSTIX_LAST_UPDATE profit_lab_tab_explained_rebuild_20260602
   Profit Lab is now an inline "What if?" tab, not a modal button.
   Fields include clear labels, examples, and decision-oriented results. */
#page-profit_plan #ppSec_scenario .pp-lab-wizard{
  display:grid;
  gap:16px;
  direction:rtl;
  color:#0f2f3c;
  background:linear-gradient(180deg,#ffffff,#f8ffff);
  border:1px solid #d9edf0;
  border-radius:26px;
  padding:18px;
  box-shadow:0 22px 52px rgba(15,47,60,.08);
}
#page-profit_plan #ppSec_scenario .pp-lab-intro{
  border:1px solid #d9edf0;
  border-radius:22px;
  padding:18px;
  background:linear-gradient(135deg,#effdfd,#ffffff);
}
#page-profit_plan #ppSec_scenario .pp-lab-intro span{
  display:block;
  color:#0f8f91;
  letter-spacing:.12em;
  font-size:11px;
  font-weight:1000;
}
#page-profit_plan #ppSec_scenario .pp-lab-intro h3{margin:5px 0 6px;font-size:24px;color:#0f2f3c;}
#page-profit_plan #ppSec_scenario .pp-lab-intro p{margin:0;color:#526b76;font-weight:850;line-height:1.7;}
#page-profit_plan #ppSec_scenario .pp-lab-modes{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
#page-profit_plan #ppSec_scenario .pp-lab-modes button{
  appearance:none;
  border:1px solid #dcecf0;
  background:#fff;
  border-radius:18px;
  padding:14px;
  min-height:78px;
  text-align:right;
  cursor:pointer;
  display:grid;
  gap:5px;
  font-family:var(--f,inherit);
  transition:.16s ease;
  box-shadow:0 10px 24px rgba(15,47,60,.04);
}
#page-profit_plan #ppSec_scenario .pp-lab-modes button:hover{transform:translateY(-1px);border-color:#f0cb55;box-shadow:0 16px 32px rgba(184,146,42,.13);}
#page-profit_plan #ppSec_scenario .pp-lab-modes button.on{background:linear-gradient(135deg,#fff8e8,#effdfd);border-color:#f0cb55;box-shadow:0 18px 38px rgba(184,146,42,.16);}
#page-profit_plan #ppSec_scenario .pp-lab-modes b{font-size:15px;font-weight:1000;color:#0f2f3c;}
#page-profit_plan #ppSec_scenario .pp-lab-modes small{font-size:12px;line-height:1.55;color:#64748b;font-weight:850;}
#page-profit_plan #ppSec_scenario .pp-lab-baseline{
  display:grid;
  grid-template-columns:repeat(4,minmax(130px,1fr));
  gap:12px;
}
#page-profit_plan #ppSec_scenario .pp-lab-baseline>div{
  background:#fff;
  border:1px solid #dcecf0;
  border-radius:18px;
  padding:14px;
}
#page-profit_plan #ppSec_scenario .pp-lab-baseline small{display:block;color:#64748b;font-weight:900;font-size:12px;}
#page-profit_plan #ppSec_scenario .pp-lab-baseline b{display:block;margin-top:5px;font-size:19px;color:#0f2f3c;font-family:var(--fm,inherit);}
#page-profit_plan #ppSec_scenario .pp-lab-step{display:none;border:1px solid #d9edf0;border-radius:22px;padding:17px;background:#fbffff;}
#page-profit_plan #ppSec_scenario .pp-lab-step.on{display:grid;gap:14px;}
#page-profit_plan #ppSec_scenario .pp-lab-step-head h4{margin:0 0 6px;font-size:20px;color:#0f2f3c;}
#page-profit_plan #ppSec_scenario .pp-lab-step-head p{margin:0;color:#526b76;font-weight:850;line-height:1.7;}
#page-profit_plan #ppSec_scenario .pp-lab-form{display:grid;gap:12px;}
#page-profit_plan #ppSec_scenario .pp-lab-form.two{grid-template-columns:repeat(2,minmax(180px,1fr));}
#page-profit_plan #ppSec_scenario .pp-lab-form.three{grid-template-columns:repeat(3,minmax(160px,1fr));}
#page-profit_plan #ppSec_scenario .pp-lab-form.one{grid-template-columns:minmax(180px,420px);}
#page-profit_plan #ppSec_scenario .pp-lab-form label{
  background:#fff;
  border:1px solid #dcecf0;
  border-radius:18px;
  padding:12px;
  display:grid;
  gap:7px;
}
#page-profit_plan #ppSec_scenario .pp-lab-form label span{font-size:12px;font-weight:1000;color:#0f5260;}
#page-profit_plan #ppSec_scenario .pp-lab-form label small{font-size:11px;color:#64748b;font-weight:800;line-height:1.55;}
#page-profit_plan #ppSec_scenario .pp-lab-form .fi,
#page-profit_plan #ppSec_scenario .ppLabItemValue{
  width:100%;
  min-height:42px;
  border:1px solid #d9edf0!important;
  background:#fff!important;
  border-radius:14px!important;
  padding:8px 11px!important;
  font-weight:900!important;
  color:#0f172a!important;
  box-shadow:none!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-actions{display:flex;justify-content:flex-end;gap:10px;}
#page-profit_plan #ppSec_scenario .pp-lab-result-zone{min-height:0;}
#page-profit_plan #ppSec_scenario .pp-lab-result-title{font-weight:1000;color:#0f5260;margin:4px 0 8px;}
#page-profit_plan #ppSec_scenario .pp-lab-result{
  display:grid;
  grid-template-columns:repeat(4,minmax(130px,1fr));
  gap:12px;
  margin:10px 0 0;
}
#page-profit_plan #ppSec_scenario .pp-lab-result>div,
#page-profit_plan #ppSec_scenario .pp-mission-result{
  background:#fff;
  border:1px solid #dcecf0;
  border-radius:18px;
  padding:14px;
}
#page-profit_plan #ppSec_scenario .pp-lab-result small{display:block;color:#64748b;font-weight:900;font-size:12px;}
#page-profit_plan #ppSec_scenario .pp-lab-result b{display:block;margin-top:5px;font-size:18px;color:#0f2f3c;}
#page-profit_plan #ppSec_scenario .pp-mission-result{display:grid;gap:7px;background:#fff8e8;border-color:#fde68a;}
#page-profit_plan #ppSec_scenario .pp-mission-result b{font-size:22px;color:#b87b00;}
#page-profit_plan #ppSec_scenario .pp-mission-result span{font-weight:900;color:#0f2f3c;}
#page-profit_plan #ppSec_scenario .pp-mission-result small{color:#526b76;font-weight:850;line-height:1.7;}
#page-profit_plan #ppSec_scenario .pp-lab-items{max-height:430px;overflow:auto;background:#fff;border:1px solid #dcecf0;border-radius:18px;}
#page-profit_plan #ppSec_scenario .pp-lab-items .t{width:100%;border-collapse:collapse;}
#page-profit_plan #ppSec_scenario .pp-lab-items .t th{background:#effdfd;color:#0f5260;font-weight:1000;padding:11px;text-align:right;position:sticky;top:0;z-index:1;}
#page-profit_plan #ppSec_scenario .pp-lab-items .t td{padding:11px;border-bottom:1px solid #edf5f6;color:#0f2f3c;}
#page-profit_plan #ppSec_scenario .pp-lab-items .t td small{display:block;color:#64748b;margin-top:3px;font-weight:800;}
@media(max-width:980px){
  #page-profit_plan #ppSec_scenario .pp-lab-modes{grid-template-columns:repeat(2,minmax(0,1fr));}
  #page-profit_plan #ppSec_scenario .pp-lab-baseline,
  #page-profit_plan #ppSec_scenario .pp-lab-result{grid-template-columns:repeat(2,minmax(0,1fr));}
  #page-profit_plan #ppSec_scenario .pp-lab-form.three{grid-template-columns:1fr 1fr;}
}
@media(max-width:640px){
  #page-profit_plan #ppSec_scenario .pp-lab-modes,
  #page-profit_plan #ppSec_scenario .pp-lab-baseline,
  #page-profit_plan #ppSec_scenario .pp-lab-result,
  #page-profit_plan #ppSec_scenario .pp-lab-form.two,
  #page-profit_plan #ppSec_scenario .pp-lab-form.three,
  #page-profit_plan #ppSec_scenario .pp-lab-form.one{grid-template-columns:1fr;}
}

/* COSTIX_LAST_UPDATE profit_lab_inline_table_combined_fix_20260602
   Profit Planning What If tab: static tabs, clearer unit-price/unit-cost tables, and combined scenario card. */
#page-profit_plan .pp-nav-tabs{
  position:relative!important;
  top:auto!important;
  z-index:auto!important;
  backdrop-filter:none!important;
}
#page-profit_plan .pp-nav-tabs button:hover{
  transform:none!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-modes button:hover{
  transform:none!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-items{
  max-height:520px!important;
  overflow:auto!important;
  border-radius:20px!important;
  border:1px solid #d7edf0!important;
  background:#ffffff!important;
  box-shadow:0 14px 34px rgba(29,91,92,.06)!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-table{
  width:100%!important;
  min-width:1080px!important;
  table-layout:fixed!important;
  border-collapse:separate!important;
  border-spacing:0!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-table th{
  background:linear-gradient(180deg,#3fc0bb,#2da8a3)!important;
  color:#fff!important;
  font-weight:1000!important;
  text-align:right!important;
  padding:12px 10px!important;
  white-space:normal!important;
  position:sticky!important;
  top:0!important;
  z-index:2!important;
  border-bottom:1px solid rgba(255,255,255,.22)!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-table td{
  background:#fff!important;
  color:#0f2f3c!important;
  border-bottom:1px solid #e7f2f3!important;
  padding:11px 10px!important;
  font-weight:900!important;
  vertical-align:middle!important;
  overflow-wrap:anywhere!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-table tbody tr:nth-child(even) td{
  background:#f8ffff!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-table tbody tr:hover td{
  background:#ecfeff!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-table th:first-child,
#page-profit_plan #ppSec_scenario .pp-lab-table td:first-child{
  width:230px!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-item-name b{
  display:block!important;
  font-size:13px!important;
  color:#0f2f3c!important;
  line-height:1.45!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-item-name small,
#page-profit_plan #ppSec_scenario .pp-lab-table td small{
  display:block!important;
  margin-top:4px!important;
  color:#64748b!important;
  font-size:10.5px!important;
  font-weight:850!important;
  line-height:1.45!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-table .fi{
  min-width:120px!important;
  height:40px!important;
  text-align:center!important;
  font-weight:1000!important;
  border-radius:13px!important;
  border:1px solid #d7edf0!important;
  background:#fff!important;
}
#page-profit_plan #ppSec_scenario .ppLabExpected,
#page-profit_plan #ppSec_scenario .ppLabDelta{
  color:#0f5260!important;
  font-weight:1000!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-step[data-step="combined"]{
  background:linear-gradient(135deg,#f8ffff,#fff8e8)!important;
  border-color:#fde68a!important;
}
#page-profit_plan #ppSec_scenario .pp-lab-step[data-step="combined"] .pp-lab-step-head h4{
  color:#92400e!important;
}

/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE: smart_center_filters_details_ui_20260602
   Smart Center Executive AI scoped UI — no inline injected CSS.
   ═══════════════════════════════════════════════════════════════ */
#page-smart_center{background:#eef4f6;min-height:calc(100vh - 80px);overflow:auto;}
#page-smart_center .scx-shell{direction:rtl;padding:22px 28px;width:100%;max-width:none;margin:0;color:#0f172a;box-sizing:border-box;}
#page-smart_center .scx-hero{border:1px solid rgba(255,255,255,.28);background:linear-gradient(135deg,#183044 0%,#307D7E 52%,#c6a235 100%);border-radius:28px;padding:24px;color:#fff;box-shadow:0 22px 55px rgba(15,23,42,.20);display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:16px;}
#page-smart_center .scx-title{font-size:29px;font-weight:1000;letter-spacing:-.7px;text-shadow:0 2px 12px rgba(0,0,0,.18)}
#page-smart_center .scx-sub{font-size:13px;opacity:.94;margin-top:7px;line-height:1.9;max-width:980px}
#page-smart_center .scx-stamp{font-size:11px;opacity:.86;margin-top:10px}
#page-smart_center .scx-score{min-width:190px;text-align:center;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);border-radius:24px;padding:15px;color:#fff;cursor:pointer;transition:.18s transform,.18s box-shadow;}
#page-smart_center .scx-score:hover{transform:translateY(-2px);box-shadow:0 18px 34px rgba(0,0,0,.18)}
#page-smart_center .scx-score b{display:block;font-size:42px;line-height:1;font-family:Consolas,monospace}
#page-smart_center .scx-score span{font-size:12px;font-weight:1000}
#page-smart_center .scx-score div{font-size:11px;opacity:.9;margin-top:8px;line-height:1.7}
#page-smart_center .scx-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 16px;justify-content:flex-end;}
#page-smart_center .scx-tab{border:1px solid rgba(15,23,42,.08);background:#fff;color:#0f172a;border-radius:16px;padding:11px 16px;font-weight:1000;cursor:pointer;box-shadow:0 8px 20px rgba(15,23,42,.07);transition:.18s transform,.18s box-shadow,.18s background;}
#page-smart_center .scx-tab:hover{transform:translateY(-1px);box-shadow:0 13px 26px rgba(15,23,42,.11)}
#page-smart_center .scx-tab.on{background:linear-gradient(135deg,#b8922a,#f3d778);color:#111827;border-color:transparent;box-shadow:0 14px 32px rgba(184,146,42,.28)}
#page-smart_center .scx-filters{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-start;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:22px;padding:12px;margin-bottom:16px;box-shadow:0 12px 28px rgba(15,23,42,.07);position:relative;z-index:4;}
#page-smart_center .scx-filters.active{outline:2px solid rgba(184,146,42,.35);box-shadow:0 14px 32px rgba(184,146,42,.14)}
#page-smart_center .scx-filters label{display:flex;flex-direction:column;gap:5px;font-size:11px;font-weight:1000;color:#334155;}
#page-smart_center .scx-filters input{border:1px solid rgba(15,23,42,.12);border-radius:13px;padding:10px;background:#f8fafc;color:#111827;font-weight:800;min-height:42px;}
#page-smart_center .scx-branch-filter{position:relative;min-width:310px;}
#page-smart_center .scx-branch-filter.active .scx-branch-trigger{border-color:#b8922a;background:#fffbeb;box-shadow:0 0 0 3px rgba(184,146,42,.13)}
#page-smart_center .scx-branch-trigger{width:100%;min-height:54px;border:1px solid rgba(15,23,42,.12);border-radius:16px;background:#f8fafc;color:#0f172a;text-align:right;padding:8px 13px;cursor:pointer;display:grid;grid-template-columns:1fr auto;gap:4px;align-items:center;}
#page-smart_center .scx-branch-trigger span{font-size:10px;font-weight:1000;color:#64748b;grid-column:1/-1}
#page-smart_center .scx-branch-trigger b{font-size:14px;font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#page-smart_center .scx-branch-trigger i{font-style:normal;font-size:10px;border-radius:999px;padding:4px 8px;background:#e0f2fe;color:#075985;font-weight:1000;}
#page-smart_center .scx-branch-filter.active .scx-branch-trigger i{background:#fef3c7;color:#92400e;}
#page-smart_center .scx-branch-picker{display:none;position:absolute;right:0;top:60px;width:370px;max-height:390px;overflow:auto;background:#fff;border:1px solid rgba(15,23,42,.12);border-radius:18px;box-shadow:0 26px 60px rgba(15,23,42,.20);padding:10px;z-index:30;}
#page-smart_center .scx-branch-picker.open{display:block;}
#page-smart_center .scx-branch-tools{display:flex;gap:8px;margin-bottom:8px;position:sticky;top:0;background:#fff;z-index:2;padding-bottom:8px;}
#page-smart_center .scx-branch-tools button,#page-smart_center .scx-mini-btn{border:0;border-radius:12px;padding:8px 11px;font-weight:1000;background:#e0f2fe;color:#075985;cursor:pointer;}
#page-smart_center .scx-branch-picker label{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #e2e8f0;border-radius:14px;margin-bottom:7px;background:#f8fafc;cursor:pointer;}
#page-smart_center .scx-branch-picker label.on{background:#ecfdf5;border-color:#10b981;box-shadow:0 0 0 2px rgba(16,185,129,.10)}
#page-smart_center .scx-branch-picker input{min-height:auto;accent-color:#0f766e;}
#page-smart_center .scx-branch-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px;}
#page-smart_center .scx-branch-chips span{font-size:10px;font-weight:1000;background:#dcfce7;color:#166534;border:1px solid #bbf7d0;border-radius:999px;padding:4px 8px;}
#page-smart_center .scx-actions{display:flex;gap:8px;flex-wrap:wrap;align-self:flex-end;padding-top:16px;}
#page-smart_center .scx-btn{border:0;border-radius:14px;padding:10px 14px;font-weight:1000;cursor:pointer;min-height:42px;}
#page-smart_center .scx-btn.gold{background:linear-gradient(135deg,#b8922a,#f3d778);color:#111827;box-shadow:0 10px 20px rgba(184,146,42,.2)}
#page-smart_center .scx-btn.ghost{background:#f8fafc;border:1px solid rgba(15,23,42,.10);color:#0f172a;}
#page-smart_center .scx-kpis{display:grid;grid-template-columns:repeat(6,minmax(145px,1fr));gap:12px;margin-bottom:16px;}
#page-smart_center .scx-kpi{border:1px solid transparent;border-radius:20px;padding:15px;text-align:right;cursor:pointer;color:#0f172a;box-shadow:0 14px 30px rgba(15,23,42,.08);transition:.18s transform,.18s box-shadow;position:relative;overflow:hidden;}
#page-smart_center .scx-kpi:hover{transform:translateY(-3px);box-shadow:0 20px 42px rgba(15,23,42,.14)}
#page-smart_center .scx-kpi small{display:block;font-size:10px;font-weight:1000;opacity:.74}
#page-smart_center .scx-kpi b{display:block;font-size:22px;margin-top:5px;font-family:Consolas,monospace;position:relative;z-index:1}
#page-smart_center .scx-kpi span{display:inline-block;margin-top:8px;font-size:10px;font-weight:1000;border-radius:999px;padding:4px 8px;background:rgba(255,255,255,.55)}
#page-smart_center .scx-kpi.sales{background:linear-gradient(135deg,#ecfeff,#a7f3d0);border-color:#99f6e4}
#page-smart_center .scx-kpi.profit{background:linear-gradient(135deg,#f0fdf4,#bbf7d0);border-color:#86efac}
#page-smart_center .scx-kpi.margin{background:linear-gradient(135deg,#eff6ff,#bfdbfe);border-color:#93c5fd}
#page-smart_center .scx-kpi.food{background:linear-gradient(135deg,#fff7ed,#fed7aa);border-color:#fdba74}
#page-smart_center .scx-kpi.orders{background:linear-gradient(135deg,#f5f3ff,#ddd6fe);border-color:#c4b5fd}
#page-smart_center .scx-kpi.lost{background:linear-gradient(135deg,#fef2f2,#fecaca);border-color:#fca5a5}
#page-smart_center .scx-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:16px;}
#page-smart_center .scx-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
#page-smart_center .scx-panel{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:24px;box-shadow:0 14px 34px rgba(15,23,42,.08);overflow:hidden;}
#page-smart_center .scx-head{padding:15px 17px;border-bottom:1px solid rgba(15,23,42,.07);display:flex;justify-content:space-between;gap:10px;align-items:center;background:linear-gradient(180deg,#fff,#f8fafc);}
#page-smart_center .scx-head b{font-size:15px;font-weight:1000;}
#page-smart_center .scx-body{padding:15px 17px;}
#page-smart_center .scx-card{width:100%;text-align:right;border:1px solid rgba(15,23,42,.09);border-radius:18px;padding:13px;margin-bottom:10px;display:flex;gap:11px;align-items:flex-start;cursor:pointer;transition:.18s transform,.18s box-shadow;border-right-width:6px;position:relative;}
#page-smart_center .scx-card:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(15,23,42,.12)}
#page-smart_center .scx-card .ic{font-size:23px;width:30px;text-align:center;}
#page-smart_center .scx-card .txt{flex:1;}
#page-smart_center .scx-card .t{font-weight:1000;font-size:13px;color:#0f172a;}
#page-smart_center .scx-card .d{font-size:12px;line-height:1.75;color:#334155;margin-top:3px;}
#page-smart_center .scx-card .m{font-size:11px;font-weight:1000;margin-top:7px;color:#64748b;}
#page-smart_center .scx-card .open{font-size:10px;font-weight:1000;border-radius:999px;padding:4px 8px;background:rgba(255,255,255,.65);align-self:center;color:#334155;}
#page-smart_center .scx-card.danger{background:#fef2f2;border-color:#fecaca;border-right-color:#ef4444;}
#page-smart_center .scx-card.warning{background:#fffbeb;border-color:#fde68a;border-right-color:#f59e0b;}
#page-smart_center .scx-card.success{background:#ecfdf5;border-color:#bbf7d0;border-right-color:#10b981;}
#page-smart_center .scx-card.info{background:#eff6ff;border-color:#bfdbfe;border-right-color:#3b82f6;}
#page-smart_center .scx-pill{border-radius:999px;padding:5px 10px;font-size:10px;font-weight:1000;background:#f8fafc;border:1px solid #e2e8f0;white-space:nowrap;}
#page-smart_center .scx-pill.danger{background:#fee2e2;color:#991b1b;border-color:#fecaca;}
#page-smart_center .scx-pill.warning{background:#fef3c7;color:#92400e;border-color:#fde68a;}
#page-smart_center .scx-pill.success{background:#dcfce7;color:#166534;border-color:#bbf7d0;}
#page-smart_center .scx-pill.info{background:#dbeafe;color:#1e40af;border-color:#bfdbfe;}
#page-smart_center .scx-table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border-radius:16px;background:#fff;border:1px solid rgba(15,23,42,.08);}
#page-smart_center .scx-table th,#page-smart_center .scx-table td{padding:11px 9px;border-bottom:1px solid rgba(15,23,42,.08);text-align:center;font-size:12px;}
#page-smart_center .scx-table th{background:#0f172a;color:#fff;font-weight:1000;}
#page-smart_center .scx-table td:first-child,#page-smart_center .scx-table th:first-child{text-align:right;}
#page-smart_center .scx-table tr:last-child td{border-bottom:0;}
#page-smart_center .scx-table .good{color:#166534;font-weight:1000}.scx-table .bad{color:#991b1b;font-weight:1000}
#page-smart_center .scx-empty{padding:30px;text-align:center;color:#64748b;font-weight:1000;background:#f8fafc;border-radius:18px;border:1px dashed #cbd5e1;}
#page-smart_center .scx-empty.mini{padding:12px;font-size:12px;}
#page-smart_center .scx-note{font-size:11px;color:#64748b;line-height:1.7;}
#page-smart_center .scx-bar{height:9px;background:#e2e8f0;border-radius:999px;overflow:hidden;margin-top:8px;}
#page-smart_center .scx-bar i{display:block;height:100%;background:linear-gradient(90deg,#14b8a6,#b8922a);border-radius:999px;}
/* COSTIX_LAST_UPDATE smart_center_fast_details_modal_20260602 */
/* COSTIX_LAST_UPDATE smart_center_modal_footer_no_refresh_20260602 */
.scx-modal-backdrop{display:none;position:fixed;inset:0;background:rgba(4,18,32,.58);z-index:99999;padding:28px;align-items:center;justify-content:center;backdrop-filter:blur(8px);}body.scx-modal-open{overflow:hidden;}
.scx-modal-backdrop.on{display:flex;}
.scx-modal{width:min(980px,96vw);max-height:90vh;background:#f8fafc;border-radius:28px;box-shadow:0 36px 120px rgba(0,0,0,.38);overflow:hidden;direction:rtl;color:#0f172a;border:1px solid rgba(255,255,255,.5);display:flex;flex-direction:column;}
.scx-modal-head{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;background:linear-gradient(135deg,#123241,#307D7E 58%,#D6A536);color:#fff;gap:14px;}
.scx-modal-head>div{display:flex;flex-direction:column;gap:5px}.scx-modal-head span{font-size:11px;font-weight:900;letter-spacing:.5px;opacity:.88;text-transform:uppercase}.scx-modal-head b{font-size:20px;font-weight:1000}.scx-modal-head button{width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.42);background:rgba(255,255,255,.18);color:#fff;font-size:26px;cursor:pointer;line-height:1;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 10px 22px rgba(0,0,0,.18);transition:transform .15s ease,background .15s ease}.scx-modal-head button:hover{background:rgba(255,255,255,.28);transform:translateY(-1px)}
.scx-modal-body{padding:20px;overflow:auto;max-height:calc(90vh - 138px);background:linear-gradient(180deg,#f8fafc,#eef7f7);}
.scx-modal-foot{display:flex;justify-content:flex-end;gap:10px;padding:14px 18px;background:#fff;border-top:1px solid #dbe8e8;}
.scx-modal-btn{border:0;border-radius:16px;padding:11px 18px;min-height:44px;font-weight:1000;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 10px 24px rgba(15,23,42,.10);transition:transform .15s ease,filter .15s ease}
.scx-modal-btn.close{background:linear-gradient(135deg,#123241,#307D7E);color:#fff}.scx-modal-btn.close:hover{filter:brightness(1.06);transform:translateY(-1px)}
.scx-detail-hero{display:flex;justify-content:space-between;gap:18px;align-items:stretch;border-radius:24px;padding:18px 20px;margin-bottom:16px;color:#fff;background:linear-gradient(135deg,#1e40af,#307D7E);box-shadow:0 14px 34px rgba(15,23,42,.16);}.scx-detail-hero.success{background:linear-gradient(135deg,#14532d,#16a34a)}.scx-detail-hero.warning{background:linear-gradient(135deg,#92400e,#D6A536)}.scx-detail-hero.danger{background:linear-gradient(135deg,#7f1d1d,#dc2626)}.scx-detail-hero.info{background:linear-gradient(135deg,#0f3f5f,#307D7E)}
.scx-detail-hero span{display:inline-block;font-size:11px;font-weight:900;opacity:.86;margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.scx-detail-hero h3{margin:0 0 8px;font-size:22px;font-weight:1000}.scx-detail-hero p{margin:0;line-height:1.8;color:rgba(255,255,255,.92);max-width:660px}.scx-detail-hero>b{font-size:28px;font-weight:1000;white-space:nowrap;align-self:center;font-family:Consolas,monospace;}
.scx-detail-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}.scx-detail-stat{background:#fff;border:1px solid #dbe8e8;border-radius:18px;padding:13px 14px;box-shadow:0 10px 22px rgba(15,23,42,.06)}.scx-detail-stat small{display:block;color:#64748b;font-weight:900;margin-bottom:6px}.scx-detail-stat b{font-size:18px;font-weight:1000}.scx-detail-stat.success b{color:#166534}.scx-detail-stat.warning b{color:#92400e}.scx-detail-stat.danger b{color:#991b1b}.scx-detail-stat.sales b,.scx-detail-stat.orders b,.scx-detail-stat.info b{color:#1e40af}
.scx-detail-panel{background:#fff;border:1px solid #dbe8e8;border-radius:20px;padding:15px 16px;margin-bottom:14px;box-shadow:0 10px 26px rgba(15,23,42,.06)}.scx-detail-panel h4{margin:0 0 10px;font-size:15px;font-weight:1000;color:#0f3442}.scx-detail-list{margin:0;padding:0 20px 0 0;line-height:2;color:#334155}.scx-detail-actions{display:flex;gap:10px;flex-wrap:wrap}.scx-detail-link{border:0;border-radius:14px;background:#307D7E;color:#fff;padding:10px 14px;font-weight:1000;cursor:pointer}.scx-detail-link:hover{filter:brightness(1.05)}
.scx-detail-big{font-size:30px;font-weight:1000;margin-bottom:12px;font-family:Consolas,monospace;color:#0f172a;}.scx-detail-big.success{color:#166534}.scx-detail-big.warning{color:#92400e}.scx-detail-big.danger{color:#991b1b}.scx-detail-big.info{color:#1e40af}
.scx-detail-source{margin-top:14px;background:#eef7f7;border:1px solid #cfe5e5;border-radius:16px;padding:12px;font-size:12px;line-height:1.8;color:#334155;}
@media(max-width:1200px){#page-smart_center .scx-kpis{grid-template-columns:repeat(3,1fr)}#page-smart_center .scx-grid,#page-smart_center .scx-grid-3{grid-template-columns:1fr}}
@media(max-width:760px){#page-smart_center .scx-shell{padding:14px}#page-smart_center .scx-hero{flex-direction:column}#page-smart_center .scx-score{width:100%}#page-smart_center .scx-kpis{grid-template-columns:1fr}#page-smart_center .scx-branch-filter{min-width:100%}#page-smart_center .scx-branch-picker{width:100%;left:0;right:0}.scx-modal-backdrop{padding:12px}.scx-detail-hero{flex-direction:column}.scx-detail-hero>b{align-self:flex-start}.scx-detail-stats{grid-template-columns:1fr}}

/* COSTIX_LAST_UPDATE smart_center_detail_tables_20260602
   Smart Center modal analysis tables: single reusable component, no heavy click render. */
.scx-detail-table-wrap{width:100%;overflow:auto;border:1px solid #d8e8e8;border-radius:16px;background:#fff;box-shadow:0 8px 20px rgba(15,23,42,.04)}
.scx-detail-table{width:100%;border-collapse:separate;border-spacing:0;direction:rtl;font-size:13px;color:#12343f;min-width:560px}
.scx-detail-table thead th{position:sticky;top:0;background:#3B9C9C;color:#fff;font-weight:1000;text-align:right;padding:11px 12px;border-bottom:1px solid rgba(255,255,255,.28);white-space:nowrap}
.scx-detail-table tbody td{padding:11px 12px;border-bottom:1px solid #e6f0f0;background:#fbffff;vertical-align:middle;font-weight:800;line-height:1.6}
.scx-detail-table tbody tr:nth-child(even) td{background:#eefafa}
.scx-detail-table tbody tr:hover td{background:#e5f4f4}
.scx-detail-table td.num{text-align:left;font-family:Consolas,monospace;font-weight:1000;direction:ltr;white-space:nowrap}
.scx-detail-table td.success{color:#166534}.scx-detail-table td.warning{color:#92400e}.scx-detail-table td.danger{color:#991b1b}.scx-detail-table td.info{color:#1e40af}
.scx-detail-source h4{margin:0 0 10px;font-size:14px;font-weight:1000;color:#0f3442}
.scx-detail-source .scx-detail-table{min-width:0;font-size:12px}.scx-detail-source .scx-detail-table thead{display:none}.scx-detail-source .scx-detail-table tbody td:first-child{width:150px;color:#64748b;background:#eef7f7}.scx-detail-source .scx-detail-table tbody td:last-child{font-weight:1000;color:#0f3442}
.scx-detail-empty{border:1px dashed #bfdada;background:#f7ffff;border-radius:14px;padding:14px;color:#64748b;font-weight:900;text-align:center}
@media(max-width:760px){.scx-detail-table{min-width:460px}.scx-detail-source .scx-detail-table{min-width:0}.scx-detail-source .scx-detail-table tbody td:first-child{width:auto}}

/* COSTIX_LAST_UPDATE: smart_center_cached_tabs_20260602 — branch filter apply/cached tabs */
#page-smart_center .scx-branch-filter.dirty .scx-branch-trigger{border-color:#2563eb;background:#eff6ff;box-shadow:0 0 0 3px rgba(37,99,235,.12)}
#page-smart_center .scx-branch-filter.dirty .scx-branch-trigger i{background:#dbeafe;color:#1d4ed8;}
#page-smart_center .scx-branch-apply{display:flex;gap:8px;justify-content:flex-end;position:sticky;bottom:0;background:linear-gradient(180deg,rgba(255,255,255,.88),#fff);padding-top:10px;margin-top:8px;border-top:1px solid #e2e8f0;}
#page-smart_center .scx-branch-apply .scx-btn{min-height:34px;padding:8px 14px;font-size:11px;}

/* COSTIX_LAST_UPDATE smart_center_open_cached_snapshot_20260602
   Smart Center opens from cached snapshot; filter/date draft state is visual only until apply/refresh. */
#page-smart_center .scx-filters.pending{outline:2px solid rgba(37,99,235,.32);box-shadow:0 14px 32px rgba(37,99,235,.13);}
#page-smart_center .scx-pending-filter{width:100%;border:1px solid #bfdbfe;background:#eff6ff;color:#1d4ed8;border-radius:14px;padding:9px 12px;font-size:12px;font-weight:1000;line-height:1.6;}
#page-smart_center .scx-shell-card{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:24px;box-shadow:0 16px 40px rgba(15,23,42,.10);padding:26px;max-width:760px;margin:50px auto;text-align:center;}
#page-smart_center .scx-shell-card b{display:block;font-size:22px;font-weight:1000;color:#0f3442;margin-bottom:8px;}
#page-smart_center .scx-shell-card p{color:#64748b;font-weight:800;line-height:1.9;margin:0 0 16px;}

/* COSTIX_LAST_UPDATE 2026-06-02 menu_engineering_multi_branch_filter_sales_binding */
#page-menu_eng .me2-branch-filter{position:relative;min-width:210px;display:flex;flex-direction:column;gap:7px;z-index:8;}
#page-menu_eng .me2-branch-trigger{height:56px;border-radius:16px;border:1px solid #d9e6ec;background:#fff;color:#0f172a;display:grid;grid-template-columns:1fr;gap:1px;text-align:right;padding:8px 12px;font-family:inherit;cursor:pointer;box-shadow:0 8px 20px rgba(15,23,42,.055);}
#page-menu_eng .me2-branch-trigger span{font-size:11px;font-weight:900;color:#64748b;}
#page-menu_eng .me2-branch-trigger b{font-size:14px;font-weight:1000;color:#0f172a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#page-menu_eng .me2-branch-trigger i{font-style:normal;font-size:10px;font-weight:900;color:#64748b;}
#page-menu_eng .me2-branch-filter.active .me2-branch-trigger{border-color:#d7a72f;background:linear-gradient(135deg,#fff8db,#ffffff);box-shadow:0 12px 26px rgba(215,167,47,.18);}
#page-menu_eng .me2-branch-filter.dirty .me2-branch-trigger{border-color:#f59e0b;background:linear-gradient(135deg,#fff7ed,#ffffff);}
#page-menu_eng .me2-branch-filter.dirty .me2-branch-trigger i{color:#b45309;}
#page-menu_eng .me2-branch-picker{position:absolute;top:62px;right:0;width:min(420px,92vw);background:#fff;border:1px solid #d9e6ec;border-radius:20px;box-shadow:0 24px 60px rgba(15,23,42,.18);padding:12px;display:none;z-index:60;}
#page-menu_eng .me2-branch-picker.open{display:block;}
#page-menu_eng .me2-branch-tools{display:flex;gap:8px;margin-bottom:10px;}
#page-menu_eng .me2-branch-tools button{border:1px solid #d9e6ec;background:#f8fafc;border-radius:12px;padding:8px 10px;font-weight:900;color:#0f172a;cursor:pointer;}
#page-menu_eng .me2-branch-list{max-height:240px;overflow:auto;display:grid;gap:7px;padding:2px 2px 6px;}
#page-menu_eng .me2-branch-list label{display:flex!important;flex-direction:row!important;align-items:center;gap:9px;padding:9px 10px;border:1px solid #e5edf2;border-radius:13px;background:#f8fafc;color:#0f172a!important;font-size:13px!important;font-weight:900!important;cursor:pointer;}
#page-menu_eng .me2-branch-list input{width:18px;height:18px;accent-color:#0f9aa6;}
#page-menu_eng .me2-branch-list label:has(input:checked){border-color:#0f9aa6;background:#e9fbfd;}
#page-menu_eng .me2-branch-apply{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid #edf3f6;padding-top:10px;margin-top:6px;}
#page-menu_eng .me2-branch-chips{display:flex;flex-wrap:wrap;gap:5px;}
#page-menu_eng .me2-branch-chips span{background:#e9fbfd;color:#0f7180;border:1px solid #bdeff4;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:1000;}
#page-menu_eng .me2-branch-filter.active .me2-branch-chips span{background:#fff7d6;color:#8a6400;border-color:#f1d36b;}
@media(max-width:760px){#page-menu_eng .me2-branch-picker{right:auto;left:0;width:calc(100vw - 28px)}}

/* COSTIX_LAST_UPDATE: menu_engineering_sales_binding_alias_fix_20260602
   Scoped Menu Engineering badge for sold items that did not match a menu item. */
#page-menu_eng .me2-unmapped-badge{
  display:inline-flex;
  align-items:center;
  gap:4px;
  margin-inline-start:8px;
  padding:3px 8px;
  border-radius:999px;
  background:#fff3cd;
  color:#8a5b00;
  border:1px solid rgba(138,91,0,.18);
  font-size:11px;
  font-weight:900;
  vertical-align:middle;
}

/* COSTIX_LAST_UPDATE: menu_engineering_detail_modal_alias_link_phase_20260602
   Menu Engineering 2.0: dashboard-grade details modal and manual sales item alias linking.
   Scoped to ME2 classes; no global dashboard/modal override. */
.me2-modal-bg{position:fixed!important;inset:0!important;z-index:9999!important;display:none;align-items:center;justify-content:center;background:rgba(15,23,42,.55)!important;backdrop-filter:blur(8px)!important;padding:18px!important;}
.me2-modal-bg.open{display:flex!important;}
.me2-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:22px 24px 20px;background:linear-gradient(135deg,#0f4c5c 0%,#258b86 58%,#d7a72f 100%)!important;color:#fff!important;}
.me2-detail-head small{display:block;font-size:11px;font-weight:1000;letter-spacing:.08em;color:rgba(255,255,255,.82)!important;text-transform:uppercase;}
.me2-detail-head h2{margin:4px 0 0;font-size:26px;font-weight:1000;color:#fff!important;line-height:1.2;}
.me2-detail-head p{margin:6px 0 0;color:rgba(255,255,255,.86)!important;font-size:13px;font-weight:800;}
.me2-detail-close{width:40px;height:40px;border-radius:14px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.14);color:#fff;font-size:18px;font-weight:1000;cursor:pointer;display:grid;place-items:center;}
.me2-detail-close:hover{background:rgba(255,255,255,.24);}
.me2-detail-body{max-height:calc(90vh - 160px);overflow:auto;padding:18px 22px;background:linear-gradient(180deg,#f8fbfc,#fff)!important;}
.me2-detail-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;border-radius:22px;padding:18px 20px;margin-bottom:14px;border:1px solid #d9e6ec;background:#f8fafc;}
.me2-detail-hero h3{margin:3px 0;font-size:20px;font-weight:1000;color:#0f172a!important;}
.me2-detail-hero small,.me2-detail-hero p{color:#64748b!important;font-weight:900;margin:0;}
.me2-detail-hero>b{font-size:26px;font-weight:1000;white-space:nowrap;color:#0f766e!important;}
.me2-detail-hero.danger{background:#fff1f2;border-color:#fecdd3;}.me2-detail-hero.danger>b{color:#dc2626!important;}
.me2-detail-hero.warning{background:#fffbeb;border-color:#fde68a;}.me2-detail-hero.info{background:#eff6ff;border-color:#bfdbfe;}.me2-detail-hero.success{background:#ecfdf5;border-color:#bbf7d0;}
.me2-detail-metrics{display:grid;grid-template-columns:repeat(4,minmax(140px,1fr));gap:10px;margin-bottom:14px;}
.me2-detail-metric{border:1px solid #e5edf2;background:#fff;border-radius:18px;padding:13px 14px;box-shadow:0 8px 20px rgba(15,23,42,.045);}
.me2-detail-metric small{display:block;color:#64748b!important;font-size:12px;font-weight:900;}
.me2-detail-metric b{display:block;margin-top:6px;color:#0f172a!important;font-size:18px;font-weight:1000;}
.me2-detail-metric.green b{color:#16a34a!important}.me2-detail-metric.red b{color:#dc2626!important}.me2-detail-metric.amber b{color:#b45309!important}.me2-detail-metric.blue b{color:#1d4ed8!important}
.me2-detail-section{background:#fff;border:1px solid #e5edf2;border-radius:20px;padding:15px;margin-bottom:14px;box-shadow:0 8px 22px rgba(15,23,42,.04);}
.me2-detail-section h3{margin:0 0 10px;font-size:16px;font-weight:1000;color:#0f172a!important;}
.me2-link-warning{background:linear-gradient(135deg,#fff7ed,#fff)!important;border-color:#fed7aa!important;}
.me2-link-warning p{margin:0 0 12px;color:#7c2d12!important;font-weight:800;line-height:1.8;}
.me2-detail-steps{margin:0 20px 0 0;color:#334155!important;font-weight:800;line-height:1.9;}
.me2-detail-footer{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:14px 20px;border-top:1px solid #e5edf2;background:#fff!important;}
.me2-detail-btn{height:42px;border-radius:14px;border:1px solid #d9e6ec;background:#f8fafc;color:#0f172a;font-weight:1000;padding:0 16px;cursor:pointer;font-family:inherit;}
.me2-detail-btn:hover{background:#eefbff;border-color:#12b8c6;color:#0f7180;}
.me2-detail-btn.gold{background:linear-gradient(135deg,#d7a72f,#facc15)!important;border-color:#d7a72f!important;color:#111827!important;box-shadow:0 10px 24px rgba(215,167,47,.22);}
.me2-link-search{width:100%;height:44px;border-radius:14px;border:1px solid #d9e6ec;background:#fff;color:#0f172a;font-weight:900;padding:0 12px;margin-bottom:12px;font-family:inherit;}
.me2-link-search:focus{outline:none;border-color:#12b8c6;box-shadow:0 0 0 3px rgba(18,184,198,.14);}
.me2-alias-list{display:grid;gap:8px;max-height:46vh;overflow:auto;}
.me2-alias-item{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #e5edf2;background:#fff;border-radius:16px;padding:12px 14px;color:#0f172a;text-align:right;cursor:pointer;font-family:inherit;}
.me2-alias-item:hover{border-color:#12b8c6;background:#eefbff;}
.me2-alias-item b{display:block;font-weight:1000;}.me2-alias-item small{display:block;color:#64748b;font-weight:800;margin-top:3px;}.me2-alias-item em{font-style:normal;color:#0f7180;background:#e9fbfd;border-radius:999px;padding:5px 8px;font-weight:1000;font-size:11px;white-space:nowrap;}
.me2-empty.danger{border-color:#fecdd3!important;background:#fff1f2!important;color:#991b1b!important;}

/* COSTIX_LAST_UPDATE: menu_engineering_mapping_state_dashboard_modal_phase_20260602
   Dashboard modal standard for Menu Engineering 2.0 detail windows + clear source-state badges. */
.me2-modal-bg{position:fixed!important;inset:0!important;z-index:9999!important;display:none;align-items:center;justify-content:center;background:rgba(15,23,42,.58)!important;backdrop-filter:blur(7px)!important;padding:22px!important;}
.me2-modal-bg.open{display:flex!important;}
.me2-dashboard-modal{direction:rtl;width:min(1400px,92vw)!important;height:min(86vh,860px)!important;max-height:86vh!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;background:#fff!important;border:1px solid #d9e6ec!important;border-radius:26px!important;box-shadow:0 28px 90px rgba(15,23,42,.30)!important;color:#0f172a!important;font-family:'Cairo',Tahoma,Arial,sans-serif!important;}
.me2-dashboard-modal .me2-detail-head{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px 28px;background:linear-gradient(135deg,#0f4c5c 0%,#258b86 58%,#d7a72f 100%)!important;color:#fff!important;}
.me2-dashboard-modal .me2-detail-head small{display:block;font-size:11px;font-weight:1000;letter-spacing:.08em;color:rgba(255,255,255,.84)!important;text-transform:uppercase;}
.me2-dashboard-modal .me2-detail-head h2{margin:4px 0 0;font-size:28px;font-weight:1000;color:#fff!important;line-height:1.25;}
.me2-dashboard-modal .me2-detail-head p{margin:6px 0 0;color:rgba(255,255,255,.88)!important;font-size:13px;font-weight:900;line-height:1.7;}
.me2-dashboard-modal .me2-detail-close{width:42px;height:42px;border-radius:14px;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.16);color:#fff;font-size:20px;font-weight:1000;cursor:pointer;display:grid;place-items:center;}
.me2-dashboard-modal .me2-detail-close:hover{background:rgba(255,255,255,.28);}
.me2-dashboard-modal .me2-detail-body{flex:1 1 auto;min-height:0;overflow:auto!important;padding:20px 24px;background:linear-gradient(180deg,#f8fbfc,#fff)!important;}
.me2-dashboard-modal .me2-detail-footer{flex:0 0 auto;display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:14px 22px;border-top:1px solid #e5edf2;background:#fff!important;}
.me2-dashboard-modal .me2-detail-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;border-radius:22px;padding:18px 20px;margin-bottom:14px;border:1px solid #d9e6ec;background:#f8fafc;}
.me2-dashboard-modal .me2-detail-hero h3{margin:3px 0;font-size:22px;font-weight:1000;color:#0f172a!important;}
.me2-dashboard-modal .me2-detail-hero small,.me2-dashboard-modal .me2-detail-hero p{color:#64748b!important;font-weight:900;margin:0;}
.me2-dashboard-modal .me2-detail-hero>b{font-size:28px;font-weight:1000;white-space:nowrap;color:#0f766e!important;}
.me2-dashboard-modal .me2-detail-hero.danger{background:#fff1f2;border-color:#fecdd3;}.me2-dashboard-modal .me2-detail-hero.danger>b{color:#dc2626!important;}
.me2-dashboard-modal .me2-detail-hero.warning{background:#fffbeb;border-color:#fde68a;}.me2-dashboard-modal .me2-detail-hero.info{background:#eff6ff;border-color:#bfdbfe;}.me2-dashboard-modal .me2-detail-hero.success{background:#ecfdf5;border-color:#bbf7d0;}
.me2-dashboard-modal .me2-detail-metrics{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:12px;margin-bottom:15px;}
.me2-dashboard-modal .me2-detail-metric{border:1px solid #e5edf2;background:#fff;border-radius:18px;padding:14px 15px;box-shadow:0 8px 20px rgba(15,23,42,.045);min-height:76px;}
.me2-dashboard-modal .me2-detail-metric small{display:block;color:#64748b!important;font-size:12px;font-weight:900;}
.me2-dashboard-modal .me2-detail-metric b{display:block;margin-top:7px;color:#0f172a!important;font-size:18px;font-weight:1000;}
.me2-dashboard-modal .me2-detail-metric.green b{color:#16a34a!important}.me2-dashboard-modal .me2-detail-metric.red b{color:#dc2626!important}.me2-dashboard-modal .me2-detail-metric.amber b{color:#b45309!important}.me2-dashboard-modal .me2-detail-metric.blue b{color:#1d4ed8!important}.me2-dashboard-modal .me2-detail-metric.purple b{color:#7c3aed!important}
.me2-dashboard-modal .me2-detail-section{background:#fff;border:1px solid #e5edf2;border-radius:20px;padding:16px;margin-bottom:15px;box-shadow:0 8px 22px rgba(15,23,42,.04);}
.me2-dashboard-modal .me2-detail-section h3{margin:0 0 11px;font-size:17px;font-weight:1000;color:#0f172a!important;}
.me2-dashboard-modal .me2-table-wrap{max-height:46vh;overflow:auto!important;border:1px solid #e2edf1;border-radius:16px;}
.me2-dashboard-modal .me2-table{width:100%;border-collapse:collapse;}
.me2-dashboard-modal .me2-table th{position:sticky;top:0;z-index:1;background:#3B9C9C!important;color:#fff!important;font-weight:1000;padding:12px!important;white-space:nowrap;}
.me2-dashboard-modal .me2-table td{background:#fff!important;padding:12px!important;border-bottom:1px solid #edf4f6!important;vertical-align:middle;}
.me2-dashboard-modal .me2-table tr:hover td{background:#e9fbfd!important;}
.me2-dashboard-modal .me2-detail-btn{height:44px;border-radius:14px;border:1px solid #d9e6ec;background:#f8fafc;color:#0f172a;font-weight:1000;padding:0 18px;cursor:pointer;font-family:inherit;}
.me2-dashboard-modal .me2-detail-btn:hover{background:#eefbff;border-color:#12b8c6;color:#0f7180;}
.me2-dashboard-modal .me2-detail-btn.gold{background:linear-gradient(135deg,#d7a72f,#facc15)!important;border-color:#d7a72f!important;color:#111827!important;box-shadow:0 10px 24px rgba(215,167,47,.22);}
.me2-map-badge{display:inline-flex;align-items:center;justify-content:center;margin-inline-start:6px;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:1000;border:1px solid transparent;vertical-align:middle;white-space:nowrap;}
.me2-map-badge.linked{background:#ecfdf5;color:#047857;border-color:#a7f3d0;}
.me2-map-badge.sale-cost{background:#eff6ff;color:#1d4ed8;border-color:#bfdbfe;}
.me2-map-badge.identity-missing{background:#fff7ed;color:#c2410c;border-color:#fed7aa;}
.me2-map-badge.needs-link{background:#fff1f2;color:#be123c;border-color:#fecdd3;}
.me2-sale-cost-note{background:linear-gradient(135deg,#eff6ff,#fff)!important;border-color:#bfdbfe!important;}
.me2-sale-cost-note p{margin:0;color:#1e3a8a!important;font-weight:900;line-height:1.9;}
@media(max-width:980px){.me2-dashboard-modal{width:96vw!important;height:88vh!important}.me2-dashboard-modal .me2-detail-metrics{grid-template-columns:repeat(2,1fr)}.me2-dashboard-modal .me2-detail-hero{align-items:flex-start;flex-direction:column}.me2-dashboard-modal .me2-detail-head h2{font-size:22px}}
@media(max-width:560px){.me2-dashboard-modal .me2-detail-metrics{grid-template-columns:1fr}.me2-dashboard-modal .me2-detail-body{padding:12px}.me2-dashboard-modal .me2-detail-head{padding:18px}.me2-dashboard-modal{border-radius:20px!important}}


/* COSTIX_LAST_UPDATE Phase ME2 Final Link Root Fix — 2026-06-02 Africa/Cairo
   Final single-owner dashboard modal sizing for Menu Engineering 2.0.
   Replaces the old narrow/detail-modal shell behavior with one XL dashboard modal, one body scroll, and wrapped tables. */
.me2-modal-bg{position:fixed!important;inset:0!important;z-index:99999!important;display:none;align-items:center;justify-content:center;background:rgba(15,23,42,.62)!important;backdrop-filter:blur(8px)!important;padding:28px!important;}
.me2-modal-bg.open{display:flex!important;}
.me2-modal-bg .me2-dashboard-modal{width:min(1520px,calc(100vw - 88px))!important;height:min(900px,calc(100vh - 88px))!important;max-width:calc(100vw - 88px)!important;max-height:calc(100vh - 88px)!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;border-radius:30px!important;background:#fff!important;color:#0f172a!important;}
.me2-modal-bg .me2-dashboard-modal .me2-detail-head{flex:0 0 auto!important;min-height:104px!important;padding:24px 30px!important;}
.me2-modal-bg .me2-dashboard-modal .me2-detail-body{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;padding:22px 28px!important;}
.me2-modal-bg .me2-dashboard-modal .me2-detail-footer{flex:0 0 auto!important;}
.me2-modal-bg .me2-dashboard-modal .me2-table-wrap{max-height:none!important;overflow-x:hidden!important;overflow-y:visible!important;border-radius:16px!important;}
.me2-modal-bg .me2-dashboard-modal .me2-table{table-layout:fixed!important;width:100%!important;min-width:0!important;}
.me2-modal-bg .me2-dashboard-modal .me2-table th,.me2-modal-bg .me2-dashboard-modal .me2-table td{white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word!important;line-height:1.65!important;}
.me2-modal-bg .me2-dashboard-modal .me2-detail-section{overflow:visible!important;}
.me2-modal-bg .me2-dashboard-modal .me2-alias-list{max-height:52vh!important;overflow-y:auto!important;overflow-x:hidden!important;}
@media(max-width:980px){.me2-modal-bg{padding:14px!important}.me2-modal-bg .me2-dashboard-modal{width:calc(100vw - 28px)!important;height:calc(100vh - 28px)!important;max-width:calc(100vw - 28px)!important;max-height:calc(100vh - 28px)!important;border-radius:22px!important}.me2-modal-bg .me2-dashboard-modal .me2-detail-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important}.me2-modal-bg .me2-dashboard-modal .me2-detail-hero{align-items:flex-start!important;flex-direction:column!important}.me2-modal-bg .me2-dashboard-modal .me2-detail-head h2{font-size:22px!important}}
@media(max-width:560px){.me2-modal-bg .me2-dashboard-modal .me2-detail-metrics{grid-template-columns:1fr!important}.me2-modal-bg .me2-dashboard-modal .me2-detail-body{padding:14px!important}.me2-modal-bg .me2-dashboard-modal .me2-detail-head{padding:18px!important}.me2-modal-bg .me2-dashboard-modal .me2-detail-footer{justify-content:stretch!important}.me2-modal-bg .me2-dashboard-modal .me2-detail-btn{flex:1!important}}

/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE demand_forecast_intelligence_multibranch_phase_20260602
   Demand Forecast cockpit UI — single scoped owner for #page-demand_forecast
═══════════════════════════════════════════════════════════════ */
#page-demand_forecast .df-hero{background:linear-gradient(135deg,rgba(123,22,232,.12),rgba(184,146,42,.13));border:1px solid rgba(184,146,42,.22);border-radius:24px;padding:18px;margin-bottom:14px;display:flex;justify-content:space-between;align-items:flex-start;gap:14px;box-shadow:var(--shadow)}
#page-demand_forecast .df-title{font-size:26px;font-weight:950;color:var(--text);letter-spacing:-.4px}
#page-demand_forecast .df-sub{font-size:12px;color:var(--text3);margin-top:5px;line-height:1.8}
#page-demand_forecast .df-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
#page-demand_forecast .df-filter{background:var(--bg1);border:1px solid var(--bdr2);border-radius:20px;padding:12px;margin-bottom:14px;display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;box-shadow:var(--shadow)}
#page-demand_forecast .df-filter .fg{min-width:140px;margin:0}
#page-demand_forecast .df-filter .fi,#page-demand_forecast .df-filter .fs{height:38px}
#page-demand_forecast .df-chipbar{display:flex;gap:6px;flex-wrap:wrap}
#page-demand_forecast .df-chip{border:1px solid var(--bdr2);background:var(--bg3);border-radius:999px;padding:8px 11px;font-size:11px;font-weight:900;color:var(--text2);cursor:pointer}
#page-demand_forecast .df-chip.on{background:var(--goldg);color:#111;border-color:transparent}
#page-demand_forecast .df-branch-filter{position:relative;min-width:260px;align-self:stretch;display:flex;flex-direction:column;gap:6px;justify-content:flex-end}
#page-demand_forecast .df-branch-trigger{height:42px;border:1px solid var(--bdr2);border-radius:16px;background:linear-gradient(180deg,var(--bg1),var(--bg3));display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 12px;cursor:pointer;color:var(--text);box-shadow:0 8px 20px rgba(15,23,42,.06)}
#page-demand_forecast .df-branch-trigger span{font-size:10px;color:var(--text3);font-weight:900}
#page-demand_forecast .df-branch-trigger b{font-size:12px;font-weight:950;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#page-demand_forecast .df-branch-trigger i{font-style:normal;font-size:10px;color:var(--gold3);font-weight:900}
#page-demand_forecast .df-branch-picker{display:none;position:absolute;top:48px;left:0;right:0;z-index:40;background:var(--bg1);border:1px solid var(--bdr2);border-radius:18px;box-shadow:0 24px 60px rgba(15,23,42,.22);padding:10px;min-width:300px}
#page-demand_forecast .df-branch-picker.open{display:block}
#page-demand_forecast .df-branch-tools{display:flex;gap:7px;margin-bottom:8px}
#page-demand_forecast .df-branch-tools button,#page-demand_forecast .df-branch-apply button{border:1px solid var(--bdr2);border-radius:12px;background:var(--bg3);padding:7px 10px;font-size:11px;font-weight:900;color:var(--text2);cursor:pointer}
#page-demand_forecast .df-branch-list{display:grid;gap:6px;max-height:240px;overflow:auto;padding:2px}
#page-demand_forecast .df-branch-list label{display:flex;align-items:center;gap:8px;border:1px solid var(--bdr);border-radius:12px;background:var(--bg2);padding:8px 10px;cursor:pointer;font-size:12px;font-weight:800;color:var(--text)}
#page-demand_forecast .df-branch-list input{width:16px;height:16px;accent-color:#d4a52c}
#page-demand_forecast .df-branch-apply{display:flex;justify-content:flex-end;gap:7px;margin-top:9px;border-top:1px solid var(--bdr);padding-top:9px}
#page-demand_forecast .df-branch-chips{display:flex;gap:4px;flex-wrap:wrap;max-width:300px}
#page-demand_forecast .df-branch-chips span{border:1px solid rgba(20,184,166,.24);background:rgba(20,184,166,.08);color:var(--teal);border-radius:999px;padding:3px 7px;font-size:10px;font-weight:900}
#page-demand_forecast .df-tabs{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px;border-bottom:1px solid var(--bdr2);padding-bottom:10px}
#page-demand_forecast .df-tab{border:1px solid var(--bdr2);background:var(--bg1);border-radius:13px;padding:9px 13px;font-weight:900;font-size:12px;color:var(--text2);cursor:pointer}
#page-demand_forecast .df-tab.on{background:var(--goldg);color:#111;border-color:transparent;box-shadow:0 5px 18px rgba(184,146,42,.22)}
#page-demand_forecast .df-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:10px;margin-bottom:14px}
#page-demand_forecast .df-kpi{background:var(--bg1);border:1px solid var(--bdr2);border-radius:18px;padding:14px;box-shadow:var(--shadow);text-align:right;color:var(--text)}
#page-demand_forecast .df-click{cursor:pointer;transition:.18s ease}
#page-demand_forecast .df-click:hover{transform:translateY(-2px);box-shadow:0 18px 42px rgba(15,23,42,.14)}
#page-demand_forecast .df-kpi small{display:block;color:var(--text3);font-size:10px;font-weight:900}
#page-demand_forecast .df-kpi b{display:block;margin-top:4px;font-family:var(--fm);font-size:22px;color:var(--text);line-height:1.35}
#page-demand_forecast .df-kpi em{display:block;font-style:normal;font-size:10px;color:var(--text3);margin-top:3px;line-height:1.5}
#page-demand_forecast .df-kpi.good{border-color:rgba(5,150,105,.26);background:linear-gradient(180deg,var(--bg1),rgba(5,150,105,.06))}
#page-demand_forecast .df-kpi.warn{border-color:rgba(217,119,6,.28);background:linear-gradient(180deg,var(--bg1),rgba(217,119,6,.07))}
#page-demand_forecast .df-kpi.bad{border-color:rgba(220,38,38,.28);background:linear-gradient(180deg,var(--bg1),rgba(220,38,38,.07))}
#page-demand_forecast .df-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:14px;margin-bottom:14px}
#page-demand_forecast .df-grid-smart{grid-template-columns:repeat(2,minmax(0,1fr))}
#page-demand_forecast .df-panel{background:var(--bg1);border:1px solid var(--bdr2);border-radius:20px;box-shadow:var(--shadow);overflow:hidden}
#page-demand_forecast .df-panel-h{padding:13px 15px;border-bottom:1px solid var(--bdr2);display:flex;align-items:center;justify-content:space-between;gap:10px}
#page-demand_forecast .df-panel-t{font-weight:950;font-size:14px;color:var(--text)}
#page-demand_forecast .df-panel-b{padding:14px 15px}
#page-demand_forecast .df-note{padding:10px 12px;border:1px solid var(--bdr2);background:var(--bg3);border-radius:14px;font-size:12px;line-height:1.8;margin-bottom:8px;color:var(--text2)}
#page-demand_forecast .df-note.good{background:var(--greenb);border-color:rgba(5,150,105,.2)}
#page-demand_forecast .df-note.warn{background:var(--amberb);border-color:rgba(217,119,6,.2)}
#page-demand_forecast .df-note.bad{background:var(--redb);border-color:rgba(220,38,38,.2)}
#page-demand_forecast .df-day-card{display:grid;grid-template-columns:1.3fr repeat(3,.8fr);gap:8px;align-items:center;width:100%;border:1px solid var(--bdr2);border-radius:16px;background:var(--bg3);padding:10px 12px;margin-bottom:8px;text-align:right;color:var(--text);cursor:pointer}
#page-demand_forecast .df-day-card b{font-weight:950}.df-day-card span{font-family:var(--fm);font-size:12px;font-weight:800}.df-day-card small{grid-column:1/-1;color:var(--text3);font-size:10px}
#page-demand_forecast .df-mini-row,#page-demand_forecast .df-risk-row{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--bdr2);border-radius:14px;background:var(--bg3);padding:10px 12px;margin-bottom:7px;text-align:right;color:var(--text);cursor:pointer}
#page-demand_forecast .df-mini-row b,#page-demand_forecast .df-risk-row b{display:block;font-weight:950}.df-mini-row small,#page-demand_forecast .df-risk-row small{display:block;color:var(--text3);font-size:10px;margin-top:2px}
#page-demand_forecast .df-mini-row em,#page-demand_forecast .df-risk-row em{font-style:normal;font-family:var(--fm);font-weight:900;color:var(--gold3)}
#page-demand_forecast .df-risk-row.danger{background:var(--redb);border-color:rgba(220,38,38,.22)}
#page-demand_forecast .df-risk-row.warn{background:var(--amberb);border-color:rgba(217,119,6,.22)}
#page-demand_forecast .df-table{width:100%;border-collapse:collapse}
#page-demand_forecast .df-table th,#page-demand_forecast .df-table td{padding:9px 10px;border-bottom:1px solid var(--bdr);text-align:right;font-size:12px;vertical-align:middle;color:var(--text2)}
#page-demand_forecast .df-table th{font-size:10px;color:var(--text3);background:var(--bg3);font-weight:950;white-space:nowrap}
#page-demand_forecast .df-table input{width:90px;height:32px;border:1px solid var(--bdr2);border-radius:10px;background:var(--bg1);color:var(--text);padding:0 8px;text-align:center;font-family:var(--fm)}
#page-demand_forecast .df-table .num{font-family:var(--fm);font-weight:850;white-space:nowrap}
#page-demand_forecast .df-table .good{color:var(--green3)}
#page-demand_forecast .df-table .bad{color:var(--red3)}
#page-demand_forecast .df-table .warn{color:var(--amber2)}
#page-demand_forecast .df-link{border:0;background:transparent;color:var(--teal);font-weight:950;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
#page-demand_forecast .df-scroll{overflow:auto;max-width:100%}
#page-demand_forecast .df-order-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end;margin-top:12px;padding:0 14px 14px}
#page-demand_forecast .df-muted{color:var(--text3);font-size:11px}
#page-demand_forecast .df-risk-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:4px 9px;font-size:10px;font-weight:950;min-width:54px}
#page-demand_forecast .df-risk-badge.good{background:var(--greenb);color:var(--green3)}
#page-demand_forecast .df-risk-badge.warn{background:var(--amberb);color:var(--amber2)}
#page-demand_forecast .df-risk-badge.bad{background:var(--redb);color:var(--red3)}
#page-demand_forecast .df-source-row{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--bdr2);border-radius:16px;background:var(--bg3);padding:11px 12px;margin-bottom:9px;overflow:hidden}
#page-demand_forecast .df-source-row span{position:relative;z-index:2}.df-source-row b{display:block;font-weight:950}.df-source-row small{display:block;color:var(--text3);font-size:10px;margin-top:3px}.df-source-row em{position:relative;z-index:2;font-style:normal;font-family:var(--fm);font-weight:950;color:var(--teal)}
#page-demand_forecast .df-source-row i{position:absolute;right:0;bottom:0;height:4px;background:linear-gradient(90deg,var(--teal3),var(--gold3));border-radius:999px}
.df-modal-bg{z-index:9998!important}.df-insight-modal{width:min(1080px,92vw)!important;max-height:86vh!important;overflow:auto!important;border-radius:26px!important}.df-insight-body{padding:10px 2px 0}.df-modal-close{position:absolute;left:16px;top:16px;width:38px;height:38px;border:1px solid var(--bdr2);background:var(--bg3);border-radius:14px;font-size:24px;line-height:1;cursor:pointer;color:var(--text)}
.df-draft-panel{margin-top:14px;border:1px solid rgba(184,146,42,.28);background:var(--goldb2);border-radius:16px;padding:13px}.df-draft-panel h4{margin:0 0 8px;font-size:13px}.df-draft-lines{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px}.df-draft-line{background:var(--bg1);border:1px solid var(--bdr2);border-radius:12px;padding:9px;font-size:12px}
@media(max-width:980px){#page-demand_forecast .df-grid,#page-demand_forecast .df-grid-smart{grid-template-columns:1fr}#page-demand_forecast .df-hero{flex-direction:column}#page-demand_forecast .df-filter .fg,#page-demand_forecast .df-branch-filter{min-width:100%;width:100%}#page-demand_forecast .df-actions{justify-content:flex-start}#page-demand_forecast .df-table{min-width:860px}#page-demand_forecast .df-day-card{grid-template-columns:1fr}.df-insight-modal{width:96vw!important}}

/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE Phase2.1 — Operational Clock UI Cleanup — 2026-06-02 Africa/Cairo
   Branch Settings operational-day preview styles. No global page layout changes.
═══════════════════════════════════════════════════════════════ */
/* Branch Settings — Operational Clock polished layout */
.branch-pro-modal{width:min(1180px,96vw)!important;height:min(92vh,860px)!important;max-height:92vh!important;overflow:hidden!important}
.branch-pro-layout{grid-template-columns:210px minmax(0,1fr)!important;min-height:0!important;height:calc(min(92vh,860px) - 148px)!important;overflow:hidden!important}
.branch-pro-body{overflow-y:auto!important;overflow-x:hidden!important;min-height:0!important;padding:18px 20px!important}
.branch-op-grid{grid-template-columns:minmax(320px,.95fr) minmax(360px,1.05fr)!important;align-items:start!important;gap:14px!important}
.branch-op-grid .branch-pro-card{min-width:0}.branch-op-main-card{grid-row:span 2}.branch-op-shift-card{min-height:180px}.branch-op-preview-card{grid-column:auto!important}
.branch-op-close-badge{border:1px solid rgba(13,148,136,.22);background:rgba(13,148,136,.08);color:var(--teal,#0f766e);border-radius:14px;padding:10px 12px;font-weight:900;font-size:12px;line-height:1.5}.branch-op-close-badge b{display:block;font-size:18px;margin-top:4px;color:var(--text,#111827)}
.op-clock-preview{display:grid;gap:10px;padding:4px;color:var(--text,#111827)}
.op-clock-title{font-weight:900;font-size:16px;color:var(--teal,#0f766e);margin-bottom:2px}.op-clock-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.op-clock-summary>div{border:1px solid rgba(13,148,136,.18);background:linear-gradient(135deg,rgba(13,148,136,.09),rgba(184,146,42,.06));border-radius:15px;padding:10px 12px}.op-clock-summary small{display:block;color:var(--text3,#64748b);font-weight:900;font-size:11px}.op-clock-summary b{display:block;margin-top:4px;font-size:15px;color:var(--text,#111827);font-family:var(--fm,monospace)}
.op-clock-line{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--bdr2,#e5e7eb);background:var(--bg3,#f8fafc);border-radius:14px;padding:10px 12px;font-size:12px}.op-clock-line span{color:var(--text3,#64748b);font-weight:800}.op-clock-line b{font-family:var(--fm,monospace);font-weight:900;color:var(--text,#111827)}
.op-clock-timeline{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px}.op-clock-timeline div{border-radius:14px;padding:10px 12px;background:rgba(13,148,136,.08);border:1px solid rgba(13,148,136,.18);font-weight:900;font-size:12px;color:var(--teal,#0f766e)}
.op-clock-ok,.op-clock-warn,.op-clock-help,.op-clock-auto-note{border-radius:14px;padding:10px 12px;font-size:12px;font-weight:800;line-height:1.6}.op-clock-ok,.op-clock-auto-note{background:rgba(16,185,129,.10);color:#047857;border:1px solid rgba(16,185,129,.22)}.op-clock-warn{background:rgba(245,158,11,.12);color:#92400e;border:1px solid rgba(245,158,11,.28)}.op-clock-help{background:rgba(59,130,246,.08);color:#1d4ed8;border:1px solid rgba(59,130,246,.18);font-weight:700}
@media(max-width:900px){.branch-pro-layout{grid-template-columns:1fr!important}.branch-op-grid{grid-template-columns:1fr!important}.branch-pro-body{padding:12px!important}.op-clock-summary{grid-template-columns:1fr}.branch-pro-modal{width:96vw!important;height:92vh!important}}


/* COSTIX_LAST_UPDATE Phase4 — Operational Clock page migration — 2026-06-02 Africa/Cairo */
.cx-op-clock-note{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin:8px 0 12px;padding:9px 12px;border:1px solid rgba(184,146,42,.28);
  border-radius:14px;background:linear-gradient(135deg,rgba(184,146,42,.12),rgba(45,212,191,.08));
  color:var(--text2,#334155);font-size:12px;font-weight:800;line-height:1.6;
}
.df-op-clock{margin-top:-4px;}


/* COSTIX_LAST_UPDATE Phase Reports Payment Labels + Table Render Cleanup — 2026-06-02 Africa/Cairo
   Clean replacement for Reports UI styles. Matches Call Center light cards/table style, no horizontal mini-table scroll, and supports render-gated reports. */
#page-reports-adv,
#page-reports{background:linear-gradient(180deg,#eaffff 0%,#f7fbfc 55%,#ffffff 100%)!important;color:#173b45!important;}
.reports-cc-root{padding:18px;min-height:100%;background:linear-gradient(180deg,#eaffff 0%,#f7fbfc 56%,#fff 100%);color:#173b45;}
.rpt-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 12px;padding:17px 18px;border-radius:22px;background:linear-gradient(135deg,#ffffff 0%,#eefefe 70%,#fbf3d3 100%);border:1px solid #d7eef2;box-shadow:0 14px 35px rgba(15,23,42,.075);color:#173b45;}
.rpt-hero h2{margin:3px 0 6px;font-size:25px;font-weight:1000;color:#173b45;letter-spacing:-.03em}.rpt-hero p{margin:0;color:#57717a;font-size:12px;font-weight:800}.rpt-eyebrow{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:#e3fbfb;border:1px solid #bcecf0;font-size:11px;font-weight:1000;color:#0f7180}.rpt-top-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.rpt-top-actions .btn{border-radius:12px!important;min-height:38px!important;font-weight:950!important;box-shadow:0 10px 22px rgba(15,23,42,.075)!important}
.rpt-filterbar{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin:0 0 14px;padding:14px;border-radius:22px;background:#ffffff;border:1px solid #d7eef2;box-shadow:0 12px 28px rgba(15,23,42,.06)}
.rpt-filterbar label{display:flex;flex-direction:column;gap:5px;font-size:11px;font-weight:950;color:#173b45}.rpt-filterbar input,.rpt-filterbar select{height:42px;border:1px solid #d8e7eb;border-radius:13px;background:#fff;color:#0f172a;padding:0 11px;font-weight:900;box-shadow:none}.rpt-filterbar input:focus,.rpt-filterbar select:focus{border-color:#14b8c6;box-shadow:0 0 0 3px rgba(20,184,198,.13);outline:0}.rpt-filterbar button{height:42px;border:1px solid #d8e7eb;border-radius:13px;background:#f8fafc;color:#173b45;padding:0 13px;font-weight:950;cursor:pointer}.rpt-filterbar button:hover{background:#e9fbfd;border-color:#bdeff4}.rpt-filterbar button.primary{background:#d7a72f;color:#172033;border-color:#d7a72f;box-shadow:0 8px 18px rgba(215,167,47,.18)}.rpt-dirty{display:inline-flex;align-items:center;height:32px;padding:0 10px;border-radius:999px;background:#fff7d6;color:#8a6400;font-weight:1000;font-size:11px;border:1px solid #f1d36b}
.rpt-branch-filter{position:relative;min-width:220px;display:flex;flex-direction:column;gap:7px;z-index:20}.rpt-branch-trigger{height:56px!important;border-radius:16px!important;border:1px solid #d9e6ec!important;background:#fff!important;color:#0f172a!important;display:grid!important;grid-template-columns:1fr!important;gap:1px!important;text-align:right!important;padding:8px 12px!important;font-family:inherit!important;cursor:pointer!important;box-shadow:0 8px 20px rgba(15,23,42,.055)!important}.rpt-branch-trigger span{font-size:11px;font-weight:950;color:#64748b}.rpt-branch-trigger b{font-size:14px;font-weight:1000;color:#0f172a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rpt-branch-trigger i{font-style:normal;font-size:10px;font-weight:950;color:#64748b}.rpt-branch-filter.active .rpt-branch-trigger{border-color:#d7a72f!important;background:linear-gradient(135deg,#fff8db,#ffffff)!important;box-shadow:0 12px 26px rgba(215,167,47,.18)!important}.rpt-branch-filter.dirty .rpt-branch-trigger{border-color:#f59e0b!important;background:linear-gradient(135deg,#fff7ed,#ffffff)!important}.rpt-branch-filter.dirty .rpt-branch-trigger i{color:#b45309}.rpt-branch-picker{position:absolute;top:62px;right:0;width:min(420px,92vw);background:#fff;border:1px solid #d9e6ec;border-radius:20px;box-shadow:0 24px 60px rgba(15,23,42,.18);padding:12px;display:none;z-index:80}.rpt-branch-picker.open{display:block}.rpt-branch-tools{display:flex;gap:8px;margin-bottom:10px}.rpt-branch-tools button{border:1px solid #d9e6ec;background:#f8fafc;border-radius:12px;padding:8px 10px;font-weight:950;color:#0f172a;cursor:pointer}.rpt-branch-list{max-height:240px;overflow:auto;display:grid;gap:7px;padding:2px 2px 6px}.rpt-branch-list label{display:flex!important;flex-direction:row!important;align-items:center;gap:9px;padding:9px 10px;border:1px solid #e5edf2;border-radius:13px;background:#f8fafc;color:#0f172a!important;font-size:13px!important;font-weight:950!important;cursor:pointer}.rpt-branch-list input{width:18px;height:18px;accent-color:#0f9aa6}.rpt-branch-list label:has(input:checked){border-color:#0f9aa6;background:#e9fbfd}.rpt-branch-apply{display:flex;justify-content:flex-end;gap:8px;border-top:1px solid #edf3f6;padding-top:10px;margin-top:6px}.rpt-branch-chips{display:flex;flex-wrap:wrap;gap:5px}.rpt-branch-chips span{background:#e9fbfd;color:#0f7180;border:1px solid #bdeff4;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:1000}.rpt-branch-filter.active .rpt-branch-chips span{background:#fff7d6;color:#8a6400;border-color:#f1d36b}
.rpt-summary-strip{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}.rpt-summary-strip span{display:inline-flex;gap:5px;align-items:center;padding:8px 11px;border-radius:999px;background:#e9fbfd;border:1px solid #bdeff4;color:#173b45;font-size:12px;font-weight:850}.rpt-summary-strip b{font-family:var(--fm,Consolas,monospace);font-weight:1000;color:#0f7180}
.rpt-tabs{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:10px;margin:0 0 14px}.rpt-tabs button{display:flex;align-items:center;gap:10px;text-align:right;border:1px solid #cdeef1;background:#ffffff;border-radius:18px;padding:12px;cursor:pointer;color:#173b45;box-shadow:0 10px 22px rgba(15,23,42,.055);transition:.16s ease;min-height:72px}.rpt-tabs button:hover{transform:translateY(-1px);background:#e9fbfd;border-color:#98e1e7}.rpt-tabs button.active{background:linear-gradient(135deg,#329999,#3daaaa);color:#fff;border-color:#2b9292;box-shadow:0 12px 26px rgba(48,125,126,.18)}.rpt-tabs button.active small{color:rgba(255,255,255,.78)}.rpt-tabs i{font-style:normal;font-size:22px;line-height:1}.rpt-tabs b{display:block;font-size:13px;font-weight:1000}.rpt-tabs small{display:block;font-size:10px;color:#64748b;margin-top:2px;line-height:1.25;font-weight:800}.rpt-module{animation:rptFade .18s ease}@keyframes rptFade{from{opacity:.55;transform:translateY(4px)}to{opacity:1;transform:none}}
.rpt-section-title{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0 0 12px;padding:14px 16px;border-radius:20px;background:linear-gradient(135deg,#3B9C9C,#48adad);border:1px solid #2e8d8d;color:#fff;box-shadow:0 10px 22px rgba(48,125,126,.13)}.rpt-section-title h3{margin:0 0 4px;font-size:20px;font-weight:1000}.rpt-section-title p{margin:0;font-size:12px;color:rgba(255,255,255,.82);font-weight:800}
.rpt-kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:10px;margin:0 0 14px}.rpt-kpi{appearance:none;text-align:right;border:1px solid #d7eef2;border-radius:20px;padding:14px;background:linear-gradient(180deg,#fff,#f8ffff);color:#173b45;box-shadow:0 10px 24px rgba(15,23,42,.055);cursor:pointer;min-height:104px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.rpt-kpi:before{content:"";position:absolute;inset:auto 0 0 0;height:5px;background:#3B9C9C}.rpt-kpi:hover{background:#f1ffff;transform:translateY(-1px)}.rpt-kpi span{font-size:11px;font-weight:1000;color:#5d7580}.rpt-kpi b{font-size:22px;font-weight:1000;font-family:var(--fm,Consolas,monospace);line-height:1.25;color:#173b45}.rpt-kpi small{font-size:10px;color:#64748b;font-weight:800}.rpt-kpi.good:before{background:#22c55e}.rpt-kpi.bad:before{background:#ef4444}.rpt-kpi.gold:before{background:#d7a72f}.rpt-kpi.blue:before{background:#38a8d8}.rpt-kpi.good b{color:#15803d}.rpt-kpi.bad b{color:#b91c1c}.rpt-kpi.gold b{color:#9a6b00}.rpt-kpi.blue b{color:#0f7180}
.rpt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:12px;margin:0 0 14px}.rpt-card{background:#ffffff;border:1px solid #d7eef2;border-radius:22px;box-shadow:0 12px 28px rgba(15,23,42,.055);overflow:hidden}.rpt-card-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;background:#ffffff;border-bottom:1px solid #d7eef2}.rpt-card-head b{font-size:15px;font-weight:1000;color:#173b45}.rpt-card-head small{display:block;margin-top:3px;font-size:10px;color:#64748b;font-weight:800}.rpt-mini-btn{border:1px solid #bdeff4;border-radius:999px;background:#e9fbfd;color:#0f7180;font-size:11px;font-weight:1000;padding:7px 10px;cursor:pointer}.rpt-mini-btn:hover{background:#d7a72f;border-color:#d7a72f;color:#172033}
.rpt-table-wrap{max-height:430px;overflow:auto;background:#ffffff;border-top:1px solid #d7eef2}.rpt-card .rpt-table-wrap{overflow-y:auto;overflow-x:hidden}.rpt-table{width:100%;border-collapse:separate;border-spacing:0;min-width:0;table-layout:fixed}.rpt-modal-table .rpt-table{min-width:780px;table-layout:auto}.rpt-table th{position:sticky;top:0;z-index:2;background:linear-gradient(180deg,#36aaa8,#2f9999);color:#fff;font-size:11px;font-weight:1000;padding:11px 10px;text-align:right;white-space:nowrap;border-left:1px solid rgba(255,255,255,.2);box-shadow:inset 0 -1px 0 rgba(0,0,0,.08)}.rpt-table td{font-size:12px;padding:11px 10px;border-bottom:1px solid #dff3f5;border-left:1px solid #e8f7f8;color:#173b45;background:#ffffff;font-weight:850;vertical-align:middle;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rpt-table tbody tr:nth-child(even) td{background:#eefdff}.rpt-table tbody tr:hover td{background:#d9f6f8;color:#0f172a}.rpt-table th:first-child,.rpt-table td:first-child{font-weight:1000}.rpt-table .num{text-align:left;font-family:var(--fm,Consolas,monospace);font-weight:1000;white-space:nowrap}.rpt-table .empty{text-align:center;color:#64748b;padding:20px!important;background:#fff!important}.rpt-pill{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:1000;background:#e9fbfd;border:1px solid #bdeff4;color:#0f7180}.rpt-pill.good{background:#dcfce7;color:#15803d;border-color:#bbf7d0}.rpt-pill.warn{background:#fff7d6;color:#8a6400;border-color:#f1d36b}.rpt-pill.bad{background:#fee2e2;color:#b91c1c;border-color:#fecaca}
.rpt-modal-bg{z-index:2147483640}.rpt-modal{max-width:min(1120px,94vw)!important;width:min(1120px,94vw)!important;max-height:88vh;display:flex;flex-direction:column;border-radius:26px!important;background:#fff!important;color:#173b45!important;box-shadow:0 30px 90px rgba(15,23,42,.22)!important}.rpt-modal-note{margin:4px 0 12px;color:#64748b;font-size:12px}.rpt-modal-table{overflow:auto;border-radius:18px;border:1px solid #d7eef2;max-height:62vh}.rpt-modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px;flex-wrap:wrap}
@media(max-width:900px){.rpt-filterbar{align-items:stretch}.rpt-filterbar label,.rpt-filterbar input,.rpt-filterbar select,.rpt-filterbar button,.rpt-branch-filter{width:100%;min-width:100%}.rpt-branch-picker{right:auto;left:0;width:calc(100vw - 40px)}.rpt-tabs{grid-template-columns:1fr 1fr}.rpt-grid{grid-template-columns:1fr}.rpt-kpi-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.reports-cc-root{padding:12px}.rpt-hero{padding:14px}.rpt-hero h2{font-size:21px}.rpt-tabs{grid-template-columns:1fr}.rpt-kpi-grid{grid-template-columns:1fr}.rpt-table{min-width:680px}}


/* ═══════════════════════════════════════════════════════════════
   COSTIX_LAST_UPDATE Phase_Settings1_Fix_Professional_Cockpit_20260604
   Professional Settings Cockpit — centralized UI styles for settings_enhanced.js.
   Ownership: settings page shows users/roles/permissions/audit and links to existing settings pages without duplicating their logic.
═══════════════════════════════════════════════════════════════ */
.setpro-command{
  --setpro-ink:#0f172a;
  --setpro-soft:#64748b;
  --setpro-line:rgba(15,23,42,.10);
  --setpro-card:#ffffff;
  --setpro-card2:#f8fafc;
  --setpro-teal:#0f766e;
  --setpro-gold:#b8922a;
  padding:8px 0 30px;
  direction:rtl;
}
.setpro-command *{box-sizing:border-box}
.setpro-hero-pro{
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  min-height:158px;
  padding:28px 30px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.28);
  background:
    radial-gradient(circle at 12% 16%, rgba(224,192,96,.45), transparent 34%),
    radial-gradient(circle at 82% 8%, rgba(20,184,166,.35), transparent 34%),
    linear-gradient(135deg,#0f172a 0%,#134e4a 55%,#0f766e 100%);
  box-shadow:0 24px 60px rgba(15,23,42,.18);
  color:#fff;
  margin-bottom:14px;
}
.setpro-hero-pro:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(255,255,255,.10),transparent 45%,rgba(255,255,255,.08));
  pointer-events:none;
}
.setpro-hero-main,.setpro-action-row{position:relative;z-index:1}
.setpro-hero-main{min-width:0;max-width:780px}
.setpro-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.22);
  color:#fde68a;
  font-size:11px;
  font-weight:900;
  padding:6px 12px;
  border-radius:999px;
  margin-bottom:12px;
  letter-spacing:.2px;
}
.setpro-title{
  font-size:34px;
  line-height:1.18;
  font-weight:950;
  color:#fff;
  letter-spacing:-.7px;
  margin:0;
}
.setpro-sub{
  max-width:720px;
  font-size:13px;
  color:rgba(255,255,255,.78);
  margin-top:8px;
  line-height:1.85;
}
.setpro-action-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:flex-start}
.setpro-action-row .btn{
  border-radius:14px;
  min-height:36px;
  box-shadow:0 12px 25px rgba(15,23,42,.12);
}
.setpro-hero-pro .btn-ghost{
  background:rgba(255,255,255,.13);
  color:#fff;
  border-color:rgba(255,255,255,.22);
}
.setpro-hero-pro .btn-teal{background:#14b8a6;color:#062b27;border-color:transparent}
.setpro-kpis-pro{
  display:grid;
  grid-template-columns:repeat(5,minmax(160px,1fr));
  gap:12px;
  margin:0 0 14px;
}
.setpro-kpi{
  position:relative;
  overflow:hidden;
  display:block;
  width:100%;
  border:1px solid rgba(15,23,42,.08);
  border-radius:22px;
  padding:15px 16px 14px;
  text-align:right;
  min-height:104px;
  background:linear-gradient(180deg,#fff,#f8fafc);
  box-shadow:0 18px 40px rgba(15,23,42,.07);
}
.setpro-kpi:before{
  content:"";
  position:absolute;
  inset:auto 14px 12px auto;
  width:44px;
  height:5px;
  border-radius:999px;
  background:linear-gradient(90deg,#b8922a,#14b8a6);
  opacity:.75;
}
.setpro-kpi-click{cursor:pointer;transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease}
.setpro-kpi-click:hover{transform:translateY(-3px);box-shadow:0 24px 55px rgba(15,23,42,.12);border-color:rgba(184,146,42,.34)}
.setpro-kpi .l{font-size:11px;color:#64748b;font-weight:900}
.setpro-kpi .v{font-size:30px;font-weight:950;margin-top:5px;color:#0f172a;font-family:var(--fm)}
.setpro-kpi .h{font-size:10.5px;color:#64748b;margin-top:7px;line-height:1.55}
.setpro-kpi.is-warn{border-color:rgba(245,158,11,.32);background:linear-gradient(180deg,#fff,rgba(245,158,11,.08))}
.setpro-kpi-date{font-size:17px!important;color:#b8922a!important}
.setpro-tabs-pro{
  position:sticky;
  top:0;
  z-index:6;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  padding:10px;
  margin:0 0 16px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:20px;
  background:rgba(255,255,255,.78);
  backdrop-filter:blur(14px);
  box-shadow:0 14px 34px rgba(15,23,42,.06);
}
.setpro-tab{
  border:1px solid transparent;
  background:transparent;
  color:#475569;
  padding:10px 14px;
  border-radius:14px;
  cursor:pointer;
  font-weight:900;
  font-size:12px;
  transition:.16s ease;
}
.setpro-tab:hover{background:#f1f5f9;color:#0f172a}
.setpro-tab.on{background:linear-gradient(135deg,#b8922a,#e0c060);color:#111827;border-color:transparent;box-shadow:0 10px 24px rgba(184,146,42,.24)}
.setpro-body{min-height:340px}
.setpro-dashboard-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(320px,.8fr);gap:16px;align-items:start}
.setpro-panel{
  background:rgba(255,255,255,.92);
  border:1px solid rgba(15,23,42,.08);
  border-radius:24px;
  overflow:hidden;
  box-shadow:0 18px 45px rgba(15,23,42,.07);
}
.setpro-panel-main{grid-row:span 2}
.setpro-panel-head{
  padding:17px 18px;
  border-bottom:1px solid rgba(15,23,42,.07);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  background:linear-gradient(180deg,rgba(248,250,252,.95),rgba(255,255,255,.88));
}
.setpro-toolbar{align-items:flex-end}
.setpro-card-t{font-size:16px;font-weight:950;color:#0f172a}
.setpro-muted{font-size:11px;color:#64748b;line-height:1.65}
.setpro-alert-stack{display:grid;gap:10px;padding:16px 18px}
.setpro-alert{border-radius:16px;padding:12px 13px;font-size:12px;font-weight:850;border:1px solid rgba(15,23,42,.08)}
.setpro-alert.ok{background:rgba(5,150,105,.08);border-color:rgba(5,150,105,.18);color:#047857}
.setpro-alert.warn{background:rgba(245,158,11,.09);border-color:rgba(245,158,11,.24);color:#a16207}
.setpro-alert.danger{background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.22);color:#dc2626}
.setpro-owner-box{
  margin:0 18px 18px;
  padding:16px;
  border-radius:22px;
  background:linear-gradient(135deg,rgba(15,118,110,.10),rgba(184,146,42,.13));
  border:1px solid rgba(15,118,110,.16);
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:center;
}
.setpro-owner-box p{margin:5px 0 0;font-size:12px;color:#64748b;line-height:1.7}
.setpro-owner-user{display:grid;gap:3px;min-width:170px;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:16px;padding:11px 13px;box-shadow:0 10px 25px rgba(15,23,42,.06)}
.setpro-owner-user span{font-weight:950;color:#0f172a}.setpro-owner-user small{color:#64748b;font-family:var(--fm)}
.setpro-owner-list{display:grid;gap:9px;padding:15px}
.setpro-owner-row{width:100%;border:1px solid rgba(15,23,42,.08);background:#f8fafc;border-radius:16px;padding:12px 13px;display:flex;justify-content:space-between;align-items:center;gap:10px;text-align:right;cursor:pointer;color:#0f172a;transition:.16s ease}
.setpro-owner-row:hover{background:#fff;border-color:rgba(184,146,42,.34);box-shadow:0 12px 25px rgba(15,23,42,.07)}
.setpro-owner-row span{font-size:12px;font-weight:950}.setpro-owner-row small{font-size:10.5px;color:#64748b}.setpro-owner-row.is-static{cursor:default}.setpro-owner-row.is-static:hover{background:#f8fafc;border-color:rgba(15,23,42,.08);box-shadow:none}
.setpro-audit-mini{padding:13px 18px}.setpro-audit-item{padding:10px 0;border-bottom:1px solid rgba(15,23,42,.07)}.setpro-audit-item:last-child{border-bottom:0}.setpro-audit-item b{display:block;font-size:12px}.setpro-audit-item span,.setpro-audit-item small{display:block;color:#64748b;font-size:10.5px;margin-top:2px}
.setpro-map-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.setpro-map-card{background:linear-gradient(180deg,#fff,#f8fafc);border:1px solid rgba(15,23,42,.08);border-radius:24px;padding:18px;box-shadow:0 18px 45px rgba(15,23,42,.07);display:flex;flex-direction:column;gap:13px;min-height:270px;transition:.16s ease}
.setpro-map-card:hover{transform:translateY(-2px);box-shadow:0 26px 60px rgba(15,23,42,.10);border-color:rgba(15,118,110,.24)}
.setpro-map-card.is-future{background:linear-gradient(180deg,#fff,rgba(124,58,237,.05));border-color:rgba(124,58,237,.18)}
.setpro-map-top{display:flex;gap:13px;align-items:flex-start}.setpro-map-icon{width:50px;height:50px;border-radius:18px;background:linear-gradient(135deg,rgba(184,146,42,.20),rgba(20,184,166,.15));display:grid;place-items:center;font-size:24px;flex:0 0 auto}.setpro-map-card h3{margin:0 0 6px;font-size:16px;font-weight:950;color:#0f172a}.setpro-map-card p{margin:0;color:#64748b;font-size:12px;line-height:1.75}
.setpro-map-meta{display:flex;justify-content:space-between;gap:10px;border:1px solid rgba(15,23,42,.07);background:#f8fafc;border-radius:15px;padding:10px 11px}.setpro-map-meta span{font-size:10.5px;color:#64748b;font-weight:900}.setpro-map-meta b{font-size:11px;color:#0f172a;text-align:left}
.setpro-chip-row{display:flex;gap:6px;flex-wrap:wrap}.perm-chip{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border-radius:999px;background:#f1f5f9;border:1px solid rgba(15,23,42,.07);font-size:10.5px;color:#334155;margin:2px;font-weight:850}.setpro-map-actions{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:9px}
.setpro-search-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.setpro-search{width:min(320px,45vw);border-radius:14px!important;background:#fff!important}
.setpro-table-wrap{max-height:64vh;overflow:auto}.setpro-table{border-collapse:separate!important;border-spacing:0 7px!important}.setpro-table th{position:sticky;top:0;z-index:2;background:#f8fafc!important;color:#334155!important;font-size:11px!important}.setpro-table td{background:#fff!important;border-top:1px solid rgba(15,23,42,.06)!important;border-bottom:1px solid rgba(15,23,42,.06)!important}.setpro-table tr td:first-child{border-radius:0 14px 14px 0;border-right:1px solid rgba(15,23,42,.06)!important}.setpro-table tr td:last-child{border-radius:14px 0 0 14px;border-left:1px solid rgba(15,23,42,.06)!important}
.setpro-user-cell{display:grid;gap:4px}.setpro-user-cell b{font-size:13px;color:#0f172a}.setpro-user-cell span{font-size:11px;color:#64748b;font-family:var(--fm)}.setpro-user-cell em{font-style:normal;width:max-content;background:rgba(184,146,42,.13);border:1px solid rgba(184,146,42,.23);color:#a16207;padding:3px 8px;border-radius:999px;font-size:10px;font-weight:950}
.setpro-branches-text{display:block;max-width:280px;white-space:normal;color:#334155;font-size:11.5px;line-height:1.55}.setpro-pill{border:0;font-size:10.5px;border-radius:999px;padding:5px 10px;background:rgba(15,118,110,.10);color:#0f766e;font-weight:950;cursor:pointer}.setpro-pill:hover{background:rgba(15,118,110,.16)}
.setpro-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}.setpro-card{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:22px;overflow:hidden;box-shadow:0 14px 32px rgba(15,23,42,.06)}.setpro-card-h{padding:15px 16px;border-bottom:1px solid rgba(15,23,42,.07);display:flex;align-items:center;justify-content:space-between;gap:10px;background:#f8fafc}.setpro-card-b{padding:15px 16px}.setpro-role-card{min-height:205px}.setpro-role-card.is-owner-note{border-color:rgba(124,58,237,.24);background:linear-gradient(180deg,#fff,rgba(124,58,237,.05))}
.perm-box{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}.perm-group{background:#f8fafc;border:1px solid rgba(15,23,42,.08);border-radius:18px;padding:12px}.perm-group-title{font-size:12px;font-weight:950;margin-bottom:9px;color:#0f766e;display:flex;justify-content:space-between;gap:8px}.perm-line{display:flex;align-items:center;gap:9px;padding:8px;border-radius:12px;cursor:pointer}.perm-line:hover{background:#fff}.perm-line span{font-size:11.5px;color:#334155}
.setpro-branch-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:12px;padding:18px}.setpro-branch-summary div{position:relative;overflow:hidden;background:linear-gradient(180deg,#fff,#f8fafc);border:1px solid rgba(15,23,42,.08);border-radius:20px;padding:15px;box-shadow:0 12px 28px rgba(15,23,42,.05)}.setpro-branch-summary div:after{content:"";position:absolute;inset:auto 14px 12px auto;width:34px;height:4px;border-radius:999px;background:#0f766e;opacity:.45}.setpro-branch-summary span{display:block;font-size:10.5px;color:#64748b;font-weight:950;margin-bottom:6px}.setpro-branch-summary b{font-size:14px;color:#0f172a}
.setpro-modal-wide{width:min(980px,94vw)!important;max-width:980px!important;max-height:88vh!important;overflow:auto!important;border-radius:24px!important}.mono{font-family:var(--fm);font-size:11px}.goldish{color:#b8922a!important}.empty{text-align:center;color:#64748b;padding:20px!important}.tag{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:4px 9px;font-size:10.5px;font-weight:950}.tag-g{background:rgba(5,150,105,.10);color:#047857}.tag-r{background:rgba(220,38,38,.10);color:#dc2626}
@media(max-width:1200px){.setpro-kpis-pro{grid-template-columns:repeat(2,minmax(0,1fr))}.setpro-dashboard-grid{grid-template-columns:1fr}.setpro-panel-main{grid-row:auto}.setpro-toolbar{align-items:flex-start;flex-direction:column}.setpro-search{width:100%}}
@media(max-width:720px){.setpro-hero-pro{flex-direction:column;align-items:flex-start;padding:22px}.setpro-title{font-size:26px}.setpro-kpis-pro{grid-template-columns:1fr}.setpro-map-grid{grid-template-columns:1fr}.setpro-owner-box{flex-direction:column;align-items:stretch}.setpro-tabs-pro{position:relative}.setpro-tab{flex:1 1 auto}.setpro-panel-head{flex-direction:column;align-items:flex-start}.setpro-map-actions{flex-direction:column;align-items:stretch}.setpro-search-actions{width:100%}.setpro-search-actions .btn{width:100%}}

/* COSTIX_LAST_UPDATE Phase_Settings2_SuperOwner_PermissionSourceCleanup_20260604 */
.setpro-user-cell em.is-owner{background:linear-gradient(135deg,rgba(248,200,75,.22),rgba(245,158,11,.12));border-color:rgba(245,158,11,.35);color:#92400e;}
.setpro-role-card.is-owner-note{border-color:rgba(245,158,11,.35)!important;background:linear-gradient(180deg,#fff,rgba(248,200,75,.08))!important;}

/* COSTIX_LAST_UPDATE Phase_Settings3_AuditLog_PermissionsUX_20260604 */
.setpro-audit-shell{display:grid;gap:16px}.setpro-audit-hero{position:relative;overflow:hidden;border-radius:26px;border:1px solid rgba(15,23,42,.08);background:linear-gradient(135deg,#0f172a,#134e4a 58%,#0f766e);color:#fff;padding:22px 24px;display:flex;justify-content:space-between;gap:18px;align-items:flex-end;box-shadow:0 22px 55px rgba(15,23,42,.16)}
.setpro-audit-hero h3{margin:0;font-size:24px;font-weight:950;color:#fff}.setpro-audit-hero p{margin:6px 0 0;color:rgba(255,255,255,.78);font-size:12px;line-height:1.8;max-width:720px}.setpro-audit-hero .btn-ghost{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.20)}
.setpro-audit-kpis{display:grid;grid-template-columns:repeat(5,minmax(130px,1fr));gap:10px}.setpro-audit-kpis div{border:1px solid rgba(15,23,42,.08);border-radius:19px;background:linear-gradient(180deg,#fff,#f8fafc);padding:13px 14px;box-shadow:0 12px 28px rgba(15,23,42,.05)}.setpro-audit-kpis b{display:block;font-size:24px;color:#0f172a;font-family:var(--fm);font-weight:950}.setpro-audit-kpis span{display:block;font-size:10.5px;color:#64748b;font-weight:900;margin-top:3px}.setpro-audit-kpis .is-warn{border-color:rgba(245,158,11,.35);background:linear-gradient(180deg,#fff,rgba(245,158,11,.08))}
.setpro-audit-type{display:inline-flex;border-radius:999px;padding:4px 9px;font-size:10px;font-weight:950;text-transform:uppercase;background:#f1f5f9;color:#475569}.setpro-audit-type.user{background:rgba(14,165,233,.10);color:#0369a1}.setpro-audit-type.role,.setpro-audit-type.permission{background:rgba(124,58,237,.10);color:#6d28d9}.setpro-audit-type.branch{background:rgba(15,118,110,.10);color:#0f766e}.setpro-audit-type.security{background:rgba(220,38,38,.10);color:#dc2626}.setpro-audit-table td b{display:block;font-size:12px}.setpro-audit-table td small{display:block;margin-top:3px;color:#94a3b8}
.setpro-user-modal{padding:0!important;overflow:hidden!important}.setpro-user-modal form{max-height:calc(88vh - 128px);overflow-y:auto;padding:0 20px 18px}.setpro-modal-head{padding:20px 22px;background:linear-gradient(135deg,rgba(15,118,110,.10),rgba(184,146,42,.11));border-bottom:1px solid rgba(15,23,42,.08);display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.setpro-modal-head .modal-title{padding:0!important;margin:0!important}.setpro-modal-head p{margin:5px 0 0;color:#64748b;font-size:12px;line-height:1.7}.setpro-owner-badge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:7px 12px;font-size:11px;font-weight:950;background:linear-gradient(135deg,#b8922a,#e0c060);color:#111827;white-space:nowrap}.setpro-owner-badge.muted{background:#f1f5f9;color:#475569;border:1px solid rgba(15,23,42,.08)}
.setpro-form-section{margin:14px 0;border:1px solid rgba(15,23,42,.08);border-radius:20px;background:linear-gradient(180deg,#fff,#f8fafc);padding:14px}.setpro-section-title{font-size:13px;font-weight:950;color:#0f172a;margin-bottom:11px;padding-bottom:9px;border-bottom:1px solid rgba(15,23,42,.07)}.setpro-role-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}.setpro-perm-box{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.setpro-perm-group{background:#fff}.setpro-perm-group .perm-group-title span small{display:inline-flex;margin-inline-start:8px;background:#f1f5f9;color:#64748b;border-radius:999px;padding:3px 7px;font-size:9.5px}.setpro-perm-actions{display:flex;gap:5px;flex-wrap:wrap}.setpro-perm-actions .btn{padding:5px 8px!important;min-height:28px!important}.setpro-perm-group input:disabled+span{opacity:.72}.setpro-perm-group input:disabled{cursor:not-allowed}.setpro-form-section .perm-line{background:#f8fafc;margin-bottom:4px;border:1px solid transparent}.setpro-form-section .perm-line:hover{border-color:rgba(15,118,110,.18)}
@media(max-width:760px){.setpro-audit-hero{flex-direction:column;align-items:stretch}.setpro-audit-kpis{grid-template-columns:1fr 1fr}.setpro-user-modal form{padding:0 12px 14px}.setpro-modal-head{flex-direction:column}.setpro-role-tools{align-items:stretch}.setpro-role-tools .btn{width:100%}}

/* COSTIX_LAST_UPDATE Phase_Settings4_NavPermissionTruth_20260604 — Permissions matrix and user visibility preview. */
.setpro-matrix-shell{display:grid;gap:16px}
.setpro-matrix-hero{align-items:center}
.setpro-matrix-hero-stats{display:grid;grid-template-columns:repeat(2,minmax(120px,1fr));gap:10px;min-width:260px}
.setpro-matrix-hero-stats div{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.18);border-radius:18px;padding:12px 14px;color:#fff;backdrop-filter:blur(8px)}
.setpro-matrix-hero-stats b{display:block;font-size:26px;font-weight:950;font-family:var(--fm);color:#fff}.setpro-matrix-hero-stats span{display:block;font-size:10.5px;color:rgba(255,255,255,.76);font-weight:900;margin-top:3px}.setpro-matrix-hero-stats .is-warn{background:rgba(245,158,11,.18);border-color:rgba(245,158,11,.32)}
.setpro-matrix-preview-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.7fr);gap:16px;align-items:start}
.setpro-visibility-kpis{display:grid;grid-template-columns:repeat(3,minmax(110px,1fr));gap:10px;padding:15px 18px;border-bottom:1px solid rgba(15,23,42,.07)}
.setpro-visibility-kpis div{background:linear-gradient(180deg,#fff,#f8fafc);border:1px solid rgba(15,23,42,.08);border-radius:17px;padding:12px 13px}.setpro-visibility-kpis b{display:block;font-size:24px;font-weight:950;color:#0f172a;font-family:var(--fm)}.setpro-visibility-kpis span{display:block;font-size:10.5px;color:#64748b;font-weight:900;margin-top:3px}
.setpro-preview-lists{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:15px 18px}.setpro-preview-lists>div{border:1px solid rgba(15,23,42,.08);background:#f8fafc;border-radius:18px;padding:13px;max-height:330px;overflow:auto}.setpro-preview-lists h4{margin:0 0 10px;font-size:13px;color:#0f172a;font-weight:950}.setpro-preview-lists span{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;border:1px solid rgba(15,23,42,.07);border-radius:13px;padding:9px 10px;margin-bottom:7px;font-size:11.5px;font-weight:900;color:#334155}.setpro-preview-lists span small{font-size:9.5px;color:#64748b;font-family:var(--fm);direction:ltr;text-align:left}
.setpro-matrix-table td small{display:block;margin-top:4px;color:#64748b;font-size:10px}.setpro-matrix-status{display:inline-flex;align-items:center;border-radius:999px;padding:4px 9px;font-size:10px;font-weight:950}.setpro-matrix-status.ok{background:rgba(5,150,105,.10);color:#047857}.setpro-matrix-status.warn{background:rgba(245,158,11,.12);color:#a16207}.setpro-matrix-status.danger{background:rgba(220,38,38,.10);color:#dc2626}
@media(max-width:980px){.setpro-matrix-preview-grid{grid-template-columns:1fr}.setpro-matrix-hero{align-items:stretch}.setpro-matrix-hero-stats{width:100%}}
@media(max-width:720px){.setpro-matrix-hero-stats,.setpro-visibility-kpis,.setpro-preview-lists{grid-template-columns:1fr}.setpro-preview-lists>div{max-height:none}}

/* COSTIX_LAST_UPDATE Phase_Settings5_RealSidebarPermissionMatrix_20260604
   Settings permission editors mirror the live sidebar groups; moved/hidden pages no longer appear as fake permission groups. */
.setpro-real-nav-perms .perm-group-title span{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
}
.setpro-real-nav-perms .perm-group-title em{
  font-style:normal;
  font-size:9.5px;
  font-weight:900;
  color:#0f766e;
  background:rgba(20,184,166,.11);
  border:1px solid rgba(20,184,166,.18);
  border-radius:999px;
  padding:3px 7px;
}
.setpro-real-nav-perms .perm-group-title em.warn{
  color:#92400e;
  background:rgba(245,158,11,.12);
  border-color:rgba(245,158,11,.22);
}
.setpro-real-nav-perms .perm-group-title em.muted{
  color:#64748b;
  background:#f1f5f9;
  border-color:rgba(100,116,139,.16);
}
.setpro-perm-note{
  margin:0 0 10px;
  padding:8px 10px;
  border-radius:12px;
  background:#fffbeb;
  border:1px solid rgba(245,158,11,.18);
  color:#92400e;
  font-size:11px;
  font-weight:800;
  line-height:1.7;
}
.setpro-perm-group.is-extra{
  background:linear-gradient(180deg,#fff,#fffbeb);
  border-color:rgba(245,158,11,.20);
}
.perm-line.is-extra{
  background:#fffaf0;
}
.perm-line small.mono{
  display:inline-flex;
  margin-inline-start:7px;
  color:#94a3b8;
  font-size:9.5px;
  font-weight:800;
}

/* COSTIX_LAST_UPDATE PhaseLogin1 — Professional single-owner login UI — 2026-06-04
   Centralized login/recovery styling. Login logic owner: auth.js. No inline login CSS in index.html. */
body.costix-auth-pending{padding:0!important;overflow:hidden;background:#061318;}
#loginScreen.costix-login-screen{
  position:fixed!important;inset:0!important;z-index:9999!important;display:none;align-items:center!important;justify-content:center!important;
  min-height:100vh;width:100%;padding:24px;direction:rtl;font-family:'Cairo','Tajawal','Segoe UI',Arial,sans-serif;color:#ecfeff;
  background:
    radial-gradient(circle at 12% 18%,rgba(255,215,128,.18),transparent 28rem),
    radial-gradient(circle at 88% 76%,rgba(20,184,166,.26),transparent 30rem),
    linear-gradient(135deg,#051316 0%,#0b2d31 44%,#102f3d 100%);
  overflow:auto;isolation:isolate;
}
#loginScreen.costix-login-screen:before{content:'';position:fixed;inset:0;pointer-events:none;opacity:.18;background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(circle at center,#000 0%,transparent 78%);}
#loginScreen *{box-sizing:border-box;}
.costix-login-shell{position:relative;z-index:1;width:min(1120px,100%);min-height:min(680px,calc(100vh - 48px));display:grid;grid-template-columns:minmax(380px,440px) minmax(0,1fr);overflow:hidden;border-radius:30px;border:1px solid rgba(255,255,255,.20);background:rgba(6,32,36,.76);box-shadow:0 28px 88px rgba(0,0,0,.42);backdrop-filter:blur(18px);}
.costix-login-main{display:flex;align-items:center;justify-content:center;padding:42px 38px;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(234,250,248,.96));color:#10292d;}
.costix-login-card{width:100%;max-width:380px;margin:0;}
.costix-login-badge{display:inline-flex;align-items:center;gap:8px;margin-bottom:14px;padding:8px 12px;border-radius:999px;background:rgba(12,121,118,.10);border:1px solid rgba(12,121,118,.16);color:#0f5f61;font-weight:900;font-size:12px;}
.costix-login-card h1{margin:0 0 10px;font-size:32px;line-height:1.2;font-weight:950;color:#0f2f35;letter-spacing:-.02em;}
.costix-login-card .lead{margin:0 0 28px;color:#5b7074;font-size:14px;line-height:1.8;font-weight:700;}
.costix-field{margin-bottom:18px;}
.costix-field label{display:block;margin:0 0 8px;color:#1f3c42;font-weight:900;font-size:13px;}
.costix-input-wrap{position:relative;display:block;}
.costix-input-wrap input{width:100%;height:54px;border:1px solid rgba(15,79,84,.16);border-radius:17px;background:#f6fbfb;color:#11383d;font-size:15px;font-weight:800;padding:0 48px 0 52px;outline:none;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;}
.costix-input-wrap input:focus{background:#fff;border-color:#149b9b;box-shadow:0 0 0 4px rgba(20,184,166,.13),0 16px 34px rgba(15,118,110,.10);}
.costix-input-wrap input::placeholder{color:#8ba1a4;font-weight:700;}
.costix-inp-icon{position:absolute;right:17px;top:50%;transform:translateY(-50%);font-size:17px;color:#0b8a8e;pointer-events:none;}
.costix-eye{position:absolute;left:8px;top:50%;transform:translateY(-50%);width:42px;height:42px;border:0;border-radius:13px;background:rgba(20,184,166,.10);color:#0f6b70;display:grid;place-items:center;cursor:pointer;font-size:16px;transition:.18s ease;}
.costix-eye:hover{background:rgba(20,184,166,.18);}
.costix-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-2px 0 22px;color:#5b7074;font-size:12px;font-weight:800;}
.costix-remember{display:flex;align-items:center;gap:8px;cursor:pointer;}
.costix-remember input{accent-color:#0f8f8e;width:17px;height:17px;}
.costix-login-lock-note{color:#8a6a19;background:rgba(245,158,11,.11);border:1px solid rgba(245,158,11,.16);padding:5px 8px;border-radius:999px;white-space:nowrap;}
.costix-login-btn{position:relative;width:100%;height:58px;border:0;border-radius:18px;background:linear-gradient(135deg,#0f7d80,#13a9a8 55%,#d6a83a);color:#fff;font-weight:950;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 18px 38px rgba(15,125,128,.28);transition:transform .16s ease,box-shadow .16s ease,filter .16s ease;}
.costix-login-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 22px 48px rgba(15,125,128,.34);}
.costix-login-btn:disabled{opacity:.72;cursor:not-allowed;filter:saturate(.75);}
.costix-login-btn.is-loading:after{content:'';width:17px;height:17px;border-radius:50%;border:3px solid rgba(255,255,255,.38);border-top-color:#fff;display:inline-block;animation:costixLoginSpin .75s linear infinite;}
@keyframes costixLoginSpin{to{transform:rotate(360deg)}}
.costix-login-btn-arrow{font-size:20px;line-height:1;}
.costix-error{display:none;margin-top:14px;padding:12px 14px;border-radius:15px;background:rgba(239,68,68,.10);border:1px solid rgba(239,68,68,.16);color:#991b1b;font-weight:850;font-size:13px;line-height:1.65;}
.costix-error.is-ok{background:rgba(16,185,129,.11);border-color:rgba(16,185,129,.20);color:#047857;}
.costix-secure{margin-top:20px;padding:16px;border-radius:18px;background:linear-gradient(135deg,rgba(15,125,128,.08),rgba(214,168,58,.10));border:1px solid rgba(15,125,128,.12);}
.costix-secure-title{font-weight:950;color:#17363b;margin-bottom:6px;font-size:13px;}
.costix-secure p{margin:0;color:#647a7d;line-height:1.7;font-size:12px;font-weight:750;}
.costix-brand-panel{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:28px;padding:44px;color:#ecfeff;background:radial-gradient(circle at 22% 18%,rgba(255,215,128,.22),transparent 21rem),linear-gradient(160deg,rgba(8,83,86,.92),rgba(6,39,55,.92));border-right:1px solid rgba(255,255,255,.14);overflow:hidden;}
.costix-brand-panel:after{content:'';position:absolute;inset:auto -120px -160px auto;width:360px;height:360px;border-radius:50%;background:rgba(20,184,166,.16);filter:blur(2px);}
.costix-brand-content,.costix-stats{position:relative;z-index:1;}
.costix-brand-head{display:grid;grid-template-columns:72px 1fr;gap:16px;align-items:center;margin-bottom:36px;}
.costix-brand-logo-main{width:72px;height:72px;border-radius:22px;object-fit:contain;background:rgba(255,255,255,.94);box-shadow:0 18px 35px rgba(0,0,0,.24);}
.costix-brand-wordmark{font-size:34px;font-weight:1000;letter-spacing:.06em;color:#fff;line-height:1;}
.costix-brand-wordmark span{color:#f5c960;}
.costix-brand-subtitle{margin-top:8px;color:rgba(236,254,255,.72);font-size:12px;font-weight:800;letter-spacing:.04em;}
.costix-tagline{margin:0 0 16px;font-size:42px;line-height:1.2;font-weight:1000;letter-spacing:-.03em;max-width:620px;}
.costix-tagline span{color:#f5c960;}
.costix-desc{max-width:620px;margin:0 0 28px;color:rgba(236,254,255,.78);font-size:15px;font-weight:750;line-height:1.9;}
.costix-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.costix-feature-card{padding:16px;border-radius:20px;background:rgba(255,255,255,.085);border:1px solid rgba(255,255,255,.12);min-height:132px;}
.costix-feature-card .ico{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:13px;background:rgba(245,201,96,.18);margin-bottom:12px;}
.costix-feature-card b{display:block;color:#fff;font-size:13px;font-weight:950;margin-bottom:6px;}
.costix-feature-card p{margin:0;color:rgba(236,254,255,.70);font-size:12px;line-height:1.65;font-weight:700;}
.costix-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.costix-stat{padding:16px 12px;border-radius:18px;background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.12);text-align:center;}
.costix-stat strong{display:block;color:#f5c960;font-size:20px;font-weight:1000;line-height:1;direction:ltr;}
.costix-stat span{display:block;margin-top:7px;color:rgba(236,254,255,.74);font-size:11px;font-weight:850;}
.costix-recovery-shell{grid-template-columns:1fr!important;max-width:720px!important;min-height:auto!important;}
.costix-recovery-card{max-width:560px!important;}
.costix-recovery-warning{margin:0 0 18px;padding:14px;border-radius:16px;border:1px solid rgba(245,158,11,.24);background:rgba(245,158,11,.12);color:#7a4d00;font-size:13px;line-height:1.8;font-weight:800;}
.costix-secondary-login-btn{width:100%;height:48px;margin-top:10px;border:1px solid rgba(15,125,128,.18);border-radius:16px;background:#fff;color:#0f6064;font-weight:950;cursor:pointer;}
.costix-ltr-input{direction:ltr!important;text-align:left!important;}
@media (max-width:980px){#loginScreen.costix-login-screen{padding:16px;align-items:flex-start}.costix-login-shell{grid-template-columns:1fr;width:min(520px,100%);min-height:auto}.costix-brand-panel{display:none}.costix-login-main{padding:34px 24px}.costix-login-card h1{font-size:28px}}
@media (max-width:520px){#loginScreen.costix-login-screen{padding:0}.costix-login-shell{min-height:100vh;border-radius:0;border:0}.costix-login-main{padding:28px 18px}.costix-login-card h1{font-size:25px}.costix-row{align-items:flex-start;flex-direction:column}.costix-login-lock-note{white-space:normal}.costix-input-wrap input{height:52px}.costix-login-btn{height:56px}}

/* COSTIX_LAST_UPDATE PhaseLogin3 — Settings auth diagnostics panel — 2026-06-04 */
.setpro-authdiag-panel{grid-column:1/-1;overflow:hidden}
.setpro-authdiag-badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:8px 12px;font-size:11px;font-weight:950;border:1px solid rgba(15,23,42,.08);white-space:nowrap}
.setpro-authdiag-badge.ok{background:rgba(16,185,129,.12);color:#047857;border-color:rgba(16,185,129,.22)}
.setpro-authdiag-badge.warn{background:rgba(245,158,11,.13);color:#a16207;border-color:rgba(245,158,11,.24)}
.setpro-authdiag-badge.danger{background:rgba(239,68,68,.12);color:#b91c1c;border-color:rgba(239,68,68,.22)}
.setpro-authdiag-grid{display:grid;grid-template-columns:repeat(6,minmax(120px,1fr));gap:10px;padding:14px 16px;border-top:1px solid rgba(15,23,42,.06)}
.setpro-authdiag-grid>div{background:linear-gradient(180deg,#fff,#f8fafc);border:1px solid rgba(15,23,42,.08);border-radius:16px;padding:12px 12px;min-height:74px}
.setpro-authdiag-grid span{display:block;font-size:10px;font-weight:950;color:#64748b;margin-bottom:6px}
.setpro-authdiag-grid b{display:block;font-size:13px;font-weight:950;color:#0f172a;direction:ltr;text-align:right;word-break:break-word}
.setpro-authdiag-note{margin:0 16px 12px;border-radius:16px;padding:12px 13px;font-size:12px;font-weight:900;line-height:1.7;border:1px solid rgba(15,23,42,.08)}
.setpro-authdiag-note.ok{background:rgba(16,185,129,.09);color:#047857;border-color:rgba(16,185,129,.18)}
.setpro-authdiag-note.warn{background:rgba(245,158,11,.11);color:#92400e;border-color:rgba(245,158,11,.22)}
.setpro-authdiag-api{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:9px;padding:0 16px 14px}
.setpro-authdiag-row{border:1px solid rgba(15,23,42,.08);border-radius:15px;background:#fff;padding:10px 11px}
.setpro-authdiag-row span{display:block;color:#0f172a;font-size:12px;font-weight:950;margin-bottom:5px}
.setpro-authdiag-row small{display:block;color:#64748b;font-size:10px;font-weight:800;line-height:1.55}
.setpro-authdiag-row.token_ready{border-color:rgba(16,185,129,.18);background:linear-gradient(180deg,#fff,rgba(236,253,245,.72))}
.setpro-authdiag-row.local_fallback,.setpro-authdiag-row.missing_token{border-color:rgba(245,158,11,.20);background:linear-gradient(180deg,#fff,rgba(255,251,235,.78))}
.setpro-authdiag-panel .setpro-action-row{padding:0 16px 16px}
@media(max-width:1100px){.setpro-authdiag-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.setpro-authdiag-grid,.setpro-authdiag-api{grid-template-columns:1fr}.setpro-authdiag-badge{width:100%;justify-content:center}.setpro-authdiag-panel .setpro-panel-head{align-items:stretch;flex-direction:column}}