/* CODIFICANDO | Navegación de la cabecera (sitio principal).
   Se carga con <link> propio porque el paquete de estilos del sitio no admite reglas nuevas.
   Naranja solo en acciones y estados seleccionados; texto carbón sobre naranja (AA). */
:root {
  --cdp-naranja: #FF7900;
  --cdp-naranja-osc: #E86E00;
  --cdp-carbon: #1E2128;
  --cdp-gris: #4A4F5A;
  --cdp-calido: #FFFBF5;
  --cdp-arena: #F6F0E6;
  --cdp-borde: #E6DED1;
  --cdp-wa: #25D366;
}

header .cod-nav, header .cod-nav a, header .cod-nav button,
#codMobileMenu, #codMobileMenu a, #codMobileMenu summary {
  font-family: 'Poppins', 'Inter', -apple-system, 'Segoe UI', Arial, sans-serif !important;
}

header .cod-nav a.cod-logo, #codMobileMenu a.cod-logo { min-height: 44px !important; }

/* ---------- Menú de escritorio ---------- */
.cod-nav .cod-menu-desktop.cdp-menu {
  display: flex !important; align-items: center !important; gap: 2px !important;
  list-style: none !important; margin: 0 !important; padding: 0 !important; flex-wrap: nowrap !important;
}
.cod-nav .cdp-menu > li { position: relative !important; display: flex !important; align-items: center !important; margin: 0 !important; }
.cod-nav .cdp-menu > li > a {
  display: inline-flex !important; align-items: center !important; min-height: 44px !important;
  padding: 0 10px !important; border-radius: 8px !important; white-space: nowrap !important;
  color: var(--cdp-carbon) !important; font-size: 14.5px !important; font-weight: 500 !important;
  text-decoration: none !important; background: transparent !important;
  transition: background-color .18s ease, color .18s ease !important;
}
.cod-nav .cdp-menu > li > a::after { display: none !important; }
.cod-nav .cdp-menu > li > a:hover { background: var(--cdp-arena) !important; color: var(--cdp-carbon) !important; }
.cod-nav .cdp-menu > li.cdp-con-sub > a { padding-right: 2px !important; }
.cod-nav .cdp-menu > li > a[aria-current="page"] { box-shadow: inset 0 -3px 0 var(--cdp-naranja) !important; border-radius: 8px 8px 0 0 !important; }
.cod-nav .cdp-sub-btn {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  width: 28px !important; min-width: 28px !important; height: 44px !important; padding: 0 !important; margin: 0 !important;
  border: 0 !important; border-radius: 8px !important; background: transparent !important;
  color: var(--cdp-carbon) !important; cursor: pointer !important;
  transition: background-color .18s ease !important;
}
.cod-nav .cdp-sub-btn:hover { background: var(--cdp-arena) !important; }
.cod-nav .cdp-sub-btn svg { transition: transform .18s ease !important; }
.cod-nav .cdp-con-sub.cdp-abierto > .cdp-sub-btn svg { transform: rotate(180deg) !important; }
.cod-nav .cdp-sub {
  position: absolute !important; top: 100% !important; left: 0 !important; z-index: 10005 !important;
  min-width: 250px !important; margin: 0 !important; padding: 8px !important; list-style: none !important;
  background: #fff !important; border: 1px solid var(--cdp-borde) !important; border-radius: 12px !important;
  box-shadow: 0 14px 34px rgba(30, 33, 40, .14) !important;
  visibility: hidden !important; opacity: 0 !important; transform: translateY(4px) !important;
  transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s !important;
}
.cod-nav .cdp-menu > li:last-child > .cdp-sub { left: auto !important; right: 0 !important; }
.cod-nav .cdp-menu > li.cdp-con-sub:hover > .cdp-sub,
.cod-nav .cdp-menu:not(.cdp-js) > li.cdp-con-sub:focus-within > .cdp-sub,
.cod-nav .cdp-menu > li.cdp-con-sub.cdp-abierto > .cdp-sub {
  visibility: visible !important; opacity: 1 !important; transform: none !important;
  transition: opacity .18s ease, transform .18s ease, visibility 0s !important;
}
.cod-nav .cdp-menu > li.cdp-con-sub.cdp-cerrado > .cdp-sub { visibility: hidden !important; opacity: 0 !important; }
.cod-nav .cdp-sub > li { margin: 0 !important; }
.cod-nav .cdp-sub > li > a {
  display: flex !important; align-items: center !important; min-height: 44px !important; padding: 0 12px !important;
  border-radius: 8px !important; color: var(--cdp-carbon) !important; font-size: 14.5px !important; font-weight: 500 !important;
  text-decoration: none !important; white-space: nowrap !important; background: transparent !important;
  transition: background-color .18s ease !important;
}
.cod-nav .cdp-sub > li > a:hover { background: var(--cdp-arena) !important; color: var(--cdp-carbon) !important; }

