/*
Theme Name: Woostify Child
Template: woostify
*/

/* ══════════════════════════════════════
   FUENTES
══════════════════════════════════════ */
@import url('https://api.fontshare.com/v2/css?f[]=clash-display@600,700,800&f[]=cabinet-grotesk@400,500&display=swap');
@import url("../woostify/style.css");

/* ══════════════════════════════════════
   VARIABLES
══════════════════════════════════════ */
:root {
  --lt-primary:     #31C9C0;
  --lt-primary-lg:  linear-gradient(135deg,#58e5dc,#31c9c0);
  --lt-dark:        #07090d;
  --lt-dark-card:   #0d1319;
  --lt-dark-footer: #060a0d;
  --lt-text:        #e2e2e8;
  --lt-text-muted:  #6a9090;
  --lt-text-dim:    #3c4948;
  --lt-border:      rgba(49,201,192,.12);
  --lt-border-soft: rgba(49,201,192,.08);
}

/* ══════════════════════════════════════
   RESET BASE
══════════════════════════════════════ */
*,*::before,*::after { box-sizing: border-box }

body {
  background: var(--lt-dark) !important;
  color: var(--lt-text) !important;
  font-family: 'Cabinet Grotesk', sans-serif !important;
}

/* ══════════════════════════════════════
   HEADER
══════════════════════════════════════ */
#masthead,
#masthead.site-header,
.site-header,
.site-header.header-layout-1,
.site-header-inner,
.woostify-container {
  background: rgba(7,9,13,.97) !important;
  backdrop-filter: blur(24px) !important;
  box-shadow: none !important;
}

.site-header {
  border-bottom: 1px solid var(--lt-border) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
}

/* Topbar */
.topbar {
  background: var(--lt-dark-footer) !important;
  border-bottom: 1px solid var(--lt-border-soft) !important;
}

/* ── Logo ── */
.site-description,
.woostify-site-description { display: none !important; }

.beta.site-title a {
  font-size: 0 !important;
  text-decoration: none !important;
}
.beta.site-title a::before {
  content: 'Lion';
  font-family: 'Clash Display', sans-serif;
  font-weight: 700;
  font-size: 1.35rem;
  letter-spacing: -.03em;
  color: var(--lt-text);
}
.beta.site-title a::after {
  content: 'Tech';
  font-family: 'Clash Display', sans-serif;
  font-weight: 700;
  font-size: 1.35rem;
  letter-spacing: -.03em;
  color: var(--lt-primary);
}

/* ── Navegación ── */
.main-navigation ul li a,
nav.main-navigation a {
  font-family: 'Cabinet Grotesk', sans-serif !important;
  font-size: .875rem !important;
  font-weight: 500 !important;
  color: #bbc9c7 !important;
  transition: color .2s !important;
}
.main-navigation ul li a:hover,
nav.main-navigation a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a {
  color: var(--lt-primary) !important;
}
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a {
  font-weight: 700 !important;
}

/* ── Íconos header ── */
.site-header .woostify-header-icon a,
.site-header .header-icon-item a {
  color: #bbc9c7 !important;
  transition: color .2s !important;
}
.site-header .woostify-header-icon a:hover,
.site-header .header-icon-item a:hover {
  color: var(--lt-primary) !important;
}
.site-header svg { fill: currentColor !important; }

/* ── Badge carrito ── */
.woostify-cart-count,
.count {
  background: var(--lt-primary) !important;
  color: #00201e !important;
}

/* ══════════════════════════════════════
   WOOCOMMERCE — GENERAL
══════════════════════════════════════ */
.woocommerce,
.woocommerce-page {
  background: var(--lt-dark) !important;
}

/* Ocultar mensaje nativo carrito vacío */
.wc-empty-cart-message { display: none !important; }

/* ── Botones ── */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.wc-proceed-to-checkout a.button,
.wc-proceed-to-checkout .checkout-button {
  background: var(--lt-primary-lg) !important;
  color: #00201e !important;
  font-family: 'Clash Display', sans-serif !important;
  font-weight: 700 !important;
  border-radius: 10px !important;
  border: none !important;
  letter-spacing: -.01em !important;
  transition: opacity .2s !important;
  text-decoration: none !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.wc-proceed-to-checkout a.button:hover {
  opacity: .85 !important;
  color: #00201e !important;
}

/* ── Precios ── */
.woocommerce .price,
.woocommerce-Price-amount {
  color: var(--lt-text) !important;
  font-family: 'Clash Display', sans-serif !important;
  font-weight: 700 !important;
}
.order-total .woocommerce-Price-amount {
  color: var(--lt-primary) !important;
}

/* ── Tabla del carrito ── */
.woocommerce table.shop_table {
  background: var(--lt-dark-card) !important;
  border: 1px solid var(--lt-border) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  color: var(--lt-text) !important;
}
.woocommerce table.shop_table th {
  background: rgba(49,201,192,.05) !important;
  color: var(--lt-primary) !important;
  font-family: 'Clash Display', sans-serif !important;
  font-size: .7rem !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  border-color: var(--lt-border) !important;
}
.woocommerce table.shop_table td {
  border-color: var(--lt-border-soft) !important;
  color: var(--lt-text) !important;
}

/* ── Inputs ── */
.woocommerce form .input-text,
.woocommerce form select,
.woocommerce form textarea,
.woocommerce .quantity input[type=number] {
  background: var(--lt-dark-card) !important;
  border: 1px solid var(--lt-border) !important;
  border-radius: 10px !important;
  color: var(--lt-text) !important;
  font-family: 'Cabinet Grotesk', sans-serif !important;
  outline: none !important;
}
.woocommerce form .input-text:focus,
.woocommerce form select:focus,
.woocommerce .quantity input[type=number]:focus {
  border-color: var(--lt-primary) !important;
  box-shadow: 0 0 0 3px rgba(49,201,192,.1) !important;
}

/* ── Labels ── */
.woocommerce form label {
  color: var(--lt-text-muted) !important;
  font-family: 'Cabinet Grotesk', sans-serif !important;
  font-size: .875rem !important;
}

/* ── Notificaciones ── */
.woocommerce-message,
.woocommerce-info {
  background: rgba(49,201,192,.08) !important;
  border-top-color: var(--lt-primary) !important;
  color: var(--lt-text) !important;
}
.woocommerce-error {
  background: rgba(231,76,60,.08) !important;
  border-top-color: #e74c3c !important;
  color: var(--lt-text) !important;
}

/* ── Totales ── */
.cart_totals,
.cart_totals h2,
.woocommerce-checkout h3 {
  font-family: 'Clash Display', sans-serif !important;
  color: var(--lt-text) !important;
  font-weight: 700 !important;
}
.cart_totals table {
  background: var(--lt-dark-card) !important;
  border: 1px solid var(--lt-border) !important;
  border-radius: 12px !important;
  color: var(--lt-text) !important;
}
.cart_totals table th,
.cart_totals table td {
  border-color: var(--lt-border-soft) !important;
}

/* ── Checkout proceed button ── */
.wc-proceed-to-checkout a.button,
.wc-proceed-to-checkout .checkout-button {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  padding: 1rem !important;
  font-size: 1rem !important;
  border-radius: 12px !important;
}

/* ══════════════════════════════════════
   FOOTER
══════════════════════════════════════ */
#colophon,
.site-footer {
  background: var(--lt-dark-footer) !important;
  border-top: 1px solid var(--lt-border) !important;
  padding: 0 !important;
}

.site-footer .woostify-container,
.site-footer .site-info {
  background: transparent !important;
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 2rem 1.5rem !important;
  width: 100% !important;
}

.site-infor-col:first-child { width: 100% !important; }
.site-infor-col:last-child { display: none !important; }

/* ── Layout lt-footer ── */
.lt-footer { width: 100%; }

.lt-footer-inner {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 2rem !important;
  flex-wrap: wrap !important;
  padding-bottom: 1.25rem !important;
  border-bottom: 1px solid var(--lt-border-soft) !important;
  margin-bottom: 1rem !important;
}

.lt-footer-col {
  display: flex !important;
  flex-direction: column !important;
}

.lt-footer-divider {
  display: block !important;
  width: 1px !important;
  height: 40px !important;
  background: var(--lt-border) !important;
  flex-shrink: 0 !important;
}

/* ── Labels ── */
.lt-col-label {
  font-family: 'Cabinet Grotesk', sans-serif !important;
  font-size: .65rem !important;
  font-weight: 700 !important;
  color: var(--lt-text-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  margin: 0 0 .6rem !important;
}

/* ── Social ── */
.lt-social {
  display: flex !important;
  gap: .5rem !important;
}
.lt-social a {
  width: 32px !important;
  height: 32px !important;
  border-radius: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: .95rem !important;
  text-decoration: none !important;
  transition: all .2s !important;
  border: 1px solid var(--lt-border) !important;
  color: var(--lt-text-muted) !important;
  background: transparent !important;
}
.lt-social a:hover { color: var(--lt-primary) !important; border-color: rgba(49,201,192,.4) !important; background: rgba(49,201,192,.08) !important; }
.lt-social a.wa:hover { color: #25d366 !important; border-color: rgba(37,211,102,.4) !important; background: rgba(37,211,102,.08) !important; }
.lt-social a.ig:hover { color: #e1306c !important; border-color: rgba(225,48,108,.4) !important; background: rgba(225,48,108,.08) !important; }
.lt-social a.fb:hover { color: #1877f2 !important; border-color: rgba(24,119,242,.4) !important; background: rgba(24,119,242,.08) !important; }

/* ── Payments ── */
.lt-payments {
  display: flex !important;
  gap: .4rem !important;
  align-items: center !important;
  flex-wrap: wrap !important;
}
.lt-card {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: .25rem .55rem !important;
  border-radius: 6px !important;
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  color: #bbc9c7 !important;
  font-size: 1.3rem !important;
  transition: all .2s !important;
}
.lt-card:hover {
  background: rgba(49,201,192,.06) !important;
  border-color: var(--lt-border) !important;
}
.lt-card-diners { font-size: .5rem !important; padding: .25rem .45rem !important; }
.lt-diners-logo {
  font-family: 'Clash Display', sans-serif !important;
  font-weight: 700 !important;
  font-size: .5rem !important;
  line-height: 1.2 !important;
  color: #bbc9c7 !important;
  text-align: center !important;
  letter-spacing: .05em !important;
}

/* ── Bottom bar ── */
.lt-footer-bottom {
  text-align: center !important;
  padding-top: .5rem !important;
}
.lt-footer-bottom span {
  font-family: 'Cabinet Grotesk', sans-serif !important;
  font-size: .7rem !important;
  color: var(--lt-text-dim) !important;
}

/* ── Barra fija inferior de Woostify ── */
.footer-bar,
.woostify-footer-bar {
  background: var(--lt-dark-footer) !important;
  border-top: 1px solid var(--lt-border-soft) !important;
  color: var(--lt-text-dim) !important;
}

/* ══════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════ */
@media(max-width: 768px) {
  .lt-footer-divider { display: none !important; }
  .lt-footer-inner { gap: 1.25rem !important; }
}
/* Fix footer layout — forzar ancho completo */
.site-footer .woostify-container {
  padding: 0 !important;
}
.site-info {
  display: block !important;
  width: 100% !important;
  padding: 1.5rem !important;
}
.site-infor-col {
  display: block !important;
  width: 100% !important;
}
.lt-footer-inner {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 2rem !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  min-width: 0 !important;
}