/* WEB-PAST-UI-02H — Traditional menu classic line
   Objetivo: mantener franja verde 100%, pero llevar los textos del menú a una línea más tradicional.
   Importante: este archivo debe reemplazar el traditional.css vigente del paquete anterior.
*/

.wp-theme-layout-traditional {
  --wp-traditional-rail-bg: #88b8a7;
  --wp-traditional-rail-text: var(--wp-accent, #f54e8f);
  --wp-traditional-max-width: 1160px;
  --wp-traditional-radius: 4px;
}

.wp-theme-layout-traditional .wp-header {
  display: none;
}

.wp-theme-layout-traditional .wp-business-banner,
.wp-theme-layout-traditional .wp-banner,
.wp-theme-layout-traditional .wp-hero-banner {
  max-width: var(--wp-traditional-max-width);
  margin: 32px auto 28px;
  border-radius: var(--wp-traditional-radius);
  border: 1px solid color-mix(in srgb, var(--wp-primary) 20%, transparent);
  overflow: hidden;
  background: #fff;
}

.wp-theme-layout-traditional .wp-business-banner img,
.wp-theme-layout-traditional .wp-banner img,
.wp-theme-layout-traditional .wp-hero-banner img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}

/* Franja verde 100% pantalla */
.wp-theme-layout-traditional .wp-traditional-nav-rail {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: var(--wp-traditional-rail-bg);
  border-top: 1px solid color-mix(in srgb, var(--wp-traditional-rail-bg) 72%, #000 28%);
  border-bottom: 1px solid color-mix(in srgb, var(--wp-traditional-rail-bg) 72%, #000 28%);
  box-shadow: 0 10px 22px rgba(43, 26, 26, 0.06);
}

/* Contenido de la franja alineado al banner/contenido */
.wp-theme-layout-traditional .wp-traditional-nav-rail__inner {
  max-width: var(--wp-traditional-max-width);
  margin: 0 auto;
  min-height: 68px;
  padding: 0 18px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 20px;
}

.wp-theme-layout-traditional .wp-traditional-nav-rail__categories {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 26px;
  min-width: 0;
  flex-wrap: wrap;
}

/* Línea más tradicional: sin caja, sin subrayado, más sobria */
.wp-theme-layout-traditional .wp-traditional-nav-rail__link,
.wp-theme-layout-traditional .wp-traditional-nav-rail__categories a {
  appearance: none;
  border: 0;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
  padding: 0;
  color: var(--wp-traditional-rail-text);
  font-size: 15px;
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: .015em;
  text-decoration: none;
  white-space: nowrap;
}

.wp-theme-layout-traditional .wp-traditional-nav-rail__link:hover,
.wp-theme-layout-traditional .wp-traditional-nav-rail__categories a:hover {
  color: color-mix(in srgb, var(--wp-traditional-rail-text) 78%, #000 22%);
  text-decoration: none;
}

/* Ocultar etiqueta textual Categorías si existe */
.wp-theme-layout-traditional .wp-traditional-nav-rail__label,
.wp-theme-layout-traditional .wp-category-rail__label {
  display: none !important;
}

.wp-theme-layout-traditional .wp-traditional-cart-link {
  justify-self: end;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--wp-traditional-rail-text);
  box-shadow: none;
  text-decoration: none;
}

.wp-theme-layout-traditional .wp-traditional-cart-link svg,
.wp-theme-layout-traditional .wp-traditional-cart-link .wp-icon,
.wp-theme-layout-traditional .wp-traditional-cart-link [aria-hidden="true"] {
  color: currentColor;
  fill: none;
  stroke: currentColor;
}

.wp-theme-layout-traditional .wp-traditional-cart-link .wp-cart-badge,
.wp-theme-layout-traditional .wp-cart-badge {
  background: var(--wp-primary);
  color: #fff;
  border-radius: 999px;
  min-width: 18px;
  height: 18px;
  font-size: 11px;
  line-height: 18px;
  text-align: center;
  transform: translate(-4px, -12px);
}

.wp-theme-layout-traditional .wp-traditional-hero,
.wp-theme-layout-traditional .wp-hero,
.wp-theme-layout-traditional .wp-home-hero {
  display: none;
}

.wp-theme-layout-traditional .wp-products-section,
.wp-theme-layout-traditional .wp-featured-products,
.wp-theme-layout-traditional .wp-section-products {
  max-width: var(--wp-traditional-max-width);
  margin: 56px auto 0;
  padding: 0 18px;
}

.wp-theme-layout-traditional .wp-product-card,
.wp-theme-layout-traditional .wp-card,
.wp-theme-layout-traditional .wp-product {
  border-radius: var(--wp-traditional-radius);
}

.wp-theme-layout-traditional .wp-product-card a,
.wp-theme-layout-traditional .wp-product-card button,
.wp-theme-layout-traditional .wp-button,
.wp-theme-layout-traditional .wp-btn {
  border-radius: var(--wp-traditional-radius);
}

@media (max-width: 768px) {
  .wp-theme-layout-traditional .wp-business-banner,
  .wp-theme-layout-traditional .wp-banner,
  .wp-theme-layout-traditional .wp-hero-banner {
    margin: 18px 14px 18px;
  }

  .wp-theme-layout-traditional .wp-traditional-nav-rail__inner {
    min-height: auto;
    padding: 14px 14px;
    grid-template-columns: 1fr auto;
  }

  .wp-theme-layout-traditional .wp-traditional-nav-rail__categories {
    justify-content: flex-start;
    gap: 18px;
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
  }

  .wp-theme-layout-traditional .wp-traditional-nav-rail__link,
  .wp-theme-layout-traditional .wp-traditional-nav-rail__categories a {
    font-size: 14px;
  }
}

/* WEB-PAST-UI-02I — ajuste menor menú tradicional.
   Objetivo: agrandar texto del menú superior y eliminar línea/borde de la franja. */
.wp-theme-layout-traditional .wp-traditional-nav-rail {
    border-top: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

.wp-theme-layout-traditional .wp-traditional-nav-rail__link {
    font-size: 16px !important;
    font-weight: 800 !important;
    letter-spacing: 0.02em !important;
}

.wp-theme-layout-traditional .wp-traditional-cart-link {
    border: 0 !important;
    box-shadow: none !important;
}


/* WEB-PAST-UI-02I — menú traditional final.
   Texto superior más visible y sin líneas/bordes en la franja. */
.wp-theme-layout-traditional .wp-traditional-nav-rail {
    border-top: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

.wp-theme-layout-traditional .wp-traditional-nav-rail__link {
    font-size: 20px !important;
    font-weight: 800 !important;
    letter-spacing: 0.01em !important;
    text-decoration: none !important;
}

.wp-theme-layout-traditional .wp-traditional-cart-link {
    border: 0 !important;
    box-shadow: none !important;
    text-decoration: none !important;
}


/* WEB-PAST-UI-02J — alinear sección productos con borde del banner.
   El título "Productos por categoría" y el contenido inferior respetan
   el mismo ancho visual del banner superior. */
.wp-theme-layout-traditional .wp-traditional-products,
.wp-theme-layout-traditional .wp-products-section,
.wp-theme-layout-traditional .wp-featured-products,
.wp-theme-layout-traditional .wp-home-products {
    width: min(100% - 48px, 1160px) !important;
    max-width: 1160px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.wp-theme-layout-traditional .wp-traditional-products__heading,
.wp-theme-layout-traditional .wp-section-heading,
.wp-theme-layout-traditional .wp-products-heading {
    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* WEB-PAST-UI-02L — carrito más visible en barra traditional */
.wp-theme-layout-traditional .wp-traditional-cart-link {
    font-size: 34px !important;
    line-height: 1 !important;
    min-width: 54px !important;
    min-height: 54px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--wp-accent, #F54E8F) !important;
}

.wp-theme-layout-traditional .wp-traditional-cart-link svg,
.wp-theme-layout-traditional .wp-traditional-cart-link .wp-cart-icon {
    width: 34px !important;
    height: 34px !important;
}

.wp-theme-layout-traditional .wp-traditional-cart-link .wp-cart-badge {
    font-size: 13px !important;
    min-width: 22px !important;
    height: 22px !important;
    line-height: 22px !important;
}


/* WEB-CAT-PUBLIC-01D — active virtual category in traditional rail */
.wp-theme-layout-traditional .wp-traditional-nav-rail__link.is-active {
  text-decoration: underline;
  text-underline-offset: 6px;
}

/* WEB-PAST-PDP-01B — PDP traditional corporate polish */
.wp-theme-layout-traditional .wp-product-detail,
.wp-theme-layout-traditional .wp-product-page,
.wp-theme-layout-traditional .wp-product-layout {
  margin-top: 52px;
}

.wp-theme-layout-traditional .wp-product-detail {
  align-items: flex-start;
}

.wp-theme-layout-traditional .wp-product-media,
.wp-theme-layout-traditional .wp-product-summary,
.wp-theme-layout-traditional .wp-product-info,
.wp-theme-layout-traditional .wp-product-panel {
  border-radius: 28px;
}

.wp-theme-layout-traditional .wp-product-summary .wp-badge,
.wp-theme-layout-traditional .wp-product-summary .wp-pill,
.wp-theme-layout-traditional .wp-product-summary .wp-product-badges,
.wp-theme-layout-traditional .wp-product-summary .wp-product-price-pill,
.wp-theme-layout-traditional .wp-product-summary .wp-product-trust,
.wp-theme-layout-traditional .wp-product-summary .wp-product-meta-pills {
  display: none !important;
}

/* Ocultar bloque informativo de formatos si alguna variante quedó en HTML */
.wp-theme-layout-traditional .wp-product-formats-summary,
.wp-theme-layout-traditional .wp-product-available-formats,
.wp-theme-layout-traditional .wp-product-summary-card:has(h2:first-child:is(:contains("Formatos disponibles"))) {
  display: none !important;
}

/* Opciones formato / variedad como cards */
.wp-theme-layout-traditional .wp-option-list,
.wp-theme-layout-traditional .wp-product-options,
.wp-theme-layout-traditional .wp-format-options,
.wp-theme-layout-traditional .wp-variant-options {
  display: grid;
  gap: 12px;
}

.wp-theme-layout-traditional .wp-option,
.wp-theme-layout-traditional .wp-format-option,
.wp-theme-layout-traditional .wp-variant-option,
.wp-theme-layout-traditional label:has(input[type="radio"]) {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 54px;
  padding: 14px 18px;
  border: 1px solid rgba(122, 30, 58, .18);
  border-radius: 18px;
  background: #fff;
  color: #2B1A1A;
  box-shadow: 0 10px 28px rgba(122, 30, 58, .05);
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.wp-theme-layout-traditional label:has(input[type="radio"]:checked),
.wp-theme-layout-traditional .wp-option.is-selected,
.wp-theme-layout-traditional .wp-format-option.is-selected,
.wp-theme-layout-traditional .wp-variant-option.is-selected {
  border-color: #7A1E3A;
  background: linear-gradient(135deg, #fff, #fff6f8);
  box-shadow: 0 14px 34px rgba(122, 30, 58, .14);
}

.wp-theme-layout-traditional label:has(input[type="radio"]:checked)::after,
.wp-theme-layout-traditional .wp-option.is-selected::after,
.wp-theme-layout-traditional .wp-format-option.is-selected::after,
.wp-theme-layout-traditional .wp-variant-option.is-selected::after {
  content: "✓";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: #7A1E3A;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  flex: 0 0 auto;
}

.wp-theme-layout-traditional label:has(input[type="radio"]) input[type="radio"],
.wp-theme-layout-traditional .wp-option input[type="radio"],
.wp-theme-layout-traditional .wp-format-option input[type="radio"],
.wp-theme-layout-traditional .wp-variant-option input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.wp-theme-layout-traditional label:has(input[type="radio"]):hover,
.wp-theme-layout-traditional .wp-option:hover,
.wp-theme-layout-traditional .wp-format-option:hover,
.wp-theme-layout-traditional .wp-variant-option:hover {
  transform: translateY(-1px);
  border-color: rgba(122, 30, 58, .42);
}

.wp-theme-layout-traditional .wp-product-actions,
.wp-theme-layout-traditional .wp-product-cart-actions {
  border-radius: 22px;
  background: #fff8f2;
  border: 1px solid rgba(122, 30, 58, .14);
}

@media (max-width: 760px) {
  .wp-theme-layout-traditional .wp-product-detail,
  .wp-theme-layout-traditional .wp-product-page,
  .wp-theme-layout-traditional .wp-product-layout {
    margin-top: 28px;
  }
}

/* WEB-PAST-PDP-01C — title divider instead of price pill */
.wp-theme-layout-traditional .wp-product-title-divider {
  width: 100%;
  height: 1px;
  margin: 18px 0 22px;
  background: linear-gradient(
    90deg,
    rgba(122, 30, 58, 0.26),
    rgba(246, 232, 216, 0.95),
    rgba(122, 30, 58, 0.04)
  );
}

.wp-theme-layout-traditional .wp-product-summary .wp-price-pill,
.wp-theme-layout-traditional .wp-product-summary .wp-product-price-pill,
.wp-theme-layout-traditional .wp-product-summary .wp-product-price,
.wp-theme-layout-traditional .wp-product-summary .wp-product-from-price {
  display: none !important;
}

/* WEB-PAST-CHECKOUT-HEADER-01 — transactional pages */
.wp-theme-layout-traditional .wp-cart-page,
.wp-theme-layout-traditional .wp-cart-shell,
.wp-theme-layout-traditional .wp-checkout-page,
.wp-theme-layout-traditional .wp-checkout-shell {
  max-width: 1180px;
  margin: 54px auto 0;
  padding: 0 24px;
}

.wp-theme-layout-traditional .wp-cart-page,
.wp-theme-layout-traditional .wp-checkout-page {
  border-radius: 32px;
  border: 1px solid rgba(122, 30, 58, .14);
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 28px 70px rgba(122, 30, 58, .10);
}

.wp-theme-layout-traditional .wp-cart-page h1,
.wp-theme-layout-traditional .wp-checkout-page h1 {
  color: #2B1A1A;
  letter-spacing: -0.04em;
}

.wp-theme-layout-traditional .wp-cart-page .wp-eyebrow,
.wp-theme-layout-traditional .wp-checkout-page .wp-eyebrow {
  color: #7A1E3A;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-weight: 900;
}

.wp-theme-layout-traditional .wp-cart-page p,
.wp-theme-layout-traditional .wp-checkout-page p {
  color: #7B6666;
  line-height: 1.6;
}

.wp-theme-layout-traditional .wp-cart-page .wp-button-primary,
.wp-theme-layout-traditional .wp-checkout-page .wp-button-primary {
  background: #7A1E3A;
  color: #fff;
  border-color: #7A1E3A;
  box-shadow: 0 16px 36px rgba(122, 30, 58, .20);
}

.wp-theme-layout-traditional .wp-cart-page .wp-button-secondary,
.wp-theme-layout-traditional .wp-checkout-page .wp-button-secondary {
  background: #fff;
  color: #7A1E3A;
  border: 1px solid rgba(122, 30, 58, .20);
}

@media (max-width: 760px) {
  .wp-theme-layout-traditional .wp-cart-page,
  .wp-theme-layout-traditional .wp-cart-shell,
  .wp-theme-layout-traditional .wp-checkout-page,
  .wp-theme-layout-traditional .wp-checkout-shell {
    margin-top: 28px;
    padding: 0 16px;
  }
}

/* WEB-PAST-CHECKOUT-01B — checkout without lock hero */
.wp-theme-layout-traditional .wp-checkout-minimal {
  max-width: 1180px;
  margin: 54px auto 0;
  padding: 0 24px;
}

.wp-theme-layout-traditional .wp-checkout-minimal__hero {
  display: block;
  padding: 36px 42px;
  margin-bottom: 26px;
  border-radius: 30px;
  border: 1px solid rgba(122, 30, 58, .14);
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 24px 60px rgba(122, 30, 58, .08);
}

.wp-theme-layout-traditional .wp-checkout-minimal__brand-card {
  display: none !important;
}

.wp-theme-layout-traditional .wp-checkout-minimal__hero h1 {
  color: #2B1A1A;
  letter-spacing: -0.04em;
}

.wp-theme-layout-traditional .wp-checkout-minimal__hero p {
  max-width: 760px;
  color: #7B6666;
  line-height: 1.6;
}

.wp-theme-layout-traditional .wp-checkout-minimal__grid {
  gap: 24px;
}

.wp-theme-layout-traditional .wp-form-status[data-status="warning"] {
  border-radius: 16px;
  border: 1px solid rgba(122, 30, 58, .18);
  background: #fff8f2;
  color: #7A1E3A;
  padding: 12px 16px;
  margin-bottom: 18px;
}

@media (max-width: 760px) {
  .wp-theme-layout-traditional .wp-checkout-minimal {
    margin-top: 28px;
    padding: 0 16px;
  }

  .wp-theme-layout-traditional .wp-checkout-minimal__hero {
    padding: 24px 20px;
  }
}