.adm-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.75);z-index:3000;align-items:center;justify-content:center}
.adm-overlay.open{display:flex}
.adm-login-box{background:#fff;width:360px;padding:45px 40px;text-align:center;border-top:4px solid var(--accent)}
.adm-login-box h3{font-family:var(--font-heading);font-size:2rem;margin-bottom:6px}
.adm-login-box p{color:var(--text-muted);font-size:0.85rem;margin-bottom:28px}
.adm-input{width:100%;padding:12px 14px;border:1px solid #e0e0e0;margin-bottom:12px;font-family:var(--font-body);font-size:0.95rem;outline:none;transition:.2s}
.adm-input:focus{border-color:var(--accent)}
.adm-btn-login{width:100%;padding:13px;background:var(--text-main);color:#fff;border:none;font-family:var(--font-body);font-weight:700;letter-spacing:1px;cursor:pointer;transition:.3s}
.adm-btn-login:hover{background:var(--accent)}
.adm-login-err{color:#e74c3c;font-size:0.82rem;margin-top:8px;display:none}

/* ══════════════════════════════════════
   ADMIN PANEL — RESPONSIVE MÓVIL
══════════════════════════════════════ */
.adm-menu-toggle {
    display: none;
    background: none;
    border: 1px solid #444;
    color: #ccc;
    width: 36px;
    height: 36px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 1rem;
    align-items: center;
    justify-content: center;
    transition: .2s;
    flex-shrink: 0;
}
.adm-menu-toggle:hover { border-color: var(--accent); color: var(--accent); }

.adm-nav-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 9998;
}
.adm-nav-overlay.open { display: block; }

@media (max-width: 768px) {
    /* Topbar compacto */
    .adm-topbar          { padding: 0 14px; height: 52px; gap: 10px; }
    .adm-topbar-brand    { font-size: 1.1rem; letter-spacing: 1px; }
    .adm-topbar-right    { gap: 8px; }
    .adm-topbar-right span { display: none; }          /* oculta el contador */
    .adm-topbar-right button { padding: 5px 10px; font-size: 0.72rem; }
    .adm-topbar-right button span.adm-btn-label { display: none; } /* solo icono */
    .adm-menu-toggle     { display: flex; }

    /* Nav = drawer lateral, oculto por defecto */
    .adm-nav {
        position: fixed !important;
        top: 0; left: 0;
        width: 260px;
        height: 100vh;
        z-index: 9999;
        transform: translateX(-100%);
        transition: transform 0.28s cubic-bezier(0.4,0,0.2,1);
        box-shadow: 4px 0 24px rgba(0,0,0,0.22);
        padding-top: 0;
        overflow-y: auto;
    }
    .adm-nav.mob-open { transform: translateX(0) !important; }

    /* Contenido ocupa toda la pantalla */
    .adm-content { padding: 16px 12px; }
    .adm-body    { overflow-x: clip; }

    /* KPI grid en 1 columna */
    .adm-kpi-grid  { grid-template-columns: 1fr 1fr; gap: 10px; }
    .adm-charts-row { grid-template-columns: 1fr; }

    /* Tablas scrolleables */
    .adm-content table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

@media (max-width: 420px) {
    .adm-kpi-grid { grid-template-columns: 1fr; }
    .adm-topbar-brand { display: none; }   /* solo iconos en pantallas muy pequeñas */
}

.adm-panel{display:none;position:fixed;inset:0;background:#f5f5f5;z-index:2500;flex-direction:column;font-family:"Inter",sans-serif;}
.adm-panel.open{display:flex}
.adm-topbar{background:#1a1a1a;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 30px;height:58px;flex-shrink:0}
.adm-topbar-brand{font-family:var(--font-heading);font-size:1.5rem;letter-spacing:2px;color:var(--accent)}
.adm-topbar-right{display:flex;align-items:center;gap:20px;font-size:0.85rem;color:#aaa}
.adm-topbar-right button{background:none;border:1px solid #444;color:#ccc;padding:6px 14px;cursor:pointer;font-family:var(--font-body);font-size:0.8rem;transition:.2s}
.adm-topbar-right button:hover{border-color:var(--accent);color:var(--accent)}
.adm-body{display:flex;flex:1;overflow-y:auto;min-height:0;}
.adm-nav{width:220px;background:#fff;border-right:1px solid #eee;padding:25px 0;flex-shrink:0;overflow-y:auto}
.adm-nav-item{display:flex;align-items:center;gap:12px;padding:14px 24px;cursor:pointer;color:#777;font-size:0.9rem;transition:.2s;border-left:3px solid transparent}
.adm-nav-item:hover{color:var(--text-main);background:#fdfaf7}
.adm-nav-item.active{color:var(--text-main);border-left-color:var(--accent);background:#fdfaf7;font-weight:700}
.adm-nav-item i{width:18px;text-align:center}
.adm-content{flex:1;overflow-y:auto;padding:30px}
.adm-section{display:none}
.adm-section.active{display:block}
.adm-section-title{color:var(--text-muted);font-size:0.85rem;margin-bottom:22px;letter-spacing:1px;text-transform:uppercase}
.adm-kpi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px;margin-bottom:28px}
.adm-kpi{background:#fff;padding:22px 20px;border-top:3px solid var(--accent)}
.adm-kpi-val{font-family:"Space Grotesk",sans-serif;font-size:1.4rem;font-weight:600;line-height:1;font-variant-numeric:tabular-nums;}
.adm-kpi-lbl{font-size:0.78rem;color:var(--text-muted);margin-top:6px;letter-spacing:.5px;text-transform:uppercase}
.adm-charts-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:28px}
.adm-chart-card{background:#fff;padding:24px;border-top:3px solid var(--accent)}
.adm-chart-card h4{font-size:0.85rem;letter-spacing:1px;text-transform:uppercase;color:var(--text-muted);margin-bottom:16px}
.adm-table-card{background:#fff;padding:24px}
.adm-table-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:12px}
.adm-table-header h4{font-size:1.2rem;font-family:var(--font-heading)}
.adm-search{padding:9px 14px;border:1px solid #e0e0e0;font-family:var(--font-body);font-size:0.9rem;width:240px;outline:none}
.adm-search:focus{border-color:var(--accent)}
.adm-table{width:100%;border-collapse:collapse;font-size:0.88rem}
.adm-table th{background:#1a1a1a;color:#fff;padding:11px 14px;text-align:left;font-weight:600;letter-spacing:.5px;font-size:0.8rem}
.adm-table td{padding:11px 14px;border-bottom:1px solid #f5f5f5;vertical-align:middle}
.adm-table tr:hover td{background:#fdfaf7}
.adm-table img{width:52px;height:52px;object-fit:cover;border-radius:3px}
.adm-badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:0.75rem;font-weight:700}
.badge-ok{background:#e8f5e9;color:#2e7d32}
.badge-low{background:#fff3e0;color:#e65100}
.badge-out{background:#fce4ec;color:#c62828}
.adm-btn-edit,.adm-btn-del{border:none;padding:6px 13px;cursor:pointer;font-family:var(--font-body);font-size:0.78rem;font-weight:700;letter-spacing:.5px;transition:.2s}
.adm-btn-edit{background:#f0f0f0;color:#333}
.adm-btn-edit:hover{background:var(--accent);color:#fff}
/* Inline edit */
.adm-inline-input{width:100%;padding:5px 8px;border:1px solid var(--accent);font-family:var(--font-body);font-size:0.85rem;outline:none;background:#fffdf9}
.adm-inline-select{width:100%;padding:5px 8px;border:1px solid var(--accent);font-family:var(--font-body);font-size:0.85rem;outline:none;background:#fffdf9}
.adm-btn-save-inline{border:none;padding:6px 12px;cursor:pointer;font-family:var(--font-body);font-size:0.78rem;font-weight:700;background:#1a1a1a;color:#fff;transition:.2s}
.adm-btn-save-inline:hover{background:var(--accent)}
.adm-btn-undo-inline{border:1px solid #ddd;padding:6px 10px;cursor:pointer;font-family:var(--font-body);font-size:0.78rem;background:#fff;color:#999;transition:.2s;margin-left:4px}
.adm-btn-undo-inline:hover{border-color:#999;color:#333}
tr.editing td{background:#fffdf9}
/* Filtros de columna */
.adm-col-filter{width:100%;margin-top:5px;padding:4px 6px;border:1px solid #e0e0e0;font-family:var(--font-body);font-size:0.75rem;outline:none;background:#f9f9f9}
.adm-col-filter:focus{border-color:var(--accent);background:#fff}
.adm-col-filter-sel{width:100%;margin-top:5px;padding:4px 6px;border:1px solid #e0e0e0;font-family:var(--font-body);font-size:0.75rem;outline:none;background:#f9f9f9;cursor:pointer}
.adm-btn-del{background:#fce4ec;color:#c62828;margin-left:5px}
.adm-btn-del:hover{background:#c62828;color:#fff}
.adm-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.adm-form-card{background:#fff;padding:28px}
.adm-form-card h4{font-family:var(--font-heading);font-size:1.4rem;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid #f5f5f5}
.adm-label{display:block;font-size:0.78rem;letter-spacing:.5px;text-transform:uppercase;color:var(--text-muted);margin-bottom:5px;margin-top:14px}
.adm-field{width:100%;padding:10px 13px;border:1px solid #e0e0e0;font-family:var(--font-body);font-size:0.9rem;outline:none;transition:.2s}
.adm-field:focus{border-color:var(--accent)}
.adm-img-preview{width:100%;height:180px;object-fit:cover;display:none;margin-top:10px;border-radius:3px}
.adm-img-placeholder{width:100%;min-height:200px;background:#1A1A1A;display:flex;flex-direction:column;align-items:center;justify-content:center;margin-top:10px;border-radius:6px;gap:8px;}
.adm-img-hint{font-size:0.78rem;color:#bbb;margin-top:8px}
.adm-btn-save{background:var(--text-main);color:#fff;border:none;padding:13px 30px;font-family:var(--font-body);font-weight:700;letter-spacing:1px;cursor:pointer;transition:.3s;margin-top:20px}
.adm-btn-save:hover{background:var(--accent)}
.adm-btn-cancel{background:none;border:1px solid #ddd;padding:13px 20px;font-family:var(--font-body);cursor:pointer;margin-top:20px;margin-left:10px;transition:.2s}
.adm-btn-cancel:hover{border-color:#999}
.adm-inv-grid{display:grid;grid-template-columns:1fr;gap:8px;max-width:500px;}
.adm-inv-f{background:#fff;border:1px solid #ddd;padding:6px 14px;cursor:pointer;font-family:var(--font-body);font-size:0.85rem;border-radius:20px;transition:.2s;}
.adm-inv-f:hover,.adm-inv-f.active{background:var(--text-main);color:#fff;border-color:var(--text-main);}
.adm-inv-card{background:#fff;padding:20px;display:flex;flex-direction:column;gap:12px;border-top:3px solid #eee}
.adm-inv-card.ok{border-top-color:#4caf50}
.adm-inv-card.low{border-top-color:#ff9800}
.adm-inv-card.out{border-top-color:#f44336}
.adm-inv-img{width:100%;height:130px;object-fit:cover;border-radius:3px}
.adm-inv-name{font-family:var(--font-heading);font-size:1.1rem}
.adm-stock-ctrl{display:flex;align-items:center;gap:10px}
.adm-stock-ctrl button{width:34px;height:34px;border:1px solid #ddd;background:#fff;cursor:pointer;font-size:1.1rem;font-weight:700;transition:.2s}
.adm-stock-ctrl button:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.adm-stock-ctrl input{width:65px;text-align:center;padding:7px;border:1px solid #ddd;font-family:var(--font-body);font-size:0.95rem;outline:none}
.adm-stock-save{background:var(--text-main);color:#fff;border:none;padding:7px 16px;cursor:pointer;font-size:0.8rem;font-family:var(--font-body);font-weight:700;letter-spacing:.5px;transition:.2s}
.adm-stock-save:hover{background:var(--accent)}
.adm-toast{position:fixed;bottom:30px;right:30px;background:#1a1a1a;color:#fff;padding:13px 22px;font-family:var(--font-body);font-size:0.9rem;z-index:9999;transform:translateY(80px);opacity:0;transition:.3s;pointer-events:none}
.adm-toast.show{transform:translateY(0);opacity:1}
.adm-toast.gold{background:var(--accent)}
/* Separador de tabs imagen */
.adm-img-tabs{display:flex;gap:0;margin-top:14px;margin-bottom:4px}
.adm-img-tab{flex:1;padding:9px;border:1px solid #e0e0e0;background:#f9f9f9;cursor:pointer;font-family:var(--font-body);font-size:0.8rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;text-align:center;transition:.2s}
.adm-img-tab.active{background:var(--text-main);color:#fff;border-color:var(--text-main)}
.adm-img-panel{display:none;margin-top:10px}
.adm-img-panel.active{display:block}

/* ══ ADMIN FORMULARIO AGREGAR — RESPONSIVE MÓVIL ══ */
@media (max-width: 768px) {
    /* Formulario agregar: una sola columna */
    #sec-agregar > div[style*="grid-template-columns:1fr 1fr"] {
        grid-template-columns: 1fr !important;
        max-width: 100% !important;
    }
    /* Categoría y precio: una sola columna en móvil */
    #sec-agregar .adm-form-card > div[style*="grid-template-columns:1fr 1fr"] {
        grid-template-columns: 1fr !important;
    }
    /* Logo COA placeholder más compacto */
    .adm-img-placeholder { min-height: 140px !important; }
    /* Tabs imagen más pequeños */
    .adm-img-tab { padding: 7px 4px !important; font-size: 0.7rem !important; letter-spacing: 0 !important; }
    /* Reseñas públicas: 1 columna en móvil */
    #bc-public-reviews-grid { grid-template-columns: 1fr !important; }
    /* Sección reseñas públicas padding reducido */
    #bc-public-reviews { padding: 40px 4% 40px !important; }
    /* Reseña en modal producto: más compacta */
    #pm-reviews-section { margin-top: 16px !important; }
    #pm-review-name, #pm-review-text { font-size: 1rem !important; }
}

/* ── Botón flotante volver al admin ── */
#adm-fab{display:none;position:fixed;bottom:30px;left:30px;background:#1a1a1a;color:#fff;border:none;padding:12px 20px;cursor:pointer;font-family:var(--font-body);font-size:0.85rem;font-weight:700;letter-spacing:.5px;z-index:1500;align-items:center;gap:8px;box-shadow:0 4px 15px rgba(0,0,0,0.2);transition:.3s}
#adm-fab:hover{background:var(--accent)}