/*
Theme Name: Whānau Karibe
Theme URI: https://whanaukaribe.cu
Author: Whānau Karibe
Description: Tema personalizado para la tienda Whānau Karibe.
Version: 2.3.2
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 8.0
License: Proprietary
Text Domain: whanau
*/

/* ── Variables ─────────────────────────────────────────────────────────── */
:root {
    --color-primary:    #3D4154;
    --color-gold:       #EEB128;
    --color-gold-dark:  #D49B1A;
    --color-bg:         #ffffff;
    --color-bg-light:   #f5f5f5;
    --color-text:       #3D4154;
    --color-text-muted: #888888;
    --color-border:     #e0e0e0;
    --color-white:      #ffffff;

    --font-base:   'Inter', system-ui, -apple-system, sans-serif;
    --font-size:   16px;
    --line-height: 1.6;

    --radius:   8px;
    --radius-sm: 4px;
    --shadow:   0 2px 8px rgba(0,0,0,0.08);
    --shadow-md: 0 4px 16px rgba(0,0,0,0.12);

    --header-top-height: 92px;
    --header-nav-height: 56px;
    --container-width:   1248px;
    --container-pad:     20px;
}

/* ── Reset ─────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: var(--font-size); scroll-behavior: smooth; }
body {
    font-family: var(--font-base);
    color: var(--color-text);
    background: var(--color-bg);
    line-height: var(--line-height);
    -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
a:hover { color: var(--color-gold); }
img { max-width: 100%; height: auto; display: block; }
ul, ol { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }

/* ── Contenedor ────────────────────────────────────────────────────────── */
.whanau-container {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 var(--container-pad);
}

/* ═══════════════════════════════════════════════════════════════════════
   HEADER
═══════════════════════════════════════════════════════════════════════ */
.whanau-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: var(--color-white);
    width: 100%;
    overflow: visible;
}

/* — Fila superior — */
.whanau-header__top {
    height: var(--header-top-height);
    display: flex;
    align-items: center;
    gap: 24px;
    padding: 0 var(--container-pad) 20px;
    max-width: var(--container-width);
    margin: 0 auto;
    width: 100%;
    position: relative;
    z-index: 2;
    background: var(--color-white);
}

/* Logo */
.whanau-header__logo {
    flex-shrink: 0;
}
.whanau-header__logo a {
    display: flex;
    align-items: center;
}
.whanau-header__logo img {
    height: 40px;
    width: auto;
}
.whanau-logo-text {
    font-size: 26px;
    font-weight: 700;
    letter-spacing: -0.5px;
    line-height: 1;
}
.whanau-logo-text span:first-child { color: var(--color-primary); }
.whanau-logo-text span:last-child  { color: var(--color-gold); }

/* Buscador */
.whanau-header__search {
    flex: 1;
    max-width: 400px;
    margin: 0 auto;
}
.whanau-search-form {
    display: flex;
    align-items: center;
    border: 1px solid var(--color-gold);
    border-radius: var(--radius);
    overflow: hidden;
    background: var(--color-white);
}
.whanau-search-form input {
    flex: 1;
    border: none;
    outline: none;
    padding: 9px 14px;
    font-size: 14px;
    font-family: var(--font-base);
    color: var(--color-text);
    background: transparent;
}
.whanau-search-form input::placeholder { color: var(--color-text-muted); }
.whanau-search-form button {
    width: 40px;
    height: 38px;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: opacity 0.2s;
}
.whanau-search-form button:hover { opacity: 0.75; }
.whanau-search-form button svg {
    width: 18px;
    height: 18px;
    stroke: var(--color-text);
    fill: none;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Acciones (carrito, cuenta) */
.whanau-header__actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}
.whanau-header__action-btn {
    width: 36px;
    height: 36px;
    background: var(--color-gold);
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: background 0.2s;
    text-decoration: none;
    flex-shrink: 0;
}
.whanau-header__action-btn:hover { background: var(--color-gold-dark); color: var(--color-white); }
.whanau-header__action-btn svg {
    width: 17px;
    height: 17px;
    stroke: var(--color-white);
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.whanau-header__cart-count {
    position: absolute;
    top: -7px;
    right: -7px;
    background: var(--color-primary);
    color: var(--color-white);
    font-size: 10px;
    font-weight: 700;
    min-width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: 0 3px;
}
.whanau-header__account-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
}
/* ── Página de Registro ────────────────────────────────────────────────── */
.wk-reg {
    max-width: 860px;
    margin: 0 auto;
    padding: 20px 24px 32px;
}
.wk-reg__head {
    margin-bottom: 14px;
}
.wk-reg__title {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-text);
    margin: 0 0 2px;
}
.wk-reg__subtitle {
    font-size: 14px;
    color: #6b7280;
    margin: 0;
}
.wk-reg__box {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 20px 28px;
}
.wk-reg__form {}
.wk-reg__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 20px;
    margin-bottom: 10px;
}
.wk-reg__row--single {
    grid-template-columns: 1fr;
    max-width: calc(50% - 10px);
}
.wk-field__hint {
    display: block;
    font-size: 11px;
    color: #9ca3af;
    margin-top: 2px;
}
.wk-req {
    color: #ef4444;
    font-weight: 600;
}
/* Teléfono con código de país */
.wk-phone {
    display: flex;
    align-items: stretch;
    gap: 0;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    overflow: hidden;
}
.wk-phone:focus-within {
    border-color: var(--color-gold);
    box-shadow: 0 0 0 3px rgba(196,163,66,.15);
}
.wk-phone__code {
    background: #f9fafb;
    border: none;
    border-right: 1px solid #d1d5db;
    padding: 0 6px;
    font-size: 13px;
    font-family: monospace;
    color: var(--color-text);
    cursor: pointer;
    outline: none;
    width: 108px;
    min-width: 108px;
}
.wk-phone .wk-field__input.wk-phone__input {
    border: none;
    border-radius: 0;
    box-shadow: none;
    flex: 1;
}
.wk-phone .wk-field__input.wk-phone__input:focus {
    border-color: transparent;
    box-shadow: none;
}
.wk-reg__submit-row {
    display: flex;
    justify-content: flex-end;
    margin-top: 14px;
}
.wk-reg__btn {
    min-width: 120px;
}
.wk-reg__privacy {
    margin-top: 12px;
    text-align: center;
    font-size: 14px;
    color: #6b7280;
}
.wk-reg__privacy a {
    color: var(--color-text);
    font-weight: 600;
    text-decoration: underline;
}

/* Registro standalone (versión anterior — mantener por compatibilidad) */
.wk-auth-solo {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 60px 20px;
    min-height: 60vh;
}
.wk-auth-solo .wk-auth__card {
    width: 100%;
    max-width: 480px;
}
/* Google button placeholder cuando plugin no está configurado */
.wk-google-btn--pending { opacity: .75; }

.wk-auth__switch {
    margin-top: 20px;
    text-align: center;
    font-size: 14px;
    color: #6b7280;
}
.wk-auth__switch a {
    color: var(--color-gold);
    font-weight: 500;
}

.whanau-header__account-links {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
}
.whanau-header__account-link {
    font-size: 13px;
    font-weight: 500;
    color: var(--color-text);
    white-space: nowrap;
    line-height: 1.3;
}
.whanau-header__account-link--register {
    font-size: 12px;
    font-weight: 400;
    color: var(--color-gold);
}
.whanau-header__account-link:hover { color: var(--color-gold); }
.whanau-header__account-link--register:hover { opacity: 0.8; }

/* — Barra de navegación — */
.whanau-header__nav-bar {
    position: absolute;
    bottom: calc(-1 * var(--header-nav-height) + 25px);
    left: 0;
    right: 0;
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 var(--container-pad);
    z-index: 3;
}
.whanau-header__nav-inner {
    padding: 0;
    display: flex;
    align-items: center;
    height: var(--header-nav-height);
    background: var(--color-primary);
    border-radius: 6px;
    overflow: hidden;
    width: 100%;
}
.whanau-nav__list {
    display: flex;
    align-items: stretch;
    width: 100%;
    justify-content: space-between;
    height: var(--header-nav-height);
}
.whanau-nav__list > li {
    position: relative;
    display: flex;
    align-items: stretch;
    flex: 1;
    justify-content: center;
}
.whanau-nav__list > li:first-child { border-radius: 6px 0 0 6px; overflow: hidden; }
.whanau-nav__list > li:last-child  { border-radius: 0 6px 6px 0; overflow: hidden; }

.whanau-nav__list > li > a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 16px;
    width: 100%;
    color: var(--color-white);
    font-size: 16px;
    font-weight: 500;
    font-family: 'Inter', sans-serif;
    transition: background 0.2s;
    white-space: nowrap;
}
.whanau-nav__list > li > a:hover {
    background: rgba(255,255,255,0.1);
    color: var(--color-white);
}
.whanau-nav__list > li.current-menu-item > a,
.whanau-nav__list > li.current-menu-ancestor > a {
    background: var(--color-gold);
    color: var(--color-white);
}

/* Flecha dropdown */
.whanau-nav__list > li.menu-item-has-children > a::after {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    margin-left: 4px;
}

/* Submenú */
.whanau-nav__list .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    background: var(--color-primary);
    border-top: 3px solid var(--color-gold);
    box-shadow: var(--shadow-md);
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: all 0.2s;
    z-index: 100;
    border-radius: 0 0 var(--radius-sm) var(--radius-sm);
}
.whanau-nav__list li:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.whanau-nav__list .sub-menu li a {
    height: auto;
    padding: 11px 18px;
    border-bottom: 1px solid rgba(255,255,255,0.07);
}
.whanau-nav__list .sub-menu li:last-child a { border-bottom: none; }

/* ── Botones globales ───────────────────────────────────────────────────── */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 11px 24px;
    border-radius: var(--radius);
    font-size: 14px;
    font-weight: 600;
    font-family: var(--font-base);
    cursor: pointer;
    transition: all 0.2s;
    border: 2px solid transparent;
    text-decoration: none;
    line-height: 1;
}
.btn-primary {
    background: var(--color-gold);
    color: var(--color-white);
    border-color: var(--color-gold);
}
.btn-primary:hover {
    background: var(--color-gold-dark);
    border-color: var(--color-gold-dark);
    color: var(--color-white);
}
.btn-dark {
    background: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
}
.btn-dark:hover {
    background: #2e3144;
    border-color: #2e3144;
    color: var(--color-white);
}
.btn-outline {
    background: transparent;
    color: var(--color-primary);
    border-color: var(--color-primary);
}
.btn-outline:hover {
    background: var(--color-primary);
    color: var(--color-white);
}

/* ── Main ───────────────────────────────────────────────────────────────── */
.whanau-main {
    min-height: 60vh;
}

/* ═══════════════════════════════════════════════════════════════════════
   HERO
═══════════════════════════════════════════════════════════════════════ */
.hero {
    position: relative;
    min-height: 650px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url('images/hero-bg.png'); /* fallback; se sobreescribe desde Apariencia → Personalizar */
    background-size: cover;
    background-position: center center;

    overflow: hidden;
    margin-top: 0;
}
.hero__overlay { display: none; }
.hero__inner {
    position: relative;
    z-index: 1;
    padding: 72px 20px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.hero__title {
    font-size: clamp(28px, 4vw, 52px);
    font-weight: 700;
    color: var(--color-white);
    line-height: 1.15;
    letter-spacing: 1px;
    margin-bottom: 20px;
    text-transform: uppercase;
    text-shadow: 0 2px 12px rgba(0,0,0,0.45);
}
.hero__title span { color: var(--color-gold); }
.hero__subtitle {
    font-size: 16px;
    font-weight: 400;
    color: var(--color-white);
    line-height: 1.7;
    margin-bottom: 36px;
    max-width: 640px;
    text-shadow: 0 1px 6px rgba(0,0,0,0.5);
}
.hero__cta {
    font-size: 16px;
    padding: 14px 40px;
}
.hero__google-login {
    margin-top: 16px;
    max-width: 260px;
}
.hero__google-login .gaur-sep {
    color: rgba(255,255,255,0.7);
}
.hero__google-login .gaur-sep::before,
.hero__google-login .gaur-sep::after {
    background: rgba(255,255,255,0.4);
}

/* ── Sección Info ────────────────────────────────────────────────────────── */
.home-info {
    padding: 80px 0;
    background: var(--color-white);
}
.home-info__container {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 var(--container-pad);
    display: flex;
    align-items: center;
    gap: 60px;
}
.home-info__image {
    flex: 0 0 48%;
    max-width: 48%;
}
.home-info__image img {
    width: 100%;
    height: 420px;
    object-fit: cover;
    border-radius: 4px;
    display: block;
    border: 1px solid var(--color-primary);
}
.home-info__image--placeholder {
    width: 100%;
    height: 420px;
    background: #ddd;
    border-radius: 4px;
}
.home-info__content {
    flex: 1;
    min-width: 0;
}
.home-info__title {
    font-size: 42px;
    font-weight: 800;
    color: var(--color-text);
    margin-bottom: 28px;
    letter-spacing: 0.01em;
    line-height: 1.1;
}
.home-info__text {
    margin-bottom: 32px;
}
.home-info__text p {
    font-size: 18px;
    font-weight: 400;
    color: #444;
    line-height: 1.4;
    margin-bottom: 18px;
}
.home-info__text p:last-child { margin-bottom: 0; }

/* ── Sección Servicios ───────────────────────────────────────────────────── */
.home-services {
    padding: 80px 0;
    background: #f9f9f9;
}
.home-services__container {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 var(--container-pad);
}
.home-services__title {
    font-size: 24px;
    font-weight: 700;
    text-align: center;
    color: var(--color-text);
    margin-bottom: 40px;
    letter-spacing: 0.04em;
}
.home-services__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}
.service-card {
    background: var(--color-white);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,0.07);
    display: flex;
    flex-direction: column;
}
.service-card__img {
    width: 100%;
    aspect-ratio: 16/10;
    overflow: hidden;
}
.service-card__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}
.service-card:hover .service-card__img img {
    transform: scale(1.04);
}
.service-card__img--placeholder {
    background: linear-gradient(135deg, #e8e6e0 0%, #d4d0c8 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}
.service-card__img--placeholder::after {
    content: '';
    width: 48px;
    height: 48px;
    background: rgba(255,255,255,.5);
    border-radius: 50%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='1.5'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='8.5' cy='8.5' r='1.5'/%3E%3Cpath d='M21 15l-5-5L5 21'/%3E%3C/svg%3E");
    background-size: 28px;
    background-repeat: no-repeat;
    background-position: center;
}
.service-card__body {
    padding: 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.service-card__title {
    font-size: 16px;
    font-weight: 700;
    color: var(--color-text);
    margin-bottom: 10px;
}
.service-card__excerpt {
    font-size: 13px;
    color: #666;
    line-height: 1.6;
    flex: 1;
    margin-bottom: 16px;
}
.service-card__link {
    font-size: 13px;
    font-weight: 700;
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-decoration: none;
    transition: color 0.2s;
}
.service-card__link:hover { color: var(--color-gold); }

/* ── Sección Objetivos ───────────────────────────────────────────────────── */
.home-objetivos {
    padding: 80px 0 0;
    background: var(--color-white);
}
.home-objetivos__title {
    font-size: 44px;
    font-weight: 800;
    color: var(--color-text);
    text-align: center;
    margin-bottom: 50px;
    letter-spacing: 0.03em;
    max-width: var(--container-width);
    margin-left: auto;
    margin-right: auto;
    padding: 0 var(--container-pad);
}
.home-objetivos__container {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 var(--container-pad);
    display: flex;
    align-items: stretch;
    gap: 40px;
}
.home-objetivos__content {
    flex: 0 0 48%;
    max-width: 48%;
    padding-bottom: 60px;
}
.home-objetivos__image {
    flex: 1;
    min-width: 0;
    min-height: 580px;
    display: flex;
    align-items: stretch;
    overflow: hidden;
    border-radius: 4px;
}
.home-objetivos__image img {
    width: 100%;
    display: block;
    object-fit: cover;
    object-position: center center;
}
.home-objetivos__image--placeholder {
    width: 100%;
    min-height: 500px;
    background: #ddd;
    border-radius: 4px;
}
.objetivos-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.objetivos-list__item {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}
.objetivos-list__num {
    font-size: 52px;
    font-weight: 800;
    color: var(--color-primary);
    line-height: 1;
    min-width: 80px;
    position: relative;
    text-align: center;
}
.objetivos-list__num::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 68px;
    height: 36px;
    background: var(--color-gold);
    opacity: 0.35;
    z-index: 0;
    border-radius: 2px;
}
.objetivos-list__num span {
    position: relative;
    z-index: 1;
}
.objetivos-list__item p {
    font-size: 15px;
    color: #444;
    line-height: 1.7;
    margin: 0;
    padding-top: 8px;
}

/* ── Sección Info — variante invertida (Feature) ─────────────────────────── */
.home-info--reverse { background: #f9f9f9; }

/* ── Sección Banner/Publicidad ───────────────────────────────────────────── */
.home-banner {
    padding: 40px 0;
}
.home-banner__container {
    max-width: 1248px;
    margin: 0 auto;
    padding: 0 var(--container-pad);
}
.home-banner__slider {
    width: 100%;
    height: 240px;
    position: relative;
    overflow: hidden;
    border-radius: 6px;
    cursor: grab;
    user-select: none;
}
.home-banner__slider:active { cursor: grabbing; }
.home-banner__slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.home-banner__slide picture,
.home-banner__slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    pointer-events: none;
    user-select: none;
    -webkit-user-drag: none;
}
.home-banner__slide picture { display: contents; }
.home-banner__placeholder {
    width: 100%;
    height: 240px;
    background: #e0dfd9;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #999;
    font-size: 14px;
}

/* ── Sección Marcas ──────────────────────────────────────────────────────── */
.home-marcas {
    padding: 60px 0;
    background: var(--color-white);
}
.home-marcas__container {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 var(--container-pad);
}
.home-marcas__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 32px;
}
.home-marcas__title {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-text);
}
.home-marcas__arrows {
    display: flex;
    gap: 8px;
}
.marcas-arrow {
    width: 36px;
    height: 36px;
    border: 1px solid #ccc;
    border-radius: 50%;
    background: var(--color-white);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s, border-color 0.2s;
}
.marcas-arrow:hover {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-white);
}
.marcas-track-wrapper {
    overflow: hidden;
    cursor: pointer;
}
.marcas-track {
    display: flex;
    align-items: center;
    gap: 20px;
    will-change: transform;
}
.marca-item {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px 0;
}
.marca-item img {
    width: 100%;
    max-height: 60px;
    object-fit: contain;
    filter: grayscale(100%);
    opacity: 0.65;
    transition: filter 0.3s, opacity 0.3s;
    display: block;
}
.marca-item:hover img {
    filter: grayscale(0%);
    opacity: 1;
}
.marca-item__name {
    font-size: 20px;
    font-weight: 800;
    color: #999;
    letter-spacing: 0.03em;
    white-space: nowrap;
    transition: color 0.3s;
}
.marca-item:hover .marca-item__name {
    color: var(--color-primary);
}

/* ── WhatsApp flotante ───────────────────────────────────────────────────── */
.whatsapp-float {
    position: fixed;
    bottom: 28px;
    right: 28px;
    z-index: 9999;
    width: 56px;
    height: 56px;
    background: #25d366;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(0,0,0,0.2);
    transition: transform 0.2s, box-shadow 0.2s;
    text-decoration: none;
}
.whatsapp-float--hidden { display: none !important; }
.whatsapp-float:hover {
    transform: scale(1.1);
    box-shadow: 0 6px 20px rgba(0,0,0,0.3);
}
.whatsapp-float svg {
    width: 30px;
    height: 30px;
    fill: #fff;
}

/* ── Páginas interiores (base) ───────────────────────────────────────────── */
.whanau-page { padding-bottom: 80px; }
.whanau-page__container {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 var(--container-pad);
}

/* Espacio global entre navbar y primer elemento de páginas interiores */
.whanau-container,
.woocommerce-breadcrumb,
.woocommerce .woocommerce-notices-wrapper:first-child,
body:not(.home) .whanau-main > *:first-child:not(.hero):not(.whanau-page) {
    margin-top: 48px;
}

