:root {
  --sidebar-w: 288px;
  --sidebar-mini: 88px;
  --brand-red: #a80812;
  --brand-red-2: #c80c17;
  --brand-red-3: #e91e28;
  --gold: #f1b51a;
  --gold-2: #ffce4c;
  --ink: #191919;
  --muted: #6e7177;
  --line: #e8e8e8;
  --paper: #fff;
  --canvas: #f6f6f4;
  --shadow: 0 9px 25px rgba(34, 22, 18, .07);
  --radius: 15px;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body { font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; background: var(--canvas); color: var(--ink); overflow-x: hidden; }
button, input { font: inherit; }
button { cursor: pointer; }
svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.svg-sprite { position: absolute; overflow: hidden; }
.app-shell { min-height: 100vh; }

.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 30; width: var(--sidebar-w); display: flex; flex-direction: column; overflow: hidden; background: radial-gradient(circle at 50% 11%, rgba(255, 70, 70, .18), transparent 27%), linear-gradient(180deg, #ba0712 0%, #92030b 67%, #710309 100%); color: #fff; transition: width .28s ease, transform .28s ease; box-shadow: 10px 0 25px rgba(70, 0, 0, .12); }
.sidebar::after { content: ""; position: absolute; inset: auto 0 0; height: 145px; opacity: .12; background-image: radial-gradient(circle at 50% 100%, transparent 24px, #ffd66a 25px, transparent 27px); background-size: 72px 30px; pointer-events: none; }
.brand-block { padding: 20px 18px 13px; position: relative; z-index: 1; text-align: center; flex: 0 0 auto; }
.brand-logo-wrap { height: 148px; display: grid; place-items: center; }
.brand-logo { width: 166px; height: 166px; object-fit: contain; filter: drop-shadow(0 8px 9px rgba(41,0,0,.22)); }
.brand-copy { transition: opacity .2s ease; }
.brand-copy h1 { margin: -1px 0 3px; font-family: Georgia, "Times New Roman", serif; color: #ffd768; font-size: 31px; line-height: 1; text-shadow: 0 2px 0 rgba(70,0,0,.45); }
.brand-copy p { margin: 8px 0 0; display: flex; align-items: center; justify-content: center; gap: 8px; color: #ffd974; font-size: 11px; font-weight: 700; letter-spacing: .02em; white-space: nowrap; }
.brand-copy p span { display: inline-block; width: 22px; height: 1px; background: currentColor; position: relative; }
.brand-copy p span::after { content: "◆"; position: absolute; top: -6px; font-size: 7px; }
.brand-copy p span:first-child::after { right: -1px; }.brand-copy p span:last-child::after { left: -1px; }
.nav-menu { flex: 1; min-height: 0; overflow-y: auto; padding: 6px 10px 14px; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.25) transparent; position: relative; z-index: 2; }
.nav-item { position: relative; width: 100%; min-height: 45px; border: 0; border-radius: 10px; padding: 0 13px; display: flex; align-items: center; gap: 13px; background: transparent; color: rgba(255,255,255,.92); font-size: 15px; text-align: left; transition: .18s ease; }
.nav-item svg { flex: 0 0 auto; width: 21px; height: 21px; }
.nav-item .nav-label { flex: 1; white-space: nowrap; }
.nav-item .chevron { width: 15px; height: 15px; transition: transform .2s; }
.nav-item:hover { background: rgba(255,255,255,.095); color: #fff; }
.nav-item.active { background: linear-gradient(90deg, rgba(255,35,48,.9), rgba(224,20,31,.72)); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.055); }
.nav-item.active::before { content: ""; position: absolute; left: -10px; top: 7px; bottom: 7px; width: 4px; border-radius: 0 5px 5px 0; background: #ffd142; box-shadow: 0 0 12px rgba(255,209,66,.65); }
.nav-group.open > .nav-item .chevron { transform: rotate(90deg); }
.submenu { max-height: 0; overflow: hidden; padding-left: 48px; transition: max-height .24s ease; }
.nav-group.open .submenu { max-height: 145px; }
.submenu button { min-height: 33px; border: 0; display: block; width: 100%; border-radius: 8px; background: transparent; color: rgba(255,255,255,.72); text-align: left; font-size: 12.5px; padding: 6px 8px; }
.submenu button:hover, .submenu button.active { color: #ffe071; background: rgba(0,0,0,.12); }
.upgrade-card { margin: 0 18px 12px; padding: 15px 16px 14px; border-radius: 12px; background: linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.07)); border: 1px solid rgba(255,255,255,.1); position: relative; z-index: 2; transition: opacity .2s; }
.upgrade-card div { display: flex; align-items: center; justify-content: space-between; }.upgrade-card strong { font-size: 15px; }.gem { color: #ffd14d; font-size: 25px; text-shadow: 0 0 12px rgba(255,209,77,.55); }
.upgrade-card p { margin: 6px 0 12px; color: rgba(255,255,255,.78); font-size: 12px; line-height: 1.55; }
.upgrade-btn { border: 0; width: 100%; height: 35px; border-radius: 6px; color: #661009; font-weight: 800; font-size: 12px; background: linear-gradient(180deg, #ffe06e, #ffc846); box-shadow: 0 4px 12px rgba(66,0,0,.22); }
.sidebar-footer { padding: 0 18px 12px; color: rgba(255,255,255,.42); font-size: 10px; position: relative; z-index: 2; }

.main-content { min-height: 100vh; margin-left: var(--sidebar-w); padding: 19px 20px 18px; transition: margin-left .28s ease; }
.topbar { height: 78px; display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.header-left { min-width: 0; display: flex; align-items: center; gap: 17px; }
.header-left h2 { margin: 2px 0 4px; font-size: clamp(21px, 1.55vw, 27px); letter-spacing: -.035em; line-height: 1.15; }
.header-left h2 span { font-size: .8em; }.header-left p { margin: 0; color: var(--muted); font-size: 13px; }
.icon-button { width: 44px; height: 44px; display: inline-grid; place-items: center; flex: 0 0 auto; border: 1px solid #ececec; border-radius: 11px; background: #fff; color: #242424; box-shadow: 0 4px 12px rgba(0,0,0,.035); }
.icon-button:hover { border-color: #ddd; background: #fafafa; }
.header-actions { display: flex; align-items: center; gap: 10px; }
.search-box { height: 42px; width: 185px; display: flex; align-items: center; gap: 8px; background: #fff; border: 1px solid #e8e8e8; border-radius: 10px; padding: 0 12px; }
.search-box svg { width: 18px; color: #999; }.search-box input { border: 0; outline: 0; width: 100%; min-width: 0; background: transparent; color: #333; font-size: 12px; }
.date-button { height: 42px; display: flex; align-items: center; gap: 9px; border: 1px solid #e8e8e8; border-radius: 10px; background: #fff; padding: 0 13px; color: #303030; font-size: 12px; white-space: nowrap; }
.date-button svg { width: 17px; height: 17px; }.mini-chevron { width: 13px !important; height: 13px !important; transform: rotate(90deg); }
.notification-button { position: relative; }.notification-badge { position: absolute; top: -4px; right: -4px; min-width: 19px; height: 19px; border-radius: 10px; display: grid; place-items: center; color: #fff; background: #ee2631; border: 2px solid #fff; font-size: 9px; font-weight: 800; }
.profile-wrap { position: relative; }.profile-button { min-width: 164px; height: 48px; border: 0; background: transparent; display: flex; align-items: center; gap: 9px; padding: 3px 5px; color: #262626; text-align: left; }
.avatar { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; color: white; background: linear-gradient(145deg, #d61a24, #9e0710); font-size: 17px; font-weight: 700; }
.profile-copy { display: flex; flex-direction: column; flex: 1; white-space: nowrap; }.profile-copy strong { font-size: 12px; }.profile-copy small { color: #777; margin-top: 3px; font-size: 10px; }
.profile-menu { position: absolute; top: 52px; right: 0; z-index: 50; width: 165px; padding: 7px; border-radius: 10px; background: #fff; border: 1px solid #e9e9e9; box-shadow: var(--shadow); display: none; }
.profile-menu.open { display: block; }.profile-menu button { width: 100%; border: 0; border-radius: 7px; padding: 9px 10px; background: transparent; color: #333; font-size: 12px; text-align: left; }.profile-menu button:hover { background: #f7f2ef; color: var(--brand-red); }

.dashboard-view { display: grid; gap: 14px; }
.metrics-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.metric-card { --accent: #d91d27; --soft: #fff1f2; min-width: 0; height: 139px; padding: 17px 18px; border: 1px solid color-mix(in srgb, var(--accent) 18%, white); border-radius: var(--radius); background: linear-gradient(145deg, #fff 55%, color-mix(in srgb, var(--soft) 70%, white)); box-shadow: 0 8px 22px rgba(30, 17, 10, .045); overflow: hidden; }
.metric-card.gold { --accent: #e39400; --soft: #fff7e7; }.metric-card.green { --accent: #14802b; --soft: #eff9ef; }.metric-card.orange { --accent: #eb6410; --soft: #fff4ea; }
.metric-head { display: flex; align-items: center; gap: 10px; color: #303030; font-size: 12px; font-weight: 650; }.metric-card.red .metric-head { color: var(--accent); }
.metric-icon { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; color: var(--accent); background: var(--soft); }.metric-icon svg { width: 17px; height: 17px; }
.metric-body { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; margin-top: 13px; }.metric-body > div { min-width: 0; }.metric-body strong { display: block; color: var(--accent); font-size: clamp(19px, 1.45vw, 25px); line-height: 1; white-space: nowrap; letter-spacing: -.02em; }.metric-body p { margin: 13px 0 0; color: #767676; font-size: 10.5px; white-space: nowrap; }.metric-body p b { color: #15933b; margin-right: 4px; }
.sparkline { width: 36%; height: 59px; color: var(--accent); overflow: visible; }.sparkline polyline { fill: none; stroke: currentColor; stroke-width: 2; vector-effect: non-scaling-stroke; }.sparkline .spark-area { fill: color-mix(in srgb, var(--accent) 14%, transparent); stroke: none; }
.middle-grid, .bottom-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 14px; }
.panel { background: #fff; border: 1px solid #e9e9e8; border-radius: var(--radius); box-shadow: var(--shadow); min-width: 0; overflow: hidden; }
.middle-grid .panel { height: 275px; }.bottom-grid .panel { height: 270px; }
.panel-header { min-height: 49px; padding: 0 16px 0 17px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #f0f0f0; }
.panel-header h3 { margin: 0; display: flex; align-items: center; gap: 10px; font-size: 15px; letter-spacing: -.01em; }.panel-header h3 svg { color: #dc1a23; width: 20px; height: 20px; }
.select-button { height: 31px; padding: 0 12px; border: 1px solid #e3e3e3; border-radius: 8px; background: #fff; font-size: 11px; }.select-button span { margin-left: 6px; }
.link-button { border: 0; background: transparent; color: #c6121b; font-size: 11px; font-weight: 650; }
.chart-wrap { height: 218px; padding: 9px 18px 9px 44px; position: relative; }.sales-chart { display: block; width: 100%; height: 174px; overflow: visible; }.grid-lines line { stroke: #ececec; stroke-width: 1; stroke-dasharray: 3 4; vector-effect: non-scaling-stroke; }.chart-area { fill: url(#salesFade); }.chart-line { fill: none; stroke: #df1e28; stroke-width: 2.2; vector-effect: non-scaling-stroke; }.chart-points circle { fill: #d71924; stroke: #fff; stroke-width: 2; vector-effect: non-scaling-stroke; }
.y-labels { position: absolute; left: 15px; top: 8px; height: 175px; display: flex; flex-direction: column; justify-content: space-between; color: #838383; font-size: 9px; }.x-labels { display: flex; justify-content: space-between; color: #777; font-size: 9px; padding-top: 2px; }
.inventory-body { height: 162px; display: grid; grid-template-columns: 42% 58%; align-items: center; padding: 4px 14px; }.donut { margin: auto; width: 129px; aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(#7fc451 0 68.6%, #f6ae19 68.6% 85.7%, #e84646 85.7% 100%); position: relative; filter: drop-shadow(0 5px 6px rgba(0,0,0,.1)); }.donut::after { content: ""; width: 77px; aspect-ratio: 1; position: absolute; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 1px #eee; }.donut div { position: relative; z-index: 1; text-align: center; display: flex; flex-direction: column; }.donut strong { font-size: 18px; }.donut span { margin-top: 4px; color: #757575; font-size: 10px; }
.inventory-legend { display: grid; gap: 0; }.inventory-legend > div { display: grid; grid-template-columns: 15px 1fr auto; align-items: center; min-height: 45px; border-bottom: 1px solid #ededed; gap: 7px; }.inventory-legend > div:last-child { border: 0; }.inventory-legend p { margin: 0; color: #4c4c4c; font-size: 11px; }.inventory-legend strong { color: #5f5f5f; font-size: 10.5px; font-weight: 500; white-space: nowrap; }.dot { width: 8px; height: 8px; border-radius: 50%; }.in-stock { background: #168037; }.low-stock { background: #ea9c00; }.out-stock { background: #dd212a; }
.stock-warning { height: 49px; margin: 0 12px 12px; padding: 0 8px 0 11px; border: 1px solid #f4dca4; border-radius: 9px; display: flex; align-items: center; gap: 9px; background: #fff9ec; }.stock-warning > span { width: 22px; height: 22px; border: 2px solid #eda311; border-radius: 50%; display: grid; place-items: center; color: #d88c00; font-size: 11px; font-weight: 800; }.stock-warning p { flex: 1; margin: 0; color: #5b5b5b; font-size: 10px; }.stock-warning button { height: 29px; border: 0; border-radius: 6px; padding: 0 13px; color: #fff; background: linear-gradient(180deg, #e6a80c, #bd7600); font-size: 10px; }
.table-wrap { padding: 0 16px 8px; overflow-x: auto; }.transactions-panel table { width: 100%; border-collapse: collapse; min-width: 580px; }.transactions-panel th { height: 35px; color: #686868; font-size: 9.5px; font-weight: 600; text-align: left; }.transactions-panel td { height: 34px; border-top: 1px solid #f0f0f0; color: #3e3e3e; font-size: 9.8px; white-space: nowrap; }.transactions-panel td:first-child { color: #c4141d; font-weight: 700; }.mini-avatar { display: inline-grid; place-items: center; width: 19px; height: 19px; margin-right: 7px; border-radius: 50%; color: #5c5145; background: #f4dcc1; font-size: 8px; font-weight: 800; }.a2 { background:#f4e1b4}.a3 {background:#dce5ea}.a4 {background:#f5c8c8}.a5 {background:#efd8b5}
.status { display: inline-flex; align-items: center; min-height: 20px; border-radius: 5px; padding: 0 8px; font-size: 8.5px; }.completed { color: #20723b; background: #e8f4e9; }.pending { color: #b76800; background: #fff0dc; }
.quick-panel { padding-bottom: 12px; }.quick-grid { height: calc(100% - 49px); display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); gap: 10px; padding: 10px 13px 12px; }.quick-grid button { border: 1px solid #f0d8d3; border-radius: 10px; background: linear-gradient(150deg, #fff, #fff9f7); color: #c91720; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; font-size: 10px; font-weight: 650; transition: transform .16s, box-shadow .16s, border-color .16s; }.quick-grid button:nth-child(even), .quick-grid button:nth-child(5), .quick-grid button:nth-child(7) { color: #d78300; border-color: #f0dfb9; background: linear-gradient(150deg, #fff, #fffaf0); }.quick-grid button svg { width: 25px; height: 25px; }.quick-grid button:hover { transform: translateY(-2px); border-color: currentColor; box-shadow: 0 8px 14px rgba(43, 17, 10, .07); }
.placeholder-view { min-height: calc(100vh - 120px); display: grid; place-items: center; }.placeholder-card { width: min(460px, 92vw); padding: 45px; text-align: center; border: 1px solid #ececec; border-radius: 20px; background: #fff; box-shadow: var(--shadow); }.placeholder-icon { width: 72px; height: 72px; margin: 0 auto 20px; display: grid; place-items: center; border-radius: 18px; color: #bd1019; background: #fff0f1; }.placeholder-icon svg { width: 34px; height: 34px; }.placeholder-card h3 { font-size: 26px; margin: 0 0 8px; }.placeholder-card p { color: #777; }.placeholder-card button { border: 0; border-radius: 9px; padding: 11px 18px; color: #fff; background: var(--brand-red); font-weight: 700; }
.toast { position: fixed; z-index: 100; left: 50%; bottom: 26px; transform: translate(-50%, 20px); min-width: 220px; padding: 12px 17px; border-radius: 9px; color: #fff; background: #282828; box-shadow: 0 12px 35px rgba(0,0,0,.25); font-size: 12px; text-align: center; opacity: 0; pointer-events: none; transition: .24s ease; }.toast.show { opacity: 1; transform: translate(-50%, 0); }
.mobile-overlay { display: none; }

body.sidebar-collapsed .sidebar { width: var(--sidebar-mini); }
body.sidebar-collapsed .main-content { margin-left: var(--sidebar-mini); }
body.sidebar-collapsed .brand-block { padding-left: 8px; padding-right: 8px; }
body.sidebar-collapsed .brand-logo-wrap { height: 74px; }.sidebar-collapsed .brand-logo { width: 72px; height: 72px; }.sidebar-collapsed .brand-copy, body.sidebar-collapsed .upgrade-card, body.sidebar-collapsed .sidebar-footer { opacity: 0; pointer-events: none; height: 0; margin: 0; padding: 0; overflow: hidden; }
body.sidebar-collapsed .nav-item { justify-content: center; padding: 0; }.sidebar-collapsed .nav-label, body.sidebar-collapsed .chevron { display: none; }.sidebar-collapsed .submenu { display: none; }.sidebar-collapsed .nav-item.active::before { left: -10px; }

@media (max-width: 1360px) {
  :root { --sidebar-w: 260px; }
  .main-content { padding: 16px; }.brand-logo-wrap { height: 130px; }.brand-logo { width: 148px; height: 148px; }.brand-copy h1 { font-size: 27px; }
  .search-box { display: none; }.metric-card { padding: 15px; }.metric-body strong { font-size: 20px; }.middle-grid .panel { height: 266px; }.bottom-grid .panel { height: 264px; }
}
@media (max-width: 1100px) {
  .metrics-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }.metric-card { height: 130px; }
  .middle-grid, .bottom-grid { grid-template-columns: 1fr; }.middle-grid .panel, .bottom-grid .panel { height: 285px; }
  .topbar { height: auto; min-height: 75px; }.profile-copy { display: none; }.profile-button { min-width: auto; }.profile-button .mini-chevron { display: none; }
}
@media (max-width: 768px) {
  :root { --sidebar-w: 286px; }
  .sidebar { width: var(--sidebar-w); transform: translateX(-102%); box-shadow: 18px 0 45px rgba(40,0,0,.28); }
  body.mobile-menu-open .sidebar { transform: translateX(0); }
  .main-content, body.sidebar-collapsed .main-content { margin-left: 0; padding: 12px; }
  .mobile-overlay { position: fixed; inset: 0; z-index: 25; background: rgba(13,7,7,.45); backdrop-filter: blur(2px); }
  body.mobile-menu-open .mobile-overlay { display: block; }
  .topbar { align-items: center; min-height: 68px; }.header-left { gap: 10px; }.header-left h2 { font-size: 19px; }.header-left p { font-size: 11px; max-width: 215px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .header-actions { gap: 7px; }.date-button { display: none; }.notification-button { width: 40px; height: 40px; }.profile-button { height: 42px; padding: 0; }.avatar { width: 38px; height: 38px; }.menu-toggle { width: 40px; height: 40px; }
  .dashboard-view { gap: 11px; }.metrics-grid { gap: 10px; }.metric-card { height: 122px; padding: 13px; }.metric-body { margin-top: 9px; }.metric-body strong { font-size: 18px; }.sparkline { width: 32%; }.metric-body p { font-size: 9px; margin-top: 11px; }
  .middle-grid, .bottom-grid { gap: 11px; }.middle-grid .panel, .bottom-grid .panel { height: auto; min-height: 275px; }
  .inventory-body { height: 178px; }.quick-grid { min-height: 220px; }
}
@media (max-width: 560px) {
  .header-left h2 { font-size: 17px; }.header-left p { display: none; }.header-actions .notification-button { display: none; }
  .metrics-grid { grid-template-columns: 1fr; }.metric-card { height: 116px; }.metric-body strong { font-size: 20px; }.sparkline { width: 40%; }
  .panel-header { padding-left: 13px; padding-right: 12px; }.panel-header h3 { font-size: 13px; }
  .chart-wrap { padding-left: 39px; padding-right: 10px; }.inventory-body { grid-template-columns: 1fr; height: auto; padding: 15px; gap: 10px; }.donut { width: 122px; }.inventory-legend { width: 100%; }.inventory-panel { padding-bottom: 10px; }.stock-warning { margin-top: 6px; }.stock-warning p { max-width: 135px; }.stock-warning button { padding: 0 8px; }
  .quick-grid { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(4, 94px); min-height: auto; }.quick-panel { min-height: 455px !important; }
  .transactions-panel { min-height: 300px !important; }.table-wrap { padding: 0 10px 10px; }
}
@media (max-height: 820px) and (min-width: 1101px) {
  .main-content { padding-top: 12px; padding-bottom: 12px; }.topbar { height: 67px; }.metric-card { height: 123px; padding-top: 13px; padding-bottom: 13px; }.middle-grid .panel { height: 252px; }.bottom-grid .panel { height: 246px; }.chart-wrap { height: 198px; }.sales-chart { height: 157px; }.inventory-body { height: 145px; }.quick-grid { gap: 7px; }.brand-logo-wrap { height: 112px; }.brand-logo { width: 132px; height: 132px; }.brand-copy h1 { font-size: 26px; }.upgrade-card { padding: 11px 13px; }.upgrade-card p { margin: 4px 0 8px; }
}

/* ===== Feeder POS v2 brand + loading system ===== */
[hidden] { display: none !important; }

/* Compact brand lockup: the name remains beside the logo, never underneath it. */
.brand-block {
  min-height: 108px;
  padding: 14px 14px 12px;
  display: flex;
  align-items: center;
  gap: 11px;
  text-align: left;
  overflow: visible;
}
.brand-logo-stage {
  width: 82px;
  height: 82px;
  flex: 0 0 82px;
}
.brand-logo,
.loader-logo {
  position: relative;
  z-index: 3;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 8px 10px rgba(48, 0, 0, .26));
  user-select: none;
  -webkit-user-drag: none;
}
.brand-copy {
  min-width: 0;
  flex: 1;
  opacity: 1;
  transition: opacity .18s ease, width .18s ease;
}
.brand-copy h1 {
  margin: 0 0 6px;
  color: #ffe17a;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 25px;
  line-height: .98;
  white-space: nowrap;
  letter-spacing: -.035em;
  text-shadow: 0 2px 0 rgba(70,0,0,.45), 0 0 18px rgba(255,205,66,.12);
}
.brand-copy p {
  display: block;
  margin: 0;
  color: rgba(255, 224, 121, .86);
  font-size: 9.5px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: .025em;
  white-space: normal;
}
.brand-copy p::before {
  content: "";
  display: block;
  width: 28px;
  height: 2px;
  margin-bottom: 6px;
  border-radius: 2px;
  background: linear-gradient(90deg, #ffe580, rgba(255,229,128,0));
}

/* Reusable animated logo treatment. */
.logo-motion {
  position: relative;
  display: grid;
  place-items: center;
  isolation: isolate;
}
.logo-motion::after {
  content: "";
  position: absolute;
  z-index: 0;
  width: 72%;
  height: 22%;
  left: 14%;
  bottom: -2%;
  border-radius: 50%;
  background: rgba(45,0,0,.32);
  filter: blur(8px);
  animation: logoShadow 3.2s ease-in-out infinite;
}
.logo-motion .brand-logo,
.logo-motion .loader-logo {
  animation: logoFloat 3.2s ease-in-out infinite;
  transform-origin: 50% 58%;
}
.logo-glow {
  position: absolute;
  z-index: 0;
  inset: 11%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,227,100,.54) 0, rgba(255,179,0,.18) 45%, transparent 72%);
  filter: blur(5px);
  animation: logoGlow 2.3s ease-in-out infinite;
}
.logo-orbit {
  position: absolute;
  z-index: 1;
  inset: 5%;
  border: 1px solid rgba(255,229,128,.52);
  border-left-color: transparent;
  border-bottom-color: rgba(255,167,0,.14);
  border-radius: 50%;
  animation: logoOrbit 5.8s linear infinite;
}
.logo-orbit--two {
  inset: -4%;
  border-color: rgba(255,242,184,.18);
  border-right-color: transparent;
  animation-duration: 8.2s;
  animation-direction: reverse;
}
.logo-orbit::before,
.logo-orbit::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #ffe783;
  box-shadow: 0 0 10px #ffd34b;
}
.logo-orbit::before { top: 10%; right: 12%; }
.logo-orbit::after { bottom: 8%; left: 16%; width: 3px; height: 3px; }
.logo-shine {
  position: absolute;
  z-index: 4;
  inset: 9%;
  overflow: hidden;
  border-radius: 50%;
  pointer-events: none;
  mix-blend-mode: screen;
}
.logo-shine::before {
  content: "";
  position: absolute;
  width: 30%;
  height: 150%;
  top: -25%;
  left: -55%;
  transform: rotate(18deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.64), transparent);
  animation: logoShine 4.6s ease-in-out infinite 1s;
}

/* Full-app startup loading screen. */
body.page-loading { overflow: hidden; }
.app-loader {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 22px;
  color: #fff;
  background:
    radial-gradient(circle at 50% 42%, rgba(255,196,44,.22), transparent 27%),
    radial-gradient(circle at 50% 50%, #bd101a 0, #8f050d 44%, #530005 100%);
  opacity: 1;
  visibility: visible;
  transition: opacity .38s ease, visibility .38s ease;
}
.app-loader::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .12;
  background-image:
    linear-gradient(30deg, transparent 24%, rgba(255,222,110,.8) 25%, transparent 26%),
    linear-gradient(150deg, transparent 24%, rgba(255,222,110,.65) 25%, transparent 26%);
  background-size: 66px 38px;
  mask-image: linear-gradient(to bottom, transparent, #000 30%, #000 70%, transparent);
}
.app-loader.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.loader-brand {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.logo-motion--large { width: 154px; height: 154px; margin-bottom: 18px; }
.loader-brand > strong {
  color: #ffe37c;
  font: 700 33px/1 Georgia, "Times New Roman", serif;
  letter-spacing: -.035em;
  text-shadow: 0 3px 0 rgba(50,0,0,.36), 0 0 25px rgba(255,201,56,.22);
}
.loader-message {
  margin-top: 10px;
  color: rgba(255,255,255,.76);
  font-size: 12px;
  letter-spacing: .04em;
}
.loading-dots { display: flex; gap: 6px; margin-top: 14px; }
.loading-dots i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #ffd04b;
  animation: loadingDot 1s ease-in-out infinite;
}
.loading-dots i:nth-child(2) { animation-delay: .14s; }
.loading-dots i:nth-child(3) { animation-delay: .28s; }

/* Logo-powered loader for menu changes and actions. */
.main-content { position: relative; }
.content-loader {
  position: fixed;
  z-index: 80;
  inset: 0 0 0 var(--sidebar-w);
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(249,249,247,.76);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  animation: loaderFadeIn .16s ease both;
}
.content-loader-card {
  width: min(330px, calc(100vw - 40px));
  min-height: 136px;
  padding: 20px 22px;
  display: grid;
  grid-template-columns: 76px 1fr;
  align-items: center;
  gap: 15px;
  border: 1px solid rgba(167,17,26,.12);
  border-radius: 20px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 24px 70px rgba(74,18,15,.18);
}
.logo-motion--small { width: 72px; height: 72px; }
.content-loader-card > div:nth-child(2) { min-width: 0; display: flex; flex-direction: column; }
.content-loader-card strong { color: #8d0710; font-size: 15px; line-height: 1.2; }
.content-loader-card span:not(.logo-orbit):not(.logo-glow):not(.logo-shine) { margin-top: 6px; color: #777; font-size: 11px; }
.loading-bar {
  grid-column: 1 / -1;
  height: 4px;
  overflow: hidden;
  border-radius: 999px;
  background: #f4e8e7;
}
.loading-bar span {
  display: block;
  width: 42%;
  height: 100%;
  margin: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #a80711, #f1b51a, #a80711);
  animation: loadingBar 1.05s ease-in-out infinite;
}

/* Busy buttons get a branded mini indicator. */
button.is-busy { position: relative; pointer-events: none; color: transparent !important; }
button.is-busy > * { opacity: 0; }
button.is-busy::after {
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  width: 28px;
  height: 28px;
  margin: -14px 0 0 -14px;
  border-radius: 50%;
  background: url("feeder-logo-transparent.png") center/contain no-repeat;
  filter: drop-shadow(0 3px 4px rgba(79,0,0,.22));
  animation: miniLogoLoad .9s ease-in-out infinite alternate;
}

body.sidebar-collapsed .brand-block {
  min-height: 92px;
  justify-content: center;
  padding: 10px 7px;
}
body.sidebar-collapsed .brand-logo-stage {
  width: 63px;
  height: 63px;
  flex-basis: 63px;
}
body.sidebar-collapsed .brand-copy {
  display: none;
  opacity: 0;
  width: 0;
}
body.sidebar-collapsed .content-loader { left: var(--sidebar-mini); }

@keyframes logoFloat {
  0%, 100% { transform: translateY(0) rotate(-.5deg) scale(1); }
  50% { transform: translateY(-5px) rotate(.7deg) scale(1.018); }
}
@keyframes logoShadow {
  0%, 100% { transform: scaleX(.82); opacity: .30; }
  50% { transform: scaleX(1.04); opacity: .18; }
}
@keyframes logoGlow {
  0%, 100% { transform: scale(.9); opacity: .58; }
  50% { transform: scale(1.08); opacity: .95; }
}
@keyframes logoOrbit { to { transform: rotate(360deg); } }
@keyframes logoShine {
  0%, 42% { left: -55%; opacity: 0; }
  50% { opacity: .85; }
  66%, 100% { left: 125%; opacity: 0; }
}
@keyframes loadingDot {
  0%, 100% { transform: translateY(0) scale(.75); opacity: .5; }
  50% { transform: translateY(-5px) scale(1); opacity: 1; }
}
@keyframes loadingBar {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(340%); }
}
@keyframes loaderFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes miniLogoLoad {
  from { transform: translateY(2px) scale(.88); opacity: .72; }
  to { transform: translateY(-2px) scale(1.06); opacity: 1; }
}

@media (max-width: 1360px) {
  .brand-block { min-height: 98px; padding: 11px 12px 10px; gap: 9px; }
  .brand-logo-stage { width: 72px; height: 72px; flex-basis: 72px; }
  .brand-copy h1 { font-size: 22px; }
  .brand-copy p { font-size: 8.8px; }
}
@media (max-width: 768px) {
  .brand-block { min-height: 104px; padding: 12px 15px; }
  .brand-logo-stage { width: 78px; height: 78px; flex-basis: 78px; }
  .brand-copy h1 { font-size: 25px; }
  .brand-copy p { font-size: 9.5px; }
  .content-loader { inset: 0; }
  .logo-motion--large { width: 138px; height: 138px; }
  .loader-brand > strong { font-size: 29px; }
}
@media (max-width: 420px) {
  .content-loader-card { grid-template-columns: 64px 1fr; min-height: 122px; padding: 17px; gap: 12px; }
  .logo-motion--small { width: 60px; height: 60px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
  .logo-motion .brand-logo,
  .logo-motion .loader-logo,
  .logo-motion::after,
  .logo-glow,
  .logo-orbit,
  .logo-shine::before,
  .loading-dots i,
  .loading-bar span,
  button.is-busy::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; }
}

/* ===== PHP application compatibility: exact Feeder POS v2 visual system ===== */
a { color: inherit; text-decoration: none; }
.nav-item { text-decoration: none; }
.nav-menu > a.nav-item { display:flex; }
.submenu a {
  min-height: 33px;
  border: 0;
  display: flex;
  align-items: center;
  width: 100%;
  border-radius: 8px;
  background: transparent;
  color: rgba(255,255,255,.72);
  text-align: left;
  font-size: 12.5px;
  padding: 6px 8px;
  transition: .18s ease;
}
.submenu a:hover,.submenu a.active { color:#ffe071; background:rgba(0,0,0,.12); }
.nav-group.open .submenu { max-height: 170px; }
.upgrade-btn { display:grid; place-items:center; text-decoration:none; }
.profile-menu a {
  width:100%; display:flex; align-items:center; min-height:34px; border-radius:7px;
  padding:8px 10px; background:transparent; color:#333; font-size:12px;
}
.profile-menu a:hover { background:#f7f2ef; color:var(--brand-red); }
.stock-warning a {
  height:29px; display:inline-flex; align-items:center; border-radius:6px; padding:0 13px;
  color:#fff; background:linear-gradient(180deg,#e6a80c,#bd7600); font-size:10px; white-space:nowrap;
}
.quick-grid a {
  border:1px solid #f0d8d3; border-radius:10px; background:linear-gradient(150deg,#fff,#fff9f7);
  color:#c91720; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:8px; font-size:10px; font-weight:650; transition:transform .16s,box-shadow .16s,border-color .16s;
}
.quick-grid a:nth-child(even),.quick-grid a:nth-child(5),.quick-grid a:nth-child(7) {
  color:#d78300; border-color:#f0dfb9; background:linear-gradient(150deg,#fff,#fffaf0);
}
.quick-grid a svg { width:25px; height:25px; }
.quick-grid a:hover { transform:translateY(-2px); border-color:currentColor; box-shadow:0 8px 14px rgba(43,17,10,.07); }
.dashboard-no-data { height:150px!important; text-align:center; color:#8b8b8b!important; }
.page-content { min-width:0; }

/* Shared cards, headings and layout */
.page-title {
  min-height:72px; margin:0 0 14px; padding:14px 17px; display:flex; align-items:center;
  justify-content:space-between; gap:14px; border:1px solid #e9e9e8; border-radius:var(--radius);
  background:#fff; box-shadow:var(--shadow);
}
.page-title h2 { margin:0; color:#202020; font-size:21px; font-weight:750; letter-spacing:-.025em; }
.page-subtitle { margin:4px 0 0; color:var(--muted); font-size:11px; line-height:1.5; }
.card,.premium-card {
  border:1px solid #e9e9e8!important; border-radius:var(--radius)!important; background:#fff!important;
  box-shadow:var(--shadow)!important; color:var(--ink);
}
.card h3,.card h4,.card h5 { color:#242424; }
.card.p-3 { padding:16px!important; }
.table-card { overflow:hidden; }
.soft-box,.purchase-item-row {
  padding:13px; margin-bottom:11px; border:1px solid #eee5e2; border-radius:11px;
  background:linear-gradient(150deg,#fff,#fffaf8); box-shadow:0 5px 15px rgba(45,17,10,.035);
}
.section-chip,.location-pill,.soft-badge {
  display:inline-flex; align-items:center; gap:6px; min-height:28px; padding:0 10px;
  border:1px solid #efd8d2; border-radius:999px; color:#a50a13; background:#fff4f3;
  font-size:10px; font-weight:700;
}
.location-pill { color:#9a6100; border-color:#eeddb7; background:#fff9ec; }

/* Buttons: remove every Bootstrap blue and use sample red/gold */
.btn {
  min-height:38px; display:inline-flex; align-items:center; justify-content:center; gap:7px;
  border-radius:8px!important; font-size:12px; font-weight:700!important; transition:.16s ease;
}
.btn:hover { transform:translateY(-1px); box-shadow:0 7px 16px rgba(50,13,10,.10); }
.btn-primary,.btn-dark,.login-submit {
  color:#fff!important; border-color:#ad0711!important;
  background:linear-gradient(180deg,#d8202a,#a80711)!important;
  box-shadow:0 7px 16px rgba(168,7,17,.18)!important;
}
.btn-success {
  color:#fff!important; border-color:#197737!important; background:linear-gradient(180deg,#2d984c,#176f32)!important;
}
.btn-outline-primary { color:#b10b15!important; border-color:#d7a8aa!important; background:#fff!important; }
.btn-outline-primary:hover { color:#fff!important; border-color:#b10b15!important; background:#b10b15!important; }
.btn-outline-dark,.btn-outline-secondary { color:#535353!important; border-color:#d9d9d9!important; background:#fff!important; }
.btn-outline-danger { color:#bf111b!important; border-color:#e8b8bb!important; background:#fff!important; }
.btn-outline-danger:hover { color:#fff!important; background:#bf111b!important; border-color:#bf111b!important; }
.btn-light { color:#555!important; border-color:#e5e5e5!important; background:#fafafa!important; }
.btn:disabled,.btn.disabled { opacity:.48; transform:none!important; box-shadow:none!important; }

/* Forms */
.form-label { margin-bottom:6px; color:#4b4b4b; font-size:11px; font-weight:700; }
.form-control,.form-select {
  min-height:40px; border:1px solid #e2e2e2!important; border-radius:8px!important;
  background-color:#fff!important; color:#252525!important; font-size:12px!important; box-shadow:none!important;
}
.form-control-lg { min-height:46px; font-size:13px!important; }
.form-control:focus,.form-select:focus {
  border-color:#c73b43!important; box-shadow:0 0 0 3px rgba(177,11,21,.09)!important;
}
.form-check-input:checked { background-color:#b30b15; border-color:#b30b15; }
.input-group .form-control { border-radius:8px 0 0 8px!important; }
.input-group .btn { border-radius:0 8px 8px 0!important; }

/* Tables */
.table-responsive { border-radius:10px; overflow-x:auto; }
.table { margin:0; min-width:650px; color:#333; }
.table > :not(caption) > * > * { padding:11px 12px; border-bottom-color:#efefef; vertical-align:middle; }
.table thead th {
  color:#686868; background:#fbfbfa; font-size:10px; font-weight:700; text-transform:uppercase;
  letter-spacing:.035em; white-space:nowrap; border-bottom:1px solid #ececec;
}
.table tbody td { color:#3f3f3f; font-size:11px; }
.table tbody tr:hover td { background:#fffaf8; }
.badge { min-height:21px; display:inline-flex; align-items:center; border-radius:5px!important; padding:3px 8px!important; font-size:9px!important; font-weight:700!important; }
.text-bg-primary { color:#9e0811!important; background:#fdebed!important; }
.text-bg-success { color:#20723b!important; background:#e8f4e9!important; }
.text-bg-warning { color:#a96500!important; background:#fff0dc!important; }
.text-bg-danger { color:#b31922!important; background:#fde8e9!important; }
.text-bg-info { color:#775a00!important; background:#fff5cf!important; }
.text-bg-secondary,.text-bg-light { color:#666!important; background:#f1f1f1!important; }
.text-primary { color:#b10b15!important; }
.text-success { color:#20783d!important; }
.text-danger { color:#bd111b!important; }

/* Generic report/stat cards */
.stat-card,.report-stat,.sale-summary-card { min-height:124px; position:relative; overflow:hidden; }
.stat-card::after,.report-stat::after,.sale-summary-card::after {
  content:""; position:absolute; right:-28px; bottom:-36px; width:105px; height:105px;
  border-radius:50%; background:rgba(190,16,27,.055);
}
.stat-card .value,.report-stat .value,.sale-summary-card .value {
  display:block; margin-top:8px; color:#b10b15; font-size:23px; font-weight:800; letter-spacing:-.025em;
}
.report-stat.income .value { color:#19753a; }
.report-stat.stock .value { color:#c87900; }
.report-stat.credit .value { color:#d6530c; }
.report-tabs { display:flex; gap:8px; flex-wrap:wrap; }
.report-tab {
  min-height:37px; display:inline-flex; align-items:center; gap:7px; padding:0 12px;
  border:1px solid #e7e1df; border-radius:8px; color:#666; background:#fff; font-size:11px; font-weight:700;
}
.report-tab:hover,.report-tab.active { color:#fff; border-color:#b10b15; background:linear-gradient(180deg,#d51d27,#a70711); }
.report-card { overflow:hidden; }
.report-filter-card { background:linear-gradient(145deg,#fff,#fffaf6)!important; }

/* Product management cards and small controls */
.product-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.product-card {
  min-width:0; min-height:135px; padding:13px; display:flex; flex-direction:column;
  border:1px solid #ebdfdc; border-radius:11px; background:linear-gradient(150deg,#fff,#fffaf8);
  box-shadow:0 6px 16px rgba(40,18,12,.04); transition:.16s ease;
}
.product-card:hover { transform:translateY(-2px); border-color:#d86b70; box-shadow:0 10px 20px rgba(68,18,14,.08); }
.product-card.disabled-card { opacity:.48; cursor:not-allowed; filter:grayscale(.2); }
.product-top { display:flex; align-items:center; justify-content:space-between; gap:7px; }
.product-title { margin-top:15px; color:#2a2a2a; font-size:13px; font-weight:750; line-height:1.3; }
.product-meta { margin-top:5px; color:#8a8a8a; font-size:9.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.product-card .price { margin-top:auto; padding-top:12px; color:#b10b15; font-size:16px; font-weight:800; }
.stock-pill,.cart-badge {
  min-height:21px; display:inline-flex; align-items:center; border-radius:5px; padding:0 7px;
  color:#23713d; background:#e9f4e9; font-size:8.5px; font-weight:700;
}
.stock-pill.low { color:#aa6500; background:#fff0dc; }
.cart-badge { color:#9a0710; background:#fdebec; }

/* POS screen */
.pos-title { margin-bottom:10px; }
.pos-shell { display:grid; grid-template-columns:minmax(0,1fr) 350px; gap:12px; align-items:start; }
.pos-main { min-width:0; }
.pos-toolbar { position:sticky; top:0; z-index:9; }
.pos-toolbar .search-box { width:100%; height:40px; display:flex; }
.pos-toolbar .search-box i { color:#999; }
.pos-toolbar .search-box .form-control { min-height:30px; border:0!important; padding:0!important; }
.category-slider { display:grid; grid-template-columns:34px minmax(0,1fr) 34px; align-items:center; gap:7px; }
.category-scroll { display:flex; gap:7px; overflow:auto; scrollbar-width:none; scroll-behavior:smooth; }
.category-scroll::-webkit-scrollbar { display:none; }
.cat-chip {
  min-height:33px; flex:0 0 auto; border:1px solid #eadedb; border-radius:8px; padding:0 11px;
  color:#666; background:#fff; font-size:10.5px; font-weight:700;
}
.cat-chip span { margin-left:4px; color:#999; }
.cat-chip:hover,.cat-chip.active { color:#fff; border-color:#b10b15; background:linear-gradient(180deg,#d7202a,#a80711); }
.cat-chip.active span { color:#ffe37b; }
.cat-slide-btn {
  width:34px; height:34px; border:1px solid #e5e5e5; border-radius:8px; color:#a60a13; background:#fff;
}
.cart-panel { position:sticky; top:12px; max-height:calc(100vh - 36px); overflow:auto; }
.cart-line { padding:11px 0; display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid #efefef; }
.qty-box { display:flex; align-items:center; gap:6px; }
.qty-btn {
  width:26px; height:26px; display:grid; place-items:center; border:1px solid #ead7d5; border-radius:6px;
  color:#ac0b14; background:#fff7f6; font-weight:800;
}
.grand-total { padding:13px; border:1px solid #efd7d3; border-radius:10px; color:#8f0710; background:#fff5f3; }
.payment-calc-card,.credit-calc-box {
  padding:12px; margin-bottom:12px; border:1px solid #eee0dc; border-radius:10px; background:#fffaf8;
}
.payment-calc-card.has-credit { border-color:#e7c372; background:#fff9eb; }
.quick-pay-actions { display:flex; gap:6px; }
.mini-pay-btn { min-height:26px; border:1px solid #d9aeb0; border-radius:6px; padding:0 9px; color:#a60a13; background:#fff; font-size:9px; font-weight:700; }
.mini-pay-btn.ghost { color:#9a6200; border-color:#e1cb99; background:#fffaf0; }
.calc-row { min-height:29px; display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px dashed #eadedb; color:#666; font-size:10px; }
.calc-row:last-child { border:0; }
.calc-row.highlight { color:#ad0a14; font-weight:800; }
.credit-warning { padding:9px; border-radius:7px; color:#9b6200; background:#fff0cc; font-size:10px; }
.mobile-bottom-cart { display:none; }
.qty-modal { border:0!important; border-radius:14px!important; box-shadow:0 24px 70px rgba(56,12,10,.2)!important; }
.qty-stepper { display:grid; grid-template-columns:44px 1fr 44px; gap:8px; }
.qty-stepper button,.qty-stepper input { height:45px; border:1px solid #e4d7d4; border-radius:8px; text-align:center; background:#fff; }
.qty-stepper button { color:#aa0812; font-size:20px; font-weight:800; }

/* Credit / purchase calculations */
.credit-auto-card { background:linear-gradient(150deg,#fff,#fff9ed)!important; }
.credit-calc-box { padding:10px 12px; }
.purchase-item-row .remove-row { min-height:36px; }

/* Location and list rows */
.location-list { display:grid; gap:7px; }
.location-row {
  min-height:56px; display:grid; grid-template-columns:38px 1fr auto; align-items:center; gap:10px;
  padding:8px 10px; border:1px solid #efefef; border-radius:9px; background:#fff;
}
.location-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:8px; color:#b20b15; background:#fdecee; }
.location-row strong { display:block; font-size:11px; }
.location-row small { color:#888; font-size:9px; }
.location-row b { color:#a70a13; font-size:12px; }

/* Alerts / empty states */
.alert { border:0!important; border-radius:9px!important; font-size:11px; }
.alert-danger { color:#a90a13!important; background:#fdebed!important; }
.alert-success { color:#216f3b!important; background:#e8f4e9!important; }
.alert-warning { color:#956000!important; background:#fff1d5!important; }
.empty-state,.dashboard-empty { color:#8b8b8b; }

/* Login page follows the same red/gold sample language */
.login-page { min-height:100vh; display:grid; grid-template-columns:minmax(420px,44%) 1fr; background:#f6f6f4; overflow:hidden; }
.login-visual {
  min-height:100vh; display:grid; place-items:center; position:relative; overflow:hidden;
  background:radial-gradient(circle at 50% 38%,rgba(255,196,44,.24),transparent 28%),linear-gradient(180deg,#ba0712 0%,#90030b 68%,#650107 100%);
}
.login-visual::after { content:""; position:absolute; inset:auto 0 0; height:190px; opacity:.13; background-image:radial-gradient(circle at 50% 100%,transparent 24px,#ffd66a 25px,transparent 27px); background-size:72px 30px; }
.login-visual-content { position:relative; z-index:2; text-align:center; color:#fff; }
.login-logo-stage { width:210px; height:210px; margin:0 auto 18px; }
.login-visual h1 { margin:0; color:#ffe37c; font:700 43px/1 Georgia,"Times New Roman",serif; text-shadow:0 3px 0 rgba(50,0,0,.38); }
.login-visual p { margin:12px 0 0; color:rgba(255,225,124,.88); font-size:13px; font-weight:700; }
.login-panel { min-height:100vh; display:grid; place-items:center; padding:28px; }
.login-card { width:min(430px,100%); }
.login-card .card-body { padding:34px!important; }
.login-eyebrow { color:#b10b15; font-size:9px; font-weight:800; letter-spacing:.16em; }
.login-card h2 { margin:7px 0 6px; font-size:25px; letter-spacing:-.035em; }
.login-copy { margin:0 0 24px; color:#777; font-size:11px; }
.input-icon-wrap { position:relative; }
.input-icon-wrap i { position:absolute; z-index:2; left:13px; top:50%; transform:translateY(-50%); color:#a70a13; }
.input-icon-wrap .form-control { padding-left:38px; }
.login-mobile-brand { display:none; }
.login-demo { margin-top:18px; padding:10px; display:flex; gap:8px; border-radius:8px; color:#7b6200; background:#fff7d9; font-size:10px; }

/* Responsive application pages */
@media (max-width:1360px) {
  .product-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .pos-shell { grid-template-columns:minmax(0,1fr) 330px; }
}
@media (max-width:1100px) {
  .pos-shell { grid-template-columns:1fr; }
  .cart-panel { position:static; max-height:none; }
  .product-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:768px) {
  .page-title { min-height:auto; padding:12px 13px; align-items:flex-start; }
  .page-title h2 { font-size:18px; }
  .page-subtitle { font-size:10px; }
  .card.p-3 { padding:13px!important; }
  .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .product-card { min-height:125px; padding:11px; }
  .pos-title { display:none; }
  .pos-toolbar { position:static; }
  .cart-panel { margin-bottom:58px; }
  .mobile-bottom-cart {
    position:fixed; z-index:22; left:10px; right:10px; bottom:10px; height:48px; display:flex;
    align-items:center; justify-content:space-between; padding:0 15px; border:1px solid rgba(255,255,255,.18);
    border-radius:11px; color:#fff; background:linear-gradient(180deg,#cf1923,#97050e); box-shadow:0 12px 30px rgba(80,0,0,.28);
  }
  .login-page { grid-template-columns:1fr; background:radial-gradient(circle at 50% 5%,rgba(255,199,50,.18),transparent 25%),linear-gradient(180deg,#a50710 0,#730208 38%,#f6f6f4 38%); }
  .login-visual { display:none; }
  .login-panel { min-height:100vh; padding:22px 14px; align-items:center; }
  .login-card .card-body { padding:26px 22px!important; }
  .login-mobile-brand { display:flex; align-items:center; justify-content:center; gap:9px; margin:-8px 0 20px; color:#9b0710; font:700 24px/1 Georgia,"Times New Roman",serif; }
  .login-mobile-brand img { width:76px; height:76px; object-fit:contain; }
}
@media (max-width:560px) {
  .page-title { flex-direction:column; }
  .category-slider { grid-template-columns:30px minmax(0,1fr) 30px; }
  .cat-slide-btn { width:30px; height:32px; }
  .product-card .price { font-size:14px; }
  .table { min-width:600px; }
}

/* RBAC, staff permission and hidden system-owner controls */
.access-denied{max-width:680px;margin:8vh auto;text-align:center;align-items:center;border:1px solid rgba(157,7,16,.12)}
.access-denied-icon,.empty-permission-state>i{width:78px;height:78px;border-radius:24px;display:grid;place-items:center;margin:0 auto 18px;background:linear-gradient(145deg,#fff3da,#ffe2a6);color:#9d0710;font-size:34px;box-shadow:0 16px 35px rgba(157,7,16,.12)}
.access-denied p,.empty-permission-state p{max-width:570px;color:#7a6b67}
.owner-chip{background:linear-gradient(135deg,#7f030b,#b71018)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 10px 24px rgba(157,7,16,.2)}
.system-control-banner{display:flex;align-items:center;gap:14px;padding:16px 18px;margin-bottom:16px;border-radius:16px;background:linear-gradient(135deg,#7e030b,#ad1119);color:#fff;box-shadow:0 14px 30px rgba(126,3,11,.2)}
.system-control-banner>i{font-size:25px}.system-control-banner strong,.system-control-banner span{display:block}.system-control-banner span{font-size:13px;opacity:.82;margin-top:2px}
.staff-list-card{max-height:570px}.staff-account-list{display:flex;flex-direction:column;gap:8px;max-height:490px;overflow:auto}
.staff-account-item{display:grid;grid-template-columns:42px 1fr auto;gap:10px;align-items:center;padding:11px;border-radius:13px;border:1px solid #eee4df;color:#3f302d;text-decoration:none;background:#fff;transition:.18s ease}
.staff-account-item:hover,.staff-account-item.active{border-color:rgba(157,7,16,.35);background:#fff8f4;transform:translateY(-1px);box-shadow:0 8px 20px rgba(104,44,29,.08)}
.staff-account-item span:nth-child(2){min-width:0}.staff-account-item strong,.staff-account-item small{display:block}.staff-account-item small{font-size:11px;color:#927f79;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.staff-avatar,.account-avatar{display:grid;place-items:center;border-radius:13px;background:linear-gradient(145deg,#9d0710,#d3262d);color:#fff;font-weight:800;box-shadow:0 7px 16px rgba(157,7,16,.18)}.staff-avatar{width:42px;height:42px}.account-avatar{width:76px;height:76px;margin-bottom:15px;font-size:28px}
.empty-mini{padding:22px;text-align:center;color:#9b8780}.permission-editor{overflow:hidden}
.form-switch-card{display:flex;align-items:center;gap:9px;padding:9px 12px;border:1px solid #eaded8;border-radius:12px;background:#fff9f5;font-weight:700;cursor:pointer}.form-switch-card input{width:18px;height:18px;accent-color:#9d0710}
.permission-groups{display:grid;gap:14px}.permission-group{padding:15px;border-radius:15px;background:#fcfaf8;border:1px solid #eee3de}.permission-group h6{font-weight:800;color:#7b100f;margin:0 0 11px}
.permission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.permission-option{position:relative;display:flex;gap:10px;padding:11px;border-radius:12px;background:#fff;border:1px solid #eadfd9;cursor:pointer;transition:.18s ease}.permission-option:hover{border-color:#d7a64b;background:#fffcf5}.permission-option input{width:18px;height:18px;flex:0 0 auto;margin-top:2px;accent-color:#9d0710}.permission-option strong,.permission-option small{display:block}.permission-option strong{font-size:13px}.permission-option small{font-size:10px;color:#a18f88;margin-top:3px}
.location-access-summary{padding:15px;border:1px solid #ecdfd7;border-radius:15px;background:#fffaf7}.location-capability-list{display:grid;gap:8px}.location-capability-row{display:flex;justify-content:space-between;gap:12px;padding:9px 11px;border-radius:10px;background:#fff;border:1px solid #eee4df}.location-capability-row strong small{font-weight:500;color:#98837c}.location-capability-row>span{font-size:12px;color:#a26715;text-align:right}
.system-location-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;border-radius:14px;border:1px solid #ecdfd8;background:#fff}.system-location-card.inactive{opacity:.55;background:#f5f1ef}.system-location-card strong,.system-location-card span{display:block}.system-location-card span{font-size:12px;color:#8d7973;margin-top:3px}
.owner-access-badge{padding:9px 12px;border-radius:999px;background:#fff1d1;color:#8d5a00;border:1px solid #ebc36e}.location-access-table table{min-width:690px}.location-access-table td:not(:first-child),.location-access-table th:not(:first-child){text-align:center}
.access-check{display:inline-grid;place-items:center;cursor:pointer}.access-check input{position:absolute;opacity:0}.access-check span{width:25px;height:25px;border:1px solid #d8c9c2;border-radius:8px;background:#fff;position:relative;transition:.15s ease}.access-check input:checked+span{background:linear-gradient(145deg,#9d0710,#d32029);border-color:#9d0710;box-shadow:0 5px 12px rgba(157,7,16,.16)}.access-check input:checked+span:after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:14px;font-weight:900}.access-check input:disabled+span{opacity:.45;cursor:not-allowed}
.account-summary-card{align-items:flex-start}.account-summary-card h4{margin:0}.account-info-row{width:100%;display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-top:1px solid #eee4df}
@media(max-width:767px){.permission-grid{grid-template-columns:1fr}.staff-account-item{grid-template-columns:38px 1fr auto}.staff-avatar{width:38px;height:38px}.system-control-banner{align-items:flex-start}.location-capability-row{flex-direction:column}.location-capability-row>span{text-align:left}}

/* ===== 2026-08 Premium live dashboard / fast purchase / transfer / reports ===== */
.product-code-badge{display:inline-flex;align-items:center;padding:5px 9px;border-radius:8px;background:#18181b;color:#fff;font:800 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em;white-space:nowrap}
.product-editor-card,.product-list-card{border:1px solid #eee3dd;box-shadow:0 12px 34px rgba(73,37,28,.06)}

/* Live dashboard */
.live-dashboard{display:grid;gap:15px;padding-bottom:18px}
.dashboard-live-strip{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:12px 16px;border:1px solid #eadfd9;border-radius:15px;background:linear-gradient(135deg,#fff,#fff9f5);box-shadow:0 8px 24px rgba(92,48,37,.05)}
.dashboard-live-strip>div{display:flex;align-items:center;gap:9px}.dashboard-live-strip strong{font-size:13px}.dashboard-live-strip small{font-size:11px;color:#9a817a}.live-dot{width:10px;height:10px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.5);animation:livePulse 1.8s infinite}.live-sync{font-size:11px;color:#8e7770}.live-sync i{color:#9d0710}.just-synced .live-sync i{animation:dashSpin .48s linear}
@keyframes livePulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.5)}70%{box-shadow:0 0 0 8px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}@keyframes dashSpin{to{transform:rotate(360deg)}}
.live-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.live-kpi{position:relative;overflow:hidden;min-height:138px;border-radius:20px;padding:18px;display:flex;align-items:flex-start;gap:14px;color:#fff;box-shadow:0 16px 34px rgba(75,34,27,.14);isolation:isolate}.live-kpi:before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,rgba(255,255,255,.14),transparent 55%);z-index:-1}.kpi-sales{background:linear-gradient(135deg,#97040d,#df2530)}.kpi-month{background:linear-gradient(135deg,#9a5700,#e8a019)}.kpi-stock{background:linear-gradient(135deg,#166534,#22a95a)}.kpi-credit{background:linear-gradient(135deg,#263b77,#4f71c8)}
.kpi-icon{width:46px;height:46px;flex:0 0 46px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.17);border:1px solid rgba(255,255,255,.18);font-size:21px}.live-kpi>div:nth-child(2){min-width:0}.live-kpi span,.live-kpi strong,.live-kpi small{display:block}.live-kpi span{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;opacity:.82}.live-kpi strong{font-size:24px;line-height:1.1;margin:7px 0 9px;white-space:nowrap}.live-kpi small{font-size:10px;opacity:.82}.live-kpi small b{font-size:11px}.kpi-wave{position:absolute;right:-34px;bottom:-52px;width:160px;height:115px;border-radius:50%;border:23px solid rgba(255,255,255,.07);transform:rotate(-18deg);z-index:-1}
.dashboard-main-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(330px,.75fr);gap:14px}.dashboard-bottom-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(330px,.75fr);gap:14px}.dashboard-premium-card{border:1px solid #eadfd9!important;border-radius:20px!important;box-shadow:0 14px 36px rgba(78,40,30,.065)!important;background:#fff;overflow:hidden;padding:18px}.premium-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.premium-card-head .eyebrow,.report-card-heading span{display:block;font-size:9px;font-weight:900;letter-spacing:.12em;color:#ac8b81;margin-bottom:4px}.premium-card-head h4,.report-card-heading h4{margin:0;font-size:17px;font-weight:850;color:#392b27}.mini-link{font-size:11px;font-weight:800;text-decoration:none;color:#9d0710;padding:7px 9px;border-radius:9px;background:#fff4f2}.mini-link:hover{background:#9d0710;color:#fff}
.live-bar-chart{height:245px;display:grid;grid-template-columns:repeat(7,1fr);align-items:end;gap:10px;padding:15px 8px 4px;border-radius:16px;background:linear-gradient(180deg,#fffaf7,#fff);border:1px solid #f3e9e4}.live-bar-col{height:100%;display:grid;grid-template-rows:22px 1fr 21px;gap:5px;text-align:center;align-items:end}.live-bar-col .bar-value{font-size:9px;color:#a18880;opacity:0;transition:.2s}.live-bar-col:hover .bar-value{opacity:1}.live-bar-track{height:100%;border-radius:9px;background:repeating-linear-gradient(to top,#f4ebe7 0,#f4ebe7 1px,transparent 1px,transparent 28px);display:flex;align-items:flex-end;padding:0 20%;overflow:hidden}.live-bar-track i{display:block;width:100%;min-height:4px;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,#ef4650,#9d0710);box-shadow:0 8px 15px rgba(157,7,16,.18);transition:height .45s ease}.live-bar-col b{font-size:10px;color:#806b65}.chart-foot-note{font-size:10px;color:#9a847d;margin-top:10px}
.location-pulse-list{display:grid;gap:8px;max-height:293px;overflow:auto;padding-right:2px}.location-pulse-row{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:10px;padding:11px;border:1px solid #f0e5df;border-radius:14px;background:#fffdfb}.location-type-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-size:17px}.location-type-icon.shop{background:#fff0f0;color:#b00a13}.location-type-icon.warehouse{background:#fff6db;color:#9b6500}.location-pulse-row strong,.location-pulse-row small,.pulse-numbers b,.pulse-numbers span{display:block}.location-pulse-row strong{font-size:12px}.location-pulse-row small{font-size:9px;color:#9c8983;margin-top:2px}.pulse-numbers{text-align:right}.pulse-numbers b{font-size:11px}.pulse-numbers span{font-size:9px;color:#8e7770;margin-top:2px}.dashboard-empty{padding:30px;text-align:center;color:#a18b84;font-size:12px}
.dashboard-transaction-list{display:grid;gap:7px}.dashboard-tx{display:grid;grid-template-columns:39px 1fr auto;align-items:center;gap:10px;padding:10px 11px;border-radius:13px;border:1px solid #f0e6e1;background:#fff}.tx-icon{width:39px;height:39px;border-radius:12px;display:grid;place-items:center;background:#fff0ef;color:#a90811}.tx-main strong,.tx-main small,.tx-money b,.tx-money span{display:block}.tx-main strong{font-size:11px}.tx-main small{font-size:9.5px;color:#9a837c;margin-top:3px}.tx-money{text-align:right}.tx-money b{font-size:11px}.tx-money span{font-size:9px;color:#9a837c;margin-top:2px}.dashboard-command-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.dashboard-command-grid a{min-height:105px;padding:13px;border:1px solid #eee3dd;border-radius:16px;text-decoration:none;color:#40302c;background:linear-gradient(145deg,#fff,#fffaf7);transition:.2s ease;display:flex;flex-direction:column;justify-content:center}.dashboard-command-grid a:hover{transform:translateY(-2px);border-color:#d9b2a3;box-shadow:0 10px 24px rgba(90,45,35,.09)}.dashboard-command-grid i{font-size:20px;color:#9d0710;margin-bottom:9px}.dashboard-command-grid strong,.dashboard-command-grid span{display:block}.dashboard-command-grid strong{font-size:12px}.dashboard-command-grid span{font-size:9px;color:#9b8780;margin-top:2px}

/* Fast Purchase / Transfer */
.purchase-pos-layout,.transfer-pos-layout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(520px,.88fr);gap:14px;align-items:start}.purchase-catalog-panel,.purchase-cart-panel,.transfer-catalog-panel,.transfer-cart-panel{border:1px solid #eadfd9!important;border-radius:19px!important;box-shadow:0 13px 34px rgba(72,38,29,.06)!important}.purchase-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:12px}.purchase-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;max-height:590px;overflow:auto;padding:1px 3px 1px 1px}.purchase-product-card{position:relative;min-height:116px;text-align:left;padding:13px;border:1px solid #eee3de;border-radius:15px;background:linear-gradient(145deg,#fff,#fffaf7);color:#3e302c;transition:.18s ease;overflow:hidden}.purchase-product-card:hover{border-color:#d9ab9d;box-shadow:0 9px 22px rgba(92,49,36,.09);transform:translateY(-1px)}.purchase-product-card strong,.purchase-product-card small,.purchase-card-code{display:block}.purchase-product-card strong{font-size:12.5px;line-height:1.3;margin:10px 25px 5px 0}.purchase-product-card small{font-size:9px;color:#9a837c}.purchase-card-code{width:max-content;max-width:calc(100% - 34px);overflow:hidden;text-overflow:ellipsis;padding:4px 7px;border-radius:7px;background:#221c1a;color:#fff;font:800 9px/1 ui-monospace,monospace}.purchase-add-icon{position:absolute;right:10px;top:10px;width:28px;height:28px;border-radius:9px;display:grid!important;place-items:center;background:#fff0ef;color:#9d0710;font-size:13px}.purchase-product-card.is-out{opacity:.43;cursor:not-allowed}.purchase-product-card.is-out .purchase-add-icon{background:#eee;color:#999}
.purchase-head-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.purchase-cart-scroll{max-height:430px;overflow:auto;border:1px solid #f0e6e1;border-radius:14px}.purchase-cart-table{min-width:610px!important}.purchase-cart-table th{position:sticky;top:0;z-index:2;background:#fbf8f6!important;font-size:9px!important;text-transform:uppercase;letter-spacing:.06em;color:#8c756e!important}.purchase-cart-table td{font-size:10px}.purchase-cart-table td:first-child strong,.purchase-cart-table td:first-child small{display:block}.purchase-cart-table td:first-child small{font-size:8.5px;color:#9b8780;margin-top:2px}.purchase-cart-table input{min-width:72px}.purchase-cart-table .pc-line-total{white-space:nowrap}.cart-row-flash{animation:cartFlash .35s ease}@keyframes cartFlash{50%{background:#fff1d9}}
.purchase-summary{display:grid;grid-template-columns:.6fr .75fr 1.65fr;gap:8px;margin-top:12px}.purchase-summary>div{padding:10px 12px;border-radius:12px;border:1px solid #eee3dd;background:#fffaf7}.purchase-summary span,.purchase-summary strong{display:block}.purchase-summary span{font-size:8.5px;text-transform:uppercase;font-weight:800;color:#9d8881}.purchase-summary strong{font-size:15px;margin-top:3px}.purchase-summary .purchase-grand{background:linear-gradient(135deg,#8e030b,#bd1721);color:#fff;border-color:transparent}.purchase-summary .purchase-grand span{color:rgba(255,255,255,.7)}.purchase-summary .purchase-grand strong{font-size:16px;white-space:nowrap}
.transfer-route-card{display:grid;grid-template-columns:1fr 38px 1fr;gap:8px;align-items:end;padding:12px;border-radius:15px;background:linear-gradient(135deg,#fff7f5,#fffdfb);border:1px solid #eee2dc}.route-arrow{height:38px;display:grid;place-items:center;color:#9d0710;font-size:17px}.transfer-stock-label{font-weight:800!important;color:#806c65!important}.transfer-product-grid{max-height:500px}.transfer-cart-panel{position:sticky;top:85px}

/* Modern reports */
.report-preset-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:11px;padding:9px 12px;border-radius:13px;background:#fff;border:1px solid #eee3dd;box-shadow:0 7px 20px rgba(70,35,27,.04)}.report-preset-bar>span{font-size:9px;font-weight:900;color:#9c8882;text-transform:uppercase;letter-spacing:.08em}.report-preset-bar a{font-size:10px;text-decoration:none;color:#6a514b;padding:6px 9px;border-radius:9px;background:#f9f4f1;font-weight:750}.report-preset-bar a:hover{background:#9d0710;color:#fff}.report-preset-bar strong{margin-left:auto;font-size:10px;color:#57423d}.report-filter-grid{display:grid;grid-template-columns:1fr 1fr 1.25fr 1.15fr auto;gap:9px;align-items:end}.report-filter-grid label{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.06em;font-weight:850;color:#8f7770;margin-bottom:5px}.report-filter-grid .btn{height:38px;white-space:nowrap}.modern-tabs{display:flex;gap:7px;padding:6px;border-radius:15px;background:#fff;border:1px solid #eee2dc;overflow:auto}.modern-tabs .report-tab{display:flex;align-items:center;gap:7px;min-width:max-content;padding:9px 13px;border-radius:10px;text-decoration:none;color:#78615a;font-size:10px;font-weight:800}.modern-tabs .report-tab.active{background:linear-gradient(135deg,#96040d,#c91a24);color:#fff;box-shadow:0 7px 16px rgba(157,7,16,.18)}
.report-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}.report-kpi{min-height:112px;display:flex;gap:12px;align-items:center;padding:14px;border-radius:17px;background:#fff;border:1px solid #eee3dd;box-shadow:0 10px 28px rgba(70,35,27,.055)}.rk-icon{width:42px;height:42px;flex:0 0 42px;border-radius:13px;display:grid;place-items:center;font-size:18px}.rk-green .rk-icon{background:#e9f8ef;color:#138743}.rk-red .rk-icon{background:#fff0f0;color:#b20c15}.rk-gold .rk-icon{background:#fff6dc;color:#9d6800}.rk-blue .rk-icon{background:#eef3ff;color:#315db5}.report-kpi small,.report-kpi strong,.report-kpi div>span{display:block}.report-kpi small{font-size:9px;text-transform:uppercase;font-weight:850;letter-spacing:.06em;color:#9c8881}.report-kpi strong{font-size:18px;margin:4px 0;white-space:nowrap}.report-kpi div>span{font-size:9px;color:#9a837d}
.report-overview-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(320px,.75fr);gap:13px}.report-visual-card,.report-table-card{border:1px solid #eadfd9!important;border-radius:18px!important;box-shadow:0 12px 32px rgba(72,37,28,.055)!important;padding:16px;overflow:hidden}.report-card-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:13px}.report-card-heading small{font-size:9px;color:#9d8780}.collection-pill{padding:7px 10px;border-radius:999px;background:#ebf8ef;color:#1b8a49;font-size:10px;font-weight:850}.report-bar-area{height:245px;display:flex;align-items:end;gap:8px;overflow-x:auto;padding:10px 3px 0}.report-bar{height:100%;min-width:45px;flex:1;display:grid;grid-template-rows:19px 1fr 22px;text-align:center;align-items:end}.report-bar span{font-size:8px;color:#9a847d}.report-bar i{display:block;width:60%;margin:0 auto;border-radius:8px 8px 2px 2px;background:linear-gradient(180deg,#36b86a,#167a42);box-shadow:0 8px 15px rgba(26,135,75,.14)}.report-bar b{font-size:8.5px;color:#7f6963;white-space:nowrap}.report-empty{padding:35px;width:100%;text-align:center;color:#a28d86;font-size:11px}.report-progress-list{display:grid;gap:13px}.report-progress-row{display:grid;grid-template-columns:1fr auto;gap:5px}.report-progress-row>div strong,.report-progress-row>div span{display:block}.report-progress-row>div strong{font-size:11px}.report-progress-row>div span{font-size:8.5px;color:#a08982;margin-top:2px}.report-progress-row>b{font-size:10px}.report-progress-row>i{grid-column:1/-1;height:6px;border-radius:999px;background:#f3ebe7;overflow:hidden}.report-progress-row>i em{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#a0060f,#e1424b)}.report-table-card{padding:0}.report-table-card .report-card-heading{padding:15px 16px 11px;margin:0;border-bottom:1px solid #f0e6e1}.report-table-card table th{font-size:8.5px!important;text-transform:uppercase;letter-spacing:.05em;color:#8c756e!important;background:#fcfaf9!important}.report-table-card table td{font-size:10px}.report-table-card table td strong,.report-table-card table td small{display:block}.report-table-card table td small{font-size:8.5px;color:#9c8780;margin-top:2px}.rank-badge{width:24px;height:24px;border-radius:8px;display:grid;place-items:center;background:#fff1ef;color:#a0060f;font-size:9px;font-weight:900}.payment-badge{display:inline-flex;padding:5px 8px;border-radius:8px;background:#eef4ff;color:#315cae;font-size:9px;font-weight:850}.credit-balance-list{display:grid;max-height:520px;overflow:auto}.credit-balance-list>div{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 15px;border-bottom:1px solid #f1e8e4}.credit-balance-list strong,.credit-balance-list small{display:block}.credit-balance-list strong{font-size:11px}.credit-balance-list small{font-size:8.5px;color:#9d8780;margin-top:2px}.credit-balance-list b{font-size:10px;color:#b00a13;white-space:nowrap}

@media(max-width:1250px){.live-kpi-grid,.report-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-main-grid,.dashboard-bottom-grid,.report-overview-grid{grid-template-columns:1fr}.purchase-pos-layout,.transfer-pos-layout{grid-template-columns:1fr}.purchase-cart-panel,.transfer-cart-panel{position:static}.purchase-product-grid{grid-template-columns:repeat(4,minmax(0,1fr));max-height:400px}.report-filter-grid{grid-template-columns:repeat(4,1fr)}.report-filter-grid .btn{grid-column:1/-1}}
@media(max-width:850px){.purchase-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.report-filter-grid{grid-template-columns:1fr 1fr}.report-filter-grid>div:nth-child(3),.report-filter-grid>div:nth-child(4),.report-filter-grid .btn{grid-column:1/-1}.dashboard-live-strip{align-items:flex-start}.dashboard-live-strip>div:first-child{flex-wrap:wrap}.live-sync{white-space:nowrap}.purchase-head-grid{grid-template-columns:1fr}.transfer-route-card{grid-template-columns:1fr}.route-arrow{transform:rotate(90deg);height:24px}.report-preset-bar strong{width:100%;margin-left:0}}
@media(max-width:560px){.live-kpi-grid,.report-kpi-grid{grid-template-columns:1fr}.live-kpi{min-height:112px}.live-kpi strong{font-size:20px}.dashboard-live-strip{flex-direction:column}.live-bar-chart{height:210px;gap:4px}.live-bar-track{padding:0 12%}.dashboard-premium-card{padding:13px}.purchase-product-grid{grid-template-columns:1fr 1fr}.purchase-product-card{min-height:105px;padding:11px}.purchase-summary{grid-template-columns:1fr 1fr}.purchase-summary .purchase-grand{grid-column:1/-1}.report-filter-grid{grid-template-columns:1fr}.report-filter-grid>div,.report-filter-grid .btn{grid-column:1/-1}.modern-tabs .report-tab span{display:none}.modern-tabs .report-tab{min-width:42px;justify-content:center;font-size:14px}.report-preset-bar a{flex:1;text-align:center}.dashboard-command-grid{grid-template-columns:1fr 1fr}}

@media print{.sidebar,.topbar,.report-preset-bar,.report-filter-card,.report-tabs,.btn,.content-loader,.app-loader{display:none!important}.main-content{margin:0!important;padding:0!important}.page-content{padding:0!important}.report-kpi-grid{grid-template-columns:repeat(4,1fr)!important}.report-table-card,.report-visual-card,.report-kpi{box-shadow:none!important;break-inside:avoid}.report-overview-grid{grid-template-columns:1fr 1fr!important}}


/* ===== Tablet-first multi-product Purchase + Stock Transfer ===== */
.tablet-pos-shell{display:grid;gap:12px}.tablet-context-bar{display:grid;grid-template-columns:minmax(220px,1fr) minmax(220px,1fr) minmax(155px,.55fr);gap:10px;align-items:end;padding:12px;border:1px solid #eadfd9;border-radius:18px;background:linear-gradient(145deg,#fff,#fff9f6);box-shadow:0 10px 28px rgba(72,38,29,.055)}
.transfer-context-bar{grid-template-columns:minmax(210px,1fr) 42px minmax(210px,1fr) minmax(155px,.55fr)}.tablet-context-field label{display:flex;align-items:center;gap:6px;margin:0 0 6px;font-size:9px;font-weight:900;letter-spacing:.07em;text-transform:uppercase;color:#806b64}.tablet-context-field .form-select{min-height:48px;border-radius:12px;border-color:#e6d9d3;font-size:12px;font-weight:750;padding-top:8px;padding-bottom:8px}.tablet-context-status{min-height:48px;padding:8px 12px;border-radius:12px;background:#211b19;color:#fff;display:flex;flex-direction:column;justify-content:center}.tablet-context-status span{font-size:8px;text-transform:uppercase;letter-spacing:.08em;color:#cdbfba;font-weight:800}.tablet-context-status strong{font-size:14px;line-height:1.25}.tablet-context-status small{font-size:8.5px;color:#bbaaa4;margin-top:2px}.tablet-route-arrow{height:48px;display:grid;place-items:center;color:#a30811;font-size:19px}.tablet-pos-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(440px,.95fr);gap:12px;align-items:start}.tablet-catalog-panel,.tablet-cart-panel{padding:0!important;overflow:hidden;border:1px solid #eadfd9!important;border-radius:19px!important;box-shadow:0 13px 34px rgba(72,38,29,.06)!important}.tablet-panel-head{min-height:61px;padding:11px 13px;border-bottom:1px solid #efe5e0;display:flex;align-items:center;justify-content:space-between;gap:10px;background:linear-gradient(180deg,#fff,#fffcfa)}.tablet-panel-head>div:first-child{display:flex;align-items:center;gap:9px;min-width:0}.tablet-panel-head strong,.tablet-panel-head small{display:block}.tablet-panel-head strong{font-size:13px}.tablet-panel-head small{font-size:8.8px;color:#958079;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tablet-step{width:32px;height:32px;flex:0 0 32px;border-radius:10px;display:grid!important;place-items:center;background:linear-gradient(135deg,#90030c,#c51822);color:#fff;font-size:12px;font-weight:900;box-shadow:0 7px 15px rgba(157,7,16,.16)}.tablet-search-row{display:grid;grid-template-columns:1fr 44px;gap:7px;padding:10px 12px 8px;background:#fff;position:sticky;top:0;z-index:5}.tablet-search-box{height:46px;display:flex;align-items:center;gap:9px;padding:0 12px;border:1px solid #e7dbd6;border-radius:12px;background:#fbf8f6}.tablet-search-box i{color:#a30811}.tablet-search-box .form-control{border:0!important;box-shadow:none!important;background:transparent!important;padding:0!important;font-size:12px}.tablet-clear-search{width:44px;height:44px;border:1px solid #e7dbd6;border-radius:12px;background:#fff;color:#806d67}.tablet-product-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;max-height:600px!important;overflow:auto!important;padding:3px 12px 12px!important;align-content:start}.tablet-product-card{position:relative;min-height:114px!important;padding:12px!important;text-align:left;border:1px solid #eee2dc!important;border-radius:15px!important;background:linear-gradient(145deg,#fff,#fffaf7)!important;color:#3f302c!important;overflow:hidden;transition:.15s ease;touch-action:manipulation}.tablet-product-card:active{transform:scale(.985)}.tablet-product-card.is-selected{border-color:#bd1721!important;box-shadow:inset 0 0 0 1px rgba(189,23,33,.12),0 7px 18px rgba(115,15,20,.08)!important}.tablet-product-code{display:block;width:max-content;max-width:calc(100% - 38px);padding:4px 7px;border-radius:7px;background:#211b19;color:#fff;font:800 9px/1 ui-monospace,monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tablet-product-card strong{display:block;margin:10px 24px 5px 0;font-size:12px;line-height:1.28}.tablet-product-card small{display:block;font-size:8.7px;color:#937f78}.tablet-add-icon{position:absolute;right:9px;top:9px;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:#fff0ef;color:#a30811;font-size:14px}.tablet-selected-badge{position:absolute;right:7px;bottom:7px;min-width:28px;height:24px;padding:0 7px;border-radius:999px;display:none;place-items:center;background:#a30710;color:#fff;border:2px solid #fff;font-size:10px;font-weight:900;box-shadow:0 5px 12px rgba(140,4,12,.22)}.tablet-selected-badge.show{display:grid}.tablet-product-card.is-out{opacity:.42;cursor:not-allowed;filter:grayscale(.35)}.tablet-empty,.tablet-cart-empty{min-height:170px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#9c8881}.tablet-empty i,.tablet-cart-empty i{font-size:28px;color:#c8b6b0;margin-bottom:7px}.tablet-empty strong,.tablet-cart-empty strong{font-size:12px}.tablet-empty small,.tablet-cart-empty small{font-size:9px;margin-top:3px}.tablet-cart-panel{position:sticky!important;top:82px;display:grid;grid-template-rows:auto minmax(180px,1fr) auto;max-height:calc(100vh - 105px)}.tablet-clear-cart{min-height:38px;padding:0 11px!important;border:1px solid #efd1d1!important;border-radius:10px!important;background:#fff6f6!important;color:#a30a13!important;font-size:10px!important;font-weight:800!important}.tablet-cart-list{overflow:auto;padding:10px;display:flex;flex-direction:column;gap:8px;background:#fcfaf9;min-height:240px}.tablet-cart-item{padding:11px;border:1px solid #eadfd9;border-radius:15px;background:#fff;box-shadow:0 5px 13px rgba(73,37,29,.035)}.touch-item-title{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding-bottom:8px;margin-bottom:8px;border-bottom:1px solid #f0e7e3}.touch-item-title strong,.touch-item-title small{display:block}.touch-item-title strong{font-size:11.5px;line-height:1.25}.touch-item-title small{font-size:8.5px;color:#9a857e;margin-top:3px}.touch-remove{width:38px;height:38px;flex:0 0 38px;border:1px solid #efd4d4;border-radius:10px;background:#fff7f7;color:#ac1119}.touch-edit-grid{display:grid;gap:7px;align-items:end}.purchase-edit-grid{grid-template-columns:minmax(120px,.9fr) minmax(88px,.75fr) minmax(88px,.75fr) minmax(100px,.8fr)}.transfer-edit-grid{grid-template-columns:120px minmax(170px,1fr)}.touch-field label,.touch-line-total span,.touch-stock-box span{display:block;margin-bottom:4px;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;color:#99837c}.touch-field>input,.touch-stepper input{width:100%;height:44px;border:1px solid #dfd2cd;border-radius:10px;background:#fff;font-size:12px;font-weight:800;text-align:center;outline:none}.touch-field>input:focus,.touch-stepper input:focus{border-color:#bd1721;box-shadow:0 0 0 3px rgba(189,23,33,.08)}.touch-stepper{display:grid;grid-template-columns:44px minmax(56px,1fr) 44px;gap:5px}.touch-stepper button{width:44px;height:44px;border:0;border-radius:10px;background:#2b2421;color:#fff;font-size:21px;font-weight:700;touch-action:manipulation}.touch-stepper button:last-child{background:linear-gradient(135deg,#9b0610,#c51b25)}.touch-line-total{height:44px;padding:6px 9px;border-radius:10px;background:#fff6e9;border:1px solid #f1dfbd;display:flex;flex-direction:column;justify-content:center}.touch-line-total span{margin:0}.touch-line-total strong{font-size:11px;color:#8a5700;white-space:nowrap}.touch-stock-box{height:62px;padding:8px 11px;border-radius:12px;background:#f4f8ff;border:1px solid #dae5f5;display:flex;flex-direction:column;justify-content:center}.touch-stock-box span{margin:0}.touch-stock-box strong{font-size:17px;color:#315cae}.tablet-cart-footer{padding:10px;border-top:1px solid #eadfd9;background:#fff}.tablet-summary-grid{margin:0!important}.tablet-summary-grid>div{min-height:53px!important;padding:8px 10px!important}.tablet-summary-grid strong{font-size:14px!important}.tablet-summary-grid .purchase-grand strong{font-size:13px!important;overflow:hidden;text-overflow:ellipsis}.tablet-switch-row{margin-top:8px;min-height:48px;padding:8px 10px;display:flex;align-items:center;gap:10px;border-radius:11px;border:1px solid #eee2dc;background:#fffaf7;cursor:pointer}.tablet-switch-row input{width:20px;height:20px}.tablet-switch-row b,.tablet-switch-row small{display:block}.tablet-switch-row b{font-size:10px}.tablet-switch-row small{font-size:8.5px;color:#9a847d}.tablet-submit-btn{margin-top:8px;width:100%;min-height:52px;border:0!important;border-radius:13px!important;display:grid!important;grid-template-columns:28px 1fr auto;align-items:center;gap:8px;padding:0 14px!important;background:linear-gradient(135deg,#8f030c,#c91923)!important;box-shadow:0 10px 20px rgba(157,7,16,.18)!important;font-size:12px!important;font-weight:850!important}.tablet-submit-btn:disabled{box-shadow:none!important}.tablet-submit-btn i{font-size:18px}.tablet-submit-btn span{text-align:left}.tablet-submit-btn b{font-size:9px;padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.16)}.tablet-note-wrap{margin-top:8px}.tablet-note-wrap label{display:block;margin-bottom:5px;font-size:9px;font-weight:850;color:#806c65}.tablet-note-wrap label span{font-weight:500;color:#a7928b}.tablet-note-wrap textarea{resize:none;border-radius:11px;font-size:10px}.field-attention{animation:fieldAttention .7s ease}@keyframes fieldAttention{25%,75%{box-shadow:0 0 0 4px rgba(189,23,33,.15);border-color:#bd1721}}

/* Landscape tablets: keep products and cart side-by-side and make the app workspace wider. */
@media (min-width:900px) and (max-width:1250px){.tablet-pos-layout{grid-template-columns:minmax(0,1fr) minmax(410px,.92fr)!important}.tablet-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-height:520px!important}.tablet-cart-panel{position:sticky!important;top:78px!important}.tablet-workspace-page .main-content{padding:12px 13px}.tablet-workspace-page .page-title{margin-bottom:10px}.tablet-workspace-page .topbar{min-height:63px}.tablet-workspace-page .tablet-product-card{min-height:106px!important}.tablet-workspace-page .tablet-cart-list{min-height:215px}.tablet-workspace-page .purchase-edit-grid{grid-template-columns:minmax(120px,1fr) minmax(80px,.7fr) minmax(80px,.7fr)}.tablet-workspace-page .purchase-edit-grid .touch-line-total{grid-column:1/-1;height:38px;flex-direction:row;align-items:center;justify-content:space-between}.tablet-workspace-page .purchase-edit-grid .touch-line-total span{margin:0}.tablet-workspace-page .tablet-context-bar{padding:10px}.tablet-workspace-page .tablet-context-field .form-select{min-height:44px}}

/* Narrow tablets / portrait: stack the two steps but keep everything touch-sized. */
@media (max-width:899px){.tablet-pos-layout{grid-template-columns:1fr!important}.tablet-cart-panel{position:static!important;max-height:none}.tablet-context-bar{grid-template-columns:1fr 1fr}.transfer-context-bar{grid-template-columns:1fr 34px 1fr}.tablet-context-status{grid-column:1/-1}.transfer-context-bar .tablet-context-status{grid-column:1/-1}.tablet-product-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;max-height:390px!important}.tablet-cart-list{max-height:520px}.purchase-edit-grid{grid-template-columns:minmax(150px,1fr) 1fr 1fr}.purchase-edit-grid .touch-line-total{grid-column:1/-1;height:40px;flex-direction:row;align-items:center;justify-content:space-between}.tablet-cart-footer{position:sticky;bottom:0;z-index:4;box-shadow:0 -10px 22px rgba(48,29,24,.05)}}

@media (min-width:769px) and (max-width:1100px){.tablet-workspace-page .sidebar{width:88px}.tablet-workspace-page .main-content,.tablet-workspace-page.sidebar-collapsed .main-content{margin-left:88px}.tablet-workspace-page .brand-block{padding:8px}.tablet-workspace-page .brand-logo-wrap{height:74px}.tablet-workspace-page .brand-logo{width:72px;height:72px}.tablet-workspace-page .brand-copy,.tablet-workspace-page .upgrade-card,.tablet-workspace-page .sidebar-footer{display:none}.tablet-workspace-page .nav-item{justify-content:center;padding:0}.tablet-workspace-page .nav-label,.tablet-workspace-page .chevron,.tablet-workspace-page .submenu{display:none!important}.tablet-workspace-page .nav-item.active::before{left:-10px}}

@media (max-width:700px){.tablet-context-bar,.transfer-context-bar{grid-template-columns:1fr}.tablet-route-arrow{height:24px;transform:rotate(90deg)}.tablet-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.tablet-product-card{min-height:108px!important}.purchase-edit-grid,.transfer-edit-grid{grid-template-columns:1fr 1fr}.purchase-edit-grid .touch-qty-field,.transfer-edit-grid .touch-qty-field{grid-column:1/-1}.purchase-edit-grid .touch-line-total{grid-column:1/-1}.touch-stepper{grid-template-columns:48px minmax(70px,1fr) 48px}.touch-stepper button{width:48px;height:48px}.touch-field>input,.touch-stepper input{height:48px}.tablet-panel-head small{white-space:normal}.tablet-summary-grid{grid-template-columns:1fr 1fr!important}.tablet-summary-grid .purchase-grand{grid-column:1/-1}.tablet-submit-btn{min-height:56px}}

/* ===== Permission + safe invoice editing update ===== */
.invoice-edit-banner{display:flex;align-items:center;gap:14px;border:1px solid rgba(13,110,253,.18);background:linear-gradient(135deg,rgba(13,110,253,.08),rgba(255,255,255,.94));border-radius:16px;padding:14px 16px}.invoice-edit-banner>i{font-size:1.55rem}.invoice-edit-banner>div{display:flex;flex-direction:column;gap:2px;flex:1}.invoice-edit-banner>div span{font-size:.84rem;opacity:.78}.btn-xs{padding:.2rem .42rem;font-size:.75rem;border-radius:.5rem}.permission-option small{line-height:1.35}.permission-editor .badge.text-bg-dark{font-weight:600;letter-spacing:.02em}.invoice-edit-workspace{border:1px solid rgba(157,7,16,.1);box-shadow:0 18px 45px rgba(20,25,40,.07)}
.sale-edit-catalog{border:1px solid #e8ebf0;border-radius:18px;padding:14px;background:#fafbfc;min-height:460px}.sale-edit-product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-height:560px;overflow:auto;padding-right:3px}.sale-edit-product{position:relative;text-align:left;border:1px solid #e6e9ee;border-radius:15px;background:#fff;padding:12px;min-height:112px;display:flex;flex-direction:column;gap:5px;transition:.16s ease}.sale-edit-product:hover{border-color:rgba(157,7,16,.35);transform:translateY(-1px);box-shadow:0 9px 20px rgba(16,24,40,.07)}.sale-edit-product>span{font-size:.7rem;font-weight:800;color:#9d0710;letter-spacing:.04em}.sale-edit-product>strong{font-size:.9rem;line-height:1.25}.sale-edit-product>small{font-size:.72rem;color:#667085}.sale-edit-product>b{font-size:.82rem;margin-top:auto}.sale-edit-product.is-out{opacity:.45}.sale-edit-product.is-out:after{content:'NO STOCK';position:absolute;right:8px;top:8px;font-size:.58rem;background:#fef3f2;color:#b42318;padding:3px 5px;border-radius:5px;font-weight:800}.sale-edit-cart{display:flex;flex-direction:column;gap:9px;min-height:260px;max-height:470px;overflow:auto}.sale-edit-empty{padding:55px 20px;text-align:center;color:#98a2b3;border:1px dashed #d0d5dd;border-radius:15px}.sale-edit-row{border:1px solid #e4e7ec;border-radius:15px;padding:12px;background:#fff}.sale-edit-row.stock-error{border-color:#f04438;background:#fff8f7}.sale-edit-row-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}.sale-edit-row-head>div{display:flex;flex-direction:column}.sale-edit-row-head small{color:#667085;font-size:.75rem}.sei-remove{border:0;background:#f2f4f7;width:34px;height:34px;border-radius:10px}.sale-edit-row-controls{display:grid;grid-template-columns:145px 1fr auto;align-items:end;gap:10px}.sale-edit-row-controls label{font-size:.72rem;font-weight:700;color:#667085}.sale-edit-row-controls .touch-stepper{height:44px}.sale-edit-row-controls .sei-line{min-width:78px;text-align:right;padding-bottom:10px;font-size:.82rem}.sale-edit-totals{display:grid;gap:7px;padding:14px;border-radius:15px;background:#f8fafc;border:1px solid #eaecf0}.sale-edit-totals>div{display:flex;justify-content:space-between;gap:15px}.sale-edit-totals span{color:#667085;font-size:.82rem}.sale-edit-totals strong{font-size:.88rem}.sale-edit-totals .highlight{border-top:1px solid #e4e7ec;padding-top:9px;margin-top:2px}.sale-edit-totals .highlight strong{color:#9d0710;font-size:1rem}
@media(max-width:1199.98px){.sale-edit-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sale-edit-catalog{min-height:auto}.invoice-edit-workspace .col-xl-5{margin-top:4px}}
@media(max-width:767.98px){.invoice-edit-banner{align-items:flex-start;flex-wrap:wrap}.invoice-edit-banner .btn{width:100%}.sale-edit-product-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:430px}.sale-edit-row-controls{grid-template-columns:1fr 1fr}.sale-edit-row-controls .sei-line{grid-column:1/-1;text-align:right;padding:0}.invoice-edit-workspace{padding:12px!important}}
@media(max-width:420px){.sale-edit-product-grid{grid-template-columns:1fr 1fr}.sale-edit-product{padding:9px;min-height:105px}}
.permission-rule-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.permission-rule-strip>span{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center;padding:10px 11px;border:1px solid #eaecf0;border-radius:12px;background:#f8fafc}.permission-rule-strip i{grid-row:1/3;font-size:1.1rem;color:#9d0710}.permission-rule-strip b{font-size:.78rem}.permission-rule-strip small{font-size:.68rem;color:#667085}@media(max-width:767.98px){.permission-rule-strip{grid-template-columns:1fr}}

/* === 2026-08-25 POS-like Purchase / Transfer, Price Manager, Invoice Settings === */
.pos-category-strip{display:flex;gap:8px;overflow-x:auto;padding:2px 0 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}.pos-category-strip::-webkit-scrollbar{display:none}.pos-category-chip{flex:0 0 auto;border:1px solid #e4e7ec;background:#fff;color:#344054;border-radius:999px;padding:9px 15px;font-size:13px;font-weight:800;min-height:40px;transition:.18s ease}.pos-category-chip:hover{border-color:#f6a16d;transform:translateY(-1px)}.pos-category-chip.active{background:linear-gradient(135deg,#f97316,#ea580c);border-color:transparent;color:#fff;box-shadow:0 8px 20px rgba(249,115,22,.22)}
.purchase-catalog-panel .tablet-product-grid,.transfer-catalog-panel .tablet-product-grid{grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:10px}.purchase-product-card,.transfer-product-card{min-height:126px;text-align:left}.purchase-product-card strong,.transfer-product-card strong{font-size:14px;line-height:1.35}.purchase-product-card small,.transfer-product-card small{display:block;line-height:1.4;color:#667085}
.price-manager-toolbar{position:sticky;top:74px;z-index:8}.price-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(265px,1fr));gap:14px}.price-product-card{padding:16px;border:1px solid #eaecf0;border-radius:18px;box-shadow:0 8px 24px rgba(16,24,40,.045)}.price-product-head{display:flex;justify-content:space-between;gap:12px;margin-bottom:14px}.price-product-head>div{min-width:0}.price-product-head span{display:inline-flex;padding:4px 8px;border-radius:7px;background:#fff3eb;color:#c2410c;font-size:11px;font-weight:900}.price-product-head strong{display:block;margin-top:8px;font-size:16px}.price-product-head small{display:block;color:#667085;margin-top:2px}.price-product-head>i{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:#fff7ed;color:#ea580c;font-size:19px}.price-input-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.price-input-grid label,.price-note{font-size:12px;font-weight:800;color:#475467}.price-input-grid input,.price-note input{margin-top:5px}.price-note{display:block;margin:10px 0 12px}.price-note span{font-weight:500;color:#98a2b3}.price-old{text-decoration:line-through;color:#98a2b3}.report-table-card td small{display:block;color:#98a2b3;margin-top:2px}
.invoice-settings-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.75fr);gap:16px}.settings-section-title{display:flex;align-items:center;gap:12px;margin-bottom:20px}.settings-section-title>span{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:#fff3eb;color:#ea580c;font-size:20px}.settings-section-title h4{margin:0;font-weight:850}.settings-section-title p{margin:2px 0 0;color:#667085;font-size:13px}.invoice-color-input{display:flex;align-items:center;gap:10px;border:1px solid #d0d5dd;border-radius:10px;padding:5px 10px;height:42px}.invoice-color-input input{width:52px;height:30px;padding:0;border:0;background:transparent}.invoice-color-input strong{font-family:monospace}.invoice-logo-preview{height:190px;border:1px dashed #d0d5dd;border-radius:18px;background:#f8fafc;display:grid;place-items:center;margin-bottom:14px;overflow:hidden}.invoice-logo-preview img{max-width:80%;max-height:150px;object-fit:contain}.logo-upload-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:5px;border:1.5px dashed #f59e0b;border-radius:16px;padding:18px;background:#fffaf5;cursor:pointer}.logo-upload-drop i{font-size:26px;color:#ea580c}.logo-upload-drop small{color:#667085}.logo-upload-drop input{display:none}.invoice-action-group{display:flex;gap:6px;white-space:nowrap}.invoice-action{display:inline-flex;align-items:center;gap:5px;border:1px solid #d0d5dd;border-radius:8px;padding:6px 9px;color:#344054;text-decoration:none;font-size:12px;font-weight:800;background:#fff}.invoice-action:hover{border-color:#f97316;color:#c2410c}.invoice-action.primary{background:#fff3eb;border-color:#fed7aa;color:#c2410c}
@media(max-width:1100px){.invoice-settings-grid{grid-template-columns:1fr}.price-manager-toolbar{top:62px}.price-card-grid{grid-template-columns:repeat(auto-fill,minmax(235px,1fr))}}
@media(max-width:760px){.price-card-grid{grid-template-columns:1fr}.price-input-grid{grid-template-columns:1fr 1fr}.invoice-action-group{flex-wrap:wrap}.purchase-catalog-panel .tablet-product-grid,.transfer-catalog-panel .tablet-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pos-category-chip{min-height:44px;padding:10px 15px}}

/* ===== 2026-08-25 Tablet-first full UI/UX pass ===== */
@media (min-width:769px) and (max-width:1366px) {
  :root { --tablet-rail: 84px; --tablet-touch: 44px; }
  html { -webkit-text-size-adjust: 100%; }
  body { overscroll-behavior-x: none; }

  /* Compact navigation rail by default; tap Menu to open the full drawer. */
  .sidebar { width:var(--tablet-rail)!important; }
  .main-content,
  body.sidebar-collapsed .main-content { margin-left:var(--tablet-rail)!important; padding:12px!important; }
  .brand-block { padding:8px 7px!important; }
  .brand-logo-wrap,.brand-logo-stage { height:72px!important; }
  .brand-logo { width:72px!important; height:72px!important; }
  .brand-copy,.upgrade-card,.sidebar-footer { display:none!important; }
  .nav-menu { padding:7px 8px 12px!important; }
  .nav-item { min-height:48px!important; justify-content:center!important; padding:0!important; border-radius:12px!important; }
  .nav-item svg { width:23px!important; height:23px!important; }
  .nav-label,.nav-item .chevron,.submenu { display:none!important; }
  .nav-item.active::before { left:-8px!important; }

  body.tablet-menu-open { overflow:hidden; }
  body.tablet-menu-open .sidebar { width:260px!important; box-shadow:18px 0 45px rgba(40,0,0,.28)!important; }
  body.tablet-menu-open .brand-block { padding:13px 14px 9px!important; }
  body.tablet-menu-open .brand-logo-wrap,
  body.tablet-menu-open .brand-logo-stage { height:96px!important; }
  body.tablet-menu-open .brand-logo { width:104px!important; height:104px!important; }
  body.tablet-menu-open .brand-copy { display:block!important; }
  body.tablet-menu-open .brand-copy h1 { font-size:23px!important; }
  body.tablet-menu-open .brand-copy p { font-size:10px!important; }
  body.tablet-menu-open .nav-item { justify-content:flex-start!important; padding:0 13px!important; }
  body.tablet-menu-open .nav-label,
  body.tablet-menu-open .nav-item .chevron { display:block!important; }
  body.tablet-menu-open .nav-group.open .submenu { display:block!important; max-height:170px!important; }
  body.tablet-menu-open .mobile-overlay { display:block!important; position:fixed; inset:0; z-index:25; background:rgba(13,7,7,.38); backdrop-filter:blur(2px); }

  /* Header is compact but remains finger-friendly. */
  .topbar { min-height:64px!important; height:auto!important; padding:7px 9px!important; gap:10px!important; border-radius:13px!important; }
  .header-left { gap:9px!important; min-width:0; }
  .header-left h2 { font-size:19px!important; line-height:1.15!important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:38vw; }
  .header-left p { font-size:10px!important; max-width:34vw; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .header-actions { gap:7px!important; }
  .icon-button,.date-button,.profile-button { min-height:44px!important; }
  .icon-button { width:44px!important; height:44px!important; }
  .date-button { padding:0 10px!important; font-size:10px!important; }
  .profile-button { padding:4px 7px!important; }
  .profile-button .avatar { width:36px!important; height:36px!important; }
  .notification-button { display:none!important; }
  .header-actions .search-box { display:flex!important; width:min(250px,24vw)!important; height:44px!important; }
  .header-actions .search-box input { min-width:0!important; font-size:12px!important; }

  /* Common content density and touch targets. */
  .page-content { min-width:0; }
  .page-title { min-height:58px!important; padding:10px 12px!important; margin-bottom:10px!important; border-radius:13px!important; }
  .page-title h2 { font-size:19px!important; }
  .page-subtitle { font-size:10.5px!important; line-height:1.35!important; }
  .card { border-radius:13px!important; }
  .card.p-3 { padding:13px!important; }
  .page-content .form-control,
  .page-content .form-select,
  .page-content .btn:not(.btn-xs),
  .page-content button:not(.btn-xs):not(.qty-btn):not(.cat-slide-btn) { min-height:var(--tablet-touch); }
  .page-content .form-control,
  .page-content .form-select { font-size:13px!important; border-radius:10px!important; }
  .page-content textarea.form-control { min-height:74px; }
  .page-content .btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; }
  .btn-sm { min-height:40px!important; padding:.42rem .68rem!important; }
  .btn-xs { min-height:32px!important; }
  .badge,.soft-badge,.location-pill,.payment-badge { white-space:nowrap; }

  /* Tables never squeeze into unreadable columns. */
  .table-responsive { overflow-x:auto!important; -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity; border-radius:11px!important; }
  .table-responsive::after { content:"Swipe table ↔"; display:block; position:sticky; left:0; width:max-content; margin:5px 8px 2px auto; color:#98a2b3; font-size:9px; font-weight:700; pointer-events:none; }
  .table { min-width:760px!important; }
  .table > :not(caption) > * > * { padding:12px 11px!important; }
  .table thead th { font-size:10px!important; }
  .table tbody td { font-size:11.5px!important; }
  .table tbody tr { min-height:48px; }
  .invoice-action { min-height:40px!important; padding:7px 10px!important; }

  /* Lists / admin / permission screens. */
  .permission-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  .permission-option { min-height:58px; padding:11px!important; }
  .permission-option input { width:21px!important; height:21px!important; }
  .staff-account-item { min-height:58px; }
  .system-location-card,.location-capability-row { min-height:54px; }
  .access-check span { width:30px!important; height:30px!important; }
  .account-info-row { min-height:48px; align-items:center; }

  /* Product/category management. */
  .product-grid { grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:10px!important; }
  .product-card { min-height:138px!important; padding:13px!important; }
  .product-editor-card { position:sticky; top:75px; }
  .product-code-badge { font-size:11px!important; }

  /* Dashboard: 2x2 KPIs and readable charts on both orientations. */
  .live-kpi-grid,.report-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:10px!important; }
  .live-kpi,.report-kpi { min-height:118px!important; }
  .dashboard-main-grid,.dashboard-bottom-grid,.report-overview-grid { grid-template-columns:1fr!important; }
  .dashboard-premium-card,.report-visual-card,.report-table-card { min-width:0; }
  .dashboard-command-grid { grid-template-columns:repeat(4,minmax(0,1fr))!important; }
  .live-bar-chart { min-height:220px; }

  /* Sale stays POS-like on landscape tablets, stacks cleanly on portrait. */
  .pos-toolbar { top:68px!important; }
  .pos-toolbar .search-box { display:flex!important; height:46px!important; }
  .category-scroll,.pos-category-strip { touch-action:pan-x; }
  .cat-chip,.pos-category-chip { min-height:44px!important; padding-inline:13px!important; }
  .qty-btn { width:38px!important; height:38px!important; font-size:16px!important; }
  .qty-stepper button,.qty-stepper input { min-height:50px!important; }
  .cart-line { min-height:58px; }
  .grand-total { padding:14px!important; }
  .payment-calc-card,.credit-calc-box { padding:13px!important; }
  .mini-pay-btn { min-height:38px!important; padding:0 12px!important; }

  /* Purchase / Transfer POS-like workspaces. */
  .tablet-context-bar { border-radius:13px!important; }
  .tablet-search-box { min-height:48px!important; }
  .tablet-search-box input { min-height:46px!important; font-size:13px!important; }
  .tablet-product-card { min-height:118px!important; padding:12px!important; touch-action:manipulation; }
  .tablet-product-card strong { font-size:14px!important; }
  .tablet-product-card small { font-size:11px!important; }
  .tablet-add-icon { width:34px!important; height:34px!important; }
  .tablet-cart-panel { border-radius:14px!important; overflow:hidden; }
  .tablet-cart-list { padding:10px!important; }
  .tablet-cart-item { padding:12px!important; border-radius:13px!important; }
  .touch-remove { width:42px!important; height:42px!important; }
  .touch-stepper { min-height:48px!important; }
  .touch-stepper button { width:48px!important; height:48px!important; font-size:20px!important; }
  .touch-stepper input,.touch-field>input { min-height:48px!important; font-size:15px!important; }
  .tablet-cart-footer { padding:12px!important; }
  .tablet-submit-btn { min-height:54px!important; font-size:13px!important; }
  .tablet-summary-grid strong { font-size:15px!important; }

  /* Price manager / settings / reports. */
  .price-manager-toolbar { top:68px!important; }
  .price-card-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:11px!important; }
  .price-product-card { padding:13px!important; }
  .price-input-grid input,.price-note input { min-height:46px!important; }
  .invoice-settings-grid { grid-template-columns:1fr!important; }
  .invoice-logo-preview { height:160px!important; }
  .logo-upload-drop { min-height:92px; }
  .report-preset-bar { gap:7px!important; }
  .report-preset-bar a { min-height:42px; display:inline-flex; align-items:center; justify-content:center; }
  .report-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  .report-filter-grid .btn { min-height:46px!important; }
  .modern-tabs { overflow-x:auto; flex-wrap:nowrap!important; -webkit-overflow-scrolling:touch; }
  .modern-tabs .report-tab { flex:0 0 auto; min-height:44px!important; }

  /* Bootstrap modals fit tablet viewports and never hide actions below keyboard. */
  .modal-dialog { max-width:min(680px,calc(100vw - 36px))!important; margin:18px auto!important; }
  .modal-content { max-height:calc(100dvh - 36px); overflow:auto; border-radius:16px!important; }
  .modal-footer { position:sticky; bottom:0; background:#fff; z-index:2; }
}

@media (min-width:1000px) and (max-width:1366px) {
  .pos-shell { grid-template-columns:minmax(0,1fr) minmax(340px,36%)!important; gap:11px!important; }
  .cart-panel { position:sticky!important; top:76px!important; max-height:calc(100dvh - 90px)!important; }
  .pos-main .product-grid { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  .tablet-pos-layout { grid-template-columns:minmax(0,1fr) minmax(390px,.88fr)!important; gap:11px!important; }
  .tablet-product-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; max-height:calc(100dvh - 275px)!important; }
  .tablet-cart-panel { position:sticky!important; top:76px!important; max-height:calc(100dvh - 92px)!important; }
}

@media (min-width:769px) and (max-width:999px) {
  .header-actions .search-box { display:none!important; }
  .date-button { display:none!important; }
  .header-left h2 { max-width:52vw; }
  .header-left p { max-width:48vw; }
  .pos-shell,.tablet-pos-layout { grid-template-columns:1fr!important; }
  .cart-panel,.tablet-cart-panel { position:static!important; max-height:none!important; }
  .pos-main .product-grid,.tablet-product-grid { grid-template-columns:repeat(3,minmax(0,1fr))!important; max-height:420px!important; }
  .tablet-cart-footer { position:sticky!important; bottom:0!important; z-index:6!important; box-shadow:0 -10px 24px rgba(48,29,24,.07)!important; }
  .purchase-edit-grid { grid-template-columns:minmax(150px,1fr) 1fr 1fr!important; }
  .purchase-edit-grid .touch-line-total { grid-column:1/-1!important; min-height:40px; flex-direction:row!important; align-items:center!important; justify-content:space-between!important; }
  .sale-edit-product-grid { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
  .sale-edit-row-controls { grid-template-columns:150px 1fr auto!important; }
  .price-card-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  .dashboard-command-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
}

@media (min-width:769px) and (max-width:840px) {
  .pos-main .product-grid,.tablet-product-grid,.sale-edit-product-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  .price-card-grid { grid-template-columns:1fr!important; }
  .permission-rule-strip { grid-template-columns:1fr!important; }
  .sale-edit-row-controls { grid-template-columns:1fr 1fr!important; }
  .sale-edit-row-controls .sei-line { grid-column:1/-1; text-align:right; }
}

/* === 2026-08-25 Purchase category hotfix + Sales History UI repair === */
.purchase-category-strip .pos-category-chip{cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent}
.purchase-category-strip .pos-category-chip:focus-visible{outline:3px solid rgba(249,115,22,.2);outline-offset:2px}

.sales-history-section{margin-bottom:16px}
.sales-history-heading,.sales-history-table-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}
.sales-history-heading h5,.sales-history-table-head h5{margin:2px 0 2px;font-size:17px;font-weight:900;color:#241b19}
.sales-history-heading p,.sales-history-table-head p{margin:0;color:#8b7770;font-size:11px;line-height:1.45}
.sales-history-kicker{display:block;font-size:9px;line-height:1;text-transform:uppercase;letter-spacing:.12em;color:#d05c21;font-weight:950}
.sales-history-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.sales-history-card{position:relative;min-width:0;padding:15px;border:1px solid #eadfd9;border-radius:17px;background:linear-gradient(155deg,#fff 0%,#fffaf7 100%);box-shadow:0 10px 28px rgba(66,34,27,.055);overflow:hidden}
.sales-history-card::after{content:"";position:absolute;right:-26px;bottom:-34px;width:88px;height:88px;border-radius:50%;background:radial-gradient(circle,rgba(249,115,22,.10),transparent 70%);pointer-events:none}
.sales-history-card-head{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.sales-history-invoice{min-width:0}.sales-history-invoice>span{display:block;color:#a78c83;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.09em}.sales-history-invoice>strong{display:block;max-width:100%;margin-top:2px;font-size:12px;line-height:1.25;color:#2d2421;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sales-history-invoice>small{display:flex;align-items:center;gap:4px;margin-top:4px;color:#8b7770;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sales-history-actions,.sales-row-actions{display:flex;align-items:center;gap:6px;flex:0 0 auto}.sales-mini-action{width:36px;height:36px;display:inline-grid;place-items:center;border:1px solid #eadfd9;border-radius:10px;background:#fff;color:#705952;text-decoration:none;box-shadow:0 4px 10px rgba(66,34,27,.035);transition:.15s ease}.sales-mini-action:hover{border-color:#f5a06d;color:#c2410c;transform:translateY(-1px)}.sales-mini-action.primary{background:#fff3eb;border-color:#fed7aa;color:#c2410c}
.sales-history-total{position:relative;z-index:1;display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin:14px 0 12px;padding:11px 12px;border-radius:12px;background:rgba(255,255,255,.8);border:1px solid #f1e7e2}.sales-history-total>span{font-size:10px;color:#8a746e;font-weight:800}.sales-history-total>strong{font-size:20px;line-height:1;color:#8f0710;white-space:nowrap}.sales-history-total>strong small{font-size:10px;font-weight:800;color:#9c8580}
.sales-history-metrics{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.sales-history-metrics>div{min-width:0;padding:8px 9px;border-radius:10px;background:#fff;border:1px solid #f0e6e1}.sales-history-metrics span,.sales-history-metrics b{display:block}.sales-history-metrics span{color:#9b8680;font-size:8px;font-weight:800}.sales-history-metrics b{margin-top:2px;font-size:11px;color:#3d312d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sales-history-card-foot{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:11px;padding-top:10px;border-top:1px solid #f0e6e1;color:#8b7770;font-size:8.5px}.sales-history-card-foot span{display:flex;align-items:center;gap:4px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sales-history-card-foot time{white-space:nowrap}
.sales-history-empty{grid-column:1/-1;min-height:155px;display:grid;place-items:center;align-content:center;gap:6px;border:1px dashed #ddcec7;border-radius:17px;background:#fff;color:#9b8680}.sales-history-empty i{font-size:28px;color:#d99a7c}.sales-history-empty strong{color:#55443e}.sales-history-empty span{font-size:10px}
.sales-history-table-card{padding:0!important;border:1px solid #eadfd9!important;border-radius:17px!important;box-shadow:0 10px 28px rgba(66,34,27,.05)!important;overflow:hidden!important}.sales-history-table-head{margin:0;padding:15px 16px 12px;border-bottom:1px solid #f0e6e1;background:linear-gradient(180deg,#fff,#fffdfc)}.sales-history-table-wrap{border-radius:0!important;margin:0!important}.sales-history-table{margin:0!important;min-width:1180px}.sales-history-table thead th{position:sticky;top:0;z-index:1;padding:10px 11px!important;background:#fcf8f6!important;border-bottom:1px solid #eadfd9!important;color:#8a736c!important;font-size:9px!important;font-weight:900!important;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}.sales-history-table tbody td{padding:11px!important;border-color:#f3ebe7!important;vertical-align:middle!important;font-size:10.5px!important;white-space:nowrap}.sales-history-table tbody tr:hover{background:#fffaf7}.sales-table-invoice{color:#8f0710;font-size:10.5px}.sales-code-pill,.sales-payment-pill{display:inline-flex;align-items:center;min-height:26px;padding:4px 8px;border-radius:8px;font-size:9px;font-weight:850;white-space:nowrap}.sales-code-pill{background:#f7f4f2;color:#69554e;border:1px solid #ece3df}.sales-payment-pill{background:#eef6ff;color:#315c96;border:1px solid #dcecff}.sales-date-text{color:#8b7770;font-size:9px}.sales-history-table .location-pill{max-width:125px;overflow:hidden;text-overflow:ellipsis}.sales-history-table-wrap::after{margin:7px 10px 5px auto!important}

@media (max-width:1366px){.sales-history-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:769px) and (max-width:1100px){.sales-history-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.sales-history-card{padding:13px}.sales-history-total>strong{font-size:18px}.sales-history-table{min-width:1120px!important}.sales-history-table tbody td{padding:10px!important}.sales-mini-action{width:40px;height:40px}}
@media (max-width:768px){.sales-history-heading,.sales-history-table-head{align-items:center}.sales-history-heading p,.sales-history-table-head p{display:none}.sales-history-grid{grid-template-columns:1fr 1fr;gap:9px}.sales-history-card{padding:12px;border-radius:14px}.sales-history-total{margin:10px 0;padding:9px}.sales-history-total>strong{font-size:16px}.sales-history-metrics{gap:5px}.sales-history-metrics>div{padding:7px}.sales-history-card-foot{flex-direction:column;align-items:flex-start}.sales-history-table-head{padding:12px}.sales-history-table{min-width:1080px!important}}
@media (max-width:520px){.sales-history-grid{grid-template-columns:1fr}.sales-history-card-foot{flex-direction:row;align-items:center}}

/* === 2026-08-29 Product-centric Stock Overview === */
.stock-overview-title{align-items:flex-start}.stock-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}.stock-kpi{min-height:82px;display:flex;align-items:center;gap:11px;padding:13px 14px;border:1px solid #eadfd9;border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(66,34,27,.045)}.stock-kpi-icon{width:40px;height:40px;display:grid;place-items:center;flex:0 0 40px;border-radius:12px;background:#f7f2ef;color:#735b53;font-size:17px}.stock-kpi small,.stock-kpi strong{display:block}.stock-kpi small{font-size:8.5px;text-transform:uppercase;letter-spacing:.07em;font-weight:900;color:#9a8580}.stock-kpi strong{margin-top:3px;font-size:18px;line-height:1;color:#302522}.stock-kpi-warn .stock-kpi-icon{background:#fff6dc;color:#a36b00}.stock-kpi-danger .stock-kpi-icon{background:#fff0f0;color:#b2131b}
.stock-filter-card{padding:13px!important;border:1px solid #eadfd9!important;border-radius:17px!important;box-shadow:0 8px 24px rgba(66,34,27,.04)!important}.stock-filter-top{display:flex;align-items:center;gap:10px}.stock-search-box{position:relative;flex:1}.stock-search-box>i{position:absolute;left:13px;top:50%;transform:translateY(-50%);z-index:1;color:#99827b}.stock-search-box .form-control{padding-left:37px;min-height:44px;border-radius:12px}.stock-result-count{flex:0 0 auto;min-width:86px;text-align:center;padding:9px 11px;border-radius:11px;background:#f8f3f0;color:#6d554e;font-size:10px;font-weight:850}.stock-category-strip{display:flex;align-items:center;gap:7px;margin-top:11px;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch;scrollbar-width:none}.stock-category-strip::-webkit-scrollbar{display:none}.stock-category-chip{flex:0 0 auto;min-height:38px;padding:7px 13px;border:1px solid #eadfd9;border-radius:999px;background:#fff;color:#705a53;font-size:10px;font-weight:850;white-space:nowrap;transition:.15s ease}.stock-category-chip:hover{border-color:#d9aaa0}.stock-category-chip.active{border-color:#97050e;background:linear-gradient(135deg,#97050e,#c91a24);color:#fff;box-shadow:0 6px 15px rgba(151,5,14,.16)}
.stock-matrix-card{padding:0!important;border:1px solid #eadfd9!important;border-radius:18px!important;box-shadow:0 12px 32px rgba(66,34,27,.055)!important;overflow:hidden!important}.stock-matrix-scroll{width:100%;overflow:auto;-webkit-overflow-scrolling:touch}.stock-matrix-table{margin:0!important;min-width:920px;border-collapse:separate!important;border-spacing:0!important}.stock-matrix-table thead th{position:sticky;top:0;z-index:5;padding:11px 10px!important;background:#fbf8f6!important;border-bottom:1px solid #eadfd9!important;color:#846d66!important;font-size:9px!important;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}.stock-matrix-table tbody td{padding:10px!important;border-color:#f2e9e5!important;background:#fff;vertical-align:middle!important}.stock-matrix-table tbody tr:hover td{background:#fffaf7}.stock-col-product{position:sticky!important;left:0;z-index:4;min-width:240px;width:240px;background:#fff!important;box-shadow:8px 0 14px -14px rgba(36,24,20,.45)}.stock-matrix-table thead .stock-col-product{z-index:8!important;background:#fbf8f6!important}.stock-col-price{position:sticky!important;left:240px;z-index:3;min-width:105px;width:105px;text-align:right;background:#fff!important;box-shadow:8px 0 14px -14px rgba(36,24,20,.35)}.stock-matrix-table thead .stock-col-price{z-index:7!important;background:#fbf8f6!important}.stock-col-price strong{font-size:12px;color:#8f0710}.stock-product-name{font-size:11.5px;font-weight:900;color:#332824;line-height:1.3}.stock-product-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:5px;color:#9a857e;font-size:8.5px}.stock-product-meta .product-code-badge{font-size:8px}.stock-location-head{min-width:118px;text-align:center!important}.stock-location-title{display:flex;align-items:center;justify-content:center;gap:5px;color:#5c4943;font-weight:900}.stock-location-head small{display:block;margin-top:3px;color:#a08b84;font-size:7.5px;text-transform:none;letter-spacing:0}.stock-location-cell{min-width:118px;text-align:center}.stock-level-box{min-width:92px;display:inline-grid;grid-template-columns:1fr auto;grid-template-areas:"qty status" "low low";gap:3px 7px;align-items:center;padding:8px 9px;border-radius:12px;border:1px solid #e3eee7;background:#f8fcf9}.stock-level-qty{grid-area:qty;text-align:left;font-size:14px;font-weight:950;color:#27683d}.stock-level-low{grid-area:low;text-align:left;font-size:8px;font-weight:800;color:#84958a}.stock-level-status{grid-area:status;padding:3px 6px;border-radius:999px;background:#e5f5ea;color:#287442;font-size:7px;font-weight:950;text-transform:uppercase}.stock-level-box.is-low{border-color:#f1ddb0;background:#fffaf0}.stock-level-box.is-low .stock-level-qty{color:#9c6800}.stock-level-box.is-low .stock-level-status{background:#fff0c7;color:#946100}.stock-level-box.is-out{border-color:#f1c9cb;background:#fff6f6}.stock-level-box.is-out .stock-level-qty{color:#b2131b}.stock-level-box.is-out .stock-level-status{background:#ffe1e3;color:#a30c14}.stock-col-total{min-width:90px;text-align:center}.stock-col-total strong,.stock-col-total small{display:block}.stock-col-total strong{font-size:13px;color:#342824}.stock-col-total small{margin-top:3px;font-size:8px;font-weight:850}.stock-empty-state{min-height:190px;display:grid;place-items:center;align-content:center;gap:5px;color:#9b8680}.stock-empty-state i{font-size:28px}.stock-empty-state strong{color:#56443e}.stock-empty-state span{font-size:10px}
@media (min-width:769px) and (max-width:1100px){.stock-kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.stock-kpi{min-height:74px;padding:10px}.stock-kpi-icon{width:36px;height:36px;flex-basis:36px}.stock-col-product{min-width:210px;width:210px}.stock-col-price{left:210px;min-width:92px;width:92px}.stock-location-head,.stock-location-cell{min-width:108px}.stock-matrix-table{min-width:840px}.stock-level-box{min-width:84px;padding:7px 8px}.stock-category-chip{min-height:42px;padding-inline:15px}.stock-search-box .form-control{min-height:46px}}
@media (max-width:768px){.stock-kpi-grid{grid-template-columns:1fr 1fr}.stock-filter-top{align-items:stretch}.stock-result-count{display:flex;align-items:center;justify-content:center}.stock-col-product{min-width:190px;width:190px}.stock-col-price{position:static!important;min-width:92px;width:92px;box-shadow:none}.stock-location-head,.stock-location-cell{min-width:105px}.stock-matrix-table{min-width:760px}.stock-product-meta span:not(.product-code-badge):last-child{display:none}}

/* === 2026-08-29 Live low-stock notification dropdown === */
.notification-wrap{position:relative;display:inline-flex;align-items:center;flex:0 0 auto;z-index:80}
.notification-wrap .notification-button{position:relative}
.notification-wrap .notification-button.notification-loading .notification-badge{visibility:hidden}
.notification-wrap .notification-button.has-stock-alerts{border-color:#f0c9cb;background:#fffafa;color:#a90f17}
.stock-notification-panel{position:absolute;top:calc(100% + 10px);right:0;width:min(390px,calc(100vw - 28px));max-height:min(520px,calc(100dvh - 100px));display:none;overflow:hidden;background:#fff;border:1px solid #eadfd9;border-radius:16px;box-shadow:0 22px 60px rgba(46,29,24,.18);z-index:120;text-align:left}
.stock-notification-panel.open{display:block}
.stock-notification-head{min-height:64px;padding:11px 13px 10px 15px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #f0e7e3;background:linear-gradient(180deg,#fff,#fffaf8)}
.stock-notification-head span,.stock-notification-head strong{display:block}.stock-notification-head span{font-size:8px;line-height:1;text-transform:uppercase;letter-spacing:.11em;color:#a18b84;font-weight:950}.stock-notification-head strong{margin-top:5px;font-size:15px;line-height:1.15;color:#332824;font-weight:950}.stock-notification-head>b{min-width:34px;height:34px;padding:0 8px;border-radius:11px;display:grid;place-items:center;background:#fff0f1;color:#a90f17;border:1px solid #efc8cb;font-size:13px;font-weight:950}
.stock-notification-list{max-height:365px;overflow:auto;-webkit-overflow-scrolling:touch}
.stock-notification-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;min-height:68px;padding:10px 13px 10px 15px;border-bottom:1px solid #f3ebe7;color:inherit;text-decoration:none;background:#fff;transition:.14s ease}
.stock-notification-item:hover{background:#fffaf7}.stock-notification-item.is-out{background:#fffafa}.stock-notification-item.is-out:hover{background:#fff4f5}
.stock-notification-main{min-width:0}.stock-notification-main strong,.stock-notification-main span{display:block}.stock-notification-main strong{font-size:12px;line-height:1.25;color:#3a2d29;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stock-notification-main span{margin-top:5px;color:#927d76;font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stock-notification-level{min-width:58px;text-align:right}.stock-notification-level b,.stock-notification-level small{display:block}.stock-notification-level b{font-size:20px;line-height:1;color:#9a6500;font-weight:950}.stock-notification-item.is-out .stock-notification-level b{color:#b21820}.stock-notification-level small{margin-top:5px;color:#a08c85;font-size:8px;font-weight:850}
.stock-notification-empty{min-height:125px;padding:20px;display:flex;align-items:center;justify-content:center;gap:12px;color:#8d7972}.stock-notification-empty>i{font-size:28px;color:#2d8b50}.stock-notification-empty div{min-width:0}.stock-notification-empty strong,.stock-notification-empty span{display:block}.stock-notification-empty strong{font-size:12px;color:#4b3b36}.stock-notification-empty span{margin-top:4px;font-size:9px;line-height:1.45}
.stock-notification-foot{min-height:50px;padding:8px 10px;display:grid;grid-template-columns:1fr 1fr;gap:7px;background:#fbf8f6;border-top:1px solid #eee4df}.stock-notification-foot a{min-height:34px;display:flex;align-items:center;justify-content:center;border:1px solid #e3d7d2;border-radius:9px;background:#fff;color:#6e5952;text-decoration:none;font-size:9.5px;font-weight:900}.stock-notification-foot a:first-child{color:#8d5c00;background:#fffaf0;border-color:#ead7aa}.stock-notification-foot a:last-child{color:#a90f17;background:#fff5f6;border-color:#efc9cc}

/* The bell is useful on tablet/mobile now that it contains real stock alerts. */
@media (min-width:769px) and (max-width:1366px){.header-actions .notification-wrap{display:inline-flex!important}.notification-wrap .notification-button{display:inline-grid!important}}
@media (max-width:768px){.header-actions .notification-wrap{display:inline-flex!important}.notification-wrap .notification-button{display:inline-grid!important;width:40px!important;height:40px!important}.stock-notification-panel{position:fixed;top:66px;right:10px;left:10px;width:auto;max-height:calc(100dvh - 82px)}.stock-notification-list{max-height:calc(100dvh - 205px)}}

/* ===== 2026-08-29 Tablet reliability hotfix: Notifications + Sales History ===== */
.stock-notification-panel,.sales-history-section,.sales-history-table-card{box-sizing:border-box}
.stock-notification-panel{isolation:isolate}
.stock-notification-list{overscroll-behavior:contain;scrollbar-gutter:stable}
.stock-notification-item,.stock-notification-foot a{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.stock-notification-item:active{background:#fff5f1}
.sales-history-grid{align-items:stretch}
.sales-history-card{width:100%;min-width:0}
.sales-history-card-head>*{min-width:0}
.sales-history-table-card{width:100%;min-width:0}
.sales-history-table-wrap{width:100%;max-width:100%;overflow-x:auto!important;overflow-y:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;touch-action:pan-x pan-y}
.sales-history-table{width:max-content!important;max-width:none!important}
.sales-history-table th,.sales-history-table td{box-sizing:border-box}
.sales-history-table tbody tr{background:#fff}
.sales-history-table tbody tr:nth-child(even){background:#fffdfc}
.sales-history-table .sales-row-actions{min-width:86px}
.sales-history-table .sales-mini-action{flex:0 0 auto}

@media (min-width:769px) and (max-width:1366px){
  .header-actions .notification-wrap{display:inline-flex!important;position:relative!important;z-index:2100!important}
  .notification-wrap .notification-button{display:inline-grid!important;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important}
  .stock-notification-panel{position:fixed!important;top:76px!important;right:14px!important;left:auto!important;width:min(390px,calc(100vw - 110px))!important;max-width:390px!important;max-height:calc(100dvh - 92px)!important;border-radius:16px!important;z-index:2200!important;box-shadow:0 24px 70px rgba(38,22,18,.24)!important}
  .stock-notification-list{max-height:calc(100dvh - 224px)!important}
  .stock-notification-item{min-height:72px!important;padding:11px 14px!important}
  .stock-notification-main strong{font-size:13px!important}
  .stock-notification-main span{font-size:10px!important}
  .stock-notification-level b{font-size:21px!important}
  .sales-history-section{margin-bottom:14px!important}
  .sales-history-heading{margin-bottom:10px!important}
  .sales-history-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .sales-history-card{padding:13px!important;border-radius:15px!important;box-shadow:0 7px 20px rgba(66,34,27,.055)!important}
  .sales-history-invoice>strong{font-size:13px!important}
  .sales-history-total>strong{font-size:19px!important}
  .sales-history-metrics>div{min-height:50px;display:flex;flex-direction:column;justify-content:center}
  .sales-history-metrics b{font-size:12px!important}
  .sales-mini-action{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;border-radius:11px!important;transform:none!important}
  .sales-history-table-head{padding:13px 14px 11px!important}
  .sales-history-table-wrap{border-radius:0!important}
  .sales-history-table{min-width:1120px!important}
  .sales-history-table thead th{position:sticky!important;top:0!important;z-index:3!important}
  .sales-history-table tbody td{padding:11px 10px!important;font-size:11px!important}
}
@media (min-width:769px) and (max-width:900px){
  .stock-notification-panel{right:10px!important;width:min(370px,calc(100vw - 104px))!important}
  .sales-history-grid{grid-template-columns:1fr!important}
  .sales-history-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,.65fr);grid-template-areas:"head total" "metrics metrics" "foot foot";gap:9px 12px;align-items:start}
  .sales-history-card-head{grid-area:head}.sales-history-total{grid-area:total;margin:0!important;min-height:62px;align-items:center!important}.sales-history-metrics{grid-area:metrics}.sales-history-card-foot{grid-area:foot;margin-top:0!important}
}
@media (max-width:768px){
  .header-actions .notification-wrap{display:inline-flex!important;z-index:2100!important}
  .notification-wrap .notification-button{display:inline-grid!important;width:40px!important;height:40px!important}
  .stock-notification-panel{position:fixed!important;top:66px!important;right:8px!important;left:8px!important;width:auto!important;max-width:none!important;max-height:calc(100dvh - 78px)!important;z-index:2200!important}
  .stock-notification-list{max-height:calc(100dvh - 208px)!important}
  .sales-history-grid{grid-template-columns:1fr!important}
  .sales-history-heading .soft-badge,.sales-history-table-head .soft-badge{display:none!important}
  .sales-history-table{min-width:1040px!important}
}