/* =============================================================================
   Flatsome Child — Main Stylesheet
   Mobile-first. No CSS variables. Static values only.
   ============================================================================= */

/* ── Fonts ───────────────────────────────────────────────────────────────────── */

@font-face {
   font-family: 'Gratelos Display';
   src: url('../fonts/SVN-Gratelos Display.otf') format('opentype');
   font-weight: 400;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'Gratelos Display 2';
   src: url('../fonts/SVN-Gratelos Display 2.otf') format('opentype');
   font-weight: 400;
   font-style: normal;
   font-display: swap;
}

.font-gratelos-display h2 {
   font-family: 'Gratelos Display' !important;
}

/* ── Global ──────────────────────────────────────────────────────────────── */
.product .box {
   padding: 24px;
   background-color: #fff;
   border-radius: 30px;
   text-align: center;
}

.product .box .product-title {
   margin-bottom: 10px;
   padding-top: 0;
   margin-top: 19px;
}

.product .box .product-title a {
   font-size: 14px;
   color: #000000;
}

.product .box .price,
.product .box .price .amount {
   font-size: 13px;
   font-weight: 600;
   color: #00561B;
}

.product .box .box-text-products {
   padding-bottom: 0;
}

#wrapper .row-bg-white {
   background-color: #FFFFFF;
   border-radius: 15px;
   overflow: hidden;
}

#wrapper .row-bg-white-col-content.col {
   padding-left: 46px;
   padding-right: 46px;
}

#wrapper .row-product-category-1 {
   background-color: #fff;
   border-radius: 15px;
   width: calc(100% - 20px);
   padding-top: 30px;
}

#wrapper .row-product-category-1 .img-inner {
   transform: translateY(100px);
}

#wrapper .icon-box .icon {
   transition: all 200ms linear;
}

#wrapper .icon-box:hover .icon {
   transform: scale(1.1);
}

.popup-welcome-seclect-logo {
   max-width: 161px;
   margin-left: auto;
   margin-right: auto;
   margin-bottom: 0 !important;
}

/* Payment Gateway Icon Sizing */
.woocommerce-checkout .payment_methods img,
.woocommerce-order-pay .payment_methods img,
#order_review .payment_methods img,
.wc_payment_method img {
   max-height: 28px !important;
   width: auto !important;
   display: inline-block !important;
   vertical-align: middle !important;
   margin-left: 8px !important;
}

/* ─── Order Pay Page Styling ────────────────────────────────────────────── */

body.woocommerce-order-pay #content {
   padding: 40px 15px 60px !important;
   background-color: #f7faf7 !important;
}

body.woocommerce-order-pay form#order_review,
.woocommerce-order-pay form#order_review {
   max-width: 800px !important;
   margin: 0 auto !important;
   background: #ffffff !important;
   border: 1px solid #e7ece7 !important;
   border-radius: 20px !important;
   box-shadow: 0 10px 30px rgba(20, 40, 20, 0.05) !important;
   padding: 32px !important;
}

body.woocommerce-order-pay form#order_review table.shop_table,
.woocommerce-order-pay form#order_review table.shop_table {
   border: 1px solid #e7ece7 !important;
   border-radius: 12px !important;
   overflow: hidden !important;
   margin-bottom: 24px !important;
   width: 100% !important;
}

body.woocommerce-order-pay form#order_review table.shop_table th,
.woocommerce-order-pay form#order_review table.shop_table th {
   background-color: #f8faf8 !important;
   color: #1f3d23 !important;
   font-weight: 700 !important;
   font-size: 14px !important;
   text-transform: uppercase !important;
   letter-spacing: 0.5px !important;
   padding: 14px 18px !important;
   border-bottom: 1px solid #e7ece7 !important;
}

body.woocommerce-order-pay form#order_review table.shop_table td,
.woocommerce-order-pay form#order_review table.shop_table td {
   padding: 14px 18px !important;
   border-bottom: 1px solid #f0f4f0 !important;
   font-size: 14px !important;
   color: #333333 !important;
}

body.woocommerce-order-pay form#order_review table.shop_table tr:last-child td,
.woocommerce-order-pay form#order_review table.shop_table tr:last-child td {
   border-bottom: none !important;
}

body.woocommerce-order-pay form#order_review #payment,
.woocommerce-order-pay form#order_review #payment {
   background: #fcfdfe !important;
   border: 1px solid #e7ece7 !important;
   border-radius: 14px !important;
   padding: 24px !important;
   margin-top: 24px !important;
}

body.woocommerce-order-pay form#order_review #payment ul.payment_methods,
.woocommerce-order-pay form#order_review #payment ul.payment_methods {
   list-style: none !important;
   padding: 0 !important;
   margin: 0 0 20px 0 !important;
}

body.woocommerce-order-pay form#order_review #payment ul.payment_methods li.wc_payment_method,
.woocommerce-order-pay form#order_review #payment ul.payment_methods li.wc_payment_method {
   padding: 14px 18px !important;
   margin-bottom: 12px !important;
   border: 1px solid #e7ece7 !important;
   border-radius: 10px !important;
   background: #ffffff !important;
   transition: all 0.2s ease !important;
}

body.woocommerce-order-pay form#order_review #payment ul.payment_methods li.wc_payment_method:hover,
.woocommerce-order-pay form#order_review #payment ul.payment_methods li.wc_payment_method:hover {
   border-color: #1f3d23 !important;
}

body.woocommerce-order-pay form#order_review #payment ul.payment_methods li.wc_payment_method input[type="radio"],
.woocommerce-order-pay form#order_review #payment ul.payment_methods li.wc_payment_method input[type="radio"] {
   accent-color: #1f3d23 !important;
   margin-right: 8px !important;
}

body.woocommerce-order-pay form#order_review #payment ul.payment_methods li.wc_payment_method label,
.woocommerce-order-pay form#order_review #payment ul.payment_methods li.wc_payment_method label {
   font-weight: 600 !important;
   color: #1f3d23 !important;
   cursor: pointer !important;
   display: inline-flex !important;
   align-items: center !important;
}

body.woocommerce-order-pay form#order_review #payment div.payment_box,
.woocommerce-order-pay form#order_review #payment div.payment_box {
   background: #f4f8f4 !important;
   border-radius: 8px !important;
   padding: 12px 16px !important;
   font-size: 13px !important;
   color: #4a5d4d !important;
   margin-top: 10px !important;
}

body.woocommerce-order-pay form#order_review #payment div.form-row,
.woocommerce-order-pay form#order_review #payment div.form-row {
   margin: 0 !important;
   padding: 0 !important;
   text-align: center !important;
}

body.woocommerce-order-pay form#order_review #payment #place_order,
.woocommerce-order-pay form#order_review #payment #place_order {
   display: inline-block !important;
   width: 100% !important;
   max-width: 340px !important;
   height: 48px !important;
   line-height: 48px !important;
   padding: 0 28px !important;
   background-color: #1f3d23 !important;
   color: #ffffff !important;
   border: none !important;
   border-radius: 999px !important;
   font-size: 15px !important;
   font-weight: 700 !important;
   letter-spacing: 0.5px !important;
   text-transform: uppercase !important;
   cursor: pointer !important;
   transition: all 0.2s ease-in-out !important;
   box-shadow: 0 4px 14px rgba(31, 61, 35, 0.25) !important;
   margin: 15px auto 0 !important;
}

body.woocommerce-order-pay form#order_review #payment #place_order:hover,
.woocommerce-order-pay form#order_review #payment #place_order:hover {
   background-color: #152b18 !important;
   transform: translateY(-1px) !important;
   box-shadow: 0 6px 18px rgba(31, 61, 35, 0.35) !important;
}

/* ─── Custom Order Pay Form Styling ────────────────────────────────────────── */

.woocommerce-pay-custom-wrapper {
   max-width: 800px;
   margin: 40px auto 60px;
   padding: 0 15px;
}

.woocommerce-pay-custom-wrapper #order_review {
   background: #ffffff !important;
   border: 1px solid #e7ece7 !important;
   border-radius: 24px !important;
   box-shadow: 0 10px 35px rgba(20, 40, 20, 0.06) !important;
   padding: 36px !important;
}

.pay-order-header {
   text-align: center;
   margin-bottom: 28px;
   padding-bottom: 20px;
   border-bottom: 1px solid #edf1ed;
}

.pay-order-title {
   font-size: 24px !important;
   font-weight: 700 !important;
   color: #1f3d23 !important;
   margin-bottom: 6px !important;
}