/* Breadcrumb */
.whanau-breadcrumb {
    font-size: 14px;
    color: #888;
    margin-bottom: 28px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.whanau-breadcrumb a { color: #888; }
.whanau-breadcrumb a:hover { color: var(--color-primary); }
.whanau-breadcrumb__sep { color: #ccc; }
/* Ocultar breadcrumb en login/registro (usuario no logueado) */
body.woocommerce-account.logged-out .whanau-breadcrumb { display: none; }
.whanau-breadcrumb > span:last-child:not(.whanau-breadcrumb__sep),
.whanau-breadcrumb .breadcrumb_last {
    color: var(--color-gold);
    font-weight: 600;
}

/* Título de sección */
.pagos-section__title,
.pagos-historial__title {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-text);
    margin-bottom: 20px;
}

/* ── Métodos de Pago ─────────────────────────────────────────────────────── */
.pagos-metodos { margin-bottom: 48px; }
.pagos-metodos__logos {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}
.pagos-metodos__item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px 28px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    background: #fff;
    min-width: 160px;
}
.pagos-metodos__item img {
    height: 56px;
    width: auto;
    max-width: 160px;
    display: block;
    object-fit: contain;
}
.pagos-metodos__name {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text);
}
.pagos-empty-small { font-size: 14px; color: #999; }

/* ── Historial de Transacciones ──────────────────────────────────────────── */
.pagos-historial { }
.pagos-table-wrap {
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    overflow: hidden;
}
.pagos-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}
.pagos-table thead tr {
    background: #f7f7f7;
    border-bottom: 1px solid #e8e8e8;
}
.pagos-table th {
    padding: 14px 20px;
    font-weight: 700;
    color: var(--color-text);
    text-align: left;
}
.pagos-table th:nth-child(3),
.pagos-table td:nth-child(3) { text-align: center; }
.pagos-table th:nth-child(4),
.pagos-table td:nth-child(4) { text-align: right; }
.pagos-table tbody tr {
    border-bottom: 1px solid #f0f0f0;
    transition: background 0.15s;
}
.pagos-table tbody tr:last-child { border-bottom: none; }
.pagos-table tbody tr:hover { background: #fafafa; }
.pagos-table td {
    padding: 16px 20px;
    color: #444;
    vertical-align: middle;
}
.pagos-table__product { font-weight: 500; color: var(--color-text); }
.pagos-table__date    { color: #777; }
.pagos-table__amount  { font-weight: 500; letter-spacing: 0.02em; }
.pagos-table__status  { text-align: right; }

/* Badges de estado */
.pagos-status {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    border: 1px solid currentColor;
    white-space: nowrap;
}
.status--pending    { color: #c47d00; border-color: #c47d00; }
.status--processing { color: #888;    border-color: #ccc; }
.status--completed  { color: #2a8a4a; border-color: #2a8a4a; }
.status--cancelled  { color: #888;    border-color: #ccc; }
.status--refunded   { color: #c0392b; border-color: #c0392b; }
.status--default    { color: #888;    border-color: #ccc; }

.pagos-empty {
    color: #999;
    font-size: 15px;
    padding: 40px 0;
    text-align: center;
}

/* ══════════════════════════════════════════════════════════════════════════
   ZONA PRO
══════════════════════════════════════════════════════════════════════════ */

/* — Secciones — */
.zona-section { margin-bottom: 56px; }
.zona-section__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    gap: 16px;
}
.zona-section__title {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-text);
}

/* — Filtro de categoría — */
.zona-filter-form select {
    padding: 8px 12px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-size: 14px;
    font-family: var(--font-base);
    color: var(--color-text);
    background: #fff;
    cursor: pointer;
    min-width: 220px;
}

/* — Grid 4 columnas — */
.zona-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

/* — Tarjeta base — */
.zona-card {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    overflow: hidden;
    background: #fff;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.2s;
}
.zona-card:hover { box-shadow: var(--shadow-md); }

.zona-card__thumb {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
}
.zona-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.zona-card__no-img {
    font-size: 13px;
    color: #999;
    text-align: center;
    padding: 12px;
}

.zona-card__body {
    padding: 12px 14px;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.zona-card__title {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--color-text);
    margin: 0;
}
.zona-card__download {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    background: var(--color-primary);
    color: #fff;
    border-radius: var(--radius-sm);
    text-decoration: none;
    transition: background 0.2s;
}
.zona-card__download:hover { background: var(--color-gold); color: #fff; }
.zona-card__download svg { width: 16px; height: 16px; }

/* — Descarga deshabilitada (sin PDF) — */
.zona-card__download--empty {
    background: #d0d0d0;
    cursor: default;
    pointer-events: none;
}

/* — Video card — */
.zona-card--video .zona-card__thumb { aspect-ratio: 16 / 9; cursor: pointer; }
.zona-card__play-icon {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.18);
    transition: background 0.2s;
    pointer-events: none;
}
.zona-card__play-icon svg {
    width: 40px;
    height: 40px;
    color: #fff;
    filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4));
}
.zona-card--video:hover .zona-card__play-icon { background: rgba(0,0,0,0.32); }
.zona-card__body--video {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}
.zona-card__play-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    background: var(--color-primary);
    color: #fff;
    border: none;
    border-radius: var(--radius-sm);
    font-size: 13px;
    font-weight: 600;
    font-family: var(--font-base);
    cursor: pointer;
    transition: background 0.2s;
}
.zona-card__play-btn:hover { background: var(--color-gold); color: #fff; }
.zona-card__play-btn svg { width: 13px; height: 13px; }

/* — Modal de video — */
.zona-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    align-items: center;
    justify-content: center;
}
.zona-modal--open { display: flex; }
.zona-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.82);
    cursor: pointer;
}
.zona-modal__box {
    position: relative;
    z-index: 1;
    width: 90%;
    max-width: 900px;
}
.zona-modal__close {
    position: absolute;
    top: -40px;
    right: 0;
    background: none;
    border: none;
    color: #fff;
    font-size: 32px;
    line-height: 1;
    cursor: pointer;
    padding: 0 6px;
    opacity: 0.8;
    transition: opacity 0.15s;
}
.zona-modal__close:hover { opacity: 1; }
.zona-modal__video-wrap {
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9 */
    background: #000;
    border-radius: var(--radius);
    overflow: hidden;
}
.zona-modal__video-wrap iframe,
.zona-modal__video-wrap video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: none;
}

/* — Tip cards — */
.zona-tip-card {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    overflow: hidden;
    background: #fff;
    display: flex;
    flex-direction: row;
    min-height: 320px;
    transition: box-shadow 0.2s;
}
.zona-tip-card:hover { box-shadow: var(--shadow-md); }

/* Panel imagen: 38% del ancho, cover completo */
.zona-tip-card__image {
    flex: 0 0 38%;
    position: relative;
    overflow: hidden;
    background: #e8e8e8;
}
.zona-tip-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform 0.4s;
}
.zona-tip-card:hover .zona-tip-card__image img { transform: scale(1.04); }

