/*
Theme Name: Divi Child - FML Skinlab
Theme URI: https://fmlskinlab.com
Description: Child theme of Divi for FML Skinlab. Holds template overrides (WooCommerce My Account / Cart / Checkout ports from the WonderLab build) and site-specific styling. Custom mechanisms (points / membership / promo) live in the fml-core plugin, NOT here.
Author: FML Skinlab
Author URI: https://fmlskinlab.com
Template: Divi
Version: 1.1.2
*/

/* FML site-specific styles below. Keep brand tokens consistent:
   black #000000 · amber #FFC03F · pearl #E9DAC7 · brown #8E7159 */

/* ============================================================
   Design-review fixes - 2026-07-22
   (Divi global button text color is fixed at source in Theme
   Options: all_buttons_text_color #111010 on amber - 12.9:1.)
   ============================================================ */

/* CONVERSION CRITICAL: amber buttons had white text (1.6:1 - unreadable).
   Divi's own text-color option only outputs under a helper class the body
   never gets, so we enforce black-on-amber (12.9:1) here. */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce a.checkout-button,
.woocommerce #respond input#submit,
.woocommerce-message a.button.wc-forward,
body .et_pb_button,
.single_add_to_cart_button {
	color: #111010 !important;
}

/* Divi THEME BUILDER Woo modules (cart/checkout layouts) carry their own
   per-module color:#FFFFFF!important at #page-container specificity - these
   selectors out-rank them (4+ classes behind the same ID). Covers the
   current cart modules and future et_pb_wc_* checkout modules alike. */
body #page-container .et_pb_section [class*="et_pb_wc_"] table.cart button.button.button,
body #page-container .et_pb_section [class*="et_pb_wc_"] .coupon button.button.button,
body #page-container .et_pb_section [class*="et_pb_wc_"] table.cart button.button.button:hover,
body #page-container .et_pb_section [class*="et_pb_wc_"] a.checkout-button.button,
body #page-container .et_pb_section [class*="et_pb_wc_"] button.button.button,
body #page-container .et_pb_section [class*="et_pb_wc_"] a.button.wc-backward,
body #page-container .et_pb_section [class*="et_pb_wc_"] a.button.wc-forward {
	color: #111010 !important;
}
body #page-container .et_pb_section [class*="et_pb_wc_"] a.checkout-button.button:hover,
body #page-container .et_pb_section [class*="et_pb_wc_"] button.button.button:hover,
body #page-container .et_pb_section [class*="et_pb_wc_"] a.button.wc-backward:hover,
body #page-container .et_pb_section [class*="et_pb_wc_"] a.button.wc-forward:hover {
	color: #111010 !important;
}

/* ...but the Account Suite's own dark buttons keep their white text
   (they sit inside .fml-acc-card and are black-filled). */
.fml-acc-card button.button,
.fml-acc-card .button[type="submit"],
.fml-acc-card .fml-acc-submit {
	color: #ffffff !important;
}

/* A11y: amber inline links on white were 1.8:1 - use brand brown (4.5:1).
   Scope: the My Account content module + Woo notice links. */
#dl-account a,
.woocommerce-message a,
.woocommerce-info a {
	color: #8E7159 !important;
}

/* Woo notice bars: dark text instead of white on the amber bar
   (module-level selector needed to beat Divi TB module styles) */
.woocommerce-message,
.woocommerce-info,
body #page-container .et_pb_section [class*="et_pb_wc_"] .woocommerce-message,
body #page-container .et_pb_section [class*="et_pb_wc_"] .woocommerce-info {
	color: #111010 !important;
}

/* Amber utility links in cart/checkout (Calculate shipping etc) -> brown */
.woocommerce-cart .cart_totals a:not(.button),
.woocommerce-checkout .cart_totals a:not(.button),
.woocommerce-shipping-calculator a {
	color: #8E7159 !important;
}

/* Mobile hamburger + close icon: brand black, not the leftover accent */
.mobile_menu_bar:before,
.mobile_menu_bar_toggle:before,
.et_close_search_field:after {
	color: #111010 !important;
}

