/* Tikitago · Estilos compartidos de páginas legales (Términos, Privacidad, Reembolsos) */
/* ── Paleta ────────────────────────────────────────────────────────────────
   Corregida tras revisar las páginas en pantalla. Tres problemas de fondo:

   1) Las superficies eran MÁS OSCURAS que el fondo. El degradado de las cajas
      bajaba a #0f0f1a mientras el fondo de la página está en #13161A arriba:
      las tarjetas se leían como agujeros negros recortados sobre la página.
      En una interfaz oscura la jerarquía va al revés: lo que está "encima"
      recibe más luz, no menos. Ahora las superficies suben a #191926/#141420.

   2) Los colores se heredaban del <body>. Estas páginas cargan Bootstrap desde
      un CDN, que en modo claro define su propio color de texto y de titulares.
      Si el CDN llega tarde, o gana la cascada, los titulares se apagan. Ahora
      cada bloque declara su color, sin depender de la herencia.

   3) El texto de cuerpo estaba en #9a9ab8 a 14.5px: justo en el límite. Sube a
      #b4b4cc y 15px — sobre el fondo nuevo da 8.9:1, muy por encima del 4.5:1
      que exige la norma AA.

   El oro y el violeta son los mismos de la aplicación (cd-aurora.css), para
   que las páginas legales no parezcan de otro sitio.                        */
:root{
  --bg:#090A0C; --bg2:#0D0F12;
  --sf:#13161A; --sf2:#13161A;          /* superficies: por ENCIMA del fondo */
  --sf-hi:#181C21;                       /* superficie destacada */
  --b:rgba(255,255,255,.09); --b2:rgba(255,255,255,.16);
  --coin:#E5BD59; --coin2:#F2D98C; --coin-soft:rgba(229,189,89,.13);
  --viol:#E5BD59;
  --tx:#F1F2F3; --tx2:#C7CBD1; --tx3:#9BA2AD;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  /* El halo superior baja de #13161A a #13161A con menos alcance: antes competía
     con las tarjetas y hacía que la mitad superior pareciera más clara que ellas. */
  background:var(--bg);
  background-color:var(--bg);
  color:var(--tx); font-family:var(--font-ui,'Inter',system-ui,-apple-system,'Segoe UI',sans-serif); line-height:1.65;
}

/* Barra superior */
.lg-top{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:13px 22px;background:#0D0F12;backdrop-filter:none;border-bottom:1px solid var(--b);}
.lg-logo{display:flex;align-items:center;gap:8px;font-weight:800;font-size:17px;text-decoration:none;color:var(--tx);}
.lg-mark{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--coin),var(--coin2));
  display:flex;align-items:center;justify-content:center;color:#3a2606;font-weight:800;font-size:16px;}
.lg-logo em{font-style:normal;color:var(--coin2);}
.lg-back{font-size:13px;color:var(--tx2);text-decoration:none;display:inline-flex;align-items:center;gap:6px;
  padding:7px 13px;border:1px solid var(--b2);border-radius:9px;transition:.15s;}
.lg-back:hover{color:var(--coin2);border-color:var(--coin-soft);}

/* Hero */
.lg-hero{max-width:1080px;margin:0 auto;padding:40px 22px 12px;}
.lg-kicker{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.6px;color:var(--coin2);
  background:transparent;border-bottom:1px solid var(--coin);padding:4px 0;border-radius:0;text-transform:uppercase;}
/* Color declarado, no heredado: Bootstrap (CDN) define lo suyo para h1..h6 y
   basta con que gane la cascada para que el titular se apague. */
.lg-hero h1{font-size:clamp(27px,3.8vw,35px);font-weight:750;margin:15px 0 6px;letter-spacing:-.7px;
  color:var(--tx);-webkit-text-fill-color:var(--tx);}
.lg-updated{color:var(--tx3);font-size:13px;margin:0;}

/* Layout TOC + contenido */
.lg-wrap{max-width:1080px;margin:0 auto;padding:18px 22px 60px;display:grid;grid-template-columns:240px 1fr;gap:34px;align-items:start;}
.lg-toc{position:sticky;top:calc(var(--cd-header-offset,0px) + var(--cd-header-height,60px) + 14px);border:1px solid var(--b);border-radius:0;border-left:0;border-right:0;border-bottom:0;
  background:transparent;padding:15px 0;color:var(--tx2);}
