/* =========================================================================
   UNO — Tipografías locales
   ========================================================================= */
@font-face {
  font-family: 'Barlow';
  src: url('fonts/Barlow-Regular.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Barlow';
  src: url('fonts/Barlow-Italic.woff2') format('woff2');
  font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Barlow';
  src: url('fonts/Barlow-Medium.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Barlow';
  src: url('fonts/Barlow-SemiBold.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Barlow';
  src: url('fonts/Barlow-Bold.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Barlow';
  src: url('fonts/Barlow-BoldItalic.woff2') format('woff2');
  font-weight: 700; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Orbitron';
  src: url('fonts/Orbitron-Variable.woff2') format('woff2-variations'),
       url('fonts/Orbitron-Variable.woff2') format('woff2');
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}

/* =========================================================================
   UNO — Sistema de diseño
   ========================================================================= */
:root{
  --uno-green:        #6FBE44;
  --uno-green-bright: #8BD15F;
  --uno-green-deep:   #4E9A2D;
  --uno-green-glow:   #A8E66C;
  --uno-blue:         #2D7FF9;
  --uno-blue-bright:  #4F9CFF;
  --uno-blue-glow:    #7AB8FF;
  --uno-yellow:       #FFC107;
  --uno-white:        #FFFFFF;
  --uno-cream:        #FAFAF7;
  --uno-gray-50:      #F5F5F5;
  --uno-gray-100:     #ECECEC;
  --uno-gray-300:     #C9C9C9;
  --uno-gray-600:     #6B6B6B;
  --uno-gray-700:     #4A4A4A;
  --uno-gray-800:     #353535;
  --uno-silver:       #C0C5CC;
  --uno-silver-mid:   #A8AEB6;
  --uno-silver-deep:  #8A9099;
  --uno-gray-900:     #2B2B2B;
  --uno-ink:          #2B2B2B;

  --radius-sm: 12px;
  --radius:    18px;
  --radius-lg: 28px;
  --radius-xl: 40px;

  --shadow-soft:  0 4px 18px rgba(78, 154, 45, 0.06), 0 1px 3px rgba(78, 154, 45, 0.04);
  --shadow-card:  0 12px 40px rgba(78, 154, 45, 0.10), 0 2px 6px rgba(78, 154, 45, 0.04);
  --shadow-lift:  0 24px 60px rgba(78, 154, 45, 0.16), 0 4px 12px rgba(78, 154, 45, 0.06);
  --shadow-green: 0 16px 40px rgba(111, 190, 68, 0.32);

  --ease-smooth: cubic-bezier(.22,.61,.36,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);

  --container: 1240px;
}

*{ box-sizing: border-box; margin: 0; padding: 0; }
html{ scroll-behavior: smooth; }
body{
  font-family: 'Barlow', sans-serif;
  font-weight: 400;
  color: var(--uno-ink);
  background: var(--uno-cream);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img{ max-width: 100%; display: block; }
a{ color: inherit; text-decoration: none; }
button{ font-family: inherit; cursor: pointer; border: none; background: none; }

.container{ width: min(100% - 48px, var(--container)); margin-inline: auto; }

/* Tipografía display */
.display{
  font-family: 'Orbitron', sans-serif;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.02;
}
.eyebrow{
  font-family: 'Barlow', sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--uno-green);
}

/* =========================================================================
   NAVEGACIÓN
   ========================================================================= */
.nav{
  position: fixed;
  top: 16px; left: 0; right: 0;
  z-index: 100;
  display: flex; justify-content: center;
  pointer-events: none;
}
.nav-shell{
  pointer-events: auto;
  display: flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,0.78);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  border: 1px solid rgba(85, 139, 47, 0.08);
  border-radius: 999px;
  padding: 8px 8px 8px 20px;
  box-shadow: var(--shadow-soft);
}
.nav-brand{
  display: flex; align-items: center; gap: 10px;
  font-weight: 700; font-size: 0.95rem;
  padding-right: 12px;
  border-right: 1px solid rgba(15,61,34,0.1);
}
.nav-brand-mark{
  width: 28px; height: 28px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, var(--uno-green-bright), var(--uno-green) 60%, var(--uno-green-deep));
  position: relative;
  box-shadow: inset 0 -2px 4px rgba(0,0,0,0.2);
}
.nav-brand-mark::after{
  content:''; position: absolute; inset: 6px;
  border: 2px solid rgba(255,255,255,0.85);
  border-bottom-color: transparent;
  border-right-color: transparent;
  border-radius: 50%;
  transform: rotate(-25deg);
}
.nav-links{
  display: flex; align-items: center; gap: 2px;
}
.nav-links a{
  padding: 8px 16px;
  font-size: 0.88rem; font-weight: 500;
  color: var(--uno-gray-900);
  border-radius: 999px;
  transition: all .24s var(--ease-smooth);
}
.nav-links a:hover{
  background: var(--uno-gray-50);
  color: var(--uno-green);
}
.nav-cta{
  padding: 10px 20px;
  background: var(--uno-green);
  color: white;
  border-radius: 999px;
  font-size: 0.88rem; font-weight: 600;
  transition: all .24s var(--ease-smooth);
}
.nav-cta:hover{
  background: var(--uno-green-bright);
  transform: translateY(-1px);
  box-shadow: var(--shadow-green);
}

/* Hamburguesa: oculto en desktop */
.nav-toggle{
  display: none;
  width: 40px; height: 40px;
  background: transparent;
  border: 1px solid rgba(15,61,34,0.12);
  border-radius: 999px;
  cursor: pointer;
  padding: 0;
  align-items: center; justify-content: center;
  flex-direction: column;
  gap: 4px;
}
.nav-toggle span{
  display: block;
  width: 18px; height: 2px;
  background: var(--uno-gray-900);
  border-radius: 2px;
  transition: transform .24s var(--ease-smooth), opacity .2s ease;
}
.nav-toggle[aria-expanded="true"] span:nth-child(1){ transform: translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3){ transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 860px){
  .nav-shell{
    padding: 6px 6px 6px 16px;
    gap: 6px;
    flex-wrap: nowrap;
  }
  .nav-toggle{ display: inline-flex; }

  /* Compactar el CTA en móvil */
  .nav-cta{
    padding: 9px 14px;
    font-size: 0.82rem;
  }

  /* Convertir nav-links en un panel desplegable bajo la barra */
  .nav-links{
    position: fixed;
    top: 78px;
    left: 12px;
    right: 12px;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    padding: 10px;
    background: rgba(255,255,255,0.96);
    backdrop-filter: blur(18px) saturate(140%);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    border: 1px solid rgba(85, 139, 47, 0.12);
    border-radius: 18px;
    box-shadow: var(--shadow-soft);
    opacity: 0;
    transform: translateY(-8px);
    pointer-events: none;
    transition: opacity .2s ease, transform .24s var(--ease-smooth);
    z-index: 99;
  }
  .nav-links.is-open{
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
  }
  .nav-links a{
    padding: 12px 16px;
    font-size: 0.95rem;
    border-radius: 12px;
  }
  .nav-links .nav-soy-uno{
    margin-top: 4px;
    text-align: center;
  }
}

@media (max-width: 480px){
  /* En pantallas muy estrechas, acortar el CTA para que quepa todo */
  .nav-cta{
    padding: 9px 12px;
    font-size: 0.78rem;
  }
  .nav-brand{ padding-right: 8px; }
  .nav-brand span{ display: none; }
}

/* =========================================================================
   HERO
   ========================================================================= */
.hero{
  position: relative;
  padding: 140px 0 100px;
  overflow: hidden;
  background:
    radial-gradient(ellipse 60% 50% at 90% 10%, rgba(168, 230, 108, 0.10), transparent 60%),
    radial-gradient(ellipse 40% 35% at 50% 50%, rgba(45, 127, 249, 0.06), transparent 60%),
    radial-gradient(ellipse 50% 40% at 10% 90%, rgba(111, 190, 68, 0.08), transparent 60%),
    var(--uno-cream);
}
.hero::before{
  content:'';
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(85, 139, 47, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(85, 139, 47, 0.04) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse 80% 80% at 50% 30%, black 30%, transparent 80%);
  pointer-events: none;
}

.hero-grid{
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 60px;
  align-items: center;
  position: relative;
  z-index: 1;
}

.hero-tag{
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 16px 8px 8px;
  background: white;
  border: 1px solid rgba(15,61,34,0.1);
  border-radius: 999px;
  font-size: 0.82rem; font-weight: 500;
  color: var(--uno-gray-900);
  margin-bottom: 28px;
  box-shadow: var(--shadow-soft);
}
.hero-tag-dot{
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--uno-green);
  display: grid; place-items: center;
  color: white; font-size: 0.7rem; font-weight: 700;
  position: relative;
}
.hero-tag-dot::after{
  content:''; position: absolute; inset: -4px;
  border-radius: 50%;
  border: 2px solid var(--uno-green-glow);
  opacity: 0.5;
  animation: pulse-ring 2.4s ease-out infinite;
}
@keyframes pulse-ring{
  0%   { transform: scale(0.8); opacity: 0.6; }
  100% { transform: scale(1.6); opacity: 0; }
}

.hero h1{
  font-family: 'Orbitron', sans-serif;
  font-weight: 600;
  font-size: clamp(2.6rem, 6vw, 4.8rem);
  line-height: 0.98;
  letter-spacing: -0.025em;
  color: var(--uno-ink);
  margin-bottom: 24px;
}
.hero h1 .accent{
  font-style: italic;
  font-weight: 400;
  color: var(--uno-green);
  position: relative;
  display: inline-block;
}
.hero h1 .accent::after{
  content:'';
  position: absolute;
  left: 0; right: 0; bottom: 0.05em;
  height: 0.4em;
  background: linear-gradient(90deg, rgba(168, 230, 108, 0.32), rgba(122, 184, 255, 0.32));
  z-index: -1;
  border-radius: 4px;
  transform: skewX(-6deg);
}
.hero h1 .strike{
  position: relative;
  color: var(--uno-gray-600);
  font-weight: 500;
}
.hero h1 .strike::after{
  content:''; position: absolute;
  left: -2%; right: -2%;
  top: 52%;
  height: 3px;
  background: var(--uno-green);
  transform: rotate(-2deg);
  border-radius: 2px;
}

.hero-lead{
  font-size: 1.14rem;
  color: var(--uno-gray-900);
  max-width: 540px;
  margin-bottom: 36px;
  line-height: 1.6;
}

.hero-ctas{
  display: flex; gap: 14px; flex-wrap: wrap;
  margin-bottom: 48px;
}
.btn{
  display: inline-flex; align-items: center; gap: 10px;
  padding: 16px 28px;
  border-radius: var(--radius);
  font-weight: 600;
  font-size: 0.98rem;
  transition: all .28s var(--ease-smooth);
  cursor: pointer;
}
.btn-primary{
  background: var(--uno-green);
  color: white;
  box-shadow: var(--shadow-green);
}
.btn-primary:hover{
  background: var(--uno-green-bright);
  transform: translateY(-2px);
  box-shadow: 0 22px 50px rgba(139, 195, 74, 0.36);
}
.btn-primary svg{ transition: transform .28s var(--ease-spring); }
.btn-primary:hover svg{ transform: translateX(4px); }

.btn-ghost{
  background: white;
  color: var(--uno-gray-900);
  border: 1px solid rgba(15,61,34,0.12);
}
.btn-ghost:hover{
  border-color: var(--uno-green);
  color: var(--uno-green);
  transform: translateY(-2px);
}

.hero-stats{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  padding-top: 32px;
  border-top: 1px solid rgba(85, 139, 47, 0.1);
  max-width: 540px;
  text-align: center;
}
.hero-stats > div{
  display: flex;
  flex-direction: column;
  align-items: center;
}
.stat-num{
  font-family: 'Orbitron', sans-serif;
  font-weight: 600;
  font-size: 2.2rem;
  color: var(--uno-green);
  line-height: 1;
  letter-spacing: -0.02em;
}
.stat-label{
  font-size: 0.78rem;
  color: var(--uno-gray-600);
  margin-top: 6px;
  letter-spacing: 0.02em;
}

/* Hero visual: logo + orbitas */
.hero-visual{
  position: relative;
  aspect-ratio: 1 / 1.05;
  display: grid;
  place-items: center;
}
.hero-orb{
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
}
.hero-orb-bg{
  width: 88%; height: 88%;
  border-radius: 50%;
  background:
    radial-gradient(circle at 30% 25%, rgba(74,222,128,0.5), transparent 55%),
    radial-gradient(circle at 70% 80%, rgba(30,111,61,0.6), transparent 55%),
    linear-gradient(135deg, var(--uno-green-deep), var(--uno-green));
  position: relative;
  box-shadow:
    inset 0 -20px 60px rgba(0,0,0,0.3),
    0 30px 80px rgba(85, 139, 47, 0.35);
  animation: float 8s ease-in-out infinite;
}
@keyframes float{
  0%, 100%{ transform: translateY(0); }
  50%     { transform: translateY(-14px); }
}

.hero-orb-bg::before, .hero-orb-bg::after{
  content:'';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1px dashed rgba(255,255,255,0.18);
  animation: rotate 40s linear infinite;
}
.hero-orb-bg::after{
  inset: -8%;
  border-style: solid;
  border-width: 1px;
  border-color: rgba(255,255,255,0.08);
  animation-duration: 60s;
  animation-direction: reverse;
}
@keyframes rotate{ to{ transform: rotate(360deg); } }

/* <picture> wrapper transparente al layout — la <img> participa directo en el grid */
.hero-visual > picture{ display: contents; }

.hero-logo{
  position: relative;
  width: 60%;
  z-index: 2;
  filter: drop-shadow(0 20px 40px rgba(0,0,0,0.35));
  margin: auto; /* refuerzo de centrado */
}

/* Bolitas orbitando */
.orbit-dot{
  position: absolute;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: var(--uno-green-glow);
  box-shadow: 0 0 24px var(--uno-green-glow);
  z-index: 3;
}
.orbit-dot.d1{ top: 8%; right: 18%; background: var(--uno-blue-bright); box-shadow: 0 0 24px var(--uno-blue-bright); animation: orbit1 6s ease-in-out infinite; }
.orbit-dot.d2{ bottom: 14%; left: 10%; width: 10px; height: 10px; background: var(--uno-yellow); box-shadow: 0 0 20px var(--uno-yellow); animation: orbit2 7s ease-in-out infinite; }
.orbit-dot.d3{ top: 50%; right: 4%; width: 8px; height: 8px; animation: orbit3 5s ease-in-out infinite; }

@keyframes orbit1{ 0%,100%{transform:translate(0,0)} 50%{transform:translate(-20px,30px)} }
@keyframes orbit2{ 0%,100%{transform:translate(0,0)} 50%{transform:translate(25px,-20px)} }
@keyframes orbit3{ 0%,100%{transform:translate(0,0)} 50%{transform:translate(-15px,-25px)} }

.hero-tag-bubble{
  position: absolute;
  background: white;
  border-radius: 14px;
  padding: 10px 16px;
  font-size: 0.82rem;
  font-weight: 500;
  box-shadow: var(--shadow-card);
  display: flex; align-items: center; gap: 10px;
  z-index: 4;
  animation: float-bubble 5s ease-in-out infinite;
}
.hero-tag-bubble svg, .hero-tag-bubble span.icon{
  width: 18px; height: 18px;
  display: grid; place-items: center;
  color: var(--uno-green);
}
.bubble-1{ top: 12%; left: -4%; animation-delay: 0s; }
.bubble-2{ bottom: 18%; right: -2%; animation-delay: 1.2s; }
.bubble-3{ bottom: 4%; left: 18%; animation-delay: 2.4s; }
@keyframes float-bubble{
  0%, 100%{ transform: translateY(0); }
  50%     { transform: translateY(-10px); }
}

@media (max-width: 900px){
  .hero{ padding: 120px 0 60px; }
  .hero-grid{ grid-template-columns: 1fr; gap: 30px; }
  .hero-visual{ max-width: 420px; margin: 0 auto; }
  .hero-stats{ grid-template-columns: repeat(3, 1fr); gap: 16px; }
  .stat-num{ font-size: 1.7rem; }
}

/* =========================================================================
   MARQUEE — palabras clave del manifiesto
   ========================================================================= */
.marquee{
  background: linear-gradient(90deg, var(--uno-silver-mid), var(--uno-silver), var(--uno-silver-mid));
  color: var(--uno-gray-900);
  padding: 24px 0;
  overflow: hidden;
  position: relative;
  border-top: 1px solid rgba(255,255,255,0.4);
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.marquee-track{
  display: flex; gap: 48px;
  animation: scroll-x 40s linear infinite;
  white-space: nowrap;
  width: max-content;
}
.marquee-item{
  font-family: 'Orbitron', sans-serif;
  font-weight: 500;
  font-size: 1.6rem;
  letter-spacing: -0.01em;
  display: flex; align-items: center; gap: 48px;
}
.marquee-item .dot{
  width: 8px; height: 8px;
  background: var(--uno-green-deep);
  border-radius: 50%;
  display: inline-block;
}
.marquee-item .it{ font-style: italic; color: var(--uno-green-deep); }
@keyframes scroll-x{
  to{ transform: translateX(-50%); }
}

/* =========================================================================
   MANIFIESTO
   ========================================================================= */
.manifesto{
  padding: 120px 0;
  background: var(--uno-cream);
  position: relative;
}
.manifesto-head{
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 60px;
  align-items: end;
  margin-bottom: 60px;
}
.manifesto h2, .section h2{
  font-family: 'Orbitron', sans-serif;
  font-weight: 600;
  font-size: clamp(2.2rem, 4.5vw, 3.6rem);
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--uno-ink);
}
.manifesto h2 em, .section h2 em{
  font-style: italic;
  font-weight: 400;
  color: var(--uno-green);
}

.manifesto-intro{
  font-size: 1.08rem;
  color: var(--uno-gray-900);
  line-height: 1.7;
}

.manifesto-quote{
  background: white;
  border-radius: var(--radius-lg);
  padding: 48px 52px;
  box-shadow: var(--shadow-card);
  position: relative;
  overflow: hidden;
  margin-bottom: 60px;
}
.manifesto-quote::before{
  content: '"';
  position: absolute;
  top: -30px; right: 30px;
  font-family: 'Orbitron', sans-serif;
  font-size: 14rem;
  color: var(--uno-green);
  opacity: 0.08;
  line-height: 1;
}
.manifesto-quote .text{
  font-family: 'Orbitron', sans-serif;
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  line-height: 1.3;
  font-weight: 500;
  letter-spacing: -0.015em;
  position: relative;
  z-index: 1;
  max-width: 880px;
}
.manifesto-quote .text strong{
  color: var(--uno-green);
  font-weight: 600;
  font-style: italic;
}

.principles-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.principle{
  background: white;
  border-radius: var(--radius);
  padding: 32px 28px;
  border: 1px solid rgba(15,61,34,0.06);
  transition: all .35s var(--ease-smooth);
  position: relative;
  overflow: hidden;
}
.principle::after{
  content:'';
  position: absolute;
  inset: 0;
  border-radius: var(--radius);
  background: linear-gradient(135deg, var(--uno-green-deep), var(--uno-green));
  opacity: 0;
  transition: opacity .35s var(--ease-smooth);
  z-index: 0;
}
.principle > *{ position: relative; z-index: 1; }
.principle:hover{
  transform: translateY(-6px);
  box-shadow: var(--shadow-lift);
}
.principle:hover::after{ opacity: 1; }
.principle:hover .principle-num,
.principle:hover .principle-title,
.principle:hover .principle-text{ color: white; }
.principle:hover .principle-num{ color: var(--uno-green-glow); }

.principle-num{
  font-family: 'Barlow', sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.18em;
  color: var(--uno-green);
  margin-bottom: 24px;
  display: block;
  transition: color .3s;
}
.principle-title{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  margin-bottom: 12px;
  color: var(--uno-ink);
  transition: color .3s;
}
.principle-text{
  font-size: 0.94rem;
  line-height: 1.6;
  color: var(--uno-gray-600);
  transition: color .3s;
}

@media (max-width: 900px){
  .manifesto-head{ grid-template-columns: 1fr; gap: 24px; }
  .manifesto-quote{ padding: 32px 28px; }
  .principles-grid{ grid-template-columns: 1fr; }
}

/* =========================================================================
   PRIORIDADES — sección modular
   ========================================================================= */
.priorities{
  padding: 120px 0;
  background: linear-gradient(180deg, var(--uno-cream), white);
}
.priorities-head{
  text-align: center;
  margin-bottom: 60px;
  max-width: 720px;
  margin-inline: auto;
}
.priorities-head .eyebrow{ margin-bottom: 16px; display: block; }
.priorities-head p{
  margin-top: 18px;
  color: var(--uno-gray-600);
  font-size: 1.05rem;
}

.priorities-grid{
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-auto-rows: auto;
  align-items: stretch;
  gap: 16px;
}
.priority{
  border-radius: var(--radius);
  padding: 22px 24px;
  display: flex; flex-direction: column;
  justify-content: flex-start;
  position: relative;
  overflow: hidden;
  transition: transform .4s var(--ease-smooth), box-shadow .4s var(--ease-smooth);
  border: 1px solid rgba(15,61,34,0.06);
  cursor: default;
}
.priority::after{
  content: '';
  position: absolute;
  inset: 0;
  border-radius: var(--radius-lg);
  opacity: 0;
  transition: opacity .35s var(--ease-smooth);
  z-index: 0;
}
.priority > *{ position: relative; z-index: 1; }
.priority:hover{
  transform: translateY(-6px);
  box-shadow: var(--shadow-lift);
}
.priority:hover::after{ opacity: 1; }
.priority:hover h3,
.priority:hover p{ color: white !important; }

.priority h3{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.18rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.2;
  transition: color .3s;
}
.priority p{
  font-size: 0.88rem;
  color: var(--uno-gray-700);
  line-height: 1.5;
  margin-top: 8px;
  transition: color .3s;
}

/* Tamaños de columna del grid (mantengo el feature layout original) */
.p1{ grid-column: span 4; }
.p2{ grid-column: span 2; }
.p3{ grid-column: span 2; }
.p4{ grid-column: span 2; }
.p5{ grid-column: span 2; }
.p6{ grid-column: span 3; }
.p7{ grid-column: span 3; }

/* Variantes de color (verdes y azules claros, alternando) */
.p1{ background: #E8F5DA; border-color: rgba(111, 190, 68, 0.20); }
.p2{ background: #DAEEFB; border-color: rgba(45, 127, 249, 0.18); }
.p3{ background: #DFF3E8; border-color: rgba(78, 154, 45, 0.18); }
.p4{ background: #E5EEFB; border-color: rgba(45, 127, 249, 0.16); }
.p5{ background: #E8F4D6; border-color: rgba(111, 190, 68, 0.20); }
.p6{ background: #D7EEF6; border-color: rgba(45, 127, 249, 0.20); }
.p7{ background: #E2F4E8; border-color: rgba(78, 154, 45, 0.18); }

/* Acento del título según tono */
.p1 h3, .p3 h3, .p5 h3, .p7 h3{ color: var(--uno-green-deep); }
.p2 h3, .p4 h3, .p6 h3{ color: #1862C2; }

/* Hover: cada tarjeta se llena con su gradiente saturado */
.p1:hover::after{ background: linear-gradient(135deg, var(--uno-green-deep), var(--uno-green)); }
.p2:hover::after{ background: linear-gradient(135deg, #1862C2, var(--uno-blue)); }
.p3:hover::after{ background: linear-gradient(135deg, var(--uno-green-deep), #5BA86F); }
.p4:hover::after{ background: linear-gradient(135deg, var(--uno-blue), var(--uno-blue-bright)); }
.p5:hover::after{ background: linear-gradient(135deg, var(--uno-green), var(--uno-green-bright)); }
.p6:hover::after{ background: linear-gradient(135deg, #1F87C2, var(--uno-blue-bright)); }
.p7:hover::after{ background: linear-gradient(135deg, var(--uno-green-deep), var(--uno-green-bright)); }

.badge{
  display: inline-flex; align-items: center; gap: 6px;
  font-family: 'Barlow', sans-serif;
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 6px 12px;
  background: rgba(139, 195, 74, 0.08);
  color: var(--uno-green);
  border-radius: 999px;
  align-self: flex-start;
  z-index: 2;
  position: relative;
}

@media (max-width: 900px){
  .priorities-grid{
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
  }
  .priority{ grid-column: span 1 !important; min-height: 180px; }
}

/* =========================================================================
   NOVA — IA
   ========================================================================= */
.nova{
  padding: 120px 0;
  background: linear-gradient(135deg, var(--uno-silver-mid) 0%, var(--uno-silver) 50%, var(--uno-silver-deep) 100%);
  color: var(--uno-gray-900);
  position: relative;
  overflow: hidden;
}
.nova::before{
  content:'';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 50% 40% at 80% 20%, rgba(168, 230, 108, 0.20), transparent 60%),
    radial-gradient(ellipse 45% 45% at 30% 60%, rgba(79, 156, 255, 0.20), transparent 60%),
    radial-gradient(ellipse 40% 50% at 20% 80%, rgba(111, 190, 68, 0.14), transparent 60%);
  pointer-events: none;
}
.nova-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  position: relative;
  z-index: 1;
}
.nova-content .eyebrow{ color: var(--uno-green-deep); margin-bottom: 20px; display: block; }
.nova h2{ color: var(--uno-gray-900); margin-bottom: 24px; }
.nova h2 em{ color: var(--uno-green-deep); }
.nova p.lead{
  font-size: 1.08rem;
  color: var(--uno-gray-700);
  line-height: 1.7;
  margin-bottom: 32px;
}

.nova-features{
  display: grid; gap: 16px;
  margin-bottom: 36px;
}
.nova-feat{
  display: flex; align-items: flex-start; gap: 16px;
  padding: 18px 20px;
  background: rgba(255,255,255,0.55);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.7);
  border-radius: var(--radius);
  transition: all .3s;
}
.nova-feat:hover{
  background: rgba(255,255,255,0.85);
  border-color: var(--uno-green);
  transform: translateY(-2px);
}
.nova-feat-icon{
  width: 40px; height: 40px;
  border-radius: 10px;
  background: rgba(78, 154, 45, 0.16);
  display: grid; place-items: center;
  color: var(--uno-green-deep);
  flex-shrink: 0;
}
.nova-feat-text strong{
  display: block;
  font-weight: 600;
  margin-bottom: 4px;
  font-size: 0.98rem;
  color: var(--uno-gray-900);
}
.nova-feat-text span{
  font-size: 0.86rem;
  color: var(--uno-gray-700);
  line-height: 1.5;
}

/* Visual de NOVA */
.nova-visual{
  position: relative;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
}
.nova-stage{
  width: 86%; height: 86%;
  border-radius: 50%;
  background:
    radial-gradient(circle at 40% 30%, rgba(168, 230, 108, 0.45), transparent 50%),
    radial-gradient(circle at 60% 70%, rgba(79, 156, 255, 0.40), transparent 60%),
    rgba(255,255,255,0.3);
  border: 1px solid rgba(255,255,255,0.6);
  position: relative;
  display: grid;
  place-items: center;
  box-shadow: inset 0 4px 30px rgba(255,255,255,0.4), 0 20px 60px rgba(0,0,0,0.08);
}
.nova-stage::before, .nova-stage::after{
  content:'';
  position: absolute;
  inset: -10%;
  border-radius: 50%;
  border: 1px dashed rgba(78, 154, 45, 0.32);
  animation: rotate 60s linear infinite;
}
.nova-stage::after{
  inset: -22%;
  border-style: solid;
  border-color: rgba(45, 127, 249, 0.22);
  animation-direction: reverse;
  animation-duration: 90s;
}
/* <picture> wrapper transparente al layout — la <img> participa directo en el grid */
.nova-stage > picture{ display: contents; }

.nova-img{
  width: 78%;
  position: relative;
  z-index: 2;
  filter: drop-shadow(0 30px 50px rgba(181, 232, 83, 0.25));
  animation: float 6s ease-in-out infinite;
  margin: auto;
}

.nova-chip{
  position: absolute;
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,0.8);
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
  border-radius: 14px;
  padding: 10px 16px;
  font-size: 0.82rem;
  color: var(--uno-gray-900);
  font-weight: 500;
  display: flex; align-items: center; gap: 10px;
  z-index: 3;
  animation: float-bubble 5s ease-in-out infinite;
  white-space: nowrap;
}
.nova-chip .pulse{
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--uno-green-glow);
  box-shadow: 0 0 12px var(--uno-green-glow);
  animation: pulse-glow 1.6s ease-in-out infinite;
}
@keyframes pulse-glow{
  0%, 100%{ opacity: 1; }
  50%     { opacity: 0.4; }
}
.nova-chip-1{ top: 6%; right: 4%; }
.nova-chip-2{ top: 50%; left: -4%; animation-delay: 1.4s; }
.nova-chip-3{ bottom: 8%; right: 8%; animation-delay: 2.6s; }
.nova-chip-1 .pulse{ background: var(--uno-blue-bright); box-shadow: 0 0 12px var(--uno-blue-bright); }
.nova-chip-3 .pulse{ background: var(--uno-blue-bright); box-shadow: 0 0 12px var(--uno-blue-bright); }

@media (max-width: 900px){
  .nova-grid{ grid-template-columns: 1fr; gap: 40px; }
  .nova-visual{ max-width: 380px; margin: 0 auto; }
}

/* =========================================================================
   MAPA / TERRITORIO
   ========================================================================= */
.territory{
  padding: 120px 0;
  background: white;
}
.territory-grid{
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 60px;
  align-items: center;
}
.territory-content .eyebrow{ display: block; margin-bottom: 16px; }
.territory-content h2{ margin-bottom: 24px; }
.territory-content p{
  color: var(--uno-gray-600);
  font-size: 1.04rem;
  line-height: 1.7;
  margin-bottom: 28px;
}

.territory-list{
  list-style: none;
  display: grid; gap: 14px;
}
.territory-list li{
  display: flex; align-items: center; gap: 14px;
  font-size: 0.96rem;
  color: var(--uno-gray-900);
}
.territory-list li::before{
  content: '✓';
  width: 26px; height: 26px;
  background: rgba(139, 195, 74, 0.1);
  color: var(--uno-green);
  border-radius: 50%;
  display: grid; place-items: center;
  font-weight: 700;
  font-size: 0.78rem;
  flex-shrink: 0;
}

/* Visualización de provincias / mapa abstracto */
.map-visual{
  background: var(--uno-cream);
  border-radius: var(--radius-lg);
  padding: 36px;
  border: 1px solid rgba(15,61,34,0.06);
  box-shadow: var(--shadow-card);
  position: relative;
  overflow: hidden;
}
.map-header{
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(15,61,34,0.08);
}
.map-header strong{
  font-size: 0.98rem;
  font-weight: 600;
}
.map-status{
  display: inline-flex; align-items: center; gap: 8px;
  font-family: 'Barlow', sans-serif;
  font-size: 0.72rem;
  color: var(--uno-green);
  letter-spacing: 0.08em;
}
.map-status .pulse{
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--uno-green);
  box-shadow: 0 0 10px var(--uno-green);
  animation: pulse-glow 1.6s ease-in-out infinite;
}

.map-bars{
  display: grid; gap: 14px;
}
.map-bar{
  display: grid;
  grid-template-columns: 130px 1fr 60px;
  gap: 16px;
  align-items: center;
  font-size: 0.86rem;
}
.map-bar-name{ color: var(--uno-gray-900); font-weight: 500; }
.map-bar-track{
  height: 10px;
  background: rgba(85, 139, 47, 0.06);
  border-radius: 999px;
  overflow: hidden;
  position: relative;
}
.map-bar-fill{
  height: 100%;
  background: linear-gradient(90deg, var(--uno-green), var(--uno-green-bright));
  border-radius: 999px;
  position: relative;
  animation: grow-bar 1.6s var(--ease-smooth) forwards;
  transform-origin: left;
  transform: scaleX(0);
}
.map-bar-fill::after{
  content:'';
  position: absolute;
  right: -2px; top: -3px;
  width: 4px; height: 16px;
  background: var(--uno-green-bright);
  border-radius: 4px;
  box-shadow: 0 0 8px var(--uno-green-bright);
}
@keyframes grow-bar{
  to{ transform: scaleX(1); }
}
.map-bar-val{
  font-family: 'Barlow', sans-serif;
  font-size: 0.78rem;
  color: var(--uno-gray-600);
  text-align: right;
  font-weight: 500;
}

.map-foot{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  padding-top: 24px;
  margin-top: 24px;
  border-top: 1px solid rgba(15,61,34,0.08);
}
.map-foot-item .num{
  font-family: 'Orbitron', sans-serif;
  font-weight: 600;
  font-size: 1.6rem;
  color: var(--uno-green);
  letter-spacing: -0.02em;
  line-height: 1;
}
.map-foot-item .lab{
  font-size: 0.72rem;
  color: var(--uno-gray-600);
  margin-top: 4px;
  letter-spacing: 0.04em;
}

@media (max-width: 900px){
  .territory-grid{ grid-template-columns: 1fr; }
  .map-bar{ grid-template-columns: 100px 1fr 50px; gap: 10px; }
}

/* =========================================================================
   TESTIMONIO / VOCES
   ========================================================================= */
.voices{
  padding: 120px 0;
  background: var(--uno-cream);
}
.voices-head{
  display: flex; justify-content: space-between; align-items: end;
  margin-bottom: 60px;
  flex-wrap: wrap; gap: 24px;
}
.voices-head .eyebrow{ display: block; margin-bottom: 14px; }
.voices-head h2{ max-width: 720px; }

.voices-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.voice{
  background: white;
  border-radius: var(--radius-lg);
  padding: 32px;
  border: 1px solid rgba(15,61,34,0.06);
  display: flex; flex-direction: column;
  transition: all .35s var(--ease-smooth);
  position: relative;
}
.voice:hover{
  transform: translateY(-6px);
  box-shadow: var(--shadow-lift);
}
.voice-quote{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.15rem;
  line-height: 1.45;
  font-weight: 500;
  color: var(--uno-ink);
  margin-bottom: 28px;
  flex: 1;
  letter-spacing: -0.01em;
}
.voice-author{
  display: flex; align-items: center; gap: 14px;
  padding-top: 20px;
  border-top: 1px solid rgba(15,61,34,0.08);
}
.voice-avatar{
  width: 44px; height: 44px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--uno-green-deep), var(--uno-green));
  display: grid; place-items: center;
  color: white;
  font-weight: 600;
  font-family: 'Orbitron', sans-serif;
}
.voice-name{ font-weight: 600; font-size: 0.94rem; }
.voice-role{ font-size: 0.8rem; color: var(--uno-gray-600); }

@media (max-width: 900px){
  .voices-grid{ grid-template-columns: 1fr; }
}

/* =========================================================================
   ÚNETE (CTA grande con formulario)
   ========================================================================= */
.join{
  padding: 120px 0;
  background: white;
}
.join-card{
  background: linear-gradient(135deg, var(--uno-green-deep) 0%, var(--uno-green) 60%, var(--uno-green-bright) 100%);
  border-radius: var(--radius-xl);
  padding: 80px 60px;
  color: white;
  position: relative;
  overflow: hidden;
}
.join-card::before{
  content:'';
  position: absolute;
  width: 600px; height: 600px;
  border-radius: 50%;
  border: 1px dashed rgba(255,255,255,0.1);
  top: -200px; right: -150px;
  animation: rotate 80s linear infinite;
}
.join-card::after{
  content:'';
  position: absolute;
  width: 400px; height: 400px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.08);
  bottom: -100px; left: -100px;
  animation: rotate 60s linear infinite reverse;
}

.join-grid{
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  position: relative;
  z-index: 1;
}
.join-content{
  text-align: center;
  max-width: 720px;
}
.join-grid > .join-tabs{
  margin: 0 auto 4px;
}
.join-grid > .donate-pane,
.join-grid > .join-form{
  width: 100%;
  max-width: 560px;
}
.join-content .eyebrow{ color: var(--uno-green-glow); display: block; margin-bottom: 20px; }
.join-content h2{
  font-family: 'Orbitron', sans-serif;
  font-weight: 600;
  font-size: clamp(2.2rem, 4vw, 3.4rem);
  line-height: 1.05;
  margin-bottom: 20px;
  letter-spacing: -0.02em;
}
.join-content h2 em{
  font-style: italic;
  font-weight: 400;
  color: var(--uno-green-glow);
}
.join-content p{
  font-size: 1.04rem;
  color: rgba(255,255,255,0.8);
  line-height: 1.7;
  max-width: 460px;
}

.join-form{
  background: white;
  border-radius: var(--radius-lg);
  padding: 36px;
  color: var(--uno-ink);
  box-shadow: 0 30px 80px rgba(0,0,0,0.2);
}
.join-form-title{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.4rem;
  font-weight: 600;
  margin-bottom: 24px;
}
.field{
  margin-bottom: 16px;
}
.field label{
  display: block;
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--uno-gray-600);
  margin-bottom: 6px;
  letter-spacing: 0.02em;
}
.field input, .field select{
  width: 100%;
  padding: 14px 16px;
  border: 1px solid rgba(15,61,34,0.12);
  border-radius: var(--radius-sm);
  background: var(--uno-cream);
  font-family: inherit;
  font-size: 0.96rem;
  color: var(--uno-ink);
  transition: all .24s;
  outline: none;
}
.field input:focus, .field select:focus{
  border-color: var(--uno-green);
  background: white;
  box-shadow: 0 0 0 4px rgba(139, 195, 74, 0.12);
}
.field-row{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.form-submit{
  width: 100%;
  margin-top: 8px;
  padding: 16px;
  background: var(--uno-green);
  color: white;
  border-radius: var(--radius-sm);
  font-weight: 600;
  font-size: 1rem;
  display: flex; align-items: center; justify-content: center; gap: 10px;
  transition: all .24s;
}
.form-submit:hover{
  background: var(--uno-green-bright);
  transform: translateY(-1px);
  box-shadow: var(--shadow-green);
}

.form-note{
  font-size: 0.78rem;
  color: var(--uno-gray-600);
  text-align: center;
  margin-top: 12px;
}

@media (max-width: 900px){
  .join-card{ padding: 48px 28px; }
  .join-grid{ gap: 24px; }
  .join-form,
  .donate-pane{ padding: 28px; }
  .field-row{ grid-template-columns: 1fr; }
}

/* =========================================================================
   FOOTER
   ========================================================================= */
.footer{
  background: linear-gradient(180deg, var(--uno-silver) 0%, var(--uno-silver-mid) 100%);
  color: var(--uno-gray-700);
  padding: 80px 0 32px;
  position: relative;
  overflow: hidden;
}
.footer::before{
  content:'UNO';
  position: absolute;
  bottom: -60px; right: -20px;
  font-family: 'Orbitron', sans-serif;
  font-weight: 700;
  font-size: 24rem;
  color: rgba(43, 43, 43, 0.04);
  line-height: 0.8;
  letter-spacing: -0.05em;
  pointer-events: none;
}
.footer-grid{
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 60px;
  position: relative;
  z-index: 1;
}
.footer-brand{
  display: flex; align-items: center; gap: 14px;
  margin-bottom: 20px;
}
.footer-brand-mark{
  width: 44px; height: 44px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, var(--uno-green-bright), var(--uno-green) 60%, var(--uno-green-deep));
  position: relative;
}
.footer-brand-mark::after{
  content:''; position: absolute; inset: 8px;
  border: 2px solid rgba(255,255,255,0.85);
  border-bottom-color: transparent;
  border-right-color: transparent;
  border-radius: 50%;
  transform: rotate(-25deg);
}
.footer-brand strong{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.4rem;
  font-weight: 600;
  color: var(--uno-gray-900);
  letter-spacing: -0.01em;
}
.footer-brand span{ font-size: 0.78rem; color: var(--uno-gray-700); }
.footer-tag{
  font-size: 0.92rem;
  line-height: 1.6;
  max-width: 320px;
  margin-bottom: 24px;
}

.social-row{
  display: flex; gap: 10px;
}
.social-btn{
  width: 40px; height: 40px;
  border-radius: 50%;
  background: rgba(255,255,255,0.5);
  border: 1px solid rgba(255,255,255,0.8);
  display: grid; place-items: center;
  color: var(--uno-gray-800);
  transition: all .24s;
}
.social-btn:hover{
  background: var(--uno-blue);
  border-color: var(--uno-blue);
  color: white;
  transform: translateY(-2px);
}

.footer-col h4{
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--uno-gray-900);
  margin-bottom: 18px;
  font-weight: 600;
}
.footer-col ul{ list-style: none; display: grid; gap: 10px; }
.footer-col a{
  font-size: 0.92rem;
  color: var(--uno-gray-700);
  transition: color .2s;
}
.footer-col a:hover{ color: var(--uno-green-deep); }

.footer-bottom{
  padding-top: 32px;
  border-top: 1px solid rgba(43, 43, 43, 0.12);
  display: flex; justify-content: space-between; align-items: center;
  font-size: 0.82rem;
  color: var(--uno-gray-700);
  position: relative;
  z-index: 1;
  flex-wrap: wrap;
  gap: 12px;
}
.footer-bottom .legal a{ color: var(--uno-gray-700); margin-left: 20px; }
.footer-bottom .legal a:hover{ color: var(--uno-green-deep); }

@media (max-width: 900px){
  .footer-grid{ grid-template-columns: 1fr 1fr; gap: 32px; }
  .footer-brand{ grid-column: span 2; }
  .footer-tag{ max-width: 100%; }
}
@media (max-width: 540px){
  .footer-grid{ grid-template-columns: 1fr; }
  .footer-brand{ grid-column: span 1; }
}

/* =========================================================================
   Reveal animations
   ========================================================================= */
.reveal{
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .8s var(--ease-smooth), transform .8s var(--ease-smooth);
}
.reveal.in{
  opacity: 1;
  transform: translateY(0);
}

/* Scrollbar */
::-webkit-scrollbar{ width: 10px; }
::-webkit-scrollbar-track{ background: var(--uno-cream); }
::-webkit-scrollbar-thumb{
  background: rgba(139, 195, 74, 0.3);
  border-radius: 8px;
}
::-webkit-scrollbar-thumb:hover{ background: var(--uno-green); }

/* =========================================================================
   Verificación de cédula + modal
   ========================================================================= */
.field-hint{
  font-weight: 400;
  font-size: 0.7rem;
  color: var(--uno-gray-600);
  margin-left: 8px;
  letter-spacing: 0;
  text-transform: none;
}

.cedula-row{
  display: flex;
  gap: 10px;
  align-items: stretch;
}
.cedula-row input{ flex: 1; min-width: 0; }
.btn-verify{
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 22px;
  min-height: 50px;
  background: var(--uno-green);
  color: white;
  border: 1px solid var(--uno-green);
  border-radius: var(--radius-sm);
  font-weight: 700;
  font-size: 0.95rem;
  cursor: pointer;
  transition: all .2s;
  white-space: nowrap;
  box-shadow: 0 2px 8px rgba(111, 190, 68, 0.28);
}
.btn-verify svg{ width: 18px; height: 18px; }
.btn-verify:hover:not(:disabled){
  background: var(--uno-green-bright);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(111, 190, 68, 0.4);
}
.btn-verify:active:not(:disabled){ transform: translateY(0); }
.btn-verify:disabled{ opacity: .6; cursor: wait; }

/* Campos lockeados (autocompletados desde la verificación JCE) */
.field input.locked,
.field select.locked{
  background: #F1EFE9 !important;
  color: var(--uno-gray-600) !important;
  cursor: not-allowed;
  border-color: rgba(15, 61, 34, 0.06);
  pointer-events: none;
}
.field input.locked:focus,
.field select.locked:focus{
  box-shadow: none;
}

/* Fila de teléfonos con botón "igualar" en el medio */
.phones-row{
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 10px;
  align-items: end;
}
.phones-link{
  margin-bottom: 16px; /* iguala con .field margin-bottom para alinear con el input */
  display: flex;
  align-items: center;
  justify-content: center;
}
.btn-equalize{
  width: 38px;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: white;
  color: var(--uno-green-deep);
  border: 1px solid rgba(15, 61, 34, 0.12);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: all .2s;
}
.btn-equalize:hover{
  background: var(--uno-green);
  color: white;
  border-color: var(--uno-green);
  transform: translateY(-1px);
}
.btn-equalize:active{ transform: translateY(0); }
@media (max-width: 540px){
  .phones-row{ grid-template-columns: 1fr; }
  .phones-link{ margin: 0 0 12px; }
  .btn-equalize{ width: auto; padding: 0 16px; }
}

.cedula-foto[hidden]{ display: none !important; }
.cedula-foto{
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px;
  margin-bottom: 18px;
  background: rgba(139, 195, 74, 0.08);
  border: 1px solid rgba(139, 195, 74, 0.24);
  border-radius: var(--radius-sm);
}
.cedula-foto img{
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: 50%;
  border: 2px solid white;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
}
.cedula-foto-tag{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.84rem;
  font-weight: 600;
  color: var(--uno-green-deep);
}

/* ----- Modal ----- */
.modal-backdrop[hidden]{ display: none !important; }
.modal-backdrop{
  position: fixed; inset: 0;
  background: rgba(15, 61, 34, 0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center;
  z-index: 999;
  padding: 20px;
  animation: modalFadeIn .2s ease-out;
}
@keyframes modalFadeIn{ from{ opacity: 0; } to{ opacity: 1; } }

.modal-card{
  position: relative;
  background: white;
  border-radius: 16px;
  max-width: 540px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  padding: 28px;
  box-shadow: 0 24px 64px rgba(0,0,0,.24);
  animation: modalSlideIn .28s cubic-bezier(.2,.9,.3,1.2);
}
@keyframes modalSlideIn{
  from{ opacity: 0; transform: translateY(20px) scale(.98); }
  to{ opacity: 1; transform: translateY(0) scale(1); }
}

.modal-close{
  position: absolute;
  top: 14px; right: 14px;
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--uno-cream);
  color: var(--uno-gray-600);
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: all .2s;
}
.modal-close:hover{
  background: var(--uno-ink);
  color: white;
}

.modal-header{ margin-bottom: 18px; }
.modal-tag{
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--uno-green-deep);
  background: rgba(139, 195, 74, 0.14);
  padding: 4px 10px;
  border-radius: 99px;
  margin-bottom: 8px;
}
.modal-header h3{
  font-family: var(--font-display, 'Orbitron', sans-serif);
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--uno-ink);
  margin: 0 0 4px;
}
.modal-sub{
  font-size: 0.9rem;
  color: var(--uno-gray-600);
  margin: 0;
}
.modal-header.modal-warn h3{ color: #C9851D; }
.modal-header.modal-error h3{ color: #C7301E; }

.modal-id{
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px;
  background: var(--uno-cream);
  border-radius: 12px;
  margin-bottom: 16px;
}
.modal-foto{
  width: 72px; height: 72px;
  object-fit: cover;
  border-radius: 50%;
  border: 3px solid white;
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
  flex: 0 0 auto;
}
.modal-id-name strong{
  display: block;
  font-size: 1.05rem;
  color: var(--uno-ink);
  margin-bottom: 2px;
}
.modal-id-name span{
  font-family: 'Barlow', sans-serif;
  font-size: 0.84rem;
  color: var(--uno-gray-600);
}

.modal-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 16px;
  margin: 0 0 22px;
  padding: 16px;
  background: var(--uno-cream);
  border-radius: 12px;
  font-size: 0.86rem;
}
.modal-grid dt{
  color: var(--uno-gray-600);
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-top: 4px;
}
.modal-grid dd{
  margin: 0 0 6px;
  color: var(--uno-ink);
  font-weight: 500;
  word-break: break-word;
}

.modal-actions{
  display: flex;
  gap: 10px;
  justify-content: flex-end;
}
.modal-actions .btn{
  padding: 12px 20px;
  font-size: 0.92rem;
}

@media (max-width: 540px){
  .modal-card{ padding: 22px; }
  .modal-grid{ grid-template-columns: 1fr; }
  .btn-verify{ padding: 0 14px; font-size: 0.88rem; }
  .btn-verify svg{ width: 16px; height: 16px; }
}

/* Modal de bienvenida (seteo de clave tras registro) */
.welcome-msg{
  font-size: 0.95rem;
  color: var(--uno-ink);
  margin: 0 0 18px;
  line-height: 1.55;
}
.form-hint{
  font-size: 0.78rem;
  color: var(--uno-gray-600);
  margin: -6px 0 14px;
}
.welcome-status{
  font-size: 0.86rem;
  margin: 8px 0 14px;
  padding: 10px 12px;
  border-radius: 8px;
  font-weight: 500;
}
.welcome-status.ok{
  background: rgba(78, 154, 45, 0.10);
  color: var(--uno-green-deep);
  border: 1px solid rgba(78, 154, 45, 0.24);
}
.welcome-status.err{
  background: rgba(199, 48, 30, 0.08);
  color: #C7301E;
  border: 1px solid rgba(199, 48, 30, 0.20);
}

/* Hero del modal de bienvenida con UNIX */
.welcome-hero{
  display: flex;
  justify-content: center;
  align-items: flex-end;
  margin: -28px -28px 8px;
  padding: 18px 28px 0;
  background:
    radial-gradient(ellipse 60% 80% at 50% 100%, rgba(139, 195, 74, 0.18), transparent 70%),
    linear-gradient(180deg, rgba(139, 195, 74, 0.06), transparent);
  border-radius: 16px 16px 0 0;
}
.welcome-img{
  width: 160px;
  height: auto;
  max-height: 200px;
  object-fit: contain;
  filter: drop-shadow(0 8px 18px rgba(78, 154, 45, 0.18));
}
.welcome-head{ text-align: center; margin-bottom: 12px !important; }
.welcome-head .modal-sub{ margin-top: 6px; }
@media (max-width: 540px){
  .welcome-hero{ margin: -22px -22px 6px; padding-top: 14px; }
  .welcome-img{ width: 130px; max-height: 160px; }
}

/* ===== Welcome modal compactado (todo visible sin scroll) ===== */
.modal-card:has(.welcome-hero){ padding: 0 24px 22px; max-width: 480px; }
.welcome-hero{ margin: 0 -24px 4px; padding: 12px 24px 0; }
.welcome-img{ width: 130px; max-height: 150px; }
.welcome-head{ margin-bottom: 8px !important; text-align: center; }
.welcome-head h3{ font-size: 1.35rem !important; line-height: 1.15; }
.welcome-head .modal-sub{ margin-top: 4px; font-size: 0.85rem; }
.modal-card .welcome-msg{ font-size: 0.9rem; margin-bottom: 12px; text-align: center; }
.modal-card .field{ margin-bottom: 10px; }
.modal-card .form-hint{ margin: -2px 0 8px; }
.modal-card .modal-actions{ margin-top: 6px; }
.modal-actions-center{ justify-content: center !important; }

/* Toggle de visibilidad de clave */
.pwd-row{
  position: relative;
  display: flex;
  align-items: stretch;
}
.pwd-row input{ flex: 1; padding-right: 46px !important; }
.pwd-toggle{
  position: absolute;
  right: 6px; top: 50%;
  transform: translateY(-50%);
  width: 36px; height: 36px;
  display: inline-flex; align-items: center; justify-content: center;
  background: transparent;
  color: var(--uno-gray-600);
  border-radius: 8px;
  cursor: pointer;
  transition: all .18s;
}
.pwd-toggle:hover{ background: rgba(0,0,0,.05); color: var(--uno-green-deep); }
.pwd-toggle svg{ width: 18px; height: 18px; }
.pwd-toggle .eye-off{ display: none; }
.pwd-toggle.on .eye-on{ display: none; }
.pwd-toggle.on .eye-off{ display: block; color: var(--uno-green-deep); }

@media (max-width: 540px){
  .modal-card:has(.welcome-hero){ padding: 0 18px 18px; }
  .welcome-hero{ margin: 0 -18px 4px; padding-top: 10px; }
  .welcome-img{ width: 110px; max-height: 130px; }
  .welcome-head h3{ font-size: 1.2rem !important; }
}

/* =========================================================================
   Estado logueado — afiliado autenticado
   ========================================================================= */

/* Ocultar opciones de registro cuando hay sesión */
body.logged-in #unete,
body.logged-in .hero-ctas a[href="#unete"]{ display: none !important; }

/* Secciones auth-only: ocultas por default, visibles al loguearse */
.auth-section{
  display: none;
  padding: 80px 0;
  background: var(--uno-cream);
}
.auth-section h2{ margin: 14px 0 10px; }
.auth-section .auth-placeholder{
  margin-top: 28px;
  padding: 40px;
  text-align: center;
  background: white;
  border-radius: 16px;
  border: 1px dashed rgba(15, 61, 34, 0.12);
  color: var(--uno-gray-600);
}
.auth-section .auth-placeholder svg{
  margin: 0 auto 12px;
  color: var(--uno-green);
  opacity: 0.6;
}
.auth-section .auth-placeholder p{ font-size: 0.92rem; }
body.logged-in .auth-section{ display: block; }

/* Pildora de usuario en el nav */
.user-pill[hidden]{ display: none !important; }
.user-pill{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 14px 6px 6px;
  background: white;
  border: 1px solid rgba(15, 61, 34, 0.1);
  border-radius: 999px;
  font-size: 0.86rem;
  font-weight: 600;
  color: var(--uno-ink);
  cursor: pointer;
  transition: all .2s;
  box-shadow: var(--shadow-soft);
}
.user-pill:hover{
  background: var(--uno-cream);
  border-color: var(--uno-green);
}
.user-pill-avatar{
  width: 30px; height: 30px;
  border-radius: 50%;
  background: var(--uno-green) center/cover no-repeat;
  color: white;
  font-size: 0.78rem;
  font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 auto;
}
.user-pill-name{
  max-width: 110px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.user-pill-logout{
  display: inline-flex;
  color: var(--uno-gray-600);
  margin-left: 2px;
  transition: color .18s;
}
.user-pill:hover .user-pill-logout{ color: var(--uno-green-deep); }

/* Items auth en el nav: visibles solo cuando hay sesión */
.nav-auth[hidden]{ display: none !important; }

/* Link "Soy Uno" en el nav — acceso al portal del afiliado */
.nav-soy-uno{
  padding: 8px 16px;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--uno-green-deep);
  border-radius: 999px;
  border: 1px solid rgba(78, 154, 45, 0.20);
  background: rgba(139, 195, 74, 0.08);
  transition: all .24s var(--ease-smooth);
}
.nav-soy-uno:hover{
  background: var(--uno-green);
  color: white;
  border-color: var(--uno-green);
}

/* =========================================================================
   Portal del afiliado — /afiliados/
   ========================================================================= */
.afiliados-shell{
  min-height: calc(100vh - 200px);
  padding: 140px 0 80px;
  display: flex; align-items: center;
  background:
    radial-gradient(ellipse 50% 40% at 80% 20%, rgba(168, 230, 108, 0.10), transparent 60%),
    radial-gradient(ellipse 40% 35% at 20% 80%, rgba(111, 190, 68, 0.08), transparent 60%),
    var(--uno-cream);
}
.afiliados-shell .container{ display: flex; justify-content: center; }

.afiliados-card{
  width: 100%;
  max-width: 460px;
  background: white;
  border-radius: 24px;
  padding: 18px 32px 32px;
  box-shadow: var(--shadow-card);
  text-align: center;
  border: 1px solid rgba(15, 61, 34, 0.06);
}
.afiliados-card[hidden]{ display: none !important; }

.afiliados-hero-img{
  width: 130px;
  height: auto;
  max-height: 150px;
  margin: 0 auto 6px;
  filter: drop-shadow(0 8px 18px rgba(78, 154, 45, 0.18));
  object-fit: contain;
}
.afiliados-card .modal-tag{
  display: inline-block;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--uno-green-deep);
  background: rgba(139, 195, 74, 0.14);
  padding: 4px 12px;
  border-radius: 99px;
  margin-bottom: 8px;
}
.afiliados-card h1{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.6rem;
  font-weight: 600;
  color: var(--uno-ink);
  line-height: 1.15;
  margin: 0 0 10px;
}
.afiliados-intro{
  font-size: 0.92rem;
  color: var(--uno-gray-600);
  line-height: 1.55;
  margin: 0 0 22px;
}

.afiliados-form{ text-align: left; margin: 0 auto; max-width: 360px; }
.afiliados-form .field{ margin-bottom: 12px; }

.afiliados-form .form-note{ margin-top: 14px; }
.afiliados-form .form-note a{ color: var(--uno-green-deep); font-weight: 600; }
.afiliados-form .form-note a:hover{ text-decoration: underline; }

.afiliados-meta{
  display: inline-flex;
  gap: 18px;
  padding: 10px 18px;
  background: var(--uno-cream);
  border-radius: 12px;
  margin: 8px 0 18px;
}
.afiliados-meta > div{ display: flex; flex-direction: column; align-items: center; }
.afiliados-meta span{
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--uno-gray-600);
}
.afiliados-meta strong{
  font-family: 'Barlow', sans-serif;
  font-size: 0.92rem;
  color: var(--uno-ink);
  margin-top: 2px;
}

.afiliados-actions{
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 8px;
}
.afiliados-actions .btn{ padding: 12px 20px; font-size: 0.92rem; }

@media (max-width: 540px){
  .afiliados-shell{ padding: 110px 0 60px; }
  .afiliados-card{ padding: 14px 22px 22px; border-radius: 18px; }
  .afiliados-hero-img{ width: 110px; max-height: 130px; }
  .afiliados-card h1{ font-size: 1.35rem; }
}

/* =========================================================================
   Botón "Leer manifiesto completo" + documento dentro del modal
   ========================================================================= */
.manifesto-cta{
  display: flex;
  justify-content: center;
  margin-top: 36px;
}
.manifesto-cta .btn{
  padding: 14px 26px;
  font-size: 0.95rem;
}

/* Documento del manifiesto dentro del modal */
.modal-card .manifesto-doc{
  text-align: left;
}
.manifesto-doc h2{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.7rem;
  font-weight: 600;
  color: var(--uno-ink);
  margin: 8px 0 6px;
  letter-spacing: -0.01em;
  line-height: 1.15;
}
.manifesto-doc h3{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--uno-green-deep);
  margin: 22px 0 8px;
}
.manifesto-doc p{
  font-size: 0.96rem;
  line-height: 1.65;
  color: var(--uno-ink);
  margin: 0 0 12px;
}
.manifesto-doc-lead{
  font-size: 1.05rem !important;
  color: var(--uno-gray-700) !important;
  margin-bottom: 18px !important;
}
.manifesto-doc blockquote{
  margin: 12px 0 18px;
  padding: 16px 20px;
  background: rgba(139, 195, 74, 0.08);
  border-left: 3px solid var(--uno-green);
  border-radius: 0 12px 12px 0;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--uno-ink);
}
.manifesto-doc-list{
  margin: 6px 0 12px;
  padding-left: 24px;
}
.manifesto-doc-list li{
  margin: 0 0 12px;
  line-height: 1.6;
  font-size: 0.94rem;
}
.manifesto-doc-list li strong{ color: var(--uno-green-deep); }
.manifesto-doc-close{
  margin: 22px 0 16px !important;
  padding: 14px 18px;
  background: linear-gradient(135deg, rgba(78, 154, 45, 0.10), rgba(139, 195, 74, 0.06));
  border-radius: 12px;
  text-align: center;
  font-size: 1rem !important;
}

