:root {
 --bg:#07111f;
 --card:#10233d;
 --card2:#162b47;
 --line:rgba(255,255,255,.13);
 --text:#f8fbff;
 --muted:#a8b6d4;
 --green:#19c37d;
 --green2:#89f7c4;
 --red:#ff4d5e;
 --orange:#ff8a3d;
 --blue:#2196f3;
 --purple:#7c3aed;
 --shadow:0 24px 80px rgba(0,0,0,.35);
 --radius:28px;
}
*{box-sizing:border-box;margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,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;
 background:
 radial-gradient(circle at 12% 8%,rgba(25,195,125,.28),transparent 30%),
 radial-gradient(circle at 88% 4%,rgba(255,77,94,.18),transparent 28%),
 radial-gradient(circle at 50% 0%,rgba(33,150,243,.18),transparent 38%),
 linear-gradient(135deg,#07111f 0%,#102b3c 45%,#07111f 100%);
 color:var(--text);
 padding:16px;
}
button,input,select,textarea{font-size:16px}
button,a{text-decoration:none}
button{border:0;cursor:pointer}
.hidden{display:none!important}
.muted{color:var(--muted);line-height:1.45}
.small{font-size:12px;color:var(--muted);line-height:1.35}
.shell{width:min(1180px,100%);margin:0 auto}
.card{
 background:linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.040));
 border:1px solid var(--line);
 border-radius:var(--radius);
 box-shadow:var(--shadow);
 backdrop-filter:blur(18px);
}
.btn{
 min-height:46px;
 border-radius:16px;
 padding:0 16px;
 font-weight:950;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 gap:8px;
 color:#fff;
}
.btn-green{background:linear-gradient(90deg,#8af7c6,#19c37d 55%,#0ba96a);color:#042516;box-shadow:0 16px 40px rgba(25,195,125,.25)}
.btn-dark{background:linear-gradient(180deg,#344a76,#22385d);border:1px solid rgba(148,163,184,.25);color:#f4f8ff}
.btn-red{background:linear-gradient(180deg,rgba(255,77,94,.24),rgba(127,29,29,.38));border:1px solid rgba(255,77,94,.35);color:#ffe4e6}
.btn-rainbow{background:linear-gradient(90deg,#ff4d5e 0%,#ff8a3d 32%,#19c37d 66%,#2196f3 100%);color:#fff;text-shadow:0 1px 0 rgba(0,0,0,.25)}
input,select,textarea{
 width:100%;
 min-height:52px;
 border-radius:16px;
 border:1px solid rgba(137,247,196,.20);
 background:#0e1f39;
 color:#fff;
 padding:13px 14px;
 outline:none;
}
textarea{min-height:104px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:rgba(25,195,125,.72);box-shadow:0 0 0 4px rgba(25,195,125,.14)}
label{display:block;color:#c4d0e6;font-size:12px;font-weight:950;margin:0 0 7px}
.login-wrap{min-height:calc(100vh - 32px);display:flex;align-items:center;justify-content:center}
.login-card{width:min(470px,100%);padding:22px;background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.045)),linear-gradient(135deg,rgba(25,195,125,.14),rgba(255,77,94,.08));border-radius:30px;border:1px solid rgba(255,255,255,.16);box-shadow:var(--shadow)}
.logo{width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,var(--green2),var(--green));display:flex;align-items:center;justify-content:center;color:#052814;font-size:26px;box-shadow:0 16px 38px rgba(25,195,125,.30)}
.login-card h1{font-size:32px;letter-spacing:-1.2px;margin-top:16px}
.login-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.error{margin-top:12px;padding:12px;border-radius:16px;background:rgba(255,77,94,.12);border:1px solid rgba(255,77,94,.30);color:#fecdd3;font-size:13px;font-weight:850;line-height:1.4}
.notice{margin-top:12px;padding:12px;border-radius:16px;background:rgba(33,150,243,.11);border:1px solid rgba(33,150,243,.25);color:#bfdbfe;font-size:13px;line-height:1.45}
.app-header{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:14px 16px;margin-bottom:14px;border-radius:26px;background:rgba(7,16,31,.82);border:1px solid var(--line);box-shadow:var(--shadow)}
.brand{display:flex;align-items:center;gap:12px;font-weight:950;font-size:22px;letter-spacing:-.8px}
.header-actions{display:flex;gap:8px;flex-wrap:wrap}
.badge{display:inline-flex;align-items:center;justify-content:center;padding:7px 10px;border-radius:999px;background:rgba(25,195,125,.15);border:1px solid rgba(25,195,125,.34);color:#9af7c4;font-size:11px;font-weight:950}
.grid-main{display:grid;gap:14px}
.sites-card{padding:18px;border-top:2px solid rgba(25,195,125,.72)}
.sites-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}
.sites-head h2{font-size:13px;letter-spacing:4px;text-transform:uppercase;color:#e9fff4}
.sites-head p{font-size:13px;color:var(--muted);margin-top:6px}
.selected-store{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:14px;border-radius:22px;border:1px solid rgba(25,195,125,.34);background:rgba(7,16,31,.72);cursor:pointer}
.store-icon{width:46px;height:46px;border-radius:16px;background:linear-gradient(135deg,var(--green2),var(--green));display:flex;align-items:center;justify-content:center;color:#052814;font-size:23px}
.selected-store b{display:block;font-size:15px;letter-spacing:.2px;text-transform:uppercase}
.selected-store small{display:block;margin-top:4px;color:#9fb0ca;font-size:11px;font-weight:850}
.toggle{width:40px;height:40px;border-radius:999px;background:#172942;border:1px solid rgba(148,163,184,.22);display:flex;align-items:center;justify-content:center;color:#bfdbfe;font-weight:950}
.drawer{display:none;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.09)}
.drawer.open{display:block}
.store-search{position:relative;margin-bottom:10px}
.store-search input{padding-left:42px}
.store-search:before{content:"🔎";position:absolute;left:14px;top:50%;transform:translateY(-50%);z-index:2}
.store-count{display:flex;justify-content:space-between;color:#8ea0bf;font-size:11px;font-weight:950;text-transform:uppercase;letter-spacing:.8px;margin:8px 2px 10px}
.store-list{display:grid;gap:8px;max-height:390px;overflow:auto;scrollbar-width:none}
.store-list::-webkit-scrollbar{display:none}
.store-item{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:12px 13px;border-radius:18px;border:1px solid rgba(148,163,184,.13);background:rgba(2,6,23,.50);cursor:pointer}
.store-item:hover,.store-item.active{border-color:rgba(25,195,125,.50);background:linear-gradient(180deg,rgba(25,195,125,.13),rgba(15,23,42,.72))}
.store-item b{display:block;font-size:13px;text-transform:uppercase;letter-spacing:.2px}
.store-item small{display:block;color:#8ea0bf;margin-top:4px;font-size:11px;font-weight:800}
.status{display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:0 10px;border-radius:999px;background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.32);color:#86efac;font-size:10px;font-weight:950;text-transform:uppercase}
.status.red{background:rgba(255,77,94,.16);border-color:rgba(255,77,94,.34);color:#fecdd3}
.site-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.master-bar{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:14px;margin-top:14px}
.master-title{font-size:16px;font-weight:950}
.gestion-toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;margin-top:14px;cursor:pointer}
.gestion-toggle b{display:block;font-size:22px;letter-spacing:-.8px}
.gestion-toggle small{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.form-panel{display:none;margin-top:14px;padding:18px}
.form-panel.open{display:block}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(280px,1fr));gap:14px}
.form-grid .full{grid-column:1/-1}
.form-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}
.stat{padding:13px;border-radius:18px;background:rgba(2,6,23,.36);border:1px solid rgba(148,163,184,.13)}
.stat span{display:block;color:var(--muted);font-size:11px;font-weight:950;text-transform:uppercase}
.stat b{display:block;font-size:24px;margin-top:5px}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:9999;display:none;padding:12px 16px;border-radius:999px;background:#101827;border:1px solid rgba(255,255,255,.15);box-shadow:0 18px 50px rgba(0,0,0,.45);font-weight:950}
.toast.show{display:block}
@media(max-width:860px){
 body{padding:10px}
 .app-header,.sites-card,.master-bar,.gestion-toggle,.form-panel{border-radius:24px}
 .master-bar{grid-template-columns:1fr}
 .site-actions,.form-actions{grid-template-columns:1fr}
 .form-grid{grid-template-columns:1fr}
 .stats{grid-template-columns:repeat(2,1fr)}
 .login-actions{grid-template-columns:1fr}
}

.access-row{
 display:grid;
 grid-template-columns:1fr auto auto;
 gap:10px;
 align-items:center;
 padding:12px;
 border-radius:18px;
 background:rgba(2,6,23,.40);
 border:1px solid rgba(148,163,184,.14);
}
.access-row b{display:block;font-size:14px}
.access-row small{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.site-actions{grid-template-columns:repeat(3,1fr)!important}
@media(max-width:860px){
 .site-actions{grid-template-columns:1fr!important}
 .access-row{grid-template-columns:1fr!important}
}


/* === PocketPOS v3.8 - Store Status Control === */
.status-actions{
 display:grid;
 grid-template-columns:repeat(4,1fr);
 gap:8px;
 margin-top:10px;
}
.status-actions button{
 min-height:40px!important;
 border-radius:14px!important;
 font-size:12px!important;
 padding:0 10px!important;
}
.status.hold,
.badge.hold{
 background:rgba(251,191,36,.15)!important;
 border-color:rgba(251,191,36,.34)!important;
 color:#fde68a!important;
}
.status.suspended,
.badge.suspended,
.status.inactive,
.badge.inactive{
 background:rgba(255,77,94,.16)!important;
 border-color:rgba(255,77,94,.34)!important;
 color:#fecdd3!important;
}
.status.active,
.badge.active{
 background:rgba(34,197,94,.14)!important;
 border-color:rgba(34,197,94,.32)!important;
 color:#86efac!important;
}
@media(max-width:860px){
 .status-actions{grid-template-columns:1fr 1fr}
}


/* === PocketPOS v3.9 - Store Delete Confirm === */
.danger-delete{
 background:linear-gradient(180deg,rgba(220,38,38,.42),rgba(127,29,29,.60))!important;
 border-color:rgba(248,113,113,.52)!important;
 color:#ffe4e6!important;
}
.delete-warning-box{
 padding:12px;
 margin-top:10px;
 border-radius:16px;
 background:rgba(220,38,38,.13);
 border:1px solid rgba(248,113,113,.30);
 color:#fecaca;
 font-size:13px;
 line-height:1.45;
}


/* =========================================================
 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;
 }
}


/* === PocketPOS.3 - Admin PIN initial setup === */
.pin-hint{
 padding:10px 12px;
 border-radius:14px;
 background:rgba(34,197,94,.08);
 border:1px solid rgba(34,197,94,.24);
 color:#86EFAC;
 font-size:12px;
 line-height:1.45;
}


/* === PocketPOS.4 - Initial Role Selector === */
.role-setup-note{
 padding:10px 12px;
 border-radius:14px;
 background:rgba(59,130,246,.08);
 border:1px solid rgba(59,130,246,.24);
 color:#BFDBFE;
 font-size:12px;
 line-height:1.45;
}


/* === PocketPOS v5.1 - Master email placeholder privacy === */
.master-demo-note{
  margin-top:8px;
  color:#94A3B8;
  font-size:12px;
  line-height:1.4;
}


/* === PocketPOS v5.7 - Simplified User Setup === */
.user-setup-title-v57{
  grid-column:1/-1;
  margin-top:6px;
  padding:12px 14px;
  border-radius:16px;
  background:#151F2E;
  border:1px solid #263244;
  color:#F8FAFC;
  font-weight:950;
  letter-spacing:-.02em;
}
.user-setup-title-v57 span{
  display:block;
  color:#94A3B8;
  font-weight:750;
  font-size:12px;
  margin-top:2px;
}
.add-user-v57{
  grid-column:1/-1;
  min-height:48px!important;
  border-radius:16px!important;
  background:#182235!important;
  border:1px solid #263244!important;
  color:#F8FAFC!important;
  font-weight:950!important;
  width:100%;
}
.add-user-v57.added{
  background:rgba(34,197,94,.10)!important;
  border-color:rgba(34,197,94,.34)!important;
  color:#86EFAC!important;
}
.user2-hidden-v57{
  display:none!important;
}
.user2-separator-v57{
  grid-column:1/-1;
  height:1px;
  background:#263244;
  margin:6px 0;
}
@media(max-width:760px){
  .user-setup-title-v57{
    padding:11px 12px;
  }
}


/* === PocketPOS v5.8 - Force hide optional user 2 === */
#user2FieldsV58{
  grid-column:1/-1;
  display:none;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  padding:14px;
  border-radius:18px;
  border:1px solid #263244;
  background:#0F172A;
  margin-top:4px;
}
#user2FieldsV58.show{
  display:grid;
}
#addUserBtnV58{
  grid-column:1/-1;
  min-height:48px!important;
  border-radius:16px!important;
  background:#182235!important;
  border:1px solid #263244!important;
  color:#F8FAFC!important;
  font-weight:950!important;
  width:100%;
}
#addUserBtnV58.active{
  background:rgba(34,197,94,.10)!important;
  border-color:rgba(34,197,94,.34)!important;
  color:#86EFAC!important;
}
#user2FieldsV58 .user-setup-title-v58{
  grid-column:1/-1;
  padding:10px 12px;
  border-radius:14px;
  background:#151F2E;
  border:1px solid #263244;
  color:#F8FAFC;
  font-weight:950;
}
#user2FieldsV58 .user-setup-title-v58 span{
  display:block;
  color:#94A3B8;
  font-size:12px;
  margin-top:2px;
}
@media(max-width:760px){
  #user2FieldsV58{
    grid-template-columns:1fr;
  }
}


/* === PocketPOS v5.19 - Master Admin Recovery Safe Overrides === */

/* Recovery: nada de pantallas ocultas por guardias visuales anteriores */
body,
html{
  min-height:100%!important;
}
body *{
  visibility:visible;
}

/* Desactivar clases agresivas de versiones anteriores si quedaron en cache/HTML */
.master-login-first-v518 [id*="masterPanel"],
.master-login-first-v518 [id*="masterView"],
.master-login-first-v518 .master-dashboard,
.master-login-first-v518 .master-auth-view,
.master-login-first-v518 .master-only,
.master-login-first-v518 .stores-shell,
.master-login-first-v518 .stores-panel{
  display:revert!important;
}

.master-compact-hidden-v516,
.master-top-action-hidden-v515,
.master-top-action-hidden-v514,
.master-action-hidden-v513,
.commercial-action-hidden-v515,
.commercial-action-hidden-v514,
.commercial-action-v513{
  display:revert!important;
}

/* Quitar menús inyectados agresivos */
#masterForceMenuV515,
#masterForceMenuV514,
#masterMenuWrapV513,
.master-menu-force-v515,
.master-menu-force-v514,
.master-hamburger-wrap-v513{
  display:none!important;
}

/* Botones comerciales vuelven normales */
.commercial-force-toggle-v515,
.commercial-force-toggle-v514,
.commercial-toggle-v513,
.commercial-force-box-v515,
.commercial-force-box-v514,
.commercial-actions-box-v513{
  display:none!important;
}

/* Login siempre visible y centrado cuando aparezca */
#loginView,
#loginCard,
.login-card,
.auth-card{
  opacity:1!important;
  visibility:visible!important;
}

/* Carrito master sin fondo verde de manera segura */
.logo.master-recovery-logo,
header .logo.master-recovery-logo,
.topbar .logo.master-recovery-logo{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:#22C55E!important;
  width:auto!important;
  height:auto!important;
  min-width:auto!important;
  min-height:auto!important;
  padding:0!important;
  border-radius:0!important;
  font-size:42px!important;
  line-height:1!important;
}

/* Setup de usuario principal simple */
.user-setup-recovery-note{
  grid-column:1/-1;
  padding:12px 14px;
  border-radius:16px;
  background:#151F2E;
  border:1px solid #263244;
  color:#CBD5E1;
  font-size:13px;
  line-height:1.45;
}
#addUserBtnRecovery{
  grid-column:1/-1;
  min-height:48px!important;
  border-radius:16px!important;
  background:#182235!important;
  border:1px solid #263244!important;
  color:#F8FAFC!important;
  font-weight:950!important;
}
#user2RecoveryBox{
  grid-column:1/-1;
  display:none;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  padding:14px;
  border-radius:18px;
  border:1px solid #263244;
  background:#0F172A;
}
#user2RecoveryBox.show{
  display:grid;
}
@media(max-width:760px){
  #user2RecoveryBox{
    grid-template-columns:1fr;
  }
}


/* === PocketPOS v5.20 - Admin Compact Clean === */
.app-header{
  align-items:flex-start!important;
}
.app-header .brand .logo{
  background:transparent!important;
  box-shadow:none!important;
  color:#22C55E!important;
  width:auto!important;
  height:auto!important;
  min-width:auto!important;
  min-height:auto!important;
  padding:0!important;
  border-radius:0!important;
  font-size:42px!important;
}
.clean-master-actions{
  align-items:flex-start!important;
  position:relative;
}
.master-menu-wrap{
  position:relative;
}
.master-menu-btn{
  min-width:118px;
}
.master-menu-panel{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  width:min(320px,calc(100vw - 36px));
  display:none;
  gap:8px;
  padding:10px;
  border-radius:22px;
  background:#111827;
  border:1px solid #263244;
  box-shadow:0 24px 80px rgba(0,0,0,.48);
  z-index:9999;
}
.master-menu-panel.open{
  display:grid;
}
.master-menu-panel .btn,
.master-menu-panel button,
.master-menu-panel a{
  width:100%;
  justify-content:flex-start!important;
  min-height:48px!important;
  border-radius:15px!important;
  background:#182235!important;
  border:1px solid #263244!important;
  color:#F8FAFC!important;
}
.sites-card{
  padding:18px!important;
}
.site-actions{
  grid-template-columns:1fr!important;
}
@media(min-width:760px){
  .site-actions{
    grid-template-columns:repeat(3,1fr)!important;
  }
}
.commercial-toggle{
  width:100%;
  margin-top:10px;
  justify-content:center!important;
}
.commercial-actions-collapsed{
  display:none!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  padding:10px;
  border-radius:18px;
  background:#0B1220;
  border:1px solid #263244;
}
.commercial-actions-collapsed.open{
  display:grid!important;
}
.commercial-actions-collapsed .danger-delete{
  grid-column:1/-1;
}
.gestion-toggle{
  margin-top:14px!important;
}
.form-panel{
  padding:16px!important;
}
.form-grid{
  gap:10px!important;
}
.form-grid .notice.full,
.form-grid .role-setup-note,
.form-grid .pin-hint{
  margin:0!important;
  padding:10px 12px!important;
  font-size:12px!important;
  border-radius:14px!important;
}
#storeForm .pin-hint{
  display:none!important;
}
.admin-field-group-title{
  grid-column:1/-1;
  padding:11px 13px;
  border-radius:16px;
  background:#151F2E;
  border:1px solid #263244;
  color:#F8FAFC;
  font-weight:950;
  margin-top:4px;
}
.admin-field-group-title small{
  display:block;
  margin-top:2px;
  color:#94A3B8;
  font-weight:750;
}
.admin-optional-box{
  grid-column:1/-1;
  display:none;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  padding:12px;
  border-radius:18px;
  border:1px solid #263244;
  background:#0B1220;
}
.admin-optional-box.open{
  display:grid;
}
.admin-toggle-section{
  grid-column:1/-1;
  width:100%;
  min-height:46px!important;
  border-radius:15px!important;
}
#user2BoxClean{
  grid-column:1/-1;
  display:none;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  padding:12px;
  border-radius:18px;
  border:1px solid #263244;
  background:#0B1220;
}
#user2BoxClean.open{
  display:grid;
}
@media(max-width:760px){
  body{
    padding:12px!important;
  }
  .app-header{
    padding:16px!important;
  }
  .app-header .brand{
    align-items:flex-start!important;
  }
  .app-header .brand>div:last-child{
    font-size:26px!important;
    line-height:1.05!important;
  }
  .header-actions{
    width:100%;
    display:flex!important;
    justify-content:space-between!important;
  }
  .master-menu-wrap{
    margin-left:auto;
  }
  .master-menu-panel{
    right:0;
  }
  .status-actions,
  .commercial-actions-collapsed,
  .admin-optional-box,
  #user2BoxClean{
    grid-template-columns:1fr!important;
  }
  .form-grid{
    grid-template-columns:1fr!important;
  }
}


