/*
Theme Name: RDS Medios (Astra Child)
Theme URI: https://rdsmedios.com
Description: Tema hijo de Astra para rdsmedios.com, estilo tecnológico oscuro con acento verde.
Author: Rafael
Template: astra
Version: 11.0.0
Text Domain: rdsmedios-child
*/

/* ==========================================================
   VARIABLES DE COLOR
   ========================================================== */
:root{
  --rds-bg-dark: #ffffff !important;      /* antes oscuro, ahora fondo blanco general */
  --rds-bg-dark-2: #f3f6f4 !important;    /* paneles / paletas suaves */
  --rds-green: #34c77b !important;
  --rds-green-dark: #1f8a54 !important;
  --rds-orange: #ff8a1e !important;
  --rds-orange-dark: #e06e00 !important;
  --rds-text-light: #1c2422 !important;   /* texto oscuro (el fondo ahora es claro) */
  --rds-text-muted: #6b7876 !important;
  --rds-bg-light: #f7f9f8 !important;
  --rds-text: #1c2422 !important;
  --rds-border: #e2e7e5 !important;
  --rds-pill-oscuro: #16221e !important;  /* solo para el botón del carrito, no para fondos generales */
}

/* ==========================================================
   TIPOGRAFÍA COMPACTA
   ========================================================== */