/* ---------- Acciones: cuenta, carrito y botón ---------- */
.cod-nav .cod-actions a.cod-action-btn,
.cod-nav .cod-actions a.cod-action-btn[title="Mi cuenta"],
.cod-nav .cod-actions a.cdt-cab-carrito {
  width: 44px !important; height: 44px !important; min-width: 44px !important;
  color: var(--cdp-carbon) !important; background: var(--cdp-arena) !important;
  transition: background-color .18s ease !important;
}
.cod-nav .cod-actions a.cod-action-btn:hover, .cod-nav .cod-actions a.cdt-cab-carrito:hover { background: var(--cdp-borde) !important; color: var(--cdp-carbon) !important; }
.cod-nav .cod-actions a.cod-action-btn svg, .cod-nav .cod-actions a.cod-action-btn[title="Mi cuenta"] svg { color: var(--cdp-carbon) !important; }
.cod-nav .cod-actions a.cod-btn-cta {
  min-height: 44px !important; padding: 0 18px !important; border-radius: 10px !important;
  background: var(--cdp-naranja) !important; color: var(--cdp-carbon) !important;
  font-size: 14.5px !important; font-weight: 600 !important; box-shadow: none !important; transform: none !important;
  transition: background-color .18s ease !important;
}
.cod-nav .cod-actions a.cod-btn-cta:hover { background: var(--cdp-naranja-osc) !important; color: var(--cdp-carbon) !important; transform: none !important; box-shadow: none !important; }
.cod-nav .cod-actions button.cod-hamburger { min-width: 44px !important; min-height: 44px !important; }

/* Foco visible en toda la cabecera */
header .cod-nav a:focus-visible, header .cod-nav button:focus-visible,
#codMobileMenu a:focus-visible, #codMobileMenu button:focus-visible, #codMobileMenu summary:focus-visible {
  outline: 3px solid var(--cdp-carbon) !important; outline-offset: 2px !important; box-shadow: 0 0 0 5px #fff !important;
}

/* Anchos intermedios: seis entradas, cuenta, carrito y botón deben caber sin encimarse */
@media (min-width: 992px) {
  .cod-nav { gap: 12px !important; }
  .cod-nav .cod-actions { gap: 8px !important; }
}
@media (min-width: 992px) and (max-width: 1359px) {
  .cod-nav { padding-left: 16px !important; padding-right: 16px !important; gap: 8px !important; }
  .cod-nav .cdp-menu > li > a { padding: 0 7px !important; font-size: 13.5px !important; }
  .cod-nav .cdp-menu > li.cdp-con-sub > a { padding-right: 0 !important; }
  .cod-nav .cdp-sub-btn { width: 22px !important; min-width: 22px !important; }
  .cod-nav .cod-actions a.cod-btn-cta { padding: 0 12px !important; font-size: 13.5px !important; }
  .cod-nav .cod-actions { gap: 6px !important; }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .cod-nav .cod-logo-text { display: none !important; }
}
@media (min-width: 992px) and (max-width: 1079px) {
  .cod-nav .cod-actions a.cod-btn-cta { display: none !important; }
}

