/* ---------------------------------------------------------------
   WooCommerce en tema oscuro — para que Tienda/Carrito/Checkout/
   Mi cuenta se sientan parte del mismo sitio que dangercraft.shop/.
   Usa las mismas variables de color que /assets/site.css.
   --------------------------------------------------------------- */

#page, #content, .ast-container, .site-main{
  background:var(--bg-dark) !important;
  color:var(--text-light);
}

.woocommerce-products-header__title,
.woocommerce h1, .woocommerce h2, .woocommerce h3,
.entry-title, .page-title{
  color:var(--text-light) !important;
  font-family:var(--font-heading);
}

/* ---------- Grid de productos (Tienda) ---------- */
.woocommerce ul.products li.product{
  background:var(--card-bg);
  border:1px solid var(--card-border);
  border-radius:16px;
  padding:16px;
  transition:transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.woocommerce ul.products li.product:hover{
  transform:translateY(-4px);
  border-color:var(--accent);
  box-shadow:0 18px 36px -18px rgba(247,2,6,0.4);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product a{
  color:var(--text-light);
}
.woocommerce ul.products li.product .price{
  color:var(--accent-soft) !important;
  font-weight:700;
}
.woocommerce ul.products li.product .price del{ color:var(--text-muted); opacity:.7; }
.woocommerce ul.products li.product .price ins{ text-decoration:none; }
.woocommerce span.onsale{
  background:var(--accent) !important;
  color:#fff !important;
  border-radius:999px;
  font-family:var(--font-heading);
}
.woocommerce .ast-woo-product-category{ color:var(--text-muted); }

/* ---------- Botones (grid, single product, cart, checkout) ---------- */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit, .woocommerce-page a.button,
.woocommerce-cart .checkout-button, .woocommerce #place_order,
.woocommerce a.checkout-button{
  background:var(--accent) !important;
  color:#fff !important;
  border:none !important;
  border-radius:999px !important;
  font-family:var(--font-heading);
  font-weight:700;
  padding:12px 26px !important;
  transition:.25s;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce #place_order:hover{
  background:var(--accent-soft) !important;
  transform:translateY(-2px);
}
.woocommerce a.button.ast-on-card-button{
  background:rgba(247,2,6,0.15) !important;
  color:var(--accent-soft) !important;
  border:1px solid rgba(247,2,6,0.4) !important;
}
.woocommerce a.button.ast-on-card-button:hover{
  background:var(--accent) !important;
  color:#fff !important;
}

/* ---------- Página de producto individual ---------- */
.woocommerce div.product .product_title{ color:var(--text-light); }
.woocommerce div.product p.price, .woocommerce div.product span.price{ color:var(--accent-soft) !important; }
.woocommerce div.product .woocommerce-product-details__short-description{ color:var(--text-muted); }
.woocommerce div.product .woocommerce-tabs{ color:var(--text-muted); }
.woocommerce table.shop_attributes{ border-color:var(--card-border); color:var(--text-muted); }
.woocommerce table.shop_attributes th{ background:var(--card-bg); color:var(--text-light); border-color:var(--card-border); }
.woocommerce table.shop_attributes td{ border-color:var(--card-border); }
.woocommerce div.product .woocommerce-tabs ul.tabs li{ background:transparent; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a{ color:var(--text-muted); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a{ color:var(--accent-soft); }

/* ---------- Carrito ---------- */
.woocommerce-cart table.cart, .woocommerce-cart .cart_totals,
.woocommerce table.shop_table{
  background:var(--card-bg);
  border:1px solid var(--card-border);
  border-radius:16px;
  color:var(--text-light);
}
.woocommerce table.shop_table th, .woocommerce table.shop_table td{
  border-color:var(--card-border) !important;
  color:var(--text-light);
}
.woocommerce table.shop_table .product-name a{ color:var(--text-light); }
.woocommerce table.shop_table .product-price, .woocommerce table.shop_table .product-subtotal,
.woocommerce-cart .cart_totals .amount{
  color:var(--accent-soft) !important;
}
.woocommerce td.actions .coupon .input-text,
.woocommerce input.qty{
  background:rgba(0,0,0,0.35);
  border:1px solid var(--card-border);
  color:var(--text-light);
  border-radius:8px;
}

/* ---------- Checkout ---------- */
.woocommerce-checkout #customer_details,
.woocommerce-checkout .woocommerce-checkout-review-order{
  background:var(--card-bg);
  border:1px solid var(--card-border);
  border-radius:16px;
  padding:20px;
}
.woocommerce form .form-row label{ color:var(--text-muted); }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-checkout select,
.select2-container .select2-selection--single{
  background:rgba(0,0,0,0.35) !important;
  border:1px solid var(--card-border) !important;
  color:var(--text-light) !important;
  border-radius:8px !important;
}
.select2-container .select2-selection__rendered{ color:var(--text-light) !important; }
.woocommerce-checkout-review-order-table{ background:transparent; }
.woocommerce-checkout-review-order-table th, .woocommerce-checkout-review-order-table td{
  border-color:var(--card-border) !important; color:var(--text-light);
}
#payment{ background:transparent !important; }
#payment ul.payment_methods{ border-color:var(--card-border) !important; }
#payment div.payment_box{
  background:rgba(0,0,0,0.35) !important;
  color:var(--text-muted);
}
#payment div.payment_box::before{ border-bottom-color:rgba(0,0,0,0.35) !important; }

/* ---------- Mi cuenta ---------- */
.woocommerce-MyAccount-navigation{
  background:var(--card-bg);
  border:1px solid var(--card-border);
  border-radius:16px;
  padding:10px;
}
.woocommerce-MyAccount-navigation ul li a{ color:var(--text-muted); }
.woocommerce-MyAccount-navigation ul li.is-active a{ color:var(--accent-soft); font-weight:700; }
.woocommerce-MyAccount-content{ color:var(--text-light); }
.woocommerce-MyAccount-content table{ border-color:var(--card-border); }
.woocommerce form.login, .woocommerce form.register{
  background:var(--card-bg);
  border:1px solid var(--card-border);
  border-radius:16px;
  padding:24px;
}

/* ---------- Notices / mensajes ---------- */
.woocommerce-message, .woocommerce-info{
  background:rgba(247,2,6,0.1) !important;
  border-top-color:var(--accent) !important;
  color:var(--text-light) !important;
}
.woocommerce-error{
  background:rgba(247,2,6,0.15) !important;
  border-top-color:var(--accent) !important;
  color:var(--text-light) !important;
}

/* ---------- Enlaces y breadcrumbs ---------- */
.woocommerce-breadcrumb{ color:var(--text-muted); }
.woocommerce-breadcrumb a{ color:var(--text-muted); }
a{ color:var(--accent-soft); }

/* ---------- Selects (país/estado en checkout, ordenar en tienda) ----------
   Astra dibuja la flecha del <select> como un SVG gris oscuro (#454F5E)
   pensado para fondo blanco — invisible sobre el fondo oscuro. Se reemplaza
   por una flecha clara. */
select, .select2-container .select2-selection--single{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f5f6fa' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
  background-size:1em !important;
}
.select2-dropdown{ background:var(--card-bg) !important; border-color:var(--card-border) !important; }
.select2-results__option{ color:var(--text-light); }
.select2-container--default .select2-results__option--highlighted[aria-selected]{
  background:var(--accent) !important; color:#fff !important;
}
.select2-search--dropdown .select2-search__field{
  background:rgba(0,0,0,0.35) !important; border-color:var(--card-border) !important; color:var(--text-light) !important;
}

/* ---------- Metadatos de producto (categorías/SKU) ---------- */
.product_meta, .product_meta a{ color:var(--text-muted); }
.product_meta a:hover{ color:var(--accent-soft); }

/* ---------- Cantidad +/- (cuando el tema muestra botones de paso) ---------- */
.quantity .qty{ text-align:center; }
.quantity .plus, .quantity .minus{
  background:rgba(0,0,0,0.35) !important; color:var(--text-light) !important; border:1px solid var(--card-border) !important;
}

/* ---------- Mi cuenta: tablas de pedidos/descargas/direcciones ---------- */
.woocommerce-MyAccount-content table.shop_table th{ background:rgba(0,0,0,0.25); color:var(--text-light); }
.woocommerce-MyAccount-content table.shop_table td, .woocommerce-MyAccount-content table.shop_table th{
  border-color:var(--card-border) !important; padding:12px;
}
.woocommerce-orders-table__cell-order-status{ color:var(--text-muted); }
.woocommerce-Address address{ color:var(--text-muted); }
.woocommerce-Addresses .woocommerce-Address-title h3{ color:var(--text-light); }

/* ---------- Página de "Pedido recibido" (gracias por tu compra) ---------- */
.woocommerce-order-received .woocommerce-thankyou-order-received{ color:var(--text-light); }
.woocommerce-order-received ul.woocommerce-order-overview{
  background:var(--card-bg); border:1px solid var(--card-border); border-radius:16px;
  padding:20px; list-style:none;
}
.woocommerce-order-received ul.woocommerce-order-overview li{ color:var(--text-muted); }
.woocommerce-order-received ul.woocommerce-order-overview li strong{ color:var(--text-light); }

/* ---------- Ordenar por / resultados (barra sobre la grilla de Tienda) ---------- */
.woocommerce-result-count, .woocommerce-ordering{ color:var(--text-muted); }

/* ---------- Paginación ---------- */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{
  color:var(--text-muted);
}