.pay-order-subtitle {
   font-size: 14px;
   color: #6c7e6f;
   margin: 0;
}

.pay-section-title {
   font-size: 15px !important;
   font-weight: 700 !important;
   color: #1f3d23 !important;
   text-transform: uppercase;
   letter-spacing: 0.5px;
   margin-bottom: 16px !important;
}

/* Items List */
.pay-items-list {
   border: 1px solid #e7ece7;
   border-radius: 16px;
   overflow: hidden;
   margin-bottom: 28px;
}

.pay-item-row {
   display: flex;
   align-items: center;
   gap: 16px;
   padding: 16px 20px;
   border-bottom: 1px solid #f0f4f0;
   background: #ffffff;
}

.pay-item-row:last-child {
   border-bottom: none;
}

.pay-item-image {
   flex-shrink: 0;
   width: 70px;
   height: 70px;
   border-radius: 12px;
   overflow: hidden;
   border: 1px solid #e8ede8;
   background: #f8faf8;
}

.pay-item-image img {
   width: 100% !important;
   height: 100% !important;
   object-fit: cover !important;
   display: block !important;
}

.pay-item-details {
   flex-grow: 1;
}

.pay-item-name {
   font-size: 15px !important;
   font-weight: 700 !important;
   color: #1f3d23 !important;
   margin: 0 0 6px !important;
}

.pay-item-meta {
   display: flex;
   flex-wrap: wrap;
   gap: 12px;
   margin-bottom: 4px;
}

.pay-item-meta .meta-tag {
   font-size: 13px;
   color: #666666;
   background: none;
   padding: 0;
   border-radius: 0;
}


.pay-item-qty {
   font-size: 13px;
   color: #7a8c7c;
}

.pay-item-subtotal {
   font-size: 16px;
   font-weight: 700;
   color: #1f3d23;
   text-align: right;
   flex-shrink: 0;
}

/* Totals Section */
.pay-order-totals {
   background: #f9fbf9;
   border: 1px solid #e7ece7;
   border-radius: 16px;
   padding: 16px 20px;
   margin-bottom: 28px;
}

.pay-total-row {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding: 8px 0;
   font-size: 14px;
   color: #4a5c4d;
}

.pay-total-row.is-grand-total {
   border-top: 1px solid #e2e8e2;
   margin-top: 8px;
   padding-top: 14px;
   font-size: 17px;
   font-weight: 700;
   color: #1f3d23;
}

.pay-total-row.is-grand-total .total-value {
   color: #00561B;
   font-size: 20px;
}

/* =============================================================================
   Shopify / Stripe Style Modern Minimalist Checkout
   ============================================================================= */

/* Container & Layout */
body.woocommerce-checkout {
   background-color: #ffffff !important;
}

body.woocommerce-checkout #content {
   padding: 30px 0 60px !important;
}

.shopify-style-checkout.checkout-main-row {
   max-width: 1140px !important;
   margin: 0 auto !important;
}

/* Coupon Notice Bar */
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info {
   background-color: #f0f7f1 !important;
   border: 1px solid #d1e5d4 !important;
   border-radius: 8px !important;
   padding: 12px 18px !important;
   font-size: 14px !important;
   color: #1f3d23 !important;
   font-weight: 500 !important;
   margin-bottom: 24px !important;
}

.woocommerce-checkout .woocommerce-info a.showcoupon,
.woocommerce-checkout .woocommerce-info a.showlogin {
   color: #1f3d23 !important;
   font-weight: 700 !important;
   text-decoration: underline !important;
}

/* Left Column: Form Details */
.checkout-left-col {
   padding-right: 35px !important;
}

.checkout-customer-box {
   background: transparent !important;
   border: none !important;
   padding: 0 !important;
   box-shadow: none !important;
}

.checkout-customer-box h3,
.checkout-customer-box #ship-to-different-address-checkbox+span,
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3 {
   font-size: 18px !important;
   font-weight: 700 !important;
   color: #111827 !important;
   margin-bottom: 16px !important;
   padding: 0 !important;
   border: none !important;
   letter-spacing: -0.2px !important;
}

/* Form Controls (Inputs, Selects, Textareas) */
.checkout-left-col .form-row {
   margin-bottom: 4px;
}

/* Make Tỉnh/Thành phố and Quận/Huyện sit side-by-side on 1 row */
.checkout-left-col #billing_state_field,
.checkout-left-col #shipping_state_field,
.checkout-left-col p.form-row-first {
   width: 48.5% !important;
   float: left !important;
   clear: left !important;
   margin-right: 0 !important;
}

.checkout-left-col #billing_city_field,
.checkout-left-col #shipping_city_field,
.checkout-left-col p.form-row-last {
   width: 48.5% !important;
   float: right !important;
   clear: none !important;
   margin-left: 0 !important;
}

.checkout-left-col #billing_address_1_field,
.checkout-left-col #shipping_address_1_field {
   clear: both !important;
   width: 100% !important;
}

/* Hide "Ship to a different address" section completely */
#ship-to-different-address,
#ship-to-different-address-checkbox,
.woocommerce-shipping-fields,
.shipping_address {
   display: none !important;
}

.checkout-left-col label {
   font-size: 13px !important;
   font-weight: 600 !important;
   color: #374151 !important;
   margin-bottom: 5px !important;
   display: block !important;
}

.checkout-left-col label .required {
   color: #dc2626 !important;
}

.checkout-left-col input[type="text"],
.checkout-left-col input[type="email"],
.checkout-left-col input[type="tel"],
.checkout-left-col input[type="password"],
.checkout-left-col select,
.checkout-left-col .select2-container--default .select2-selection--single {
   height: 46px !important;
   line-height: 46px !important;
   background-color: #ffffff !important;
   border: 1px solid #d1d5db !important;
   border-radius: 8px !important;
   padding: 0 14px !important;
   font-size: 14px !important;
   color: #1f2937 !important;
   transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
   box-shadow: none !important;
}

.checkout-left-col textarea {
   border-radius: 8px !important;
   border: 1px solid #d1d5db !important;
   padding: 12px 14px !important;
   font-size: 14px !important;
   color: #1f2937 !important;
   height: 100px !important;
}

.checkout-left-col input[type="text"]:focus,
.checkout-left-col input[type="email"]:focus,
.checkout-left-col input[type="tel"]:focus,
.checkout-left-col input[type="password"]:focus,
.checkout-left-col textarea:focus,
.checkout-left-col select:focus,
.checkout-left-col .select2-container--default.select2-container--focus .select2-selection--single {
   border-color: #1f3d23 !important;
   box-shadow: 0 0 0 3px rgba(31, 61, 35, 0.12) !important;
   outline: none !important;
}

.checkout-left-col .select2-container--default .select2-selection--single .select2-selection__rendered {
   line-height: 46px !important;
   padding-left: 0 !important;
   color: #1f2937 !important;
   font-size: 14px !important;
}

.checkout-left-col .select2-container--default .select2-selection--single .select2-selection__arrow {
   height: 44px !important;
}

/* Right Column: Order Review Sidebar Card */
.checkout-right-col .col-inner,
.checkout-right-col .col-inner.has-border,
.checkout-right-col .col-inner.is-well {
   border: none !important;
   background: transparent !important;
   padding: 0 !important;
   box-shadow: none !important;
}

.checkout-sidebar-card {
   background-color: #f9fafb !important;
   border: 1px solid #e5e7eb !important;
   border-radius: 12px !important;
   padding: 24px !important;
   position: sticky !important;
   top: 90px !important;
}

.checkout-summary-title {
   font-size: 16px !important;
   font-weight: 700 !important;
   color: #111827 !important;
   text-transform: uppercase !important;
   letter-spacing: 0.5px !important;
   padding-bottom: 14px !important;
   margin-bottom: 18px !important;
   border-bottom: 1px solid #e5e7eb !important;
}

/* Order Review Table */
.checkout-sidebar-card #order_review {
   background: transparent;
   border: none;
   padding: 0;
   margin: 0;
   margin-bottom: 10px;
   box-shadow: none !important;
}

.checkout-sidebar-card table.shop_table {
   border: none !important;
   margin-bottom: 16px !important;
   width: 100% !important;
}

.checkout-sidebar-card table.shop_table th {
   background: none;
   color: #374151;
   font-size: 12px;
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.5px;
   padding: 8px 0;
   border-bottom: 1px solid #e5e7eb;
}