/* Panel contenido: resto del ancho */
.zona-tip-card__body {
    flex: 1;
    padding: 32px 36px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 0;
}
.zona-tip-card__text { flex: 1; margin-bottom: 24px; }
.zona-tip-card__title {
    font-size: 22px;
    font-weight: 700;
    color: var(--color-primary);
    line-height: 1.3;
    margin-bottom: 14px;
}
.zona-tip-card__excerpt {
    font-size: 14px;
    color: #555;
    line-height: 1.75;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.zona-tip-card__download {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 24px;
    background: var(--color-primary);
    color: #fff;
    border-radius: var(--radius-sm);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.2s;
}
.zona-tip-card__download:hover { background: var(--color-gold); color: #fff; }
.zona-tip-card__download svg { width: 16px; height: 16px; }

/* Responsive tip card */
@media (max-width: 767px) {
    .zona-tip-card { flex-direction: column; min-height: unset; }
    .zona-tip-card__image { flex: none; height: 240px; width: 100%; }
    .zona-tip-card__body { padding: 24px 20px; }
    .zona-tip-card__excerpt { -webkit-line-clamp: 4; }
}
@media (max-width: 479px) {
    .zona-tip-card__image { height: 200px; }
    .zona-tip-card__title { font-size: 18px; }
}

/* — Paginación — */
.zona-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 24px;
}
.zona-page-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-size: 14px;
    text-decoration: none;
    color: var(--color-text);
    background: #fff;
    transition: all 0.15s;
}
.zona-page-btn:hover { border-color: var(--color-gold); color: var(--color-gold); }
.zona-page-btn--current {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff;
}
.zona-page-btn--current:hover { color: #fff; }
.zona-page-btn--disabled { color: #ccc; pointer-events: none; }

/* — Vacío — */
.zona-empty { color: #999; font-size: 15px; padding: 32px 0; text-align: center; }

/* ══════════════════════════════════════════════════════════════════════════
   SHOP LAYOUT COMPARTIDO (Productos, Servicios)
══════════════════════════════════════════════════════════════════════════ */

.shop-layout {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 36px;
    padding: 8px 0 40px;
}

/* ── Sidebar ─────────────────────────────────────────────────────────────── */
.shop-sidebar__heading {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 20px;
    color: var(--color-text);
}
.shop-filter { margin-bottom: 24px; }
.shop-filter__title {
    font-size: 14px;
    font-weight: 700;
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: .04em;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--color-gold);
}
/* Grupo padre + hijos */
.shop-filter-group { margin-bottom: 4px; }
.shop-filter__item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--color-text);
    padding: 4px 0;
    cursor: pointer;
    line-height: 1.4;
}
.shop-filter__item:hover { color: var(--color-primary); }
.shop-filter__item span { flex: 1; }
.shop-filter__item--parent { font-weight: 600; }
.shop-filter__item--child  { font-size: 12.5px; color: #555; }
.shop-filter__item input[type="checkbox"] {
    flex-shrink: 0;
    width: 15px;
    height: 15px;
    accent-color: var(--color-primary);
    cursor: pointer;
}
/* Hijos indentados */
.shop-filter__children {
    margin-left: 22px;
    border-left: 2px solid #e5e7eb;
    padding-left: 10px;
    margin-bottom: 6px;
}
/* Contador */
.shop-filter__count { font-size: 11px; color: #aaa; margin-left: 2px; }
.shop-filter__clear {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    font-weight: 600;
    color: #ef4444;
    text-decoration: none;
    margin-top: 8px;
    padding: 4px 10px;
    border: 1px solid #fca5a5;
    border-radius: 4px;
    transition: all .15s;
}
.shop-filter__clear:hover { background: #fef2f2; }

/* ── Contenido ───────────────────────────────────────────────────────────── */
.shop-content__title {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 20px;
    color: var(--color-text);
}
.shop-content__title--standalone { margin-top: 8px; }
.shop-empty { color: #999; font-size: 15px; padding: 40px 0; text-align: center; }

/* ── Paginación shop + WooCommerce — mismo estilo que Zona Pro ──────────── */
.shop-pagination        { margin-top: 32px; text-align: center; }
.woocommerce-pagination { margin-top: 32px; }

.woocommerce-pagination ul.page-numbers {
    list-style: none !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0;
    margin: 0;
}
.woocommerce-pagination ul.page-numbers > li {
    display: inline-flex !important;
    list-style: none !important;
}
.woocommerce-pagination ul.page-numbers > li > a,
.woocommerce-pagination ul.page-numbers > li > span {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text);
    text-decoration: none;
    background: #fff;
    transition: all 0.15s;
}
.woocommerce-pagination ul.page-numbers > li > span.current {
    background: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: #fff !important;
}
.woocommerce-pagination ul.page-numbers > li > a:hover {
    border-color: var(--color-gold);
    color: var(--color-gold);
}

/* ══════════════════════════════════════════════════════════════════════════
   SERVICIOS — tarjetas de la página archivo
══════════════════════════════════════════════════════════════════════════ */

.srv-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.srv-card {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    overflow: hidden;
    background: #fff;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.2s;
}
.srv-card:hover { box-shadow: var(--shadow-md); }
.srv-card__thumb {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #eee;
}
.srv-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s;
}
.srv-card:hover .srv-card__thumb img { transform: scale(1.03); }
.srv-card__no-img { width: 100%; height: 100%; background: #ddd; }
.srv-card__body {
    padding: 18px 20px 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.srv-card__title {
    font-size: 17px;
    font-weight: 700;
    color: var(--color-text);
    line-height: 1.3;
}
.srv-card__title a {
    color: inherit;
    text-decoration: none;
}
.srv-card__title a:hover { color: var(--color-gold); }
.srv-card__thumb {
    display: block;
    overflow: hidden;
}
.srv-card__thumb img { transition: transform .3s; }
.srv-card__thumb:hover img { transform: scale(1.04); }
.srv-card__desc {
    font-size: 13px;
    color: #555;
    line-height: 1.6;
    flex: 1;
}
.srv-card__btn {
    align-self: flex-start;
    margin-top: 4px;
    font-size: 14px;
    padding: 9px 20px;
}

/* ══════════════════════════════════════════════════════════════════════════
   PRODUCTOS — tarjetas WooCommerce
══════════════════════════════════════════════════════════════════════════ */

.prod-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.prod-card {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    overflow: hidden;
    background: #fff;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.2s;
}
.prod-card:hover { box-shadow: var(--shadow-md); }

/* Thumbnail */
.prod-card__thumb {
    position: relative;
    display: block;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #fff;
}
.prod-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    padding: 8px;
    box-sizing: border-box;
    display: block;
    transition: transform 0.3s;
}
.prod-card:hover .prod-card__thumb img { transform: scale(1.04); }
.prod-card__badge {
    position: absolute;
    top: 8px;
    left: 8px;
    background: var(--color-gold);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.prod-card__wishlist {
    position: absolute;
    top: 8px;
    right: 8px;
    background: rgba(255,255,255,0.9);
    border: none;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background 0.15s;
    padding: 0;
}
.prod-card__wishlist:hover { background: #fff; }
.prod-card__wishlist svg { width: 16px; height: 16px; color: #999; }
.prod-card__wishlist:hover svg { color: var(--color-gold); }

/* Body */
.prod-card__body {
    padding: 12px 14px 14px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.prod-card__name {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text);
    line-height: 1.3;
    text-decoration: none;
}
.prod-card__name:hover { color: var(--color-gold); }
.prod-card__stock {
    font-size: 12px;
    margin: 0;
}
.prod-card__stock--in  { color: #2a8a4a; }
.prod-card__stock--out { color: #999; }

.prod-card__price { font-size: 15px; margin: 4px 0; }
.prod-card__price ins  { text-decoration: none; font-weight: 700; color: var(--color-text); }
.prod-card__price del  { color: #aaa; font-size: 13px; margin-right: 4px; }
.prod-card__price .woocommerce-Price-amount { font-weight: 600; }

.prod-card__actions { margin-top: auto; padding-top: 8px; }
.prod-card__add {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: var(--color-primary);
    color: #fff;
    border-radius: var(--radius-sm);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.2s;
    cursor: pointer;
    border: none;
    font-family: var(--font-base);
}
.prod-card__add:hover { background: var(--color-gold); color: #fff; }
.prod-card__add svg { width: 14px; height: 14px; }
.prod-card__add.loading::after { content: ''; display: inline-block; width: 12px; height: 12px; border: 2px solid rgba(255,255,255,0.5); border-top-color: #fff; border-radius: 50%; animation: spin 0.6s linear infinite; margin-left: 4px; }
@keyframes spin { to { transform: rotate(360deg); } }
.prod-card__no-stock {
    display: inline-block;
    padding: 7px 14px;
    border: 1px solid #e0a0a0;
    color: #c0392b;
    border-radius: var(--radius-sm);
    font-size: 13px;
    font-weight: 500;
}

/* ══════════════════════════════════════════════════════════════════════════
   OFERTAS
══════════════════════════════════════════════════════════════════════════ */

.oferta-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-bottom: 32px;
}

/* ── Card horizontal ── */
.oferta-card {
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    overflow: hidden;
    background: #fff;
    display: flex;
    flex-direction: row;
    transition: box-shadow 0.2s;
}
.oferta-card:hover { box-shadow: var(--shadow-md); }

/* Imagen cuadrada a la izquierda */
.oferta-card__thumb {
    position: relative;
    display: block;
    flex: 0 0 200px;
    width: 200px;
    background: #fff;
    border-right: 1px solid var(--color-border);
    overflow: hidden;
}
.oferta-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    padding: 10px;
    box-sizing: border-box;
    display: block;
    transition: transform 0.3s;
}
.oferta-card:hover .oferta-card__thumb img { transform: scale(1.04); }

/* Badge sobre la imagen */
.oferta-card__badge {
    position: absolute;
    top: 8px;
    left: 8px;
    background: var(--color-primary);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    padding: 3px 8px;
    border-radius: 4px;
    z-index: 1;
}

/* Detalles a la derecha */
.oferta-card__body {
    padding: 18px 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
}
.oferta-card__name {
    font-size: 15px;
    font-weight: 600;
    color: var(--color-text);
    text-decoration: none;
    line-height: 1.4;
}
.oferta-card__name:hover { color: var(--color-gold); }
.oferta-card__tag {
    font-size: 11px;
    color: #bbb;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.oferta-card__price { font-size: 16px; margin: 4px 0; }
.oferta-card__price ins  { text-decoration: none; font-weight: 700; color: var(--color-gold); }
.oferta-card__price del  { color: #aaa; font-size: 13px; margin-right: 6px; }
.oferta-card__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 20px;
    background: var(--color-gold);
    color: #fff;
    border-radius: var(--radius-sm);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    margin-top: 4px;
    align-self: flex-start;
    transition: background 0.2s;
    cursor: pointer;
    border: none;
    font-family: var(--font-base);
}
.oferta-card__btn:hover { background: var(--color-gold-dark); color: #fff; }
.oferta-card__no-stock {
    display: inline-block;
    padding: 7px 14px;
    border: 1px solid #e0a0a0;
    color: #c0392b;
    border-radius: var(--radius-sm);
    font-size: 13px;
    margin-top: 4px;
    align-self: flex-start;
}

/* ── Footer ─────────────────────────────────────────────────────────────── */
.whanau-footer {
    background: var(--color-primary);
    color: var(--color-white);
    margin-top: 60px;
}
.whanau-footer__inner {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 50px var(--container-pad) 0;
}
.whanau-footer__grid {
    display: flex;
    gap: 60px;
    padding-bottom: 40px;
    align-items: flex-start;
}
.whanau-footer__col--about {
    flex: 0 0 28%;
    max-width: 28%;
}
.whanau-footer__cols-right {
    flex: 1;
    min-width: 0;
    display: grid;
    grid-template-columns: auto auto auto;
    column-gap: 120px;
    justify-content: end;
}
.whanau-footer__top-logo {
    margin-bottom: 32px;
}
.whanau-footer__top-logo img {
    height: 36px;
    width: auto;
    filter: brightness(0) invert(1);
}
.whanau-logo-text--footer span:first-child { color: var(--color-white); }
.whanau-logo-text--footer span:last-child  { color: var(--color-gold); }

.whanau-footer__heading {
    color: var(--color-gold);
    font-size: 20px;
    font-weight: 500;
    font-family: 'Inter', sans-serif;
    margin-bottom: 16px;
}
.whanau-footer__about-text {
    font-size: 16px;
    font-weight: 400;
    font-family: 'Inter', sans-serif;
    color: rgba(255,255,255,0.75);
    line-height: 1.7;
    margin-bottom: 12px;
}
.whanau-footer__readmore {
    font-size: 16px;
    font-weight: 400;
    font-family: 'Inter', sans-serif;
    color: rgba(255,255,255,0.75);
    transition: color 0.2s;
}
.whanau-footer__readmore:hover { color: var(--color-gold); }

.whanau-footer__links {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.whanau-footer__links li a {
    font-size: 16px;
    font-weight: 400;
    font-family: 'Inter', sans-serif;
    color: rgba(255,255,255,0.75);
    transition: color 0.2s;
}
.whanau-footer__links li a:hover { color: var(--color-gold); }

.whanau-footer__bottom {
    border-top: 1px solid rgba(255,255,255,0.1);
    padding: 20px 0;
    text-align: center;
}
.whanau-footer__bottom p {
    font-size: 13px;
    color: rgba(255,255,255,0.45);
}

/* ═══════════════════════════════════════════════════════════════════════
   PÁGINA: SOBRE NOSOTROS
═══════════════════════════════════════════════════════════════════════ */

/* Breadcrumb sobre nosotros */
.about-breadcrumb {
    padding: 18px 0 0;
    font-size: 14px;
    color: var(--color-text-muted);
}
.about-breadcrumb a { color: var(--color-text-muted); }
.about-breadcrumb a:hover { color: var(--color-gold); }
.about-breadcrumb .woocommerce-breadcrumb { margin: 0; padding: 0; background: none; font-size: 14px; }

/* Hero */
.about-hero {
    background: var(--color-primary);
    padding: 48px 40px;
    border-radius: var(--radius);
    margin: 24px 0 8px;
}
.about-hero__eyebrow {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--color-gold);
    margin-bottom: 10px;
}
.about-hero__title {
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 700;
    color: var(--color-white);
    line-height: 1.15;
}

/* Secciones */
.about-section {
    padding: 48px 40px;
    border-radius: var(--radius);
    margin-bottom: 8px;
}
.about-section--light { background: var(--color-bg-light); }
.about-section--dark  { background: var(--color-white); border: 1px solid var(--color-border); }
.about-section--gold  { background: var(--color-primary); margin-bottom: 48px; }

.about-section__inner {
    display: flex;
    align-items: flex-start;
    gap: 48px;
}

/* Icono */
.about-section__icon {
    flex-shrink: 0;
    width: 72px;
    height: 72px;
    border-radius: var(--radius);
    display: flex;
    align-items: center;
    justify-content: center;
}
.about-section--light .about-section__icon,
.about-section--dark  .about-section__icon {
    background: rgba(61,65,84,0.07);
    color: var(--color-primary);
}
.about-section--gold .about-section__icon {
    background: rgba(238,177,40,0.15);
    color: var(--color-gold);
}
.about-section__icon svg {
    width: 36px;
    height: 36px;
}

/* Cuerpo */
.about-section__body { flex: 1; }

.about-section__title {
    font-size: 26px;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 16px;
}
.about-section--light .about-section__title,
.about-section--dark  .about-section__title { color: var(--color-primary); }
.about-section--gold  .about-section__title { color: var(--color-white); }

.about-section__text {
    font-size: 17px;
    line-height: 1.75;
    max-width: 760px;
}
.about-section--light .about-section__text,
.about-section--dark  .about-section__text { color: var(--color-text); }
.about-section--gold  .about-section__text { color: rgba(255,255,255,0.85); }

.about-section__text strong {
    font-weight: 600;
    color: var(--color-primary);
}
.about-section--gold .about-section__text strong { color: var(--color-gold); }

.about-section__quote {
    font-size: 22px;
    font-weight: 600;
    font-style: italic;
    color: var(--color-gold);
    margin: 24px 0 32px;
    padding-left: 20px;
    border-left: 4px solid var(--color-gold);
    line-height: 1.4;
}

.about-section__cta { margin-top: 8px; }

/* ══════════════════════════════════════════════════════════════════════════
   MI CUENTA
══════════════════════════════════════════════════════════════════════════ */

/* Neutralizar layout por defecto de WooCommerce */
.woocommerce-account .woocommerce { display: block; }
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content { float: none; width: auto; }

/* ── Wrapper principal ───────────────────────────────────────────────────── */
.mc-wrap {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 32px;
    align-items: start;
}

/* ══ SIDEBAR ══════════════════════════════════════════════════════════════ */
.mc-sidebar {
    background: var(--color-primary);
    border-radius: 10px;
    overflow: hidden;
    position: sticky;
    top: 24px;
}

/* ── Avatar + datos de usuario ───────────────────────────────────────────── */
.mc-user {
    padding: 28px 24px 20px;
    border-bottom: 1px solid rgba(255,255,255,.1);
    display: flex;
    align-items: center;
    gap: 14px;
}
.mc-user__avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--color-gold);
    color: var(--color-primary);
    font-size: 1.3rem;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.mc-user__name {
    color: #fff;
    font-weight: 700;
    font-size: .95rem;
    margin: 0 0 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mc-user__email {
    color: rgba(255,255,255,.5);
    font-size: .75rem;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mc-user__info { min-width: 0; }

/* ── Nav ─────────────────────────────────────────────────────────────────── */
.mc-nav { padding: 10px 0; }
.mc-nav__list { list-style: none; margin: 0; padding: 0; }
.mc-nav__item  { margin: 0; }
.mc-nav__link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 24px;
    color: rgba(255,255,255,.7);
    text-decoration: none;
    font-size: .875rem;
    font-weight: 500;
    border-left: 3px solid transparent;
    transition: color .15s, border-color .15s, background .15s;
}
.mc-nav__link:hover {
    color: #fff;
    background: rgba(255,255,255,.07);
}
.mc-nav__item.is-active .mc-nav__link,
.mc-nav__item.woocommerce-MyAccount-navigation-link--is-active .mc-nav__link {
    color: var(--color-gold);
    border-left-color: var(--color-gold);
    background: rgba(255,255,255,.06);
    font-weight: 700;
}
.mc-nav__icon {
    width: 17px;
    height: 17px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    opacity: .75;
}
.mc-nav__item.is-active .mc-nav__icon,
.mc-nav__item.woocommerce-MyAccount-navigation-link--is-active .mc-nav__icon { opacity: 1; }
.mc-nav__icon svg { width: 17px; height: 17px; }

/* ── Logout ──────────────────────────────────────────────────────────────── */
.mc-logout {
    border-top: 1px solid rgba(255,255,255,.1);
    padding: 8px 0 10px;
    margin-top: 4px;
}
.mc-logout__link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 24px;
    color: #ef9a9a;
    text-decoration: none;
    font-size: .875rem;
    font-weight: 500;
    transition: color .15s, background .15s;
}
.mc-logout__link:hover { color: #ef5350; background: rgba(239,83,80,.08); }
.mc-logout__link .mc-nav__icon { opacity: 1; }

/* ══ ÁREA PRINCIPAL ════════════════════════════════════════════════════════ */
.mc-main {
    min-width: 0;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 10px;
    padding: 0 28px 32px;
}

/* ── Títulos de sección ──────────────────────────────────────────────────── */
.mc-main h2, .woocommerce-MyAccount-content h2,
.mc-main h3, .woocommerce-MyAccount-content h3 {
    color: var(--color-primary);
    margin-bottom: 20px;
}

/* ── Avisos WooCommerce ───────────────────────────────────────────────────── */
/* La estructura real de WC es <ul class="woocommerce-*"> > <li> */
.woocommerce-notices-wrapper { margin-bottom: 4px; }

/* ── Avisos WooCommerce: alerta compacta con borde lateral ─────────────── */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    list-style: none;
    padding: 0;
    margin: 0 0 16px;
    background: none;
    border: none;
    border-radius: 0;
}
.woocommerce-message li,
.woocommerce-info li,
.woocommerce-error li {
    display: block;
    padding: 10px 14px;
    border-radius: 6px;
    font-size: .875rem;
    font-style: normal;
    line-height: 1.55;
    margin-bottom: 6px;
}
.woocommerce-message li {
    background: #f0faf4;
    border-left: 3px solid #2e7d32;
    color: #1b5e20;
}
.woocommerce-info li {
    background: #f5f5f5;
    border-left: 3px solid #888;
    color: #444;
}
.woocommerce-error li {
    background: #fff5f5;
    border-left: 3px solid #c62828;
    color: #7f1010;
}
.woocommerce-error li::before,
.woocommerce-error li > svg:first-child,
.woocommerce-error li > img:first-child {
    display: none;
}
.woocommerce-error li a {
    color: #c62828;
    font-weight: 600;
    text-decoration: underline;
}
.woocommerce-error li a:hover { color: #7f1010; }

/* Botón de acción dentro del aviso (ej: "Volver a la tienda") */
.woocommerce-message li a.button,
.woocommerce-info li a.button,
.woocommerce-error li a.button {
    display: inline-block;
    margin-top: 8px;
    font-style: normal;
    background: var(--color-primary);
    color: #fff !important;
    padding: 6px 16px;
    border-radius: 4px;
    font-size: .8rem;
    font-weight: 700;
    white-space: nowrap;
    text-decoration: none;
    transition: background .2s;
}
.woocommerce-message li a.button:hover,
.woocommerce-info li a.button:hover  { background: var(--color-gold); }
.woocommerce-error li a.button:hover { background: #b71c1c; }

/* ── Tabla de pedidos ────────────────────────────────────────────────────── */
.woocommerce-orders-table,
.woocommerce-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .875rem;
    margin-bottom: 24px;
}
.woocommerce-orders-table thead,
.woocommerce-table thead {
    background: var(--color-primary);
    color: #fff;
}
.woocommerce-orders-table th,
.woocommerce-table th {
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: rgba(255,255,255,.85);
}
.woocommerce-orders-table td,
.woocommerce-table td {
    padding: 12px 16px;
    border-bottom: 1px solid #f0f0f0;
    color: #444;
    vertical-align: middle;
}
.woocommerce-orders-table tbody tr:last-child td,
.woocommerce-table tbody tr:last-child td { border-bottom: none; }
.woocommerce-orders-table tbody tr:hover td { background: #fafafa; }

/* Estados de pedido */
mark.order-status { background: none; font-style: normal; }
.woocommerce-order-status,
mark.order-status {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
}
mark.order-status.status-completed  { background: #e8f5e9; color: #2e7d32; }
mark.order-status.status-processing { background: #e3f2fd; color: #1565c0; }
mark.order-status.status-pending    { background: #fff3e0; color: #e65100; }
mark.order-status.status-cancelled  { background: #ffebee; color: #c62828; }
mark.order-status.status-on-hold    { background: #f3e5f5; color: #6a1b9a; }

/* Botones dentro del área de cuenta */
.mc-main .button,
.mc-main a.button,
.woocommerce-MyAccount-content .button,
.woocommerce-MyAccount-content a.button {
    display: inline-block;
    padding: 8px 18px;
    background: var(--color-primary);
    color: #fff !important;
    border-radius: 5px;
    font-size: .8rem;
    font-weight: 600;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: background .2s;
    line-height: 1.4;
}
.mc-main .button:hover,
.woocommerce-MyAccount-content .button:hover { background: var(--color-gold); }

/* ── Formularios ─────────────────────────────────────────────────────────── */
.woocommerce-address-fields__field-wrapper,
.woocommerce-EditAccountForm fieldset { border: none; padding: 0; margin: 0; }
.woocommerce-address-fields__field-wrapper,
.woocommerce-EditAccountForm {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 20px;
}
/* WooCommerce float-clearing divs become empty grid rows — hide them */
.woocommerce-EditAccountForm .clear { display: none; }
/* Nombre y apellido: cada uno ocupa todo el ancho */
.woocommerce-EditAccountForm .woocommerce-form-row--first,
.woocommerce-EditAccountForm .woocommerce-form-row--last { grid-column: 1 / -1; }
/* Fieldset contraseñas: solo media columna (aparece más pequeño) */
.woocommerce-EditAccountForm fieldset {
    grid-column: 1 / 2;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
/* Submit button span full width */
.woocommerce-EditAccountForm > p:not(.woocommerce-form-row) { grid-column: 1 / -1; }
.woocommerce-form-row,
.form-row {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin: 0 !important;
    padding: 0;
}
.woocommerce-form-row.form-row-wide,
.form-row-wide { grid-column: 1 / -1; }
.woocommerce-form-row label,
.form-row label {
    font-size: .75rem;
    font-weight: 700;
    color: var(--color-primary);
    text-transform: uppercase;
    letter-spacing: .06em;
}
.woocommerce-form-row label .required,
.form-row label .required { color: var(--color-gold); }
.woocommerce-form-row input[type=text],
.woocommerce-form-row input[type=email],
.woocommerce-form-row input[type=password],
.woocommerce-form-row input[type=tel],
.woocommerce-form-row select,
.woocommerce-form-row textarea,
.form-row input[type=text],
.form-row input[type=email],
.form-row input[type=password],
.form-row select {
    width: 100%;
    padding: 10px 14px;
    border: 1.5px solid #ddd;
    border-radius: 5px;
    font-size: .9rem;
    color: var(--color-primary);
    background: #fafafa;
    transition: border-color .2s, background .2s;
    box-sizing: border-box;
    -webkit-appearance: none;
}
.woocommerce-form-row input:focus,
.woocommerce-form-row select:focus,
.form-row input:focus,
.form-row select:focus {
    border-color: var(--color-gold);
    background: #fff;
    outline: none;
}

/* Botón guardar */
.woocommerce-EditAccountForm .woocommerce-Button,
.woocommerce-address-fields .woocommerce-Button,
.woocommerce-MyAccount-content button[type=submit],
.woocommerce-MyAccount-content input[type=submit] {
    grid-column: 1 / -1;
    width: auto;
    align-self: start;
    padding: 12px 32px;
    background: var(--color-primary);
    color: #fff;
    border: none;
    border-radius: 5px;
    font-weight: 700;
    font-size: .95rem;
    cursor: pointer;
    transition: background .2s;
}
.woocommerce-EditAccountForm .woocommerce-Button:hover,
.woocommerce-MyAccount-content button[type=submit]:hover,
.woocommerce-MyAccount-content input[type=submit]:hover { background: var(--color-gold); }

/* ── Direcciones ─────────────────────────────────────────────────────────── */
/* Neutralizar flexbox/floats de WooCommerce en addresses */
.woocommerce-Addresses,
.woocommerce-Addresses.u-columns {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 24px !important;
    flex-wrap: unset !important;
}
.woocommerce-Addresses > * {
    float: none !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    flex: none !important;
}
.woocommerce-Address {
    background: #f8f8f8;
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 24px;
}
.woocommerce-Address-title {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e8e8e8;
}
.woocommerce-Address-title h3 {
    font-size: .95rem !important;
    color: var(--color-primary);
    font-weight: 700;
    margin: 0;
    line-height: 1.3;
    flex: 1;
}
.woocommerce-Address-title a {
    flex-shrink: 0;
    font-size: .78rem;
    color: var(--color-gold);
    text-decoration: none;
    font-weight: 600;
    white-space: nowrap;
    margin-top: 2px;
}
.woocommerce-Address-title a:hover { text-decoration: underline; }
.woocommerce-Address address {
    color: #555;
    font-style: normal;
    line-height: 1.8;
    font-size: .875rem;
}
/* Template propio de addresses */
.whanau-addresses {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}
.whanau-address-card {
    background: #f8f8f8;
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 24px;
}
.whanau-address-card__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e8e8e8;
}
.whanau-address-card__header h3 {
    font-size: .95rem !important;
    color: var(--color-primary);
    font-weight: 700;
    margin: 0;
    line-height: 1.3;
}
.whanau-address-card__header a {
    flex-shrink: 0;
    font-size: .78rem;
    color: var(--color-gold);
    text-decoration: none;
    font-weight: 600;
    white-space: nowrap;
}
.whanau-address-card__header a:hover { text-decoration: underline; }
.whanau-address-card address {
    color: #555;
    font-style: normal;
    line-height: 1.8;
    font-size: .875rem;
}
.whanau-address-card address em { color: #aaa; }

/* ══ LOGIN ══════════════════════════════════════════════════════════════════ */
.wk-login {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 90px 20px 60px;
    min-height: 60vh;
}
.wk-login__card {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 16px;
    padding: 36px 40px 32px;
    width: 100%;
    max-width: 420px;
    box-shadow: 0 4px 24px rgba(0,0,0,.07);
}
.wk-login__head {
    text-align: center;
    margin-bottom: 24px;
}
.wk-login__title {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--color-primary);
    margin: 0 0 4px;
}
.wk-login__sub {
    font-size: .875rem;
    color: #6b7280;
    margin: 0;
}
.wk-login__google {
    margin-bottom: 4px;
}
/* Eliminar separador "o" que añade el plugin — lo ponemos nosotros */
.wk-login__google .gaur-sep { display: none; }
/* Botón Google — tanto el del plugin como el placeholder */
.wk-login__google .gaur-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    padding: 11px 16px;
    background: #fff;
    border: 1.5px solid #dadce0;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 500;
    color: #3c4043;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    transition: background .15s, box-shadow .15s;
    font-family: inherit;
}
.wk-login__google .gaur-btn:hover {
    background: #f8f9fa;
    box-shadow: 0 1px 4px rgba(0,0,0,.12);
    text-decoration: none;
    color: #3c4043;
}
.wk-google-btn--pending { opacity: .8; }
.wk-login__divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 16px 0;
    color: #9ca3af;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .05em;
}
.wk-login__divider::before,
.wk-login__divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}
.wk-login__form {}
.wk-login__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 8px 0 18px;
    font-size: 13px;
}
.wk-login__remember {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #6b7280;
    cursor: pointer;
}
.wk-login__remember input { accent-color: var(--color-gold); }
.wk-login__forgot {
    color: var(--color-gold);
    font-size: 13px;
}
.wk-login__forgot:hover { text-decoration: underline; }
.wk-login__btn {
    width: 100%;
    justify-content: center;
    padding: 11px;
    font-size: 15px;
}
.wk-login__register-link {
    margin-top: 20px;
    font-size: 14px;
    color: #6b7280;
    text-align: center;
}
.wk-login__register-link a {
    color: var(--color-gold);
    font-weight: 600;
}
.wk-login__register-link a:hover { text-decoration: underline; }

/* ══ AUTH — campos compartidos (registro, recuperación) ═════════════════════
   Clases: .wk-auth, .wk-auth__card, .wk-field, .wk-field__pass-wrap, etc.
═══════════════════════════════════════════════════════════════════════════ */

/* Contenedor externo centrado (recuperación) */
.wk-auth {
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
    padding: 20px 0 60px;
}
.wk-auth--one-col { max-width: 480px; }

/* ── Tarjeta ─────────────────────────────────────────────────────────────── */
.wk-auth__card {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 12px;
    padding: 36px 32px 32px;
    box-shadow: 0 2px 16px rgba(0,0,0,.06);
}
.wk-auth__card-head {
    text-align: center;
    margin-bottom: 28px;
}
.wk-auth__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px; height: 56px;
    background: #f5f3ee;
    border-radius: 50%;
    margin-bottom: 12px;
    color: var(--color-gold);
}
.wk-auth__title {
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--color-primary);
    margin: 0 0 6px;
}
.wk-auth__subtitle {
    font-size: .875rem;
    color: #777;
    margin: 0;
    line-height: 1.5;
}

/* ── Campos ──────────────────────────────────────────────────────────────── */
.wk-field {
    margin-bottom: 10px;
}
.wk-field__label {
    display: block;
    font-size: .82rem;
    font-weight: 600;
    color: var(--color-primary);
    margin-bottom: 6px;
    letter-spacing: .02em;
    text-transform: uppercase;
}
.wk-field__input {
    width: 100%;
    padding: 8px 12px;
    border: 1.5px solid #ddd;
    border-radius: 8px;
    font-size: .9rem;
    font-family: var(--font-base);
    color: #333;
    background: #fafafa;
    transition: border-color .2s, box-shadow .2s;
    box-sizing: border-box;
}
.wk-field__input:focus {
    outline: none;
    border-color: var(--color-gold);
    box-shadow: 0 0 0 3px rgba(238, 177, 40, .15);
    background: #fff;
}

/* ── Campo contraseña con ojo ────────────────────────────────────────────── */
.wk-field__pass-wrap {
    position: relative;
}
.wk-field__pass-wrap .wk-field__input {
    padding-right: 44px;
}
.wk-field__pass-toggle {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: #aaa;
    display: flex;
    align-items: center;
    transition: color .2s;
}
.wk-field__pass-toggle:hover { color: var(--color-primary); }
/* Alterna ojo on/off según estado */
.wk-field__pass-toggle .wk-eye--on  { display: none; }
.wk-field__pass-toggle .wk-eye--off { display: block; }
.wk-field__pass-toggle.is-visible .wk-eye--on  { display: block; }
.wk-field__pass-toggle.is-visible .wk-eye--off { display: none; }

/* ── Fila recordarme + olvidé contraseña ─────────────────────────────────── */
.wk-auth__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 22px;
    gap: 8px;
}
.wk-auth__remember {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: .85rem;
    color: #666;
    cursor: pointer;
}
.wk-auth__remember input[type="checkbox"] {
    accent-color: var(--color-gold);
    width: 15px;
    height: 15px;
}
.wk-auth__forgot {
    font-size: .82rem;
    color: var(--color-gold);
    text-decoration: none;
    white-space: nowrap;
}
.wk-auth__forgot:hover { text-decoration: underline; }

/* ── Botón principal ─────────────────────────────────────────────────────── */
.wk-auth__btn {
    width: 100%;
    justify-content: center;
    padding: 13px 24px;
    font-size: .95rem;
    border-radius: 8px;
    margin-top: 4px;
}

/* ── Nota contraseña automática ──────────────────────────────────────────── */
.wk-auth__auto-pass {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    font-size: .82rem;
    color: #888;
    background: #f9f6ee;
    border: 1px solid #ede5c5;
    border-radius: 7px;
    padding: 10px 13px;
    margin-bottom: 18px;
    line-height: 1.5;
}

/* ── Aviso de privacidad ─────────────────────────────────────────────────── */
.wk-auth__privacy {
    margin-top: 16px;
    font-size: .78rem;
    color: #aaa;
    text-align: center;
    line-height: 1.5;
}
.wk-auth__privacy a { color: var(--color-gold); }

/* ── Volver al login (recovery page) ────────────────────────────────────── */
.wk-auth__back {
    text-align: center;
    margin-top: 20px;
}
.wk-auth__back a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .85rem;
    color: #888;
    text-decoration: none;
    transition: color .2s;
}
.wk-auth__back a:hover { color: var(--color-primary); }

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 680px) {
    .wk-auth--two-col,
    .wk-auth.wk-auth--two-col {
        grid-template-columns: 1fr;
    }
    .wk-auth__card { padding: 28px 20px; }
}

/* Compatibilidad con avisos de WooCommerce dentro del auth */
.wk-auth .woocommerce-error,
.wk-auth .woocommerce-message,
.wk-auth .woocommerce-info {
    margin-bottom: 20px;
}

/* ── Heredado (compatibilidad) ───────────────────────────────────────────── */
.woocommerce-form-login__rememberme { font-size: .85rem; color: #555; }
.lost_password { font-size: .85rem; margin-top: 6px; }
.lost_password a { color: var(--color-gold); }

/* ══ DASHBOARD ══════════════════════════════════════════════════════════════ */
.mc-dashboard { display: flex; flex-direction: column; gap: 28px; }

.mc-dash-hello__title {
    font-size: 1.5rem;
    color: var(--color-primary);
    margin-bottom: 6px;
}
.mc-dash-hello__title span { color: var(--color-gold); }
.mc-dash-hello__sub { color: #666; font-size: .9rem; line-height: 1.6; margin: 0; }

/* Tarjetas de resumen */
.mc-dash-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.mc-dash-card {
    background: #f8f8f8;
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}
.mc-dash-card--accent { background: var(--color-primary); border-color: var(--color-primary); }
.mc-dash-card--accent .mc-dash-card__num,
.mc-dash-card--accent .mc-dash-card__label { color: #fff; }
.mc-dash-card--accent .mc-dash-card__icon { background: rgba(255,255,255,.15); color: #fff; }
.mc-dash-card__icon {
    width: 36px;
    height: 36px;
    background: var(--color-primary);
    color: #fff;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
}
.mc-dash-card__icon svg { width: 18px; height: 18px; }
.mc-dash-card__num {
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--color-primary);
    line-height: 1;
}
.mc-dash-card__label {
    font-size: .78rem;
    color: #888;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: .05em;
}

/* Accesos rápidos */
.mc-dash-links__title {
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #999;
    font-weight: 700;
    margin-bottom: 12px;
}
.mc-dash-links__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}
.mc-dash-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    border: 1.5px solid #eee;
    border-radius: 8px;
    color: var(--color-primary);
    text-decoration: none;
    font-size: .875rem;
    font-weight: 600;
    transition: border-color .2s, background .2s;
}
.mc-dash-link svg { width: 18px; height: 18px; flex-shrink: 0; color: var(--color-gold); }
.mc-dash-link:hover { border-color: var(--color-gold); background: #fdf9ed; }

/* Último pedido */
.mc-dash-last {
    background: #f8f8f8;
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 20px 24px;
}
.mc-dash-last__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid #eee;
    font-size: .875rem;
}
.mc-dash-last__row:last-child { border-bottom: none; }
.mc-dash-last__label { color: #888; font-weight: 500; }
.mc-dash-last a { color: var(--color-gold); font-weight: 700; text-decoration: none; }

/* Badges estado */
.mc-status {
    display: inline-flex;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
}
.mc-status--completed  { background: #e8f5e9; color: #2e7d32; }
.mc-status--processing { background: #e3f2fd; color: #1565c0; }
.mc-status--pending    { background: #fff3e0; color: #e65100; }
.mc-status--cancelled  { background: #ffebee; color: #c62828; }
.mc-status--on-hold    { background: #f3e5f5; color: #6a1b9a; }

/* ══════════════════════════════════════════════════════════════════════════
   SINGLE SERVICIO
══════════════════════════════════════════════════════════════════════════ */
.srv-single__hero {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: start;
    margin-bottom: 40px;
}
.srv-single__img img,
.srv-single__no-img {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
    border-radius: 4px;
    display: block;
}
.srv-single__no-img { background: #e0e0e0; }
.srv-single__title {
    font-size: 2rem;
    color: var(--color-gold);
    margin-bottom: 20px;
    line-height: 1.2;
}
.srv-single__desc {
    color: #444;
    line-height: 1.75;
    font-size: 0.97rem;
}
.srv-single__panels {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}
.srv-panel {
    background: #f5f5f5;
    border-radius: 6px;
    padding: 28px 32px;
}
.srv-panel__title {
    color: var(--color-gold);
    font-size: 1.1rem;
    font-weight: 700;
    margin-bottom: 20px;
}
.srv-contact-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 0;
    color: var(--color-primary);
    text-decoration: none;
    font-weight: 500;
    border-bottom: 1px solid #ddd;
    transition: color .2s;
}
.srv-contact-item:last-child { border-bottom: none; }
.srv-contact-item:hover { color: var(--color-gold); }
.srv-contact-item:hover .srv-contact-item__icon { background: var(--color-gold); }
.srv-contact-item__icon {
    width: 40px;
    height: 40px;
    background: var(--color-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    flex-shrink: 0;
    transition: background .2s;
}
.srv-contact-item__icon svg { width: 18px; height: 18px; }
.srv-panel__detail {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 0;
    border-bottom: 1px solid #ddd;
}
.srv-panel__detail:last-child { border-bottom: none; }
.srv-panel__label {
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #888;
}
.srv-panel__value {
    color: var(--color-primary);
    font-weight: 500;
}

/* ══════════════════════════════════════════════════════════════════════════
   CARRITO LATERAL (SIDEBAR)
══════════════════════════════════════════════════════════════════════════ */

/* Bloquear scroll del body cuando el carrito está abierto */
body.whanau-cart-open { overflow: hidden; }

/* Contenedor raíz */
.whanau-cart-sidebar {
    position: fixed;
    inset: 0;
    z-index: 9000;
    pointer-events: none;
}
.whanau-cart-sidebar.is-open { pointer-events: all; }

/* Overlay */
.whanau-cart-sidebar__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.45);
    opacity: 0;
    transition: opacity .3s ease;
}
.whanau-cart-sidebar.is-open .whanau-cart-sidebar__overlay { opacity: 1; }

/* Drawer */
.whanau-cart-sidebar__drawer {
    position: absolute;
    top: 0;
    right: 0;
    width: 400px;
    max-width: 100vw;
    height: 100%;
    background: #fff;
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform .32s cubic-bezier(.4,0,.2,1);
    box-shadow: -4px 0 32px rgba(0,0,0,.12);
}
.whanau-cart-sidebar.is-open .whanau-cart-sidebar__drawer { transform: translateX(0); }

/* Cabecera del sidebar */
.whanau-cart-sidebar__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-bottom: 1.5px solid #eee;
    flex-shrink: 0;
    background: var(--color-primary);
    color: #fff;
}
.whanau-cart-sidebar__title {
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0 0 2px;
    color: #fff;
}
.whanau-cart-sidebar__items-count {
    font-size: .78rem;
    color: rgba(255,255,255,.7);
}
.whanau-cart-sidebar__close {
    background: none;
    border: none;
    cursor: pointer;
    color: #fff;
    padding: 4px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    transition: background .15s;
}
.whanau-cart-sidebar__close:hover { background: rgba(255,255,255,.15); }

/* Cuerpo: lista de productos */
.whanau-cart-sidebar__body {
    flex: 1;
    overflow-y: auto;
    padding: 0;
    overscroll-behavior: contain;
}

/* Pie: botones */
.whanau-cart-sidebar__foot {
    flex-shrink: 0;
    padding: 16px 20px;
    border-top: 1.5px solid #eee;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fafbfc;
}
.whanau-cart-sidebar__cart-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 11px 20px;
    border: 1.5px solid var(--color-primary);
    border-radius: 6px;
    color: var(--color-primary);
    font-weight: 600;
    font-size: .9rem;
    text-decoration: none;
    transition: background .2s, color .2s;
}
.whanau-cart-sidebar__cart-btn:hover { background: var(--color-primary); color: #fff; }
.whanau-cart-sidebar__checkout-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 20px;
    background: var(--color-primary);
    color: #fff;
    border-radius: 6px;
    font-weight: 700;
    font-size: .95rem;
    text-decoration: none;
    transition: background .2s;
}
.whanau-cart-sidebar__checkout-btn:hover { background: #0a1e3a; }

/* ── Mini-cart: items ──────────────────────────────────────── */
.whanau-mc__list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.whanau-mc__item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 20px;
    border-bottom: 1px solid #f0f0f0;
    position: relative;
}
.whanau-mc__img {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid #eee;
    display: block;
}
.whanau-mc__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.whanau-mc__info {
    flex: 1;
    min-width: 0;
}
.whanau-mc__name {
    display: block;
    font-size: .88rem;
    font-weight: 600;
    color: var(--color-primary);
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 4px;
}
.whanau-mc__name:hover { text-decoration: underline; }
.whanau-mc__price {
    font-size: .83rem;
    color: #666;
}
.whanau-mc__remove {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5f5f5;
    border-radius: 50%;
    color: #999;
    font-size: 1rem;
    text-decoration: none;
    line-height: 1;
    transition: background .15s, color .15s;
}
.whanau-mc__remove:hover { background: #ffebee; color: #c62828; }

/* Subtotal en mini-cart */
.whanau-mc__subtotal {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 20px;
    font-size: .9rem;
    font-weight: 600;
    color: var(--color-primary);
    border-top: 2px solid #eee;
}
.whanau-mc__subtotal strong { font-size: 1rem; }

/* Estado vacío en mini-cart */
.whanau-mc__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 60px 24px;
    text-align: center;
    color: #aaa;
}
.whanau-mc__empty svg { width: 48px; height: 48px; stroke: #ccc; }
.whanau-mc__empty p { font-size: .95rem; color: #777; margin: 0; }
.whanau-mc__empty .btn { font-size: .85rem; padding: 9px 20px; }

/* ══════════════════════════════════════════════════════════════════════════
   PÁGINA COMPLETA DEL CARRITO — diseño con tarjetas
══════════════════════════════════════════════════════════════════════════ */
.wc-cart__title {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--color-primary);
    margin-bottom: 28px;
}

/* ── Layout 2 columnas ─────────────────────────────────────────────── */
.wc-cart__layout {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 32px;
    align-items: start;
}

/* ── Tarjeta de producto ───────────────────────────────────────────── */
.wc-cart__card {
    display: flex;
    align-items: center;
    gap: 20px;
    background: var(--color-bg-light);
    border-radius: 14px;
    padding: 18px 20px;
    margin-bottom: 14px;
}
.wc-cart__card:last-of-type { margin-bottom: 0; }

/* Imagen */
.wc-cart__card-img {
    flex-shrink: 0;
    width: 90px;
    height: 90px;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.wc-cart__card-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
.wc-cart__card-img a { display: block; width: 100%; height: 100%; }

/* Info: nombre + descripción */
.wc-cart__card-info {
    flex: 1;
    min-width: 0;
}
.wc-cart__card-name {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--color-primary);
    text-decoration: none;
    display: block;
    margin-bottom: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.wc-cart__card-name:hover { color: var(--color-gold); }
.wc-cart__card-desc {
    font-size: .82rem;
    color: var(--color-text-muted);
    margin: 0;
    line-height: 1.4;
}

/* Precio + qty (bloque derecho antes del trash) */
.wc-cart__card-right {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}
.wc-cart__card-price {
    font-size: 1.45rem;
    font-weight: 700;
    color: var(--color-gold);
    white-space: nowrap;
}
.wc-cart__card-price .woocommerce-Price-amount { color: inherit; }
.wc-cart__qty-fixed {
    font-size: 1rem;
    font-weight: 600;
    color: var(--color-primary);
}

/* Control +/− */
.wc-qty-ctrl {
    display: flex;
    align-items: center;
    border: 1.5px solid #d0d0d0;
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
    height: 38px;
}
.wc-qty-ctrl__btn {
    width: 36px;
    height: 100%;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 1.15rem;
    font-weight: 300;
    color: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background .15s;
    line-height: 1;
}
.wc-qty-ctrl__btn:hover { background: #f0f0f0; }
.wc-qty-ctrl__input {
    width: 44px;
    height: 100%;
    border: none;
    border-left: 1.5px solid #d0d0d0;
    border-right: 1.5px solid #d0d0d0;
    text-align: center;
    font-size: .95rem;
    font-weight: 600;
    color: var(--color-primary);
    background: transparent;
    -moz-appearance: textfield;
    outline: none;
}
.wc-qty-ctrl__input::-webkit-inner-spin-button,
.wc-qty-ctrl__input::-webkit-outer-spin-button { -webkit-appearance: none; }

/* Botón eliminar (trash, fondo dorado) */
.wc-cart__card-rm {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    background: var(--color-gold);
    border-radius: 8px;
    text-decoration: none;
    color: #fff;
    transition: background .15s;
}
.wc-cart__card-rm:hover { background: var(--color-gold-dark); color: #fff; }
.wc-cart__card-rm svg { stroke: #fff; }

/* Acciones: cupón + actualizar */
.wc-cart__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 20px 4px 0;
    flex-wrap: wrap;
}
.btn-sm { font-size: .82rem; padding: 8px 16px; }
.wc-cart__coupon { display: flex; gap: 8px; }
.wc-cart__coupon-input {
    padding: 8px 14px;
    border: 1.5px solid #ddd;
    border-radius: 6px;
    font-size: .88rem;
    width: 190px;
}
.wc-cart__coupon-input:focus { outline: none; border-color: var(--color-primary); }

/* ── Panel derecho: Order Summary ─────────────────────────────────── */
.wc-cart__totals-box {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 4px 28px rgba(0,0,0,.09);
    padding: 28px 24px;
    position: sticky;
    top: 100px;
}
.wc-cart__totals-title {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--color-primary);
    margin-bottom: 20px;
}

/* Items en el summary */
.wc-ot__items { display: flex; flex-direction: column; gap: 0; }
.wc-ot__item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding: 10px 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: .88rem;
    color: var(--color-text);
}
.wc-ot__item:last-child { border-bottom: none; }
.wc-ot__item-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 160px;
}
.wc-ot__item-price { font-weight: 600; white-space: nowrap; flex-shrink: 0; }
.wc-ot__item--coupon .wc-ot__item-price { color: #e74c3c; }

/* Divisor */
.wc-ot__divider {
    height: 1px;
    background: #ebebeb;
    margin: 14px 0;
}

/* Fila total (dorada) */
.wc-ot__total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-gold);
}
.wc-ot__total .woocommerce-Price-amount { color: inherit; }

/* Botones del summary */
.wc-ot__actions { display: flex; flex-direction: column; gap: 10px; }
.wc-ot__btn-shop {
    display: block;
    width: 100%;
    padding: 12px 16px;
    border: 2px solid var(--color-primary);
    border-radius: 8px;
    text-align: center;
    font-weight: 600;
    font-size: .9rem;
    color: var(--color-primary);
    text-decoration: none;
    transition: background .15s, color .15s;
}
.wc-ot__btn-shop:hover { background: var(--color-primary); color: #fff; }

/* Override botón checkout de WooCommerce */
.wc-cart__sidebar .wc-proceed-to-checkout { margin: 0; padding: 0; }
.wc-cart__sidebar .checkout-button,
.wc-cart__sidebar .wc-proceed-to-checkout a.checkout-button {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box;
    padding: 13px 16px !important;
    background: var(--color-gold) !important;
    color: #fff !important;
    text-align: center;
    border-radius: 8px;
    font-weight: 700;
    font-size: .9rem;
    text-decoration: none !important;
    transition: background .2s;
    border: none;
}
.wc-cart__sidebar .checkout-button:hover,
.wc-cart__sidebar .wc-proceed-to-checkout a.checkout-button:hover {
    background: var(--color-gold-dark) !important;
    color: #fff !important;
}

/* Estado vacío */
.wc-cart__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 80px 24px;
    text-align: center;
}
.wc-cart__empty svg { width: 64px; height: 64px; stroke: #ccc; }
.wc-cart__empty p { font-size: 1.05rem; color: #777; margin: 0; }

/* ── Loading overlay (auto-update) ────────────────────────────────── */
.wc-cart-loading .wc-cart__main {
    opacity: .45;
    pointer-events: none;
    transition: opacity .2s;
}

/* ── Responsive ────────────────────────────────────────────────────── */
@media (max-width: 960px) {
    .wc-cart__layout { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
    .wc-cart__card {
        flex-wrap: wrap;
        gap: 14px;
    }
    .wc-cart__card-right { flex-direction: row; align-items: center; }
    .wc-cart__card-price { font-size: 1.15rem; }
}

/* ══════════════════════════════════════════════════════════════════════════
   CHECKOUT — FINALIZAR COMPRA
══════════════════════════════════════════════════════════════════════════ */

.wc-checkout__title {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--color-primary);
    margin-bottom: 28px;
}

/* ── Layout 2 columnas ─────────────────────────────────────────────── */
.wc-checkout__layout {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 32px;
    align-items: start;
}

/* ── Columna izquierda: formulario ─────────────────────────────────── */

/* Secciones como tarjetas */
.wc-checkout__form .woocommerce-billing-fields,
.wc-checkout__form .woocommerce-shipping-fields,
.wc-checkout__form .woocommerce-additional-fields {
    background: #fff;
    border-radius: 14px;
    padding: 28px;
    margin-bottom: 20px;
    box-shadow: 0 2px 16px rgba(0,0,0,.06);
}

/* Headings de sección */
.wc-checkout__form .woocommerce-billing-fields > h3,
.wc-checkout__form .woocommerce-shipping-fields > h3,
.wc-checkout__form .woocommerce-additional-fields > h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-primary);
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid #eee;
}

/* Grid 2 columnas para los campos */
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 16px;
}
.woocommerce-billing-fields__field-wrapper .form-row-wide,
.woocommerce-shipping-fields__field-wrapper .form-row-wide { grid-column: 1 / -1; }

/* Grid 50/50 para el wrapper de campos — anula las reglas de WooCommerce */
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0 16px;
}

/* Nombre y Apellidos: columna exacta — anula float:left/width:47% de WooCommerce */
.woocommerce-billing-fields__field-wrapper .form-row-first,
.woocommerce-billing-fields__field-wrapper .form-row-last,
.woocommerce-shipping-fields__field-wrapper .form-row-first,
.woocommerce-shipping-fields__field-wrapper .form-row-last {
    float: none !important;
    width: 100% !important;
    margin-right: 0 !important;
    box-sizing: border-box;
}
.woocommerce-billing-fields__field-wrapper .form-row-first,
.woocommerce-shipping-fields__field-wrapper .form-row-first { grid-column: 1; }
.woocommerce-billing-fields__field-wrapper .form-row-last,
.woocommerce-shipping-fields__field-wrapper .form-row-last  { grid-column: 2; }

/* Cada campo */
.wc-checkout__form .form-row { margin-bottom: 14px; }
.wc-checkout__form label {
    display: block;
    font-size: .82rem;
    font-weight: 600;
    color: var(--color-primary);
    margin-bottom: 6px;
}
.wc-checkout__form label .required { color: var(--color-gold); margin-left: 2px; }
.wc-checkout__form .woocommerce-input-wrapper { display: block; }

/* Inputs, selects, textarea */
.wc-checkout__form .input-text,
.wc-checkout__form input[type="text"],
.wc-checkout__form input[type="email"],
.wc-checkout__form input[type="tel"],
.wc-checkout__form input[type="number"],
.wc-checkout__form input[type="password"],
.wc-checkout__form select:not(.select2-hidden-accessible),
.wc-checkout__form textarea {
    width: 100%;
    padding: 10px 14px;
    border: 1.5px solid #ddd;
    border-radius: 8px;
    font-size: .9rem;
    font-family: inherit;
    color: var(--color-primary);
    background: #fafafa;
    box-sizing: border-box;
    transition: border-color .15s, background .15s;
}
.wc-checkout__form .input-text:focus,
.wc-checkout__form input:focus,
.wc-checkout__form select:focus,
.wc-checkout__form textarea:focus {
    outline: none;
    border-color: var(--color-gold);
    background: #fff;
}
.wc-checkout__form textarea { min-height: 90px; resize: vertical; }

/* Select2 (dropdown de país/estado) */
.wc-checkout__form .select2-container .select2-selection--single {
    height: 42px;
    border: 1.5px solid #ddd;
    border-radius: 8px;
    background: #fafafa;
    display: flex;
    align-items: center;
}
.wc-checkout__form .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 42px;
    padding-left: 14px;
    color: var(--color-primary);
    font-size: .9rem;
}
.wc-checkout__form .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 42px;
    right: 8px;
}
.wc-checkout__form .select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--color-gold);
}

/* Checkbox "Ship to different address" */
.wc-checkout__form .woocommerce-shipping-fields > h3 label {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-size: .9rem;
    font-weight: 600;
}
.wc-checkout__form input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: var(--color-gold);
    cursor: pointer;
}

/* Validación */
.wc-checkout__form .woocommerce-invalid .input-text,
.wc-checkout__form .woocommerce-invalid input,
.wc-checkout__form .woocommerce-invalid select { border-color: #e74c3c !important; }
.wc-checkout__form .woocommerce-invalid-required-field label::after {
    content: ' — requerido';
    color: #e74c3c;
    font-weight: 400;
    font-size: .78rem;
}

/* Aviso de cupón / login (WooCommerce lo coloca antes del form) */
.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
    background: #fffbee;
    border-left: 4px solid var(--color-gold);
    border-radius: 0 8px 8px 0;
    padding: 12px 16px;
    margin-bottom: 20px;
    font-size: .88rem;
    list-style: none;
}
.woocommerce-checkout .woocommerce-form-coupon {
    background: #fff;
    border-radius: 14px;
    padding: 20px 24px;
    margin-bottom: 20px;
    box-shadow: 0 2px 12px rgba(0,0,0,.05);
    display: flex;
    gap: 12px;
    align-items: flex-end;
    flex-wrap: wrap;
}
.woocommerce-checkout .woocommerce-form-coupon .form-row { margin: 0; flex: 1; }

/* ── Columna derecha: resumen + pago ───────────────────────────────── */
.wc-checkout__summary {
    background: #fff;
    border-radius: 14px;
    padding: 28px;
    box-shadow: 0 4px 28px rgba(0,0,0,.09);
    position: sticky;
    top: 100px;
}
.wc-checkout__summary-title {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-primary);
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid #eee;
}

/* Tabla de revisión del pedido */
.woocommerce-checkout-review-order-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 16px;
}
.woocommerce-checkout-review-order-table thead th {
    font-size: .76rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--color-text-muted);
    padding-bottom: 10px;
    border-bottom: 2px solid #eee;
}
.woocommerce-checkout-review-order-table td,
.woocommerce-checkout-review-order-table th {
    padding: 10px 0;
    font-size: .88rem;
    border-bottom: 1px solid #f0f0f0;
    vertical-align: middle;
}
.woocommerce-checkout-review-order-table .product-name { color: var(--color-primary); font-weight: 500; }
.woocommerce-checkout-review-order-table .product-total { text-align: right; font-weight: 600; }
.woocommerce-checkout-review-order-table tfoot .cart-subtotal th,
.woocommerce-checkout-review-order-table tfoot .cart-subtotal td,
.woocommerce-checkout-review-order-table tfoot .shipping th,
.woocommerce-checkout-review-order-table tfoot .shipping td {
    font-size: .85rem;
    color: var(--color-text-muted);
}
.woocommerce-checkout-review-order-table tfoot .order-total th,
.woocommerce-checkout-review-order-table tfoot .order-total td {
    font-weight: 700;
    font-size: 1rem;
    color: var(--color-gold);
    border-bottom: none;
    padding-top: 14px;
}

/* ¿Cliente Business? — cupón colapsable */
.wc-checkout__business {
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #eee;
}
.wc-checkout__business-text {
    font-size: .88rem;
    color: var(--color-text-muted);
    margin: 0;
}
.wc-checkout__business-toggle {
    color: var(--color-gold);
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px dashed var(--color-gold);
}
.wc-checkout__business-toggle:hover { color: var(--color-gold-dark); }
.wc-checkout__coupon-wrap {
    display: none;
    margin-top: 12px;
}
.wc-checkout__coupon-row {
    display: flex;
    gap: 8px;
}
.wc-checkout__coupon-input {
    flex: 1;
    padding: 9px 14px;
    border: 1.5px solid #ddd;
    border-radius: 8px;
    font-size: .88rem;
    color: var(--color-primary);
    font-family: inherit;
}
.wc-checkout__coupon-input:focus { outline: none; border-color: var(--color-gold); }
.wc-checkout__coupon-msg { margin-top: 8px; font-size: .82rem; }
.wc-biz-ok  { color: #2e7d32; }
.wc-biz-err { color: #c62828; }

/* Métodos de pago */
.wc-checkout__summary #payment { margin-top: 20px; }
.wc-checkout__summary #payment .wc_payment_methods {
    list-style: none;
    padding: 0;
    margin: 0 0 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.wc-checkout__summary #payment .wc_payment_method {
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    padding: 0;
    background: #fff;
    transition: border-color .2s, background .2s;
    overflow: hidden;
}
.wc-checkout__summary #payment .wc_payment_method:has(input:checked) {
    border-color: var(--color-gold);
    background: #fffdf5;
}
.wc-checkout__summary #payment .wc_payment_method > label {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    font-weight: 600;
    font-size: .9rem;
    cursor: pointer;
    color: var(--color-primary);
    margin-bottom: 0;
    width: 100%;
}
.wc-checkout__summary #payment .wc_payment_method input[type="radio"] {
    accent-color: var(--color-gold);
    width: 17px;
    height: 17px;
    flex-shrink: 0;
}
/* Icono de la pasarela */
.wc-checkout__summary #payment .wk-gateway-icon {
    width: 56px;
    height: 36px;
    object-fit: contain;
    border-radius: 6px;
    margin-left: auto;
    flex-shrink: 0;
}
/* Ocultar tooltip/descripción */
.wc-checkout__summary #payment .payment_box { display: none !important; }

