/*
Theme Name:   Tirtza Chachara Nice
Theme URI:    https://aiteco.pro
Description:  Tema hijo Hello Elementor — Tirtza Chachara Nice | aiteco.pro
Author:       aiteco.pro
Author URI:   https://aiteco.pro
Template:     hello-elementor
Version:      1.0.0
Text Domain:  tirtza
*/

/* =====================================================
   VARIABLES GLOBALES
   ===================================================== */
:root {
  --negro:        #0A0A0A;
  --blanco:       #FFFFFF;
  --gris-100:     #F7F7F7;
  --gris-200:     #EEEEEE;
  --gris-400:     #AAAAAA;
  --gris-600:     #666666;
  --dorado:       #C9A84C;
  --dorado-light: #E8C97A;
  --borde:        #E0E0E0;
  --radio:        10px;
  --radio-lg:     18px;
  --radio-pill:   100px;
  --sombra-sm:    0 1px 4px rgba(0,0,0,.07);
  --sombra-md:    0 4px 20px rgba(0,0,0,.10);
  --sombra-lg:    0 12px 48px rgba(0,0,0,.14);
  --sombra-gold:  0 8px 32px rgba(201,168,76,.25);
  --fuente-titulo: 'Playfair Display', serif;
  --fuente-cuerpo: 'Outfit', sans-serif;
  --max-w:        1320px;
}

/* =====================================================
   RESET BASE
   ===================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--fuente-cuerpo);
  background: var(--blanco);
  color: var(--negro);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img, video { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; transition: color .2s; }
h1,h2,h3,h4,h5 { font-family: var(--fuente-titulo); letter-spacing: -.02em; line-height: 1.15; }
p { line-height: 1.7; color: var(--gris-600); }

/* =====================================================
   UTILIDADES GLOBALES
   ===================================================== */
.t-wrap    { max-width: var(--max-w); margin: 0 auto; padding: 0 clamp(16px,4vw,48px); }
.t-section { padding: clamp(56px,8vw,96px) 0; }
.t-spacer  { height: 106px; } /* compensa topbar+header fijo */
@media(max-width:768px){ .t-spacer { height: 98px; } }

/* Animación fade-up */
.t-fade { opacity: 0; transform: translateY(28px); transition: opacity .65s ease, transform .65s ease; }
.t-fade.on { opacity: 1; transform: translateY(0); }

/* =====================================================
   BOTONES GLOBALES
   ===================================================== */
.t-btn {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--fuente-cuerpo); font-size: 13px; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase;
  padding: 14px 28px; border-radius: var(--radio-pill);
  border: 2px solid transparent; cursor: pointer;
  transition: all .25s; text-decoration: none; white-space: nowrap;
}
.t-btn-gold   { background: var(--dorado);  color: #0A0A0A; border-color: var(--dorado); }
.t-btn-gold:hover { background: var(--dorado-light); border-color: var(--dorado-light); transform: translateY(-2px); box-shadow: var(--sombra-gold); }
.t-btn-negro  { background: var(--negro);   color: #fff; border-color: var(--negro); }
.t-btn-negro:hover { background: #222; transform: translateY(-2px); box-shadow: var(--sombra-md); }
.t-btn-borde  { background: transparent; color: var(--negro); border-color: var(--borde); }
.t-btn-borde:hover { border-color: var(--negro); }
.t-btn-borde-blanco { background: transparent; color: rgba(255,255,255,.75); border-color: rgba(255,255,255,.25); }
.t-btn-borde-blanco:hover { border-color: var(--dorado); color: var(--dorado); }

/* Badge / etiqueta */
.t-badge {
  display: inline-flex; align-items: center; gap: 5px;
  font-family: var(--fuente-cuerpo); font-size: 10px; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  padding: 5px 12px; border-radius: var(--radio-pill);
}
.t-badge-gold  { background: rgba(201,168,76,.1); border: 1px solid rgba(201,168,76,.25); color: var(--dorado); }
.t-badge-negro { background: var(--negro); color: #fff; }

/* =====================================================
   WOOCOMMERCE — BASE
   ===================================================== */
/* Precios */
.woocommerce .price,
.woocommerce .amount,
.woocommerce-Price-amount {
  font-family: var(--fuente-titulo) !important;
  font-weight: 700 !important;
  color: var(--negro) !important;
}
.woocommerce del .amount { color: var(--gris-400) !important; font-weight: 400 !important; }
.woocommerce ins .amount { color: var(--dorado) !important; }

/* Botones WC */
.woocommerce .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  font-family: var(--fuente-cuerpo) !important;
  font-weight: 700 !important; letter-spacing: .06em !important;
  text-transform: uppercase !important; font-size: 12px !important;
  border-radius: var(--radio-pill) !important;
  background: var(--negro) !important; color: #fff !important;
  border: 2px solid var(--negro) !important;
  padding: 12px 24px !important; transition: all .25s !important;
}
.woocommerce .button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
  background: #fff !important; color: var(--negro) !important;
  transform: translateY(-2px) !important; box-shadow: var(--sombra-md) !important;
}
/* Botón dorado: añadir carrito y pagar */
.woocommerce .single_add_to_cart_button,
.woocommerce #payment #place_order {
  background: var(--dorado) !important; border-color: var(--dorado) !important;
  color: #0A0A0A !important; font-size: 14px !important;
  padding: 16px 32px !important; box-shadow: var(--sombra-gold) !important;
}
.woocommerce .single_add_to_cart_button:hover,
.woocommerce #payment #place_order:hover {
  background: var(--dorado-light) !important; border-color: var(--dorado-light) !important;
}
/* Badge oferta */
.woocommerce span.onsale {
  background: var(--negro) !important; color: #fff !important;
  border-radius: var(--radio-pill) !important; font-family: var(--fuente-cuerpo) !important;
  font-size: 10px !important; font-weight: 700 !important;
  letter-spacing: .08em !important; text-transform: uppercase !important;
  padding: 4px 12px !important;
}
/* Mensajes */
.woocommerce-message, .woocommerce-info {
  border-left-color: var(--dorado) !important;
  background: var(--gris-100) !important;
  border-radius: 0 var(--radio) var(--radio) 0 !important;
}
.woocommerce a:hover { color: var(--dorado); }

