/* STARLIKE POS 5.9.2 · CAPA VISUAL FINAL DE PRODUCCION
   Solo presentación. No cambia IDs, eventos ni lógica. */
:root{
  --stl-final-pink:#ff2b93;
  --stl-final-pink-2:#ff67b7;
  --stl-final-yellow:#ffd528;
  --stl-final-ink:#08080b;
  --stl-final-panel:#141419;
  --stl-final-line:rgba(255,255,255,.10);
  --stl-final-muted:#b9bac5;
  --stl-final-good:#4fe29c;
  --stl-final-bad:#ff6575;
}
html,body{background:#08080b!important;color:#fffdf7!important}
body{
  background:
    radial-gradient(circle at 12% 8%,rgba(255,43,147,.12),transparent 25%),
    radial-gradient(circle at 86% 10%,rgba(255,213,40,.09),transparent 23%),
    linear-gradient(180deg,#08080b,#0d0d12 55%,#08080b)!important;
}
.login-card::before,.sidebar .brand::before{
  background-image:url('/starlike-logo-official.jpg')!important;
}
.sidebar .brand small{
  color:var(--stl-final-yellow)!important;
  background:rgba(255,213,40,.08);
  border:1px solid rgba(255,213,40,.18);
  border-radius:999px;
  padding:3px 7px;
}.sidebar .nav.active{
  background:linear-gradient(100deg,var(--stl-final-yellow),#ffe879)!important;
  color:#09090b!important;
  box-shadow:0 8px 24px rgba(255,213,40,.18)!important;
}
.sidebar .nav:not(.active):hover{
  border-color:rgba(255,43,147,.30)!important;
  background:rgba(255,43,147,.08)!important;
}
#viewTitle::before{
  background:linear-gradient(180deg,var(--stl-final-pink),var(--stl-final-yellow))!important;
}
.panel,.metric,.cart,.config-box,.table-wrap,.modal,.kds-card,.recipe-card{
  border-color:var(--stl-final-line)!important;
}
.panel::before,.metric::before,.cart::before,.config-box::before{
  background:linear-gradient(90deg,var(--stl-final-pink),var(--stl-final-yellow),transparent 72%)!important;
}
.metric strong{font-variant-numeric:tabular-nums}
.eyebrow{color:var(--stl-final-yellow)!important}
.btn.primary{
  background:linear-gradient(110deg,#e90f76,var(--stl-final-pink))!important;
  border-color:#ff58ad!important;
}
#checkoutBtn{
  background:linear-gradient(105deg,var(--stl-final-yellow),#ffed86)!important;
  color:#09090b!important;
  -webkit-text-fill-color:#09090b!important;
  font-weight:950!important;
}#paymentDetails,#posCashCalculator{
  border:1px solid rgba(255,213,40,.20)!important;
  background:linear-gradient(135deg,rgba(255,213,40,.05),rgba(255,43,147,.045)),#111117!important;
  border-radius:14px!important;
  padding:12px!important;
}
#paymentTipWrap{
  border-left:4px solid var(--stl-final-pink)!important;
  padding-left:10px!important;
}
#paymentCommissionPreview{color:var(--stl-final-yellow)!important}
.cash-change strong{color:var(--stl-final-yellow)!important;font-size:1.35em}
.product-card{
  transition:transform .12s ease,border-color .12s ease,box-shadow .12s ease!important;
}
.product-card:hover{
  transform:translateY(-2px)!important;
  border-color:rgba(255,43,147,.30)!important;
}
.product-card strong{color:var(--stl-final-pink-2)!important}
.chip.active{
  background:var(--stl-final-yellow)!important;
  color:#09090b!important;
  -webkit-text-fill-color:#09090b!important;
}
#view-inventory #printInventoryGuideBtn,
#view-printers .btn.primary{
  border-color:rgba(255,213,40,.28)!important;
}
#view-inventory #printInventoryGuideBtn:hover{
  background:rgba(255,213,40,.10)!important;
}input:focus,select:focus,textarea:focus,.search:focus{
  border-color:var(--stl-final-yellow)!important;
  box-shadow:0 0 0 3px rgba(255,213,40,.11)!important;
}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--stl-final-yellow)!important;
  outline-offset:2px!important;
}
.badge.ready,.status-pill.active,.badge.completed{
  color:#9bf4c2!important;
  border-color:rgba(79,226,156,.26)!important;
}
.badge.preparing{color:#ff9dcc!important}
.stock-low,.error{color:#ff95a1!important}
.sale-message{color:var(--stl-final-good)!important}
table th{color:var(--stl-final-yellow)!important}
tr:hover td{background:rgba(255,255,255,.025)!important}
*{scrollbar-width:thin;scrollbar-color:#3d3d48 #111116}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-track{background:#111116}
*::-webkit-scrollbar-thumb{background:#3d3d48;border-radius:10px;border:2px solid #111116}
@media (max-width:1100px){
  .sidebar .brand small{display:none!important}
}
@media (max-width:780px){
  #paymentDetails,#posCashCalculator{padding:10px!important}
  #checkoutBtn{min-height:56px!important}
}