/* ======== Checkout Layout Fix (Hello Elementor) ======== */
.woocommerce-checkout form.checkout {
    max-width: 900px;
    margin: 40px auto;
    padding: 20px;
    box-sizing: border-box;
}

/* ========  Checkout – Two Column Layout  ======== */

.woocommerce-checkout .col2-set {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
}

/* Manually create a new 2-column wrapper */
.checkout-two-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-top: 40px;
	align-items: start;
}

.checkout-column-left,
.checkout-column-right{
    flex: 1;
	margin-top: 0;
}

/* Aseguramos que cada elemento ocupe su columna */
.checkout-two-columns #customer_details {
    margin: 0;
}

.checkout-two-columns #order_review {
    margin: 0;
}

/* Forzar a que billing/shipping ocupen todo el ancho dentro de la columna */
#customer_details .col-1,
#customer_details .col-2 {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
}

/* TM Extra Options */
.tm-epo-checkout-row {
	 display: none;
}


/* ===== Checkout – Estilos Neon Samurai ===== */

.woocommerce-checkout #payment,
.woocommerce-checkout .woocommerce-additional-fields,
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-shipping-fields,
.order-review-wrapper {
    background: #252525;
    border: 2px solid #FFD700;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 0 10px rgba(255, 211, 0, 0.7);
    margin-bottom: 25px;
    box-sizing: border-box;
}

/* =======================
   1. Títulos de secciones
   ======================= */
.woocommerce-checkout h3,
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.order-review-title {
    color: #FFD700;             /* amarillo */
    font-family: 'Buda', sans-serif;  /* tipografía Buda */
    text-transform: uppercase;  /* mayúsculas */
    text-decoration: underline; /* subrayado */
    margin-bottom: 20px;
		justify-self: center;
}

