/* 
 * Viajando a Itália - Checkout & Obrigado Pages Modernization
 * Designed to replace legacy square shapes with modern rounded corners, soft shadows, and clean inputs.
 */

/* 1. Global Borders & Shadows for Checkout Containers */
.wcf-embed-checkout-form,
.wcf-embed-checkout-form-style-one,
.woocommerce-checkout #customer_details,
.woocommerce-checkout #order_review,
.woocommerce-checkout-payment,
#wcf-embed-checkout-form,
.wcf-thankyou-wrap {
    border-radius: 14px !important;
    border: 1px solid #eef2f5 !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.03) !important;
    background: #ffffff !important;
    padding: 25px !important;
    box-sizing: border-box !important;
    margin-bottom: 25px !important;
}

/* 2. Modern Inputs & Fields */
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout select {
    border-radius: 8px !important;
    border: 1px solid #dcdfe6 !important;
    padding: 10px 14px !important;
    font-size: 14px !important;
    background-color: #fbfcfd !important;
    color: #303133 !important;
    transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
    height: 46px !important;
    box-sizing: border-box !important;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.02) !important;
    outline: none !important;
    width: 100% !important;
}

.woocommerce-checkout textarea {
    border-radius: 8px !important;
    border: 1px solid #dcdfe6 !important;
    padding: 12px 14px !important;
    font-size: 14px !important;
    background-color: #fbfcfd !important;
    color: #303133 !important;
    transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
    height: 120px !important;
    box-sizing: border-box !important;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.02) !important;
    outline: none !important;
    width: 100% !important;
}

.select2-container--default .select2-selection--single {
    border-radius: 8px !important;
    border: 1px solid #dcdfe6 !important;
    font-size: 14px !important;
    background-color: #fbfcfd !important;
    color: #303133 !important;
    transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
    height: 46px !important;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.02) !important;
    outline: none !important;
}

/* Select2 Custom Styling for Country/State selector */
.select2-container--default .select2-selection--single {
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 42px !important;
}

/* Input Focus States */
.woocommerce-checkout input[type="text"]:focus,
.woocommerce-checkout input[type="email"]:focus,
.woocommerce-checkout input[type="tel"]:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout textarea:focus,
.select2-container--default.select2-container--focus .select2-selection--single {
    border-color: #00b159 !important; /* Brand theme green */
    background-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(0, 177, 89, 0.12) !important;
}

/* 3. WooCommerce Tables & Reviews */
.woocommerce-checkout-review-order-table,
.woocommerce-table--order-details {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border: 1px solid #ebeef5 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    width: 100% !important;
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td,
.woocommerce-table--order-details th,
.woocommerce-table--order-details td {
    padding: 14px 18px !important;
    border-bottom: 1px solid #ebeef5 !important;
    border-top: none !important;
    font-size: 14px !important;
}

.woocommerce-checkout-review-order-table tr:last-child th,
.woocommerce-checkout-review-order-table tr:last-child td,
.woocommerce-table--order-details tr:last-child td {
    border-bottom: none !important;
}

.woocommerce-checkout-review-order-table thead th,
.woocommerce-table--order-details thead th {
    background-color: #f5f7fa !important;
    border-bottom: 1px solid #ebeef5 !important;
    font-weight: 600 !important;
    color: #606266 !important;
}

/* 4. Payment Gateway Selectors (Checkout Transparente) */
.woocommerce-checkout #payment ul.payment_methods {
    padding: 0 !important;
    border: none !important;
}

.woocommerce-checkout #payment ul.payment_methods li {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    padding: 16px !important;
    margin-bottom: 12px !important;
    list-style: none !important;
    transition: all 0.2s ease !important;
}

.woocommerce-checkout #payment ul.payment_methods li:hover {
    border-color: #cbd5e1 !important;
}

/* Highlight Selected Gateway Box */
.woocommerce-checkout #payment ul.payment_methods li input[type="radio"]:checked + label {
    font-weight: bold !important;
    color: #0f172a !important;
}

.woocommerce-checkout #payment ul.payment_methods li input[type="radio"] {
    margin-right: 10px !important;
    transform: scale(1.1) !important;
    accent-color: #00b159 !important;
}

