/**
 * Good Choice Kadence Child - Main Styles
 *
 * @package Good_Choice_Kadence_Child
 * @since 1.0.0
 */

/* ==========================================================================
   Font Loading (Google Fonts)
   ========================================================================== */

/**
 * Load Roboto (Body) and Lato (Headings) from Google Fonts
 * Weights: Roboto 500, Lato 700
 */
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@700&family=Roboto:wght@500&display=swap');

/* ==========================================================================
   Header Background & Logo
   ========================================================================== */

/**
 * Main Header Background Image
 * Applies to Kadence's primary header area
 */
#masthead,
.site-header-wrap,
.site-top-header-wrap {
  background-image: url('../images/header-bg.png');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

/* Ensure header content remains readable over background */
.site-header-wrap {
  position: relative;
}

/* Optional: Add subtle overlay for better text contrast */
.site-header-wrap::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.85);
  z-index: 0;
  pointer-events: none;
}

.site-header-wrap > * {
  position: relative;
  z-index: 1;
}

/* ==========================================================================
   Site Branding - Good Choice Styled Text
   ========================================================================== */

/**
 * Site Title: "Good" (Orange) + "Choice" (Blue)
 * Clean styling with no background
 */
.site-branding .site-title-wrap {
  display: inline-block;
  vertical-align: middle;
}

.site-branding .site-title,
.site-branding .site-title p,
.site-branding .site-title a {
  font-size: 48px !important;
  font-weight: 700 !important;
  line-height: 1.2;
  margin: 0;
  text-decoration: none !important;
}

/* Styled spans for Good (orange) and Choice (blue) - Force colors always */
.site-branding .site-title .good-text,
.site-title .good-text,
.branding-layout-standard .good-text,
.site-branding a .good-text {
  color: #ff8c00 !important;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
  font-size: 58px !important;
  font-weight: 700 !important;
}

.site-branding .site-title .choice-text,
.site-title .choice-text,
.branding-layout-standard .choice-text,
.site-branding a .choice-text {
  color: #1e90ff !important;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
  font-size: 58px !important;
  font-weight: 700 !important;
}

.site-branding .brand {
  display: flex;
  align-items: center;
  gap: 15px;
}

/* Site logo - default width 235px (user settings can override) */
.site-branding a.brand img,
.custom-logo {
  max-width: 235px;
  height: auto;
}

/* Tagline styling - 30% bigger (16px * 1.3 = 20.8px) */
.site-branding .site-description,
.site-description {
  display: block !important;
  font-size: 21px !important;
  font-weight: 400;
  color: #ffffff !important;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
  margin-top: 5px;
}

/* Navigation Bar - Orange Background */
.main-navigation,
.header-navigation-wrap,
.site-main-header-wrap .site-header-row-container-inner {
  background: #ff8c00 !important; /* Solid orange */
  width: 100%;
}

.site-main-header-wrap {
  background: #ff8c00 !important;
}

.main-navigation .primary-menu-container > ul > li.menu-item > a {
  color: #1c1917 !important; /* Dark text on orange */
  font-weight: 500;
}

.main-navigation .primary-menu-container > ul > li.menu-item > a:hover {
  color: #ffffff !important;
}

/* Remove border radius for straight corners */
.site-main-header-wrap,
.site-header-row-container,
.header-navigation-wrap {
  border-radius: 0 !important;
}

/* ==========================================================================
   Global Semantics
   ========================================================================== */

/**
 * Links
 * Uses semantic tokens, respects Customizer overrides
 */
a {
  color: var(--theme-link);
}

a:hover,
a:focus {
  color: var(--theme-link-hover);
}

/**
 * Headings
 * Color only, no typography override
 */
h1, h2, h3, h4, h5, h6,
.entry-title,
.site-title {
  color: var(--theme-heading);
}

/**
 * Body Text
 */
body {
  color: var(--theme-body);
}

/* ==========================================================================
   WooCommerce Overrides (Minimal, Token-Based)
   Compatible with Kadence Shop Kit
   ========================================================================== */

/**
 * Buttons
 */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page input.button {
  background-color: var(--wp--preset--color--primary);
  border-color: var(--wp--preset--color--primary);
  color: #fff;
  border: 1px solid var(--wp--preset--color--primary);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce-page a.button:hover,
.woocommerce-page button.button:hover,
.woocommerce-page input.button:hover {
  background-color: var(--wp--preset--color--primary-hover);
  border-color: var(--wp--preset--color--primary-hover);
}

.woocommerce a.button:focus,
.woocommerce button.button:focus,
.woocommerce input.button:focus,
.woocommerce #respond input#submit:focus {
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 2px;
}

/**
 * Alt/Secondary Buttons
 */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background-color: var(--wp--preset--color--accent);
  border-color: var(--wp--preset--color--accent);
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
  background-color: var(--wp--preset--color--secondary);
  border-color: var(--wp--preset--color--secondary);
}

/**
 * Notices
 */
.woocommerce-message,
.woocommerce-info {
  border-top-color: var(--wp--preset--color--info);
  background-color: var(--wp--preset--color--surface);
}

.woocommerce-message::before,
.woocommerce-info::before {
  color: var(--wp--preset--color--info);
}

.woocommerce-error {
  border-top-color: var(--wp--preset--color--danger);
  background-color: var(--wp--preset--color--surface);
}

.woocommerce-error::before {
  color: var(--wp--preset--color--danger);
}

/**
 * Prices
 */
.woocommerce .price,
.woocommerce-page .price,
.woocommerce .amount,
.woocommerce-page .amount {
  color: var(--wp--preset--color--primary);
}

.woocommerce .price ins,
.woocommerce-page .price ins {
  color: var(--wp--preset--color--success);
  text-decoration: none;
}

.woocommerce .price del,
.woocommerce-page .price del {
  color: var(--wp--preset--color--muted);
}

/**
 * Product Links
 */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h3 {
  color: var(--theme-heading);
}

.woocommerce ul.products li.product a {
  color: var(--theme-link);
}