/* Modal más ancho cuando lleva el documento del manifiesto */
.modal-card:has(.manifesto-doc){ max-width: 680px; }

@media (max-width: 540px){
  .manifesto-doc h2{ font-size: 1.4rem; }
  .manifesto-doc h3{ font-size: 1.05rem; }
  .manifesto-doc p, .manifesto-doc-list li{ font-size: 0.92rem; }
}

/* =========================================================================
   Tarjetas de principios — variantes de color (verdes y azules claros)
   ========================================================================= */
.principle-c1{ background: #E8F5DA; border-color: rgba(111, 190, 68, 0.18); }   /* verde pasto */
.principle-c2{ background: #DAEEFB; border-color: rgba(45, 127, 249, 0.18); }   /* azul cielo  */
.principle-c3{ background: #DFF3E8; border-color: rgba(78, 154, 45, 0.18); }    /* verde menta */
.principle-c4{ background: #E5EEFB; border-color: rgba(45, 127, 249, 0.16); }   /* azul claro  */
.principle-c5{ background: #E8F4D6; border-color: rgba(111, 190, 68, 0.20); }   /* lima suave */
.principle-c6{ background: #D7EEF6; border-color: rgba(45, 127, 249, 0.20); }   /* aqua suave  */

/* Acento en el título según la variante */
.principle-c1 .principle-title,
.principle-c3 .principle-title,
.principle-c5 .principle-title{ color: var(--uno-green-deep); }
.principle-c2 .principle-title,
.principle-c4 .principle-title,
.principle-c6 .principle-title{ color: #1862C2; } /* azul un poco más profundo */

/* Hover: cada tarjeta se llena con su tono saturado */
.principle-c1:hover::after{ background: linear-gradient(135deg, var(--uno-green-deep), var(--uno-green)); }
.principle-c2:hover::after{ background: linear-gradient(135deg, #1862C2, var(--uno-blue)); }
.principle-c3:hover::after{ background: linear-gradient(135deg, var(--uno-green-deep), #5BA86F); }
.principle-c4:hover::after{ background: linear-gradient(135deg, var(--uno-blue), var(--uno-blue-bright)); }
.principle-c5:hover::after{ background: linear-gradient(135deg, var(--uno-green), var(--uno-green-bright)); }
.principle-c6:hover::after{ background: linear-gradient(135deg, #1F87C2, var(--uno-blue-bright)); }

/* =========================================================================
   Portal del Afiliado — layout interno (top bar + sidebar + main)
   ========================================================================= */

body.afiliado-portal{
  background: #F4F6F2;
  overflow-x: hidden;
}

/* ----- Top bar ----- */
.portal-topbar{
  position: sticky;
  top: 0;
  z-index: 50;
  background: white;
  border-bottom: 1px solid rgba(15, 61, 34, 0.08);
  box-shadow: 0 1px 3px rgba(0,0,0,0.02);
}
.portal-topbar-inner{
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 24px;
  height: 64px;
  max-width: 1480px;
  margin: 0 auto;
}
.portal-burger{
  display: none;
  width: 40px; height: 40px;
  border-radius: 10px;
  align-items: center; justify-content: center;
  color: var(--uno-ink);
  background: transparent;
  cursor: pointer;
  transition: background .18s;
}
.portal-burger:hover{ background: var(--uno-cream); }

.portal-brand{
  display: flex; align-items: center; gap: 10px;
  font-weight: 600;
}
.portal-brand-mark{
  width: 32px; height: 32px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, var(--uno-green-bright), var(--uno-green) 60%, var(--uno-green-deep));
  position: relative;
  box-shadow: inset 0 -2px 4px rgba(0,0,0,0.18);
  flex: 0 0 auto;
}
.portal-brand-mark::after{
  content:''; position: absolute; inset: 6px;
  border: 2px solid rgba(255,255,255,0.85);
  border-bottom-color: transparent;
  border-right-color: transparent;
  border-radius: 50%;
  transform: rotate(-25deg);
}
.portal-brand-text{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--uno-ink);
  letter-spacing: 0.02em;
}
.portal-brand-tag{
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--uno-gray-600);
  padding-left: 10px;
  border-left: 1px solid rgba(15, 61, 34, 0.12);
  margin-left: 4px;
}

/* ----- Botón "Portal principal" en topbar ----- */
.portal-link-public{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: 14px;
  padding: 7px 12px;
  background: var(--uno-cream);
  border: 1px solid var(--uno-gray-100);
  color: var(--uno-gray-700);
  border-radius: 10px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: all .15s;
}
.portal-link-public:hover{
  background: var(--uno-green-deep);
  color: white;
  border-color: var(--uno-green-deep);
}
@media (max-width: 720px){
  .portal-link-public span{ display: none; }
  .portal-link-public{ padding: 7px 9px; }
}

/* ----- Botón UNIX (avatar pequeño) en la barra superior ----- */
.portal-unix-btn{
  margin-left: auto;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: linear-gradient(135deg, #6FBE44 0%, #4E9A2D 100%);
  padding: 2px;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(15, 61, 34, 0.18);
  transition: transform .18s ease, box-shadow .18s ease;
  flex-shrink: 0;
}
.portal-unix-btn:hover{
  transform: scale(1.08);
  box-shadow: 0 4px 14px rgba(15, 61, 34, 0.28);
}
.portal-unix-btn picture,
.portal-unix-btn img{
  width: 100%;
  height: 100%;
  border-radius: 50%;
  display: block;
  object-fit: cover;
  background: white;
}
.portal-unix-pulse{
  position: absolute;
  top: -2px;
  right: -2px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #8BD15F;
  border: 2px solid white;
  box-shadow: 0 0 0 0 rgba(111, 190, 68, 0.55);
  animation: unixPulse 2s infinite;
}

/* ----- Botón "Mis datos" arriba a la derecha + dropdown ----- */
.portal-user-wrap{
  margin-left: 10px;
  position: relative;
}
.portal-user{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 14px 6px 6px;
  background: var(--uno-cream);
  border: 1px solid rgba(15, 61, 34, 0.08);
  border-radius: 999px;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--uno-ink);
  cursor: pointer;
  transition: all .18s;
}
.portal-user:hover{
  background: white;
  border-color: var(--uno-green);
  box-shadow: 0 4px 12px rgba(78, 154, 45, 0.10);
}
.portal-user-avatar{
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--uno-green) center/cover no-repeat;
  color: white;
  font-size: 0.86rem;
  font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 auto;
}
.portal-user-name{
  font-size: 0.88rem;
  font-weight: 600;
}

.portal-user-menu{
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 260px;
  background: white;
  border-radius: 14px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12), 0 2px 6px rgba(0, 0, 0, 0.04);
  border: 1px solid rgba(15, 61, 34, 0.08);
  overflow: hidden;
  animation: portalMenuIn .18s ease-out;
}
.portal-user-menu[hidden]{ display: none; }
@keyframes portalMenuIn{
  from{ opacity: 0; transform: translateY(-6px); }
  to{ opacity: 1; transform: translateY(0); }
}

.portal-user-card{
  padding: 14px 16px;
  display: flex; align-items: center; gap: 12px;
  background: var(--uno-cream);
  border-bottom: 1px solid rgba(15, 61, 34, 0.06);
}
.portal-user-card-avatar{
  width: 42px; height: 42px;
  border-radius: 50%;
  background: var(--uno-green) center/cover no-repeat;
  color: white;
  font-size: 1rem;
  font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 auto;
}
.portal-user-card strong{
  display: block;
  font-size: 0.94rem;
  color: var(--uno-ink);
  line-height: 1.25;
}
.portal-user-card span{
  font-size: 0.78rem;
  color: var(--uno-gray-600);
  margin-top: 2px;
  display: block;
}

.portal-user-item{
  display: flex; align-items: center; gap: 10px;
  width: 100%;
  padding: 12px 16px;
  font-size: 0.9rem;
  color: var(--uno-ink);
  font-weight: 500;
  text-align: left;
  background: white;
  cursor: pointer;
  transition: background .15s;
  border: none;
}
.portal-user-item:hover{ background: var(--uno-cream); }
.portal-user-item.active{ color: var(--uno-green-deep); background: rgba(139, 195, 74, 0.08); }
.portal-user-item svg{ flex: 0 0 auto; color: var(--uno-gray-600); }
.portal-user-item.active svg{ color: var(--uno-green-deep); }
.portal-user-logout{
  border-top: 1px solid rgba(15, 61, 34, 0.06);
  color: #C7301E;
}
.portal-user-logout svg{ color: #C7301E; }
.portal-user-logout:hover{ background: rgba(199, 48, 30, 0.06); }

/* ----- Shell (sidebar + main) ----- */
.portal-shell{
  display: grid;
  grid-template-columns: 240px 1fr;
  max-width: 1480px;
  margin: 0 auto;
  min-height: calc(100vh - 64px);
}

.portal-sidebar{
  padding: 24px 14px;
  border-right: 1px solid rgba(15, 61, 34, 0.06);
  background: white;
}
.portal-sidebar nav{
  display: flex;
  flex-direction: column;
  gap: 4px;
  position: sticky;
  top: 88px; /* 64 topbar + 24 padding */
  max-height: calc(100vh - 112px); /* topbar + padding + breathing room */
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: 4px; /* aire para el scrollbar */
  scrollbar-width: thin;
  scrollbar-color: var(--uno-gray-300) transparent;
}
.portal-sidebar nav::-webkit-scrollbar{ width: 6px; }
.portal-sidebar nav::-webkit-scrollbar-track{ background: transparent; }
.portal-sidebar nav::-webkit-scrollbar-thumb{
  background: var(--uno-gray-300);
  border-radius: 3px;
}
.portal-sidebar nav::-webkit-scrollbar-thumb:hover{ background: var(--uno-gray-600); }
.portal-nav-item{
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px;
  font-size: 0.92rem;
  font-weight: 500;
  color: var(--uno-gray-700);
  border-radius: 10px;
  transition: all .18s;
}
.portal-nav-item:hover{
  background: var(--uno-cream);
  color: var(--uno-ink);
}
.portal-nav-item.active{
  background: rgba(139, 195, 74, 0.14);
  color: var(--uno-green-deep);
  font-weight: 600;
}
.portal-nav-item.active svg{ color: var(--uno-green-deep); }
.portal-nav-item svg{ color: var(--uno-gray-600); flex: 0 0 auto; transition: color .18s; }

/* ----- Main content ----- */
.portal-main{
  padding: 32px 40px 64px;
  min-width: 0; /* permite que el grid se encoja */
}
.portal-section{ display: none; }
.portal-section.active{ display: block; animation: sectionFadeIn .25s ease-out; }
@keyframes sectionFadeIn{
  from{ opacity: 0; transform: translateY(6px); }
  to{ opacity: 1; transform: translateY(0); }
}
.portal-section-head{ margin-bottom: 28px; }
.portal-section-head .eyebrow{ display: block; margin-bottom: 8px; }
.portal-section-head h1{
  font-family: 'Orbitron', sans-serif;
  font-size: 2rem;
  font-weight: 700;
  color: var(--uno-ink);
  letter-spacing: -0.01em;
  margin: 0 0 8px;
}
.portal-section-head p{
  font-size: 0.98rem;
  color: var(--uno-gray-700);
  max-width: 640px;
  line-height: 1.55;
}

.portal-placeholder{
  margin-top: 12px;
  padding: 56px 32px;
  text-align: center;
  background: white;
  border-radius: 16px;
  border: 1px dashed rgba(15, 61, 34, 0.14);
}
.portal-placeholder svg{
  margin: 0 auto 14px;
  color: var(--uno-green);
  opacity: 0.55;
}
.portal-placeholder strong{
  display: block;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--uno-ink);
  margin-bottom: 4px;
}
.portal-placeholder span{
  display: block;
  font-size: 0.92rem;
  color: var(--uno-gray-600);
}

/* ===== Mobile ===== */
@media (max-width: 900px){
  .portal-burger{ display: inline-flex; }
  .portal-brand-tag{ display: none; }
  .portal-user-name{ display: none; }
  .portal-user{ padding: 4px; }

  .portal-shell{ grid-template-columns: 1fr; }

  .portal-sidebar{
    position: fixed;
    top: 64px; left: 0;
    height: calc(100vh - 64px);
    width: 260px;
    transform: translateX(-100%);
    transition: transform .25s var(--ease-smooth);
    box-shadow: 4px 0 24px rgba(0,0,0,0.08);
    z-index: 40;
    overflow-y: auto;
  }
  .portal-sidebar.open{ transform: translateX(0); }
  .portal-sidebar nav{ position: static; }

  .portal-main{ padding: 24px 20px 48px; }
  .portal-section-head h1{ font-size: 1.5rem; }
  .portal-placeholder{ padding: 40px 22px; }

  .portal-user-menu{
    right: -8px;
    min-width: 240px;
  }
}

@media (max-width: 540px){
  .portal-topbar-inner{ padding: 10px 14px; }
  .portal-brand-text{ font-size: 1rem; }
  .portal-section-head h1{ font-size: 1.3rem; }
}

/* =========================================================================
   Noticias (sección del portal del afiliado)
   ========================================================================= */
.news-list{
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}
.news-card{
  background: white;
  border-radius: 14px;
  border: 1px solid rgba(15, 61, 34, 0.06);
  transition: all .22s var(--ease-smooth);
  overflow: hidden;
}
.news-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(78, 154, 45, 0.10), 0 2px 6px rgba(0,0,0,0.04);
  border-color: rgba(111, 190, 68, 0.30);
}
.news-card-link{
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 18px;
  padding: 16px;
  color: inherit;
}
.news-card:not(:has(.news-card-image)) .news-card-link{
  grid-template-columns: 1fr;
}
.news-card-image{
  border-radius: 10px;
  overflow: hidden;
  background: var(--uno-cream);
  aspect-ratio: 4/3;
}
.news-card-image img{
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.news-card-body{ display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.news-card-meta{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.news-card-cat{
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--uno-green-deep);
  background: rgba(139, 195, 74, 0.14);
  padding: 3px 9px;
  border-radius: 99px;
}
.news-card-flag{
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 99px;
}
.flag-breaking{ background: #FEE2E2; color: #B91C1C; }
.flag-featured{ background: #FEF3C7; color: #92400E; }
.flag-trending{ background: rgba(45, 127, 249, 0.12); color: #1862C2; }

.news-card-title{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.05rem;
  font-weight: 600;
  letter-spacing: -0.005em;
  line-height: 1.25;
  color: var(--uno-ink);
  margin: 0;
}
.news-card:hover .news-card-title{ color: var(--uno-green-deep); }
.news-card-excerpt{
  font-size: 0.92rem;
  line-height: 1.5;
  color: var(--uno-gray-700);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.news-card-foot{
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 4px;
  font-size: 0.78rem;
  color: var(--uno-gray-600);
}
.news-card-source{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: var(--uno-gray-700);
}
.news-card-source-logo{
  width: 16px; height: 16px;
  object-fit: contain;
  border-radius: 3px;
}
.news-card-date{ color: var(--uno-gray-600); }
.news-card-arrow{
  margin-left: auto;
  color: var(--uno-gray-600);
  transition: transform .2s, color .2s;
}
.news-card:hover .news-card-arrow{
  color: var(--uno-green-deep);
  transform: translate(2px, -2px);
}

.news-card-breaking{ border-color: rgba(185, 28, 28, 0.20); }
.news-card-featured .news-card-image{ position: relative; }

@media (max-width: 700px){
  .news-card-link{ grid-template-columns: 1fr; gap: 12px; padding: 14px; }
  .news-card-image{ aspect-ratio: 16/9; }
  .news-card-title{ font-size: 1rem; }
}

/* Filtro de noticias (search + categoría) */
.news-filters{
  display: grid;
  grid-template-columns: 1fr 220px auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 18px;
  padding: 12px;
  background: white;
  border-radius: 12px;
  border: 1px solid rgba(15, 61, 34, 0.06);
}
.news-filter-search{
  position: relative;
  display: flex;
  align-items: center;
}
.news-filter-search svg{
  position: absolute;
  left: 12px;
  color: var(--uno-gray-600);
  pointer-events: none;
}
.news-filter-search input{
  width: 100%;
  padding: 10px 12px 10px 36px;
  border: 1px solid rgba(15, 61, 34, 0.10);
  border-radius: 8px;
  background: var(--uno-cream);
  font-family: inherit;
  font-size: 0.92rem;
  color: var(--uno-ink);
  transition: all .18s;
  outline: none;
}
.news-filter-search input:focus{
  border-color: var(--uno-green);
  background: white;
  box-shadow: 0 0 0 3px rgba(139, 195, 74, 0.12);
}
.news-filter-search input::-webkit-search-cancel-button{
  cursor: pointer;
}
#news-category-filter{
  width: 100%;
  padding: 10px 12px;
  border: 1px solid rgba(15, 61, 34, 0.10);
  border-radius: 8px;
  background: var(--uno-cream);
  font-family: inherit;
  font-size: 0.92rem;
  color: var(--uno-ink);
  cursor: pointer;
  transition: all .18s;
}
#news-category-filter:focus{
  border-color: var(--uno-green);
  background: white;
  box-shadow: 0 0 0 3px rgba(139, 195, 74, 0.12);
  outline: none;
}
.news-filter-count{
  font-size: 0.84rem;
  font-weight: 600;
  color: var(--uno-gray-600);
  white-space: nowrap;
  padding: 0 8px;
}

.news-empty-filter{
  text-align: center;
  padding: 40px 20px;
  background: white;
  border-radius: 12px;
  border: 1px dashed rgba(15, 61, 34, 0.14);
  color: var(--uno-gray-600);
}
.news-empty-filter[hidden]{ display: none; }
.news-empty-filter strong{
  display: block;
  font-size: 1rem;
  color: var(--uno-ink);
  margin-bottom: 4px;
}
.news-empty-filter span{ font-size: 0.9rem; }

@media (max-width: 700px){
  .news-filters{
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 10px;
  }
  .news-filter-count{ text-align: center; padding: 0; }
}

/* =========================================================================
   Mis datos — formulario de perfil del afiliado
   ========================================================================= */
.mis-datos-form{
  display: flex;
  flex-direction: column;
  gap: 18px;
  max-width: 880px;
}
.mis-datos-card{
  background: white;
  border-radius: 14px;
  border: 1px solid rgba(15, 61, 34, 0.06);
  padding: 22px 24px;
}
.mis-datos-card-head{
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; margin-bottom: 14px;
}
.mis-datos-card-head h2{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--uno-ink);
  margin: 0;
}
.mis-datos-tag{
  font-size: 0.7rem; font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--uno-green-deep);
  background: rgba(139, 195, 74, 0.14);
  padding: 4px 10px; border-radius: 99px;
}
.mis-datos-help{
  font-size: 0.88rem;
  color: var(--uno-gray-600);
  margin: -4px 0 14px;
}

/* Identidad: foto + dl */
.mis-datos-identity{
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 22px;
  align-items: center;
}
.mis-datos-foto, .mis-datos-foto-fallback{
  width: 96px; height: 96px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid white;
  box-shadow: 0 4px 14px rgba(0,0,0,.10);
  flex: 0 0 auto;
}
.mis-datos-foto-fallback{
  background: var(--uno-green);
  color: white;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: 'Orbitron', sans-serif;
  font-size: 2.2rem; font-weight: 700;
}
.mis-datos-readonly{
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 18px;
  margin: 0;
  font-size: 0.9rem;
}
.mis-datos-readonly dt{
  color: var(--uno-gray-600);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  align-self: center;
}
.mis-datos-readonly dd{
  margin: 0;
  color: var(--uno-ink);
  font-weight: 500;
}

/* Mis datos — los .field y .field-row reusan estilos del form principal */
.mis-datos-card .field{ margin-bottom: 12px; }
.mis-datos-card .field:last-child{ margin-bottom: 0; }
.mis-datos-card textarea{
  width: 100%;
  padding: 14px 16px;
  border: 1px solid rgba(15,61,34,0.12);
  border-radius: var(--radius-sm);
  background: var(--uno-cream);
  font-family: inherit;
  font-size: 0.96rem;
  color: var(--uno-ink);
  resize: vertical;
  min-height: 60px;
  outline: none;
  transition: all .24s;
}
.mis-datos-card textarea:focus{
  border-color: var(--uno-green);
  background: white;
  box-shadow: 0 0 0 4px rgba(139, 195, 74, 0.12);
}

/* Checkboxes: tarjetas seleccionables */
.checkbox-grid{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin-bottom: 14px;
}
.check-card{
  display: flex;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(15, 61, 34, 0.08);
  border-radius: 10px;
  background: var(--uno-cream);
  cursor: pointer;
  transition: all .18s;
  align-items: flex-start;
}
.check-card:hover{
  border-color: var(--uno-green);
  background: white;
}
.check-card input[type="checkbox"]{
  margin-top: 3px;
  flex: 0 0 auto;
  width: 18px; height: 18px;
  accent-color: var(--uno-green);
  cursor: pointer;
}
.check-card:has(input:checked){
  background: rgba(139, 195, 74, 0.10);
  border-color: var(--uno-green);
}
.check-card span{ display: block; min-width: 0; }
.check-card strong{
  display: block;
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--uno-ink);
  margin-bottom: 2px;
}

/* ----- Encuesta extendida: chips de temas, radio groups ----- */
.qs-temas-grid{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 6px;
}
.qs-tema-chip{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border: 1.5px solid rgba(15, 61, 34, 0.14);
  border-radius: 999px;
  background: white;
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--uno-gray-700);
  cursor: pointer;
  transition: all .15s ease;
  user-select: none;
}
.qs-tema-chip:hover{ border-color: var(--uno-green); color: var(--uno-green); }
.qs-tema-chip input{ position: absolute; opacity: 0; pointer-events: none; }
.qs-tema-chip.is-active{
  background: var(--uno-green);
  color: white;
  border-color: var(--uno-green);
  box-shadow: 0 2px 8px rgba(111, 190, 68, 0.25);
}
.qs-tema-chip.is-disabled{
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}
.qs-temas-counter{
  display: block;
  font-size: 0.78rem;
  color: var(--uno-gray-700);
  margin-top: 4px;
}
.qs-temas-counter.is-warn{ color: #c0392b; }
.qs-temas-counter.is-full{ color: var(--uno-green-deep); font-weight: 600; }

.qs-radio-group{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}
.qs-radio-group-vertical{ flex-direction: column; }
.qs-radio{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border: 1.5px solid rgba(15, 61, 34, 0.14);
  border-radius: 10px;
  background: white;
  font-size: 0.86rem;
  color: var(--uno-gray-700);
  cursor: pointer;
  transition: all .15s ease;
}
.qs-radio:hover{ border-color: var(--uno-green); color: var(--uno-green); }
.qs-radio input[type=radio]{
  margin: 0;
  width: 16px; height: 16px;
  accent-color: var(--uno-green);
  cursor: pointer;
}
.qs-radio:has(input:checked){
  background: rgba(139, 195, 74, 0.12);
  border-color: var(--uno-green);
  color: var(--uno-ink);
  font-weight: 600;
}
.check-card small{
  display: block;
  font-size: 0.78rem;
  color: var(--uno-gray-600);
  line-height: 1.4;
}

.mis-datos-legal{
  background: #FFF8E1;
  border: 1px solid #F5D77E;
}

/* ---------- Modal Política de Privacidad ---------- */
.privacy-modal-card{
  max-width: 760px;
  width: 100%;
  max-height: 92vh;
  padding: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.privacy-modal-head{
  padding: 22px 28px 16px;
  border-bottom: 1px solid #eee;
  background: #fff;
}
.privacy-modal-head .eyebrow{
  color: #6FBE44; font-size: 0.72rem; letter-spacing: .12em;
  text-transform: uppercase; font-weight: 700;
}
.privacy-modal-head h2{
  font-size: 1.25rem; margin: 6px 0 4px; color: #1B7F2C; line-height: 1.3;
  padding-right: 40px;
}
.privacy-modal-head .legal-meta{
  color: #6b6b6b; font-size: 0.82rem; margin: 0 0 10px;
}
.privacy-modal-head .legal-disclaimer{
  margin: 8px 0 0; padding: 8px 12px;
  background: #FFF8E1; border: 1px solid #F5D77E; border-radius: 8px;
  font-size: 0.82rem; color: #5b4400;
}
.privacy-modal-body{
  overflow-y: auto;
  padding: 20px 28px;
  flex: 1 1 auto;
}
.privacy-modal-body .legal-body{
  background: transparent;
  padding: 0;
  box-shadow: none;
  max-width: 100%;
  line-height: 1.6;
  color: #2c2c2c;
  font-size: 0.92rem;
}
.privacy-modal-body .legal-body h2{
  font-size: 1rem; margin: 22px 0 8px; color: #1B7F2C;
  padding-bottom: 5px; border-bottom: 1px solid #eee;
}
.privacy-modal-body .legal-body h2:first-child{ margin-top: 0; }
.privacy-modal-body .legal-body h3{ font-size: 0.9rem; margin: 14px 0 4px; color: #444; }
.privacy-modal-body .legal-body ul,
.privacy-modal-body .legal-body ol{ padding-left: 22px; margin: 6px 0 10px; }
.privacy-modal-body .legal-body li{ margin-bottom: 4px; }
.privacy-modal-body .legal-body a{ color: #1B7F2C; text-decoration: underline; }
.privacy-modal-body .legal-data{ list-style: none; padding-left: 0; }
.privacy-modal-body .legal-note{
  background: #FFF8E1; border-left: 3px solid #F5D77E;
  padding: 10px 12px; border-radius: 6px; margin: 12px 0;
  font-size: 0.86rem;
}
.privacy-modal-body .legal-signature{
  margin-top: 24px; padding-top: 14px; border-top: 1px solid #eee;
  text-align: center; color: #1B7F2C;
}
.privacy-modal-foot{
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 14px 22px;
  border-top: 1px solid #eee;
  background: #FAFAF7;
}
@media (max-width: 700px){
  .privacy-modal-head{ padding: 18px 20px 12px; }
  .privacy-modal-head h2{ font-size: 1.1rem; }
  .privacy-modal-body{ padding: 16px 20px; }
  .privacy-modal-foot{ padding: 12px 16px; }
  .privacy-modal-foot .btn{ flex: 1; }
}
.mis-datos-legal-row{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--uno-gray-700, #3a3a3a);
  cursor: pointer;
}
.mis-datos-legal-row input[type="checkbox"]{
  margin-top: 3px;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  cursor: pointer;
}
.mis-datos-legal-row a{
  color: var(--uno-green, #1B7F2C);
  text-decoration: underline;
  font-weight: 600;
}

.mis-datos-actions{
  display: flex;
  justify-content: flex-end;
  position: sticky;
  bottom: 12px;
  background: linear-gradient(to top, var(--uno-cream, #FAFAF7) 60%, transparent);
  padding: 12px 0;
}
.mis-datos-actions .btn:disabled{
  opacity: 0.5;
  cursor: not-allowed;
}
.mis-datos-actions .btn{
  padding: 12px 26px;
  font-size: 0.95rem;
}

@media (max-width: 700px){
  .mis-datos-identity{ grid-template-columns: 1fr; text-align: center; }
  .mis-datos-readonly{ grid-template-columns: 1fr; gap: 2px; text-align: left; }
  .mis-datos-readonly dt{ margin-top: 8px; }
  .checkbox-grid{ grid-template-columns: 1fr; }
  .mis-datos-card{ padding: 18px; }
}

/* Form de cambio de clave (reutiliza .mis-datos-card / .pwd-row / .form-hint) */
.cambiar-clave-form{
  max-width: 640px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.cambiar-clave-form .form-hint{
  margin: 6px 0 4px;
  color: var(--uno-gray-600);
  font-size: 0.82rem;
}

/* =========================================================================
   Modal de confirmación reutilizable
   ========================================================================= */
.confirm-modal-card{
  max-width: 420px !important;
  text-align: center;
  padding: 32px 28px 24px !important;
}
.confirm-icon{
  width: 64px;
  height: 64px;
  border-radius: 50%;
  margin: 0 auto 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(139, 195, 74, 0.14);
  color: var(--uno-green-deep);
}
.confirm-icon-warning{
  background: rgba(255, 193, 7, 0.18);
  color: #B45309;
}
.confirm-modal-head{ margin-bottom: 22px; }
.confirm-modal-head h3{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.25rem !important;
  font-weight: 600;
  color: var(--uno-ink);
  margin: 0 0 8px !important;
}
.confirm-modal-head .modal-sub{
  font-size: 0.95rem;
  line-height: 1.5;
  color: var(--uno-gray-700);
  margin: 0;
}
.confirm-modal .modal-actions-center{
  gap: 10px;
  flex-wrap: wrap;
}
.confirm-modal .modal-actions .btn{
  padding: 11px 20px;
  font-size: 0.92rem;
}

/* =========================================================================
   Mis aportes — tabs + form con pastillas + historial
   ========================================================================= */
.ap-tabs{
  display: flex;
  gap: 4px;
  padding: 4px;
  background: var(--uno-cream);
  border-radius: 12px;
  margin-bottom: 18px;
  width: fit-content;
}
.ap-tab{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  background: transparent;
  border: none;
  border-radius: 9px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--uno-gray-700);
  cursor: pointer;
  transition: all .18s;
}
.ap-tab:hover{ color: var(--uno-ink); }
.ap-tab.active{
  background: white;
  color: var(--uno-green-deep);
  box-shadow: 0 1px 3px rgba(0,0,0,.08), 0 0 0 1px rgba(15, 61, 34, 0.04);
}
.ap-tab svg{ flex: 0 0 auto; }

.ap-panel{ animation: sectionFadeIn .18s ease-out; }

/* Form ----- */
.ap-form{
  display: flex;
  flex-direction: column;
  gap: 18px;
  max-width: 760px;
}
.ap-card{
  background: white;
  border-radius: 14px;
  border: 1px solid rgba(15, 61, 34, 0.06);
  padding: 22px 24px;
}
.ap-card h2{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--uno-ink);
  margin: 0 0 14px;
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.ap-card .ap-currency{
  font-size: 0.78rem;
  color: var(--uno-gray-600);
  font-weight: 500;
  letter-spacing: 0.04em;
}

/* Segments único / recurrente */
.ap-segments{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.ap-segment{
  position: relative;
  display: flex;
  gap: 10px;
  padding: 14px 16px;
  border: 1px solid rgba(15, 61, 34, 0.10);
  border-radius: 10px;
  background: var(--uno-cream);
  cursor: pointer;
  transition: all .18s;
  align-items: flex-start;
}
.ap-segment:hover{ border-color: var(--uno-green); background: white; }
.ap-segment input[type="radio"]{
  margin-top: 4px;
  flex: 0 0 auto;
  width: 18px; height: 18px;
  accent-color: var(--uno-green);
  cursor: pointer;
}
.ap-segment:has(input:checked){
  background: rgba(139, 195, 74, 0.10);
  border-color: var(--uno-green);
}
.ap-segment span{ display: block; min-width: 0; }
.ap-segment strong{
  display: block; font-size: 0.95rem; font-weight: 600;
  color: var(--uno-ink); margin-bottom: 2px;
}
.ap-segment small{
  display: block; font-size: 0.8rem; color: var(--uno-gray-600);
  line-height: 1.4;
}

/* Pastillas de monto */
.ap-pills{
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
}
.ap-pill{
  padding: 13px 26px;
  background: white;
  color: var(--uno-ink);
  border: 1.5px solid rgba(15, 61, 34, 0.12);
  border-radius: 999px;
  font-family: 'Orbitron', sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  transition: all .2s;
  letter-spacing: 0.01em;
}
.ap-pill:hover{
  border-color: var(--uno-green);
  color: var(--uno-green-deep);
  transform: translateY(-1px);
}
/* Seleccionada: bandeja verde claro */
.ap-pill.active{
  background: rgba(139, 195, 74, 0.20);
  color: var(--uno-green-deep);
  border-color: var(--uno-green);
  box-shadow: 0 4px 14px rgba(111, 190, 68, 0.18);
  transform: translateY(-1px);
}
.ap-pill.active:hover{
  background: rgba(139, 195, 74, 0.30);
}
.ap-otro-wrap[hidden]{ display: none !important; }
.ap-otro-wrap{
  margin-top: 14px;
  display: grid;
  gap: 8px;
}
.ap-otro-wrap label{
  font-size: 0.8rem; font-weight: 500; color: var(--uno-gray-600);
  letter-spacing: 0.02em;
}
.ap-otro-wrap input{
  padding: 12px 16px;
  border: 1px solid rgba(15, 61, 34, 0.12);
  border-radius: var(--radius-sm);
  background: var(--uno-cream);
  font-family: 'Orbitron', sans-serif;
  font-size: 1rem;
  color: var(--uno-ink);
  outline: none;
  transition: all .2s;
  max-width: 220px;
}
.ap-otro-wrap input:focus{
  border-color: var(--uno-green); background: white;
  box-shadow: 0 0 0 4px rgba(139, 195, 74, 0.12);
}

/* Periodicidad */
.ap-period-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}
.ap-period{ padding: 12px 14px; }

/* Historial */
.ap-resumen{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}
.ap-resumen-item{
  background: white;
  border-radius: 12px;
  border: 1px solid rgba(15, 61, 34, 0.06);
  padding: 14px 16px;
  display: flex; flex-direction: column;
}
.ap-resumen-item span{
  font-size: 0.78rem;
  color: var(--uno-gray-600);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 6px;
}
.ap-resumen-item strong{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.2rem;
  color: var(--uno-ink);
}

.ap-list{ display: flex; flex-direction: column; gap: 10px; }
.ap-loading{ padding: 24px; text-align: center; color: var(--uno-gray-600); }

.ap-row{
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 14px;
  background: white;
  border-radius: 12px;
  border: 1px solid rgba(15, 61, 34, 0.06);
  padding: 16px 18px;
  align-items: center;
}
.ap-row-main{ display: flex; gap: 16px; align-items: center; min-width: 0; }
.ap-row-monto{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--uno-ink);
  min-width: 110px;
}
.ap-row-info strong{
  display: block; font-size: 0.92rem;
  color: var(--uno-ink); font-weight: 600; margin-bottom: 2px;
}
.ap-row-info .ap-row-fecha{ font-size: 0.8rem; color: var(--uno-gray-600); }
.ap-row-side{
  display: flex; flex-direction: column; align-items: flex-end; gap: 8px;
}
.ap-row-actions{ display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.ap-row-actions .btn{ padding: 7px 14px; font-size: 0.84rem; }

.ap-badge{
  font-size: 0.7rem; font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 99px;
}
.ap-badge.estado-pendiente{ background: #FEF3C7; color: #92400E; }
.ap-badge.estado-procesado{ background: rgba(78, 154, 45, 0.14); color: var(--uno-green-deep); }
.ap-badge.estado-activo{    background: rgba(45, 127, 249, 0.14); color: #1862C2; }
.ap-badge.estado-cancelado{ background: var(--uno-gray-100); color: var(--uno-gray-700); }
.ap-badge.estado-fallido{   background: #FEE2E2; color: #B91C1C; }

@media (max-width: 700px){
  .ap-segments{ grid-template-columns: 1fr; }
  .ap-row{ grid-template-columns: 1fr; }
  .ap-row-side{ align-items: flex-start; }
  .ap-row-monto{ min-width: 0; font-size: 1.05rem; }
}

/* Toolbar (tabs + botón política) */
.ap-toolbar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.ap-toolbar .ap-tabs{ margin-bottom: 0; }
.ap-policy-btn{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  background: white;
  color: var(--uno-green-deep);
  border: 1px solid rgba(78, 154, 45, 0.20);
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  transition: all .2s;
}
.ap-policy-btn:hover{
  background: var(--uno-green);
  color: white;
  border-color: var(--uno-green);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(111, 190, 68, 0.20);
}

/* Lista de recurrentes activos (Tab 1) */
.ap-recurrentes[hidden]{ display: none !important; }
.ap-recurrentes{
  margin-top: 24px;
  padding-top: 22px;
  border-top: 1px dashed rgba(15, 61, 34, 0.10);
}
.ap-recurrentes-head{ margin-bottom: 14px; }
.ap-recurrentes-head h2{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--uno-ink);
  margin: 0 0 4px;
}
.ap-recurrentes-help{
  font-size: 0.82rem;
  color: var(--uno-gray-600);
}
.ap-recurrentes-list{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ap-rec-row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  background: white;
  border-radius: 12px;
  border: 1px solid rgba(45, 127, 249, 0.18);
  padding: 14px 18px;
}
.ap-rec-info{
  display: flex; align-items: center; gap: 16px;
  min-width: 0;
}
.ap-rec-monto{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--uno-ink);
  min-width: 100px;
}
.ap-rec-meta strong{
  display: block;
  font-size: 0.92rem;
  color: var(--uno-ink);
  font-weight: 600;
}
.ap-rec-meta span{
  display: block;
  font-size: 0.8rem;
  color: var(--uno-gray-600);
}
.ap-btn-suspender{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  font-size: 0.84rem;
  border: 1px solid rgba(199, 48, 30, 0.18);
  color: #C7301E;
}
.ap-btn-suspender:hover{
  background: #FEE2E2;
  border-color: #C7301E;
}

@media (max-width: 600px){
  .ap-rec-row{ flex-direction: column; align-items: stretch; }
  .ap-rec-info{ flex-direction: column; align-items: flex-start; gap: 4px; }
  .ap-rec-monto{ min-width: 0; }
}

/* =========================================================================
   Modal de información (largo, scrollable) — política de donaciones
   ========================================================================= */
.info-modal-card{
  max-width: 720px !important;
  padding: 32px 36px 24px !important;
  text-align: left;
}
.info-modal-card .modal-header{ margin-bottom: 18px; }
.info-modal-card .modal-header h3{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.4rem !important;
  font-weight: 600;
  margin: 6px 0 6px !important;
  line-height: 1.2;
}
.modal-body-content{
  font-size: 0.94rem;
  line-height: 1.55;
  color: var(--uno-ink);
}

.policy-intro{
  background: linear-gradient(135deg, rgba(139, 195, 74, 0.10), rgba(45, 127, 249, 0.06));
  border-left: 3px solid var(--uno-green);
  padding: 14px 18px;
  border-radius: 0 12px 12px 0;
  margin: 0 0 22px;
  font-size: 0.96rem;
}

.policy-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 22px;
}
.policy-block{
  background: white;
  border: 1px solid rgba(15, 61, 34, 0.08);
  border-radius: 12px;
  padding: 16px 18px;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: 12px;
  row-gap: 10px;
}
.policy-block ul{ grid-column: 1 / -1; }
.policy-block-warn{
  background: rgba(199, 48, 30, 0.04);
  border-color: rgba(199, 48, 30, 0.16);
}
.policy-block-warn .policy-icon{
  background: rgba(199, 48, 30, 0.10);
  color: #B91C1C;
}
.policy-block-accent{
  background: rgba(139, 195, 74, 0.08);
  border-color: rgba(78, 154, 45, 0.20);
}
.policy-icon{
  width: 36px; height: 36px;
  border-radius: 10px;
  background: rgba(139, 195, 74, 0.16);
  color: var(--uno-green-deep);
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 auto;
}
.policy-block h4{
  font-family: 'Orbitron', sans-serif;
  font-size: 0.98rem;
  font-weight: 600;
  color: var(--uno-ink);
  margin: 0;
  align-self: center;
}
.policy-block ul{
  margin: 0;
  padding-left: 18px;
  font-size: 0.86rem;
  color: var(--uno-gray-700);
  line-height: 1.5;
}
.policy-block li{ margin-bottom: 4px; }

.policy-cta{
  background: linear-gradient(135deg, var(--uno-green-deep), var(--uno-green));
  color: white;
  padding: 16px 18px;
  border-radius: 12px;
  font-size: 0.96rem;
  line-height: 1.5;
  text-align: center;
}

@media (max-width: 700px){
  .info-modal-card{ padding: 26px 22px 18px !important; }
  .policy-grid{ grid-template-columns: 1fr; }
  .ap-toolbar{ flex-direction: column; align-items: stretch; }
  .ap-toolbar .ap-tabs{ width: 100%; overflow-x: auto; }
}

/* Textarea de notas en el form de aportes ocupa el ancho completo */
.ap-card textarea{
  width: 100%;
  padding: 14px 16px;
  border: 1px solid rgba(15,61,34,0.12);
  border-radius: var(--radius-sm);
  background: var(--uno-cream);
  font-family: inherit;
  font-size: 0.95rem;
  color: var(--uno-ink);
  resize: vertical;
  min-height: 60px;
  outline: none;
  transition: all .24s;
}
.ap-card textarea:focus{
  border-color: var(--uno-green);
  background: white;
  box-shadow: 0 0 0 4px rgba(139, 195, 74, 0.12);
}

/* Botón Pagar en la lista de aportes — icono + texto alineados */
.ap-btn-pagar{
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
}

/* =========================================================================
   Agenda — calendario + invitaciones
   ========================================================================= */
.ag-toolbar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
  flex-wrap: wrap;
  gap: 12px;
}
.ag-tabs{
  display: flex;
  gap: 4px;
  padding: 4px;
  background: var(--uno-cream);
  border-radius: 12px;
  width: fit-content;
}
.ag-tab{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  background: transparent;
  border: none;
  border-radius: 9px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--uno-gray-700);
  cursor: pointer;
  transition: all .18s;
}
.ag-tab:hover{ color: var(--uno-ink); }
.ag-tab.active{
  background: white;
  color: var(--uno-green-deep);
  box-shadow: 0 1px 3px rgba(0,0,0,.08), 0 0 0 1px rgba(15, 61, 34, 0.04);
}
.ag-tab-badge{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  background: #C7301E;
  color: white;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
}
.ag-tab-badge[hidden]{ display: none !important; }

.ag-panel{ animation: sectionFadeIn .18s ease-out; }

/* Calendario container */
#ag-calendar{
  background: white;
  border-radius: 14px;
  border: 1px solid rgba(15, 61, 34, 0.06);
  padding: 18px;
}
/* Overrides ligeros de FullCalendar */
.fc{ font-family: inherit; }
.fc .fc-toolbar-title{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.2rem !important;
  font-weight: 600;
}
.fc .fc-button{
  background: white !important;
  color: var(--uno-ink) !important;
  border: 1px solid rgba(15, 61, 34, 0.12) !important;
  font-weight: 600 !important;
  font-size: 0.86rem !important;
  text-transform: capitalize !important;
}
.fc .fc-button:hover{
  background: var(--uno-cream) !important;
  border-color: var(--uno-green) !important;
}
.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active{
  background: var(--uno-green) !important;
  color: white !important;
  border-color: var(--uno-green) !important;
}
.fc-event{ cursor: pointer; border-radius: 6px !important; padding: 2px 6px; font-size: 0.78rem; }
.fc-event-title{ font-weight: 600; }
.fc .fc-daygrid-day.fc-day-today{ background: rgba(139, 195, 74, 0.08) !important; }

/* Invitaciones */
.ag-inv-list{ display: flex; flex-direction: column; gap: 12px; }
.ag-loading{ padding: 24px; text-align: center; color: var(--uno-gray-600); }
.ag-inv-row{
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: center;
  background: white;
  border-radius: 12px;
  border: 1px solid rgba(15, 61, 34, 0.06);
  padding: 16px 18px;
}
.ag-inv-info h3{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--uno-ink);
  margin: 6px 0 4px;
}
.ag-inv-meta{
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}
.ag-inv-fecha{
  display: block;
  font-size: 0.84rem;
  color: var(--uno-gray-600);
}
.ag-inv-actions{ display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.ag-inv-actions .btn{ padding: 7px 14px; font-size: 0.84rem; }
.ag-badge{
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 99px;
}

/* Modal de detalle de evento */
.ag-evento-meta{
  display: flex; gap: 6px; flex-wrap: wrap;
  margin-bottom: 14px;
}
.ag-evento-grid{
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 6px 14px;
  margin: 0 0 14px;
  padding: 14px;
  background: var(--uno-cream);
  border-radius: 12px;
  font-size: 0.92rem;
}
.ag-evento-grid dt{
  color: var(--uno-gray-600);
  font-size: 0.74rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.ag-evento-grid dd{ margin: 0; color: var(--uno-ink); font-weight: 500; word-break: break-word; }
.ag-evento-desc{ font-size: 0.95rem; line-height: 1.55; color: var(--uno-ink); }

@media (max-width: 700px){
  .ag-inv-row{ grid-template-columns: 1fr; }
  .ag-inv-actions{ justify-content: flex-start; }
}

/* =========================================================================
   ADMIN — pantallas de mantenimiento (Agenda, Noticias)
   Usadas en /afiliados/index.php cuando la persona tiene admin del módulo.
   ========================================================================= */

/* Sidebar: separador y items de admin */
.portal-nav-divider{
  height: 1px;
  margin: 12px 14px;
  background: rgba(255,255,255,0.18);
  border: 0;
}
.portal-nav-admin{ color: rgba(255,255,255,0.75); }
.portal-nav-admin:hover{ color: #fff; }

/* Sidebar: grupo expandible (Administración) */
.portal-nav-group{ margin-top: 4px; }
.portal-nav-group-toggle{
  width: 100%;
  background: transparent;
  border: 0;
  cursor: pointer;
  text-align: left;
  font: inherit;
}
.portal-nav-group-toggle .portal-nav-chevron{
  margin-left: auto;
  transition: transform .22s ease;
  color: var(--uno-gray-600);
  flex: 0 0 auto;
}
.portal-nav-group-toggle[aria-expanded="true"] .portal-nav-chevron{
  transform: rotate(90deg);
}
.portal-nav-group-items{
  display: flex;
  flex-direction: column;
  gap: 2px;
  max-height: 0;
  overflow: hidden;
  transition: max-height .25s ease;
}
.portal-nav-group-items.open{ max-height: 400px; }
.portal-nav-subitem{
  padding-left: 38px;
  font-size: 0.88rem;
  font-weight: 500;
}
.portal-nav-subitem svg{ width: 18px; height: 18px; }

/* =========================================================================
   SOMOS — Dashboard del movimiento
   ========================================================================= */

/* Hero */
.somos-hero{
  position: relative;
  border-radius: 22px;
  padding: 36px 44px;
  margin-bottom: 28px;
  overflow: hidden;
  background: linear-gradient(135deg, #2D7A1F 0%, #4E9A2D 35%, #8BC34A 100%);
  color: #fff;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 24px;
  min-height: 200px;
}
.somos-hero-bg{
  position: absolute; inset: 0;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,0.18), transparent 50%),
    radial-gradient(circle at 80% 70%, rgba(255,193,7,0.22), transparent 50%);
  pointer-events: none;
}
.somos-hero-content{ position: relative; z-index: 1; }
.somos-hero-content .eyebrow{ color: #FFE082; }
.somos-hero h1{
  font-size: 2.6rem;
  margin: 6px 0 12px;
  letter-spacing: -0.02em;
  color: #fff;
}
.somos-hero-tagline{
  font-size: 1.05rem;
  max-width: 580px;
  line-height: 1.55;
  margin: 0 0 16px;
  color: rgba(255,255,255,0.92);
}
.somos-hero-num{
  font-size: 1.4rem;
  font-weight: 700;
  color: #FFE082;
}
.somos-hero-pills{ display: flex; gap: 8px; flex-wrap: wrap; }
.somos-pill{
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px;
  background: rgba(255,255,255,0.18);
  border: 1px solid rgba(255,255,255,0.3);
  border-radius: 999px;
  font-size: 0.85rem;
  backdrop-filter: blur(6px);
}
.somos-hero-img-wrap{
  position: relative; z-index: 1;
  display: flex; align-items: flex-end;
}
.somos-hero-img{
  width: 180px; height: auto;
  filter: drop-shadow(0 12px 28px rgba(0,0,0,0.25));
  animation: somosFloat 4s ease-in-out infinite;
}
@keyframes somosFloat{
  0%,100%{ transform: translateY(0); }
  50%{ transform: translateY(-8px); }
}

/* KPI cards */
.somos-kpis{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px;
  margin-bottom: 28px;
}
.somos-kpi{
  position: relative;
  background: white;
  border-radius: 16px;
  padding: 18px 20px;
  border: 1px solid var(--uno-gray-200, #e5e7eb);
  overflow: hidden;
  transition: transform .25s, box-shadow .25s;
}
.somos-kpi::before{
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--c1), var(--c2));
}
.somos-kpi:hover{
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(0,0,0,0.08);
}
.somos-kpi-icon{
  width: 38px; height: 38px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--c1), var(--c2));
  color: white;
  margin-bottom: 10px;
}
.somos-kpi-num{
  font-size: 2rem;
  font-weight: 700;
  color: var(--uno-ink, #1a1a1a);
  line-height: 1.1;
  letter-spacing: -0.01em;
}
.somos-kpi-label{
  font-size: 0.85rem;
  color: var(--uno-gray-600, #666);
  margin-top: 4px;
}

/* Cards generales */
.somos-card{
  background: white;
  border-radius: 16px;
  padding: 22px;
  border: 1px solid var(--uno-gray-200, #e5e7eb);
  margin-bottom: 16px;
}
.somos-card-head{ margin-bottom: 14px; }
.somos-card-head h2{
  font-size: 1.15rem;
  margin: 0 0 4px;
  color: var(--uno-ink, #1a1a1a);
}
.somos-card-head p{
  font-size: 0.85rem;
  color: var(--uno-gray-600, #666);
  margin: 0;
}

.somos-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}
.somos-card-wide{ grid-column: 1 / -1; }
.somos-card-full{ margin-bottom: 24px; }

.somos-chart-wrap{ position: relative; height: 240px; }
.somos-chart-tall{ height: 280px; }

/* Mapa */
.somos-card-map{ padding-bottom: 14px; }
.somos-map-wrap{
  position: relative;
  height: 460px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--uno-gray-200, #e5e7eb);
}
#somos-map{
  width: 100%;
  height: 100%;
  background: #eef5e9;
}
.somos-map-legend{
  position: absolute;
  bottom: 12px; right: 12px;
  background: rgba(255,255,255,0.96);
  backdrop-filter: blur(8px);
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 0.78rem;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  z-index: 400;
  border: 1px solid var(--uno-gray-200, #e5e7eb);
}
.somos-map-legend-title{
  display: block;
  font-weight: 600;
  margin-bottom: 6px;
  color: var(--uno-ink);
}
.somos-map-legend-row{
  display: flex; align-items: center; gap: 8px;
  margin: 3px 0;
  color: var(--uno-gray-700);
}
.somos-map-bubble{
  display: inline-block;
  border-radius: 50%;
  background: rgba(76, 175, 80, 0.55);
  border: 2px solid #4CAF50;
}
.somos-map-bubble-sm{ width: 10px; height: 10px; }
.somos-map-bubble-md{ width: 16px; height: 16px; }
.somos-map-bubble-lg{ width: 22px; height: 22px; }
.somos-map-top{
  margin-top: 12px;
  padding: 10px 14px;
  background: var(--uno-cream, #fff8ed);
  border-radius: 10px;
  font-size: 0.85rem;
}
.somos-map-top-label{ font-weight: 600; color: var(--uno-ink); margin-right: 6px; }
#somos-map-top-list span{
  display: inline-block;
  margin: 0 4px;
  padding: 3px 10px;
  background: white;
  border-radius: 999px;
  font-size: 0.78rem;
  border: 1px solid var(--uno-gray-200, #e5e7eb);
}

/* Compromiso */
.somos-compromiso-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}
.somos-compromiso-item{
  position: relative;
  padding: 16px 18px;
  border-radius: 14px;
  background: linear-gradient(135deg, #f8fbf3 0%, #fffaed 100%);
  border: 1px solid var(--uno-gray-200, #e5e7eb);
}
.somos-compromiso-num{
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--uno-green-deep, #2D7A1F);
  line-height: 1;
  letter-spacing: -0.01em;
}
.somos-compromiso-title{
  font-weight: 600;
  font-size: 0.95rem;
  margin: 6px 0 2px;
  color: var(--uno-ink);
}
.somos-compromiso-desc{
  font-size: 0.78rem;
  color: var(--uno-gray-600);
  margin-bottom: 10px;
  line-height: 1.4;
}
.somos-compromiso-bar{
  height: 6px;
  background: rgba(0,0,0,0.06);
  border-radius: 999px;
  overflow: hidden;
}
.somos-compromiso-bar span{
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #8BC34A, #FFC107);
  border-radius: 999px;
  width: var(--pct);
  transition: width 1.2s cubic-bezier(.2,.9,.3,1);
}

/* CTA final */
.somos-cta{
  text-align: center;
  padding: 36px 24px;
  background: linear-gradient(135deg, #FFF8ED 0%, #F1F8E9 100%);
  border-radius: 18px;
  border: 1px dashed #C5E1A5;
  margin-top: 24px;
}
.somos-cta h2{
  font-size: 1.5rem;
  color: var(--uno-green-deep, #2D7A1F);
  margin: 0 0 8px;
}
.somos-cta p{
  color: var(--uno-gray-700);
  margin: 0 0 18px;
}

/* Responsive */
@media (max-width: 768px){
  .somos-hero{
    grid-template-columns: 1fr;
    text-align: center;
    padding: 28px 20px;
  }
  .somos-hero-img-wrap{ justify-content: center; }
  .somos-hero-img{ width: 130px; }
  .somos-hero h1{ font-size: 2rem; }
  .somos-map-wrap{ height: 360px; }
  .somos-map-legend{ font-size: 0.7rem; padding: 8px 10px; }
}

/* Modal "Quién soy" — agradecimiento */
.qs-modal-card{
  max-width: 460px;
  text-align: center;
}
.qs-modal-card .modal-body{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.qs-modal-img{
  width: 160px;
  height: auto;
  margin-bottom: 4px;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,.12));
}
.qs-modal-card h2{
  margin: 4px 0 6px;
  font-size: 1.4rem;
  color: var(--uno-green-deep);
}
.qs-modal-text{
  font-size: 0.95rem;
  line-height: 1.55;
  color: var(--uno-gray-700);
  margin: 0;
}
.qs-modal-text-soft{
  font-size: 0.88rem;
  color: var(--uno-gray-600);
}
.qs-modal-card .modal-actions{
  margin-top: 14px;
}

/* Botón "Administrar" en sección consumidora */
.ag-toolbar{ display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.ag-new{ margin-left: auto; }

/* Filtros */
.adm-filtros{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
  background: #fff;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 14px;
  padding: 14px;
  margin-bottom: 14px;
}
.adm-filtro-grupo{ display: flex; flex-direction: column; gap: 4px; }
.adm-filtro-grupo label{ font-size: 11px; font-weight: 600; color: var(--uno-ink-soft, #6b7280); text-transform: uppercase; letter-spacing: .04em; }
.adm-filtro-grupo input,
.adm-filtro-grupo select{
  padding: 8px 10px;
  border: 1px solid rgba(0,0,0,0.12);
  border-radius: 8px;
  font: inherit;
  font-size: 14px;
  background: #fff;
  color: var(--uno-ink, #111);
}
.adm-filtro-grupo input:focus,
.adm-filtro-grupo select:focus{ outline: 2px solid var(--uno-green, #8BC34A); outline-offset: 1px; }

/* Toolbar (botón Nuevo + count) */
.adm-toolbar{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.adm-count{ font-size: 13px; color: var(--uno-ink-soft, #6b7280); font-weight: 500; }

/* Tabla */
.adm-table-wrap{
  background: #fff;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 14px;
  overflow: hidden;
  overflow-x: auto;
}
.adm-table{
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.adm-table thead th{
  text-align: left;
  background: #f9fafb;
  color: var(--uno-ink-soft, #6b7280);
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 10px 14px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  white-space: nowrap;
}
.adm-table tbody td{
  padding: 12px 14px;
  border-bottom: 1px solid rgba(0,0,0,0.04);
  vertical-align: top;
}
.adm-table tbody tr:hover{ background: rgba(139,195,74,0.05); }
.adm-table .t-center{ text-align: center; }
.adm-table .t-right{ text-align: right; white-space: nowrap; }
.adm-loading,
.adm-empty,
.adm-error{
  text-align: center;
  padding: 32px 16px !important;
  color: var(--uno-ink-soft, #6b7280);
}
.adm-error{ color: #b91c1c; }
.adm-sub{ font-size: 12px; color: var(--uno-ink-soft, #6b7280); margin-top: 2px; }
.adm-tag-color{
  display: inline-block;
  width: 10px; height: 10px;
  border-radius: 50%;
  margin-right: 4px;
  vertical-align: middle;
}
.adm-thumb{
  width: 36px; height: 36px;
  border-radius: 6px;
  object-fit: cover;
  margin-right: 8px;
  vertical-align: middle;
  background: #f3f4f6;
}

/* Pills de estado */
.adm-pill{
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  background: #f3f4f6;
  color: #4b5563;
  text-transform: capitalize;
}
.adm-pill[data-estado="programado"]{ background: #dbeafe; color: #1e40af; }
.adm-pill[data-estado="en_curso"]  { background: #fef3c7; color: #92400e; }
.adm-pill[data-estado="finalizado"]{ background: #e5e7eb; color: #374151; }
.adm-pill[data-estado="cancelado"] { background: #fee2e2; color: #991b1b; }
.adm-pill[data-estado="published"] { background: #d1fae5; color: #065f46; }
.adm-pill[data-estado="pending"]   { background: #fef3c7; color: #92400e; }
.adm-pill[data-estado="review"]    { background: #dbeafe; color: #1e40af; }
.adm-pill[data-estado="archived"]  { background: #e5e7eb; color: #374151; }
.adm-pill[data-estado="rejected"]  { background: #fee2e2; color: #991b1b; }

/* Botones de acción de fila */
.adm-btn-icon{
  background: transparent;
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 6px;
  padding: 4px 8px;
  font-size: 14px;
  cursor: pointer;
  color: var(--uno-ink, #111);
  margin-left: 4px;
  transition: background .15s, color .15s, border-color .15s;
}
.adm-btn-icon:hover{ background: rgba(139,195,74,0.12); border-color: var(--uno-green, #8BC34A); }
.adm-btn-icon.adm-btn-danger:hover{ background: #fee2e2; color: #991b1b; border-color: #fca5a5; }

/* Modal */
.adm-modal{
  position: fixed; inset: 0; z-index: 1000;
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
}
.adm-modal[hidden]{ display: none; }
.adm-modal-backdrop{ position: absolute; inset: 0; background: rgba(0,0,0,0.55); }
.adm-modal-card{
  position: relative;
  background: #fff;
  border-radius: 16px;
  max-width: 760px;
  width: 100%;
  max-height: 92vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 30px 60px rgba(0,0,0,0.25);
}
.adm-modal-head{
  padding: 16px 20px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  display: flex; align-items: center; justify-content: space-between;
}
.adm-modal-head h3{ margin: 0; font-size: 18px; color: var(--uno-green, #8BC34A); }
.adm-modal-close{
  background: transparent; border: 0;
  font-size: 24px; line-height: 1;
  color: var(--uno-ink-soft, #6b7280);
  cursor: pointer; padding: 4px 8px;
}
.adm-modal-body{ padding: 18px 20px; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: 14px; }
.adm-modal-foot{
  padding: 14px 20px;
  border-top: 1px solid rgba(0,0,0,0.06);
  display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap;
}

/* Campos del modal */
.adm-field{ display: flex; flex-direction: column; gap: 4px; }
.adm-field > span{ font-size: 12px; font-weight: 600; color: var(--uno-ink-soft, #6b7280); text-transform: uppercase; letter-spacing: .04em; }
.adm-field > span em{ color: #b91c1c; font-style: normal; }
.adm-field input,
.adm-field select,
.adm-field textarea{
  padding: 9px 11px;
  border: 1px solid rgba(0,0,0,0.12);
  border-radius: 8px;
  font: inherit; font-size: 14px;
  background: #fff;
  color: var(--uno-ink, #111);
}
.adm-field input:focus,
.adm-field select:focus,
.adm-field textarea:focus{ outline: 2px solid var(--uno-green, #8BC34A); outline-offset: 1px; }
.adm-field-row{ display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.adm-field-row-3{ grid-template-columns: repeat(3, 1fr); }
.adm-field-check{ display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--uno-ink, #111); }

/* Botón link (de cancelar suave) */
.btn-link{
  background: transparent;
  border: 0;
  color: var(--uno-ink-soft, #6b7280);
  font: inherit; font-weight: 500;
  cursor: pointer;
  padding: 8px 12px;
}
.btn-link:hover{ color: var(--uno-ink, #111); text-decoration: underline; }

@media (max-width: 720px) {
  .adm-field-row,
  .adm-field-row-3{ grid-template-columns: 1fr; }
  .adm-table thead{ display: none; }
  .adm-table tbody td{ display: block; padding: 6px 14px; border: 0; }
  .adm-table tbody tr{ display: block; padding: 10px 0; border-bottom: 1px solid rgba(0,0,0,0.06); }
}

/* =====================================================================
 * Mi Voz (mv_*) — feed de opiniones, panel, modales
 * ===================================================================== */

.mv-panel{
  display: grid;
  grid-template-columns: repeat(4, 1fr) auto;
  gap: 14px;
  align-items: center;
  background: var(--uno-cream);
  border: 1px solid var(--uno-gray-100);
  border-radius: 14px;
  padding: 16px 18px;
  margin-bottom: 18px;
}
.mv-panel-stat{ display: flex; flex-direction: column; align-items: flex-start; }
.mv-panel-stat strong{
  font-size: 22px; font-weight: 700; color: var(--uno-green-deep);
  line-height: 1.1;
}
.mv-panel-stat span{ font-size: 12px; color: var(--uno-gray-600); margin-top: 2px; }
.mv-bell{
  position: relative;
  background: white; border: 1px solid var(--uno-gray-100);
  border-radius: 50%; width: 42px; height: 42px;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--uno-gray-700);
  transition: all .15s;
}
.mv-bell:hover{ border-color: var(--uno-green); color: var(--uno-green-deep); }
.mv-bell-badge{
  position: absolute; top: -4px; right: -4px;
  background: var(--uno-yellow); color: var(--uno-gray-900);
  border-radius: 10px; padding: 2px 6px;
  font-size: 10px; font-weight: 700; line-height: 1;
  min-width: 18px; text-align: center;
}

.mv-toolbar{
  display: flex; flex-wrap: wrap; gap: 10px;
  align-items: center; margin-bottom: 16px;
}
.mv-filter-search{
  position: relative; flex: 1 1 220px; min-width: 200px;
}
.mv-filter-search svg{
  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  color: var(--uno-gray-600);
}
.mv-filter-search input{
  width: 100%; padding: 9px 12px 9px 36px;
  border: 1px solid var(--uno-gray-100); border-radius: 10px;
  font-size: 14px; background: white;
}
.mv-toolbar select{
  padding: 9px 12px; border: 1px solid var(--uno-gray-100);
  border-radius: 10px; background: white; font-size: 14px;
  color: var(--uno-gray-700);
}

.mv-btn{
  display: inline-flex; align-items: center; gap: 6px;
  padding: 9px 14px;
  background: white; color: var(--uno-gray-700);
  border: 1px solid var(--uno-gray-100); border-radius: 10px;
  font-size: 14px; font-weight: 500; cursor: pointer;
  transition: all .15s;
}
.mv-btn:hover{ background: var(--uno-cream); border-color: var(--uno-gray-300); }
.mv-btn-primary{
  background: var(--uno-green-deep); color: white;
  border-color: var(--uno-green-deep);
}
.mv-btn-primary:hover{ background: var(--uno-green); border-color: var(--uno-green); }
.mv-btn-danger{
  background: #C7301E; color: white; border-color: #C7301E;
}
.mv-btn-danger:hover{ background: #a8281a; }
.mv-btn-sm{ padding: 6px 10px; font-size: 12px; }
.mv-btn[disabled]{ opacity: .5; cursor: not-allowed; }

.mv-feed{ display: flex; flex-direction: column; gap: 14px; }
.mv-loading, .mv-empty{
  text-align: center; padding: 40px 20px;
  color: var(--uno-gray-600); font-size: 14px;
}
.mv-error{
  background: #fef2f2; color: #991b1b;
  padding: 12px 16px; border-radius: 10px;
  border: 1px solid #fecaca;
}

.mv-card{
  background: white; border: 1px solid var(--uno-gray-100);
  border-radius: 14px; padding: 18px 20px;
  transition: border-color .15s;
}
.mv-card:hover{ border-color: var(--uno-gray-300); }
.mv-card.mv-card-inhabilitada{
  background: #fffbf2; border-color: #f3d98c;
}
.mv-card-head{
  display: flex; align-items: center; gap: 12px;
  margin-bottom: 10px;
}
.mv-avatar{
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--uno-green-deep); color: white;
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 13px;
  flex-shrink: 0; overflow: hidden;
}
.mv-avatar img{ width: 100%; height: 100%; object-fit: cover; }
.mv-author{ flex: 1; min-width: 0; }
.mv-author-name{
  font-weight: 600; color: var(--uno-gray-800);
  font-size: 14px; line-height: 1.2;
}
.mv-author-meta{
  font-size: 12px; color: var(--uno-gray-600);
  display: flex; gap: 8px; flex-wrap: wrap; margin-top: 2px;
}
.mv-cat-pill{
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 8px; border-radius: 12px;
  font-size: 11px; font-weight: 600;
  background: var(--uno-cream); color: var(--uno-gray-700);
}
.mv-card-title{
  font-size: 17px; font-weight: 700; color: var(--uno-gray-900);
  margin: 0 0 8px; line-height: 1.3; cursor: pointer;
}
.mv-card-title:hover{ color: var(--uno-green-deep); }
.mv-card-content{
  color: var(--uno-gray-700); font-size: 14px; line-height: 1.55;
  margin: 0 0 12px;
  display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;
  overflow: hidden;
}
.mv-card-tags{ display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.mv-tag{
  font-size: 11px; padding: 2px 8px;
  background: #eaf5e3; color: var(--uno-green-deep);
  border-radius: 10px; font-weight: 500;
  text-decoration: none;
}
.mv-tag:hover{ background: #d8ecc9; }
.mv-tag-active{ background: var(--uno-green-deep); color: #fff; }
.mv-etq-active{
  display: flex; align-items: center; gap: 8px;
  padding: 8px 12px; margin: 0 0 12px;
  background: var(--uno-cream); border-radius: 8px;
  font-size: 13px; color: var(--uno-gray-700);
}
.mv-etq-clear{
  margin-left: auto; width: 22px; height: 22px;
  border: none; background: transparent; cursor: pointer;
  font-size: 18px; line-height: 1; color: var(--uno-gray-600);
  border-radius: 50%;
}
.mv-etq-clear:hover{ background: var(--uno-gray-100); color: var(--uno-gray-900); }
.mv-card-foot{
  display: flex; align-items: center; gap: 8px;
  flex-wrap: wrap; padding-top: 10px;
  border-top: 1px solid var(--uno-gray-100);
}
.mv-vote-group{ display: inline-flex; gap: 4px; }
.mv-vote-btn{
  display: inline-flex; align-items: center; gap: 4px;
  padding: 6px 10px; border-radius: 8px;
  background: var(--uno-cream); border: 1px solid transparent;
  font-size: 13px; color: var(--uno-gray-700); cursor: pointer;
  transition: all .15s;
}
.mv-vote-btn:hover{ background: var(--uno-gray-100); }
.mv-vote-btn.mv-active-favor{
  background: #eaf5e3; color: var(--uno-green-deep); border-color: var(--uno-green);
}
.mv-vote-btn.mv-active-contra{
  background: #fdecea; color: #C7301E; border-color: #f3a59a;
}
.mv-vote-btn.mv-active-neutral{
  background: #eef1f4; color: var(--uno-gray-700); border-color: var(--uno-gray-300);
}
.mv-card-action{
  display: inline-flex; align-items: center; gap: 4px;
  padding: 6px 10px; background: transparent;
  border: 0; color: var(--uno-gray-600);
  font-size: 13px; cursor: pointer; border-radius: 8px;
}
.mv-card-action:hover{ background: var(--uno-cream); color: var(--uno-gray-800); }
.mv-card-action.mv-danger:hover{ color: #C7301E; }
.mv-spacer{ flex: 1; }
.mv-warn{
  display: block; margin: 8px 0;
  padding: 8px 12px; border-radius: 8px;
  background: #fdecea; color: #991b1b;
  font-size: 12px; border: 1px solid #f3a59a;
}

/* Pagination */
.mv-pagination{
  display: flex; align-items: center; justify-content: center;
  gap: 14px; margin: 24px 0 8px;
}
.mv-pagination span{ font-size: 13px; color: var(--uno-gray-600); }

/* Modales */
.mv-modal{
  position: fixed; inset: 0; z-index: 9000;
  background: rgba(15, 23, 42, .55);
  display: flex; align-items: center; justify-content: center;
  padding: 20px; overflow-y: auto;
}
.mv-modal[hidden]{ display: none; }
.mv-modal-card{
  background: white; border-radius: 16px;
  width: 100%; max-width: 520px;
  max-height: 90vh; overflow: hidden;
  display: flex; flex-direction: column;
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
}
.mv-modal-card-wide{ max-width: 720px; }
.mv-modal-head{
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--uno-gray-100);
}
.mv-modal-head h3{ margin: 0; font-size: 18px; color: var(--uno-gray-900); }
.mv-modal-close{
  background: transparent; border: 0; cursor: pointer;
  font-size: 26px; line-height: 1; color: var(--uno-gray-600);
  width: 32px; height: 32px; border-radius: 50%;
}
.mv-modal-close:hover{ background: var(--uno-gray-100); color: var(--uno-gray-900); }
.mv-modal-body{
  padding: 20px; overflow-y: auto;
}

/* Form */
.mv-form{ padding: 20px; display: flex; flex-direction: column; gap: 14px; overflow-y: auto; }
.mv-field{ display: flex; flex-direction: column; gap: 6px; }
.mv-field > span{ font-size: 13px; font-weight: 600; color: var(--uno-gray-700); }
.mv-field em{ color: #C7301E; font-style: normal; }
.mv-field input, .mv-field select, .mv-field textarea{
  padding: 9px 12px; border: 1px solid var(--uno-gray-100);
  border-radius: 10px; background: white;
  font-size: 14px; font-family: inherit;
  color: var(--uno-gray-900);
}
.mv-field textarea{ resize: vertical; min-height: 100px; }
.mv-field input:focus, .mv-field select:focus, .mv-field textarea:focus{
  outline: 2px solid var(--uno-green-glow); outline-offset: -1px;
  border-color: var(--uno-green);
}
.mv-field-hint{ font-size: 11px; color: var(--uno-gray-600); align-self: flex-end; }
.mv-form-actions{ display: flex; gap: 8px; justify-content: flex-end; margin-top: 8px; }
.mv-form-error{
  background: #fef2f2; color: #991b1b;
  padding: 10px 14px; border-radius: 10px; font-size: 13px;
  border: 1px solid #fecaca;
}

/* Detalle */
.mv-det-meta{ font-size: 13px; color: var(--uno-gray-600); margin-bottom: 8px; }
.mv-det-content{
  color: var(--uno-gray-800); font-size: 15px;
  line-height: 1.6; white-space: pre-wrap; margin: 12px 0;
}
.mv-det-actions{
  display: flex; gap: 8px; flex-wrap: wrap;
  padding: 10px 0; border-top: 1px solid var(--uno-gray-100);
  border-bottom: 1px solid var(--uno-gray-100);
  margin: 14px 0;
}
.mv-replicas-title{
  font-size: 14px; font-weight: 700; color: var(--uno-gray-800);
  margin: 14px 0 10px;
}
.mv-replica{
  background: var(--uno-cream); border-radius: 10px;
  padding: 12px 14px; margin-bottom: 8px;
}
.mv-replica-head{
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: var(--uno-gray-700); margin-bottom: 6px;
}
.mv-replica-content{ font-size: 14px; color: var(--uno-gray-800); white-space: pre-wrap; line-height: 1.5; }
.mv-replica-foot{
  display: flex; align-items: center; gap: 6px;
  margin-top: 8px;
}
.mv-form-replica{
  display: flex; gap: 8px; align-items: flex-start;
  margin-top: 14px;
}
.mv-form-replica textarea{
  flex: 1; min-height: 60px; padding: 9px 12px;
  border: 1px solid var(--uno-gray-100); border-radius: 10px;
  font-family: inherit; font-size: 14px;
}

/* Notificaciones */
.mv-notif-actions{ display: flex; justify-content: flex-end; margin-bottom: 12px; }
.mv-notif-list{ display: flex; flex-direction: column; gap: 6px; }
.mv-notif{
  padding: 10px 12px; background: var(--uno-cream);
  border-radius: 8px; cursor: pointer;
  display: flex; gap: 10px; align-items: flex-start;
  border-left: 3px solid transparent;
}
.mv-notif:hover{ background: var(--uno-gray-100); }
.mv-notif.mv-notif-no-leida{ border-left-color: var(--uno-yellow); background: #fffbef; }
.mv-notif-msg{ font-size: 13px; color: var(--uno-gray-800); flex: 1; }
.mv-notif-time{ font-size: 11px; color: var(--uno-gray-600); margin-top: 2px; display: block; }

@media (max-width: 720px){
  .mv-panel{ grid-template-columns: repeat(2, 1fr); }
  .mv-bell{ grid-column: span 2; justify-self: end; }
  .mv-toolbar{ flex-direction: column; align-items: stretch; }
  .mv-toolbar select, .mv-btn{ width: 100%; }
  .mv-modal-card{ max-height: 100vh; border-radius: 0; }
}

/* =====================================================================
 * Configuración → Usuarios (cfg_*)
 * ===================================================================== */

.cfg-toolbar{
  display: flex; flex-wrap: wrap; gap: 10px;
  align-items: center; margin-bottom: 16px;
}
.cfg-search{
  position: relative; flex: 1 1 320px; min-width: 240px;
}
.cfg-search svg{
  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  color: var(--uno-gray-600);
}
.cfg-search input{
  width: 100%; padding: 9px 12px 9px 36px;
  border: 1px solid var(--uno-gray-100); border-radius: 10px;
  font-size: 14px; background: white;
}
.cfg-toolbar select{
  padding: 9px 12px; border: 1px solid var(--uno-gray-100);
  border-radius: 10px; background: white; font-size: 14px;
}
.cfg-count{
  font-size: 13px; color: var(--uno-gray-600);
  margin-left: auto;
}

.cfg-table-wrap{
  background: white; border: 1px solid var(--uno-gray-100);
  border-radius: 14px; overflow: hidden;
}
.cfg-table{
  width: 100%; border-collapse: collapse;
}
.cfg-table thead th{
  text-align: left; font-size: 12px; font-weight: 600;
  color: var(--uno-gray-600); text-transform: uppercase;
  letter-spacing: .04em;
  padding: 12px 14px; background: var(--uno-cream);
  border-bottom: 1px solid var(--uno-gray-100);
}
.cfg-table tbody td{
  padding: 12px 14px; vertical-align: middle;
  border-bottom: 1px solid var(--uno-gray-100);
  font-size: 14px; color: var(--uno-gray-800);
}
.cfg-table tbody tr:last-child td{ border-bottom: 0; }
.cfg-table tbody tr:hover{ background: var(--uno-cream); }
.cfg-table .t-center{ text-align: center; }
.cfg-table .t-right{ text-align: right; }
.cfg-loading, .cfg-empty, .cfg-error{
  text-align: center; padding: 30px 16px;
  color: var(--uno-gray-600); font-size: 14px;
}
.cfg-error{ color: #991b1b; }

.cfg-avatar{
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--uno-green-deep); color: white;
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 12px; overflow: hidden;
}
.cfg-avatar img{ width: 100%; height: 100%; object-fit: cover; }
.cfg-strong{ font-weight: 600; color: var(--uno-gray-900); }
.cfg-sub{ font-size: 12px; color: var(--uno-gray-600); margin-top: 2px; }

/* Switch (master toggle) */
.cfg-switch{
  position: relative; display: inline-block;
  width: 38px; height: 22px; cursor: pointer; vertical-align: middle;
}
.cfg-switch input{ opacity: 0; width: 0; height: 0; }
.cfg-switch-slider{
  position: absolute; inset: 0; background: var(--uno-gray-300);
  border-radius: 22px; transition: background .2s;
}
.cfg-switch-slider::before{
  content: ''; position: absolute;
  width: 16px; height: 16px; left: 3px; top: 3px;
  background: white; border-radius: 50%;
  transition: transform .2s;
}
.cfg-switch input:checked + .cfg-switch-slider{ background: var(--uno-green-deep); }
.cfg-switch input:checked + .cfg-switch-slider::before{ transform: translateX(16px); }
.cfg-switch input:disabled + .cfg-switch-slider{ opacity: .5; cursor: not-allowed; }

.cfg-pill-master{
  display: inline-block; padding: 2px 8px;
  background: var(--uno-yellow); color: var(--uno-gray-900);
  border-radius: 10px; font-size: 11px; font-weight: 700;
}
.cfg-pill-modulos{
  display: inline-block; padding: 2px 10px;
  background: var(--uno-cream); color: var(--uno-gray-700);
  border-radius: 10px; font-size: 12px; font-weight: 600;
}

.cfg-pagination{
  display: flex; align-items: center; justify-content: center;
  gap: 14px; margin: 18px 0 4px;
}
.cfg-pagination span{ font-size: 13px; color: var(--uno-gray-600); }

/* Modal de accesos */
.cfg-modal-section{
  padding: 14px 16px;
  border-top: 1px solid var(--uno-gray-100);
}
.cfg-modal-section h4{
  margin: 0 0 8px; font-size: 14px; color: var(--uno-gray-800);
}
.cfg-modal-section p{ margin: 0 0 12px; font-size: 13px; color: var(--uno-gray-600); }

.cfg-modulos-grid{ display: grid; gap: 8px; }
.cfg-modulo-row{
  display: grid; grid-template-columns: 1fr auto auto;
  gap: 10px; align-items: center;
  padding: 10px 12px; background: var(--uno-cream);
  border-radius: 10px;
}
.cfg-modulo-row .cfg-modulo-info strong{ font-size: 14px; color: var(--uno-gray-900); }
.cfg-modulo-row .cfg-modulo-info span{ display: block; font-size: 12px; color: var(--uno-gray-600); }
.cfg-modulo-row select{
  padding: 6px 10px; border: 1px solid var(--uno-gray-100);
  border-radius: 8px; font-size: 13px; background: white;
}
.cfg-modulo-row .cfg-modulo-actions{ display: flex; gap: 6px; }

@media (max-width: 720px){
  .cfg-toolbar{ flex-direction: column; align-items: stretch; }
  .cfg-table thead{ display: none; }
  .cfg-table tbody td{
    display: block; padding: 6px 14px; border: 0;
  }
  .cfg-table tbody tr{
    display: block; padding: 10px 0;
    border-bottom: 1px solid var(--uno-gray-100);
  }
  .cfg-table tbody tr:last-child{ border-bottom: 0; }
  .cfg-modulo-row{ grid-template-columns: 1fr; }
}

/* =====================================================================
 * Configuración → Catálogos (cfgc-*)
 * ===================================================================== */
.cfgc-acc{
  display: flex; flex-direction: column; gap: 12px;
}
.cfgc-acc-item{
  background: white; border: 1px solid var(--uno-gray-100);
  border-radius: 14px; overflow: hidden;
}
.cfgc-acc-header{
  width: 100%; text-align: left;
  display: flex; align-items: center; gap: 12px;
  padding: 14px 18px;
  background: var(--uno-cream); border: 0;
  cursor: pointer; font: inherit;
  transition: background .15s;
}
.cfgc-acc-header:hover{ background: var(--uno-gray-100); }
.cfgc-acc-header strong{
  flex: 1; font-size: 16px; color: var(--uno-gray-900);
}
.cfgc-acc-count{
  font-size: 12px; color: var(--uno-gray-600);
  padding: 2px 10px; background: white; border-radius: 10px;
  border: 1px solid var(--uno-gray-100);
}
.cfgc-acc-chevron{
  width: 16px; height: 16px; color: var(--uno-gray-600);
  transition: transform .2s;
}
.cfgc-acc-item.is-open .cfgc-acc-chevron{ transform: rotate(90deg); }
.cfgc-acc-body{
  padding: 14px 18px 18px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 12px;
}
.cfgc-acc-item:not(.is-open) .cfgc-acc-body{ display: none; }

.cfgc-card{
  display: flex; flex-direction: column; gap: 6px;
  padding: 14px; background: white;
  border: 1px solid var(--uno-gray-100); border-radius: 12px;
  cursor: pointer; transition: all .15s; text-align: left;
  font: inherit;
}
.cfgc-card:hover{
  border-color: var(--uno-green); transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(0,0,0,.06);
}
.cfgc-card-head{ display: flex; align-items: center; gap: 8px; }
.cfgc-card-icon{
  width: 32px; height: 32px; border-radius: 8px;
  background: var(--uno-cream); color: var(--uno-green-deep);
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.cfgc-card-title{ font-weight: 600; color: var(--uno-gray-900); font-size: 14px; }
.cfgc-card-desc{ font-size: 12px; color: var(--uno-gray-600); line-height: 1.4; }

/* Detail (mantenimiento) */
.cfgc-detail-head{
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 16px; flex-wrap: wrap;
}
.cfgc-detail-title{ flex: 1; min-width: 240px; }
.cfgc-detail-title strong{
  display: block; font-size: 12px; text-transform: uppercase;
  letter-spacing: .04em; color: var(--uno-gray-600);
}
.cfgc-detail-title h2{
  margin: 2px 0 4px; font-size: 22px; color: var(--uno-gray-900);
}
.cfgc-detail-title span{ font-size: 13px; color: var(--uno-gray-600); }

/* Cell helpers */
.cfgc-color-swatch{
  display: inline-block; width: 16px; height: 16px;
  border-radius: 4px; border: 1px solid rgba(0,0,0,.1);
  vertical-align: middle; margin-right: 6px;
}
.cfgc-bool-pill{
  display: inline-block; padding: 2px 10px; border-radius: 10px;
  font-size: 11px; font-weight: 600;
}
.cfgc-bool-pill.on{ background: #eaf5e3; color: var(--uno-green-deep); }
.cfgc-bool-pill.off{ background: #f4f4f4; color: var(--uno-gray-600); }

/* Form fields auto-grid */
.cfgc-field-row{
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 10px;
}
@media (max-width: 540px){
  .cfgc-field-row{ grid-template-columns: 1fr; }
}
.cfgc-color-input{
  display: flex; gap: 8px; align-items: center;
}
.cfgc-color-input input[type="color"]{
  width: 44px; height: 36px; padding: 0;
  border: 1px solid var(--uno-gray-100); border-radius: 8px;
  background: white; cursor: pointer;
}
.cfgc-bool-field{
  display: flex; align-items: center; gap: 10px;
  padding: 8px 0;
}
.cfgc-bool-field span{ font-size: 13px; color: var(--uno-gray-700); font-weight: 500; }
.cfgc-toggle-inactivos{
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--uno-gray-700);
  cursor: pointer;
}
.cfgc-toggle-inactivos input{ width: 16px; height: 16px; cursor: pointer; }

/* =====================================================================
 * Transparencia (tr-*)
 * ===================================================================== */
.tr-tabs{
  display: flex; gap: 4px; align-items: center;
  margin-bottom: 18px;
  border-bottom: 1px solid var(--uno-gray-100);
}
.tr-tab{
  padding: 10px 16px; background: transparent; border: 0;
  font: inherit; font-weight: 500; cursor: pointer;
  color: var(--uno-gray-600);
  border-bottom: 2px solid transparent;
  transition: all .15s; margin-bottom: -1px;
}
.tr-tab:hover{ color: var(--uno-gray-900); }
.tr-tab.is-active{
  color: var(--uno-green-deep);
  border-bottom-color: var(--uno-green-deep);
  font-weight: 600;
}
.tr-tab-spacer{ flex: 1; }
.tr-select{
  padding: 7px 12px; border: 1px solid var(--uno-gray-100);
  border-radius: 8px; background: white; font-size: 13px;
  color: var(--uno-gray-700);
}

.tr-kpis{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px; margin-bottom: 18px;
}
.tr-kpi{
  background: white; border: 1px solid var(--uno-gray-100);
  border-radius: 14px; padding: 18px 20px;
  border-left: 4px solid var(--uno-gray-300);
}
.tr-kpi.tr-kpi-ingresos{ border-left-color: var(--uno-green-deep); }
.tr-kpi.tr-kpi-gastos{ border-left-color: #C7301E; }
.tr-kpi.tr-kpi-balance{ border-left-color: var(--uno-blue); }
.tr-kpi.tr-kpi-balance.is-deficit{ border-left-color: #C7301E; }
.tr-kpi.tr-kpi-movs{ border-left-color: var(--uno-yellow); }
.tr-kpi-label{
  display: block; font-size: 12px; text-transform: uppercase;
  letter-spacing: .04em; color: var(--uno-gray-600); font-weight: 600;
  margin-bottom: 8px;
}
.tr-kpi strong{
  display: block; font-size: 24px; font-weight: 700;
  color: var(--uno-gray-900); line-height: 1.1;
}
.tr-kpi-sub{
  display: block; font-size: 12px; color: var(--uno-gray-600);
  margin-top: 6px;
}
.tr-kpi-sub em{ color: var(--uno-gray-800); font-style: normal; font-weight: 600; }

.tr-row-charts{
  display: grid;
  grid-template-columns: 1fr 1fr; gap: 14px;
  margin-bottom: 14px;
}
@media (max-width: 900px){ .tr-row-charts{ grid-template-columns: 1fr; } }

.tr-card{
  background: white; border: 1px solid var(--uno-gray-100);
  border-radius: 14px; padding: 18px 20px;
  margin-bottom: 14px;
}
.tr-card h3{
  margin: 0 0 14px; font-size: 15px; color: var(--uno-gray-900);
  font-weight: 600;
}
.tr-chart-wrap{
  position: relative; height: 240px;
}
.tr-chart-wide{ height: 280px; }

.tr-legend{
  display: flex; flex-direction: column; gap: 4px;
  font-size: 12px; margin-top: 8px;
}
.tr-legend-row{
  display: flex; align-items: center; gap: 8px;
  padding: 4px 0; border-bottom: 1px solid var(--uno-gray-100);
}
.tr-legend-row:last-child{ border-bottom: 0; }
.tr-legend-dot{
  width: 10px; height: 10px; border-radius: 50%;
  flex-shrink: 0;
}
.tr-legend-name{ flex: 1; color: var(--uno-gray-700); }
.tr-legend-val{ color: var(--uno-gray-900); font-weight: 600; }
.tr-legend-pct{ color: var(--uno-gray-600); width: 50px; text-align: right; }

.tr-top-table{
  width: 100%; border-collapse: collapse;
}
.tr-top-table tr{ border-bottom: 1px solid var(--uno-gray-100); }
.tr-top-table tr:last-child{ border-bottom: 0; }
.tr-top-table td{
  padding: 8px 6px; font-size: 13px; vertical-align: top;
}
.tr-top-table td:first-child{ color: var(--uno-gray-700); }
.tr-top-table td:last-child{
  text-align: right; font-weight: 600; color: var(--uno-gray-900);
  white-space: nowrap;
}
.tr-top-table .tr-cuenta-codigo{
  font-size: 11px; color: var(--uno-gray-600);
  display: block; font-family: ui-monospace, monospace;
}

/* Informe trimestral */
.tr-informe-tabs{
  display: flex; gap: 4px; flex-wrap: wrap;
  margin-bottom: 14px;
}
.tr-inf-resumen{
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
}
.tr-inf-resumen > div{
  display: flex; flex-direction: column;
  padding: 12px; background: var(--uno-cream); border-radius: 10px;
}
.tr-inf-resumen span{ font-size: 11px; color: var(--uno-gray-600); text-transform: uppercase; letter-spacing: .04em; }
.tr-inf-resumen strong{ font-size: 18px; color: var(--uno-gray-900); margin-top: 4px; }

.tr-detail-table{
  width: 100%; border-collapse: collapse; font-size: 13px;
}
.tr-detail-table thead th{
  text-align: left; font-size: 11px; font-weight: 600;
  color: var(--uno-gray-600); text-transform: uppercase;
  letter-spacing: .04em; padding: 8px 8px;
  border-bottom: 1px solid var(--uno-gray-100); background: var(--uno-cream);
}
.tr-detail-table thead th.t-right{ text-align: right; }
.tr-detail-table tbody td{
  padding: 8px 8px; border-bottom: 1px solid var(--uno-gray-100);
  color: var(--uno-gray-800);
}
.tr-detail-table tbody td.t-right{ text-align: right; font-weight: 600; }
.tr-detail-table tbody tr:last-child td{ border-bottom: 0; }
.tr-detail-table tfoot td{
  padding: 10px 8px; border-top: 2px solid var(--uno-gray-300);
  font-weight: 700; background: var(--uno-cream);
}
.tr-detail-table tfoot td.t-right{ text-align: right; }

.tr-loading, .tr-error, .tr-empty{
  text-align: center; padding: 30px 16px;
  color: var(--uno-gray-600); font-size: 14px;
}
.tr-error{ color: #991b1b; }

/* ============ Cuentas por Pagar (fin-ctas-pagar) ============ */
.cxp-aging-card{
  background: white;
  border: 1px solid rgba(15, 61, 34, 0.08);
  border-radius: 12px;
  padding: 12px 14px;
  cursor: pointer;
  transition: all .15s ease;
  display: flex; flex-direction: column; gap: 4px;
  border-left: 4px solid var(--uno-gray-300);
}
.cxp-aging-card:hover{
  transform: translateY(-1px);
  border-color: rgba(15, 61, 34, 0.18);
  box-shadow: 0 4px 14px rgba(15, 61, 34, 0.08);
}
.cxp-aging-card.active{
  background: rgba(139, 195, 74, 0.10);
  border-color: var(--uno-green, #2e7d32);
  box-shadow: inset 0 0 0 1px rgba(46, 125, 50, 0.25);
}
.cxp-aging-card .label{
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--uno-gray-600);
  font-weight: 600;
}
.cxp-aging-card .monto{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--uno-ink);
}
.cxp-aging-card .count{
  font-size: .75rem;
  color: var(--uno-gray-600);
}
.cxp-aging-card[data-bucket="VIGENTE"]{ border-left-color: #2e7d32; }
.cxp-aging-card[data-bucket="1-30"]  { border-left-color: #f1c40f; }
.cxp-aging-card[data-bucket="31-60"] { border-left-color: #e67e22; }
.cxp-aging-card[data-bucket="61-90"] { border-left-color: #d35400; }
.cxp-aging-card[data-bucket="+90"]   { border-left-color: #c0392b; }

.cxp-pill{
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .02em;
}
.cxp-pill.vigente { background: rgba(46, 125, 50, 0.12);  color: #2e7d32; }
.cxp-pill.b1-30   { background: rgba(241, 196, 15, 0.18); color: #b7950b; }
.cxp-pill.b31-60  { background: rgba(230, 126, 34, 0.16); color: #c66b1e; }
.cxp-pill.b61-90  { background: rgba(211, 84, 0, 0.16);   color: #b34900; }
.cxp-pill.bplus90 { background: rgba(192, 57, 43, 0.18);  color: #b53527; }

.cxp-est-pill{
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 600;
  background: var(--uno-cream);
  color: var(--uno-gray-700);
}
.cxp-est-pill.pendiente{ background: rgba(241, 196, 15, 0.15); color: #b7950b; }
.cxp-est-pill.aprobado { background: rgba(52, 152, 219, 0.12); color: #1f6391; }

@media (max-width: 720px) {
  .cxp-aging{ grid-template-columns: repeat(2, 1fr) !important; }
}

/* ============ Plan Contable (fin-catalogos) ============ */
.gfcc-row{ }
.gfcc-row.lvl-1{ background: rgba(15, 61, 34, 0.04); font-weight: 700; }
.gfcc-row.lvl-2{ background: rgba(15, 61, 34, 0.02); font-weight: 600; }
.gfcc-row.inactivo{ opacity: 0.55; }
.gfcc-row td{ vertical-align: middle; }
.gfcc-name{
  display: flex; align-items: center; gap: 6px;
  white-space: nowrap;
}
.gfcc-toggle{
  width: 22px; height: 22px;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; user-select: none;
  border-radius: 4px;
  color: var(--uno-gray-600);
  font-family: monospace;
  font-size: 14px;
  transition: background .15s ease;
}
.gfcc-toggle:hover{ background: rgba(15, 61, 34, 0.08); color: var(--uno-ink); }
.gfcc-toggle.empty{ visibility: hidden; }
.gfcc-codigo{
  font-family: 'Orbitron', sans-serif;
  font-size: 0.82rem;
  color: var(--uno-gray-700);
  letter-spacing: 0.02em;
  margin-right: 8px;
  min-width: 84px;
  display: inline-block;
}
.gfcc-pill{
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: .7rem;
  font-weight: 600;
  letter-spacing: .02em;
}
.gfcc-pill.t-ACTIVO     { background: rgba(46, 125, 50, 0.12);  color: #2e7d32; }
.gfcc-pill.t-PASIVO     { background: rgba(192, 57, 43, 0.12);  color: #c0392b; }
.gfcc-pill.t-PATRIMONIO { background: rgba(123, 62, 157, 0.12); color: #7b3e9d; }
.gfcc-pill.t-INGRESO    { background: rgba(31, 99, 145, 0.12);  color: #1f6391; }
.gfcc-pill.t-GASTO      { background: rgba(181, 53, 39, 0.12);  color: #b53527; }
.gfcc-pill.t-ORDEN      { background: rgba(125, 102, 8, 0.14);  color: #7d6608; }
.gfcc-pill.n-DEUDORA    { background: rgba(15, 61, 34, 0.06);   color: var(--uno-gray-700); }
.gfcc-pill.n-ACREEDORA  { background: rgba(15, 61, 34, 0.06);   color: var(--uno-gray-700); }
.gfcc-pill.e-ACTIVO     { background: rgba(46, 125, 50, 0.12);  color: #2e7d32; }
.gfcc-pill.e-INACTIVO   { background: var(--uno-cream); color: var(--uno-gray-600); }
.gfcc-mov-check{
  display: inline-block;
  width: 18px; height: 18px;
  border-radius: 4px;
  background: rgba(46, 125, 50, 0.18);
  color: #2e7d32;
  font-weight: 700;
  text-align: center;
  line-height: 18px;
}
.gfcc-mov-dash{ color: var(--uno-gray-400); }

/* ============ Manual embebido en modal (gfp-manual) ============ */
.manual-doc{
  font-size: 14px;
  line-height: 1.55;
  color: var(--uno-ink);
}
.manual-doc h1, .manual-doc h2, .manual-doc h3, .manual-doc h4{
  color: var(--uno-green-deep, #0f3d22);
  margin: 24px 0 10px 0;
  font-family: 'Orbitron', sans-serif;
  font-weight: 700;
  letter-spacing: 0.01em;
}
.manual-doc h1{ font-size: 20px; border-bottom: 2px solid var(--uno-green-deep, #0f3d22); padding-bottom: 6px; }
.manual-doc h2{ font-size: 17px; }
.manual-doc h3{ font-size: 15px; }
.manual-doc h4{ font-size: 14px; color: var(--uno-gray-700); }
.manual-doc p{ margin: 8px 0; }
.manual-doc ul, .manual-doc ol{ margin: 8px 0 8px 24px; padding-left: 6px; }
.manual-doc ul li, .manual-doc ol li{ margin: 4px 0; }
.manual-doc strong{ color: var(--uno-ink); }
.manual-doc em{ color: var(--uno-gray-700); }
.manual-doc code{
  background: var(--uno-cream); border-radius: 4px;
  padding: 2px 6px; font-family: monospace; font-size: 0.88em;
  color: #b53527;
}
.manual-doc pre{
  background: var(--uno-cream);
  border: 1px solid rgba(15,61,34,0.08);
  border-radius: 8px;
  padding: 12px 14px;
  font-family: monospace;
  font-size: 0.85em;
  overflow-x: auto;
  margin: 10px 0;
  color: var(--uno-gray-800);
}
.manual-doc pre code{ background: transparent; padding: 0; color: inherit; }
.manual-doc table{
  width: 100%;
  border-collapse: collapse;
  margin: 14px 0;
  font-size: 13px;
}
.manual-doc table thead th{
  background: var(--uno-green-deep, #0f3d22);
  color: white;
  text-align: left;
  padding: 8px 10px;
  font-weight: 600;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.manual-doc table tbody td{
  padding: 8px 10px;
  border-bottom: 1px solid var(--uno-gray-100);
  vertical-align: top;
}
.manual-doc table tbody tr:nth-child(even){ background: rgba(15,61,34,0.025); }
.manual-doc blockquote{
  background: rgba(241, 196, 15, 0.08);
  border-left: 4px solid #f1c40f;
  padding: 10px 14px;
  margin: 12px 0;
  border-radius: 0 8px 8px 0;
}
.manual-doc hr{
  border: 0;
  border-top: 1px solid rgba(15,61,34,0.1);
  margin: 18px 0;
}

/* ===== Donaciones públicas — tabs + form + modal Cardnet ===== */
.join-tabs{
  display: flex;
  gap: 6px;
  margin: 0 auto 18px;
  background: rgba(15, 61, 34, 0.04);
  padding: 4px;
  border-radius: 12px;
  width: fit-content;
}
.join-tab{
  padding: 9px 22px;
  font-size: 0.88rem;
  font-weight: 600;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: var(--uno-gray-700);
  cursor: pointer;
  transition: all .15s ease;
}
.join-tab:hover{ color: var(--uno-ink); }
.join-tab.is-active{
  background: white;
  color: var(--uno-green-deep);
  box-shadow: 0 2px 6px rgba(15, 61, 34, 0.08);
}

.donate-pane{
  display: flex;
  flex-direction: column;
  gap: 18px;
  background: white;
  border-radius: var(--radius-lg);
  padding: 36px;
  color: var(--uno-ink);
  box-shadow: 0 30px 80px rgba(0,0,0,0.2);
}
.donate-pane[hidden]{ display: none !important; }
.donate-form-title{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.4rem;
  font-weight: 600;
  margin: 0 0 4px;
  color: var(--uno-ink);
}
.donate-policy{
  background: rgba(111, 190, 68, 0.08);
  border: 1px solid rgba(111, 190, 68, 0.25);
  padding: 14px 16px;
  border-radius: 10px;
}
.donate-policy h3{
  font-size: 0.95rem; margin: 0 0 6px;
  color: var(--uno-green-deep);
  font-family: 'Orbitron', sans-serif;
}
.donate-policy p{ font-size: 0.82rem; color: var(--uno-gray-700); margin: 0 0 6px; line-height: 1.5; }
.donate-policy ul{ margin: 4px 0 0 18px; padding: 0; font-size: 0.8rem; color: var(--uno-gray-700); line-height: 1.55; }
.donate-policy li{ margin-bottom: 3px; }

.donate-form{ display: flex; flex-direction: column; gap: 12px; }
.donate-amounts{ display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.donate-chip{
  padding: 7px 14px;
  font-size: 0.82rem;
  font-weight: 600;
  border: 1px solid rgba(15, 61, 34, 0.18);
  background: white;
  color: var(--uno-gray-700);
  border-radius: 999px;
  cursor: pointer;
  transition: all .15s ease;
}
.donate-chip:hover{ border-color: var(--uno-green); color: var(--uno-green); }
.donate-chip.is-active{ background: var(--uno-green); color: white; border-color: var(--uno-green); }

.don-id-status{
  display: block; margin-top: 6px;
  font-size: 0.78rem;
  padding: 6px 10px;
  border-radius: 6px;
}
.don-id-status--ok  { background: rgba(111, 190, 68, 0.14); color: var(--uno-green-deep); }
.don-id-status--err { background: rgba(192, 57, 43, 0.10);  color: #c0392b; }
.don-id-status--info{ background: rgba(15, 61, 34, 0.06);   color: var(--uno-gray-700); }

.don-anonima{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  background: rgba(15, 61, 34, 0.04);
  border: 1px solid rgba(15, 61, 34, 0.10);
  border-radius: 10px;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
.don-anonima:hover{ border-color: rgba(111, 190, 68, 0.45); }
.don-anonima input[type=checkbox]{
  width: 18px; height: 18px;
  margin-top: 2px;
  accent-color: var(--uno-green);
  cursor: pointer;
  flex-shrink: 0;
}
.don-anonima span{ display: flex; flex-direction: column; gap: 2px; }
.don-anonima strong{ font-size: 0.88rem; font-weight: 600; color: var(--uno-ink); }
.don-anonima small{ font-size: 0.78rem; line-height: 1.45; color: var(--uno-gray-700); }

/* Modal de pago Cardnet */
.pay-card{ max-width: 460px; padding: 28px 28px 22px; }
.pay-head{ text-align: center; margin-bottom: 18px; }
.pay-cardnet-logo{
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 0.78rem; font-weight: 600;
  color: var(--uno-gray-700);
  background: rgba(15, 61, 34, 0.06);
  padding: 5px 12px;
  border-radius: 999px;
  margin-bottom: 14px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.pay-head h3{
  font-size: 1.1rem;
  margin: 0 0 6px;
  font-family: 'Orbitron', sans-serif;
  color: var(--uno-ink);
}
.pay-amount{
  font-size: 2rem;
  font-weight: 700;
  font-family: 'Courier New', monospace;
  color: var(--uno-green-deep);
  margin: 6px 0 4px;
}
.pay-promesa{ display: block; font-size: 0.78rem; color: var(--uno-gray-600); }

.pay-form{ display: flex; flex-direction: column; gap: 12px; }
.pay-form input{
  font-family: 'Courier New', monospace;
  letter-spacing: 0.04em;
}
.pay-hint{ font-size: 0.72rem; color: var(--uno-gray-600); margin-top: 4px; display: block; }
.pay-actions{ display: flex; gap: 8px; margin-top: 8px; }
.pay-actions .btn{ flex: 1; justify-content: center; padding: 11px 16px; }
.pay-status{ font-size: 0.85rem; padding: 10px 12px; border-radius: 8px; }
.pay-status-error{ background: rgba(192, 57, 43, 0.10); color: #c0392b; }

.pay-success{ text-align: center; padding: 12px 0; }
.pay-check{
  width: 64px; height: 64px;
  margin: 0 auto 14px;
  background: rgba(111, 190, 68, 0.18);
  color: var(--uno-green-deep);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.pay-success h3{ font-size: 1.2rem; margin: 0 0 6px; color: var(--uno-ink); }
.pay-success p{ font-size: 0.88rem; color: var(--uno-gray-700); margin: 0 0 18px; line-height: 1.5; }
.pay-success-actions{ display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.pay-success-actions .btn{ padding: 10px 18px; font-size: 0.88rem; }
.pay-email-info{
  font-size: 0.85rem;
  padding: 10px 14px;
  border-radius: 8px;
  margin: 14px 0 4px;
  text-align: left;
  line-height: 1.5;
}
.pay-email-info--ok{   background: rgba(111, 190, 68, 0.14); color: var(--uno-green-deep); }
.pay-email-info--warn{ background: rgba(243, 156, 18, 0.14); color: #b35908; }

/* ===== UNIX Chat público (landing /unete) ===== */
/* El contenedor padre .nova-visual tiene aspect-ratio:1 y display:grid;
   los neutralizamos cuando contiene el chat. */
.nova-visual--chat,
.nova-visual:has(.upx-chat){
  aspect-ratio: auto !important;
  display: block !important;
}
.upx-chat{
  background: white;
  border-radius: 18px;
  box-shadow: 0 20px 50px rgba(15, 61, 34, 0.18), 0 6px 18px rgba(15, 61, 34, 0.08);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 540px;
  max-height: calc(100vh - 160px);
  border: 1px solid rgba(15, 61, 34, 0.08);
}
.upx-head{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: linear-gradient(135deg, var(--uno-green) 0%, var(--uno-green-deep) 100%);
  color: white;
}
.upx-stage{
  position: relative;
  width: 56px;
  height: 56px;
  min-width: 56px;
  min-height: 56px;
  border-radius: 50%;
  overflow: hidden !important;
  background: #0f3d22;
  border: 2px solid rgba(255,255,255,0.25);
  flex-shrink: 0;
  display: block;
}
.upx-stage > .upx-video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  display: block;
  transition: opacity .25s ease;
}
.upx-stage > .upx-video.is-active{ opacity: 1; }
.upx-id{ flex: 1; display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.upx-id strong{ font-family: 'Orbitron', sans-serif; font-size: 1rem; letter-spacing: 0.02em; }
.upx-id span{ font-size: 0.78rem; opacity: 0.85; display: inline-flex; align-items: center; gap: 6px; }
.upx-dot{
  width: 8px; height: 8px; border-radius: 50%;
  background: #8BD15F;
  box-shadow: 0 0 0 0 rgba(111, 190, 68, 0.6);
  animation: unixPulse 2s infinite;
}
.upx-mute{
  width: 36px; height: 36px;
  border: 0;
  border-radius: 50%;
  background: rgba(255,255,255,0.15);
  color: white;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .15s ease, opacity .15s ease;
}
.upx-mute:hover{ background: rgba(255,255,255,0.25); }
.upx-mute[aria-pressed="false"]{ opacity: 0.45; }

.upx-messages{
  flex: 1;
  overflow-y: auto;
  padding: 16px 16px 8px;
  background: #fafaf6;
  display: flex; flex-direction: column; gap: 12px;
}
.upx-msg{ display: flex; }
.upx-msg-user{ justify-content: flex-end; }
.upx-msg-user .upx-bubble{
  background: var(--uno-green);
  color: white;
  border-radius: 14px 14px 4px 14px;
  max-width: 82%;
}
.upx-msg-bot .upx-bubble{
  background: white;
  color: var(--uno-ink, #111);
  border-radius: 4px 14px 14px 14px;
  border: 1px solid rgba(15, 61, 34, 0.08);
  max-width: 86%;
}
.upx-bubble{
  padding: 10px 14px;
  font-size: 0.92rem;
  line-height: 1.5;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.upx-bubble p{ margin: 0; }
.upx-bubble p + p{ margin-top: 8px; }
.upx-typing{ display: inline-flex; gap: 4px; padding: 4px 0; }
.upx-typing span{
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--uno-gray-600, #777);
  animation: unixDot 1.2s infinite ease-in-out;
}
.upx-typing span:nth-child(2){ animation-delay: .15s; }
.upx-typing span:nth-child(3){ animation-delay: .3s; }

.upx-suggestions{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding-top: 4px;
}
.upx-chip{
  border: 1px solid rgba(15, 61, 34, 0.18);
  background: white;
  color: var(--uno-green-deep);
  padding: 6px 12px;
  font-size: 0.78rem;
  font-weight: 500;
  border-radius: 999px;
  cursor: pointer;
  transition: all .15s ease;
}
.upx-chip:hover{ background: var(--uno-green); color: white; border-color: var(--uno-green); }

.upx-play-btn{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  padding: 7px 14px;
  background: var(--uno-green);
  color: white;
  border: 0;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s ease, transform .15s ease;
}
.upx-play-btn:hover{ background: var(--uno-green-deep); transform: scale(1.02); }
.upx-play-btn svg{ flex-shrink: 0; }

.upx-input{
  display: flex; gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid rgba(15, 61, 34, 0.06);
  background: white;
}
.upx-input input{
  flex: 1;
  border: 1px solid rgba(15, 61, 34, 0.14);
  border-radius: 12px;
  padding: 10px 14px;
  font-size: 0.92rem;
  outline: none;
  transition: border-color .15s ease;
}
.upx-input input:focus{ border-color: var(--uno-green); }
.upx-input button{
  width: 42px; height: 42px;
  border: 0;
  background: var(--uno-green);
  color: white;
  border-radius: 12px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.upx-input button:hover{ background: #0c2e1a; }
.upx-input button:disabled{ opacity: 0.5; cursor: not-allowed; }

@media (max-width: 880px){
  .upx-chat{ height: 460px; }
  .upx-bubble{ max-width: 92%; }
}

/* ===== UNIX Chat (asistente IA en portal afiliados) ===== */
.unix-chat{
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 18px;
  height: calc(100vh - 240px);
  min-height: 520px;
  max-height: 800px;
}
.unix-side{
  background: linear-gradient(160deg, #f4f7f1 0%, #e7efe2 100%);
  border-radius: 16px;
  border: 1px solid rgba(15, 61, 34, 0.08);
  padding: 22px 18px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  overflow-y: auto;
}
.unix-side-avatar{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(15, 61, 34, 0.08);
}
.unix-stage{
  position: relative;
  width: 168px;
  height: 168px;
  border-radius: 50%;
  overflow: hidden;
  background: #0f3d22;
  box-shadow: 0 8px 28px rgba(15, 61, 34, 0.18);
  border: 4px solid white;
  margin-bottom: 12px;
  animation: unixFloat 4s ease-in-out infinite;
}
.unix-stage::after{
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  pointer-events: none;
  box-shadow: 0 0 0 0 rgba(111, 190, 68, 0.5);
  transition: box-shadow .3s ease;
}
.unix-stage[data-state="speaking"]::after{ animation: unixGlow 1.5s ease-in-out infinite; }
.unix-stage[data-state="thinking"]::after{ animation: unixGlow 2.2s ease-in-out infinite; }
@keyframes unixGlow{
  0%, 100%{ box-shadow: 0 0 0 0 rgba(111, 190, 68, 0.45); }
  50%{ box-shadow: 0 0 0 12px rgba(111, 190, 68, 0); }
}
.unix-video{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity .25s ease;
}
.unix-video.is-active{ opacity: 1; }
@keyframes unixFloat{
  0%, 100%{ transform: translateY(0); }
  50%{ transform: translateY(-6px); }
}
.unix-side-name{
  font-family: 'Orbitron', sans-serif;
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--uno-ink);
  margin: 4px 0 2px;
}
.unix-side-role{
  font-size: 0.78rem;
  color: var(--uno-gray-700);
  margin: 0;
}
.unix-side-status{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.72rem;
  color: var(--uno-gray-700);
  margin-bottom: 4px;
}
.unix-status-dot{
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--uno-green);
  box-shadow: 0 0 0 0 rgba(111, 190, 68, 0.5);
  animation: unixPulse 2s infinite;
}
@keyframes unixPulse{
  0%{ box-shadow: 0 0 0 0 rgba(111, 190, 68, 0.5); }
  70%{ box-shadow: 0 0 0 8px rgba(111, 190, 68, 0); }
  100%{ box-shadow: 0 0 0 0 rgba(111, 190, 68, 0); }
}
.unix-side-controls{ display: flex; flex-direction: column; gap: 16px; }
.unix-side-group{ display: flex; flex-direction: column; gap: 8px; }
.unix-side-label{
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--uno-gray-700);
}
.unix-main{
  background: white;
  border-radius: 16px;
  border: 1px solid rgba(15, 61, 34, 0.08);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.unix-chat-length{ display: flex; gap: 6px; }
.unix-chat-length .unix-len-btn{ flex: 1; }
.unix-len-btn{
  border: 1px solid rgba(15, 61, 34, 0.14);
  background: white;
  color: var(--uno-gray-700);
  padding: 6px 12px;
  font-size: 0.78rem;
  font-weight: 600;
  border-radius: 999px;
  cursor: pointer;
  transition: all .15s ease;
}
.unix-len-btn:hover{ border-color: var(--uno-green); color: var(--uno-green); }
.unix-len-btn.is-active{
  background: var(--uno-green);
  color: white;
  border-color: var(--uno-green);
}
.unix-clear-btn{
  border: 1px solid rgba(15, 61, 34, 0.14);
  background: white;
  color: var(--uno-gray-700);
  padding: 9px 12px;
  font-size: 0.82rem;
  font-weight: 500;
  border-radius: 10px;
  cursor: pointer;
  width: 100%;
  text-align: center;
}
.unix-clear-btn:hover{ background: rgba(15, 61, 34, 0.04); color: var(--uno-ink); border-color: var(--uno-green); }
.unix-voice-btn.is-on{ background: var(--uno-green); color: white; border-color: var(--uno-green); }
.unix-voice-btn.is-on:hover{ background: #4E9A2D; color: white; border-color: #4E9A2D; }

.unix-chat-messages{
  flex: 1;
  overflow-y: auto;
  padding: 18px 18px 8px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.unix-msg{ display: flex; gap: 10px; align-items: flex-start; }
.unix-msg-user{ justify-content: flex-end; }
.unix-msg-user .unix-bubble{
  background: var(--uno-green);
  color: white;
  border-radius: 14px 14px 4px 14px;
}
.unix-msg-bot .unix-bubble{
  background: rgba(15, 61, 34, 0.06);
  color: var(--uno-ink);
  border-radius: 4px 14px 14px 14px;
}
.unix-bubble{
  padding: 10px 14px;
  max-width: 78%;
  font-size: 0.92rem;
  line-height: 1.5;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.unix-bubble p{ margin: 0; }
.unix-bubble p + p{ margin-top: 8px; }
.unix-avatar{
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--uno-green);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Orbitron', sans-serif;
  font-weight: 700;
  font-size: 0.85rem;
}
.unix-typing{ display: inline-flex; gap: 4px; padding: 4px 0; }
.unix-typing span{
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--uno-gray-600);
  animation: unixDot 1.2s infinite ease-in-out;
}
.unix-typing span:nth-child(2){ animation-delay: .15s; }
.unix-typing span:nth-child(3){ animation-delay: .3s; }
@keyframes unixDot{
  0%, 60%, 100%{ opacity: 0.3; transform: translateY(0); }
  30%{ opacity: 1; transform: translateY(-3px); }
}

.unix-suggestions{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding-left: 42px;
  margin-top: -4px;
}
.unix-chip{
  border: 1px solid rgba(15, 61, 34, 0.18);
  background: white;
  color: var(--uno-green);
  padding: 5px 11px;
  font-size: 0.78rem;
  font-weight: 500;
  border-radius: 999px;
  cursor: pointer;
  transition: all .15s ease;
}
.unix-chip:hover{ background: var(--uno-green); color: white; border-color: var(--uno-green); }

.unix-chat-input{
  display: flex;
  gap: 8px;
  padding: 12px 14px;
  border-top: 1px solid rgba(15, 61, 34, 0.06);
  background: rgba(15, 61, 34, 0.02);
}
.unix-chat-input input{
  flex: 1;
  border: 1px solid rgba(15, 61, 34, 0.14);
  background: white;
  border-radius: 12px;
  padding: 11px 14px;
  font-size: 0.92rem;
  color: var(--uno-ink);
  outline: none;
  transition: border-color .15s ease;
}
.unix-chat-input input:focus{ border-color: var(--uno-green); }
.unix-chat-input button{
  width: 44px;
  height: 44px;
  border: 0;
  background: var(--uno-green);
  color: white;
  border-radius: 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s ease;
}
.unix-chat-input button:hover{ background: #0c2e1a; }
.unix-chat-input button:disabled{ opacity: 0.5; cursor: not-allowed; }

/* ===== Avatar UNIX (configuración) ===== */
.unix-avatar-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
}
.unix-avatar-card{
  background: white;
  border: 1px solid rgba(15, 61, 34, 0.08);
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.unix-avatar-preview{
  position: relative;
  aspect-ratio: 1 / 1;
  background: #0f3d22;
  display: flex;
  align-items: center;
  justify-content: center;
}
.unix-avatar-preview video{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.unix-avatar-play{
  position: absolute;
  bottom: 10px;
  right: 10px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 0;
  background: rgba(0,0,0,0.55);
  color: white;
  cursor: pointer;
  font-size: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.unix-avatar-play:hover{ background: var(--uno-green); }
.unix-avatar-meta{ padding: 12px 14px 6px; }
.unix-avatar-meta h3{ font-size: 1rem; margin: 0 0 4px; color: var(--uno-ink); }
.unix-avatar-meta p{ font-size: 0.82rem; color: var(--uno-gray-700); margin: 0 0 6px; line-height: 1.45; }
.unix-avatar-meta small{ font-size: 0.72rem; color: var(--uno-gray-600); }
.unix-avatar-meta code{
  background: rgba(15, 61, 34, 0.05);
  padding: 1px 5px;
  border-radius: 4px;
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: 0.72rem;
}
.unix-avatar-form{
  padding: 10px 14px 14px;
  border-top: 1px solid rgba(15, 61, 34, 0.06);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.unix-avatar-file{
  flex: 1;
  min-width: 0;
  position: relative;
  overflow: hidden;
  border: 1px dashed rgba(15, 61, 34, 0.25);
  border-radius: 8px;
  padding: 7px 10px;
  font-size: 0.78rem;
  color: var(--uno-gray-700);
  cursor: pointer;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.unix-avatar-file input[type=file]{
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}
.unix-avatar-file:hover{ border-color: var(--uno-green); color: var(--uno-green); }
.unix-avatar-status{ font-size: 0.78rem; color: var(--uno-gray-700); flex-basis: 100%; }
.unix-avatar-status.ok{ color: var(--uno-green-deep); }
.unix-avatar-status.err{ color: #c0392b; }

/* Variante compacta de .btn para secciones de configuración UNIX */
.unix-voz-actions .btn,
.unix-kb-actions .btn,
.unix-avatar-form .btn{
  padding: 9px 16px;
  font-size: 0.85rem;
  border-radius: 10px;
  box-shadow: none;
}
.btn-sm{ padding: 7px 14px; font-size: 0.78rem; border-radius: 8px; box-shadow: none; }

/* ===== Voz UNIX (configuración) ===== */
.unix-voz-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  align-items: start;
}
.unix-voz-card{
  background: white;
  border: 1px solid rgba(15, 61, 34, 0.08);
  border-radius: 14px;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.unix-voz-card h3{
  font-family: 'Orbitron', sans-serif;
  font-size: 1rem;
  font-weight: 700;
  color: var(--uno-ink);
  margin: 0;
}
.unix-voz-help{
  font-size: 0.82rem;
  color: var(--uno-gray-700);
  line-height: 1.5;
  margin: 0;
}
.unix-voz-field{ display: flex; flex-direction: column; gap: 6px; }
.unix-voz-field > span{
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--uno-gray-700);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.unix-voz-field > span em{
  font-style: normal;
  font-weight: 500;
  color: var(--uno-green-deep);
  font-family: ui-monospace, SFMono-Regular, monospace;
  text-transform: none;
  letter-spacing: 0;
}
.unix-voz-field select{
  border: 1px solid rgba(15, 61, 34, 0.14);
  border-radius: 8px;
  padding: 9px 12px;
  font-size: 0.92rem;
  color: var(--uno-ink);
  background: white;
  outline: none;
}
.unix-voz-field select:focus{ border-color: var(--uno-green); }
.unix-voz-field input[type=range]{
  width: 100%;
  accent-color: var(--uno-green);
}
.unix-voz-card textarea{
  border: 1px solid rgba(15, 61, 34, 0.14);
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 0.92rem;
  color: var(--uno-ink);
  resize: vertical;
  min-height: 90px;
  font-family: inherit;
  outline: none;
}
.unix-voz-card textarea:focus{ border-color: var(--uno-green); }
.unix-voz-suggestions{ display: flex; flex-wrap: wrap; gap: 6px; }
.unix-voz-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 4px;
}
.unix-voz-status{ font-size: 0.82rem; color: var(--uno-gray-700); margin-left: auto; }
.unix-voz-status.ok{ color: var(--uno-green-deep); }
.unix-voz-status.err{ color: #c0392b; }

@media (max-width: 900px){
  .unix-voz-grid{ grid-template-columns: 1fr; }
}

/* ===== Prompt del sistema (UNIX) ===== */
.unix-prompt{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  align-items: stretch;
  min-height: 480px;
}
.unix-prompt-card{
  background: white;
  border: 1px solid rgba(15, 61, 34, 0.08);
  border-radius: 14px;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}
.unix-prompt-locked{
  background: linear-gradient(160deg, #fafaf6 0%, #f3f1e8 100%);
  border-color: rgba(180, 140, 30, 0.25);
}
.unix-prompt-card-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.unix-prompt-card-head h3{
  font-family: 'Orbitron', sans-serif;
  font-size: 0.98rem;
  margin: 0;
  color: var(--uno-ink);
}
.unix-prompt-tag{
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(15, 61, 34, 0.08);
  color: var(--uno-gray-700);
}
.unix-prompt-locked .unix-prompt-tag{
  background: rgba(180, 140, 30, 0.16);
  color: #8a6510;
}
.unix-prompt-tag.is-custom{
  background: rgba(111, 190, 68, 0.18);
  color: var(--uno-green-deep);
}
.unix-prompt-help{
  font-size: 0.8rem;
  color: var(--uno-gray-700);
  line-height: 1.5;
  margin: 0;
}
.unix-prompt-card textarea{
  flex: 1;
  border: 1px solid rgba(15, 61, 34, 0.12);
  border-radius: 10px;
  padding: 12px 14px;
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: 0.86rem;
  line-height: 1.55;
  color: var(--uno-ink);
  background: white;
  resize: vertical;
  min-height: 320px;
  outline: none;
}
.unix-prompt-card textarea:focus{ border-color: var(--uno-green); }
.unix-prompt-locked textarea{
  background: rgba(255, 255, 255, 0.6);
  color: var(--uno-gray-700);
  font-size: 0.82rem;
}
.unix-prompt-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.unix-prompt-actions .btn{
  padding: 9px 16px;
  font-size: 0.85rem;
  border-radius: 10px;
  box-shadow: none;
}
.unix-prompt-status{
  font-size: 0.82rem;
  color: var(--uno-gray-700);
  margin-left: auto;
}
.unix-prompt-status.ok{ color: var(--uno-green-deep); }
.unix-prompt-status.err{ color: #c0392b; }

@media (max-width: 900px){
  .unix-prompt{ grid-template-columns: 1fr; }
}

/* ===== Base de conocimiento UNIX ===== */
.unix-kb{
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 18px;
  height: calc(100vh - 280px);
  min-height: 480px;
}
.unix-kb-list{
  background: white;
  border: 1px solid rgba(15, 61, 34, 0.08);
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.unix-kb-list-head{
  padding: 12px 14px;
  border-bottom: 1px solid rgba(15, 61, 34, 0.06);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.85rem;
  color: var(--uno-gray-700);
}
.unix-kb-items{ list-style: none; margin: 0; padding: 6px; overflow-y: auto; flex: 1; }
.unix-kb-item{
  padding: 9px 10px;
  border-radius: 8px;
  font-size: 0.85rem;
  color: var(--uno-ink);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 2px;
}
.unix-kb-item:hover{ background: rgba(15, 61, 34, 0.04); }
.unix-kb-item.is-active{ background: var(--uno-green); color: white; }
.unix-kb-item.is-active .kb-size{ color: rgba(255,255,255,0.8); }
.unix-kb-item .kb-name{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.unix-kb-item .kb-size{ font-size: 0.72rem; color: var(--uno-gray-600); flex-shrink: 0; }
.unix-kb-loading, .unix-kb-empty{
  padding: 16px; font-size: 0.85rem; color: var(--uno-gray-700); text-align: center;
}
.unix-kb-editor{
  background: white;
  border: 1px solid rgba(15, 61, 34, 0.08);
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-width: 0;
}
.unix-kb-editor-head{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px;
  border-bottom: 1px solid rgba(15, 61, 34, 0.06);
}
.unix-kb-editor-head input{
  flex: 1;
  border: 1px solid rgba(15, 61, 34, 0.14);
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 0.92rem;
  font-family: ui-monospace, SFMono-Regular, monospace;
  outline: none;
}
.unix-kb-editor-head input:focus{ border-color: var(--uno-green); }
.unix-kb-editor-head input:disabled{ background: rgba(15, 61, 34, 0.04); color: var(--uno-gray-700); }
.unix-kb-hint{ font-size: 0.78rem; color: var(--uno-gray-600); }
.unix-kb-editor textarea{
  flex: 1;
  border: 0;
  padding: 14px;
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: 0.88rem;
  line-height: 1.6;
  color: var(--uno-ink);
  resize: none;
  outline: none;
}
.unix-kb-actions{
  display: flex;
  gap: 8px;
  align-items: center;
  padding: 12px 14px;
  border-top: 1px solid rgba(15, 61, 34, 0.06);
  background: rgba(15, 61, 34, 0.02);
}
.unix-kb-status{ font-size: 0.82rem; color: var(--uno-gray-700); margin-left: auto; }
.unix-kb-status.ok{ color: var(--uno-green-deep); }
.unix-kb-status.err{ color: #c0392b; }

@media (max-width: 900px){
  .unix-kb{
    grid-template-columns: 1fr;
    grid-template-rows: 200px 1fr;
    height: auto;
  }
  .unix-kb-editor{ height: calc(100vh - 480px); min-height: 360px; }
}

@media (max-width: 900px){
  .unix-chat{
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
    height: auto;
    max-height: none;
  }
  .unix-side{ flex-direction: row; align-items: center; gap: 14px; padding: 14px; }
  .unix-side-avatar{
    flex-direction: row; align-items: center; gap: 12px; text-align: left;
    padding-bottom: 0; border-bottom: 0; flex: 1; min-width: 0;
  }
  .unix-stage{ width: 64px; height: 64px; margin-bottom: 0; flex-shrink: 0; border-width: 2px; }
  .unix-side-avatar h3.unix-side-name{ font-size: 1rem; margin: 0; }
  .unix-side-role, .unix-side-status{ display: none; }
  .unix-side-controls{ flex-direction: row; gap: 10px; flex-shrink: 0; }
  .unix-side-group:nth-child(2){ display: none; }
  .unix-side-label{ display: none; }
  .unix-main{ height: calc(100vh - 320px); min-height: 420px; }
  .unix-bubble{ max-width: 88%; }
  .unix-suggestions{ padding-left: 0; }
}

/* ============================================================
   Admin · Revisar afiliados
   ============================================================ */
.portal-nav-badge{
  margin-left: auto;
  background: #C7301E;
  color: white;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 999px;
  min-width: 20px;
  text-align: center;
}

.adafil-tabs{
  display: flex;
  gap: 6px;
  overflow-x: auto;
  border-bottom: 1px solid #ECECEC;
  margin-bottom: 16px;
  padding-bottom: 0;
}
.adafil-tab{
  border: 0;
  background: transparent;
  padding: 10px 14px;
  font-size: 0.9rem;
  font-weight: 600;
  color: #6b6b6b;
  cursor: pointer;
  border-bottom: 3px solid transparent;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  transition: color .15s, border-color .15s;
}
.adafil-tab:hover{ color: #1B7F2C; }
.adafil-tab.active{
  color: #1B7F2C;
  border-bottom-color: #6FBE44;
}
.adafil-tab-count{
  background: #ECECEC;
  color: #6b6b6b;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 999px;
  min-width: 22px;
  text-align: center;
}
.adafil-tab.active .adafil-tab-count{
  background: #6FBE44;
  color: white;
}

.adafil-toolbar{
  display: flex;
  gap: 12px;
  margin-bottom: 14px;
  align-items: center;
}
.adafil-search{
  flex: 1;
  padding: 10px 14px;
  border: 1px solid #C9C9C9;
  border-radius: 10px;
  font-size: 0.95rem;
  background: white;
}
.adafil-search:focus{ outline: 2px solid #6FBE44; outline-offset: -1px; border-color: #6FBE44; }

.adafil-table-wrap{
  background: white;
  border: 1px solid #ECECEC;
  border-radius: 12px;
  overflow: auto;
}
.adafil-table{
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}
.adafil-table thead th{
  background: #FAFAF7;
  text-align: left;
  padding: 12px 14px;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #6b6b6b;
  border-bottom: 1px solid #ECECEC;
  white-space: nowrap;
}
.adafil-table tbody td{
  padding: 12px 14px;
  border-bottom: 1px solid #F5F5F5;
  vertical-align: middle;
}
.adafil-table tbody tr:hover{ background: #FAFCF6; }
.adafil-table tbody tr:last-child td{ border-bottom: 0; }

.adafil-empty{
  text-align: center;
  padding: 40px 20px !important;
  color: #888;
  font-style: italic;
}

.adafil-name{
  display: flex;
  align-items: center;
  gap: 10px;
}
.adafil-avatar{
  width: 36px; height: 36px; border-radius: 50%;
  background: linear-gradient(135deg, #6FBE44, #1B7F2C);
  color: white; font-weight: 700; font-size: 0.85rem;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0; overflow: hidden;
}
.adafil-avatar img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.adafil-name-text strong{ display: block; font-weight: 600; color: #2c2c2c; }
.adafil-name-text small{ color: #888; font-size: 0.78rem; }

.adafil-badge{
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.adafil-badge-pendiente{ background: #FFF3D6; color: #8a6500; }
.adafil-badge-verificado{ background: #DCEFD2; color: #1B7F2C; }
.adafil-badge-observado{ background: #FFE0B2; color: #B85500; }
.adafil-badge-rechazado{ background: #F8D7DA; color: #B71C1C; }

.adafil-th-actions{ text-align: right; width: 1%; white-space: nowrap; }
.adafil-actions{ display: flex; gap: 6px; justify-content: flex-end; }
.adafil-btn-icon{
  border: 1px solid #ECECEC;
  background: white;
  width: 32px; height: 32px;
  border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
  color: #6b6b6b;
  cursor: pointer;
  transition: all .15s;
}
.adafil-btn-icon:hover{ background: #F1F8E9; color: #1B7F2C; border-color: #6FBE44; }
.adafil-btn-icon.adafil-btn-ok:hover{ background: #DCEFD2; color: #1B7F2C; border-color: #6FBE44; }
.adafil-btn-icon.adafil-btn-warn:hover{ background: #FFE0B2; color: #B85500; border-color: #FFB74D; }
.adafil-btn-icon.adafil-btn-rej:hover{ background: #F8D7DA; color: #B71C1C; border-color: #E57373; }

.adafil-paginacion{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-top: 16px;
  padding: 8px 0;
}
.adafil-page-info{ font-size: 0.88rem; color: #6b6b6b; }

/* Modal detalle */
.adafil-modal-card{ max-width: 720px; width: 100%; }
.adafil-modal-head{
  display: flex; align-items: center; gap: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid #ECECEC;
  margin-bottom: 16px;
  padding-right: 40px;
}
.adafil-modal-head h2{ font-size: 1.2rem; margin: 0; color: #1B7F2C; flex: 1; }
.adafil-modal-status{ flex-shrink: 0; }

.adafil-modal-body{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 20px;
  margin-bottom: 18px;
  font-size: 0.92rem;
}
.adafil-modal-body .adafil-field{ display: flex; flex-direction: column; }
.adafil-modal-body .adafil-field-full{ grid-column: 1 / -1; }
.adafil-modal-body dt{
  font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em;
  color: #888; font-weight: 700; margin-bottom: 2px;
}
.adafil-modal-body dd{ margin: 0; color: #2c2c2c; line-height: 1.45; word-break: break-word; }

.adafil-modal-foot{
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  border-top: 1px solid #ECECEC;
  padding-top: 14px;
}

@media (max-width: 700px){
  .adafil-modal-body{ grid-template-columns: 1fr; }
  .adafil-toolbar{ flex-direction: column; align-items: stretch; }
  .adafil-table thead{ display: none; }
  .adafil-table tbody td{ display: block; padding: 8px 14px; }
  .adafil-table tbody td:first-child{ padding-top: 14px; }
  .adafil-table tbody td:last-child{ padding-bottom: 14px; }
  .adafil-table tbody td::before{
    content: attr(data-label);
    font-size: 0.7rem; color: #888; text-transform: uppercase;
    display: block; margin-bottom: 2px; font-weight: 700;
  }
  .adafil-table tbody tr{ border-bottom: 8px solid #FAFAF7; }
  .adafil-actions{ justify-content: flex-start; }
}

/* ========================================================================== */
/* Mi Red (mr-*) — referidos del afiliado                                     */
/* ========================================================================== */
.mr-stats{
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
  margin-bottom: 18px;
}
.mr-stat-card{
  background: #fff; border: 1px solid var(--uno-gray-100);
  border-radius: 12px; padding: 16px;
  display: flex; flex-direction: column; gap: 4px;
}
.mr-stat-label{ font-size: 12px; color: var(--uno-gray-600); text-transform: uppercase; letter-spacing: .04em; }
.mr-stat-value{ font-size: 28px; font-weight: 700; color: var(--uno-green-deep); line-height: 1.1; }
.mr-stat-sub{ font-size: 12px; color: var(--uno-gray-600); }

.mr-invitor{
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px; margin-bottom: 14px;
  background: var(--uno-cream); border-radius: 12px;
}
.mr-invitor-avatar{
  width: 44px; height: 44px; border-radius: 50%; overflow: hidden;
  background: var(--uno-green-deep); color: #fff;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; font-weight: 600;
}
.mr-invitor-avatar img{ width: 100%; height: 100%; object-fit: cover; }
.mr-invitor-info{ display: flex; flex-direction: column; gap: 2px; }
.mr-invitor-info small{ font-size: 11px; color: var(--uno-gray-600); text-transform: uppercase; letter-spacing: .04em; }
.mr-invitor-info strong{ font-size: 15px; color: var(--uno-gray-900); }
.mr-invitor-info span{ font-size: 12px; color: var(--uno-gray-600); }

.mr-invite-card{
  background: #fff; border: 1px solid var(--uno-gray-100);
  border-radius: 12px; padding: 18px; margin-bottom: 18px;
}
.mr-invite-head strong{ display: block; font-size: 15px; color: var(--uno-gray-900); margin-bottom: 2px; }
.mr-invite-head span{ font-size: 13px; color: var(--uno-gray-600); }
.mr-invite-body{ margin-top: 12px; display: flex; flex-direction: column; gap: 12px; }
.mr-invite-link{ display: flex; gap: 8px; }
.mr-invite-link input{
  flex: 1; padding: 10px 12px; border: 1px solid var(--uno-gray-200);
  border-radius: 8px; font-size: 13px; background: var(--uno-cream);
  color: var(--uno-gray-900);
}
.mr-invite-share{ display: flex; gap: 8px; flex-wrap: wrap; }
.mr-share{
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 12px; border-radius: 8px; font-size: 13px;
  font-weight: 500; text-decoration: none; cursor: pointer;
  border: 1px solid transparent;
}
.mr-share-wa{ background: #25D366; color: #fff; }
.mr-share-wa:hover{ background: #1ebd5b; }
.mr-share-tg{ background: #229ED9; color: #fff; }
.mr-share-tg:hover{ background: #1d8bbf; }
.mr-share-native{ background: var(--uno-cream); color: var(--uno-gray-900); border-color: var(--uno-gray-200); }
.mr-share-native:hover{ background: var(--uno-gray-100); }
.mr-invite-code{ font-size: 12px; color: var(--uno-gray-600); }
.mr-invite-code code{
  font-family: 'Courier New', monospace; font-size: 13px;
  padding: 2px 6px; background: var(--uno-cream); border-radius: 4px;
  color: var(--uno-green-deep); font-weight: 600;
}

.mr-btn{
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 14px; border-radius: 8px;
  background: var(--uno-cream); color: var(--uno-gray-900);
  border: 1px solid var(--uno-gray-200); font-size: 13px;
  cursor: pointer; transition: all .15s;
}
.mr-btn:hover{ background: var(--uno-gray-100); }
.mr-btn:disabled{ opacity: .5; cursor: not-allowed; }
.mr-btn-primary{
  background: var(--uno-green-deep); color: #fff; border-color: var(--uno-green-deep);
}
.mr-btn-primary:hover{ background: var(--uno-green); border-color: var(--uno-green); }
.mr-copied{ background: #4E9A2D !important; border-color: #4E9A2D !important; color: #fff !important; }

.mr-toolbar{
  display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; align-items: center;
}
.mr-filter-search{
  position: relative; flex: 1; min-width: 220px;
}
.mr-filter-search svg{
  position: absolute; left: 12px; top: 50%; transform: translateY(-50%);
  color: var(--uno-gray-600);
}
.mr-filter-search input{
  width: 100%; padding: 10px 12px 10px 38px;
  border: 1px solid var(--uno-gray-200); border-radius: 8px;
  font-size: 13px; background: #fff;
}
.mr-toolbar select{
  padding: 10px 12px; border: 1px solid var(--uno-gray-200);
  border-radius: 8px; font-size: 13px; background: #fff;
  color: var(--uno-gray-900); min-width: 160px;
}

.mr-list{ display: flex; flex-direction: column; gap: 8px; }
.mr-card{
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; background: #fff;
  border: 1px solid var(--uno-gray-100); border-radius: 10px;
}
.mr-card:hover{ border-color: var(--uno-gray-200); }
.mr-card-avatar{
  width: 42px; height: 42px; border-radius: 50%; overflow: hidden;
  background: var(--uno-green-deep); color: #fff;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; font-weight: 600; font-size: 14px;
}
.mr-card-avatar img{ width: 100%; height: 100%; object-fit: cover; }
.mr-avatar-ini{ font-size: 14px; }
.mr-card-body{ flex: 1; min-width: 0; }
.mr-card-name{
  font-size: 14px; font-weight: 600; color: var(--uno-gray-900);
  display: flex; align-items: center; gap: 6px;
}
.mr-badge-sub{
  font-size: 10px; font-weight: 700; padding: 1px 6px;
  background: var(--uno-green-deep); color: #fff; border-radius: 8px;
}
.mr-card-meta{ font-size: 12px; color: var(--uno-gray-600); margin-top: 2px; }
.mr-card-meta span + span{ margin-left: 4px; }

.mr-state{
  font-size: 11px; padding: 3px 10px; border-radius: 12px; font-weight: 500;
  flex-shrink: 0;
}
.mr-state-on{ background: #eaf5e3; color: var(--uno-green-deep); }
.mr-state-off{ background: #fdecea; color: #C7301E; }

.mr-pagination{
  display: flex; justify-content: center; align-items: center; gap: 12px;
  margin-top: 14px; font-size: 13px; color: var(--uno-gray-600);
}

.mr-loading, .mr-empty, .mr-error{
  padding: 32px 16px; text-align: center; color: var(--uno-gray-600);
  background: #fff; border: 1px dashed var(--uno-gray-200); border-radius: 10px;
}
.mr-empty strong{ display: block; font-size: 15px; color: var(--uno-gray-900); margin-bottom: 4px; }
.mr-error{ color: #C7301E; border-color: #fdd; background: #fff8f7; }

@media (max-width: 720px) {
  .mr-stats{ grid-template-columns: 1fr; }
  .mr-toolbar select{ min-width: 0; flex: 1; }
}

/* === Mi Red — Invitaciones === */
.mr-block{
  background: #fff; border: 1px solid var(--uno-gray-100);
  border-radius: 12px; padding: 16px; margin-bottom: 18px;
}
.mr-block-head{
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; flex-wrap: wrap; margin-bottom: 12px;
}
.mr-tabs{ display: inline-flex; gap: 4px; background: var(--uno-cream); padding: 4px; border-radius: 8px; }
.mr-tab{
  padding: 6px 14px; border: 0; background: transparent; cursor: pointer;
  font-size: 13px; font-weight: 500; color: var(--uno-gray-700);
  border-radius: 6px; display: inline-flex; align-items: center; gap: 6px;
}
.mr-tab:hover{ background: var(--uno-gray-100); }
.mr-tab-active{ background: #fff; color: var(--uno-green-deep); box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.mr-tab-badge{
  background: var(--uno-green-deep); color: #fff;
  font-size: 10px; font-weight: 700;
  min-width: 18px; height: 18px; padding: 0 5px; line-height: 18px;
  border-radius: 9px; text-align: center;
}
.mr-section-title{ font-size: 16px; color: var(--uno-gray-900); margin: 12px 0 10px; font-weight: 600; }

.mr-inv-list{ display: flex; flex-direction: column; gap: 12px; }
.mr-inv-card{
  border: 1px solid var(--uno-gray-100); border-radius: 10px;
  padding: 14px; background: #fff;
}
.mr-inv-head{
  display: flex; align-items: center; gap: 10px;
  flex-wrap: wrap; margin-bottom: 8px;
}
.mr-inv-emisor{ display: flex; flex-direction: column; flex: 1; min-width: 0; }
.mr-inv-emisor strong{ font-size: 14px; color: var(--uno-gray-900); }
.mr-inv-emisor span{ font-size: 12px; color: var(--uno-gray-600); }
.mr-inv-meta{ font-size: 12px; color: var(--uno-gray-600); flex: 1; }
.mr-inv-tipo{
  font-size: 11px; font-weight: 600; padding: 3px 10px; border-radius: 12px;
  text-transform: uppercase; letter-spacing: .04em;
}
.mr-inv-tipo-evento{ background: #e3f2fd; color: #1862C2; }
.mr-inv-tipo-noticia{ background: #fff3e0; color: #C7301E; }
.mr-inv-msg{
  background: var(--uno-cream); border-left: 3px solid var(--uno-green-deep);
  padding: 8px 12px; margin: 8px 0; font-size: 13px;
  color: var(--uno-gray-800); font-style: italic;
}
.mr-inv-recurso{
  display: flex; flex-direction: column; gap: 4px; padding: 12px;
  background: var(--uno-cream); border-radius: 8px;
  text-decoration: none; color: var(--uno-gray-900);
  transition: background .15s;
}
.mr-inv-recurso:hover{ background: #eaf5e3; }
.mr-inv-recurso strong{ font-size: 14px; }
.mr-inv-recurso span{ font-size: 12px; color: var(--uno-gray-600); }
.mr-inv-recurso-exp{ opacity: .55; }
.mr-inv-recurso-noticia{ flex-direction: row; align-items: stretch; }
.mr-inv-recurso-noticia img{
  width: 80px; height: 80px; object-fit: cover; border-radius: 6px; flex-shrink: 0;
}
.mr-inv-recurso-info{ display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
.mr-inv-recurso-nodisp{
  padding: 12px; background: #f5f5f5; border-radius: 8px;
  font-size: 13px; color: var(--uno-gray-600); font-style: italic;
}
.mr-cat-pill{
  font-size: 11px; padding: 2px 8px; border-radius: 8px;
  background: #eaf5e3; color: var(--uno-green-deep);
  display: inline-block; align-self: flex-start; font-weight: 500;
}
.mr-cat-noticia{ background: #fff3e0; color: #C7301E; }

.mr-inv-dest-row{
  display: flex; align-items: center; gap: 10px;
  margin-top: 10px; padding-top: 10px;
  border-top: 1px solid var(--uno-gray-100);
}
.mr-inv-dest-label{ font-size: 12px; color: var(--uno-gray-600); }
.mr-inv-dest-stack{ display: inline-flex; gap: -8px; }
.mr-inv-dest-avatar{
  width: 28px; height: 28px; border-radius: 50%; overflow: hidden;
  border: 2px solid #fff; margin-left: -8px;
  background: var(--uno-green-deep); color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 600;
}
.mr-inv-dest-avatar:first-child{ margin-left: 0; }
.mr-inv-dest-avatar img{ width: 100%; height: 100%; object-fit: cover; }
.mr-inv-dest-avatar .mr-avatar-ini{ font-size: 11px; }
.mr-inv-dest-more{
  display: inline-flex; align-items: center; justify-content: center;
  height: 28px; padding: 0 8px; font-size: 11px; font-weight: 600;
  background: var(--uno-cream); color: var(--uno-gray-700);
  border-radius: 14px; margin-left: -2px;
}
.mr-btn-danger{ background: #fdecea; color: #C7301E; border-color: #fdecea; }
.mr-btn-danger:hover{ background: #fbd5cf; }
.mr-btn-sm{ padding: 6px 10px; font-size: 12px; }

/* === Modal Crear invitación === */
.mr-modal{
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(0,0,0,.5);
  display: flex; align-items: flex-start; justify-content: center;
  padding: 20px; overflow-y: auto;
}
.mr-modal[hidden]{ display: none; }
.mr-modal-card{
  background: #fff; border-radius: 12px;
  width: 100%; max-width: 560px; padding: 22px;
  margin: 20px 0; box-shadow: 0 8px 32px rgba(0,0,0,.18);
}
.mr-modal-card-wide{ max-width: 720px; }
.mr-modal-head{
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 18px;
}
.mr-modal-head h3{ margin: 0; font-size: 18px; color: var(--uno-gray-900); }
.mr-modal-close{
  width: 32px; height: 32px; border: 0; background: transparent;
  font-size: 24px; line-height: 1; color: var(--uno-gray-600); cursor: pointer;
  border-radius: 50%;
}
.mr-modal-close:hover{ background: var(--uno-gray-100); color: var(--uno-gray-900); }

.mr-form{ display: flex; flex-direction: column; gap: 16px; }
.mr-field{ display: flex; flex-direction: column; gap: 6px; }
.mr-field-label{ font-size: 13px; font-weight: 600; color: var(--uno-gray-800); }
.mr-field-label em{ color: #C7301E; font-style: normal; }
.mr-field-hint{ font-size: 11px; color: var(--uno-gray-600); align-self: flex-end; }
.mr-form input[type="search"], .mr-form input[type="text"], .mr-form textarea, .mr-form select{
  padding: 10px 12px; border: 1px solid var(--uno-gray-200);
  border-radius: 8px; font-size: 13px; font-family: inherit;
  background: #fff; color: var(--uno-gray-900); width: 100%;
}
.mr-form textarea{ resize: vertical; }
.mr-radios{ display: flex; gap: 18px; }
.mr-radios label{ display: inline-flex; align-items: center; gap: 6px; font-size: 13px; cursor: pointer; }

.mr-recurso-list, .mr-dest-list{
  max-height: 220px; overflow-y: auto;
  border: 1px solid var(--uno-gray-200); border-radius: 8px;
  padding: 4px; background: #fafafa;
}
.mr-recurso-item{
  width: 100%; text-align: left; border: 1px solid transparent; border-radius: 6px;
  padding: 10px 12px; background: #fff; margin: 2px 0; cursor: pointer;
  display: flex; flex-direction: column; gap: 3px; font-family: inherit;
}
.mr-recurso-item:hover{ border-color: var(--uno-green); background: #fafffa; }
.mr-recurso-item.mr-recurso-sel{ border-color: var(--uno-green-deep); background: #eaf5e3; }
.mr-recurso-item strong{ font-size: 13px; color: var(--uno-gray-900); }
.mr-recurso-item span{ font-size: 11px; color: var(--uno-gray-600); }

.mr-dest-toolbar{
  display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 6px;
}
.mr-dest-toolbar input[type="search"]{ flex: 1; min-width: 160px; padding: 8px 10px; }
.mr-dest-toolbar select{ padding: 8px 10px; }
.mr-dest-summary{ font-size: 12px; color: var(--uno-gray-700); margin: 4px 0; }
.mr-dest-summary strong{ color: var(--uno-green-deep); }

.mr-dest-item{
  display: flex; align-items: center; gap: 10px; padding: 8px 10px;
  border-radius: 6px; cursor: pointer;
}
.mr-dest-item:hover{ background: #fff; }
.mr-dest-item input[type="checkbox"]{ flex-shrink: 0; }
.mr-card-avatar-sm{ width: 32px; height: 32px; font-size: 12px; }
.mr-dest-info{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.mr-dest-info strong{ font-size: 13px; color: var(--uno-gray-900); }
.mr-dest-info span{ font-size: 11px; color: var(--uno-gray-600); }
.mr-dest-nivel{
  font-size: 10px; font-weight: 700; padding: 2px 6px; border-radius: 4px;
  background: var(--uno-cream); color: var(--uno-gray-700);
}

.mr-form-actions{
  display: flex; justify-content: flex-end; gap: 8px;
  padding-top: 8px; border-top: 1px solid var(--uno-gray-100);
}
.mr-form-error{
  background: #fdecea; color: #C7301E; padding: 10px 12px;
  border-radius: 8px; font-size: 13px;
}
.mr-empty-sm{
  padding: 16px; text-align: center; font-size: 13px;
  color: var(--uno-gray-600);
}

/* === UNIX · Consultas a la BD (custom tools) === */
.utc-wrap{ display: grid; grid-template-columns: 280px 1fr; gap: 16px; align-items: start; }
.utc-list{
  background: #fff; border: 1px solid var(--uno-gray-100);
  border-radius: 12px; padding: 12px;
}
.utc-list-head{
  display: flex; align-items: center; justify-content: space-between;
  padding-bottom: 8px; margin-bottom: 8px; border-bottom: 1px solid var(--uno-gray-100);
}
.utc-items{ list-style: none; padding: 0; margin: 0; max-height: 420px; overflow-y: auto; }
.utc-item{
  padding: 10px 12px; border-radius: 8px; cursor: pointer;
  display: flex; align-items: center; justify-content: space-between;
  font-size: 13px; color: var(--uno-gray-900);
}
.utc-item:hover{ background: var(--uno-cream); }
.utc-item.is-active{ background: #eaf5e3; color: var(--uno-green-deep); font-weight: 600; }
.utc-item.is-inactive .utc-item-name{ color: var(--uno-gray-600); text-decoration: line-through; }
.utc-item-state{ font-size: 10px; color: var(--uno-gray-600); padding: 2px 6px; background: var(--uno-cream); border-radius: 4px; }
.utc-item.is-active .utc-item-state{ background: #fff; }
.utc-empty{ padding: 16px; color: var(--uno-gray-600); font-size: 13px; text-align: center; list-style: none; }

.utc-editor{
  background: #fff; border: 1px solid var(--uno-gray-100);
  border-radius: 12px; padding: 18px;
  display: flex; flex-direction: column; gap: 14px;
}
.utc-row{ display: flex; gap: 12px; align-items: flex-end; }
.utc-field{ display: flex; flex-direction: column; gap: 6px; flex: 1; }
.utc-field span{ font-size: 13px; font-weight: 600; color: var(--uno-gray-800); }
.utc-field em{ color: #C7301E; font-style: normal; }
.utc-field small{ font-size: 11px; color: var(--uno-gray-600); }
.utc-field input[type="text"], .utc-field textarea{
  padding: 9px 12px; border: 1px solid var(--uno-gray-200);
  border-radius: 8px; font-size: 13px; font-family: inherit;
  background: #fff; color: var(--uno-gray-900);
}
.utc-field textarea{ resize: vertical; }
#utc-sql{ font-family: 'Courier New', monospace; font-size: 12.5px; line-height: 1.5; }
.utc-field-name{ flex: 1; }
.utc-field-checkbox{ display: inline-flex; align-items: center; gap: 6px; font-size: 13px; padding-bottom: 8px; }

.utc-params-head{
  display: flex; align-items: center; justify-content: space-between;
  font-size: 13px; font-weight: 600; color: var(--uno-gray-800);
}
.utc-params{ display: flex; flex-direction: column; gap: 6px; }
.utc-params-empty{
  padding: 10px 12px; font-size: 12px; color: var(--uno-gray-600);
  background: var(--uno-cream); border-radius: 8px;
}
.utc-param-row{
  display: grid;
  grid-template-columns: 130px 110px 1fr 60px 200px 32px;
  gap: 6px; align-items: center;
}
.utc-param-row input[type="text"], .utc-param-row select{
  padding: 7px 10px; border: 1px solid var(--uno-gray-200);
  border-radius: 6px; font-size: 12.5px; font-family: inherit;
  background: #fff; min-width: 0;
}
.utc-p-req{ display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--uno-gray-700); }
.utc-p-rm{
  width: 28px; height: 28px; border: 0; background: #fdecea; color: #C7301E;
  border-radius: 6px; cursor: pointer; font-size: 16px; line-height: 1;
}
.utc-p-rm:hover{ background: #fbd5cf; }

.utc-actions{
  display: flex; align-items: center; gap: 8px;
  padding-top: 8px; border-top: 1px solid var(--uno-gray-100);
}
.utc-status{ font-size: 12px; color: var(--uno-gray-600); }
.utc-status.ok{ color: var(--uno-green-deep); }
.utc-status.err{ color: #C7301E; }

.utc-test-result{
  background: var(--uno-cream); border-radius: 8px; padding: 12px;
  font-size: 12.5px;
}
.utc-test-head{ font-size: 12px; font-weight: 600; color: var(--uno-gray-800); margin-bottom: 8px; }
.utc-test-tbl-wrap{ overflow-x: auto; }
.utc-test-tbl{ width: 100%; border-collapse: collapse; background: #fff; border-radius: 6px; overflow: hidden; }
.utc-test-tbl th, .utc-test-tbl td{ padding: 6px 10px; border: 1px solid var(--uno-gray-100); text-align: left; }
.utc-test-tbl th{ background: var(--uno-cream); font-weight: 600; }
.utc-test-empty{ font-style: italic; color: var(--uno-gray-600); }
.utc-test-err{ color: #C7301E; font-family: 'Courier New', monospace; font-size: 12.5px; white-space: pre-wrap; }

@media (max-width: 900px) {
  .utc-wrap{ grid-template-columns: 1fr; }
  .utc-param-row{ grid-template-columns: 1fr 1fr; }
}

/* === Comunicaciones · Tablón afiliado === */
.cn-toolbar{ display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 16px; }
.cn-toolbar select, .cn-toolbar input[type="search"]{
  padding: 9px 12px; border: 1px solid var(--uno-gray-200); border-radius: 8px;
  font-size: 13px; background: #fff; min-width: 200px;
}
.cn-filter-noleidos{ display: inline-flex; align-items: center; gap: 6px; font-size: 13px; cursor: pointer; }
.cn-admin-btn{ margin-left: auto; }

.cn-feed{ display: flex; flex-direction: column; gap: 14px; }
.cn-card{
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 12px;
  display: flex; gap: 14px; padding: 14px; cursor: pointer;
  transition: border-color .15s, box-shadow .15s;
  position: relative;
}
.cn-card:hover{ border-color: var(--uno-green); box-shadow: 0 2px 8px rgba(0,0,0,.04); }
.cn-card.cn-no-leido{ border-left: 4px solid var(--uno-green-deep); }
.cn-card.cn-fijado{ background: #fffaf2; }
.cn-card-img{
  width: 110px; height: 110px; flex-shrink: 0;
  background-size: cover; background-position: center;
  border-radius: 8px;
}
.cn-card-body{ flex: 1; min-width: 0; }
.cn-card-meta{ display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12px; }
.cn-card-body h3{ margin: 6px 0 4px; font-size: 16px; color: var(--uno-gray-900); }
.cn-card-body p{ margin: 0; color: var(--uno-gray-700); font-size: 13.5px; }
.cn-cat-pill{
  font-size: 11px; padding: 2px 8px; background: #eaf5e3;
  color: var(--uno-green-deep); border-radius: 8px; font-weight: 500;
}
.cn-urgente{
  font-size: 10px; font-weight: 700; padding: 2px 8px; border-radius: 4px;
  background: #C7301E; color: #fff; letter-spacing: .04em;
}
.cn-fecha{ color: var(--uno-gray-600); }
.cn-pin{ font-size: 14px; }
.cn-badge-noleido{
  position: absolute; top: 12px; right: 14px;
  background: var(--uno-green-deep); color: #fff;
  font-size: 10px; font-weight: 700; padding: 3px 8px; border-radius: 8px;
}
.cn-empty{
  padding: 36px 20px; text-align: center;
  background: #fff; border: 1px dashed var(--uno-gray-200); border-radius: 12px;
}
.cn-empty strong{ display: block; font-size: 15px; color: var(--uno-gray-900); }
.cn-empty span{ font-size: 13px; color: var(--uno-gray-600); }
.cn-loading, .cn-error{
  padding: 24px; text-align: center; color: var(--uno-gray-600);
  background: #fff; border-radius: 12px;
}
.cn-error{ color: #C7301E; background: #fff8f7; }
.cn-pagination{ display:flex; gap:10px; justify-content:center; margin-top:14px; align-items:center; font-size:13px; }

/* === Modal de detalle === */
.cn-modal{
  position: fixed; inset: 0; z-index: 1000;
  background: rgba(0,0,0,.55);
  display: flex; align-items: flex-start; justify-content: center;
  padding: 20px; overflow-y: auto;
}
.cn-modal[hidden]{ display: none; }
.cn-modal-card{
  background: #fff; border-radius: 12px;
  width: 100%; max-width: 720px; padding: 24px;
  margin: 20px 0; position: relative;
  box-shadow: 0 8px 32px rgba(0,0,0,.18);
}
.cn-modal-close{
  position: absolute; top: 10px; right: 12px;
  width: 36px; height: 36px; border: 0; background: transparent;
  font-size: 26px; cursor: pointer; color: var(--uno-gray-600); border-radius: 50%;
}
.cn-modal-close:hover{ background: var(--uno-gray-100); }
.cn-modal-body h2{ margin: 8px 0 6px; font-size: 22px; color: var(--uno-gray-900); }
.cn-det-img{ width: 100%; height: auto; max-height: 320px; object-fit: cover; border-radius: 8px; margin-bottom: 12px; }
.cn-det-meta{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom: 6px; }
.cn-det-resumen{ color: var(--uno-gray-700); font-size: 14px; margin: 0 0 14px; }
.cn-det-content{ color: var(--uno-gray-900); font-size: 14.5px; line-height: 1.6; }
.cn-det-content h2, .cn-det-content h3{ color: var(--uno-gray-900); margin: 14px 0 8px; }
.cn-det-content p{ margin: 8px 0; }
.cn-det-content ul, .cn-det-content ol{ margin: 8px 0 8px 20px; }
.cn-det-content img{ max-width: 100%; border-radius: 6px; }
.cn-det-adjuntos{ margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--uno-gray-100); }
.cn-det-adjuntos h4{ margin: 0 0 8px; font-size: 13px; color: var(--uno-gray-700); }
.cn-det-adjuntos ul{ list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 4px; }
.cn-det-adjuntos a{ color: var(--uno-green-deep); text-decoration: none; font-size: 13px; }
.cn-det-adjuntos a:hover{ text-decoration: underline; }

/* === Admin avisos === */
.cn-admin-wrap{ background: #fff; border-radius: 12px; }
.cn-table-wrap{ overflow-x: auto; background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 12px; }
.cn-table{ width: 100%; border-collapse: collapse; font-size: 13px; }
.cn-table thead th{
  text-align: left; padding: 12px 14px; background: var(--uno-cream);
  font-weight: 600; border-bottom: 1px solid var(--uno-gray-100); color: var(--uno-gray-800);
}
.cn-table tbody td{ padding: 12px 14px; border-bottom: 1px solid var(--uno-gray-100); }
.cn-table tbody tr:hover{ background: #fafafa; }
.cn-estado-badge{
  font-size: 11px; padding: 3px 10px; border-radius: 12px;
  font-weight: 500; white-space: nowrap;
}
.cn-estado-BORRADOR{   background: #f5f5f5; color: var(--uno-gray-700); }
.cn-estado-PROGRAMADA{ background: #fff3e0; color: #e65100; }
.cn-estado-EN_PROCESO{ background: #eaf5e3; color: var(--uno-green-deep); }
.cn-estado-FINALIZADA{ background: #e8eaf6; color: #3949ab; }
.cn-estado-CANCELADA{  background: #fdecea; color: #C7301E; }
.cn-estado-PAUSADA{    background: #fff8e1; color: #f57f17; }

.cn-edit-head{
  display: flex; align-items: center; gap: 14px;
  margin-bottom: 18px; padding-bottom: 12px; border-bottom: 1px solid var(--uno-gray-100);
}
.cn-edit-head h2{ margin: 0; flex: 1; font-size: 18px; color: var(--uno-gray-900); }
.cn-status{ font-size: 12px; color: var(--uno-gray-600); }
.cn-status.ok{ color: var(--uno-green-deep); }
.cn-status.err{ color: #C7301E; }

.cn-edit-grid{ display: grid; grid-template-columns: 1fr 320px; gap: 20px; }
.cn-edit-main{ display: flex; flex-direction: column; gap: 14px; }
.cn-edit-side{ display: flex; flex-direction: column; gap: 14px; }
.cn-side-card{
  background: #fff; border: 1px solid var(--uno-gray-100);
  border-radius: 10px; padding: 14px;
}
.cn-side-card h3{ margin: 0 0 10px; font-size: 13px; font-weight: 600; color: var(--uno-gray-800); text-transform: uppercase; letter-spacing: .04em; }
.cn-hint{ font-size: 11px; color: var(--uno-gray-600); margin: 4px 0 8px; }

.cn-field{ display: flex; flex-direction: column; gap: 4px; margin-bottom: 8px; }
.cn-field span{ font-size: 12px; font-weight: 600; color: var(--uno-gray-800); }
.cn-field em{ color: #C7301E; font-style: normal; }
.cn-field input[type="text"], .cn-field input[type="datetime-local"], .cn-field input[type="search"],
.cn-field textarea, .cn-field select{
  padding: 8px 10px; border: 1px solid var(--uno-gray-200);
  border-radius: 6px; font-size: 13px; font-family: inherit; background: #fff;
}
.cn-field-flags{ display: flex; gap: 14px; font-size: 13px; margin-top: 6px; }
.cn-canal-row{ display: flex; align-items: center; gap: 6px; padding: 4px 0; font-size: 13px; }

.cn-img-wrap{ display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cn-img-wrap img{ max-width: 200px; height: auto; border-radius: 6px; }
.cn-adj-list{ list-style: none; padding: 0; margin: 6px 0 0; display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.cn-adj-list li{ padding: 6px 10px; background: var(--uno-cream); border-radius: 6px; display: flex; justify-content: space-between; align-items: center; }
.cn-adj-rm{ width: 22px; height: 22px; border: 0; background: transparent; cursor: pointer; font-size: 16px; color: var(--uno-gray-600); }
.cn-adj-rm:hover{ color: #C7301E; }

.cn-metric{ display: flex; justify-content: space-between; padding: 6px 0; font-size: 13px; border-bottom: 1px solid var(--uno-gray-100); }
.cn-metric:last-child{ border-bottom: 0; }
.cn-metric strong{ color: var(--uno-green-deep); }
.cn-seg-info{ margin-top: 8px; padding: 8px 10px; background: var(--uno-cream); border-radius: 6px; font-size: 12px; }

.cn-edit-actions{
  display: flex; gap: 8px; padding-top: 16px; margin-top: 18px;
  border-top: 1px solid var(--uno-gray-100); align-items: center;
}

@media (max-width: 900px) {
  .cn-edit-grid{ grid-template-columns: 1fr; }
  .cn-card{ flex-direction: column; }
  .cn-card-img{ width: 100%; height: 180px; }
}

/* === Comunicaciones · Campanita header === */
.cn-bell-wrap{ position: relative; }
.cn-bell{
  width: 38px; height: 38px; border-radius: 10px;
  background: var(--uno-cream); border: 1px solid var(--uno-gray-100);
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; color: var(--uno-gray-700); position: relative;
}
.cn-bell:hover{ border-color: var(--uno-green); color: var(--uno-green-deep); }
.cn-bell-badge{
  position: absolute; top: -4px; right: -4px;
  background: #C7301E; color: #fff;
  min-width: 18px; height: 18px; padding: 0 5px; line-height: 18px;
  border-radius: 9px; font-size: 10px; font-weight: 700; text-align: center;
}
.cn-bell-menu{
  position: absolute; top: calc(100% + 8px); right: 0;
  width: 360px; max-width: calc(100vw - 24px);
  background: #fff; border: 1px solid var(--uno-gray-100);
  border-radius: 12px; box-shadow: 0 12px 32px rgba(0,0,0,.12);
  z-index: 100; max-height: 480px; display: flex; flex-direction: column;
}
.cn-bell-head{
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px; border-bottom: 1px solid var(--uno-gray-100);
}
.cn-bell-head strong{ font-size: 14px; color: var(--uno-gray-900); }
.cn-bell-link{
  background: transparent; border: 0; cursor: pointer; font-size: 12px;
  color: var(--uno-green-deep); padding: 0;
}
.cn-bell-link:hover{ text-decoration: underline; }
.cn-bell-list{ flex: 1; overflow-y: auto; min-height: 80px; }
.cn-bell-empty{ padding: 24px; text-align: center; color: var(--uno-gray-600); font-size: 13px; }
.cn-bell-item{
  display: flex; gap: 10px; padding: 10px 14px; cursor: pointer;
  border-bottom: 1px solid var(--uno-gray-100); align-items: flex-start;
}
.cn-bell-item:hover{ background: #fafafa; }
.cn-bell-item.cn-no-leida{ background: #fafffa; border-left: 3px solid var(--uno-green-deep); padding-left: 11px; }
.cn-bell-icon{
  width: 32px; height: 32px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.cn-bell-text{ flex: 1; min-width: 0; }
.cn-bell-text strong{ display: block; font-size: 13px; color: var(--uno-gray-900); margin-bottom: 2px; }
.cn-bell-text span{ display: block; font-size: 12px; color: var(--uno-gray-700); margin-bottom: 4px; line-height: 1.35; }
.cn-bell-text small{ font-size: 11px; color: var(--uno-gray-600); }
.cn-bell-foot{
  display: block; padding: 10px 14px; text-align: center; font-size: 13px;
  color: var(--uno-green-deep); text-decoration: none;
  border-top: 1px solid var(--uno-gray-100);
}
.cn-bell-foot:hover{ background: #fafafa; }

/* === Vista completa de notificaciones === */
.cn-notif-tabs{ display: inline-flex; gap: 4px; background: var(--uno-cream); padding: 4px; border-radius: 8px; margin-bottom: 16px; }
.cn-tab{
  padding: 8px 16px; border: 0; background: transparent; cursor: pointer;
  font-size: 13px; font-weight: 500; color: var(--uno-gray-700); border-radius: 6px;
}
.cn-tab:hover{ background: var(--uno-gray-100); }
.cn-tab-active{ background: #fff; color: var(--uno-green-deep); box-shadow: 0 1px 2px rgba(0,0,0,.05); }

.cn-notif-list{ display: flex; flex-direction: column; gap: 8px; }
.cn-notif-row{
  display: flex; align-items: flex-start; gap: 12px;
  padding: 14px; background: #fff; border: 1px solid var(--uno-gray-100);
  border-radius: 10px; cursor: pointer;
}
.cn-notif-row:hover{ border-color: var(--uno-gray-200); }
.cn-notif-row.cn-no-leida{ background: #fafffa; border-left: 4px solid var(--uno-green-deep); }
.cn-notif-del{
  width: 26px; height: 26px; border: 0; background: transparent; cursor: pointer;
  font-size: 18px; color: var(--uno-gray-600); border-radius: 50%; flex-shrink: 0;
}
.cn-notif-del:hover{ background: #fdecea; color: #C7301E; }

/* === Preferencias === */
.cn-prefs-table-wrap{ overflow-x: auto; background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 10px; }
.cn-prefs-table{ width: 100%; border-collapse: collapse; font-size: 13px; }
.cn-prefs-table th, .cn-prefs-table td{ padding: 10px 12px; border-bottom: 1px solid var(--uno-gray-100); text-align: center; }
.cn-prefs-table th{ background: var(--uno-cream); font-weight: 600; color: var(--uno-gray-800); white-space: nowrap; }
.cn-prefs-table th:first-child, .cn-prefs-table td:first-child{ text-align: left; }
.cn-prefs-table tbody tr:hover{ background: #fafafa; }

/* ====================================================================
   Comunicaciones · Mensajería directa (cn-msg-*)
   ==================================================================== */
.cn-msg-shell{
  display: grid; grid-template-columns: 360px 1fr; gap: 18px;
  min-height: 540px;
}
@media (max-width: 900px){
  .cn-msg-shell{ grid-template-columns: 1fr; }
}
.cn-msg-sidebar{
  display: flex; flex-direction: column; gap: 10px;
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 12px; padding: 14px;
}
.cn-msg-tabs{ display: flex; gap: 6px; }
.cn-msg-toolbar{ display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.cn-msg-toolbar input, .cn-msg-toolbar select{
  flex: 1; min-width: 120px; padding: 7px 10px; border: 1px solid var(--uno-gray-100); border-radius: 7px; font-size: 13px;
}
.cn-msg-toolbar .mr-btn{ flex-shrink: 0; }
.cn-msg-list{ display: flex; flex-direction: column; gap: 4px; max-height: 480px; overflow-y: auto; }
.cn-msg-row{
  display: flex; gap: 10px; padding: 10px; border: 1px solid transparent; border-radius: 8px; cursor: pointer;
}
.cn-msg-row:hover{ background: var(--uno-cream); }
.cn-msg-row-sel{ background: #eaf6e3; border-color: var(--uno-green-deep); }
.cn-msg-row-no-leido{ background: #fafffa; }
.cn-msg-row-no-leido strong{ color: var(--uno-green-deep); }
.cn-msg-row-body{ flex: 1; min-width: 0; }
.cn-msg-row-top{ display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.cn-msg-row-top strong{ font-size: 13px; }
.cn-msg-fecha{ font-size: 11px; color: var(--uno-gray-600); flex-shrink: 0; }
.cn-msg-row-asunto{
  font-size: 13px; color: var(--uno-gray-800); margin-top: 2px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cn-msg-count{
  display: inline-block; background: var(--uno-gray-100); color: var(--uno-gray-800);
  border-radius: 9px; padding: 1px 7px; font-size: 11px; margin-left: 4px;
}
.cn-msg-avatar{
  display: inline-flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 50%; background: var(--uno-cream);
  background-size: cover; background-position: center; flex-shrink: 0;
  font-weight: 700; color: var(--uno-green-deep); font-size: 14px;
}
.cn-msg-detail{
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 12px;
  display: flex; flex-direction: column; min-height: 540px;
}
.cn-msg-empty{
  display: flex; align-items: center; justify-content: center; flex: 1;
  color: var(--uno-gray-600); font-size: 14px; padding: 40px;
}
.cn-msg-detail-head{
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  padding: 16px 20px; border-bottom: 1px solid var(--uno-gray-100);
}
.cn-msg-detail-head h3{ margin: 0; font-size: 17px; }
.cn-msg-detail-head small{ color: var(--uno-gray-600); font-size: 12px; }
.cn-msg-detail-actions{ display: flex; gap: 6px; }
.cn-msg-thread{ flex: 1; overflow-y: auto; padding: 16px 20px; display: flex; flex-direction: column; gap: 12px; }
.cn-msg-bubble{
  display: flex; gap: 10px; align-items: flex-start;
}
.cn-msg-mio{ flex-direction: row-reverse; }
.cn-msg-bubble-body{
  max-width: 78%; background: var(--uno-cream); padding: 10px 14px; border-radius: 12px;
}
.cn-msg-mio .cn-msg-bubble-body{ background: #e9f5e0; }
.cn-msg-bubble-head{ display: flex; justify-content: space-between; gap: 10px; font-size: 11px; color: var(--uno-gray-600); margin-bottom: 4px; }
.cn-msg-bubble-head strong{ color: var(--uno-gray-800); font-size: 12px; }
.cn-msg-bubble-text{ font-size: 14px; line-height: 1.5; color: var(--uno-gray-900); word-wrap: break-word; }
.cn-msg-bubble-adjs{ margin-top: 6px; display: flex; flex-wrap: wrap; gap: 6px; }
.cn-msg-adj{
  display: inline-block; font-size: 12px; padding: 3px 8px; background: #fff;
  border: 1px solid var(--uno-gray-100); border-radius: 6px; color: var(--uno-green-deep); text-decoration: none;
}
.cn-msg-adj:hover{ background: var(--uno-cream); }
.cn-msg-adj-chip{
  display: inline-flex; align-items: center; gap: 4px;
  background: var(--uno-cream); border: 1px solid var(--uno-gray-100);
  border-radius: 6px; padding: 3px 8px; font-size: 12px; margin: 2px;
}
.cn-msg-adj-chip button{ border: 0; background: transparent; cursor: pointer; font-size: 14px; line-height: 1; color: var(--uno-gray-600); }
.cn-msg-reply{
  border-top: 1px solid var(--uno-gray-100); padding: 12px 16px; display: flex; flex-direction: column; gap: 8px;
}
.cn-msg-reply textarea{
  width: 100%; padding: 10px; border: 1px solid var(--uno-gray-100); border-radius: 8px;
  font-family: inherit; font-size: 14px; resize: vertical;
}
.cn-msg-reply-actions{ display: flex; gap: 6px; align-items: center; }
.cn-msg-reply-locked{
  border-top: 1px solid var(--uno-gray-100); padding: 14px 16px;
  font-size: 13px; color: var(--uno-gray-600); font-style: italic; text-align: center;
}

/* Modal redactar */
.cn-msg-modal{ width: min(640px, 92vw); }
.cn-msg-recip{
  border: 1px solid var(--uno-gray-100); border-radius: 8px; padding: 6px;
  position: relative; background: #fff;
}
.cn-msg-chips{ display: flex; flex-wrap: wrap; gap: 4px; padding: 2px; }
.cn-msg-chip{
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--uno-cream); border: 1px solid var(--uno-gray-100);
  border-radius: 14px; padding: 3px 10px; font-size: 12px;
}
.cn-msg-chip small{ color: var(--uno-gray-600); }
.cn-msg-chip button{ border: 0; background: transparent; cursor: pointer; line-height: 1; color: var(--uno-gray-600); }
.cn-msg-recip input{
  width: 100%; border: 0; padding: 6px 8px; font-size: 13px; outline: none;
}
.cn-msg-suggest{
  position: absolute; left: 0; right: 0; top: 100%; margin-top: 4px; z-index: 10;
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 8px;
  max-height: 220px; overflow-y: auto; box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}
.cn-msg-suggest-row{
  padding: 8px 12px; cursor: pointer; display: flex; justify-content: space-between;
  align-items: center; gap: 10px; border-bottom: 1px solid var(--uno-gray-100);
}
.cn-msg-suggest-row:last-child{ border-bottom: 0; }
.cn-msg-suggest-row:hover{ background: var(--uno-cream); }
.cn-msg-suggest-row small{ color: var(--uno-gray-600); font-size: 11px; }
.cn-msg-perm label{ display: flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; }
.cn-msg-adjuntos{ display: flex; flex-wrap: wrap; gap: 4px; min-height: 30px; }

/* === KPIs admin Comunicaciones === */
.cn-kpis{
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 16px 0 12px;
}
@media (max-width: 700px){ .cn-kpis{ grid-template-columns: 1fr 1fr; } }
.cn-kpi{
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 10px;
  padding: 14px 16px; display: flex; flex-direction: column; gap: 4px;
}
.cn-kpi-label{ font-size: 12px; color: var(--uno-gray-600); text-transform: uppercase; letter-spacing: 0.5px; }
.cn-kpi strong{ font-size: 22px; color: var(--uno-green-deep); font-weight: 700; }
.cn-kpis-detalle{ background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 10px; padding: 8px 12px; margin-bottom: 16px; font-size: 13px; }
.cn-kpis-detalle summary{ cursor: pointer; padding: 6px 4px; color: var(--uno-gray-800); }
.cn-kpis-tablas{ display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 8px 0 4px; }
@media (max-width: 700px){ .cn-kpis-tablas{ grid-template-columns: 1fr; } }
.cn-kpis-tablas h4{ margin: 0 0 6px; font-size: 13px; color: var(--uno-gray-700); }
.cn-table-mini{ font-size: 12px; }
.cn-table-mini td{ padding: 4px 8px; }
.cn-dot{ display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }

/* ====================================================================
   Redes Sociales (rs-* públicos · rsa-* admin)
   ==================================================================== */
.rs-toolbar{
  display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
  background: #fff; border: 1px solid var(--uno-gray-100);
  border-radius: 10px; padding: 12px; margin-bottom: 16px;
}
.rs-toolbar input[type="search"], .rs-toolbar select{
  padding: 7px 10px; border: 1px solid var(--uno-gray-100); border-radius: 7px; font-size: 13px;
  min-width: 140px;
}
.rs-toolbar input[type="search"]{ flex: 1; min-width: 200px; }
.rs-only-destacados{ display: flex; align-items: center; gap: 6px; font-size: 13px; cursor: pointer; }

.rs-galeria{
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 14px;
}
.rs-card{
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 12px;
  overflow: hidden; cursor: pointer; transition: transform 0.15s, box-shadow 0.15s;
  display: flex; flex-direction: column;
}
.rs-card:hover{ transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.08); border-color: var(--uno-green-deep); }
.rs-card-img{
  width: 100%; aspect-ratio: 1/1; background: var(--uno-cream);
  background-size: cover; background-position: center; flex-shrink: 0;
}
.rs-card-img-empty{
  display: flex; align-items: center; justify-content: center;
  font-size: 48px; font-weight: 700; color: var(--uno-green-deep); opacity: 0.3;
}
.rs-card-body{ padding: 10px 12px 12px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.rs-card-body h4{ margin: 0; font-size: 14px; line-height: 1.3; color: var(--uno-gray-900); }
.rs-card-badges{ display: flex; flex-wrap: wrap; gap: 4px; min-height: 0; }
.rs-badge{
  font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.4px;
  padding: 2px 7px; border-radius: 10px; line-height: 1.4;
}
.rs-badge-urgente{ background: #C7301E; color: #fff; }
.rs-badge-destacado{ background: #FFA726; color: #fff; }
.rs-badge-camp{ background: var(--uno-green-deep); color: #fff; }
.rs-card-meta{ display: flex; flex-wrap: wrap; gap: 4px; }
.rs-chip{
  background: var(--uno-cream); color: var(--uno-gray-700);
  font-size: 11px; padding: 2px 8px; border-radius: 8px;
}
.rs-card-stats{
  display: flex; gap: 10px; font-size: 11px; color: var(--uno-gray-600);
  margin-top: auto; padding-top: 4px;
}
.rs-empty{
  background: #fff; border: 1px dashed var(--uno-gray-100); border-radius: 12px;
  padding: 60px 20px; text-align: center; color: var(--uno-gray-600);
  display: flex; flex-direction: column; gap: 8px; align-items: center;
}
.rs-empty strong{ font-size: 16px; color: var(--uno-gray-800); }

/* Modal detalle */
.rs-modal-detalle-card{ width: min(900px, 94vw); max-height: 90vh; overflow: auto; padding: 0; }
.rs-detalle{ display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
@media (max-width: 760px){ .rs-detalle{ grid-template-columns: 1fr; } }
.rs-detalle-preview{
  background: #1a1a1a; display: flex; align-items: center; justify-content: center;
  min-height: 360px; padding: 20px;
}
.rs-detalle-preview img, .rs-detalle-preview video{ max-width: 100%; max-height: 70vh; object-fit: contain; border-radius: 6px; }
.rs-detalle-preview audio{ width: 100%; }
.rs-detalle-noimg{ color: #888; font-size: 14px; }
.rs-detalle-info{ padding: 26px 28px; display: flex; flex-direction: column; gap: 12px; }
.rs-detalle-info h2{ margin: 0; font-size: 20px; }
.rs-detalle-info p{ margin: 0; color: var(--uno-gray-700); font-size: 14px; line-height: 1.5; }
.rs-detalle-texto label{ font-size: 12px; color: var(--uno-gray-600); display: block; margin-bottom: 4px; }
.rs-detalle-texto textarea{
  width: 100%; min-height: 80px; padding: 8px; border: 1px solid var(--uno-gray-100);
  border-radius: 6px; font-family: inherit; font-size: 13px; background: var(--uno-cream); resize: vertical;
}
.rs-detalle-texto button{ margin-top: 6px; }
.rs-detalle-hashtags{ font-size: 13px; color: #1E88E5; word-break: break-word; }
.rs-detalle-acciones{ display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding-top: 10px; border-top: 1px solid var(--uno-gray-100); }
.rs-detalle-acciones .rs-hint{ flex: 1; font-size: 12px; color: var(--uno-gray-600); }
.rs-detalle-stats{ font-size: 12px; color: var(--uno-gray-600); padding-top: 8px; border-top: 1px dashed var(--uno-gray-100); }

/* Admin tabla y editor */
.rsa-thumb{
  display: inline-block; width: 44px; height: 44px; border-radius: 6px;
  background: var(--uno-cream) center/cover; border: 1px solid var(--uno-gray-100);
  text-align: center; line-height: 42px; color: var(--uno-gray-600); font-size: 11px;
}
.cn-state-pill{
  display: inline-block; padding: 2px 10px; border-radius: 10px;
  font-size: 11px; font-weight: 600; color: #fff;
}
.rsa-edit-grid{
  display: grid; grid-template-columns: 2fr 1fr; gap: 18px; margin-top: 16px;
}
@media (max-width: 900px){ .rsa-edit-grid{ grid-template-columns: 1fr; } }
.rsa-edit-main, .rsa-edit-side{ display: flex; flex-direction: column; gap: 12px; }
.rsa-upload-row{ display: flex; gap: 10px; align-items: center; }
.rsa-archivo-info{ font-size: 12px; color: var(--uno-gray-600); }
.rsa-archivo-preview img{ max-width: 220px; max-height: 220px; border-radius: 8px; margin-top: 8px; border: 1px solid var(--uno-gray-100); }
.rsa-redes-checks{
  display: flex; flex-wrap: wrap; gap: 4px; padding: 8px; border: 1px solid var(--uno-gray-100); border-radius: 8px;
  background: #fff; max-height: 140px; overflow-y: auto;
}
.rsa-red-check{
  font-size: 12px; padding: 4px 10px; background: var(--uno-cream); border-radius: 14px;
  display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
}
.rsa-check{ display: flex; align-items: center; gap: 8px; padding: 4px 0; font-size: 13px; cursor: pointer; }
.rsa-revisiones{
  max-height: 200px; overflow-y: auto; background: #fff; padding: 6px;
  border: 1px solid var(--uno-gray-100); border-radius: 8px; font-size: 12px;
}
.rsa-rev-row{ padding: 6px 4px; border-bottom: 1px solid var(--uno-gray-100); }
.rsa-rev-row:last-child{ border-bottom: 0; }
.rsa-rev-com{ color: var(--uno-gray-700); margin-top: 2px; font-style: italic; }

/* === Botones de compartir / descargar (modal detalle RS) === */
.rs-share-grid{
  display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 6px; margin-top: 8px;
}
.rs-share-grid-secondary{ margin-top: 4px; }
.rs-share-btn{
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 9px 12px; border: 0; border-radius: 8px; cursor: pointer;
  color: #fff; font-size: 13px; font-weight: 600; text-transform: none;
  transition: opacity 0.15s, transform 0.1s;
}
.rs-share-btn:hover{ opacity: 0.9; }
.rs-share-btn:active{ transform: scale(0.97); }
.rs-share-btn-secondary{
  background: var(--uno-cream) !important; color: var(--uno-gray-800);
  border: 1px solid var(--uno-gray-100);
}
.rs-share-icon{
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; background: rgba(255,255,255,0.25);
  border-radius: 50%; font-weight: 700; font-size: 11px;
}
.rs-detalle-feedback{
  margin-top: 10px; padding: 10px 12px; border-radius: 8px; font-size: 13px;
  background: #f0f7ec; color: var(--uno-green-deep); border: 1px solid #c5e3b5;
}
.rs-detalle-feedback.rs-fb-bonus{ background: #fff7e0; color: #c46a00; border-color: #ffd180; font-weight: 600; }
.rs-detalle-feedback.rs-fb-dup{ background: #f4f4f4; color: var(--uno-gray-700); border-color: var(--uno-gray-100); font-style: italic; }

/* === Plantillas — admin (zonas) === */
.rsa-plantilla-panel{
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 10px;
  padding: 16px; margin-top: 16px;
}
.rsa-plantilla-panel h3{ margin: 0 0 6px; font-size: 15px; }
.rsa-zonas-list{ display: flex; flex-direction: column; gap: 10px; margin: 12px 0; }
.rsa-zona{
  background: var(--uno-cream); border: 1px solid var(--uno-gray-100);
  border-radius: 8px; padding: 10px; display: flex; flex-direction: column; gap: 8px;
}
.rsa-zona-head{ display: flex; gap: 6px; align-items: center; }
.rsa-zona-head input[data-zk="nombre"]{ flex: 1; padding: 6px 10px; border: 1px solid var(--uno-gray-100); border-radius: 6px; font-size: 13px; }
.rsa-zona-head select{ padding: 6px 10px; border: 1px solid var(--uno-gray-100); border-radius: 6px; font-size: 13px; }
.rsa-zona-pos, .rsa-zona-conf, .rsa-zona-extra{
  display: flex; flex-wrap: wrap; gap: 8px;
}
.rsa-zona-pos label, .rsa-zona-conf label, .rsa-zona-extra label{
  display: flex; flex-direction: column; gap: 2px; font-size: 12px; color: var(--uno-gray-700);
}
.rsa-zona-pos input, .rsa-zona-conf input, .rsa-zona-conf select, .rsa-zona-extra input, .rsa-zona-extra select{
  padding: 5px 8px; border: 1px solid var(--uno-gray-100); border-radius: 6px; font-size: 12px;
  width: 80px;
}
.rsa-zona-pos input{ width: 70px; }
.rsa-zona-conf input[type="text"], .rsa-zona-conf select{ width: auto; min-width: 130px; }

/* === Plantillas — afiliado === */
.rs-plantilla-modal{ width: min(900px, 94vw); max-height: 90vh; overflow: auto; padding: 0; }
.rs-plantilla-grid{
  display: grid; grid-template-columns: 1fr 1fr; gap: 0; min-height: 480px;
}
@media (max-width: 760px){ .rs-plantilla-grid{ grid-template-columns: 1fr; } }
.rs-plantilla-form{ padding: 24px; display: flex; flex-direction: column; gap: 12px; }
.rs-plantilla-form h3{ margin: 0; font-size: 18px; }
.rs-plantilla-campos{ display: flex; flex-direction: column; gap: 8px; }
.rs-plantilla-actions{ display: flex; gap: 10px; align-items: center; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--uno-gray-100); }
.rs-plantilla-preview{
  background: #1a1a1a; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 20px;
}
.rs-plantilla-preview img{ max-width: 100%; max-height: 60vh; border-radius: 6px; }
.rs-plantilla-preview-empty{ color: #888; font-size: 14px; }
.rs-plantilla-acciones{ margin-top: 14px; display: flex; gap: 10px; }

/* === Calendario público === */
.rs-cal-toolbar{ display: flex; gap: 14px; align-items: center; justify-content: center; margin-bottom: 14px; }
.rs-cal-toolbar h3{ margin: 0; text-transform: capitalize; font-size: 18px; min-width: 200px; text-align: center; }
.rs-cal-headers{
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-bottom: 4px;
  font-size: 12px; font-weight: 600; color: var(--uno-gray-600); text-align: center;
}
.rs-cal-cells{
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px;
}
.rs-cal-cell{
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 6px;
  padding: 6px 8px; min-height: 90px; display: flex; flex-direction: column; gap: 4px;
}
.rs-cal-cell-empty{ background: transparent; border: 1px dashed var(--uno-gray-100); }
.rs-cal-num{ font-size: 12px; font-weight: 600; color: var(--uno-gray-700); display: flex; gap: 3px; align-items: center; flex-wrap: wrap; }
.rs-cal-dot{ display: inline-block; width: 7px; height: 7px; border-radius: 50%; }
.rs-cal-evs{ display: flex; flex-direction: column; gap: 2px; }
.rs-cal-ev{
  font-size: 10px; padding: 2px 4px; border-radius: 3px;
  background: var(--uno-cream); border-left: 3px solid var(--uno-green-deep);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.3;
}
.rs-cal-ev small{ color: var(--uno-gray-600); font-size: 9px; }
.rs-cal-ev-more{ font-style: italic; color: var(--uno-gray-600); border-left: 0; padding-left: 4px; }
.rs-cal-leyenda{
  display: flex; gap: 16px; font-size: 12px; color: var(--uno-gray-700);
  margin-top: 12px; padding: 10px; background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 8px;
  flex-wrap: wrap;
}
.rs-cal-leyenda span{ display: flex; align-items: center; gap: 6px; }

/* === Calendario admin === */
.rsa-calendario-wrap{
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 10px;
  padding: 12px 16px; margin-top: 18px;
}
.rsa-calendario-wrap summary{ cursor: pointer; font-weight: 600; padding: 6px 0; }
.rsa-cal-toolbar{ display: flex; gap: 10px; margin: 12px 0; align-items: center; }
.rsa-cal-toolbar select{ padding: 7px 10px; border: 1px solid var(--uno-gray-100); border-radius: 6px; font-size: 13px; }

/* Fix global: el atributo [hidden] debe ocultar siempre, aunque haya
   reglas con display: flex/grid/block más específicas (ej: .cn-bell-menu, .mr-modal). */
[hidden] { display: none !important; }

/* === Banner tormenta === */
.rs-tormenta{
  background: linear-gradient(135deg, #C7301E 0%, #FF6B57 100%); color: #fff;
  border-radius: 14px; padding: 18px 20px; margin-bottom: 18px;
  box-shadow: 0 6px 24px rgba(199,48,30,0.25);
  position: relative; overflow: hidden;
}
.rs-tormenta-head{ display: flex; gap: 10px; align-items: center; margin-bottom: 6px; }
.rs-tormenta-head strong{ font-size: 18px; }
.rs-tormenta-pulse{
  width: 10px; height: 10px; border-radius: 50%; background: #fff;
  box-shadow: 0 0 0 0 rgba(255,255,255,0.6); animation: rsPulse 2s infinite;
}
@keyframes rsPulse {
  0%   { box-shadow: 0 0 0 0   rgba(255,255,255,0.6); }
  70%  { box-shadow: 0 0 0 12px rgba(255,255,255,0); }
  100% { box-shadow: 0 0 0 0   rgba(255,255,255,0); }
}
.rs-tormenta-hashtag{ font-size: 13px; opacity: 0.9; margin-left: auto; }
.rs-tormenta p{ margin: 0 0 12px; font-size: 14px; opacity: 0.95; }
.rs-tormenta-meta{ display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.rs-tormenta-progreso{ flex: 1; min-width: 200px; }
.rs-tormenta-bar{ width: 100%; height: 8px; background: rgba(255,255,255,0.25); border-radius: 4px; overflow: hidden; }
.rs-tormenta-bar-fill{ height: 100%; background: #fff; transition: width 0.5s; width: 0; }
.rs-tormenta-progreso small{ font-size: 11px; opacity: 0.85; }
.rs-tormenta-cuenta{ font-size: 14px; font-weight: 600; background: rgba(0,0,0,0.18); padding: 6px 12px; border-radius: 6px; }
.rs-tormenta-mats{
  display: flex; gap: 8px; margin-top: 14px; overflow-x: auto; padding-bottom: 6px;
}
.rs-tor-mat{
  background: rgba(255,255,255,0.12); border-radius: 8px; padding: 6px;
  min-width: 110px; cursor: pointer; flex-shrink: 0; transition: background 0.15s;
}
.rs-tor-mat:hover{ background: rgba(255,255,255,0.25); }
.rs-tor-mat-img{ width: 100%; aspect-ratio: 1; background: rgba(0,0,0,0.2) center/cover; border-radius: 6px; margin-bottom: 4px; }
.rs-tor-mat-cap{ font-size: 10px; line-height: 1.3; max-height: 30px; overflow: hidden; }
.rs-tor-prio{ display: inline-block; background: #FFD600; color: #1a1a1a; padding: 1px 5px; border-radius: 8px; font-size: 9px; font-weight: 700; margin-bottom: 2px; }
.rs-tor-badge{ background: linear-gradient(135deg,#C7301E,#FF6B57); color: #fff; padding: 3px 9px; border-radius: 10px; font-size: 11px; font-weight: 700; }

/* === Panel personal === */
.rs-panel-grid{
  display: grid; grid-template-columns: 2fr 1fr; gap: 16px;
}
@media (max-width: 760px){ .rs-panel-grid{ grid-template-columns: 1fr; } }
.rs-panel-stats{
  display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px;
}
.rs-panel-card{
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 10px;
  padding: 12px 14px; display: flex; flex-direction: column; gap: 4px;
}
.rs-panel-card small{ font-size: 11px; color: var(--uno-gray-600); text-transform: uppercase; letter-spacing: 0.4px; }
.rs-panel-card strong{ font-size: 22px; color: var(--uno-green-deep); }
.rs-panel-puntos{ grid-column: span 2; background: linear-gradient(135deg, #f0f7ec, #fff); }
.rs-panel-puntos strong{ font-size: 36px; }
.rs-panel-nivel{ display: inline-block; padding: 3px 12px; border-radius: 12px; font-size: 12px; color: #fff; font-weight: 600; margin-top: 4px; }
.rs-panel-bar{ height: 8px; background: var(--uno-gray-100); border-radius: 4px; overflow: hidden; margin-top: 6px; }
.rs-panel-bar > div{ height: 100%; background: var(--uno-green-deep); transition: width 0.5s; }
.rs-panel-bar-label{ font-size: 11px; color: var(--uno-gray-600); margin-top: 2px; }

.rs-panel-pos, .rs-panel-badges, .rs-panel-prefs{
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 10px;
  padding: 14px 16px;
}
.rs-panel-pos h4, .rs-panel-badges h4, .rs-panel-prefs h4{ margin: 0 0 8px; font-size: 14px; }
.rs-panel-pos ul{ list-style: none; padding: 0; margin: 0; font-size: 13px; }
.rs-panel-pos li{ padding: 4px 0; border-bottom: 1px dashed var(--uno-gray-100); display: flex; justify-content: space-between; }
.rs-panel-pos li:last-child{ border-bottom: 0; }
.rs-panel-badges{ grid-column: span 2; }
@media (max-width: 760px){ .rs-panel-puntos, .rs-panel-badges{ grid-column: 1; } }
.rs-badge-list{
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 8px;
}
.rs-badge-card{
  display: flex; gap: 10px; align-items: center;
  padding: 8px 10px; border: 2px solid; border-radius: 8px; background: #fff;
}
.rs-badge-icon{
  width: 36px; height: 36px; border-radius: 50%; display: flex;
  align-items: center; justify-content: center; color: #fff; font-size: 18px;
}
.rs-badge-meta{ display: flex; flex-direction: column; gap: 2px; flex: 1; }
.rs-badge-meta strong{ font-size: 13px; }
.rs-badge-meta small{ font-size: 10px; color: var(--uno-gray-600); }

.rs-panel-prefs{ grid-column: span 2; }
.rs-panel-prefs label{ display: flex; align-items: center; gap: 8px; padding: 4px 0; font-size: 13px; cursor: pointer; }
.rs-pref-row{ flex-wrap: wrap; }
.rs-pref-row input[type="text"]{
  flex: 1; min-width: 200px; padding: 6px 10px; border: 1px solid var(--uno-gray-100); border-radius: 6px; font-size: 13px;
}

/* === Ranking === */
.rs-rank-toolbar{ display: flex; gap: 10px; margin-bottom: 12px; }
.rs-rank-toolbar select{ padding: 7px 10px; border: 1px solid var(--uno-gray-100); border-radius: 7px; font-size: 13px; }
.rs-rank-ol{ list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 4px; }
.rs-rank-ol li{
  display: flex; align-items: center; gap: 12px; padding: 10px 14px;
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 8px;
}
.rs-rank-ol li.rs-rank-yo{ background: #f0f7ec; border-color: var(--uno-green-deep); }
.rs-rank-pos{ min-width: 48px; font-weight: 700; font-size: 16px; color: var(--uno-gray-800); }
.rs-rank-avatar{
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 50%; background: var(--uno-cream) center/cover;
  font-weight: 700; color: var(--uno-green-deep);
}
.rs-rank-nombre{ flex: 1; font-size: 14px; }
.rs-rank-pts{ font-size: 13px; font-weight: 600; color: var(--uno-green-deep); }
.rs-rank-mipos{
  margin-top: 12px; padding: 10px 14px; background: var(--uno-cream); border-radius: 8px;
  font-size: 13px; color: var(--uno-gray-800); text-align: center;
}

/* === Modal campaña === */
.rs-camp-modal{ width: min(640px, 92vw); }

/* === Registros manuales (panel afiliado) === */
.rs-panel-regman{
  grid-column: span 2;
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 10px;
  padding: 14px 16px;
}
@media (max-width: 760px){ .rs-panel-regman{ grid-column: 1; } }
.rs-panel-regman h4{ margin: 0 0 6px; font-size: 14px; }
.rs-panel-regman p{ margin: 0 0 10px; font-size: 13px; color: var(--uno-gray-700); }
.rs-reg-mios{ margin-top: 12px; font-size: 13px; }
.rs-reg-mios .cn-table-mini td{ vertical-align: top; padding: 6px 8px; }
.rs-reg-link{ font-size: 12px; color: var(--uno-green-deep); }
.cn-state-pill.rs-reg-pill-pendiente{ background: #FFA726; }
.cn-state-pill.rs-reg-pill-validado{  background: #4E9A2D; }
.cn-state-pill.rs-reg-pill-rechazado{ background: #C7301E; }

/* Badge "pendientes" en details admin */
.rsa-reg-pend-badge{
  display: inline-block; background: #C7301E; color: #fff;
  border-radius: 9px; padding: 1px 7px; font-size: 11px; font-weight: 700;
  margin-left: 6px; min-width: 18px; text-align: center;
}

/* Modal registro admin */
.rsa-reg-card{
  background: var(--uno-cream); border: 1px solid var(--uno-gray-100);
  border-radius: 8px; padding: 12px; margin-bottom: 12px; font-size: 13px;
}
.rsa-reg-card div{ padding: 4px 0; border-bottom: 1px dashed var(--uno-gray-100); }
.rsa-reg-card div:last-child{ border-bottom: 0; }

/* === Dashboard métricas === */
.rsa-met-kpis{
  display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px;
  margin: 10px 0;
}
.rsa-met-kpi{
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 8px;
  padding: 10px 12px; display: flex; flex-direction: column; gap: 2px;
}
.rsa-met-kpi small{ font-size: 11px; color: var(--uno-gray-600); text-transform: uppercase; letter-spacing: 0.4px; }
.rsa-met-kpi strong{ font-size: 22px; color: var(--uno-green-deep); }
.rsa-met-grid{
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 10px;
}
@media (max-width: 760px){ .rsa-met-grid{ grid-template-columns: 1fr; } }
.rsa-met-grid > div{
  background: #fff; border: 1px solid var(--uno-gray-100); border-radius: 8px; padding: 12px;
}
.rsa-met-wide{ grid-column: span 2; }
@media (max-width: 760px){ .rsa-met-wide{ grid-column: 1; } }
.rsa-met-grid h4{ margin: 0 0 8px; font-size: 13px; color: var(--uno-gray-700); }
.rsa-met-list{ list-style: none; padding: 0; margin: 0; }
.rsa-met-list li{
  display: flex; gap: 8px; padding: 6px 0; border-bottom: 1px dashed var(--uno-gray-100);
  align-items: center; font-size: 13px;
}
.rsa-met-list li:last-child{ border-bottom: 0; }
.rsa-met-list .rsa-met-pos{
  display: inline-block; width: 28px; font-weight: 700; color: var(--uno-gray-700);
}
.rsa-met-list span:nth-child(2){ flex: 1; }
.rs-met-dot{ display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }
