/* =========================================================
   CME CUSTOM SINGLE PRODUCT PAGE
   File: /css/single-product-shop.css
   ========================================================= */


/* ---------------------------------------------------------
   1. PAGE FOUNDATION
   --------------------------------------------------------- */

body.single-product {
    background: #ffffff;
}

body.single-product .site-main,
body.single-product main,
body.single-product .content-area,
body.single-product .site-content {
    overflow: visible;
}

body.single-product .woocommerce {
    width: 100%;
    max-width: none;
}


/* ---------------------------------------------------------
   REMOVE THEME CONTENT/SIDEBAR WIDTH LIMIT
   --------------------------------------------------------- */

/* Allow the product page wrapper to use the full content width 

body.single-product .onerow.max1000 {
    width: 100% !important;
    max-width: 1400px !important;

    margin-right: auto !important;
    margin-left: auto !important;
}*/
body.single-product .onerow.max1000 {
    width: 100% !important;
    max-width: 1200px !important;

    margin-right: auto !important;
    margin-left: auto !important;
    padding-right: 0 !important;
    padding-left: 0 !important;

    box-sizing: border-box !important;
}


/* The theme's col9 class reserves space for a sidebar */

body.single-product .col9.main-content {
    float: none !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* Hide an empty sidebar if the theme still outputs one */

body.single-product .col3.sidebar,
body.single-product aside.sidebar {
    display: none !important;
}


/* Let the article itself occupy the full wrapper */

body.single-product article.post {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;
}

/* ---------------------------------------------------------
   PRODUCT BREADCRUMB
   --------------------------------------------------------- */

body.single-product .cme-product-breadcrumb {
    display: flex;
    align-items: center;
    gap: 7px;

    width: 100%;
 /*   max-width: 1400px;*/
    max-width: 1200px;

    margin: 0 auto;
    padding: 20px 24px 14px;

    color: #222222;

    font-size: 13px;
    line-height: 1.4;

    box-sizing: border-box;
}

body.single-product .cme-product-breadcrumb a {
    color: #111111;
    font-weight: 600;

    text-decoration: underline;
    text-underline-offset: 2px;
}

body.single-product .cme-product-breadcrumb a:hover {
    color: #008f68;
}

body.single-product .cme-product-breadcrumb-separator {
    color: #666666;
}

body.single-product .cme-product-breadcrumb-current {
    color: #222222;
}


/* Mobile */

@media screen and (max-width: 768px) {

    body.single-product .cme-product-breadcrumb {
        padding: 14px 15px 12px;
    }
}


/* ---------------------------------------------------------
   3. MAIN TWO-COLUMN PRODUCT LAYOUT
   --------------------------------------------------------- */

body.single-product
.woocommerce
div.product {
    display: grid !important;
    grid-template-columns: minmax(320px, 35fr) minmax(0, 65fr);
    column-gap: 36px;
    align-items: start;

    width: 100% !important;
   /* max-width: 1400px; */
   max-width: 1200px;

    margin: 0 auto !important;
    padding: 0 24px 70px;

    box-sizing: border-box;
}

body.single-product
.woocommerce
div.product > * {
    min-width: 0;
}


/* Gallery: left side */

body.single-product
.woocommerce
div.product
.woocommerce-product-gallery,
body.single-product
.woocommerce
div.product
.images {
    grid-column: 1;
    grid-row: 1;

    float: none !important;
    clear: none !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    box-sizing: border-box;
}


/* Summary: right side */

body.single-product
.woocommerce
div.product
.summary,
body.single-product
.woocommerce
div.product
.summary.entry-summary {
    grid-column: 2;
    grid-row: 1;

    float: none !important;
    clear: none !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    position: sticky;
    top: 24px;

    box-sizing: border-box;
}

/* Gallery images that do not match the current selections */

body.single-product
.cme-product-gallery-item.cme-gallery-item-hidden {
    display: none !important;
}


/* Everything after the gallery and summary spans both columns */

body.single-product
.woocommerce
div.product
.woocommerce-tabs,
body.single-product
.woocommerce
div.product
.related.products,
body.single-product
.woocommerce
div.product
.up-sells.upsells {
    grid-column: 1 / -1;

    width: 100% !important;
    max-width: none !important;

    float: none !important;
    clear: both !important;
}


/* Clear old WooCommerce floats */

body.single-product
.woocommerce
div.product::before,
body.single-product
.woocommerce
div.product::after {
    display: none !important;
    content: none !important;
}


/* ---------------------------------------------------------
   4. CUSTOM PRODUCT GALLERY
   One large image followed by two small images, repeating
   --------------------------------------------------------- */

body.single-product .cme-product-gallery {
    display: block;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: visible;
}


/* Repeating two-column gallery */

body.single-product .cme-product-gallery-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;

    width: 100%;
    margin: 0;
    padding: 0;
}


/* Every image card */

body.single-product .cme-product-gallery-item {
    position: relative;

    display: block;

    width: 100%;
    min-width: 0;

    margin: 0;
    padding: 0;

    overflow: hidden;

    border-radius: 14px;
    background: #f1f1f1;

    box-sizing: border-box;
}


/* Images 1, 4, 7, 10, etc. span both columns */

body.single-product .cme-product-gallery-item--large {
    grid-column: 1 / -1;
}


/* Image link fills its card */

body.single-product .cme-product-gallery-link {
    display: block;

    width: 100%;
    height: 100%;

    margin: 0;
    padding: 0;

    overflow: hidden;
}


/* All gallery images */

body.single-product .cme-product-gallery-image {
    display: block;

    width: 100%;
    max-width: none;

    margin: 0;
    padding: 0;

    border: 0;

    box-sizing: border-box;

    transition:
        transform 0.2s ease,
        opacity 0.2s ease;
}