.woocommerce ul.products li.product a:hover {
  color: var(--theme-link-hover);
}

/**
 * Form Fields
 */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text,
.woocommerce-page form .form-row textarea,
.woocommerce-page form .form-row select {
  border-color: var(--wp--preset--color--border);
  background-color: var(--wp--preset--color--background);
  color: var(--wp--preset--color--text);
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
  border-color: var(--wp--preset--color--primary);
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 0;
}

/**
 * Tabs
 */
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  border-color: var(--wp--preset--color--border);
  background-color: var(--wp--preset--color--surface);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  background-color: var(--wp--preset--color--background);
  border-bottom-color: var(--wp--preset--color--background);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: var(--wp--preset--color--text);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--wp--preset--color--primary);
}

/**
 * Sale Badge
 */
.woocommerce span.onsale,
.woocommerce-page span.onsale {
  background-color: var(--wp--preset--color--danger);
  color: var(--wp--preset--color--background);
}

/**
 * Star Rating
 */
.woocommerce .star-rating span,
.woocommerce-page .star-rating span {
  color: var(--wp--preset--color--warning);
}

/**
 * Cart Table
 */
.woocommerce-cart table.cart td,
.woocommerce-cart table.cart th {
  border-color: var(--wp--preset--color--border);
}

.woocommerce table.shop_table {
  border-color: var(--wp--preset--color--border);
}

.woocommerce table.shop_table td,
.woocommerce table.shop_table th {
  border-color: var(--wp--preset--color--border);
}

/**
 * Checkout
 */
.woocommerce-checkout #payment {
  background-color: var(--wp--preset--color--surface);
  border-color: var(--wp--preset--color--border);
}

.woocommerce-checkout #payment div.payment_box {
  background-color: var(--wp--preset--color--background);
  color: var(--wp--preset--color--text);
}

.woocommerce-checkout #payment div.payment_box::before {
  border-bottom-color: var(--wp--preset--color--background);
}

/* ==========================================================================
   WooCommerce Enhancements (Phase 2)
   Focus states, disabled states, accessibility improvements
   ========================================================================== */

/**
 * Button Focus States (Keyboard Accessibility)
 */
.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.woocommerce input.button:focus-visible,
.woocommerce #respond input#submit:focus-visible {
  outline: 3px solid var(--wp--preset--color--primary);
  outline-offset: 3px;
  box-shadow: 0 0 0 3px var(--wp--preset--color--background);
}

.woocommerce a.button.alt:focus-visible,
.woocommerce button.button.alt:focus-visible,
.woocommerce input.button.alt:focus-visible {
  outline: 3px solid var(--wp--preset--color--accent);
  outline-offset: 3px;
}

/**
 * Disabled Button States
 */
.woocommerce a.button:disabled,
.woocommerce button.button:disabled,
.woocommerce input.button:disabled,
.woocommerce a.button.disabled,
.woocommerce button.button.disabled,
.woocommerce input.button.disabled {
  background-color: var(--wp--preset--color--muted);
  border-color: var(--wp--preset--color--muted);
  color: var(--wp--preset--color--background);
  opacity: 0.6;
  cursor: not-allowed;
}

.woocommerce a.button:disabled:hover,
.woocommerce button.button:disabled:hover,
.woocommerce input.button:disabled:hover {
  background-color: var(--wp--preset--color--muted);
  border-color: var(--wp--preset--color--muted);
}

/**
 * Sale Badge (Subtle, Organic)
 */
.woocommerce span.onsale,
.woocommerce-page span.onsale {
  background-color: var(--wp--preset--color--accent);
  color: var(--wp--preset--color--background);
  border-radius: 0.25rem;
  font-weight: 600;
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
}

/**
 * Product Out of Stock Badge
 */
.woocommerce ul.products li.product .outofstock-badge {
  background-color: var(--wp--preset--color--muted);
  color: var(--wp--preset--color--background);
  border-radius: 0.25rem;
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
}

/**
 * Form Field Focus Enhancement
 */
.woocommerce form .form-row input.input-text:focus-visible,
.woocommerce form .form-row textarea:focus-visible,
.woocommerce form .form-row select:focus-visible {
  border-color: var(--wp--preset--color--primary);
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(138, 90, 46, 0.1);
}

/**
 * Quantity Input Focus
 */
.woocommerce .quantity input.qty:focus,
.woocommerce-page .quantity input.qty:focus {
  border-color: var(--wp--preset--color--primary);
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 0;
}

/* ==========================================================================
   Block Support — Category Colors
   Editorial usage only, not exposed in editor palette
   ========================================================================== */

/**
 * Diabetes Category
 */
.has-cat-diabetes-color {
  color: var(--wp--preset--color--cat-diabetes);
}

.has-cat-diabetes-background-color {
  background-color: var(--wp--preset--color--cat-diabetes);
  color: var(--wp--preset--color--background);
}

.has-cat-diabetes-border-color {
  border-color: var(--wp--preset--color--cat-diabetes);
}

/**
 * Nutrition Category
 */
.has-cat-nutrition-color {
  color: var(--wp--preset--color--cat-nutrition);
}

.has-cat-nutrition-background-color {
  background-color: var(--wp--preset--color--cat-nutrition);
  color: var(--wp--preset--color--background);
}

.has-cat-nutrition-border-color {
  border-color: var(--wp--preset--color--cat-nutrition);
}

/**
 * Medical Category
 */
.has-cat-medical-color {
  color: var(--wp--preset--color--cat-medical);
}

.has-cat-medical-background-color {
  background-color: var(--wp--preset--color--cat-medical);
  color: var(--wp--preset--color--background);
}

.has-cat-medical-border-color {
  border-color: var(--wp--preset--color--cat-medical);
}

/* ==========================================================================
   Editorial Callouts
   Calm, accessible styling for medical/nutrition content
   ========================================================================== */

/**
 * Info Callout (Medical Information)
 */
.wp-block-group.is-style-info-callout,
.has-info-background-color {
  background-color: var(--wp--preset--color--surface);
  border-left: 4px solid var(--wp--preset--color--info);
  padding: 1.5rem;
  border-radius: 0.375rem;
}

/**
 * Warning Callout (Important Nutrition Information)
 */
.wp-block-group.is-style-warning-callout,
.has-warning-background-color.wp-block-group {
  background-color: var(--wp--preset--color--surface);
  border-left: 4px solid var(--wp--preset--color--warning);
  padding: 1.5rem;
  border-radius: 0.375rem;
}

/**
 * Success Callout (Positive Health Tips)
 */
.wp-block-group.is-style-success-callout,
.has-success-background-color.wp-block-group {
  background-color: var(--wp--preset--color--surface);
  border-left: 4px solid var(--wp--preset--color--success);
  padding: 1.5rem;
  border-radius: 0.375rem;
}

/**
 * Danger Callout (Critical Health Information)
 */
.wp-block-group.is-style-danger-callout,
.has-danger-background-color.wp-block-group {
  background-color: var(--wp--preset--color--surface);
  border-left: 4px solid var(--wp--preset--color--danger);
  padding: 1.5rem;
  border-radius: 0.375rem;
}

/**
 * Category-Specific Callouts
 */
.wp-block-group.is-style-diabetes-callout {
  background-color: var(--wp--preset--color--surface);
  border-left: 4px solid var(--wp--preset--color--cat-diabetes);
  padding: 1.5rem;
  border-radius: 0.375rem;
}

.wp-block-group.is-style-nutrition-callout {
  background-color: var(--wp--preset--color--surface);
  border-left: 4px solid var(--wp--preset--color--cat-nutrition);
  padding: 1.5rem;
  border-radius: 0.375rem;
}

.wp-block-group.is-style-medical-callout {
  background-color: var(--wp--preset--color--surface);
  border-left: 4px solid var(--wp--preset--color--cat-medical);
  padding: 1.5rem;
  border-radius: 0.375rem;
}

/* ==========================================================================
   Typography Refinements (Phase 3)
   Editorial + WooCommerce typography polish
   ========================================================================== */

/**
 * Editorial Block Typography
 */

/* Quote Citations */
.wp-block-quote cite {
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--small);
  font-style: normal;
  font-weight: 500;
  color: var(--wp--preset--color--muted);
  letter-spacing: 0.025em;
}

/* List Styling */
.wp-block-list li {
  margin-bottom: 0.5rem;
}

.wp-block-list li:last-child {
  margin-bottom: 0;
}

/* Code Blocks */
.wp-block-code code {
  font-family: 'Courier New', monospace;
  font-size: var(--wp--preset--font-size--small);
  line-height: 1.6;
}

/* Preformatted Text */
.wp-block-preformatted {
  font-family: 'Courier New', monospace;
  font-size: var(--wp--preset--font-size--small);
  line-height: 1.6;
}

/* ==========================================================================
   WooCommerce Typography Refinements
   Integrated, editorial-tone commerce styling
   ========================================================================== */

/**
 * Product Titles
 */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h3 {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--large);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.015em;
  margin-bottom: 0.5rem;
}

.woocommerce div.product .product_title {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--xx-large);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.015em;
  margin-bottom: 1rem;
}

/**
 * Price Typography
 */
.woocommerce .price,
.woocommerce-page .price {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--large);
  font-weight: 700;
  line-height: 1;
}

.woocommerce ul.products li.product .price {
  font-size: var(--wp--preset--font-size--medium);
  margin-top: 0.5rem;
}

.woocommerce div.product p.price {
  font-size: var(--wp--preset--font-size--x-large);
  margin-bottom: 1rem;
}

/**
 * Button Typography (Enhanced)
 */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 700;
  letter-spacing: 0.025em;
  line-height: 1;
}

/**
 * Notice Typography
 */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 500;
  line-height: 1.6;
}

/**
 * Form Labels
 */
.woocommerce form .form-row label,
.woocommerce-page form .form-row label {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 700;
  letter-spacing: 0.025em;
  color: var(--wp--preset--color--text);
  margin-bottom: 0.5rem;
  display: block;
}

/**
 * Form Inputs
 */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 500;
  line-height: 1.5;
}

/**
 * Tab Labels
 */
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 700;
  letter-spacing: 0.025em;
}

/**
 * Product Meta
 */
.woocommerce div.product .product_meta {
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 500;
  line-height: 1.6;
  color: var(--wp--preset--color--muted);
}

.woocommerce div.product .product_meta a {
  font-weight: 500;
  color: var(--wp--preset--color--primary-hover);
}

/**
 * Product Short Description
 */
.woocommerce div.product .woocommerce-product-details__short-description {
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 500;
  line-height: 1.7;
  margin-bottom: 1.5rem;
}

/**
 * Sale Badge Typography
 */
.woocommerce span.onsale {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1;
}

/**
 * Cart/Checkout Headings
 */
.woocommerce-cart .cart-collaterals h2,
.woocommerce-checkout h3 {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--x-large);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.015em;
  margin-bottom: 1rem;
}

/**
 * Cart Table Typography
 */
.woocommerce table.shop_table th,
.woocommerce table.cart th {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.woocommerce table.shop_table td,
.woocommerce table.cart td {
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 500;
  line-height: 1.5;
}

/**
 * Order Review Typography
 */
.woocommerce-checkout-review-order th,
.woocommerce-checkout-review-order td {
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 500;
  line-height: 1.5;
}

.woocommerce-checkout-review-order .order-total th,
.woocommerce-checkout-review-order .order-total td {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--large);
  font-weight: 700;
}

/**
 * Payment Method Labels
 */
.woocommerce-checkout #payment ul.payment_methods li label {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 700;
  line-height: 1.4;
}

/**
 * Widget Titles (Sidebar)
 */
.woocommerce .widget-title,
.woocommerce-page .widget-title {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--large);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.015em;
  margin-bottom: 1rem;
}

/**
 * Product Categories
 */
