/*
 Theme Name:   Dropalia
 Theme URI:    https://elementor.com/
 Description:  Tema hijo para el tema Hello Elementor
 Author:       Dropalia
 Author URI:   https://dropalia.com
 Template:     hello-elementor
 Version:      1.0.0
 Text Domain:  dropalia
*/

html body .elementor-menu-cart__product .variation{
	display: block;
	line-height: 20px;
}
html body .elementor-menu-cart__product .variation dd{
	margin-inline-start: 0px;
	margin-left: 0px;
}
html body.woocommerce .wc-pao-addon-wrap{
    padding-top: 50px;
}
html body.woocommerce .wc-pao-addon-image-swatch img{
    max-width: 150px;
    max-height: 150px;
    width: 150px;
}
/*html body.woocommerce .wc-pao-addon-image-swatch:first-child {
    display: none !important;
}*/
html body.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price, .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price{
    color: #050505;
}
html body .wc-pao-addon-image-swatch-price{
    color: #FB551D;
}

html body h2{
    color: #FB551D;
}
html body.woocommerce:where(body:not(.woocommerce-uses-block-theme)) ul.products li.product .price{
    color: #000;
}
html body.woocommerce table.shop_table{
    padding: 20px;
}
html body.woocommerce-checkout #content{
    max-width: 1440px;
    margin: 0 auto;
}

/*cambios resumen checkout*/

/* --- Contenedor del Resumen --- */
.woocommerce-checkout-review-order-table {
    border: none !important;
    border-radius: 0 !important;
}

/* Eliminar cabeceras y bordes de celdas */
.woocommerce-checkout-review-order-table thead,
.woocommerce-checkout-review-order-table td,
.woocommerce-checkout-review-order-table th {
    border: none !important;
    background: transparent !important;
    padding: 12px 0 !important;
}

/* --- Título del Producto (Starter en la imagen) --- */
.product-name {
    font-size: 16px;
    font-weight: 500;
    color: #ffffff; /* Si el fondo es negro */
}

/* --- Precio del Producto (A la derecha) --- */
.product-total .woocommerce-Price-amount {
    font-weight: 600;
    float: right;
    font-size: 17px;
}

/* --- Fila de Subtotal e IVA --- */
.cart-subtotal th, .cart-subtotal td,
.tax-total th, .tax-total td {
    font-size: 14px;
    color: #a0a0a0; /* Gris suave */
}

/* --- El Total Principal (El que aparece arriba en grande) --- */
/* Nota: Esto requiere mover el total arriba con JS o un Hook, 
   pero podemos estilizar el de abajo primero */
.order-total {
    border-top: 1px solid #333 !important; /* Línea divisoria sutil */
    margin-top: 20px;
}

.order-total .woocommerce-Price-amount {
    font-size: 24px;
    font-weight: 700;
    color: #fff;
}

/* Estilo para las etiquetas de suscripción (ej: "por mes") */
.subscription-details {
    font-size: 12px;
    color: #888;
    display: block;
}


.woocommerce-checkout .summary-total{
	color: #FF6E3E;
}
.woocommerce-checkout .summary-subtext
{
	color: #FF6E3E;
}
.product-total .woocommerce-Price-amount{
	float: left;
}
.woocommerce-checkout .shop_table.woocommerce-checkout-review-order-table thead{
	display: none;
}
.elementor-widget-woocommerce-checkout-page .woocommerce .woocommerce-checkout-review-order-table tfoot th{
	color: #050505;
}

/* Estilo para el multiplicador de cantidad (el "x 10") */
.product-quantity {
    font-size: 0.9em;
    color: #777; /* Gris para que no compita con el nombre del producto */
    margin-left: 4px;
    font-weight: 400;
}

/* 1. Suavizar etiquetas de Subtotal e IVA */
.cart-subtotal th, .tax-total th {
    font-weight: 400 !important; /* Menos grosor */
    color: #666 !important; /* Gris en lugar de negro */
    text-transform: none !important;
}

