/* =========================================================================
   Canal Partner · Grupo Nuestros Parques
   Sistema de diseño — tokens validados (paleta categórica y de estado
   verificadas con el validador de accesibilidad: banda de luminosidad,
   piso de croma, separación CVD y contraste WCAG) + identidad de marca.
   ========================================================================= */

@font-face{
  font-family:'Inter';
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url('../assets/fonts/Inter-Variable.woff2') format('woff2-variations'), url('../assets/fonts/Inter-Variable.woff2') format('woff2');
}

:root{
  color-scheme: light;

  /* ---- Superficies y tinta (paleta validada, modo claro) ---- */
  --surface-page:   #f9f9f7;
  --surface-card:   #fcfcfb;
  --surface-raised: #ffffff;
  --surface-sunken: #f1f1ee;
  --ink-primary:    #0b0b0b;
  --ink-secondary:  #52514e;
  --ink-muted:      #898781;
  --gridline:       #e1e0d9;
  --border:         rgba(11,11,11,.10);
  --border-strong:  rgba(11,11,11,.16);

  /* ---- Paleta categórica (orden fijo, no ciclar) ---- */
  --cat-blue:    #2a78d6;
  --cat-orange:  #eb6834;
  --cat-aqua:    #1baf7a;
  --cat-yellow:  #eda100;
  --cat-magenta: #e87ba4;
  --cat-green:   #008300;
  --cat-violet:  #4a3aa7;
  --cat-red:     #e34948;

  /* ---- Paleta de estado (fija, nunca temática) ---- */
  --status-good:     #0ca30c;
  --status-warning:  #fab219;
  --status-serious:  #ec835a;
  --status-critical: #d03b3b;

  /* ---- Identidad de marca (del isotipo Nuestros Parques) ---- */
  --brand-sun-1:   #ffc531;
  --brand-sun-2:   #e8531e;
  --brand-blue:    #1976d2;
  --brand-green:   #1b5e20;
  --brand-lime:    #cddc39;
  --brand-gradient: linear-gradient(135deg, #29b6f6 0%, #1976d2 32%, #2e7d32 68%, #cddc39 100%);
  --brand-gradient-dark: linear-gradient(160deg, #0b2f4a 0%, #0e3d2a 55%, #142b12 100%);

  --primary:        var(--brand-blue);
  --primary-dark:   #114a86;
  --primary-ink:    #ffffff;

  --radius-sm: 8px;
  --radius: 14px;
  --radius-lg: 20px;
  --shadow-sm: 0 1px 2px rgba(11,11,11,.06);
  --shadow: 0 4px 16px rgba(11,11,11,.08), 0 1px 3px rgba(11,11,11,.06);
  --shadow-lg: 0 16px 40px rgba(11,11,11,.14), 0 2px 8px rgba(11,11,11,.08);
  --sidebar-w: 264px;
  --topbar-h: 60px;

  --ease: cubic-bezier(.2,.7,.3,1);
}

@media (prefers-color-scheme: dark){
  :root:where(:not([data-theme="light"])){
    color-scheme: dark;
    --surface-page:   #0d0d0d;
    --surface-card:   #1a1a19;
    --surface-raised: #201f1e;
    --surface-sunken: #161615;
    --ink-primary:    #ffffff;
    --ink-secondary:  #c3c2b7;
    --ink-muted:      #8f8d86;
    --gridline:       #2c2c2a;
    --border:         rgba(255,255,255,.10);
    --border-strong:  rgba(255,255,255,.18);
    --cat-blue:#3987e5; --cat-orange:#d95926; --cat-aqua:#199e70; --cat-yellow:#c98500;
    --cat-magenta:#d55181; --cat-green:#008300; --cat-violet:#9085e9; --cat-red:#e66767;
    --primary: #4f9eea; --primary-dark:#2a78d6; --primary-ink:#08131f;
  }
}
:root[data-theme="dark"]{
  color-scheme: dark;
  --surface-page:   #0d0d0d;
  --surface-card:   #1a1a19;
  --surface-raised: #201f1e;
  --surface-sunken: #161615;
  --ink-primary:    #ffffff;
  --ink-secondary:  #c3c2b7;
  --ink-muted:      #8f8d86;
  --gridline:       #2c2c2a;
  --border:         rgba(255,255,255,.10);
  --border-strong:  rgba(255,255,255,.18);
  --cat-blue:#3987e5; --cat-orange:#d95926; --cat-aqua:#199e70; --cat-yellow:#c98500;
  --cat-magenta:#d55181; --cat-green:#008300; --cat-violet:#9085e9; --cat-red:#e66767;
  --primary: #4f9eea; --primary-dark:#2a78d6; --primary-ink:#08131f;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family: 'Inter', system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background:var(--surface-page);
  color:var(--ink-primary);
  min-height:100vh;
  display:flex;
  flex-direction:column;
  -webkit-font-smoothing:antialiased;
  transition: background-color .2s var(--ease), color .2s var(--ease);
}
a{color:var(--primary);text-decoration:none;}
a:hover{text-decoration:underline;}
h1,h2,h3{line-height:1.22;margin:0 0 .4em;letter-spacing:-.01em;}
p{line-height:1.55;color:var(--ink-secondary);}
button,input,select,textarea{font-family:inherit;font-size:1rem;color:inherit;}
::selection{background:var(--primary);color:var(--primary-ink);}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:4px;}

/* ---------- Topbar ---------- */
.topbar{
  position:sticky;top:0;z-index:50;
  background:var(--surface-raised);
  border-bottom:1px solid var(--border);
  backdrop-filter:saturate(1.4) blur(8px);
  height:var(--topbar-h);
}
.topbar-inner{
  height:100%;display:flex;align-items:center;gap:.75rem;
  padding:0 1rem;max-width:1440px;margin:0 auto;
}
.cp-lockup{display:flex;align-items:center;gap:.6rem;}
.cp-lockup-mark{display:flex;flex-shrink:0;filter:drop-shadow(0 1px 1px rgba(0,0,0,.15));}
.cp-lockup-text{display:flex;flex-direction:column;line-height:1.15;}
.cp-lockup-title{font-weight:800;font-size:1.02rem;color:var(--ink-primary);letter-spacing:-.01em;}
.cp-lockup-sub{font-size:.68rem;color:var(--ink-muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em;}
.brand{flex:1;display:flex;}

.icon-btn{
  width:38px;height:38px;border-radius:999px;border:1px solid var(--border);
  background:var(--surface-card);display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:var(--ink-secondary);font-size:1rem;flex-shrink:0;
  transition:background-color .15s, transform .1s;
}
.icon-btn:hover{background:var(--surface-sunken);}
.icon-btn:active{transform:scale(.94);}

.hamburger{display:flex;flex-direction:column;justify-content:center;gap:4px;}
.hamburger span{display:block;width:20px;height:2px;background:var(--ink-primary);border-radius:2px;}
.topnav{display:none;}
.topnav.open{
  display:flex;flex-direction:column;gap:.15rem;
  position:absolute;top:var(--topbar-h);left:0;right:0;
  background:var(--surface-raised);padding:.75rem 1rem 1rem;
  box-shadow:var(--shadow-lg);border-bottom:1px solid var(--border);
  max-height:calc(100vh - var(--topbar-h));overflow:auto;
}
.topnav a, .topnav button{
  color:var(--ink-secondary);background:transparent;border:none;text-align:left;
  padding:.65rem .6rem;border-radius:var(--radius-sm);cursor:pointer;font-size:.95rem;font-weight:600;
}
.topnav a:hover, .topnav button:hover{background:var(--surface-sunken);}
.topnav .active{background:var(--primary);color:var(--primary-ink);}

/* ---------- Layout ---------- */
.layout{display:flex;flex:1;max-width:1440px;margin:0 auto;width:100%;}
.sidebar{display:none;}
.content{flex:1;padding:1rem;min-width:0;}

@media (min-width:900px){
  .hamburger{display:none;}
  .topnav{
    display:flex !important;flex-direction:row;position:static;background:transparent;
    padding:0;box-shadow:none;gap:.15rem;border:none;max-height:none;
  }
  .sidebar{
    display:flex;flex-direction:column;width:var(--sidebar-w);flex-shrink:0;
    background:var(--surface-raised);border-right:1px solid var(--border);
    padding:1.1rem .85rem;min-height:calc(100vh - var(--topbar-h) - 52px);
  }
  .content{padding:1.75rem 2.25rem;}
}

.side-user{
  display:flex;align-items:center;gap:.6rem;padding:.5rem .6rem .9rem;margin-bottom:.4rem;
  border-bottom:1px solid var(--border);
}
.avatar{
  width:36px;height:36px;border-radius:50%;flex-shrink:0;
  background:var(--brand-gradient);color:#fff;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:.85rem;box-shadow:0 2px 6px rgba(0,0,0,.15);
}
.side-user-meta{min-width:0;}
.side-user-name{font-weight:700;font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.side-link{
  display:flex;align-items:center;gap:.65rem;
  padding:.6rem .7rem;border-radius:var(--radius-sm);color:var(--ink-secondary);
  cursor:pointer;margin-bottom:.15rem;font-size:.89rem;font-weight:600;
  border:none;background:transparent;width:100%;text-align:left;
  transition:background-color .12s, color .12s;
}
.side-link:hover{background:var(--surface-sunken);color:var(--ink-primary);}
.side-link.active{background:color-mix(in srgb, var(--primary) 14%, transparent);color:var(--primary);}
.side-link .ico{width:1.15em;text-align:center;flex-shrink:0;}
.side-section-title{
  font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;font-weight:700;
  color:var(--ink-muted);margin:1rem 0 .35rem;padding:0 .7rem;
}
.side-logout{margin-top:auto;padding-top:.75rem;border-top:1px solid var(--border);}

/* ---------- Cards / grid ---------- */
.card{
  background:var(--surface-card);border:1px solid var(--border);border-radius:var(--radius);
  box-shadow:var(--shadow-sm);padding:1.35rem;margin-bottom:1rem;
  transition:box-shadow .15s var(--ease), transform .15s var(--ease);
}
.card.hoverable:hover{box-shadow:var(--shadow);transform:translateY(-1px);}
.card-flat{background:var(--surface-sunken);border:1px solid var(--border);box-shadow:none;}
.grid{display:grid;gap:1rem;grid-template-columns:1fr;}
@media (min-width:700px){ .grid.cols-2{grid-template-columns:1fr 1fr;} }
@media (min-width:900px){
  .grid.cols-3{grid-template-columns:repeat(3,1fr);}
  .grid.cols-4{grid-template-columns:repeat(4,1fr);}
}

.page-title{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem;margin-bottom:1.25rem;}
.page-title h1{font-size:1.5rem;}
.eyebrow{font-size:.7rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--primary);margin-bottom:.3rem;}
.muted{color:var(--ink-secondary);font-size:.9rem;}
.tiny-muted{color:var(--ink-muted);font-size:.76rem;}

/* ---------- Forms ---------- */
.field{margin-bottom:1.1rem;}
.field label{display:block;font-weight:700;font-size:.83rem;margin-bottom:.35rem;color:var(--ink-primary);}
.field input, .field select, .field textarea{
  width:100%;padding:.65rem .8rem;border:1px solid var(--border-strong);border-radius:var(--radius-sm);
  background:var(--surface-raised);color:var(--ink-primary);transition:border-color .12s, box-shadow .12s;
}
.field input::placeholder, .field textarea::placeholder{color:var(--ink-muted);}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none;border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb, var(--primary) 20%, transparent);
}
.field input:disabled{background:var(--surface-sunken);color:var(--ink-muted);}
.field small{color:var(--ink-muted);display:block;margin-top:.3rem;font-size:.78rem;}
.field-row{display:flex;gap:1rem;flex-wrap:wrap;}
.field-row .field{flex:1;min-width:160px;}
.checkbox-row{display:flex;align-items:flex-start;gap:.55rem;margin-bottom:1rem;font-size:.87rem;color:var(--ink-secondary);}
.checkbox-row input{width:auto;margin-top:.2rem;accent-color:var(--primary);}
.field-error{color:var(--status-critical);font-size:.78rem;margin-top:.3rem;font-weight:600;}
.strength-meter{display:flex;gap:4px;margin-top:.4rem;}
.strength-meter span{height:4px;flex:1;border-radius:2px;background:var(--gridline);}
.strength-meter.s1 span:nth-child(1){background:var(--status-critical);}
.strength-meter.s2 span:nth-child(-n+2){background:var(--status-serious);}
.strength-meter.s3 span:nth-child(-n+3){background:var(--status-warning);}
.strength-meter.s4 span{background:var(--status-good);}

