/*
Theme Name: Orchid Store Child
Theme URI: https://themebeez.com/themes/orchid-store/
Template: orchid-store
Author: themebeez
Author URI: https://themebeez.com
Description: Orchid Store is a clean, flexible, stylish &amp; dynamic e-commerce WordPress theme. It is totally based on WooCommerce, WordPress plugin. Orchid Store can be used to build a wide range of online stores ranging from a fashion store, mobile and gadget store, furniture shop, sports shop, home décor store, jewellery store or any kind of multi-category online shop. Orchid Store has adequate built-in features that are required to build an online shop or stores. Orchid Store gives users the flexible customization experience for crafting their online shop with ease. Customization in Orchid Store is so simple that it can easily be tuned from WordPress live customizer. Orchid Store is fully widgetized where one can easily drag &amp; drop widgets to their respective widget areas to display website sections at front-end. If you are looking to extend your online store with the page builder, you can easily do it using Elementor page builder. If you are wondering how Orchid Store looks, please do kindly visit https://themebeez.com/themes/orchid-store/ for live demo preview. Do kindly visit https://themebeez.com/docs/orchid-store-theme-documentation/ if you would need a theme setup documentation guide.
Tags: custom-background,custom-menu,custom-logo,featured-images,full-width-template,one-column,two-columns,theme-options,threaded-comments,translation-ready,footer-widgets,blog,left-sidebar,right-sidebar,e-commerce,rtl-language-support
Version: 1.5.15.1759116083
Updated: 2025-09-29 03:21:23
*/

/*
 * ===================================================================
 *  Estilos personalizados para el tema hijo de Orchid Store (v4 - Reforzado)
 * ===================================================================
 */

/* 1. Importar y aplicar la fuente "Sora" de forma global y forzada */
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;600;700&display=swap');

/* Aplicación global de la fuente a la mayoría de los elementos de texto */
body,
button,
input,
select,
textarea,
p,
a,
li,
.site-title,
.site-description,
.widget .widget-title h3,
.entry-title,
.woocommerce-loop-product__title,
.main-navigation ul li a {
    font-family: 'Sora', sans-serif !important;
}

/* Aplicación específica a todos los encabezados */
h1, h2, h3, h4, h5, h6 {
    font-family: 'Sora', sans-serif !important;
}


/*
 * ===================================================================
 *  2. Ajustes en las tarjetas de producto y sus textos
 * ===================================================================
 */

/* Aumentar el tamaño del título del producto en las tarjetas */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
}

/* Aumentar el tamaño y cambiar el color del precio en las tarjetas de producto */
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price .amount {
    font-size: 25px !important;
    font-weight: 700 !important;
    color: #1f3680 !important;
}

/* Ajustar el precio de oferta (el que está rebajado) para que también sea azul */
.woocommerce ul.products li.product .price ins,
.woocommerce ul.products li.product .price ins .amount {
    color: #1f3680 !important; /* Usamos el mismo azul oscuro para consistencia */
    font-size: 25px !important;
    text-decoration: none; /* Quitamos el subrayado que a veces pone WooCommerce */
}

/* Ajustar el precio original (tachado) */
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price del .amount {
    font-size: 16px !important;
    opacity: 0.6; /* Hacemos que el precio tachado sea menos prominente */
}

/*
 * ===================================================================
 *  3. Mejoras visuales para las tarjetas de producto (Fondo sólido y borde sutil)
 * ===================================================================
 */

/* Contenedor principal de la tarjeta del producto */
.product-main-wrap {
    background-color: #fff !important;          /* Volvemos a un fondo blanco para integrar la imagen */
    border: 1px solid #e9e9e9 !important;   /* Un borde muy sutil, un poco más claro */
    border-radius: 8px;                        /* Mantenemos los bordes redondeados */
    box-shadow: none !important;               /* Eliminamos la sombra inicial para un look más plano */
    height: auto !important;                   /* La altura se ajustará al contenido */
    transition: border-color 0.3s ease, box-shadow 0.3s ease; /* Transición suave */
}

/* Efecto al pasar el cursor sobre la tarjeta */
.product-main-wrap:hover {
    border-color: #dcdcdc; /* Hacemos el borde un poco más visible */
    box-shadow: 0 8px 20px rgba(0,0,0,0.07); /* Añadimos una sombra sutil al pasar el cursor */
    transform: none !important; /* Eliminamos el efecto de elevación para un estilo más sobrio */
}

/* Espaciado dentro de la información del producto para mejor balance */
.product-info-wrap {
    padding: 20px 15px;
    gap: 10px;
}

/* Eliminamos el borde que habíamos puesto debajo de la imagen */
.product-thumb-wrap {
    border-bottom: none;
}

/*
 * ===================================================================
 *  4. Estilos para la Página de Producto Individual
 * ===================================================================
 */

/* Estilo para el título del producto en la página individual */
.woocommerce.woocommerce-page div.product .product_title {
    font-size: 30px !important;      /* Aumentamos el tamaño del título */
    font-weight: 700 !important;     /* Aseguramos que sea grueso */
    margin-bottom: 20px !important;  /* Espacio inferior consistente */
}

