/* Shared storefront skin. Commerce markup and all form behavior stay unchanged. */
body.key711-storefront-active {
  --k711-ink: #192823;
  --k711-muted: #5e6964;
  --k711-green: #096546;
  --k711-green-hover: #064d35;
  --k711-line: #dce3de;
  --k711-soft: #edf5ef;
  --k711-red: #c63725;
  --primary-color: #096546;
  --fs-color-primary: #096546;
  --fs-color-secondary: #096546;
  --fs-color-success: #096546;
  --fs-color-alert: #c63725;
  background: #fff;
  color: var(--k711-ink);
  min-height: 100vh;
}
body.key711-storefront-active #main,
body.key711-storefront-active .page-wrapper { background: #fff !important; }
body.key711-storefront-active :is(h1, h2, h3, h4, h5, h6, .nav > li > a, .button) { letter-spacing: 0; }
body.key711-storefront-active :is(.header-wrapper, .header-main, .header-bg-color, .header-bottom, .nav-dropdown, .off-canvas .sidebar-menu) { background: #fff !important; }
body.key711-storefront-active .header-wrapper { border-bottom: 1px solid var(--k711-line); box-shadow: none; }
body.key711-storefront-active .header-main .nav > li > a { color: var(--k711-ink); }
body.key711-storefront-active .header-main .nav > :is(.active, .current-menu-item, .key711-api-menu) > a,
body.key711-storefront-active .nav > li > a:hover { color: var(--k711-green); }
body.key711-storefront-active .nav-line-bottom > li > a::before,
body.key711-storefront-active .nav-line > li > a::before { background-color: var(--k711-green); }
body.key711-storefront-active .cart-icon strong,
body.key711-storefront-active .cart-icon strong::after { border-color: var(--k711-green); color: var(--k711-green); }
body.key711-storefront-active #top-bar { background: var(--k711-ink); }
body.key711-storefront-active #top-bar, body.key711-storefront-active #top-bar a { color: #e5ede7; }
body.key711-storefront-active .absolute-footer { background: #192823; color: #cbd8d0; }
body.key711-storefront-active .absolute-footer a { color: #e2eae5; }
body.key711-storefront-active .absolute-footer a:hover { color: #fff; }
body.key711-storefront-active .absolute-footer .payment-icon { filter: brightness(0) invert(1); opacity: .7; }
body.key711-storefront-active .footer-widgets { background: #f7f9f7; color: var(--k711-ink); }
body.key711-storefront-active .footer-widgets :is(a, .widget-title) { color: var(--k711-ink); }
body.key711-storefront-active .footer-widgets a:hover { color: var(--k711-green); }

/* Theme actions, without recoloring payment-provider widgets or icon-only controls. */
body.key711-storefront-active .button:not(.is-link):not(.minus):not(.plus):not(.key711-option-button):not(.icon),
body.key711-storefront-active input[type="submit"] {
  background-color: var(--k711-green);
  border-color: var(--k711-green);
  color: #fff;
  border-radius: 4px;
  box-shadow: none;
  letter-spacing: 0;
}
body.key711-storefront-active .button:not(.is-link):not(.minus):not(.plus):not(.key711-option-button):not(.icon):hover,
body.key711-storefront-active input[type="submit"]:hover { background-color: var(--k711-green-hover); border-color: var(--k711-green-hover); color: #fff; }
body.key711-storefront-active .wc-block-components-button.contained { background: var(--k711-green); color: #fff; border: 1px solid var(--k711-green); border-radius: 4px; box-shadow: none; }
body.key711-storefront-active .wc-block-components-button.contained:not(:disabled):hover { background: var(--k711-green-hover); border-color: var(--k711-green-hover); }
body.key711-storefront-active :is(.wc-block-cart, .wc-block-checkout) a:not(.wc-block-components-button) { color: var(--k711-green); }
body.key711-storefront-active .button.is-outline:not(.minus):not(.plus) { background: #fff; color: var(--k711-green); border-color: var(--k711-green); }
body.key711-storefront-active .button.is-outline:not(.minus):not(.plus):hover { background: var(--k711-soft); }
body.key711-storefront-active .button.icon:not(.primary):not(.secondary) { background: transparent; color: var(--k711-muted); border-color: #c7d3cb; }
body.key711-storefront-active .button.icon:not(.primary):not(.secondary):hover { background: var(--k711-soft); color: var(--k711-green); border-color: var(--k711-green); }
body.key711-storefront-active :is(a, button, input, select, textarea):focus-visible { outline: 2px solid var(--k711-green); outline-offset: 3px; }
body.key711-storefront-active :is(input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="search"], input[type="number"], select, textarea, .select2-selection) { border-color: #c7d3cb; border-radius: 4px; box-shadow: none; color: var(--k711-ink); }
body.key711-storefront-active :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--k711-green); }
body.key711-storefront-active :is(.woocommerce-form, .woocommerce-checkout, .woocommerce-cart-form, .woocommerce-MyAccount-content) a:not(.button):not(.key711-account-button) { color: var(--k711-green); }
body.key711-storefront-active :is(.woocommerce-message, .woocommerce-info) { color: var(--k711-green); }
body.key711-storefront-active .woocommerce-error { color: var(--k711-red); }

/* Catalog and product detail share red prices and green selection/action states. */
body.key711-storefront-active :is(.breadcrumbs, .category, .woocommerce-result-count) { color: var(--k711-muted); }
body.key711-storefront-active :is(.breadcrumbs a, .product-title a, .name a, .widget_product_categories a) { color: var(--k711-ink); }
body.key711-storefront-active :is(.breadcrumbs a, .product-title a, .name a, .widget_product_categories a):hover { color: var(--k711-green); }
body.key711-storefront-active .widget_product_categories .children { border-color: var(--k711-line); }
body.key711-storefront-active .widget_product_categories :is(.current-cat, .current-cat-parent) > a { color: var(--k711-green); }
body.key711-storefront-active .widget_price_filter :is(.ui-slider-range, .ui-slider-handle) { background: var(--k711-green); }
body.key711-storefront-active :is(.badge-inner.on-sale, .badge-inner.secondary) { background: var(--k711-red); color: #fff; }
body.key711-storefront-active :is(.price, .price-wrapper, .key711-loop-price) :is(.amount, bdi, .woocommerce-Price-currencySymbol),
body.key711-storefront-active :is(.key711-loop-price, .key711-loop-price__amount) { color: var(--k711-red); }
body.key711-storefront-active.single-product :is(.product-container, .product-main, .product-footer) { background: #fff; }
body.key711-storefront-active.single-product .key711-after-voucher { background: #faf5f3; }
body.key711-storefront-active.single-product .key711-after-voucher :is(strong, span) { color: var(--k711-red); }
body.key711-storefront-active.single-product :is(.woocommerce-tabs, .related-products-wrapper, .product-main) { border-color: var(--k711-line); }
body.key711-storefront-active.single-product :is(.key711-section-title, .product-section-title, .product-section-title-related) { background: #f4f7f4; color: var(--k711-ink); }
body.key711-storefront-active.single-product .key711-option-button:not(:disabled):hover,
body.key711-storefront-active.single-product .key711-option-button.is-selected { border-color: var(--k711-green); color: var(--k711-green); background: var(--k711-soft); }
body.key711-storefront-active.single-product .key711-option-button.is-selected { box-shadow: inset 0 0 0 1px var(--k711-green); }
body.key711-storefront-active.single-product table.variations .reset_variations { color: var(--k711-green) !important; }
body.key711-storefront-active.single-product .summary.entry-summary form.cart .single_add_to_cart_button:not(.key711-buy-with-voucher) { background: #fff !important; color: var(--k711-green) !important; border-color: var(--k711-green); }
body.key711-storefront-active.single-product .summary.entry-summary form.cart :is(.key711-buy-with-voucher, .key711-voucher-buy-now) { background: var(--k711-green) !important; color: #fff !important; border-color: var(--k711-green); border-radius: 4px; }
body.key711-storefront-active.single-product .summary.entry-summary form.cart :is(.key711-buy-with-voucher, .key711-voucher-buy-now):hover { background: var(--k711-green-hover) !important; }
body.key711-storefront-active.single-product .key711-voucher-badge { background: var(--k711-soft); color: var(--k711-green); }
body.key711-storefront-active.single-product :is(.key711-voucher-action, .key711-voucher-badge.is-active) { background: var(--k711-green); border-color: var(--k711-green); color: #fff; }
body.key711-storefront-active.single-product :is(.key711-spec-value a, .stock.in-stock, .key711-voucher-redemption a) { color: var(--k711-green); }
body.key711-storefront-active.single-product .related-products-wrapper .box:hover { border-color: var(--k711-green); }
body.key711-storefront-active.single-product .woocommerce-Tabs-panel:not(:last-child) { border-bottom-color: #f7f9f7; }
body.key711-storefront-active :is(.cart_totals, .checkout-sidebar, .woocommerce-checkout-review-order, .shop_table) { border-color: var(--k711-line); }
body.key711-storefront-active #payment .payment_box { background: #f3f7f4; color: var(--k711-ink); }

/* Account center exposes its own palette; map it to the storefront tokens. */
body.key711-storefront-active.key711-account-center {
  --key711-account-ink: var(--k711-ink);
  --key711-account-muted: var(--k711-muted);
  --key711-account-line: var(--k711-line);
  --key711-account-warm: var(--k711-soft);
  --key711-account-accent: var(--k711-green);
}
body.key711-storefront-active .key711-account-page,
body.key711-storefront-active .my-account.page-wrapper { background: #fff; }
body.key711-storefront-active .my-account-header { background: var(--k711-soft); color: var(--k711-ink); }
body.key711-storefront-active .my-account-header h1 { color: var(--k711-ink); }
body.key711-storefront-active .my-account-header small { color: var(--k711-muted); }
body.key711-storefront-active .key711-account-button:hover { background: var(--k711-green-hover); }
body.key711-storefront-active .key711-account-button--secondary:hover { background: var(--k711-soft); }

/* Existing guide and reseller layouts keep their content and forms. */
body.key711-storefront-active.key711-tutorial-page .entry-content :is(.button, a.button, .key711-tutorial-inline-button) { background: var(--k711-green) !important; border-color: var(--k711-green) !important; border-radius: 4px !important; }
body.key711-storefront-active.key711-tutorial-page .entry-content :is(.button.is-outline, .key711-tutorial-inline-button--soft) { color: var(--k711-green) !important; background: #fff !important; }
body.key711-storefront-active.key711-tutorial-guide .entry-content > .key711-tutorial-hero--full { background: var(--k711-soft) !important; }
body.key711-storefront-active.key711-tutorial-guide .key711-tutorial-hero--full .key711-tutorial-hero__eyebrow { color: var(--k711-green); }
body.key711-storefront-active.key711-tutorial-guide .key711-tutorial-step-title span:first-child { background: var(--k711-green); }
body.key711-storefront-active.key711-tutorial-index .key711-tutorial-directory__button { background: var(--k711-green); border-color: var(--k711-green); border-radius: 4px; }
body.key711-storefront-active.key711-tutorial-index .key711-tutorial-directory__button:hover { background: var(--k711-green-hover); border-color: var(--k711-green-hover); }
body.key711-storefront-active.key711-tutorial-index .key711-tutorial-directory__button--outline { background: #fff; color: var(--k711-green); }
body.key711-storefront-active.key711-tutorial-index .key711-tutorial-directory__button--outline:hover { background: var(--k711-soft); color: var(--k711-green); }
body.key711-storefront-active.key711-tutorial-index .key711-tutorial-directory__card:hover { border-color: var(--k711-green); }
body.key711-storefront-active.key711-tutorial-index .key711-tutorial-directory__body h3 { color: var(--k711-ink); }
body.key711-storefront-active .key711-reseller {
  --reseller-orange: var(--k711-green);
  --reseller-navy: #192823;
  --reseller-navy-2: #234638;
  --reseller-ink: var(--k711-ink);
  --reseller-muted: var(--k711-muted);
  --reseller-line: var(--k711-line);
}
body.key711-storefront-active .key711-reseller__button--primary { box-shadow: none; }
body.key711-storefront-active :is(.key711-reseller__section, .key711-reseller__faq, .key711-reseller__trust) { background: #fff; }
body.key711-storefront-active :is(.key711-reseller__icon, .key711-reseller__partner-benefits > div) { background: var(--k711-soft); border-color: var(--k711-line); }
body.key711-storefront-active :is(.key711-reseller__advantage:hover, .key711-reseller__product:hover) { border-color: var(--k711-green); box-shadow: none; }