/* 2. Suavizar los montos a la derecha */
.cart-subtotal td .amount, .tax-total td .amount {
    font-weight: 400 !important;
    color: #666 !important;
    font-size: 17px;
}

/* 3. Estilo para el "/ mes" de las suscripciones */
/* WooCommerce suele envolver esto en una etiqueta pequeña o span */
.subscription-details, .woocommerce-Price-suffix {
    color: #a0a0a0 !important;
    font-size: 15px !important;
    font-weight: normal !important;
}

/* 4. El nombre de los productos (Profesional, Plan Clientes) */
.product-name {
    font-weight: 500 !important;
    color: #111 !important;
}

/* 5. Los metadatos (Sector, Sexo, Edad) */
/* Se ven un poco grandes en tu captura, vamos a darles un aire más "pro" */
.wc-item-meta {
    font-size: 13px !important;
    color: #777 !important;
    list-style: none !important;
    padding: 0 !important;
    margin-top: 5px !important;
}


.express-checkout-title h3, .custom-express-title {
    font-size: 25px;
    font-weight: 600;
    color: #111;
    margin-bottom: 20px;
    text-transform: none;
    letter-spacing: -0.2px;
    display: block;
    width: 100%;
    text-align: center;
}

/* Espaciado extra para los botones de Stripe */
#wc-stripe-express-checkout-element {
    /*margin-bottom: 30px !important;
    padding-bottom: 20px;*/
    /*border-bottom: 1px solid #eee;*/ /* Opcional: una línea divisoria sutil */
}

/* El separador "O" que aparece debajo en tu captura */
#wc-stripe-express-checkout-button-separator {
    margin-top: 20px !important;
    font-size: 13px;
    color: #999;
}


/* --- Estilización de Notificaciones de WooCommerce --- */

.woocommerce-error, 
.woocommerce-message, 
.woocommerce-info {
    background-color: #fff1f0 !important; /* Fondo rosa/rojo muy suave */
    border: 1px solid #ffa39e !important; /* Borde fino y elegante */
    border-left-width: 4px !important; /* Mantenemos un acento lateral pero sutil */
    /*color: #cf1322 !important; *//* Texto rojo oscuro legible */
    padding: 16px 20px !important;
    border-radius: 6px !important;
    margin-bottom: 30px !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    display: flex !important;
    align-items: center !important;
    list-style: none !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important;
}

/* Corregir el problema del icono montado (Captura 15.58.06) */
.woocommerce-error::before {
    content: "\e016"; /* Icono nativo de WC corregido */
    font-family: 'WooCommerce' !important;
    margin-right: 12px !important;
    font-size: 18px !important;
    display: inline-block !important;
    position: static !important; /* Quita el posicionamiento absoluto que causa el solapamiento */
}

/* Si quieres quitar el texto "Error:" y dejar solo el mensaje explicativo */
.woocommerce-error strong {
    display: none !important;
}

/* Enlaces dentro del error (ej: ¿Has olvidado tu contraseña?) */
.woocommerce-error a {
    color: #cf1322 !important;
    text-decoration: underline !important;
    font-weight: 600 !important;
    margin-left: 5px !important;
}

.woocommerce-error a:hover {
    color: #a8071a !important;
}


/* Espaciado entre los dos checkboxes legales */
/*.form-row.privacy, 
.woocommerce-terms-and-conditions-wrapper {
    margin-bottom: 12px !important;
    display: block !important;
}*/

/* Alineación profesional del texto con el checkbox */
.woocommerce-form__label-for-checkbox span {
    display: inline-block;
    vertical-align: middle;
    font-size: 14px;
    line-height: 1.2;
}

/* Estilo del asterisco en los checkboxes */
.form-row.privacy .required {
    color: #ff4d4f !important;
    text-decoration: none !important;
    font-weight: bold;
}

