/* ══════════════════════════════════════════════════════
   AC Chemical Core components
   Styles for the markup the AC Chemical Core plugin outputs
   (shortcodes, hooks, checkout). Ported from divi-child 2.1.0
   sections 3–5, 8, 10–13 and 15, moved onto brand tokens.
   Dropped: Divi selectors, the legacy variation buttons
   (section 6), section 7, the block-cart "fix" chain (9),
   utility/flyout header (14, 16): unify's header replaces them.
   ══════════════════════════════════════════════════════ */


/* ── Product quick-info pills: plugin prints its own inline CSS;
      only spacing tweaks here ── */

.single-product .ac-product-quick-info {
    margin: 4px 0 20px;
}


/* ── [chemical_data_grid] ── */

.chem-data-grid {
    width: 100%;
    margin: 20px 0;
    border: 1px solid var(--unify-border);
    border-radius: var(--unify-radius-lg);
    overflow: hidden;
}

.chem-data-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 11px 18px;
    border-bottom: 1px solid #f0f0f0;
}

.chem-data-row:last-child { border-bottom: 0; }
.chem-data-row:nth-child(even) { background: #f9fafb; }

.chem-label {
    flex: 1;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--unify-text-muted);
}

.chem-value {
    flex: 1;
    text-align: right;
    font-size: 15px;
    font-weight: 600;
    word-break: break-word;
}

.chem-value a {
    text-decoration: none;
    border-bottom: 1px dotted currentColor;
}


/* ── Stock badges ── */

.stock-status {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
}

