/*
Theme Name: Party-Starts Theme
Theme URI: https://party-starts.com/
Author: Antigravity Team
Author URI: https://party-starts.com/
Description: A lightning-fast, premium standalone theme for Party-Starts e-commerce and balloon decoration systems, built natively with Tailwind CSS and designed with the Celebration Blueprint design system.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: party-starts
*/

/* ==========================================================================
   WOOCOMMERCE FORM FIELDS & INPUTS OVERRIDES
   ========================================================================== */

/* Distribute form-rows in a clean CSS grid */
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper,
.woocommerce-additional-fields__field-wrapper {
    display: grid !important;
    grid-template-cols: 1fr !important;
    gap: 16px !important;
}

@media (min-width: 640px) {
    .woocommerce-billing-fields__field-wrapper,
    .woocommerce-shipping-fields__field-wrapper {
        grid-template-cols: repeat(12, minmax(0, 1fr)) !important;
    }
    #billing_first_name_field, #shipping_first_name_field { grid-column: span 6 / span 6 !important; }
    #billing_last_name_field, #shipping_last_name_field { grid-column: span 6 / span 6 !important; }
    #billing_email_field { grid-column: span 6 / span 6 !important; }
    #billing_phone_field { grid-column: span 6 / span 6 !important; }
    #billing_company_field, #shipping_company_field { grid-column: span 12 / span 12 !important; }
    #billing_country_field, #shipping_country_field { grid-column: span 12 / span 12 !important; }
    #billing_address_1_field, #shipping_address_1_field { grid-column: span 12 / span 12 !important; }
    #billing_address_2_field, #shipping_address_2_field { grid-column: span 12 / span 12 !important; }
    #billing_city_field, #shipping_city_field { grid-column: span 4 / span 4 !important; }
    #billing_state_field, #shipping_state_field { grid-column: span 4 / span 4 !important; }
    #billing_postcode_field, #shipping_postcode_field { grid-column: span 4 / span 4 !important; }
    #billing_work_field, #shipping_work_field { grid-column: span 12 / span 12 !important; }
}

/* Override default float classes of WooCommerce fields */
.woocommerce-checkout .form-row {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
}

/* Style form labels */
.woocommerce-checkout label,
.woocommerce-billing-fields label,
.woocommerce-shipping-fields label {
    display: block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #5C5344 !important; /* on-surface-variant */
    margin-bottom: 6px !important;
}

/* Style all checkout inputs and select menus */
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="password"],
.woocommerce-checkout select,
.woocommerce-checkout textarea,
input.input-text,
select.country_select,
select.state_select {
    width: 100% !important;
    background-color: #FFFDF8 !important; /* surface */
    border: 1px solid #E0D2BC !important; /* outline-variant */
    border-radius: 12px !important;
    padding: 10px 16px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #2B2724 !important; /* on-surface */
    transition: all 0.2s ease-in-out !important;
    box-sizing: border-box !important;
}

.woocommerce-checkout input[type="text"]:focus,
.woocommerce-checkout input[type="email"]:focus,
.woocommerce-checkout input[type="tel"]:focus,
.woocommerce-checkout input[type="password"]:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout textarea:focus,
input.input-text:focus,
select.country_select:focus,
select.state_select:focus {
    border-color: #1C8A8F !important; /* secondary */
    box-shadow: 0 0 0 2px rgba(28, 138, 143, 0.2) !important;
    outline: none !important;
}

/* Style selects with custom arrow */
.woocommerce-checkout select {
    appearance: none !important;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%238A7A63'%3e%3cpath d='M7 10l5 5 5-5z'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 18px !important;
    padding-right: 36px !important;
}

