/* STARLIKE POS WEB THEME 2026-09-25
   Visual-only layer. NO business logic, permissions, routes, sizes or flows are changed. */
:root{
  --st-web-bg:#050305;
  --st-web-panel:#100910;
  --st-web-panel-2:#151015;
  --st-web-border:#2b2529;
  --st-web-text:#fff7ed;
  --st-web-muted:#d7cbd2;
  --st-web-yellow:#ffc400;
  --st-web-yellow-2:#ffe05a;
  --st-web-pink:#ff1493;
  --st-web-pink-2:#ff2f9d;
  --st-web-pink-3:#ff54b6;
}
html,body{background:var(--st-web-bg)!important;color:var(--st-web-text)!important}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(circle at 82% 8%,rgba(255,20,147,.13),transparent 27%),radial-gradient(circle at 14% 94%,rgba(255,196,0,.08),transparent 25%),linear-gradient(180deg,#080608 0%,#050305 100%)}
.sidebar{background:linear-gradient(180deg,#080608 0%,#050305 100%)!important;border-right-color:#2a2228!important}
.brand{background:linear-gradient(135deg,rgba(255,20,147,.14),rgba(255,196,0,.05))!important}
.brand b,.brand span,.brand-mark,.eyebrow{color:var(--st-web-pink)!important}
.brand small{color:var(--st-web-yellow)!important}
.sidebar .nav{color:#d7cbd2!important;border-color:transparent!important}
.sidebar .nav:hover{background:#151015!important;color:#fff!important}
.sidebar .nav.active{background:linear-gradient(90deg,rgba(255,20,147,.24),rgba(255,196,0,.10))!important;color:#fff!important;border-color:rgba(255,20,147,.38)!important;box-shadow:inset 3px 0 0 var(--st-web-pink)!important}
.main,.view,.login-screen{background:transparent!important}
.topbar,.panel,.card,.metric,.modal,.table-wrap,.cart,.product-card,.restaurant-table,.notice{background-color:var(--st-web-panel)!important;border-color:var(--st-web-border)!important}
.topbar{background:rgba(8,6,8,.94)!important;backdrop-filter:blur(12px)}
.btn.primary,.primary,.checkout-btn,#checkoutBtn{background:linear-gradient(135deg,var(--st-web-yellow),#f6c100)!important;color:#090609!important;border-color:var(--st-web-yellow)!important;box-shadow:0 7px 24px rgba(255,196,0,.16)!important}
.btn:not(.primary),button.table-btn,.chip{border-color:#51434c!important}
.chip.active,.badge.active,.status-pill.active{background:var(--st-web-pink)!important;color:#fff!important;border-color:var(--st-web-pink)!important}
input,select,textarea{background:#080608!important;color:#fff!important;border-color:#51434c!important}
input:focus,select:focus,textarea:focus{border-color:var(--st-web-pink)!important;box-shadow:0 0 0 2px rgba(255,20,147,.14)!important}
table thead th{color:var(--st-web-yellow)!important;background:#0b080b!important}
table tbody tr:hover{background:rgba(255,20,147,.045)!important}
.product-card strong,.cash-change strong,.amount,.money{color:var(--st-web-yellow)!important}
a{color:var(--st-web-pink-3)}
.sl-op-home-card.primary,.sl-op-dock-btn.sl-sale{background:linear-gradient(135deg,var(--st-web-yellow),#f6c100)!important;color:#090609!important}
.sl-op-home-card:not(.primary),.sl-op-more-btn,.sl-sup-card{background:linear-gradient(145deg,#151015,#100910)!important;border-color:#2b2529!important}
.sl-op-home-card:hover,.sl-op-more-btn:hover,.sl-sup-card:hover{border-color:var(--st-web-pink)!important;box-shadow:0 0 0 1px rgba(255,20,147,.25),0 10px 30px rgba(0,0,0,.32)!important}
.sl-op-kicker,.sl-sup-head span{color:var(--st-web-pink)!important}
#slOperatorCashGate169.open{border-color:rgba(255,196,0,.55)!important;background:rgba(255,196,0,.08)!important}
#slOperatorCashGate169.closed{border-color:rgba(255,20,147,.5)!important;background:rgba(255,20,147,.07)!important}
dialog::backdrop{background:rgba(0,0,0,.82)!important;backdrop-filter:blur(4px)}
::selection{background:var(--st-web-pink);color:#fff}