/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */
/* ===============================
   GHETX Design System
   Tokens (mapped to Elementor globals where possible)
   =============================== */

/* We'll treat:
   --e-global-color-accent      = GHETX accent / CTA color
   --e-global-color-text        = main text (#000)
   --e-global-color-primary     = darker accent / hover (optional)
   --e-global-color-secondary   = neutral gray for disabled, etc.
*/


:root {
    /* Fallbacks in case Elementor vars aren't defined in a given DOM context */
    --ghetx-bg-page: #ffffff;
    --ghetx-bg-panel: #f8f8f8;
    --ghetx-border-color: #dcdcdc;
    --ghetx-radius-sm: 4px;
    --ghetx-radius-md: 6px;
    --ghetx-text-muted: #555;
    --ghetx-heading-color: var(--e-global-color-text, #000);
    --ghetx-accent: var(--e-global-color-accent, #ff6600);
    --ghetx-accent-hover: var(--e-global-color-accent, #ff6600);
    --ghetx-input-border: #cfcfcf;
    --ghetx-input-focus-ring: var(--e-global-color-accent, #ff6600);
    --ghetx-card-shadow: 0 8px 24px rgba(0,0,0,0.06);
}

/* ===============================
   Typography Defaults
   =============================== */

body,
.woocommerce div.product,
.wapf-wrapper {
    font-family: var(--e-global-typography-text-font-family, "Inter"), system-ui, sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: var(--e-global-color-text, #000);
}

h1, .elementor-heading-title.elementor-size-xl {
    color: var(--ghetx-heading-color);
    font-family: var(--e-global-typography-primary-font-family, "Inter"), system-ui, sans-serif;
    font-weight: 600;
    font-size: clamp(1.5rem, 0.5vw + 1.25rem, 2rem);
    line-height: 1.2;
    margin: 0 0 1rem;
}

h2,
.elementor-widget-heading h2.elementor-heading-title,
.wapf-field-label {
    color: var(--ghetx-heading-color);
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.3;
    margin-bottom: .5rem;
    display: block;
    position: relative;
    padding-bottom: .5rem;
}

h2::after,
.elementor-widget-heading h2.elementor-heading-title::after {
    content: "";
    display: block;
    width: 32px;
    height: 3px;
    background-color: var(--ghetx-accent);
    border-radius: var(--ghetx-radius-sm);
    position: absolute;
    bottom: 0;
    left: 0;
}

h3 {
    color: var(--ghetx-heading-color);
    font-weight: 500;
    font-size: .95rem;
    margin-bottom: .5rem;
}

/* ===============================
   Card / Panel Sections
   =============================== */

.prod_sectiion_start,
.ghetx-card {
    background-color: var(--ghetx-bg-panel);
    border: 1px solid var(--ghetx-border-color);
    border-radius: var(--ghetx-radius-md);
    padding: 40px 24px 20px;
    margin-bottom: 24px;
    box-shadow: var(--ghetx-card-shadow);
}

/* ===============================
   Form fields / APF fields
   =============================== */

input[type="text"],
input[type="number"],
input[type="email"],
input[type="tel"],
textarea,
select,
.wapf-input input[type="text"],
.wapf-input input[type="number"],
.wapf-input textarea,
.wapf-input select {
    background-color: #fff;
    border: 1px solid var(--ghetx-input-border);
    border-radius: var(--ghetx-radius-sm);
    padding: 10px 12px;
    font-size: 16px;
    line-height: 1.4;
    width: 100%;
    color: var(--e-global-color-text, #000);
    box-shadow: 0 0 0 0 transparent;
    transition: all .15s ease;
}

input[type="text"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
textarea:focus,
select:focus,
.wapf-input input[type="text"]:focus,
.wapf-input input[type="number"]:focus,
.wapf-input textarea:focus,
.wapf-input select:focus {
    outline: 0;
    border-color: var(--ghetx-input-focus-ring);
    box-shadow: 0 0 0 3px rgba(255, 102, 0, 0.2); /* fallback tint, swap #ff6600 if accent changes */
}

.wapf-checkboxes,
.wapf-radios {
    gap: 10px 1rem !important;
    margin-top: 1px;
}

.wapf-checkbox label,
.wapf-radio label {
    align-items: flex-start !important;
    line-height: 1.4;
    color: var(--e-global-color-text, #000);
    font-size: .9rem;
}

.wapf-wrapper .wapf-field .wapf-label {
    line-height: 1.4;
    color: var(--ghetx-heading-color);
    font-weight: 600;
    font-size: 1rem;
    margin-bottom: .5rem;
}

.wapf-wrapper .wapf-field .wapf-input .wapf-pricing-option {
    /* margin-bottom: 1rem;*/
}



/* Help text / descriptions under fields */
.woocommerce form .form-row .description,
.wapf-description,
.wapf-input-description {
    color: var(--ghetx-text-muted);
    font-size: .8rem;
    line-height: 1.4;
    margin-top: .5rem;
}

/* ===============================
   Buttons (global + Woo + APF submit)
   =============================== */

body.woocommerce a.button,
body.woocommerce button.button,
body.woocommerce input.button,
body.woocommerce #respond input#submit,
body.woocommerce button[type="submit"],
body.woocommerce .single_add_to_cart_button,
body.woocommerce .checkout-button {
    background-color: var(--e-global-color-accent);
    color: #fff;
    border: none;
    border-radius: var(--ghetx-radius-sm);
    font-family: var(--e-global-typography-accent-font-family, "Inter"), system-ui, sans-serif;
    font-weight: var(--e-global-typography-accent-font-weight, 500);
    text-transform: var(--e-global-typography-accent-text-transform, none);
    -webkit-font-smoothing: antialiased;
    padding: 12px 16px;
    font-size: .9rem;
    line-height: 1.2;
    transition: background-color .2s ease-in-out;
    border-width: 1px;
    border-style: solid;
    border-color: var(--e-global-color-accent);
}

body.woocommerce a.button:hover,
body.woocommerce button.button:hover,
body.woocommerce input.button:hover,
body.woocommerce #respond input#submit:hover,
body.woocommerce button[type="submit"]:hover,
body.woocommerce .single_add_to_cart_button:hover,
body.woocommerce .checkout-button:hover {
    background-color: var(--e-global-color-accent);
    border-color: var(--e-global-color-accent);
    color: #fff;
}

/* Force-kill Woo's purple .alt state */
form.cart button.single_add_to_cart_button.button.alt,
form.cart button.single_add_to_cart_button.button.alt:focus,
form.cart button.single_add_to_cart_button.button.alt:active,
form.cart button.single_add_to_cart_button.button.alt:hover,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce a.button.alt,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce button.button.alt,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce input.button.alt,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce #respond input#submit.alt,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce a.button.alt:hover,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce button.button.alt:hover,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce input.button.alt:hover,
body:not(.woocommerce-block-theme-has-button-styles) .woocommerce #respond input#submit.alt:hover {
    background-color: var(--e-global-color-accent) !important;
    border-color: var(--e-global-color-accent) !important;
    color: #fff !important;
    border-radius: var(--ghetx-radius-sm);
    border-width: 1px;
    border-style: solid;
}

/* Disabled buttons */
body.woocommerce button.button:disabled,
body.woocommerce button.button:disabled[disabled],
body.woocommerce input.button:disabled {
    background-color: var(--e-global-color-secondary);
    border-color: var(--e-global-color-secondary);
    color: #fff;
    opacity: 0.7;
}

/* ===============================
   Notices / alerts
   =============================== */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    border-top: 3px solid var(--e-global-color-accent) !important;
    border-radius: var(--ghetx-radius-sm);
    padding: 12px 16px 12px 40px;
    position: relative;
    box-shadow: var(--ghetx-card-shadow);
    background-color: color-mix(in srgb, var(--e-global-color-accent), white 90%) !important;
    color: var(--e-global-color-text, #000) !important;
    font-size: .9rem;
    line-height: 1.4;
}

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
    color: var(--e-global-color-accent) !important;
    left: 12px;
    top: 12px;
    font-size: 1rem;
}

.woocommerce-error {
    background-color: color-mix(in srgb, red, white 92%) !important;
    border-top-color: var(--e-global-color-accent) !important;
}

.woocommerce-error li {
    color: inherit;
}

/* ===============================
   Totals / price text
   =============================== */

body.woocommerce div.product p.price,
body.woocommerce div.product span.price,
body.woocommerce .wapf-product-totals .wapf-total.wapf-grand-total-price-amount,
body.woocommerce .wapf-product-totals div span.wapf-total.wapf-grand-total-price-amount {
    color: var(--e-global-color-text, #000);
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.4;
}

/* WooCommerce Checkout Block: Place Order button */
.wc-block-components-checkout-place-order-button,
.wc-block-components-checkout-place-order-button.button,
.wc-block-components-checkout-place-order-button.wp-element-button,
.wc-block-components-checkout-place-order-button.is-primary,
.wc-block-components-checkout-place-order-button:not(.is-link)[type="submit"],
.wc-block-components-button.wp-block-button__link.wp-element-button[type="submit"] {
    background-color: var(--e-global-color-accent) !important;
    border: 1px solid var(--e-global-color-accent) !important;
    color: #fff !important;

    border-radius: 4px !important;
    padding: 12px 16px !important;
    line-height: 1.2 !important;
    font-size: .9rem !important;
    font-family: var(--e-global-typography-accent-font-family, "Inter"), system-ui, sans-serif !important;
    font-weight: var(--e-global-typography-accent-font-weight, 500) !important;
    text-transform: var(--e-global-typography-accent-text-transform, none) !important;
    letter-spacing: 0 !important;

    box-shadow: none !important;
    text-shadow: none !important;
    transition: background-color .2s ease-in-out;
    cursor: pointer;
}

/* Hover / focus state: keep same accent color */
.wc-block-components-checkout-place-order-button:hover,
.wc-block-components-checkout-place-order-button:focus,
.wc-block-components-checkout-place-order-button.button:hover,
.wc-block-components-checkout-place-order-button.wp-element-button:hover,
.wc-block-components-checkout-place-order-button.is-primary:hover,
.wc-block-components-button.wp-block-button__link.wp-element-button[type="submit"]:hover {
    background-color: var(--e-global-color-accent) !important;
    border-color: var(--e-global-color-accent) !important;
    color: #fff !important;
}

/* Optional: kill Woo's uppercase if it's coming from somewhere else */
.wc-block-components-checkout-place-order-button .wc-block-components-checkout-place-order-button__text,
.wc-block-components-checkout-place-order-button span {
    text-transform: none !important;
    letter-spacing: 0 !important;
}

/* Checkout Block input + select + textarea styling to match portal look */
.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="tel"],
.wc-block-components-text-input input[type="number"],
.wc-block-components-text-input input[type="url"],
.wc-block-components-text-input input[type="password"],
.wc-block-components-text-input textarea,
.wc-block-components-text-input select,
.wc-block-components-address-form input[type="text"],
.wc-block-components-address-form input[type="email"],
.wc-block-components-address-form input[type="tel"],
.wc-block-components-address-form input[type="number"],
.wc-block-components-address-form input[type="url"],
.wc-block-components-address-form input[type="password"],
.wc-block-components-address-form textarea,
.wc-block-components-address-form select {
    background-color: #fff !important;
    border: 1px solid var(--ghetx-input-border, #cfcfcf) !important;
    border-radius: var(--ghetx-radius-sm, 4px) !important;

    padding: 10px 12px !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    color: var(--e-global-color-text, #000) !important;

    box-shadow: 0 0 0 0 transparent !important;
    -webkit-box-shadow: 0 0 0 0 transparent !important;
    transition: all .15s ease;
    box-sizing: border-box;
}

/* Focus style */
.wc-block-components-text-input input[type="text"]:focus,
.wc-block-components-text-input input[type="email"]:focus,
.wc-block-components-text-input input[type="tel"]:focus,
.wc-block-components-text-input input[type="number"]:focus,
.wc-block-components-text-input input[type="url"]:focus,
.wc-block-components-text-input input[type="password"]:focus,
.wc-block-components-text-input textarea:focus,
.wc-block-components-text-input select:focus,
.wc-block-components-address-form input[type="text"]:focus,
.wc-block-components-address-form input[type="email"]:focus,
.wc-block-components-address-form input[type="tel"]:focus,
.wc-block-components-address-form input[type="number"]:focus,
.wc-block-components-address-form input[type="url"]:focus,
.wc-block-components-address-form input[type="password"]:focus,
.wc-block-components-address-form textarea:focus,
.wc-block-components-address-form select:focus {
    outline: 0 !important;
    border-color: var(--ghetx-input-focus-ring, var(--e-global-color-accent)) !important;
    box-shadow: 0 0 0 3px rgba(255, 102, 0, 0.2) !important; /* swap #ff6600 to match accent if needed */
}

/* Labels and helper text styling */
.wc-block-components-text-input label,
.wc-block-components-address-form label {
    font-family: var(--e-global-typography-text-font-family, "Inter"), system-ui, sans-serif !important;
    font-size: .9rem !important;
    line-height: 1.4 !important;
    font-weight: 500 !important;
    color: var(--e-global-color-text, #000) !important;
    margin-bottom: 4px !important;
}

.wc-block-components-text-input .wc-block-components-text-input__description,
.wc-block-components-address-form .wc-block-components-text-input__description,
.wc-block-components-address-form .wc-block-components-address-form__instruction {
    font-size: .8rem !important;
    line-height: 1.4 !important;
    color: var(--ghetx-text-muted, #555) !important;
}


/* Checkout order summary card */
.wc-block-components-order-summary,
.wc-block-components-totals-wrapper,
.wc-block-components-panel {
    /*background-color: var(--ghetx-bg-panel, #f8f8f8) !important;
    border: 1px solid var(--ghetx-border-color, #dcdcdc) !important;
	 box-shadow: var(--ghetx-card-shadow, 0 8px 24px rgba(0,0,0,0.06)) !important;*/
    border-radius: var(--ghetx-radius-md, 6px) !important;
   
    padding: 16px !important;
}

.wc-block-components-panel__content {
    padding: 0 !important; /* prevent double padding */
}

.wc-block-components-order-summary-item,
.wc-block-components-order-summary-subtotal,
.wc-block-components-totals-item,
.wc-block-components-totals-footer-item {
    font-family: var(--e-global-typography-text-font-family, "Inter"), system-ui, sans-serif !important;
    font-size: .85rem !important;
    line-height: 1.4 !important;
    color: var(--e-global-color-text, #000) !important;
}


/* Coupon APPLY button in Checkout Block */
.wc-block-components-totals-coupon__button,
.wc-block-components-totals-coupon__button.wp-element-button,
.wc-block-components-totals-coupon__button.wc-block-components-button,
.wc-block-components-totals-coupon__button.button {
    background-color: var(--e-global-color-accent) !important;
    border: 1px solid var(--e-global-color-accent) !important;
    color: #fff !important;

    border-radius: 4px !important;
    padding: 10px 12px !important;
    line-height: 1.2 !important;
    font-size: .8rem !important;
    font-family: var(--e-global-typography-accent-font-family, "Inter"), system-ui, sans-serif !important;
    font-weight: var(--e-global-typography-accent-font-weight, 500) !important;
    text-transform: var(--e-global-typography-accent-text-transform, none) !important;
    letter-spacing: 0 !important;

    box-shadow: none !important;
    text-shadow: none !important;
    cursor: pointer;
    transition: background-color .2s ease-in-out;
}

/* Hover/focus: keep same accent color (no weird outline, no magenta) */
.wc-block-components-totals-coupon__button:hover,
.wc-block-components-totals-coupon__button:focus {
    background-color: var(--e-global-color-accent) !important;
    border-color: var(--e-global-color-accent) !important;
    color: #fff !important;
}


/* 1. Wrapper: make the metadata area read like a structured summary */
.wc-block-components-product-metadata {
    font-family: var(--e-global-typography-text-font-family, "Inter"), system-ui, sans-serif;
    font-size: 0.85rem;
    line-height: 1.4;
    color: var(--e-global-color-text, #000);
    border: 1px solid var(--ghetx-border-color, #dcdcdc);
    border-radius: var(--ghetx-radius-md, 6px);
    background-color: var(--ghetx-bg-panel, #f8f8f8);
    padding: 16px;
    margin-top: 12px;
}

/* Short blurb at the top ("Truck Build Configurator – Build out the options.") */
.wc-block-components-product-metadata__description {
    margin: 0 0 12px 0;
    padding: 0 0 12px 0;
    border-bottom: 1px solid var(--ghetx-border-color, #dcdcdc);
}
.wc-block-components-product-metadata__description p {
    margin: 0;
    color: var(--ghetx-text-muted, #555);
    font-size: 0.8rem;
    line-height: 1.4;
}

/* 2. Turn the <ul> into a clean vertical list */
.wc-block-components-product-details {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Each li will be its own row/block */
.wc-block-components-product-details li {
    display: flex;
    flex-direction: column;
    padding: 8px 0;
    border-bottom: 1px solid var(--ghetx-border-color, #dcdcdc);
    gap: 4px;
}

/* remove bottom border on the last one */
.wc-block-components-product-details li:last-child {
    border-bottom: 0;
}

/* 3. Label on top, bold, slightly smaller text for clarity */
.wc-block-components-product-details__name {
    font-weight: 600;
    font-size: 0.8rem;
    line-height: 1.3;
    color: var(--e-global-color-text, #000);
    display: block;
}

/* Selected value under it, slightly lighter color so it reads like content, not a heading */
.wc-block-components-product-details__value {
    font-weight: 400;
    font-size: 0.8rem;
    line-height: 1.4;
    color: var(--ghetx-text-muted, #444);
    white-space: normal;
    word-break: break-word;
    max-width: 100%;
}

/* Extra polish for long multi-option values (like light heads, etc.) */
.wc-block-components-product-details__value br {
    line-height: 1.4;
}

/* OPTIONAL: highlight custom text fields so they stand out for review */
.wc-block-components-product-details__custom-options .wc-block-components-product-details__value,
.wc-block-components-product-details__custom-tool-box-option .wc-block-components-product-details__value {
    background-color: rgba(255, 102, 0, 0.08); /* accent tint */
    border-left: 3px solid var(--e-global-color-accent);
    padding: 6px 8px;
    border-radius: 4px;
    color: var(--e-global-color-text, #000);
    font-weight: 500;
}

/* Make the order summary details (config card) use more horizontal space */
.wc-block-components-product-metadata {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
	margin-bottom:20px;
}

/* Specifically widen the area inside the right-hand summary column */
.wc-block-components-order-summary-item {
    display: flex;
    flex-direction: column;
}

.wc-block-components-order-summary-item .wc-block-components-product-metadata {
    margin-right: -12px; /* push out slightly */
    margin-left: -12px;
    padding: 20px; /* slightly more inner spacing */
}

/* Optional: remove the artificial 'card inside a card' look */
.wc-block-components-order-summary-item .wc-block-components-product-metadata {
    border-radius: 8px;
    background-color: #f8f8f8;
    border: 1px solid #e0e0e0;
}

/* Slight visual polish */
.wc-block-components-product-details li {
    padding: 10px 0;
}

.wc-block-components-order-summary .wc-block-components-order-summary-item__description {padding-left:0px !important; padding-right:0px !important;}

/* === Thank You Page Styling === */

/* Overall wrapper */
.woocommerce-order {
  font-family: var(--e-global-typography-text-font-family, "Inter"), system-ui, sans-serif;
  font-size: 0.95rem;
  line-height: 1.5;
  color: #222;
  max-width: 1000px;
  margin: 0 auto;
  padding: 2rem 1rem 3rem;
}

/* Success notice */
.woocommerce-notice--success {
  background: #e7f7ed;
  color: #1a7b42;
  border-left: 4px solid #1a7b42;
  padding: 1rem 1.25rem;
  border-radius: 6px;
  margin-bottom: 2rem;
  font-weight: 500;
}

/* Order overview section (Order #, Date, Email, etc.) */
.woocommerce-order-overview {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
  background: #fafafa;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 1rem 1.25rem;
  margin-bottom: 2rem;
}
.woocommerce-order-overview li {
  list-style: none;
  flex: 1 1 180px;
  font-size: 0.9rem;
  color: #333;
}
.woocommerce-order-overview strong {
  display: block;
  font-weight: 600;
  color: #000;
  margin-top: 4px;
}

/* Payment instruction text */
.woocommerce-order > p {
  margin-bottom: 2rem;
  color: #444;
}

/* Order Details Header */
.woocommerce-order-details__title {
  font-weight: 600;
  font-size: 1.25rem;
  border-bottom: 2px solid var(--e-global-color-accent, #ff7700);
  display: inline-block;
  padding-bottom: 0.25rem;
  margin-bottom: 1rem;
}

/* Order table cleanup */
.woocommerce-table--order-details {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border: 1px solid #e2e2e2;
  border-radius: 8px;
  overflow: hidden;
}

.woocommerce-table--order-details th,
.woocommerce-table--order-details td {
  padding: 0.85rem 1rem;
  border-bottom: 1px solid #e6e6e6;
  vertical-align: top;
}

.woocommerce-table--order-details th {
  text-transform: uppercase;
  font-size: 0.8rem;
  letter-spacing: 0.5px;
  color: #666;
}

.woocommerce-table__product-name a {
  color: var(--e-global-color-accent, #ff7700);
  text-decoration: none;
  font-weight: 600;
}

/* Product meta (your config items) */
.wc-item-meta {
  list-style: none;
  margin: 0.5rem 0 0 0;
  padding-left: 0;
}
.wc-item-meta li {
  padding: 4px 0;
  border-bottom: 1px dashed #ddd;
}
.wc-item-meta li:last-child {
  border-bottom: none;
}
.wc-item-meta-label {
  font-weight: 600;
  color: #000;
  display: inline-block;
  min-width: 180px;
}
.wc-item-meta p {
  display: inline;
  margin: 0;
  color: #444;
}

/* Totals section cleanup */
.woocommerce-table--order-details tfoot th {
  font-weight: 600;
  color: #000;
}
.woocommerce-table--order-details tfoot td {
  font-weight: 500;
  color: #000;
}

/* Billing address */
.woocommerce-customer-details {
  margin-top: 3rem;
}
.woocommerce-customer-details h2 {
  font-size: 1.25rem;
  font-weight: 600;
  border-bottom: 2px solid var(--e-global-color-accent, #ff7700);
  display: inline-block;
  margin-bottom: 1rem;
}
.woocommerce-customer-details address {
  background: #fafafa;
  border: 1px solid #e0e0e0;
  padding: 1rem 1.25rem;
  border-radius: 8px;
  line-height: 1.6;
  color: #333;
}
.woocommerce-customer-details p {
  margin: 0.25rem 0;
  color: #555;
  font-size: 0.9rem;
}

/* Responsive */
@media (max-width: 768px) {
  .woocommerce-order-overview {
    flex-direction: column;
  }
}


/* Standardize WooCommerce Price Colors */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .price ins {
    color: var(--ghetx-accent) !important; /* Gulf orange */
}

/* Optional: make sale prices consistent too */
.woocommerce ul.products li.product .price del {
    color: var(--ghetx-text-muted); !important; /* muted gray for old price */
}

.wapf-field-description {
    margin-top: 0px;
    margin-bottom: 22px !important;
    font-size: 0.9em;
    color: var(--e-global-color-text, #000);
}

/* ============================================================
   Gulf Highway Equipment - Unified WAPF styling
   (Option A normalized + Option B polished)
   ============================================================ */


/* ---- Grid layout (Option B) ---- */
.ghe-swatch-grid.wapf-image-swatch-wrapper {
  --ghe-border: #dcdcdc;
  --ghe-border-active: #ff6600;
  --ghe-bg: #fff;
  --ghe-bg-active: rgba(255, 102, 0, 0.05);
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(var(--wapf-cols, 4), 1fr);
}
@media (max-width: 1024px) {
  .ghe-swatch-grid.wapf-image-swatch-wrapper {
    grid-template-columns: repeat(var(--wapf-cols-t, 2), 1fr);
  }
}
@media (max-width: 768px) {
  .ghe-swatch-grid.wapf-image-swatch-wrapper {
    grid-template-columns: repeat(var(--wapf-cols-m, 2), 1fr);
  }
}

/* Each option card */
.ghe-swatch-grid .wapf-swatch.wapf-swatch--image {
  border: 1px solid var(--ghe-border);
  border-radius: 6px;
  background: var(--ghe-bg);
  padding: 12px;
  text-align: center;
  transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
  cursor: pointer;
}
.ghe-swatch-grid .wapf-swatch.wapf-swatch--image:hover {
  border-color: var(--ghe-border-active);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.06);
}
.ghe-swatch-grid .wapf-swatch.wapf-swatch--image.wapf-checked {
  border: 2px solid var(--ghe-border-active);
  background: var(--ghe-bg-active);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

/* Image styling */
.ghe-swatch-grid .wapf-swatch.wapf-swatch--image img {
  max-width: 140px;
  height: auto;
  display: block;
  margin: 0 auto 10px auto;
}

/* Label text */
.ghe-swatch-grid .wapf-swatch-label, .ghe-swatch-list .wapf-swatch-label {
  font-size: 0.8rem;
  color: var(--e-global-color-text, #111);
  font-weight: 400;
  line-height: 1.3;
  word-break: break-word;
}

/* Hide radios cleanly */
.ghe-swatch-grid input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* ===========================
   GHE Swatch Grid Styling
   for APF image swatches (option B)
   =========================== */

/* Outer wrapper: make sure it stays full width and has consistent gaps */
.ghe-swatch-grid.wapf-image-swatch-wrapper,
.ghe-swatch-grid .wapf-image-swatch-wrapper {
    width: 100%;
    display: grid;
    /* honor APF's responsive cols vars */
    grid-template-columns: repeat(var(--wapf-cols, 4), 1fr);
    gap: 1rem;
}

/* Tablet */
@media (max-width: 1024px) {
    .ghe-swatch-grid.wapf-image-swatch-wrapper,
    .ghe-swatch-grid .wapf-image-swatch-wrapper {
        grid-template-columns: repeat(var(--wapf-cols-t, 2), 1fr);
    }
}

/* Mobile */
@media (max-width: 768px) {
    .ghe-swatch-grid.wapf-image-swatch-wrapper,
    .ghe-swatch-grid .wapf-image-swatch-wrapper {
        grid-template-columns: repeat(var(--wapf-cols-m, 2), 1fr);
    }
}

/* Each swatch "card" */
.ghe-swatch-grid .wapf-swatch.wapf-swatch--image {
    background-color: #fff;
    border: 1px solid var(--ghetx-border-color, #dcdcdc);
    border-radius: 6px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;

    box-shadow: 0 1px 2px rgba(0,0,0,.04);
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}

/* Hover affordance */
.ghe-swatch-grid .wapf-swatch.wapf-swatch--image:hover {
    border-color: var(--ghetx-heading-color, #ff6600);
    box-shadow: 0 2px 4px rgba(0,0,0,.08);
}

/* When selected */
.ghe-swatch-grid .wapf-swatch.wapf-swatch--image.wapf-checked {
    border: 2px solid var(--ghetx-heading-color, #ff6600);
    background-color: rgba(255,102,0,0.05); /* faint orange wash */
    box-shadow: 0 2px 6px rgba(0,0,0,.08);
}

/* Reset the APF default "box" outline so it doesn't double up */
.ghe-swatch-grid .wapf-swatch.wapf-swatch--image .apf-pick-box,
.ghe-swatch-grid .wapf-swatch.wapf-swatch--image > div:first-child {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* Image itself */
.ghe-swatch-grid .wapf-swatch.wapf-swatch--image img {
    max-width: 140px;
    height: auto;
    display: block;
    margin: 0 auto 10px auto;
}

/* Label text under the image */
.ghe-swatch-grid .wapf-swatch-label {
    line-height: 1.3;
    font-size: .8rem;
    font-weight: 400;
    color: var(--e-global-color-text, #000);
    word-break: break-word;
}

/* Make sure the <input type="radio"> inside the label is hidden cleanly */
.ghe-swatch-grid .wapf-swatch.wapf-swatch--image input.wapf-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

/* ============================================================
   Gulf Highway Equipment - Truck Build Configurator Styling
   (Product Bundles + Add-Ons PRO)
   ============================================================ */

/* Overall bundle form container */
.single-product .bundle_form {
    background: var(--ghetx-bg-panel);
    border: 1px solid var(--ghetx-border-color);
    border-radius: var(--ghetx-radius-md);
    padding: 32px;
    margin-top: 24px;
    box-shadow: var(--ghetx-card-shadow);
}

/* Headings inside bundle form */
.single-product .bundle_form .bundled_items_title,
.single-product .bundle_form .bundle_title {
    font-weight: 600;
    font-size: 1.3rem;
    color: var(--ghetx-heading-color);
    margin-bottom: 16px;
}

/* Description text under bundle title */
.single-product .bundle_form .bundle_description {
    font-size: 0.95rem;
    color: var(--ghetx-text-muted);
    margin-bottom: 24px;
}

/* ===== Each bundled component card ===== */
.single-product .bundle_form .bundled_items {
    display: grid;
    gap: 24px;
}

.single-product .bundle_form .bundled_product_summary {
    background: #fff;
    border: 1px solid var(--ghetx-border-color);
    border-radius: var(--ghetx-radius-md);
    padding: 24px;
    position: relative;
    transition: box-shadow .15s ease, border-color .15s ease;
}

.single-product .bundle_form .bundled_product_summary:hover {
    border-color: var(--ghetx-accent);
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

/* Component title */
.single-product .bundle_form .bundled_product_title {
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--ghetx-heading-color);
    margin-bottom: 8px;
}

/* Component description */
.single-product .bundle_form .bundled_product_excerpt,
.single-product .bundle_form .bundled_item_description {
    font-size: 0.9rem;
    color: var(--ghetx-text-muted);
    margin-bottom: 10px;
}

/* Inner divider before options */
.single-product .bundle_form .bundled_item_cart_details {
    border-top: 1px solid var(--ghetx-border-color);
    margin-top: 10px;
    padding-top: 10px;
}

/* ===== Variation selects, quantities, and Add-Ons PRO fields ===== */
.single-product .bundle_form select,
.single-product .bundle_form input[type="number"],
.single-product .bundle_form input[type="text"],
.single-product .bundle_form textarea {
    background: #fff;
    border: 1px solid var(--ghetx-input-border);
    border-radius: var(--ghetx-radius-sm);
    font-size: 0.95rem;
    color: var(--e-global-color-text, #000);
    padding: 10px 12px;
    width: 100%;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.single-product .bundle_form select:focus,
.single-product .bundle_form input[type="number"]:focus,
.single-product .bundle_form input[type="text"]:focus,
.single-product .bundle_form textarea:focus {
    border-color: var(--ghetx-input-focus-ring);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--ghetx-input-focus-ring), white 75%);
    outline: none;
}

/* Add-Ons labels */
.single-product .bundle_form .wc-pao-addon-name {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--ghetx-heading-color);
    margin-bottom: 4px;
}

/* Add-Ons helper text */
.single-product .bundle_form .wc-pao-addon-description {
    font-size: 0.8rem;
    color: var(--ghetx-text-muted);
    margin-bottom: 8px;
}

/* Textareas for “Custom Notes” stand out lightly */
.single-product .bundle_form .wc-pao-addon textarea {
    background: var(--ghetx-bg-panel);
    min-height: 80px;
    resize: vertical;
}

/* Smooth conditional show/hide animation */
.single-product .bundle_form .wc-pao-addon.wc-pao-addon-wrap {
    transition: opacity 0.2s ease, transform 0.2s ease;
}
.single-product .bundle_form .wc-pao-addon[style*="display: none"] {
    opacity: 0;
    transform: translateY(-4px);
}

/* ===== Per-component price ===== */
.single-product .bundle_form .bundled_product_price,
.single-product .bundle_form .bundled_item_cart_details .price {
    font-weight: 600;
    color: var(--ghetx-accent);
    font-size: 0.95rem;
    margin-top: 4px;
}

/* ===== Add to cart button ===== */
.single-product .bundle_form .single_add_to_cart_button {
    background-color: var(--ghetx-accent);
    border: 1px solid var(--ghetx-accent);
    border-radius: var(--ghetx-radius-sm);
    padding: 12px 28px;
    font-weight: 600;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: background-color .2s ease;
}
.single-product .bundle_form .single_add_to_cart_button:hover {
    background-color: var(--ghetx-accent-hover);
    border-color: var(--ghetx-accent-hover);
}

/* ===== Responsive grid ===== */
@media (min-width: 992px) {
    .single-product .bundle_form .bundled_items {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 767px) {
    .single-product .bundle_form {
        padding: 20px;
    }
}

/* ============================================================
   APF Repeater Buttons – subtle utility style
   ============================================================ */

.wapf-cloner {
    margin-top: 18px;                 /* space away from last checkbox */
    padding-top: 10px;
    border-top: 1px solid #eee;       /* light divider from options */
    display: flex;
    justify-content: flex-end;        /* move buttons to the right */
    gap: 8px;
}

/* Base style: small, quiet, no big CTA look */
.wapf-cloner .button,
.wapf-cloner .wapf-add-clone,
.wapf-cloner .wapf-del-clone {
    font-family: var(--e-global-typography-text-font-family, "Inter"), system-ui, sans-serif;
    font-size: 0.75rem !important;
    line-height: 1.2;
    font-weight: 500;
    text-transform: none !important;
    letter-spacing: 0;

    padding: 6px 10px !important;
    border-radius: 4px;
    border: 1px solid #dcdcdc !important;
    background-color: #fff !important;
    color: #555 !important;

    box-shadow: none !important;
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease, background-color .15s ease;
}

/* Hover: just a hint of orange, not a full block */
.wapf-cloner .wapf-add-clone:hover,
.wapf-cloner .wapf-del-clone:hover {
    border-color: var(--e-global-color-accent) !important;
    color: var(--e-global-color-accent) !important;
    background-color: rgba(255, 102, 0, 0.04) !important;
}

/* Optional: slightly differentiate Delete */
.wapf-cloner .wapf-del-clone {
    opacity: 0.9;
}
.wapf-cloner .wapf-del-clone:hover {
    opacity: 1;
}

/* When Delete is hidden (first row), no weird spacing */
.wapf-cloner .wapf-del-clone[style*="display: none"] {
    margin: 0;
}


/* ============================================================
   APF Product Cards (qty-select from products) – GHETX styling
   ============================================================ */

/* Wrapper: vertical stack, consistent gaps */
.wapf-field-container.wapf-field-products .wapf-card-wrap {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Card shell */
.wapf-field-container.wapf-field-products .wapf-card {
    border: 1px solid var(--ghetx-border-color, #dcdcdc);
    border-radius: var(--ghetx-radius-md, 6px);
    background-color: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

.wapf-field-container.wapf-field-products .wapf-card-inner {
    display: flex;
    gap: 14px;
    padding: 10px 14px;
    align-items: flex-start;
    box-sizing: border-box;
}

/* Image */
.wapf-field-container.wapf-field-products .wapf-card-img img {
    max-width: 80px;
    height: auto;
    border-radius: 4px;
}

/* Body layout */
.wapf-field-container.wapf-field-products .wapf-card-body {
    flex: 1;
}

/* Title + price row */
.wapf-field-container.wapf-field-products .wapf-card-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
}

.wapf-field-container.wapf-field-products .wapf-card-title span {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--ghetx-heading-color);
}

.wapf-field-container.wapf-field-products .wapf-card-price {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--ghetx-accent);
}

/* Description row */
.wapf-field-container.wapf-field-products .wapf-card-desc {
    font-size: 0.8rem;
    color: var(--ghetx-text-muted);
    margin-bottom: 4px;
}

/* Link + stock row */
.wapf-field-container.wapf-field-products .wapf-card-link a {
    font-size: 0.8rem;
    color: var(--e-global-color-accent);
    text-decoration: none;
}
.wapf-field-container.wapf-field-products .wapf-card-link a:hover {
    text-decoration: underline;
}
.wapf-field-container.wapf-field-products .wapf-card-stock {
    font-size: 0.8rem;
    color: var(--ghetx-text-muted);
}

/* ===========================
   Qty controls (+ / –) styling
   =========================== */

.wapf-field-container.wapf-field-products .wapf-card-qty {
    margin-top: 4px;
}

.wapf-field-container.wapf-field-products .wapf-card-qty .apf-plusmin {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

/* Number input */
.wapf-field-container.wapf-field-products .wapf-card-qty .apf-plusmin input[type="number"] {
    width: 52px;
    text-align: center;
    border-radius: var(--ghetx-radius-sm, 4px);
    border: 1px solid var(--ghetx-input-border, #cfcfcf);
    padding: 4px 6px;
    font-size: 0.8rem;
    line-height: 1.2;
}

/* Plus / minus buttons – small, neutral, not big orange blocks */
.wapf-field-container.wapf-field-products .wapf-card-qty .apf-plusmin .button.apf-plus,
.wapf-field-container.wapf-field-products .wapf-card-qty .apf-plusmin .button.apf-minus {
    background-color: #fff !important;
    border: 1px solid var(--ghetx-border-color, #dcdcdc) !important;
    color: var(--e-global-color-text, #000) !important;

    padding: 4px 8px !important;
    min-width: auto;
    line-height: 1;
    border-radius: 4px;

    box-shadow: none !important;
    font-size: 0.75rem;
}

/* Hover: light accent hint */
.wapf-field-container.wapf-field-products .wapf-card-qty .apf-plusmin .button.apf-plus:hover,
.wapf-field-container.wapf-field-products .wapf-card-qty .apf-plusmin .button.apf-minus:hover {
    border-color: var(--e-global-color-accent) !important;
    color: var(--e-global-color-accent) !important;
    background-color: rgba(255, 102, 0, 0.05) !important;
}

/* ===========================
   Responsive tweak
   =========================== */
@media (max-width: 600px) {
    .wapf-field-container.wapf-field-products .wapf-card-inner {
        flex-direction: row;
        align-items: flex-start;
    }
}