/* Enlace privacidad */
.wc-checkout__summary .woocommerce-privacy-policy-text a {
    color: var(--color-primary);
    text-decoration: underline;
}

/* Botón Realizar pedido */
.wc-checkout__summary #place_order {
    width: 100%;
    padding: 14px;
    background: var(--color-gold) !important;
    color: #fff !important;
    border: none;
    border-radius: 8px;
    font-weight: 700;
    font-size: 1rem;
    cursor: pointer;
    transition: background .2s;
    font-family: inherit;
    letter-spacing: .02em;
    margin-top: 4px;
}
.wc-checkout__summary #place_order:hover { background: var(--color-gold-dark) !important; }

/* Aviso desistimiento (encima del botón) */
.wk-checkout__desistimiento {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f0f7ff;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    padding: 10px 13px;
    font-size: .78rem;
    color: #1e3a5f;
    line-height: 1.5;
    margin: 0 0 14px;
}
.wk-checkout__desistimiento-icon { flex-shrink: 0; }
.wk-checkout__desistimiento span { flex: 1; }
.wk-checkout__desistimiento a { color: #1d4ed8; text-decoration: underline; white-space: nowrap; }

/* Privacidad / términos (debajo del botón) */
.wc-checkout__summary .woocommerce-privacy-policy-text {
    font-size: .76rem;
    color: var(--color-text-muted);
    margin-top: 12px;
    line-height: 1.5;
}

/* ── Responsive ────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .wc-checkout__layout { grid-template-columns: 1fr 340px; }
}
@media (max-width: 860px) {
    .wc-checkout__layout { grid-template-columns: 1fr; }
    .wc-checkout__summary { position: static; }
}
@media (max-width: 600px) {
    .woocommerce-billing-fields__field-wrapper,
    .woocommerce-shipping-fields__field-wrapper { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════════════════════
   SINGLE PRODUCT
══════════════════════════════════════════════════════════════════════════ */

/* ── Hero layout ──────────────────────────────────────────────────────── */
.prod-single__hero {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: start;
    margin-bottom: 48px;
}

/* ── Galería (col izq) ────────────────────────────────────────────────── */
.prod-single__col-left { display: flex; flex-direction: column; gap: 14px; }
.prod-single__main-wrap { position: relative; }
.prod-single__sale-badge {
    position: absolute;
    top: 12px; left: 12px; z-index: 2;
    background: var(--color-gold);
    color: #fff;
    font-size: .7rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .07em;
    padding: 4px 10px;
    border-radius: 3px;
}
.prod-single__main-img {
    border-radius: 10px;
    overflow: hidden;
    background: #f6f5f1;
    aspect-ratio: 4 / 3;
    display: flex;
    align-items: center;
    justify-content: center;
}
.prod-single__main-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 20px;
    box-sizing: border-box;
    transition: opacity .18s;
}
.prod-single__thumbs {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}
.prod-single__thumb {
    width: 100%;
    aspect-ratio: 1;
    padding: 0;
    border: 2px solid #e8e8e8;
    border-radius: 8px;
    overflow: hidden;
    background: #f6f5f1;
    cursor: pointer;
    transition: border-color .2s;
}
.prod-single__thumb img { width: 100%; height: 100%; object-fit: contain; padding: 6px; box-sizing: border-box; }
.prod-single__thumb--active,
.prod-single__thumb:hover { border-color: var(--color-gold); }