body, body.woocommerce{ font-size: 14px !important; line-height: 1.45 !important; background:#ffffff !important; }
h1, .entry-title, .page-title{ font-size: 1.5rem !important; }
h2{ font-size: 1.2rem !important; }
h3{ font-size: 1rem !important; }

/* ==========================================================
   WRAPPER SUPERIOR: oscuro sólido tipo CDR Medios, contiene
   logo + header de Astra (oculto) + buscador + barra de íconos
   ========================================================== */
.rds-top-wrap{
  background:#1c1f1e !important;
}

/* Todos los fondos internos quedan transparentes para que se vea
   el fondo del wrapper por detrás, sin cortes */
.rds-top-wrap .ast-primary-header-bar,
.rds-top-wrap .ast-above-header,
.rds-top-wrap .main-header-bar,
.rds-top-wrap .site-header{
  background:transparent !important;
  border-color:transparent !important;
}

.rds-top-wrap .rds-search-bar{
  background:transparent !important;
  border-color:transparent !important;
}

.rds-top-wrap .rds-icon-nav{
  background:#141716 !important; /* un tono más oscuro para separar del buscador */
  border-color:transparent !important;
}

/* ==========================================================
   LOGO (imagen incluida en el tema, arriba a la izquierda)
   ========================================================== */
.rds-logo-header{
  display:inline-flex !important;
  align-items:center;
  padding:6px 0 6px 20px;
}

.rds-logo-header img{
  height:56px !important;
  width:auto !important;
  display:block;
}

/* Ocultamos el título de texto por defecto de Astra para que no
   quede duplicado al lado de nuestro logo en imagen */
.ast-site-identity .site-title,
.ast-site-identity .site-description{
  display:none !important;
}

/* Forzamos a que Astra no reserve altura extra en el header ahora que
   el menú de texto está oculto */
.site-header,
.ast-main-header-wrap,
.ast-primary-header-bar,
.ast-above-header-wrap,
.ast-below-header-wrap,
.main-header-bar,
.ast-header-html-inner,
.ast-flex-row{
  min-height:0 !important;
  height:auto !important;
}

.site-header{
  padding:0 !important;
}

/* ==========================================================
   HEADER
   ========================================================== */
.ast-primary-header-bar,
.ast-above-header{
  border-bottom:none !important;
  padding-top:4px !important;
  padding-bottom:4px !important;
  min-height:auto !important;
}

.main-header-bar,
.main-header-bar.ast-primary-menu-disabled,
.ast-primary-header-bar .main-header-bar{
  min-height:40px !important;
}

/* El menú de texto de arriba queda oculto: ahora la navegación de
   categorías la maneja la barra de íconos con desplegable de abajo */
.main-header-bar .main-navigation,
.ast-primary-header-bar .main-navigation{
  display:none !important;
}

.main-header-bar{
  min-height:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
}

.main-header-bar .main-navigation ul li a,
.main-header-bar .main-navigation ul li a span{
  color:#ffffff !important;
  font-weight:600 !important;
  text-transform:uppercase !important;
  font-size:11px !important;
  padding-top:8px !important;
  padding-bottom:8px !important;
  padding-left:10px !important;
  padding-right:10px !important;
  letter-spacing:0 !important;
}

.main-header-bar .main-navigation > ul > li:hover > a,
.main-header-bar .main-navigation > ul > li.current-menu-item > a{
  color:var(--rds-green) !important;
}

/* ---- Submenús / desplegables: acá estaba el problema de contraste ---- */
.main-header-bar ul.sub-menu,
.main-header-bar .sub-menu,
.ast-header-navigation ul.sub-menu{
  background:var(--rds-bg-dark-2) !important;
  border-top:3px solid var(--rds-green) !important;
  box-shadow:0 12px 26px rgba(0,0,0,.45) !important;
  min-width:230px !important;
  opacity:1 !important;
  z-index:999 !important;
}

.main-header-bar ul.sub-menu li,
.main-header-bar ul.sub-menu li a,
.main-header-bar ul.sub-menu li a span,
.ast-header-navigation ul.sub-menu li a{
  background:transparent !important;
  color:#ffffff !important;
  opacity:1 !important;
  text-transform:none !important;
  font-weight:400 !important;
  font-size:13px !important;
  padding:9px 16px !important;
  border-bottom:1px solid rgba(255,255,255,.08) !important;
}

.main-header-bar ul.sub-menu li a:hover,
.main-header-bar ul.sub-menu li a:hover span{
  background:rgba(52,199,123,.18) !important;
  color:var(--rds-green) !important;
}

/* Flechita/indicador de submenú también visible */
.main-header-bar .dropdown-menu-toggle,
.main-header-bar .ast-menu-toggle-icon{
  color:#ffffff !important;
}

/* ==========================================================
   CARRUSEL DE PRODUCTOS (con flechas + avance automático cada
   5 segundos, controlado por JS), tipo CDR Medios
   ========================================================== */
.rds-carrusel-seccion{
  max-width:1200px;
  margin:24px auto;
  padding:0 20px;
}

.rds-carrusel-titulo{
  color:var(--rds-text-light) !important;
  font-size:1.05rem !important;
  font-weight:700 !important;
  margin-bottom:10px !important;
  padding-left:2px;
}

.rds-carrusel-wrap{
  display:flex;
  align-items:center;
  gap:8px;
}

.rds-car-flecha{
  flex:0 0 auto;
  width:34px;
  height:34px;
  border-radius:50%;
  border:1px solid var(--rds-border);
  background:#fff;
  color:var(--rds-text);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:.15s ease;
}

.rds-car-flecha:hover{
  background:var(--rds-green);
  border-color:var(--rds-green);
  color:#fff;
}

.rds-carrusel-viewport{
  overflow:hidden;
  position:relative;
  flex:1 1 auto;
}

.rds-carrusel-track{
  display:flex;
  gap:12px;
  transition: transform .4s ease;
  will-change: transform;
}

.rds-carrusel-card{
  flex:0 0 auto;
  width:150px;
  background:#fff;
  border:1px solid var(--rds-border);
  border-radius:8px;
  padding:10px;
  text-decoration:none;
  color:var(--rds-text) !important;
  display:flex;
  flex-direction:column;
  transition:.2s ease;
}

.rds-carrusel-card:hover{
  border-color:var(--rds-green);
  box-shadow:0 6px 14px rgba(52,199,123,.18);
  transform:translateY(-2px);
}

.rds-carrusel-card img{
  width:100%;
  height:110px;
  object-fit:contain;
  margin-bottom:6px;
}

.rds-carrusel-card-nombre{
  font-size:11.5px;
  font-weight:600;
  line-height:1.3;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  min-height:29px;
}

.rds-carrusel-card-precio{
  font-size:12.5px;
  font-weight:700;
  color:var(--rds-green-dark) !important;
  margin-top:4px;
}

@media (max-width: 768px){
  .rds-carrusel-card{ width:120px; }
  .rds-carrusel-card img{ height:90px; }
  .rds-car-flecha{ width:28px; height:28px; }
}

/* ==========================================================
   BUSCADOR DE PRODUCTOS (automático, debajo del header)
   ========================================================== */
.rds-search-bar{
  background:var(--rds-bg-dark-2) !important;
  padding:10px 20px !important;
  border-bottom:1px solid rgba(255,255,255,.06);
}

.rds-search-bar-inner{
  max-width:600px;
  margin:0 auto;
}

.rds-search-bar .woocommerce-product-search{
  display:flex !important;
  gap:8px;
}

.rds-search-bar .woocommerce-product-search input.search-field{
  flex:1 1 auto;
  border:1px solid rgba(255,255,255,.15) !important;
  border-radius:6px !important;
  padding:9px 14px !important;
  font-size:13px !important;
  background:#fff !important;
  color:var(--rds-text) !important;
}

.rds-search-bar .woocommerce-product-search button{
  background:var(--rds-green) !important;
  color:#fff !important;
  border:none !important;
  border-radius:6px !important;
  padding:9px 18px !important;
  font-size:13px !important;
  font-weight:600 !important;
  text-transform:uppercase;
  cursor:pointer;
}

.rds-search-bar .woocommerce-product-search button:hover{
  background:var(--rds-green-dark) !important;
}

/* ==========================================================
   BARRA SUPERIOR: buscador compacto + login + carrito
   ========================================================== */
.rds-search-bar{
  background:#ffffff !important;
  padding:8px 20px !important;
  border-bottom:1px solid var(--rds-border);
}

.rds-search-bar-inner.rds-search-bar-flex{
  max-width:1200px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

/* Buscador compacto con dropdown de categoría, tipo CDR */
.rds-buscador-form{
  display:flex;
  align-items:stretch;
  flex:1 1 auto;
  max-width:520px;
  border:1px solid var(--rds-border);
  border-radius:20px;
  overflow:hidden;
  background:#fff;
}

.rds-buscador-categoria{
  border:none !important;
  border-right:1px solid var(--rds-border) !important;
  background:var(--rds-bg-light) !important;
  color:var(--rds-text) !important;
  font-size:11.5px !important;
  padding:0 10px !important;
  max-width:140px;
  outline:none;
}

.rds-buscador-input{
  border:none !important;
  outline:none !important;
  flex:1 1 auto;
  font-size:12.5px !important;
  padding:0 10px !important;
  min-width:0;
}

.rds-buscador-boton{
  border:none !important;
  background:var(--rds-green) !important;
  color:#fff !important;
  padding:0 14px !important;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}

.rds-buscador-boton:hover{
  background:var(--rds-green-dark) !important;
}

/* Login + carrito */
.rds-utilidades{
  display:flex;
  align-items:center;
  gap:14px;
  flex:0 0 auto;
}

.rds-login-link{
  display:flex;
  align-items:center;
  gap:5px;
  color:var(--rds-text) !important;
  text-decoration:none !important;
  font-size:12px !important;
  font-weight:600 !important;
  white-space:nowrap;
}

.rds-login-link:hover{ color:var(--rds-green-dark) !important; }

.rds-carrito-link{
  display:flex;
  align-items:center;
  gap:8px;
  background:var(--rds-pill-oscuro) !important;
  color:#fff !important;
  text-decoration:none !important;
  padding:7px 14px !important;
  border-radius:20px !important;
  white-space:nowrap;
}

.rds-carrito-link:hover{ background:var(--rds-green-dark) !important; }

.rds-carrito-icono{
  position:relative;
  display:flex;
}

.rds-carrito-contador{
  position:absolute;
  top:-8px;
  right:-8px;
  background:var(--rds-orange) !important;
  color:#fff !important;
  font-size:9px !important;
  font-weight:700;
  border-radius:50%;
  width:15px;
  height:15px;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}

.rds-carrito-total{
  font-size:12px !important;
  font-weight:600 !important;
}

@media (max-width: 768px){
  .rds-search-bar-inner.rds-search-bar-flex{ flex-wrap:wrap; }
  .rds-buscador-categoria{ display:none; }
}

/* ==========================================================
   BARRA DE ÍCONOS DE CATEGORÍA CON DESPLEGABLE (mega-menú)
   ========================================================== */
.rds-icon-nav{
  border-bottom:1px solid rgba(255,255,255,.08);
  position:relative;
  z-index:50;
}

.rds-icon-nav-fila{
  max-width:1200px;
  margin:0 auto;
  display:flex;
  overflow-x:auto;
  scrollbar-width:none;
}

.rds-icon-nav-fila::-webkit-scrollbar{ display:none; }

.rds-icon-nav-item{
  flex:0 0 auto;
  border-right:1px solid rgba(255,255,255,.08);
}

.rds-icon-nav-item a{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  padding:10px 14px;
  text-decoration:none !important;
  color:#ffffff !important;
  min-width:78px;
}

.rds-icon-nav-item img{
  width:26px;
  height:26px;
  object-fit:contain;
  border-radius:6px;
  background:rgba(255,255,255,.12);
  padding:3px;
  box-sizing:content-box;
}

.rds-icon-nav-item:hover a,
.rds-icon-nav-item.rds-item-activo a{
  background:var(--rds-green) !important;
  color:#fff !important;
}

.rds-icon-nav-item span{
  font-size:10.5px;
  font-weight:600;
  text-align:center;
  line-height:1.2;
}

.rds-icon-nav-paneles{
  position:relative;
}

.rds-icon-nav-panel{
  display:none;
  position:absolute;
  top:0;
  left:0;
  width:100%;
  background:var(--rds-bg-dark-2) !important;
  border-top:3px solid var(--rds-green);
  box-shadow:0 14px 28px rgba(0,0,0,.45);
}

.rds-icon-nav-panel.rds-panel-visible{
  display:flex;
}

.rds-icon-nav-panel-lista{
  flex:1 1 auto;
  padding:16px 24px;
  display:flex;
  flex-direction:column;
  gap:4px;
  max-width:320px;
}

.rds-icon-nav-panel-lista a{
  color:var(--rds-text) !important;
  text-decoration:none !important;
  font-size:13px;
  padding:6px 8px;
  border-radius:5px;
}

.rds-icon-nav-panel-lista a:hover{
  background:rgba(52,199,123,.18);
  color:var(--rds-green) !important;
}

.rds-icon-nav-panel-imagen{
  flex:0 0 200px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  opacity:.5;
}

.rds-icon-nav-panel-imagen img{
  max-width:100%;
  max-height:150px;
  object-fit:contain;
}

@media (max-width: 900px){
  .rds-icon-nav-panel-imagen{ display:none; }
}

/* ==========================================================
   GRILLA DE CATEGORIAS DESTACADAS (portada) — legado, ya no se
   usa por defecto (reemplazada por la barra de íconos), pero
   queda disponible por si se usa el shortcode a mano
   ========================================================== */
.rds-cat-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(105px,1fr));
  gap:8px;
  max-width:1200px;
  margin:16px auto;
  padding:0 20px;
}