.woocommerce ul.products li.product .woocommerce-loop-category__title {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--large);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.015em;
}

/**
 * Reviews / Testimonials
 */
.woocommerce #reviews #comments ol.commentlist li .comment-text p {
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 500;
  line-height: 1.7;
}

.woocommerce #reviews #comments ol.commentlist li .meta {
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 700;
  letter-spacing: 0.025em;
}

/**
 * Breadcrumbs
 */
.woocommerce .woocommerce-breadcrumb {
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 500;
  line-height: 1.5;
  color: var(--wp--preset--color--muted);
}

.woocommerce .woocommerce-breadcrumb a {
  font-weight: 500;
  color: var(--wp--preset--color--primary-hover);
}

/* ==========================================================================
   PHASE 4: BRAND COMPONENT SYSTEM
   Editorial callouts, disclaimers, and category-driven components
   ========================================================================== */

/**
 * Editorial Callouts
 * Reusable semantic callout styles for editorial content
 * Usage: Apply .gc-callout--{variant} to group blocks or custom elements
 */

/* Base Callout Style */
.gc-callout {
  padding: 1.5rem;
  border-radius: 0.5rem;
  border-left: 4px solid transparent;
  margin-bottom: var(--wp--preset--spacing--md);
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 500;
  line-height: 1.7;
}

.gc-callout > *:last-child {
  margin-bottom: 0;
}

/* Info Callout - Medical Information */
.gc-callout--info {
  background-color: var(--wp--preset--color--surface);
  border-left-color: var(--wp--preset--color--info);
  color: var(--wp--preset--color--text);
}

.gc-callout--info strong,
.gc-callout--info b {
  color: var(--wp--preset--color--info);
}

/* Success Callout - Positive Health Tips */
.gc-callout--success {
  background-color: var(--wp--preset--color--surface);
  border-left-color: var(--wp--preset--color--success);
  color: var(--wp--preset--color--text);
}

.gc-callout--success strong,
.gc-callout--success b {
  color: var(--wp--preset--color--success);
}

/* Warning Callout - Important Nutrition Information */
.gc-callout--warning {
  background-color: var(--wp--preset--color--surface);
  border-left-color: var(--wp--preset--color--warning);
  color: var(--wp--preset--color--text);
}

.gc-callout--warning strong,
.gc-callout--warning b {
  color: var(--wp--preset--color--warning);
}

/* Danger Callout - Critical Health Information */
.gc-callout--danger {
  background-color: var(--wp--preset--color--surface);
  border-left-color: var(--wp--preset--color--danger);
  color: var(--wp--preset--color--text);
}

.gc-callout--danger strong,
.gc-callout--danger b {
  color: var(--wp--preset--color--danger);
}

/* Callout Headings */
.gc-callout h2,
.gc-callout h3,
.gc-callout h4,
.gc-callout h5,
.gc-callout h6 {
  font-family: var(--wp--preset--font-family--heading);
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 0.75rem;
}

/* Callout Links */
.gc-callout a {
  color: var(--wp--preset--color--primary-hover);
  text-decoration: underline;
  font-weight: 500;
}

.gc-callout a:hover {
  color: var(--wp--preset--color--primary);
}

/**
 * Medical / Nutrition Disclaimers
 * Neutral, professional, non-alarmist tone
 */
.gc-disclaimer {
  padding: 1rem 1.25rem;
  background-color: var(--wp--preset--color--surface);
  border: 1px solid var(--wp--preset--color--border);
  border-radius: 0.375rem;
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 500;
  line-height: 1.6;
  color: var(--wp--preset--color--muted);
  margin-top: var(--wp--preset--spacing--lg);
  margin-bottom: var(--wp--preset--spacing--md);
}

.gc-disclaimer strong,
.gc-disclaimer b {
  color: var(--wp--preset--color--text);
  font-weight: 700;
}

.gc-disclaimer a {
  color: var(--wp--preset--color--primary-hover);
  text-decoration: underline;
}

.gc-disclaimer > *:last-child {
  margin-bottom: 0;
}

/* Disclaimer Icon (Optional) */
.gc-disclaimer::before {
  content: "ⓘ ";
  font-style: normal;
  font-weight: 700;
  color: var(--wp--preset--color--muted);
  margin-right: 0.25rem;
}

/**
 * Category-Driven Block Styling
 * Enable category color usage inside blocks with readability safeguards
 */

/* Diabetes Category Blocks */
.has-cat-diabetes-background-color {
  background-color: var(--wp--preset--color--cat-diabetes);
  color: var(--wp--preset--color--background);
  padding: 1.5rem;
  border-radius: 0.5rem;
}

.has-cat-diabetes-background-color h1,
.has-cat-diabetes-background-color h2,
.has-cat-diabetes-background-color h3,
.has-cat-diabetes-background-color h4,
.has-cat-diabetes-background-color h5,
.has-cat-diabetes-background-color h6 {
  color: var(--wp--preset--color--background);
}

.has-cat-diabetes-background-color a {
  color: var(--wp--preset--color--background);
  text-decoration: underline;
  font-weight: 700;
}

/* Nutrition Category Blocks */
.has-cat-nutrition-background-color {
  background-color: var(--wp--preset--color--cat-nutrition);
  color: var(--wp--preset--color--background);
  padding: 1.5rem;
  border-radius: 0.5rem;
}

.has-cat-nutrition-background-color h1,
.has-cat-nutrition-background-color h2,
.has-cat-nutrition-background-color h3,
.has-cat-nutrition-background-color h4,
.has-cat-nutrition-background-color h5,
.has-cat-nutrition-background-color h6 {
  color: var(--wp--preset--color--background);
}

.has-cat-nutrition-background-color a {
  color: var(--wp--preset--color--background);
  text-decoration: underline;
  font-weight: 700;
}

/* Medical Category Blocks */
.has-cat-medical-background-color {
  background-color: var(--wp--preset--color--cat-medical);
  color: var(--wp--preset--color--background);
  padding: 1.5rem;
  border-radius: 0.5rem;
}

