/*
Theme Name: certifiedtranslatornearme
Theme URI: [https://certifiedtranslatornearme.com/](https://certifiedtranslatornearme.com/)
Description: certifiedtranslatornearme multisite
Author: Tu Nombre
Author URI: [https://certifiedtranslatornearme.com/](https://certifiedtranslatornearme.com/)
Template: twentytwentyfive
Version: 1.0.6
License: GNU General Public License v2 or later
License URI: [http://www.gnu.org/licenses/gpl-2.0.html](http://www.gnu.org/licenses/gpl-2.0.html)
Text Domain: certifiedtranslatornearme-child
*/
/* ¡Tus estilos CSS personalizados van debajo de este comentario! */

/* Definición de la paleta de colores personalizada usando las variables de Tailwind */
:root {
    --color-primary: #6B46C1;
    /* Morado medio - Para acentos y botones principales */
    --color-secondary: #4C1D95;
    /* Morado oscuro - Para fondos, textos de encabezado y énfasis */
    --color-light: #F3F4F6;
    /* Gris claro */
}

/* Configuración de Tailwind para usar los colores definidos */
/* Nota: Normalmente esto se haría en tailwind.config.js, pero para un solo archivo, usamos clases directas
           y CSS personalizado para las clases de WooCommerce. */

/* Estilos generales del formulario y contenedores */
.woocommerce-checkout-form {
    background-color: white;
    padding: 2rem;
    border-radius: 1rem;
    box-shadow: 0 10px 15px rgba(76, 29, 149, 0.1);
}

/* Estilo para los encabezados (h2) dentro de las secciones de checkout */
h2.woocommerce-billing-fields__title,
h3#order_review_heading,
h3#payment_heading {
    color: var(--color-secondary);
    font-size: 1.75rem;
    /* text-2xl */
    font-weight: 700;
    /* font-bold */
    margin-bottom: 1.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--color-primary);
}

/* 1. Campos de Facturación y Envío */
.woocommerce-billing-fields,
.woocommerce-additional-fields {
    margin-bottom: 2rem;
    padding: 1.5rem;
    background-color: #f8f6ff;
    /* Un lila muy sutil */
    border-radius: 0.75rem;
    border: 1px solid var(--color-primary);
    /* Borde sutil */
}

/* Estilo para los campos de entrada */
.form-row input[type="text"],
.form-row input[type="email"],
.form-row input[type="tel"],
.form-row select {
    width: 100%;
    padding: 0.75rem;
    border: 1px solid #ddd;
    border-radius: 0.5rem;
    transition: all 0.2s;
}

.form-row input:focus,
.form-row select:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px rgba(107, 70, 193, 0.3);
    /* Sombra de foco púrpura */
    outline: none;
}

/* 2. Tabla de Revisión del Pedido */
.woocommerce-checkout-review-order-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    border: 2px solid var(--color-primary);
    /* Borde principal púrpura */
    border-radius: 0.75rem;
    overflow: hidden;
    /* Asegura que el borde redondeado se aplique a toda la tabla */
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
    padding: 1rem;
    text-align: left;
    border-bottom: 1px solid #e5e7eb;
}

/* Encabezados de la tabla */
.woocommerce-checkout-review-order-table thead th {
    background-color: var(--color-secondary);
    /* Fondo oscuro */
    color: white;
    font-weight: 600;
}

/* Fila del Subtotal y Envío */
.woocommerce-checkout-review-order-table tfoot th {
    background-color: #f8f6ff;
    color: var(--color-secondary);
    font-weight: 600;
}

/* Fila del Total (la más importante) */
.woocommerce-checkout-review-order-table tfoot .order-total th,
.woocommerce-checkout-review-order-table tfoot .order-total td {
    background-color: var(--color-primary);
    /* Morado medio */
    color: white;
    font-size: 1.25rem;
    /* text-xl */
    font-weight: 700;
    border-top: 3px solid #3c0c80;
    /* Contraste sutil */
}

/* 3. Sección de Pago */
.woocommerce-checkout-payment {
    padding: 1.5rem;
    background-color: #f8f8f8;
    /* Fondo sutil para la sección */
    border-radius: 0.75rem;
    border: 1px solid #ccc;
}

/* Títulos de métodos de pago */
.woocommerce-checkout-payment .payment_methods label {
    font-weight: 600;
    color: var(--color-secondary);
    font-size: 1.1rem;
}

/* Contenedor de información de pago (donde se muestra la descripción del método) */
.payment_box {
    background-color: #ffe4e6;
    /* Puede ser un color neutro o el color claro principal */
    color: #333;
    padding: 1rem;
    border-left: 5px solid var(--color-primary);
    margin-top: 0.5rem;
    border-radius: 0.5rem;
}

/* Botón de Realizar Pedido */
#place_order {
    background-color: var(--color-secondary);
    /* Morado oscuro */
    color: white;
    font-size: 1.5rem;
    /* text-2xl */
    padding: 1rem 2rem;
    border: none;
    border-radius: 0.75rem;
    font-weight: 700;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.1s;
    width: 100%;
    margin-top: 1.5rem;
}

#place_order:hover {
    background-color: var(--color-primary);
    /* Cambio al morado medio al pasar el mouse */
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(76, 29, 149, 0.4);
}

/* Estilos de responsividad */
@media (min-width: 768px) {
    .checkout-grid {
        display: grid;
        grid-template-columns: 3fr 2fr;
        /* 60% para formularios, 40% para orden */
        gap: 2rem;
    }
}

.woocommerce-page form .form-row label {
    line-height: 1;
    margin: 5px 0;
}

.woocommerce {
    font-size: 18px;
}

li.wc_payment_method.payment_method_authnet img {
    display: none;
}

header.wp-block-template-part {
    display: none;
}

footer.wp-block-template-part {
    display: none;
}

main#wp--skip-link--target {
    padding: 50px 0;
}