/* Style payment methods listing */
ul.wc_payment_methods {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

ul.wc_payment_methods li.payment_method {
    border: 1px solid #E0D2BC !important;
    border-radius: 12px !important;
    padding: 16px !important;
    background-color: #FFFDF8 !important;
    transition: border-color 0.2s ease !important;
}

ul.wc_payment_methods li.payment_method input[type="radio"] {
    color: #1C8A8F !important;
    border-color: #E0D2BC !important;
    margin-right: 8px !important;
    cursor: pointer !important;
}

ul.wc_payment_methods li.payment_method label {
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    color: #2B2724 !important;
    display: inline-block !important;
    margin-bottom: 0 !important;
    cursor: pointer !important;
}

ul.wc_payment_methods li.payment_method div.payment_box {
    margin-top: 12px !important;
    font-size: 12px !important;
    color: #5C5344 !important;
    line-height: 1.5 !important;
    border-top: 1px dashed rgba(224, 210, 188, 0.4) !important;
    padding-top: 8px !important;
}

/* Square Gateway Credit Card Container override */
.wc-square-credit-card-container, 
#wc-square-credit-card-form {
    background: #FFFDF8 !important;
    border: 1px solid #E0D2BC !important;
    border-radius: 12px !important;
    padding: 14px !important;
    margin-top: 10px !important;
}

.wc-square-credit-card-container .sq-card-wrapper {
    margin: 0 !important;
}

/* Shipping methods table options */
ul#shipping_method {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

ul#shipping_method li {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #2B2724 !important;
}

ul#shipping_method li input[type="radio"] {
    color: #1C8A8F !important;
    border-color: #E0D2BC !important;
    cursor: pointer !important;
}

ul#shipping_method li label {
    display: inline !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    color: #2B2724 !important;
    margin-bottom: 0 !important;
    cursor: pointer !important;
}

/* Required field asterisks */
abbr.required {
    color: #F04759 !important; /* tertiary */
    text-decoration: none !important;
    margin-left: 2px !important;
}

/* WooCommerce System Notice Banners */
ul.woocommerce-error,
.woocommerce-message,
.woocommerce-info {
    list-style: none !important;
    background-color: #FBD3D7 !important; /* tertiary-container */
    color: #8A1F2A !important; /* on-tertiary-container */
    border: 2px solid #F04759 !important; /* tertiary */
    border-radius: 12px !important;
    padding: 16px 20px !important;
    margin-bottom: 24px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    position: relative !important;
}

.woocommerce-message {
    background-color: #D6F3F3 !important; /* secondary-container */
    color: #0F5457 !important; /* on-secondary-container */
    border-color: #1C8A8F !important; /* secondary */
}

/* Style native WooCommerce place order button to match design system */
.woocommerce-checkout #place_order,
#place_order {
    width: 100% !important;
    background-color: #f2a93c !important; /* primary-container */
    color: #4A2E06 !important; /* on-primary-container */
    font-weight: 700 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding: 16px !important;
    border-radius: 12px !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 4px 12px rgba(242, 169, 60, 0.15) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-top: 16px !important;
}

.woocommerce-checkout #place_order:hover,
#place_order:hover {
    filter: brightness(1.05) !important;
}

.woocommerce-checkout #place_order:active,
#place_order:active {
    transform: scale(0.98) !important;
}

/* Layout is handled dynamically inside form-checkout.php script block to prevent style clashes */

/* ==========================================================================
   MY ACCOUNT PAGE OVERRIDES
   Strips WooCommerce's default nav/list/table styling so our custom
   flex/grid markup fully controls layout instead of fighting inherited rules.
   ========================================================================== */

.woocommerce-MyAccount-navigation ul,
.woocommerce-MyAccount-navigation li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    float: none !important;
    width: auto !important;
}

.woocommerce-MyAccount-navigation a {
    text-decoration: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

.woocommerce-account .addresses .title,
.woocommerce-account table.shop_table,
.woocommerce-account table.shop_table th,
.woocommerce-account table.shop_table td {
    border: none !important;
    background: none !important;
}

.woocommerce-MyAccount-content .woocommerce-message,
.woocommerce-MyAccount-content .woocommerce-error,
.woocommerce-MyAccount-content .woocommerce-info {
    background-color: #D6F3F3 !important;
    color: #0F5457 !important;
    border: 2px solid #1C8A8F !important;
    border-radius: 12px !important;
    padding: 16px 20px !important;
    list-style: none !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}