/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

/* 1. Specificity Fix & Wrapper Positioning */
html body .woocommerce-notices-wrapper {
    position: fixed !important;
    top: 20px !important; 
    right: 20px !important;
    left: auto !important;
    z-index: 999999 !important;
    width: 100% !important;
    max-width: 500px !important; /* Forced Max Width */
    pointer-events: none !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

/* 2. Base Notice Styling & Auto-Hide Animation */
html body .woocommerce-notices-wrapper .woocommerce-message,
html body .woocommerce-notices-wrapper .woocommerce-error,
html body .woocommerce-notices-wrapper .woocommerce-info {
    pointer-events: auto !important;
    background-color: #1f1b30 !important; 
    color: #ffffff !important;
    border-radius: 8px !important; 
    border-top: 4px solid var(--secondary-dark) !important; 
    border-left: 4px solid var(--secondary-dark) !important; 
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4) !important;
    padding: 16px 20px !important;
    margin: 0 !important;
    font-family: inherit !important;
    font-size: 0.95rem !important;
    font-weight: 500 !important;
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    
    /* Slide in instantly, fade out after 5s */
    animation: 
        fn-slide-in 0.3s ease-out forwards !important,
        fn-fade-out 0.5s ease-in 5s forwards !important;
}

/* Fallback constraint for the inner card itself */
html body .woocommerce-notices-wrapper > * {
    max-width: 500px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 3. Colors & Icons */
html body .woocommerce-notices-wrapper .woocommerce-message { border-top-color: #00a651 !important; }
html body .woocommerce-notices-wrapper .woocommerce-message::before { content: "✓" !important; color: #00a651 !important; }

html body .woocommerce-notices-wrapper .woocommerce-error { border-top-color: #ea3f3f !important; }
html body .woocommerce-notices-wrapper .woocommerce-error::before { content: "!" !important; color: #ea3f3f !important; }

html body .woocommerce-notices-wrapper .woocommerce-info { border-top-color: #8e7cc3 !important; }
html body .woocommerce-notices-wrapper .woocommerce-info::before { content: "i" !important; color: #8e7cc3 !important; }

html body .woocommerce-notices-wrapper .woocommerce-message::before,
html body .woocommerce-notices-wrapper .woocommerce-error::before,
html body .woocommerce-notices-wrapper .woocommerce-info::before {
    font-family: inherit !important;
    font-size: 1.25rem !important;
    font-weight: 900 !important;
    flex-shrink: 0 !important;
}

/* 4. Modern Button Styling ("View Cart") */
html body .woocommerce-notices-wrapper .button {
    background-color: #ea3f3f !important;
    color: #ffffff !important;
    border-radius: 4px !important;
    padding: 8px 14px !important;
    margin-left: auto !important; 
    font-size: 0.8rem !important;
    font-style: italic !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    border: none !important;
    order: 99 !important; 
    white-space: nowrap !important;
}

html body .woocommerce-notices-wrapper .button:hover {
    background-color: #d12e2e !important;
}

/* 5. Mobile: Flush Full Width */
@media (max-width: 768px) {
    html body .woocommerce-notices-wrapper {
        top: 0 !important;
        right: 0 !important;
        left: 0 !important;
        max-width: 100% !important;
    }
    
    html body .woocommerce-notices-wrapper .woocommerce-message,
    html body .woocommerce-notices-wrapper .woocommerce-error,
    html body .woocommerce-notices-wrapper .woocommerce-info,
    html body .woocommerce-notices-wrapper > * {
        max-width: 100% !important;
        border-radius: 0 !important; 
        border-top: none !important; 
        border-left: 4px solid #00a651 !important; 
    }
    
    html body .woocommerce-notices-wrapper .woocommerce-error { border-left-color: #ea3f3f !important; }
    html body .woocommerce-notices-wrapper .woocommerce-info { border-left-color: #8e7cc3 !important; }
}

/* 6. Animations */
@keyframes fn-slide-in {
    0% { transform: translateY(-20px); opacity: 0; }
    100% { transform: translateY(0); opacity: 1; }
}

@keyframes fn-fade-out {
    0% { opacity: 1; visibility: visible; }
    100% { 
        opacity: 0; 
        visibility: hidden; 
        transform: translateY(-10px); 
        margin: 0 !important; 
        padding: 0 !important; 
        height: 0 !important; 
        border: none !important;
    }
}

/* Add asterisk to required text inputs */
.wc-block-components-text-input input[required] + label::after {
    content: " *";
    color: #ff0000; /* Adjust to match your theme */
    font-weight: bold;
}

/* Add asterisk to Country and Province labels */
.wc-block-components-address-form__country label::after,
.wc-block-components-address-form__state label::after {
    content: " *";
    color: #ff0000;
    font-weight: bold;
}

/* 1. Variations Table Layout */
.variations_form table.variations {
    width: 100% !important;
    border-collapse: collapse !important;
    margin-bottom: 20px !important;
}

.variations_form table.variations th.label {
    text-align: left !important;
    padding: 10px 0 !important;
    font-weight: 800 !important;
    color: #151122 !important;
    text-transform: uppercase !important;
    font-size: 0.95rem !important;
    width: 30% !important;
}

.variations_form table.variations td.value {
    padding: 10px 0 !important;
    position: relative !important;
}

/* 2. Modern Select Dropdown */
.variations_form select {
    width: 100% !important;
    padding: 14px 40px 14px 18px !important;
    border: 2px solid #e2e2e2 !important;
    border-radius: 8px !important;
    background-color: #ffffff !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    color: #151122 !important;
    cursor: pointer !important;
    appearance: none !important; /* Removes default browser arrow */
    background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23151122%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 15px top 50% !important;
    background-size: 12px auto !important;
    transition: all 0.2s ease !important;
}

.variations_form select:focus {
    outline: none !important;
    border-color: #ea3f3f !important;
    box-shadow: 0 0 0 3px rgba(234, 63, 63, 0.1) !important;
}

/* 3. Clear Variations Link */
.variations_form .reset_variations {
    display: inline-block !important;
    margin-top: 8px !important;
    color: #ea3f3f !important;
    font-size: 0.85rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
}

.variations_form .reset_variations:hover {
    text-decoration: underline !important;
}

/* 4. Action Row (Quantity + Add to Cart) */
.woocommerce-variation-add-to-cart {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
    align-items: stretch !important;
    margin-top: 20px !important;
}

/* 5. Custom Quantity Picker */
.woocommerce-variation-add-to-cart .quantity {
    display: flex !important;
    align-items: stretch !important;
    border: 2px solid #e2e2e2 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    background: #ffffff !important;
    min-width: 140px !important;
}

.woocommerce-variation-add-to-cart .quantity .input-text.qty {
    flex: 1 !important;
    width: 100% !important;
    padding: 0 10px !important;
    border: none !important;
    text-align: center !important;
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    color: #151122 !important;
    appearance: textfield !important;
}

.woocommerce-variation-add-to-cart .quantity .input-text.qty::-webkit-outer-spin-button,
.woocommerce-variation-add-to-cart .quantity .input-text.qty::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

/* Plus/Minus Buttons */
.woocommerce-variation-add-to-cart .quantity .action {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 45px !important;
    background: #f8f8f8 !important;
    cursor: pointer !important;
    color: #151122 !important;
    transition: background 0.2s ease !important;
}

.woocommerce-variation-add-to-cart .quantity .action:hover {
    background: #e2e2e2 !important;
}

/* 6. Dynamic Add to Cart Button */
.woocommerce-variation-add-to-cart .single_add_to_cart_button {
    flex: 1 !important;
    min-width: 220px !important;
    background-color: #151122 !important;
    color: #ffffff !important;
    border: none !important;
    padding: 16px 24px !important;
    font-size: 1.1rem !important;
    font-weight: 800 !important;
    font-style: italic !important;
    text-transform: uppercase !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    letter-spacing: 0.5px !important;
}

.woocommerce-variation-add-to-cart .single_add_to_cart_button:hover {
    background-color: #ea3f3f !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(234, 63, 63, 0.3) !important;
}

a.fsn-hover-light:where(:not([class*= btn--])):hover{
	color: #fff !important;
}

.wp-block-woocommerce-cart.alignwide{
	margin: auto !important;
	margin-left: auto !important;
	margin-right: auto !important;
	max-width: 1440px !important;
}

div[data-block-name="woocommerce/cart"].wc-block-cart::before
Specificity: (0,2,2)
 {
    content: "Your booking summary" !important;
    display: block !important;
    font-size: clamp(2.5rem, 6vw, 4rem) !important;
    font-weight: 900 !important;
    font-style: italic !important;
    text-transform: uppercase !important;
    color: #0f172a !important;
    line-height: 1 !important;
    margin-bottom: 12px !important;
    padding-left: 10px;
    letter-spacing: -0.02em;
}