.checkout-sidebar-card table.shop_table td {
   padding: 12px 0;
   border-bottom: 1px solid #e5e7eb;
   font-size: 14px;
   color: #374151;
   vertical-align: middle;
}

/* Product Item Layout in Order Review Table */
.checkout-review-item-flex {
   display: flex !important;
   align-items: center !important;
   gap: 12px !important;
}

.checkout-review-img-wrap {
   position: relative !important;
   width: 52px !important;
   height: 52px !important;
   border: 1px solid #e5e7eb !important;
   border-radius: 8px !important;
   background: #ffffff !important;
   flex-shrink: 0 !important;
}

.checkout-review-item-img {
   width: 100% !important;
   height: 100% !important;
   object-fit: cover !important;
   border-radius: 7px !important;
}

.checkout-review-item-qty {
   position: absolute !important;
   top: -7px !important;
   right: -7px !important;
   background-color: #6b7280 !important;
   color: #ffffff !important;
   border-radius: 999px !important;
   width: 19px !important;
   height: 19px !important;
   font-size: 11px !important;
   font-weight: 700 !important;
   display: flex !important;
   align-items: center !important;
   justify-content: center !important;
   z-index: 2 !important;
}

.checkout-review-item-details {
   font-size: 13.5px !important;
   font-weight: 600 !important;
   color: #111827 !important;
   line-height: 1.35 !important;
}

/* Hide duplicate quantity text since badge is on image */
body.woocommerce-checkout table.shop_table .product-quantity,
.checkout-sidebar-card table.shop_table .product-quantity,
td.product-name .product-quantity,
strong.product-quantity {
   display: none !important;
}

/* Format Product Variation Meta (Kích thước, Màu sắc, Mẫu) as Inline Tags */
body.woocommerce-checkout table.shop_table .wc-item-meta,
.checkout-sidebar-card table.shop_table .wc-item-meta,
td.product-name .wc-item-meta {
   margin: 6px 0 0 0 !important;
   padding: 0 !important;
   list-style: none !important;
   display: flex !important;
   flex-wrap: wrap !important;
   gap: 6px !important;
}

body.woocommerce-checkout table.shop_table .wc-item-meta li,
.checkout-sidebar-card table.shop_table .wc-item-meta li,
td.product-name .wc-item-meta li {
   background-color: #f3f4f6 !important;
   border: 1px solid #e5e7eb !important;
   border-radius: 4px !important;
   padding: 2px 8px !important;
   font-size: 11.5px !important;
   color: #4b5563 !important;
   margin: 0 !important;
   display: inline-flex !important;
   align-items: center !important;
   gap: 4px !important;
}

body.woocommerce-checkout table.shop_table .wc-item-meta li strong.wc-item-meta-label,
.checkout-sidebar-card table.shop_table .wc-item-meta li strong.wc-item-meta-label,
td.product-name .wc-item-meta li strong.wc-item-meta-label {
   font-weight: 600 !important;
   color: #6b7280 !important;
   margin: 0 !important;
}

body.woocommerce-checkout table.shop_table .wc-item-meta li p,
.checkout-sidebar-card table.shop_table .wc-item-meta li p,
td.product-name .wc-item-meta li p {
   margin: 0 !important;
   display: inline !important;
   color: #111827 !important;
   font-weight: 500 !important;
}


.checkout-sidebar-card table.shop_table .product-total {
   font-weight: 700 !important;
   text-align: right !important;
   color: #111827 !important;
   font-size: 14px !important;
}

.checkout-sidebar-card table.shop_table tr.cart-subtotal th,
.checkout-sidebar-card table.shop_table tr.shipping th {
   color: #374151 !important;
   font-size: 13.5px !important;
   font-weight: 600 !important;
}

/* .checkout-sidebar-card table.shop_table tr.cart-subtotal td,
.checkout-sidebar-card table.shop_table tr.shipping td {
   text-align: right !important;
   font-weight: 700 !important;
   color: #111827 !important;
   font-size: 14px !important;
}

.checkout-sidebar-card table.shop_table tr.order-total th {
   font-size: 16px !important;
   color: #111827 !important;
   border-bottom: none !important;
   padding-top: 16px !important;
}

.checkout-sidebar-card table.shop_table tr.order-total td {
   font-size: 20px !important;
   font-weight: 800 !important;
   color: #1f3d23 !important;
   text-align: right !important;
   border-bottom: none !important;
   padding-top: 16px !important;
} */

/* Payment Methods Section */
.checkout-sidebar-card #payment {
   background: transparent !important;
   border: none !important;
   padding: 16px 0 0 0 !important;
   margin-top: 16px !important;
   border-top: 1px solid #e5e7eb !important;
}

.checkout-sidebar-card #payment ul.payment_methods {
   list-style: none !important;
   padding: 0 !important;
   margin: 0 0 16px 0 !important;
   border: none !important;
}

.checkout-sidebar-card #payment ul.payment_methods li.wc_payment_method {
   border: 1.5px solid #e5e7eb !important;
   border-radius: 8px !important;
   padding: 14px 16px !important;
   margin-bottom: 10px !important;
   background: #ffffff !important;
   transition: border-color 0.15s ease, background-color 0.15s ease !important;
   box-sizing: border-box !important;
}

.checkout-sidebar-card #payment ul.payment_methods li.wc_payment_method:hover,
.checkout-sidebar-card #payment ul.payment_methods li.wc_payment_method.payment_method_active {
   border-color: #1f3d23 !important;
   background-color: #f0f7f1 !important;
}

.checkout-sidebar-card #payment ul.payment_methods li.wc_payment_method input[type="radio"] {
   accent-color: #1f3d23 !important;
   margin-right: 8px !important;
   cursor: pointer !important;
}

.checkout-sidebar-card #payment ul.payment_methods li.wc_payment_method label {
   font-size: 14px !important;
   font-weight: 600 !important;
   color: #111827 !important;
   cursor: pointer !important;
   display: inline-flex !important;
   align-items: center !important;
   margin: 0 !important;
}

.checkout-sidebar-card #payment div.payment_box {
   background: #ffffff !important;
   border: 1px solid #e5e7eb !important;
   border-radius: 6px !important;
   padding: 10px 12px !important;
   font-size: 13px !important;
   line-height: 1.5 !important;
   color: #4b5563 !important;
   margin-top: 10px !important;
   margin-bottom: 2px !important;
}

.checkout-sidebar-card #payment div.payment_box::before {
   display: none !important;
}

.checkout-sidebar-card #payment div.place-order {
   padding: 0 !important;
   margin-top: 18px !important;
}



.checkout-sidebar-card #payment button#place_order,
.checkout-sidebar-card #payment #place_order {
   display: block !important;
   width: 100% !important;
   height: 48px !important;
   line-height: 48px !important;
   padding: 0 24px !important;
   background-color: #1f3d23 !important;
   color: #ffffff !important;
   border: none !important;
   border-radius: 8px !important;
   font-size: 15px !important;
   font-weight: 700 !important;
   text-transform: uppercase !important;
   letter-spacing: 0.5px !important;
   cursor: pointer !important;
   transition: background-color 0.2s ease-in-out !important;
   box-shadow: 0 4px 12px rgba(31, 61, 35, 0.2) !important;
}

.checkout-sidebar-card #payment button#place_order:hover,
.checkout-sidebar-card #payment #place_order:hover {
   background-color: #152b18 !important;
}

.woocommerce-billing-fields {
   border-top: none !important;
   padding-top: 0 !important
}

@media (max-width: 849px) {
   .checkout-left-col {
      padding-right: 0 !important;
      margin-bottom: 30px !important;
   }

   .checkout-sidebar-card {
      position: static !important;
   }

   .sm-order2 {
      order: 2;
   }
}

/* ─── Shipping Method List ───────────────────────────────────────────────── */

/* Make the UL list 100% wide */
#shipping_method,
ul.shipping__list {
   list-style: none;
   margin: 0 !important;
   padding: 0;
   box-sizing: border-box;
}

/* Each LI = the card */
#shipping_method li,
li.shipping__list_item {
   background: #ffffff !important;
   border: 1px solid #e2e8f0 !important;
   border-radius: 10px !important;
   padding: 12px 14px !important;
   margin-bottom: 8px !important;
   transition: border-color 0.2s ease, background 0.2s ease !important;
   box-sizing: border-box !important;
   display: flex !important;
   align-items: center !important;
}