/* Asegurar que el checkbox tenga un tamaño cómodo para móvil */
.woocommerce-form__input-checkbox {
    width: 18px !important;
    height: 18px !important;
    cursor: pointer;
    margin-right: 10px !important;
}
/*
.woocommerce-checkout .form-row.privacy, 
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
    margin-top: 15px !important;
}*/

.elementor-widget-woocommerce-checkout-page .woocommerce-checkout #payment .place-order{
	margin-top: 25px !important;
}
.elementor-widget-woocommerce-checkout-page a{
    color: #FB551D;
}





/* Estilo para el resumen de pedido tipo Stripe */
.woocommerce-checkout-review-order-table {
    border: none !important;
}

.woocommerce-checkout-review-order-table thead {
    display: none; /* Ocultamos cabeceras Producto/Subtotal para limpiar */
}

/* Fila de Total a pagar hoy */
.order-total th {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #000 !important;
    padding-top: 20px !important;
    line-height: 10px !important;
}

.order-total .amount {
    font-size: 18px !important;
    font-weight: 800 !important;
    color: #000 !important;
}

/* Estilo para el texto de "facturación mensual" que añadimos por PHP */
.billing-period-label {
    margin-top: 4px;
    text-transform: lowercase;
}

/* Quitar el fondo grisáceo que suelen poner algunos temas en los totales */
.shop_table.woocommerce-checkout-review-order-table tr {
    background-color: transparent !important;
}


/* Localizar la celda del título del Total y forzar el texto */
.shop_table.woocommerce-checkout-review-order-table tr.order-total th {
    font-size: 0 !important; /* Ocultamos el texto original (aunque sea invisible) */
}

.shop_table.woocommerce-checkout-review-order-table tr.order-total th::before {
    content: "Total a pagar hoy"; /* Inyectamos el texto deseado */
    font-size: 16px !important; /* Le devolvemos el tamaño */
    font-weight: 700 !important;
    color: #000 !important;
    visibility: visible !important;
}

/* Estilo para el importe (hacerlo grande como en Eleven Labs) */
.shop_table.woocommerce-checkout-review-order-table tr.order-total td strong .amount {
    font-size: 20px !important;
    font-weight: 810 !important;
    color: #000 !important;
}