.lg-toc h2{font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--coin2);margin:0 0 10px;}
.lg-toc ol{list-style:none;margin:0;padding:0;counter-reset:toc;}
.lg-toc li{counter-increment:toc;margin:2px 0;}
.lg-toc a{display:flex;gap:8px;font-size:13px;color:var(--tx2);text-decoration:none;padding:7px 8px;border-radius:8px;transition:.13s;}
.lg-toc a::before{content:counter(toc);color:var(--coin);font-weight:700;min-width:16px;}
.lg-toc a:hover,.lg-toc a.active{background:var(--coin-soft);color:var(--tx);}
.lg-toc a:hover::before,.lg-toc a.active::before{color:var(--coin2);}

/* Acordeón local Tikitago — sin dependencia externa */
.accordion{--bs-accordion-bg:transparent;--bs-accordion-border-color:var(--b);--bs-accordion-border-radius:13px;
  --bs-accordion-color:var(--tx);--bs-accordion-active-bg:var(--coin-soft);--bs-accordion-active-color:var(--coin2);
  --bs-accordion-btn-color:var(--tx);--bs-accordion-btn-bg:var(--sf);
  --bs-body-color:var(--tx);--bs-heading-color:var(--tx);--bs-emphasis-color:var(--tx);
  --bs-accordion-btn-focus-box-shadow:0 0 0 .2rem rgba(229,189,89,.20);}
.accordion-item{background:var(--sf);border:1px solid var(--b)!important;
  border-radius:9px!important;margin-bottom:12px;overflow:hidden;}
.accordion-button{font-weight:700;font-size:16px;background:transparent!important;color:var(--tx)!important;padding:17px 18px;}
.accordion-button:not(.collapsed){color:var(--coin2)!important;box-shadow:none;}
.accordion-button::after{filter:invert(82%) sepia(38%) saturate(700%) hue-rotate(350deg) brightness(104%);}
.accordion-button .num{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:7px;
  background:var(--coin-soft);color:var(--coin2);font-size:13px;font-weight:800;margin-right:11px;flex:0 0 auto;}
.accordion-body{color:var(--tx2);font-size:15px;padding:4px 20px 22px;}
.accordion-body h3{color:var(--tx);font-size:15px;margin:18px 0 7px;}
.accordion-body p{margin:0 0 11px;}
.accordion-body ul{margin:0 0 12px;padding-left:20px;}
.accordion-body li{margin:4px 0;}
.accordion-body strong{color:var(--tx);}
.lg-note{border-left:3px solid var(--coin);background:var(--coin-soft);border-radius:0 10px 10px 0;padding:11px 14px;margin:14px 0;font-size:13.5px;color:var(--tx);}

/* Footer legal (compartido con el SPA) */
.cd-footer{border-top:1px solid var(--b);background:var(--bg2);margin-top:30px;}
.cdf-inner{max-width:1080px;margin:0 auto;padding:34px 22px 18px;display:flex;flex-wrap:wrap;gap:30px;justify-content:space-between;}
.cdf-brand{max-width:340px;}
.cdf-logo{display:flex;align-items:center;gap:8px;font-weight:800;font-size:17px;}
.cdf-mark{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,var(--coin),var(--coin2));display:flex;align-items:center;justify-content:center;color:#3a2606;font-weight:800;}
.cdf-gold{color:var(--coin2);}
.cdf-tag{color:var(--tx3);font-size:13px;margin:9px 0 14px;}
.cdf-social{display:flex;gap:8px;}
.cdf-soc{width:36px;height:36px;border-radius:10px;border:1px solid var(--b2);background:var(--sf);display:flex;align-items:center;justify-content:center;color:var(--tx3);cursor:default;transition:.15s;position:relative;}
.cdf-soc svg{width:18px;height:18px;}
.cdf-soc:hover{color:var(--coin2);border-color:var(--coin-soft);transform:translateY(-2px);}
.cdf-soc::after{content:'Próximamente';position:absolute;bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);background:#000;color:var(--coin2);font-size:10px;padding:3px 7px;border-radius:6px;white-space:nowrap;opacity:0;pointer-events:none;transition:.15s;border:1px solid var(--coin-soft);}
.cdf-soc:hover::after{opacity:1;}
.cdf-links{display:flex;flex-direction:column;gap:8px;}
.cdf-links-title{font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--coin2);font-weight:700;margin-bottom:3px;}
.cdf-links a{color:var(--tx2);text-decoration:none;font-size:14px;transition:.13s;}
.cdf-links a:hover{color:var(--coin2);}
.cdf-bottom{max-width:1080px;margin:0 auto;padding:14px 22px 26px;border-top:1px solid var(--b);display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;font-size:12px;color:var(--tx3);}

@media(max-width:860px){
  .lg-wrap{grid-template-columns:1fr;}
  .lg-toc{display:none;}
  .lg-hero h1{font-size:27px;}
}