/* Entrega — bloque de disponibilidad en página de producto */
.prod-single__delivery {
    width: 100%;
    background: #f4f3ef;
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 0;
}
.prod-single__delivery-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
}
.prod-single__delivery-row + .prod-single__delivery-row {
    border-top: 1px solid rgba(0,0,0,.07);
}
.prod-single__delivery-icon {
    width: 42px;
    height: 42px;
    min-width: 42px;
    background: var(--color-gold);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}
.prod-single__delivery-info { flex: 1; min-width: 0; }
.prod-single__delivery-info strong {
    font-size: .82rem;
    color: var(--color-primary);
    display: block;
    margin-bottom: 2px;
}
.prod-single__delivery-info p  { font-size: .8rem; color: #666; margin: 0; }
.prod-single__delivery-meta { font-size: .75rem; color: #888; display: block; margin-top: 3px; }
.prod-single__delivery-status { font-weight: 600; }
.prod-single__delivery-btn {
    font-size: .8rem;
    font-weight: 600;
    color: var(--color-primary);
    border: 1.5px solid #ccc;
    border-radius: 5px;
    padding: 6px 14px;
    text-decoration: none;
    white-space: nowrap;
    transition: border-color .2s, background .2s;
    flex-shrink: 0;
}
.prod-single__delivery-btn:hover { border-color: var(--color-gold); background: #fff; }

/* ── Info (col der) ───────────────────────────────────────────────────── */
.prod-single__col-right {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Título + rating inline */
.prod-single__title-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
}
.prod-single__name {
    font-size: 1.65rem;
    font-weight: 800;
    color: var(--color-primary);
    line-height: 1.2;
    margin: 0;
    flex: 1;
}
.prod-single__rating {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-shrink: 0;
    padding-top: 4px;
}
.prod-single__rating .star-rating { font-size: .9rem; }
.prod-single__rating-num { font-weight: 700; color: var(--color-gold); font-size: .9rem; }

/* Descripción corta */
.prod-single__short-desc {
    font-size: .9rem;
    color: #555;
    line-height: 1.65;
    margin: 0;
}

/* Precio + qty en la misma fila */
.prod-single__price-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.prod-single__prices { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.prod-single__prices .price { font-size: 1.6rem; font-weight: 800; color: var(--color-primary); }
.prod-single__prices ins { font-size: 1.6rem; font-weight: 800; color: var(--color-gold); text-decoration: none; }
.prod-single__prices del { font-size: 1.05rem; color: #aaa; }
.prod-single__prices del .amount { color: #aaa; }

/* Qty — tres celdas separadas por dividers */
.prod-single__qty {
    display: flex;
    align-items: stretch;
    border: 1.5px solid #d1d5db;
    border-radius: 8px;
    overflow: hidden;
    flex-shrink: 0;
    height: 44px;
}
.qty-circle {
    width: 44px;
    background: transparent;
    border: none;
    color: var(--color-primary);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .15s;
    border-radius: 0;
    flex-shrink: 0;
}
.qty-circle:hover  { background: #f3f4f6; }
.qty-circle:active { background: #e5e7eb; }
.qty-input {
    width: 48px;
    border: none;
    border-left:  1.5px solid #d1d5db;
    border-right: 1.5px solid #d1d5db;
    text-align: center;
    font-size: .95rem;
    font-weight: 700;
    color: var(--color-primary);
    -moz-appearance: textfield;
    background: transparent;
    outline: none;
}
.qty-input::-webkit-outer-spin-button,
.qty-input::-webkit-inner-spin-button { -webkit-appearance: none; }

/* Zoom lightbox */
.ps-zoom-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.85);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: zoom-out;
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s, visibility .25s;
}
.ps-zoom-overlay.is-open { opacity: 1; visibility: visible; }
.ps-zoom-overlay img {
    max-width: 92vw;
    max-height: 92vh;
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 0 24px 80px rgba(0,0,0,.5);
    user-select: none;
}
#ps-main-img { cursor: zoom-in; }

/* 3 botones en fila */
.prod-single__actions {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
}
.prod-single__btn-cart {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    background: var(--color-primary);
    color: #fff !important;
    border-radius: 6px;
    padding: 12px 10px;
    font-size: .88rem;
    font-weight: 700;
    text-decoration: none;
    transition: background .2s;
    text-align: center;
}
.prod-single__btn-cart:hover { background: #2a2d40; }
.prod-single__btn-buy {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: var(--color-primary) !important;
    border: 2px solid var(--color-primary);
    border-radius: 6px;
    padding: 12px 10px;
    font-size: .88rem;
    font-weight: 700;
    text-decoration: none;
    transition: background .2s, border-color .2s;
    text-align: center;
}
.prod-single__btn-buy:hover { background: #f5f4f0; }
.prod-single__btn-stock {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    color: var(--color-gold);
    border: 2px solid var(--color-gold);
    border-radius: 6px;
    padding: 12px 10px;
    font-size: .82rem;
    font-weight: 700;
    text-align: center;
}
.prod-single__no-stock {
    display: inline-block;
    border: 2px solid #c62828;
    color: #c62828;
    font-weight: 700;
    padding: 10px 24px;
    border-radius: 6px;
    font-size: .9rem;
}

/* Wishlist */
.prod-single__wishlist {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .82rem;
    color: #888;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    transition: color .2s;
}
.prod-single__wishlist:hover { color: #e53935; }
.prod-single__wishlist.is-saved { color: #e53935; }

/* Meta */
.prod-single__meta {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-top: 12px;
    border-top: 1px solid #eee;
    font-size: .8rem;
    color: #666;
}
.prod-single__meta-item { display: flex; gap: 6px; flex-wrap: wrap; }
.prod-single__meta-item strong { color: var(--color-primary); }
.prod-single__meta-item a { color: var(--color-primary); text-decoration: underline; }

/* ── Specs + Descripción (2 cols) ─────────────────────────────────────── */
.prod-single__detail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-bottom: 32px;
}
.prod-single__specs-card,
.prod-single__desc-card {
    background: #f4f3ef;
    border-radius: 10px;
    padding: 28px 28px;
}
.prod-single__card-title {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--color-primary);
    margin: 0 0 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.ps-specs-table { width: 100%; border-collapse: collapse; }
.ps-specs-table tr { border-bottom: 1px solid rgba(0,0,0,.06); }
.ps-specs-table tr:last-child { border-bottom: none; }
.ps-specs-table__label {
    padding: 10px 0;
    font-size: .85rem;
    color: #777;
    width: 45%;
    vertical-align: top;
}
.ps-specs-table__val {
    padding: 10px 0;
    font-size: .85rem;
    font-weight: 700;
    color: var(--color-gold);
    vertical-align: top;
}
.prod-single__desc-body {
    font-size: .875rem;
    color: #555;
    line-height: 1.75;
}
.prod-single__desc-body p  { margin-bottom: 12px; }
.prod-single__desc-body h2,
.prod-single__desc-body h3,
.prod-single__desc-body h4 { color: var(--color-primary); margin: 16px 0 8px; font-size: 1rem; }
.prod-single__desc-body ul,
.prod-single__desc-body ol { padding-left: 18px; margin-bottom: 12px; }
.prod-single__desc-body li { margin-bottom: 4px; }

/* ── Contacto especialista ────────────────────────────────────────────── */
.prod-single__contact {
    background: #f4f3ef;
    border-radius: 10px;
    padding: 28px;
    margin-bottom: 48px;
}
.prod-single__contact-title {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--color-primary);
    margin: 0 0 20px;
}
.prod-single__contact-items {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.ps-contact-item {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    color: var(--color-primary);
    font-size: .9rem;
    font-weight: 600;
}
.ps-contact-item__icon {
    width: 42px;
    height: 42px;
    background: var(--color-gold);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    flex-shrink: 0;
}
/* .ps-contact-item__icon--wa — usa el mismo dorado que los demás iconos */

/* ── Reseñas ──────────────────────────────────────────────────────────── */
.prod-single__reviews { margin-bottom: 48px; }
.ps-tabs__count {
    background: var(--color-primary);
    color: #fff;
    font-size: .7rem;
    font-weight: 700;
    border-radius: 10px;
    padding: 1px 7px;
}

/* ── Relacionados ─────────────────────────────────────────────────────── */
.prod-single__related { margin-bottom: 48px; }
.prod-single__related-title {
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--color-primary);
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 2px solid #eee;
}
.prod-single__related-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
}
.ps-rel-card {
    text-decoration: none;
    border-radius: 10px;
    border: 1.5px solid #eee;
    overflow: hidden;
    transition: box-shadow .2s, border-color .2s;
    display: block;
    background: #fff;
}
.ps-rel-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,.08); border-color: var(--color-gold); }
.ps-rel-card__img { position: relative; background: #f6f5f1; aspect-ratio: 1; }
.ps-rel-card__img img { width: 100%; height: 100%; object-fit: contain; display: block; padding: 12px; box-sizing: border-box; }
.ps-rel-card__badge {
    position: absolute; top: 8px; left: 8px;
    background: var(--color-gold); color: #fff;
    font-size: .65rem; font-weight: 700;
    padding: 2px 8px; border-radius: 3px; text-transform: uppercase;
}
.ps-rel-card__body { padding: 12px; border-top: 1px solid #f0f0f0; }
.ps-rel-card__name {
    font-size: .85rem; font-weight: 600; color: var(--color-primary);
    margin: 0 0 6px; line-height: 1.3;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ps-rel-card__price { font-size: .9rem; font-weight: 700; margin: 0; color: var(--color-primary); }
.ps-rel-card__price ins { color: var(--color-gold); text-decoration: none; }
.ps-rel-card__price del { color: #aaa; font-size: .75rem; }


/* ══════════════════════════════════════════════════════════════════════════
   LISTA DE DESEOS — MODAL AUTH
══════════════════════════════════════════════════════════════════════════ */
.wk-wl-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    align-items: center;
    justify-content: center;
}
.wk-wl-modal.is-open { display: flex; }
.wk-wl-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.5);
    backdrop-filter: blur(3px);
}
.wk-wl-modal__box {
    position: relative;
    background: #fff;
    border-radius: 16px;
    padding: 44px 36px 40px;
    max-width: 420px;
    width: calc(100% - 40px);
    text-align: center;
    box-shadow: 0 20px 60px rgba(0,0,0,.22);
    z-index: 1;
}
.wk-wl-modal__close {
    position: absolute;
    top: 14px;
    right: 16px;
    background: none;
    border: none;
    font-size: 22px;
    cursor: pointer;
    color: #bbb;
    line-height: 1;
    padding: 4px 8px;
    transition: color .15s;
}
.wk-wl-modal__close:hover { color: #555; }
.wk-wl-modal__icon { margin-bottom: 16px; }
.wk-wl-modal__icon svg { width: 52px; height: 52px; }
.wk-wl-modal__title { font-size: 1.25rem; font-weight: 700; margin: 0 0 10px; color: var(--color-dark); }
.wk-wl-modal__text { color: #666; font-size: .93rem; line-height: 1.6; margin: 0 0 24px; }
.wk-wl-modal__actions { display: flex; flex-direction: column; gap: 12px; }
.wk-wl-modal__register { width: 100%; text-align: center; }
.wk-wl-modal__login { color: var(--color-primary); font-size: .88rem; text-decoration: none; }
.wk-wl-modal__login:hover { text-decoration: underline; }
/* Variante: acciones en fila (confirmación) */
.wk-wl-modal__actions--row { flex-direction: row; justify-content: center; }
.wk-wl-modal__actions--row .btn { flex: 1; }
/* Ícono de advertencia (color neutro) */
.wk-wl-modal__icon--warn svg { width: 48px; height: 48px; stroke: #e65100; }
/* Botones adicionales */
.btn-danger {
    background: #e53935;
    color: #fff;
    border: none;
}
.btn-danger:hover { background: #c62828; color: #fff; }
.btn-outline {
    background: transparent;
    color: var(--color-dark);
    border: 1.5px solid #ddd;
}
.btn-outline:hover { background: #f5f5f5; }

/* ══════════════════════════════════════════════════════════════════════════
   LISTA DE DESEOS
══════════════════════════════════════════════════════════════════════════ */
.wl-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 32px;
    padding-bottom: 24px;
    border-bottom: 2px solid #eee;
}
.wl-header__title { font-size: 1.6rem; color: var(--color-primary); margin-bottom: 4px; }
.wl-header__count { color: #888; font-size: .9rem; margin: 0; }
/* Banner lista compartida */
.wl-shared-banner {
    display: flex;
    align-items: center;
    gap: 14px;
    background: #e8f5e9;
    border: 1.5px solid #a5d6a7;
    border-radius: 8px;
    padding: 14px 18px;
    margin-bottom: 28px;
    font-size: .9rem;
    color: #2e7d32;
}
.wl-shared-banner__icon { flex-shrink: 0; }
.wl-shared-banner__icon svg { width: 22px; height: 22px; }
.wl-shared-banner strong { display: block; font-weight: 700; margin-bottom: 2px; }
.wl-shared-banner span { color: #444; font-size: .85rem; }
.wl-shared-banner__link {
    margin-left: auto;
    flex-shrink: 0;
    padding: 7px 14px;
    background: var(--color-primary);
    color: #fff;
    border-radius: 5px;
    font-size: .82rem;
    font-weight: 600;
    white-space: nowrap;
    text-decoration: none;
    transition: background .2s;
}
.wl-shared-banner__link:hover { background: #0a1e3a; }

/* Grupo derecho del header: toolbar + clear */
.wl-header__actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

/* Toolbar: imprimir + guardar PDF */
.wl-toolbar {
    display: flex;
    gap: 8px;
}
.wl-toolbar__btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: none;
    border: 1.5px solid var(--color-primary);
    color: var(--color-primary);
    border-radius: 5px;
    padding: 8px 14px;
    font-size: .82rem;
    font-weight: 600;
    cursor: pointer;
    transition: background .2s, color .2s;
}
.wl-toolbar__btn svg { width: 15px; height: 15px; flex-shrink: 0; }
.wl-toolbar__btn:hover { background: var(--color-primary); color: #fff; }
.wl-toolbar__btn--pdf {
    background: var(--color-primary);
    color: #fff;
}
.wl-toolbar__btn--pdf:hover { background: #0a1e3a; border-color: #0a1e3a; }

/* Botón compartir */
.wl-share-wrap { position: relative; }
.wl-toolbar__btn--share { border-color: #25d366; color: #25d366; }
.wl-toolbar__btn--share:hover,
.wl-toolbar__btn--share.is-active { background: #25d366; color: #fff; border-color: #25d366; }

/* Menú desplegable de compartir */
.wl-share-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    background: #fff;
    border: 1.5px solid #dde3ea;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,.12);
    min-width: 220px;
    z-index: 200;
    overflow: hidden;
}
.wl-share-menu__item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 12px 16px;
    background: none;
    border: none;
    font-size: .88rem;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    text-align: left;
    transition: background .15s;
}
.wl-share-menu__item:hover { background: #f5f7fa; }
.wl-share-menu__item svg { width: 18px; height: 18px; flex-shrink: 0; }
.wl-share-menu__item--wa { color: #128c7e; }
.wl-share-menu__item--wa svg { fill: #25d366; }

.wl-header__clear {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: none;
    border: 1.5px solid #ddd;
    color: #888;
    border-radius: 5px;
    padding: 8px 16px;
    font-size: .85rem;
    cursor: pointer;
    transition: border-color .2s, color .2s;
}
.wl-header__clear:hover { border-color: #c62828; color: #c62828; }
.wl-header__clear svg { width: 15px; height: 15px; }

/* ── Área de impresión (oculta en pantalla) ────────────────────────────── */
#wl-print-area { display: none; }

.wl-pa {
    font-family: 'Inter', sans-serif;
    color: #1a1a2e;
    font-size: 11pt;
}
.wl-pa__header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    background: #1a2e4a;
    color: #fff;
    padding: 18px 24px;
    border-radius: 6px 6px 0 0;
    margin-bottom: 0;
}
.wl-pa__store {
    font-size: 1.15em;
    font-weight: 700;
    letter-spacing: .03em;
    color: #f0c040;
}
.wl-pa__title-block { text-align: right; }
.wl-pa__title { font-size: 1.05em; font-weight: 600; margin: 0; color: #fff; }
.wl-pa__date  { font-size: .85em; margin: 2px 0 0; color: #b0bec5; }

.wl-pa__table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 0;
}
.wl-pa__table thead tr {
    background: #f0f4f8;
}
.wl-pa__table th {
    text-align: left;
    padding: 10px 12px;
    font-size: .78em;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #555;
    border-bottom: 2px solid #dde3ea;
}
.wl-pa__table td {
    padding: 10px 12px;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
    font-size: .9em;
}
.wl-pa__table tbody tr:nth-child(even) { background: #fafbfc; }
.wl-pa__num   { width: 28px; color: #aaa; font-weight: 600; }
.wl-pa__img   { width: 52px; padding: 6px 8px; }
.wl-pa__thumb {
    width: 44px;
    height: 44px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #eee;
    display: block;
}
.wl-pa__name  { font-weight: 600; color: #1a2e4a; }
.wl-pa__price { font-weight: 600; white-space: nowrap; }
.wl-pa__unit  { color: #555; }
.wl-pa__qty   { text-align: center; font-weight: 600; }
.wl-pa__total { font-weight: 700; white-space: nowrap; text-align: right; }

/* Fila de total general */
.wl-pa__grand td {
    padding: 12px;
    background: #1a2e4a;
    color: #fff;
    font-weight: 700;
    font-size: 1em;
    border: none;
}
.wl-pa__grand .wl-pa__total {
    font-size: 1.1em;
    color: #f0c040;
}

.wl-pa__footer {
    text-align: center;
    margin-top: 20px;
    font-size: .78em;
    color: #aaa;
    border-top: 1px solid #eee;
    padding-top: 10px;
}

/* ── @media print ──────────────────────────────────────────────────────── */
@media print {
    /*
     * Usamos visibility (no display:none) porque visibility:hidden permite
     * que los descendientes lo sobreescriban con visibility:visible.
     * display:none colapsa el árbol entero y no se puede sobreescribir en hijos.
     */
    body * { visibility: hidden !important; }

    #wl-print-area {
        visibility: visible !important;
        display: block !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        background: #fff !important;
        z-index: 99999 !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    #wl-print-area * { visibility: visible !important; }

    .wl-pa__header { border-radius: 0 !important; }

    /* Evitar corte de filas en saltos de página */
    .wl-pa__table tbody tr { page-break-inside: avoid; }

    @page {
        size: A4 portrait;
        margin: 15mm 15mm 20mm 15mm;
    }
}

/* Loading dots */
.wl-loading {
    display: flex;
    justify-content: center;
    gap: 10px;
    padding: 60px 0;
}
.wl-loading__dot {
    width: 10px; height: 10px;
    border-radius: 50%;
    background: var(--color-gold);
    animation: wl-pulse 1.2s ease-in-out infinite;
}
.wl-loading__dot:nth-child(2) { animation-delay: .2s; }
.wl-loading__dot:nth-child(3) { animation-delay: .4s; }
@keyframes wl-pulse {
    0%, 80%, 100% { transform: scale(.7); opacity: .4; }
    40%            { transform: scale(1);  opacity: 1; }
}

/* Empty state */
.wl-empty {
    text-align: center;
    padding: 72px 24px;
}
.wl-empty svg {
    width: 56px; height: 56px;
    stroke: #ccc;
    display: block;
    margin: 0 auto 20px;
}
.wl-empty p { color: #888; font-size: 1rem; margin-bottom: 20px; }

/* Fila cantidad + añadir en wishlist */
.wl-card__add-row {
    display: flex;
    gap: 8px;
    align-items: center;
    width: 100%;
}
.wl-qty {
    display: flex;
    align-items: center;
    border: 1.5px solid #ddd;
    border-radius: 4px;
    overflow: hidden;
    flex-shrink: 0;
}
.wl-qty__btn {
    width: 30px;
    height: 34px;
    background: none;
    border: none;
    font-size: 1rem;
    cursor: pointer;
    color: var(--color-primary);
    transition: background .15s;
    line-height: 1;
}
.wl-qty__btn:hover { background: var(--color-primary); color: #fff; }
.wl-qty__input {
    width: 38px;
    height: 34px;
    border: none;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    text-align: center;
    font-size: .875rem;
    color: var(--color-primary);
    -moz-appearance: textfield;
}
.wl-qty__input::-webkit-outer-spin-button,
.wl-qty__input::-webkit-inner-spin-button { -webkit-appearance: none; }
.wl-card__add-row .prod-card__add {
    flex: 1;
    justify-content: center;
    font-size: .8rem;
    padding: 8px 10px;
}

/* Etiqueta de unidad de medida en tarjeta de producto */
.prod-card__unit {
    display: inline-block;
    margin-top: 4px;
    padding: 2px 8px;
    background: #f0f4f8;
    border: 1px solid #dde3ea;
    border-radius: 12px;
    font-size: .72rem;
    font-weight: 600;
    color: var(--color-primary);
    letter-spacing: .02em;
    text-transform: uppercase;
}

/* Corazón activo en tarjetas */
.prod-card__wishlist.is-wishlisted svg { fill: #e53935; stroke: #e53935; }
.prod-card__wishlist { position: absolute; top: 8px; right: 8px; }
.prod-card__thumb { position: relative; }

/* ══════════════════════════════════════════════════════════════════════════
   PÁGINA DE BÚSQUEDA
══════════════════════════════════════════════════════════════════════════ */
.search-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    margin-bottom: 40px;
    padding-bottom: 28px;
    border-bottom: 2px solid #eee;
}
.search-header__title {
    font-size: 1.5rem;
    color: var(--color-primary);
    margin-bottom: 6px;
}
.search-header__title span { color: var(--color-gold); }
.search-header__count { color: #888; font-size: .9rem; margin: 0; }

.search-header__form {
    display: flex;
    align-items: center;
    border: 2px solid #ddd;
    border-radius: 6px;
    overflow: hidden;
    min-width: 300px;
    transition: border-color .2s;
}
.search-header__form:focus-within { border-color: var(--color-gold); }
.search-header__input {
    flex: 1;
    padding: 10px 14px;
    border: none;
    outline: none;
    font-size: .9rem;
    color: var(--color-primary);
    background: #fafafa;
}
.search-header__btn {
    padding: 10px 14px;
    background: var(--color-primary);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    color: #fff;
    transition: background .2s;
}
.search-header__btn:hover { background: var(--color-gold); }
.search-header__btn svg { width: 18px; height: 18px; }

/* Sin resultados */
.search-empty {
    text-align: center;
    padding: 72px 24px;
    color: #999;
}
.search-empty svg {
    width: 56px;
    height: 56px;
    stroke: #ccc;
    margin-bottom: 20px;
    display: block;
    margin-inline: auto;
}
.search-empty p { font-size: 1rem; color: #555; margin-bottom: 6px; }
.search-empty strong { color: var(--color-primary); }
.search-empty__sub { font-size: .875rem; color: #aaa; }

/* Sección de resultados */
.search-section { margin-bottom: 52px; }
.search-section__head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    padding-bottom: 12px;
    border-bottom: 2px solid #eee;
}
.search-section__title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--color-primary);
    margin: 0;
}
.search-section__title svg { width: 20px; height: 20px; color: var(--color-gold); }
.search-section__badge {
    background: var(--color-gold);
    color: #fff;
    font-size: .72rem;
    font-weight: 800;
    padding: 2px 9px;
    border-radius: 20px;
    letter-spacing: .04em;
}

/* ── Responsive: ver sección completa al final del archivo ─────────────── */

/* ═══════════════════════════════════════════════════════════
   THANK YOU PAGE  (.wk-ty)
   ═══════════════════════════════════════════════════════════ */
.wk-ty {
    max-width: 780px;
    margin: 48px auto 80px;
    padding: 0 24px;
}

/* Hero */
.wk-ty__hero {
    text-align: center;
    padding: 40px 0 32px;
}
.wk-ty__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    margin-bottom: 20px;
}
.wk-ty__icon--ok {
    background: #e8f5e9;
    color: #2e7d32;
}
.wk-ty__icon--ok svg { width: 36px; height: 36px; stroke: #2e7d32; }
.wk-ty__icon--fail {
    background: #fdecea;
    color: #c62828;
}
.wk-ty__icon--fail svg { width: 36px; height: 36px; stroke: #c62828; }
.wk-ty__heading {
    font-size: 2rem;
    font-weight: 700;
    color: var(--color-primary, #3D4154);
    margin: 0 0 12px;
}
.wk-ty__sub {
    font-size: 1rem;
    color: #666;
    margin: 0;
    max-width: 480px;
    margin-inline: auto;
}

/* Meta chips */
.wk-ty__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    background: #f7f7f9;
    border: 1px solid #eee;
    border-radius: 10px;
    padding: 20px 24px;
    margin-bottom: 32px;
}
.wk-ty__meta-item {
    display: flex;
    flex-direction: column;
    flex: 1 1 160px;
}
.wk-ty__meta-label {
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #999;
    font-weight: 600;
    margin-bottom: 4px;
}
.wk-ty__meta-value {
    font-size: .95rem;
    font-weight: 600;
    color: var(--color-primary, #3D4154);
}
.wk-ty__meta-value--total {
    color: var(--color-gold, #EEB128);
    font-size: 1.05rem;
}

/* Section */
.wk-ty__section { margin-bottom: 32px; }
.wk-ty__section-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-primary, #3D4154);
    text-transform: uppercase;
    letter-spacing: .06em;
    margin: 0 0 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid #eee;
}

/* Items table */
.wk-ty__items {
    width: 100%;
    border-collapse: collapse;
}
.wk-ty__items thead th {
    text-align: left;
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #999;
    font-weight: 600;
    padding: 8px 12px;
    border-bottom: 2px solid #eee;
}
.wk-ty__items tbody td {
    padding: 12px;
    border-bottom: 1px solid #f0f0f0;
    vertical-align: middle;
    font-size: .9rem;
    color: var(--color-primary, #3D4154);
}
.wk-ty__col-qty { text-align: center; width: 60px; }
.wk-ty__col-price { text-align: right; width: 100px; font-weight: 600; }
.wk-ty__item-wrap { display: flex; align-items: center; gap: 12px; }
.wk-ty__item-img {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 6px;
    border: 1px solid #eee;
    flex-shrink: 0;
}
.wk-ty__item-info { display: flex; flex-direction: column; gap: 2px; }
.wk-ty__item-name { font-weight: 600; }
.wk-ty__item-meta { font-size: .8rem; color: #888; }

/* Tfoot totals */
.wk-ty__items tfoot th,
.wk-ty__items tfoot td {
    padding: 8px 12px;
    font-size: .88rem;
    color: #666;
    border-top: 1px solid #eee;
    text-align: right;
}
.wk-ty__items tfoot th { text-align: right; font-weight: 500; }
.wk-ty__total-row--grand th,
.wk-ty__total-row--grand td {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-primary, #3D4154);
    border-top: 2px solid #ddd;
    padding-top: 12px;
}
.wk-ty__total-row--grand td { color: var(--color-gold, #EEB128); }

/* Addresses */
.wk-ty__addresses {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 32px;
}
.wk-ty__address-block {
    background: #f7f7f9;
    border: 1px solid #eee;
    border-radius: 10px;
    padding: 20px 24px;
}
.wk-ty__address-title {
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #999;
    font-weight: 600;
    margin: 0 0 10px;
}
.wk-ty__address {
    font-style: normal;
    font-size: .9rem;
    color: var(--color-primary, #3D4154);
    line-height: 1.6;
}

/* Actions */
.wk-ty__actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    padding-top: 8px;
}

/* Failed state */
.wk-ty__failed { text-align: center; padding: 60px 0; }

/* Responsive */
@media (max-width: 600px) {
    .wk-ty__meta-item { flex: 1 1 100%; }
    .wk-ty__addresses { grid-template-columns: 1fr; }
    .wk-ty__heading { font-size: 1.5rem; }
    .wk-ty__items thead { display: none; }
    .wk-ty__items tbody td { display: block; text-align: right; padding: 6px 12px; }
    .wk-ty__items tbody td::before {
        content: attr(data-label);
        float: left;
        font-weight: 600;
        color: #999;
        font-size: .8rem;
    }
    .wk-ty__col-qty, .wk-ty__col-price { width: auto; }
    .wk-ty__item-wrap { justify-content: flex-end; }
}

/* ═══════════════════════════════════════════════════════════
   MIS PEDIDOS  (.wk-orders)
   ═══════════════════════════════════════════════════════════ */
.wk-orders { display: flex; flex-direction: column; gap: 12px; }

.wk-order-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 10px;
    padding: 18px 20px;
    transition: box-shadow .15s;
}
.wk-order-card:hover { box-shadow: 0 2px 12px rgba(0,0,0,.07); }

.wk-order-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}
.wk-order-card__label {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: #aaa;
    display: block;
    margin-bottom: 2px;
}
.wk-order-card__num {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-primary, #3D4154);
    text-decoration: none;
}
.wk-order-card__num:hover { color: var(--color-gold, #EEB128); }

.wk-order-card__status {
    font-size: .75rem;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 20px;
    white-space: nowrap;
}

.wk-order-card__meta {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    font-size: .85rem;
    color: #666;
    margin-bottom: 14px;
}
.wk-order-card__meta-item {
    display: flex;
    align-items: center;
    gap: 5px;
}
.wk-order-card__meta-item svg { opacity: .5; flex-shrink: 0; }
.wk-order-card__total {
    margin-left: auto;
    font-weight: 700;
    color: var(--color-primary, #3D4154);
    font-size: .95rem;
}

.wk-order-card__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.wk-order-card__action {
    display: inline-block;
    padding: 7px 16px;
    border-radius: 6px;
    font-size: .82rem;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid #ddd;
    color: #555;
    transition: all .15s;
}
.wk-order-card__action:hover { border-color: var(--color-primary, #3D4154); color: var(--color-primary, #3D4154); }
.wk-order-card__action--primary {
    background: var(--color-primary, #3D4154);
    color: #fff !important;
    border-color: var(--color-primary, #3D4154);
}
.wk-order-card__action--primary:hover { background: var(--color-gold, #EEB128); border-color: var(--color-gold, #EEB128); color: #fff !important; }

/* Vacío */
.wk-orders-empty {
    text-align: center;
    padding: 60px 0;
    color: #aaa;
}
.wk-orders-empty svg { width: 52px; height: 52px; margin: 0 auto 16px; display: block; opacity: .3; }
.wk-orders-empty p { font-size: 1rem; color: #888; margin-bottom: 20px; }

/* Paginación */
.wk-orders-pagination { display: flex; gap: 10px; margin-top: 20px; }
.wk-orders-pagination__btn {
    padding: 8px 18px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: .85rem;
    font-weight: 600;
    color: var(--color-primary, #3D4154);
    text-decoration: none;
    transition: all .15s;
}
.wk-orders-pagination__btn:hover { background: var(--color-primary, #3D4154); color: #fff; border-color: var(--color-primary, #3D4154); }

/* ═══════════════════════════════════════════════════════════
   VER PEDIDO  (.wk-view-order)
   ═══════════════════════════════════════════════════════════ */
.wk-view-order { }

.wk-view-order__back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .85rem;
    font-weight: 600;
    color: #888;
    text-decoration: none;
    margin-bottom: 20px;
    transition: color .15s;
}
.wk-view-order__back:hover { color: var(--color-primary, #3D4154); }

.wk-view-order__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 2px solid #eee;
    flex-wrap: wrap;
}
.wk-view-order__title {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--color-primary, #3D4154);
    margin: 0 0 4px;
}
.wk-view-order__date { font-size: .85rem; color: #999; margin: 0; }
.wk-view-order__status {
    font-size: .8rem;
    font-weight: 600;
    padding: 6px 14px;
    border-radius: 20px;
    white-space: nowrap;
    align-self: center;
}

/* Notas */
.wk-view-order__notes { margin-bottom: 28px; }
.wk-view-order__section-title {
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: #aaa;
    font-weight: 700;
    margin: 0 0 12px;
}
.wk-view-order__note-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.wk-view-order__note {
    background: #f7f7f9;
    border-left: 3px solid var(--color-gold, #EEB128);
    padding: 12px 16px;
    border-radius: 0 6px 6px 0;
}
.wk-view-order__note-date { font-size: .75rem; color: #aaa; display: block; margin-bottom: 4px; }
.wk-view-order__note-text { font-size: .9rem; color: var(--color-primary, #3D4154); }
.wk-view-order__note-text p { margin: 0; }

/* Detalles WooCommerce (tabla de items + totales + direcciones) */
.wk-view-order__details { margin-bottom: 28px; }
.wk-view-order__details table.shop_table {
    width: 100%;
    border-collapse: collapse;
    font-size: .9rem;
}
.wk-view-order__details table.shop_table th,
.wk-view-order__details table.shop_table td {
    padding: 10px 12px;
    border-bottom: 1px solid #f0f0f0;
    color: var(--color-primary, #3D4154);
    text-align: left;
}
.wk-view-order__details table.shop_table th {
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #999;
    font-weight: 700;
    border-bottom: 2px solid #eee;
}
.wk-view-order__details table.shop_table tfoot th,
.wk-view-order__details table.shop_table tfoot td {
    border-bottom: none;
    color: #666;
    font-weight: 500;
}
.wk-view-order__details table.shop_table tfoot tr:last-child th,
.wk-view-order__details table.shop_table tfoot tr:last-child td {
    font-weight: 700;
    font-size: 1rem;
    color: var(--color-primary, #3D4154);
    border-top: 2px solid #eee;
    padding-top: 12px;
}

/* Footer acciones */
.wk-view-order__footer-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    padding-top: 8px;
}

@media (max-width: 600px) {
    .wk-order-card__total { margin-left: 0; }
    .wk-view-order__header { flex-direction: column; }
    .wk-view-order__footer-actions { flex-direction: column; }
    .wk-view-order__footer-actions .btn { text-align: center; }
}

/* ═══════════════════════════════════════════════════════════
   MIS DIRECCIONES  (.wk-addresses / .wk-address-card)
   ═══════════════════════════════════════════════════════════ */
.wk-addresses {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.wk-address-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 10px;
    overflow: hidden;
    transition: box-shadow .15s;
}
.wk-address-card:hover { box-shadow: 0 2px 12px rgba(0,0,0,.07); }
.wk-address-card--empty { border-style: dashed; background: #fafafa; }

.wk-address-card__head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    border-bottom: 1px solid #f0f0f0;
    background: #f7f7f9;
}
.wk-address-card__icon { color: var(--color-gold, #EEB128); flex-shrink: 0; }
.wk-address-card__title {
    font-size: .85rem;
    font-weight: 700;
    color: var(--color-primary, #3D4154);
    text-transform: uppercase;
    letter-spacing: .05em;
    margin: 0;
    flex: 1;
}
.wk-address-card__edit {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: .78rem;
    font-weight: 600;
    color: #888;
    text-decoration: none;
    padding: 4px 8px;
    border-radius: 5px;
    border: 1px solid #ddd;
    background: #fff;
    transition: all .15s;
    white-space: nowrap;
}
.wk-address-card__edit:hover {
    color: var(--color-primary, #3D4154);
    border-color: var(--color-primary, #3D4154);
}

.wk-address-card__body { padding: 18px; }
.wk-address-card__address {
    font-style: normal;
    font-size: .9rem;
    color: var(--color-primary, #3D4154);
    line-height: 1.7;
}
.wk-address-card__empty-msg {
    font-size: .88rem;
    color: #aaa;
    margin: 0 0 14px;
}

/* Botón pequeño */
.btn--sm { padding: 7px 14px !important; font-size: .8rem !important; }

/* ── Formulario editar dirección ─── */
.wk-edit-address__title {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--color-primary, #3D4154);
    margin: 0 0 24px;
    padding-bottom: 16px;
    border-bottom: 2px solid #eee;
}

.wk-edit-address__form .woocommerce-address-fields__field-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 16px;
}

/* Campos que ocupan ancho completo */
.wk-edit-address__form .form-row-wide { grid-column: 1 / -1; }
.wk-edit-address__form .form-row-first { grid-column: 1; }
.wk-edit-address__form .form-row-last  { grid-column: 2; }

.wk-edit-address__actions {
    display: flex;
    gap: 12px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}

@media (max-width: 640px) {
    .wk-addresses { grid-template-columns: 1fr; }
    .wk-edit-address__form .woocommerce-address-fields__field-wrapper {
        grid-template-columns: 1fr;
    }
    .wk-edit-address__form .form-row-first,
    .wk-edit-address__form .form-row-last { grid-column: 1; }
    .wk-edit-address__actions { flex-direction: column; }
}

/* ══════════════════════════════════════════════════════════════════════════
   PÁGINA 404
   ══════════════════════════════════════════════════════════════════════════ */
.wk-404 {
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 80px 20px;
    background: #fafaf8;
}
.wk-404__inner {
    text-align: center;
    max-width: 540px;
}
.wk-404__number {
    font-size: clamp(7rem, 20vw, 12rem);
    font-weight: 800;
    line-height: 1;
    color: transparent;
    -webkit-text-stroke: 3px var(--color-gold);
    letter-spacing: -4px;
    margin-bottom: 12px;
    user-select: none;
}
.wk-404__title {
    font-size: clamp(1.4rem, 3vw, 2rem);
    font-weight: 700;
    color: var(--color-primary);
    margin: 0 0 14px;
}
.wk-404__text {
    font-size: .95rem;
    color: #666;
    line-height: 1.7;
    margin: 0 0 32px;
}
.wk-404__search { margin-bottom: 28px; }
.wk-404__search-form {
    display: flex;
    border: 1.5px solid #ddd;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    transition: border-color .2s;
}
.wk-404__search-form:focus-within { border-color: var(--color-gold); }
.wk-404__search-input {
    flex: 1;
    border: none;
    padding: 12px 16px;
    font-size: .95rem;
    color: var(--color-primary);
    background: transparent;
    outline: none;
}
.wk-404__search-input::placeholder { color: #aaa; }
.wk-404__search-btn {
    background: none;
    border: none;
    padding: 0 16px;
    cursor: pointer;
    color: var(--color-primary);
    display: flex;
    align-items: center;
    transition: color .2s;
}
.wk-404__search-btn:hover { color: var(--color-gold); }
.wk-404__actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}

/* ══════════════════════════════════════════════════════════════════════════
   PANEL DE NOTIFICACIONES
   ══════════════════════════════════════════════════════════════════════════ */
.whanau-header__notif-wrap {
    position: relative;
}
.wk-notif-panel {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    width: 320px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 8px 32px rgba(0,0,0,.14);
    border: 1px solid #eee;
    z-index: 1200;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity .2s, transform .2s, visibility .2s;
}
.wk-notif-panel.is-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
/* Triángulo */
.wk-notif-panel::before {
    content: '';
    position: absolute;
    top: -7px;
    right: 14px;
    width: 14px;
    height: 14px;
    background: #fff;
    border-left: 1px solid #eee;
    border-top: 1px solid #eee;
    transform: rotate(45deg);
}
.wk-notif-panel__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px 10px;
    border-bottom: 1px solid #f0f0f0;
}
.wk-notif-panel__title {
    font-weight: 700;
    font-size: .875rem;
    color: var(--color-primary);
}
.wk-notif-panel__mark {
    background: none;
    border: none;
    font-size: .75rem;
    color: var(--color-gold);
    font-weight: 600;
    cursor: pointer;
    padding: 0;
    text-decoration: underline;
}
.wk-notif-panel__mark:hover { color: var(--color-primary); }
.wk-notif-panel__body {
    max-height: 340px;
    overflow-y: auto;
}
.wk-notif-panel__empty {
    padding: 24px 16px;
    text-align: center;
    font-size: .85rem;
    color: #aaa;
    margin: 0;
}
.wk-notif-panel__empty a { color: var(--color-gold); }

/* Items */
.wk-notif-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid #f5f5f5;
    text-decoration: none;
    color: var(--color-primary);
    transition: background .15s;
    position: relative;
}
.wk-notif-item:last-child { border-bottom: none; }
.wk-notif-item:hover { background: #fafaf8; }
.wk-notif-item--unread { background: #fffbee; }
.wk-notif-item--unread:hover { background: #fff8e0; }

.wk-notif-item__icon {
    flex-shrink: 0;
    margin-top: 1px;
}
.wk-notif-item__body {
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1;
    min-width: 0;
}
.wk-notif-item__msg {
    font-size: .83rem;
    line-height: 1.4;
    color: var(--color-primary);
}
.wk-notif-item__time {
    font-size: .72rem;
    color: #aaa;
}
.wk-notif-item__dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--color-gold);
    flex-shrink: 0;
    margin-top: 5px;
}

/* ── Modal Añadir al Carrito ─────────────────────────────────────────────── */

/* Ocultar comportamiento por defecto de WooCommerce */
.added_to_cart,
.woocommerce-notices-wrapper .woocommerce-message { display: none !important; }

/* Contenedor principal del modal */
.wk-cart-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s, visibility .25s;
}
.wk-cart-modal.is-open {
    opacity: 1;
    visibility: visible;
}

/* Overlay oscuro */
.wk-cart-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.55);
    cursor: pointer;
}

/* Caja del modal */
.wk-cart-modal__box {
    position: relative;
    background: #fff;
    border-radius: 12px;
    padding: 40px 36px;
    width: 90%;
    max-width: 420px;
    text-align: center;
    box-shadow: 0 20px 60px rgba(0,0,0,.2);
    z-index: 1;
}

/* ── Spinner ── */
.wk-cart-modal__spinner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}
.wk-cart-modal__spinner p {
    margin: 0;
    font-size: .95rem;
    color: var(--color-text-muted);
}

.wk-spinner {
    width: 48px;
    height: 48px;
    border: 4px solid var(--color-border);
    border-top-color: var(--color-gold);
    border-radius: 50%;
    animation: wk-spin .8s linear infinite;
}

@keyframes wk-spin {
    to { transform: rotate(360deg); }
}

/* ── Estado éxito ── */
.wk-cart-modal__success {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

/* Círculo con check dorado */
.wk-cart-modal__check {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: var(--color-gold);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 4px;
}
.wk-cart-modal__check svg {
    width: 28px;
    height: 28px;
    stroke: #fff;
    fill: none;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.wk-cart-modal__msg {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--color-primary);
}
.wk-cart-modal__product-name {
    margin: 0;
    font-size: .88rem;
    color: var(--color-text-muted);
}

/* Botones del modal */
.wk-cart-modal__actions {
    display: flex;
    gap: 10px;
    margin-top: 8px;
    width: 100%;
}
.wk-cart-modal__actions .btn {
    flex: 1;
    padding: 10px 16px;
    border-radius: var(--radius);
    font-size: .9rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    transition: opacity .2s;
    border: 2px solid var(--color-primary);
}
.wk-cart-modal__actions .btn:hover { opacity: .85; }
.wk-cart-modal__actions .btn-dark {
    background: var(--color-primary);
    color: #fff;
}
.wk-cart-modal__actions .btn-outline {
    background: transparent;
    color: var(--color-primary);
}

/* ── Modal: estados check/error ─────────────────────────────────────────── */
.wk-cart-modal__check--ok  { background: #22c55e; } /* verde */
.wk-cart-modal__check--err { background: #ef4444; } /* rojo */

/* Estado de error */
.wk-cart-modal__error {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}
.wk-cart-modal__error-text {
    margin: 0;
    font-size: .88rem;
    color: #ef4444;
    line-height: 1.4;
    max-width: 300px;
}

/* Un solo botón centrado */
.wk-cart-modal__actions--single {
    justify-content: center;
}
.wk-cart-modal__actions--single .btn {
    flex: unset;
    min-width: 140px;
}

/* Asegurar que hidden funcione aunque haya display:flex definido */
.wk-cart-modal__spinner[hidden],
.wk-cart-modal__success[hidden],
.wk-cart-modal__error[hidden] { display: none !important; }

/* ── Estado de disponibilidad de entrega ───────────────────────────────────── */
.prod-single__delivery-status { font-weight: 600; }
.prod-single__delivery-status--ok   { color: #22c55e; }
.prod-single__delivery-status--no   { color: #ef4444; }
.prod-single__delivery-status--muted{ color: var(--color-text-muted); font-weight: 400; }

/* ══════════════════════════════════════════════════════════════
   PÁGINAS LEGALES  (.legal-page)
   ══════════════════════════════════════════════════════════════ */
.legal-page {
    max-width: 780px;
    margin: 32px auto 80px;
}
.legal-page__header {
    border-bottom: 2px solid var(--color-gold);
    padding-bottom: 20px;
    margin-bottom: 36px;
}
.legal-page__title {
    font-size: clamp(1.6rem, 4vw, 2.2rem);
    font-weight: 700;
    color: var(--color-primary);
    margin: 0 0 8px;
}
.legal-page__meta {
    font-size: .82rem;
    color: var(--color-text-muted);
    margin: 0;
}

/* Contenido editable desde el dashboard */
.legal-page__body { line-height: 1.8; color: var(--color-text, #444); }
.legal-page__body h2 {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--color-primary);
    margin: 40px 0 12px;
    padding-bottom: 6px;
    border-bottom: 1px solid #eee;
}
.legal-page__body h3 {
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--color-primary);
    margin: 28px 0 8px;
}
.legal-page__body p  { margin: 0 0 16px; }
.legal-page__body ul,
.legal-page__body ol { padding-left: 24px; margin: 0 0 16px; }
.legal-page__body li { margin-bottom: 6px; }
.legal-page__body a  { color: var(--color-gold); text-decoration: underline; }
.legal-page__body strong { color: var(--color-primary); }

/* ══════════════════════════════════════════════════════════════
   CANCELACIÓN DE PEDIDO  (.wk-cancel-block)
   ══════════════════════════════════════════════════════════════ */
.wk-cancel-block {
    background: #fff8f8;
    border: 1.5px solid #fecaca;
    border-radius: 12px;
    padding: 20px 24px;
    margin: 24px 0;
}
.wk-cancel-block__info {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: .87rem;
    color: #7f1d1d;
    line-height: 1.5;
    margin: 0 0 16px;
}
.wk-cancel-block__info svg { flex-shrink: 0; margin-top: 2px; }
.wk-cancel-block__reason-label {
    display: block;
    font-size: .82rem;
    font-weight: 600;
    color: var(--color-primary);
    margin-bottom: 6px;
}
.wk-cancel-block__reason {
    width: 100%;
    border: 1.5px solid #e5e7eb;
    border-radius: 8px;
    padding: 10px 12px;
    font-size: .85rem;
    font-family: inherit;
    color: var(--color-primary);
    resize: vertical;
    margin-bottom: 14px;
    box-sizing: border-box;
}
.wk-cancel-block__reason:focus { outline: none; border-color: #fca5a5; }
.wk-cancel-block__btn {
    background: #fff !important;
    color: #dc2626 !important;
    border: 1.5px solid #dc2626 !important;
    font-size: .88rem;
    padding: 10px 20px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
    transition: background .2s, color .2s;
}
.wk-cancel-block__btn:hover {
    background: #dc2626 !important;
    color: #fff !important;
}

/* Mensajes de resultado */
.wk-cancel-notice {
    border-radius: 10px;
    padding: 14px 18px;
    font-size: .88rem;
    font-weight: 500;
    margin-bottom: 20px;
    line-height: 1.5;
}
.wk-cancel-notice--success {
    background: #f0fdf4;
    border: 1.5px solid #86efac;
    color: #14532d;
}
.wk-cancel-notice--error {
    background: #fff8f8;
    border: 1.5px solid #fca5a5;
    color: #7f1d1d;
}


/* ═══════════════════════════════════════════════════════════════════════
   HAMBURGER + DRAWER MOBILE
═══════════════════════════════════════════════════════════════════════ */

/* — Botón hamburger — */
.whanau-hamburger {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    background: var(--color-primary);
    border: none;
    border-radius: var(--radius-sm);
    cursor: pointer;
    padding: 9px;
    flex-shrink: 0;
    transition: background 0.2s;
}
.whanau-hamburger:hover { background: var(--color-gold); }
.whanau-hamburger span {
    display: block;
    width: 20px;
    height: 2px;
    background: #fff;
    border-radius: 2px;
    transition: transform 0.3s, opacity 0.3s;
    transform-origin: center;
}
.whanau-hamburger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.whanau-hamburger.is-open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.whanau-hamburger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* — Drawer — */
.wk-mobile-nav {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    pointer-events: none;
}
.wk-mobile-nav.is-open {
    display: block;
    pointer-events: all;
}
.wk-mobile-nav__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.55);
    opacity: 0;
    transition: opacity 0.3s;
}
.wk-mobile-nav.is-open .wk-mobile-nav__overlay { opacity: 1; }

.wk-mobile-nav__drawer {
    position: absolute;
    top: 0;
    right: 0;
    width: min(320px, 86vw);
    height: 100%;
    background: var(--color-primary);
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(.4,0,.2,1);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    -webkit-overflow-scrolling: touch;
}
.wk-mobile-nav.is-open .wk-mobile-nav__drawer { transform: translateX(0); }

.wk-mobile-nav__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px 14px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    flex-shrink: 0;
}
.wk-mobile-nav__head img { height: 30px; width: auto; filter: brightness(0) invert(1); }

.wk-mobile-nav__close {
    background: none;
    border: none;
    color: rgba(255,255,255,0.8);
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: background 0.2s;
}
.wk-mobile-nav__close:hover { background: rgba(255,255,255,0.1); color: #fff; }

/* Lista de nav en el drawer */
.wk-mobile-nav__list {
    list-style: none;
    margin: 0;
    padding: 8px 0;
    flex: 1;
}
.wk-mobile-nav__list > li { margin: 0; }
.wk-mobile-nav__list > li > a {
    display: block;
    padding: 14px 20px;
    color: rgba(255,255,255,0.9);
    font-size: 15px;
    font-weight: 500;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    transition: background 0.15s, color 0.15s;
}
.wk-mobile-nav__list > li > a:hover,
.wk-mobile-nav__list > li.current-menu-item > a,
.wk-mobile-nav__list > li.current-menu-ancestor > a {
    background: rgba(255,255,255,0.08);
    color: var(--color-gold);
}
.wk-mobile-nav__list .sub-menu {
    background: rgba(0,0,0,0.18);
    list-style: none;
    margin: 0;
    padding: 0;
}
.wk-mobile-nav__list .sub-menu li a {
    display: block;
    padding: 11px 20px 11px 36px;
    color: rgba(255,255,255,0.6);
    font-size: 14px;
    border-bottom: 1px solid rgba(255,255,255,0.04);
    transition: color 0.15s;
}
.wk-mobile-nav__list .sub-menu li a:hover { color: var(--color-gold); }

/* Pie del drawer */
.wk-mobile-nav__foot {
    padding: 14px 20px 28px;
    border-top: 1px solid rgba(255,255,255,0.1);
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex-shrink: 0;
}
.wk-mobile-nav__foot-link {
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(255,255,255,0.7);
    font-size: 14px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(255,255,255,0.05);
    transition: color 0.15s;
}
.wk-mobile-nav__foot-link:last-child { border-bottom: none; }
.wk-mobile-nav__foot-link:hover { color: var(--color-gold); }
.wk-mobile-nav__foot-link svg {
    width: 17px;
    height: 17px;
    stroke: currentColor;
    fill: none;
    flex-shrink: 0;
}

/* Bloquear scroll del body cuando el drawer está abierto */
body.nav-open { overflow: hidden; }


/* ═══════════════════════════════════════════════════════════════════════
   RESPONSIVE GLOBAL
   Tablet landscape  ≤ 1199px
   Tablet portrait   ≤ 1023px
   Mobile landscape  ≤  767px
   Mobile portrait   ≤  479px
═══════════════════════════════════════════════════════════════════════ */

/* ────────────────────────────────────────────────────────────────────
   TABLET LANDSCAPE  ≤ 1199px
──────────────────────────────────────────────────────────────────── */
@media (max-width: 1199px) {
    /* Header */
    .whanau-header__search { max-width: 340px; }

    /* Grids de productos */
    .prod-grid  { grid-template-columns: repeat(3, 1fr); }
    .oferta-grid { grid-template-columns: repeat(2, 1fr); }

    /* Footer: reducir separación de columnas internas */
    .whanau-footer__cols-right { column-gap: 48px; }
}

/* ────────────────────────────────────────────────────────────────────
   TABLET PORTRAIT  ≤ 1023px
──────────────────────────────────────────────────────────────────── */
@media (max-width: 1023px) {
    :root {
        --header-top-height: 68px;
        --container-pad: 20px;
    }

    /* ── Header ── */
    .whanau-header__nav-bar { display: none; }
    .whanau-hamburger { display: flex; }
    .whanau-header__top { gap: 14px; }
    .whanau-header__search { max-width: none; flex: 1; }
    .whanau-header__account-link--register { display: none; }

    /* ── Hero ── */
    .hero { min-height: 460px; }
    .hero__inner { padding: 56px 20px; }

    /* ── Home Info: apilar imagen + texto ── */
    .home-info { padding: 56px 0; }
    .home-info__container { flex-direction: column; gap: 28px; }
    .home-info__image { flex: none; max-width: 100%; }
    .home-info__image img,
    .home-info__image--placeholder { height: 280px; }
    .home-info__title { font-size: 30px; }
    .home-info__text p { font-size: 16px; }

    /* ── Home Services: 2 cols ── */
    .home-services { padding: 56px 0; }
    .home-services__grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }

    /* ── Shop layout: sidebar arriba del grid ── */
    .shop-layout {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .shop-sidebar {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
        align-items: start;
    }
    .shop-sidebar__heading { grid-column: 1 / -1; margin-bottom: 0; }

    /* ── Grids ── */
    .prod-grid  { grid-template-columns: repeat(3, 1fr); }
    .oferta-grid { grid-template-columns: repeat(2, 1fr); }

    /* ── Single product: apilar galería e info ── */
    .prod-single__hero {
        grid-template-columns: 1fr;
        gap: 28px;
    }
    .prod-single__gallery { max-width: 520px; margin: 0 auto; }

    /* ── Mi Cuenta: apilar sidebar ── */
    .mc-wrap { grid-template-columns: 1fr; gap: 20px; }
    .mc-sidebar { position: static; }
    .mc-nav__list { display: flex; flex-wrap: wrap; gap: 4px; padding: 12px; }
    .mc-nav__link { padding: 9px 14px; border-radius: 6px; font-size: 13px; }
    .mc-nav__link--active { background: rgba(255,255,255,0.12); }

    /* ── Footer: apilar sección "sobre nosotros" + 3 cols ── */
    .whanau-footer__grid { flex-direction: column; gap: 28px; }
    .whanau-footer__col--about { flex: none; max-width: 100%; }
    .whanau-footer__cols-right {
        grid-template-columns: repeat(3, 1fr);
        column-gap: 24px;
        width: 100%;
    }
}

/* ────────────────────────────────────────────────────────────────────
   MOBILE LANDSCAPE  ≤ 767px
──────────────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
    :root {
        --header-top-height: 60px;
        --container-pad: 16px;
    }

    /* ── Header ── */
    .whanau-logo-text { font-size: 20px; }
    .whanau-header__top { gap: 10px; }
    .whanau-header__actions { gap: 8px; }
    .whanau-header__account-links { display: none; }
    .whanau-header__account-wrap { gap: 0; }

    /* ── Hero ── */
    .hero { min-height: 360px; }
    .hero__inner { padding: 44px 16px; }
    .hero__cta { font-size: 15px; padding: 12px 28px; }

    /* ── Secciones home ── */
    .home-info { padding: 44px 0; }
    .home-services { padding: 44px 0; }
    .home-info__image img,
    .home-info__image--placeholder { height: 240px; }

    /* ── Grids ── */
    .prod-grid  { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .oferta-grid { grid-template-columns: 1fr; gap: 12px; }
    .oferta-card { flex-direction: column; }
    .oferta-card__thumb { flex: none; width: 100%; height: 200px; border-right: none; border-bottom: 1px solid var(--color-border); }

    /* ── Shop sidebar: 1 col ── */
    .shop-sidebar { grid-template-columns: 1fr; }

    /* ── Footer ── */
    .whanau-footer__cols-right {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    /* ── Carrito ── */
    .wc-cart__layout { grid-template-columns: 1fr; }
    .wc-cart__card { flex-wrap: wrap; gap: 12px; }
    .wc-cart__card-right { flex-direction: row; align-items: center; }

    /* ── Checkout ── */
    .wc-checkout__layout { grid-template-columns: 1fr; }
    .wc-checkout__summary { position: static; }

    /* ── Lista de deseos ── */
    .wl-header { flex-direction: column; align-items: flex-start; gap: 10px; }
    .wl-header__actions { width: 100%; display: flex; flex-wrap: wrap; gap: 8px; }
    .wl-toolbar { flex-wrap: wrap; }

    /* ── Login / registro ── */
    .wk-reg__row { grid-template-columns: 1fr; }
    .wk-reg__row--single { max-width: 100%; }
}

/* ────────────────────────────────────────────────────────────────────
   MOBILE PORTRAIT  ≤ 479px
──────────────────────────────────────────────────────────────────── */
@media (max-width: 479px) {
    :root {
        --container-pad: 14px;
    }

    /* ── Header: search pasa a segunda fila ── */
    .whanau-header__top {
        flex-wrap: wrap;
        height: auto;
        padding-bottom: 10px;
    }
    .whanau-header__logo { order: 1; }
    .whanau-header__actions { order: 2; margin-left: auto; }
    .whanau-header__search {
        order: 3;
        flex: 1 1 100%;
        max-width: 100%;
        margin: 0;
    }

    /* ── Hero ── */
    .hero { min-height: 300px; }
    .hero__subtitle { font-size: 14px; margin-bottom: 20px; }
    .hero__cta { display: block; width: 100%; text-align: center; }

    /* ── Home servicios: 1 col ── */
    .home-services__grid { grid-template-columns: 1fr; }

    /* ── Grids de productos: 2 cols compactos ── */
    .prod-grid  { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .oferta-grid { grid-template-columns: 1fr; gap: 10px; }
    .oferta-card__thumb { height: 180px; }
    .prod-card__body { padding: 9px 10px 11px; }
    .prod-card__name { font-size: 13px; }
    .prod-card__add { padding: 7px 10px; font-size: 12px; }
    .prod-card__price { font-size: 14px; }

    /* ── Footer: todo en 1 columna ── */
    .whanau-footer__cols-right { grid-template-columns: 1fr; gap: 20px; }

    /* ── Carrito: tarjeta compacta ── */
    .wc-cart__card { padding: 12px; }
    .wc-cart__card-img { width: 68px; height: 68px; }
    .wc-cart__card-name { white-space: normal; font-size: .95rem; }
    .wc-cart__card-price { font-size: 1.1rem; }

    /* ── Checkout ── */
    .woocommerce-billing-fields__field-wrapper,
    .woocommerce-shipping-fields__field-wrapper { grid-template-columns: 1fr; }

    /* ── Login ── */
    .wk-login { padding: 56px 14px 36px; }

    /* ── Lista de deseos: ocultar textos de toolbar ── */
    .wl-toolbar__btn { gap: 0; font-size: 0; }
    .wl-toolbar__btn svg { font-size: initial; width: 18px; height: 18px; }
    .wl-toolbar__btn::after { content: attr(title); font-size: 11px; }

    /* ── Mi Cuenta nav: tabs compactos ── */
    .mc-nav__link { padding: 8px 10px; font-size: 12px; }

    /* ── Wishlist card ── */
    .wl-card__add-row { flex-wrap: wrap; gap: 8px; }
    .wl-qty { width: 100%; justify-content: center; }
    .wl-add-btn { width: 100%; justify-content: center; }
}


/* ═══════════════════════════════════════════════════════════════════════
   RESPONSIVE — SECCIONES ADICIONALES
═══════════════════════════════════════════════════════════════════════ */

/* ────────────────────────────────────────────────────────────────────
   TABLET PORTRAIT  ≤ 1023px  (secciones adicionales)
──────────────────────────────────────────────────────────────────── */
@media (max-width: 1023px) {

    /* ── Home Objetivos: apilar contenido + imagen ── */
    .home-objetivos { padding: 56px 0 0; }
    .home-objetivos__title { font-size: 32px; margin-bottom: 32px; }
    .home-objetivos__container { flex-direction: column; gap: 28px; }
    .home-objetivos__content { flex: none; max-width: 100%; padding-bottom: 0; }
    .home-objetivos__image { min-height: 320px; }
    .home-objetivos__image--placeholder { min-height: 280px; }

    /* ── Zona Pro: secciones en columna ── */
    .zp-hero__inner,
    .zp-section__inner,
    [class*="zp-"][class*="__grid"],
    [class*="zp-"][class*="__layout"] {
        flex-direction: column;
        grid-template-columns: 1fr;
    }

    /* ── Single product: productos relacionados ── */
    .prod-single__related-grid { grid-template-columns: repeat(3, 1fr); }

    /* ── Mi Cuenta: addresses ── */
    .wk-addresses { grid-template-columns: 1fr 1fr; }

    /* ── Banner publicidad ── */
    .home-banner__slider { height: 210px; }
    .home-banner__placeholder { height: 210px; }
}

/* ────────────────────────────────────────────────────────────────────
   MOBILE LANDSCAPE  ≤ 767px  (secciones adicionales)
──────────────────────────────────────────────────────────────────── */
@media (max-width: 767px) {

    /* ── Home Objetivos ── */
    .home-objetivos__title { font-size: 26px; }
    .home-objetivos__image { min-height: 260px; }
    .objetivos-list__num { font-size: 40px; min-width: 60px; }

    /* ── Home Marcas: header compacto ── */
    .home-marcas { padding: 40px 0; }
    .home-marcas__title { font-size: 18px; }

    /* ── Single product: relacionados 2 cols ── */
    .prod-single__related-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }

    /* ── Mi Cuenta: addresses 1 col ── */
    .wk-addresses { grid-template-columns: 1fr; }

    /* ── Pagos: tabla horizontal scroll ── */
    .pagos-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .pagos-table { min-width: 520px; }

    /* ── Banner publicidad ── */
    .home-banner__slider { height: 180px; }
    .home-banner__placeholder { height: 180px; }

    /* ── Servicios: page header ── */
    .servicios-page__header { flex-direction: column; gap: 12px; }
}

/* ────────────────────────────────────────────────────────────────────
   MOBILE PORTRAIT  ≤ 479px  (secciones adicionales)
──────────────────────────────────────────────────────────────────── */
@media (max-width: 479px) {

    /* ── Home Objetivos ── */
    .home-objetivos { padding: 36px 0 0; }
    .home-objetivos__title { font-size: 22px; margin-bottom: 24px; }
    .home-objetivos__image { min-height: 220px; }
    .objetivos-list__num { font-size: 34px; min-width: 50px; }
    .objetivos-list__item { gap: 12px; }
    .objetivos-list__item p { font-size: 14px; padding-top: 4px; }

    /* ── Home Marcas ── */
    .home-marcas { padding: 28px 0; }
    .home-marcas__header { flex-direction: column; align-items: flex-start; gap: 10px; }

    /* ── Banner publicidad ── */
    .home-banner { padding: 24px 0; }
    .home-banner__slider { height: 160px; }
    .home-banner__placeholder { height: 160px; }

    /* ── Single product: relacionados 2 cols compactos ── */
    .prod-single__related-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
    .prod-single__related-title { font-size: 1rem; }

    /* ── Single product: miniaturas más pequeñas ── */
    .prod-single__thumbs { gap: 6px; }
    .prod-single__thumb { width: 52px; height: 52px; }

    /* ── Pagos: tabla ── */
    .pagos-table { min-width: 480px; }

    /* ── Thank you page ── */
    .wk-ty { margin: 28px auto 48px; padding: 0 14px; }
    .wk-ty__heading { font-size: 1.4rem; }

    /* ── Mi Cuenta: pedidos ── */
    .wk-order-card__head { flex-wrap: wrap; gap: 8px; }
    .wk-order-card__meta { gap: 10px; }
}

/* ════════════════════════════════════════════════════════════════════
   ANIMACIONES & MICROINTERACCIONES
   Sutiles y profesionales · sin librería · respeta reduced-motion
════════════════════════════════════════════════════════════════════ */

/* ── 0. Reduced motion: desactiva todo ─────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .wk-reveal {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
    .prod-card,
    .btn,
    .whanau-header {
        transition: none !important;
    }
    .wk-ripple { display: none !important; }
}

/* ── 1. Scroll reveal ───────────────────────────────────────────── */
.wk-reveal {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}
.wk-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* ── 2. Prod-card: lift suave en hover ──────────────────────────── */
.prod-card {
    transition: box-shadow 0.25s ease, transform 0.25s ease;
    will-change: transform;
}
.prod-card:hover {
    transform: translateY(-5px);
}

/* ── 3. Header: sombra aparece al hacer scroll ──────────────────── */
.whanau-header {
    transition: box-shadow 0.35s ease;
}
.whanau-header.is-scrolled {
    box-shadow: 0 2px 18px rgba(0, 0, 0, 0.09);
}

/* ── 4. Botones: feedback de pulsación ──────────────────────────── */
.btn {
    position: relative;
    overflow: hidden;
    transition: all 0.2s ease, transform 0.12s ease;
}
.btn:active {
    transform: scale(0.96);
}

/* ── 5. Ripple en botones ───────────────────────────────────────── */
.wk-ripple {
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.28);
    transform: scale(0);
    animation: wk-ripple-anim 0.55s linear;
    pointer-events: none;
}
@keyframes wk-ripple-anim {
    to {
        transform: scale(4);
        opacity: 0;
    }
}

/* ── 6. Wishlist button & cart action: también overflow hidden ──── */
.prod-card__add {
    position: relative;
    overflow: hidden;
}
.wk-cart-modal__actions .btn {
    overflow: hidden;
}

/* ── Teléfono en Detalles de Mi Cuenta ─────────────────────────────────── */
.wk-phone--account {
    display: flex !important;
    align-items: stretch;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    overflow: hidden;
    width: 100%;
}
.wk-phone--account:focus-within {
    border-color: var(--color-gold);
    box-shadow: 0 0 0 3px rgba(196,163,66,.15);
}
.wk-phone--account .wk-phone__code {
    flex: 0 0 auto;
    width: 120px;
    min-width: 120px;
    background: #f9fafb;
    border: none;
    border-right: 1px solid #d1d5db;
    padding: 0 6px;
    font-size: 13px;
    font-family: monospace;
    color: var(--color-text);
    cursor: pointer;
    outline: none;
    height: auto;
}
.wk-phone--account .wk-phone__input--account {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none;
    padding: 10px 12px;
    font-size: 14px;
    font-family: var(--font-base);
    color: var(--color-text);
    background: #fff;
}
.wk-phone--account .wk-phone__input--account:focus {
    border-color: transparent !important;
    box-shadow: none !important;
    outline: none;
}
/* Evitar que WC fuerce width:100% en el select dentro del teléfono */
.woocommerce-EditAccountForm .wk-phone--account select {
    width: 120px !important;
}

/* ── Ocultar título de página nativo en la pantalla de pedido recibido ─── */
.woocommerce-order-received .whanau-page__title,
.woocommerce-order-received h1.entry-title,
.woocommerce-order-received .page-title {
    display: none;
}

/* Ocultar cualquier título suelto que WC inyecte en la pantalla order-received */
.woocommerce-order-received .wc-checkout__title,
.woocommerce-order-received .woocommerce-notice--success:not(.wk-ty *),
.woocommerce-order-received .entry-title,
.woocommerce-order-received > .whanau-main > .whanau-page__container > h1 {
    display: none;
}

/* ── order-received: ocultar cualquier título/breadcrumb huérfano ─────── */
.woocommerce-order-received .whanau-page__container > h1,
.woocommerce-order-received .whanau-page__container > h2,
.woocommerce-order-received .whanau-page__container > nav,
.woocommerce-order-received .whanau-page__container > p:not(.wk-ty *),
.woocommerce-order-received .woocommerce-breadcrumb,
.woocommerce-order-received .entry-title,
.woocommerce-order-received .page-title,
.woocommerce-order-received h1.page-title {
    display: none !important;
}

/* ── Reducir espacio superior en la confirmación ────────────────────────── */
.woocommerce-order-received .wk-ty {
    margin-top: 16px;
    margin-bottom: 48px;
}

/* ── Responsive: cart modal + phone account field ─────────────────────── */
@media (max-width: 400px) {

    /* Modal: reducir padding y apilar botones en vertical */
    .wk-cart-modal__box {
        padding: 28px 20px;
        border-radius: 10px;
    }
    .wk-cart-modal__actions {
        flex-direction: column;
    }
    .wk-cart-modal__actions .btn {
        flex: none;
        width: 100%;
    }
    .wk-cart-modal__actions--single .btn {
        width: 100%;
        min-width: 0;
    }

    /* Campo teléfono en Detalles de cuenta: select más estrecho */
    .wk-phone--account .wk-phone__code {
        width: 96px;
        min-width: 96px;
        font-size: 12px;
    }
    .woocommerce-EditAccountForm .wk-phone--account select {
        width: 96px !important;
    }
}

/* ── Carrito vacío (página completa) ──────────────────────────────────── */
.wk-cart-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 64px 20px;
    text-align: center;
}
.wk-cart-empty svg {
    width: 72px;
    height: 72px;
    color: #ccc;
}
.wk-cart-empty__msg {
    font-size: 1rem;
    color: #888;
    margin: 0;
}
.wk-cart-empty .btn {
    margin-top: 4px;
}