#shipping_method li:hover,
li.shipping__list_item:hover {
   border-color: #10b981 !important;
   background: #f0fdf4 !important;
}

#shipping_method li input[type="radio"],
li.shipping__list_item input[type="radio"] {
   flex-shrink: 0 !important;
   margin-right: 10px !important;
   margin-top: 0 !important;
   accent-color: #10b981 !important;
}

/* ─── Goship brand logo ───────────────────────────────────────────────────── */

img.goship-brand-logo,
svg.goship-brand-logo {
   height: 20px !important;
   max-height: 20px !important;
   width: auto !important;
   max-width: 52px !important;
   object-fit: contain !important;
   display: inline-block !important;
   vertical-align: middle !important;
   flex-shrink: 0 !important;
}

/* Force SHIPMENT table and all inner elements to take 100% full width */
table.shipping__table,
table.shipping__table tbody,
table.shipping__table tr,
table.shipping__table td,
html body.woocommerce-checkout #order_review table.shop_table tr.woocommerce-shipping-totals,
html body.woocommerce-checkout #order_review table.shop_table tr.shipping,
.woocommerce-checkout table.shop_table tr.shipping {
   width: 100% !important;
   max-width: 100% !important;
   box-sizing: border-box !important;
}

html body.woocommerce-checkout #order_review table.shop_table tr.shipping th,
html body.woocommerce-checkout #order_review table.shop_table tr.shipping td,
html body.woocommerce-checkout #order_review table.shop_table td.shipping__inner {
   width: 100% !important;
   max-width: 100% !important;
   padding-left: 0 !important;
   padding-right: 0 !important;
   text-align: left !important;
}

/* Force Cart table header titles (Quantity, Subtotal, Price) to stay on 1 single line */
.shop_table.cart th.product-price,
.shop_table.cart th.product-quantity,
.shop_table.cart th.product-subtotal {
   white-space: nowrap !important;
}


/* =============================================================================
   Order Received / Order Details Modern Card Styling
   ============================================================================= */
body.woocommerce-order-received .woocommerce-order,
.woocommerce-page.woocommerce-order-received .order-details-wrapper,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-order-details,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-customer-details {
   max-width: 820px !important;
   margin-left: auto !important;
   margin-right: auto !important;
}

.woocommerce-order-received .woocommerce-notice--success {
   background-color: #ecfdf5 !important;
   border: 1px solid #a7f3d0 !important;
   color: #065f46 !important;
   border-radius: 12px !important;
   padding: 16px 20px !important;
   font-size: 15px !important;
   font-weight: 600 !important;
   text-align: center;
   margin-bottom: 25px !important;
}

.woocommerce-order-overview.woocommerce-thankyou-order-details {
   background: #ffffff !important;
   border: 1px solid #e5e7eb !important;
   border-radius: 12px !important;
   padding: 20px 24px !important;
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   list-style: none;
   margin-bottom: 30px !important;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}

.woocommerce-order-overview li {
   border-right: 1px solid #f3f4f6;
   padding-right: 20px;
   margin-right: 20px;
   font-size: 13px;
   color: #6b7280;
}

.woocommerce-order-overview li:last-child {
   border-right: 0;
   padding-right: 0;
   margin-right: 0;
}

.woocommerce-order-overview li strong {
   display: block;
   font-size: 15px;
   color: #111827;
   margin-top: 4px;
}

.woocommerce-order-details {
   background: #ffffff !important;
   border: 1px solid #e5e7eb !important;
   border-radius: 14px !important;
   padding: 28px !important;
   margin-bottom: 30px !important;
   box-shadow: 0 4px 16px rgba(0, 0, 0, 0.03) !important;
}

.woocommerce-order-details__title {
   font-size: 20px !important;
   font-weight: 700 !important;
   color: #1f3d23 !important;
   text-align: center;
   margin-bottom: 24px !important;
   padding-bottom: 14px;
   border-bottom: 2px solid #f0f4f1 !important;
}

.woocommerce-table--order-details {
   border-collapse: separate !important;
   border-spacing: 0 !important;
   width: 100% !important;
   border: 1px solid #e5e7eb !important;
   border-radius: 12px !important;
   overflow: hidden !important;
}

.woocommerce-table--order-details th,
.woocommerce-table--order-details td {
   padding: 16px 20px !important;
   border-bottom: 1px solid #f3f4f6 !important;
}

.woocommerce-table--order-details thead th {
   background-color: #f8faf8 !important;
   color: #1f3d23 !important;
   font-size: 13px !important;
   font-weight: 700 !important;
   text-transform: uppercase;
   letter-spacing: 0.5px;
}

.woocommerce-table--order-details tfoot th {
   font-weight: 600 !important;
   color: #374151 !important;
   font-size: 14px !important;
   text-transform: none !important;
}

.woocommerce-table--order-details tfoot td {
   text-align: right !important;
   font-size: 14px !important;
   color: #111827 !important;
}

.woocommerce-table--order-details tfoot tr:last-child th {
   border-bottom: 0 !important;
   font-weight: 700 !important;
   font-size: 16px !important;
   color: #1f3d23 !important;
}

.woocommerce-table--order-details tfoot tr:last-child td {
   border-bottom: 0 !important;
   font-weight: 700 !important;
   font-size: 18px !important;
   color: #00561B !important;
}

/* Customer Address Section */
.custom-order-customer-details {
   margin-top: 30px;
}

.custom-order-customer-details .address-card-single {
   background: #ffffff;
   border: 1px solid #e5e7eb;
   border-radius: 14px;
   padding: 24px;
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02);
}

/* Product item thumbnail + title flex layout in Order Details */
.order-item-with-thumb {
   display: flex !important;
   align-items: center !important;
   gap: 16px !important;
}

.order-item-with-thumb img.order-item-thumb-img {
   width: 64px !important;
   height: 64px !important;
   min-width: 64px !important;
   object-fit: cover !important;
   border-radius: 8px !important;
   border: 1px solid #e5e7eb !important;
   flex-shrink: 0 !important;
}

.order-item-title-wrap {
   display: flex !important;
   flex-direction: column !important;
   gap: 4px !important;
}

.order-item-name-text {
   font-size: 15px !important;
   font-weight: 600 !important;
   color: #111827 !important;
   line-height: 1.4 !important;
}

.order-item-name-text a {
   color: #111827 !important;
   text-decoration: none !important;
}

.order-item-name-text a:hover {
   color: #1f3d23 !important;
}

.order-item-qty-sub {
   font-size: 13px !important;
   color: #6b7280 !important;
   font-weight: 500 !important;
}

/* =============================================================================
   Modern WooCommerce Login & Account Lightbox Styling (Single Column Card)
   ============================================================================= */

/* Fix Lightbox Outer Modal Box width & border radius */
#login-form-popup,
.mfp-content #login-form-popup,
body #login-form-popup {
   max-width: 460px !important;
   width: 92% !important;
   background: #ffffff !important;
   border-radius: 22px !important;
   padding: 36px 32px !important;
   box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2) !important;
   margin: 0 auto !important;
   float: none !important;
   border: none !important;
   box-sizing: border-box !important;
}

/* Hide any left side column or background panel */
#login-form-popup .col-1,
#login-form-popup .account-register-bg,
#login-form-popup .account-register-bg-overlay {
   display: none !important;
}

/* Reset row / col-2 to take 100% full width inside card */
#login-form-popup #customer_login,
#login-form-popup .account-container,
#login-form-popup #customer_login>.col-2,
#login-form-popup .account-login-inner {
   width: 100% !important;
   max-width: 100% !important;
   flex: 0 0 100% !important;
   margin: 0 !important;
   padding: 0 !important;
   float: none !important;
   background: transparent !important;
   border: none !important;
   box-shadow: none !important;
}

/* Account Tab Header Switcher */
.account-tab-header {
   display: flex !important;
   justify-content: center !important;
   align-items: center !important;
   gap: 20px !important;
   margin-bottom: 24px !important;
   padding-bottom: 14px !important;
   border-bottom: 2px solid #f0f4f1 !important;
}

.account-tab-btn {
   background: transparent !important;
   border: none !important;
   padding: 4px 12px !important;
   font-size: 18px !important;
   font-weight: 700 !important;
   color: #9ca3af !important;
   text-transform: uppercase !important;
   letter-spacing: -0.2px !important;
   cursor: pointer !important;
   transition: all 0.2s ease !important;
   position: relative !important;
   box-shadow: none !important;
}

.account-tab-btn:hover {
   color: #00561B !important;
}

