/* El Cantarito 44 — modo oscuro (estilo Gmail / WhatsApp / Instagram).
   Negro neutro, tarjetas gris un poco más claro sin bordes, texto casi blanco y el mostaza de la marca solo como acento.
   Se activa con <html data-tema="oscuro"> (selector Automático / Claro / Oscuro de la barra superior).
   El modo claro no cambia: todo va bajo html[data-tema=oscuro].
   Archivo generado: editar scripts/oscuro-base.css, scripts/oscuro-ajustes.css o scripts/generar-oscuro.mjs. */

html[data-tema=oscuro] {
  color-scheme: dark;
  --osc-fondo: #0D0D0C;      /* página */
  --osc-tarjeta: #1D1C1B;    /* tarjetas, menús, ventanas, barras */
  --osc-campo: #262524;      /* campos para escribir y botones grises */
  --osc-texto: #F2F2F1;      /* texto principal */
  --osc-gris: #A3A3A1;       /* texto secundario */
  --osc-acento: #F5A623;     /* mostaza de la marca: único acento */
  --osc-noche: #0D0D0C;      /* texto sobre mostaza */

  /* Marca: mismos nombres, valores neutros */
  --c44-papel: var(--osc-fondo);
  --c44-tarjeta: var(--osc-tarjeta);
  --c44-hueso: var(--osc-fondo);
  --c44-tinta: var(--osc-texto);
  --c44-arena: var(--osc-gris);
  --c44-barro: var(--osc-acento);     /* la palabra destacada de los títulos */
  --c44-ambar: var(--osc-acento);
  --c44-oro-hondo: var(--osc-acento);
  --c44-verde: var(--osc-texto);      /* precios y palomitas: sin otro color */
  --c44-lima: var(--osc-gris);
  --c44-chile: #F2867A;               /* solo errores */
  --c44-linea: transparent;           /* sin bordes: se separa por tono */
  --c44-sombra: none;
  --c44-negro: var(--osc-tarjeta);
  --c44-rojo: var(--osc-acento);
  --c44-naranja: var(--osc-acento);
  --c44-olivo: var(--osc-gris);
}

/* Esquemas de color de Dawn (tema.css): todos a neutro. */
html[data-tema=oscuro],
html[data-tema=oscuro] .color-scheme-1,
html[data-tema=oscuro] .color-scheme-2,
html[data-tema=oscuro] .color-scheme-4 {
  --color-background: 13,13,12;
  --gradient-background: #0D0D0C;
  --color-foreground: 242,242,241;
  --color-background-contrast: 45,44,43;
  --color-shadow: 0,0,0;
  --color-button: 245,166,35;
  --color-button-text: 13,13,12;
  --color-secondary-button: 29,28,27;
  --color-secondary-button-text: 242,242,241;
  --color-link: 242,242,241;
  --color-badge-foreground: 242,242,241;
  --color-badge-background: 29,28,27;
  --color-badge-border: 29,28,27;
  --payment-terms-background-color: rgb(13 13 12);
}
/* Esquema 3 (la barra del menú, amarilla en claro) y 5 (blanco): gris de tarjeta. */
html[data-tema=oscuro] .color-scheme-3,
html[data-tema=oscuro] .color-scheme-5 {
  --color-background: 29,28,27;
  --gradient-background: #1D1C1B;
  --color-foreground: 242,242,241;
  --color-background-contrast: 55,54,53;
  --color-shadow: 0,0,0;
  --color-button: 245,166,35;
  --color-button-text: 13,13,12;
  --color-secondary-button: 38,37,36;
  --color-secondary-button-text: 242,242,241;
  --color-link: 242,242,241;
  --color-badge-foreground: 242,242,241;
  --color-badge-background: 38,37,36;
  --color-badge-border: 38,37,36;
}
html[data-tema=oscuro], html[data-tema=oscuro] body { background-color: var(--osc-fondo); }

