/* branding.css.php — generado; no editar a mano */
:root {
  --b-primary: #6a2818;
  --b-secondary: #fbf7da;
  --b-accent: #ffdb4f;
  --rh-brand: var(--b-primary);
  --rh-accent: var(--b-accent);
  --rh-bg-soft: var(--b-secondary);
}

/* Frontend público (navbar / madera) */
.bg-madera,
.navbar-dark.bg-madera {
  background: var(--b-primary) !important;
}
.site-header .navbar-dark.bg-madera {
  background: var(--b-primary) !important;
}
.offcanvas-start {
  background: var(--b-primary) !important;
  color: #fff;
}
.navbar .nav-link:hover,
.navbar .nav-link.active {
  color: var(--b-accent) !important;
}
.offcanvas .nav-link:hover,
.offcanvas .nav-link.active {
  background: var(--b-accent) !important;
  color: #000 !important;
}
.offcanvas .vendedor-menu-mobile:has(a.nav-link-registro) {
  background: var(--b-accent) !important;
}

/* Caja detrás del logo (.brand-box): mismo color efectivo que el navbar */
.site-header .brand-box {
  background: var(--b-primary) !important;
}
body.page-brand-index .site-header .brand-box {
  background: var(--idx-header) !important;
}
body.page-brand-view-draw .site-header .brand-box {
  background: var(--vd-header) !important;
}

/* Panel administrativo + cuenta (sidebar / fondo) */
body.app-brand-area {
  background-color: var(--b-secondary) !important;
}
.sidebar,
.sidebar ul li {
  border-color: color-mix(in srgb, var(--b-primary) 85%, #000) !important;
}
.sidebar,
.sidebar.active {
  background-color: var(--b-primary) !important;
}
.sidebar ul li a:focus,
.sidebar ul li a:hover {
  background-color: var(--b-accent) !important;
  color: #000 !important;
}
.sidebar .nav-link.active {
  background-color: var(--b-accent) !important;
  color: var(--b-primary) !important;
}
.admin-layout .btn-primary,
.app-brand-area .btn-primary,
body.app-brand-area .btn-comprar-header {
  background-color: var(--b-accent) !important;
  border-color: transparent !important;
  color: #000 !important;
}
.admin-layout .btn-primary:hover,
.app-brand-area .btn-primary:hover {
  filter: brightness(0.95);
}
.admin-layout h1,
.admin-layout h2,
.admin-layout h3,
.content-wrapper h1,
.cuenta-content-wrapper h1 {
  color: var(--b-primary) !important;
}

/* Cuenta portal: encabezados y sidebar */
.cuenta-layout .sidebar,
.cuenta-sidebar {
  background-color: var(--b-primary) !important;
}
.cuenta-layout .sidebar a:hover,
.cuenta-layout .sidebar a:focus,
.cuenta-layout .sidebar .nav-link.active {
  background-color: var(--b-accent) !important;
}

/* Admin + cuenta — cabecera fija (Bootstrap navbar-light/bg-light) */
body.app-brand-area > header.navbar.navbar-light.bg-light,
body.app-brand-area > header.navbar.fixed-top {
  background-color: var(--b-primary) !important;
  color: #fff !important;
  border-bottom: 1px solid color-mix(in srgb, var(--b-primary) 78%, #000) !important;
}
body.app-brand-area > header.navbar .navbar-brand {
  color: var(--b-accent) !important;
}
body.app-brand-area > header.navbar .navbar-toggler {
  background-color: var(--b-accent) !important;
  border-color: rgba(255, 255, 255, 0.35) !important;
}
body.app-brand-area > header.navbar .navbar-toggler-icon {
  filter: brightness(0.15);
}
body.app-brand-area .side-top {
  background: var(--b-accent) !important;
}
body.app-brand-area .side-top h5,
body.app-brand-area .side-top .username {
  color: #111 !important;
}

/* Reportes hub (variables ya definidas en reports.css) */
.reports-hub {
  --rh-brand: var(--b-primary);
  --rh-accent: var(--b-accent);
  --rh-bg-soft: var(--b-secondary);
}

/* Ámbito global: páginas públicas con body.bg-light que no son compra (index), sorteo (view_draw) ni app canto */
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) {  --pub-glob-body-text: #333333;
  --pub-glob-link: #ffffff;
  --pub-glob-link-hover: #ffffff;
  --pub-glob-body-bg: #fbf7da;
  --pub-glob-card-bg: #ffffff;
  --pub-glob-card-border: rgba(0, 0, 0, 0.175);
  --pub-glob-input-bg: #ffffff;
  --pub-glob-input-text: #212529;
  --pub-glob-input-border: #ced4da;
  --pub-glob-input-focus-border: #86b7fe;
  --pub-glob-input-focus-shadow: rgba(13, 110, 253, 0.25);
  --pub-glob-legal-body-text: #000000;
  --pub-glob-registro-terminos-link: #000000;
  --pub-glob-login-iti-dial-text: #000000;
  color: var(--pub-glob-body-text) !important;
  background-color: var(--pub-glob-body-bg) !important;
}
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) a:not(.btn):not(.navbar-brand):not(.nav-link) {
  color: var(--pub-glob-link);
}
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) a:not(.btn):not(.navbar-brand):not(.nav-link):hover {
  color: var(--pub-glob-link-hover);
}
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) .card {
  background-color: var(--pub-glob-card-bg);
  border-color: var(--pub-glob-card-border);
}
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) .form-control {
  background-color: var(--pub-glob-input-bg);
  color: var(--pub-glob-input-text);
  border-color: var(--pub-glob-input-border);
}
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) .form-control:focus {
  border-color: var(--pub-glob-input-focus-border);
  box-shadow: 0 0 0 0.25rem var(--pub-glob-input-focus-shadow);
}

