/*
Theme Name: Flatsome Child
Description: Child theme para Flatsome — Atlantis Pharma (suplementos deportivos). Sistema de diseño minimalista blanco & negro, responsive.
Author: UX Themes
Template: flatsome
Version: 3.1
*/

/* =====================================================================
   ATLANTIS PHARMA · DESIGN SYSTEM (BLANCO & NEGRO)
   1. Tokens
   2. Base / tipografía
   3. Header & navegación
   4. Top bar
   5. Botones
   6. Hero & secciones home
   7. Tarjetas de producto
   8. Tienda / archive
   9. Producto individual
   10. Carrito
   11. Checkout
   12. Formularios
   13. Footer
   14. Responsive (tablet / móvil)
   ===================================================================== */

/* ---------- 1. TOKENS ---------- */
:root {
    --primary-color: #111111;
    --fs-color-primary: #111111;
    --fs-experimental-link-color-rgb: 17, 17, 17;
    --ap-black: #111111;
    --ap-soft-black: #0c0c0c;
    --ap-ink: #1d1d1f;
    --ap-gray: #6e6e73;
    --ap-gray-2: #8a8a8f;
    --ap-line: #e6e6e6;
    --ap-line-2: #efefef;
    --ap-bg-soft: #f6f6f8;
    --ap-white: #ffffff;
    /* ACENTO ENERGÉTICO (naranja → rojo explosivo) */
    --ap-accent: #ff4d1c;
    --ap-accent-2: #ff8a00;
    --ap-accent-3: #ff1f4b;
    --ap-accent-grad: linear-gradient(120deg, #ff8a00 0%, #ff2d2d 55%, #ff1f4b 100%);
    --ap-accent-grad-h: linear-gradient(120deg, #ff9d1f 0%, #ff3a3a 55%, #ff2f5b 100%);
    --ap-accent-glow: rgba(255,77,28,.45);
    --ap-accent-soft: rgba(255,77,28,.10);
    --ap-radius: 2px;
    --ap-radius-pill: 50px;
    --ap-radius-soft: 6px;
    --ap-shadow: 0 6px 24px rgba(0,0,0,.06);
    --ap-shadow-lg: 0 16px 44px rgba(0,0,0,.12);
    --ap-ease: cubic-bezier(.4,0,.2,1);
}

/* ---------- 2. BASE / TIPOGRAFÍA ---------- */
body {
    color: var(--ap-ink);
    letter-spacing: .1px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: var(--ap-white);
}
h1, h2, h3, h4, h5, h6 { color: #111; letter-spacing: -.4px; }
h1 { font-weight: 800; }
h2 { font-weight: 800; }
a { color: #111; transition: color .2s var(--ap-ease); }
a:hover { color: var(--ap-gray); }
::selection { background: #111; color: #fff; }
.container { max-width: 1240px; }
img { border-radius: var(--ap-radius); }

/* Encabezados de sección con kicker */
.ap-kicker {
    letter-spacing: 3px; text-transform: uppercase;
    font-size: 12px; color: var(--ap-accent); font-weight: 800;
    margin-bottom: 4px; display:inline-flex; align-items:center; gap:8px;
}
.ap-kicker:before, .ap-kicker:after { content:""; width:26px; height:2px; background: var(--ap-accent-grad); display:inline-block; }
.ap-kicker.left:before { display:none; }
.section-title-container { margin-bottom: 1.2em; }

/* ---------- 3. HEADER & NAVEGACIÓN ---------- */
#header, .header-wrapper { background-color: #fff; }
#header .header-main { border-bottom: 1px solid var(--ap-line); transition: box-shadow .3s var(--ap-ease); }
#header.stuck .header-main { box-shadow: 0 4px 18px rgba(0,0,0,.07); }
.header-bottom { display: none; }

/* Logo tipográfico de dos tonos */
.ap-logo { display: inline-flex; align-items: center; height: 100%; }
.ap-logo-text {
    font-family: "Lato", sans-serif; font-size: 25px;
    letter-spacing: 4px; text-transform: uppercase; line-height: 1; white-space: nowrap;
}
.ap-logo-text .ap-logo-strong { font-weight: 800; color: #111; }
.ap-logo-text .ap-thin { font-weight: 300; color: var(--ap-gray); }
.nav-dark .ap-logo-text .ap-logo-strong, .dark .ap-logo-text .ap-logo-strong { color: #fff; }

/* Navegación con subrayado animado */
.header-nav .nav > li > a {
    color: #111 !important; font-weight: 700; text-transform: uppercase;
    letter-spacing: 1px; font-size: 12.5px;
}
.header-nav .nav > li > a:hover { color: var(--ap-gray) !important; }
.header-nav .nav > li > a:hover { color: var(--ap-accent) !important; }
.nav > li.menu-item > a:after {
    content: ""; position: absolute; left: 12px; right: 12px; bottom: 8px;
    height: 3px; background: var(--ap-accent-grad); transform: scaleX(0); transform-origin: left;
    transition: transform .28s var(--ap-ease); border-radius: 2px;
}
.nav > li.menu-item:hover > a:after,
.nav > li.menu-item.current-menu-item > a:after { transform: scaleX(1); }

/* Iconos header (búsqueda, cuenta, carrito) */
.header-button .icon, .nav .cart-icon strong { color: #111; }
.cart-icon strong:after { border-color: #111 !important; }
.cart-icon b { background: var(--ap-accent-grad) !important; color: #fff !important; border:none !important; }
.icon-search:before, .header .icon-shopping-bag:before { font-weight: 600; }

/* Buscador desplegable */
.search-form input.search-field { border-radius: var(--ap-radius); border:1px solid var(--ap-line); }

/* Dropdowns */
.nav-dropdown { border-radius: var(--ap-radius); box-shadow: var(--ap-shadow-lg); border: none; }
.nav-dropdown li a { font-size: 13px; }

/* ---------- 4. TOP BAR ---------- */
#top-bar { background-color: #111 !important; color: #fff; }
#top-bar .flex-col { min-height: 38px; }
#top-bar .html_topbar_left strong, #top-bar .html.custom strong {
    font-weight: 600 !important; letter-spacing: .6px; font-size: 12px; text-transform: uppercase;
}
#top-bar, #top-bar a, #top-bar .nav > li > a { color: #fff !important; }
#top-bar .social-icons a .icon { color: #fff !important; }
#top-bar .social-icons a:hover .icon { opacity: .65; }

/* ---------- 5. BOTONES ---------- */
.button, .button.primary, button[type="submit"], input[type="submit"],
.woocommerce a.button, .woocommerce button.button, .woocommerce .button.alt,
.single_add_to_cart_button, .checkout-button, #place_order {
    background: var(--ap-accent-grad) !important; background-size: 160% 160% !important;
    border: none !important; color: #fff !important;
    border-radius: var(--ap-radius); text-transform: uppercase; letter-spacing: 1.3px;
    font-weight: 800; font-size: 12.5px; transition: all .3s var(--ap-ease);
    box-shadow: 0 6px 18px var(--ap-accent-glow);
}
.button:hover, .button.primary:hover, button[type="submit"]:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce .button.alt:hover,
.single_add_to_cart_button:hover, .checkout-button:hover, #place_order:hover {
    background: var(--ap-accent-grad-h) !important; background-position: 100% 0 !important;
    transform: translateY(-3px); box-shadow: 0 12px 30px var(--ap-accent-glow);
    color:#fff !important;
}
/* Botón secundario / oscuro neutro */
.button.is-outline {
    background: transparent !important; color: var(--ap-accent) !important;
    border: 2px solid var(--ap-accent) !important; box-shadow: none;
}
.button.is-outline:hover { background: var(--ap-accent-grad) !important; color: #fff !important; border-color: transparent !important; }
.button.is-link { background: none !important; box-shadow:none !important; color: var(--ap-accent) !important; }
/* Botones sobre fondos oscuros (hero) */
.button.ap-on-dark { background: #fff !important; color: #111 !important; box-shadow: 0 8px 24px rgba(0,0,0,.3); }
.button.ap-on-dark:hover { background: #f0f0f0 !important; color: #111 !important; transform: translateY(-3px); }
.button.ap-on-dark.is-outline { background: transparent !important; color:#fff !important; border:2px solid rgba(255,255,255,.6) !important; box-shadow:none; }
.button.ap-on-dark.is-outline:hover { background:#fff !important; color:#111 !important; border-color:#fff !important; }
/* Botón negro neutro (cuando se quiere sobrio) */
.button.ap-dark { background: #111 !important; box-shadow:none; }
.button.ap-dark:hover { background:#000 !important; transform: translateY(-3px); }

/* ---------- 6. HERO & SECCIONES HOME ---------- */
.ap-hero { background: var(--ap-soft-black); color: #fff; position: relative; }
.ap-hero:before {
    content:""; position:absolute; inset:0; opacity:.5; pointer-events:none;
    background: radial-gradient(circle at 80% 10%, rgba(255,255,255,.06), transparent 45%),
                radial-gradient(circle at 0% 90%, rgba(255,255,255,.05), transparent 40%);
}
.ap-hero > .row, .ap-hero .col-inner { position: relative; z-index: 1; }
.ap-hero h1 { color:#fff !important; font-weight: 800; letter-spacing: 3px; text-transform: uppercase; }
.ap-hero p { color:#cfcfcf !important; }

/* Fila de ventajas */
.ap-usp { border-top:1px solid var(--ap-line); border-bottom:1px solid var(--ap-line); background:#fff; }
.ap-usp .ap-usp-item strong { display:block; text-transform:uppercase; letter-spacing:1px; font-size:13px; color:#111; }
.ap-usp .ap-usp-item span { color: var(--ap-gray); font-size:12.5px; }
.ap-usp .col { border-right: 1px solid var(--ap-line-2); }
.ap-usp .col:last-child { border-right: none; }

/* Cajas de categoría */
.ap-catbox {
    background:#111; color:#fff; text-align:center; padding:46px 12px;
    text-transform:uppercase; letter-spacing:2px; font-weight:700; font-size:15px;
    transition: all .3s var(--ap-ease); display:block; position:relative; overflow:hidden;
}
.ap-catbox:after { content:"Ver productos →"; display:block; font-size:11px; letter-spacing:1px; font-weight:600;
    color: rgba(255,255,255,.65); margin-top:10px; opacity:0; transform: translateY(6px); transition: all .3s var(--ap-ease); }
.ap-catbox:hover { background:#000; color:#fff; }
.ap-catbox:hover:after { opacity:1; transform: translateY(0); }
.ap-catbox.alt { background: var(--ap-bg-soft); color:#111; border:1px solid var(--ap-line); }
.ap-catbox.alt:after { color: var(--ap-gray); }
.ap-catbox.alt:hover { background:#111; color:#fff; }
.ap-catbox.alt:hover:after { color: rgba(255,255,255,.65); }

/* Newsletter */
.ap-news input { flex:1; padding:14px 16px; border:1px solid #111; border-radius:0; font-size:14px; }
.ap-news input:focus { outline:none; box-shadow: inset 0 0 0 1px #111; }
.ap-news button { border-radius:0; padding:0 26px; }

/* ---------- 7. TARJETAS DE PRODUCTO ---------- */
.product-small.box {
    transition: transform .3s var(--ap-ease); padding-bottom: 6px;
}
.product-small.box:hover { transform: translateY(-6px); }
.box-image { border:1px solid var(--ap-line-2); background:#fff; overflow:hidden; }
.box-image img { transition: transform .6s var(--ap-ease); }
.product-small.box:hover .box-image img { transform: scale(1.06); }
.box-text { padding-top: 14px; text-align: center; }
.box-text .category, .product-cat-name { font-size: 11px; text-transform: uppercase; letter-spacing: 1.5px; color: var(--ap-gray-2); }
.box-text .name.product-title a { color:#111; font-weight:700; font-size:14px; }
.box-text .name.product-title a:hover { color: var(--ap-accent); }
.product-small.box:hover .box-image { box-shadow: 0 14px 34px rgba(0,0,0,.13); }
.price, .woocommerce-Price-amount { color:#111; font-weight:800; }
ins .woocommerce-Price-amount { color: var(--ap-accent) !important; } del .woocommerce-Price-amount { color: var(--ap-gray-2); font-weight:400; }
.box-text .price ins { text-decoration:none; }
.badge-inner.on-sale { background: var(--ap-accent-grad) !important; color:#fff !important; border-radius: var(--ap-radius); font-weight:800; letter-spacing:.5px; box-shadow: 0 4px 12px var(--ap-accent-glow); }
.badge.out-of-stock-label .badge-inner { background: var(--ap-gray) !important; border-radius: var(--ap-radius); }
/* etiqueta de descuento % */
.badge-inner.on-sale:after { content:""; }

/* Botón add-to-cart en grid */
.add-to-cart-grid .button, .product-small .button.is-small {
    width: 100%; border-radius:0;
}

/* ---------- 8. TIENDA / ARCHIVE ---------- */
.shop-page-title.page-title, .archive .page-title {
    background:#0c0c0c; color:#fff; padding: 54px 0; margin-bottom: 30px;
}
.shop-page-title .page-title-inner { background:none !important; }
.archive .page-title-inner .title-wrapper, .shop-page-title .title-wrapper { min-height: auto; }
.shop-page-title h1, .archive .page-title h1 { color:#fff; text-transform:uppercase; letter-spacing:2px; }
.woocommerce-breadcrumb { color: var(--ap-gray); font-size:12px; text-transform:uppercase; letter-spacing:1px; }
.woocommerce-breadcrumb a { color: var(--ap-gray); } .woocommerce-breadcrumb a:hover { color:#111; }
/* Barra de orden / resultados */
.woocommerce-ordering select, .woocommerce ordering .orderby {
    border:1px solid var(--ap-line); border-radius:0; text-transform:uppercase; font-size:12px; letter-spacing:.5px;
}
.result-count, .woocommerce-result-count { color: var(--ap-gray); font-size:13px; }
/* Paginación */
.page-numbers li a, .page-numbers li span {
    border-radius:0 !important; border:1px solid var(--ap-line); min-width:42px; line-height:40px; color:#111;
}
.page-numbers li .current { background: var(--ap-accent-grad) !important; color:#fff !important; border-color:transparent; }
.page-numbers li a:hover { background:#111 !important; color:#fff !important; border-color:#111; }
/* Sidebar de tienda */
.widget .widget-title, .widget-title span { text-transform:uppercase; letter-spacing:1px; font-size:14px; }

/* ---------- 9. PRODUCTO INDIVIDUAL ---------- */
.single-product .product-title { font-size: 30px; font-weight:800; letter-spacing:-.5px; }
.single-product div.product .price { font-size: 28px; font-weight:800; color:#111; }
.single-product div.product .price ins .amount, .single-product .price ins .amount { color: var(--ap-accent); }
.single-product .product_meta { font-size:12px; color: var(--ap-gray); text-transform:uppercase; letter-spacing:.5px; }
.single-product .product-gallery .image-tools, .woocommerce-product-gallery img { border-radius:0; }
.product-gallery-slider .img-inner, .single-product .product-thumbnails img { border:1px solid var(--ap-line-2); }
/* Cantidad */
.quantity input.qty {
    border:1px solid #111; border-radius:0; height:48px; font-weight:700;
}
.quantity .minus, .quantity .plus { border:1px solid #111 !important; border-radius:0 !important; background:#fff; color:#111; height:48px; }
.quantity .minus:hover, .quantity .plus:hover { background:#111; color:#fff; }
.single_add_to_cart_button { height:48px; line-height:48px; padding:0 34px !important; }
/* Tabs */
.woocommerce-tabs .nav-tabs > li > a, .product-section-title {
    text-transform:uppercase; letter-spacing:1.5px; font-weight:700; font-size:13px; color:#111;
}
.woocommerce-tabs .tab-panels .panel { padding-top: 24px; }
.product-section-title { border-bottom:3px solid transparent; border-image: var(--ap-accent-grad) 1; display:inline-block; padding-bottom:6px; }
.woocommerce-tabs .nav-tabs > li.active > a { color: var(--ap-accent) !important; border-bottom:3px solid var(--ap-accent) !important; }
/* Stock */
.stock.in-stock { color:#111; font-weight:600; } .stock.in-stock:before { color:#111; }

/* ---------- 10. CARRITO ---------- */
.cart-container, .woocommerce-cart-form { }
.woocommerce-cart table.cart, .cart-form table {
    border:1px solid var(--ap-line); border-radius:0;
}
.woocommerce table.shop_table { border-radius:0; border:1px solid var(--ap-line); }
.woocommerce table.shop_table thead th {
    background:#111; color:#fff; text-transform:uppercase; letter-spacing:1px; font-size:12px; font-weight:700; padding:16px;
}
.woocommerce-cart table.cart td { padding:18px 16px; border-color: var(--ap-line-2); vertical-align: middle; }
.woocommerce-cart table.cart img { width:72px; border:1px solid var(--ap-line-2); }
.woocommerce-cart-form .product-name a { font-weight:700; color:#111; }
.cart .remove, td.product-remove a.remove {
    color:#111 !important; border:1px solid var(--ap-line); border-radius:0 !important;
    width:26px; height:26px; line-height:24px; font-size:14px;
}
.cart .remove:hover { background:#111 !important; color:#fff !important; }
/* Cupón */
.coupon input#coupon_code { border:1px solid #111; border-radius:0; height:46px; }
/* Totales del carrito */
.cart_totals, .cart-sidebar .cart_totals {
    border:1px solid #111; border-radius:0; padding:8px 0;
}
.cart_totals h3, .cart_totals .cart-subtotal th, .cart_totals .order-total th {
    text-transform:uppercase; letter-spacing:1px;
}
.cart_totals .order-total .amount { font-size:22px; font-weight:800; color: var(--ap-accent); }
.checkout-button.button.alt {
    width:100%; height:54px; line-height:54px; font-size:14px; letter-spacing:2px;
}

/* ---------- 11. CHECKOUT ---------- */
.woocommerce-checkout h3, .woocommerce-checkout #order_review_heading {
    text-transform:uppercase; letter-spacing:1.5px; font-weight:800; font-size:18px;
    border-bottom:3px solid transparent; border-image: var(--ap-accent-grad) 1;
    padding-bottom:10px; margin-bottom:20px;
}
.woocommerce-checkout .order-total .amount { color: var(--ap-accent); font-weight:800; font-size:20px; }
.woocommerce-info, .woocommerce-message { border-top-color: var(--ap-accent) !important; }
.woocommerce-info:before, .woocommerce-message:before { color: var(--ap-accent) !important; }
.woocommerce-checkout .col-1, .woocommerce-checkout .col-2 { }
#order_review, .woocommerce-checkout #payment {
    background: var(--ap-bg-soft); border:1px solid var(--ap-line); border-radius:0; padding: 24px;
}
.woocommerce-checkout #payment { background:#fff; }
.woocommerce-checkout #payment ul.payment_methods { border-bottom:1px solid var(--ap-line); }
.woocommerce-checkout table.shop_table { background:#fff; }
.woocommerce-checkout #place_order {
    width:100%; height:56px; line-height:56px; font-size:15px; letter-spacing:2px; margin-top:10px;
}
.woocommerce-info, .woocommerce-message {
    border-top-color:#111 !important; border-radius:0;
}
.woocommerce-info:before, .woocommerce-message:before { color:#111 !important; }

/* ---------- 12. FORMULARIOS ---------- */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
input[type="text"], input[type="email"], input[type="tel"], input[type="password"],
input[type="search"], input[type="number"], select, textarea {
    border:1px solid var(--ap-line); border-radius: var(--ap-radius); padding:12px 14px;
    transition: border-color .2s var(--ap-ease), box-shadow .2s var(--ap-ease); background:#fff;
}
.woocommerce form .form-row input.input-text:focus,
input:focus, select:focus, textarea:focus {
    border-color:#111 !important; box-shadow: 0 0 0 1px #111 !important; outline:none;
}
.woocommerce form .form-row label, label { text-transform:uppercase; letter-spacing:.5px; font-size:12px; font-weight:600; color:#111; }
select2-container .select2-selection { border-radius:0 !important; border:1px solid var(--ap-line) !important; }

/* ---------- 13. FOOTER ---------- */
.footer-1 { background-color:#161616 !important; padding-top: 56px; padding-bottom: 30px; }
.footer-2 { background-color:#0c0c0c !important; }
#footer, #footer p, #footer li, #footer a, #footer .widget { color:#bdbdbd; }
#footer .widget-title, #footer h3, #footer .widget-title span { color:#fff; text-transform:uppercase; letter-spacing:1.5px; font-size:13px; font-weight:800; margin-bottom:18px; position:relative; padding-bottom:10px; display:inline-block; }
#footer .widget-title:after, #footer h3:after { content:""; position:absolute; left:0; bottom:0; width:32px; height:3px; background: var(--ap-accent-grad); border-radius:2px; }
#footer a:hover { color: var(--ap-accent); }
#footer .ap-foot-brand { font-size:22px; letter-spacing:4px; font-weight:800; color:#fff; text-transform:uppercase; }
#footer .ap-foot-brand .ap-thin { font-weight:300; color:#9a9a9a; }
#footer .social-icons a:hover .icon { color: var(--ap-accent) !important; }
#footer .ap-contact-line i { color: var(--ap-accent) !important; }
#footer ul { list-style:none; margin:0; }
#footer ul li { padding:5px 0; border:none; }
#footer .ap-contact-line { display:flex; gap:10px; padding:6px 0; font-size:13.5px; }
.absolute-footer { background-color:#0c0c0c !important; border-top:1px solid rgba(255,255,255,.08); }
.absolute-footer, .absolute-footer a { color:#8a8a8f !important; font-size:12px; }
.payment-icons .icon-inner { opacity:.85; }

/* ---------- 14. RESPONSIVE ---------- */
/* Tablet (<= 850px) */
@media only screen and (max-width: 850px) {
    .ap-hero { padding-top:60px !important; padding-bottom:60px !important; }
    .ap-hero h1 { font-size:40px !important; letter-spacing:2px; }
    .ap-catbox { padding:36px 10px; font-size:14px; }
    .ap-usp .col { border-right:none; border-bottom:1px solid var(--ap-line-2); padding:14px 0; }
    .ap-usp .col:last-child { border-bottom:none; }
    .single-product .product-title { font-size:24px; }
    .shop-page-title.page-title, .archive .page-title { padding:40px 0; }
}
/* Móvil (<= 549px) */
@media only screen and (max-width: 549px) {
    .ap-logo-text { font-size:19px; letter-spacing:2.5px; }
    .ap-hero h1 { font-size:30px !important; letter-spacing:1.5px; line-height:1.1; }
    .ap-hero p { font-size:15px !important; }
    .ap-hero .button { display:block; width:100%; margin:8px 0 0 !important; }
    #top-bar .html.custom strong { font-size:10.5px !important; letter-spacing:.3px; }
    .ap-catbox { padding:30px 8px; font-size:13px; letter-spacing:1.5px; }
    .ap-news { flex-direction:column; }
    .ap-news input, .ap-news button { width:100%; }
    .ap-news button { margin-top:8px; padding:14px; }
    h2 { font-size:24px !important; }
    /* Carrito apilado más legible */
    .woocommerce-cart table.cart img { width:54px; }
    .woocommerce table.shop_table_responsive tr td { text-align:right; }
    .woocommerce table.shop_table_responsive tr td:before { font-weight:700; text-transform:uppercase; font-size:11px; }
    .checkout-button.button.alt, .woocommerce-checkout #place_order { height:50px; line-height:50px; }
    .single_add_to_cart_button { width:100%; }
}

/* =====================================================================
   15. COMPONENTES ENERGÉTICOS (estilo NutrExplosion)
   ===================================================================== */

/* --- Badge del hero --- */
.ap-hero-badge {
    display:inline-flex; align-items:center; gap:8px;
    background: var(--ap-accent-grad); color:#fff; font-weight:800;
    text-transform:uppercase; letter-spacing:2px; font-size:11px;
    padding:8px 18px; border-radius: var(--ap-radius-pill);
    box-shadow: 0 8px 22px var(--ap-accent-glow); margin-bottom:18px;
}
.ap-hero-badge:before { content:"⚡"; font-size:13px; }
/* Palabra destacada del título con degradado */
.ap-grad-text {
    background: var(--ap-accent-grad); -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent; color: var(--ap-accent);
}

/* --- Barra de urgencia / promo --- */
.ap-promobar {
    background: var(--ap-accent-grad); color:#fff; text-align:center;
    padding:16px 14px; font-weight:800; text-transform:uppercase; letter-spacing:1.5px;
    font-size:14px; box-shadow: 0 10px 30px var(--ap-accent-glow);
}
.ap-promobar .ap-promo-pill {
    background:rgba(0,0,0,.22); padding:4px 14px; border-radius: var(--ap-radius-pill);
    margin:0 6px; display:inline-block;
}

/* --- Tarjetas de categoría con icono --- */
.ap-cat-card {
    display:block; text-align:center; background:#fff; border:1px solid var(--ap-line);
    border-radius: var(--ap-radius-soft); padding:34px 16px 28px; position:relative; overflow:hidden;
    transition: all .32s var(--ap-ease); height:100%;
}
.ap-cat-card:before {
    content:""; position:absolute; left:0; top:0; right:0; height:4px;
    background: var(--ap-accent-grad); transform: scaleX(0); transform-origin:left;
    transition: transform .32s var(--ap-ease);
}
.ap-cat-card:hover { transform: translateY(-8px); box-shadow: var(--ap-shadow-lg); border-color:transparent; }
.ap-cat-card:hover:before { transform: scaleX(1); }
.ap-cat-icon {
    width:74px; height:74px; margin:0 auto 16px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    background: var(--ap-accent-soft); color: var(--ap-accent); font-size:30px;
    transition: all .32s var(--ap-ease);
}
.ap-cat-card:hover .ap-cat-icon { background: var(--ap-accent-grad); color:#fff; transform: scale(1.08) rotate(-6deg); box-shadow:0 10px 24px var(--ap-accent-glow); }
.ap-cat-card .ap-cat-name { display:block; font-weight:800; text-transform:uppercase; letter-spacing:1.2px; font-size:15px; color:#111; }
.ap-cat-card .ap-cat-sub { display:block; font-size:12px; color:var(--ap-gray); margin-top:4px; }
.ap-cat-card:hover .ap-cat-name { color: var(--ap-accent); }

/* --- Tira de ventajas con icono acentuado --- */
.ap-usp .ap-usp-item .ap-usp-ic { color: var(--ap-accent); font-size:26px; display:block; margin-bottom:6px; }

/* --- Sección de marcas --- */
.ap-brands { background:#0c0c0c; }
.ap-brand-pill {
    color:#cfcfcf; font-weight:800; letter-spacing:2px; text-transform:uppercase; font-size:18px;
    opacity:.55; transition: all .3s var(--ap-ease); padding:10px 6px; display:block; text-align:center;
}
.ap-brand-pill:hover { opacity:1; color:#fff; transform: translateY(-3px); }
.ap-brand-pill span { color: var(--ap-accent); }

/* --- Caja de beneficio (split promo) --- */
.ap-feature-card {
    background:#fff; border-radius: var(--ap-radius-soft); padding:28px; border:1px solid var(--ap-line);
    transition: all .3s var(--ap-ease); height:100%;
}
.ap-feature-card:hover { transform: translateY(-6px); box-shadow: var(--ap-shadow-lg); }
.ap-feature-card .ap-feat-ic { color: var(--ap-accent); font-size:30px; margin-bottom:10px; display:block; }

/* --- Newsletter con acento --- */
.ap-news input:focus { box-shadow: inset 0 0 0 2px var(--ap-accent); border-color: var(--ap-accent); }

/* --- Glow util en secciones hero --- */
.ap-hero:after {
    content:""; position:absolute; width:420px; height:420px; right:-120px; top:-120px;
    background: radial-gradient(circle, var(--ap-accent-glow), transparent 60%);
    opacity:.5; pointer-events:none; filter: blur(10px);
}

/* Responsive de los nuevos componentes */
@media only screen and (max-width: 850px) {
    .ap-promobar { font-size:12px; letter-spacing:.6px; }
    .ap-cat-card { padding:26px 10px 22px; }
    .ap-cat-icon { width:60px; height:60px; font-size:24px; }
    .ap-brand-pill { font-size:14px; }
}
@media only screen and (max-width: 549px) {
    .ap-hero-badge { font-size:10px; padding:7px 14px; }
    .ap-promobar .ap-promo-pill { display:inline-block; margin:4px 3px; }
    .ap-cat-card .ap-cat-name { font-size:13px; }
}

/* Grid de tarjetas de categoría (5 col desktop) */
.ap-cat-grid { display:grid; grid-template-columns: repeat(5,1fr); gap:16px; }
@media (max-width: 850px) { .ap-cat-grid { grid-template-columns: repeat(3,1fr); } }
@media (max-width: 549px) { .ap-cat-grid { grid-template-columns: repeat(2,1fr); } }
/* Grid de marcas */
.ap-brand-grid { display:flex; flex-wrap:wrap; justify-content:space-around; align-items:center; gap:10px; }
.ap-brand-grid .ap-brand-pill { flex:1 1 140px; }

/* =====================================================================
   16. PÁGINA DE PRODUCTO — widgets profesionales
   ===================================================================== */

/* Highlights (lista de beneficios sobre el botón) */
.ap-highlights { list-style:none; margin:0 0 18px; padding:0; }
.ap-highlights li { position:relative; padding:5px 0 5px 26px; color:#333; font-size:14px; }
.ap-highlights li:before {
    content:"✓"; position:absolute; left:0; top:5px; width:18px; height:18px; line-height:18px;
    text-align:center; font-size:11px; font-weight:800; color:#fff; border-radius:50%;
    background: var(--ap-accent-grad); box-shadow:0 3px 8px var(--ap-accent-glow);
}

/* Caja de confianza (grid 2x2 / 4) */
.ap-trust-box {
    display:grid; grid-template-columns: repeat(2,1fr); gap:12px;
    margin:22px 0 18px; padding:18px; background: var(--ap-bg-soft);
    border:1px solid var(--ap-line); border-radius: var(--ap-radius-soft);
}
.ap-trust-item { display:flex; align-items:center; gap:11px; }
.ap-trust-ic {
    font-size:20px; width:42px; height:42px; flex:0 0 42px; border-radius:50%;
    display:flex; align-items:center; justify-content:center; background:#fff;
    border:1px solid var(--ap-line); box-shadow: var(--ap-shadow);
}
.ap-trust-item strong { display:block; font-size:13px; text-transform:uppercase; letter-spacing:.5px; color:#111; }
.ap-trust-item small { color: var(--ap-gray); font-size:12px; }

/* Línea de métodos de pago */
.ap-pay-note {
    margin-top:16px; padding-top:14px; border-top:1px dashed var(--ap-line);
    font-size:13px; display:flex; flex-wrap:wrap; gap:6px; align-items:center;
}
.ap-pay-note .ap-pay-label { font-weight:800; text-transform:uppercase; letter-spacing:.5px; color:#111; font-size:12px; }
.ap-pay-note .ap-pay-methods { color: var(--ap-gray); }
.ap-advice-note { margin-top:8px; font-size:13px; color: var(--ap-gray); }
.ap-advice-note a { color: var(--ap-accent); font-weight:700; }

/* Contenido de pestañas custom */
.woocommerce-tabs .panel h3 { text-transform:uppercase; letter-spacing:1px; font-size:16px; margin-top:18px; }
.woocommerce-tabs .panel ul { margin-left:18px; }
.woocommerce-tabs .panel ul li { padding:4px 0; }

/* "Productos que te pueden interesar" / relacionados */
.related > h2, .up-sells > h2, .related-products-wrapper > h2 {
    text-align:center; text-transform:uppercase; letter-spacing:1.5px; font-weight:800;
    font-size:26px; margin-bottom:6px; position:relative; padding-bottom:16px;
}
.related > h2:after, .up-sells > h2:after, .related-products-wrapper > h2:after {
    content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:0;
    width:60px; height:3px; background: var(--ap-accent-grad); border-radius:2px;
}
.related, .up-sells, .related-products-wrapper { border-top:1px solid var(--ap-line); margin-top:40px; padding-top:36px; }

/* Barra fija de compra (sticky add to cart de Flatsome) */
.product-sticky-bar, .sticky-add-to-cart {
    box-shadow: 0 -6px 24px rgba(0,0,0,.10); border-top:1px solid var(--ap-line);
}
.product-sticky-bar .price, .sticky-add-to-cart .price { color: var(--ap-accent); font-weight:800; }

/* Responsive producto */
@media (max-width: 549px) {
    .ap-trust-box { grid-template-columns: 1fr; gap:10px; padding:14px; }
    .related > h2, .up-sells > h2, .related-products-wrapper > h2 { font-size:21px; }
    .ap-pay-note { font-size:12px; }
}

/* =====================================================================
   17. TIENDA ELEGANTE · IMÁGENES UNIFORMES · QUICK VIEW
   ===================================================================== */

/* --- Imágenes de producto del MISMO tamaño (cuadrado, producto completo) --- */
.products .product-small .box-image {
    aspect-ratio: 1 / 1; background:#fff; overflow:hidden; position:relative;
    border:1px solid var(--ap-line-2); border-radius: var(--ap-radius-soft);
}
.products .product-small .box-image .image-fade-in-back,
.products .product-small .box-image .image-fade-in-back > a,
.products .product-small .box-image > a { display:block; height:100%; width:100%; }
.products .product-small .box-image img {
    width:100% !important; height:100% !important; object-fit: contain !important;
    padding:16px; box-sizing:border-box; transition: transform .5s var(--ap-ease);
}
.products .product-small.box:hover .box-image img { transform: scale(1.05); }

/* --- BOTÓN QUICK VIEW (acento) --- */
.product-small .image-tools.grid-tools { left:0; right:0; bottom:14px; width:auto; text-align:center; }
.product-small a.quick-view {
    display:inline-block; background: var(--ap-accent-grad) !important; color:#fff !important;
    padding:9px 20px; border-radius: var(--ap-radius-pill);
    font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:1.2px;
    box-shadow: 0 8px 20px var(--ap-accent-glow); border:none; line-height:1;
    transition: all .28s var(--ap-ease);
}
.product-small a.quick-view:before { content:"👁 "; font-size:11px; }
.product-small a.quick-view:hover {
    background: var(--ap-accent-grad-h) !important; transform: translateY(-3px) scale(1.04);
    box-shadow: 0 12px 26px var(--ap-accent-glow); color:#fff !important;
}
/* Iconos pequeños de tools (wishlist / add) en acento al hover */
.product-small .image-tools.is-small .button.icon:hover { background: var(--ap-accent-grad) !important; color:#fff !important; border-color:transparent !important; }

/* Ventana modal de Quick View */
.quick-view-title, #quick-view .product-title { font-weight:800; }
#quick-view .price ins .amount, #quick-view .price { color: var(--ap-accent); }

/* --- TIENDA: banner de título más elegante --- */
.shop-page-title.page-title, .archive.woocommerce .page-title, .category-page-title {
    background: linear-gradient(120deg,#0c0c0c 0%, #1a1a1a 100%); position:relative; overflow:hidden;
}
.shop-page-title.page-title:after, .category-page-title:after {
    content:""; position:absolute; right:-80px; top:-80px; width:300px; height:300px;
    background: radial-gradient(circle, var(--ap-accent-glow), transparent 60%); opacity:.6;
}
.shop-page-title h1, .category-page-title h1 { position:relative; z-index:1; }
.shop-page-title .is-divider, .category-page-title .is-divider { background: var(--ap-accent-grad) !important; height:3px; max-width:60px; }

/* --- TIENDA: barra de orden / resultados elegante --- */
.shop-page-title + .row .woocommerce-ordering, .archive .woocommerce-ordering { margin-bottom:10px; }
.woocommerce-ordering select {
    border:1px solid var(--ap-line); border-radius: var(--ap-radius-pill); padding:9px 36px 9px 16px;
    text-transform:uppercase; font-size:11px; letter-spacing:.5px; font-weight:700; color:#111; background:#fff;
}
.woocommerce-ordering select:focus { border-color: var(--ap-accent); box-shadow:0 0 0 1px var(--ap-accent); }
.woocommerce-result-count { font-size:13px; color: var(--ap-gray); padding-top:10px; }

/* --- TIENDA: tarjeta más elegante --- */
.products .product-small.box { padding:8px; border-radius: var(--ap-radius-soft); transition: all .3s var(--ap-ease); }
.products .product-small.box:hover { background:#fff; box-shadow: var(--ap-shadow-lg); transform: translateY(-6px); }
.products .box-text { padding:14px 8px 6px; }
.products .box-text .price { font-size:16px; }
/* Botón añadir al carrito en grid con acento (ya hereda gradiente) */
.products .add-to-cart-button a.button, .product-small .button.is-small { border-radius: var(--ap-radius-pill); }

/* Responsive imágenes uniformes */
@media (max-width: 549px) {
    .products .product-small .box-image img { padding:10px; }
    .product-small a.quick-view { padding:7px 14px; font-size:10px; }
}

/* =====================================================================
   18. PRODUCTO INDIVIDUAL · galería de imágenes uniforme (cuadrada)
   ===================================================================== */
.single-product .product-images .woocommerce-product-gallery__wrapper,
.single-product .product-gallery-slider,
.single-product .product-images .flex-viewport { height:auto !important; }

.single-product .woocommerce-product-gallery__image,
.single-product .product-gallery-slider .woocommerce-product-gallery__image {
    aspect-ratio: 1 / 1 !important; height:auto !important;
    background:#fff; border:1px solid var(--ap-line-2); border-radius: var(--ap-radius-soft);
    display:flex !important; align-items:center; justify-content:center; overflow:hidden;
}
.single-product .woocommerce-product-gallery__image > a,
.single-product .woocommerce-product-gallery__image > img {
    width:100% !important; height:100% !important; display:flex; align-items:center; justify-content:center;
}
.single-product .woocommerce-product-gallery__image img {
    width:100% !important; height:100% !important; object-fit: contain !important;
    padding:24px; box-sizing:border-box;
}
/* Miniaturas de la galería también cuadradas */
.single-product .product-thumbnails .woocommerce-product-gallery__image,
.single-product .slider-nav-small .woocommerce-product-gallery__image { aspect-ratio:1/1; }

/* Imágenes de relacionados/upsell ya uniformes (heredan .product-small de sección 17) */

@media (max-width: 549px) {
    .single-product .woocommerce-product-gallery__image img { padding:16px; }
}

/* =====================================================================
   19. BOTÓN FLOTANTE DE WHATSAPP
   ===================================================================== */
.ap-wa-float {
    position: fixed; right: 22px; bottom: 22px; z-index: 9999;
    width: 58px; height: 58px; border-radius: 50%;
    background: #25D366; color: #fff !important;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 8px 24px rgba(37,211,102,.45);
    transition: transform .25s var(--ap-ease), box-shadow .25s var(--ap-ease);
}
.ap-wa-float:hover { transform: scale(1.08); color:#fff !important; box-shadow: 0 12px 30px rgba(37,211,102,.6); }
.ap-wa-float svg { position: relative; z-index: 2; }
.ap-wa-pulse {
    position: absolute; inset: 0; border-radius: 50%; background: #25D366;
    z-index: 1; animation: ap-wa-pulse 2s infinite; opacity: .6;
}
@keyframes ap-wa-pulse {
    0% { transform: scale(1); opacity: .6; }
    70% { transform: scale(1.6); opacity: 0; }
    100% { transform: scale(1.6); opacity: 0; }
}
@media (max-width: 549px) {
    .ap-wa-float { width: 52px; height: 52px; right: 16px; bottom: 16px; }
}

/* =====================================================================
   20. FORMULARIO DE CONTACTO (CF7) + tarjetas de contacto
   ===================================================================== */
.ap-cf7 label { display:block; font-weight:600; text-transform:uppercase; letter-spacing:.5px; font-size:12px; color:#111; margin-bottom:14px; }
.ap-cf7 input[type=text], .ap-cf7 input[type=email], .ap-cf7 input[type=tel], .ap-cf7 textarea {
    width:100%; margin-top:6px; border:1px solid var(--ap-line); border-radius: var(--ap-radius); padding:12px 14px; font-size:14px; text-transform:none; font-weight:400;
}
.ap-cf7 input:focus, .ap-cf7 textarea:focus { border-color:var(--ap-accent); box-shadow:0 0 0 1px var(--ap-accent); outline:none; }
.ap-cf7 textarea { min-height:130px; }
.ap-cf7 input[type=submit] { background:var(--ap-accent-grad) !important; border:none; color:#fff; border-radius:var(--ap-radius-pill); padding:13px 30px; font-weight:800; text-transform:uppercase; letter-spacing:1px; cursor:pointer; box-shadow:0 8px 20px var(--ap-accent-glow); transition:all .3s var(--ap-ease); }
.ap-cf7 input[type=submit]:hover { transform:translateY(-3px); box-shadow:0 12px 28px var(--ap-accent-glow); }
.wpcf7-response-output { border-radius:var(--ap-radius); margin:14px 0 0 !important; }
.ap-contact-cards .ap-feature-card { text-align:left; }
.ap-contact-cards .ap-feature-card a { color:var(--ap-accent); font-weight:700; }

/* =====================================================================
   21. TIENDA / CATEGORÍAS — filtro, subtítulo, menú PC
   ===================================================================== */

/* Subtítulo de la tienda */
.ap-shop-subtitle {
    text-align:center; color: var(--ap-gray); font-size:14px; letter-spacing:.3px;
    margin:-10px 0 22px;
}

/* Barra de filtro por categoría (pills) */
.ap-cat-filter {
    display:flex; flex-wrap:wrap; justify-content:center; gap:10px;
    margin:0 0 30px; padding:0 0 26px; border-bottom:1px solid var(--ap-line);
}
.ap-cat-pill {
    display:inline-block; padding:9px 20px; border-radius: var(--ap-radius-pill);
    border:1.5px solid var(--ap-line); background:#fff; color:#111 !important;
    font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:1px;
    transition: all .25s var(--ap-ease);
}
.ap-cat-pill:hover { border-color: var(--ap-accent); color: var(--ap-accent) !important; transform: translateY(-2px); }
.ap-cat-pill.active {
    background: var(--ap-accent-grad); color:#fff !important; border-color:transparent;
    box-shadow: 0 6px 16px var(--ap-accent-glow);
}

/* Encabezado de categoría: descripción */
.archive .category-page-title + .container .term-description,
.term-description { color: var(--ap-gray); text-align:center; max-width:680px; margin:0 auto 24px; font-size:15px; }

/* Banner de título más alto y elegante */
.shop-page-title.page-title, .category-page-title { padding:62px 0 !important; }
.shop-page-title h1, .category-page-title h1 { font-size:34px; }

/* ----- MENÚ PC mejor organizado ----- */
.header-nav.nav > li { margin: 0 2px; }
.header-nav .nav > li > a { padding: 10px 14px; font-size: 13px; }
/* Indicador del desplegable */
.nav > li.menu-item-has-children > a:after,
.nav > li.has-dropdown > a:after {
    content: "\f107"; font-family: "fl-icons"; font-size: 12px; margin-left: 6px;
    opacity:.6; vertical-align: middle; display:inline-block;
}
/* Caja del desplegable */
.nav-dropdown {
    border-radius: var(--ap-radius-soft) !important; box-shadow: 0 16px 40px rgba(0,0,0,.16) !important;
    border:none !important; padding:10px 0 !important; min-width:220px; border-top:3px solid var(--ap-accent) !important;
}
.nav-dropdown li a {
    font-size:13px !important; font-weight:700; text-transform:uppercase; letter-spacing:.6px;
    padding:11px 22px !important; transition: all .2s var(--ap-ease);
}
.nav-dropdown li a:hover { background: var(--ap-accent-soft) !important; color: var(--ap-accent) !important; padding-left:28px !important; }

@media (max-width: 549px) {
    .ap-cat-filter { gap:7px; padding-bottom:18px; margin-bottom:20px; }
    .ap-cat-pill { padding:7px 14px; font-size:11px; }
}