/* Header account trio (injected by fml-account-suite on both menus) */
li.fml-hdr-account a { font-weight: 600; }
li.fml-hdr-wish a,
li.fml-hdr-cart a { display: inline-flex; align-items: center; }
.fml-hdr-cart-count {
	display: inline-block; vertical-align: super;
	margin: -10px 0 0 3px;
	background: #FFC03F; color: #111010;
	font-size: 10px; font-weight: 700; border-radius: 999px;
	min-width: 16px; height: 16px; line-height: 16px;
	text-align: center; padding: 0 3px;
}
li.fml-hdr-account a,
li.fml-hdr-wish a,
li.fml-hdr-cart a { padding: 0 6px !important; }
li.fml-hdr-wish .fas-wishlist-header-icon svg { width: 18px; height: 18px; }
/* avoid a double cart: hide Divi menu-module's own cart icon */
.et_pb_menu__icon.et_pb_menu__cart-button { display: none !important; }

/* Logged-in My Account: WonderLab-style 2-column layout
   (left nav pills / right content). Guests keep the suite's own shell. */
body.woocommerce-account.logged-in #dl-account .woocommerce {
	display: grid;
	grid-template-columns: 250px minmax(0, 1fr);
	grid-template-rows: auto 1fr;
	gap: 0 28px;
	align-items: start;
}
/* explicit placement: the invisible notices wrapper was stealing cell 1,
   pushing the nav wide-right and the content into the narrow column */
body.woocommerce-account.logged-in #dl-account .woocommerce > .woocommerce-notices-wrapper {
	grid-column: 1 / -1;
	grid-row: 1;
}
body.woocommerce-account.logged-in #dl-account .woocommerce > .woocommerce-MyAccount-navigation {
	grid-column: 1;
	grid-row: 2;
}
body.woocommerce-account.logged-in #dl-account .woocommerce > .woocommerce-MyAccount-content {
	grid-column: 2;
	grid-row: 2;
}
body.woocommerce-account.logged-in .woocommerce-MyAccount-navigation,
body.woocommerce-account.logged-in .woocommerce-MyAccount-content {
	width: 100% !important;
	float: none !important;
}
/* the page module caps the account area at 800px - give the dashboard room */
body.woocommerce-account.logged-in #dl-account {
	max-width: 1140px !important;
	width: 100% !important;
}
@media (max-width: 800px) {
	body.woocommerce-account.logged-in #dl-account .woocommerce {
		display: block; /* suite turns the nav into a horizontal scroller */
	}
}

/* Logged-in My Account: guarantee clear space below the fixed header
   (the old Divi H1 section used to provide this spacing; it was removed
   with the icon-tiles). Guests get spacing from the suite shell already. */
body.woocommerce-account.logged-in #main-content {
	padding-top: 100px;
}
body.woocommerce-account.logged-in #main-content .woocommerce {
	margin-top: 12px;
}

/* Cart page: clear the overhanging script logo (it drops below the
   header bar) + breathing room. Checkout template has its own header. */
main.fcf-cart-main-wrap {
	padding-top: 180px !important; /* plugin css sets shorthand padding AND
	   this template misses Divi's fixed-header offset - both beaten here */
}
@media (max-width: 800px) {
	main.fcf-cart-main-wrap { padding-top: 150px !important; }
}

/* Guest account pages: extra clearance under the overhanging logo */
body.fml-account-body #page-container #main-content {
	padding-top: 88px !important;
}

/* A11y: visible keyboard focus, brand-consistent */
a:focus-visible,
button:focus-visible,
input:focus-visible,
.et_pb_button:focus-visible {
	outline: 2px solid #8E7159;
	outline-offset: 2px;
}

/* v1.1.2: black controls always read WHITE - Divi TB module link/text colors
   carry #page-container ID weight and out-rank the plugins' class-level
   !important rules, leaving dark text on black backgrounds. Match the ID
   weight here. (Lee, 2026-07-29) */
#page-container .woocommerce-MyAccount-navigation ul li.is-active a,
#page-container .woocommerce-MyAccount-navigation ul li.is-active a:hover,
#page-container .woocommerce-MyAccount-navigation ul li.is-active a:focus,
#page-container .wd-btn-primary,
#page-container .wd-btn-primary:hover,
#page-container .wd-btn-primary:focus,
#page-container .wd-order-detail-actions .wd-btn-primary,
#page-container .fml-redeem-apply,
#page-container .fml-redeem-apply:hover,
#page-container .woocommerce-Address .edit,
#page-container .woocommerce-Address .edit:hover,
#page-container .woocommerce-message .button,
#page-container .fcf-side-cart-checkout,
#page-container .fcf-side-cart-checkout:hover,
#page-container .fcf-side-cart-qty-btn:hover,
#page-container .fml-acc-card button[type="submit"],
#page-container .fml-acc-card button[type="submit"]:hover {
	color: #ffffff !important;
}