/* Cobertura extra para páginas públicas y login: cards + cabeceras de popup/modales ligadas a primario */
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) .card,
body.bg-light.login-page .card,
body.bg-light.background-dollar .card {
  background-color: var(--b-primary) !important;
  border-color: color-mix(in srgb, var(--b-primary) 85%, #000) !important;
}
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) .card-body,
body.bg-light.login-page .card-body,
body.bg-light.background-dollar .card-body {
  color: #fff !important;
}
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) .card-title,
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) .card-text,
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) .paragraph,
body.bg-light.login-page .card-title,
body.bg-light.login-page .form-label,
body.bg-light.background-dollar .card-title,
body.bg-light.background-dollar .form-label {
  color: #fff !important;
}
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) .card-header,
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) .modal-header,
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) .bg-success,
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) .bg-dark,
body.bg-light.login-page .modal-header,
body.bg-light.background-dollar .modal-header {
  background-color: var(--b-primary) !important;
  color: #fff !important;
  border-color: color-mix(in srgb, var(--b-primary) 80%, #000) !important;
}
body.bg-light:not(.page-brand-index):not(.page-brand-view-draw):not(.bingo-module) .bg-warning {
  background-color: var(--b-accent) !important;
  color: #111 !important;
}

/* Páginas legales: el contenido usa .paragraph; más abajo el tema bg-light fuerza .paragraph en blanco — debe ir DESPUÉS de esa regla */
body.page-brand-legal.bg-light .terminos-y-condiciones > h1,
body.page-brand-legal.bg-light .terminos-y-condiciones .content,
body.page-brand-legal.bg-light .terminos-y-condiciones .content .paragraph,
body.page-brand-legal.bg-light .terminos-y-condiciones .content p,
body.page-brand-legal.bg-light .terminos-y-condiciones .content li,
body.page-brand-legal.bg-light .terminos-y-condiciones .content h2,
body.page-brand-legal.bg-light .terminos-y-condiciones .content h3,
body.page-brand-legal.bg-light .terminos-y-condiciones .content h4,
body.page-brand-legal.bg-light .terminos-y-condiciones .content td,
body.page-brand-legal.bg-light .terminos-y-condiciones .content th,
body.page-brand-legal.bg-light .terminos-y-condiciones .content .card-body,
body.page-brand-legal.bg-light .terminos-y-condiciones .content .card-text {
  color: var(--pub-glob-legal-body-text, #000000) !important;
}

body.page-brand-legal.bg-light .terminos-y-condiciones .content a:not(.btn),
body.page-brand-legal.bg-light .terminos-y-condiciones .content a:not(.btn):hover,
body.page-brand-legal.bg-light .terminos-y-condiciones .content a:not(.btn):focus,
body.page-brand-legal.bg-light .terminos-y-condiciones .content a:not(.btn):focus-visible,
body.page-brand-legal.bg-light .terminos-y-condiciones .content a:not(.btn):visited {
  color: var(--pub-glob-legal-body-text, #000000) !important;
}

/* Registro (vendedores): enlaces del texto de aceptación T&C / privacidad / afiliados */
body.page-brand-registro.bg-light .registro-legal-aceptacion a:not(.btn),
body.page-brand-registro.bg-light .registro-legal-aceptacion a:not(.btn):hover,
body.page-brand-registro.bg-light .registro-legal-aceptacion a:not(.btn):focus,
body.page-brand-registro.bg-light .registro-legal-aceptacion a:not(.btn):focus-visible,
body.page-brand-registro.bg-light .registro-legal-aceptacion a:not(.btn):visited {
  color: var(--pub-glob-registro-terminos-link, #000000) !important;
}

body.bg-light.login-page .form-control,
body.bg-light.background-dollar .form-control {
  border-color: color-mix(in srgb, var(--b-primary) 35%, #ffffff) !important;
}
body.bg-light.login-page .btn-primary,
body.bg-light.background-dollar .btn-primary {
  background-color: var(--b-accent) !important;
  color: #000 !important;
  border-color: transparent !important;
}

/* Login cuenta: prefijo telefónico (+58, …) — hereda color blanco del .card-body del tema */
body.bg-light.login-page .iti__selected-dial-code,
body.bg-light.login-page .iti__country-list .iti__country-name,
body.bg-light.login-page .iti__country-list .iti__dial-code {
  color: var(--pub-glob-login-iti-dial-text, #000000) !important;
}

/* Login admin (reutiliza .btn-primary) */
.logo-login .logo { max-height: 200px; width: auto; }

/* Variables de marca por página (index / vista previa sorteo) */
:root {
  --idx-header: #ac0001;
  --idx-page-bg: #fbf7da;
  --idx-form-bg: #ac0001;
  --idx-highlight: #ffdb4f;
  --idx-footer: #760001;
  --vd-header: #6a2818;
  --vd-page-bg: #fbf7da;
  --vd-form-bg: #6a2818;
  --vd-highlight: #ffdb4f;
  --vd-footer: #15463b;
}

/*
 * index.php — body.page-brand-index
 * Cabecera: .site-header .navbar | Fondo: body | Tarjeta formulario: .main-index .card
 * Destacados: franja "Disponibles" (.alert-cartons), bola ALEATORIO, resumen precio/hora (.vd-preview-summary)
 * Footer: footer.grass-footer
 */
body.page-brand-index {
  --pub-idx-heading: #ffe53e;
  --pub-idx-paragraph: #ffffff;
  --pub-idx-card-inner-text: #ffffff;
  --pub-idx-btn-primary-bg: #ffdb4f;
  --pub-idx-btn-primary-text: #000000;
  --pub-idx-btn-primary-hover: #f9cf26;
  --pub-idx-btn-secondary-bg: #ac0001;
  --pub-idx-btn-secondary-text: #ffffff;
  --pub-idx-btn-secondary-hover: #581d0f;
  --pub-idx-label-cantidad: #ffffff;
  --pub-idx-btn-operador-bg: #fff4ca;
  --pub-idx-btn-operador-text: #000000;
  --pub-idx-btn-operador-hover: #fad282;
  --pub-idx-bubble-bg: #ffffff;
  --pub-idx-bubble-text: #000000;
  --pub-idx-bubble-active-bg: #000000;
  --pub-idx-bubble-active-text: #ffffff;
  --pub-idx-modal-backdrop: rgb(0 0 0 / 60%);
  --pub-idx-promo-ribbon-bg: #ffcc4d;
  --pub-idx-promo-ribbon-text: #3a2a00;
  --pub-idx-meta-muted: #6b5b48;
  --pub-idx-meta-value: #2c1f14;
  --pub-idx-meta-accent-icon: #6a2818;
  --pub-idx-promo-saving-text: #0b3c74;
  --pub-idx-promo-saving-strong: #ffd74a;
  --pub-idx-payment-border: #ffdb4f;
  --pub-idx-cedula-bg: #ffffff;
  --pub-idx-cedula-border: #ced4da;
  --pub-idx-cedula-tipo-bg: #fbf7da;
  --pub-idx-cedula-focus-border: #86b7fe;
  --pub-idx-cedula-focus-shadow: rgba(13, 110, 253, 0.25);
  --pub-idx-whatsapp-bg: #25d366;
  --pub-idx-whatsapp-hover: #20b958;
  --pub-idx-link-wsp: #ac0001;
  --pub-idx-preview-summary-row1: #2c1f14;
  --pub-idx-alert-cartons-text: #111111;
  --pub-idx-btn-processing-bg: #000000;
  --pub-idx-btn-processing-text: #ffffff;
  --pub-idx-btn-black2-bg: #000000;
  --pub-idx-btn-black2-text: #ffffff;
  --pub-idx-btn-black2-hover-bg: #000000;
  --pub-idx-btn-black2-hover-text: #ffffff;
  background: radial-gradient(circle at center, #273750 40%, #0f1221 70%) !important;
}
body.page-brand-index .site-header .navbar.navbar-dark.bg-madera,
body.page-brand-index .site-header .navbar-dark.bg-madera {
  background: var(--idx-header) !important;
}
body.page-brand-index .offcanvas-start {
  background: var(--idx-header) !important;
}
body.page-brand-index .main-index .card {
  background-color: var(--idx-form-bg) !important;
}
body.page-brand-index .main-index .alert-cartons {
  background-color: var(--idx-highlight) !important;
  color: var(--pub-idx-alert-cartons-text) !important;
}
body.page-brand-index .main-index .bubble-random {
  background: var(--idx-highlight) !important;
  color: #1c1c1c !important;
}
body.page-brand-index .main-index .vd-preview-summary {
  border-color: color-mix(in srgb, var(--idx-highlight) 45%, #e8dcc4);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--idx-highlight) 18%, #fff) 0%,
    color-mix(in srgb, var(--idx-highlight) 28%, #fff9ee) 100%
  ) !important;
}
body.page-brand-index .main-index .vd-preview-summary__row1 {
  color: var(--pub-idx-preview-summary-row1);
}
body.page-brand-index footer.grass-footer {
  background-color: var(--idx-footer) !important;
}

/* Tema extendido — index.php (variables en body.page-brand-index + reglas) */
body.page-brand-index .font-1 {
  color: var(--pub-idx-heading) !important;
  text-shadow: 2px 3px 7px black !important;
}
body.page-brand-index .paragraph {
  color: var(--pub-idx-paragraph);
}
body.page-brand-index .card-bd p,
body.page-brand-index .card-body p {
  color: var(--pub-idx-card-inner-text) !important;
}
body.page-brand-index .btn-primary,
body.page-brand-index a.btn-primary,
body.page-brand-index button.btn-primary {
  background-color: var(--pub-idx-btn-primary-bg) !important;
  color: var(--pub-idx-btn-primary-text) !important;
  border-color: transparent !important;
}
body.page-brand-index .btn-primary:hover,
body.page-brand-index a.btn-primary:hover,
body.page-brand-index button.btn-primary:hover {
  background-color: var(--pub-idx-btn-primary-hover) !important;
}
body.page-brand-index .btn:focus-visible,
body.page-brand-index a.btn:focus-visible,
body.page-brand-index button.btn:focus-visible {
  background-color: var(--pub-idx-btn-primary-bg) !important;
}
body.page-brand-index .btn-secondary,
body.page-brand-index a.btn-secondary,
body.page-brand-index button.btn-secondary {
  background-color: var(--pub-idx-btn-secondary-bg) !important;
  color: var(--pub-idx-btn-secondary-text) !important;
  border-color: transparent !important;
}
body.page-brand-index .btn-secondary:hover,
body.page-brand-index a.btn-secondary:hover,
body.page-brand-index button.btn-secondary:hover {
  background-color: var(--pub-idx-btn-secondary-hover) !important;
}
body.page-brand-index .btn-secondary:focus-visible,
body.page-brand-index a.btn-secondary:focus-visible,
body.page-brand-index button.btn-secondary:focus-visible {
  background-color: var(--pub-idx-btn-secondary-bg) !important;
}
body.page-brand-index .label-cantidad {
  color: var(--pub-idx-label-cantidad) !important;
}
body.page-brand-index .btn-operador {
  background-color: var(--pub-idx-btn-operador-bg);
  color: var(--pub-idx-btn-operador-text);
}
body.page-brand-index .btn-operador:hover {
  background-color: var(--pub-idx-btn-operador-hover);
}
body.page-brand-index #grid-cartones .bubble {
  background: var(--pub-idx-bubble-bg);
  color: var(--pub-idx-bubble-text);
}
body.page-brand-index #grid-cartones .bubble.active {
  background: var(--pub-idx-bubble-active-bg) !important;
  color: var(--pub-idx-bubble-active-text) !important;
}
body.page-brand-index #modalSelectorSorteo {
  background: var(--pub-idx-modal-backdrop) !important;
}
body.page-brand-index .promo-ribbon {
  background: var(--pub-idx-promo-ribbon-bg);
  color: var(--pub-idx-promo-ribbon-text);
}
body.page-brand-index #promoStrip .sorteo-meta-bar__item--promo .sorteo-meta-bar__label {
  color: var(--pub-idx-meta-muted);
}
body.page-brand-index #promoStrip .sorteo-meta-bar__item--promo .sorteo-meta-bar__value {
  color: var(--pub-idx-meta-value);
}
body.page-brand-index #promoStrip .sorteo-meta-bar__item--promo .sorteo-meta-bar__value i {
  color: var(--pub-idx-meta-accent-icon);
}
body.page-brand-index .vd-preview-promo-chip {
  color: var(--pub-idx-meta-value);
}
body.page-brand-index .promo-saving {
  color: var(--pub-idx-promo-saving-text);
}
body.page-brand-index .promo-saving strong {
  color: var(--pub-idx-promo-saving-strong);
}
body.page-brand-index .payment-method-card {
  border-color: var(--pub-idx-payment-border) !important;
}
body.page-brand-index .cedula-input-wrapper {
  background: var(--pub-idx-cedula-bg);
  border-color: var(--pub-idx-cedula-border);
}
body.page-brand-index .cedula-input-wrapper:focus-within {
  border-color: var(--pub-idx-cedula-focus-border);
  box-shadow: 0 0 0 0.25rem var(--pub-idx-cedula-focus-shadow);
}
body.page-brand-index .cedula-tipo {
  background-color: var(--pub-idx-cedula-tipo-bg) !important;
}
body.page-brand-index .whatsapp-float {
  background-color: var(--pub-idx-whatsapp-bg);
  color: #ffffff;
}
body.page-brand-index .whatsapp-float:hover {
  background-color: var(--pub-idx-whatsapp-hover);
  color: #ffffff;
}
body.page-brand-index .link-wsp {
  color: var(--pub-idx-link-wsp);
}
body.page-brand-index .btn-processing,
body.page-brand-index .btn-processing:disabled,
body.page-brand-index .btn-processing.btn-secondary:disabled {
  background-color: var(--pub-idx-btn-processing-bg) !important;
  color: var(--pub-idx-btn-processing-text) !important;
}
body.page-brand-index .iti__selected-dial-code,
body.page-brand-index .iti__country-name {
  color: inherit;
}
body.page-brand-index button.btn-black-2,
body.page-brand-index a.btn-black-2 {
  background-color: var(--pub-idx-btn-black2-bg) !important;
  color: var(--pub-idx-btn-black2-text) !important;
  border-color: transparent !important;
}
body.page-brand-index button.btn-black-2:hover,
body.page-brand-index a.btn-black-2:hover {
  background-color: var(--pub-idx-btn-black2-hover-bg) !important;
  color: var(--pub-idx-btn-black2-hover-text) !important;
}
body.page-brand-index button.btn-black-2:focus-visible,
body.page-brand-index a.btn-black-2:focus-visible {
  background-color: var(--pub-idx-btn-black2-bg) !important;
  color: var(--pub-idx-btn-black2-text) !important;
}


/* view_draw.php — body.page-brand-view-draw (misma estructura de bloques que index) */
body.page-brand-view-draw {
  --pub-vd-heading: #000000;
  --pub-vd-paragraph: #444444;
  --pub-vd-card-inner-text: #ffffff;
  --pub-vd-btn-primary-bg: #ffdb4f;
  --pub-vd-btn-primary-text: #000000;
  --pub-vd-btn-primary-hover: #f9cf26;
  --pub-vd-btn-secondary-bg: #6a2818;
  --pub-vd-btn-secondary-text: #ffffff;
  --pub-vd-btn-secondary-hover: #581d0f;
  --pub-vd-label-cantidad: #ffffff;
  --pub-vd-btn-operador-bg: #fff4ca;
  --pub-vd-btn-operador-text: #000000;
  --pub-vd-btn-operador-hover: #fad282;
  --pub-vd-bubble-bg: #ffffff;
  --pub-vd-bubble-text: #000000;
  --pub-vd-bubble-active-bg: #000000;
  --pub-vd-bubble-active-text: #ffffff;
  --pub-vd-modal-backdrop: rgb(0 0 0 / 60%);
  --pub-vd-promo-ribbon-bg: #ffcc4d;
  --pub-vd-promo-ribbon-text: #3a2a00;
  --pub-vd-meta-muted: #6b5b48;
  --pub-vd-meta-value: #2c1f14;
  --pub-vd-meta-accent-icon: #6a2818;
  --pub-vd-promo-saving-text: #0b3c74;
  --pub-vd-promo-saving-strong: #ffd74a;
  --pub-vd-payment-border: #ffdb4f;
  --pub-vd-cedula-bg: #ffffff;
  --pub-vd-cedula-border: #ced4da;
  --pub-vd-cedula-tipo-bg: #fbf7da;
  --pub-vd-cedula-focus-border: #86b7fe;
  --pub-vd-cedula-focus-shadow: rgba(13, 110, 253, 0.25);
  --pub-vd-whatsapp-bg: #25d366;
  --pub-vd-whatsapp-hover: #20b958;
  --pub-vd-link-wsp: #ac0001;
  --pub-vd-preview-summary-row1: #2c1f14;
  --pub-vd-alert-cartons-text: #111111;
  --pub-vd-btn-processing-bg: #000000;
  --pub-vd-btn-processing-text: #ffffff;
  background: #fbf7da !important;
}
body.page-brand-view-draw .site-header .navbar.navbar-dark.bg-madera,
body.page-brand-view-draw .site-header .navbar-dark.bg-madera {
  background: var(--vd-header) !important;
}
body.page-brand-view-draw .offcanvas-start {
  background: var(--vd-header) !important;
}
body.page-brand-view-draw .main-index .card {
  background-color: var(--vd-form-bg) !important;
}
body.page-brand-view-draw .main-index .alert-cartons {
  background-color: var(--vd-highlight) !important;
  color: var(--pub-vd-alert-cartons-text) !important;
}
body.page-brand-view-draw .main-index .bubble-random {
  background: var(--vd-highlight) !important;
  color: #1c1c1c !important;
}
body.page-brand-view-draw .main-index .vd-preview-summary {
  border-color: color-mix(in srgb, var(--vd-highlight) 45%, #e8dcc4);
  background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--vd-highlight) 18%, #fff) 0%,
    color-mix(in srgb, var(--vd-highlight) 28%, #fff9ee) 100%
  ) !important;
}
body.page-brand-view-draw .main-index .vd-preview-summary__row1 {
  color: var(--pub-vd-preview-summary-row1);
}
body.page-brand-view-draw footer.grass-footer {
  background-color: var(--vd-footer) !important;
}

/* Tema extendido — view_draw.php */
body.page-brand-view-draw .font-1 {
  color: var(--pub-vd-heading) !important;
}
body.page-brand-view-draw .paragraph {
  color: var(--pub-vd-paragraph);
}
body.page-brand-view-draw .card-bd p,
body.page-brand-view-draw .card-body p {
  color: var(--pub-vd-card-inner-text) !important;
}
body.page-brand-view-draw .btn-primary,
body.page-brand-view-draw a.btn-primary,
body.page-brand-view-draw button.btn-primary {
  background-color: var(--pub-vd-btn-primary-bg) !important;
  color: var(--pub-vd-btn-primary-text) !important;
  border-color: transparent !important;
}
body.page-brand-view-draw .btn-primary:hover,
body.page-brand-view-draw a.btn-primary:hover,
body.page-brand-view-draw button.btn-primary:hover {
  background-color: var(--pub-vd-btn-primary-hover) !important;
}
body.page-brand-view-draw .btn:focus-visible,
body.page-brand-view-draw a.btn:focus-visible,
body.page-brand-view-draw button.btn:focus-visible {
  background-color: var(--pub-vd-btn-primary-bg) !important;
}
body.page-brand-view-draw .btn-secondary,
body.page-brand-view-draw a.btn-secondary,
body.page-brand-view-draw button.btn-secondary {
  background-color: var(--pub-vd-btn-secondary-bg) !important;
  color: var(--pub-vd-btn-secondary-text) !important;
  border-color: transparent !important;
}
body.page-brand-view-draw .btn-secondary:hover,
body.page-brand-view-draw a.btn-secondary:hover,
body.page-brand-view-draw button.btn-secondary:hover {
  background-color: var(--pub-vd-btn-secondary-hover) !important;
}
body.page-brand-view-draw .btn-secondary:focus-visible,
body.page-brand-view-draw a.btn-secondary:focus-visible,
body.page-brand-view-draw button.btn-secondary:focus-visible {
  background-color: var(--pub-vd-btn-secondary-bg) !important;
}
body.page-brand-view-draw .label-cantidad {
  color: var(--pub-vd-label-cantidad) !important;
}
body.page-brand-view-draw .btn-operador {
  background-color: var(--pub-vd-btn-operador-bg);
  color: var(--pub-vd-btn-operador-text);
}
body.page-brand-view-draw .btn-operador:hover {
  background-color: var(--pub-vd-btn-operador-hover);
}
body.page-brand-view-draw #grid-cartones .bubble {
  background: var(--pub-vd-bubble-bg);
  color: var(--pub-vd-bubble-text);
}
body.page-brand-view-draw #grid-cartones .bubble.active {
  background: var(--pub-vd-bubble-active-bg) !important;
  color: var(--pub-vd-bubble-active-text) !important;
}
body.page-brand-view-draw #modalSelectorSorteo {
  background: var(--pub-vd-modal-backdrop) !important;
}
body.page-brand-view-draw .promo-ribbon {
  background: var(--pub-vd-promo-ribbon-bg);
  color: var(--pub-vd-promo-ribbon-text);
}
body.page-brand-view-draw #promoStrip .sorteo-meta-bar__item--promo .sorteo-meta-bar__label {
  color: var(--pub-vd-meta-muted);
}
body.page-brand-view-draw #promoStrip .sorteo-meta-bar__item--promo .sorteo-meta-bar__value {
  color: var(--pub-vd-meta-value);
}
body.page-brand-view-draw #promoStrip .sorteo-meta-bar__item--promo .sorteo-meta-bar__value i {
  color: var(--pub-vd-meta-accent-icon);
}
body.page-brand-view-draw .vd-preview-promo-chip {
  color: var(--pub-vd-meta-value);
}
body.page-brand-view-draw .promo-saving {
  color: var(--pub-vd-promo-saving-text);
}
body.page-brand-view-draw .promo-saving strong {
  color: var(--pub-vd-promo-saving-strong);
}
body.page-brand-view-draw .payment-method-card {
  border-color: var(--pub-vd-payment-border) !important;
}
body.page-brand-view-draw .cedula-input-wrapper {
  background: var(--pub-vd-cedula-bg);
  border-color: var(--pub-vd-cedula-border);
}
body.page-brand-view-draw .cedula-input-wrapper:focus-within {
  border-color: var(--pub-vd-cedula-focus-border);
  box-shadow: 0 0 0 0.25rem var(--pub-vd-cedula-focus-shadow);
}
body.page-brand-view-draw .cedula-tipo {
  background-color: var(--pub-vd-cedula-tipo-bg) !important;
}
body.page-brand-view-draw .whatsapp-float {
  background-color: var(--pub-vd-whatsapp-bg);
  color: #ffffff;
}
body.page-brand-view-draw .whatsapp-float:hover {
  background-color: var(--pub-vd-whatsapp-hover);
  color: #ffffff;
}
body.page-brand-view-draw .link-wsp {
  color: var(--pub-vd-link-wsp);
}
body.page-brand-view-draw .btn-processing,
body.page-brand-view-draw .btn-processing:disabled,
body.page-brand-view-draw .btn-processing.btn-secondary:disabled {
  background-color: var(--pub-vd-btn-processing-bg) !important;
  color: var(--pub-vd-btn-processing-text) !important;
}
body.page-brand-view-draw .iti__selected-dial-code,
body.page-brand-view-draw .iti__country-name {
  color: inherit;
}


