/* ============================================================
   Drieds — superficies de WooCommerce (tema clásico)
   Complementa assets/app.css (el sistema de diseño).
   ============================================================ */

.wc-main { min-height: 40vh; }
.wc-wrap { padding-top: 28px; padding-bottom: 64px; }

/* Las tarjetas usan enlaces <a>: asegurar comportamiento de bloque y sin subrayado */
a.card__media, a.pack__media, a.line-card, a.recipe, a.cat-chip { display: block; text-decoration: none; color: inherit; }
a.card__name { text-decoration: none; }
a.card__pill, a.card__add { text-decoration: none; }
.card__add { line-height: 44px; text-align: center; }
.line-card, .recipe { display: block; }

/* Logo de texto de respaldo */
.nav__logo-text { font: 400 26px 'Fraunces', serif; color: var(--brown); }

/* Buscador del nav */
.nav__search { display: flex; align-items: center; border: 1.5px solid var(--line-3); border-radius: 999px; background: var(--cream); overflow: hidden; }
.nav__search input { border: none; outline: none; background: none; padding: 8px 4px 8px 14px; font: 500 13px var(--sans); width: 120px; }
.nav__search button { border: none; background: none; cursor: pointer; padding: 8px 12px; color: var(--muted); font-size: 15px; }

/* ---------- Banner de la tienda ---------- */
.tienda-hero {
  border-radius: 24px; background: linear-gradient(105deg, #6E1E2B 0%, #8a2f3d 100%);
  padding: 32px 40px; margin-bottom: 26px; color: #e7c9bd;
  box-shadow: 0 16px 40px rgba(70, 25, 30, .18);
}
.tienda-hero__k { font: 600 11px var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--gold-dark); }
.tienda-hero__h { margin: 6px 0 4px; font: 400 42px 'Fraunces', serif; color: #FCF7EE; }
.tienda-hero__h .it { font-style: italic; color: var(--gold); }
.tienda-hero__s { font: 500 13.5px var(--sans); }

/* ---------- Grilla de productos ---------- */
.woocommerce ul.products, .woocommerce-page ul.products {
  /* auto-fill (no auto-fit): con pocos productos se conservan las columnas
     "fantasma" y las tarjetas mantienen su proporción normal, no se estiran. */
  display: grid !important; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 24px 18px; margin: 0 0 30px !important; padding: 0; list-style: none;
}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
  width: auto !important; margin: 0 !important; padding: 0 !important; float: none !important; list-style: none;
}
.woocommerce ul.products li.product::before { display: none; }
/* Clearfix de WooCommerce en ul.products: al ser grid, ::before/::after se
   vuelven "celdas fantasma" y dejan un hueco donde debería ir el 1er producto. */
.woocommerce ul.products::before, .woocommerce ul.products::after,
.woocommerce-page ul.products::before, .woocommerce-page ul.products::after { content: none !important; display: none !important; }
/* Nuestra card ya trae todo el estilo (viene de app.css). */

/* Ordenar / contador */
.woocommerce .woocommerce-result-count { color: var(--muted); font: 500 13px var(--sans); margin: 0 0 16px; }
.woocommerce .woocommerce-ordering select { border: 1.5px solid var(--line-3); border-radius: 999px; padding: 8px 14px; font: 500 13px var(--sans); background: var(--cream); }

/* Paginación */
.woocommerce nav.woocommerce-pagination ul { border: none; display: flex; gap: 6px; justify-content: center; }
.woocommerce nav.woocommerce-pagination ul li { border: none; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span {
  border: 1px solid var(--line-3); border-radius: 10px; padding: 8px 14px; color: var(--ink);
}
.woocommerce nav.woocommerce-pagination ul li span.current { background: var(--maroon); color: var(--cream); border-color: var(--maroon); }

/* ---------- Botones WooCommerce → estilo Drieds ---------- */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit, .woocommerce .button {
  border-radius: 999px !important; font: 600 13.5px var(--sans) !important; padding: 12px 24px; border: none; transition: background .2s, transform .2s;
}
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,
.woocommerce .single_add_to_cart_button, .woocommerce #place_order, .woocommerce .checkout-button {
  background: var(--maroon) !important; color: var(--cream) !important;
}
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover,
.woocommerce .single_add_to_cart_button:hover, .woocommerce #place_order:hover { background: var(--maroon-dark) !important; }

/* ============================================================
   Ficha de producto (single) — calzar 1:1 con el diseño
   ============================================================ */
.single-product div.product { display: grid; grid-template-columns: 1fr 1fr; column-gap: 48px; row-gap: 0; align-items: start; }
.single-product div.product::before, .single-product div.product::after { display: none; content: none; } /* limpiar clearfix de WC */

/* ---------- Galería: foto que LLENA la columna con marco redondeado ---------- */
.single-product div.product .woocommerce-product-gallery { width: 100% !important; float: none !important; margin: 0 !important; }