/* ---------- Menú del celular (contenido; el panel lo gobiernan el tema y la tienda) ---------- */
#codMobileMenu .cod-mobile-close { width: 44px !important; height: 44px !important; }
#codMobileMenu .cdp-movil { list-style: none !important; margin: 0 !important; padding: 0 !important; }
#codMobileMenu .cdp-movil > li { margin: 0 0 2px !important; }
#codMobileMenu .cdp-movil a, #codMobileMenu .cdp-movil summary {
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  min-height: 46px !important; padding: 0 12px !important; border-radius: 10px !important;
  color: var(--cdp-carbon) !important; font-size: 15.5px !important; font-weight: 500 !important;
  text-decoration: none !important; cursor: pointer !important; list-style: none !important;
  background: transparent !important; transition: background-color .18s ease !important;
}
#codMobileMenu .cdp-movil summary::-webkit-details-marker { display: none !important; }
#codMobileMenu .cdp-movil a:hover, #codMobileMenu .cdp-movil a:active,
#codMobileMenu .cdp-movil summary:hover { background: var(--cdp-arena) !important; color: var(--cdp-carbon) !important; }
#codMobileMenu .cdp-movil summary svg { flex-shrink: 0 !important; transition: transform .18s ease !important; }
#codMobileMenu .cdp-movil details[open] > summary svg { transform: rotate(180deg) !important; }
#codMobileMenu .cdp-movil details > ul { list-style: none !important; margin: 0 0 6px 12px !important; padding: 0 0 0 8px !important; border-left: 2px solid var(--cdp-borde) !important; }
#codMobileMenu .cdp-movil details > ul a { font-size: 15px !important; font-weight: 400 !important; min-height: 44px !important; }
#codMobileMenu .cdp-movil-sec {
  list-style: none !important; display: flex !important; flex-wrap: wrap !important; gap: 0 4px !important;
  margin: 10px 0 0 !important; padding: 10px 0 0 !important; border-top: 1px solid var(--cdp-borde) !important;
}
#codMobileMenu .cdp-movil-sec a {
  display: inline-flex !important; align-items: center !important; min-height: 44px !important; padding: 0 12px !important;
  color: var(--cdp-gris) !important; font-size: 14px !important; text-decoration: underline !important; text-underline-offset: 3px !important;
}
#codMobileMenu .cdp-movil-pie { display: flex !important; flex-direction: column !important; gap: 8px !important; margin-top: 12px !important; padding-top: 12px !important; border-top: 1px solid var(--cdp-borde) !important; }
#codMobileMenu .cdp-btn {
  display: flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
  min-height: 48px !important; padding: 0 14px !important; border-radius: 10px !important;
  font-size: 15px !important; font-weight: 600 !important; text-decoration: none !important; text-align: center !important;
  transition: background-color .18s ease !important;
}
#codMobileMenu .cdp-btn--borde { background: #fff !important; color: var(--cdp-carbon) !important; border: 1.5px solid var(--cdp-carbon) !important; }
#codMobileMenu .cdp-btn--accion { background: var(--cdp-naranja) !important; color: #fff !important; border: 0 !important; }
#codMobileMenu .cdp-btn--accion:hover { background: var(--cdp-naranja-osc) !important; }
#codMobileMenu .cdp-btn--wa { background: var(--cdp-wa) !important; color: var(--cdp-carbon) !important; border: 0 !important; }

/* El Directorio deja de flotar sobre los botones comerciales: queda en «Ayuda» y en el pie */
a.cod-dir-fab { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  header .cod-nav *, #codMobileMenu * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
  #codMobileMenu { transition: none !important; }
}