/* === PocketPOS v5.21 - Admin Selected Store Flow === */

/* El directorio de tiendas no debe sentirse como ficha abierta por defecto */
body:not(.store-open-v521) #quickStoreActions,
body:not(.store-open-v521) .site-actions,
body:not(.store-open-v521) #commercialToggleBtn,
body:not(.store-open-v521) #quickStatusActions{
  display:none!important;
}

/* Botón para abrir ficha visible como acción principal */
.open-store-cta-v521{
  width:100%;
  min-height:48px!important;
  border-radius:16px!important;
  background:#182235!important;
  border:1px solid #263244!important;
  color:#F8FAFC!important;
  font-weight:950!important;
  margin-top:10px!important;
}

/* Cuando la tienda está abierta, mostrar acciones de forma ordenada */
body.store-open-v521 .site-actions{
  display:grid!important;
}

/* Ficha abierta con separación visual */
.store-selected-panel-v521{
  margin-top:10px;
  padding:10px;
  border-radius:20px;
  border:1px solid #263244;
  background:#0B1220;
}

/* Search dentro de gestión/directorio */
.admin-store-search-v521{
  margin-top:12px;
  display:grid;
  gap:8px;
}
.admin-store-search-v521 label{
  color:#CBD5E1;
  font-size:12px;
  font-weight:950;
}
.admin-store-search-v521 input{
  width:100%;
}