.account-tab-btn.active {
   color: #00561B !important;
}

.account-tab-btn.active::after {
   content: '' !important;
   position: absolute !important;
   bottom: -16px !important;
   left: 0 !important;
   right: 0 !important;
   height: 3px !important;
   background-color: #00561B !important;
   border-radius: 2px !important;
}

/* Account Prompt Link */
.account-switch-prompt {
   text-align: center !important;
   margin-top: 16px !important;
   font-size: 14px !important;
   color: #6b7280 !important;
}

.account-switch-prompt a.switch-to-tab {
   color: #00561B !important;
   font-weight: 600 !important;
   margin-left: 6px !important;
   text-decoration: underline !important;
   transition: color 0.2s ease !important;
}

.account-switch-prompt a.switch-to-tab:hover {
   color: #1f3d23 !important;
}

/* Title inside form */
.woocommerce-account form.login h2,
.woocommerce-account form.login h3,
.woocommerce-form-login h2,
form.login h2,
form.login>h3,
.account-login-inner h2,
.account-login-inner h3 {
   font-size: 22px !important;
   font-weight: 700 !important;
   color: #1f3d23 !important;
   text-align: center !important;
   margin-top: 0 !important;
   margin-bottom: 24px !important;
   padding-bottom: 12px !important;
   border-bottom: 2px solid #f0f4f1 !important;
   letter-spacing: -0.3px !important;
   text-transform: uppercase !important;
}

/* Form paragraphs & rows */
.account-login-inner .form-row,
.woocommerce-form-row,
form.login .form-row,
form.register .form-row {
   margin-bottom: 18px !important;
   padding: 0 !important;
   width: 100% !important;
   float: none !important;
}

/* Labels */
.account-login-inner label,
.woocommerce-form-row label,
form.login label,
form.register label {
   display: block !important;
   font-size: 14px !important;
   font-weight: 600 !important;
   color: #374151 !important;
   margin-bottom: 6px !important;
}

.account-login-inner label .required,
.woocommerce-form-row label .required,
form.login label .required {
   color: #dc2626 !important;
   text-decoration: none !important;
}

/* Input fields */
.account-login-inner input[type="text"],
.account-login-inner input[type="password"],
.account-login-inner input[type="email"],
.woocommerce-form-row input.input-text,
form.login input[type="text"],
form.login input[type="password"],
form.login input[type="email"],
form.register input[type="text"],
form.register input[type="password"],
form.register input[type="email"] {
   width: 100% !important;
   height: 48px !important;
   border: 1px solid #d1d5db !important;
   border-radius: 10px !important;
   padding: 0 16px !important;
   font-size: 15px !important;
   color: #111827 !important;
   background-color: #f9fafb !important;
   box-shadow: none !important;
   transition: all 0.2s ease !important;
   box-sizing: border-box !important;
}

.account-login-inner input[type="text"]:focus,
.account-login-inner input[type="password"]:focus,
.account-login-inner input[type="email"]:focus,
.woocommerce-form-row input.input-text:focus,
form.login input[type="text"]:focus,
form.login input[type="password"]:focus,
form.login input[type="email"]:focus {
   border-color: #00561B !important;
   background-color: #ffffff !important;
   outline: none !important;
   box-shadow: 0 0 0 3px rgba(0, 86, 27, 0.12) !important;
}

/* Remember me & submit row */
.woocommerce-form-login__rememberme,
form.login .woocommerce-form-login__rememberme,
form.login label.woocommerce-form-login__rememberme {
   display: inline-flex !important;
   align-items: center !important;
   gap: 8px !important;
   font-size: 14px !important;
   color: #4b5563 !important;
   font-weight: 500 !important;
   margin-bottom: 12px !important;
   cursor: pointer !important;
}

.woocommerce-form-login__rememberme input[type="checkbox"] {
   width: 18px !important;
   height: 18px !important;
   accent-color: #00561B !important;
   border-radius: 4px !important;
   cursor: pointer !important;
   margin: 0 !important;
}

/* Submit button */
.woocommerce-form-login__submit,
.account-login-inner button[type="submit"],
form.login button[type="submit"],
form.login input[type="submit"],
form.register button[type="submit"] {
   width: 100% !important;
   height: 48px !important;
   background-color: #00561B !important;
   color: #ffffff !important;
   font-size: 15px !important;
   font-weight: 700 !important;
   border-radius: 10px !important;
   border: none !important;
   cursor: pointer !important;
   transition: all 0.2s ease !important;
   margin-top: 10px !important;
   margin-bottom: 14px !important;
   display: flex !important;
   align-items: center !important;
   justify-content: center !important;
   text-transform: uppercase !important;
   letter-spacing: 0.5px !important;
   box-shadow: 0 4px 12px rgba(0, 86, 27, 0.2) !important;
}

.woocommerce-form-login__submit:hover,
.account-login-inner button[type="submit"]:hover,
form.login button[type="submit"]:hover,
form.login input[type="submit"]:hover {
   background-color: #1f3d23 !important;
   transform: translateY(-1px) !important;
   box-shadow: 0 6px 16px rgba(0, 86, 27, 0.3) !important;
}

/* Lost password link */
.lost_password,
.woocommerce-LostPassword,
form.login .lost_password {
   text-align: center !important;
   margin-top: 14px !important;
   margin-bottom: 0 !important;
}

.lost_password a,
.woocommerce-LostPassword a,
form.login .lost_password a {
   color: #6b7280 !important;
   font-size: 14px !important;
   font-weight: 500 !important;
   text-decoration: none !important;
   transition: color 0.2s ease !important;
}

.lost_password a:hover,
.woocommerce-LostPassword a:hover,
form.login .lost_password a:hover {
   color: #00561B !important;
   text-decoration: underline !important;
}

/* =============================================================================
   Policy & Terms Page Styles (Figma Node 1:236)
   ============================================================================= */

/* Page Background & Container */
.page-policy,
.policy-page-wrapper,
#wrapper .policy-page-wrapper,
body.page-template-default #content,
body.page #content {
   background-color: #F5F4F1;
}

.policy-page-container {
   max-width: 1220px;
   margin: 0 auto;
   padding: 40px 20px 80px 20px;
}

/* Page Title (Heading matching Figma) */

.entry-content {
   padding-bottom: 1em !important;
   padding-top: 1em !important;
}


/* Policy Content Body Typography */
.policy-page-content,
.policy-content {
   font-family: 'Be Vietnam Pro', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
   font-size: 16px;
   line-height: 25px;
   color: #111111;
   font-weight: 400;
}

.policy-page-content p,
.policy-content p {
   font-size: 16px;
   line-height: 25px;
   color: #111111;
   margin-bottom: 16px;
}

.policy-page-content h2,
.policy-content h2 {
   font-size: 22px !important;
   line-height: 32px !important;
   font-weight: 600 !important;
   color: #00561B !important;
   margin-top: 32px !important;
   margin-bottom: 14px !important;
}

.policy-page-content h3,
.policy-content h3 {
   font-size: 18px !important;
   line-height: 26px !important;
   font-weight: 600 !important;
   color: #0f391c !important;
   margin-top: 24px !important;
   margin-bottom: 10px !important;
}

.policy-page-content ul,
.policy-content ul,
.policy-page-content ol,
.policy-content ol {
   padding-left: 24px;
   margin-bottom: 20px;
}

.policy-page-content li,
.policy-content li {
   font-size: 16px;
   line-height: 25px;
   color: #111111;
   margin-bottom: 8px;
}

.policy-page-content strong,
.policy-content strong {
   color: #000000;
   font-weight: 600;
}

.policy-page-content a,
.policy-content a {
   color: #00561B;
   text-decoration: underline;
}

.policy-page-content a:hover,
.policy-content a:hover {
   color: #0f391c;
}


#popmake-503 {
   margin: 0;
   border-radius: 44px;
}

.pum-theme-491 .pum-content+.pum-close,
.pum-theme-lightbox .pum-content+.pum-close {
   margin: 0;
   right: 0 !important;
   top: 0 !important;
}

.popup-welcome-seclect-heading p {
   color: #00561B;
   text-align: center;
   font-size: 25px;
   font-weight: 600;
   line-height: 50px;
   margin-bottom: 10px;
}

.popup-welcome-button .button {
   border-radius: 6px;
   border: 2px solid #73A281;
   background: rgba(0, 86, 27, 0.55);
}

.popup-welcome-button .button:hover {
   background: #00561B;
}