/* Large images */

body.single-product
.cme-product-gallery-item--large
.cme-product-gallery-image {
    width: 100%;
    height: 100%;

    aspect-ratio: 4 / 3;

    object-fit: cover;
    object-position: center;
}


/* Small images */

body.single-product
.cme-product-gallery-item--small
.cme-product-gallery-image {
    width: 100%;
    height: 100%;

    aspect-ratio: 1 / 1;

    object-fit: cover;
    object-position: center;
}


/* Hover */

body.single-product
.cme-product-gallery-link:hover
.cme-product-gallery-image {
    opacity: 0.94;
    transform: scale(1.01);
}


/* Remove default WooCommerce gallery pieces */

body.single-product
.woocommerce-product-gallery
.flex-viewport,
body.single-product
.woocommerce-product-gallery
.flex-control-thumbs,
body.single-product
.woocommerce-product-gallery
.woocommerce-product-gallery__trigger {
    display: none !important;
}


/* Tablet */

@media screen and (max-width: 1050px) {

    body.single-product .cme-product-gallery-grid {
        gap: 12px;
    }
}


/* Mobile */

@media screen and (max-width: 768px) {

    body.single-product .cme-product-gallery-grid {
        gap: 10px;
    }

    body.single-product .cme-product-gallery-item {
        border-radius: 10px;
    }
}


/* ---------------------------------------------------------
   REMOVE THEME TITLE AND DATE ABOVE PRODUCT
   Exact selectors from the theme markup
   --------------------------------------------------------- */

body.single-product article.post > h1.title,
body.single-product article.post > .post-meta {
    display: none !important;
}


/* ---------------------------------------------------------
   PRODUCT TITLE IN RIGHT COLUMN
   --------------------------------------------------------- */

body.single-product
.woocommerce
div.product
.summary
.cme-product-title {
    display: block !important;

    width: 100%;

    margin: 0 0 16px !important;
    padding: 0 !important;

    color: #111111 !important;

    font-size: 36px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.02em;
}

@media screen and (max-width: 768px) {

    body.single-product
    .woocommerce
    div.product
    .summary
    .cme-product-title {
        font-size: 30px;
    }
}


/* =========================================================
   DESCRIPTION / FEATURES TABS
   ========================================================= */

body.single-product .cme-product-info-tabs {
    width: 100%;
    margin: 0 0 22px;
}

body.single-product .cme-product-info-tab-buttons {
    display: flex;
    align-items: center;
    gap: 18px;

    width: 100%;

    margin: 0 0 14px;
    padding: 0;

    border-bottom: 1px solid #d7dcda;
}

body.single-product .cme-product-info-tab-button {
    appearance: none;

    display: inline-flex;
    align-items: center;

    margin: 0 0 -1px;
    padding: 0 0 9px;

    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;

    background: transparent;
    box-shadow: none;

    color: #222222;

    font: inherit;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;

    cursor: pointer;
}

body.single-product .cme-product-info-tab-button.is-active {
    color: #008f68;
    border-bottom-color: #008f68;
}

body.single-product .cme-product-info-tab-panel {
    display: none;

    width: 100%;

    color: #5f686d;

    font-size: 14px;
    line-height: 1.55;
}

body.single-product .cme-product-info-tab-panel.is-active {
    display: block;
}

body.single-product .cme-product-info-tab-panel p {
    margin: 0 0 11px;
}

body.single-product .cme-product-info-tab-panel p:last-child {
    margin-bottom: 0;
}

body.single-product .cme-product-info-tab-panel ul {
    margin: 0;
    padding-left: 20px;
}

body.single-product .cme-product-info-tab-panel li {
    margin-bottom: 6px;
}

/* ---------------------------------------------------------
   6. DESCRIPTION / FEATURES TABS
   --------------------------------------------------------- */

body.single-product .cme-product-tabs {
    width: 100%;
    margin: 0 0 23px;
}

body.single-product .cme-product-tab-buttons {
    display: flex;
    align-items: center;
    gap: 22px;

    margin: 0 0 14px;
    padding: 0;

    border-bottom: 1px solid #d8ddda;
}

body.single-product .cme-product-tab-button {
    appearance: none;

    display: inline-flex;
    align-items: center;

    margin: 0 0 -1px;
    padding: 0 0 10px;

    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;

    background: transparent;
    box-shadow: none;

    color: #171717;

    font: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;

    cursor: pointer;
}

body.single-product .cme-product-tab-button:hover,
body.single-product .cme-product-tab-button:focus {
    color: #008f68;
    background: transparent;
    outline: none;
}

body.single-product .cme-product-tab-button.is-active {
    color: #008f68;
    border-bottom-color: #008f68;
}

body.single-product .cme-product-tab-panel {
    color: #363b3d;
    font-size: 14px;
    line-height: 1.62;
}

body.single-product .cme-product-tab-panel[hidden] {
    display: none;
}

body.single-product .cme-product-tab-panel p {
    margin: 0 0 12px;
}

body.single-product .cme-product-tab-panel p:last-child {
    margin-bottom: 0;
}

body.single-product .cme-product-tab-panel ul {
    margin: 0;
    padding-left: 18px;
}

body.single-product .cme-product-tab-panel li {
    margin: 0 0 6px;
}


/* Features */

body.single-product .cme-product-features-list {
    margin: 0;
    padding: 0;

    list-style: none;
}

body.single-product .cme-product-feature {
    display: grid;
    grid-template-columns: minmax(90px, 135px) minmax(0, 1fr);
    gap: 16px;

    padding: 9px 0;

    border-bottom: 1px solid #e1e5e3;
}

