/* Identidad por tipo de acceso. Solo sustituye la navegación predeterminada. */
body.abk-shell[data-nav-identidad="portal"] {
    --nav-identidad-bg:#042f2e; --nav-fg:#f0fdfa; --nav-muted:#b5d7d2;
    --nav-active:rgba(45,212,191,.16); --nav-accent:#5eead4;
}
body.abk-shell[data-nav-identidad="autonomo"] {
    --nav-identidad-bg:#1c1207; --nav-fg:#fffbeb; --nav-muted:#d8c7ad;
    --nav-active:rgba(245,158,11,.18); --nav-accent:#fbbf24;
}
.abk-shell[data-nav-identidad="portal"] .app-sidebar,
.abk-shell[data-nav-identidad="autonomo"] .app-sidebar { background:var(--nav-identidad-bg) !important; }
.abk-shell[data-nav-identidad="portal"] .nav-brand-dot,
.abk-shell[data-nav-identidad="autonomo"] .nav-brand-dot { fill:var(--nav-accent); }
.marca-nav-logo, .marca-login-logo, .marca-recuperacion-logo {
    display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,1fr);
    flex:0 0 auto; min-width:0; min-height:0; max-width:100%;
    width:calc(var(--marca-ancho) * var(--marca-factor,1) * var(--marca-movil,1));
    height:auto; aspect-ratio:var(--marca-proporcion); overflow:hidden;
    background:#fff; box-sizing:border-box;
}
.marca-nav-logo {
    --marca-ancho:140px; --marca-proporcion:1.5;
    padding:6px; border-radius:9px; box-shadow:0 0 0 1px rgba(15,23,42,.12);
}
.marca-nav-logo img, .marca-login-logo img, .marca-recuperacion-logo img {
    display:block; width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain;
}
.abk-shell .sidebar-brand--logo { flex-direction:column; align-items:flex-start; gap:7px; }
.sidebar-brand--logo .nav-brand-label { max-width:100%; }
.marca-nav-logo[data-marca-vista="plegado"] {
    --marca-plegada:1; width:40px; height:40px; aspect-ratio:1; padding:2px; border-radius:8px;
}
@media(min-width:768px) {
    .abk-shell[data-nav-compacta="true"] .sidebar-brand .marca-nav-logo {
        --marca-plegada:1; width:40px; height:40px; aspect-ratio:1; padding:2px; border-radius:8px;
    }
}
@media(min-width:768px) and (max-width:1199px) {
    .abk-shell[data-nav-compacta="auto"] .sidebar-brand .marca-nav-logo {
        --marca-plegada:1; width:40px; height:40px; aspect-ratio:1; padding:2px; border-radius:8px;
    }
}