.rds-cat-card{
  background:var(--rds-bg-dark-2) !important;
  border:1px solid rgba(255,255,255,.06);
  border-radius:8px;
  text-align:center;
  padding:12px 6px;
  text-decoration:none;
  color:var(--rds-text-light) !important;
  transition:.2s ease;
}

.rds-cat-card:hover{
  border-color:var(--rds-green);
  box-shadow:0 6px 14px rgba(52,199,123,.18);
  transform:translateY(-2px);
}

.rds-cat-card img{
  max-width:34px;
  margin:0 auto 6px;
  display:block;
}

.rds-cat-card span{
  display:block;
  font-size:11px;
  font-weight:600;
  line-height:1.25;
}

/* ==========================================================
   PRODUCTOS: imágenes más chicas y grilla compacta
   ========================================================== */
ul.products{
  gap:12px !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)) !important;
}

ul.products li.product{
  width:100% !important;
  margin:0 !important;
}

ul.products li.product{
  border:1px solid var(--rds-border);
  border-radius:8px;
  padding:8px !important;
  background:#fff;
  transition:.2s ease;
}

ul.products li.product:hover{
  box-shadow:0 8px 16px rgba(0,0,0,.1);
  transform:translateY(-2px);
}

/* Imagen de producto más chica y con alto fijo para que la grilla no
   quede despareja */