.woocommerce-checkout #payment div.payment_box {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    padding: 16px !important;
    margin-top: 12px !important;
    font-size: 13px !important;
    color: #475569 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.02) !important;
}

.woocommerce-checkout #payment div.payment_box::before {
    display: none !important; /* Hide ugly native triangle pointer */
}

/* 5. Place Order Action Buttons */
.woocommerce-checkout #payment #place_order,
.wcf-custom-action-button,
.wcf-ic-button--ty {
    background: #00b159 !important; /* Brand CTA Green */
    background: linear-gradient(135deg, #00c362, #00b159) !important;
    color: #ffffff !important;
    border: none !important;
    padding: 15px 30px !important;
    font-size: 16px !important;
    font-weight: bold !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: all 0.25s ease !important;
    box-shadow: 0 4px 14px rgba(0, 177, 89, 0.25) !important;
    width: 100% !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.woocommerce-checkout #payment #place_order:hover,
.wcf-custom-action-button:hover,
.wcf-ic-button--ty:hover {
    background: #009c4d !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 177, 89, 0.35) !important;
}

.woocommerce-checkout #payment #place_order:active,
.wcf-custom-action-button:active,
.wcf-ic-button--ty:active {
    transform: translateY(0) !important;
}

/* Coupon Area Box Modernization */
.woocommerce-form-coupon-toggle .woocommerce-info {
    border-top: 3px solid #00b159 !important;
    background-color: #f4fbf7 !important;
    border-radius: 8px !important;
    padding: 15px 20px !important;
    font-size: 14px !important;
    color: #2b704a !important;
}

/* 6. Checkout Page Alignment & Layout Tweaks */
.wcf-embed-checkout-form-two-column #customer_details {
    width: 58% !important;
    float: left !important;
}

.wcf-embed-checkout-form-two-column #order_review_heading,
.wcf-embed-checkout-form-two-column #order_review {
    width: 38% !important;
    float: right !important;
    clear: right !important;
}

@media (max-width: 768px) {
    .wcf-embed-checkout-form-two-column #customer_details,
    .wcf-embed-checkout-form-two-column #order_review_heading,
    .wcf-embed-checkout-form-two-column #order_review {
        width: 100% !important;
        float: none !important;
    }
}

/* 7. Input Placeholder Styling */
.woocommerce-checkout ::-webkit-input-placeholder {
    color: #a1a8b3 !important;
    opacity: 0.65 !important;
    font-weight: 300 !important;
}
.woocommerce-checkout ::-moz-placeholder {
    color: #a1a8b3 !important;
    opacity: 0.65 !important;
    font-weight: 300 !important;
}
.woocommerce-checkout :-ms-input-placeholder {
    color: #a1a8b3 !important;
    opacity: 0.65 !important;
    font-weight: 300 !important;
}
.woocommerce-checkout ::placeholder {
    color: #a1a8b3 !important;
    opacity: 0.65 !important;
    font-weight: 300 !important;
}

/* Hide placeholder when input has focus to prevent interference while typing */
.woocommerce-checkout input:focus::-webkit-input-placeholder {
    color: transparent !important;
}
.woocommerce-checkout input:focus::-moz-placeholder {
    color: transparent !important;
}
.woocommerce-checkout input:focus:-ms-input-placeholder {
    color: transparent !important;
}
.woocommerce-checkout input:focus::placeholder {
    color: transparent !important;
}

/* Ensure labels are prominent, readable, and positioned above input to prevent overlaps and truncation */
.wcf-embed-checkout-form .form-row label,
.woocommerce-checkout .form-row label,
.woocommerce-checkout label {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    color: #475569 !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    margin-bottom: 6px !important;
    display: inline-block !important;
    pointer-events: auto !important;
    opacity: 1 !important;
}

/* Fix input wrapper positioning to keep labels and fields cleanly separated */
.wcf-embed-checkout-form .form-row .woocommerce-input-wrapper,
.woocommerce-checkout .form-row .woocommerce-input-wrapper {
    position: relative !important;
    display: block !important;
}