/*! Diseño y desarrollo web: Xaime Nieto · https://xaimenieto.com · contacto@xaimenieto.com · © 2026 */
/* ═══════════════════════════════════════════════════════════════════════════════════════════
   Tema claro / oscuro de la propuesta (vista privada) · 19-oct
   El tema lo fija un script en línea al principio del <head> (data-tema="claro|oscuro" en <html>).
   Sólo colores oficiales: #2F414C · #435561 · #A0C4DA · blanco · tinte #F2F7FA · fondo #232C37 del sitio.
   Oscuro: fondo #232C37, secciones y tarjetas #2F414C, superficie #435561 sólo donde hace falta;
   texto blanco, secundario al 72 %, acento #A0C4DA (botones con texto #232C37).
   Las reglas de oscuro llevan «:root[data-tema=oscuro] body» para ganar a las !important de cada hoja.
   ═══════════════════════════════════════════════════════════════════════════════════════════ */
:root{color-scheme:light;
 --t-fondo:#fff;--t-fondo-2:#F2F7FA;--t-superficie:#fff;--t-texto:#2F414C;--t-texto-2:#435561;--t-filete:#DDE6EC;
 --t-boton:#2F414C;--t-boton-texto:#fff;--t-boton-hover:#435561}
:root[data-tema=oscuro]{color-scheme:dark;
 --t-fondo:#232C37;--t-fondo-2:#2F414C;--t-superficie:#2F414C;--t-texto:#fff;--t-texto-2:rgba(255,255,255,.72);--t-filete:rgba(255,255,255,.12);
 --t-boton:#A0C4DA;--t-boton-texto:#232C37;--t-boton-hover:#fff}
/* al cambiar de tema no se animan colores */
.tema-sin-transicion,.tema-sin-transicion *,.tema-sin-transicion *::before,.tema-sin-transicion *::after{transition:none!important}

/* ── selector de tema (los dos temas) ── */
.gx-tema{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:999px}
.gx-tema button{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;margin:0;padding:0;border:0;border-radius:999px;background:none;color:inherit;cursor:pointer;opacity:.78;transition:background-color .2s,opacity .2s}
.gx-tema button:hover{opacity:1}
.gx-tema button[aria-pressed="true"]{opacity:1;background:rgba(47,65,76,.1);color:var(--tinta,#2F414C)}
.gx-tema button:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.gx--foto:not(.gx--solido):not(.gx--abierto) .gx-barra .gx-tema button[aria-pressed="true"]{background:rgba(255,255,255,.18);color:#fff}
.gx-cajon .gx-tema{gap:6px;padding:0}
.gx-cajon .gx-tema button{width:44px;height:44px;opacity:1;color:var(--tinta-2);box-shadow:inset 0 0 0 1px var(--filete)}
.gx-cajon .gx-tema button[aria-pressed="true"]{background:var(--tinta);color:var(--marfil);box-shadow:none}
@media (max-width:1100px){.gx-barra .gx-tema{display:none}}
.gx-cajon .gx-tema-fila{justify-content:flex-start}

/* ═════════════════════════════ OSCURO ═════════════════════════════ */
:root[data-tema=oscuro],:root[data-tema=oscuro] body{background:#232C37!important}

/* variables de cada componente: el mismo sistema, invertido */
:root[data-tema=oscuro] body :is(.gx,.gx-cajon,.gx-saltar,.gx-seccion,.px-hero,.px-marcas,.px-central,.px-dialogo,.pz,.pz-pie,.pi,.ph,.pc,.ia,.ct,.irp){
 --marfil:#232C37;--marfil-2:#2F414C;--blanco:#232C37;--tinta:#fff;--tinta-2:rgba(255,255,255,.72);--filete:rgba(255,255,255,.12);
 --acento:#A0C4DA;--marino:#2F414C}

/* botones: relleno #A0C4DA con texto #232C37 (7.9:1); los invertidos, contorno claro */
:root[data-tema=oscuro] body :is(.gx-cta,.px-boton,.pz-boton--oscuro,.ph-btn,.pc .btn_1,.pc .gc-bylaws,.pc .cf-submit,.pc button[type=submit],.pc input[type=submit],.ct-enviar,.gx-saltar){
 background:#A0C4DA!important;color:#232C37!important;border-color:#A0C4DA!important}
:root[data-tema=oscuro] body :is(.gx-cta,.px-boton,.pz-boton--oscuro,.ph-btn,.pc .btn_1,.pc .gc-bylaws,.pc .cf-submit,.ct-enviar):hover{background:#fff!important;border-color:#fff!important}
:root[data-tema=oscuro] body :is(.px-boton--claro,.pz-boton,.ph-btn--claro){background:transparent!important;color:#fff!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.5)!important}
:root[data-tema=oscuro] body :is(.px-boton--claro,.pz-boton,.ph-btn--claro):hover{background:rgba(255,255,255,.08)!important}
:root[data-tema=oscuro] body .pz-boton.pz-boton--oscuro{box-shadow:none!important}

/* ── encabezado ── */
:root[data-tema=oscuro] body .gx-principal::before,
:root[data-tema=oscuro] body:has(.gx-seccion) .gx--solido:not(.gx--abierto) .gx-principal::before{background:#232C37}
:root[data-tema=oscuro] body .gx--solido .gx-principal::before{background:rgba(35,44,55,.94)}
:root[data-tema=oscuro] body .gx--abierto .gx-principal::before{background:#232C37}
:root[data-tema=oscuro] body .gx--solido .gx-principal{border-bottom-color:rgba(255,255,255,.08)}
:root[data-tema=oscuro] body .gx-logo .claro{opacity:1}
:root[data-tema=oscuro] body .gx-logo .oscuro{opacity:0}
/* barra superior: #2F414C contra el encabezado #232C37, un salto mínimo (1.4:1), no una franja */
:root[data-tema=oscuro] body .gx:not(.gx--barra-oscura) .gx-barra{background:#2F414C;color:rgba(255,255,255,.78);box-shadow:inset 0 -1px 0 rgba(255,255,255,.06)}
:root[data-tema=oscuro] body .gx:not(.gx--barra-oscura) .gx-barra a:hover,:root[data-tema=oscuro] body .gx:not(.gx--barra-oscura) .gx-tel:hover{color:#fff}
:root[data-tema=oscuro] body .gx:not(.gx--barra-oscura) .gx-redes a{color:rgba(255,255,255,.72)}
:root[data-tema=oscuro] body .gx:not(.gx--barra-oscura) .gx-sep{background:rgba(255,255,255,.18)}
:root[data-tema=oscuro] body .gx:not(.gx--barra-oscura) .gx-cotiza,:root[data-tema=oscuro] body .gx:not(.gx--barra-oscura) .gx-cotiza .pr{color:#fff}
:root[data-tema=oscuro] body .gx:not(.gx--barra-oscura) .gx-cotiza .sim small,:root[data-tema=oscuro] body .gx:not(.gx--barra-oscura) .gx-cotiza .var,:root[data-tema=oscuro] body .gx:not(.gx--barra-oscura) .gx-cotiza .hora{color:rgba(255,255,255,.72)}
:root[data-tema=oscuro] body .gx:not(.gx--barra-oscura) .gx-cotiza .var.baja{color:#F2B8A8}
:root[data-tema=oscuro] body .gx:not(.gx--barra-oscura) .gx-cotiza .var.sube{color:#9FE0B8}
:root[data-tema=oscuro] body .gx:not(.gx--barra-oscura) .gx-cotiza [data-pr]:empty{background:linear-gradient(100deg,rgba(255,255,255,.10) 30%,rgba(255,255,255,.28) 50%,rgba(255,255,255,.10) 70%) 0 0/300% 100%}
:root[data-tema=oscuro] body .gx-tema button[aria-pressed="true"]{background:rgba(255,255,255,.14);color:#fff}
/* sobre la foto de la portada en reposo: igual que en claro */
:root[data-tema=oscuro] body .gx--foto:not(.gx--solido):not(.gx--abierto) .gx-barra{background:transparent;box-shadow:none}
:root[data-tema=oscuro] body .gx--foto:not(.gx--solido):not(.gx--abierto) .gx-principal::before{background:transparent}
:root[data-tema=oscuro] body .gx--foto:not(.gx--solido):not(.gx--abierto) .gx-cta{background:#fff!important;color:#232C37!important;border-color:#fff!important}
/* megamenús, tarjeta BMV, desplegable de comités, barra de sección y cajón */
:root[data-tema=oscuro] body :is(.gx-mega,.gx-cajon,.gx-sec-grupo ul){background:#232C37}
:root[data-tema=oscuro] body .gx-mega{border-color:rgba(255,255,255,.08)}
:root[data-tema=oscuro] body .gx-dato{background:#2F414C}
:root[data-tema=oscuro] body .gx-seccion,:root[data-tema=oscuro] body .gx-desplazado .gx-seccion{background:#2F414C;box-shadow:inset 0 -1px 0 rgba(255,255,255,.08)}
:root[data-tema=oscuro] body .gx-desplazado .gx-seccion{box-shadow:inset 0 -1px 0 rgba(255,255,255,.08),0 10px 30px -18px rgba(0,0,0,.6)}
:root[data-tema=oscuro] body .gx-sec-grupo ul{border-color:rgba(255,255,255,.12)}
:root[data-tema=oscuro] body .gx-sec-grupo ul a:hover,:root[data-tema=oscuro] body .gx-sec-grupo ul a[aria-current]{background:#2F414C}
:root[data-tema=oscuro] body .gx-velo{background:rgba(10,14,18,.55)}

/* ── portada ── */
:root[data-tema=oscuro] body .px-central,:root[data-tema=oscuro] body .px-marcas{background:#232C37}
:root[data-tema=oscuro] body .px-marcas img{filter:brightness(0) invert(1);opacity:.82}
:root[data-tema=oscuro] body .px-marcas::before{background:linear-gradient(90deg,#232C37,rgba(35,44,55,0))!important}
:root[data-tema=oscuro] body .px-marcas::after{background:linear-gradient(270deg,#232C37,rgba(35,44,55,0))!important}
:root[data-tema=oscuro] body :is(.px-tarjeta,.px-dos-tarjeta){background:#2F414C;box-shadow:0 0 0 1px rgba(255,255,255,.06),0 30px 60px -40px rgba(0,0,0,.7)}
:root[data-tema=oscuro] body .px-sec:nth-of-type(even) :is(.px-tarjeta,.px-dos-tarjeta),:root[data-tema=oscuro] body .px-dos .px-dos-tarjeta{background:#232C37}
:root[data-tema=oscuro] body .px-titulo span{background-image:linear-gradient(transparent 62%,rgba(160,196,218,.32) 62%)}
/* mapa: mar en #2F414C, México en blanco al 90 %, pines oscuros con etiqueta legible */
:root[data-tema=oscuro] body .px-mapa-tarjeta{background:#435561}
:root[data-tema=oscuro] body .px-pin{background:#232C37;color:#fff;border-color:#fff}
:root[data-tema=oscuro] body .px-pin:has(span:empty)::before{background:#232C37;border-color:#fff}
:root[data-tema=oscuro] body :is(.px-mapa--foco .px-pin--on,.px-pin--sel){background:#A0C4DA;color:#232C37}
:root[data-tema=oscuro] body :is(.px-mapa--foco .px-pin--on:has(span:empty),.px-pin--sel:has(span:empty))::before{background:#A0C4DA}
:root[data-tema=oscuro] body .px-pin em{background:#232C37;color:#fff}
:root[data-tema=oscuro] body .px-mapa-cifras b,:root[data-tema=oscuro] body .px-mapa-cifras span{color:#fff}
:root[data-tema=oscuro] body .px-dest-hoteles img{background:#2F414C}
:root[data-tema=oscuro] body .px-cine-circulo{background:#fff;color:#232C37}
:root[data-tema=oscuro] body .px-dialogo{background:#232C37}

/* ── vacantes, marcas, pie ── */
:root[data-tema=oscuro] body .pz-vacantes,:root[data-tema=oscuro] body .pz-marcas2{background:#232C37}
:root[data-tema=oscuro] body .pz-vac2--b .pz-vac2-txt{background:rgba(35,44,55,.8);border-color:rgba(255,255,255,.12)}
:root[data-tema=oscuro] body .pz-teselas li{background:#2F414C}
:root[data-tema=oscuro] body .pz-teselas li:hover{background:#435561;box-shadow:none}
:root[data-tema=oscuro] body .pz-teselas img{filter:brightness(0) invert(1);opacity:.88}
:root[data-tema=oscuro] body .pz-pie{background:#2F414C}
:root[data-tema=oscuro] body .pz-input{background:#232C37;border-color:rgba(255,255,255,.4);color:#fff}
:root[data-tema=oscuro] body .pz-input::placeholder{color:rgba(255,255,255,.62)}
:root[data-tema=oscuro] body .pz-input:hover{border-color:rgba(255,255,255,.6)}
:root[data-tema=oscuro] body .pz-pie-logo img{filter:brightness(0) invert(1)}

/* ── interiores ── */
:root[data-tema=oscuro] body :is(.ph,.pc,.ia,.ct,.irp){background:#232C37}
:root[data-tema=oscuro] body :is(.ph-ficha,.ct-form,.pc .fi-year-card,.pc .gc-board,.pc .ac-card,.pc .bmv-contact-card,.pc .cf-form-wrap,.irp .ir-card,.ph-amen li,.ia-tarjeta,.ct-tarjeta){background:#2F414C!important;border-color:rgba(255,255,255,.1)!important;box-shadow:none!important}
:root[data-tema=oscuro] body :is(.ia-tarjeta:hover,.ia-tarjeta[aria-current],.pc .ac-card:hover){background:#435561!important}
:root[data-tema=oscuro] body .ia-tarjeta[aria-current]{box-shadow:inset 0 0 0 1.5px #A0C4DA!important}
:root[data-tema=oscuro] body :is(.ia-ico,.pc .pr-count,.pc .pr-pdf,.irp .ir-download__icon,.irp .ir-event__icon,.irp .bmv-ticker__exchange,.irp .ir-downloads__count){background:#232C37!important;color:#fff!important}
:root[data-tema=oscuro] body :is(.pc .fi-quarter,.pc .pr-pill,.pc .gc-legend,.ph-desc li::before,.pc .gc-badge){background-color:#232C37!important}
:root[data-tema=oscuro] body .pc .fi-quarter.fi-annual{background:#2F414C!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)!important}
:root[data-tema=oscuro] body :is(.pc .fi-doc:hover,.irp .ir-download:hover,.pc .pr-item:hover,.pc .gc-member:hover){background:#435561!important}
:root[data-tema=oscuro] body .pc .pr-pill.pr-active{background:#A0C4DA!important;color:#232C37!important}
:root[data-tema=oscuro] body .pc .pr-pill.pr-active .pr-count{background:rgba(35,44,55,.2)!important;color:#232C37!important}
:root[data-tema=oscuro] body .pc .pr-item:hover .pr-pdf{background:#A0C4DA!important;color:#232C37!important}
:root[data-tema=oscuro] body .pc .gc-badge-p{background:#A0C4DA!important;color:#232C37!important}
:root[data-tema=oscuro] body .pc .gc-badge-ci{background:#435561!important;color:#fff!important}
:root[data-tema=oscuro] body .ph-desc li::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A0C4DA' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")!important}
:root[data-tema=oscuro] body :is(.pc .fi-empty,.pc .cf-input::placeholder,.ct-campo input::placeholder,.ct-campo textarea::placeholder){color:rgba(255,255,255,.62)!important}
:root[data-tema=oscuro] body :is(.ct-campo input,.ct-campo textarea,.pc .cf-input,.pc .form-control){background:#232C37!important;border-color:rgba(255,255,255,.4)!important;color:#fff!important}
:root[data-tema=oscuro] body :is(.ct-campo input,.ct-campo textarea,.pc .cf-input,.pc .form-control):focus{border-color:#A0C4DA!important;box-shadow:0 0 0 4px rgba(160,196,218,.25)!important}
:root[data-tema=oscuro] body #message-contact{background:#2F414C;color:#fff}
:root[data-tema=oscuro] body .ct-mapa,:root[data-tema=oscuro] body .pc iframe{filter:brightness(.9)}
:root[data-tema=oscuro] body .irp .bmv-ticker--down .bmv-ticker__change,:root[data-tema=oscuro] body .irp .bmv-ticker--down .bmv-ticker__change-pct{color:#F2B8A8}
:root[data-tema=oscuro] body .irp .bmv-ticker--up .bmv-ticker__change,:root[data-tema=oscuro] body .irp .bmv-ticker--up .bmv-ticker__change-pct{color:#9FE0B8}
:root[data-tema=oscuro] body .irp .bmv-ticker__icon{filter:brightness(0) invert(1)}
:root[data-tema=oscuro] body .irp .ir-download__badge{background:#A0C4DA!important;color:#232C37!important}
:root[data-tema=oscuro] body .ph-todas{background:rgba(35,44,55,.92);color:#fff}
:root[data-tema=oscuro] body .ph-foto{background:#2F414C}

/* ── aviso y preferencias de cookies: colores oficiales en los dos temas ── */
:root .gsf-cc{--gsf-cc-bg:#fff;--gsf-cc-bg-alt:#F2F7FA;--gsf-cc-text:#2F414C;--gsf-cc-text-muted:#435561;--gsf-cc-accent:#2F414C;--gsf-cc-accent-hover:#435561;--gsf-cc-accent-text:#fff;
 --gsf-cc-border:#DDE6EC;--gsf-cc-border-strong:#435561;--gsf-cc-overlay:rgba(20,29,35,.55)}
:root[data-tema=oscuro] .gsf-cc{--gsf-cc-bg:#2F414C;--gsf-cc-bg-alt:#232C37;--gsf-cc-text:#fff;--gsf-cc-text-muted:rgba(255,255,255,.76);--gsf-cc-accent:#A0C4DA;--gsf-cc-accent-hover:#fff;--gsf-cc-accent-text:#232C37;
 --gsf-cc-border:rgba(255,255,255,.12);--gsf-cc-border-strong:rgba(255,255,255,.5);--gsf-cc-overlay:rgba(10,14,18,.7)}
:root[data-tema=oscuro] .gsf-cc .gsf-cc-toggle input:disabled + .gsf-cc-toggle-track::before{background:#435561}

/* ── botón de subir de la plantilla ── */
:root #toTop{background-color:#2F414C;color:#fff}
:root[data-tema=oscuro] body #toTop{background-color:#A0C4DA;color:#232C37}

/* iframes de terceros (chat, mapas, video): su documento es claro; si heredan el esquema oscuro el navegador les pinta
   un fondo opaco (la «píldora blanca» del chat). Se les deja el esquema claro para que conserven su transparencia. */
:root[data-tema=oscuro] iframe{color-scheme:light}
/* distintivos: sellos de certificación a color (uno con fondo blanco); en oscuro van sobre tesela clara, sin invertir */
:root[data-tema=oscuro] body .pz-teselas--dist li{background:#F2F7FA}
:root[data-tema=oscuro] body .pz-teselas--dist li:hover{background:#fff}
:root[data-tema=oscuro] body .pz-teselas--dist img{filter:none;opacity:1}

/* barra oscura de comparación (&barra=oscura) en cualquier tema: el botón activo va en blanco sobre la franja #2F414C */
.gx--barra-oscura .gx-barra .gx-tema button{color:rgba(255,255,255,.82)}
.gx--barra-oscura .gx-barra .gx-tema button[aria-pressed="true"]{background:rgba(255,255,255,.16);color:#fff}
/* clima de la ficha en oscuro: casillas sobre el fondo, «Hoy» y la unidad activa en acento, trazos en acento */
:root[data-tema=oscuro] body .ph-clima{--c-trazo:#A0C4DA;--c-hoy:#A0C4DA;--c-hoy-t:#232C37;--c-dia:#232C37}
:root[data-tema=oscuro] body .ph .ph-clima-dias li:first-child{--c-trazo:#232C37}
:root[data-tema=oscuro] body .ph-clima-flecha{box-shadow:0 2px 10px rgba(0,0,0,.35),inset 0 0 0 1px rgba(255,255,255,.16)!important}