ul.products li.product img,
ul.products li.product .attachment-woocommerce_thumbnail{
  max-height:110px !important;
  width:auto !important;
  max-width:100% !important;
  margin:0 auto 6px !important;
  object-fit:contain !important;
  border-radius:6px;
}

/* Página de producto individual: imagen principal también más chica */
.woocommerce-product-gallery{
  max-width:380px !important;
}

ul.products li.product .woocommerce-loop-product__title{
  font-size:12.5px !important;
  line-height:1.3 !important;
  margin-bottom:2px !important;
}

ul.products li.product .price{
  color:var(--rds-green-dark) !important;
  font-weight:700 !important;
  font-size:13px !important;
}

ul.products li.product .button,
.single_add_to_cart_button{
  background:var(--rds-orange) !important;
  border-color:var(--rds-orange) !important;
  color:#fff !important;
  border-radius:5px !important;
  font-weight:600 !important;
  text-transform:uppercase !important;
  font-size:11px !important;
  padding:7px 10px !important;
}

ul.products li.product .button:hover,
.single_add_to_cart_button:hover{
  background:var(--rds-orange-dark) !important;
  border-color:var(--rds-orange-dark) !important;
}

.onsale{
  display:none !important;
}

/* ==========================================================
   SIDEBAR / WIDGETS
   ========================================================== */