body.single-product .cme-product-feature:last-child {
    border-bottom: 0;
}

body.single-product .cme-product-feature-name {
    color: #171717;
    font-weight: 700;
}

body.single-product .cme-product-feature-value {
    color: #4a5052;
}




/* ---------------------------------------------------------
   RESTORE LIST FORMATTING INSIDE DESCRIPTION / FEATURES
   --------------------------------------------------------- */

body.single-product
.cme-product-info-tab-panel
ul {
    display: block !important;

    margin: 10px 0 16px 24px !important;
    padding: 0 !important;

    list-style-type: disc !important;
    list-style-position: outside !important;
}

body.single-product
.cme-product-info-tab-panel
ul
li {
    display: list-item !important;
    float: none !important;

    width: auto !important;

    margin: 0 0 6px !important;
    padding: 0 !important;

    list-style-type: disc !important;

    white-space: normal !important;
}


/* Keep headings neatly spaced inside either tab */

body.single-product
.cme-product-info-tab-panel
h1,
body.single-product
.cme-product-info-tab-panel
h2,
body.single-product
.cme-product-info-tab-panel
h3,
body.single-product
.cme-product-info-tab-panel
h4 {
    display: block;

    margin: 0 0 10px !important;
    padding: 0;

    line-height: 1.25;
}


/* ---------------------------------------------------------
   7. CART FORM
   --------------------------------------------------------- */

body.single-product
.summary
form.cart {
    display: block;

    width: 100%;

    margin: 22px 0 0;
    padding: 0;

    border-top: 1px solid #d7dcda;
}

body.single-product
.summary
form.cart::before {
    content: "Choose your options";

    display: block;

    padding: 18px 0 15px;

    color: #181818;

    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
}


/* ---------------------------------------------------------
   HIDE INTERNAL APF CALCULATION FIELDS
   Calculations still run; customers do not see the rows.
   --------------------------------------------------------- */

body.single-product .wapf-field-container.wapf-field-calc {
    display: none !important;
}


/* ---------------------------------------------------------
   8. ADVANCED PRODUCT FIELDS STRUCTURE
   Labels left, options right
   --------------------------------------------------------- */

body.single-product
.summary
form.cart
.wapf,
body.single-product
.summary
form.cart
.wapf-wrapper,
body.single-product
.summary
form.cart
.wapf-field-group {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* Each Advanced Product Field becomes one horizontal row */

body.single-product .wapf-field-container {
    display: grid;
    grid-template-columns: 125px minmax(0, 1fr);
    column-gap: 18px;
    align-items: center;

    width: 100% !important;

    margin: 0 !important;
    padding: 14px 0 !important;

    border-bottom: 1px solid #d7dcda;

    box-sizing: border-box;
}

/* Allow Advanced Product Fields conditional logic to hide fields */

body.single-product .wapf-field-container[style*="display: none"],
body.single-product .wapf-field-container.wapf-hidden,
body.single-product .wapf-field-container.wapf-hide {
    display: none !important;
}


/* Label area: text column plus reserved help-icon column */

body.single-product .wapf-field-label {
    grid-column: 1;

    display: grid;
    grid-template-columns: minmax(0, 1fr) 26px;
    column-gap: 6px;
    align-items: center;

    width: 100%;

    margin: 0 !important;
    padding: 0 !important;
}

body.single-product .wapf-field-label > label {
    grid-column: 1;

    display: block;

    min-width: 0;
    margin: 0;
    padding: 0;

    color: #1a1a1a;

    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
}


/* Input, selected option or calculated value: right column */

body.single-product .wapf-field-input {
    grid-column: 2;

    display: block;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* Some APF versions place an extra row wrapper around the input */

body.single-product .wapf-field-row {
    display: contents;
}


/* Description text belongs beneath the control, not beneath the label */

body.single-product .wapf-field-description {
    grid-column: 2;

    width: 100%;

    margin: 6px 0 0 !important;
    padding: 0 !important;

    color: #656c6e;

    font-size: 12px;
    line-height: 1.4;
}


/* Static text and calculation fields */

body.single-product
.wapf-field-container
.wapf-field-input
.wapf-pricing-hint,
body.single-product
.wapf-field-container
.wapf-field-input
.wapf-calculated,
body.single-product
.wapf-field-container
.wapf-field-input
.wapf-calculated-value {
    display: block;

    margin: 0;

    color: #65717a;
    font-size: 14px;
    line-height: 1.4;
}


/* Make selects fill only the right-hand option column */

body.single-product
.wapf-field-container
.wapf-field-input
select {
    width: 100% !important;
    max-width: none !important;
}


/* Help icon always occupies the right-hand label column */

body.single-product .wapf-field-label > .cme-help {
    grid-column: 2;

    position: relative;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 26px;
    height: 26px;

    margin: 0 !important;
    padding: 0;

    justify-self: end;
    align-self: center;
}

body.single-product .cme-help-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 24px;
    height: 24px;
    flex: 0 0 24px;

    margin: 0;
    padding: 0;

    border: 1px solid #8d9793;
    border-radius: 50%;

    background: #ffffff;
    color: #222222;

    font-size: 13px;
    font-weight: 700;
    line-height: 1;

    cursor: pointer;
    box-sizing: border-box;
}


/* Horizontal option choices within the right column */

body.single-product
.wapf-field-container
.wapf-field-input
.wapf-checkable {
    margin-top: 0;
    margin-bottom: 0;
}

body.single-product
.wapf-field-container
.wapf-field-input
.wapf-radios,
body.single-product
.wapf-field-container
.wapf-field-input
.wapf-checkboxes,
body.single-product
.wapf-field-container
.wapf-field-input
.wapf-image-swatch-wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 9px;

    width: 100%;
}

