/*
 * Final reference UI layer.
 * Visual-only: this file deliberately does not alter application data, routes,
 * permissions, API calls, accounting rules, or document semantics.
 */
:root {
  --ref-brown-950: #3a210e;
  --ref-brown-900: #4d2c0c;
  --ref-brown-800: #683d0d;
  --ref-brown-700: #82500f;
  --ref-honey-600: #ad7019;
  --ref-honey-500: #c88c2c;
  --ref-gold-400: #e6b85a;
  --ref-gold-200: #f5dfad;
  --ref-cream-100: #fff9ed;
  --ref-cream-200: #fbf2e2;
  --ref-canvas: #f8f5ef;
  --ref-white: #fffefb;
  --ref-ink: #232530;
  --ref-muted: #777161;
  --ref-line: #ece5da;
  --ref-green: #23935d;
  --ref-red: #c44c3d;
  --ref-blue: #2f72ac;
  --ref-radius-sm: 8px;
  --ref-radius: 12px;
  --ref-radius-lg: 16px;
  --ref-shadow: 0 8px 28px rgba(83, 52, 18, .08);
  --ref-shadow-hover: 0 14px 36px rgba(83, 52, 18, .14);
  --ref-sidebar: 210px;
}

html { color-scheme: light; background: var(--ref-canvas); }
body {
  color: var(--ref-ink) !important;
  background: radial-gradient(circle at 83% 0, #fff7e7 0, transparent 27%), var(--ref-canvas) !important;
  font-family: "Segoe UI", Tahoma, Arial, sans-serif !important;
  direction: rtl;
}
body, button, input, select, textarea { letter-spacing: 0; }
::selection { color: #fff; background: var(--ref-honey-600); }
* { scrollbar-color: #d5b77e #f6f0e6; scrollbar-width: thin; }

/* The shared reference controls replace every legacy control surface. */
button, .button, input, select, textarea, dialog, .card, .panel, table, details {
  font-family: inherit !important;
}
button, .button {
  min-height: 42px !important;
  border: 1px solid transparent !important;
  border-radius: var(--ref-radius-sm) !important;
  padding: 9px 16px !important;
  background: linear-gradient(135deg, var(--ref-brown-700), var(--ref-brown-900)) !important;
  color: #fff !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 12px rgba(93, 52, 9, .12) !important;
  transition: transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease !important;
}
button:hover, .button:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(93, 52, 9, .22) !important; }
button:active, .button:active { transform: translateY(0); }
button:focus-visible, .button:focus-visible, a:focus-visible, summary:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid rgba(230, 184, 90, .48) !important;
  outline-offset: 2px !important;
}
button:disabled, .button:disabled { opacity: .48 !important; filter: grayscale(.35); cursor: not-allowed !important; box-shadow: none !important; transform: none !important; }
button.secondary, .button.secondary, .secondary,
button.cancel, button.clear, .cancel, .clear {
  color: var(--ref-brown-800) !important;
  background: var(--ref-white) !important;
  border-color: #e3d4bc !important;
  box-shadow: none !important;
}
button.secondary:hover, .button.secondary:hover, .secondary:hover { background: #fff5df !important; border-color: #cda66a !important; }
button.delete, button.remove, button.danger, .delete, .remove, .danger {
  color: #a34434 !important; background: #fff2ed !important; border-color: #edcfc4 !important; box-shadow: none !important;
}
.icon-button { background: #fffdf9 !important; color: var(--ref-brown-800) !important; border-color: var(--ref-line) !important; }

input, select, textarea {
  min-height: 44px !important;
  border: 1px solid #ddd4c7 !important;
  border-radius: var(--ref-radius-sm) !important;
  padding: 10px 12px !important;
  color: var(--ref-ink) !important;
  background: #fffefc !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9) !important;
  transition: border-color .16s, box-shadow .16s, background .16s !important;
}
input:hover, select:hover, textarea:hover { border-color: #cbb488 !important; }
input:focus, select:focus, textarea:focus { border-color: var(--ref-honey-500) !important; box-shadow: 0 0 0 3px rgba(230,184,90,.2) !important; }
input:disabled, select:disabled, textarea:disabled { background: #f1eee8 !important; color: #938b7e !important; }
label { color: #5d5447 !important; font-weight: 650 !important; }
fieldset { border: 1px solid var(--ref-line) !important; background: #fdfaf4 !important; border-radius: var(--ref-radius) !important; }
legend { color: var(--ref-brown-800) !important; font-weight: 800 !important; padding-inline: 8px; }

.card, .panel {
  background: rgba(255, 254, 251, .98) !important;
  border: 1px solid var(--ref-line) !important;
  border-radius: var(--ref-radius) !important;
  box-shadow: var(--ref-shadow) !important;
}
.card:hover { border-color: #e3d4bc !important; }
.tag, .state, .badge, .count {
  border-radius: 6px !important;
  border: 1px solid #edd9ae !important;
  background: #fff5d9 !important;
  color: #93631e !important;
  font-weight: 700 !important;
}
.state.paid, .state.sent, .state.success { color: var(--ref-green) !important; background: #eaf8ef !important; border-color: #cce8d5 !important; }
.state.conflict, .state.error, .state.cancelled { color: #a74938 !important; background: #fff0eb !important; border-color: #efcfc4 !important; }
.empty-state, .empty, .not-found, .no-results {
  color: var(--ref-muted) !important; background: #fffcf6 !important; border: 1px dashed #dfcfb3 !important; border-radius: var(--ref-radius) !important;
}

/* Exact application frame: left navigation and RTL work area. */
#workspace {
  display: grid !important;
  grid-template-columns: var(--ref-sidebar) minmax(0, 1fr) !important;
  direction: ltr !important;
  min-height: 100dvh;
  background: var(--ref-canvas);
}
.app-sidebar {
  direction: rtl !important;
  position: sticky !important;
  inset-block-start: 0;
  height: 100dvh !important;
  padding: 12px 8px 0 !important;
  background: linear-gradient(180deg, #fffaf0 0%, #fff8ec 56%, #f4e2c1 100%) !important;
  border-inline-end: 1px solid #ead9bd !important;
  box-shadow: 8px 0 32px rgba(85,51,12,.06) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}
.app-sidebar > .brand {
  min-height: 145px;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center;
  gap: 4px !important;
  padding: 2px 8px 14px !important;
  margin: 0 0 6px !important;
  text-align: center;
  border: 0 !important;
  color: var(--ref-brown-950) !important;
}
.app-sidebar > .brand img {
  content: url('/store/images/logo-transparent.png');
  width: 86px !important;
  height: 82px !important;
  padding: 0 !important;
  object-fit: contain !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}
.app-sidebar > .brand span { font-size: 0 !important; }
.app-sidebar > .brand span::before { content: 'متجر العسل الطبيعي'; display: block; font-size: 16px; font-weight: 900; line-height: 1.55; }
.app-sidebar > .brand small { font-size: 0 !important; }
.app-sidebar > .brand small::before { content: 'عسل · مكسرات · زيوت طبيعية'; display: block; font-size: 9px; font-weight: 600; color: #806948; }
.app-sidebar nav { display: flex !important; flex-direction: column !important; gap: 2px !important; }
.app-sidebar .nav-caption { display: none !important; }
.app-sidebar nav button, .app-sidebar nav a {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 11px !important;
  position: relative !important;
  min-height: 45px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 9px 12px !important;
  color: #22242a !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  text-decoration: none !important;
  text-align: right !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  transform: none !important;
}
.app-sidebar nav button::after, .app-sidebar nav a::after { content: '‹'; margin-inline-start: auto; color: #a17027; font-size: 18px; }
.app-sidebar nav button:hover, .app-sidebar nav a:hover { color: var(--ref-brown-900) !important; background: #f5e8d1 !important; }
.app-sidebar nav button.active {
  color: #fff !important;
  background: linear-gradient(135deg, #9a6215, #673500) !important;
  box-shadow: 0 7px 18px rgba(112,65,7,.25) !important;
}
.app-sidebar nav button.active::after { color: #fff; }
.app-sidebar nav .ui-icon { width: 21px !important; height: 21px !important; flex: 0 0 21px !important; }
#logout { margin-top: 8px !important; border-top: 1px solid #ead8bc !important; border-radius: 0 !important; }
.sidebar-foot {
  min-height: 210px !important;
  margin: 10px -8px 0 !important;
  padding: 128px 14px 12px !important;
  background: linear-gradient(180deg, transparent 42%, rgba(255,249,237,.96) 74%), url('/store/images/yemen-city.jpeg') center top / cover no-repeat !important;
  border-radius: 0 !important;
  text-align: center;
}
.sidebar-foot img { display: none !important; }
.sidebar-foot p { margin: 0 0 4px !important; color: #6e491d !important; font-size: 10px !important; line-height: 1.8 !important; }
.sidebar-foot small { color: #8d7756 !important; font-size: 9px !important; }

.app-canvas {
  direction: rtl !important;
  min-width: 0 !important;
  padding: 10px 16px 26px !important;
  background: radial-gradient(circle at 75% 0, #fff7e5 0, transparent 27%), var(--ref-canvas) !important;
}
.app-topbar {
  position: sticky !important;
  top: 8px !important;
  z-index: 50 !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  min-height: 60px !important;
  height: auto !important;
  margin: 0 0 10px !important;
  padding: 8px 14px !important;
  border: 1px solid var(--ref-line) !important;
  border-radius: 10px !important;
  background: rgba(255,254,251,.92) !important;
  box-shadow: 0 7px 24px rgba(74,46,15,.08) !important;
  backdrop-filter: blur(14px);
}
.topbar-user { order: 1; display: flex !important; align-items: center !important; gap: 10px !important; padding-inline-start: 14px !important; border-inline-start: 1px solid var(--ref-line) !important; }
.avatar { width: 40px !important; height: 40px !important; border-radius: 50% !important; color: var(--ref-brown-800) !important; background: linear-gradient(145deg, #fff7e7, #ead5ad) !important; }
.topbar-user strong { color: #24242b !important; font-size: 13px !important; }
.topbar-user small { color: var(--ref-muted) !important; font-size: 9px !important; }
.topbar-tools { order: 2; display: flex !important; flex-direction: row !important; align-items: center !important; gap: 10px !important; min-width: 0; }
.global-search { order: 3 !important; margin-inline-end: auto !important; width: min(100%, 440px) !important; border: 1px solid #eee6d9 !important; border-radius: 8px !important; background: #faf6ee !important; }
.global-search input { height: 38px !important; min-height: 38px !important; border: 0 !important; background: transparent !important; box-shadow: none !important; }
.global-search::after { content: '⌕'; order: -1; padding-inline: 10px; color: #815316; font-size: 22px; }
.global-search kbd { border: 1px solid #e1d7c7 !important; color: #7c7468 !important; background: #fff !important; }
.date-chip { order: 1 !important; min-height: 38px; display: inline-flex; align-items: center; padding: 8px 12px !important; background: #fff !important; border: 1px solid var(--ref-line) !important; border-radius: 7px !important; font-weight: 700; }
.date-chip::after { content: '▣'; margin-inline-start: 9px; color: var(--ref-brown-700); }
#openAlerts { order: 2 !important; min-width: 46px !important; padding-inline: 10px !important; font-size: 0 !important; position: relative; }
#openAlerts::before { content: '♟'; font-size: 20px; transform: rotate(180deg); }
#alertsCount { position: absolute !important; top: -5px; right: -5px; background: #bb332d !important; border: 2px solid #fff !important; }
.operations main { width: 100% !important; max-width: none !important; padding: 0 !important; }
.identity { min-height: 28px !important; margin: 0 2px 8px !important; color: var(--ref-muted) !important; font-size: 10px !important; }
.identity #shiftInfo { border: 1px solid #d5e8d9; background: #edf8ef !important; color: #4d7a58 !important; }
.identity #refresh { min-height: 28px !important; padding: 3px 10px !important; border-radius: 18px !important; }

/* Dashboard: reference composition and proportions. */
[data-section="dashboard"] > .page-heading { display: none !important; }
#dashboardStatus { margin: 0 0 7px !important; min-height: 16px; color: #8a806f !important; font-size: 9px !important; }
.dashboard-top { display: flex !important; flex-direction: column !important; gap: 10px !important; }
.welcome-panel {
  position: relative !important;
  isolation: isolate;
  display: grid !important;
  grid-template-columns: 34% 32% 34% !important;
  align-items: center !important;
  width: 100% !important;
  min-height: 190px !important;
  padding: 22px 36px !important;
  overflow: hidden !important;
  border: 1px solid #e4c99d !important;
  border-radius: 12px !important;
  background:
    linear-gradient(90deg, rgba(255,248,231,.02) 0 31%, rgba(255,247,228,.98) 46% 69%, rgba(246,224,190,.18) 82%),
    url('/store/images/yemen-city.jpeg') right center / 45% 100% no-repeat,
    linear-gradient(120deg, #f4ddae, #fff8e8 58%, #ead0a1) !important;
  box-shadow: 0 10px 30px rgba(92,55,11,.12) !important;
}
.welcome-panel::before {
  content: '';
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  width: 39%;
  height: 100%;
  background: linear-gradient(90deg, rgba(255,245,221,.05), rgba(255,245,221,.1)), url('/store/images/honey-pour.jpeg') center / cover no-repeat;
  filter: saturate(1.02) contrast(.97);
}
.welcome-panel::after {
  content: 'اليمن\A أرض العسل · أرض الخير';
  white-space: pre;
  position: absolute;
  inset-inline-start: 8%;
  bottom: 22px;
  color: #fff;
  font-size: 11px;
  line-height: 1.9;
  font-weight: 800;
  text-align: center;
  text-shadow: 0 2px 8px #41240b;
}
.welcome-panel > div {
  grid-column: 2 !important;
  justify-self: center !important;
  max-width: none !important;
  width: 100%;
  margin: 0 !important;
  padding: 0 10px !important;
  text-align: center !important;
  text-shadow: 0 1px #fff !important;
}
.welcome-panel .eyebrow { color: var(--ref-brown-800) !important; font-size: 13px !important; font-weight: 800; }
.welcome-panel h2 { margin: 2px 0 4px !important; color: var(--ref-brown-950) !important; font-size: clamp(24px, 2.3vw, 34px) !important; line-height: 1.35 !important; font-weight: 900 !important; }
.welcome-panel p { color: #6d471c !important; font-size: 13px !important; font-weight: 700; }
.welcome-panel p::after { content: '◇ جودة عالية   ❧ منتجات طبيعية   ◉ دعم مستمر' !important; display: block; margin-top: 10px !important; font-size: 9px !important; color: #765a32 !important; word-spacing: 4px; }
.welcome-panel button, .welcome-panel > img { display: none !important; }
.metric-grid { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)) !important; gap: 10px !important; width: 100% !important; }
.metric-card {
  display: grid !important;
  grid-template-columns: 42px minmax(0,1fr) !important;
  grid-template-rows: auto auto auto !important;
  align-content: center !important;
  min-height: 115px !important;
  padding: 14px 12px !important;
  border: 1px solid var(--ref-line) !important;
  border-radius: 10px !important;
  background: var(--ref-white) !important;
  box-shadow: 0 6px 20px rgba(71,45,15,.07) !important;
}
.metric-icon { grid-row: 1 / 3; width: 38px !important; height: 38px !important; border-radius: 9px !important; margin: 0 !important; align-self: start; background: #fff2d9 !important; color: #c88722 !important; }
.metric-card > span:not(.metric-icon) { font-size: 10px !important; color: #64616a !important; }
.metric-card > strong { color: #20232f !important; font-size: clamp(17px, 1.6vw, 23px) !important; line-height: 1.4 !important; font-weight: 850 !important; }
.metric-card > small { grid-column: 1 / -1; margin-top: 4px; color: #8b8479 !important; font-size: 9px !important; }
.metric-card:nth-child(1) .metric-icon, .metric-card:nth-child(2) .metric-icon { color: var(--ref-green) !important; background: #e9f8ef !important; }
.metric-card:nth-child(4) .metric-icon, .metric-card:nth-child(5) .metric-icon { color: var(--ref-blue) !important; background: #eaf4fb !important; }
.metric-card:nth-child(6) .metric-icon { color: #bd553c !important; background: #fff0e9 !important; }
.dashboard-middle { display: grid !important; grid-template-columns: 1.55fr .95fr 1.12fr !important; gap: 10px !important; margin: 10px 0 !important; }
.dashboard-bottom { display: grid !important; grid-template-columns: 1.55fr .9fr .84fr !important; gap: 10px !important; align-items: stretch !important; }
.dashboard-middle > .card, .dashboard-bottom > .card { margin: 0 !important; min-height: 0 !important; padding: 14px !important; }
.dashboard-middle h2, .dashboard-bottom h2 { color: #262630 !important; font-size: 15px !important; }
.bar-chart { height: 205px !important; gap: 8px !important; }
.bar-track { height: 150px !important; background: repeating-linear-gradient(to top, transparent 0, transparent 36px, #f0ede7 37px) !important; }
.bar { background: linear-gradient(#e5c17d, #c79038) !important; }
.donut-layout { grid-template-columns: 140px minmax(0,1fr) !important; gap: 12px !important; }
.donut-chart { width: 138px !important; height: 138px !important; }
.donut-chart::after { width: 78px !important; height: 78px !important; }
.rank-row { grid-template-columns: 26px minmax(0,1fr) auto !important; gap: 8px !important; min-height: 43px; padding: 7px 0 !important; }
.rank-row strong { grid-column: 3 !important; }
.rank { color: #fff !important; background: linear-gradient(#efbc4d,#c98a22) !important; }
.alert-row { min-height: 42px; margin: 0 0 7px !important; background: #fffbf5 !important; border-color: #eee5d7 !important; }
.quick-actions { display: grid !important; grid-template-rows: repeat(4, minmax(62px,1fr)) !important; gap: 7px !important; }
.quick-actions button { align-items: flex-start !important; justify-content: center !important; position: relative; min-height: 62px !important; padding: 10px 48px 10px 14px !important; text-align: right !important; background: #fbf1e1 !important; color: var(--ref-brown-900) !important; border-color: #ebddc7 !important; box-shadow: none !important; }
.quick-actions button::before { content: '+'; position: absolute; right: 14px; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 7px; background: #f2dfc1; font-size: 22px; font-weight: 400; }
.quick-actions button::after { content: '‹'; position: absolute; left: 12px; font-size: 20px; }
.quick-actions button:first-child { color: #fff !important; background: linear-gradient(135deg,#85500b,#512700) !important; border-color: transparent !important; }
.quick-actions button:first-child::before { content: '⌑'; color: #fff; background: transparent; }
.latest-card .table-wrap { border: 0 !important; }

/* Every operational page uses the same reference hierarchy. */
.section-title, .page-heading {
  margin: 4px 0 14px !important;
  padding: 0 0 12px !important;
  border-bottom: 1px solid var(--ref-line) !important;
}
.section-title h1, .page-heading h1 { margin: 0 !important; color: var(--ref-brown-950) !important; font-size: 23px !important; font-weight: 850 !important; }
.section-title p, .page-heading p { color: var(--ref-muted) !important; font-size: 11px !important; }
.page-heading > div > small { color: var(--ref-honey-600) !important; font-weight: 800 !important; }
.list-toolbar, .segmented-tabs, .staff-tabs, .toolbar {
  border: 1px solid var(--ref-line) !important;
  border-radius: 10px !important;
  background: #fffaf1 !important;
  box-shadow: none !important;
}
.segmented-tabs button, .staff-tabs button { background: transparent !important; color: #6d5a3f !important; border: 0 !important; box-shadow: none !important; }
.segmented-tabs button[aria-selected="true"], .staff-tabs button[aria-selected="true"] { color: #fff !important; background: linear-gradient(135deg,var(--ref-brown-700),var(--ref-brown-900)) !important; }
.party-workspace, .staff-workbench { gap: 14px !important; }
.warehouse-picker { max-width: 360px; padding: 13px; border: 1px solid var(--ref-line); border-radius: 10px; background: var(--ref-white); }
.inventory-actions { border-top: 4px solid var(--ref-honey-500) !important; }
.field-section { padding: 16px !important; }
.permission-group { border-color: var(--ref-line) !important; background: #fffdf8 !important; }
.permission-group[open] { box-shadow: 0 8px 22px rgba(79,47,12,.07); }
.role-save-bar { background: linear-gradient(180deg,rgba(255,254,251,.85),#fff8e8) !important; border-top: 1px solid #ead8b7 !important; }
.settings-register { background: var(--ref-white) !important; border-color: var(--ref-line) !important; box-shadow: var(--ref-shadow) !important; }
.queue-operation { border-inline-start: 4px solid var(--ref-honey-500) !important; }

/* POS follows the same compact, fast reference surface. */
.pos-layout { display: grid !important; grid-template-columns: minmax(0,1.6fr) minmax(350px,.86fr) !important; gap: 12px !important; align-items: start; }
.pos-layout > .card { margin: 0 !important; }
.product-panel, .invoice-panel { border-radius: var(--ref-radius) !important; }
.product-panel { padding: 16px !important; }
.product-panel #barcode { height: 46px !important; padding-inline: 42px 14px !important; background: #fbf8f2 !important; }
.category-filters { gap: 6px !important; }
.category-chip { min-height: 34px !important; padding: 6px 11px !important; color: #785b31 !important; background: #fff !important; border-color: #e6dac7 !important; box-shadow: none !important; }
.category-chip.active { color: #fff !important; background: linear-gradient(135deg,#9a6215,#6d3905) !important; }
.product-cards { grid-template-columns: repeat(4,minmax(0,1fr)) !important; gap: 9px !important; max-height: 520px !important; }
.product-cards > button { min-height: 0 !important; padding: 8px !important; color: var(--ref-ink) !important; background: #fff !important; border-color: var(--ref-line) !important; box-shadow: 0 5px 15px rgba(77,47,13,.06) !important; }
.product-cards > button:hover { border-color: #d2b578 !important; box-shadow: 0 10px 22px rgba(77,47,13,.14) !important; }
.product-cards > button.selected { border: 2px solid var(--ref-honey-500) !important; background: #fffaf0 !important; }
.product-image { height: 118px !important; background: linear-gradient(145deg,#fff,#f8efe1) !important; }
.option-picker { border-color: #eadcc5 !important; background: #fcf7ee !important; }
.invoice-panel { top: 80px !important; max-height: calc(100dvh - 92px) !important; overflow: hidden !important; }
.invoice-panel > .panel-heading { background: linear-gradient(90deg,#fffefb,#fff1d1) !important; }
.invoice-content { background: #fffefb; }
.customer-payment { border: 1px solid #eadfce !important; background: #faf6ee !important; }
.checkout-footer { background: linear-gradient(180deg,#fff9ea,#ffefc8) !important; border-top-color: #e6cf9e !important; }
.settlement-summary > div { border-radius: 7px; padding: 7px; background: rgba(255,255,255,.58); }
#completeSale { min-height: 50px !important; font-size: 16px !important; }

/* Unified reference tables. */
.table-wrap { border: 1px solid var(--ref-line) !important; border-radius: 9px !important; background: var(--ref-white) !important; }
table { width: 100% !important; border-spacing: 0 !important; border-collapse: separate !important; background: transparent !important; }
thead, thead tr { background: #faf6ef !important; }
th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 11px 10px !important;
  color: #5f584d !important;
  background: #faf6ef !important;
  border-bottom: 1px solid #e9e0d3 !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}
td { padding: 11px 10px !important; color: #34343b !important; border-bottom: 1px solid #f0ebe4 !important; font-size: 12px !important; }
tbody tr:nth-child(even) { background: #fdfbf7 !important; }
tbody tr:hover { background: #fff6e5 !important; }
tbody tr:last-child td { border-bottom: 0 !important; }

/* Modals, alerts and transient states are one visual language. */
dialog {
  width: min(94vw, 760px);
  max-height: 90dvh;
  padding: 24px !important;
  overflow: auto;
  color: var(--ref-ink) !important;
  background: var(--ref-white) !important;
  border: 1px solid #dfcda9 !important;
  border-radius: var(--ref-radius-lg) !important;
  box-shadow: 0 28px 110px rgba(48,29,10,.38) !important;
}
dialog::backdrop { background: rgba(48,35,22,.48) !important; backdrop-filter: blur(3px); }
.document-heading, .dialog-heading { margin: -24px -24px 20px !important; padding: 17px 24px !important; background: linear-gradient(90deg,#fff,#fff1d3) !important; border-bottom: 1px solid #ead6ae !important; border-radius: var(--ref-radius-lg) var(--ref-radius-lg) 0 0 !important; }
.dialog-actions { padding-top: 16px; border-top: 1px solid var(--ref-line); }
#notice, .toast, .admin-message, .message, .form-message, [role="alert"] {
  border-radius: 9px !important;
  box-shadow: 0 10px 32px rgba(67,41,14,.2) !important;
}
#notice:not(.error), .message { color: #2e774c !important; background: #ecf8ef !important; border-color: #cae4d2 !important; }
#notice.error, .form-message, [role="alert"] { color: #a14635 !important; background: #fff1eb !important; border-color: #edcbbf !important; }

/* Standalone forms, receipts, reports and account pages. */
.document-page {
  min-height: 100dvh !important;
  padding: 20px !important;
  background: radial-gradient(circle at 85% 0,#fff0ce 0,transparent 30%),var(--ref-canvas) !important;
}
.document-page > header, .document-page > .no-print {
  width: min(1180px,100%);
  margin: 0 auto 14px !important;
  padding: 12px 18px !important;
  background: rgba(255,254,251,.94) !important;
  border: 1px solid var(--ref-line) !important;
  border-radius: 10px !important;
  box-shadow: var(--ref-shadow) !important;
}
.document-page > main, .document-page > #receipt, .document-page > #report { width: min(1180px,100%) !important; margin-inline: auto !important; }
.document-page .brand img { content: url('/store/images/logo-transparent.png'); object-fit: contain !important; background: transparent !important; border: 0 !important; }
.document-page > main.card, .document-page #receipt, .document-page #report { border-top: 4px solid var(--ref-honey-500) !important; }
.receipt-settlement, .statement-heading { background: linear-gradient(145deg,#fffdf8,#fff4dc) !important; border-color: #e6d1a8 !important; }

/* Storefront and product editor: same identity, not the former visual layer. */
.storefront, .store-admin { color: var(--ref-ink) !important; background: radial-gradient(circle at 87% 0,#fff4dc 0,transparent 27%),var(--ref-canvas) !important; }
.storefront .top, .store-admin .top { color: #705738 !important; background: #fbefdc !important; border-color: #e7d4b5 !important; }
.storefront header, .store-admin header {
  background: rgba(255,254,251,.94) !important;
  border-bottom: 1px solid var(--ref-line) !important;
  box-shadow: 0 7px 26px rgba(70,43,14,.08) !important;
  backdrop-filter: blur(12px);
}
.storefront .logo img, .store-admin .logo img {
  content: url('/store/images/logo-transparent.png');
  width: 68px !important;
  height: 70px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}
.storefront .logo, .store-admin .logo { color: var(--ref-brown-950) !important; font-weight: 850; }
.storefront .nav { background: rgba(255,253,249,.94) !important; border-color: var(--ref-line) !important; }
.storefront .desktop-menu a, .storefront .header-links a { color: #5e4c34 !important; font-weight: 700; }
.storefront .hero {
  border: 1px solid #dfc290 !important;
  border-radius: 14px !important;
  background-color: #f4dfb6 !important;
  box-shadow: 0 14px 38px rgba(86,51,10,.17) !important;
}
.storefront .category-card, .storefront .category-grid > a, .storefront .category-grid > div,
.storefront .products > .card, .storefront .product-card, .storefront .product,
.store-admin .product, .store-admin .panel, .store-admin details.panel {
  border: 1px solid var(--ref-line) !important;
  border-radius: var(--ref-radius) !important;
  background: var(--ref-white) !important;
  box-shadow: var(--ref-shadow) !important;
}
.storefront .category-card:hover, .storefront .category-grid > a:hover,
.storefront .products > .card:hover, .storefront .product-card:hover { transform: translateY(-3px); border-color: #d4b77e !important; box-shadow: var(--ref-shadow-hover) !important; }
.storefront .products .image-wrap, .storefront .image-box, .store-admin .preview { background: linear-gradient(145deg,#fff,#f8efe1) !important; }
.storefront .products .buy, .storefront .cart { background: linear-gradient(135deg,#955c0e,#5d2d00) !important; }
.storefront .weight, .storefront .weights button { color: #7d5a27 !important; background: #fffaf1 !important; border-color: #dfcba8 !important; box-shadow: none !important; }
.storefront .weight.active, .storefront .weight.selected, .storefront .weights button.active { color: #fff !important; background: linear-gradient(135deg,#966015,#633304) !important; }
.storefront .summary, .storefront .selected-info { background: linear-gradient(145deg,#fffaf0,#f7ead4) !important; border: 1px solid #e7d5b6 !important; }
.storefront .benefit { background: #fffaf2 !important; border-color: #e7dac7 !important; box-shadow: 0 5px 18px rgba(82,50,14,.06) !important; }
.storefront footer, .store-admin footer { color: #68491f !important; background: linear-gradient(135deg,#ead7b7,#f8eedf) !important; border-color: #d9bd90 !important; }
.store-admin .notice, .store-admin .toolbar, .store-admin .category-editor { background: #fff8e9 !important; border-color: #e7d5b5 !important; }
.store-admin .product-editor-layout > section { border-top: 4px solid var(--ref-honey-500) !important; }
.v6-nav, .v6-store-notice { color: #765420 !important; background: #fff2d4 !important; border-color: #e7cd99 !important; }

@media (max-width: 1320px) {
  .metric-grid { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
  .dashboard-middle { grid-template-columns: 1.4fr 1fr !important; }
  .dashboard-bottom { grid-template-columns: 1.45fr 1fr !important; }
  .product-cards { grid-template-columns: repeat(3,minmax(0,1fr)) !important; }
}
@media (max-width: 1020px) {
  :root { --ref-sidebar: 188px; }
  .welcome-panel { grid-template-columns: 30% 40% 30% !important; }
  .dashboard-middle, .dashboard-bottom { grid-template-columns: 1fr 1fr !important; }
  .pos-layout { grid-template-columns: minmax(0,1fr) 330px !important; }
  .product-cards { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width: 800px) {
  #workspace { grid-template-columns: 1fr !important; direction: rtl !important; }
  .app-sidebar { position: static !important; width: 100%; height: auto !important; padding: 8px !important; }
  .app-sidebar > .brand { min-height: 82px; flex-direction: row !important; justify-content: flex-start; }
  .app-sidebar > .brand img { width: 55px !important; height: 55px !important; }
  .app-sidebar nav { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sidebar-foot { display: none !important; }
  .app-topbar { position: static !important; grid-template-columns: 1fr !important; }
  .topbar-user { border: 0 !important; }
  .welcome-panel { grid-template-columns: 1fr !important; background-position: right center !important; }
  .welcome-panel::before { opacity: .35; width: 100%; }
  .welcome-panel > div { grid-column: 1 !important; max-width: 78% !important; padding: 14px !important; border-radius: 10px; background: rgba(255,248,232,.9); }
  .welcome-panel::after { display: none; }
  .dashboard-middle, .dashboard-bottom, .pos-layout { grid-template-columns: 1fr !important; }
  .invoice-panel { position: static !important; max-height: none !important; }
}
@media (max-width: 560px) {
  .app-canvas { padding: 8px !important; }
  .app-sidebar nav { grid-template-columns: 1fr; }
  .topbar-tools { flex-wrap: wrap; }
  .global-search { order: 4 !important; width: 100% !important; }
  .metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .welcome-panel { min-height: 175px !important; padding: 16px !important; }
  .welcome-panel > div { max-width: 100% !important; }
  .product-cards { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
  .two-columns, .form-grid, .form-row, .checkout-layout { grid-template-columns: 1fr !important; }
  .document-page { padding: 8px !important; }
}

@media print {
  body { background: #fff !important; }
  .app-sidebar, .app-topbar, .identity, .no-print, .v6-nav { display: none !important; }
  #workspace { display: block !important; }
  .app-canvas, .document-page { padding: 0 !important; background: #fff !important; }
  .card, .panel, table { box-shadow: none !important; }
  .table-wrap { overflow: visible !important; }
  th { position: static !important; }
}

/* ============================================================
   APPROVED DASHBOARD REBUILD — 2026-09-17
   Structural dashboard replacement, not a legacy CSS reskin.
   ============================================================ */
:root{--approved-sidebar:210px}
.operations:has([data-section="dashboard"]:not([hidden])) .identity{display:none!important}
.operations:has([data-section="dashboard"]:not([hidden])) .app-canvas{padding-top:10px!important}
.approved-dashboard{display:block!important}
.approved-dashboard[hidden]{display:none!important}

.approved-hero{
  width:100%; aspect-ratio:1292/193; min-height:150px; max-height:205px;
  border:1px solid #e6cfaa; border-radius:12px; overflow:hidden;
  background:url('/store/images/dashboard-hero-approved.jpg') center/cover no-repeat;
  box-shadow:0 7px 22px rgba(84,49,8,.10); margin:0 0 10px;
}
.dashboard-status{min-height:0!important;height:0!important;overflow:hidden!important;margin:0!important;font-size:0!important}
.approved-dashboard .metric-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:10px!important;margin:0 0 10px!important}
.approved-dashboard .metric-card{min-height:112px!important;padding:13px 12px!important;border-radius:10px!important;box-shadow:0 4px 14px rgba(72,45,15,.055)!important}
.approved-dashboard .metric-card>span:not(.metric-icon){font-size:10px!important}
.approved-dashboard .metric-card>strong{font-size:clamp(17px,1.55vw,23px)!important}
.approved-dashboard .metric-card>small{font-size:8.5px!important}

.approved-dashboard .dashboard-middle{grid-template-columns:1.7fr .92fr 1.08fr!important;gap:10px!important;margin:0 0 10px!important}
.approved-dashboard .dashboard-bottom{grid-template-columns:1.62fr .84fr .96fr!important;gap:10px!important;margin:0!important}
.approved-dashboard .dashboard-middle>.card,.approved-dashboard .dashboard-bottom>.card{border-radius:10px!important;padding:12px!important;box-shadow:0 4px 14px rgba(72,45,15,.055)!important}
.approved-dashboard .panel-heading{min-height:30px;margin-bottom:5px!important}
.approved-dashboard .panel-heading h2{font-size:15px!important;font-weight:850!important;margin:0!important}
.dashboard-filter{display:inline-flex;align-items:center;min-height:30px;padding:4px 10px;border:1px solid #e7dfd2;border-radius:7px;background:#fbf8f2;color:#504a42;font-size:10px}
.compact-dashboard-button{min-height:30px!important;padding:4px 11px!important;font-size:10px!important}
.approved-dashboard .bar-chart{height:205px!important}
.approved-dashboard .bar-value{font-size:8px!important;color:#7b7469!important}
.approved-dashboard .chart-caption{display:none!important}
.approved-dashboard .donut-layout{grid-template-columns:130px minmax(0,1fr)!important}
.approved-dashboard .donut-chart{width:126px!important;height:126px!important}
.approved-dashboard .donut-chart::after{width:72px!important;height:72px!important}
.approved-dashboard .donut-legend>div{padding:4px 0!important;font-size:9px!important}
.approved-dashboard .rank-row{min-height:38px!important;padding:5px 0!important}
.approved-dashboard .rank-row strong{font-size:9px!important}
.approved-dashboard .latest-card .table-wrap{max-height:230px;overflow:auto}
.approved-dashboard .latest-card th,.approved-dashboard .latest-card td{padding:8px 8px!important;font-size:10px!important}
.approved-dashboard .alert-row{min-height:38px!important;padding:7px 8px!important;font-size:10px!important}
.alert-bell{color:#f0ad22;font-size:16px}
.approved-dashboard .quick-actions{grid-template-rows:repeat(4,56px)!important;gap:6px!important}
.approved-dashboard .quick-actions button{min-height:56px!important;padding:8px 48px 8px 13px!important}
.approved-dashboard .quick-actions strong{font-size:13px!important}
.approved-dashboard .quick-actions small{font-size:9px!important}

.dashboard-promos{display:grid;grid-template-columns:1fr 1fr 1.15fr 1fr;gap:10px;margin-top:10px}
.promo-image, .dashboard-promos blockquote{height:105px;margin:0;border:1px solid #ece2d4;border-radius:10px;background:#fff;overflow:hidden;box-shadow:0 4px 14px rgba(72,45,15,.045)}
.promo-1{background:url('/store/images/dashboard-promo-1.jpg') center/cover no-repeat}
.promo-2{background:url('/store/images/dashboard-promo-2.jpg') center/cover no-repeat}
.promo-3{background:url('/store/images/dashboard-promo-3.jpg') center/cover no-repeat}
.dashboard-promos blockquote{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px;text-align:center;color:#744512;background:linear-gradient(145deg,#fffdfa,#fff7e9)}
.dashboard-promos blockquote strong{font-size:15px;margin-bottom:7px}
.dashboard-promos blockquote span{font-size:10px;color:#8b7b67}

/* Approved sidebar proportions and content density */
.app-sidebar{padding-top:8px!important}
.app-sidebar>.brand{min-height:128px!important;padding-bottom:8px!important}
.app-sidebar>.brand img{width:78px!important;height:74px!important}
.app-sidebar nav button,.app-sidebar nav a{min-height:42px!important;padding:7px 11px!important;font-size:12px!important}
.sidebar-foot{min-height:188px!important;padding-top:118px!important;background:linear-gradient(180deg,transparent 35%,rgba(255,249,237,.98) 74%),url('/store/images/dashboard-sidebar-approved.jpg') center top/cover no-repeat!important}

@media(max-width:1320px){
 .approved-dashboard .metric-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
 .approved-dashboard .dashboard-middle{grid-template-columns:1.35fr 1fr!important}
 .approved-dashboard .dashboard-middle>.top-products-card{grid-column:1/-1}
 .dashboard-promos{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
 .approved-dashboard .dashboard-middle,.approved-dashboard .dashboard-bottom{grid-template-columns:1fr!important}
 .dashboard-promos{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
 .approved-dashboard .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .dashboard-promos{grid-template-columns:1fr}
}

/* ============================================================
   CHATGPT APPROVED REFERENCE — literal dashboard composition v2
   The approved image is the visual contract for the dashboard.
   ============================================================ */
body.operations{background:#f7f4ee!important;color:#1f2430!important}
.operations #workspace{grid-template-columns:210px minmax(0,1fr)!important;background:#f7f4ee!important}
.operations .app-sidebar{width:210px!important;padding:8px 7px 0!important;background:linear-gradient(180deg,#fffdf9 0%,#fffaf0 100%)!important;border-inline-end:1px solid #eadfce!important;box-shadow:2px 0 18px rgba(79,51,18,.04)!important}
.operations .app-sidebar>.brand{display:flex!important;flex-direction:column!important;justify-content:center!important;gap:2px!important;min-height:150px!important;margin:0 0 5px!important;padding:7px 6px 9px!important;text-align:center!important;border:0!important}
.operations .app-sidebar>.brand img{width:92px!important;height:92px!important;object-fit:contain!important;background:transparent!important;border-radius:0!important}
.operations .app-sidebar>.brand span{font-size:17px!important;font-weight:900!important;line-height:1.2!important;color:#2e2115!important}
.operations .app-sidebar>.brand small{font-size:9px!important;margin-top:3px!important;color:#6e5a43!important;font-weight:600!important}
.operations .app-sidebar nav{gap:1px!important}
.operations .app-sidebar .nav-caption{display:none!important}
.operations .app-sidebar nav button,.operations .app-sidebar nav a{position:relative!important;min-height:43px!important;padding:8px 10px!important;border-radius:8px!important;font-size:12px!important;font-weight:650!important;color:#252a32!important;gap:11px!important}
.operations .app-sidebar nav button::after,.operations .app-sidebar nav a::after{content:'›';margin-inline-start:auto;color:#a57937;font-size:17px;font-weight:400}
.operations .app-sidebar nav button.active{background:linear-gradient(135deg,#a96b0a,#704000)!important;color:#fff!important;box-shadow:0 5px 14px rgba(128,76,7,.22)!important}
.operations .app-sidebar nav button.active::after{color:#fff!important}
.operations .app-sidebar nav .ui-icon{width:19px!important;height:19px!important;flex-basis:19px!important;stroke-width:1.85!important}
.operations .app-sidebar #logout{margin-top:5px!important}
.operations .sidebar-foot{min-height:250px!important;margin-top:7px!important;padding:181px 10px 8px!important;background:url('/store/images/dashboard-sidebar-approved.jpg') center top/210px 263px no-repeat!important;color:#7c521c!important;border-top:0!important}
.operations .sidebar-foot img{display:none!important}.operations .sidebar-foot p{margin:0!important;font-size:10px!important;font-weight:700!important}.operations .sidebar-foot small{font-size:8px!important;color:#8c765d!important}
.operations .app-canvas{padding:10px 16px 14px!important;background:#f7f4ee!important}
.operations .app-topbar{height:54px!important;margin:0 0 8px!important;padding:6px 12px!important;border-radius:10px!important;background:rgba(255,255,255,.94)!important;border:1px solid #e9e2d7!important;box-shadow:0 3px 14px rgba(70,43,13,.04)!important}
.operations .topbar-user{gap:9px!important}.operations .avatar{width:36px!important;height:36px!important;font-size:16px!important;background:#f5ead8!important;color:#74420d!important}
.operations .topbar-user strong{font-size:12px!important}.operations .topbar-user small{font-size:9px!important;color:#81786c!important}
.operations .topbar-tools{gap:10px!important}.operations .date-chip{min-height:36px!important;padding:7px 11px!important;background:#fff!important;border-color:#e9e2d7!important;font-size:10px!important}
.operations #openAlerts{width:42px!important;min-width:42px!important;height:36px!important;padding:0!important;font-size:0!important;background:#fff!important;border-color:#e9e2d7!important;color:#242a31!important;position:relative!important}
.operations #openAlerts::before{content:'♧';font-size:21px;transform:rotate(180deg)}
.operations #alertsCount{position:absolute!important;top:-5px!important;right:-4px!important;min-width:17px!important;height:17px!important;background:#b21e1e!important;font-size:9px!important}
.operations .global-search{margin-inline-start:auto!important;margin-inline-end:0!important;width:min(100%,450px)!important;height:38px!important;background:#fbfaf7!important;border-color:#e9e2d7!important}
.operations .global-search::before{content:'⌕';font-size:25px;color:#5b4a34;margin-inline-start:10px;line-height:1}
.operations .global-search input{height:36px!important;min-height:36px!important;font-size:11px!important}.operations .global-search kbd{font-size:9px!important}
.operations:has([data-section="dashboard"]:not([hidden])) .identity{display:none!important}
.operations:has([data-section="dashboard"]:not([hidden])) .app-canvas{padding-top:10px!important}
.approved-dashboard{max-width:none!important}
.approved-hero{height:auto!important;min-height:0!important;max-height:none!important;aspect-ratio:1292/193!important;margin:0 0 9px!important;border-radius:9px!important;border:1px solid #e5d3b5!important;box-shadow:0 4px 16px rgba(90,52,9,.07)!important}
.approved-dashboard .metric-grid{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:9px!important;margin-bottom:9px!important}
.approved-dashboard .metric-card{position:relative!important;display:grid!important;grid-template-columns:42px minmax(0,1fr)!important;grid-template-rows:auto auto auto!important;column-gap:8px!important;align-items:center!important;min-height:112px!important;margin:0!important;padding:12px 10px!important;background:#fff!important;border:1px solid #e9e4dc!important;border-radius:9px!important}
.approved-dashboard .metric-icon{grid-row:1/4!important;width:38px!important;height:38px!important;padding:9px!important;border-radius:9px!important;background:#fff2dc!important;color:#99600d!important}
.approved-dashboard .metric-card:nth-child(1) .metric-icon,.approved-dashboard .metric-card:nth-child(2) .metric-icon{background:#edf8f0!important;color:#179a5d!important}
.approved-dashboard .metric-card:nth-child(6) .metric-icon{background:#edf5fb!important;color:#286ea6!important}
.approved-dashboard .metric-card>span:not(.metric-icon){font-size:9px!important;color:#626a75!important;white-space:nowrap!important}
.approved-dashboard .metric-card>strong{font-size:20px!important;line-height:1.15!important;color:#101827!important;font-weight:900!important;white-space:nowrap!important}
.approved-dashboard .metric-card>small{font-size:8px!important;line-height:1.35!important;color:#7d8590!important;white-space:nowrap!important}
.approved-dashboard .dashboard-middle{display:grid!important;grid-template-columns:1.66fr .94fr 1.08fr!important;gap:9px!important;margin:0 0 9px!important;direction:ltr!important}
.approved-dashboard .dashboard-middle>*{direction:rtl!important}.approved-dashboard .dashboard-bottom{display:grid!important;grid-template-columns:1.62fr .82fr .96fr!important;gap:9px!important;margin:0!important;direction:ltr!important}.approved-dashboard .dashboard-bottom>*{direction:rtl!important}
.approved-dashboard .dashboard-middle>.card,.approved-dashboard .dashboard-bottom>.card{margin:0!important;padding:10px 11px!important;border:1px solid #e9e4dc!important;border-radius:9px!important;background:#fff!important;box-shadow:0 3px 12px rgba(70,43,13,.035)!important}
.approved-dashboard .panel-heading{min-height:30px!important;margin:0 0 4px!important}.approved-dashboard .panel-heading h2{font-size:14px!important;color:#171d2b!important;font-weight:900!important}
.approved-dashboard .bar-chart{height:188px!important;padding:8px 4px 0!important}.approved-dashboard .bar-track{background:transparent!important;border-bottom:1px solid #ece8e1!important}.approved-dashboard .bar{background:linear-gradient(180deg,#e4bd6e,#d39a38)!important;border-radius:4px 4px 0 0!important}
.approved-dashboard .donut-layout{min-height:190px!important;align-items:center!important}.approved-dashboard .rank-row{min-height:36px!important;border-bottom:1px solid #eeeae3!important}.approved-dashboard .rank-row .rank{background:#e7b349!important;color:#fff!important}.approved-dashboard .rank-row img{width:34px;height:30px;object-fit:cover;border-radius:5px;margin-inline:6px}
.approved-dashboard .latest-card .table-wrap{max-height:218px!important}.approved-dashboard .latest-card th,.approved-dashboard .latest-card td{padding:7px 7px!important;font-size:9px!important}.approved-dashboard .latest-card th{background:#faf8f4!important}
.approved-dashboard .alert-row{min-height:35px!important;margin:0 0 5px!important;padding:6px 8px!important;border:1px solid #eee9e2!important;border-radius:7px!important;background:#fff!important}
.approved-dashboard .quick-actions{display:grid!important;grid-template-rows:repeat(4,48px)!important;gap:5px!important}.approved-dashboard .quick-actions button{position:relative!important;min-height:48px!important;margin:0!important;padding:6px 43px 6px 12px!important;border-radius:7px!important;justify-content:center!important;align-items:flex-start!important;flex-direction:column!important;background:#fffaf1!important;color:#33200c!important;border:1px solid #eadcc5!important}.approved-dashboard .quick-actions button:first-child{background:linear-gradient(135deg,#8b5200,#623500)!important;color:#fff!important;border-color:#754400!important}.approved-dashboard .quick-actions button::before{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:22px;color:#8d5812}.approved-dashboard .quick-actions button:nth-child(1)::before{content:'🛒';filter:grayscale(1) brightness(3)}.approved-dashboard .quick-actions button:nth-child(2)::before{content:'＋'}.approved-dashboard .quick-actions button:nth-child(3)::before{content:'♙'}.approved-dashboard .quick-actions button:nth-child(4)::before{content:'▥'}.approved-dashboard .quick-actions strong{font-size:12px!important}.approved-dashboard .quick-actions small{font-size:8px!important;color:inherit!important;opacity:.72}
.dashboard-promos{display:grid!important;grid-template-columns:1fr 1.15fr 1fr 1fr!important;gap:9px!important;margin-top:9px!important;direction:rtl!important}.promo-image,.dashboard-promos blockquote{height:92px!important;border-radius:8px!important}.dashboard-promos blockquote{padding:10px!important}.dashboard-promos blockquote strong{font-size:13px!important;margin-bottom:4px!important}.dashboard-promos blockquote span{font-size:9px!important}
.dashboard-status:not(:empty){height:auto!important;min-height:0!important;margin:0 0 7px!important;padding:5px 9px!important;font-size:9px!important;border-radius:6px!important;background:#fff8e9!important;color:#7b5a28!important;overflow:visible!important}
@media(max-width:1250px){.operations #workspace{grid-template-columns:190px minmax(0,1fr)!important}.operations .app-sidebar{width:190px!important}.approved-dashboard .metric-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.approved-dashboard .dashboard-middle{grid-template-columns:1.4fr 1fr!important}.approved-dashboard .dashboard-middle>.top-products-card{grid-column:1/-1}.approved-dashboard .dashboard-bottom{grid-template-columns:1.45fr 1fr!important}.approved-dashboard .quick-actions{grid-column:1/-1;grid-template-columns:repeat(4,1fr)!important;grid-template-rows:52px!important}.dashboard-promos{grid-template-columns:repeat(2,1fr)!important}}