:root{
 --bg:#08111f;--panel:#17263f;--panel2:#213653;--line:rgba(255,255,255,.10);
 --text:#f8fbff;--muted:#a9b7d2;--green:#34d399;--blue:#60a5fa;--red:#fb7185;--yellow:#fbbf24;
 --radius:26px;--shadow:0 24px 70px rgba(0,0,0,.36)
}
*{box-sizing:border-box;margin:0;padding:0;font-family:Inter,Arial,sans-serif;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth}
body{
 min-height:100vh;color:var(--text);background:
 radial-gradient(circle at 12% 0%,rgba(52,211,153,.16),transparent 31%),
 radial-gradient(circle at 92% 4%,rgba(96,165,250,.14),transparent 34%),
 linear-gradient(180deg,#123042 0%,#0b1424 52%,#060b14 100%);
 padding:14px;overflow-x:hidden
}
button,input,select,textarea{font-size:16px}button{border:0;cursor:pointer}
a{color:inherit;text-decoration:none}.hidden{display:none!important}
.shell{width:min(1180px,100%);margin:auto;position:relative;z-index:2}
.top{
 display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
 padding:16px;border-radius:26px;background:rgba(10,20,34,.78);border:1px solid var(--line);box-shadow:var(--shadow);backdrop-filter:blur(18px);
}
.brand{display:flex;align-items:center;gap:12px;font-weight:950;font-size:22px;letter-spacing:-.8px}
.logo{width:50px;height:50px;border-radius:17px;background:linear-gradient(180deg,#8af5c6,#10b981);display:flex;align-items:center;justify-content:center;font-size:24px;color:#052814;box-shadow:0 18px 40px rgba(52,211,153,.24)}
.actions{display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.btn,button{min-height:46px;border-radius:15px;padding:0 15px;font-weight:950;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.btn-green{background:linear-gradient(180deg,#8af5c6,#10b981);color:#052814;box-shadow:0 12px 28px rgba(52,211,153,.20)}
.btn-dark{background:linear-gradient(180deg,#30466c,#213554);border:1px solid rgba(148,163,184,.22);color:#eef4ff}
.btn-red{background:rgba(248,113,113,.14);border:1px solid rgba(248,113,113,.30);color:#fecaca}
.btn-yellow{background:rgba(251,191,36,.14);border:1px solid rgba(251,191,36,.30);color:#fde68a}
.panel,.card{
 background:linear-gradient(180deg,rgba(255,255,255,.070),rgba(255,255,255,.030));
 border:1px solid rgba(255,255,255,.09);border-radius:var(--radius);box-shadow:var(--shadow);backdrop-filter:blur(18px)
}
.panel{padding:18px;margin-top:14px}.card{padding:16px}
h1{font-size:clamp(32px,5vw,54px);line-height:1;letter-spacing:-2px}h2{font-size:clamp(26px,4vw,40px);letter-spacing:-1.2px}h3{letter-spacing:-.5px}
p,.muted{color:var(--muted);line-height:1.55}.small{font-size:12px;color:var(--muted)}
label{display:block;color:var(--muted);font-size:12px;font-weight:950;margin-bottom:7px}
input,select,textarea{width:100%;min-height:50px;border:1px solid rgba(161,184,220,.20);background:#102039;color:#fff;border-radius:16px;padding:13px 14px;outline:none}
input:focus,select:focus,textarea:focus{border-color:#34d399;box-shadow:0 0 0 4px rgba(52,211,153,.10)}
.badge{display:inline-flex;align-items:center;padding:7px 10px;border-radius:999px;font-size:12px;font-weight:950;background:rgba(96,165,250,.13);border:1px solid rgba(96,165,250,.25);color:#bfdbfe}
.badge.green{background:rgba(52,211,153,.13);border-color:rgba(52,211,153,.25);color:#bbf7d0}.badge.red{background:rgba(248,113,113,.13);border-color:rgba(248,113,113,.28);color:#fecaca}.badge.yellow{background:rgba(251,191,36,.13);border-color:rgba(251,191,36,.28);color:#fde68a}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.list{display:grid;gap:12px}
.searchbar{position:sticky;top:8px;z-index:50;background:rgba(10,20,34,.92);border:1px solid rgba(96,165,250,.20);border-radius:22px;padding:12px;box-shadow:0 18px 50px rgba(0,0,0,.35);backdrop-filter:blur(18px)}
.store-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:15px;border-radius:22px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.08)}
.store-row.off{opacity:.72;border-color:rgba(248,113,113,.25)}
.store-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:9px}
.store-link{margin-top:10px;padding:11px;border-radius:16px;background:rgba(7,16,31,.58);border:1px solid rgba(161,184,220,.16);color:#dbeafe;word-break:break-word;font-size:13px;font-weight:850}
.row-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.row-actions a,.row-actions button{min-height:40px;border-radius:13px;font-size:12px;padding:0 11px}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.detail-box{padding:14px;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.detail-box span{display:block;color:var(--muted);font-size:12px;font-weight:950;text-transform:uppercase}.detail-box b{display:block;margin-top:6px;font-size:18px;word-break:break-word}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:9999;background:#101827;border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:12px 16px;display:none;box-shadow:0 18px 50px rgba(0,0,0,.45);font-weight:900}.toast.show{display:block}
.footer{text-align:center;color:var(--muted);font-size:12px;line-height:1.6;margin-top:26px}
@media(max-width:820px){body{padding:10px}.top{border-radius:24px}.brand{font-size:19px}.logo{width:46px;height:46px}.grid,.detail-grid{grid-template-columns:1fr}.store-row{grid-template-columns:1fr}.row-actions{justify-content:stretch}.row-actions a,.row-actions button,.actions a,.actions button{flex:1}.searchbar{top:6px}.panel{padding:14px}.store-link{font-size:12px}}

/* === PocketPOS v3.5.1 - Share Store Links === */
.link-actions-split{
 display:flex;
 gap:8px;
 flex-wrap:wrap;
 justify-content:flex-end;
 align-items:center;
}
.link-actions-split button,
.link-actions-split a{
 min-height:38px!important;
 border-radius:13px!important;
 padding:0 12px!important;
 font-size:12px!important;
 white-space:nowrap;
}
.store-links-box{
 display:grid;
 gap:7px;
 margin-top:8px;
}
.store-link-pill{
 display:grid;
 grid-template-columns:auto 1fr auto;
 gap:8px;
 align-items:center;
 padding:8px 10px;
 border-radius:14px;
 background:rgba(2,6,23,.38);
 border:1px solid rgba(148,163,184,.13);
 font-size:12px;
}
.store-link-pill b{
 color:#bbf7d0;
 font-size:11px;
 text-transform:uppercase;
 letter-spacing:.5px;
}
.store-link-pill span{
 overflow:hidden;
 text-overflow:ellipsis;
 white-space:nowrap;
 color:#dbeafe;
}
.store-link-pill button{
 min-height:30px!important;
 border-radius:10px!important;
 padding:0 9px!important;
 font-size:11px!important;
}
@media(max-width:760px){
 .link-actions-split{
 justify-content:stretch;
 }
 .link-actions-split button,
 .link-actions-split a{
 flex:1;
 }
 .store-link-pill{
 grid-template-columns:1fr;
 }
}


/* =========================================================
 PocketPOS.0 Extra Oficial - Premium Minimal UI
 Colores planos, menos brillo, más app SaaS premium.
 ========================================================= */
:root{
 --bg:#0B1220!important;
 --panel:#111827!important;
 --panel2:#151F2E!important;
 --card:#182235!important;
 --line:#263244!important;
 --text:#F8FAFC!important;
 --muted:#94A3B8!important;
 --green:#22C55E!important;
 --green2:#22C55E!important;
 --blue:#3B82F6!important;
 --red:#EF4444!important;
 --yellow:#F59E0B!important;
 --purple:#6366F1!important;
 --shadow:0 18px 50px rgba(0,0,0,.24)!important;
 --radius:20px!important;
}
*{
 letter-spacing:-.01em;
}
body{
 background:#0B1220!important;
 color:#F8FAFC!important;
}
body:before{
 content:"";
 position:fixed;
 inset:0;
 z-index:-1;
 background:
 linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
 linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
 background-size:44px 44px;
 mask-image:linear-gradient(to bottom,rgba(0,0,0,.85),transparent 78%);
}
.card,
.panel,
.login-card,
.app-header,
.top,
.sites-card,
.master-bar,
.gestion-toggle,
.form-panel,
.sale-board,
.add-panel,
.modal,
.lr-admin-sites-card,
.admin-compact-bar,
.admin-gestion-toggle,
.master-stores-panel,
.stat,
.store-item,
.selected-store,
.product-line,
.sale-line,
.inventory-row{
 background:#111827!important;
 border:1px solid #263244!important;
 box-shadow:0 18px 50px rgba(0,0,0,.22)!important;
 backdrop-filter:none!important;
}
.card,
.panel,
.login-card,
.sites-card,
.master-bar,
.gestion-toggle,
.form-panel,
.sale-board,
.add-panel,
.modal,
.lr-admin-sites-card{
 border-radius:22px!important;
}
.logo,
.store-icon,
.lr-store-icon{
 background:#22C55E!important;
 color:#07111F!important;
 box-shadow:none!important;
}
h1,h2,h3,.brand,.master-title{
 letter-spacing:-.04em!important;
}
.muted,
.small,
small{
 color:#94A3B8!important;
}
input,
select,
textarea{
 background:#0B1220!important;
 border:1px solid #263244!important;
 color:#F8FAFC!important;
 box-shadow:none!important;
}
input:focus,
select:focus,
textarea:focus{
 border-color:#22C55E!important;
 box-shadow:0 0 0 3px rgba(34,197,94,.12)!important;
}
.btn,
button,
a.btn{
 border-radius:14px!important;
 box-shadow:none!important;
 text-shadow:none!important;
}
.btn-green,
button.btn-green,
a.btn-green,
.lr-new-project{
 background:#22C55E!important;
 color:#06130B!important;
 border:1px solid #22C55E!important;
}
.btn-dark,
button.btn-dark,
a.btn-dark{
 background:#182235!important;
 border:1px solid #263244!important;
 color:#F8FAFC!important;
}
.btn-red,
button.btn-red,
a.btn-red,
.danger-delete{
 background:#EF4444!important;
 border:1px solid #EF4444!important;
 color:#FFFFFF!important;
}
.btn-rainbow,
.lr-new-project{
 background:#22C55E!important;
 color:#06130B!important;
 text-transform:none!important;
 letter-spacing:-.01em!important;
}
.badge,
.status,
.mini-pill,
.lr-chip{
 background:#182235!important;
 border:1px solid #263244!important;
 color:#CBD5E1!important;
 box-shadow:none!important;
}
.badge.active,
.status.active,
.status.green,
.lr-status.green,
.mini-pill.green{
 background:rgba(34,197,94,.10)!important;
 border-color:rgba(34,197,94,.34)!important;
 color:#86EFAC!important;
}
.badge.hold,
.status.hold{
 background:rgba(245,158,11,.10)!important;
 border-color:rgba(245,158,11,.34)!important;
 color:#FCD34D!important;
}
.badge.suspended,
.badge.inactive,
.status.suspended,
.status.inactive,
.lr-status.red,
.mini-pill.red{
 background:rgba(239,68,68,.10)!important;
 border-color:rgba(239,68,68,.34)!important;
 color:#FCA5A5!important;
}
.notice,
.state,
.search-hint,
.mode-strip{
 background:#151F2E!important;
 border:1px solid #263244!important;
 color:#CBD5E1!important;
}
.error{
 background:rgba(239,68,68,.10)!important;
 border:1px solid rgba(239,68,68,.35)!important;
 color:#FCA5A5!important;
}
.total{
 background:#151F2E!important;
 border:1px solid #263244!important;
}
.total strong,
.total span{
 color:#F8FAFC!important;
}
.site-actions,
.form-actions,
.inventory-actions,
.sale-actions{
 gap:10px!important;
}
.store-list::-webkit-scrollbar,
.product-list::-webkit-scrollbar,
.sale-list::-webkit-scrollbar,
.inventory-list::-webkit-scrollbar{
 width:8px;
}
.store-list::-webkit-scrollbar-thumb,
.product-list::-webkit-scrollbar-thumb,
.sale-list::-webkit-scrollbar-thumb,
.inventory-list::-webkit-scrollbar-thumb{
 background:#263244;
 border-radius:999px;
}
.footer{
 color:#64748B!important;
}
@media(max-width:760px){
 body{padding:10px!important}
 .card,.panel,.login-card,.app-header,.top,.sites-card,.master-bar,.gestion-toggle,.form-panel,.sale-board,.add-panel{
 border-radius:18px!important;
 }
}