/* MENÚ PRINCIPAL */
#menuSection.menu-page{
  background:#f8f7fb;
  min-height:calc(100vh - 120px);
  padding:14px;
}

.menu-hero{
  background:#fff;
  border-radius:16px;
  padding:12px;
  box-shadow:0 6px 14px rgba(0,0,0,.05);
  display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
}
.menu-brand{display:flex;gap:10px;align-items:center;}
.menu-logo{
  width:44px;height:44px;border-radius:12px;background:#e8f0ff;
  display:flex;align-items:center;justify-content:center;font-size:24px;
}
.menu-brand h2{margin:0;font-size:18px;color:#111827}
.menu-brand small{color:#6b7280}
.menu-lock{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.menu-btn{
  border:none;border-radius:10px;padding:10px 12px;font-weight:700;cursor:pointer;
}
.menu-btn.primary{background:#2563eb;color:#fff;}
.menu-btn.ghost{background:#eef2ff;color:#1f2937;}
.lock-status{display:flex;align-items:center;gap:8px;color:#374151;font-size:13px;}
.switch{position:relative;display:inline-block;width:44px;height:24px;}
.switch input{opacity:0;width:0;height:0;}
.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:#d1d5db;transition:.2s;border-radius:24px;}
.slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:3px;background:white;transition:.2s;border-radius:50%;}
.switch input:checked + .slider{background:#2563eb;}
.switch input:checked + .slider:before{transform:translateX(20px);}

.menu-card{
  margin-top:14px;
  background:#fff;
  border-radius:16px;
  padding:12px;
  box-shadow:0 6px 14px rgba(0,0,0,.05);
}
.menu-card-title{display:flex;gap:10px;align-items:center;margin-bottom:10px;}
.menu-card h3{margin:0;font-size:15px;color:#111827;}
.menu-card small{color:#6b7280;}
.menu-icon{
  width:36px;height:36px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  font-size:16px;font-weight:700;color:#111827;
}
.badge-blue{background:#e3edff;color:#1d4ed8;}
.badge-gold{background:#fef6e4;color:#b45309;}
.badge-purple{background:#f2eafe;color:#7c3aed;}
.badge-amber{background:#fff5e5;color:#b45309;}
.badge-green{background:#e8f8ee;color:#16a34a;}
.badge-mint{background:#e8f8f5;color:#0f766e;}
.badge-orange{background:#fff3e8;color:#c2410c;}
.badge-teal{background:#e6f5ff;color:#0369a1;}
.badge-gray{background:#f3f4f6;color:#1f2937;}

.menu-form{display:flex;flex-direction:column;gap:10px;margin-top:8px;}
.menu-form.hidden{display:none;}
.menu-form label{display:flex;flex-direction:column;gap:4px;color:#374151;font-weight:700;font-size:13px;}
.menu-form input{
  padding:10px;border:1px solid #d1d5db;border-radius:10px;font-size:14px;box-sizing:border-box;
}
.pin-wrap{position:relative;}
.pin-eye{
  position:absolute;right:8px;top:50%;transform:translateY(-50%);
  border:none;background:transparent;cursor:pointer;font-size:16px;
}
.menu-actions{display:flex;gap:10px;flex-wrap:wrap;}
.menu-info{color:#6b7280;font-size:13px;}

.menu-section{margin-top:16px;}
.menu-section h4{margin:0 0 8px;font-size:14px;color:#1f2937;}
.menu-item{
  background:#fff;border-radius:14px;padding:10px;
  box-shadow:0 4px 10px rgba(0,0,0,.04);
  display:flex;align-items:center;gap:10px;
  margin-bottom:8px;
}
.menu-item strong{display:block;color:#111827;}
.menu-item small{color:#6b7280;font-size:12px;}
.menu-chip{
  margin-left:auto;border:none;background:#eef2ff;color:#1f2937;
  border-radius:999px;padding:6px 10px;font-weight:700;cursor:pointer;
}
.menu-list .menu-item + .menu-item{margin-top:8px;}

.trash-block{margin-top:10px;}
.trash-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;}
.trash-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px;}
.trash-list li{
  background:#f8fafc;border:1px solid #e5e7eb;border-radius:10px;padding:8px;
  display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:13px;
}
.trash-list .trash-meta{color:#6b7280;font-size:12px;}
.trash-actions{display:flex;gap:6px;}
.trash-actions button{border:none;border-radius:8px;padding:6px 8px;font-weight:700;cursor:pointer;}
.trash-actions .danger{background:#fecdd3;color:#b91c1c;}
.trash-actions .ghost{background:#eef2ff;color:#1f2937;}

.cat-pill{
  display:flex;flex-direction:column;align-items:stretch;gap:6px;
  background:#f8fafc;border:1px solid #e5e7eb;border-radius:10px;padding:8px;
  margin-bottom:6px;
}
.cat-pill strong{display:block;}
.cat-pill small{color:#6b7280;font-size:12px;}
.cat-pill .cat-actions{display:flex;gap:6px;}
.cat-pill button{border:none;border-radius:8px;padding:6px 8px;font-weight:700;cursor:pointer;}
.cat-pill .primary{background:#e3edff;color:#1d4ed8;}
.cat-pill .danger{background:#fecdd3;color:#b91c1c;}
.cat-pill .ghost{background:#eef2ff;color:#1f2937;}
.cat-row{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;}
.cat-name{display:flex;flex-direction:column;gap:2px;flex:1;}
.cat-edit-input{
  width:100%;
  padding:6px 8px;
  border:1px solid #d1d5db;
  border-radius:8px;
  font-size:13px;
  box-sizing:border-box;
}
.cat-sub-list{display:flex;flex-direction:column;gap:6px;margin-top:8px;width:100%;}
.cat-sub-item{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:6px 8px;
  font-size:12px;
}
.cat-sub-actions{display:flex;gap:6px;}
.cat-sub-input{
  flex:1;
  padding:6px 8px;
  border:1px solid #d1d5db;
  border-radius:8px;
  font-size:12px;
  box-sizing:border-box;
}
.cat-sub-empty{color:#9ca3af;font-size:12px;margin-top:6px;}
.cat-sub-add{
  display:flex;gap:6px;margin-top:8px;
}
.cat-sub-add input{
  flex:1;
  padding:6px 8px;
  border:1px solid #d1d5db;
  border-radius:8px;
  font-size:12px;
  box-sizing:border-box;
}
.cat-sub-add button{border:none;border-radius:8px;padding:6px 8px;font-weight:700;cursor:pointer;background:#eef2ff;color:#1f2937;}

@media(min-width:720px){
  #menuSection.menu-page{padding:18px;}
}

/* Modal de acciones */
.menu-modal{
  position:fixed;inset:0;background:rgba(0,0,0,.45);display:flex;
  align-items:center;justify-content:center;z-index:900;padding:14px;
}
.menu-modal.hidden{display:none;}
.menu-modal-content{
  background:#fff;border-radius:14px;padding:16px;max-width:360px;width:100%;
  box-shadow:0 10px 24px rgba(0,0,0,.2);
}
.menu-modal-content h3{margin:0 0 8px;font-size:18px;color:#111827}
.menu-modal-content p{margin:0 0 12px;color:#4b5563;font-size:14px}

/* Login gate */
body.gate-open{overflow:hidden;}
.login-gate{
  position:fixed;inset:0;z-index:1002;display:flex;align-items:stretch;justify-content:center;
  padding:clamp(16px,4vw,42px);
  background:
    radial-gradient(1100px 520px at 10% -10%, rgba(239,68,68,.45), transparent 60%),
    radial-gradient(900px 600px at 90% 0%, rgba(251,113,133,.35), transparent 55%),
    linear-gradient(135deg, #7f1d1d 0%, #b91c1c 45%, #dc2626 100%);
  color:#f8fafc;
}
.login-gate::before,
.login-gate::after{
  content:"";position:absolute;inset:0;pointer-events:none;
}
.login-gate::before{
  background:radial-gradient(600px 300px at 30% 80%, rgba(254,202,202,.25), transparent 70%);
}
.login-gate.hidden{display:none;}
.login-gate-shell{
  position:relative;z-index:1;display:flex;align-items:center;gap:clamp(16px,4vw,36px);
  width:min(1100px,100%);margin:auto;animation:gateIn .6s ease;
}
.login-gate-brand{
  flex:1.1;display:flex;flex-direction:column;gap:14px;
}
.gate-badge{
  display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;
  border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.12);
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;
}
.login-gate-brand h2{
  margin:0;font-size:clamp(28px,3.6vw,40px);line-height:1.1;color:#fff;
}
.login-gate-brand p{
  margin:0;color:#cbd5f5;font-size:14px;max-width:520px;
}
.gate-highlights{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:4px;
}
.gate-highlights div{
  background:rgba(15,23,42,.45);
  border:1px solid rgba(148,163,184,.35);
  border-radius:16px;padding:12px;backdrop-filter:blur(8px);
}
.gate-highlights strong{display:block;color:#fff;font-size:14px;margin-bottom:2px;}
.gate-highlights span{color:#cbd5e1;font-size:12px;}
.login-gate-panel{flex:.9;display:flex;justify-content:center;}
.login-gate-card{
  background:#fff;color:#0f172a;border-radius:24px;padding:22px 22px 18px;
  width:min(420px,100%);box-shadow:0 20px 50px rgba(15,23,42,.35);
  animation:gateCard .6s ease;
}
.login-gate-card h3{margin:0 0 6px;font-size:20px;}
.login-gate-card p{margin:0 0 14px;color:#64748b;font-size:13px;}
.login-gate-foot{margin-top:12px;color:#94a3b8;font-size:12px;}
.login-gate .menu-form{margin-top:0;gap:12px;}
.login-gate .menu-form label{color:#1f2937;font-size:12px;}
.login-gate .menu-form input{
  background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:12px;
}
.login-gate .menu-actions .menu-btn{border-radius:12px;padding:10px 14px;}

@keyframes gateIn{
  from{opacity:0;transform:translateY(10px);}
  to{opacity:1;transform:translateY(0);}
}
@keyframes gateCard{
  from{opacity:0;transform:translateY(16px) scale(.98);}
  to{opacity:1;transform:translateY(0) scale(1);}
}
@media(max-width:900px){
  .login-gate-shell{flex-direction:column;align-items:stretch;}
  .login-gate-panel{order:1;}
  .login-gate-brand{order:2;}
  .gate-highlights{grid-template-columns:1fr;}
}

/* Overlay de gestión (categorías/papelera) */
.menu-fullscreen{
  position:fixed;inset:0;background:#f8f7fb;z-index:901;
  overflow-y:auto;padding:16px;
}
.menu-fullscreen header{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  margin-bottom:12px;
}
.menu-fullscreen h2{margin:0;font-size:18px;color:#111827}
.menu-fullscreen .close-full{border:none;background:#eef2ff;color:#1f2937;padding:8px 10px;border-radius:10px;font-weight:700;cursor:pointer;}
.menu-fullscreen .content{display:flex;flex-direction:column;gap:12px;}

.menu-fullscreen .config-grid{
  display:grid;grid-template-columns:1fr;gap:10px;
}
.menu-fullscreen .config-grid label{
  display:flex;flex-direction:column;gap:4px;font-weight:700;color:#1f2937;font-size:13px;
}
.menu-fullscreen .config-grid input,
.menu-fullscreen .config-grid select{
  padding:10px;border:1px solid #d1d5db;border-radius:10px;font-size:14px;box-sizing:border-box;
}
.menu-fullscreen .config-actions{display:flex;gap:10px;flex-wrap:wrap;}
.menu-fullscreen .config-actions button{border:none;border-radius:10px;padding:10px 12px;font-weight:700;cursor:pointer;}
.menu-fullscreen .config-actions .primary{background:#2563eb;color:#fff;}
.menu-fullscreen .config-actions .ghost{background:#eef2ff;color:#1f2937;}

.menu-fullscreen .cat-form{display:flex;gap:8px;flex-wrap:wrap;}
.menu-fullscreen .cat-form input{padding:10px;border:1px solid #d1d5db;border-radius:10px;flex:1;}
.menu-fullscreen .cat-form button{border:none;border-radius:10px;padding:10px 12px;font-weight:700;cursor:pointer;background:#2563eb;color:#fff;}

.menu-fullscreen .cat-list{display:flex;flex-direction:column;gap:8px;}
.menu-fullscreen .cat-pill{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:10px;display:flex;justify-content:space-between;align-items:center;}
.menu-fullscreen .cat-pill strong{display:block;}
.menu-fullscreen .cat-pill small{color:#6b7280;font-size:12px;}
.menu-fullscreen .cat-pill .cat-actions{display:flex;gap:6px;}
.menu-fullscreen .cat-pill button{border:none;border-radius:8px;padding:6px 8px;font-weight:700;cursor:pointer;}
.menu-fullscreen .cat-pill .ghost{background:#eef2ff;color:#1f2937;}
.menu-fullscreen .cat-pill .danger{background:#fecdd3;color:#b91c1c;}

.menu-fullscreen .trash-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;}
.menu-fullscreen .trash-list li{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:10px;display:flex;justify-content:space-between;align-items:center;}
.menu-fullscreen .trash-list .trash-meta{color:#6b7280;font-size:12px;}
.menu-fullscreen .trash-list .trash-actions{display:flex;gap:6px;}
.menu-fullscreen .trash-list button{border:none;border-radius:8px;padding:6px 8px;font-weight:700;cursor:pointer;}
.menu-fullscreen .trash-list .danger{background:#fecdd3;color:#b91c1c;}
.menu-fullscreen .trash-list .ghost{background:#eef2ff;color:#1f2937;}

.menu-fullscreen .receipt-toolbar{
  display:flex;
  align-items:center;
  gap:8px;
  justify-content:space-between;
  flex-wrap:wrap;
}
.menu-fullscreen .receipt-toolbar input{
  flex:1;
  min-width:180px;
  padding:8px 10px;
  border:1px solid #d1d5db;
  border-radius:10px;
  font-size:13px;
}
.menu-fullscreen .receipt-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;}
.menu-fullscreen .receipt-list li{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:10px;display:flex;justify-content:space-between;align-items:flex-start;gap:10px;}
.menu-fullscreen .receipt-meta{color:#6b7280;font-size:12px;}
.menu-fullscreen .receipt-actions{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end;}
.menu-fullscreen .receipt-actions button{border:none;border-radius:8px;padding:6px 8px;font-weight:700;cursor:pointer;}
.menu-fullscreen .receipt-actions .danger{background:#fecdd3;color:#b91c1c;}
.menu-fullscreen .receipt-actions .ghost{background:#eef2ff;color:#1f2937;}

.menu-fullscreen .pay-form{display:flex;gap:8px;flex-wrap:wrap;}
.menu-fullscreen .pay-form input{padding:10px;border:1px solid #d1d5db;border-radius:10px;flex:1;}
.menu-fullscreen .pay-form button{border:none;border-radius:10px;padding:10px 12px;font-weight:700;cursor:pointer;background:#2563eb;color:#fff;}
.menu-fullscreen .pay-list{display:flex;flex-direction:column;gap:8px;}
.menu-fullscreen .pay-item{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:10px;display:flex;justify-content:space-between;align-items:center;}
.menu-fullscreen .pay-item .pay-actions{display:flex;gap:6px;}
.menu-fullscreen .pay-item button{border:none;border-radius:8px;padding:6px 8px;font-weight:700;cursor:pointer;}
.menu-fullscreen .pay-item .danger{background:#fecdd3;color:#b91c1c;}