/*
Theme Name: Riwaq Commerce
Theme URI: https://echo.om/
Author: Echo Platform Team
Author URI: https://echo.om/
Description: Ultra-modern Corporate Modern RTL E-Commerce Theme for WooCommerce with IBM Plex Sans Arabic.
Version: 1.0.0
Text Domain: riwaq-commerce
*/

* { box-sizing: border-box; }
body { margin: 0; padding: 0; background-color: #faf8ff; color: #131b2e; font-family: 'IBM Plex Sans Arabic', 'IBM Plex Sans', sans-serif; -webkit-font-smoothing: antialiased; }

/* WooCommerce Form & Checkout Luxury Styling */
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper,
.woocommerce-additional-fields__field-wrapper {
    display: grid !important;
    grid-template-columns: repeat(12, 1fr) !important;
    gap: 1rem !important;
}

.woocommerce-billing-fields__field-wrapper .form-row,
.woocommerce-shipping-fields__field-wrapper .form-row,
.woocommerce-additional-fields__field-wrapper .form-row {
    grid-column: span 12 / span 12 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}

@media (min-width: 640px) {
    .woocommerce-billing-fields__field-wrapper .form-row-first,
    .woocommerce-billing-fields__field-wrapper .form-row-last,
    .woocommerce-shipping-fields__field-wrapper .form-row-first,
    .woocommerce-shipping-fields__field-wrapper .form-row-last {
        grid-column: span 6 / span 6 !important;
    }
}

.woocommerce form .form-row label {
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    color: #131b2e !important;
    margin-bottom: 0.35rem !important;
    display: block !important;
}

.woocommerce form .form-row label .required {
    color: #ba1a1a !important;
    text-decoration: none !important;
}

.woocommerce form .form-row .input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea {
    width: 100% !important;
    border-radius: 0.75rem !important;
    border: 1px solid #bdc9c6 !important;
    background-color: #f2f3ff !important;
    padding: 0.625rem 0.875rem !important;
    font-size: 0.875rem !important;
    color: #131b2e !important;
    font-family: inherit !important;
    transition: all 0.2s ease-in-out !important;
    outline: none !important;
    box-shadow: none !important;
}

.woocommerce form .form-row .input-text:focus,
.woocommerce form .form-row select:focus,
.woocommerce form .form-row textarea:focus {
    border-color: #005c55 !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(0, 92, 85, 0.15) !important;
}

/* Select2 dropdown overrides */
.select2-container--default .select2-selection--single {
    height: 42px !important;
    border-radius: 0.75rem !important;
    border: 1px solid #bdc9c6 !important;
    background-color: #f2f3ff !important;
    display: flex !important;
    align-items: center !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 42px !important;
    padding-right: 0.875rem !important;
    padding-left: 0.875rem !important;
    color: #131b2e !important;
    font-size: 0.875rem !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 42px !important;
    left: 8px !important;
    right: auto !important;
}

/* WooCommerce Notices */
.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
    border-radius: 1rem !important;
    padding: 0.875rem 1.25rem !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    margin-bottom: 1.5rem !important;
    border: 1px solid transparent !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.75rem !important;
    list-style: none !important;
}

.woocommerce-error {
    background-color: #ffdad6 !important;
    color: #93000a !important;
    border-color: #ffb4ab !important;
}

.woocommerce-message {
    background-color: #e2f7f3 !important;
    color: #005c55 !important;
    border-color: #a3faef !important;
}

.woocommerce-info {
    background-color: #f2f3ff !important;
    color: #131b2e !important;
    border-color: #dae2fd !important;
}

.woocommerce-info a,
.woocommerce-message a,
.woocommerce-error a {
    font-weight: 700 !important;
    text-decoration: underline !important;
    color: inherit !important;
}

/* BlockUI Loading Overlay */
.blockUI.blockOverlay {
    background: rgba(250, 248, 255, 0.75) !important;
    backdrop-filter: blur(2px) !important;
    border-radius: 1rem !important;
}