/* honeypot: campo trampa anti-bots, invisible para personas */
.hp-field{position:absolute;left:-9999px;top:-9999px;opacity:0;height:0;width:0;overflow:hidden;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
  padding:.68rem 1.15rem;border-radius:var(--radius-sm);border:none;cursor:pointer;
  font-weight:700;font-size:.9rem;transition:filter .15s, transform .08s, box-shadow .15s;
  white-space:nowrap;
}
.btn:hover{filter:brightness(1.06);}
.btn:active{transform:scale(.98);}
.btn-primary{background:var(--primary);color:var(--primary-ink);box-shadow:0 2px 8px color-mix(in srgb, var(--primary) 35%, transparent);}
.btn-brand{background:var(--brand-gradient);color:#fff;box-shadow:0 4px 14px rgba(25,118,210,.35);}
.btn-success{background:var(--status-good);color:#fff;}
.btn-warning{background:var(--status-warning);color:#3a2900;}
.btn-danger{background:var(--status-critical);color:#fff;}
.btn-ghost{background:transparent;color:var(--primary);border:1.5px solid var(--border-strong);}
.btn-ghost:hover{background:var(--surface-sunken);}
.btn-sm{padding:.38rem .75rem;font-size:.8rem;}
.btn-block{width:100%;}
.btn[disabled]{opacity:.5;cursor:not-allowed;filter:none;box-shadow:none;}

/* ---------- Badges ---------- */
.badge{display:inline-flex;align-items:center;gap:.35rem;padding:.22rem .62rem;border-radius:999px;font-size:.74rem;font-weight:700;white-space:nowrap;}
.badge::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0;}
.badge-good{background:color-mix(in srgb, var(--status-good) 16%, transparent);color:var(--status-good);}
.badge-warning{background:color-mix(in srgb, var(--status-warning) 22%, transparent);color:#8a5a00;}
.badge-serious{background:color-mix(in srgb, var(--status-serious) 20%, transparent);color:#a1441c;}
.badge-critical{background:color-mix(in srgb, var(--status-critical) 16%, transparent);color:var(--status-critical);}
.badge-info{background:color-mix(in srgb, var(--cat-blue) 16%, transparent);color:var(--cat-blue);}
.badge-special{background:color-mix(in srgb, var(--cat-violet) 16%, transparent);color:var(--cat-violet);}
.badge-neutral{background:var(--surface-sunken);color:var(--ink-secondary);}
/* alias retro-compatibles */
.badge-blue{background:color-mix(in srgb, var(--cat-blue) 16%, transparent);color:var(--cat-blue);}
.badge-green{background:color-mix(in srgb, var(--status-good) 16%, transparent);color:var(--status-good);}
.badge-orange{background:color-mix(in srgb, var(--status-warning) 22%, transparent);color:#8a5a00;}
.badge-red{background:color-mix(in srgb, var(--status-critical) 16%, transparent);color:var(--status-critical);}
.badge-gray{background:var(--surface-sunken);color:var(--ink-secondary);}
.badge-purple{background:color-mix(in srgb, var(--cat-violet) 16%, transparent);color:var(--cat-violet);}

/* ---------- Table ---------- */
.table-wrap{overflow-x:auto;border-radius:var(--radius-sm);}
table{width:100%;border-collapse:collapse;font-size:.87rem;min-width:480px;}
thead th{
  text-align:left;padding:.65rem .6rem;border-bottom:1px solid var(--border);
  color:var(--ink-muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;font-weight:700;
}
tbody td{padding:.6rem .6rem;border-bottom:1px solid var(--gridline);color:var(--ink-primary);}
tbody tr:hover{background:var(--surface-sunken);}

/* ---------- Stat tile ---------- */
.stat{display:flex;align-items:flex-start;gap:.85rem;text-align:left;}
.stat-icon{
  width:42px;height:42px;border-radius:var(--radius-sm);flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:1.2rem;
  background:color-mix(in srgb, var(--primary) 14%, transparent);color:var(--primary);
}
.stat .value{font-size:1.9rem;font-weight:800;color:var(--ink-primary);line-height:1.1;letter-spacing:-.02em;}
.stat .label{color:var(--ink-secondary);font-size:.82rem;margin-top:.15rem;}

/* ---------- Donut chart ---------- */
.donut-wrap{display:flex;align-items:center;gap:1.25rem;flex-wrap:wrap;}
.donut-legend{list-style:none;padding:0;margin:0;font-size:.85rem;}
.donut-legend li{display:flex;align-items:center;gap:.45rem;margin-bottom:.4rem;color:var(--ink-secondary);}
.dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;}

/* ---------- Stars ---------- */
.stars{color:var(--status-warning);letter-spacing:2px;filter:saturate(1.3);}

/* ---------- Skeleton loaders ---------- */
.skeleton{background:linear-gradient(90deg, var(--surface-sunken) 25%, var(--gridline) 37%, var(--surface-sunken) 63%);
  background-size:400% 100%;animation:skeleton-loading 1.4s ease infinite;border-radius:var(--radius-sm);}
@keyframes skeleton-loading{0%{background-position:100% 50%;}100%{background-position:0 50%;}}
.skeleton-line{height:14px;margin-bottom:.5rem;}
.skeleton-card{height:110px;}

/* ---------- Toast ---------- */
.toast-host{position:fixed;bottom:1rem;right:1rem;z-index:200;display:flex;flex-direction:column;gap:.5rem;max-width:90vw;}
.toast{
  background:var(--ink-primary);color:var(--surface-page);padding:.75rem 1.05rem;border-radius:var(--radius-sm);
  box-shadow:var(--shadow-lg);font-size:.88rem;animation:toastIn .2s var(--ease);font-weight:600;
}
.toast.success{background:var(--status-good);color:#fff;}
.toast.error{background:var(--status-critical);color:#fff;}
@keyframes toastIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}

/* ---------- Aviso de lead nuevo (grande, clickeable, no bloqueante) ---------- */
.lead-banner-host{
  position:fixed;top:calc(var(--topbar-h) + .75rem);left:50%;transform:translateX(-50%);
  z-index:190;display:flex;flex-direction:column;gap:.5rem;width:min(94vw,480px);
}
.lead-banner{
  display:flex;align-items:center;gap:.65rem;cursor:pointer;
  background:var(--primary);color:var(--primary-ink);padding:.85rem 1rem;border-radius:var(--radius);
  box-shadow:var(--shadow-lg);font-size:.9rem;font-weight:600;animation:toastIn .2s var(--ease);
}
.lead-banner:hover{filter:brightness(1.06);}
.lead-banner-icon{font-size:1.2rem;flex-shrink:0;}
.lead-banner-text{flex:1;line-height:1.3;}
.lead-banner-close{
  flex-shrink:0;background:rgba(255,255,255,.18);border:none;color:inherit;
  width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:.8rem;line-height:1;
}
.lead-banner-close:hover{background:rgba(255,255,255,.3);}

/* ---------- Modal ---------- */
.modal-overlay{
  position:fixed;inset:0;background:rgba(8,8,8,.55);backdrop-filter:blur(2px);
  display:flex;align-items:center;justify-content:center;z-index:150;padding:1rem;
  animation:fadeIn .15s var(--ease);
}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
.modal-box{background:var(--surface-raised);border-radius:var(--radius-lg);padding:1.6rem;max-width:480px;width:100%;
  max-height:85vh;overflow:auto;box-shadow:var(--shadow-lg);border:1px solid var(--border);}

/* ---------- Login / register / landing ---------- */
.auth-wrap{max-width:440px;margin:1.5rem auto;}
.landing-hero{
  background:var(--brand-gradient-dark);color:#fff;border-radius:var(--radius-lg);
  padding:3rem 1.5rem;text-align:center;margin-bottom:1.5rem;position:relative;overflow:hidden;
  box-shadow:var(--shadow-lg);
}
.landing-hero::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 20% 15%, rgba(41,182,246,.28), transparent 45%),
             radial-gradient(circle at 85% 80%, rgba(205,220,57,.22), transparent 45%);
  pointer-events:none;
}
.landing-hero > *{position:relative;}
.landing-hero .cp-lockup-mark svg{filter:drop-shadow(0 4px 14px rgba(0,0,0,.35));}
.landing-hero .cp-lockup-title{
  color:#ffffff;font-size:1.55rem;font-weight:800;letter-spacing:-.015em;
  text-shadow:0 2px 10px rgba(0,0,0,.25);
}
.landing-hero .cp-lockup-sub{color:rgba(255,255,255,.78);}
.landing-hero h1{font-size:2rem;margin-top:1rem;color:#fff;}
.landing-hero p{color:#d7e6ea;max-width:640px;margin:0.85rem auto 1.35rem;}
.pill-row{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-top:1rem;}
.pill{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);padding:.42rem .95rem;border-radius:999px;font-size:.78rem;font-weight:600;}

.role-card{
  border:2px solid var(--border);border-radius:var(--radius);padding:1.1rem;cursor:pointer;text-align:left;
  background:var(--surface-card);transition:border-color .12s, background-color .12s, transform .1s;
}
.role-card:hover{transform:translateY(-1px);}
.role-card.selected{border-color:var(--primary);background:color-mix(in srgb, var(--primary) 8%, var(--surface-card));}
.role-card h3{font-size:1rem;margin-bottom:.3rem;}
.role-card p{font-size:.82rem;color:var(--ink-secondary);margin:0;}

/* ---------- QR box ---------- */
.qr-box{background:#fff;padding:1.1rem;border-radius:var(--radius);display:inline-block;text-align:center;box-shadow:var(--shadow);}
.qr-link{word-break:break-all;font-size:.78rem;background:var(--surface-sunken);padding:.55rem .7rem;border-radius:var(--radius-sm);display:block;margin-top:.6rem;color:var(--ink-secondary);}

/* ---------- Insignia de aviso en la navegación (leads nuevos) ---------- */
.nav-badge{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:19px;height:19px;padding:0 5px;margin-left:.4rem;
  background:var(--status-critical);color:#fff;font-size:.72rem;font-weight:800;
  border-radius:999px;line-height:1;vertical-align:middle;
}
.side-link .nav-badge{margin-left:auto;}

/* ---------- Guía de inducción (capacitación del partner) ---------- */
.training-frame-wrap{
  border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);
}
.training-frame-wrap iframe{
  display:block;width:100%;height:65vh;min-height:420px;border:0;background:#faf9f5;
}

/* ---------- Progress bar ---------- */
.progress{background:var(--gridline);border-radius:999px;height:10px;overflow:hidden;}
.progress > div{height:100%;background:var(--status-good);transition:width .3s var(--ease);}

/* ---------- Alert banners ---------- */
.alert{border-radius:var(--radius);padding:1rem 1.1rem;margin-bottom:1rem;display:flex;gap:.7rem;align-items:flex-start;border:1px solid;}
.alert-warning{background:color-mix(in srgb, var(--status-warning) 14%, var(--surface-card));border-color:color-mix(in srgb, var(--status-warning) 40%, transparent);}
.alert-critical{background:color-mix(in srgb, var(--status-critical) 12%, var(--surface-card));border-color:color-mix(in srgb, var(--status-critical) 40%, transparent);}
.alert-info{background:color-mix(in srgb, var(--cat-blue) 10%, var(--surface-card));border-color:color-mix(in srgb, var(--cat-blue) 35%, transparent);}
.alert-icon{font-size:1.2rem;flex-shrink:0;}

/* ---------- Misc ---------- */
.flex{display:flex;}
.flex-between{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem;}
.gap-2{gap:.5rem;}
.mt-1{margin-top:.5rem;}
.mt-2{margin-top:1rem;}
.mb-0{margin-bottom:0;}
.text-center{text-align:center;}
.empty-state{text-align:center;padding:2.5rem 1rem;color:var(--ink-secondary);}
.empty-state-icon{font-size:2.2rem;margin-bottom:.6rem;opacity:.7;}
.app-footer{
  text-align:center;font-size:.75rem;color:var(--ink-muted);padding:1.25rem;border-top:1px solid var(--border);
}
.divider{border:none;border-top:1px solid var(--border);margin:1rem 0;}
.kicker-list{margin:0;padding-left:1.1rem;font-size:.88rem;color:var(--ink-secondary);}
.code-inline{background:var(--surface-sunken);padding:.1rem .4rem;border-radius:4px;font-size:.85em;font-family:ui-monospace,Consolas,monospace;}

@media (max-width: 899px){
  .content{padding-bottom:2rem;}
}

/* Páginas "bare": el prospecto que escanea el QR de un partner o lee la
   política de privacidad no debe ver la navegación ni marca de Canal
   Partner — solo el contenido de la vista (marca "Nuestros Parques" propia
   de esa vista, ver renderLeadCapture/renderPrivacyPolicy). */
body.bare-shell .topbar,
body.bare-shell .sidebar,
body.bare-shell .app-footer{display:none!important;}
body.bare-shell .content{padding-top:1.5rem;}