/* =====================================================
   CATÁLOGO — GRID DE PRODUCTOS
   ===================================================== */
.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(4,1fr) !important;
  gap: 16px !important; margin: 0 !important;
}
.woocommerce ul.products li.product {
  background: #fff !important; border: 1px solid var(--borde) !important;
  border-radius: var(--radio-lg) !important; overflow: hidden !important;
  padding: 0 !important; margin: 0 !important;
  width: 100% !important; float: none !important;
  transition: all .3s ease !important;
}
.woocommerce ul.products li.product:hover {
  box-shadow: var(--sombra-lg) !important; transform: translateY(-5px) !important;
}
.woocommerce ul.products li.product a img {
  width: 100% !important; height: 220px !important;
  object-fit: cover !important; border-radius: 0 !important;
  transition: transform .4s ease !important;
}
.woocommerce ul.products li.product:hover a img { transform: scale(1.05) !important; }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--fuente-cuerpo) !important; font-size: 14px !important;
  font-weight: 600 !important; padding: 12px 14px 6px !important; margin: 0 !important;
}
.woocommerce ul.products li.product .price { padding: 0 14px 10px !important; display: block !important; }
.woocommerce ul.products li.product .button {
  margin: 0 14px 14px !important; display: block !important;
  text-align: center !important; width: calc(100% - 28px) !important;
}
.woocommerce ul.products li.product .button::before,
.woocommerce ul.products li.product .added_to_cart::before { display: none !important; }

@media(max-width:1100px){ .woocommerce ul.products { grid-template-columns: repeat(3,1fr) !important; } }
@media(max-width:768px) {
  .woocommerce ul.products { grid-template-columns: repeat(2,1fr) !important; gap: 10px !important; }
  .woocommerce ul.products li.product a img { height: 180px !important; }
}
@media(max-width:420px){ .woocommerce ul.products { grid-template-columns: 1fr !important; } }

/* =====================================================
   PRODUCTO INDIVIDUAL
   ===================================================== */
.woocommerce div.product { padding-top: 28px; }
.woocommerce div.product div.images { border-radius: var(--radio-lg); overflow: hidden; }
.woocommerce div.product .product_title {
  font-family: var(--fuente-titulo) !important;
  font-size: clamp(1.5rem,3vw,2rem) !important; margin-bottom: 12px !important;
}
.woocommerce div.product p.price { font-size: 1.5rem !important; margin-bottom: 20px !important; }
.woocommerce div.product .qty {
  border: 2px solid var(--borde) !important; border-radius: var(--radio) !important;
  padding: 10px 14px !important; font-family: var(--fuente-cuerpo) !important; max-width: 80px !important;
}

/* =====================================================
   CARRITO
   ===================================================== */
.woocommerce-cart table.cart td,
.woocommerce-cart table.cart th { border-color: var(--borde) !important; padding: 16px !important; vertical-align: middle !important; }
.woocommerce-cart table.cart img { border-radius: var(--radio) !important; border: 1px solid var(--borde) !important; }
.woocommerce .cart_totals { background: var(--gris-100) !important; border: 1px solid var(--borde) !important; border-radius: var(--radio-lg) !important; padding: 28px !important; }
.woocommerce .coupon input[type="text"] { border: 2px solid var(--borde) !important; border-radius: var(--radio-pill) !important; padding: 10px 16px !important; font-family: var(--fuente-cuerpo) !important; }

/* =====================================================
   CHECKOUT — INPUTS
   ===================================================== */
.woocommerce-checkout h3 {
  font-family: var(--fuente-titulo) !important; font-size: 1.1rem !important; font-weight: 700 !important;
  padding-bottom: 12px !important; border-bottom: 2px solid var(--negro) !important; margin-bottom: 24px !important;
}
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  border: 2px solid var(--borde) !important; border-radius: var(--radio) !important;
  padding: 13px 16px !important; font-family: var(--fuente-cuerpo) !important;
  font-size: 15px !important; transition: border-color .2s !important;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus {
  border-color: var(--dorado) !important; outline: none !important;
  box-shadow: 0 0 0 4px rgba(201,168,76,.12) !important;
}
.woocommerce form .form-row label {
  font-size: 12px !important; font-weight: 700 !important;
  text-transform: uppercase !important; letter-spacing: .08em !important;
  color: var(--gris-600) !important; margin-bottom: 6px !important;
}
.woocommerce #order_review { background: var(--gris-100) !important; border: 1px solid var(--borde) !important; border-radius: var(--radio-lg) !important; padding: 28px !important; }
.woocommerce-checkout #payment { background: #fff !important; border: 2px solid var(--borde) !important; border-radius: var(--radio-lg) !important; padding: 24px !important; }

/* =====================================================
   MI CUENTA
   ===================================================== */
.woocommerce-MyAccount-navigation ul { list-style: none !important; padding: 0 !important; display: flex !important; flex-direction: column !important; gap: 4px !important; }
.woocommerce-MyAccount-navigation li a { display: block !important; padding: 10px 16px !important; border-radius: var(--radio) !important; font-weight: 500 !important; font-size: 14px !important; color: var(--gris-600) !important; transition: all .2s !important; }
.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation li a:hover { background: var(--negro) !important; color: #fff !important; }