/* Lista compacta de gestión */
.store-list-compact-v521{
  display:grid;
  gap:8px;
  margin-top:12px;
}
.store-list-row-v521{
  padding:12px;
  border-radius:16px;
  background:#111827;
  border:1px solid #263244;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.store-list-row-v521 strong{
  color:#F8FAFC;
  display:block;
  font-size:14px;
}
.store-list-row-v521 small{
  color:#94A3B8;
  font-weight:750;
}
.store-list-row-v521 button{
  min-height:38px!important;
  border-radius:12px!important;
  padding:0 12px!important;
  font-size:13px!important;
}

/* Ocultar duplicados si se arma lista compacta */
.admin-generated-list-hidden-v521{
  display:none!important;
}

@media(max-width:760px){
  .store-list-row-v521{
    align-items:flex-start;
  }
}


/* === PocketPOS v5.23 - Remove Outer Search === */

/* Ocultar el buscador externo creado arriba de la tarjeta.
   Se conserva el buscador interno que aparece al desplegar tiendas. */
.admin-store-search-v521,
#adminStoreSearchV521,
#adminStoreSearchV521Label,
.admin-store-search-v521 label{
  display:none!important;
}

/* Si el contenedor del buscador externo quedó como div vacío, eliminar espacio visual */
.admin-store-search-v521{
  margin:0!important;
  padding:0!important;
  height:0!important;
  overflow:hidden!important;
}