/* Borde decorativo superior del footer (imagen repetible por vista) */
body.page-brand-index footer.grass-footer::before{background:url("https://bingoelgocho.com/uploads/system/footer_special.png") repeat-x center!important;}
body.page-brand-view-draw footer.grass-footer::before{background:url("https://bingoelgocho.com/uploads/system/grass_border.png") repeat-x center!important;}

/* Módulo Bingo (bingo.css + tablero.css): variables solo bajo body.bingo-module */
body.bingo-module {
  --color-bg: #fbf7da;
  --color-primary: #6b2818;
  --color-primary-dark: #5a2115;
  --color-primary-light: #7d3020;
  --color-accent: #ffd402;
  --color-accent-dark: #e6bf00;
  --color-text-light: #fbf7da;
  --color-text-dark: #1a1a1a;
  --color-danger: #ef4444;
  --color-danger-hover: #dc2626;
  --color-success: #22c55e;
  --color-info: #3b82f6;
  --tablero-bg: #fbf7da;
  --tablero-primary: #6a2818;
  --tablero-accent: #ffd74a;
  --tablero-white: #ffffff;
  --tablero-dark: #1d1d1b;
  --tablero-green: #124723;
  --color-b: #3b82f6;
  --color-i: #ef4444;
  --color-n: #6b7280;
  --color-g: #22c55e;
  --color-o: #ffd74a;
  --ultimas-oro: #fdd85d;
  --ultimas-marron: #5d2117;
  --ball-called-bg: #ff0000;
  --ball-last-bg: #ef1400;
  --ball-last-ring: #ffb74d;
  --grid-surface: #ffffff;
  --soporte-ganadores-bar-bg: #1a1a1a;
  --modal-config-surface: #e8e8e8;

}