.stripe-billing-period {
    display: block !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Si el nbsp; es un elemento hermano, lo ocultamos */
.product-name br, 
.product-name .stripe-billing-period + br {
    display: none !important;
}

/* Forzar que el contenedor no tenga espacios vacíos */
.product-name {
    line-height: 1.4 !important;
}

.no-space-billing{
    margin-bottom: -35px;
}
/*fin cambios resumen checkout*/


/* 1. Contenedor General de Avisos */
.woocommerce-message, 
.woocommerce-error, 
.woocommerce-info {
    padding: 15px 25px 15px 50px !important; /* Espacio para el icono */
    border-radius: 8px !important;
    border: 1px solid transparent !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    margin-bottom: 25px !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: wrap !important;
}

/* 2. Estilo específico: ÉXITO (Añadido al carrito) */
.woocommerce-message,.woocommerce-info {
    background-color: #f0fdf4 !important; /* Verde muy clarito */
    border-color: #bbf7d0 !important;
    color: #166534 !important;
}

/* 3. Estilo específico: ERROR */
.woocommerce-error {
    background-color: #fef2f2 !important; /* Rojo muy clarito */
    border-color: #fecaca !important;
    color: #991b1b !important;
    list-style: none !important; /* Quita puntos de lista si hay varios errores */
}

/* 4. Arreglar el Icono (Check verde o equis) */
.woocommerce-message::before, 
.woocommerce-error::before, 
.woocommerce-info::before {
    position: absolute !important;
    left: 15px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 20px !important;
    display: block !important;
    content: "" !important; /* Limpiamos para usar los iconos del tema o fontawesome */
}

/* Si tu icono se ve mal posicionado como en la foto, lo forzamos aquí */
.woocommerce-message .wc-forward::before,
.woocommerce-message::before {
    color: #22c55e !important;
}

/* 5. Estilo del Botón (Seguir comprando / Ver carrito) */
/*.woocommerce-message .button, 
.woocommerce-error .button {
    background-color: #1a1a1a !important; 
    color: #ffffff !important;
    padding: 8px 16px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    text-transform: none !important;
    transition: all 0.3s ease !important;
    font-size: 13px !important;
    border: none !important;
    margin-left: 15px !important;
}*/

.woocommerce-message .button:hover {
    background-color: #333333 !important;
    transform: translateY(-1px) !important;
}

body.woocommerce-order-received .elementor-widget-woocommerce-checkout-page .woocommerce .shop_table{
    padding: 20px;
    border: 1px solid #eee;
    margin-bottom: 25px;
    margin-top: 25px;
}
/* Eliminar el botón Explorar Productos específicamente por su clase */
.woocommerce-account .woocommerce-info a.wc-forward.button,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-info a.button,
.no_subscriptions .woocommerce-Button {
    display: none !important;
}

/* Ajuste por si el tema usa botones flotantes o con márgenes raros */
.woocommerce-account .woocommerce-info {
    padding-right: 20px !important; /* Normalizamos el espacio derecho */
}

.elementor-widget-woocommerce-checkout-page .woocommerce .shop_table tr:nth-child(odd)>th{
    border:0!important;
}

body.woocommerce-order-received .order-total{
    border-top:0 !important;
}
body.woocommerce-order-received .woocommerce ul.order_details{
    border: 1px solid #eee;
    padding: 20px;
    border-radius: 5px;
}
body.woocommerce-order-received .woocommerce table.my_account_orders .button{
    width: 100%;
    text-align: center;
    background-color: #FF6E3E;
    color: #fff;
    padding: 10px;
    font-size: 15px;
}
body.woocommerce-order-received .woocommerce table.shop_table th,body.woocommerce-checkout .woocommerce ul.order_details li strong{
    color: #000;
}
body.woocommerce-payment-methods .woocommerce-error{
    display: none !important;
}

/* Mejorar el formulario de login en checkout */
.woocommerce-form-login {
    border: 1px solid #e2e8f0 !important;
    padding: 30px !important;
    border-radius: 12px !important;
    background-color: #f8fafc !important;
}

.woocommerce-form-login .button {
    background-color: #1a1a1a !important; /* Negro corporativo */
    color: #fff !important;
    border-radius: 6px !important;
    padding: 10px 20px !important;
}

.woocommerce-form-login label {
    font-weight: 500 !important;
    margin-bottom: 5px !important;
}

body.woocommerce-cart .elementor-widget-woocommerce-cart .woocommerce .cart_totals table.shop_table_responsive tr td:before, .elementor-widget-woocommerce-cart .woocommerce-page .cart_totals table.shop_table_responsive tr td:before{
	float: left;
	font-weight: 700;
}
.recurring-totals,.cart-subtotal.recurring-total,.recurring-total {
    display: none !important; /* Opcional: solo si quieres que se vea ultra simple */
}
body .elementor-widget-woocommerce-checkout-page .woocommerce #customer_details .form-row .input-text{
	background-color: #F1F5F9;
    border: 1px solid #e2e8f0;
}
body .elementor-widget-woocommerce-cart .woocommerce a:not(.add_to_cart_button):not(.restore-item):not(.wc-backward):not(.wc-forward){
    color:#FF6E3E;
}

body .elementor-widget-woocommerce-my-account .e-my-account-tab:not(.e-my-account-tab__dashboard--custom) .woocommerce .shop_table{
    padding: 20px;
    margin-top: 20px;
}

body .elementor-widget-woocommerce-my-account .e-my-account-tab:not(.e-my-account-tab__dashboard--custom) .woocommerce tbody>tr:nth-child(odd)>td{
    border-top:1px solid #ddd !important;
}
body .elementor-widget-woocommerce-my-account .e-my-account-tab:not(.e-my-account-tab__dashboard--custom) .woocommerce thead:first-child tr:first-child th{
    border: 0 !important;
}