.has-cat-medical-background-color h1,
.has-cat-medical-background-color h2,
.has-cat-medical-background-color h3,
.has-cat-medical-background-color h4,
.has-cat-medical-background-color h5,
.has-cat-medical-background-color h6 {
  color: var(--wp--preset--color--background);
}

.has-cat-medical-background-color a {
  color: var(--wp--preset--color--background);
  text-decoration: underline;
  font-weight: 700;
}

/* Category Border Variants */
.has-cat-diabetes-border-color {
  border-color: var(--wp--preset--color--cat-diabetes);
  border-width: 3px;
  border-style: solid;
}

.has-cat-nutrition-border-color {
  border-color: var(--wp--preset--color--cat-nutrition);
  border-width: 3px;
  border-style: solid;
}

.has-cat-medical-border-color {
  border-color: var(--wp--preset--color--cat-medical);
  border-width: 3px;
  border-style: solid;
}

/* ==========================================================================
   PHASE 4: ADVANCED WOOCOMMERCE STYLING
   Product cards, cart/checkout polish, and interactive states
   ========================================================================== */

/**
 * Product Cards & Listings - Enhanced
 */

/* Product Card Container */
.woocommerce ul.products li.product {
  position: relative;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.woocommerce ul.products li.product:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(29, 25, 23, 0.1);
}

/* Product Image Enhancement */
.woocommerce ul.products li.product .woocommerce-loop-product__link {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: 0.5rem;
}

.woocommerce ul.products li.product img {
  transition: transform 0.3s ease;
  border-radius: 0.5rem;
}

.woocommerce ul.products li.product:hover img {
  transform: scale(1.05);
}

/* Product Title Hover */
.woocommerce ul.products li.product .woocommerce-loop-product__title:hover,
.woocommerce ul.products li.product h3:hover {
  color: var(--wp--preset--color--primary);
  transition: color 0.2s ease;
}

/* Price Enhancement */
.woocommerce ul.products li.product .price {
  display: block;
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

/* Sale Badge - Refined */
.woocommerce ul.products li.product .onsale {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 2;
  background-color: var(--wp--preset--color--accent);
  color: var(--wp--preset--color--background);
  padding: 0.375rem 0.75rem;
  border-radius: 0.375rem;
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  box-shadow: 0 2px 8px rgba(29, 25, 23, 0.15);
}

/* Add to Cart Button - Product Loop */
.woocommerce ul.products li.product .button {
  width: 100%;
  text-align: center;
  margin-top: 0.75rem;
  transition: all 0.2s ease;
}

.woocommerce ul.products li.product .button:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 8px rgba(138, 90, 46, 0.2);
}

/* Out of Stock Badge */
.woocommerce ul.products li.product .outofstock-badge {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  z-index: 2;
  background-color: var(--wp--preset--color--muted);
  color: var(--wp--preset--color--background);
  padding: 0.375rem 0.75rem;
  border-radius: 0.375rem;
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--small);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/**
 * Single Product Page - Enhanced
 */

/* Product Summary Container */
.woocommerce div.product .summary {
  position: relative;
}

/* Product Meta Links */
.woocommerce div.product .product_meta a:hover {
  color: var(--wp--preset--color--primary);
  transition: color 0.2s ease;
}

/* Quantity Input - Enhanced */
.woocommerce div.product form.cart .quantity {
  margin-right: 0.75rem;
}

.woocommerce .quantity input.qty {
  border: 2px solid var(--wp--preset--color--border);
  border-radius: 0.375rem;
  padding: 0.5rem 0.75rem;
  font-family: var(--wp--preset--font-family--heading);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 700;
  text-align: center;
  transition: border-color 0.2s ease;
}

.woocommerce .quantity input.qty:hover {
  border-color: var(--wp--preset--color--primary);
}

.woocommerce .quantity input.qty:focus {
  border-color: var(--wp--preset--color--primary);
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 2px;
}

/* Add to Cart Button - Single Product */
.woocommerce div.product form.cart .button {
  padding: 0.875rem 2rem;
  transition: all 0.2s ease;
}

.woocommerce div.product form.cart .button:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 12px rgba(138, 90, 46, 0.25);
}

/**
 * Cart & Checkout Polish
 */

/* Cart Table Enhancement */
.woocommerce-cart table.cart {
  border-radius: 0.5rem;
  overflow: hidden;
  border: 1px solid var(--wp--preset--color--border);
}

.woocommerce-cart table.cart thead {
  background-color: var(--wp--preset--color--surface);
}

.woocommerce-cart table.cart tbody tr {
  transition: background-color 0.2s ease;
}

.woocommerce-cart table.cart tbody tr:hover {
  background-color: var(--wp--preset--color--surface);
}

/* Cart Product Thumbnail */
.woocommerce-cart table.cart img {
  border-radius: 0.375rem;
  border: 1px solid var(--wp--preset--color--border);
}

/* Remove Button */
.woocommerce a.remove {
  color: var(--wp--preset--color--danger) !important;
  font-weight: 700;
  transition: transform 0.2s ease;
}

.woocommerce a.remove:hover {
  color: var(--wp--preset--color--danger) !important;
  transform: scale(1.2);
}

/* Cart Totals */
.woocommerce-cart .cart-collaterals .cart_totals {
  background-color: var(--wp--preset--color--surface);
  padding: 1.5rem;
  border-radius: 0.5rem;
  border: 1px solid var(--wp--preset--color--border);
}

.woocommerce-cart .cart-collaterals .cart_totals h2 {
  margin-top: 0;
  padding-bottom: 1rem;
  border-bottom: 2px solid var(--wp--preset--color--border);
}

/* Cart Totals Table */
.woocommerce table.shop_table.shop_table_responsive tr {
  border-bottom: 1px solid var(--wp--preset--color--border);
}

.woocommerce table.shop_table.shop_table_responsive .order-total th,
.woocommerce table.shop_table.shop_table_responsive .order-total td {
  padding-top: 1rem;
  padding-bottom: 0;
  font-size: var(--wp--preset--font-size--x-large);
  color: var(--wp--preset--color--primary);
}