/* =============================================================================
   Search Popup / Search Bar Styling (Figma Node 163:52)
   ============================================================================= */

/* Dark Overlay Backdrop */
.mfp-bg.search-popup-bg,
.mfp-bg {
   background: rgba(0, 0, 0, 0.45);
}

/* Push Lightbox Modal Box to top (just below header at 99px) */
.mfp-container:has(#search-lightbox):before,
.mfp-container:has(.search-popup):before,
body.search-opened .mfp-container:before {
   display: none;
}

.mfp-container:has(#search-lightbox),
.mfp-container:has(.search-popup),
body.search-opened .mfp-container {
   padding-top: 99px;
   vertical-align: top;
   align-items: flex-start;
}

/* Lightbox Modal Box Container */
#search-lightbox,
.search-popup,
.mfp-content #search-lightbox {
   background-color: #ffffff;
   max-width: 476px;
   width: 90%;
   border-radius: 44px;
   padding: 36px 36px 30px 36px;
   box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
   border: none;
   margin: 0 auto;
   position: relative;
   vertical-align: top;
}

/* Close Button */
#search-lightbox .mfp-close,
.search-popup .mfp-close {
   color: #00561B;
   font-size: 28px;
   top: 18px;
   right: 24px;
   opacity: 0.8;
}

#search-lightbox .mfp-close:hover {
   opacity: 1;
}

/* Search Form Wrapper */
#search-lightbox .searchform-wrapper,
.search-popup .searchform-wrapper {
   width: 100%;
   padding: 0;
   background: transparent;
}

#search-lightbox form.searchform,
.search-popup form.searchform {
   position: relative;
   margin: 0;
}

/* Search Input Field (Pill Shape with Green Border) */
#search-lightbox input[type="search"],
#search-lightbox .search-field,
.search-popup input[type="search"],
.search-popup .search-field {
   width: 100%;
   height: 42px;
   line-height: 42px;
   border: 2px solid #00561B;
   border-radius: 21px;
   padding: 0 45px 0 20px;
   background-color: #ffffff;
   color: #000000;
   font-family: "Be Vietnam Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
   font-size: 16px;
   outline: none;
   box-shadow: none;
   box-sizing: border-box;
}

#search-lightbox input[type="search"]::placeholder,
.search-popup input[type="search"]::placeholder {
   color: rgba(0, 0, 0, 0.4);
   font-size: 16px;
   font-family: "Be Vietnam Pro", sans-serif;
}

/* Search Submit Button / Icon on the right */
#search-lightbox button[type="submit"],
#search-lightbox .ux-search-submit,
#search-lightbox .submit-button,
.search-popup button[type="submit"],
.search-popup .ux-search-submit,
.search-popup .submit-button {
   position: absolute;
   right: 12px;
   top: 56%;
   transform: translateY(-50%);
   background: transparent;
   border: none;
   box-shadow: none;
   color: #00561B;
   width: 24px;
   height: 24px;
   padding: 0;
   margin: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
   min-height: unset;
}

#search-lightbox button[type="submit"] i,
#search-lightbox button[type="submit"] svg,
.search-popup button[type="submit"] i,
.search-popup button[type="submit"] svg {
   color: #00561B;
   fill: none;
   stroke: #00561B;
   width: 20px;
   height: 20px;
   font-size: 18px;
}

/* Live Search Suggestions Dropdown List - Single Scrollbar Fix */
#search-lightbox .live-search-results,
.search-popup .live-search-results {
   position: relative;
   top: auto;
   left: auto;
   width: 100%;
   background: transparent;
   border: none;
   box-shadow: none;
   margin-top: 16px;
   padding: 0 6px;
   max-height: 200px;
   overflow-y: auto;
   overflow-x: hidden;
}

#search-lightbox .autocomplete-suggestions,
.search-popup .autocomplete-suggestions {
   max-height: none !important;
   overflow: visible !important;
   overflow-y: visible !important;
   background: transparent;
   border: none;
   box-shadow: none;
   padding: 0;
   margin: 0;
}

/* Custom Thin Scrollbar */
#search-lightbox .live-search-results::-webkit-scrollbar {
   width: 5px;
}

#search-lightbox .live-search-results::-webkit-scrollbar-thumb {
   background-color: rgba(0, 86, 27, 0.25);
   border-radius: 4px;
}

#search-lightbox .live-search-results::-webkit-scrollbar-track {
   background: transparent;
}


#search-lightbox .autocomplete-suggestion,
#search-lightbox .live-search-results a,
.search-popup .autocomplete-suggestion,
.search-popup .live-search-results a {
   display: flex !important;
   align-items: center !important;
   gap: 12px !important;
   padding: 8px 0;
   font-family: "Be Vietnam Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
   font-size: 16px;
   line-height: 24px;
   color: #000000;
   border-bottom: none;
   text-decoration: none;
   background: transparent;
   transition: color 0.15s ease;
   cursor: pointer !important;
}

#search-lightbox .autocomplete-suggestion img,
#search-lightbox .live-search-results img,
.search-popup .autocomplete-suggestion img,
.search-popup .live-search-results img {
   width: 32px !important;
   height: 32px !important;
   border-radius: 50% !important;
   object-fit: cover !important;
   flex-shrink: 0 !important;
   margin: 0 !important;
   display: block !important;
}

#search-lightbox .autocomplete-suggestion:hover,
#search-lightbox .live-search-results a:hover,
.search-popup .autocomplete-suggestion:hover,
.search-popup .live-search-results a:hover {
   color: #00561B;
   background: transparent;
   cursor: pointer !important;
}


#search-lightbox .autocomplete-suggestion strong,
#search-lightbox .autocomplete-suggestion b,
.search-popup .autocomplete-suggestion strong,
.search-popup .autocomplete-suggestion b {
   font-weight: 600;
   color: #000000;
}

/* Live Search Loading Spinner Color (Green #00561B) */
#search-lightbox .submit-button.loading:after,
.search-popup .submit-button.loading:after,
.searchform .submit-button.loading:after,
.searchform.loading:after,
.submit-button.loading:after,
.loading-spin,
.loading:after {
   border-color: rgba(0, 86, 27, 0.2) !important;
   border-top-color: #00561B !important;
   border-left-color: #00561B !important;
}

#search-lightbox .loading svg,
.search-popup .loading svg,
.searchform .loading svg {
   color: #00561B !important;
   fill: #00561B !important;
   stroke: #00561B !important;
}

.button.alt,
.button.checkout {
   background-color: var(--primary-color) !important;
   margin: 0;
}

/* =============================================================================
   Category Icons Row (Desktop: Static 7 Items Fit | Mobile: Touch Swipe Slider)
   ============================================================================= */

/* Desktop Container */
.category-icons-row,
.ux-stack.category-icons-row,
.stack.category-icons-row,
.category-stack-scroll,
.stack.category-stack-scroll,
.ux-stack.category-stack-scroll {
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: flex-start;
   width: 100%;
   margin-left: auto;
   margin-right: auto;
}

/* Individual Featured Box Item */
.category-icons-row .featured-box,
.category-icons-row .icon-box,
.category-stack-scroll .featured-box,
.category-stack-scroll .icon-box,
.stack .featured-box,
.stack .icon-box,
.ux-stack .featured-box,
.ux-stack .icon-box {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: flex-start;
   height: auto;
   width: auto !important;
   min-width: 75px;
   margin-bottom: 0;
}

/* Icon Image Container (120px Fixed Height) */
.category-icons-row .icon-box-img,
.category-icons-row .featured-box-img,
.category-stack-scroll .icon-box-img,
.category-stack-scroll .featured-box-img,
.stack .icon-box-img,
.stack .featured-box-img,
.ux-stack .icon-box-img,
.ux-stack .featured-box-img {
   height: 120px;
   width: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   margin: 0 auto 10px auto;
}

.category-icons-row .icon-box-img img,
.category-icons-row .featured-box-img img,
.category-stack-scroll .icon-box-img img,
.category-stack-scroll .featured-box-img img,
.stack .icon-box-img img,
.stack .featured-box-img img,
.ux-stack .icon-box-img img,
.ux-stack .featured-box-img img {
   max-height: 100%;
   max-width: 100%;
   width: auto;
   height: auto;
   object-fit: contain;
}