.stock-instock    { color: #155724; background: #d4edda; }
.stock-backorder  { color: #856404; background: #fff3cd; }
.stock-outofstock { color: #721c24; background: #f8d7da; }
.stock-unknown    { color: #4a4a4a; background: #f0f0f0; }

/* Shop card badge added by the child theme */
.ac-card-stock {
    display: inline-block;
    margin: 6px 16px 16px;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    align-self: flex-start;
}

.ac-card-stock--instock     { color: #1a6b2e; background: #e6f4ea; }
.ac-card-stock--onbackorder { color: #856404; background: #fff3cd; }
.ac-card-stock--outofstock  { color: #4a4a4a; background: #f0f0f0; }

/* Code / CAS lines the plugin adds to cards */
.woocommerce ul.products li.product .chemical-meta-data {
    padding: 6px 16px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 4px 12px;
    font-size: 13px;
    color: var(--unify-text-muted);
}

.woocommerce ul.products li.product .chemical-meta-data strong {
    font-weight: 600;
}


/* ── [pack_size_table] ── */

.pack-size-container {
    margin: 20px 0 8px;
    border: 1px solid var(--unify-border);
    border-radius: 14px;
    overflow-x: auto;
}

.pack-size-table {
    width: 100%;
    min-width: 440px;
    border-collapse: collapse;
    margin: 0;
}

.pack-size-table thead th {
    background: var(--unify-bg-alt);
    padding: 12px 18px;
    text-align: left;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--unify-text-muted);
    border-bottom: 1px solid var(--unify-border);
}

.pack-size-table tbody tr {
    border-top: 1px solid #f0f0f0;
}

.pack-size-table tbody tr:first-child { border-top: 0; }
.pack-size-table tbody tr:hover { background: #f0f7ff; }

.pack-size-table td {
    padding: 12px 18px;
    vertical-align: middle;
    font-size: 15px;
}

.pack-size-table .pack-quantity {
    width: 68px;
    min-height: 40px;
    padding: 0 8px;
    border: 1px solid #c9ced6;
    border-radius: var(--unify-radius-md);
    font: inherit;
    font-size: 15px;
    text-align: center;
}

.add-to-cart-btn {
    min-height: 44px;
    padding: 0 18px;
    border: 0;
    border-radius: var(--unify-radius-md);
    background: var(--ac-navy);
    color: #ffffff;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
}

.add-to-cart-btn:hover { background: var(--ac-navy-deep); }
.add-to-cart-btn:disabled { background: #8a8a8a; cursor: not-allowed; }


/* ── Currency switcher (plugin prints the base style) ── */

.ac-currency-switcher { margin-top: 14px; }
.ac-currency-btn { min-height: 36px; }
.ac-currency-note { color: var(--unify-text-muted); }


/* ── Toast (from pack-size.js) ── */

.ac-cart-toast {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: var(--unify-z-toast);
    padding: 14px 20px;
    border-radius: var(--unify-radius-md);
    background: var(--ac-slate);
    color: #ffffff;
    font-weight: 600;
    box-shadow: var(--unify-shadow-lg);
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.ac-cart-toast.ac-toast-show {
    opacity: 1;
    transform: translateY(0);
}


/* ── [product_docs] / [ac_documentation] ── */

.chemical-docs-container { margin: 25px 0; }

.docs-heading {
    margin-bottom: 12px;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--unify-text);
}

.doc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px;
    border: 1px solid var(--unify-border);
    border-radius: var(--unify-radius-lg);
    overflow: hidden;
}

.doc-table thead th {
    background: var(--unify-bg-alt);
    padding: 10px 15px;
    text-align: left;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--unify-text-muted);
}

.doc-table tbody tr { border-top: 1px solid #f0f0f0; background: #ffffff; }
.doc-table td { padding: 10px 15px; vertical-align: middle; }
.doc-action-col { text-align: right; width: 120px; }

.doc-download-btn {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 16px;
    border-radius: 999px;
    background: var(--ac-navy);
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

.doc-download-btn:hover { background: var(--ac-navy-deep); color: #ffffff; }


/* ── [ac_search] on /search ── */

.ac-search-form { margin-bottom: 30px; }

.ac-search-input-wrap {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.ac-search-input {
    flex: 1 1 320px;
    min-height: 52px;
    padding: 0 18px;
    border: 2px solid var(--unify-border);
    border-radius: 10px;
    font: inherit;
    font-size: 16px;
}

.ac-search-input:focus {
    border-color: var(--ac-navy);
    outline: none;
}

.ac-search-btn {
    min-height: 52px;
    padding: 0 28px;
    border: 0;
    border-radius: 10px;
    background: var(--ac-purple);
    color: #ffffff;
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
}

.ac-results-count,
.ac-no-results {
    color: var(--unify-text-muted);
}

.ac-results-grid {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--unify-border);
    border-radius: var(--unify-radius-lg);
    overflow: hidden;
}

.ac-result-card {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px;
    background: #ffffff;
    color: var(--unify-text);
    text-decoration: none;
    border-top: 1px solid #f0f0f0;
}

.ac-result-card:first-child { border-top: 0; }
.ac-result-card:hover { background: #f0f7ff; color: var(--unify-text); }

.ac-result-image {
    flex: 0 0 64px;
    height: 64px;
    border-radius: var(--unify-radius-md);
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #f0f0f0;
}

.ac-result-image img { width: 100%; height: 100%; object-fit: contain; }
.ac-result-info { flex: 1; min-width: 0; }
.ac-result-name { font-size: 16px; font-weight: 700; margin-bottom: 4px; }
.ac-result-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13px; color: var(--unify-text-muted); }
.ac-result-arrow { color: var(--ac-navy); font-size: 20px; }


/* ── [ac_ketcher] on /structure-search ── */

.ac-ketcher-editor {
    border: 1px solid var(--unify-border);
    border-radius: var(--unify-radius-lg) var(--unify-radius-lg) 0 0;
    overflow: hidden;
}

.ac-ketcher-editor iframe {
    display: block;
    width: 100%;
    min-height: 560px;
    border: 0;
}

.ac-ketcher-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding: 16px;
    background: var(--unify-bg-alt);
    border: 1px solid var(--unify-border);
    border-top: 0;
    border-radius: 0 0 var(--unify-radius-lg) var(--unify-radius-lg);
}

.ac-ketcher-btn {
    min-height: 48px;
    padding: 0 24px;
    border: 0;
    border-radius: var(--unify-radius-md);
    background: var(--ac-purple);
    color: #ffffff;
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}

.ac-ketcher-btn--secondary { background: #e0e0e0; color: #333333; }

.ac-ketcher-smiles {
    margin: 12px 0;
    padding: 10px 14px;
    background: #f9fafb;
    border: 1px solid var(--unify-border);
    border-radius: var(--unify-radius-md);
    font-family: var(--unify-font-mono);
    font-size: 13px;
    word-break: break-all;
}


/* ── Customer portal download (AC Stock Export) ── */

.ac-download-btn {
    display: inline-flex;
    align-items: center;
    min-height: 52px;
    padding: 0 28px;
    border-radius: 10px;
    background: var(--ac-purple);
    color: #ffffff;
    font-weight: 700;
    text-decoration: none;
}

.ac-download-btn:hover { color: #ffffff; filter: brightness(1.12); }
.ac-download-note { margin-top: 10px; font-size: 13px; color: var(--unify-text-muted); }


/* ══════════════════════════════════════════════════════
   ENQUIRY CHECKOUT
   Behaviour, not just looks: the live site hides payment
   methods with CSS and AC Chemical Core swaps the button
   for "Submit Enquiry". Kept exactly as on the Divi site,
   including the !important flags, so checkout behaves the
   same on switch day. Revisit when enquiry logic moves
   into a plugin.
   ══════════════════════════════════════════════════════ */

.ac-enquiry-notice {
    margin-bottom: 24px;
    padding: 14px 18px;
    border: 1px solid #b8d9f5;
    border-radius: var(--unify-radius-md);
    background: #e8f4ff;
    color: var(--ac-navy);
    font-size: 15px;
}

.woocommerce-checkout #payment .payment_methods,
.woocommerce-checkout #payment .payment_box,
.woocommerce-checkout #payment ul.payment_methods {
    display: none !important;
}

.woocommerce-checkout #payment {
    display: block !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
}

.woocommerce-checkout #payment .ac-enquiry-submit-btn,
.ac-enquiry-submit-btn {
    display: block;
    width: 100%;
    min-height: 52px;
    margin-top: 20px;
    border: 0;
    border-radius: var(--unify-radius-md);
    background: var(--ac-purple);
    color: #ffffff;
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
}

/* Single-column checkout, as on the live site */
.woocommerce-checkout .woocommerce .col2-set .col-1,
.woocommerce-checkout .woocommerce .col2-set .col-2,
.woocommerce-checkout #order_review {
    width: 100%;
    float: none;
}

.woocommerce-checkout #order_review table.shop_table .order-total th,
.woocommerce-checkout #order_review table.shop_table .order-total td {
    font-size: 18px;
    font-weight: 700;
    color: var(--ac-navy);
}


/* ══════════════════════════════════════════════════════
   SINGLE PRODUCT LAYOUT
   Woo floats the image and summary and relies on its own
   tabs/related products to clear them. Those are replaced
   here, so lay the product out as a grid instead.
   ══════════════════════════════════════════════════════ */

.woocommerce div.product {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: 32px 48px;
    align-items: start;
}

.woocommerce div.product > * {
    grid-column: 1 / -1;
}

/* Woo's clearfix pseudo-elements would become empty grid cells. */
.woocommerce div.product::before,
.woocommerce div.product::after {
    display: none;
}

.woocommerce div.product > div.images,
.woocommerce div.product > div.summary {
    grid-column: auto;
    float: none;
    width: auto;
    margin: 0;
}

.woocommerce div.product .product_title {
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    line-height: 1.15;
    overflow-wrap: anywhere;
}

.ac-product-tabs-wrap {
    clear: both;
    margin-top: 16px;
}

@media (max-width: 768px) {
    .woocommerce div.product {
        grid-template-columns: minmax(0, 1fr);
    }
}


/* Single product stock: hide the plugin's always-on "Same Day Despatch"
   pill unless the product is in stock (see act_single_stock_status). */
.woocommerce div.product.outofstock .ac-pqi-row--highlight,
.woocommerce div.product.onbackorder .ac-pqi-row--highlight {
    display: none;
}

.woocommerce div.product .ac-single-stock {
    display: inline-flex;
    margin: -8px 0 20px;
}