/* ---- Generado por scripts/generar-oscuro.mjs (no editar a mano) ---- */
:where(html[data-tema=oscuro]) .c44-btn:focus-visible { outline: none; }
:where(html[data-tema=oscuro]) .c44-btn--primary { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-btn--primary:hover { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-btn--dark { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-btn--dark:hover { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-btn--ghost:hover { background: rgba(242, 242, 241, .06); }
:where(html[data-tema=oscuro]) .color-scheme-4 .c44-btn--ghost { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-dark .c44-btn--ghost { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-chip--dark { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-chip--verde { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-topbar { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-topbar .disclosure__button { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .quick-add__submit.button--secondary { background: var(--osc-tarjeta) !important; }
:where(html[data-tema=oscuro]) .c44-bar { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-bar .c44-title { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-bar .c44-check { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-founder__photo::before { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-founder__caption { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-b2b__card { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-cta { background: var(--osc-fondo); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-cta input[type="date"] { border: 0; }
:where(html[data-tema=oscuro]) .c44-footer { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-footer .c44-brand { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-footer__news input { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-footer__social a:hover { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-footer .disclosure__button { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-phero { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-phero .c44-title { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-packs__tab[aria-selected="true"] { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-gallery__grid figcaption { color: var(--osc-texto); background: rgba(242, 242, 241, .75); }
:where(html[data-tema=oscuro]) .c44-book { background: var(--osc-fondo); color: var(--osc-texto); border-top: 0; border-bottom: 0; }
:where(html[data-tema=oscuro]) .c44-book__step { border: 0; }
:where(html[data-tema=oscuro]) .c44-book__step.is-active { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-book__step.is-active i { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-opt:has(input:checked) { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-field input { border: 1px solid rgba(242, 242, 241, .25); }
:where(html[data-tema=oscuro]) .c44-field textarea { border: 1px solid rgba(242, 242, 241, .25); }
:where(html[data-tema=oscuro]) .c44-field select { border: 1px solid rgba(242, 242, 241, .25); }
:where(html[data-tema=oscuro]) .c44-book__unavailable { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-tl::before { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .collection__view-all .button { border: 0; }
@media (hover: none) { :where(html[data-tema=oscuro]) .c44-scrollcue__mouse { color: var(--osc-noche); } }
@media (hover: none) { :where(html[data-tema=oscuro]) .c44-scrollcue__mouse i { border-color: transparent; } }
:where(html[data-tema=oscuro]) .card-wrapper .quick-add__submit { background: var(--osc-tarjeta) !important; }
@media (max-width: 989px) { :where(html[data-tema=oscuro]) .c44-steps__dots i { background: rgba(242, 242, 241, .2); } }
:where(html[data-tema=oscuro]) .c44-social__tag { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-social__tile--tiktok { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-social__go { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-cal__nav:hover:not(:disabled) { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-cal__day:disabled { color: rgba(242, 242, 241, .22); }
:where(html[data-tema=oscuro]) .c44-cal__day.is-selected { background: var(--osc-tarjeta) !important; }
:where(html[data-tema=oscuro]) .c44-packs__thumb { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-packs__seg .c44-packs__tab[aria-selected="true"] { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-extras__dots i { background: rgba(242, 242, 241, .2); }
:where(html[data-tema=oscuro]) .c44-extras__dots i.is-on { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-book__busy { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-bar .c44-btn--primary { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-cal__count { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-cal__ctrl .c44-cal__nav { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-cal__dots i { background: rgba(242, 242, 241, .25); }
:where(html[data-tema=oscuro]) .c44-cal__dots i.is-on { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-blog__tag.is-on { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-blog__tag:hover { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-blog__badge { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-blog__chip { color: var(--osc-texto); background: rgba(242, 242, 241, .8); }
:where(html[data-tema=oscuro]) .c44-cal__face { box-shadow: none; }
:where(html[data-tema=oscuro]) .c44-cal__card--cta .c44-cal__face { color: var(--osc-texto); box-shadow: none; }
:where(html[data-tema=oscuro]) .c44-cal__card--cta h3 { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-cal__card--cta .c44-btn--primary { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-cal__cta-shop { color: var(--osc-texto) !important; }
:where(html[data-tema=oscuro]) .c44-pcar__cta { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-pcar__cta h3 { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-pcar__cta .c44-btn--primary { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-pcar__cta2 { color: var(--osc-texto) !important; }
:where(html[data-tema=oscuro]) .c44-pcar__ctrl .c44-cal__nav { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-pcar__dots i { background: rgba(242, 242, 241, .2); }
:where(html[data-tema=oscuro]) .c44-pcar__dots i.is-on { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-lang a.is-on { color: var(--osc-noche) !important; }
:where(html[data-tema=oscuro]) .c44-book .c44-eyebrow::before { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-book .c44-lead { color: rgba(242, 242, 241, .82); }
:where(html[data-tema=oscuro]) .c44-book .c44-card { border: 0; box-shadow: none; }
:where(html[data-tema=oscuro]) .c44-book .c44-summary { border: 0; box-shadow: none; }
:where(html[data-tema=oscuro]) .c44-book .c44-opt:has(input:checked) { background: var(--osc-tarjeta); border-color: transparent; box-shadow: none; }
:where(html[data-tema=oscuro]) .c44-cur button.is-on { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-countdown div { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-evcard__date { background: var(--osc-tarjeta); color: var(--osc-texto); box-shadow: none; }
:where(html[data-tema=oscuro]) .c44-events__invite { color: var(--osc-texto); border: 0; }
:where(html[data-tema=oscuro]) .c44-evd__coupon { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-evd__code { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-evd__code small { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-evd__sell-card--dark { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-evd__sell-card--dark h2 { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-evstrip__card { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-evstrip__body h2 { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-wcountry label:has(input:checked) { background: var(--osc-tarjeta); border-color: transparent; }
:where(html[data-tema=oscuro]) .header .c44-header-shop { box-shadow: none; }
:where(html[data-tema=oscuro]) .header .c44-header-shop:hover { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-story__fig figcaption { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-ai__bubble { color: var(--osc-noche); border: 0; }
:where(html[data-tema=oscuro]) .c44-ai__panel { border: 0; }
:where(html[data-tema=oscuro]) .c44-ai__head { background: var(--osc-tarjeta); color: var(--osc-texto); border-bottom: 0; }
:where(html[data-tema=oscuro]) .c44-ai__head small { color: rgba(242, 242, 241, .75); }
:where(html[data-tema=oscuro]) .c44-ai__close { background: rgba(242, 242, 241, .12); }
:where(html[data-tema=oscuro]) .c44-ai__msg--me { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-ai__link { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-ai__chips button { background: var(--osc-tarjeta); border: 0; }
:where(html[data-tema=oscuro]) .c44-ai__chips button:hover { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-ai__form input { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-ai__form button { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-evribbon { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-evribbon:hover { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-steps__dots i.is-on { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-b2b__card .c44-title { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-events__invite .c44-title { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-b2b__card .c44-btn--primary { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-events__invite .c44-btn--primary { background: var(--osc-tarjeta); color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-evd__sell-card--dark .c44-btn--primary { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-evstrip .c44-btn--primary { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-phero:not(.c44-phero--light) .c44-btn--primary { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-footer .c44-btn--primary { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-drawer-cta .c44-btn--primary { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-ptr { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-ptr.is-ready { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-vcard .card { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-vcard__media { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-cur a.is-on { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-cuenta__tabs { background: rgba(242, 242, 241, .06); }
:where(html[data-tema=oscuro]) .c44-cuenta__tabs button { color: rgba(242, 242, 241, .7); }
:where(html[data-tema=oscuro]) .c44-cuenta__tabs button.is-on { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-cuenta__link { color: rgba(242, 242, 241, .75); }
:where(html[data-tema=oscuro]) .c44-mis-pedidos a:hover { border-color: transparent; }
:where(html[data-tema=oscuro]) .c44-phero:not(.c44-phero--light) .c44-btn--ghost { color: var(--osc-texto); }
:where(html[data-tema=oscuro]) .c44-adm__lista > li > a { border: 1px solid var(--c44-linea, rgba(242, 242, 241,.12)); }
:where(html[data-tema=oscuro]) .c44-adm__lista > li > div { border: 1px solid var(--c44-linea, rgba(242, 242, 241,.12)); }
:where(html[data-tema=oscuro]) .c44-adm__lista > li > a:hover { border-color: transparent; }
:where(html[data-tema=oscuro]) .c44-adm-item footer { border-top: 1px solid var(--c44-linea, rgba(242, 242, 241,.1)); }
:where(html[data-tema=oscuro]) .c44-adm-chip { border: 2px solid var(--c44-linea, rgba(242, 242, 241,.15)); }
:where(html[data-tema=oscuro]) .c44-adm-chip:hover:not(:disabled) { border-color: transparent; }
:where(html[data-tema=oscuro]) .c44-adm-chip.is-on { background: var(--osc-tarjeta); border-color: transparent; }
:where(html[data-tema=oscuro]) .c44-adm__precios .c44-adm-form { border: 1px solid var(--c44-linea, rgba(242, 242, 241,.12)); }
:where(html[data-tema=oscuro]) .c44-adm__precios input { border: 1px solid rgba(242, 242, 241,.25); }
:where(html[data-tema=oscuro]) .c44-pago__num { color: var(--osc-noche); }
:where(html[data-tema=oscuro]) .c44-pago__foto { background: var(--osc-tarjeta); }
:where(html[data-tema=oscuro]) .c44-pago__foto i { background: var(--osc-tarjeta); color: var(--osc-texto); }

/* ---- Ajustes a mano del modo oscuro (van al final para ganar) ---- */

/* Botón principal: mostaza con texto negro (en claro es negro/rojo según la sección). */
html[data-tema=oscuro] .c44-btn--primary,
html[data-tema=oscuro] .c44-btn--primary:hover { background: var(--osc-acento); color: var(--osc-noche); box-shadow: none; }
html[data-tema=oscuro] .c44-btn--primary svg { color: var(--osc-noche); }
/* Botón oscuro: gris un tono arriba de la tarjeta para que se vea sobre ella. */
html[data-tema=oscuro] .c44-btn--dark,
html[data-tema=oscuro] .c44-btn--dark:hover { background: var(--osc-campo); color: var(--osc-texto); }
html[data-tema=oscuro] .c44-btn--ghost:hover { background: rgba(242, 242, 241, .08); }

/* Títulos en blanco; el mostaza solo en la palabra destacada. Etiquetas pequeñas en gris (la rayita sigue mostaza). */
html[data-tema=oscuro] .c44-title, html[data-tema=oscuro] h1, html[data-tema=oscuro] h2, html[data-tema=oscuro] h3 { color: var(--osc-texto); }
html[data-tema=oscuro] .c44-accent { color: var(--osc-acento); }
html[data-tema=oscuro] .c44-eyebrow { color: var(--osc-gris); }
html[data-tema=oscuro] .c44-lead { color: var(--osc-gris); }
html[data-tema=oscuro] .c44-mark { background: linear-gradient(transparent 55%, rgba(245, 166, 35, .35) 55%); }

/* Tarjetas y ventanas: gris, sin bordes ni sombras. */
html[data-tema=oscuro] .c44-card,
html[data-tema=oscuro] .card,
html[data-tema=oscuro] .card-wrapper .card { border: 0; box-shadow: none; }
html[data-tema=oscuro] .card--card, html[data-tema=oscuro] .card--standard .card__inner { --border-opacity: 0; }

/* Barra del menú y su menú desplegable: gris de tarjeta. */
html[data-tema=oscuro] .header-wrapper, html[data-tema=oscuro] .section-header .header-wrapper { background: var(--osc-tarjeta); }
html[data-tema=oscuro] .section-header .header-wrapper::after { display: none; }
html[data-tema=oscuro] .menu-drawer, html[data-tema=oscuro] .header__submenu, html[data-tema=oscuro] .search-modal,
html[data-tema=oscuro] .cart-drawer, html[data-tema=oscuro] .drawer__inner { background: var(--osc-tarjeta); color: var(--osc-texto); }
html[data-tema=oscuro] .c44-brand__text { color: var(--osc-texto); }

/* Fotos: igual, solo un poco menos de brillo para que no encandilen. Logo y mascota sin tocar. */
html[data-tema=oscuro] .card__media img, html[data-tema=oscuro] .product__media img, html[data-tema=oscuro] .c44-blog__card-media img,
html[data-tema=oscuro] .c44-blog__hero-media img, html[data-tema=oscuro] .article-template__hero-medium img, html[data-tema=oscuro] .cart-item__image { filter: brightness(.9); }

/* Campos para escribir, buscador y selects: gris neutro, sin borde. */
html[data-tema=oscuro] input:not([type=checkbox]):not([type=radio]):not([type=range]),
html[data-tema=oscuro] select, html[data-tema=oscuro] textarea,
html[data-tema=oscuro] .field__input, html[data-tema=oscuro] .select__select, html[data-tema=oscuro] .search__input {
  background-color: var(--osc-campo); color: var(--osc-texto); border-color: transparent; box-shadow: none;
}
html[data-tema=oscuro] .field::before, html[data-tema=oscuro] .field::after,
html[data-tema=oscuro] .select::before, html[data-tema=oscuro] .select::after { box-shadow: none; }
html[data-tema=oscuro] ::placeholder { color: rgba(242, 242, 241, .45); }
html[data-tema=oscuro] .field__label { color: var(--osc-gris); }

/* ---- Selector Automático / Claro / Oscuro (barra superior, junto a USD/MXN y ES/EN) ---- */
.c44-tema { display: inline-flex; align-items: center; gap: .2rem; padding: .3rem; border-radius: 999px; background: rgba(250, 248, 245, .12); }
.c44-tema button { display: inline-flex; align-items: center; justify-content: center; width: 2.8rem; height: 2.6rem; border: 0; border-radius: 999px; background: none; color: inherit; cursor: pointer; padding: 0; font: inherit; font-size: 1.1rem; font-weight: 800; }
.c44-tema button svg { width: 1.5rem; height: 1.5rem; }
.c44-tema button[aria-pressed=true] { background: var(--c44-loteria); color: #1A1512; }
.c44-tema button:focus-visible { outline: 2px solid var(--c44-loteria); outline-offset: 1px; }
html[data-tema=oscuro] .c44-tema { background: var(--osc-campo); }
html[data-tema=oscuro] .c44-tema button[aria-pressed=true] { background: var(--osc-acento); color: var(--osc-noche); }
/* En celular la barra superior deja solo WhatsApp para que quepan los tres selectores. */
@media (max-width: 749px) {
  .c44-topbar__contact a:not([href^="https://wa.me"]) { display: none; }
  .c44-topbar__loc { gap: .6rem; }
}

/* Calendario y su recuadro de leyenda: tarjeta gris sobre la sección negra. */
html[data-tema=oscuro] .c44-cal { background: var(--osc-tarjeta); box-shadow: none; }
html[data-tema=oscuro] .c44-cal__panel { background: var(--osc-tarjeta); box-shadow: none; }

/* Reservas: sin el brillo claro detrás del título. */
html[data-tema=oscuro] div.c44-book__glow { display: none; }

/* Opción seleccionada de producto (presentación): mostaza, no píldora blanca. */
html[data-tema=oscuro] .product-form__input input[type=radio]:checked + label { background-color: var(--osc-acento); color: var(--osc-noche); border-color: var(--osc-acento); }
html[data-tema=oscuro] .product-form__input input[type=radio] + label { background-color: var(--osc-tarjeta); color: var(--osc-texto); border-color: transparent; }

/* Fotos de producto (fondo blanco de origen): marco gris y esquinas redondeadas para que no se vean como recuadros. */
html[data-tema=oscuro] .c44-vcard__media { background: var(--osc-campo); padding: .8rem; }
html[data-tema=oscuro] .c44-vcard__media img { border-radius: 1.2rem; background: #fff; }
html[data-tema=oscuro] .product-media-container { background: var(--osc-campo); padding: 1rem; border-radius: var(--media-radius, 18px); }
html[data-tema=oscuro] .product-media-container img { border-radius: 1.2rem; }
html[data-tema=oscuro] .cart-item__image { border-radius: 1rem; outline: .5rem solid var(--osc-campo); }

/* "Desliza" en celular: pastilla mostaza (es de los pocos acentos permitidos). */
@media (max-width: 749px) { html[data-tema=oscuro] .c44-scrollcue { background: var(--osc-acento); color: var(--osc-noche); box-shadow: none; } html[data-tema=oscuro] .c44-scrollcue__mouse i { background: var(--osc-noche); } }