/* Text Container (40px Fixed Height, Centered vertically/horizontally matching Figma y-center 135px) */
.category-icons-row .icon-box-text,
.category-icons-row .featured-box-text,
.category-stack-scroll .icon-box-text,
.category-stack-scroll .featured-box-text,
.stack .icon-box-text,
.stack .featured-box-text,
.ux-stack .icon-box-text,
.ux-stack .featured-box-text {
   height: 40px;
   display: flex;
   align-items: center;
   justify-content: center;
   margin: 0;
   padding: 0;
   text-align: center;
   width: max-content !important;
   max-width: 135px !important;
   min-width: 100% !important;
}

.category-icons-row .icon-box-text h3,
.category-icons-row .featured-box-text h3,
.category-icons-row h3,
.category-stack-scroll .icon-box-text h3,
.category-stack-scroll .featured-box-text h3,
.category-stack-scroll h3,
.stack .icon-box-text h3,
.stack .featured-box-text h3,
.stack h3,
.ux-stack .icon-box-text h3,
.ux-stack .featured-box-text h3 {
   font-size: 16px;
   font-weight: 600;
   color: #00561B;
   line-height: 20px;
   margin: 0;
   padding: 0;
   text-align: center;
   word-break: keep-all;
   white-space: normal;
}

/* Mobile & Tablet Responsive Touch Swipe Slider */
@media (max-width: 849px) {

   .category-icons-row,
   .ux-stack.category-icons-row,
   .stack.category-icons-row,
   .category-stack-scroll,
   .stack.category-stack-scroll,
   .ux-stack.category-stack-scroll {
      display: flex !important;
      flex-direction: row !important;
      flex-wrap: nowrap !important;
      overflow-x: auto !important;
      -webkit-overflow-scrolling: touch;
      gap: 24px !important;
      justify-content: flex-start !important;
      align-items: flex-start !important;
      padding: 10px 15px 15px 15px !important;
      scroll-snap-type: x mandatory;
      scrollbar-width: none;
   }

   .category-icons-row::-webkit-scrollbar,
   .category-stack-scroll::-webkit-scrollbar {
      display: none;
   }

   .category-icons-row>*,
   .category-stack-scroll>* {
      flex: 0 0 auto !important;
      width: auto !important;
      min-width: 75px !important;
      scroll-snap-align: start;
   }

   .category-stack-scroll .icon-box-img,
   .category-stack-scroll .featured-box-img {
      height: 80px;
      margin-bottom: 6px;
   }

   .category-stack-scroll .icon-box-text,
   .category-stack-scroll .featured-box-text {
      height: 36px;
   }

   .category-stack-scroll h3 {
      font-size: 13px;
      line-height: 17px;
   }
}

@media (min-width: 850px) {
   .desktop-3-mobile-4 .col:nth-child(n+4) {
      display: none !important;
   }
}

/* =============================================================================
   Modern WooCommerce My Account Dashboard & Navigation Styling
   ============================================================================= */

/* Page Background & Layout Container */
.woocommerce-account .page-wrapper,
.woocommerce-account #content {
   background-color: #f8faf9 !important;
   padding-top: 30px !important;
   padding-bottom: 60px !important;
}

/* Hide old plain Flatsome dashboard-links list */
.woocommerce-account .dashboard-links,
.woocommerce-account ul.dashboard-links,
ul.dashboard-links {
   display: none !important;
}

/* My Account Breadcrumbs Styling */
.my-account-breadcrumbs {
   margin-bottom: 8px !important;
}

.my-account-breadcrumbs .woocommerce-breadcrumb,
.my-account-breadcrumbs .breadcrumbs {
   font-size: 13px !important;
   font-weight: 500 !important;
   color: #6b7280 !important;
   text-transform: uppercase !important;
   letter-spacing: 0.5px !important;
   margin-bottom: 0 !important;
}

.my-account-breadcrumbs .woocommerce-breadcrumb a,
.my-account-breadcrumbs .breadcrumbs a {
   color: #00561B !important;
   font-weight: 600 !important;
   text-decoration: none !important;
}

.my-account-breadcrumbs .woocommerce-breadcrumb a:hover,
.my-account-breadcrumbs .breadcrumbs a:hover {
   color: #1f3d23 !important;
   text-decoration: underline !important;
}

.my-account-breadcrumbs .divider {
   color: #9ca3af !important;
   margin: 0 6px !important;
}

/* Hide default plain dashboard-links list if our custom dashboard grid is rendered */
.custom-account-dashboard~.dashboard-links,
.custom-account-dashboard~ul.dashboard-links {
   display: none !important;
}

/* Profile Banner Card */
.account-profile-card {
   display: flex !important;
   align-items: center !important;
   gap: 24px !important;
   background: #ffffff !important;
   border-radius: 20px !important;
   padding: 28px 32px !important;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04) !important;
   border: 1px solid #e8ece9 !important;
   margin-bottom: 24px !important;
}

.profile-avatar-wrap {
   flex-shrink: 0 !important;
}

.profile-avatar-img {
   width: 72px !important;
   height: 72px !important;
   border-radius: 50% !important;
   object-fit: cover !important;
   border: 3px solid #00561B !important;
   box-shadow: 0 4px 12px rgba(0, 86, 27, 0.15) !important;
}