/* Coupon Field */
.woocommerce-cart .coupon {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  margin-bottom: 1rem;
}

.woocommerce-cart .coupon input.input-text {
  flex: 1;
  padding: 0.75rem 1rem;
  border: 2px solid var(--wp--preset--color--border);
  border-radius: 0.375rem;
  font-family: var(--wp--preset--font-family--body);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: 500;
  transition: border-color 0.2s ease;
}

.woocommerce-cart .coupon input.input-text:focus {
  border-color: var(--wp--preset--color--primary);
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 2px;
}

.woocommerce-cart .coupon button.button {
  background-color: var(--wp--preset--color--secondary);
  white-space: nowrap;
}

.woocommerce-cart .coupon button.button:hover {
  background-color: var(--wp--preset--color--accent);
}

/* Proceed to Checkout Button */
.woocommerce-cart .wc-proceed-to-checkout .button.checkout-button {
  width: 100%;
  padding: 1rem 2rem;
  font-size: var(--wp--preset--font-size--large);
  margin-top: 1rem;
  transition: all 0.2s ease;
}

.woocommerce-cart .wc-proceed-to-checkout .button.checkout-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(138, 90, 46, 0.3);
}

/* Checkout Form Enhancement */
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.woocommerce-checkout .woocommerce-additional-fields h3 {
  background-color: var(--wp--preset--color--surface);
  padding: 1rem 1.5rem;
  margin-bottom: 1.5rem;
  border-radius: 0.5rem;
  border-left: 4px solid var(--wp--preset--color--primary);
}

/* Checkout Input Fields */
.woocommerce-checkout .woocommerce-input-wrapper input.input-text,
.woocommerce-checkout .woocommerce-input-wrapper textarea,
.woocommerce-checkout .woocommerce-input-wrapper select {
  padding: 0.75rem 1rem;
  border: 2px solid var(--wp--preset--color--border);
  border-radius: 0.375rem;
  transition: all 0.2s ease;
}

.woocommerce-checkout .woocommerce-input-wrapper input.input-text:focus,
.woocommerce-checkout .woocommerce-input-wrapper textarea:focus,
.woocommerce-checkout .woocommerce-input-wrapper select:focus {
  border-color: var(--wp--preset--color--primary);
  box-shadow: 0 0 0 3px rgba(138, 90, 46, 0.1);
}

/* Order Review Section */
.woocommerce-checkout #order_review_heading {
  background-color: var(--wp--preset--color--surface);
  padding: 1rem 1.5rem;
  margin-bottom: 1rem;
  border-radius: 0.5rem;
  border-left: 4px solid var(--wp--preset--color--accent);
}

.woocommerce-checkout-review-order {
  background-color: var(--wp--preset--color--surface);
  padding: 1.5rem;
  border-radius: 0.5rem;
  border: 1px solid var(--wp--preset--color--border);
}

/* Payment Methods */
.woocommerce-checkout #payment {
  border-radius: 0.5rem;
}

.woocommerce-checkout #payment ul.payment_methods {
  border-bottom: 1px solid var(--wp--preset--color--border);
  padding-bottom: 1rem;
}

.woocommerce-checkout #payment ul.payment_methods li {
  padding: 0.75rem;
  border-radius: 0.375rem;
  transition: background-color 0.2s ease;
}

.woocommerce-checkout #payment ul.payment_methods li:hover {
  background-color: var(--wp--preset--color--background);
}

.woocommerce-checkout #payment ul.payment_methods li input[type="radio"]:checked + label {
  font-weight: 700;
  color: var(--wp--preset--color--primary);
}

/* Place Order Button */
.woocommerce-checkout #payment #place_order {
  width: 100%;
  padding: 1rem 2rem;
  font-size: var(--wp--preset--font-size--large);
  margin-top: 1rem;
  transition: all 0.2s ease;
}

.woocommerce-checkout #payment #place_order:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(138, 90, 46, 0.3);
}

/**
 * WooCommerce Interactive States
 * Hover, focus, disabled, and loading states
 */

/* Button States - Comprehensive */
.woocommerce a.button:active,
.woocommerce button.button:active,
.woocommerce input.button:active {
  transform: translateY(0);
  box-shadow: none;
}

.woocommerce a.button.loading,
.woocommerce button.button.loading,
.woocommerce input.button.loading {
  opacity: 0.7;
  cursor: wait;
  position: relative;
}

.woocommerce a.button.loading::after,
.woocommerce button.button.loading::after,
.woocommerce input.button.loading::after {
  content: "...";
  position: absolute;
  right: 0.5rem;
  animation: loading-dots 1.5s infinite;
}

@keyframes loading-dots {
  0%, 20% { content: "."; }
  40% { content: ".."; }
  60%, 100% { content: "..."; }
}

/* Form Field States */
.woocommerce form .form-row input.input-text:disabled,
.woocommerce form .form-row textarea:disabled,
.woocommerce form .form-row select:disabled {
  background-color: var(--wp--preset--color--surface);
  color: var(--wp--preset--color--muted);
  cursor: not-allowed;
  opacity: 0.6;
}

/* Invalid Field State */
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid textarea,
.woocommerce form .form-row.woocommerce-invalid select {
  border-color: var(--wp--preset--color--danger);
}

.woocommerce form .form-row.woocommerce-invalid label {
  color: var(--wp--preset--color--danger);
}

/* Valid Field State */
.woocommerce form .form-row.woocommerce-validated input.input-text,
.woocommerce form .form-row.woocommerce-validated textarea,
.woocommerce form .form-row.woocommerce-validated select {
  border-color: var(--wp--preset--color--success);
}

/* Checkbox and Radio Focus States */
.woocommerce input[type="checkbox"]:focus,
.woocommerce input[type="radio"]:focus {
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 2px;
}

/* Link States */
.woocommerce a:focus-visible {
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 2px;
  border-radius: 0.125rem;
}