/* ---------------------------------------------------------
   PRODUCT FIELD HELP TOOLTIPS
   --------------------------------------------------------- */


/* Tooltip text is hidden by default */

body.single-product .cme-help-popup {
    display: none;

    position: absolute;
    z-index: 9999;

    left: 50%;
    bottom: calc(100% + 10px);
    transform: translateX(-50%);

    width: max-content;
    max-width: 280px;

    padding: 10px 12px;

    border: 1px solid #cbd3d0;
    border-radius: 7px;

    background: #ffffff;
    color: #222222;

    font-size: 13px;
    font-weight: 400;
    line-height: 1.45;
    text-align: left;

    white-space: normal;

    box-shadow: 0 5px 18px rgba(0, 0, 0, 0.16);
}


/* Small pointer under the popup */

body.single-product .cme-help-popup::after {
    content: "";

    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);

    border-width: 6px;
    border-style: solid;
    border-color: #ffffff transparent transparent transparent;
}


/* Your JavaScript adds .open when clicked */

body.single-product .cme-help.open .cme-help-popup {
    display: block;
}


/* Optional desktop hover support */

@media (hover: hover) {

    body.single-product .cme-help:hover .cme-help-popup {
        display: block;
    }
}


/* Keep popup inside narrower screens */

@media screen and (max-width: 600px) {

    body.single-product .cme-help-popup {
        left: 0;
        transform: none;

        width: 240px;
        max-width: calc(100vw - 30px);
    }

    body.single-product .cme-help-popup::after {
        left: 11px;
        transform: none;
    }
}

/* ---------------------------------------------------------
   HIDE WOOCOMMERCE DEFAULT QUANTITY
   We use an APF quantity dropdown instead.
--------------------------------------------------------- */

body.single-product
.summary
form.cart
> .quantity {
    display: none !important;
}

/* ---------------------------------------------------------
   HIDE PRODUCT META
--------------------------------------------------------- */

body.single-product .product_meta {
    display: none !important;
}

/* ---------------------------------------------------------
   9. RADIO AND CHECKBOX CARDS
   --------------------------------------------------------- */