.profile-avatar-initial {
   width: 72px !important;
   height: 72px !important;
   border-radius: 50% !important;
   background: linear-gradient(135deg, #00561B 0%, #1f3d23 100%) !important;
   color: #ffffff !important;
   font-size: 28px !important;
   font-weight: 700 !important;
   display: flex !important;
   align-items: center !important;
   justify-content: center !important;
   box-shadow: 0 4px 12px rgba(0, 86, 27, 0.2) !important;
}

.profile-info-wrap {
   flex-grow: 1 !important;
}

.profile-badge {
   display: inline-block !important;
   background: #e6f0e9 !important;
   color: #00561B !important;
   font-size: 11px !important;
   font-weight: 700 !important;
   letter-spacing: 0.8px !important;
   padding: 3px 10px !important;
   border-radius: 20px !important;
   margin-bottom: 6px !important;
}

.profile-name {
   font-size: 22px !important;
   font-weight: 700 !important;
   color: #111827 !important;
   margin: 0 0 4px 0 !important;
}

.profile-email {
   font-size: 14px !important;
   color: #6b7280 !important;
   margin: 0 !important;
}

.profile-action-wrap .logout-btn {
   display: inline-flex !important;
   align-items: center !important;
   gap: 8px !important;
   border: 1px solid #d1d5db !important;
   background: #ffffff !important;
   color: #374151 !important;
   font-size: 13px !important;
   font-weight: 600 !important;
   padding: 10px 20px !important;
   border-radius: 10px !important;
   transition: all 0.2s ease !important;
   text-transform: none !important;
   box-shadow: 0 2px 6px rgba(0, 0, 0, 0.03) !important;
}

.profile-action-wrap .logout-btn:hover {
   background: #fef2f2 !important;
   border-color: #fecaca !important;
   color: #dc2626 !important;
   transform: translateY(-1px) !important;
}

/* Welcome Box */
.dashboard-welcome-box {
   background: rgba(0, 86, 27, 0.04) !important;
   border-left: 4px solid #00561B !important;
   border-radius: 12px !important;
   padding: 16px 20px !important;
   margin-bottom: 28px !important;
}

.dashboard-welcome-box p.welcome-text {
   margin: 0 !important;
   font-size: 14px !important;
   line-height: 1.6 !important;
   color: #374151 !important;
}

.dashboard-welcome-box p.welcome-text strong {
   color: #00561B !important;
}

/* Dashboard Grid 2x2 */
.dashboard-grid-container {
   display: grid !important;
   grid-template-columns: repeat(2, 1fr) !important;
   gap: 20px !important;
}

@media (max-width: 767px) {
   .dashboard-grid-container {
      grid-template-columns: 1fr !important;
   }

   .account-profile-card {
      flex-direction: column !important;
      text-align: center !important;
   }
}

.dashboard-grid-card {
   display: flex !important;
   align-items: center !important;
   gap: 16px !important;
   background: #ffffff !important;
   border: 1px solid #e8ece9 !important;
   border-radius: 16px !important;
   padding: 22px 24px !important;
   box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
   transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
   text-decoration: none !important;
   position: relative !important;
}

.dashboard-grid-card:hover {
   transform: translateY(-4px) !important;
   box-shadow: 0 12px 30px rgba(0, 86, 27, 0.1) !important;
   border-color: #00561B !important;
}

.card-icon-badge {
   width: 52px !important;
   height: 52px !important;
   border-radius: 14px !important;
   display: flex !important;
   align-items: center !important;
   justify-content: center !important;
   flex-shrink: 0 !important;
   transition: transform 0.25s ease !important;
}

.dashboard-grid-card:hover .card-icon-badge {
   transform: scale(1.08) !important;
}

.card-icon-badge.color-green {
   background: #e6f0e9 !important;
   color: #00561B !important;
}

.card-icon-badge.color-emerald {
   background: #d1fae5 !important;
   color: #059669 !important;
}

.card-icon-badge.color-teal {
   background: #ccfbf1 !important;
   color: #0d9488 !important;
}

.card-icon-badge.color-rose {
   background: #ffe4e6 !important;
   color: #e11d48 !important;
}

.card-icon-badge svg {
   width: 24px !important;
   height: 24px !important;
}

.dashboard-grid-card .card-body {
   flex-grow: 1 !important;
}

.dashboard-grid-card .card-title {
   font-size: 16px !important;
   font-weight: 700 !important;
   color: #111827 !important;
   margin: 0 0 4px 0 !important;
   transition: color 0.2s ease !important;
}

.dashboard-grid-card:hover .card-title {
   color: #00561B !important;
}

.dashboard-grid-card .card-desc {
   font-size: 13px !important;
   color: #6b7280 !important;
   margin: 0 !important;
   line-height: 1.4 !important;
}

.dashboard-grid-card .card-arrow {
   width: 28px !important;
   height: 28px !important;
   color: #d1d5db !important;
   display: flex !important;
   align-items: center !important;
   justify-content: center !important;
   transition: all 0.2s ease !important;
}

.dashboard-grid-card .card-arrow svg {
   width: 20px !important;
   height: 20px !important;
}

.dashboard-grid-card:hover .card-arrow {
   color: #00561B !important;
   transform: translateX(4px) !important;
}

/* Sidebar Navigation Styling on My Account Subpages */
.woocommerce-MyAccount-navigation ul {
   background: #ffffff !important;
   border-radius: 16px !important;
   padding: 12px !important;
   box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
   border: 1px solid #e8ece9 !important;
   list-style: none !important;
   margin: 0 !important;
}

.woocommerce-MyAccount-navigation li {
   margin-bottom: 4px !important;
}

.woocommerce-MyAccount-navigation li:last-child {
   margin-bottom: 0 !important;
}

.woocommerce-MyAccount-navigation li a {
   display: flex !important;
   align-items: center !important;
   padding: 12px 16px !important;
   font-size: 14px !important;
   font-weight: 600 !important;
   color: #4b5563 !important;
   border-radius: 10px !important;
   transition: all 0.2s ease !important;
   text-decoration: none !important;
}

.woocommerce-MyAccount-navigation li a:hover {
   background: #f3f4f6 !important;
   color: #00561B !important;
}

.woocommerce-MyAccount-navigation li.is-active a {
   background: #00561B !important;
   color: #ffffff !important;
   box-shadow: 0 4px 12px rgba(0, 86, 27, 0.25) !important;
}

/* Hide default top page title header on My Account pages */
.woocommerce-account .my-account-header,
.woocommerce-account .page-title {
   display: none !important;
}

/* My Account Breadcrumbs Styling */
.my-account-subpage-header {
   margin-bottom: 24px !important;
   margin-top: 6px !important;
}

.my-account-breadcrumbs {
   display: flex !important;
   align-items: center !important;
   gap: 8px !important;
   margin-bottom: 0 !important;
   font-size: 15px !important;
   font-weight: 700 !important;
   letter-spacing: 0.5px !important;
   text-transform: uppercase !important;
}

.my-account-breadcrumbs a.breadcrumb-acc-link {
   color: #00561B !important;
   font-weight: 800 !important;
   text-decoration: none !important;
   transition: all 0.2s ease !important;
}

.my-account-breadcrumbs a.breadcrumb-acc-link:hover {
   color: #1f3d23 !important;
   text-decoration: underline !important;
}

.my-account-breadcrumbs .divider {
   color: #9ca3af !important;
   font-weight: 400 !important;
}

.my-account-breadcrumbs .current {
   color: #374151 !important;
   font-weight: 700 !important;
}

.my-account .row.vertical-tabs>.col-border,
.my-account .row.vertical-tabs>.large-3.col,
.my-account .account-user {
   display: none !important;
}

.my-account .row.vertical-tabs>.large-9.col,
.my-account .row.vertical-tabs>.col {
   width: 100% !important;
   max-width: 100% !important;
   flex: 0 0 100% !important;
}

/* Force State/City field visibility on checkout */
#billing_state_field,
#shipping_state_field {
   display: block !important;
}

/* ─── Mobile Product Category Catalog Grid (Matching Related Products) ────────── */

@media (max-width: 849px) {

   /* Category catalog cards outer box */
   .archive .product-small.box,
   .tax-product_cat .product-small.box,
   .tax-product_tag .product-small.box,
   .post-type-archive-product .product-small.box,
   .woocommerce-page .product-small.box {
      display: flex !important;
      flex-direction: column !important;
      text-decoration: none !important;
      background: #ffffff !important;
      border-radius: 12px !important;
      padding: 10px !important;
      border: 1px solid #eaeaea !important;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04) !important;
      transition: all 0.25s ease !important;
      height: 100% !important;
      box-sizing: border-box !important;
      text-align: left !important;
   }

   .archive .product-small.box .box-image,
   .tax-product_cat .product-small.box .box-image,
   .tax-product_tag .product-small.box .box-image,
   .post-type-archive-product .product-small.box .box-image,
   .woocommerce-page .product-small.box .box-image {
      width: 100% !important;
      aspect-ratio: 1 / 1 !important;
      border-radius: 10px !important;
      overflow: hidden !important;
      background: #f8f8f8 !important;
      margin-bottom: 8px !important;
   }

   .archive .product-small.box .box-image img,
   .tax-product_cat .product-small.box .box-image img,
   .tax-product_tag .product-small.box .box-image img,
   .post-type-archive-product .product-small.box .box-image img,
   .woocommerce-page .product-small.box .box-image img {
      width: 100% !important;
      height: 100% !important;
      object-fit: cover !important;
      display: block !important;
   }

   .archive .product-small.box .box-text-products,
   .tax-product_cat .product-small.box .box-text-products,
   .tax-product_tag .product-small.box .box-text-products,
   .post-type-archive-product .product-small.box .box-text-products,
   .woocommerce-page .product-small.box .box-text-products {
      padding: 4px 0 0 0 !important;
      text-align: left !important;
      width: 100% !important;
   }

   .archive .product-small.box .title-wrapper,
   .tax-product_cat .product-small.box .title-wrapper,
   .tax-product_tag .product-small.box .title-wrapper,
   .post-type-archive-product .product-small.box .title-wrapper,
   .woocommerce-page .product-small.box .title-wrapper {
      margin: 0 0 4px 0 !important;
   }

   .archive .product-small.box .product-title,
   .archive .product-small.box .product-title a,
   .tax-product_cat .product-small.box .product-title,
   .tax-product_cat .product-small.box .product-title a,
   .tax-product_tag .product-small.box .product-title,
   .tax-product_tag .product-small.box .product-title a,
   .post-type-archive-product .product-small.box .product-title,
   .post-type-archive-product .product-small.box .product-title a,
   .woocommerce-page .product-small.box .product-title,
   .woocommerce-page .product-small.box .product-title a {
      font-size: 12px !important;
      font-weight: 600 !important;
      color: #222222 !important;
      margin: 0 !important;
      padding: 0 !important;
      line-height: 1.35 !important;
      display: -webkit-box !important;
      -webkit-line-clamp: 2 !important;
      -webkit-box-orient: vertical !important;
      overflow: hidden !important;
      text-align: left !important;
   }

   .archive .product-small.box .price-wrapper,
   .tax-product_cat .product-small.box .price-wrapper,
   .tax-product_tag .product-small.box .price-wrapper,
   .post-type-archive-product .product-small.box .price-wrapper,
   .woocommerce-page .product-small.box .price-wrapper {
      text-align: left !important;
      margin-top: 4px !important;
   }

   .archive .product-small.box .price .amount,
   .tax-product_cat .product-small.box .price .amount,
   .tax-product_tag .product-small.box .price .amount,
   .post-type-archive-product .product-small.box .price .amount,
   .woocommerce-page .product-small.box .price .amount {
      font-size: 13px !important;
      font-weight: 700 !important;
      color: #00561B !important;
   }
}