/* ---------- Galería propia (foto grande + miniaturas + lightbox) ---------- */
.drieds-gallery { display: flex; flex-direction: column; gap: 12px; }
.drieds-gallery__stage { position: relative; aspect-ratio: 1 / 1; border-radius: 22px; overflow: hidden; background: var(--cream); cursor: zoom-in; }
.drieds-gallery__main { width: 100%; height: 100%; object-fit: cover; display: block; transition: opacity .3s ease, transform .5s cubic-bezier(.2, .8, .25, 1); }
.drieds-gallery__main.is-swapping { opacity: 0; transform: scale(1.04); }
.drieds-gallery__stage img.woocommerce-placeholder { width: 100%; height: 100%; object-fit: cover; }
.drieds-gallery__zoom {
  position: absolute; top: 16px; right: 16px; width: 42px; height: 42px; border-radius: 50%; border: none;
  background: var(--cream); color: var(--maroon); box-shadow: 0 6px 16px rgba(70, 25, 30, .16);
  display: flex; align-items: center; justify-content: center; cursor: pointer; transition: transform .2s;
}
.drieds-gallery__zoom:hover { transform: scale(1.08); }
.drieds-gallery__thumbs { display: flex; flex-wrap: wrap; gap: 10px; }
.drieds-gallery__thumb { flex: 0 0 calc(25% - 7.5px); aspect-ratio: 1 / 1; padding: 0; border: 2px solid transparent; border-radius: 12px; overflow: hidden; background: none; cursor: pointer; transition: border-color .2s; }
.drieds-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; opacity: .55; transition: opacity .25s, transform .35s ease; }
.drieds-gallery__thumb:hover img { opacity: 1; transform: scale(1.06); }
.drieds-gallery__thumb.is-active { border-color: var(--maroon); }
.drieds-gallery__thumb.is-active img { opacity: 1; }

/* Lightbox a medida */
.drieds-lightbox {
  position: fixed; inset: 0; z-index: 200; background: rgba(30, 12, 10, .93);
  display: flex; align-items: center; justify-content: center; padding: 40px;
  opacity: 0; transition: opacity .3s ease;
}
.drieds-lightbox.is-open { opacity: 1; }
.drieds-lightbox__img {
  max-width: 90vw; max-height: 86vh; border-radius: 14px; box-shadow: 0 30px 80px rgba(0, 0, 0, .55);
  transform: scale(.92); transition: transform .38s cubic-bezier(.2, .8, .25, 1), opacity .2s ease; background: #1e0c0a;
}
.drieds-lightbox.is-open .drieds-lightbox__img { transform: scale(1); }
.drieds-lightbox__img.is-fade { opacity: 0; }
.drieds-lightbox__close, .drieds-lightbox__nav {
  position: absolute; border: none; background: rgba(255, 255, 255, .12); color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center; transition: background .2s;
}
.drieds-lightbox__close:hover, .drieds-lightbox__nav:hover { background: rgba(255, 255, 255, .26); }
.drieds-lightbox__close { top: 22px; right: 26px; width: 46px; height: 46px; border-radius: 50%; font-size: 19px; }
.drieds-lightbox__nav { top: 50%; transform: translateY(-50%); width: 52px; height: 52px; border-radius: 50%; font: 400 30px/1 'Fraunces', serif; }
.drieds-lightbox__prev { left: 22px; }
.drieds-lightbox__next { right: 22px; }
.drieds-lightbox__count { position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%); color: rgba(255, 255, 255, .82); font: 500 13px var(--sans); letter-spacing: .04em; }

@media (max-width: 560px) {
  .drieds-lightbox { padding: 18px; }
  .drieds-lightbox__nav { width: 44px; height: 44px; }
  .drieds-lightbox__prev { left: 10px; }
  .drieds-lightbox__next { right: 10px; }
}

/* ---------- Ficha: "Consultar por WhatsApp" en adelante, a lo ancho ---------- */
.single-product .drieds-ficha-consulta { grid-column: 1 / -1; margin-top: 14px; padding-top: 22px; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 14px; align-items: flex-start; }
.single-product .drieds-ficha-consulta .drieds-wa-btn { align-self: flex-start; }
.single-product .drieds-ficha-consulta .drieds-usos { margin: 0; }
.single-product .drieds-ficha-consulta .drieds-trustrow { margin: 0; gap: 28px; }
.drieds-ficha-cat { font: 500 13px var(--sans); color: var(--muted); }
.drieds-ficha-cat a { color: var(--maroon); }

/* ---------- Carrito lateral (drawer): scroll correcto + foto más pequeña ----------
   El wrapper .drieds-cart-frag (fragmento AJAX) rompía el flex, por eso el cuerpo
   no hacía scroll y "no mostraba más productos". Lo hacemos contenedor flex. */