/* Quantity Input Disabled */
.woocommerce .quantity input.qty:disabled {
  background-color: var(--wp--preset--color--surface);
  color: var(--wp--preset--color--muted);
  cursor: not-allowed;
  opacity: 0.6;
}

/* Notice Dismiss Button */
.woocommerce-message .woocommerce-Button,
.woocommerce-info .woocommerce-Button {
  transition: all 0.2s ease;
}

.woocommerce-message .woocommerce-Button:hover,
.woocommerce-info .woocommerce-Button:hover {
  transform: translateX(2px);
}

/* Star Rating Interactive */
.woocommerce .star-rating {
  transition: transform 0.2s ease;
}

.woocommerce a:hover .star-rating {
  transform: scale(1.05);
}

/* Product Thumbnails Gallery */
.woocommerce div.product .woocommerce-product-gallery__image {
  border-radius: 0.5rem;
  overflow: hidden;
  transition: transform 0.2s ease;
}

.woocommerce div.product .woocommerce-product-gallery__image:hover {
  transform: scale(1.02);
}

/* ==========================================================================
   PHASE 5: CSS HARDENING & PRODUCTION POLISH
   Final validation, normalization, and accessibility enhancements
   ========================================================================== */

/**
 * Global Focus Outline Normalization
 * Ensure consistent focus states across all interactive elements
 */
*:focus {
  outline-color: var(--wp--preset--color--primary);
}

*:focus:not(:focus-visible) {
  outline: none;
}

*:focus-visible {
  outline: 2px solid var(--wp--preset--color--primary);
  outline-offset: 2px;
}

/**
 * Skip to Content Link (Accessibility)
 * Hidden until focused via keyboard navigation
 */
.skip-link {
  position: absolute;
  top: -999px;
  left: -999px;
  background-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--background);
  padding: 1rem 1.5rem;
  font-family: var(--wp--preset--font-family--heading);
  font-weight: 700;
  text-decoration: none;
  z-index: 999999;
  border-radius: 0 0 0.375rem 0;
}

.skip-link:focus {
  top: 0;
  left: 0;
  outline: 3px solid var(--wp--preset--color--primary-hover);
  outline-offset: 2px;
}

/**
 * Reduced Motion Support (Accessibility)
 * Disable animations for users who prefer reduced motion
 */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/**
 * Print Styles
 * Optimize for printing (medical content may be printed frequently)
 */
@media print {
  /* Remove unnecessary elements */
  .woocommerce-breadcrumb,
  .woocommerce-product-gallery,
  .woocommerce form.cart,
  .related.products,
  .upsells.products,
  nav,
  footer,
  .skip-link {
    display: none !important;
  }

  /* Ensure text is black */
  body,
  p,
  li,
  h1, h2, h3, h4, h5, h6 {
    color: #000 !important;
  }

  /* Remove backgrounds */
  * {
    background: transparent !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }

  /* Show URLs for links */
  a[href]::after {
    content: " (" attr(href) ")";
    font-size: 0.875rem;
  }

  /* Prevent page breaks inside elements */
  .gc-callout,
  .gc-disclaimer,
  .wp-block-quote,
  .woocommerce-product-details__short-description {
    page-break-inside: avoid;
  }

  /* Ensure images fit page width */
  img {
    max-width: 100% !important;
  }
}

/**
 * High Contrast Mode Support (Windows)
 * Ensure borders and outlines remain visible
 */
@media (prefers-contrast: high) {
  .gc-callout,
  .gc-disclaimer,
  .woocommerce table.cart,
  .woocommerce-cart .cart_totals {
    border: 2px solid currentColor;
  }

  button,
  .woocommerce a.button,
  .woocommerce button.button,
  .woocommerce input.button {
    border: 2px solid currentColor;
  }
}

/**
 * Screen Reader Only Text
 * Utility class for accessibility
 */
.sr-only,
.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.sr-only:focus,
.screen-reader-text:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
  white-space: normal;
}

/**
 * Editor-Specific Overrides
 * Ensure consistent styling in block editor
 */
