/* =========================================================
   MARCA POR LOCAL
   Se carga DESPUÉS de flyer-v3.css para poder ganarle
   a sus reglas con !important.

   Cada local con manual de marca propio define acá:
     · sus @font-face
     · sus overrides de morfología y color

   La paleta viaja por variables CSS desde lib/diseno_local.php.
   ========================================================= */

/* ---------------------------------------------------------
   BETWARRIOR · Integral CF (títulos) + Roboto (textos)

   Manual de marca oficial:
     · Naranja #FF3900 (Pantone 1655 C) + blanco + negro.
       La marca es de UN solo color; el contraste lo dan
       el blanco y el negro.
     · Títulos y destacados: Integral CF.
       Textos chicos y bloques: Roboto.
     · Morfología: ángulos rectos (rectángulos, L, U).
     · Sobre fondo oscuro el identificador va en versión
       pluma BLANCA; la versión negra es para fondos claros.

   Los .otf van en assets/fonts/. Mientras no estén, el
   fallback de Google Fonts mantiene el aire correcto.
   --------------------------------------------------------- */
@font-face {
    font-family: "Integral CF";
    src: url("../fonts/IntegralCF-Regular.otf") format("opentype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Integral CF";
    src: url("../fonts/IntegralCF-DemiBold.otf") format("opentype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Integral CF";
    src: url("../fonts/IntegralCF-Bold.otf") format("opentype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Integral CF";
    src: url("../fonts/IntegralCF-ExtraBold.otf") format("opentype");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Integral CF";
    src: url("../fonts/IntegralCF-Heavy.otf") format("opentype");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}


/* =========================================================
   PERFIL BETWARRIOR · PALETA

   flyer-v3.css define su propio set interno (--v3-gold,
   --v3-gold-soft, --v3-brown, --v3-cream) y lo usa en
   decenas de reglas con !important, ignorando las variables
   del perfil. Redefinirlas acá corta el dorado en todos
   esos lugares de una sola vez.
   ========================================================= */
.flyer-canvas.perfil-betwarrior,
.flyer-canvas[data-local-profile="betwarrior"] {
    --v3-gold: #FF3900;
    --v3-gold-soft: #FF5C2B;
    --v3-cream: #FFFFFF;
    --v3-black: #000000;
    --v3-brown: #0A0A0A;
    --v3-deep: #000000;
}

.flyer-canvas.perfil-betwarrior,
.flyer-canvas.plantilla-impacto.perfil-betwarrior {
    background: #000000 !important;
}


/* =========================================================
   MORFOLOGÍA · ÁNGULOS RECTOS
   ========================================================= */
.flyer-canvas.perfil-betwarrior .flyer-gallery,
.flyer-canvas.perfil-betwarrior .flyer-gallery-item,
.flyer-canvas.perfil-betwarrior .flyer-price,
.flyer-canvas.perfil-betwarrior .flyer-price-value,
.flyer-canvas.perfil-betwarrior .flyer-footer img {
    border-radius: 0 !important;
}

/* El marco ornamental dorado no corresponde a esta marca. */
.flyer-canvas.perfil-betwarrior .ornamental-frame,
.flyer-canvas.perfil-betwarrior .flyer-ornamental,
.flyer-canvas.perfil-betwarrior [class*="ornament"] {
    display: none !important;
}

/* Marco recto naranja.
   El inset es ASIMÉTRICO a propósito: un A4 mide 210×297,
   así que un mismo porcentaje da márgenes visuales
   distintos en horizontal y en vertical.
   2.7% de 297 ≈ 8 mm · 3.8% de 210 ≈ 8 mm */
.flyer-canvas.perfil-betwarrior::after {
    content: "";
    position: absolute;
    inset: 2.7% 3.8%;
    border: 0.5cqw solid var(--flyer-brand, #FF3900);
    pointer-events: none;
    z-index: 6;
}

/* Esquina en L, guiño a la morfología del manual.
   Va por dentro del marco, no encima. */


/* =========================================================
   TIPOGRAFÍA
   ========================================================= */
.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-title,
.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-eyebrow,
.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-price-value {
    font-family: var(--flyer-title-font) !important;
    text-transform: uppercase !important;
    font-style: normal !important;
}

.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-title {
    color: #FFFFFF !important;
    font-weight: 900 !important;
    line-height: 0.92 !important;
    letter-spacing: 0.01em !important;
}

.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-eyebrow {
    color: var(--flyer-brand, #FF3900) !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
}

.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-description,
.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-edition,
.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-footer span {
    color: #FFFFFF !important;
    font-family: var(--flyer-body-font) !important;
    font-weight: 400 !important;
    font-style: normal !important;
    text-transform: none !important;
}


/* =========================================================
   PRECIO · bloque naranja macizo

   El recuadro visible es .flyer-price-value, no .flyer-price.
   v3 le pone borde dorado, box-shadow con glow ámbar y un
   fondo casi negro: hay que anular las tres cosas o el
   naranja queda lavado.
   ========================================================= */
.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-price-value {
    background: #FF3900 !important;
    background-image: none !important;
    color: #FFFFFF !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
    opacity: 1 !important;
    font-weight: 900 !important;
}

.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-price {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    filter: none !important;
    opacity: 1 !important;
}

.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-price-label {
    color: #FFFFFF !important;
    font-family: var(--flyer-body-font) !important;
    font-weight: 500 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase !important;
    opacity: 0.92 !important;
}


/* =========================================================
   LISTA DE PRODUCTOS DEL COMBO
   ========================================================= */
.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-product-list > * {
    color: #FFFFFF !important;
    background: var(--flyer-brand, #FF3900) !important;
    border-color: var(--flyer-brand, #FF3900) !important;
    border-radius: 0 !important;
    font-family: var(--flyer-body-font) !important;
}


/* =========================================================
   LOGO DEL LOCAL

   PARCHE TEMPORAL: el betwarrior.png que hay hoy trae el
   fondo blanco quemado en el pixel, así que ningún
   background: transparent lo puede sacar.

   invert(1) + grayscale(1) lo pasa a negativo -> isologo
   claro sobre fondo negro. mix-blend-mode: multiply funde
   ese negro con el fondo del flyer y la caja desaparece.

   Contra: se pierde el naranja del isologo y queda en
   blanco y negro. El manual lo admite (versión pluma sobre
   fondo oscuro), pero lo correcto es reemplazar el archivo
   por un PNG con transparencia en versión pluma blanca.
   Cuando eso pase, BORRAR este bloque entero.
   ========================================================= */

/* Nombre del local cuando todavía no hay logo cargado. */

/* Mismo parche en la barra superior del editor, que está
   fuera del flyer y por eso no lo alcanzaban las reglas
   anteriores. */


/* =========================================================
   FOTOGRAFÍA · alto contraste, sin sepia
   ========================================================= */
.flyer-canvas.perfil-betwarrior.estado-foto-1 .flyer-gallery-item img,
.flyer-canvas.perfil-betwarrior[data-visual-state="foto-1"] .flyer-gallery-item img {
    filter: saturate(1.05) contrast(1.14) brightness(0.66) !important;
}

/* El degradé de legibilidad va a negro puro, no a marrón. */
.flyer-canvas.perfil-betwarrior.estado-foto-1 .flyer-gallery::before,
.flyer-canvas.perfil-betwarrior[data-visual-state="foto-1"] .flyer-gallery::before {
    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.86) 0%,
            rgba(0, 0, 0, 0.48) 30%,
            transparent 52%,
            rgba(0, 0, 0, 0.42) 74%,
            rgba(0, 0, 0, 0.88) 100%
        ) !important;
}


/* =========================================================
   PIE · rectangular y negro, sin bordes dorados
   ========================================================= */
.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-footer {
    background: rgba(0, 0, 0, 0.55) !important;
    border-top: 0.08cqw solid rgba(255, 57, 0, 0.55) !important;
    border-bottom: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}


/* =========================================================
   SISTEMA DE TEMAS
   El atributo data-local-theme lo emite crear-flyer.php desde
   perfilVisualLocal(). Dos temas:

     · oro   -> marcas realmente doradas (Capriccio, Irineo,
                Cosmopolitan y el genérico). No se toca nada.
     · plano -> marcas de color propio (Bonus azul, Havanna
                naranja, Tucson tierra, Pura Cepa índigo).
                Acá hay que sacarle el dorado a v3.

   El problema de fondo: flyer-v3.css tiene su propio set
   (--v3-gold, --v3-gold-soft, --v3-brown, --v3-cream) y lo usa
   en decenas de reglas con !important. Redefinirlo en función
   de --flyer-brand hace que TODO el flyer siga a la marca del
   local sin tener que reescribir esas reglas una por una.
   ========================================================= */
.flyer-canvas[data-local-theme="plano"] {
    --v3-gold: var(--flyer-brand);
    --v3-gold-soft: var(--flyer-brand-soft);
    --v3-cream: #FFFFFF;
    --v3-brown: var(--flyer-bg-alt);
    --v3-black: var(--flyer-bg);
    --v3-deep: var(--flyer-bg);
}

.flyer-canvas[data-local-theme="plano"] {
    background: var(--flyer-bg) !important;
}

/* --- Textos: blanco para título y descripción, marca para el
       eyebrow. El crema dorado de v3 no va en estos locales. --- */
.flyer-canvas.plantilla-impacto[data-local-theme="plano"] .flyer-title,
.flyer-canvas.plantilla-editorial[data-local-theme="plano"] .flyer-title,
.flyer-canvas.plantilla-mosaico[data-local-theme="plano"] .flyer-title {
    color: #FFFFFF !important;
}

.flyer-canvas.plantilla-impacto[data-local-theme="plano"] .flyer-description,
.flyer-canvas.plantilla-editorial[data-local-theme="plano"] .flyer-description,
.flyer-canvas.plantilla-mosaico[data-local-theme="plano"] .flyer-description {
    color: rgba(255, 255, 255, 0.94) !important;
}

.flyer-canvas.plantilla-impacto[data-local-theme="plano"] .flyer-eyebrow,
.flyer-canvas.plantilla-editorial[data-local-theme="plano"] .flyer-eyebrow,
.flyer-canvas.plantilla-mosaico[data-local-theme="plano"] .flyer-eyebrow {
    color: var(--flyer-brand) !important;
}

/* --- Precio: bloque sólido del color de la marca --- */
.flyer-canvas.plantilla-impacto[data-local-theme="plano"] .flyer-price-value {
    background: var(--flyer-price-bg) !important;
    background-image: none !important;
    color: var(--flyer-price-text) !important;
    border: 0.18cqw solid var(--flyer-brand) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
    opacity: 1 !important;
}

.flyer-canvas.plantilla-impacto[data-local-theme="plano"] .flyer-price-label {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* --- Barras del combo --- */
.flyer-canvas[data-local-theme="plano"] .flyer-product-list > * {
    color: #FFFFFF !important;
    background: var(--flyer-brand) !important;
    border-color: var(--flyer-brand) !important;
}

/* --- Pie --- */
.flyer-canvas.plantilla-impacto[data-local-theme="plano"] .flyer-footer {
    background: rgba(0, 0, 0, 0.42) !important;
    border-top: 0.08cqw solid var(--flyer-brand) !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

/* --- Degradé de legibilidad sobre la foto: a negro, no a marrón --- */
.flyer-canvas[data-local-theme="plano"].estado-foto-1 .flyer-gallery::before,
.flyer-canvas[data-local-theme="plano"][data-visual-state="foto-1"] .flyer-gallery::before {
    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.86) 0%,
            rgba(0, 0, 0, 0.46) 30%,
            transparent 52%,
            rgba(0, 0, 0, 0.42) 74%,
            rgba(0, 0, 0, 0.88) 100%
        ) !important;
}

.flyer-canvas[data-local-theme="plano"].estado-foto-1 .flyer-gallery-item img,
.flyer-canvas[data-local-theme="plano"][data-visual-state="foto-1"] .flyer-gallery-item img {
    filter: saturate(1.04) contrast(1.1) brightness(0.68) !important;
}


/* =========================================================
   LOGO DEL LOCAL · para TODOS los perfiles

   Antes: max-height 11.8cqw y el bloque arrancaba muy abajo,
   así que los isologos anchos (Irineo, Havanna, Tucson)
   quedaban chicos y pegados al texto.
   ========================================================= */

/* Los isologos cuadrados (Bonus, Pura Cepa) no deben crecer
   tanto como los apaisados: a igual altura ocupan mucho más
   peso visual. */

/* Irineo trae una caja negra opaca en el PNG: le damos un poco
   de aire para que no choque con el marco. */

/* Sobre fondos claros no hay caja blanca en ningún caso. */


/* =========================================================
   MARCO ORNAMENTAL · tema plano

   flyer-v3.css (línea 1514) escribe el dorado #C99A46 a mano
   en .ornament-main y .ornament-fill, sin pasar por ninguna
   variable. Por eso Pura Cepa quedaba índigo por dentro y con
   marco dorado por fuera. Acá el marco pasa a seguir la marca.
   ========================================================= */
.flyer-canvas[data-local-theme="plano"] .flyer-ornamental-frame .ornament-main,
.flyer-canvas.plantilla-impacto[data-local-theme="plano"] .flyer-ornamental-frame .ornament-main {
    stroke: var(--flyer-brand) !important;
}

.flyer-canvas[data-local-theme="plano"] .flyer-ornamental-frame .ornament-fill,
.flyer-canvas.plantilla-impacto[data-local-theme="plano"] .flyer-ornamental-frame .ornament-fill {
    fill: var(--flyer-brand) !important;
}

.flyer-canvas[data-local-theme="plano"] .flyer-ornamental-frame,
.flyer-canvas.plantilla-impacto[data-local-theme="plano"] .flyer-ornamental-frame {
    color: var(--flyer-brand) !important;
}

/* Cosmopolitan e Irineo también tenían el dorado genérico en el
   marco en lugar del propio de su isologo. */
.flyer-canvas.plantilla-impacto.perfil-cosmopolitan .flyer-ornamental-frame .ornament-main,
.flyer-canvas.plantilla-impacto.perfil-irineo .flyer-ornamental-frame .ornament-main {
    stroke: var(--flyer-brand) !important;
}

.flyer-canvas.plantilla-impacto.perfil-cosmopolitan .flyer-ornamental-frame .ornament-fill,
.flyer-canvas.plantilla-impacto.perfil-irineo .flyer-ornamental-frame .ornament-fill {
    fill: var(--flyer-brand) !important;
}

/* BetWarrior: el marco ornamental no corresponde a la marca,
   ya se reemplaza por el rectángulo recto naranja. */
.flyer-canvas.perfil-betwarrior .flyer-ornamental-frame {
    display: none !important;
}


/* =========================================================
   PRECIO · tema plano, bloque sólido

   El recuadro casi negro con borde fino se leía apagado.
   Va macizo en el color de la marca.
   ========================================================= */
.flyer-canvas.plantilla-impacto[data-local-theme="plano"] .flyer-price-value {
    background: var(--flyer-price-bg) !important;
    color: var(--flyer-price-text) !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* =========================================================
   LOGO · los cuadrados necesitaban más presencia
   ========================================================= */


/* =========================================================
   POSICIÓN DEL LOGO · para TODOS los perfiles

   Causa de que los isologos "quedaran muy abajo": el bloque
   .flyer-local-logo tiene align-items: center y una altura
   mínima grande, así que el logo se centraba en una banda alta
   y terminaba apoyado sobre el hilo superior del marco.

   Solución: subir el header, bajar la altura mínima del bloque
   y anclar el logo arriba en vez de al centro. La abertura del
   marco se amplió en lib/ornamental_frame.php (258-742 sobre
   1000) para que los logos apaisados entren sin chocarlo.
   ========================================================= */

/* Apaisados: aprovechan el ancho de la abertura. */

/* Irineo y Capriccio son más compactos. */

/* El bloque de textos arranca un poco más abajo para dejar
   respirar al logo, ahora que ocupa su lugar real. */


/* AJUSTES FINALES · 2026-08-18
   - logos más grandes en todos los flyers
   - en diseños con IA el bloque de textos sube para no tapar la imagen
   - Bonus y Pura Cepa reciben un tratamiento de marca más cuidado
   - VIP queda en negro con tipografía dorada
   ========================================================= */

/* Logo general: más presencia sin romper el marco. */

/* Logos anchos: aprovechan más la abertura superior. */

/* Irineo y Capriccio siguen más compactos, pero ya no tan chicos. */

/* Bonus y Pura Cepa: el isologo ahora tiene el tamaño que necesita. */

/* Fondo IA: el bloque textual sube para no invadir la escena generada. */

.flyer-canvas.plantilla-impacto.con-fondo-ia .flyer-offer::before {
    height: 27cqw !important;
    background: linear-gradient(
        180deg,
        rgba(5, 3, 2, 0.94) 0%,
        rgba(5, 3, 2, 0.72) 56%,
        rgba(5, 3, 2, 0) 100%
    ) !important;
}

.flyer-canvas.plantilla-impacto.con-fondo-ia .flyer-ai-background::after {
    background:
        linear-gradient(180deg, rgba(5, 3, 2, 0.54) 0%, rgba(5, 3, 2, 0.18) 30%, transparent 48%),
        linear-gradient(0deg, rgba(5, 3, 2, 0.12) 0%, transparent 22%),
        radial-gradient(ellipse at center, transparent 62%, rgba(0, 0, 0, 0.10) 100%) !important;
}

/* Bonus: navy + crema, más limpio y con mejor jerarquía. */
.flyer-canvas.plantilla-impacto.perfil-bonus {
    background: radial-gradient(circle at top, rgba(19, 31, 79, 0.38), transparent 45%), var(--flyer-bg) !important;
}

.flyer-canvas.plantilla-impacto.perfil-bonus .flyer-eyebrow {
    color: #F6DA82 !important;
    font-size: 4.7cqw !important;
    letter-spacing: 0.08em !important;
}

.flyer-canvas.plantilla-impacto.perfil-bonus .flyer-title {
    color: #FFFFFF !important;
    font-size: 5.15cqw !important;
    line-height: 0.98 !important;
}

.flyer-canvas.plantilla-impacto.perfil-bonus .flyer-description {
    color: #F6DA82 !important;
    font-size: 4.7cqw !important;
    line-height: 0.96 !important;
}

/* Pura Cepa: identidad índigo, elegante y más legible. */
.flyer-canvas.plantilla-impacto.perfil-pura-cepa {
    background: radial-gradient(circle at top, rgba(108, 102, 232, 0.20), transparent 42%), var(--flyer-bg) !important;
}

.flyer-canvas.plantilla-impacto.perfil-pura-cepa .flyer-eyebrow {
    color: #A5A0F5 !important;
    font-size: 4.55cqw !important;
    letter-spacing: 0.08em !important;
}

.flyer-canvas.plantilla-impacto.perfil-pura-cepa .flyer-title {
    color: #FFFFFF !important;
    font-size: 5.1cqw !important;
    line-height: 0.98 !important;
}

.flyer-canvas.plantilla-impacto.perfil-pura-cepa .flyer-description {
    color: #DAD7FF !important;
    font-size: 4.55cqw !important;
    line-height: 0.98 !important;
}

.flyer-canvas.plantilla-impacto.perfil-pura-cepa .flyer-price-value {
    background: #6C66E8 !important;
    color: #FFFFFF !important;
    border: 0 !important;
}

/* VIP: negro pleno y todas las letras en dorado. */
.flyer-canvas.plantilla-impacto.perfil-vip {
    background: #000000 !important;
}

.flyer-canvas.plantilla-impacto.perfil-vip .flyer-eyebrow,
.flyer-canvas.plantilla-impacto.perfil-vip .flyer-title,
.flyer-canvas.plantilla-impacto.perfil-vip .flyer-description,
.flyer-canvas.plantilla-impacto.perfil-vip .flyer-edition,
.flyer-canvas.plantilla-impacto.perfil-vip .flyer-footer span {
    color: #D4AF37 !important;
}

.flyer-canvas.plantilla-impacto.perfil-vip .flyer-description {
    color: #F2DC9B !important;
}

.flyer-canvas.plantilla-impacto.perfil-vip .flyer-ornamental-frame .ornament-main {
    stroke: #D4AF37 !important;
}

.flyer-canvas.plantilla-impacto.perfil-vip .flyer-ornamental-frame .ornament-fill {
    fill: #D4AF37 !important;
}

.flyer-canvas.plantilla-impacto.perfil-vip .flyer-price-value {
    background: #000000 !important;
    color: #D4AF37 !important;
    border: 0.22cqw solid #D4AF37 !important;
}


/* AJUSTES FINALES 2 · 2026-08-18
   Pedido de revisión visual sobre previews:
   - Tucson más grande
   - Sport Bar / BetWarrior más grande
   - VIP sin recorte de la P
   - Capriccio más grande
   - Havanna más grande
   - impresión A4 sin deformación
   ========================================================= */

/* Seguridad de impresión: no deformar nunca los isologos. */

@media print {
    .flyer-canvas .flyer-local-logo img,
    .flyer-canvas .flyer-gallery-item img,
    .flyer-canvas .flyer-ai-background {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
}

/* Tucson y Havanna: más ancho y un poco más de alto visible. */

/* Capriccio: el wordmark puede crecer bastante más sin chocar. */

/* BetWarrior / Sport Bar: hacer protagonista el logo superior. */

/* VIP: bajar apenas el logo/nombre para que no se coma la P. */


/* AJUSTE FINO 3 · 2026-08-18
   Corrección ultra puntual según previews reales del usuario.
   No toca Bonus, Cosmopolitan ni Pura Cepa.
   ========================================================= */

/* -----------------------------
   TUCSON · más arriba y bastante más grande
   ----------------------------- */

/* -----------------------------
   HAVANNA · más arriba y más grande
   ----------------------------- */

/* -----------------------------
   CAPRICCIO · más arriba y claramente más grande
   ----------------------------- */

/* -----------------------------
   BETWARRIOR / SPORT BAR · muchísimo más visible y un toque más arriba
   ----------------------------- */

/* -----------------------------
   IRINEO · el problema real estaba en la editorial
   Subo el bloque y agrando el isologo.
   ----------------------------- */

/* Respaldo si Irineo se usa en impacto. */

/* -----------------------------
   VIP · letras doradas, más arriba y sin recorte de la P
   ----------------------------- */


/* =========================================================
   SISTEMA DE LOGOS · 2026-08-18 (reemplaza todo lo anterior)

   Antes de esto había cuatro tandas de "ajustes finales"
   apiladas, cada una con más !important que la anterior, y
   ninguna resolvía el problema de fondo: el CSS dimensionaba
   la caja de la <img>, no la tinta visible. Cada PNG traía una
   caja de fondo distinta (negra, blanca o índigo) y cantidades
   de padding transparente muy distintas, así que dos logos con
   el mismo max-height terminaban con tamaños ópticos y alturas
   totalmente distintos. Tucson, por ejemplo, tenía dos manchas
   casi invisibles en las esquinas superiores: el recorte las
   tomaba como borde y empujaba la tinta real hacia abajo.

   Los PNG ya están normalizados (caja quitada, recortados a la
   tinta, reescalados para A4), así que acá se puede dimensionar
   directo con width/height y lo que se declara es lo que se ve.

   Criterio de tamaño: ÁREA ÓPTICA CONSTANTE de ~600 cqw², con
   tope de alto en 14cqw. Un isologo apaisado y uno cuadrado con
   la misma altura NO pesan igual en la página; con la misma área
   sí. Las medidas salen de:
       alto  = min(raiz(600 / proporcion), 14)
       ancho = alto * proporcion
   La referencia es Bonus y Cosmopolitan, que ya estaban bien.
   ========================================================= */

/* --- Caja del header: pegada arriba, sin recuadro ni fondo --- */
.flyer-canvas.plantilla-impacto .flyer-header,
.flyer-canvas.plantilla-editorial .flyer-header {
    position: absolute !important;
    top: 0.6% !important;
    left: 50% !important;
    width: 92% !important;
    max-width: 92% !important;
    min-height: 0 !important;
    transform: translateX(-50%) !important;
    justify-content: center !important;
    z-index: 34 !important;
}

.flyer-canvas .flyer-local-logo {
    display: flex !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    align-items: flex-start !important;
    justify-content: center !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

.flyer-canvas .flyer-local-logo::after,
.flyer-canvas .flyer-local-logo::before {
    display: none !important;
}

/* --- Base común de la imagen del isologo --- */
.flyer-canvas .flyer-local-logo img {
    display: block !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    object-fit: contain !important;
    object-position: center center !important;
    background: transparent !important;
    filter: drop-shadow(0 0.35cqw 0.7cqw rgba(0, 0, 0, 0.55)) !important;
}

/* --- Medidas por marca (área óptica ~600 cqw², tope 14cqw) ---

   La especificidad es alta a propósito: flyer-v3.css y
   flyer-premium.css fijan max-height sobre
   .flyer-canvas.plantilla-impacto .flyer-local-logo img (0,3,1) y
   un max-height le gana a un height explícito. Estas reglas son
   (0,4,1) y además anulan los dos máximos. */
.flyer-canvas.plantilla-impacto.perfil-capriccio .flyer-local-logo img,
.flyer-canvas.plantilla-impacto[data-local-profile="capriccio"] .flyer-local-logo img,
.flyer-canvas.plantilla-editorial.perfil-capriccio .flyer-local-logo img,
.flyer-canvas.plantilla-editorial[data-local-profile="capriccio"] .flyer-local-logo img {
    width: 43.0cqw !important;
    height: 14.0cqw !important;
    max-width: none !important;
    max-height: none !important;
}

.flyer-canvas.plantilla-impacto.perfil-bonus .flyer-local-logo img,
.flyer-canvas.plantilla-impacto[data-local-profile="bonus"] .flyer-local-logo img,
.flyer-canvas.plantilla-editorial.perfil-bonus .flyer-local-logo img,
.flyer-canvas.plantilla-editorial[data-local-profile="bonus"] .flyer-local-logo img {
    width: 32.5cqw !important;
    height: 14.0cqw !important;
    max-width: none !important;
    max-height: none !important;
}

.flyer-canvas.plantilla-impacto.perfil-irineo .flyer-local-logo img,
.flyer-canvas.plantilla-impacto[data-local-profile="irineo"] .flyer-local-logo img,
.flyer-canvas.plantilla-editorial.perfil-irineo .flyer-local-logo img,
.flyer-canvas.plantilla-editorial[data-local-profile="irineo"] .flyer-local-logo img {
    width: 20.9cqw !important;
    height: 14.0cqw !important;
    max-width: none !important;
    max-height: none !important;
}

.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-local-logo img,
.flyer-canvas.plantilla-impacto[data-local-profile="betwarrior"] .flyer-local-logo img,
.flyer-canvas.plantilla-editorial.perfil-betwarrior .flyer-local-logo img,
.flyer-canvas.plantilla-editorial[data-local-profile="betwarrior"] .flyer-local-logo img {
    width: 24cqw !important;
    height: 16cqw !important;
    max-width: none !important;
    max-height: none !important;
}

.flyer-canvas.plantilla-impacto.perfil-havanna .flyer-local-logo img,
.flyer-canvas.plantilla-impacto[data-local-profile="havanna"] .flyer-local-logo img,
.flyer-canvas.plantilla-editorial.perfil-havanna .flyer-local-logo img,
.flyer-canvas.plantilla-editorial[data-local-profile="havanna"] .flyer-local-logo img {
    width: 63cqw !important;
    height: 11.3cqw !important;
    max-width: none !important;
    max-height: none !important;
}

.flyer-canvas.plantilla-impacto.perfil-tucson .flyer-local-logo img,
.flyer-canvas.plantilla-impacto[data-local-profile="tucson"] .flyer-local-logo img,
.flyer-canvas.plantilla-editorial.perfil-tucson .flyer-local-logo img,
.flyer-canvas.plantilla-editorial[data-local-profile="tucson"] .flyer-local-logo img {
    width: 32.1cqw !important;
    height: 15cqw !important;
    max-width: none !important;
    max-height: none !important;
}

.flyer-canvas.plantilla-impacto.perfil-pura-cepa .flyer-local-logo img,
.flyer-canvas.plantilla-impacto[data-local-profile="pura-cepa"] .flyer-local-logo img,
.flyer-canvas.plantilla-editorial.perfil-pura-cepa .flyer-local-logo img,
.flyer-canvas.plantilla-editorial[data-local-profile="pura-cepa"] .flyer-local-logo img {
    width: 50.2cqw !important;
    height: 11.3cqw !important;
    max-width: none !important;
    max-height: none !important;
}

.flyer-canvas.plantilla-impacto.perfil-cosmopolitan .flyer-local-logo img,
.flyer-canvas.plantilla-impacto[data-local-profile="cosmopolitan"] .flyer-local-logo img,
.flyer-canvas.plantilla-editorial.perfil-cosmopolitan .flyer-local-logo img,
.flyer-canvas.plantilla-editorial[data-local-profile="cosmopolitan"] .flyer-local-logo img {
    width: 53.7cqw !important;
    height: 11.2cqw !important;
    max-width: none !important;
    max-height: none !important;
}

/* Cualquier local nuevo, hasta que se le calcule la medida propia. */
.flyer-canvas.plantilla-impacto.perfil-generico .flyer-local-logo img,
.flyer-canvas.plantilla-impacto[data-local-profile="generico"] .flyer-local-logo img,
.flyer-canvas.plantilla-editorial.perfil-generico .flyer-local-logo img,
.flyer-canvas.plantilla-editorial[data-local-profile="generico"] .flyer-local-logo img {
    width: auto !important;
    height: 13cqw !important;
    max-width: 58cqw !important;
    max-height: none !important;
}

/* --- Locales sin archivo de logo: el nombre en texto --- */
.flyer-canvas .flyer-local-logo span {
    display: inline-block !important;
    width: auto !important;
    max-width: 88% !important;
    padding-top: 0.4cqw !important;
    overflow: visible !important;
    font-size: 7cqw !important;
    line-height: 1.06 !important;
    text-align: center !important;
}

.flyer-canvas[data-local-profile="vip"] .flyer-local-logo span {
    color: #D4AF37 !important;
    letter-spacing: 0.01em !important;
    text-shadow: 0 0.3cqw 0.6cqw rgba(0, 0, 0, 0.65) !important;
}

/* BetWarrior ya no necesita el invert: el PNG viene en versión
   pluma blanca con el naranja de marca intacto. */
.flyer-canvas.perfil-betwarrior .flyer-local-logo img,
.pagina-editor.perfil-betwarrior .logo-editor img {
    filter: drop-shadow(0 0.35cqw 0.7cqw rgba(0, 0, 0, 0.55)) !important;
    mix-blend-mode: normal !important;
    background: transparent !important;
}

/* Impresión: sin deformar y con los colores tal cual. */
@media print {
    .flyer-canvas .flyer-local-logo img {
        object-fit: contain !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
}


/* =========================================================
   BLOQUE DE TEXTO Y VELO · 2026-08-18

   Dos cosas se arreglan acá.

   1. El texto de la promo bajaba hasta el 14% y el velo oscuro
      que lo hace legible medía 24cqw de alto: entre los dos se
      comían el tercio superior de la imagen generada por IA.
      Ahora el bloque arranca apenas debajo del logo y el velo
      es más corto y se disuelve antes.

   2. El velo y el fondo del canvas estaban escritos a mano en
      negro cálido (#17100a, rgba(8,5,3)) en flyer-v3.css, sin
      pasar por ninguna variable. Sobre una marca azul eso daba
      esa banda negra sucia. El color del velo pasa a ser la
      variable --flyer-velo, que cada perfil define.
   ========================================================= */

.flyer-canvas {
    /* Negro cálido: el que va bien con las marcas doradas. */
    --flyer-velo: 8, 5, 3;
}

/* El logo termina en 10,5% (0,6% + 14cqw sobre los 141,4cqw de
   alto de una A4). El texto arranca 0,8% más abajo: suficiente
   aire para que no se toquen, y casi un punto y medio más arriba
   de donde estaba antes (12,6%). */
.flyer-canvas.plantilla-impacto .flyer-offer,
.flyer-canvas.plantilla-editorial .flyer-offer {
    top: 11.3% !important;
    left: 7% !important;
    width: 86% !important;
    z-index: 33 !important;
}

.flyer-canvas.plantilla-impacto .flyer-offer::before,
.flyer-canvas.plantilla-editorial .flyer-offer::before {
    inset: -1.6cqw -9% auto -9% !important;
    height: 21cqw !important;
    background: radial-gradient(
        118% 100% at 50% 0%,
        rgba(var(--flyer-velo), 0.90) 0%,
        rgba(var(--flyer-velo), 0.52) 46%,
        rgba(var(--flyer-velo), 0) 80%
    ) !important;
    filter: blur(0.55cqw) !important;
}

/* Con fondo de IA el velo se acorta todavía más: la escena
   generada tiene que verse, no quedar tapada. */
.flyer-canvas.plantilla-impacto.con-fondo-ia .flyer-offer::before {
    height: 18.5cqw !important;
    background: radial-gradient(
        118% 100% at 50% 0%,
        rgba(var(--flyer-velo), 0.88) 0%,
        rgba(var(--flyer-velo), 0.45) 44%,
        rgba(var(--flyer-velo), 0) 78%
    ) !important;
}

.flyer-canvas.plantilla-impacto.con-fondo-ia .flyer-ai-background::after {
    background:
        linear-gradient(180deg, rgba(var(--flyer-velo), 0.46) 0%, rgba(var(--flyer-velo), 0.14) 26%, transparent 42%),
        linear-gradient(0deg, rgba(var(--flyer-velo), 0.12) 0%, transparent 20%),
        radial-gradient(ellipse at center, transparent 64%, rgba(0, 0, 0, 0.10) 100%) !important;
}


/* =========================================================
   MARCAS AZULES · fondo azul noche, no negro

   El fondo del canvas en flyer-v3.css es una pila de gradientes
   marrones y dorados terminando en #060403. Debajo de un
   isologo azul o de textos crema sobre navy, eso se ve sucio.
   Bonus y Pura Cepa reciben la misma estructura de gradiente
   pero en su propia familia de azules.
   ========================================================= */

.flyer-canvas.perfil-bonus,
.flyer-canvas.plantilla-impacto.perfil-bonus,
.flyer-canvas.perfil-bonus.con-fondo-ia {
    --flyer-velo: 4, 8, 26;

    background:
        radial-gradient(120% 85% at 50% 44%, rgba(0, 0, 0, 0) 54%, rgba(2, 4, 14, 0.55) 100%),
        radial-gradient(9% 6% at 22% 30%, rgba(232, 199, 122, 0.10), rgba(232, 199, 122, 0) 70%),
        radial-gradient(7% 5% at 80% 24%, rgba(232, 199, 122, 0.08), rgba(232, 199, 122, 0) 70%),
        radial-gradient(120% 48% at 50% 106%, rgba(46, 66, 140, 0.34), rgba(46, 66, 140, 0) 60%),
        radial-gradient(140% 60% at 50% 0%, rgba(120, 152, 232, 0.12), rgba(0, 0, 0, 0) 42%),
        linear-gradient(180deg, #0B1436 0%, #131F4E 38%, #080E28 64%, #04081A 100%) !important;
}

.flyer-canvas.perfil-pura-cepa,
.flyer-canvas.plantilla-impacto.perfil-pura-cepa,
.flyer-canvas.perfil-pura-cepa.con-fondo-ia {
    --flyer-velo: 7, 6, 26;

    background:
        radial-gradient(120% 85% at 50% 44%, rgba(0, 0, 0, 0) 54%, rgba(4, 3, 16, 0.55) 100%),
        radial-gradient(9% 6% at 22% 30%, rgba(165, 160, 245, 0.10), rgba(165, 160, 245, 0) 70%),
        radial-gradient(7% 5% at 80% 24%, rgba(165, 160, 245, 0.08), rgba(165, 160, 245, 0) 70%),
        radial-gradient(120% 48% at 50% 106%, rgba(72, 66, 190, 0.30), rgba(72, 66, 190, 0) 60%),
        radial-gradient(140% 60% at 50% 0%, rgba(140, 134, 255, 0.11), rgba(0, 0, 0, 0) 42%),
        linear-gradient(180deg, #100E33 0%, #1A1750 38%, #0B0926 64%, #07061A 100%) !important;
}

/* La galería y el pie también estaban en negro cálido. */
.flyer-canvas.perfil-bonus .flyer-gallery::before,
.flyer-canvas.perfil-pura-cepa .flyer-gallery::before {
    background: linear-gradient(
        180deg,
        rgba(var(--flyer-velo), 0.16),
        transparent 30%,
        transparent 70%,
        rgba(var(--flyer-velo), 0.18)
    ) !important;
}

/* BetWarrior es negro puro por manual de marca: se queda así. */
.flyer-canvas.perfil-betwarrior {
    --flyer-velo: 0, 0, 0;
}


/* BetWarrior no usa el marco ornamental (no corresponde a la
   marca): su remate es esta escuadra recta naranja. La regla
   vivía junto a las de header y se fue en la limpieza, así que
   se restituye acá. */
.flyer-canvas.perfil-betwarrior .flyer-header::before {
    content: "";
    position: absolute;
    left: 1.2cqw;
    top: 1.2cqw;
    width: 6cqw;
    height: 6cqw;
    border-left: 0.85cqw solid var(--flyer-brand, #FF3900);
    border-top: 0.85cqw solid var(--flyer-brand, #FF3900);
    z-index: 7;
    pointer-events: none;
}


/* =========================================================
   AJUSTE DE ESCALA · 2026-08-18 (segunda revisión)

   Havanna, Tucson y BetWarrior se veían chicos incluso con los
   PNG limpios. Los tres crecen; como Bonus y Pura Cepa ya están
   aprobados, no se toca ni la posición global del header ni la
   del bloque de texto: sólo estos tres bajan su propio inicio de
   texto lo justo para no chocar con el logo más alto.
   ========================================================= */

.flyer-canvas.plantilla-impacto.perfil-tucson .flyer-header,
.flyer-canvas.plantilla-impacto[data-local-profile="tucson"] .flyer-header,
.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-header,
.flyer-canvas.plantilla-impacto[data-local-profile="betwarrior"] .flyer-header {
    top: 0.4% !important;
}

.flyer-canvas.plantilla-impacto.perfil-tucson .flyer-offer,
.flyer-canvas.plantilla-impacto[data-local-profile="tucson"] .flyer-offer {
    top: 11.8% !important;
}

.flyer-canvas.plantilla-impacto.perfil-betwarrior .flyer-offer,
.flyer-canvas.plantilla-impacto[data-local-profile="betwarrior"] .flyer-offer {
    top: 12.4% !important;
}

/* La abertura de Havanna necesita 70cqw; el tope estaba en 66. */


/* =========================================================
   BETWARRIOR · OPCIÓN B: banda naranja a sangre
   (desactivada; se activa agregando la clase banda-marca
    al <article class="flyer-canvas ...">)

   Por qué existe: el lockup de BetWarrior es casi cuadrado
   (proporción 1,5) mientras Havanna y Cosmopolitan son tiras de
   proporción 5 y 6. A igual altura, el cuadrado siempre va a
   "pesar" menos en la página. En vez de seguir agrandando el
   isologo hasta que choque con el texto, la banda le da el ancho
   que el archivo no tiene, y de paso responde al manual: naranja
   #FF3900 + blanco + negro, morfología de ángulos rectos.

   Sobre la banda el isologo va en blanco pleno
   (betwarrior-blanco-v2.png): si se dejara el SPORTBAR naranja
   desaparecería contra el fondo.
   ========================================================= */
.flyer-canvas.perfil-betwarrior.banda-marca .flyer-header {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 2.2cqw 0 2cqw !important;
    background: var(--flyer-brand, #FF3900) !important;
    transform: none !important;
}

.flyer-canvas.perfil-betwarrior.banda-marca .flyer-header::before {
    display: none !important;
}

.flyer-canvas.perfil-betwarrior.banda-marca .flyer-local-logo img {
    width: 26cqw !important;
    height: 17cqw !important;
    filter: none !important;
}

.flyer-canvas.perfil-betwarrior.banda-marca .flyer-offer {
    top: 17.5% !important;
}

/* Velo corto igual: la banda ya da estructura, pero sin algo de
   velo el texto se vuelve ilegible cuando la IA genera una escena
   clara. */
.flyer-canvas.perfil-betwarrior.banda-marca .flyer-offer::before {
    inset: -3cqw -9% auto -9% !important;
    height: 17cqw !important;
    background: radial-gradient(
        118% 100% at 50% 0%,
        rgba(var(--flyer-velo), 0.82) 0%,
        rgba(var(--flyer-velo), 0.40) 44%,
        rgba(var(--flyer-velo), 0) 78%
    ) !important;
}


/* =========================================================
   AJUSTE GLOBAL · MOSAICO / COLECCIÓN GASTRONÓMICA
   - el logo no debe caer sobre títulos
   - se reserva más aire arriba para marcas altas
   ========================================================= */
.flyer-canvas.plantilla-mosaico .flyer-header {
    position: absolute !important;
    top: 0.8% !important;
    left: 50% !important;
    width: 90% !important;
    max-width: 90% !important;
    min-height: 10.8% !important;
    transform: translateX(-50%) !important;
    justify-content: center !important;
    z-index: 34 !important;
}

.flyer-canvas.plantilla-mosaico .flyer-local-logo {
    align-items: flex-start !important;
    justify-content: center !important;
}

.flyer-canvas.plantilla-mosaico .flyer-local-logo img {
    display: block !important;
    width: auto !important;
    height: 11.6cqw !important;
    max-width: 40cqw !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center top !important;
    margin: 0 auto !important;
}

.flyer-canvas.plantilla-mosaico .flyer-offer {
    top: 14.9% !important;
    left: 7% !important;
    width: 86% !important;
}

.flyer-canvas.plantilla-mosaico .flyer-title {
    line-height: 0.94 !important;
}

.flyer-canvas.plantilla-mosaico .flyer-description {
    max-width: 84% !important;
    margin-inline: auto !important;
}

.flyer-canvas.plantilla-mosaico .flyer-gallery {
    top: 34.2% !important;
    height: 57.8% !important;
}

.flyer-canvas.plantilla-mosaico .flyer-footer {
    z-index: 24 !important;
}

/* Tamaño óptico más estable por marca también en mosaico */
.flyer-canvas.plantilla-mosaico.perfil-capriccio .flyer-local-logo img,
.flyer-canvas.plantilla-mosaico[data-local-profile="capriccio"] .flyer-local-logo img {
    width: 35cqw !important;
    height: 11.8cqw !important;
    max-width: none !important;
}

.flyer-canvas.plantilla-mosaico.perfil-bonus .flyer-local-logo img,
.flyer-canvas.plantilla-mosaico[data-local-profile="bonus"] .flyer-local-logo img {
    width: 27cqw !important;
    height: 11.8cqw !important;
    max-width: none !important;
}

.flyer-canvas.plantilla-mosaico.perfil-irineo .flyer-local-logo img,
.flyer-canvas.plantilla-mosaico[data-local-profile="irineo"] .flyer-local-logo img {
    width: 31cqw !important;
    height: 11.8cqw !important;
    max-width: none !important;
}

.flyer-canvas.plantilla-mosaico.perfil-betwarrior .flyer-local-logo img,
.flyer-canvas.plantilla-mosaico[data-local-profile="betwarrior"] .flyer-local-logo img {
    width: 26cqw !important;
    height: 11.8cqw !important;
    max-width: none !important;
}

.flyer-canvas.plantilla-mosaico.perfil-havanna .flyer-local-logo img,
.flyer-canvas.plantilla-mosaico[data-local-profile="havanna"] .flyer-local-logo img {
    width: 33cqw !important;
    height: 11.8cqw !important;
    max-width: none !important;
}

.flyer-canvas.plantilla-mosaico.perfil-tucson .flyer-local-logo img,
.flyer-canvas.plantilla-mosaico[data-local-profile="tucson"] .flyer-local-logo img {
    width: 35cqw !important;
    height: 11.8cqw !important;
    max-width: none !important;
}

.flyer-canvas.plantilla-mosaico.perfil-pura-cepa .flyer-local-logo img,
.flyer-canvas.plantilla-mosaico[data-local-profile="pura-cepa"] .flyer-local-logo img {
    width: 26cqw !important;
    height: 11.8cqw !important;
    max-width: none !important;
}

.flyer-canvas.plantilla-mosaico.perfil-cosmopolitan .flyer-local-logo img,
.flyer-canvas.plantilla-mosaico[data-local-profile="cosmopolitan"] .flyer-local-logo img {
    width: 30cqw !important;
    height: 11.8cqw !important;
    max-width: none !important;
}

.flyer-canvas.plantilla-mosaico.perfil-generico .flyer-local-logo img,
.flyer-canvas.plantilla-mosaico[data-local-profile="generico"] .flyer-local-logo img {
    width: auto !important;
    height: 11.8cqw !important;
    max-width: 34cqw !important;
    max-height: none !important;
}