/* Marca de la asesoría en las dos puertas de acceso. */
.marca-login-logo {
    --marca-ancho:220px; --marca-proporcion:1.4;
    margin:0 auto 1.5rem;
    padding:14px; border-radius:18px; background:#fff;
    box-shadow:0 12px 40px rgba(0,0,0,.16);
}
.marca-logo-encuadre { display:flex; align-items:center; justify-content:center; position:relative; width:100%; height:100%; min-width:0; min-height:0; overflow:hidden; }
[data-marca-contenedor]:has(img[hidden]) { visibility:hidden; }
.marca-logo-encuadre.marca-logo-ajustada > img { position:absolute; max-width:none; max-height:none; margin:0; }
.brand-content { min-width:0; max-width:100%; }
.brand-content h1 { overflow-wrap:anywhere; }
.marca-tecnologia { margin:.6rem 0 1.4rem; font-size:.72rem; color:#cbd5e1; letter-spacing:.02em; }
.marca-auth-compacta { text-align:center; margin:0 0 1.4rem; }
/* Si la tarjeta del segundo factor supera la altura del móvil, crecer hacia
   abajo en vez de centrarla con parte del logo fuera del documento. */
body:has(.marca-auth-compacta) { height:auto; min-height:100vh; }
.marca-recuperacion-logo { --marca-ancho:190px; --marca-proporcion:1.8; padding:10px; margin:0 auto; border-radius:12px; }
.marca-auth-compacta strong { display:block; margin:.4rem 0; font-size:.95rem; color:#0f172a; overflow-wrap:anywhere; }
.marca-auth-compacta small { color:#64748b; font-size:.7rem; }

/* La entrada directa al subdominio de un autónomo conserva el ámbar de /signin. */
body[data-identidad-acceso="autonomo"] .brand-panel { background:linear-gradient(160deg,#1c1207 0%,#4a2308 58%,#1c1207 100%); }
body[data-identidad-acceso="autonomo"] .form-panel { background:linear-gradient(135deg,#fffaf2 0%,#fff3df 100%); }
body[data-identidad-acceso="autonomo"] .brand-panel::before,
body[data-identidad-acceso="autonomo"] .form-panel::before { background:radial-gradient(ellipse at center,rgba(245,158,11,.12),transparent 70%); }
body[data-identidad-acceso="autonomo"] .brand-panel::after { background:radial-gradient(circle,rgba(251,146,60,.08),transparent 70%); }
body[data-identidad-acceso="autonomo"] .feature-icon svg { stroke:#fbbf24; }
body[data-identidad-acceso="autonomo"] .btn-login { background:#92400e; }
body[data-identidad-acceso="autonomo"] .btn-login:hover { background:#78350f; }
body[data-identidad-acceso="autonomo"] .form-group input:focus { border-color:#b45309; box-shadow:0 0 0 3px rgba(245,158,11,.16); }

/* Preferencias: previa clara y acotada, también sobre un tema oscuro. */
.marca-config { background:var(--row-bg-odd,#fff); color:var(--text-primary,#0f172a); border:1px solid var(--border-subtle,#e2e8f0); border-radius:12px; padding:1.3rem; }
.marca-config h3 { margin:0 0 .5rem; font-size:1rem; }
.marca-config p { font-size:.83rem; line-height:1.55; color:var(--text-secondary,#475569); }
.marca-config label { display:block; font-weight:600; font-size:.84rem; margin-bottom:.5rem; }
.marca-config input[type="file"] { max-width:100%; font:inherit; font-size:.82rem; }
.marca-config input[type="file"]::file-selector-button { border:1px solid #cbd5e1; border-radius:7px; padding:8px 12px; margin-right:10px; background:#f8fafc; color:#334155; cursor:pointer; }
.marca-config-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:1.4rem; align-items:start; margin:1.4rem 0; }
.marca-tamanos { min-width:0; border:1px solid var(--border-subtle,#e2e8f0); border-radius:10px; padding:14px; }
.marca-tamanos legend { font-size:.84rem; font-weight:650; padding:0 5px; }
.marca-rango { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:5px 10px; margin:0 0 12px; }
.marca-rango label { margin:0; }
.marca-rango output { font-size:.78rem; color:var(--text-secondary,#475569); font-variant-numeric:tabular-nums; }
.marca-rango input[type="range"] { grid-column:1/-1; width:100%; min-height:28px; padding:0; accent-color:var(--primary,#0f766e); cursor:pointer; }
.marca-rango input:focus-visible, .marca-restablecer:focus-visible { outline:2px solid var(--primary,#0f766e); outline-offset:3px; }
.marca-restablecer { border:0; padding:4px 0; background:none; color:var(--primary,#0f766e); font:inherit; font-size:.78rem; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.marca-previas { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.marca-preview { min-width:0; margin:0; overflow:hidden; border:1px solid var(--border-subtle,#e2e8f0); border-radius:10px; background:#fff; color:#475569; }
.marca-preview-escena { display:flex; align-items:center; justify-content:center; min-height:220px; padding:20px; }
.marca-preview-escena--acceso { background:linear-gradient(140deg,#042f2e,#0f766e); }
.marca-preview-escena--lateral { background:#042f2e; }
.marca-preview-escena .marca-login-logo { margin:0; }
.marca-preview-lateral { width:149px; max-width:100%; }
.marca-preview-plegado { width:40px; flex:0 0 40px; }
.marca-preview figcaption { border-top:1px solid #e2e8f0; padding:10px; font-size:.74rem; text-align:center; }
.marca-config .marca-calidad { color:var(--text-secondary,#92400e); }
.marca-ayuda { margin:.7rem 0 0; }
.marca-acciones { display:flex; flex-wrap:wrap; gap:10px; margin-top:1.2rem; }
.marca-acciones .btn { min-height:38px; }
.marca-config .marca-error { background:#fef2f2; color:#991b1b; border:1px solid #fecaca; border-radius:8px; padding:.7rem .9rem; }
.marca-config .marca-ok { background:#f0fdf4; color:#166534; border:1px solid #bbf7d0; border-radius:8px; padding:.7rem .9rem; }
@media(max-width:860px) {
    .marca-login-logo { --marca-movil:.8; padding:12px; margin-bottom:1rem; }
    .marca-tecnologia { margin:.5rem 0 .8rem; }
}
@media(max-width:767px) {
    .marca-config-grid { grid-template-columns:minmax(0,1fr); }
    .marca-previas { grid-template-columns:minmax(0,1fr); }
    .marca-preview-escena { min-height:170px; padding:16px; }
}
