/* =========================================================
   TOKENS
========================================================= */
:root{
    /* Paleta base */
    --dg-navy:#0E2842;
    --dg-primary:#1F65E5;
    --dg-primary-600:#1750B6;
    --dg-success:#3BB273;
    --dg-muted:#6E7A8A;
    --dg-border:#E5EAF1;
    --dg-bg-1:#F6F8FC;
    --dg-bg-2:#EAF1FF;
    --dg-card:#FFFFFF;
    --dg-radius:18px;

    /* Login */
    --aba-navy: #16324F;
    --aba-primary: #214B85;
    --aba-primary-600:#1C3F70;
    --aba-accent: #2E8BE6;
    --aba-bg-1:#F6F9FC;
    --aba-bg-2:#EEF3F8;
    --aba-card:#FFFFFF;
    --aba-muted:#6B778C;
    --aba-success:#3BB273;
    --radius-xl: 20px;

    /* Overlay del patrón del card del wizard */
    --dg-card-overlay-opacity: 0; /* 0 = sin patrón. Sube a .04 si lo quieres muy sutil */
}

/* =========================================================
   LOGIN (mantengo por si convive con esta vista)
========================================================= */
.login-page{
    background:
            radial-gradient(1200px 800px at 85% -10%, #EAF2FF 0%, rgba(234,242,255,0) 60%),
            radial-gradient(900px 700px at -10% 110%, #F0F7FF 0%, rgba(240,247,255,0) 60%),
            linear-gradient(180deg, var(--aba-bg-1), var(--aba-bg-2));
    min-height: 100vh;
}
.brand-bar{ height:44px; background:var(--aba-navy); }
.login-header .product-badge{ font-size:.85rem; color:var(--aba-muted); }

.login-card{ border-radius:var(--radius-xl); overflow:hidden; background:var(--aba-card); }
.login-card .card-body{ position:relative; }

.brand-avatar{
    width:56px; height:56px; border-radius:16px; display:grid; place-items:center;
    background:linear-gradient(135deg,#FFB649,#FF6B6B 60%,#2E8BE6 120%);
    box-shadow:0 8px 24px rgba(33,75,133,.18);
}
.brand-avatar .avatar-dot{ width:12px; height:12px; border-radius:50%; background:#fff; }

.input-group-lg>.form-control,.input-group-lg>.input-group-text{ border-radius:14px !important; }
.input-group-text{ background:#F2F5F9; color:var(--aba-muted); border:1px solid #E7ECF3; }
.form-control{ border:1px solid #E7ECF3; }
.form-control:focus{ border-color:var(--aba-accent); box-shadow:0 0 0 .25rem rgba(46,139,230,.15); }
.btn-toggle-pass{ cursor:pointer; border:1px solid #E7ECF3; background:#F2F5F9; }

.btn-primary{ background:var(--aba-primary); border-color:var(--aba-primary); border-radius:14px; }
.btn-primary:hover{ background:var(--aba-primary-600); border-color:var(--aba-primary-600); }
.link-secondary{ color:var(--aba-muted); }
.link-secondary:hover{ color:var(--aba-primary); }
.alert{ border-radius:12px; }
.title_login{ display:none; }
.logo-desktop,.logo-mobile{ display:inline-block; }
@media (max-width:575.98px){ .login-card .card-body{ padding:28px !important; } }

/* Login v2 (dg-login) */
.dg-login{
    min-height:100vh;
    background:
            radial-gradient(1200px 700px at 100% -10%, var(--dg-bg-2) 0%, rgba(234,241,255,0) 60%),
            radial-gradient(800px 600px at -10% 110%, #F2F6FF 0%, rgba(242,246,255,0) 60%),
            linear-gradient(180deg, var(--dg-bg-1), #FFFFFF 40%, var(--dg-bg-1) 100%);
    font-family:"Poppins",system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
    color:#1F2A37;
}
.dg-topbar{ height:56px; background:#384573; backdrop-filter:saturate(130%) blur(6px); display:flex; align-items:center; justify-content:center; }
.dg-topbar .dg-brand-logo{ height:28px; filter:brightness(1.2) contrast(1.05); }
.dg-main{ padding:48px 0 36px; }
.dg-card{ border-radius:var(--dg-radius); background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,.92)); border:1px solid rgba(229,234,241,.8); backdrop-filter:blur(8px); padding:28px 28px 26px; box-shadow:0 24px 60px rgba(15,35,58,.12); }
.dg-app-avatar{
    width:60px;
    height:60px;
    border-radius:16px;
    margin:0 auto 14px;
    display:grid;
    place-items:center;
    background:#2c7bab;
    box-shadow:0 10px 26px rgba(44, 123, 171, .22);
}

.dg-app-avatar svg{ width:28px; height:28px; stroke:#fff; }
.dg-title{ font-size:1.35rem; font-weight:700; margin:2px 0 2px; text-align:center; }
.dg-subtitle{ font-size:.82rem; color:var(--dg-muted); text-align:center; margin-bottom:24px; }
.dg-form .form-label{ font-weight:500; font-size:.9rem; color:#2C3A4B; }
.dg-input{ position:relative; display:flex; align-items:center; border:1px solid var(--dg-border); border-radius:14px; background:#FBFCFE; transition: box-shadow .15s ease, border-color .15s ease; }
.dg-input:focus-within{ border-color:#BFD6FF; box-shadow:0 0 0 .25rem rgba(31,101,229,.10); }
.dg-input input{ border:0; outline:0; background:transparent; width:100%; padding:12px 44px 12px 42px; font-size:.98rem; }
.dg-input-ico{ position:absolute; left:12px; color:#8A96A8; display:grid; place-items:center; }
.dg-pass-toggle{ position:absolute; right:8px; border:1px solid var(--dg-border); background:#F1F4F9; color:#5E6B7C; border-radius:10px; padding:6px; cursor:pointer; }
.dg-pass-toggle:hover{ background:#E9EEF7; }
.dg-btn{ display:inline-flex; align-items:center; justify-content:center; border-radius:14px; font-weight:600; height:46px; border:0; cursor:pointer; transition: transform .04s ease, box-shadow .2s ease, background .2s ease; }
.dg-btn-primary{ background:var(--dg-primary); color:#fff; box-shadow:0 10px 18px rgba(31,101,229,.20); }
.dg-btn-primary:hover{ background:var(--dg-primary-600); box-shadow:0 12px 22px rgba(23,80,182,.24); }
.dg-btn-primary:active{ transform:translateY(1px); }
.dg-link{ color:var(--dg-primary); text-decoration:none; }
.dg-link:hover{ color:var(--dg-primary-600); text-decoration:underline; }
.dg-muted{ color:var(--dg-muted); }
.dg-footer{ margin:18px 0 0; }
@media (max-width:575.98px){ .dg-card{ padding:22px; } .dg-topbar{ height:52px; } }


/* Contenedor del logo fuera del card */
.dg-login .dg-logo-standalone{
    margin-top: 16px;     /* separa del borde superior del main */
    margin-bottom: 12px;  /* respiro con el card */
}

/* Tamaño del logo independiente (un poco más grande que en la topbar) */
.dg-login .dg-brand-logo.dg-brand-logo-lg{
    filter: brightness(1.08) contrast(1.05);
}

/* Ajuste de espaciado del main al quitar la topbar */
.dg-login .dg-main{
    padding-top: 120px; /* antes tenías 48px; al quitar topbar puede quedar muy alto en XS */
}

/* Responsive fino */
@media (max-width: 575.98px){
    .dg-login .dg-brand-logo.dg-brand-logo-lg{ height: 34px; }
    .dg-login .dg-main{ padding-top: 28px; }
}


/* ===== Modal base ===== */
.dg-modal{ position:fixed; inset:0; display:none; z-index:1050; }
.dg-modal[aria-hidden="false"]{ display:block; }
.dg-modal-backdrop{
    position:absolute; inset:0; background:rgba(15,23,42,.55);
    backdrop-filter:saturate(120%) blur(2px);
}
.dg-modal-dialog{
    position:relative; background:#fff; border:1px solid #e5e7eb; border-radius:16px;
    margin:6vh auto 0; width:min(720px, 92vw); box-shadow:0 22px 60px rgba(2,6,23,.25);
    display:flex; flex-direction:column; max-height:88vh; outline:0;
}
.dg-modal-header{
    padding:16px 18px; border-bottom:1px solid #f1f5f9; display:flex; align-items:center; gap:10px;
}
.dg-modal-title{ margin:0; font-size:18px; font-weight:700; color:#0f172a; }
.dg-modal-close{
    margin-left:auto; border:0; background:transparent; font-size:26px; line-height:1; color:#64748b;
    width:36px; height:36px; border-radius:8px; cursor:pointer;
}
.dg-modal-close:hover{ background:#f8fafc; color:#0f172a; }
.dg-modal-body{ padding:16px 18px; overflow:auto; }
.dg-modal-footer{
    padding:14px 16px; border-top:1px solid #f1f5f9; display:flex; align-items:center; gap:10px;
}

/* Botones (usa tu paleta) */
.dg-btn{ height:42px; padding:0 16px; border-radius:12px; border:1px solid #e5e7eb; background:#fff; font-weight:700; }
.dg-btn:hover{ background:#f8fafc; }
.dg-btn-primary{ background:#4f46e5; color:#fff; border-color:#4f46e5; box-shadow:0 10px 18px rgba(79,70,229,.18); }
.dg-btn-primary:hover{ filter:brightness(.98); }
.dg-btn-ghost{ background:#f8fafc; color:#0f172a; border-color:#e5e7eb; }
.dg-flex-spacer{ flex:1; }

/* Cookie rows */
.dg-cookie-row{
    display:flex; align-items:center; justify-content:space-between;
    padding:12px; border:1px solid #eef2f7; border-radius:12px; background:#fff; margin-bottom:10px;
}
.dg-cookie-info strong{ display:block; color:#0f172a; }
.dg-cookie-desc{ font-size:12px; color:#64748b; }

/* Switch */
.dg-switch{ position:relative; display:inline-block; width:48px; height:26px; }
.dg-switch input{ opacity:0; width:0; height:0; }
.dg-slider{
    position:absolute; cursor:pointer; inset:0; background:#e5e7eb; border-radius:999px; transition:.2s;
}
.dg-slider::before{
    content:""; position:absolute; height:20px; width:20px; left:3px; top:3px; background:white;
    border-radius:50%; transition:.2s; box-shadow:0 1px 2px rgba(0,0,0,.15);
}
.dg-switch input:checked + .dg-slider{ background:#4f46e5; }
.dg-switch input:checked + .dg-slider::before{ transform:translateX(22px); }

/* Responsive */
@media (max-width: 575.98px){
    .dg-modal-dialog{ margin-top:3vh; width:94vw; }
    .dg-modal-footer{ flex-wrap:wrap; }
}

/* Fuerza que mis modales personalizados arranquen ocultos, sí o sí */
.dg-modal{
    position: fixed;
    inset: 0;
    z-index: 9999;                 /* por encima de BS viejo */
    display: none !important;      /* clave */
    visibility: hidden !important; /* clave */
    opacity: 0 !important;         /* por si algo anima opacidad */
}

.dg-modal[aria-hidden="false"]{
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* (opcional) suaviza aparición */
.dg-modal[aria-hidden="false"] .dg-modal-dialog{
    animation: dgModalIn .15s ease;
}
@keyframes dgModalIn { from{transform:translateY(8px); opacity:.98} to{transform:none; opacity:1} }

/* ===== Modales ABASmart (independientes de Bootstrap) ===== */
.dg-modal{
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;                 /* oculto por defecto */
    visibility: hidden;
    opacity: 0;
}
.dg-modal[aria-hidden="false"]{
    display: block;
    visibility: visible;
    opacity: 1;
}

/* Backdrop y caja */
.dg-modal-backdrop{ position:absolute; inset:0; background: rgba(15,23,42,.45); }
.dg-modal-dialog{
    position:relative; width:min(680px,92vw); margin: 8vh auto 0;
    background:#fff; border:1px solid #e5e7eb; border-radius:16px;
    box-shadow:0 18px 40px rgba(2,6,23,.18); outline: none;
}

/* Header / body / footer */
.dg-modal-header{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 16px; border-bottom:1px solid #f1f5f9; }
.dg-modal-title{ margin:0; font-size:18px; font-weight:700; color:#0f172a; }
.dg-modal-close{ appearance:none; border:0; background:transparent; font-size:22px; line-height:1; padding:4px 8px; cursor:pointer; }
.dg-modal-body{ padding:16px; max-height:60vh; overflow:auto; }
.dg-modal-footer{ display:flex; gap:10px; justify-content:flex-end; padding:12px 16px; border-top:1px solid #f1f5f9; }

/* Botones */
.dg-btn{ display:inline-flex; align-items:center; justify-content:center; height:40px; padding:0 14px; font-weight:700; border-radius:12px; border:0; cursor:pointer; }
.dg-btn-primary{ background:#4f46e5; color:#fff; }
.dg-btn-primary:hover{ filter:brightness(.96); }

/* Animación */
.dg-modal[aria-hidden="false"] .dg-modal-dialog{ animation: dgModalIn .16s ease-out; }
@keyframes dgModalIn{ from{ transform:translateY(8px); opacity:.98; } to{ transform:none; opacity:1; } }

/* A prueba de Bootstrap viejo */
.dg-modal, .dg-modal * { box-sizing: border-box; }

/* ===== Modales ABASmart (independientes de Bootstrap) ===== */
.dg-modal{
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;                 /* oculto por defecto */
    visibility: hidden;
    opacity: 0;
}
.dg-modal[aria-hidden="false"]{
    display: block;
    visibility: visible;
    opacity: 1;
}

/* Backdrop y caja */
.dg-modal-backdrop{ position:absolute; inset:0; background: rgba(15,23,42,.45); }
.dg-modal-dialog{
    position:relative; width:min(680px,92vw); margin: 8vh auto 0;
    background:#fff; border:1px solid #e5e7eb; border-radius:16px;
    box-shadow:0 18px 40px rgba(2,6,23,.18); outline: none;
}

/* Estructura interna */
.dg-modal-header{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 16px; border-bottom:1px solid #f1f5f9; }
.dg-modal-title{ margin:0; font-size:18px; font-weight:700; color:#0f172a; }
.dg-modal-close{ appearance:none; border:0; background:transparent; font-size:22px; line-height:1; padding:4px 8px; cursor:pointer; }
.dg-modal-body{ padding:16px; max-height:60vh; overflow:auto; }
.dg-modal-footer{ display:flex; gap:10px; justify-content:flex-end; padding:12px 16px; border-top:1px solid #f1f5f9; }

/* Botones */
.dg-btn{ display:inline-flex; align-items:center; justify-content:center; height:40px; padding:0 14px; font-weight:700; border-radius:12px; border:0; cursor:pointer; }
.dg-btn-primary{ background:#384573; color:#fff; }
.dg-btn-primary:hover{ filter:brightness(.96); }

/* Animación */
.dg-modal[aria-hidden="false"] .dg-modal-dialog{ animation: dgModalIn .16s ease-out; }
@keyframes dgModalIn{ from{ transform:translateY(8px); opacity:.98; } to{ transform:none; opacity:1; } }

/* A prueba de Bootstrap viejo */
.dg-modal, .dg-modal * { box-sizing: border-box; }

/* ============================
   DG Modals — Pro corporate UI
   ============================ */

/* Paleta (usa las tuyas si existen) */
:root{
    --dg-modal-bg: #ffffff;
    --dg-modal-text: #0f172a;
    --dg-modal-muted: #64748b;
    --dg-modal-line: #e5e7eb;
    --dg-modal-brand: #235F98;
    --dg-modal-brand-2: #142741;
    --dg-modal-danger: #ef4444;
    --dg-modal-shadow: 0 22px 60px rgba(2, 6, 23, .18);
}

/* Contenedor base: ocupa toda la pantalla */
.dg-modal{
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: none;            /* se gestiona por JS con aria-hidden */
    visibility: hidden;
    opacity: 0;
}

/* Estado visible (JS ya lo coloca) */
.dg-modal[aria-hidden="false"]{
    display: block;
    visibility: visible;
    opacity: 1;
}

/* Backdrop con blur sutil + viñeta */
.dg-modal-backdrop{
    position: absolute;
    inset: 0;
    background:
            radial-gradient(1200px 800px at 80% -10%, rgba(79,70,229,.20) 0%, rgba(79,70,229,0) 60%),
            rgba(2, 6, 23, .44);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}

/* Diálogo centrado */
.dg-modal-dialog{
    position: relative;
    z-index: 1;
    margin: 6vh auto 0;
    width: min(92vw, 760px);
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    outline: none;
    background: var(--dg-modal-bg);
    border: 1px solid var(--dg-modal-line);
    border-radius: 16px;
    box-shadow: var(--dg-modal-shadow);
    transform: translateY(14px) scale(.98);
    opacity: 0;
    transition: transform .22s ease, opacity .22s ease, box-shadow .22s ease;
}

/* Al abrir, suave */
.dg-modal[aria-hidden="false"] .dg-modal-dialog{
    transform: translateY(0) scale(1);
    opacity: 1;
}

/* Header elegante */
.dg-modal-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--dg-modal-line);
    background: linear-gradient(180deg, #fff, #fafafa);
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
}

.dg-modal-title{
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: var(--dg-modal-text);
    letter-spacing: .2px;
}

/* Botón cerrar (X) */
.dg-modal-close{
    appearance: none;
    border: 1px solid var(--dg-modal-line);
    background: #fff;
    color: #334155;
    width: 36px; height: 36px;
    border-radius: 10px;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 22px; line-height: 1;
    cursor: pointer;
    transition: background .15s ease, transform .06s ease, box-shadow .15s ease;
}
.dg-modal-close:hover{ background: #f8fafc; }
.dg-modal-close:active{ transform: translateY(1px); }
.dg-modal-close:focus-visible{
    outline: 2px solid #c7d2fe; outline-offset: 2px;
}

/* Cuerpo con scroll suave */
.dg-modal-body{
    padding: 18px 20px;
    color: var(--dg-modal-text);
    overflow: auto;
    max-height: calc(88vh - 58px - 70px); /* vh - header - footer aprox */
}
.dg-modal-body p{
    margin: 0 0 12px;
    color: var(--dg-modal-muted);
    line-height: 1.55;
}
.dg-modal-body h3, .dg-modal-body h4{
    color: var(--dg-modal-text);
    margin: 16px 0 10px;
    font-weight: 700;
}

/* Tipografía de la política de privacidad */
#modal-privacy .dg-modal-body{
    padding: 22px 22px 8px;
}
#modal-privacy .dg-modal-body > *:first-child{ margin-top: 0; }
#modal-privacy .dg-modal-body ul{
    padding-left: 18px;
    margin: 8px 0 14px;
}
#modal-privacy .dg-modal-body li{
    color: var(--dg-modal-muted);
    margin: 6px 0;
}

/* Footer */
.dg-modal-footer{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 14px 16px;
    border-top: 1px solid var(--dg-modal-line);
    background: #fff;
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
}

/* Botones base (si ya tienes .dg-btn / .dg-btn-primary, esto solo afina dentro del modal) */
.dg-modal-footer .dg-btn{
    height: 42px;
    border-radius: 12px;
    font-weight: 700;
    padding: 0 16px;
    border: 1px solid var(--dg-modal-line);
    background: #f8fafc;
    color: #0f172a;
    transition: background .15s ease, box-shadow .15s ease, transform .06s ease;
}
.dg-modal-footer .dg-btn:hover{ background: #eef2f7; }
.dg-modal-footer .dg-btn:active{ transform: translateY(1px); }

.dg-modal-footer .dg-btn-primary{
    border: none;
    background: linear-gradient(90deg, var(--dg-modal-brand), var(--dg-modal-brand-2));
    color: #fff;
    box-shadow: 0 10px 22px rgba(79,70,229,.22);
}
.dg-modal-footer .dg-btn-primary:hover{
    filter: brightness(.98);
}

/* ===== Cookies modal: layout y switches ===== */

#modal-cookies .dg-modal-dialog{
    width: min(92vw, 620px);
}

.dg-cookie-row{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px dashed #eef2f7;
}
.dg-cookie-row:last-child{ border-bottom: 0; }

.dg-cookie-info strong{
    display: block;
    color: var(--dg-modal-text);
    font-weight: 700;
    line-height: 1.2;
}
.dg-cookie-desc{
    font-size: 13px;
    color: var(--dg-modal-muted);
    margin-top: 2px;
}

/* Switch accesible */
.dg-switch{
    position: relative;
    display: inline-block;
    width: 48px; height: 28px;
}
.dg-switch input{ display: none; }

.dg-slider{
    position: absolute;
    inset: 0;
    cursor: pointer;
    background: #e2e8f0;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    transition: background .18s ease, border-color .18s ease;
}
.dg-slider::before{
    content: "";
    position: absolute;
    left: 3px; top: 50%;
    width: 20px; height: 20px;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 6px rgba(15, 23, 42, .18);
    transition: left .18s ease, box-shadow .18s ease;
}

.dg-switch input:checked + .dg-slider{
    background: linear-gradient(90deg, var(--dg-modal-brand), var(--dg-modal-brand-2));
    border-color: #c7d2fe;
}
.dg-switch input:checked + .dg-slider::before{
    left: 25px;
}

.dg-switch input:focus-visible + .dg-slider{
    outline: 2px solid #c7d2fe;
    outline-offset: 2px;
}

/* Botonera cookies */
#modal-cookies .dg-modal-footer{
    justify-content: space-between;
    flex-wrap: wrap;
}
#modal-cookies .dg-modal-footer .dg-btn{
    min-width: 110px;
}
#modal-cookies .dg-modal-footer .dg-btn:nth-child(1){ /* Reject */
    color: var(--dg-modal-danger);
    border-color: #fecaca;
    background: #fff1f2;
}
#modal-cookies .dg-modal-footer .dg-btn:nth-child(2){ /* Save */
    background: #f8fafc;
}
#modal-cookies .dg-modal-footer .dg-btn:nth-child(3){ /* Accept all */
    background: linear-gradient(90deg, var(--dg-modal-brand), var(--dg-modal-brand-2));
    color: #fff;
    border: none;
    box-shadow: 0 10px 22px rgba(79,70,229,.22);
}

/* ===== Scrollbar sutil (WebKit) ===== */
.dg-modal-body::-webkit-scrollbar{ width: 10px; }
.dg-modal-body::-webkit-scrollbar-track{ background: #f8fafc; border-radius: 999px; }
.dg-modal-body::-webkit-scrollbar-thumb{
    background: #e5e7eb; border-radius: 999px; border: 2px solid #f8fafc;
}
.dg-modal-body::-webkit-scrollbar-thumb:hover{ background: #d1d5db; }

/* ===== Responsivo ===== */
@media (max-width: 575.98px){
    .dg-modal-dialog{
        margin-top: 5vh;
        width: 92vw;
        border-radius: 14px;
    }
    .dg-modal-header, .dg-modal-body, .dg-modal-footer{
        padding-left: 16px; padding-right: 16px;
    }
    #modal-cookies .dg-modal-footer{
        gap: 8px;
    }
}

/* ===== Asegura que inician ocultos incluso si otro CSS interfiere ===== */
.dg-modal{ display:none; visibility:hidden; opacity:0; }
.dg-modal[aria-hidden="false"]{ display:block; visibility:visible; opacity:1; }

/* ===== Cookies modal — layout fix & polish ===== */
#modal-cookies .dg-modal-body{
    padding: 20px 20px 10px;
}

/* Cada fila como tarjeta limpia */
#modal-cookies .dg-cookie-row{
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border: 1px solid #eef2f7;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(16,24,40,.04);
}
#modal-cookies .dg-cookie-row + .dg-cookie-row{ margin-top: 12px; }

/* Texto a la izquierda, switch a la derecha */
#modal-cookies .dg-cookie-info{
    flex: 1 1 auto;
    min-width: 0;
}
#modal-cookies .dg-cookie-info strong{
    display: block;
    color: var(--dg-modal-text);
    font-weight: 700;
    line-height: 1.2;
}
#modal-cookies .dg-cookie-desc{
    color: var(--dg-modal-muted);
    font-size: 13px;
    margin-top: 2px;
}
#modal-cookies .dg-cookie-switch{
    flex: 0 0 auto;
    margin-left: 8px;
}

/* ===== Switch — reset robusto y dimensiones coherentes ===== */
/* Oculta el checkbox nativo de forma accesible (evita el “puntito” suelto) */
#modal-cookies .dg-switch input{
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0);
    white-space: nowrap; border: 0;
}

/* Track */
#modal-cookies .dg-switch{
    position: relative;
    display: inline-block;
    width: 52px; height: 30px;
}
#modal-cookies .dg-slider{
    position: absolute; inset: 0;
    border-radius: 999px;
    background: #e2e8f0;
    border: 1px solid #e2e8f0;
    transition: background .18s ease, border-color .18s ease;
}

/* Thumb */
#modal-cookies .dg-slider::before{
    content: "";
    position: absolute;
    top: 50%; left: 4px;
    width: 22px; height: 22px;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 6px rgba(15,23,42,.18);
    transition: left .18s ease;
}

/* Checked */
#modal-cookies .dg-switch input:checked + .dg-slider{
    background: linear-gradient(90deg, var(--dg-modal-brand), var(--dg-modal-brand-2));
    border-color: #c7d2fe;
}
#modal-cookies .dg-switch input:checked + .dg-slider::before{
    left: 26px;  /* 52 - 22 - 4 */
}

/* Focus */
#modal-cookies .dg-switch input:focus-visible + .dg-slider{
    outline: 2px solid #c7d2fe;
    outline-offset: 2px;
}

/* Disabled (Essential) */
#modal-cookies #ck-essential[disabled] + .dg-slider{
    background: #e0e7ff;
    border-color: #e0e7ff;
    cursor: not-allowed;
    opacity: .9;
}
#modal-cookies #ck-essential[disabled] + .dg-slider::before{
    box-shadow: 0 2px 4px rgba(30,41,59,.12);
}

/* Footer botones: misma línea + buen contraste */
#modal-cookies .dg-modal-footer{
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}
#modal-cookies .dg-modal-footer .dg-btn{
    min-width: 120px;
}
#modal-cookies .dg-modal-footer .dg-btn:first-child{ /* Reject all */
    color: var(--dg-modal-danger);
    background: #fff1f2;
    border-color: #fecaca;
}
#modal-cookies .dg-modal-footer .dg-btn:nth-child(2){ /* Save */
    background: #f8fafc;
}
#modal-cookies .dg-modal-footer .dg-btn:nth-child(3){ /* Accept all */
    background: linear-gradient(90deg, var(--dg-modal-brand), var(--dg-modal-brand-2));
    color: #fff; border: none;
    box-shadow: 0 10px 22px rgba(79,70,229,.22);
}

/* Responsive fino */
@media (max-width: 575.98px){
    #modal-cookies .dg-cookie-row{ padding: 12px 14px; }
    #modal-cookies .dg-modal-footer{ justify-content: center; }
}

     /* ===== Botón Login con el azul del wizard ===== */
 body.dg-login .dg-card .dg-form button.dg-btn.dg-btn-primary{
     background:#e5ae58 !important;          /* --dg-primary */
     color:#fff !important;
     border:none !important;
     border-radius:12px !important;
     box-shadow:0 10px 22px rgba(31,101,229,.22) !important;
     transition:filter .15s ease, transform .06s ease, box-shadow .2s ease !important;
     background-image:none !important;        /* por si alguna hoja pone un gradiente */
 }

body.dg-login .dg-card .dg-form button.dg-btn.dg-btn-primary:hover{
    background:#e5ae58 !important;          /* --dg-primary-600 */
    box-shadow:0 12px 26px rgba(31,101,229,.28) !important;
}

body.dg-login .dg-card .dg-form button.dg-btn.dg-btn-primary:active{
    transform:translateY(1px) !important;
    box-shadow:0 8px 18px rgba(31,101,229,.22) !important;
}

body.dg-login .dg-card .dg-form button.dg-btn.dg-btn-primary:focus-visible{
    outline:2px solid #C7D2FE !important;   /* focus sutil */
    outline-offset:2px !important;
}

.dg-label-row{
    margin-bottom:6px;
}
.dg-label-row .form-label{
    margin:0;
}
.dg-field-error{
    color:#e11d48;           /* rojo elegante */
    font-size:12px;
    font-weight:600;
    white-space:nowrap;
    float: right;
}
.dg-input input[aria-invalid="true"]{
    border-color:#e11d48;
    box-shadow:0 0 0 2px rgba(225,17,72,.08);
    border-radius: 10px;
}

/* contenedor para centrar como antes */
.dg-app-icon{
    margin: 0 auto 14px;
    width: 44px;   /* ajusta tamaño aquí si quieres */
    height: 44px;
}

/* icono de usuario: solo trazo azul, sin fondo */
.dg-user-ico{
    width: 100%;
    height: 100%;
    stroke: #142741;   /* azul corporativo */
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Header: logo centrado y a la altura completa del topbar */
body.dg-login .dg-topbar{
    height:56px;                               /* alto del header */
    display:flex; align-items:center; justify-content:center;
}

body.dg-login .dg-topbar > .container{
    display:flex; align-items:center; justify-content:center;
    height:100%;
}

body.dg-login .dg-topbar a{
    display:flex; align-items:center;
    height:100%;                               /* el anchor ocupa todo el alto */
}

body.dg-login .dg-topbar .dg-brand-logo{
    height:100%;                               /* el logo igual al alto del header */
    width:auto;                                 /* mantiene proporción */
    display:block;
}

header{
    padding: 2px 0;
}

/* Paleta tomada del corazón */
:root{
    --p-yellow:#D9C64A;
    --p-green: #68BB57;
    --p-blue:  #5B73E1;
    --p-red:   #C94C46;
    --p-ink:   #142233; /* núcleo neutro oscuro, no azul chillón */
}

/* Avatar circular con anillo multicolor */
.dg-login-badge{
    width:72px; height:72px;
    margin:0 auto 12px; position:relative;
    border-radius:999px;
    box-shadow:0 10px 24px rgba(20,34,51,.20);
}

/* Anillo con los 4 colores (conic-gradient) */
.dg-login-badge::before{
    content:""; position:absolute; inset:0; border-radius:inherit;
    background:conic-gradient(#e6bf38 0 25%, #6bbc59 25% 50%, #e24a4a 50% 75%, #2c78bf 75% 100%);

    z-index:0;                        /* aro multicolor */
}

/* Núcleo limpio (no azul), ligero “glass” */
/* Núcleo del badge en azul ABASmart */
:root{ --p-core:#384573; }

.dg-login-badge::after{
    content:"";
    position:absolute; inset:8px; border-radius:inherit;
    /* un pelín más claro arriba para dar volumen */
    background: radial-gradient(120% 120% at 30% 20%, #3d86c7, var(--p-core));
    box-shadow: inset 0 -2px 8px rgba(0,0,0,.12);
}



/* Icono de usuario blanco */
.dg-login-badge-ico{
    position:relative; z-index:1;
    display:block; margin:0 auto; top:50%; transform:translateY(-50%);
    width:34px; height:34px;
    stroke:#fff; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; fill:none;
    filter: drop-shadow(0 1px 0 rgba(0,0,0,.25));
}

/* --- Animaciones para el badge de login --- */
.dg-login-badge{
    isolation:isolate;                    /* su propio stacking context */
    --spin-duration: 16s;                 /* velocidad del giro (ajústala) */
    --breathe-duration: 6s;               /* velocidad del pulso */
}

/* El aro multicolor gira lentamente */
.dg-login-badge::before{
    transform-origin: 50% 50%;
    animation: dgSpin var(--spin-duration) linear infinite;
}

/* El núcleo azul hace un “breathe” sutil (luz y escala) */
.dg-login-badge::after{
    animation: dgBreathe var(--breathe-duration) ease-in-out infinite;
}

/* En hover, un poquito más vivo */
.dg-login-badge:hover::before{ animation-duration: 9s; }
.dg-login-badge:hover::after { animation-duration: 4.5s; }

/* Respeta usuarios con reduce motion */
@media (prefers-reduced-motion: reduce){
    .dg-login-badge::before,
    .dg-login-badge::after{ animation: none !important; }
}

/* Keyframes */
@keyframes dgSpin{
    to{ transform: rotate(360deg); }
}
@keyframes dgBreathe{
    0%{
        box-shadow: inset 0 -2px 8px rgba(0,0,0,.12), 0 0 0 0 rgba(44,120,191,.0);
        transform: scale(1);
    }
    50%{
        box-shadow: inset 0 -2px 10px rgba(0,0,0,.12), 0 0 24px 0 rgba(44,120,191,.18);
        transform: scale(1.02);
    }
    100%{
        box-shadow: inset 0 -2px 8px rgba(0,0,0,.12), 0 0 0 0 rgba(44,120,191,.0);
        transform: scale(1);
    }
}

/* Botón desactivado y estado loading */
.dg-btn:disabled{
    cursor:not-allowed;
    opacity:.9;
}

.dg-btn-primary.is-loading{
    filter:saturate(90%);
    box-shadow:0 8px 18px rgba(31,101,229,.16);
}

/* Spinner minimal */
.dg-spinner{
    display:inline-block;
    width:16px; height:16px;
    margin-left:8px;
    border:2px solid currentColor;
    border-right-color:transparent;
    border-radius:50%;
    vertical-align:-2px;
    animation:dgSpin .65s linear infinite;
}

@keyframes dgSpin{ to{ transform:rotate(360deg); } }


/* Asegura que los botones deshabilitados SIGUEN visibles */
.dg-btn:disabled,
.dg-btn[disabled]{
    display:inline-flex !important;
    visibility:visible !important;
    opacity:.9;
    cursor:not-allowed;
}

/* Loading state */
.dg-btn{ position:relative; }
.dg-btn__spinner{
    display:none;
    width:16px; height:16px;
    border:2px solid rgba(255,255,255,.35);
    border-top-color:#fff;
    border-radius:50%;
    animation:dgspin .7s linear infinite;
    margin-right:8px;
}
.dg-btn.is-loading .dg-btn__spinner{ display:inline-block; }
.dg-btn.is-loading svg.ms-2{ display:none; } /* oculto la flecha mientras carga */

@keyframes dgspin{ to{ transform:rotate(360deg); } }

/*
!*A partir de aqui es el cambio de fondo del login*!
!* === Centro que cicla entre los colores del aro === *!
.dg-login-badge{
    !* paleta local al badge (los mismos del aro) *!
    --c1:#e6bf38;  --c1h:#f1d76b;  !* amarillo + highlight *!
    --c2:#6bbc59;  --c2h:#8fd47e;  !* verde    + highlight *!
    --c3:#e24a4a;  --c3h:#f07874;  !* rojo     + highlight *!
    --c4:#142741;  --c4h:#3d86c7;  !* azul     + highlight *!

    --core-cycle: 14s;             !* velocidad del cambio de color *!
}

!* El aro sigue girando (de tu setup anterior) *!
.dg-login-badge::before{
    animation: dgSpin var(--spin-duration,16s) linear infinite;
}

!* El núcleo ahora respira Y cambia de color en pasos suaves *!
!* Variante suave (hue wheel) — sustituye la animación del ::after por esta *!
.dg-login-badge::after{
    animation:
            dgHue var(--core-cycle,18s) linear infinite,
            dgBreathe var(--breathe-duration,6s) ease-in-out infinite;
}

@keyframes dgHue{
    0%   { filter: hue-rotate(0deg); }
    100% { filter: hue-rotate(360deg); }
}

!* Cambios de color por etapas (entre tus 4 colores) *!
@keyframes dgCoreStep{
    0%, 20%{
        background: radial-gradient(120% 120% at 30% 20%, var(--c1h), var(--c1));
    }
    25%, 45%{
        background: radial-gradient(120% 120% at 30% 20%, var(--c2h), var(--c2));
    }
    50%, 70%{
        background: radial-gradient(120% 120% at 30% 20%, var(--c3h), var(--c3));
    }
    75%, 95%{
        background: radial-gradient(120% 120% at 30% 20%, var(--c4h), var(--c4));
    }
    100%{
        background: radial-gradient(120% 120% at 30% 20%, var(--c1h), var(--c1));
    }
}

!* Hover: acelera un poco (opcional) *!
.dg-login-badge:hover::after{ animation-duration: calc(var(--core-cycle) * .7), 4.5s; }

!* Respeta reduce-motion *!
@media (prefers-reduced-motion: reduce){
    .dg-login-badge::after{ animation: none !important; }
}*/