.editor-styles-wrapper .gc-callout,
.editor-styles-wrapper .gc-disclaimer {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.editor-styles-wrapper .has-cat-diabetes-background-color,
.editor-styles-wrapper .has-cat-nutrition-background-color,
.editor-styles-wrapper .has-cat-medical-background-color {
  padding: 1.5rem;
}

/**
 * RTL (Right-to-Left) Support
 * Basic adjustments for Arabic, Hebrew, etc.
 */
[dir="rtl"] .gc-callout,
[dir="rtl"] .gc-callout--info,
[dir="rtl"] .gc-callout--success,
[dir="rtl"] .gc-callout--warning,
[dir="rtl"] .gc-callout--danger {
  border-left: none;
  border-right: 4px solid transparent;
}

[dir="rtl"] .gc-callout--info {
  border-right-color: var(--wp--preset--color--info);
}

[dir="rtl"] .gc-callout--success {
  border-right-color: var(--wp--preset--color--success);
}

[dir="rtl"] .gc-callout--warning {
  border-right-color: var(--wp--preset--color--warning);
}

[dir="rtl"] .gc-callout--danger {
  border-right-color: var(--wp--preset--color--danger);
}

[dir="rtl"] .wp-block-quote {
  border-left: none;
  border-right: 0.25rem solid var(--wp--preset--color--primary);
}

/**
 * Touch Device Optimizations
 * Increase tap targets for mobile
 */
@media (pointer: coarse) {
  .woocommerce a.button,
  .woocommerce button.button,
  .woocommerce input.button {
    min-height: 44px;
    min-width: 44px;
    padding: 0.875rem 1.75rem;
  }

  .woocommerce .quantity input.qty {
    min-height: 44px;
    font-size: 1rem;
  }

  .woocommerce a.remove {
    min-height: 44px;
    min-width: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

/**
 * Dark Mode Support (Respects user preference)
 * Note: Colors should ideally be controlled via Kadence Customizer
 * This provides emergency fallbacks only
 */
@media (prefers-color-scheme: dark) {
  /* Dark mode is intentionally minimal to respect Kadence Customizer */
  /* Users should configure dark mode via Kadence settings */
  
  /* Only provide high-contrast text fallback if needed */
  body:not([data-kadence-dark-mode]) {
    /* Let Kadence handle dark mode - no overrides */
  }
}

/**
 * Performance: Contain Layout Shifts
 * Prevent layout reflow during dynamic content loading
 */
.woocommerce ul.products li.product img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.woocommerce div.product .woocommerce-product-gallery__image img {
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

/* ==========================================================================
   Phase 8 — Sidebar Typography Refinement
   ========================================================================== */

/**
 * Reduce sidebar base font size to ~90% of body text.
 * Keeps sidebar visually subordinate to main content.
 * Scoped to sidebar containers only — no global impact.
 */
.sidebar,
.kadence-sidebar,
.widget-area {
  font-size: 0.9rem;
  line-height: 1.5;
}

/**
 * Sidebar headings — slightly smaller to stay proportional.
 */
.sidebar h2,
.kadence-sidebar h2,
.widget-area h2 {
  font-size: 1.1rem;
  margin-bottom: 0.5em;
}

/* ==========================================================================
   Phase 8 — Sidebar Background Refinement
   ========================================================================== */

/**
 * Subtle surface background with padding and border.
 * Uses existing design tokens (--wp--preset--color--surface, --border).
 * Non-destructive — does not change container widths or global spacing.
 * Border automatically adjusts based on sidebar position (left or right).
 */
.sidebar,
.kadence-sidebar,
.widget-area {
  background-color: var(--wp--preset--color--surface);
  padding: 1.5rem;
}

/* Border for right sidebar */
.content-area + .sidebar,
.content-area + .kadence-sidebar,
.content-area + .widget-area {
  border-left: 1px solid var(--wp--preset--color--border);
}

/* Border for left sidebar */
.sidebar + .content-area,
.kadence-sidebar + .content-area,
.widget-area + .content-area {
  border-left: 1px solid var(--wp--preset--color--border);
}

/* Legacy fallback for right sidebar layouts */
.site-container.sidebar-right .sidebar,
.site-container.sidebar-right .kadence-sidebar,
.site-container.sidebar-right .widget-area {
  border-left: 1px solid var(--wp--preset--color--border);
}

/* Legacy fallback for left sidebar layouts */
.site-container.sidebar-left .sidebar,
.site-container.sidebar-left .kadence-sidebar,
.site-container.sidebar-left .widget-area {
  border-right: 1px solid var(--wp--preset--color--border);
}

/* ==========================================================================
   Phase 9 — Sidebar Widget Polish
   ========================================================================== */

/**
 * Widget spacing — consistent vertical rhythm between widgets.
 */
.widget-area .widget,
.sidebar .widget,
.kadence-sidebar .widget {
  margin-bottom: 1.75rem;
}

/**
 * Widget titles — clear hierarchy, warm editorial tone.
 */
.widget-area .widget-title,
.sidebar .widget-title,
.kadence-sidebar .widget-title {
  font-size: 1.05rem;
  margin-bottom: 0.75rem;
  color: var(--wp--preset--color--text);
}

/**
 * Widget lists — balanced indentation and line height.
 */
.widget-area ul,
.sidebar ul,
.kadence-sidebar ul {
  margin-left: 1rem;
  line-height: 1.5;
}

/**
 * Widget links — token-driven, calm editorial feel.
 */
.widget-area a,
.sidebar a,
.kadence-sidebar a {
  color: var(--theme-link);
}

.widget-area a:hover,
.sidebar a:hover,
.kadence-sidebar a:hover {
  color: var(--theme-link-hover);
}

/* ==========================================================================
   Phase 9 — Sidebar Callout Support
   ========================================================================== */

/**
 * Allow .gc-callout variants inside sidebar without layout breakage.
 * Consistent padding, spacing, and border-radius.
 */
.sidebar .gc-callout--info,
.sidebar .gc-callout--success,
.sidebar .gc-callout--warning,
.sidebar .gc-callout--danger {
  margin-bottom: 1.5rem;
  padding: 1rem;
  border-radius: 6px;
}

/* ==========================================================================
   Phase 10 — Global Vertical Rhythm
   ========================================================================== */

/**
 * Headings inside entry content — consistent spacing above and below.
 * Uses spacing scale tokens (lg above, sm below).
 */
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4 {
  margin-top: var(--wp--preset--spacing--lg);
  margin-bottom: var(--wp--preset--spacing--sm);
}

/**
 * Prose elements — uniform bottom margin for editorial flow.
 */
.entry-content p,
.entry-content ul,
.entry-content ol,
.entry-content blockquote {
  margin-bottom: var(--wp--preset--spacing--md);
}

/**
 * Images — balanced vertical breathing room.
 */
.entry-content img {
  margin: var(--wp--preset--spacing--md) 0;
}

/* ==========================================================================
   Phase 10 — Group & Cover Spacing
   ========================================================================== */

/**
 * Group blocks — consistent vertical padding.
 */
.wp-block-group {
  padding-top: var(--wp--preset--spacing--md);
  padding-bottom: var(--wp--preset--spacing--md);
}

/**
 * Cover blocks — generous internal padding.
 */
.wp-block-cover {
  padding: var(--wp--preset--spacing--lg);
}

/* ==========================================================================
   Phase 10 — WooCommerce Spacing
   ========================================================================== */

/**
 * Product card spacing — balanced titles, prices, and buttons.
 * Uses spacing scale tokens only.
 */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  margin-bottom: var(--wp--preset--spacing--sm);
}

.woocommerce ul.products li.product .price {
  margin-bottom: var(--wp--preset--spacing--sm);
}

.woocommerce ul.products li.product .button {
  margin-top: var(--wp--preset--spacing--sm);
}

/**
 * Theme Validation Complete
 * Version: 1.3.2
 * Last Updated: Recipe archive sidebar fix + widget area registration
 */