/* =======================
   2. Inputs y textareas
   ======================= */
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="password"],
.woocommerce-checkout input[type="number"],
.woocommerce-checkout input[type="search"],
.woocommerce-checkout input[type="url"],
.woocommerce-checkout textarea,
.woocommerce-checkout select {
    background: linear-gradient(to bottom, #333333, #000000); /* gris a negro */
    border: 2px solid #FFD700 !important; /* borde amarillo */
    border-radius: 10px !important;
    color: #ffffff !important;
    padding: 10px;
    width: 100%;
    box-sizing: border-box;
    font-size: 14px;
}

/* =======================
   3. Placeholder
   ======================= */
.woocommerce-checkout input::placeholder,
.woocommerce-checkout textarea::placeholder,
.woocommerce-checkout select option[disabled] {
    color: #888888;  /* gris */
}

/* =======================
   4. Etiquetas de campos
   ======================= */
.woocommerce-checkout label {
    color: #FFD700;  /* títulos de campos */
    font-weight: bold;
    display: block;
    margin-bottom: 5px;
}

/* =======================
   5. Ajuste de select2 (países, estados, etc.)
   ======================= */
.woocommerce .select2-container--default .select2-selection--single {
    background: linear-gradient(to bottom, #333333, #000000) !important;
    border: 2px solid #FFD700 !important;
    color: #ffffff !important;
	border-radius: 10px;
}

.select2-dropdown {
    background-color: #000000 !important; /* fondo negro */
    border: 2px solid #FFD700 !important; /* borde amarillo */
    border-radius: 10px;
}

.select2-results__option {
    background-color: #000000 !important; /* fondo negro */
    color: #FFD700 !important;            /* letra amarilla */
    padding: 8px 12px;
}

.select2-results__option--highlighted[aria-selected] {
    background-color: #222222 !important; /* un gris más oscuro al hover */
    color: #FFD700 !important;
}

.woocommerce .select2-container--default .select2-selection__rendered {
    color: #ffffff !important;
}

.woocommerce .select2-container--default .select2-selection__placeholder {
    color: #888888 !important;
}

/* =======================
   6. Inputs focus
   ======================= */
.woocommerce-checkout input:focus,
.woocommerce-checkout textarea:focus,
.woocommerce-checkout select:focus,
.woocommerce .select2-container--default.select2-container--open .select2-selection--single {
    outline: none;
    border-color: #FFD700;
    box-shadow: 0 0 8px #FFD700;
}

/* =======================
   7. Asegurar que todo el texto ingresado sea blanco
   ======================= */
.woocommerce-checkout input,
.woocommerce-checkout textarea,
.woocommerce-checkout select {
    color: #ffffff;
}


/* =======================
   Tabla
   ======================= */

/* ===============================
   1. Tabla – quitar fondo y bordes
   =============================== */
.woocommerce-checkout .shop_table.woocommerce-checkout-review-order-table {
    width: 100%;
    border-collapse: collapse;
		border: none !important;
}


/* ===============================
   2. Encabezados de tabla
   =============================== */
.woocommerce-checkout .shop_table th {
    color: #ffffff !important;
    border: none !important;
    text-align: left;
	font-weight: lighter !important;
}

/* ===============================
   3. Nombres de productos y precio de cada producto
   =============================== */
.woocommerce-checkout .shop_table .product-name {
    color: #FFD700;
}

.woocommerce-checkout .shop_table .product-total {
    color: #FFD700;
}

/* ===============================
   4. Subtotal y Total (tfoot)
   =============================== */
.woocommerce-checkout .shop_table .cart-subtotal th,
.woocommerce-checkout .shop_table .cart-subtotal td,
.woocommerce-checkout .shop_table .order-total th,
.woocommerce-checkout .shop_table .order-total td {
    color: #ffffff;
		border: 0px !important;
}

/* ===============================
   5. Shipping
   =============================== */
.shop_table .shipping .woocommerce-shipping-methods label{
	color: #CF931A;
	font-weight: lighter
}
.shop_table .shipping td{
	border: 0px !important;
}

/* ===============================
   6. Ocultar tax
   =============================== */
.woocommerce-checkout .shop_table .tax-total td {
    font-weight: lighter !important;
		color: #fff;
		border: none;
}

/* ===============================
   7. Borde blanco debajo de cada producto
   =============================== */
.woocommerce-checkout .shop_table tbody .cart_item {
    border-bottom: 1px solid #ffffff;
}

.shop_table .cart_item td {
	background: none;
	border: 0px !important;
}

/* ===============================
   8. Borde amarillo arriba del total
   =============================== */
.woocommerce-checkout .shop_table tfoot .order-total {
    border-top: 2px solid #FFD700;
    padding-top: 10px;
}

/* ===============================
   9. Padding general de filas
   =============================== */
.woocommerce-checkout .shop_table td,
.woocommerce-checkout .shop_table th {
    padding: 10px 5px;
}


/* ===============================
   Coupons
   =============================== */

.acfw-accordion-inner {
	color: #fff;
}

.acfw-accordion .acfw-accordion-inner .acfw-checkout-form-button-field .acfw_coupon_btn_wrap button,
.acfw-accordion .acfw-accordion-inner .acfw-checkout-form-button-field .agc_coupon_btn_wrap button{
	background: #ffd700 !important;
	color: #000 !important;
}

.acfw-accordion .acfw-accordion-inner .acfw-checkout-form-button-field .acfw_coupon_btn_wrap label,
.acfw-accordion .acfw-accordion-inner .acfw-checkout-form-button-field .agc_coupon_btn_wrap label{
	height: 0px;
}

.woocommerce-checkout-payment .payment_method_stripe .payment_method_stripe,
.woocommerce-checkout-payment .payment_method_stripe_us_bank_account .payment_method_stripe_us_bank_account{
	background: #000 !important;
}

.woocommerce-checkout-payment .payment_box fieldset{
	border: none !important;
}

.woocommerce-checkout-payment .payment_box::before{
	 display: none !important;
}

.woocommerce-checkout-payment .payment_method_cheque .payment_method_cheque {
	background: #000 !important;
	color: #CF931A !important;
}

.woocommerce-checkout-payment .payment_method_bacs .payment_method_bacs{
	background: #000 !important;
	color: #CF931A !important;
	font-weight: bold;
}

.woocommerce-privacy-policy-text {
	color: #CF931A;
	font-weight: bold;
}

.woocommerce-privacy-policy-text a{
	color: #FFD700;
	text-decoration: none;
}

.woocommerce_checkout_place_order{
	color: #fff !important;
}

.woocommerce-checkout-payment .place-order .alt {
	background: #FFD700 !important;
	color: #000 !important;
	width: 100%;
	height: 70px;
	text-transform: uppercase;
	font-weight: normal;
	font-family: 'Arial' !important;
}

.woocommerce-checkout-payment .place-order .wsc_save_share_cart_btns a,
.woocommerce-checkout-payment .place-order .wsc_save_share_cart_btns button{
	background: #FFD700 !important;
	color: #000;
	border: 1px solid #FFD700 !important;
}

.page-header .entry-title {
	opacity: 0;
	height: 0px;
}

.page-content .checkout-title-samurai {
	color: #FFD700;
	font-family: 'Buda', sans-serif;
	text-transform: uppercase;
	font-size:90px;
	text-align: center;
	margin-top: 50px;
}

.woocommerce-info{
	height: 10px;
}




/* =======================
   Escala general del checkout 1.5x (sin bordes ni glow)
   ======================= */
.woocommerce-checkout form.checkout {
    max-width: 1350px; /* 900 * 1.5 */
    padding: 30px;     /* 20 * 1.5 */
    margin: 60px auto; /* 40 * 1.5 */
}

.checkout-two-columns {
    gap: 60px;  /* 40 * 1.5 */
    margin-top: 60px;
}

.checkout-column-left,
.checkout-column-right {
    margin-top: 0;
}

#customer_details .col-1,
#customer_details .col-2 {
    width: 100% !important;
    max-width: 100% !important;
}

/* Contenedores principales (bordes y glow no se tocan) */
.woocommerce-checkout #payment,
.woocommerce-checkout .woocommerce-additional-fields,
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-shipping-fields,
.order-review-wrapper {
    padding: 30px;  /* 20 * 1.5 */
    margin-bottom: 37.5px; /* 25 * 1.5 */
}

/* Títulos de secciones */
.woocommerce-checkout h3,
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.order-review-title {
    margin-bottom: 30px; /* 20 * 1.5 */
    font-size: 31px;     /* 28 * 1.5 */
}

/* Inputs y textareas */
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="password"],
.woocommerce-checkout input[type="number"],
.woocommerce-checkout input[type="search"],
.woocommerce-checkout input[type="url"],
.woocommerce-checkout textarea,
.woocommerce-checkout select {
    font-size: 21px;  /* 14 * 1.5 */
    padding: 15px;    /* 10 * 1.5 */
}

