
/* ===== Grupos plegables de Herramientas de mantenimiento ===== */
.herr-grupo { border:1px solid var(--gris2); border-radius:16px; margin-bottom:10px; overflow:hidden; background:#fff; }
.herr-grupo-header { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:13px 15px; cursor:pointer; background:#fafbfc; font-weight:900; font-size:13px; color:var(--texto); user-select:none; }
.herr-grupo-header .herr-count { font-size:10px; font-weight:800; color:var(--texto3); background:var(--gris); border-radius:20px; padding:2px 9px; margin-left:6px; }
.herr-grupo-header .herr-chev { transition:transform .18s ease; color:var(--texto3); font-size:12px; }
.herr-grupo.abierto .herr-grupo-header .herr-chev { transform:rotate(180deg); }
.herr-grupo-body { display:none; padding:2px 15px 10px; border-top:1px solid var(--gris2); }
.herr-grupo.abierto .herr-grupo-body { display:block; }
.herr-grupo-body .admin-toggle-row:last-child { border-bottom:none; }

/* ===== Opciones seleccionables de un producto (talla, color, salsa...) ===== */
.prod-opciones-box { background:#F8FAFC; border:1px solid var(--gris2); border-radius:12px; padding:10px 11px; margin-bottom:11px; }
.prod-opciones-intro { font-size:10px; font-weight:800; color:var(--texto2); margin-bottom:9px; }
.prod-opcion-grupo { margin-bottom:11px; }
.prod-opcion-grupo:last-child { margin-bottom:0; }
.prod-opcion-label { display:flex; align-items:center; gap:6px; font-size:10.5px; font-weight:900; color:var(--texto); margin-bottom:6px; }
.prod-opcion-label .req-tag { font-size:8.5px; font-weight:800; color:#991B1B; background:#FEE2E2; border-radius:20px; padding:1px 7px; letter-spacing:.02em; }
.prod-opcion-row { display:flex; gap:7px; flex-wrap:wrap; }
.prod-opcion-btn {
  display:inline-flex; align-items:center; gap:5px; padding:7px 12px; min-width:38px;
  border:1.5px solid var(--gris2); background:#fff; border-radius:10px;
  font-size:10.5px; font-weight:850; line-height:1.1; color:var(--texto);
  cursor:pointer; font-family:inherit; touch-action:manipulation;
  transition:border-color .12s ease, background .12s ease, color .12s ease, transform .08s ease;
}
.prod-opcion-btn:active { transform:scale(.95); }
.prod-opcion-btn .chk { display:none; font-size:10px; }
.prod-opcion-btn.selected { border-color:var(--verde); background:var(--verde3); color:var(--verde2); }
.prod-opcion-btn.selected .chk { display:inline; }

/* ===== Menú por categorías estilo "supermercado" (fila horizontal + acceso rápido) ===== */
.menu-cat-nav {
  display:flex; gap:6px; overflow-x:auto; padding:9px 16px 7px; margin:0 -16px 10px;
  scrollbar-width:none; position:sticky; top:0; background:#fff; z-index:6;
  border-bottom:1px solid var(--gris2);
}
.menu-cat-nav::-webkit-scrollbar { display:none; }
.menu-cat-pill { flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:4px; cursor:pointer; background:none; border:none; padding:0; font-family:inherit; }
.menu-cat-pill-ico { width:38px; height:38px; border-radius:13px; background:var(--gris); display:flex; align-items:center; justify-content:center; font-size:23px; transition:background .15s ease; }
.menu-cat-pill.on .menu-cat-pill-ico { background:var(--verde3); box-shadow:inset 0 0 0 2px var(--verde); }
.menu-cat-pill span { font-size:9.5px; font-weight:800; color:var(--texto2); max-width:46px; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.menu-cat-pill.on span { color:var(--verde2); }

.mini-dish-row { display:flex; gap:10px; overflow-x:auto; padding:2px 1px 12px; scrollbar-width:none; scroll-snap-type:x proximity; }
.mini-dish-row::-webkit-scrollbar { display:none; }
.mini-dish-card { width:126px; flex:0 0 126px; background:#fff; border:1px solid rgba(15,25,35,.06); border-radius:16px; overflow:hidden; box-shadow:0 4px 14px rgba(15,25,35,.06); cursor:pointer; scroll-snap-align:start; }
.mini-dish-card.agotado { opacity:.55; }
.mini-dish-img { height:88px; position:relative; background:var(--gris); display:flex; align-items:center; justify-content:center; font-size:26px; overflow:hidden; }
.mini-dish-img img { width:100%; height:100%; object-fit:cover; display:block; }
.mini-dish-add { position:absolute; bottom:6px; right:6px; width:27px; height:27px; border-radius:50%; border:none; background:var(--verde); color:#fff; font-size:16px; font-weight:900; display:flex; align-items:center; justify-content:center; box-shadow:0 3px 8px rgba(0,0,0,.2); cursor:pointer; line-height:1; }
.mini-dish-add:disabled { background:#c7cdc9; }
.mini-dish-body { padding:7px 8px 9px; }
.mini-dish-name { font-size:11.5px; font-weight:850; color:var(--texto); line-height:1.25; height:29px; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.mini-dish-price { font-size:13px; font-weight:950; color:var(--verde2); margin-top:4px; display:flex; align-items:baseline; gap:5px; }
.mini-dish-price .old { font-size:9.5px; color:var(--texto3); text-decoration:line-through; font-weight:700; }
.destacado-card {
  width:176px; flex:0 0 176px; background:#fff; border:1px solid rgba(15,25,35,.06);
  border-radius:18px; overflow:hidden; box-shadow:0 7px 22px rgba(15,25,35,.07);
  scroll-snap-align:start; cursor:pointer; transition:transform .18s ease, box-shadow .18s ease;
}
.destacado-card:active { transform:scale(.98); }
.destacado-img { height:104px; position:relative; background:linear-gradient(135deg,#f0fdf4,#dcfce7); overflow:hidden; }
.destacado-img img { width:100%; height:100%; object-fit:cover; display:block; }
.destacado-gradient { position:absolute; inset:0; background:linear-gradient(to top,rgba(0,0,0,.18),transparent 55%); }
.destacado-status {
  position:absolute; top:8px; left:8px; border-radius:999px; padding:4px 7px;
  font-size:8.5px; font-weight:950; background:rgba(255,255,255,.94); color:var(--verde2);
  box-shadow:0 3px 10px rgba(0,0,0,.10);
}
.destacado-status.closed { background:rgba(40,40,40,.88); color:#fff; }
.destacado-body { padding:10px 11px 11px; }
.destacado-name { font-size:12.5px; font-weight:950; color:var(--texto); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.destacado-meta { display:flex; gap:8px; align-items:center; margin-top:5px; font-size:9.5px; color:var(--texto2); font-weight:750; }

#s-home .home-section-heading { display:flex; align-items:center; justify-content:space-between; margin:17px 0 9px; }
#s-home .home-section-heading h3 { margin:0; font-size:14px; font-weight:950; letter-spacing:-.015em; }
#s-home .home-section-heading button { border:0; background:none; color:var(--verde); font:inherit; font-size:10.5px; font-weight:900; padding:4px 0; cursor:pointer; }
#s-home .home-rest-row { display:flex; gap:10px; overflow-x:auto; padding:1px 1px 7px; margin-bottom:2px; scrollbar-width:none; scroll-snap-type:x proximity; }
#s-home .home-rest-row::-webkit-scrollbar { display:none; }
#s-home .home-rest-row .rcard { scroll-snap-align:start; }

#s-home .rcard.modern { border:1px solid rgba(15,25,35,.055); box-shadow:0 6px 20px rgba(15,25,35,.07); background:#fff; }
#s-home .rcard.modern .rimg { position:relative; }
#s-home .rcard.modern .rbody { padding:11px 12px 12px; }
#s-home .rcard.modern .rname { font-weight:950; letter-spacing:-.015em; }
#s-home .rcard.modern .rmeta { color:var(--texto2); font-weight:750; }
#s-home .restaurant-meta-chip { display:inline-flex; align-items:center; gap:4px; padding:4px 7px; border-radius:999px; background:var(--gris); font-size:9.5px; font-weight:850; }

/* Navegación inferior: activo como cápsula, sin cambiar la lógica */
#s-home .bnav .ni { position:relative; gap:3px !important; border-radius:16px; margin:0 3px; transition:background .18s ease,color .18s ease; }
#s-home .bnav .ni svg { width:20px; height:20px; }
#s-home .bnav .ni.on { background:var(--verde3); color:var(--verde2); }

/* Barra contextual de carrito en Inicio */
#home-cart-float {
  display:none; position:fixed; left:14px; right:14px; bottom:calc(88px + env(safe-area-inset-bottom));
  z-index:9985; max-width:692px; margin:0 auto; background:var(--verde2); color:#fff;
  border-radius:18px; padding:11px 13px; box-shadow:0 12px 30px rgba(15,75,40,.28);
  align-items:center; gap:11px; cursor:pointer; border:1px solid rgba(255,255,255,.14);
}
#home-cart-float.show { display:flex; }
.home-cart-icon { width:38px; height:38px; border-radius:13px; background:rgba(255,255,255,.15); display:flex; align-items:center; justify-content:center; font-size:18px; flex-shrink:0; }
.home-cart-copy { flex:1; min-width:0; }
.home-cart-title { font-size:12px; font-weight:950; }
.home-cart-sub { font-size:9.5px; opacity:.78; margin-top:2px; }
.home-cart-total { font-size:13px; font-weight:950; white-space:nowrap; }
@media (min-width:760px){ #home-cart-float { left:50%; right:auto; width:calc(720px - 28px); transform:translateX(-50%); } }
@media (max-width:430px){
  .destacado-card { width:162px; flex-basis:162px; }
  .destacado-img { height:96px; }
  #home-cart-float { left:10px; right:10px; bottom:calc(86px + env(safe-area-inset-bottom)); border-radius:16px; }
}

@media (max-width:430px) {
  #s-home .hdr { padding-top:9px; padding-bottom:11px; }
  #s-home .client-hero { margin-top:7px; padding:8px 10px; }
  #s-home .client-title { font-size:16px; }
  #s-home .search { margin-top:7px; }
  #s-home .content { padding-top:10px; }
  .chamofavor-home-card { padding:10px 11px; margin-bottom:13px; border-radius:16px; }
  .chamofavor-home-icon { width:36px; height:36px; border-radius:12px; font-size:18px; }
  #cliente-promos-list .promo-user-card { min-width:0; width:100%; }
}

.legal-tabs { display:flex; gap:8px; overflow-x:auto; margin:12px 0 16px; scrollbar-width:none; }
.legal-tabs::-webkit-scrollbar { display:none; }
.legal-tab { border:1px solid var(--gris2); background:white; color:var(--texto2); border-radius:999px; padding:9px 12px; font-size:11px; font-weight:950; white-space:nowrap; cursor:pointer; }
.legal-tab.on { background:var(--verde); color:white; border-color:var(--verde); }
.legal-block { display:none; }
.legal-block.on { display:block; }


/* ===== MEJORAS CLIENTE: RESEÑAS, BANCO Y WHATSAPP COMPROBANTE ===== */
.client-bank-card { background:linear-gradient(135deg,#ffffff 0%,#f8fbf9 100%); border:1px solid rgba(15,25,35,.06); border-radius:22px; padding:16px; box-shadow:var(--sombra); margin-bottom:14px; }
.client-bank-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.client-proof-actions { display:grid; grid-template-columns:1fr; gap:10px; margin-top:12px; }
.whatsapp-proof-btn { background:#25D366 !important; color:white !important; box-shadow:0 4px 16px rgba(37,211,102,.28) !important; }
.review-box-modern { background:white; border:1px solid rgba(15,25,35,.06); border-radius:22px; padding:16px; box-shadow:var(--sombra); margin-bottom:14px; }
.review-title-row { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.review-icon { width:42px; height:42px; border-radius:15px; display:flex; align-items:center; justify-content:center; font-size:22px; flex-shrink:0; }
.review-stars { display:flex; gap:7px; font-size:31px; margin:8px 0 4px; user-select:none; }
@media (max-width:430px){ .client-bank-grid { grid-template-columns:1fr; } }



/* ===== FIX SEGURO PANEL CLIENTE 2026-05-30: BARRA ABAJO Y SCROLL CORRECTO =====
   Solo aplica al panel cliente (#s-home). Evita que la barra Inicio/Pedido/Pedidos/Perfil
   quede en la mitad de la pantalla y permite scroll natural del home cliente. */
body:has(#s-home.screen.active),
html:has(#s-home.screen.active) {
  height: auto !important;
  min-height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior-y: auto !important;
}

#s-home.screen.active {
  display: block !important;
  min-height: 100vh !important;
  min-height: 100svh !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  background: var(--gris) !important;
  padding-bottom: 0 !important;
}

#s-home .hdr {
  position: relative !important;
  top: auto !important;
  z-index: 2 !important;
  flex: none !important;
  padding-top: calc(16px + env(safe-area-inset-top)) !important;
  border-radius: 0 0 28px 28px !important;
}

#s-home > .content {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  padding-top: 22px !important;
  padding-bottom: calc(125px + env(safe-area-inset-bottom)) !important;
}

#s-home .bnav {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  transform: none !important;
  z-index: 9990 !important;
  min-height: 76px !important;
  padding: 9px 0 calc(12px + env(safe-area-inset-bottom)) !important;
  background: rgba(255,255,255,0.98) !important;
  border-top: 1px solid rgba(229,233,239,.95) !important;
  box-shadow: 0 -8px 28px rgba(15,25,35,.10) !important;
  backdrop-filter: blur(14px) !important;
}

#s-home .bnav .ni {
  min-width: 0 !important;
}

body:has(#s-home.screen.active) .notif-fab {
  bottom: calc(104px + env(safe-area-inset-bottom)) !important;
  right: 18px !important;
}

body:has(#s-home.screen.active) .refresh-fab {
  bottom: calc(52px + env(safe-area-inset-bottom)) !important;
  right: 18px !important;
  width: 42px !important;
  height: 42px !important;
}

@media (min-width: 760px) {
  #s-home .bnav {
    max-width: 720px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    border-radius: 22px 22px 0 0 !important;
  }
}



/* ===== PULL-TO-REFRESH ELIMINADO: se conserva solo el botón manual ↻ ===== */
#ptr-indicator {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.refresh-fab {
  display: none;
  align-items: center;
  justify-content: center;
}
body:has(#s-home.screen.active) .notif-fab {
  bottom: calc(96px + env(safe-area-inset-bottom)) !important;
}


/* ===== RESTAURADO BOTÓN ACTUALIZAR MANUAL, SIN PULL-TO-REFRESH ===== */
#refresh-fab.refresh-fab {
  position: fixed !important;
  right: 18px !important;
  bottom: calc(92px + env(safe-area-inset-bottom)) !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  background: var(--verde) !important;
  color: #fff !important;
  z-index: 9991 !important;
  box-shadow: 0 10px 28px rgba(15,25,35,.22) !important;
}
body:has(#s-home.screen.active) #refresh-fab.refresh-fab {
  bottom: calc(92px + env(safe-area-inset-bottom)) !important;
}
body:has(#s-home.screen.active) .notif-fab {
  bottom: calc(148px + env(safe-area-inset-bottom)) !important;
}



/* ===== FIX 2026-05-30: botones flotantes menos invasivos y teclado estable ===== */
.notif-fab, .refresh-fab {
  right: 10px !important;
  width: 36px !important;
  height: 36px !important;
  font-size: 16px !important;
  opacity: .72 !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.18) !important;
}
.notif-fab { bottom: calc(138px + env(safe-area-inset-bottom)) !important; }
.refresh-fab { bottom: calc(96px + env(safe-area-inset-bottom)) !important; }
.notif-fab:active, .refresh-fab:active { opacity: 1 !important; transform: scale(.94); }
body.keyboard-open .notif-fab,
body.keyboard-open .refresh-fab {
  display: none !important;
}
.cod-recogida-box {
  scroll-margin-bottom: 260px;
}
.input-codigo-recogida {
  user-select: text;
  -webkit-user-select: text;
}
@media (max-width: 430px) {
  .notif-fab, .refresh-fab { right: 8px !important; }
}


/* ===== PRODUCTOS RESTAURANTE PRO ===== */
.product-photo-picker { display:grid; grid-template-columns:96px 1fr; gap:12px; align-items:center; background:white; border:1px solid var(--gris2); border-radius:18px; padding:12px; box-shadow:var(--sombra); }
.product-photo-preview { width:96px; height:96px; border-radius:18px; background:linear-gradient(135deg,#f0fdf4,#dcfce7); border:2px dashed var(--verde4); display:flex; align-items:center; justify-content:center; font-size:34px; overflow:hidden; flex-shrink:0; }
.product-photo-preview img { width:100%; height:100%; object-fit:contain; display:block; }
.product-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.product-help { font-size:11px; color:var(--texto3); font-weight:700; line-height:1.4; margin-top:6px; }
.rest-menu-cover { width:76px; height:76px; border-radius:18px; background:linear-gradient(135deg,#f0fdf4,#dcfce7); display:flex; align-items:center; justify-content:center; overflow:hidden; flex-shrink:0; font-size:28px; border:1px solid var(--gris2); }
.rest-menu-cover img { width:100%; height:100%; object-fit:cover; display:block; }
.rest-menu-details { display:flex; gap:6px; flex-wrap:wrap; margin-top:8px; }
.menu-chip { display:inline-flex; align-items:center; gap:4px; font-size:10px; font-weight:900; border-radius:999px; padding:4px 8px; background:var(--gris); color:var(--texto2); border:1px solid var(--gris2); }
.menu-chip.green { background:var(--verde3); color:var(--verde2); border-color:var(--verde4); }
.menu-chip.gold { background:var(--amarillo2); color:#92400E; border-color:#f4d77f; }
.menu-chip.red { background:#FEE2E2; color:var(--rojo); border-color:#FECACA; }
.client-dish-card { background:white; border:1px solid rgba(15,25,35,.06); border-radius:20px; padding:12px; margin-bottom:12px; box-shadow:var(--sombra); display:grid; grid-template-columns:92px 1fr; gap:12px; align-items:stretch; }
.client-dish-img { width:92px; min-height:98px; border-radius:17px; background:linear-gradient(135deg,#fff7ed,#f0fdf4); overflow:hidden; display:flex; align-items:center; justify-content:center; font-size:34px; border:1px solid var(--gris2); }
.client-dish-img img { width:100%; height:100%; object-fit:cover; display:block; }
.client-dish-body { min-width:0; display:flex; flex-direction:column; }
.client-dish-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.client-dish-title { font-size:15px; font-weight:950; color:var(--texto); line-height:1.2; }
.client-dish-desc { font-size:11px; color:var(--texto2); line-height:1.45; font-weight:650; margin-top:4px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.client-dish-bottom { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding-top:10px; }
.client-add-btn { width:34px; height:34px; border-radius:50%; border:none; background:var(--verde); color:white; font-size:21px; font-weight:900; box-shadow:0 4px 12px rgba(27,107,58,.25); cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.client-add-btn:disabled { background:var(--gris3); box-shadow:none; }
.menu-top-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:12px; }
.menu-top-actions .btn { padding:12px; font-size:12px; box-shadow:none; }
@media (max-width:380px){ .product-form-grid{grid-template-columns:1fr;} .client-dish-card{grid-template-columns:82px 1fr;} .client-dish-img{width:82px;} }



/* ===== FAVORITOS, PROMOS, COMBOS Y CUPONES ===== */
.offer-chip { display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:950;background:#fff7ed;color:#9a3412;border:1px solid #fed7aa; }
.offer-chip.combo { background:#EDE9FE;color:#5B21B6;border-color:#DDD6FE; }
.offer-chip.cupon { background:#DBEAFE;color:#1E40AF;border-color:#BFDBFE; }
.client-fav-btn { border:none;background:white;color:var(--rojo);width:32px;height:32px;border-radius:50%;box-shadow:0 3px 12px rgba(0,0,0,.12);font-size:16px;font-weight:900;cursor:pointer;display:flex;align-items:center;justify-content:center; }
.client-fav-btn.off { color:var(--texto3); }
.client-dish-img { position:relative; }
.client-dish-img .client-fav-btn { position:absolute;right:7px;top:7px;z-index:3; }
.global-search-summary { background:linear-gradient(135deg,#f0fdf4,#fff7ed);border:1px solid var(--verde4);border-radius:18px;padding:12px 14px;margin-bottom:14px;font-size:12px;color:var(--texto2);font-weight:750;line-height:1.45; }
.global-search-heading { display:flex;align-items:center;justify-content:space-between;gap:10px;margin:18px 0 10px; }
.global-search-heading strong { font-size:15px;color:var(--texto); }
.global-search-heading span { font-size:11px;color:var(--texto3);font-weight:800; }
.global-product-source { display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 3px 7px;font-size:11px;font-weight:900;color:var(--verde2);cursor:pointer; }
.global-product-result { margin-bottom:14px; }
.global-product-result .client-dish-card { margin-bottom:0; }
.global-related-grid { display:grid;grid-template-columns:1fr;gap:12px; }
@media (min-width:720px) { .global-products-grid,.global-related-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px; } .global-product-result,.global-product-result .client-dish-card { margin-bottom:0;height:100%; } }
.old-price { font-size:11px;color:var(--texto3);text-decoration:line-through;font-weight:800;margin-top:1px; }
.promo-price { color:var(--naranja); }
.coupon-box { background:linear-gradient(135deg,#eff6ff,#f8fafc);border:1px solid #bfdbfe;border-radius:18px;padding:13px;margin-bottom:12px;box-shadow:var(--sombra); }
.coupon-row { display:flex;gap:8px;align-items:center; }
.coupon-row input { flex:1; }
.combo-note { background:var(--amarillo2);border:1px solid #f4d77f;color:#92400E;border-radius:14px;padding:10px 12px;font-size:12px;font-weight:800;line-height:1.45;margin:10px 0; }



/* ===== CHAMOGO SVG ICON SYSTEM - reemplaza emojis visibles sin romper layout ===== */
.cg-svg-icon{display:inline-flex;align-items:center;justify-content:center;width:1.05em;height:1.05em;vertical-align:-0.16em;margin-right:.24em;color:currentColor;flex-shrink:0;}
.cg-svg-icon svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;}
.nav-dot .cg-svg-icon,.tipo-icon .cg-svg-icon,.notif-ico .cg-svg-icon,.profile-avatar-big .cg-svg-icon,.rest-status-icon .cg-svg-icon,.rest-menu-icon .cg-svg-icon,.rep-bike .cg-svg-icon,.admin-avatar .cg-svg-icon{margin-right:0;width:1.15em;height:1.15em;}
.bdg .cg-svg-icon,.bdg-naranja .cg-svg-icon,.bdg-o .cg-svg-icon,.rep-chip .cg-svg-icon,.trust-badge .cg-svg-icon{width:.95em;height:.95em;margin-right:.16em;}
.wsub .cg-svg-icon{display:none;}


/* CAMPANA INTEGRADA EN HEADER */
.header-actions { display:flex; align-items:center; gap:10px; position:relative; z-index:2; }
.top-notif-btn { width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,.24); background:rgba(255,255,255,.16); color:#fff; display:flex; align-items:center; justify-content:center; font-size:16px; cursor:pointer; position:relative; backdrop-filter:blur(8px); box-shadow:0 4px 14px rgba(0,0,0,.12); }
.top-notif-btn:active { transform:scale(.96); background:rgba(255,255,255,.24); }
.top-notif-badge { position:absolute; top:-5px; right:-5px; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:var(--rojo); color:white; border:2px solid white; font-size:9px; font-weight:900; display:none; align-items:center; justify-content:center; }
.notif-fab-legacy { top:14px !important; right:16px !important; bottom:auto !important; width:40px !important; height:40px !important; background:rgba(27,107,58,.92) !important; border:1px solid rgba(255,255,255,.28) !important; }


/* ===== AJUSTE CHAMOGO: campana centrada en paneles internos ===== */
/* Cliente usa la campana dentro del header. Restaurante, repartidor y admin usan esta campana flotante centrada. */
#notif-fab.notif-fab-legacy {
  top: calc(10px + env(safe-area-inset-top)) !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translateX(-50%) !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 999px !important;
  background: rgba(19,77,42,.92) !important;
  border: 1px solid rgba(255,255,255,.30) !important;
  color: white !important;
  opacity: .96 !important;
  z-index: 9992 !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.18) !important;
  backdrop-filter: blur(10px) !important;
}
#notif-fab.notif-fab-legacy:active { transform: translateX(-50%) scale(.94) !important; }
#notif-fab.notif-fab-legacy .notif-badge {
  top: -5px !important;
  right: -6px !important;
}
body:has(#s-home.screen.active) #notif-fab.notif-fab-legacy,
body:has(#s-menu.screen.active) #notif-fab.notif-fab-legacy,
body:has(#s-cart.screen.active) #notif-fab.notif-fab-legacy,
body:has(#s-perfil.screen.active) #notif-fab.notif-fab-legacy,
body:has(#s-mispedidos.screen.active) #notif-fab.notif-fab-legacy,
body:has(#s-chat-pedido.screen.active) #notif-fab.notif-fab-legacy,
body:has(#s-favoritos.screen.active) #notif-fab.notif-fab-legacy { display: none !important; }
body:has(#s-home-rest.screen.active) #notif-fab.notif-fab-legacy,
body:has(#s-home-rep.screen.active) #notif-fab.notif-fab-legacy,
body:has(#s-admin.screen.active) #notif-fab.notif-fab-legacy {
  display: none !important;
}


/* =========================================================
   CHAMOGO - AJUSTE VISUAL COMPACTO / MODERNO
   Solo apariencia: no cambia colores, ids, funciones ni lógica.
   ========================================================= */
:root {
  --radio: 16px;
  --radio-sm: 11px;
  --sombra: 0 1px 10px rgba(15,25,35,0.06);
  --sombra-md: 0 4px 18px rgba(15,25,35,0.10);
  --sombra-lg: 0 8px 28px rgba(15,25,35,0.13);
}
html { font-size: 14.5px; }
body { line-height: 1.35; }
.hdr, .bhdr, .rep-hero, .admin-hero { padding-left: 14px; padding-right: 14px; }
.hdr { padding-top: 13px; padding-bottom: 15px; }
.bhdr { padding-top: 11px; padding-bottom: 13px; }
.logo { font-size: 23px; }
.hdr-sub, .bmeta { font-size: 10.5px; }
.bname { font-size: 15.5px; }
.bbtn { width: 34px; height: 34px; }
.search { margin-top: 10px; padding: 8px 13px; gap: 8px; }
.search input { font-size: 13px; }
.content { padding: 14px 13px; padding-bottom: calc(108px + env(safe-area-inset-bottom)); }
.sec, .rest-section-title, .admin-sec h3 { font-size: 10px; margin-bottom: 9px; }
.cats { gap: 6px; margin-bottom: 14px; }
.cat, .order-chip, .admin-tab { padding: 6px 11px; font-size: 10.5px; }
.rcard, .pedido-card, .pro-card, .admin-user-card, .admin-section-card, .rep-order-card, .cart-summary-card, .cart-pay-card, .rest-status-card, .rest-menu-card, .profile-row, .citem, .dish, .pago-row { border-radius: 15px; margin-bottom: 10px; }
.rcard { overflow: hidden; }
.rimg, .rcard.modern .rimg { height: 125px; font-size: 42px; }
.rbody, .rcard.modern .rbody { padding: 11px 12px 12px; }
.rname, .rcard.modern .rname { font-size: 14.5px; }
.rdir, .rmeta, .ped-items, .admin-line, .rep-order-line { font-size: 10.5px; }
.rmeta { gap: 7px; margin-top: 6px; }
.bdg, .bdg-naranja, .ped-estado, .rep-chip, .trust-badge, .tag-tipo { font-size: 9px; padding: 3px 8px; }
.dish, .citem, .pago-row, .profile-row { padding: 11px 12px; }
.dname, .profile-name { font-size: 13px; }
.ddesc, .profile-meta { font-size: 10.5px; }
.dprice, .ped-total { font-size: 13.5px; }
.addbtn { width: 31px; height: 31px; font-size: 19px; margin-left: 9px; }
.qbtn { width: 28px; height: 28px; font-size: 14px; }
.btn { padding: 13px 14px; font-size: 13.5px; border-radius: 24px; }
.btn-sm, .admin-actions .btn, .admin-user-actions .btn { padding: 7px 10px; font-size: 10.5px; border-radius: 18px; }
.fgroup { margin-bottom: 12px; }
.flabel { font-size: 10px; margin-bottom: 5px; }
.finput, .admin-search-bar { padding: 10px 12px; font-size: 13px; border-radius: 12px; }
.total-box { padding: 13px; margin-bottom: 12px; }
.trow { font-size: 12px; margin-bottom: 5px; }
.trow.grand { font-size: 15px; padding-top: 9px; }
.bnav { padding: 7px 0 calc(10px + env(safe-area-inset-bottom)); }
.ni { gap: 2px; font-size: 8px; padding: 3px; }
.ni svg { width: 19px; height: 19px; }
.cbadge { font-size: 8px; min-width: 15px; height: 15px; padding: 0 4px; }
.notif-fab { width: 38px; height: 38px; right: 12px; bottom: 150px; font-size: 17px; }
.refresh-fab { width: 34px; height: 34px; right: 14px; bottom: 100px; font-size: 15px; }
.toast { bottom: 84px; padding: 9px 16px; font-size: 12px; max-width: calc(100vw - 28px); white-space: normal; text-align: center; }
.quick-grid { gap: 8px; margin-bottom: 14px; }
.quick-card { border-radius: 15px; padding: 10px 7px; }
.quick-card b { font-size: 16px; }
.quick-card span { font-size: 9px; }
.client-hero, .profile-hero { border-radius: 18px; padding: 12px; margin-top: 10px; }
.client-title { font-size: 17px; }
.client-actions { gap: 8px; margin-top: 10px; }
.client-action { border-radius: 13px; padding: 8px 10px; font-size: 11px; }
.client-section-title { margin-bottom: 9px; }
.client-section-title h3 { font-size: 14px; }
.stat-grid, .admin-stat-row { gap: 8px; margin-bottom: 14px; }
.stat-card, .admin-stat-box { padding: 12px 10px; border-radius: 14px; }
.stat-num, .admin-stat-box b { font-size: 23px; }
.stat-label, .admin-stat-box span { font-size: 9px; }
.pedido-card { padding: 12px; }
.ped-header { margin-bottom: 7px; }
.ped-rest { font-size: 13.5px; }
.ped-btns, .rest-action-row, .rep-action-row, .admin-actions, .admin-user-actions { gap: 6px; margin-top: 9px; }
.rest-kpi-grid, .rep-stats, .admin-kpi-row, .admin-quick-grid { gap: 6px; }
.rest-kpi, .rep-stat, .admin-kpi, .admin-quick { border-radius: 13px; padding: 8px 6px; }
.rest-kpi b, .admin-quick b { font-size: 15px; }
.rep-stat strong, .admin-kpi b { font-size: 17px; }
.rest-kpi span, .rep-stat span, .admin-kpi span, .admin-quick span { font-size: 8px; }
.rep-hero, .admin-hero { padding-top: 13px; }
.rep-bike, .rep-avatar { width: 38px; height: 38px; border-radius: 14px; font-size: 20px; }
.rep-switch-card { margin-top: 10px; padding: 10px 12px; border-radius: 15px; }
.rep-switch-title { font-size: 12.5px; }
.rep-switch-sub { font-size: 10px; }
.rep-order-card { padding: 12px; }
.rep-order-title { font-size: 14px; }
.rep-mini-grid { gap: 6px; margin: 9px 0; }
.rep-mini { padding: 8px; border-radius: 12px; }
.rep-mini b { font-size: 12px; }
.rep-mini span { font-size: 9px; }
.admin-title { font-size: 17px; }
.admin-sub { font-size: 10px; }
.admin-header-btns { gap: 6px; }
.admin-title-row { padding-bottom: 11px; }
.admin-tabs-modern { gap: 5px; padding-top: 8px; padding-bottom: 8px; }
.admin-search-bar { margin-bottom: 10px; gap: 8px; }
.admin-user-card, .admin-section-card { padding: 12px; }
.admin-avatar { width: 42px; height: 42px; border-radius: 13px; font-size: 19px; }
.admin-user-name, .admin-main h4 { font-size: 13.5px; }
.admin-user-meta { font-size: 10.5px; }
.admin-finanzas-hero { border-radius: 16px; padding: 14px; margin-bottom: 12px; }
.admin-fin-box { padding: 10px; }
.admin-fin-box b { font-size: 17px; }
.admin-toggle-row { padding: 11px; border-radius: 13px; }
.admin-switch { width: 43px; height: 24px; }
.admin-switch-ball { width: 18px; height: 18px; }
.notif-sheet { border-radius: 18px 18px 0 0; max-height: 72vh; }
.notif-head { padding: 12px; }
.notif-title { font-size: 15px; }
.notif-list { padding: 8px 11px 18px; }
.notif-item { border-radius: 13px; padding: 10px; margin-bottom: 8px; }
.notif-ico { width: 30px; height: 30px; border-radius: 10px; font-size: 16px; }
.notif-txt strong { font-size: 12px; }
.notif-txt span { font-size: 11px; }
.chat-messages { min-height: 170px; max-height: 340px; padding: 11px 10px; }
.chat-msg { font-size: 12px; padding: 8px 11px; max-width: 86%; }
.chat-input-row { padding: 8px 10px; }
.mapa-sim { height: 130px; border-radius: 15px; }
.empty { padding: 36px 18px; }
.empty-icon { font-size: 46px; margin-bottom: 10px; }
.empty p { font-size: 12.5px; }
.success-circle { width: 68px; height: 68px; font-size: 32px; margin-bottom: 10px; }
.success-title { font-size: 19px; }
.success-sub { font-size: 12px; }
.welcome-screen { padding: 30px 22px; }
.wicon { font-size: 68px; margin-bottom: 14px; }
.wlogo { font-size: 42px; }
.wsub { font-size: 12.5px; margin-bottom: 24px; }
.w-features { gap: 8px; margin-bottom: 26px; }
.w-feat { border-radius: 12px; padding: 10px 7px; }
.w-feat-icon { font-size: 18px; }
.w-feat-txt { font-size: 9px; }
.tipo-card { padding: 15px; gap: 12px; border-radius: 15px; }
.tipo-icon { width: 48px; height: 48px; border-radius: 14px; font-size: 25px; }
.tipo-info .tipo-nombre { font-size: 14px; }
.tipo-info .tipo-desc { font-size: 11px; }
.profile-avatar { width: 40px; height: 40px; border-radius: 12px; font-size: 19px; }
.profile-avatar-big { width: 56px; height: 56px; border-radius: 18px; font-size: 26px; }
@media (min-width: 760px) {
  .content { max-width: 540px; }
  .bnav { max-width: 540px; }
  .notif-sheet { max-width: 540px; margin: 0 auto; }
}
@media (max-width: 420px) {
  html { font-size: 14px; }
  .content { padding-left: 11px; padding-right: 11px; }
  .admin-kpi-row, .admin-quick-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-grid, .rest-money-row, .rep-mini-grid { grid-template-columns: 1fr 1fr; }
  .admin-filter-row { gap: 6px; }
  .admin-filter-row select { max-width: 42%; }
}
@media (max-width: 360px) {
  html { font-size: 13.5px; }
  .content { padding-left: 9px; padding-right: 9px; }
  .quick-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .client-actions, .profile-mini, .admin-fin-grid { grid-template-columns: 1fr; }
  .btn { padding: 12px; }
  .rimg, .rcard.modern .rimg { height: 105px; }
  .admin-tab { padding-left: 9px; padding-right: 9px; }
}



