/* Semantic colors shared by desktop, tablet and mobile. Layout stays in page styles. */
body { background: var(--background-color); color: var(--text-color); }
body :is(h1,h2,h3,h4,h5,h6) { color: var(--heading-color); }
body :is(input,select,textarea,.form-control,.form-select) { border-color: var(--input-border); accent-color: var(--primary-color); }
body :is(input,select,textarea,.form-control,.form-select):focus { border-color: var(--primary-color) !important; box-shadow: 0 0 0 3px var(--focus-ring); }
body :is(a,button,input,select,textarea):focus-visible { outline: 2px solid var(--primary-color); outline-offset: 3px; }
body :is(.text-danger,.invalid-feedback) { color: var(--error) !important; }
body .text-success { color: var(--success) !important; }
body .text-muted { color: var(--muted-text) !important; }

/* White surfaces and green navigation. */
body :is(.logo-area,.mobile-header,.mobile-search,.product_item,.product_item_inner,.card,.customer-content) { background: var(--card-bg) !important; }
/* NEW CSS: Related Product Full Card Border Fix */
.related-product-section .related_slider .product_item_inner {
    border: .5px solid #0C6F0A;
    border-radius: 16px;
}
body.home-reference :is(#main-content,.homepage-product-section,.all-products-section,.trending,.shop-categories,.home-brands) {
    background: var(--my-section-bg); 
}
body :is(.menu-area,.footer_nav,.offcanvas-header.toggole_header) { background: var(--primary-color) !important; }
body :is(.pro_name a,.product-cart .name,.section-title h3,.category-title h3) { color: var(--heading-color) !important; }
body :is(.category-title h3 span,.section-title h3 span,.reference-heading > i,.checkout-terms a) { color: var(--primary-color); }
body :is(.new_price,.details-price,.pro_price p) { color: var(--primary-color) !important; }
body :is(.old_price,.pro_price del,.details-price del) { color: var(--muted-text) !important; }

/* Routine actions and account forms use the brand color. */
body :is(.add_cart_btn,.addcartbutton,.category-show-all,.home-load-more,.description-toggle,.details-review-button,.coupon-btn,.coupon-form button,.checkout-coupon-form .btn-theme,.cart-page-coupon button,.main-search button,.mobile-search button,.auth-section .submit-btn,.customer-section .submit-btn,.scrolltop,.contact-btn.active) {
    background: var(--primary-color) !important; color: var(--white) !important; border-color: var(--primary-color) !important;
}
body :is(.add_cart_btn,.addcartbutton,.category-show-all,.home-load-more,.description-toggle,.details-review-button,.coupon-btn,.coupon-form button,.checkout-coupon-form .btn-theme,.cart-page-coupon button,.main-search button,.mobile-search button,.auth-section .submit-btn,.customer-section .submit-btn):hover {
    background: var(--primary-hover) !important; border-color: var(--primary-hover) !important;
}
body :is(.reference-view-all,.flash-sale-view-all,.review-write-link,.btn-outline-primary) { background: var(--white); border-color: var(--primary-color) !important; color: var(--primary-color) !important; }
body :is(.reference-view-all,.flash-sale-view-all,.review-write-link,.btn-outline-primary):hover { background: var(--primary-color) !important; color: var(--white) !important; }
body .customer-menu li.active a { color: var(--primary-color); }

/* Orange is reserved for purchase actions and promotions. */
body :is(.order_now_btn,.order_place,.order_place2,.cart_btn button,.cart_btn a,.variable-modal,.checkout-btn,.cart-page-checkout,.confirm-btn,.order_btn,.order_btn2,.ord_btn a,a.button-design-3[href="#order_form"]) {
    background: var(--secondary-color) !important; color: var(--white) !important; border-color: var(--secondary-color) !important;
}
body :is(.order_now_btn,.order_place,.order_place2,.cart_btn button,.cart_btn a,.variable-modal,.checkout-btn,.cart-page-checkout,.confirm-btn,.order_btn,.order_btn2,.ord_btn a,a.button-design-3[href="#order_form"]):hover {
    background: var(--secondary-hover) !important; border-color: var(--secondary-hover) !important;
}
body :is(.detail-flash-banner,span.discount_details,.header-list-items li span,.menu-bag span,.footer-nav-badge,.order-review__badge),
body.home-reference .flash-sale-section > .container { 
    background: var(--primary-color) !important; 
    color: var(--white) !important; 
}
body .detail-flash-banner > div:first-child, body.home-reference :is(.flash-sale-heading h2,.flash-sale-ends) { color: var(--white); }
body :is(.detail-countdown > span,.flash-sale-timer > span) { background: var(--white); color: var(--heading-color); }
body :is(.detail-countdown small,.flash-sale-timer small) { color: var(--muted-text); }
body.home-reference .owl-dot.active { background: var(--primary-color) !important; }
body.home-reference .flash-sale-grid .owl-dot.active { background: var(--white) !important; }

/* Footer text, titles and hover links follow the document. */
body :is(.footer-top,.footer-bottom) { background: var(--primary-color) !important; border-color: var(--primary-color); }
body .footer-top::before { background: none; }
body :is(.footer-about p,.footer-about p a,.footer-menu ul li a,.copyright p) { color: var(--footer-text) !important; }
body :is(.footer-menu .title,.footer-menu .title a,.footer-about h3) { color: var(--white) !important; }
body .footer-menu .title::after { background: var(--white) !important; }
body :is(.footer-menu ul li a,.footer-about p a,.copyright a):hover { color: var(--secondary-color) !important; }
body .social_link li a:hover { background: var(--primary-hover) !important; color: var(--white) !important; }

/* Bootstrap controls in customer and admin customer screens. */
.btn-primary { --bs-btn-bg: var(--primary-color); --bs-btn-border-color: var(--primary-color); --bs-btn-hover-bg: var(--primary-hover); --bs-btn-hover-border-color: var(--primary-hover); background-color: var(--primary-color); border-color: var(--primary-color); }
.btn-primary:hover { background-color: var(--primary-hover); border-color: var(--primary-hover); }
.form-check-input:checked { background-color: var(--primary-color); border-color: var(--primary-color); }

body .sidebar-menu ul li a:hover, body .sidebar-menu ul li.active a { color: var(--primary-color); }
body .btn-primary-custom { background: var(--primary-color); color: var(--white); box-shadow: 0 3px 12px var(--focus-ring); }
body .btn-primary-custom:hover { background: var(--primary-hover); }

/* Match the specificity of the homepage component rules. */
body.home-reference .pro_btn .cart_btn button, body.home-reference .pro_btn .variable-modal { background: var(--secondary-color) !important; }
body.home-reference .pro_btn .cart_btn button:hover, body.home-reference .pro_btn .variable-modal:hover { background: var(--secondary-hover) !important; }
body.home-reference .pro_btn .addcartbutton { background: var(--primary-color) !important; }
body.home-reference .pro_btn .addcartbutton:hover { background: var(--primary-hover) !important; }
body.home-reference .footer-top, body.home-reference .footer-bottom { background: var(--primary-color) !important; }
body.home-reference .footer-about p, body.home-reference .footer-about p a, body.home-reference .footer-menu ul li a { color: var(--footer-text) !important; }
body.home-reference .footer-menu .title a { color: var(--white) !important; }
body.home-reference .footer-menu ul li a:hover, body.home-reference .footer-about p a:hover { color: var(--secondary-color) !important; }
body.home-reference .footer-nav-badge { background: var(--secondary-color) !important; }
body.home-reference .category-title h3 span, body.home-reference .section-title h3 span { color: var(--primary-color); }
