/* ============================================================
   Xpectra — Theme unificado con xpectra.ai (Design System v2)
   Capa de "skin" cargada al final en cada página: reescribe la
   paleta, tipografía y componentes del panel para que herede el
   lenguaje visual del sitio público (rosa #ff2d8d + gradiente,
   fondo casi negro, superficies con borde sutil y glow).
   ============================================================ */

/* ---- Poppins auto-alojada (igual que xpectra.ai) ---- */
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url('/static/fonts/poppins/poppins-latin-400.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url('/static/fonts/poppins/poppins-latin-500.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url('/static/fonts/poppins/poppins-latin-600.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url('/static/fonts/poppins/poppins-latin-700.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:800;font-display:swap;src:url('/static/fonts/poppins/poppins-latin-800.woff2') format('woff2')}

/* ---- Tokens de marca ---- */
:root{
  --bg:#0a0a0c; --bg-2:#101014; --surface:#15151b; --surface-2:#1c1c24;
  --border:rgba(255,255,255,.08); --border-hover:rgba(255,45,141,.45);
  --pink:#ff2d8d; --pink-soft:#e91e8c; --purple:#7b2a5e; --purple-deep:#3d1230;
  --text:#f5f5f7; --muted:#a4a4af; --muted-2:#76767f;
  --grad:linear-gradient(135deg,#ff2d8d 0%,#a83279 60%,#7b2a5e 100%);
  --radius:18px; --radius-sm:12px;
  --shadow:0 20px 60px rgba(0,0,0,.45);
  --glow:0 0 80px rgba(255,45,141,.18);

  /* Remapeo de variables heredadas del panel -> paleta nueva */
  --primary-color:#ff2d8d;
  --background-color:#0a0a0c;
  --bg-color:#0a0a0c;
  --secondary-color:#1c1c24;
  --surface-color:#15151b;
  --accent-color:#a83279;
  --hover-color:#ff6ab0;
  --primary-dark:#7b2a5e;
  --text-color:#f5f5f7;
}

/* ---- Base ---- */
body{
  font-family:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
  background-color:var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

a{color:var(--pink)}

/* Fondo dashboard/paneles: radiales + grid sutil enmascarado (estático, no distrae sobre datos) */
.bg-mesh{
  position:fixed;inset:0;z-index:-1;pointer-events:none;
  width:100%;height:100%;
  background:
    radial-gradient(700px 500px at 85% -5%,rgba(255,45,141,.10),transparent 60%),
    radial-gradient(800px 600px at -10% 40%,rgba(123,42,94,.16),transparent 60%),
    radial-gradient(600px 500px at 70% 110%,rgba(255,45,141,.07),transparent 60%),
    var(--bg);
}
.bg-mesh::after{
  content:"";position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:56px 56px;
  -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,#000 0%,transparent 70%);
  mask-image:radial-gradient(ellipse 80% 60% at 50% 0%,#000 0%,transparent 70%);
}

/* ============================================================
   Fondo LOGIN: aurora viva + grid en deriva.
   Homenaje a hero premium (xbow) manteniendo la paleta Xpectra.
   ============================================================ */
.background-animation{
  position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;
  background:radial-gradient(130% 90% at 50% -15%, #170611 0%, var(--bg) 55%);
}
/* Aurora: manchas rosa/púrpura que derivan y respiran lentamente */
.background-animation::before{
  content:"";position:absolute;inset:-25%;display:block;
  background:
    radial-gradient(38% 38% at 22% 28%, rgba(255,45,141,.22), transparent 60%),
    radial-gradient(42% 42% at 78% 24%, rgba(123,42,94,.30), transparent 62%),
    radial-gradient(40% 40% at 62% 82%, rgba(168,50,121,.20), transparent 60%),
    radial-gradient(30% 30% at 35% 72%, rgba(255,45,141,.13), transparent 60%);
  filter:blur(46px);
  animation:xp-aurora 26s ease-in-out infinite alternate;
  will-change:transform;
}
/* Grid fino con leve deriva, fundido por máscara radial */
.background-animation::after{
  content:"";position:absolute;inset:-2px;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:48px 48px;
  -webkit-mask-image:radial-gradient(ellipse 92% 78% at 50% 42%,#000 0%,transparent 80%);
  mask-image:radial-gradient(ellipse 92% 78% at 50% 42%,#000 0%,transparent 80%);
  animation:xp-griddrift 32s linear infinite;
  will-change:background-position;
}
@keyframes xp-aurora{
  0%  {transform:translate3d(-3%,-2%,0) scale(1.05) rotate(0deg)}
  50% {transform:translate3d(3%,2%,0)  scale(1.18) rotate(7deg)}
  100%{transform:translate3d(-2%,3%,0) scale(1.08) rotate(-5deg)}
}
@keyframes xp-griddrift{
  from{background-position:0 0,0 0}
  to  {background-position:48px 96px,48px 96px}
}
@media (prefers-reduced-motion:reduce){
  .background-animation::before,.background-animation::after{animation:none}
}

/* Scrollbar */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:var(--bg)}
::-webkit-scrollbar-thumb{background:#26262f;border-radius:6px}
::-webkit-scrollbar-thumb:hover{background:#34343f}

/* Texto en gradiente reutilizable */
.text-gradient{
  background:var(--grad);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}

/* ============================================================
   HEADER / NAV  (sobrescribe header-premium.css)
   ============================================================ */
.nav{
  background:rgba(10,10,12,.82)!important;
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border)!important;
  box-shadow:0 4px 30px rgba(0,0,0,.35)!important;
}
.nav::before{
  background:linear-gradient(90deg,transparent,rgba(255,45,141,.6),rgba(168,50,121,.5),transparent)!important;
}
.logo{filter:drop-shadow(0 0 10px rgba(255,45,141,.28))}
.logo:hover{filter:drop-shadow(0 0 15px rgba(255,45,141,.5))}

.nav-menu a:hover{background:rgba(255,45,141,.10)!important}
.nav-menu a::before{background:linear-gradient(135deg,rgba(255,45,141,.15),rgba(168,50,121,.10))!important}
.nav-menu a.active{
  background:linear-gradient(135deg,rgba(255,45,141,.20),rgba(168,50,121,.15))!important;
  box-shadow:0 2px 10px rgba(255,45,141,.3)!important;
}

.header-admin-btn::before{background:linear-gradient(135deg,rgba(255,45,141,.15),rgba(168,50,121,.10))!important}
.header-admin-btn:hover{background:rgba(255,45,141,.10)!important}
.header-admin-btn i{color:#ff8ac4!important}

.header-user-info::before{background:linear-gradient(135deg,rgba(255,45,141,.15),rgba(168,50,121,.10))!important}
.header-user-info:hover{background:rgba(255,45,141,.10)!important}
.header-user-dropdown.active .header-user-info{background:linear-gradient(135deg,rgba(255,45,141,.20),rgba(168,50,121,.15))!important}

.header-user-avatar,
.header-user-menu-avatar{
  background:var(--grad)!important;
  box-shadow:0 4px 12px rgba(255,45,141,.4)!important;
}
.header-user-dropdown.active .header-user-arrow{color:var(--pink)!important}

.header-user-menu{
  background:linear-gradient(160deg,var(--surface),var(--bg-2))!important;
  border:1px solid var(--border)!important;
  box-shadow:var(--shadow),var(--glow)!important;
}
.header-user-menu::before{background:linear-gradient(90deg,transparent,rgba(255,45,141,.5),transparent)!important}
.header-user-menu-divider{background:linear-gradient(90deg,transparent,rgba(255,45,141,.3),transparent)!important}
.header-user-menu-tokens i{color:var(--pink)!important}

/* badges de tokens: web = rosa de marca, infra = cian */
.token-badge.web{color:#ff5da6!important}
.token-badge.infra{color:#22d3ee!important}
.token-badge.unlimited{color:#7dffaa!important}

/* menú móvil */
.header-user-menu,
.mobile-nav{border-color:var(--border)!important}
.mobile-nav{background:linear-gradient(160deg,var(--surface),var(--bg-2))!important;border-left:1px solid var(--border)!important}
.mobile-menu a:hover{background:rgba(255,45,141,.15)!important}
.mobile-user-info{
  background:linear-gradient(135deg,rgba(255,45,141,.15),rgba(168,50,121,.10))!important;
  border:1px solid var(--border-hover)!important;
}
.mobile-user-header i{color:var(--pink)!important}
.mobile-user-tokens i{color:#ff8ac4!important}
.mobile-menu-toggle{background:rgba(255,45,141,.10)!important;border:1px solid var(--border-hover)!important}
.mobile-menu-toggle:hover{background:rgba(255,45,141,.20)!important}

/* ============================================================
   LOGIN  (sobrescribe login-premium.css)
   ============================================================ */
.login-container{
  background:linear-gradient(160deg,var(--surface),var(--bg-2))!important;
  border:1px solid var(--border)!important;
  border-radius:24px!important;
  box-shadow:var(--shadow),0 0 100px rgba(255,45,141,.16),inset 0 1px 1px rgba(255,255,255,.04)!important;
}
.login-container::before{background:linear-gradient(90deg,transparent,var(--pink),#a83279,transparent)!important}
/* Partículas decorativas eliminadas (no existen en xpectra.ai y se apilaban
   arriba como píxeles morados al cargar). Oculto el contenedor por si quedara
   JS viejo en caché que aún las genere. */
.particles,.particle{display:none!important}
.login-logo{filter:drop-shadow(0 0 20px rgba(255,45,141,.45))}
/* texto en gradiente: usar background-image (no shorthand) para no resetear background-clip */
.login-title{
  background-image:var(--grad)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
}

.input-icon{color:var(--pink)!important}
.form-group input{
  background:rgba(255,45,141,.05)!important;
  border:1.5px solid var(--border)!important;
}
.form-group input:focus{
  background:rgba(255,45,141,.08)!important;
  border-color:var(--border-hover)!important;
  box-shadow:0 0 0 4px rgba(255,45,141,.10),0 8px 24px rgba(255,45,141,.18)!important;
}
.form-group input:focus ~ .input-icon{color:var(--pink)!important}
.particle{background:var(--grad)!important}

.captcha-display{border:1.5px solid var(--border-hover)!important}
.captcha-display::before{background:linear-gradient(90deg,transparent,rgba(255,45,141,.12),transparent)!important}
.captcha-text{
  /* degradado claro y brillante para que TODAS las letras sean legibles sobre fondo oscuro */
  background-image:linear-gradient(135deg,#ffc2e0,#ff7ab8,#ff2d8d)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
  filter:drop-shadow(0 0 10px rgba(255,45,141,.5))!important;
}

/* Cloudflare Turnstile (reemplaza al captcha de texto) */
.turnstile-group{align-items:center}
.turnstile-group .cf-turnstile{display:flex;justify-content:center;min-height:65px}

.login-btn{
  background:var(--grad)!important;
  box-shadow:0 8px 25px rgba(255,45,141,.4)!important;
}
.login-btn:hover{box-shadow:0 12px 35px rgba(255,45,141,.5),0 0 30px rgba(255,45,141,.3)!important}
.login-footer{border-top:1px solid var(--border)!important}
.footer-link{color:var(--pink)!important}
.footer-link:hover{color:#ff9ecb!important}

/* selector de idioma activo (login + header) */
.language-toggle__option.is-active{background:rgba(255,45,141,.18)!important;color:#fff!important}

/* ============================================================
   GLASS CARDS  (dashboard.css)
   ============================================================ */
.glass-card{
  background:linear-gradient(160deg,var(--surface),var(--bg-2))!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius)!important;
  box-shadow:0 12px 40px rgba(0,0,0,.35)!important;
}
.glass-card:hover{
  transform:translateY(-5px);
  border-color:var(--border-hover)!important;
  box-shadow:var(--glow),0 18px 50px rgba(0,0,0,.45)!important;
}
.chart-filter-btn.active{
  background:rgba(255,45,141,.18)!important;color:#fff!important;
  border:1px solid var(--border-hover)!important;
}
select:focus{
  border-color:var(--border-hover)!important;
  box-shadow:0 0 0 3px rgba(255,45,141,.15)!important;
}
select option:checked,
select option:hover{
  background:linear-gradient(135deg,#ff2d8d 0%,#a83279 100%)!important;
  background-color:#ff2d8d!important;
}

/* ============================================================
   ANALYSIS  (analysis.css) — web = rosa de marca, infra = cian
   ============================================================ */
.analysis-page{background-color:var(--bg)!important}

.analysis-title-icon.web{
  background:linear-gradient(135deg,rgba(255,45,141,.2),rgba(255,45,141,.08))!important;
  color:#ff5da6!important;
}
.analysis-cta.web,
.analysis-submit-btn.web{
  background:var(--grad)!important;
  box-shadow:0 4px 15px rgba(255,45,141,.3)!important;
}
.analysis-cta.web:hover:not(:disabled),
.analysis-submit-btn.web:hover{
  background:linear-gradient(135deg,#ff5da6,#ff2d8d)!important;
}
.analysis-warning a{color:#ff5da6!important}

.analysis-results{
  background:linear-gradient(160deg,var(--surface),var(--bg-2))!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius)!important;
}
.analysis-table td[data-label="URL"] a{color:#ff7ab8!important}

.action-btn:hover,
.download-btn:hover{
  background:rgba(255,45,141,.15)!important;
  border-color:var(--border-hover)!important;
  color:#ff5da6!important;
}

.analysis-modal{
  background:linear-gradient(160deg,var(--surface),var(--bg-2))!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius)!important;
}
.analysis-input:focus,
.analysis-select:focus,
.analysis-textarea:focus{
  border-color:var(--border-hover)!important;
  box-shadow:0 0 0 3px rgba(255,45,141,.12)!important;
}
.custom-dropdown-trigger:hover,
.custom-dropdown.open .custom-dropdown-trigger,
.custom-dropdown-menu{border-color:var(--border-hover)!important}
.custom-dropdown-menu{background:var(--surface-2)!important}
.custom-dropdown-option:hover{background:rgba(255,45,141,.20)!important}
.custom-dropdown-option.selected{background:linear-gradient(135deg,#ff2d8d,#a83279)!important}

.analysis-switch input:checked + .analysis-switch-slider{background:var(--pink)!important}
.analysis-ip-count i{color:#22d3ee!important}

.scan-spinner{border:3px solid rgba(255,45,141,.2)!important;border-top-color:var(--pink)!important}
.scan-time span{color:#ff5da6!important}

/* ============================================================
   ADMIN  (admin.css)
   ============================================================ */
.token-item.web{color:#ff5da6!important}
.token-item.infra{color:#22d3ee!important}
.edit-btn:hover{color:#ff5da6!important;background:rgba(255,45,141,.10)!important}
.admin-input:focus{border-color:var(--border-hover)!important;background:rgba(255,45,141,.06)!important}
.admin-checkbox{accent-color:var(--pink)!important}
.admin-table .btn-primary,
.modal-actions .btn-primary,
.btn-primary{
  background:var(--grad)!important;
}
.btn-primary:hover{box-shadow:0 4px 12px rgba(255,45,141,.35)!important}
.modal-content{
  background:linear-gradient(160deg,var(--surface),var(--bg-2))!important;
  border:1px solid var(--border)!important;
  border-radius:var(--radius)!important;
}

/* ============================================================
   SWEETALERT2  (sweetalert-custom.css)
   ============================================================ */
.swal2-popup{
  background:linear-gradient(160deg,var(--surface),var(--bg-2))!important;
  border:1px solid var(--border)!important;
  box-shadow:var(--shadow),var(--glow),inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.swal2-confirm{
  background:var(--grad)!important;
  box-shadow:0 4px 15px rgba(255,45,141,.3)!important;
}
.swal2-confirm:hover{
  background:linear-gradient(135deg,#ff5da6,#ff2d8d)!important;
  box-shadow:0 6px 20px rgba(255,45,141,.4)!important;
}
.swal2-confirm:focus{box-shadow:0 0 0 3px rgba(255,45,141,.4)!important}
.swal2-icon.swal2-question{border-color:#ff5da6!important;color:#ff5da6!important}
.swal2-input:focus,
.swal2-textarea:focus,
.swal2-select:focus{
  border-color:var(--pink)!important;
  box-shadow:0 0 0 3px rgba(255,45,141,.2)!important;
}
.swal2-timer-progress-bar{background:linear-gradient(90deg,#ff2d8d 0%,#22d3ee 100%)!important}
.swal2-footer a{color:#ff5da6!important}
.swal2-footer a:hover{color:#ff9ecb!important}
.swal2-loading .swal2-confirm{background:var(--grad)!important}

/* ============================================================
   PULIDO PREMIUM — secciones internas (dashboard / análisis / admin)
   Sobrio, alto contraste, mucho aire y ritmo tipográfico cuidado.
   ============================================================ */

/* ---- Ritmo tipográfico y encabezados ---- */
h1,h2,h3,.analysis-title h1,.modal-title{letter-spacing:-.2px}
.analysis-title-icon{box-shadow:inset 0 0 0 1px var(--border)}
.analysis-title p{color:var(--muted-2)}

/* ---- Contenedor de resultados ---- */
.analysis-results-header{padding:1.05rem 1.35rem!important}
.analysis-results-header h2{letter-spacing:.2px;font-size:.92rem}
.analysis-results-header h2 i{color:var(--pink)!important}

/* ---- TABLAS premium (análisis web / infra) ---- */
.analysis-table{font-size:.84rem}
.analysis-table thead{
  background:rgba(255,255,255,.02)!important;
  position:sticky;top:0;z-index:2;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
.analysis-table th{
  padding:.85rem 1.1rem!important;
  color:var(--muted-2)!important;
  font-size:.68rem!important;font-weight:600!important;
  letter-spacing:.07em!important;
  border-bottom:1px solid var(--border)!important;
  white-space:normal!important;   /* evita que encabezados largos se solapen */
  vertical-align:middle;line-height:1.25;
}
/* Rebalance de columnas para que "Vulnerabilidades"/"Fecha" respiren */
@media (min-width:1025px){
  .analysis-table.web-table th:nth-child(2),.analysis-table.web-table td:nth-child(2){width:29%}
  .analysis-table.web-table th:nth-child(3),.analysis-table.web-table td:nth-child(3){width:11%}
  .analysis-table.web-table th:nth-child(4),.analysis-table.web-table td:nth-child(4){width:13%}
  .analysis-table.web-table th:nth-child(6),.analysis-table.web-table td:nth-child(6){width:8%}
  .analysis-table.infra-table th:nth-child(2),.analysis-table.infra-table td:nth-child(2){width:28%}
  .analysis-table.infra-table th:nth-child(3),.analysis-table.infra-table td:nth-child(3){width:12%}
  .analysis-table.infra-table th:nth-child(4),.analysis-table.infra-table td:nth-child(4){width:15%}
}
.analysis-table td{padding:.95rem 1.1rem!important;color:#cfcfd6!important;vertical-align:middle}
.analysis-table tbody tr{
  border-bottom:1px solid rgba(255,255,255,.04)!important;
  transition:background .15s ease, box-shadow .15s ease;
}
.analysis-table tbody tr:hover{
  background:rgba(255,45,141,.055)!important;
  box-shadow:inset 3px 0 0 var(--pink);
}
.analysis-table td:first-child{color:#fff!important;font-weight:600}
.analysis-table td[data-label="URL"] a,
.analysis-table td[data-label="Direcciones IP"]{
  font-family:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
  font-size:.8rem;letter-spacing:-.1px;
}

/* ---- TABLA admin premium ---- */
.admin-table th{
  color:var(--muted-2)!important;font-size:.68rem!important;
  letter-spacing:.09em!important;border-bottom:1px solid var(--border)!important;
}
.admin-table td{padding:.95rem 1.1rem!important}
.admin-table tbody tr{border-bottom:1px solid rgba(255,255,255,.04)!important;transition:background .15s ease, box-shadow .15s ease}
.admin-table tbody tr:hover{background:rgba(255,45,141,.055)!important;box-shadow:inset 3px 0 0 var(--pink)}
.user-avatar{border:1px solid var(--border)}
/* badge de rol */
.role-pill{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.26rem .65rem;border-radius:999px;font-size:.7rem;font-weight:600;
  letter-spacing:.02em;white-space:nowrap;border:1px solid transparent;line-height:1;
}
.role-pill.admin{color:#fbbf24;background:rgba(251,191,36,.12);border-color:rgba(251,191,36,.28)}
.role-pill.user{color:var(--muted);background:rgba(255,255,255,.05);border-color:var(--border)}
.role-pill i{font-size:.68rem}

/* ---- PILLS de estado (antes sin estilo: vivían en CSS no cargado) ---- */
.estado-finalizado,.estado-proceso,.estado-error,.estado-cola,.estado-standby{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.28rem .72rem;border-radius:999px;
  font-size:.7rem;font-weight:600;letter-spacing:.02em;white-space:nowrap;
  border:1px solid transparent;line-height:1;
}
.estado-finalizado::before,.estado-proceso::before,.estado-error::before,.estado-cola::before,.estado-standby::before{
  content:"";width:6px;height:6px;border-radius:50%;background:currentColor;
  box-shadow:0 0 8px currentColor;flex:0 0 6px;
}
.estado-finalizado{color:#34d399;background:rgba(52,211,153,.12);border-color:rgba(52,211,153,.25)}
.estado-proceso{color:#fbbf24;background:rgba(251,191,36,.12);border-color:rgba(251,191,36,.25)}
.estado-proceso::before{animation:xp-pulsedot 1.2s ease-in-out infinite}
.estado-standby{color:#fde68a;background:rgba(251,191,36,.12);border-color:rgba(251,191,36,.28)}
.estado-cola{color:#7dd3fc;background:rgba(125,211,252,.12);border-color:rgba(125,211,252,.22)}
.estado-error{color:#f87171;background:rgba(248,113,113,.12);border-color:rgba(248,113,113,.25)}
@keyframes xp-pulsedot{0%,100%{opacity:.35}50%{opacity:1}}

/* Empty state */
.no-results{text-align:center;color:var(--muted-2);padding:2.75rem 1rem;font-style:normal;font-size:.9rem}

/* ---- Grupo de botones de acción: simétrico y cohesivo ---- */
.action-buttons{gap:.5rem}
.action-btn,.download-btn,.delete-btn{
  width:2.3rem!important;height:2.3rem!important;border-radius:10px!important;
  background:rgba(255,255,255,.04)!important;border:1px solid var(--border)!important;
  color:var(--muted)!important;transition:all .18s ease!important;
}
.action-btn:hover,.download-btn:hover{
  background:rgba(255,45,141,.14)!important;border-color:var(--border-hover)!important;
  color:#ff7ab8!important;transform:translateY(-2px)!important;
}
.delete-btn:hover{
  background:rgba(248,113,113,.14)!important;border-color:rgba(248,113,113,.5)!important;
  color:#f87171!important;transform:translateY(-2px)!important;
}
.download-btn.disabled,.download-btn:disabled{opacity:.45!important;transform:none!important}

/* ---- Dashboard: simetría y aire ---- */
.glass-card{padding-block:1.15rem}
.glass-card h3{letter-spacing:.01em}
/* mini-tarjetas de severidad: igualar ancho para una fila simétrica */
#webStatsCard .bg-red-500\/10,#webStatsCard .bg-orange-500\/10,#webStatsCard .bg-yellow-500\/10,#webStatsCard .bg-blue-500\/10,
#infraStatsCard .bg-red-500\/10,#infraStatsCard .bg-orange-500\/10,#infraStatsCard .bg-yellow-500\/10,#infraStatsCard .bg-blue-500\/10{
  min-width:3.1rem;
}

/* ---- CTAs e inputs: foco coherente ---- */
.analysis-cta.infra,.analysis-submit-btn.infra{box-shadow:0 4px 15px rgba(34,211,238,.25)!important}
.admin-input:focus,.analysis-input:focus,.analysis-select:focus,.analysis-textarea:focus{
  box-shadow:0 0 0 3px rgba(255,45,141,.12)!important;
}

/* ============================================================
   MODAL "DESCARGAR REPORTES" (Swal) — reestructurado premium.
   Gana al CSS inyectado por el JS usando mayor especificidad.
   ============================================================ */
.swal2-popup.download-swal-popup{
  background:linear-gradient(160deg,var(--surface),var(--bg-2))!important;
  border:1px solid var(--border)!important;border-radius:var(--radius)!important;
  box-shadow:var(--shadow),var(--glow)!important;
  padding:1.85rem!important;width:680px!important;max-width:94vw!important;
}
.download-swal-popup .swal2-title{color:#fff!important;font-size:1.3rem!important;font-weight:700!important;letter-spacing:-.3px!important;padding-top:.25rem!important}
.swal2-close.download-swal-close{color:var(--muted-2)!important;font-size:1.6rem!important;transition:color .25s ease,transform .25s ease!important}
.swal2-close.download-swal-close:hover{color:var(--pink)!important;transform:rotate(90deg)!important}
.download-swal-popup .download-modal-header{margin-bottom:1.5rem!important}
.download-swal-popup .download-modal-subtitle{font-size:.85rem!important;color:var(--muted)!important;text-align:center!important}
.download-swal-popup .download-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:.85rem!important}
/* tarjeta huérfana (conteo impar) ocupa toda la fila → simetría perfecta */
.download-swal-popup .download-card:last-child:nth-child(odd){grid-column:1 / -1}
.download-swal-popup .download-card{
  position:relative;display:flex!important;align-items:center;gap:1rem;
  padding:1.1rem 1.2rem!important;
  background:rgba(255,255,255,.03)!important;border:1px solid var(--border)!important;
  border-radius:14px!important;cursor:pointer;text-align:left;overflow:hidden;
  transition:transform .25s,border-color .25s,box-shadow .25s,background .25s!important;
}
.download-swal-popup .download-card::before{display:none!important}
.download-swal-popup .download-card:hover{
  transform:translateY(-3px)!important;border-color:var(--border-hover)!important;
  background:rgba(255,45,141,.06)!important;box-shadow:0 12px 30px rgba(255,45,141,.18)!important;
}
.download-swal-popup .download-card-icon{
  width:48px!important;height:48px!important;flex-shrink:0;border-radius:12px!important;
  background:linear-gradient(160deg,rgba(255,45,141,.18),rgba(168,50,121,.10))!important;
  border:1px solid var(--border)!important;
  display:flex;align-items:center;justify-content:center;font-size:1.2rem!important;color:#ff7ab8!important;
}
.download-swal-popup .download-card-title{font-size:.92rem!important;font-weight:600!important;color:#fff!important;margin-bottom:.2rem!important}
.download-swal-popup .download-card-desc{font-size:.76rem!important;color:var(--muted-2)!important;line-height:1.35!important}
/* badge: de check verde anticuado -> flecha de descarga sutil que cobra vida en hover */
.download-swal-popup .download-card-badge{color:var(--muted-2)!important;font-size:1rem!important;transition:color .25s ease,transform .25s ease!important}
.download-swal-popup .download-card-badge i::before{content:"\f063"!important}  /* fa-arrow-down */
.download-swal-popup .download-card:hover .download-card-badge{color:var(--pink)!important;transform:translateY(2px)!important}
@media (max-width:680px){.download-swal-popup .download-grid{grid-template-columns:1fr!important}.swal2-popup.download-swal-popup{padding:1.3rem!important}}

/* ============================================================
   MODAL "NUEVO ANÁLISIS" — modernizado (mantiene IDs/markup)
   ============================================================ */
.analysis-modal{max-width:30rem!important;box-shadow:var(--shadow),var(--glow)!important}
.analysis-modal-header{padding:1.25rem 1.5rem!important;border-bottom:1px solid var(--border)!important}
.analysis-modal-header h2{font-size:1.05rem!important;letter-spacing:-.2px}
.analysis-modal-header h2 [data-lucide],.analysis-modal-header h2 i{color:var(--pink)!important}
.analysis-modal-close{background:rgba(255,255,255,.05)!important;border:1px solid var(--border)!important;border-radius:10px!important}
.analysis-modal-close:hover{background:rgba(255,45,141,.12)!important;color:#ff7ab8!important}
.analysis-modal-body{padding:1.5rem!important}
/* etiquetas tipo "field label" premium */
.analysis-form-group{margin-bottom:1.05rem!important}
.analysis-form-group label{
  text-transform:uppercase!important;letter-spacing:.07em!important;
  font-size:.66rem!important;font-weight:600!important;color:var(--muted-2)!important;
  margin-bottom:.45rem!important;
}
.analysis-input,.analysis-select,.analysis-textarea,.custom-dropdown-trigger{
  border-radius:10px!important;padding:.7rem .9rem!important;
  background:rgba(255,255,255,.035)!important;border:1px solid var(--border)!important;
}
/* toggles convertidos en filas-tarjeta legibles */
.analysis-switch-row{
  padding:.7rem .9rem!important;background:rgba(255,255,255,.025)!important;
  border:1px solid var(--border)!important;border-radius:12px!important;margin-bottom:.7rem!important;
  transition:border-color .2s ease,background .2s ease;
}
.analysis-switch-row:hover{border-color:rgba(255,45,141,.25)!important;background:rgba(255,45,141,.04)!important}
.analysis-switch-label{color:#d7d7de!important;font-size:.85rem!important;font-weight:500}
.analysis-modal-footer{padding:1rem 1.5rem 1.5rem!important}
.analysis-submit-btn{padding:.85rem 1.5rem!important;border-radius:11px!important;font-size:.9rem!important}
/* dropdown desplegado */
.custom-dropdown-menu{border-radius:0 0 10px 10px!important;box-shadow:var(--shadow)!important}