/* ══ BLINDAJE FRENTE A BOOTSTRAP ═══════════════════════════════════════════
   Estas páginas cargan Bootstrap 5.3 desde un CDN. Bootstrap arranca en modo
   CLARO por defecto: define --bs-body-color:#212529 y sus propios tokens de
   titular y de énfasis. Basta con que gane la cascada —o con que el CDN llegue
   después— para que los titulares y el texto se apaguen sobre el fondo oscuro,
   que es exactamente lo que se veía.

   La solución de raíz es declararle a Bootstrap que este documento es oscuro
   (data-bs-theme="dark" en el <html>, ya añadido) y, además, fijar aquí sus
   variables por si esa marca faltara en alguna página. Cinturón y tirantes:
   una página legal no puede quedarse ilegible porque un CDN vaya lento.      */
:root{
  --bs-body-bg:var(--bg); --bs-body-color:var(--tx);
  --bs-heading-color:var(--tx); --bs-emphasis-color:var(--tx);
  --bs-secondary-color:var(--tx2); --bs-border-color:var(--b);
  --bs-link-color:var(--coin2); --bs-link-hover-color:var(--coin);
}
body,.lg-wrap,.lg-hero{color:var(--tx)}
.lg-hero h1,.lg-wrap h2,.lg-wrap h3,.lg-wrap h4{color:var(--tx)}

/* ══ LEGIBILIDAD DEL CUERPO ════════════════════════════════════════════════
   Enlaces y textos destacados dentro del contenido: el subrayado a media
   altura y el oro claro los hacen distinguibles sin gritar.                  */
.accordion-body a,.lg-wrap p a{color:var(--coin2);text-decoration:underline;text-underline-offset:3px;
  text-decoration-thickness:1px;text-decoration-color:rgba(255,233,168,.45);transition:.15s}
.accordion-body a:hover,.lg-wrap p a:hover{color:var(--coin);text-decoration-color:var(--coin)}

/* Bloques de datos dentro del contenido (correo, dirección, horario…). Antes
   eran listas sueltas; enmarcarlos con una superficie ligeramente más clara
   los separa del texto corrido sin añadir otra caja negra. */
.lg-datos{
  margin:12px 0 4px;padding:13px 16px;border-radius:11px;
  background:var(--sf-hi);border:1px solid var(--b);
  font-size:14px;line-height:1.9;color:var(--tx2);
}
.lg-datos strong{color:var(--tx);font-weight:700}
.lg-datos div+div{border-top:1px solid rgba(255,255,255,.05);padding-top:7px;margin-top:5px}


/* ══ ACORDEÓN LOCAL F103.31.20 ════════════════════════════════════════════
   Reemplaza Bootstrap Collapse. El HTML conserva sus clases históricas para
   minimizar migración, pero el comportamiento y la geometría son propios. */
.accordion{display:grid;gap:12px;--lg-acc-time:.22s}
.accordion-item{margin:0!important}
.accordion-header{margin:0}
.accordion-button{
  appearance:none;width:100%;min-height:58px;border:0;margin:0;display:flex;align-items:center;gap:0;
  text-align:left;cursor:pointer;background:transparent!important;color:var(--tx)!important;padding:16px 18px;
  font:700 16px/1.35 var(--font-ui,'Inter',system-ui,sans-serif);transition:background var(--lg-acc-time) ease,color var(--lg-acc-time) ease
}
.accordion-button:hover{background:rgba(229,189,89,.055)!important}
.accordion-button[aria-expanded="true"]{color:var(--coin2)!important;background:var(--coin-soft)!important}
.accordion-button::after{
  content:"";background-image:none!important;filter:none!important;width:10px;height:10px;margin-left:auto;flex:0 0 auto;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg);transition:transform var(--lg-acc-time) ease;opacity:.82
}
.accordion-button[aria-expanded="true"]::after{transform:rotate(225deg) translate(-2px,-2px)}
.accordion-collapse{display:grid;grid-template-rows:0fr;opacity:.5;transition:grid-template-rows var(--lg-acc-time) ease,opacity var(--lg-acc-time) ease}
.accordion-collapse.show{grid-template-rows:1fr;opacity:1}
.accordion-collapse>.accordion-body{min-height:0;overflow:hidden;padding:0 20px;transition:padding var(--lg-acc-time) ease}
.accordion-collapse.show>.accordion-body{padding:4px 20px 22px}
.accordion-button:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(229,189,89,.22) inset,0 0 0 2px var(--coin)}
@media(prefers-reduced-motion:reduce){.accordion-button,.accordion-button::after,.accordion-collapse,.accordion-collapse>.accordion-body{transition:none!important}}

/* F103.31.50 · una sola cabecera. La barra legal local solo sirve sin el shell Tikitago. */
body.cd-has-head>.lg-top{display:none!important}