/* Tabla del pedido */
.woocommerce-checkout .shop_table.woocommerce-checkout-review-order-table th,
.woocommerce-checkout .shop_table.woocommerce-checkout-review-order-table td {
    padding: 15px 7.5px;  /* 10*1.5 y 5*1.5 */
    font-size: 21px;       /* 14*1.5 */
}

/* Botones de checkout */
.woocommerce-checkout-payment .place-order .alt{
    height: 80px;  /* 70*1.5 */
    font-size: 22.5px; /* 15*1.5 */
		border-radius: 15px;
}

/* Select2 */
.woocommerce .select2-container--default .select2-selection--single {
    border-radius: 15px; /* 10*1.5 */
    padding: 15px;       /* 10*1.5 */
}

.select2-results__option {
    padding: 12px 18px; /* 8*1.5 y 12*1.5 */
}

/* Labels de inputs */
.woocommerce-checkout label {
    margin-bottom: 7.5px;   /* 5*1.5 */
    font-size: 16px;        /* 14*1.5 */
}


.acfw-accordion{
	background: linear-gradient(to bottom, #333333, #000000);
	border-radius: 15px;
	border: 1px solid #FFD700 !important;
	margin-bottom: 15px;
}

.acfw-accordion h3{
	background: none !important;
	text-decoration: none;
}

.acfw-accordion .acfw-accordion-inner{
	background: none !important;
	border-radius: 15px;
}

.page-content .checkout-disclaimer{
	background: #000;
	border: 1px solid #FFD700;
	border-radius: 15px;
	padding: 20px;
	text-align: center;
	color: #FFD700;
	font-size: 20px;
	margin-top: 80px;
}



/* ========== Responsive Checkout (Tablet + Móvil) ========== */
@media (max-width: 1024px) {
    /* El contenedor principal pasa a 1 sola columna */
    .checkout-two-columns {
        grid-template-columns: 1fr !important;
        gap: 30px; /* menos separación para pantallas pequeñas */
    }

    /* Ajuste del tamaño general (evita que se salga del viewport) */
    .woocommerce-checkout form.checkout {
        max-width: 95% !important;
        padding: 20px !important;
        margin: 20px auto !important;
    }

    /* Contenedores internos */
    .woocommerce-checkout #payment,
    .woocommerce-checkout .woocommerce-additional-fields,
    .woocommerce-checkout .woocommerce-billing-fields,
    .woocommerce-checkout .woocommerce-shipping-fields,
    .order-review-wrapper {
        padding: 20px !important;
        margin-bottom: 20px !important;
    }

    /* Títulos */
    .woocommerce-checkout h3,
    .woocommerce-checkout .woocommerce-billing-fields h3,
    .woocommerce-checkout .woocommerce-shipping-fields h3,
    .order-review-title {
        font-size: 24px !important;
        text-align: center !important;
    }

    /* Inputs */
    .woocommerce-checkout input,
    .woocommerce-checkout textarea,
    .woocommerce-checkout select {
        font-size: 16px !important;
        padding: 12px !important;
    }

    /* Evitar overflow horizontal */
    body, html {
        overflow-x: hidden !important;
    }
}

/* ========== Responsive estricto para móviles (≤ 600px) ========== */
@media (max-width: 600px) {

    .woocommerce-checkout,
    .woocommerce-checkout form.checkout,
    .page-content,
    .wp-block-group,
    .checkout-two-columns {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
    }
}

    .woocommerce-checkout form.checkout {
        padding: 15px !important;
    }
}

.select2-container {
    max-width: 100% !important;
}

.select2-selection {
    max-width: 100% !important;
}

input,
select,
textarea {
    font-size: 16px !important;
}

body, html {
    overflow-x: hidden !important;
}

@media (max-width: 1024px) {
    .checkout-title-samurai {
        font-size: 60px !important;
    }
}

/* Móvil */
@media (max-width: 767px) {
    .checkout-title-samurai {
        font-size: 38px !important;
        padding: 0 15px;
        line-height: 1.1;
        word-wrap: break-word;
        text-wrap: balance;
    }
}


/* Ajuste del max-width en móvil */
@media (max-width: 767px) {
    .woocommerce-checkout form.checkout {
        max-width: 100% !important;
        padding: 20px !important;
        margin: 20px auto !important;
    }
}