/* Mantener premium el buscador interno del dropdown/lista */
#storeSearch,
.store-search,
input[placeholder*="Buscar tienda, estado o tipo"]{
  width:100%!important;
  max-width:100%!important;
  min-height:54px!important;
  border-radius:18px!important;
}


/* === PocketPOS v5.31 - Employee User Editor UX === */
.employee-help-v531{
  grid-column:1/-1;
  padding:12px 14px;
  border-radius:16px;
  background:#0B1220;
  border:1px solid #263244;
  color:#CBD5E1;
  font-weight:800;
  line-height:1.4;
}
.employee-help-v531 b{color:#86EFAC}
.access-row small b{
  color:#86EFAC;
}


/* === PocketPOS v5.32 - Users PIN Panel Fix === */
.users-panel-v532{
  display:none;
  margin-top:14px;
  padding:16px;
  border-radius:24px;
  background:#111827;
  border:1px solid #263244;
}
.users-panel-v532.open{
  display:block;
}
.users-head-v532{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.users-head-v532 h3{
  margin:0;
  color:#F8FAFC;
  font-size:24px;
  line-height:1.05;
}
.users-head-v532 p{
  margin:4px 0 0;
  color:#94A3B8;
}
.users-grid-v532{
  display:grid;
  gap:10px;
}
.user-row-v532{
  display:grid;
  grid-template-columns:1.2fr 1fr .9fr auto;
  gap:10px;
  align-items:center;
  padding:12px;
  border-radius:18px;
  background:#0B1220;
  border:1px solid #263244;
}
.user-row-v532 b{
  color:#F8FAFC;
  display:block;
}
.user-row-v532 small{
  color:#94A3B8;
  font-weight:800;
}
.user-row-v532 .badge{
  justify-self:start;
}
.user-row-actions-v532{
  display:flex;
  gap:8px;
}
.user-editor-v532{
  display:none;
  margin-top:12px;
  padding:14px;
  border-radius:18px;
  background:#0B1220;
  border:1px solid #263244;
}
.user-editor-v532.open{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.user-editor-v532 .full{
  grid-column:1/-1;
}
.user-editor-v532 .help{
  grid-column:1/-1;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid #14532D;
  background:rgba(34,197,94,.10);
  color:#86EFAC;
  font-weight:850;
}
.users-empty-v532{
  padding:14px;
  border-radius:18px;
  border:1px dashed #334155;
  color:#94A3B8;
  text-align:center;
  font-weight:850;
}
@media(max-width:760px){
  .user-row-v532{
    grid-template-columns:1fr;
  }
  .user-row-actions-v532{
    display:grid;
    grid-template-columns:1fr 1fr;
  }
  .user-editor-v532.open{
    grid-template-columns:1fr;
  }
}


/* === PocketPOS v5.50 - Admin Store Users Editor CSS === */
.store-users-editor-v550{
  grid-column:1/-1;
  margin-top:12px;
  padding:16px;
  border-radius:24px;
  background:#111827;
  border:1px solid #263244;
}
.store-users-editor-v550 h3{
  margin:0;
  color:#F8FAFC;
  font-size:24px;
  letter-spacing:-.03em;
}
.store-users-editor-v550 p{
  margin:4px 0 0;
  color:#94A3B8;
  line-height:1.35;
}
.store-users-top-v550{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.store-users-actions-v550{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.store-users-list-v550{
  display:grid;
  gap:10px;
  margin:12px 0;
}
.store-user-row-v550{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  align-items:center;
  padding:12px;
  border-radius:18px;
  background:#0B1220;
  border:1px solid #263244;
}
.store-user-row-v550 b{
  display:block;
  color:#F8FAFC;
  font-size:15px;
}
.store-user-row-v550 small{
  display:block;
  color:#94A3B8;
  font-weight:800;
  margin-top:3px;
}
.store-user-row-v550 .row-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.store-user-editor-grid-v550{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  padding:14px;
  border-radius:20px;
  background:#0B1220;
  border:1px solid #263244;
}
.store-user-editor-grid-v550 .full{
  grid-column:1/-1;
}
.store-user-editor-grid-v550 label{
  display:block;
  margin:0 0 6px;
  color:#CBD5E1;
  font-weight:950;
  font-size:12px;
}
.store-user-editor-grid-v550 input,
.store-user-editor-grid-v550 select{
  width:100%;
  min-height:48px;
  border-radius:16px;
  background:#08111F;
  border:1px solid #263244;
  color:#F8FAFC;
  padding:0 14px;
  font-weight:850;
}
.store-user-editor-actions-v550{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:10px;
}
.store-user-note-v550{
  grid-column:1/-1;
  padding:10px 12px;
  border-radius:16px;
  background:rgba(59,130,246,.08);
  border:1px solid rgba(59,130,246,.26);
  color:#BFDBFE;
  font-size:12px;
  font-weight:800;
  line-height:1.4;
}
@media(max-width:760px){
  .store-users-top-v550{
    display:grid;
  }
  .store-users-actions-v550{
    justify-content:stretch;
  }
  .store-users-actions-v550 .btn{
    width:100%;
  }
  .store-user-row-v550{
    grid-template-columns:1fr;
  }
  .store-user-row-v550 .row-actions{
    justify-content:stretch;
  }
  .store-user-row-v550 .row-actions .btn{
    flex:1;
  }
  .store-user-editor-grid-v550{
    grid-template-columns:1fr;
  }
  .store-user-editor-actions-v550{
    grid-template-columns:1fr;
  }
}