body.single-product
.wapf-field-radio
.wapf-field-input,
body.single-product
.wapf-field-checkboxes
.wapf-field-input,
body.single-product
.wapf-field-images
.wapf-field-input {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

body.single-product
.wapf-field-radio
.wapf-checkable,
body.single-product
.wapf-field-checkboxes
.wapf-checkable {
    position: relative;

    display: inline-flex;
    flex: 1 1 120px;

    min-width: 110px;

    margin: 0;
}

body.single-product
.wapf-field-radio
.wapf-checkable
label,
body.single-product
.wapf-field-checkboxes
.wapf-checkable
label {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    min-height: 44px;

    margin: 0;
    padding: 9px 14px;

    border: 1px solid #c9d0cd;
    border-radius: 9px;

    background: #ffffff;

    color: #202526;

    font-size: 13px;
    font-weight: 600;
    line-height: 1.25;
    text-align: center;

    cursor: pointer;

    box-sizing: border-box;

    transition:
        border-color 0.18s ease,
        background-color 0.18s ease,
        box-shadow 0.18s ease,
        color 0.18s ease;
}

body.single-product
.wapf-field-radio
.wapf-checkable
label:hover,
body.single-product
.wapf-field-checkboxes
.wapf-checkable
label:hover {
    border-color: #008f68;
}

body.single-product
.wapf-field-radio
.wapf-checkable
input,
body.single-product
.wapf-field-checkboxes
.wapf-checkable
input {
    position: absolute;

    width: 1px;
    height: 1px;

    margin: 0;
    padding: 0;

    opacity: 0;
    pointer-events: none;
}

body.single-product
.wapf-field-radio
.wapf-checkable
input:checked + label,
body.single-product
.wapf-field-checkboxes
.wapf-checkable
input:checked + label,
body.single-product
.wapf-field-radio
.wapf-checkable
input:checked ~ label,
body.single-product
.wapf-field-checkboxes
.wapf-checkable
input:checked ~ label {
    border-color: #008f68;
    background: #f4fbf8;
    color: #006d50;

    box-shadow: 0 0 0 1px #008f68;
}

body.single-product
.wapf-checkable
input:focus-visible + label,
body.single-product
.wapf-checkable
input:focus-visible ~ label {
    outline: 2px solid #008f68;
    outline-offset: 2px;
}


/* ---------------------------------------------------------
   10. IMAGE SELECTION CARDS
   --------------------------------------------------------- */

body.single-product
.wapf-field-images
.wapf-checkable {
    flex: 1 1 140px;

    min-width: 125px;
    margin: 0;
}

body.single-product
.wapf-field-images
.wapf-checkable
label {
    display: flex;
    flex-direction: column;

    width: 100%;

    padding: 8px;

    border: 1px solid #d0d5d3;
    border-radius: 11px;

    background: #ffffff;

    box-sizing: border-box;
    cursor: pointer;
}

body.single-product
.wapf-field-images
.wapf-checkable
img {
    display: block;

    width: 100%;
    aspect-ratio: 4 / 3;

    margin: 0 0 7px;

    border-radius: 7px;

    object-fit: cover;
}

body.single-product
.wapf-field-images
.wapf-checkable
input:checked + label,
body.single-product
.wapf-field-images
.wapf-checkable
input:checked ~ label {
    border-color: #008f68;
    background: #f4fbf8;

    box-shadow: 0 0 0 1px #008f68;
}


/* =========================================================
   APF CARD FIELD STRUCTURE
   Layout only — colors remain in the separate color section
   ========================================================= */


/*
 * Force every APF card field into a horizontal, wrapping row.
 */

body.single-product
.wapf-field-input:has(.wapf-card) {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center;
    justify-content: flex-start;

    gap: 7px;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;
}


/*
 * Some APF card fields include one additional wrapper.
 * Make that wrapper behave as the horizontal card container too.
 */

body.single-product
.wapf-field-input:has(.wapf-card)
> div:not(.wapf-card) {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center;
    justify-content: flex-start;

    gap: 7px;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* Individual option card */

body.single-product .wapf-card {
    position: relative;

    display: inline-flex !important;
    flex: 0 0 auto !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 1px solid;
    border-radius: 999px;

    overflow: hidden;
    box-sizing: border-box;

    cursor: pointer;
}


/* Remove APF's internal vertical spacing */

body.single-product .wapf-card-body,
body.single-product .wapf-card-row {
    display: flex !important;
    align-items: center;
    justify-content: center;

    width: auto !important;
    min-width: 0 !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    box-sizing: border-box;
}


/* Compact card title */

body.single-product .wapf-card-title {
    display: flex !important;
    align-items: center;
    justify-content: center;

    width: auto !important;
    min-width: 0 !important;

    margin: 0 !important;
    padding: 1px 3px !important;

    text-align: center;
    box-sizing: border-box;
}

body.single-product .wapf-card-title span {
    display: block;

    margin: 0 !important;
    padding: 0 !important;

    font-size: 13px;
    font-weight: 600;
    line-height: 1.15;
    white-space: nowrap;
}


/* Hide the real checkbox/radio without disabling it */

body.single-product
.wapf-card
input[type="checkbox"],
body.single-product
.wapf-card
input[type="radio"] {
    position: absolute !important;

    width: 1px !important;
    height: 1px !important;

    margin: 0 !important;
    padding: 0 !important;

    opacity: 0 !important;
    pointer-events: none;
}


/* Do not display APF card images in these compact pills */

body.single-product .wapf-card-image {
    display: none !important;
}


body.single-product .wapf-card,
body.single-product .wapf-card * {
    cursor: pointer;
}

/* =========================================================
   DESCRIPTION / FEATURES TAB COLORS
   Change these values later after approval
   ========================================================= */

body.single-product {
    --cme-tab-text: #222222;
    --cme-tab-active-text: #6775da;
    --cme-tab-active-line: #6775da;
    --cme-tab-panel-text: #363b3d;
    --cme-feature-label-text: #171717;
    --cme-feature-value-text: #6775da;
}

body.single-product .cme-product-info-tab-button {
    color: var(--cme-tab-text);
}

body.single-product .cme-product-info-tab-button:hover,
body.single-product .cme-product-info-tab-button:focus,
body.single-product .cme-product-info-tab-button.is-active {
    color: var(--cme-tab-active-text);
}

body.single-product .cme-product-info-tab-button.is-active {
    border-bottom-color: var(--cme-tab-active-line);
}

body.single-product .cme-product-info-tab-panel {
    color: var(--cme-tab-panel-text);
}

body.single-product .cme-product-feature-row dt {
    color: var(--cme-feature-label-text);
}

body.single-product .cme-product-feature-row dd {
    color: var(--cme-feature-value-text);
}

/* =========================================================
   APF CARD COLORS
   Change only these variables after color approval
   ========================================================= */

body.single-product {
    --cme-card-border: #aeb7b3;
    --cme-card-background: #ffffff;
    --cme-card-text: #252a2b;

    --cme-card-hover-border: #008f68;
    --cme-card-hover-background: #ffffff;
    --cme-card-hover-text: #006d50;

    --cme-card-selected-border: #6775da;
    --cme-card-selected-background: #e1e4fa;
    --cme-card-selected-text: #6775da;

    --cme-card-focus: rgba(0, 143, 104, 0.25);
}


/* Normal card */

body.single-product .wapf-card {
    border-color: var(--cme-card-border);
    background: var(--cme-card-background);
    color: var(--cme-card-text);
}

body.single-product .wapf-card-title,
body.single-product .wapf-card-title span {
    color: inherit;
}


/* Hover */

body.single-product .wapf-card:hover {
    border-color: var(--cme-card-hover-border);
    background: var(--cme-card-hover-background);
    color: var(--cme-card-hover-text);
}


/* Selected card */

body.single-product
.wapf-card:has(input:checked) {
    border-color: var(--cme-card-selected-border);
    background: var(--cme-card-selected-background);
    color: var(--cme-card-selected-text);

    box-shadow:
        inset 0 0 0 1px
        var(--cme-card-selected-border);
}


/* Keyboard focus */

body.single-product
.wapf-card:has(input:focus-visible) {
    outline: 3px solid var(--cme-card-focus);
    outline-offset: 2px;
}

/* ---------------------------------------------------------
   11. FORM INPUTS
   --------------------------------------------------------- */

body.single-product
.summary
form.cart
select,
body.single-product
.summary
form.cart
input[type="text"],
body.single-product
.summary
form.cart
input[type="number"],
body.single-product
.summary
form.cart
input[type="email"],
body.single-product
.summary
form.cart
input[type="url"],
body.single-product
.summary
form.cart
textarea {
    display: block;

    width: 100% !important;
    max-width: none !important;
    min-height: 46px;

    margin: 0;
    padding: 10px 13px;

    border: 1px solid #c9cad0;
    border-radius: 8px;

    background-color: #ffffff;

    color: #202526;

    font: inherit;
    font-size: 14px;
    line-height: 1.35;

    box-shadow: none;

    box-sizing: border-box;
}

body.single-product
.summary
form.cart
textarea {
    min-height: 105px;
    resize: vertical;
}

body.single-product
.summary
form.cart
select:focus,
body.single-product
.summary
form.cart
input:focus,
body.single-product
.summary
form.cart
textarea:focus {
    border-color: #6775da !important;

    outline: 2px solid rgba(103, 117, 218, 0.20);
    outline-offset: 0;
}

body.single-product
.summary
form.cart
select {
    padding-right: 38px;
}


/* File upload area */

body.single-product
.summary
form.cart
input[type="file"] {
    width: 100%;
    max-width: 100%;
}

body.single-product
.wapf-file-upload {
    width: 100%;

    padding: 25px 15px;

    border: 1px dashed #9aa6a1;
    border-radius: 8px;

    box-sizing: border-box;
}


/* ---------------------------------------------------------
   12. STANDARD WOOCOMMERCE QUANTITY
   --------------------------------------------------------- */

body.single-product
.summary
form.cart
.quantity {
    display: block;
    float: none;

    width: 100%;

    margin: 15px 0;
}

body.single-product
.summary
form.cart
.quantity::before {
    content: "Quantity";

    display: block;

    margin: 0 0 8px;

    color: #1a1a1a;

    font-size: 14px;
    font-weight: 700;
}

body.single-product
.summary
form.cart
.quantity
.qty {
    width: 100% !important;
    min-height: 46px;

    padding: 10px 13px;

    border: 1px solid #c9d0cd;
    border-radius: 8px;

    box-sizing: border-box;
}


/* ---------------------------------------------------------
   13. VARIABLE PRODUCTS
   --------------------------------------------------------- */

body.single-product
.variations_form
table.variations {
    width: 100%;

    margin: 0;

    border: 0;
}

body.single-product
.variations_form
table.variations,
body.single-product
.variations_form
table.variations
tbody,
body.single-product
.variations_form
table.variations
tr,
body.single-product
.variations_form
table.variations
th,
body.single-product
.variations_form
table.variations
td {
    display: block;
    width: 100%;
}

body.single-product
.variations_form
table.variations
tr {
    padding: 15px 0;

    border-bottom: 1px solid #d7dcda;
}

body.single-product
.variations_form
table.variations
th,
body.single-product
.variations_form
table.variations
td {
    padding: 0;
    border: 0;
}

body.single-product
.variations_form
table.variations
th.label {
    margin: 0 0 8px;
}

body.single-product
.variations_form
table.variations
th.label
label {
    color: #1a1a1a;

    font-size: 14px;
    font-weight: 700;
}

body.single-product .reset_variations {
    display: inline-block;

    margin-top: 7px;

    color: #666666;
    font-size: 12px;
}


/* ---------------------------------------------------------
   14. APF TOTALS
   --------------------------------------------------------- */

body.single-product
.wapf-product-totals {
    width: 100%;

    margin: 0;
    padding: 18px 0;

    border-top: 1px solid #d7dcda;
    border-bottom: 0;
}

body.single-product
.wapf-product-totals
.wapf--inner {
    width: 100%;
}

body.single-product
.wapf-product-totals
.wapf-grand-total {
    color: #171717;

    font-size: 28px;
    font-weight: 700;
    line-height: 1.1;
}

body.single-product
.wapf-product-totals
span,
body.single-product
.wapf-product-totals
div {
    box-sizing: border-box;
}


/* Custom total block if the PHP inserts one */

body.single-product .cme-order-total {
    display: grid;
    grid-template-columns: 90px minmax(0, 1fr);
    align-items: center;
    gap: 7px;

    width: 100%;

    margin: 0;
    padding: 18px 0;

    border-top: 1px solid #d7dcda;

    box-sizing: border-box;
}

body.single-product .cme-order-total-label {
    color: #171717;

    font-size: 13px;
    font-weight: 700;
}

body.single-product
.cme-order-total
.price {
    display: block;

    margin: 0;
    padding: 0;

    color: #171717;

    font-size: 28px;
    font-weight: 700;
    line-height: 1.1;
}

body.single-product
.cme-order-total
.price
.woocommerce-Price-amount {
    color: inherit;

    font-size: inherit;
    font-weight: inherit;
}


/* ---------------------------------------------------------
   15. ADD TO CART BUTTON
   --------------------------------------------------------- */

body.single-product
.summary
form.cart
.single_add_to_cart_button {
    display: flex !important;
    align-items: center;
    justify-content: center;

    float: none !important;

    width: 100% !important;
    min-height: 50px;

    margin: 0;
    padding: 12px 20px;

    border: 0;
    border-radius: 999px;

    background: #6775da !important;

    color: #ffffff;

    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;

    box-shadow: none;

    cursor: pointer;

    transition:
        background-color 0.18s ease,
        transform 0.18s ease,
        box-shadow 0.18s ease;
}

body.single-product
.summary
form.cart
.single_add_to_cart_button:hover {
    background: #515dad !important;
    color: #ffffff;

    transform: translateY(-1px);

    box-shadow: 0 5px 15px rgba(0, 117, 85, 0.2);
}

body.single-product
.summary
form.cart
.single_add_to_cart_button:focus-visible {
    outline: 3px solid rgba(0, 143, 104, 0.28);
    outline-offset: 3px;
}

body.single-product
.summary
form.cart
.single_add_to_cart_button.disabled,
body.single-product
.summary
form.cart
.single_add_to_cart_button:disabled {
    background: #6775da;

    cursor: not-allowed;

    transform: none;
    box-shadow: none;
}

body.single-product
.summary
form.cart
button.button {
    float: none !important;
}


/* ---------------------------------------------------------
   16. PRODUCT TEMPLATE AND HELP CARDS
   --------------------------------------------------------- */

body.single-product .cme-product-help {
    display: grid;
    gap: 12px;

    width: 100%;

    margin: 14px 0 0;
}


/* Shared card structure */

body.single-product .cme-product-help-card {
    width: 100%;

    margin: 0;
    padding: 16px;

    border: 1px solid #e0e4e2;
    border-radius: 9px;

    color: #252a2b;

    font-size: 13px;
    line-height: 1.5;

    box-sizing: border-box;
}

body.single-product .cme-product-help-card h3 {
    margin: 0 0 7px;

    color: #1c2021;

    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
}

body.single-product .cme-product-help-card p {
    margin: 0 0 12px;
}

body.single-product .cme-product-help-card p:last-child {
    margin-bottom: 0;
}


/* A — Product-specific template box */

body.single-product
.cme-product-help-card--template {
    background: #f7f5f2;

    text-align: center;
}

body.single-product
.cme-product-help-card--template
h3 {
    text-align: center;
}


/* Template download button */

body.single-product .cme-help-button {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    min-height: 42px;

    margin: 0;
    padding: 9px 16px;

    border: 1px solid #555e5a;
    border-radius: 999px;

    background: #ffffff;
    color: #202526;

    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;

    box-sizing: border-box;

    transition:
        border-color 0.18s ease,
        background-color 0.18s ease,
        color 0.18s ease;
}

body.single-product .cme-help-button:hover,
body.single-product .cme-help-button:focus {
    border-color: #6775da;

    background: #6775da;
    color: #ffffff;

    text-decoration: none;
}


/* B — Shared customer-support box */

body.single-product
.cme-product-help-card--support {
    background: #eef5ff;
    border-color: #d8e6fa;

    text-align: left;
}

body.single-product
.cme-product-help-card--support
h3 {
    color: #1454a5;
}

body.single-product
.cme-product-help-contact-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px 7px;

    margin: 0;

    font-size: 13px;
    line-height: 1.45;
}

body.single-product
.cme-product-help-contact-links
a {
    color: #172227;

    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

body.single-product
.cme-product-help-contact-links
a:hover,
body.single-product
.cme-product-help-contact-links
a:focus {
    color: #6775da;
}

body.single-product
.cme-product-help-contact-links
span {
    color: #7d878d;
}


/* Small screens */

@media screen and (max-width: 480px) {

    body.single-product .cme-product-help-card {
        padding: 15px;
    }

    body.single-product
    .cme-product-help-contact-links {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }

    body.single-product
    .cme-product-help-contact-links
    span {
        display: none;
    }
}


/* ---------------------------------------------------------
   17. DEFAULT PRODUCT TABS
   --------------------------------------------------------- */

body.single-product .woocommerce-tabs {
    display: none !important;
}


/* ---------------------------------------------------------
   18. RELATED PRODUCTS AND UPSELLS
   --------------------------------------------------------- */

body.single-product
.related.products,
body.single-product
.up-sells.upsells {
    display: block !important;

    width: 100% !important;

    margin: 65px 0 0 !important;
    padding: 0 !important;
}

body.single-product
.related.products
> h2,
body.single-product
.up-sells.upsells
> h2 {
    margin: 0 0 24px;

    color: #171717;

    font-size: 28px;
    line-height: 1.2;
}

body.single-product
.related.products
ul.products,
body.single-product
.up-sells.upsells
ul.products {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;

    width: 100%;

    margin: 0;
    padding: 0;
}

body.single-product
.related.products
ul.products
li.product,
body.single-product
.up-sells.upsells
ul.products
li.product {
    float: none !important;

    width: 100% !important;
    margin: 0 !important;
}


/* ---------------------------------------------------------
   19. ERRORS
   --------------------------------------------------------- */

body.single-product .wapf-error {
    display: block;

    margin-top: 6px;

    color: #b42318;

    font-size: 12px;
    font-weight: 600;
}

body.single-product
.wapf-field-container.has-error
select,
body.single-product
.wapf-field-container.has-error
input,
body.single-product
.wapf-field-container.has-error
textarea {
    border-color: #b42318;
}



/* ---------------------------------------------------------
   FULL-SCREEN PRODUCT IMAGE LIGHTBOX
   --------------------------------------------------------- */

body.cme-lightbox-open {
    overflow: hidden !important;
}

body.single-product .cme-image-lightbox {
    position: fixed;
    z-index: 999999;

    inset: 0;

    display: none;
    align-items: center;
    justify-content: center;

    width: 100vw;
    height: 100vh;

    padding: 55px 80px;

    background: rgba(0, 0, 0, 0.92);

    box-sizing: border-box;
}

body.single-product .cme-image-lightbox.is-open {
    display: flex;
}

body.single-product .cme-image-lightbox-content {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;
}

body.single-product .cme-image-lightbox-image {
    display: block;

    width: auto;
    height: auto;

    max-width: 100%;
    max-height: 100%;

    margin: auto;

    object-fit: contain;

    border-radius: 5px;
    background: transparent;

    box-shadow: 0 12px 50px rgba(0, 0, 0, 0.35);
}


/* Close button */

body.single-product .cme-image-lightbox-close {
    position: fixed;
    z-index: 2;

    top: 18px;
    right: 24px;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    margin: 0;
    padding: 0;

    border: 0;
    border-radius: 50%;

    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;

    font-size: 38px;
    font-weight: 300;
    line-height: 1;

    cursor: pointer;
}

body.single-product .cme-image-lightbox-close:hover {
    background: rgba(255, 255, 255, 0.25);
}


/* Previous and next buttons */

body.single-product .cme-image-lightbox-arrow {
    position: fixed;
    z-index: 2;

    top: 50%;
    transform: translateY(-50%);

    display: flex;
    align-items: center;
    justify-content: center;

    width: 52px;
    height: 70px;

    margin: 0;
    padding: 0;

    border: 0;
    border-radius: 8px;

    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;

    font-size: 30px;
    line-height: 1;

    cursor: pointer;
}

body.single-product .cme-image-lightbox-arrow:hover {
    background: rgba(255, 255, 255, 0.24);
}

body.single-product .cme-image-lightbox-prev {
    left: 18px;
}

body.single-product .cme-image-lightbox-next {
    right: 18px;
}


/* Show clicking is available on gallery images */

body.single-product .cme-product-gallery-link {
    cursor: zoom-in;
}


/* Mobile */

@media screen and (max-width: 700px) {

    body.single-product .cme-image-lightbox {
        padding: 60px 45px 35px;
    }

    body.single-product .cme-image-lightbox-close {
        top: 10px;
        right: 12px;

        width: 42px;
        height: 42px;

        font-size: 34px;
    }

    body.single-product .cme-image-lightbox-arrow {
        width: 38px;
        height: 60px;

        font-size: 23px;
    }

    body.single-product .cme-image-lightbox-prev {
        left: 3px;
    }

    body.single-product .cme-image-lightbox-next {
        right: 3px;
    }
}


/* ============================================================
   TEMPLATE AND SUPPORT BOX SPACING
   ============================================================ */

/* Template box immediately below Add to Cart */
.single-product .cme-product-template-area {
    width: 100%;
    margin: 14px 0 0 !important;
    padding: 0 !important;
}

/* Support box beneath the template box */
.single-product .cme-product-support-area {
    width: 100%;
    margin: 18px 0 0 !important;
    padding: 0 !important;
}

/* Remove unexpected margins from the cards themselves */
.single-product .cme-product-template-area .cme-product-help-card,
.single-product .cme-product-support-area .cme-product-help-card {
    margin: 0 !important;
}

/* Tighten the template card */
.single-product .cme-product-help-card--template {
    padding: 20px !important;
}

/* Keep the template heading and description compact */
.single-product .cme-template-card-content {
    margin: 0 0 14px;
}

.single-product .cme-template-card-title {
    margin: 0 0 6px !important;
}

.single-product .cme-template-card-description {
    margin: 0 !important;
}

/* Button directly beneath the description */
.single-product .cme-template-download-button {
    width: 100%;
    margin: 0 !important;
}


/* ---------------------------------------------------------
   20. TABLET
   --------------------------------------------------------- */

@media screen and (max-width: 1050px) {

    body.single-product
    .woocommerce
    div.product {
        grid-template-columns: minmax(280px, 40fr) minmax(0, 60fr);
        column-gap: 28px;

        padding-right: 20px;
        padding-left: 20px;
    }

    body.single-product
    .summary
    .product_title {
        font-size: 34px;
    }

    body.single-product
    .related.products
    ul.products,
    body.single-product
    .up-sells.upsells
    ul.products {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}


/* ---------------------------------------------------------
   21. MOBILE
   --------------------------------------------------------- */

@media screen and (max-width: 768px) {

    body.single-product
    .woocommerce
    div.product {
        display: flex !important;
        flex-direction: column;

        width: 100% !important;

        padding: 0 15px 48px;
    }

    body.single-product
    .woocommerce
    div.product
    .woocommerce-product-gallery,
    body.single-product
    .woocommerce
    div.product
    .images {
        order: 1;

        float: none !important;

        width: 100% !important;

        margin: 0 0 25px !important;
    }

    body.single-product
    .woocommerce
    div.product
    .summary,
    body.single-product
    .woocommerce
    div.product
    .summary.entry-summary {
        order: 2;

        float: none !important;
        position: static;

        width: 100% !important;

        margin: 0 !important;
    }

    body.single-product
    .woocommerce-product-gallery
    .flex-control-thumbs {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 9px;
    }

    body.single-product
    .related.products,
    body.single-product
    .up-sells.upsells {
        order: 3;
    }

    body.single-product
    .related.products
    ul.products,
    body.single-product
    .up-sells.upsells
    ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    body.single-product .wapf-field-container {
        grid-template-columns: 1fr;
        row-gap: 8px;
    }

    body.single-product .wapf-field-label,
    body.single-product .wapf-field-input,
    body.single-product .wapf-field-description {
        grid-column: 1;
    }
}


/* ---------------------------------------------------------
   22. SMALL MOBILE
   --------------------------------------------------------- */

@media screen and (max-width: 480px) {

    body.single-product
    .summary
    .product_title {
        font-size: 28px;
    }

    body.single-product
    .cme-product-tab-buttons {
        gap: 17px;
    }

    body.single-product
    .cme-product-feature {
        display: block;
    }

    body.single-product
    .cme-product-feature-name {
        display: block;
        margin-bottom: 3px;
    }

    body.single-product
    .wapf-field-radio
    .wapf-checkable,
    body.single-product
    .wapf-field-checkboxes
    .wapf-checkable {
        flex-basis: calc(50% - 5px);
        min-width: 0;
    }

    body.single-product
    .cme-order-total {
        grid-template-columns: 78px minmax(0, 1fr);
    }

    body.single-product
    .cme-order-total
    .price {
        font-size: 25px;
    }

    body.single-product
    .related.products
    ul.products,
    body.single-product
    .up-sells.upsells
    ul.products {
        grid-template-columns: 1fr;
    }

    body.single-product .wapf-field-container {
        grid-template-columns: 1fr;
        row-gap: 8px;
    }

    body.single-product .wapf-field-label,
    body.single-product .wapf-field-input,
    body.single-product .wapf-field-description {
        grid-column: 1;
    }
}

.products.columns-4::before {
    display: none !important;
    content: none !important;
}