.drawer .drieds-cart-frag { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.drawer .drawer__head { padding: 18px 22px; }
.drawer .drawer__head span { font-size: 22px; }
.drawer .drawer__body { padding: 16px 22px; gap: 13px; }
.drawer .cart-line .thumb { width: 48px; height: 48px; }
.drawer .cart-line .info .n { font-size: 13px; line-height: 1.25; }
.drawer .cart-line .info .m { font-size: 11.5px; }
.drawer .cart-line .sub { font-size: 13px; white-space: nowrap; }
.drawer .cart-line .rm { font-size: 15px; border: none; background: none; cursor: pointer; color: var(--muted); }
.drawer .cart-line .rm:hover { color: var(--maroon); }
.drawer .cart-line .thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.drawer .cart-line { align-items: flex-start; }
.drawer .cart-line .sub, .drawer .cart-line .rm { margin-top: 3px; }
.drawer .drawer__foot { padding: 16px 22px 22px; }

/* Stepper de cantidad dentro del drawer */
.drawer .drieds-qty { display: inline-flex; align-items: center; border: 1px solid var(--line-3); border-radius: 999px; margin-top: 7px; background: var(--cream); }
.drawer .drieds-qty button { border: none; background: none; cursor: pointer; padding: 3px 11px; font: 600 15px/1.2 var(--sans); color: var(--maroon); }
.drawer .drieds-qty .q { min-width: 20px; text-align: center; font: 600 12.5px var(--sans); }

/* Con la barra de admin de WordPress, el drawer no debe quedar debajo de ella */
body.admin-bar .drawer { top: 32px; }
@media (max-width: 782px) { body.admin-bar .drawer { top: 46px; } }

/* "Completa tu pedido" (cross-sell) dentro del drawer */
.drawer .drawer__cross { padding: 14px 22px 6px; border-top: 1px solid var(--line); }
.drawer .drawer__cross .k { display: block; font: 700 11px var(--sans); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
.drawer .cross-row { display: flex; align-items: center; gap: 12px; padding: 7px 0; }
.drawer .cross-row .thumb { flex: none; width: 42px; height: 42px; border-radius: 10px; overflow: hidden; }
.drawer .cross-row .thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.drawer .cross-row .info { flex: 1; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.drawer .cross-row .info .n { font: 600 12.5px var(--sans); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.drawer .cross-row .info .p { font: 500 11.5px var(--sans); color: var(--muted); }
.drawer .cross-row .add { flex: none; border: 1.5px solid var(--maroon); background: none; color: var(--maroon); border-radius: 999px; padding: 7px 14px; font: 600 12px var(--sans); cursor: pointer; transition: background .2s, color .2s; }
.drawer .cross-row .add:hover { background: var(--maroon); color: #fff; }
.single-product div.product .woocommerce-product-gallery__wrapper,
.single-product div.product .woocommerce-product-gallery .flex-viewport { width: 100% !important; height: auto !important; margin: 0; }
.single-product div.product .woocommerce-product-gallery__image { width: 100% !important; float: none !important; }
.single-product div.product .woocommerce-product-gallery__image a { display: block; }
.single-product div.product .woocommerce-product-gallery__image img,
.single-product div.product .woocommerce-product-gallery img.wp-post-image {
  width: 100% !important; height: auto; aspect-ratio: 1 / 1; object-fit: cover;
  border-radius: 22px; display: block;
}
/* Lupa de zoom → botón redondo discreto arriba a la derecha */
.single-product .woocommerce-product-gallery__trigger {
  top: 16px; right: 16px; width: 42px; height: 42px; border-radius: 50%;
  background: var(--cream); box-shadow: 0 6px 16px rgba(70,25,30,.16);
  display: flex; align-items: center; justify-content: center; opacity: .95;
}
/* Miniaturas: fila de 4 como el diseño */
.single-product .flex-control-thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 12px 0 0; padding: 0; list-style: none; }
.single-product .flex-control-thumbs li { margin: 0; list-style: none; }
.single-product .flex-control-thumbs li::before { display: none; }
.single-product .flex-control-thumbs img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: 12px; cursor: pointer; opacity: .55; border: 1px solid var(--line); transition: opacity .2s, border-color .2s; }
.single-product .flex-control-thumbs img.flex-active, .single-product .flex-control-thumbs img:hover { opacity: 1; border: 2px solid var(--maroon); }

/* ---------- Resumen (columna derecha) ---------- */
.single-product div.product .summary.entry-summary { display: flex; flex-direction: column; gap: 16px; margin: 0; float: none !important; width: auto !important; }
.drieds-eyebrow { font: 600 11px var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); display: block; margin: 0; }
.single-product div.product .product_title { font: 400 40px/1.08 'Fraunces', serif; margin: 0; }
.single-product div.product .woocommerce-product-details__short-description { font: 400 14.5px/1.6 var(--sans); color: var(--ink-soft); margin: 0; }
.single-product div.product .woocommerce-product-details__short-description p { margin: 0; }
.single-product div.product .price { color: var(--maroon) !important; font: 400 36px 'Fraunces', serif; margin: 0; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.single-product div.product .price del { color: var(--muted); font-size: 18px; opacity: 1; }
.single-product div.product .price ins { text-decoration: none; }
.single-product .woocommerce-product-rating { margin: 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.single-product .woocommerce-product-rating .star-rating { margin: 0; float: none; }
.single-product .star-rating span::before, .single-product .star-rating::before { color: var(--amber); }
.single-product .woocommerce-review-link { color: var(--muted); font: 500 12.5px var(--sans); }

/* Variaciones → etiqueta tipo eyebrow + fila de pastillas (el <select> se oculta vía JS) */
.single-product .variations { display: block; width: 100%; margin: 2px 0 0; border: 0; }
.single-product .variations tbody, .single-product .variations tr { display: block; }
.single-product .variations th, .single-product .variations td { display: block; padding: 0; text-align: left; }
.single-product .variations th.label { font: 600 11.5px var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin: 0 0 2px; }
.single-product .variations select { border: 1.5px solid var(--line-3); border-radius: 12px; padding: 12px 14px; background: var(--cream); font: 600 14px var(--sans); }
.single-product .reset_variations { font: 500 12px var(--sans); color: var(--maroon); display: inline-block; margin: 6px 0 0; }
.single-product .woocommerce-variation.single_variation { margin-bottom: 12px; }
.single-product .woocommerce-variation-price .price { font: 400 30px 'Fraunces', serif; }

/* Cantidad + agregar al carrito en una fila (como el diseño) */
.single-product .woocommerce-variation-add-to-cart,
.single-product form.cart:not(.variations_form) { display: flex; align-items: stretch; gap: 12px; flex-wrap: wrap; margin: 4px 0 2px; }
.single-product .quantity input.qty { border: 1.5px solid var(--line-3); border-radius: 999px; padding: 13px 8px; width: 82px; text-align: center; font: 600 15px var(--sans); background: var(--cream); }
.single-product .single_add_to_cart_button { flex: 1 1 200px; padding: 15px 28px !important; font-size: 15px !important; }

/* Botón WhatsApp de la ficha: que se vea como botón, no como texto */
.single-product .drieds-wa-btn { display: inline-flex; align-self: flex-start; margin: 2px 0; }

/* Meta (SKU / categoría) discreta al final del resumen */
.single-product .product_meta { font: 500 12.5px var(--sans); color: var(--muted); border-top: 1px solid var(--line); padding-top: 14px; margin-top: 4px; }
.single-product .product_meta > span { display: block; margin-bottom: 3px; }
.single-product .product_meta a { color: var(--maroon); }

/* ---------- Pestañas + secciones a lo ancho, bajo las 2 columnas ---------- */
.single-product .woocommerce-tabs { grid-column: 1 / -1; margin-top: 8px; }
.single-product .woocommerce-tabs ul.tabs { padding: 0; border-bottom: 1px solid var(--line); }
.single-product .woocommerce-tabs ul.tabs::before { display: none; }
.single-product .woocommerce-tabs ul.tabs li { background: var(--cream); border: 1px solid var(--line); border-radius: 12px 12px 0 0; }
.single-product .woocommerce-tabs ul.tabs li.active { background: var(--bg); border-bottom-color: var(--bg); }
.single-product .woocommerce-tabs ul.tabs li a { color: var(--ink); font: 600 14px var(--sans); }
.single-product .woocommerce-tabs .panel > h2:first-child { font: 400 26px 'Fraunces', serif; }
.single-product .related.products, .single-product .up-sells.products, .single-product .drieds-ficha-extra, .single-product .drieds-ficha-cta { grid-column: 1 / -1; }
.single-product .related.products > h2, .single-product .up-sells.products > h2 { font: 400 30px 'Fraunces', serif; margin-bottom: 20px; }

/* Ritmo vertical entre secciones a lo ancho (row-gap:0 → lo controlamos con márgenes,
   así no quedan los huecos raros de 48-60px que se acumulaban con el gap del grid). */
.single-product div.product .woocommerce-product-gallery,
.single-product div.product .summary.entry-summary { margin-bottom: 0 !important; }
.single-product .drieds-ficha-extra { margin-top: 44px; }
.single-product .drieds-ficha-extra > .drieds-sec:first-child { margin-top: 0; }
.single-product .up-sells.products { margin-top: 52px; }
.single-product .related.products { margin-top: 52px; }
.single-product .drieds-ficha-cta { margin-top: 48px; }
/* Enlace "Limpiar" de variaciones: no va con el diseño */
.single-product .reset_variations { display: none; }

@media (max-width: 640px) {
  .single-product div.product .product_title { font-size: 32px; }
  .single-product div.product .price { font-size: 30px; }
}

/* Presentaciones como pastillas (variaciones de WooCommerce) */
.drieds-swatches { display: flex; gap: 10px; flex-wrap: wrap; margin: 8px 0 2px; }
.drieds-swatch { font-family: var(--sans); cursor: pointer; min-width: 92px; text-align: center; padding: 13px 18px; border-radius: 14px; border: 1.5px solid var(--line-3); background: var(--cream); font-weight: 600; font-size: 14px; color: var(--ink); transition: border-color .2s, background .2s, box-shadow .2s; }
.drieds-swatch:hover { border-color: var(--maroon); }
.drieds-swatch.is-active { border: 2px solid var(--maroon); background: #F6DEDA; box-shadow: 0 2px 8px rgba(110,30,43,.15); }

/* Franja CTA final de la ficha */
.drieds-ficha-cta { margin-top: 12px; border-radius: 24px; background: var(--maroon-dark); padding: 32px 40px; display: flex; justify-content: space-between; align-items: center; gap: 18px; flex-wrap: wrap; }
.drieds-ficha-cta .cta-t { font: 400 26px 'Fraunces', serif; color: #FCF7EE; display: block; }
.drieds-ficha-cta .cta-t em { color: var(--gold-dark); font-style: italic; }
.drieds-ficha-cta .cta-s { font: 500 13px var(--sans); color: #d9b8ac; display: block; margin-top: 4px; }

@media (max-width: 860px) { .single-product div.product { grid-template-columns: 1fr; gap: 26px; } }

/* ---------- Miga de pan ---------- */
.drieds-crumbs { font: 500 13px var(--sans); color: var(--muted); margin-bottom: 18px; }
.drieds-crumbs a { color: var(--maroon); }
.drieds-crumbs .crumb-sep { opacity: .4; }

/* ---------- Notices ---------- */
.woocommerce-message, .woocommerce-info, .woocommerce-error { border-top-color: var(--maroon); border-radius: 12px; background: var(--cream); }
.woocommerce-message::before, .woocommerce-info::before { color: var(--maroon); }

/* ---------- Carrito ---------- */
.woocommerce table.shop_table { border-radius: 16px; overflow: hidden; border: 1px solid var(--line); background: var(--cream); }
.woocommerce table.cart img { border-radius: 12px; }
.woocommerce a.remove { color: var(--maroon) !important; }
.woocommerce a.remove:hover { background: var(--maroon) !important; color: #fff !important; }
.cart_totals h2, .cross-sells > h2 { font: 400 24px 'Fraunces', serif; }

/* ---------- Checkout ---------- */
.woocommerce form.checkout .col2-set, .woocommerce-checkout #customer_details { margin-bottom: 20px; }
.woocommerce .form-row input.input-text, .woocommerce .form-row textarea, .woocommerce form .form-row select, .select2-selection {
  border: 1.5px solid var(--line-3) !important; border-radius: 12px !important; padding: 12px 14px; background: var(--cream); font: 500 14px var(--sans);
}
.woocommerce-checkout #payment { background: var(--cream); border-radius: 16px; }
.woocommerce-checkout #place_order { width: 100%; padding: 16px !important; }

/* ---------- Mi cuenta ---------- */
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--cream); }
.woocommerce-account .woocommerce-MyAccount-navigation li { border-bottom: 1px solid var(--line); }
.woocommerce-account .woocommerce-MyAccount-navigation li a { display: block; padding: 13px 18px; color: var(--ink); font: 600 13.5px var(--sans); }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a, .woocommerce-account .woocommerce-MyAccount-navigation li a:hover { background: #F6DEDA; color: var(--maroon); }
.woocommerce-account .woocommerce-MyAccount-content { background: var(--cream); border: 1px solid var(--line); border-radius: 16px; padding: 24px; }

/* ---------- Ficha: usos + badges (shortcode drieds_trust) ---------- */
.drieds-usos { margin: 10px 0 4px; display: flex; flex-wrap: wrap; gap: 7px; }
.drieds-usos span { background: #F6E7C6; color: #8a6510; border-radius: 999px; padding: 6px 12px; font: 600 11px var(--sans); letter-spacing: .04em; text-transform: uppercase; }
.drieds-trustrow { display: flex; gap: 20px; flex-wrap: wrap; margin: 12px 0 4px; }
.drieds-trust { display: inline-flex; align-items: center; gap: 9px; font: 600 12px var(--sans); color: var(--ink-soft); }
.drieds-trust b { width: 28px; height: 28px; border-radius: 9px; background: #F6E7C6; color: #8a6510; display: inline-flex; align-items: center; justify-content: center; font: 700 13px var(--sans); }

/* Widgets del plugin (barra envío / urgencia) por si el plugin no trae su css */
.drieds-shipbar { background: #F6E7C6; border-radius: 16px; padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; margin: 14px 0; }
.drieds-shipbar__msg { font: 600 12.5px var(--sans); color: #6b4c10; }
.drieds-shipbar__track { height: 8px; background: rgba(58, 36, 16, .15); border-radius: 99px; overflow: hidden; }
.drieds-shipbar__fill { height: 100%; border-radius: 99px; }
.drieds-urgency { background: var(--bg); border-radius: 14px; padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; margin: 14px 0; }
.drieds-urgency__row { display: flex; justify-content: space-between; font: 600 12.5px var(--sans); color: #8a6510; }
.drieds-urgency__track { height: 7px; background: rgba(58, 36, 16, .14); border-radius: 99px; overflow: hidden; }
.drieds-urgency__fill { height: 100%; background: var(--amber, #E4A62B); border-radius: 99px; }

/* Ficha (drieds_ficha) */
.drieds-sec { margin-top: 46px; }
.drieds-h { font: 400 30px 'Fraunces', serif; margin: 0 0 20px; }
.drieds-h em { font-style: italic; color: var(--maroon); }
.drieds-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.drieds-card { background: var(--cream); border: 1px solid var(--line); border-radius: 18px; padding: 24px; display: flex; flex-direction: column; gap: 8px; }
.drieds-card .drieds-k { font: 400 30px 'Fraunces', serif; color: var(--maroon); }
.drieds-specs { display: grid; grid-template-columns: 1fr 1fr; gap: 0 32px; border-top: 1px solid var(--line); }
.drieds-spec { display: flex; justify-content: space-between; padding: 14px 2px; border-bottom: 1px solid var(--line); font: 500 13px var(--sans); }
.drieds-spec span { color: var(--muted); }
.drieds-faq { display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.drieds-q { border-bottom: 1px solid var(--line); padding: 16px 4px; }
.drieds-q summary { cursor: pointer; font: 600 15px var(--sans); list-style: none; }
.drieds-q summary::after { content: '+'; float: right; color: var(--maroon); }
.drieds-q[open] summary::after { content: '−'; }
/* "Formas de disfrutarlo": pasos apilados (el panel rosado ahora vive en .drieds-split--rosa) */
.drieds-list { display: flex; flex-direction: column; gap: 20px; }
.drieds-step { display: flex; gap: 16px; align-items: flex-start; }
.drieds-step > div { display: flex; flex-direction: column; gap: 3px; }
.drieds-step > div > b { font: 600 14.5px var(--sans); color: var(--ink); }
.drieds-step > div > span { font: 400 13px/1.55 var(--sans); color: var(--ink-soft); }
.drieds-num { flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--cream); color: var(--maroon); display: flex; align-items: center; justify-content: center; font: 400 17px 'Fraunces', serif; border: 1px solid rgba(110,30,43,.12); }

/* "Por qué te va a encantar": título grande + etiqueta + descripción */
.drieds-card b { font: 600 14.5px var(--sans); color: var(--ink); }
.drieds-card > span:last-child { font: 400 12.5px/1.55 var(--sans); color: var(--ink-soft); }

/* WhatsApp botón (por si el plugin no trae css) */
.drieds-wa-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: var(--green); color: #fff !important; border-radius: 999px; padding: 13px 22px; font: 600 13.5px var(--sans); text-decoration: none; }
.drieds-wa-btn--outline { background: none; color: var(--green) !important; border: 1.5px solid var(--green); }

@media (max-width: 600px) { .drieds-specs { grid-template-columns: 1fr; } }

/* ============================================================
   Secciones internas de la ficha — idénticas al diseño original
   ============================================================ */

/* Rating: estrellas + conteo + "En stock · se vende rápido" */
.single-product .drieds-rating-row { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin: 0; }
.single-product .drieds-rating-row .star-rating { margin: 0; float: none; color: var(--amber); }
.single-product .drieds-rate-n { font: 500 12.5px var(--sans); color: var(--muted); }
.single-product .drieds-dot-sep { opacity: .4; }
.single-product .drieds-instock { display: inline-flex; align-items: center; gap: 6px; font: 600 12px var(--sans); color: #8a6510; }
.single-product .drieds-instock .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--amber); }

/* Insignia de oferta sobre la galería (solo la del producto principal) */
.single-product div.product { position: relative; }
.single-product div.product > .onsale {
  position: absolute; top: 16px; left: 16px; z-index: 3; margin: 0; min-height: 0; min-width: 0;
  background: var(--maroon); color: #F3DFC9; font: 700 11px var(--sans); letter-spacing: .05em; text-transform: uppercase;
  padding: 6px 11px; border-radius: 6px; line-height: 1;
}

/* Pastillas de presentación: peso + precio apilados (como el diseño) */
.drieds-swatch { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; text-align: left; line-height: 1.15; }
.drieds-swatch .sw-w { font-weight: 600; font-size: 13.5px; }
.drieds-swatch .sw-p { font-weight: 500; font-size: 12px; color: var(--muted); }
.drieds-swatch .sw-p del { opacity: .6; margin-right: 4px; }
.drieds-swatch .sw-p ins { text-decoration: none; }

/* Acordeón (Descripción / Modo de uso / Envíos) a lo ANCHO, bajo las 2 columnas */
.drieds-acc { display: flex; flex-direction: column; border-top: 1px solid var(--line); margin-top: 0; }
.single-product .drieds-ficha-acc { grid-column: 1 / -1; margin-top: 16px; }
.single-product .drieds-ficha-acc .drieds-q summary { font-size: 16px; padding: 20px 4px; }
.single-product .drieds-ficha-acc .drieds-q p { max-width: 760px; }

/* Bloques a 2 columnas (Formas / Ficha técnica / FAQ) */
.drieds-split { display: grid; grid-template-columns: 1fr 1fr; gap: 0; align-items: stretch; }
.drieds-split__media { position: relative; min-height: 300px; overflow: hidden; border-radius: inherit; }
.drieds-split__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Formas de disfrutarlo: panel rosado (cuerpo + foto) */
.drieds-split--rosa { background: #F6E5E0; border-radius: 26px; overflow: hidden; }
.drieds-split--rosa .drieds-split__body { padding: 44px 42px; }
.drieds-split--rosa .drieds-h { color: #451018; margin-bottom: 24px; }

/* Ficha técnica: tabla + foto con sombra, centradas */
.drieds-split--tech { grid-template-columns: 1.1fr 1fr; gap: 44px; align-items: center; }
.drieds-split--tech .drieds-h { margin-bottom: 18px; }
.drieds-split__media--shadow { min-height: 0; aspect-ratio: 1.25; border-radius: 22px; box-shadow: 0 16px 34px rgba(70,25,30,.14); }

/* FAQ: título a la izquierda, acordeón a la derecha */
.drieds-split--faq { grid-template-columns: .8fr 1.2fr; gap: 44px; align-items: start; }
.drieds-split--faq .drieds-h { margin: 0; }

/* Opiniones verificadas */
.drieds-op-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; }
.drieds-op { background: var(--cream); border: 1px solid var(--line); border-radius: 18px; padding: 22px; display: flex; flex-direction: column; gap: 10px; }
.drieds-op-stars { color: #C77E17; letter-spacing: .06em; font-size: 13px; }
.drieds-op p { margin: 0; font: 400 13px/1.6 var(--sans); color: var(--ink-soft); }
.drieds-op-who { border-top: 1px solid var(--line); padding-top: 10px; display: flex; flex-direction: column; }
.drieds-op-who b { font: 600 13px var(--sans); }
.drieds-op-who span { font: 500 11.5px var(--sans); color: var(--muted); }

/* Bundle "Cómpralos juntos y ahorra" */
.drieds-bundle { grid-column: 1 / -1; margin-top: 52px; background: var(--cream); border: 1px solid var(--line); border-radius: 22px; padding: 30px 32px; }
.drieds-bundle .drieds-h { margin: 0 0 20px; }
.drieds-bundle__row { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.drieds-bundle__items { display: flex; align-items: flex-start; gap: 14px; flex-wrap: wrap; }
.drieds-bundle__it { display: flex; flex-direction: column; gap: 6px; width: 120px; text-decoration: none; color: inherit; }
.drieds-bundle__img { display: block; aspect-ratio: 1; border-radius: 12px; overflow: hidden; }
.drieds-bundle__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.drieds-bundle__nm { font: 600 11.5px/1.25 var(--sans); }
.drieds-bundle__pr { font: 500 11.5px var(--sans); color: var(--muted); }
.drieds-bundle__buy { flex: 1; min-width: 220px; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.drieds-bundle__lbl { font: 500 12px var(--sans); color: var(--muted); }
.drieds-bundle__total { font: 400 32px 'Fraunces', serif; color: var(--maroon); }
.drieds-bundle__btn { margin-top: 4px; }

@media (max-width: 820px) {
  .drieds-split, .drieds-split--tech, .drieds-split--faq { grid-template-columns: 1fr; }
  .drieds-split--tech { gap: 24px; }
  .drieds-split--faq { gap: 20px; }
  .drieds-split__media { min-height: 220px; }
  .drieds-split--rosa .drieds-split__body { padding: 32px 26px; }
}

/* ---------- Teléfono: endurecer toda la ficha + páginas de WooCommerce ---------- */
@media (max-width: 560px) {
  .wc-wrap { padding-top: 16px; padding-bottom: 40px; }
  .tienda-hero { padding: 24px 22px; border-radius: 18px; }
  .tienda-hero__h { font-size: 30px; }

  /* Ficha: columnas apiladas y tipografías proporcionadas */
  .single-product div.product { column-gap: 0; }
  .single-product div.product .product_title { font-size: 28px; }
  .single-product div.product .price { font-size: 28px; }
  .single-product .drieds-h { font-size: 23px; margin-bottom: 16px; }
  .single-product .drieds-sec { margin-top: 34px; }
  .single-product .drieds-ficha-extra { margin-top: 34px; }
  .single-product .up-sells.products, .single-product .related.products, .drieds-bundle { margin-top: 38px; }
  .single-product .related.products > h2, .single-product .up-sells.products > h2 { font-size: 23px; }

  /* Cantidad + agregar: botón a todo el ancho bajo la cantidad */
  .single-product .single_add_to_cart_button { flex: 1 1 100%; }
  .single-product .quantity input.qty { width: 100%; }
  .single-product .quantity { flex: 0 0 110px; }

  /* Presentaciones: 2 por fila */
  .drieds-swatch { flex: 1 1 calc(50% - 5px); min-width: 0; align-items: center; text-align: center; }

  /* Paneles internos con menos padding */
  .drieds-split--rosa .drieds-split__body { padding: 26px 22px; }
  .drieds-split--rosa .drieds-h { margin-bottom: 16px; }

  /* Bundle: todo apilado y botón ancho */
  .drieds-bundle { padding: 24px 20px; }
  .drieds-bundle__row { flex-direction: column; align-items: stretch; }
  .drieds-bundle__buy { min-width: 0; }
  .drieds-bundle__btn { width: 100%; text-align: center; }
  .drieds-bundle__total { font-size: 28px; }

  /* CTA final apilada */
  .drieds-ficha-cta { padding: 24px 22px; border-radius: 18px; text-align: left; }
  .drieds-ficha-cta .cta-t { font-size: 21px; }
  .drieds-ficha-cta .btn { width: 100%; text-align: center; }

  /* WooCommerce: carrito y checkout cómodos en móvil */
  .woocommerce table.shop_table { font-size: 13px; }
  .woocommerce-checkout #place_order, .single-product .drieds-wa-btn { width: 100%; text-align: center; justify-content: center; }
  .woocommerce .col2-set .col-1, .woocommerce .col2-set .col-2 { width: 100%; float: none; }
}

/* ---------- Slider de productos del inicio ---------- */
.home-slider { position: relative; }
.home-slider .grid-cards {
  display: flex !important; grid-template-columns: none !important;
  overflow-x: auto; scroll-snap-type: x mandatory; gap: 18px;
  /* Aire arriba y a los lados para que el "salto" de la tarjeta en hover no se recorte. */
  padding: 16px 10px 22px; margin: -8px -10px 0;
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.home-slider .grid-cards::-webkit-scrollbar { display: none; }
.home-slider .grid-cards > * { flex: 0 0 clamp(240px, 30%, 300px); scroll-snap-align: start; }
.home-slider__nav {
  position: absolute; top: 44%; transform: translateY(-50%); z-index: 4;
  width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--line);
  background: var(--cream); color: var(--maroon); font: 400 24px/1 'Fraunces', serif; cursor: pointer;
  box-shadow: 0 8px 22px rgba(70, 25, 30, .16); display: flex; align-items: center; justify-content: center;
  transition: background .2s, transform .2s;
}
.home-slider__nav:hover { background: #F6DEDA; }
.home-slider__prev { left: -10px; }
.home-slider__next { right: -10px; }
@media (max-width: 760px) {
  .home-slider__nav { display: none; }
  .home-slider .grid-cards > * { flex-basis: 80%; }
}

/* Buscador dentro del menú móvil (el del nav se oculta en teléfono) */
.mnav__search { display: flex; align-items: center; border: 1.5px solid var(--line-3); border-radius: 999px; background: var(--cream); overflow: hidden; margin: 2px 0 10px; }
.mnav__search input { flex: 1; min-width: 0; border: none; outline: none; background: none; padding: 11px 4px 11px 16px; font: 500 14px var(--sans); }
.mnav__search button { border: none; background: none; cursor: pointer; padding: 10px 14px; color: var(--muted); font-size: 16px; }

/* ---------- Teléfono: tienda y catálogos SIEMPRE de a 2 (nunca 1 solo) ---------- */
@media (max-width: 600px) {
  .woocommerce ul.products, .woocommerce-page ul.products { grid-template-columns: 1fr 1fr !important; gap: 18px 10px !important; }
  .card__body { padding: 11px 11px 0 !important; }
  /* Nombre a máximo 2 líneas: todas las tarjetas quedan de la misma altura */
  .card__name { font-size: 13px; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .card__rate { font-size: 10px; }
  .card__rate .n { font-size: 9.5px; }
  .card__cat { font-size: 8.5px; padding: 4px 8px; }
  .card__off { font-size: 9px; }
  .card__quick { font-size: 9.5px; padding: 5px 9px; }
  .card__foot { padding: 9px !important; gap: 6px; }
  /* Pastilla apilada compacta: rótulo 8.5px + precio 12.5px, sin montarse */
  .card__pill { min-width: 0; flex: 1; }
  .card__pill.js-pill { padding: 6px 10px; }
  .card__pill.js-pill span:first-child { font-size: 8.5px; letter-spacing: .03em; }
  .card__pill.js-pill span:last-child { font-size: 12.5px; }
  .card__add { width: 36px; height: 36px; line-height: 36px; font-size: 18px; flex: none; }
  /* Selector desplegable a TODO el ancho de la tarjeta (no queda angosto) */
  .card__drop { left: 0; right: 0; top: calc(100% + 4px); border-radius: 12px; }
  .card__drop button { padding: 9px 12px; gap: 8px; }
  .card__drop button .w { font-size: 12px; }
  .card__drop .js-pres .pr { font-size: 10.5px; }
  .tienda-hero { padding: 22px 20px; }
  .tienda-hero__h { font-size: 26px; }
}

/* ---------- "+" en carga + página del carrito (además del drawer) ---------- */
.card__add.is-loading { opacity: .55; pointer-events: none; }

/* Selector de presentaciones de la tarjeta (pastilla "Elige tu opción") */
/* Pastilla en dos líneas: rótulo pequeño arriba + precio abajo. Así el texto
   nunca se monta con el precio, ni en tarjetas angostas (teléfono). */
.card__pill.js-pill { flex-direction: column; align-items: flex-start; justify-content: center; gap: 1px; padding: 7px 14px; }
.card__pill.js-pill span:first-child { font: 600 9.5px var(--sans); letter-spacing: .05em; text-transform: uppercase; opacity: .8; }
.card__pill.js-pill span:last-child { font: 700 14px var(--sans); }
.card__drop .js-pres .pr { color: var(--muted); font-weight: 500; }
.card__drop .js-pres:last-child { border-bottom: none; }
.card__drop .js-pres:hover { background: #F6E5E0; }
.js-pres.is-loading, .card__pill.is-loading { opacity: .55; pointer-events: none; }
/* El slider del inicio recorta lo que sobresale del carril (overflow): se
   reserva espacio de padding hacia abajo para que el selector no se corte
   (el margen negativo devuelve el espacio visual). */
.home-slider .grid-cards { padding-bottom: 178px; margin-bottom: -156px; }

/* ---------- Vista rápida: selector de presentación ---------- */
.modal__preswrap { display: flex; flex-direction: column; gap: 9px; }
.modal__preslabel { font: 600 11px var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.modal__preswrap[hidden] { display: none; }
#qvAddCart.is-loading { opacity: .55; pointer-events: none; }

/* ---------- Tienda: chips de filtro por categoría (como el diseño) ---------- */
.drieds-filtros { display: flex; gap: 8px; flex-wrap: wrap; margin: 2px 0 18px; }
a.chip { text-decoration: none; display: inline-block; }

/* Barra "Filtrar y ordenar": en escritorio se ve normal (el botón no existe);
   en teléfono va plegada para que los productos salgan de primeras. */
.drieds-filtros-toggle { display: none; }
@media (max-width: 600px) {
  .drieds-filtros-toggle {
    display: block; width: 100%; margin: 0 0 12px; padding: 11px 16px;
    border: 1.5px solid var(--line-3); border-radius: 999px; background: var(--cream);
    font: 600 13px var(--sans); color: var(--ink); cursor: pointer; text-align: center;
  }
  .drieds-filtros-toggle[aria-expanded="true"] { border-color: var(--maroon); color: var(--maroon); }
  .drieds-toolbar { display: none; }
  .drieds-toolbar.is-open { display: block; margin-bottom: 6px; }
  .drieds-toolbar .drieds-filtros { margin-bottom: 12px; }
  .drieds-toolbar .woocommerce-result-count { margin: 0 0 8px; }
  .drieds-toolbar .woocommerce-ordering { float: none; margin: 0 0 10px; }
  .drieds-toolbar .woocommerce-ordering select { width: 100%; }
}

/* ---------- Mi cuenta: orden y aire (nav lateral + contenido en tarjeta) ---------- */
.woocommerce-account.logged-in div.woocommerce { display: grid; grid-template-columns: 240px 1fr; gap: 24px; align-items: start; }
.woocommerce-account.logged-in div.woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
@media (max-width: 760px) { .woocommerce-account.logged-in div.woocommerce { grid-template-columns: 1fr; } }
.woocommerce-account .woocommerce-MyAccount-navigation li a { padding: 14px 20px; }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { border-left: 3px solid var(--maroon); }
.woocommerce-account .woocommerce-MyAccount-content { padding: 26px 28px; }
.woocommerce-account .woocommerce-MyAccount-content h2, .woocommerce-account .woocommerce-MyAccount-content h3 { font: 400 24px 'Fraunces', serif; margin-top: 0; }
.woocommerce-account .woocommerce-MyAccount-content p { font: 400 14px/1.65 var(--sans); color: var(--ink-soft); }
.woocommerce-account .woocommerce-MyAccount-content fieldset legend { font: 400 19px 'Fraunces', serif; }
.woocommerce-account .woocommerce-Addresses .woocommerce-Address { background: var(--bg); border: 1px solid var(--line); border-radius: 14px; padding: 18px 20px; }
/* Acceso (sin sesión): formulario centrado en tarjeta */
.woocommerce-account:not(.logged-in) div.woocommerce { max-width: 480px; margin: 0 auto; }
.woocommerce-account:not(.logged-in) form.login, .woocommerce-account:not(.logged-in) form.register { background: var(--cream); border: 1px solid var(--line); border-radius: 18px; padding: 28px; }
.woocommerce-account:not(.logged-in) h2 { font: 400 26px 'Fraunces', serif; }

/* ---------- Galería de producto en teléfono ---------- */
@media (max-width: 560px) {
  .drieds-gallery__stage { border-radius: 16px; }
  .drieds-gallery__zoom { width: 38px; height: 38px; top: 12px; right: 12px; }
  .drieds-gallery__thumbs { flex-wrap: nowrap; overflow-x: auto; gap: 8px; padding-bottom: 4px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .drieds-gallery__thumbs::-webkit-scrollbar { display: none; }
  .drieds-gallery__thumb { flex: 0 0 72px; border-radius: 10px; }
  .single-product div.product > .onsale { top: 12px; left: 12px; }
}

.woocommerce-cart table.cart img { width: 64px; border-radius: 12px; }
.woocommerce-cart table.cart td.product-name a { color: var(--ink); text-decoration: none; font-weight: 600; }
.woocommerce-cart table.cart td.product-name a:hover { color: var(--maroon); }
.woocommerce-cart .cart_totals { border: 1px solid var(--line); border-radius: 18px; padding: 22px 24px; background: var(--cream); }
.woocommerce-cart .cart_totals h2 { font: 400 24px 'Fraunces', serif; margin: 0 0 14px; }
.woocommerce-cart .wc-proceed-to-checkout .checkout-button { width: 100%; text-align: center; padding: 15px !important; }
.woocommerce-cart .actions .button { border-radius: 999px !important; }