.widget_product_categories li a{
  color:var(--rds-text) !important;
  font-size:13px !important;
}

.widget_product_categories li.current-cat > a{
  color:var(--rds-green-dark) !important;
  font-weight:700 !important;
}

a.button.alt, .wc-forward{
  background:var(--rds-green) !important;
  border-color:var(--rds-green) !important;
}
a.button.alt:hover, .wc-forward:hover{
  background:var(--rds-green-dark) !important;
}

/* ==========================================================
   FOOTER
   ========================================================== */
footer.site-footer{
  background:var(--rds-bg-light) !important;
  color:var(--rds-text-muted) !important;
  font-size:12.5px !important;
  border-top:1px solid var(--rds-border);
}

footer.site-footer a{ color:var(--rds-green-dark) !important; }

/* ==========================================================
   CARRITO Y CHECKOUT: nos aseguramos de que los formularios se
   vean bien (fondo blanco, texto oscuro) con la paleta nueva
   ========================================================== */
.woocommerce-cart table.shop_table,
.woocommerce-checkout table.shop_table{
  background:#fff !important;
  color:var(--rds-text) !important;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row select,
.woocommerce-checkout #payment,
.woocommerce-additional-fields,
.woocommerce-billing-fields,
.woocommerce-shipping-fields{
  background:#fff !important;
  color:var(--rds-text) !important;
  border-color:var(--rds-border) !important;
}

.woocommerce-checkout #payment div.payment_box{
  background:var(--rds-bg-light) !important;
  color:var(--rds-text) !important;
}

#place_order,
.checkout-button{
  background:var(--rds-orange) !important;
  border-color:var(--rds-orange) !important;
  color:#fff !important;
}

#place_order:hover,
.checkout-button:hover{
  background:var(--rds-orange-dark) !important;
}

/* ==========================================================
   ESPACIADOS COMPACTOS
   ========================================================== */
.ast-container{ padding-top:16px !important; padding-bottom:16px !important; }
.woocommerce-breadcrumb{ font-size:12px !important; margin-bottom:10px !important; }
.woocommerce-result-count, .woocommerce-ordering{ font-size:12.5px !important; }

/* ==========================================================
   RESPONSIVE
   ========================================================== */
@media (max-width: 768px){
  .rds-cat-grid{ grid-template-columns:repeat(3,1fr); }
  ul.products li.product img{ max-height:110px !important; }
  body{ font-size:13px !important; }
}
