/* od-style-1-0-62.css C3 copy (generated by cutover_c5_odstyle_remap.py c3-strip). Input md5 6f287a1fb1de41fe40804d4a087a56f7.
   Removed every selector bound to 26 staging-new page ids: 454336, 454337, 454338, 454494, 454495, 454497, 454499, 454500, 454501, 454502, 454504, 454505, 454507, 454508, 454510, 454511, 454512, 454583, 454584, 454672, 455186, 455190, 455448, 455458, 455464, 455487.
   Those pages get new production ids in G2; their rules return via the C5 remap (od-style-1-0-63.css).
   Revert: ship the unmodified od-style-1-0-62.css. */

/* od-style-1-0-42.css — VERSION/ROLLBACK NOTES (table-convergence).
   Predecessor: od-style-1-0-41.css (technical-audit branch, NOT in git — its block
   is carried forward inside this file). Rollback for this enqueue: bump
   functions.php line 17 back to od-style-1-0-41.css.
   The dead .od-table/.od-tbl/.buybtn "PRODUCT-TABLE CONVERGENCE" block was removed
   from THIS git copy on 2026-09-02 (remediation fix #4); convergence was applied
   per-payload, not via those classes (see specs/TABLE_CONVERGENCE_BUILD_SPEC.md §3).
   NOTE: the -42 currently DEPLOYED on staging still contains that dead block — the
   drop is git-only, no live redeploy was done (block is inert). Remove it live at the
   next version bump or at prod cutover. See the spec's "Merge-order dependency" note. */

/* Homepage WP Bakery Post Grid - equal height cards & button alignment */
body.home .vc_grid .vc_pageable-slide-wrapper.vc_clearfix {
    display: flex;
    flex-wrap: wrap;
}

body.home .vc_grid .vc_pageable-slide-wrapper.vc_clearfix>.vc_clearfix:not(.vc_grid-item) {
    display: none;
}

body.home .vc_grid .vc_grid-item.vc_clearfix.vc_col-sm-4 {
    display: flex;
    flex-direction: column;
}

body.home .vc_grid .vc_grid-item.vc_clearfix.vc_col-sm-4>.vc_grid-item-mini {
    display: flex;
    flex-direction: column;
    flex: 1;
}

body.home .vc_grid .vc_grid-item .vc_gitem-zone-c {
    flex: 1;
    display: flex;
    flex-direction: column;
}

body.home .vc_grid .vc_gitem-zone-c .vc_gitem-zone-mini,
body.home .vc_grid .vc_gitem-zone-c .vc_gitem_row,
body.home .vc_grid .vc_gitem-zone-c .vc_gitem-col {
    flex: 1;
    display: flex;
    flex-direction: column;
}

body.home .vc_grid .vc_gitem-zone-c .vc_btn3-container {
    margin-top: auto;
}

/* Reduce stacked margins in homepage post grid */
body.home .vc_grid .vc_gitem-post-data-source-post_title {
    margin-bottom: 0;
}

body.home .vc_grid .vc_gitem-post-data-source-post_title h4 {
    margin-bottom: 10px;
}

body.home .vc_grid .vc_gitem-post-data-source-post_excerpt {
    margin-bottom: 0;
}

body.home .vc_grid .vc_gitem-post-data-source-post_excerpt>p:empty {
    display: none;
}

/* Post Grid image ratio 388:258 - homepage only */
.home .vc-gitem-zone-height-mode-auto.vc-gitem-zone-height-mode-auto-1-1:before {
    padding-top: 66.49% !important;
}

/* Blog Grid design - equal height rows */
.blog-grid-row {
    display: flex;
    flex-wrap: wrap;
}

.blog-grid-row .blog-design-grid {
    display: flex;
    margin-bottom: 30px;
}

.blog-grid-row .blog-design-grid .article-inner {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.blog-grid-row .blog-design-grid .article-body-container {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.blog-grid-row .blog-design-grid .article-body-container .entry-content {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.blog-grid-row .blog-design-grid .article-body-container .read-more-section {
    margin-top: auto;
    padding-top: 1rem;
}

.blog-grid-row .blog-design-grid .hovered-social-icons {
    display: none;
}

.blog-grid-row .blog-design-grid .post-img-wrapp {
    position: relative;
    padding-top: 66.49%;
    /* 258/388 */
    overflow: hidden;
}

.blog-grid-row .blog-design-grid .post-img-wrapp a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
}

.blog-grid-row .blog-design-grid .post-img-wrapp img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ── Home page WP Bakery Post Grid: date badge ── */
/* Match the Woodmart blog date badge (.woodmart-post-date) style */
.od-home-blog-grid-item .od-home-blog-post-date {
    position: absolute;
    top: 15px;
    left: 15px;
    z-index: 2;
    min-width: 53px;
    background-color: #FFF;
    box-shadow: 0 0 9px rgba(0, 0, 0, 0.1);
    color: #1a2230;
    text-align: center;
    line-height: 1;
    padding: 0;
}

.od-home-blog-grid-item .od-home-blog-post-date .post-date-day {
    display: block;
    padding-top: 6px;
    padding-bottom: 4px;
    font-size: 24px;
}

.od-home-blog-grid-item .od-home-blog-post-date .post-date-month {
    display: block;
    padding-top: 2px;
    padding-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: .3px;
    font-weight: 600;
    font-size: 12px;
}

/* ── Blog listing: center pagination ── */
.d-blog-main-wrapper + .blog-footer {
    width: 100%;
    margin-top: 2em;
}

/* ── Single post: Return to Blog Home link ── */
.return-to-blog {
    display: block;
    margin-bottom: 10px;
    font-size: 14px;
    color: #888;
    text-decoration: none;
    text-align: left;
}
.return-to-blog:hover {
    color: #1a2230;
    text-decoration: underline;
}

/* ── Blog listing: search bar + per-page dropdown row ── */
.d-blog-search-row {
    display: flex;
    gap: 15px;
    align-items: center;
    margin-bottom: 1.5em;
    padding-left: 0;
    padding-right: 0;
}

.d-blog-search-group {
    flex: 1;
    min-width: 0;
}

/* Bootstrap input-group component CSS is not loaded on this site,
   so we provide the flex layout for the search input + button inline. */
.d-blog-search-row .input-group {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
}

.d-blog-search-row .input-group .form-control {
    flex: 1 1 auto;
    width: 1%;
    min-width: 0;
    height: 44px;
    padding: 8px 16px;
    font-size: 14px;
    border: 1px solid #e2e7ee;
    border-radius: 4px 0 0 4px;
    outline: none;
    transition: border-color 0.2s;
}

.d-blog-search-row .input-group .form-control:focus {
    border-color: #1a7d2e;
    box-shadow: 0 0 0 2px rgba(0, 128, 0, 0.1);
}

.d-blog-search-row .input-group .input-group-append {
    display: flex;
}

/* Search button — site primary green, clean design */
.d-blog-search-row .input-group .input-group-append .btn {
    white-space: nowrap;
    height: 44px;
    padding: 0 16px;
    background-color: #1a7d2e;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    border: 1px solid #1a7d2e;
    border-left: none;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
    transition: background-color 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.d-blog-search-row .input-group .input-group-append .btn:hover {
    background-color: #13611f;
    border-color: #13611f;
}

.d-blog-per-page-group {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    flex-shrink: 0;
}

.d-blog-per-page-group label {
    font-size: 14px;
    color: #555;
    margin-bottom: 0;
}

.d-blog-per-page-group select {
    height: 44px;
    min-width: 70px;
    padding: 6px 10px;
    font-size: 14px;
    border: 1px solid #e2e7ee;
    border-radius: 4px;
    outline: none;
    transition: border-color 0.2s;
}

.d-blog-per-page-group select:focus {
    border-color: #1a7d2e;
    box-shadow: 0 0 0 2px rgba(0, 128, 0, 0.1);
}

@media (max-width: 767px) {
    .d-blog-search-row {
        flex-wrap: wrap;
    }
    .d-blog-search-group,
    .d-blog-per-page-group {
        width: 100%;
    }
}

/* ── Knowledge Base search: form + results list ── */
.d-kb-search-row {
    margin-bottom: 1.5em;
}

/* Bootstrap input-group component CSS is not loaded on this site,
   so we provide the flex layout for the search input + button inline. */
.d-kb-search-group .input-group {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
}

.d-kb-search-group .input-group .form-control {
    flex: 1 1 auto;
    width: 1%;
    min-width: 0;
    box-sizing: border-box;
    height: 44px;
    padding: 8px 16px;
    font-size: 14px;
    /* Woodmart's global input[type=search] rule forces color:#FFF,
       background:transparent, border:2px, border-radius:0 — override here. */
    color: #1a2230;
    background: #fff;
    border: 1px solid #e2e7ee;
    border-radius: 4px 0 0 4px;
    outline: none;
    transition: border-color 0.2s;
    -webkit-appearance: none;
    appearance: none;
}

.d-kb-search-group .input-group .form-control:focus {
    border-color: #1a7d2e;
    box-shadow: 0 0 0 2px rgba(0, 128, 0, 0.1);
}

.d-kb-search-group .input-group .input-group-append {
    display: flex;
}

.d-kb-search-group .input-group .input-group-append .btn {
    white-space: nowrap;
    height: 44px;
    padding: 0 22px;
    background-color: #1a7d2e;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    border: 1px solid #1a7d2e;
    border-left: none;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
    transition: background-color 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.d-kb-search-group .input-group .input-group-append .btn:hover,
.d-kb-search-group .input-group .input-group-append .btn:focus {
    background-color: #13611f;
    border-color: #13611f;
    outline: none;
}

/* Results list */
.d-kb-search-summary {
    margin: 0 0 1em;
    color: #555;
    font-size: 14px;
}

.d-kb-results {
    list-style: none;
    margin: 0;
    padding: 0;
}

.d-kb-result {
    padding: 18px 0;
    border-bottom: 1px solid #eee;
}

.d-kb-result:last-child {
    border-bottom: 0;
}

.d-kb-result-breadcrumb {
    font-size: 12px;
    color: #777;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 4px;
}

.d-kb-result-breadcrumb a {
    color: #777;
}

.d-kb-result-title {
    font-size: 18px;
    margin: 0 0 6px;
}

.d-kb-result-title a {
    color: #0e4a18;
}

.d-kb-result-title a:hover {
    color: #1a7d2e;
}

.d-kb-result-excerpt {
    color: #1a2230;
    font-size: 14px;
    line-height: 1.5;
}

.d-kb-result mark {
    background: #fff2a8;
    padding: 0 2px;
    color: inherit;
}

/* No-results state */
.d-kb-no-results {
    padding: 30px 0;
    margin-bottom: 40px;
    color: #555;
}

/* Breathing room between the results list and the Contact Us form below
   when there's no pagination (single page of results). */
.d-kb-results {
    margin-bottom: 40px;
}

/* Pagination */
.d-kb-pagination {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: center;
    margin: 30px 0 40px;
}

.d-kb-pagination a,
.d-kb-pagination span {
    padding: 6px 12px;
    border: 1px solid #e2e7ee;
    border-radius: 4px;
    color: #1a2230;
    text-decoration: none;
    font-size: 14px;
}

.d-kb-pagination a:hover {
    background: #f4f4f4;
}

.d-kb-pagination a:focus {
    outline: none;
    border-color: #1a7d2e;
    box-shadow: 0 0 0 2px rgba(0, 128, 0, 0.2);
}

.d-kb-pagination .current {
    background: #1a7d2e;
    color: #fff;
    border-color: #1a7d2e;
}

.d-kb-pagination span.d-kb-pagination-ellipsis {
    border: 0;
    background: transparent;
    cursor: default;
}

@media (max-width: 767px) {
    /* Horizontal page padding. Woodmart's stripped-down Bootstrap omits
       padding on .col-md-* columns, so content in .d-main-content hugs
       the viewport edge on narrow screens. Restore 15px gutters here. */
    .d-main-content {
        padding-left: 15px;
        padding-right: 15px;
    }

    /* Search button: tighter padding so the input has more room */
    .d-kb-search-group .input-group .input-group-append .btn {
        padding: 0 14px;
    }

    /* Result summary: slightly smaller, tighter */
    .d-kb-search-summary {
        font-size: 13px;
        margin-bottom: 0.75em;
    }

    /* Result rows: a bit less vertical padding, keep dividers */
    .d-kb-result {
        padding: 14px 0;
    }

    /* Title scales down — long titles still wrap cleanly on narrow screens */
    .d-kb-result-title {
        font-size: 16px;
        line-height: 1.35;
    }

    /* Breadcrumb: hide the uppercase/letterspacing treatment on mobile
       where horizontal room is tight; still show the path so the user
       knows which section a result belongs to. */
    .d-kb-result-breadcrumb {
        letter-spacing: 0;
        font-size: 11px;
    }

    /* Pagination: bigger tap targets (≥44px tall) */
    .d-kb-pagination {
        gap: 8px;
        margin-bottom: 30px;
    }
    .d-kb-pagination a,
    .d-kb-pagination span {
        padding: 10px 14px;
        min-width: 44px;
        min-height: 44px;
        box-sizing: border-box;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
}

/* Checkout order summary shipping method list
 * -------------------------------------------
 * Layout: reset list/label spacing and size so everything aligns with the
 * surrounding order summary rows.
 * Styling: real calculated rates render bold + green (theme accent). The
 * "preferred courier" fallback instances render as plain body text to match
 * WooCommerce's native "no shipping options available" styling — they are
 * not a calculated rate, just an instruction to the customer. */
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method,
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li,
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li label,
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li .amount {
    font-size: inherit;
    line-height: inherit;
    text-align: inherit;
    margin: 0;
    padding: 0;
}

.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li {
    margin-bottom: 6px;
}

.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li:last-child {
    margin-bottom: 0;
}

/* Default: available/calculated rates shown bold + green */
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li label,
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li .amount {
    color: #1a7d2e;
    font-weight: 700;
}

/* "Preferred courier" fallback instances (8, 9, 17): render as plain body
 * text, consistent with the "no shipping options" default appearance. */
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li:has(input[value="free_shipping:8"]) label,
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li:has(input[value="free_shipping:9"]) label,
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li:has(input[value="free_shipping:17"]) label,
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li:has(input[value="free_shipping:8"]) .amount,
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li:has(input[value="free_shipping:9"]) .amount,
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li:has(input[value="free_shipping:17"]) .amount {
    color: inherit;
    font-weight: normal;
}

/* "Ships from Seattle" line under the product stock text.
   Tighten the gap above the line, and move the stock's original 20px margin
   below the line so it clears the quantity / add-to-cart box. */
.od-ships-from {
    display: block;
    margin-bottom: 20px;
}
.stock:has(+ .od-ships-from) {
    margin-bottom: 4px;
}

/* When the SKU links to a datasheet, style it exactly like the site's content
   links (e.g. the "Contact us" link): blue at rest, green on hover, never
   underlined. A plain-text SKU (no datasheet) is unaffected. */
.product_meta .sku a {
    color: rgba(0, 61, 216, 0.98);
    text-decoration: none;
}
.product_meta .sku a:hover {
    color: #1a7d2e;
    text-decoration: none;
}

/* ===== OD announcement bar — enlarge promo (principal 2026-08-17) =====
   Top-bar "NEW! ARM CONTROL BOARD!" promo = secondary-nav menu item 326020,
   default 12px. Raise to read as an announcement: below the logo wordmark,
   above the ~13px primary nav. */
.whb-top-bar .wd-nav-secondary > li.menu-item-326020 > a {
  font-size: 20px !important;
  font-weight: 600 !important;
  letter-spacing: .01em;
}

/* OD homepage nav flatten — CUSTOM PRODUCTS matches plain items (2026-08-17) */
@media (min-width: 1025px) {
  #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item:first-child > a.mega-menu-link,
  .whb-sticked #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-item:first-child > a.mega-menu-link {
    background: transparent !important;
    color: #1a2230 !important;
    padding: 0 10px !important;
    height: 40px !important;
    line-height: 40px !important;
    margin-right: 0 !important;
  }
}

/* ===== OD mega-menu submenu cleanup (principal 2026-08-17) =====
   1. Remove the faint gray outline (box-shadow) around the INNER submenu
      group boxes inside the mega panels; the hover-opened panel already
      signals grouping. The outer dropdown panel keeps its own drop shadow.
   2. Bold the submenu group titles so grouping still reads without the box.
   3. "Talk to an engineer" (item 454541) was a stranded uppercase pseudo-
      heading; restyle it as a clear call-to-action link. */
@media (min-width: 1025px) {
  #mega-menu-wrap-main-menu #mega-menu-main-menu ul.mega-sub-menu ul.mega-sub-menu {
    box-shadow: none !important;
  }
  #mega-menu-wrap-main-menu #mega-menu-main-menu ul.mega-sub-menu li.mega-menu-item-has-children > a.mega-menu-link {
    font-weight: 700 !important;
  }
  #mega-menu-wrap-main-menu #mega-menu-main-menu li.mega-menu-item-454541 > a.mega-menu-link {
    text-transform: none !important;
    font-weight: 700 !important;
    color: rgba(0, 61, 216, 0.98) !important;
  }
  #mega-menu-wrap-main-menu #mega-menu-main-menu li.mega-menu-item-454541 > a.mega-menu-link:hover {
    color: #1a7d2e !important;
  }
  #mega-menu-wrap-main-menu #mega-menu-main-menu li.mega-menu-item-454541 > a.mega-menu-link::after {
    content: " \2192";
    font-weight: 700;
  }
}

/* ===== OD /our-products/ redesign — hide theme page-title bar (principal 2026-08-17) =====
   The .od-op redesign hero (page 3237) is the page header now, so suppress
   Woodmart's default dark page-title/breadcrumb bar on this page only. */
body.page-id-3237 .wd-page-title { display: none !important; }


/* Hide theme page-title bar on /our-products/tft/ (redesign hero is the header) */

body.page-id-324857 .wd-page-title{display:none!important}

/* /our-products/e-paper/ (358607) redesign: hide theme title bar, hero is the header */
body.page-id-358607 .wd-page-title{display:none !important;}




/* Hide theme page-title bar on /our-products/dev-tools-accessories/ (454495) redesign hero is the header */


/* Hide theme page-title bar on /our-products/lcd/lcd-glass-panels/ (454497) redesign hero is the header */

body.page-id-3573 .wd-page-title{display:none!important}

body.page-id-88788 .wd-page-title{display:none!important}

body.page-id-3717 .wd-page-title{display:none!important}

body.page-id-40809 .wd-page-title{display:none!important}


/* ===== OD Industries mega-menu (454935) — cluster-label ::before blocks REMOVED 2026-08-18 (§7o) =====
   Industries was reformatted from a flat 15-leaf grid under two full-width ::before banners
   ("By Industry" / "By Environment / Form-Factor") into FOUR headed columns matching the
   Custom-products (8055) / Standard-products (454520) grids: four real has-children header
   menu items (454967 Automotive & Industrial, 454968 Consumer & Home, 454969 Medical, Retail
   & Comms, 454970 By Environment / Form-Factor) now carry the 15 verticals as nested children,
   so the headers style themselves via MMM's has-children rule + the "childless grid column
   headers" #555-uppercase rule below. Both ::before banner blocks (the original 14px/#1a1a1a/
   underline and the pass-2 12px/#555 restyle) are deleted here and in the pass-2 block below.
   Rollback: restore od-style-1-0-16.css (bump functions.php:17 back to 1-0-16) AND restore the
   454935 menu tree + _megamenu grid per §7o. */


/* ===== OD primary-nav consistency: equalize flyout sub-menu spacing to the grid menus
   (menu-consistency redesign issue #3, 2026-08-18) =====
   Root cause: Max Mega Menu renders the primary nav with two engines. The three GRID
   menus (Custom products 8055 / Standard products 454520 / Industries 454935) render
   third-level links at 14px / line-height 23.8px / anchor padding 0, with the 15px
   horizontal inset carried by the parent li. The four FLYOUT menus (Knowledge base 8074 /
   Customer Trust 454521 / Resources 454522 / About us 326164) render at 13px /
   line-height 35px / anchor padding 0 10px, with the inset carried by the anchor itself.
   Fix pulls the flyouts to grid metrics and moves the inset off the anchor onto the
   container, exactly as the grid does, so the anchor reads padding-left:0 like a grid link.
   Desktop mega-menu only; no link / DB / nav change.
   Rollback: strip this block + purge, or restore the dated .bak alongside this file. */
@media (min-width: 1025px) {
  #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-flyout.mega-menu-item > ul.mega-sub-menu {
    padding: 10px 0;
  }
  #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-flyout.mega-menu-item > ul.mega-sub-menu > li.mega-menu-item {
    padding: 0 15px;
  }
  #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-flyout.mega-menu-item ul.mega-sub-menu li.mega-menu-item > a.mega-menu-link,
  #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-flyout.mega-menu-item ul.mega-sub-menu li.mega-menu-item-has-children > a.mega-menu-link {
    font-size: 14px;
    line-height: 1.7;
    padding: 0;
  }
}


/* ===== OD primary-nav consistency: childless grid column headers match their siblings
   (menu-consistency redesign follow-up, 2026-08-18) =====
   A grid column head with no children (currently only 454541 "Talk to an engineer" in
   Custom products 8055) lacks .mega-menu-item-has-children and was rendering in the
   theme link colour, lower-case, while the other seven heads render #555 uppercase.
   Restates MMM's own second-level treatment on the same selector so every direct child
   of a grid column is styled identically regardless of whether it has children.
   !important is required: the theme sets the link colour from a rule that outranks an
   equal-specificity override (verified empirically in-browser — the same declarations
   without !important do not win). Matches the existing !important precedent in this file.
   Desktop mega-menu only; no link / DB / nav change.
   Rollback: strip this block + purge, or restore the dated .bak alongside this file. */
@media (min-width: 1025px) {
  #mega-menu-wrap-main-menu #mega-menu-main-menu > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link {
    color: #555 !important;
    text-transform: uppercase !important;
  }
}


/* ===== OD primary-nav consistency pass 2 (2026-08-18): unify the 3 GRID mega-menus =====
   Fixes two outliers so Custom / Standard / Industries share one visual system.
   (1) Custom-products panel 8055 rendered ~1371px, overflowing the ~1192px content
       container AND the viewport ("custom products too wide"). Constrain it to the
       container edges like 454520/454935 — viewport-independent (left:0/right:0 of the
       positioned wrap), not a hardcoded width.
   (2) Industries 454935 cluster labels were 14px/#1a1a1a with a 1px underline bar, unlike
       the other grids' plain column headers. Restyle to the grid header look (12px/#555,
       no border) so Industries stops being the odd one out.
   Desktop mega-menu only. Rollback: bump enqueue back to od-style-1-0-15.css. */
@media (min-width: 1025px) {
  #mega-menu-wrap-main-menu #mega-menu-main-menu > li#mega-menu-item-8055 > ul.mega-sub-menu {
    width: auto !important;
    left: 0 !important;
    right: 0 !important;
  }
  /* Industries 454935 ::before cluster-label restyle removed 2026-08-18 (§7o):
     the two banners are gone; the reformatted headed columns style themselves. */
}


/* ===== OD mega-menu per-item leaf hover highlight (2026-08-18, §7p) =====
   MMM's generated grid-hover rule (background:#f9f9f9) uses child combinators that stop at
   the 2nd level, so it fills only the COLUMN-HEADER anchor (LCD / TFT / …). The 3rd-level
   LEAF links (Character LCD, Graphic LCD, Automotive, …) matched only a transparent rule —
   verified in-browser: header anchor :hover = rgb(249,249,249), leaf anchor :hover =
   rgba(0,0,0,0) — so a leaf gave NO visible highlight and the user could not tell which
   item they were on. This adds a distinct per-leaf hover fill across all three GRID
   mega-menus (Custom products 8055, Standard products 454520, Industries & Applications
   454935); the double-nested `ul.mega-sub-menu ul.mega-sub-menu` scopes it to leaves only,
   never the header. Header hover is deliberately left as MMM's own #f9f9f9 column-header
   fill (the "hover LCD highlights all of it" the principal keeps). Because leaf and header
   anchors are separate elements, hovering a leaf highlights ONLY that leaf.
   Desktop mega-menu only. Rollback: strip this block + bump enqueue back to 1-0-17. */
@media (min-width: 1025px) {
  #mega-menu-wrap-main-menu #mega-menu-main-menu li.mega-menu-column ul.mega-sub-menu ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link:hover,
  #mega-menu-wrap-main-menu #mega-menu-main-menu li.mega-menu-column ul.mega-sub-menu ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link:focus {
    background: #ececec !important;
    color: #222 !important;
  }
}

/* Character LCD leaf (page 3573) — hide the template-level Contact Us form (d-contact / wpcf7) per specs/CHARACTER_LCD_REDESIGN_SPEC.md AC-7; same page-scoped pattern as the .wd-page-title hide above. Reversible: delete this rule and revert the enqueue to od-style-1-0-18.css. */
body.page-id-3573 .d-contact{display:none!important}

/* LCD family consolidation page (page 454336) — defensive .d-contact hide
   added for parity with the leaf-family convention. As of this build the
   rendered page carries NO .d-contact form (verified via a live fetch: the
   template used by 454336 does not render one), so this rule is currently a
   no-op; it is added so the page matches the established
   .wd-page-title/.d-contact pairing and is future-proofed if the template
   ever adds one. The .wd-page-title hide for 454336 already exists above
   (added in an earlier pass) and is unchanged. Rollback: delete this rule +
   re-enqueue od-style-1-0-19.css. */

/* product-leaf-replication build, 2026-08-25 — Graphic LCD (3717), JAZZ (40809),
   Monochrome TFT (88788): hide the template-level duplicate Contact Us form
   (.d-contact / wpcf7), same page-scoped pattern as Character LCD (3573,
   od-style-1-0-19.css, untouched above) and the 454336 pairing already
   present above. Verified via live HTTP fetch (pre-deploy) that these three
   pages DO render a .d-contact block; Glass Panels (454497) does NOT
   (verified the same way) so no rule is added for it. Reversible: delete
   these 3 rules + re-enqueue od-style-1-0-20.css. */
body.page-id-3717 .d-contact{display:none!important}
body.page-id-40809 .d-contact{display:none!important}
body.page-id-88788 .d-contact{display:none!important}

/* product-leaf-replication build, 2026-08-26 — Sunlight-Readable TFT (454338):
   table-less .od-op leaf redesign ships its own hero <h2> title, so hide the
   theme .wd-page-title band (else the title doubles). No .d-contact rule: this
   page renders NO template Contact form (verified via live HTTP fetch, same
   per-page discipline as Glass Panels 454497). Reversible: delete this rule +
   re-enqueue od-style-1-0-21.css. */


/* OLED hub leaves (oled-modules 454504, arduino-oled 454583) — hide the theme .wd-page-title
   band; each redesigned leaf ships its own hero (h2). The band's <h1> stays in the DOM (now
   invisible) so the single-H1 SEO invariant holds. No .d-contact rule: these leaves render no
   .d-contact block (verified via live fetch, 2026-08-26). Same page-scoped pattern as the
   sunlight-readable-tft leaf (454338) above. Reversible: delete these two rules and revert the
   enqueue to od-style-1-0-24.css. */

/* E-Paper leaf-v2 band hide (2026-08-26): hide the Woodmart .wd-page-title bar on the two
   E-Paper leaves (e-paper-displays 454505, color-e-paper 454584) — the leaf-v2 fragment renders
   its own <h2> hero, so the theme title band would otherwise duplicate it and break the single-H1
   SEO invariant. Hub 358607's band is hidden by the rule above. No .d-contact rule: these leaves
   render no .d-contact block (verified 2026-08-26). Reversible: delete these two rules and revert
   the enqueue to od-style-1-0-25.css. */

/* 1-0-27: Touch + Dev-tools table-less leaf .wd-page-title hides (454507/8, 454510/11/12) */

/* 1-0-28: demo-eval-boards 4293 .wd-page-title hide (table-preserving leaf) */
body.page-id-4293 .wd-page-title{display:none!important}

/* 1-0-29: KB landing 2377 redesign - hide theme title band + template contact form.
   /knowledge-base/ was rebuilt into the new design system with its own hero; the
   Woodmart title band and the template .d-contact CF7 form are chrome the redesign
   replaces (dedicated Zoho Contact Us page exists). Scoped to page-id-2377 only.
   Reversible: delete these two rules and revert the enqueue to od-style-1-0-28.css. */
body.page-id-2377 .wd-page-title{display:none!important}
body.page-id-2377 .d-contact{display:none!important}

/* 1-0-30: KB landing 2377 - remove the template "Contact our experts" contact
   sidebar (col-md-3 holds only that widget; the redesign has its own funnel CTA)
   and center the KB search bar to the 860px content width so it aligns with the
   redesigned page. Scoped to page-id-2377. Reversible: delete these two rules. */
body.page-id-2377 .d-main-wrapper > .row > .col-md-3{display:none!important}
body.page-id-2377 .d-kb-search-row{max-width:860px!important;margin-left:auto!important;margin-right:auto!important}

body.page-id-3333 .wd-page-title{display:none!important}

/* =====================================================================
   1-0-33: STORE REDESIGN WS2 — Woodmart store-template brand polish
   Spec: specs/STORE_REDESIGN_SPEC.md (AC-7 brand-language templates,
   AC-7a filters-left / compact-hero / products-first, AC-8a commerce
   intact). Approved mockup: specs/STORE_REDESIGN_MOCKUP.html.
   CHROME-ONLY: restyles the WooCommerce/Woodmart archive (/store/ +
   product_cat) and single-product templates in the OD brand design
   language. No product/content changes. Every rule is scoped to a store
   body class (.woodmart-archive-shop / .single-product / .woocommerce
   .wd-product) so nothing outside the store is touched. Only safe
   properties are changed (color / border / radius / type / spacing /
   background); the product grid, filter sidebar, add-to-cart flow, and
   single-product gallery/tabs keep their native Woodmart structure and
   JS behaviour — AC-8a add-to-cart / cart / checkout stay intact.
   Filters are already an in-flow LEFT sidebar on desktop and the grid is
   already 4-up, so AC-7a is met by compacting the hero (below), not by
   restructuring layout.
   Rollback: delete this whole block AND revert functions.php line 17
   enqueue to od-style-1-0-32.css.
   ===================================================================== */

/* brand tokens, confined to the store scopes (no :root / global leak) */
body.woocommerce{
  --od-green:#1a7d2e; --od-green-dk:#13611f; --od-green-darker:#0e4a18;
  --od-ink:#1a2230; --od-ink-soft:#4a5568; --od-line:#e2e7ee;
  --od-bg-soft:#f5f7fa; --od-bg-panel:#eef2f7;
}

/* ---------- AC-7a: COMPACT ARCHIVE HERO (shop + category archives) ----------
   Replace the tall black .wd-page-title band with a compact typographic
   head (principal-locked: typographic only, no .phero band) so the product
   grid begins as high as possible. */
body.woodmart-archive-shop .wd-page-title{
  background:#fff!important;
  padding:22px 0 0!important;
  border-bottom:1px solid var(--od-line);
}
body.woodmart-archive-shop .wd-page-title .wd-page-title-bg{display:none!important}
body.woodmart-archive-shop .wd-page-title .container{padding-top:0!important;padding-bottom:14px!important}
body.woodmart-archive-shop .wd-page-title .wd-title-wrapp{margin:0!important}
body.woodmart-archive-shop .wd-page-title h1.entry-title.title{
  color:var(--od-ink)!important;
  font-size:32px;line-height:1.12;letter-spacing:-.02em;font-weight:800;
}
/* the "back" arrow is not part of the redesigned head (breadcrumb covers it) */
body.woodmart-archive-shop .wd-page-title .wd-back-btn{display:none!important}

/* category strip in the band -> compact brand "chips" (was white-on-black) */
body.woodmart-archive-shop .wd-page-title .wd-nav-product-cat{margin-top:12px!important}
body.woodmart-archive-shop .wd-page-title .wd-nav-product-cat > li > a.category-nav-link{
  color:var(--od-ink-soft)!important;
  background:var(--od-bg-soft);
  border:1px solid var(--od-line);
  border-radius:20px;
  padding:6px 13px!important;
  font-size:13px;font-weight:600;
  transition:.15s;
}
body.woodmart-archive-shop .wd-page-title .wd-nav-product-cat > li.wd-active > a.category-nav-link,
body.woodmart-archive-shop .wd-page-title .wd-nav-product-cat > li > a.category-nav-link:hover{
  color:#fff!important;background:var(--od-green);border-color:var(--od-green);
}
/* keep the hover flyout (ul.children) readable on its own white surface */
body.woodmart-archive-shop .wd-page-title .wd-nav-product-cat .children a{color:var(--od-ink-soft)!important}
body.woodmart-archive-shop .wd-page-title .wd-nav-product-cat .children a:hover{color:var(--od-green)!important}

/* term/archive description sits under the head, quiet */
body.woodmart-archive-shop .term-description{color:var(--od-ink-soft);font-size:15px}

/* ---------- AC-7: shop toolbar (result count / ordering / view switch) ---------- */
body.woodmart-archive-shop .woocommerce-result-count{color:var(--od-ink-soft);font-size:13.5px}
body.woodmart-archive-shop .woocommerce-ordering select.orderby{
  border:1px solid var(--od-line)!important;border-radius:6px;padding:8px 12px;
  color:var(--od-ink);background-color:#fff;
}
body.woodmart-archive-shop .wd-products-shop-view a.shop-view.current-variation{color:var(--od-green)!important}
body.woodmart-archive-shop .wd-products-shop-view a.shop-view:hover{color:var(--od-green)!important}

/* ---------- AC-7: PRODUCT CARDS (archive grid + single-product related) ----------
   Scope body.woocommerce .wd-product so related-products on the single
   page get the same treatment. Native hover overlay (wishlist / add-to-cart
   / quick-view) is preserved — only recoloured, never forced visible. */
body.woocommerce .wd-product .product-wrapper{
  border:1px solid var(--od-line);
  border-radius:12px;
  background:#fff;
  /* -40 fix (regression from -36): overflow was hidden here, which clipped
     Woodmart's hover add-to-cart panel (.wd-product-card-hover fades in and
     extends ~73px below the card bottom). Unclip the wrapper and round the
     image top separately (rule below) so corners stay rounded without
     eating the hover panel. Restores AC-8a hover-path add-to-cart. */
  overflow:visible;
  transition:border-color .15s, box-shadow .15s, transform .15s;
}
body.woocommerce .wd-product:hover .product-wrapper{
  border-color:var(--od-green);
  box-shadow:0 12px 30px -18px rgba(26,125,46,.4);
  transform:translateY(-2px);
}
/* -40: round the image top now that the wrapper no longer clips (see above). */
body.woocommerce .wd-product .wd-product-thumb.product-element-top{border-radius:12px 12px 0 0}
body.woocommerce .wd-product .product-element-bottom{padding:14px}
body.woocommerce .wd-product h3.wd-entities-title a{
  color:var(--od-ink)!important;font-weight:700;font-size:14.5px;line-height:1.3;
}
body.woocommerce .wd-product h3.wd-entities-title a:hover{color:var(--od-green)!important}
body.woocommerce .wd-product .wd-product-cats,
body.woocommerce .wd-product .wd-product-cats a{color:#9aa4b2!important;font-size:12px}
body.woocommerce .wd-product .price,
body.woocommerce .wd-product .price .woocommerce-Price-amount.amount{
  color:var(--od-ink)!important;font-weight:800;font-size:16px;
}
/* add-to-cart button inside the native hover overlay -> brand green */
body.woocommerce .wd-product .wd-add-btn > a.button.add_to_cart_button,
body.woocommerce .wd-product .wd-add-btn > a.button.add_to_cart_button.added{
  background:var(--od-green)!important;color:#fff!important;border-radius:6px;
}
body.woocommerce .wd-product .wd-add-btn > a.button.add_to_cart_button:hover{
  background:var(--od-green-dk)!important;
}
/* out-of-stock badge -> quiet grey chip (mockup badge language) */
body.woocommerce .wd-product .product-labels .out-of-stock.product-label{
  background:var(--od-bg-panel)!important;color:var(--od-ink-soft)!important;
  font-weight:700;letter-spacing:.03em;border-radius:5px;
}

/* ---------- AC-7: PAGINATION ---------- */
body.woocommerce .woocommerce-pagination ul.page-numbers li a.page-numbers,
body.woocommerce .woocommerce-pagination ul.page-numbers li span.page-numbers{
  border:1px solid var(--od-line);border-radius:7px;color:var(--od-ink-soft);
}
body.woocommerce .woocommerce-pagination ul.page-numbers li span.page-numbers.current,
body.woocommerce .woocommerce-pagination ul.page-numbers li a.page-numbers:hover{
  background:var(--od-green)!important;color:#fff!important;border-color:var(--od-green)!important;
}

/* ---------- AC-7: FILTER SIDEBAR (archive) ---------- */
body.woodmart-archive-shop .wd-sidebar .widget-title{
  color:var(--od-ink);font-weight:750;letter-spacing:.02em;
}
body.woodmart-archive-shop .wd-sidebar .widget_nav_mega_menu a:hover{color:var(--od-green)!important}
/* price-filter slider -> brand green (jQuery-UI markup, generated at runtime) */
body.woodmart-archive-shop .wd-sidebar .price_slider .ui-slider-range,
body.woodmart-archive-shop .wd-sidebar .price_slider_wrapper .ui-slider .ui-slider-range{
  background:var(--od-green)!important;
}
body.woodmart-archive-shop .wd-sidebar .price_slider .ui-slider-handle,
body.woodmart-archive-shop .wd-sidebar .price_slider_wrapper .ui-slider .ui-slider-handle{
  background:#fff!important;border:2px solid var(--od-green)!important;
}
body.woodmart-archive-shop .wd-sidebar .widget_price_filter .button{
  color:var(--od-green)!important;border:1.5px solid var(--od-green)!important;
  background:#fff!important;border-radius:6px;
}
body.woodmart-archive-shop .wd-sidebar .widget_price_filter .button:hover{
  background:var(--od-green)!important;color:#fff!important;
}

/* ---------- AC-7: SINGLE PRODUCT ---------- */
body.single-product h1.product_title.entry-title{
  color:var(--od-ink);font-size:27px;line-height:1.18;letter-spacing:-.01em;font-weight:800;
}
body.single-product .summary .price,
body.single-product .summary .price .woocommerce-Price-amount.amount{
  color:var(--od-ink)!important;font-size:26px;font-weight:850;
}
body.single-product .summary p.stock.in-stock{color:var(--od-green-dk)!important;font-weight:650}
/* qty box + add-to-cart -> brand */
body.single-product form.cart .quantity,
body.single-product form.cart .quantity input.qty{
  border-color:var(--od-line)!important;border-radius:8px;
}
body.single-product form.cart .single_add_to_cart_button.button{
  background:var(--od-green)!important;color:#fff!important;border-radius:8px;font-weight:750;
}
body.single-product form.cart .single_add_to_cart_button.button:hover{
  background:var(--od-green-dk)!important;
}
/* gallery main image framing (leave PhotoSwipe zoom/carousel behaviour alone) */
body.single-product .woocommerce-product-gallery .woocommerce-product-gallery__image{
  border-radius:12px;overflow:hidden;
}
/* bespoke .d-accordion tabs -> brand active state */
body.single-product .d-accordion .d-accordion__item-title{color:var(--od-ink);font-weight:700}
body.single-product .d-accordion .d-accordion__item.wd-active .d-accordion__item-title,
body.single-product .d-accordion .d-accordion__item--summary:hover .d-accordion__item-title{
  color:var(--od-green);
}
/* related-products heading */
body.single-product .related-and-upsells .wd-carousel-title,
body.single-product .related-products .title{
  color:var(--od-ink);font-weight:800;letter-spacing:-.01em;
}
/* ---------- AC-7a: MOBILE archive density (<=767px) ----------
   Tighten the compact head (smaller h1, kill the theme band's 40px bottom
   margin, quiet the category-description toggle) and go 2-up so more cards
   sit above the fold, matching mockup Board B. Filters already collapse to
   the native "Show sidebar" off-canvas button on mobile. */
@media (max-width:767px){
  body.woodmart-archive-shop .wd-page-title{margin-bottom:10px!important;padding-top:16px!important}
  body.woodmart-archive-shop .wd-page-title .container{padding-bottom:8px!important}
  body.woodmart-archive-shop .wd-page-title h1.entry-title.title{font-size:25px!important;line-height:1.15}
  body.woodmart-archive-shop .term-description{margin-bottom:14px!important;font-size:14px}
  body.woodmart-archive-shop .products.wd-products{
    grid-template-columns:repeat(2,1fr)!important;gap:12px!important;
  }
}
/* ===================== end 1-0-33 WS2 store polish ===================== */

/* =====================================================================
   OD Store - WS2 REVIEW FOLLOW-UPS v2 (principal live review, 2026-08-31)
   Ships in od-style-1-0-35.css (enqueue functions.php:17 -> -35).
   Supersedes the -34 attempt. Pairs with mu-plugin od-store-bbt-button.php.
   Rollback: delete this block, revert enqueue to od-style-1-0-33.css,
   delete the mu-plugin.
   ===================================================================== */

/* R1 - remove BOTH category-description blocks on every store family archive
   + the main shop: the top WooCommerce .term-description AND Woodmart's
   bottom .d-cat-text (#d-more-info) "More Information" block. */
body.tax-product_cat .term-description,
body.tax-product_cat .d-cat-text,
body.post-type-archive-product .term-description,
body.post-type-archive-product .d-cat-text{display:none!important}

/* R2 - "Browse by table" button at the top of each family archive
   (mu-plugin od-store-bbt-button, woocommerce_before_shop_loop, prio 5). */
.od-bbt-top{margin:0 0 18px}
.od-bbt-top a{
  display:inline-flex;align-items:center;gap:8px;line-height:1;
  padding:11px 22px;border:2px solid var(--od-green);border-radius:8px;
  background:#fff;color:var(--od-green)!important;font-weight:750;
  text-decoration:none;transition:background .15s ease,color .15s ease;
}
.od-bbt-top a:hover,.od-bbt-top a:focus{background:var(--od-green);color:#fff!important}

/* R3 - add-to-cart stays LEFT-aligned like the rest of the summary (do NOT
   center horizontally). The real "not centered" was the button LABEL sitting
   4px low: the theme's asymmetric 14px/5px vertical padding offset it. Zero the
   vertical padding + min-height:42px so flex align-items:center centers the
   label and the button height matches the 42px quantity stepper. */
body.single-product form.cart .single_add_to_cart_button.button{
  padding-top:0!important;padding-bottom:0!important;min-height:42px;
}

/* R3b (od-style-1-0-36) - zero form.cart's 10px theme padding-left so the
   quantity+button group's left edge lines up exactly with the title/price/
   stock/bullets (all at the summary-inner left edge). */
body.single-product form.cart{padding-left:0!important}

/* =====================================================================
   OD Store - CART / CHECKOUT / THANK-YOU visual cleanup (od-style-1-0-37)
   Spec: brand-consistency pass over the last three unstyled WooCommerce
   templates (no cart-specific CSS existed before this; checkout only had
   the shipping-method rule below; order-received had zero styling).
   CHROME-ONLY, same discipline as WS2: only safe properties (color /
   border / radius / type / spacing / background), no structural change,
   no functions.php logic. Reuses the exact WS2 brand tokens (--od-green
   family / ink / hairline / panel), re-declared here because these three
   body classes (woocommerce-cart / woocommerce-checkout /
   woocommerce-order-received) are NOT ".woocommerce" and so do not
   inherit the WS2 tokens on body.woocommerce.
   Checkout structural notes (respected, not touched): the "Ship by" /
   courier radio group, custom courier-account fields, Duty & Tax field,
   Order Notes / Product Usage / HTS Code fields are Woo Checkout Field
   Editor Pro + functions.php-driven (~line 2041-2237) - styled generically
   by field-wrapper/type classes only, never by field id/name, and no
   field is reordered, relabeled, or hidden.
   Rollback: delete this whole block AND revert functions.php line 17
   enqueue to od-style-1-0-36.css.
   ===================================================================== */

/* brand tokens, confined to the 3 store-flow scopes (no :root / global
   leak) - identical values to the WS2 block above (lines ~892-894) */
body.woocommerce-cart,
body.woocommerce-checkout,
body.woocommerce-order-received{
  --od-green:#1a7d2e; --od-green-dk:#13611f; --od-green-darker:#0e4a18;
  --od-ink:#1a2230; --od-ink-soft:#4a5568; --od-line:#e2e7ee;
  --od-bg-soft:#f5f7fa; --od-bg-panel:#eef2f7;
}

/* ---------- CART PAGE ---------- */

/* page heading, to match the WS2 archive/product heading language */
body.woocommerce-cart .entry-title.title{
  color:var(--od-ink)!important;font-weight:800;letter-spacing:-.01em;
}

/* cart table: hairline rows, ink text, brand-radius thumbnails */
body.woocommerce-cart table.shop_table.cart{border:none}
body.woocommerce-cart table.shop_table.cart thead th{
  color:var(--od-ink-soft)!important;font-weight:700;font-size:12.5px;
  letter-spacing:.03em;text-transform:uppercase;border-bottom:1px solid var(--od-line)!important;
}
body.woocommerce-cart table.shop_table.cart td{
  border-top:1px solid var(--od-line)!important;border-bottom:none!important;
}
body.woocommerce-cart table.shop_table.cart td.product-name a{
  color:var(--od-ink)!important;font-weight:650;
}
body.woocommerce-cart table.shop_table.cart td.product-thumbnail img{
  border-radius:8px;border:1px solid var(--od-line);
}
body.woocommerce-cart table.shop_table.cart td.product-subtotal,
body.woocommerce-cart table.shop_table.cart td.product-price{
  color:var(--od-ink)!important;font-weight:700;
}
/* quantity stepper */
body.woocommerce-cart .quantity .qty,
body.woocommerce-cart .quantity{border-color:var(--od-line)!important;border-radius:8px}
/* remove-item (x) icon: quiet by default, brand green on hover */
body.woocommerce-cart .product-remove a.remove{color:#9aa4b2!important}
body.woocommerce-cart .product-remove a.remove:hover{
  color:#fff!important;background:var(--od-green)!important;
}

/* "Update cart" -> brand ghost button (mirrors .od-bbt-top language) */
body.woocommerce-cart button[name="update_cart"]{
  background:#fff!important;color:var(--od-green)!important;
  border:2px solid var(--od-green)!important;border-radius:8px;
  font-weight:750;box-shadow:none!important;
}
body.woocommerce-cart button[name="update_cart"]:hover{
  background:var(--od-green)!important;color:#fff!important;
}
/* "Proceed to checkout" -> brand solid button (mirrors single_add_to_cart_button) */
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button{
  background:var(--od-green)!important;border-color:var(--od-green)!important;
  border-radius:8px!important;font-weight:750;
}
body.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover{
  background:var(--od-green-dk)!important;border-color:var(--od-green-dk)!important;
}

/* cart totals -> brand panel card (was unstyled flat text) */
body.woocommerce-cart .cart_totals{
  background:var(--od-bg-panel);border:1px solid var(--od-line);
  border-radius:12px;padding:22px 24px;
}
body.woocommerce-cart .cart_totals h2{
  color:var(--od-ink)!important;font-weight:800;font-size:18px;margin-top:0;
}
body.woocommerce-cart .cart_totals table.shop_table th,
body.woocommerce-cart .cart_totals table.shop_table td{
  border-top:1px solid var(--od-line)!important;color:var(--od-ink-soft);
}
body.woocommerce-cart .cart_totals table.shop_table tr.order-total th,
body.woocommerce-cart .cart_totals table.shop_table tr.order-total td{
  color:var(--od-ink)!important;font-weight:800;font-size:17px;
}
body.woocommerce-cart .cart_totals .amount{color:inherit}
/* coupon field, when the theme shows it */
body.woocommerce-cart .coupon .input-text{
  border:1px solid var(--od-line)!important;border-radius:8px;
}
body.woocommerce-cart .coupon button[name="apply_coupon"]{
  background:#fff!important;color:var(--od-green)!important;
  border:2px solid var(--od-green)!important;border-radius:8px;font-weight:700;
}

/* ---------- CHECKOUT PAGE ---------- */

body.woocommerce-checkout .entry-title.title{
  color:var(--od-ink)!important;font-weight:800;letter-spacing:-.01em;
}
/* section headings ("Billing details", "Your order") */
body.woocommerce-checkout #customer_details h3,
body.woocommerce-checkout #order_review_heading{
  color:var(--od-ink)!important;font-weight:800;font-size:17px;
}
/* form labels + generic text inputs/selects (every field-wrapper type,
   never a specific field id/name - keeps the courier/CRM fields untouched
   in behavior, only recolors/resizes the shared chrome) */
body.woocommerce-checkout #customer_details label{color:var(--od-ink-soft)}
body.woocommerce-checkout #customer_details .input-text,
body.woocommerce-checkout #customer_details select,
body.woocommerce-checkout #customer_details textarea,
body.woocommerce-checkout .select2-container .select2-selection{
  border:1.5px solid var(--od-line)!important;border-radius:8px!important;
  background:#fff!important;
}
body.woocommerce-checkout #customer_details .input-text:focus,
body.woocommerce-checkout #customer_details select:focus,
body.woocommerce-checkout #customer_details textarea:focus{
  border-color:var(--od-green)!important;
  box-shadow:0 0 0 3px rgba(26,125,46,.12)!important;outline:none;
}
/* radio / checkbox accent (Duty & Tax, Ship by, newsletter, ship-to-diff,
   terms - accent-color only, no markup/behavior change) */
body.woocommerce-checkout input[type="radio"],
body.woocommerce-checkout input[type="checkbox"]{accent-color:var(--od-green)}
/* Woo Checkout Field Editor Pro radio-field labels (Duty & Tax / Ship by) */
body.woocommerce-checkout .thwcfd-field-radio label{color:var(--od-ink-soft)}

/* "Your order" ticket panel - recolor the box AND its scalloped-edge
   pseudo-elements to the same brand panel color so the torn-ticket shape
   stays intact with no color seam (theme bakes the color into both the
   box background and the ::before/::after radial-gradient notches). */
body.woocommerce-checkout .checkout-order-review{
  background:var(--od-bg-panel)!important;border:1px solid var(--od-line);
}
body.woocommerce-checkout .checkout-order-review::before,
body.woocommerce-checkout .checkout-order-review::after{
  background-image:radial-gradient(farthest-side, rgba(0,0,0,0) 6px, var(--od-bg-panel) 0px)!important;
}
body.woocommerce-checkout .checkout-order-review table.shop_table{border:none}
body.woocommerce-checkout .checkout-order-review table.shop_table th,
body.woocommerce-checkout .checkout-order-review table.shop_table td{
  border-top:1px solid var(--od-line)!important;color:var(--od-ink-soft);
}
body.woocommerce-checkout .checkout-order-review table.shop_table td.product-name{color:var(--od-ink)}
body.woocommerce-checkout .checkout-order-review table.shop_table tr.order-total th,
body.woocommerce-checkout .checkout-order-review table.shop_table tr.order-total td{
  color:var(--od-ink)!important;font-weight:800;font-size:17px;
}

/* payment methods -> bordered cards, brand-highlighted when selected
   (was a flat unstyled <ul>) */
body.woocommerce-checkout ul.wc_payment_methods li.wc_payment_method{
  border:1.5px solid var(--od-line);border-radius:10px;
  padding:14px 16px!important;background:#fff;
}
body.woocommerce-checkout ul.wc_payment_methods li.wc_payment_method:has(input:checked){
  border-color:var(--od-green);background:var(--od-bg-panel);
}
body.woocommerce-checkout ul.wc_payment_methods li.wc_payment_method label{
  color:var(--od-ink)!important;font-weight:650;
}

/* place-order / gateway-redirect button (e.g. "Proceed to PayPal") ->
   brand solid button matching the single-product add-to-cart language */
body.woocommerce-checkout #place_order{
  background:var(--od-green)!important;border-color:var(--od-green)!important;
  border-radius:8px!important;font-weight:750;
}
body.woocommerce-checkout #place_order:hover{
  background:var(--od-green-dk)!important;border-color:var(--od-green-dk)!important;
}
/* terms-and-conditions link */
body.woocommerce-checkout .woocommerce-terms-and-conditions-link{color:var(--od-green)!important}

/* Align the pre-existing shipping-method green (lines ~554-558 above,
   #1a7d2e, predates the WS2/brand-token pass) to the same brand green so
   it does not read as a different shade next to this new panel. Color
   value only - the fallback/no-rate logic above is untouched. */
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li label,
.woocommerce-checkout .woocommerce-shipping-totals ul#shipping_method li .amount{
  color:var(--od-green)!important;
}

/* ---------- ORDER-RECEIVED / THANK-YOU PAGE ---------- */

body.woocommerce-order-received .entry-title.title{
  color:var(--od-ink)!important;font-weight:800;letter-spacing:-.01em;
}
/* readable measure for the whole confirmation block */
body.woocommerce-order-received .woocommerce-order{
  max-width:820px;margin:0 auto;
}
/* success notice -> brand green panel with a left accent bar */
body.woocommerce-order-received .woocommerce-thankyou-order-received{
  background:var(--od-bg-panel);border-left:4px solid var(--od-green);
  border-radius:8px;padding:16px 20px;color:var(--od-ink)!important;
  font-weight:650;font-size:15.5px;
}
/* order overview (number / date / email / total / payment method) ->
   a bordered summary bar instead of default stacked list */
body.woocommerce-order-received ul.woocommerce-order-overview{
  display:flex;flex-wrap:wrap;gap:0;margin:22px 0;padding:0;list-style:none;
  border:1px solid var(--od-line);border-radius:12px;overflow:hidden;
}
body.woocommerce-order-received ul.woocommerce-order-overview li{
  flex:1 1 160px;padding:14px 18px;border-right:1px solid var(--od-line);
  background:var(--od-bg-soft);color:var(--od-ink-soft);font-size:12.5px;
  text-transform:uppercase;letter-spacing:.03em;font-weight:650;
}
body.woocommerce-order-received ul.woocommerce-order-overview li:last-child{border-right:none}
body.woocommerce-order-received ul.woocommerce-order-overview li strong{
  display:block;color:var(--od-ink);font-size:15px;text-transform:none;
  letter-spacing:normal;font-weight:800;margin-top:2px;
}

/* order-details table (line items + totals) */
body.woocommerce-order-received .woocommerce-order-details__title{
  color:var(--od-ink)!important;font-weight:800;font-size:18px;
}
body.woocommerce-order-received table.woocommerce-table--order-details{
  border:1px solid var(--od-line);border-radius:10px;border-collapse:separate;
  border-spacing:0;overflow:hidden;width:100%;
}
body.woocommerce-order-received table.woocommerce-table--order-details thead th{
  background:var(--od-bg-panel);color:var(--od-ink-soft);font-weight:700;
  font-size:12.5px;letter-spacing:.03em;text-transform:uppercase;
  border-bottom:1px solid var(--od-line)!important;
}
body.woocommerce-order-received table.woocommerce-table--order-details td,
body.woocommerce-order-received table.woocommerce-table--order-details th{
  border-top:1px solid var(--od-line)!important;color:var(--od-ink);padding:12px 16px;
}
body.woocommerce-order-received table.woocommerce-table--order-details tfoot tr:last-child th,
body.woocommerce-order-received table.woocommerce-table--order-details tfoot tr:last-child td{
  color:var(--od-green-dk)!important;font-weight:800;font-size:16px;
}

/* billing / shipping address columns -> two brand panel cards */
body.woocommerce-order-received .woocommerce-customer-details .woocommerce-column__title{
  color:var(--od-ink)!important;font-weight:800;font-size:15px;
}
body.woocommerce-order-received .woocommerce-columns--addresses{
  display:flex;flex-wrap:wrap;gap:18px;margin-top:26px;
}
body.woocommerce-order-received .woocommerce-columns--addresses .woocommerce-column{
  flex:1 1 260px;background:var(--od-bg-soft);border:1px solid var(--od-line);
  border-radius:10px;padding:18px 20px;
}
body.woocommerce-order-received .woocommerce-customer-details address{
  color:var(--od-ink-soft);font-style:normal;line-height:1.6;
}

/* mobile density (<=767px): stack the overview bar and address columns */
@media (max-width:767px){
  body.woocommerce-order-received ul.woocommerce-order-overview li{
    flex:1 1 45%;border-bottom:1px solid var(--od-line);
  }
  body.woocommerce-cart .cart_totals{padding:18px}
}
/* ===================== end 1-0-37 store-flow cleanup ===================== */

/* =====================================================================
   OD Store - CART/CHECKOUT button-label centering fixes (od-style-1-0-39)
   Principal live review: "Update cart" (cart) and the #place_order CTA
   (checkout, "Proceed to PayPal") both had off-center labels. Same class
   of defect as WS2 R3 (single_add_to_cart_button, od-style-1-0-36): the
   button itself is fine, Woodmart's own asymmetric padding/alignment
   shifts the flex content region off the button's true visual center.
   - #place_order ("Proceed to PayPal"): FIXED in -38. min-height already
     fixed (48px), padding asymmetric VERTICALLY (15px top / 5px bottom) -
     zero top/bottom padding + restate min-height so align-items:center
     centers the label in the full-height box.
   - "Update cart": -38 CORRECTED THE WRONG AXIS. The button is a fixed
     160px-wide flex box; -38 zeroed left/right padding, which centered the
     label HORIZONTALLY (measured gapL 35.28 / gapR 35.29px - already good).
     The visible defect the principal still saw is VERTICAL: align-items is
     "normal", so the single text line sits at the TOP of the flex box
     (measured gapTop 5.5 / gapBottom 18.5px, label ~13px high). -39 adds
     align-items:center so the label centers in the full button height
     (measured 11.7 / 12.3px). Horizontal fix from -38 is kept.
   ===================================================================== */
body.woocommerce-cart button[name="update_cart"]{
  padding-left:0!important;padding-right:0!important;
  align-items:center!important;
}
body.woocommerce-checkout #place_order{
  padding-top:0!important;padding-bottom:0!important;min-height:48px;
}
/* ===================== end 1-0-39 button-label centering ===================== */


/* ============================================================= */
/* Phase 1 Technical Audit additions (2026-09-01)                */
/* Appended to od-style-1-0-40.css -> od-style-1-0-41.css        */
/* ============================================================= */

/* [G1.1] a11y: visible keyboard-focus ring (WCAG 2.4.7).
   :focus-visible fires on keyboard nav, not on mouse click. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible,
.button:focus-visible,
.btn:focus-visible,
[role="button"]:focus-visible {
    outline: 3px solid #1a7d2e;
    outline-offset: 2px;
    border-radius: 2px;
}

/* [G2.5] Font Awesome theme-side coverage.
   Legacy FA4 "FontAwesome" family (used by ul.bg-list li:before and
   .bg-list-share li:before) mapped to the self-hosted FA6 solid webfont,
   so icons no longer depend on the font-awesome plugin or use.fontawesome.com. */
@font-face {
    font-family: "FontAwesome";
    font-style: normal;
    font-weight: normal;
    font-display: block;
    src: url("fa/webfonts/fa-solid-900.woff2") format("woff2"),
         url("fa/webfonts/fa-solid-900.ttf") format("truetype");
}

/* [G1.3] Heading-order fix: homepage split-lane CTA headings promoted
   from h3 to h2 (H1 -> H2, no skip). Preserve the exact prior visual
   styling that .od-lane h3 carried so the design is unchanged. */
.od-lane h2 {
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -.01em;
    margin: 0 0 14px;
    color: var(--od-ink);
    line-height: 1.2;
}

/* =====================================================================
   ROW-WEIGHT STANDARDIZATION (table-convergence, 2026-09-02)
   Legacy WPBakery markup wraps every data-cell value in <strong> on
   graphic-lcd (3717) / jazz-graphic-lcd (40809) / the TFT Browse-by-Table
   (455186) — e.g. <strong><span style="font-size:10pt">1.54</span></strong> —
   so their body rows render bold (600) while character-lcd (3573), whose cells
   are plain text, renders at 400. Standardize every .spectable table to the
   character-lcd reference: neutralize the <strong> weight on BODY cells only.
   Scoped to `tbody td` so headers keep their intended 700; the anchor rule
   (.spectable a{font-weight:600}) still wins on links, so buy/text links stay
   600 — matching character-lcd exactly. No-op on character-lcd (no cell <strong>).
   Global by design (principal-approved): also converges any other .spectable BBT
   (LCD/OLED/E-Paper/Dev-tools) carrying the same legacy markup.
   Rollback: delete this block (and re-enqueue the prior od-style version).
   ===================================================================== */
.spectable tbody td strong{font-weight:400;}

/* BBT nav-static (2026-09-17): drop Woodmart re-sticking site nav on the 7 BBT pages so it never covers the sticky table header. Beats .whb-header.whb-sticked .whb-main-header{position:fixed} via !important. Rollback: re-enqueue -43 + rm -44. */

/* BBT wide-screen expand-to-no-wrap (2026-09-17, ADR-7 refinement; supersedes the -45 fixed 1360/3040 cap which still compressed text). Each table expands to its own natural no-wrap width and centers, clamped to available width so narrow screens still fit/wrap. All 7 BBT pages, all spectables. Rollback: re-enqueue -44 + rm -46. */
/* BBT expand-to-no-wrap v2 (2026-09-17, -47): keep the wrap a full-bleed band; size the fluid TABLE to its one-line width, capped at viewport, centered. Supersedes the -46 wrap rule that clamped max-content to the ~1144 content column. Scoped to #od-bbt-wrap so .spectable-static tables are untouched. Rollback: re-enqueue -46 + rm -47. */

/* ==========================================================================
   Standardized product-table sizing: leaf WIDE spec tables full-bleed,
   hub .cmp chooser tables within-column
   (TABLE_EXPAND_WITHIN_COLUMN_STANDARD_2026-09-17.md, option 3, -50).
   SUPERSEDES the -48 within-column-for-all block, and the -49 band-every-table
   form: -50 adds a per-table column-count gate so only >= 8-column tables
   full-bleed (principal 2026-09-17 -- JAZZ's 7-col tables floated in the band).
   The standard is now the HYBRID below (wide leaf tables full-bleed, narrow leaf
   tables + hub table.cmp in-column).

   WHY the change: P5 (2026-09-17, Character LCD leaf 3573) showed -48's
   within-column max-content cap is a NO-OP on real wide leaf tables -- the
   .od-op content column is fixed ~1144-1192px and capped below the viewport,
   so a max-width:100% cap does nothing and a 2202px no-wrap leaf spectable
   still scrolled inside the narrow column. Option 3 breaks WIDE leaf spec
   tables out to the full-viewport band (the proven -47 BBT mechanism) so they
   get the whole viewport to expand-to-no-wrap / fit-and-wrap in, instead of a
   ~1144 column. Hub .cmp chooser tables are small (2 rows) and read as part of
   the page, so they STAY within the content column (the -48 hub treatment,
   unchanged).

   LEAF scope = ENUMERATED page-id allow-list (option 1, principal 2026-09-17),
   NOT site-wide. The prior site-wide .od-op leaf selector was a code-review
   blocker (it over-reached onto the Touch hub 454494 PCAP-vs-RTP .spectable, a
   .spectable outside #od-bbt-wrap on the combined Touch hub+BBT page). Allow-list
   = the 3 leaves whose .spectable overflows the ~1144 content column and hides
   columns (survey 2026-09-17): 3573 Character LCD, 3717 Graphic LCD, 40809 JAZZ
   Graphic LCD; every other deployed leaf fits the column or is not .spectable-
   classed. Mirrored into scripts/leaf_common.py (leaf, .od-op-scoped per fragment
   + per-leaf wide_table flag) + every scripts/*_hub_v3_redesign.py (hub) so a
   future rebuild reproduces it. The HUB table.cmp rule below stays site-wide
   (option 3 in-column; no over-reach).

   LEAF full-bleed scope (desktop only, >=769px): the wide-table set is
   `.spectable:not(.spectable-static)` -- these carry the base
   .spectable{min-width:1320px} rule, so by construction they exceed the ~1144
   content column and are the tables that were scrolling. FOUR rules, mirroring
   the full -47 BBT mechanism (not just the width pair -- the leaf .spectable-wrap
   is itself a scroll box: overflow-x:auto + max-height:720px + overflow-y:auto,
   and the leaf thead is position:sticky top:0. The width pair ALONE just makes a
   wider scroll box -- the -48 no-op class -- because nowrap cells force
   min-content == max-content, which max-width:100% cannot shrink):
     (1) the WRAP `body.page-id-{3573,3717,40809} .od-op .spectable-wrap:has(> .spectable:not(.spectable-static))`
         becomes a 100vw band via margin-left:calc(50% - 50vw), border/radius
         zeroed at the viewport edge, AND its scroll box is released
         (max-height:none;overflow:visible) so the table extends into the band and
         the sticky thead pins to the VIEWPORT (as on BBT), not the wrap box. The
         :has() gate is kept as a belt-and-braces guard so a hypothetical
         static-only wrap on one of these pages is never banded (in the prior
         site-wide form it was load-bearing against Embedded's static T2/T3 wraps;
         here the page-id list already excludes Embedded, so :not(#od-bbt-wrap) is
         dropped as redundant).
     (2) the TABLE sizes to its natural no-wrap width (max-content), capped at
         max-width:100% of the 100vw band, centered. min-width:0 resets the base
         .spectable{min-width:1320px} (min-width always beats max-width in the
         CSS width algorithm, so omitting it would no-op the override).
     (3) body{overflow-x:visible} on the 3 page-ids (desktop): beats Woodmart
         base.css body{overflow-x:clip}, which would otherwise clip the over-wide
         table and make <body> the sticky container. Theme-only (a fragment can't
         set body); no fragment mirror for this rule.
     (4) .whb-main-header{position:static} on the 3 page-ids: drops Woodmart's
         re-sticking nav so it can't cover the now-viewport-pinned thead on
         scroll-up (the BBT -44 fix). Theme-only; outside the @media so it also
         holds for the sticky behavior generally.
   Excludes the 7 BBT pages (not in the allow-list; they keep their -47 band),
   every non-enumerated leaf, Embedded's .spectable-static T2/T3, and KB
   wp-block-table tables. Mobile (<=768px) intentionally UNTOUCHED:
   leaf's existing @media(max-width:760px) stacked-card layout already fills the
   column with zero page-level horizontal scroll (see leaf_common.py doc-comment).

   HUB within-column scope: `table.cmp` inside `.od-op` (unique to the 5 chooser
   tables in *_hub_v3_redesign.py). Desktop: max-content capped at the content
   column, left-aligned -- STAYS in-column, NOT full-bleed. Mobile: table.cmp
   has no bespoke mobile layout, so it gets the overflow-x:auto fallback (via
   display:block on the table, the standard wrapper-less responsive-table
   technique -- thead/tbody/tr/td keep their UA-default table display roles).

   Rollback: re-enqueue -47 + rm -49 (re-enqueue -48 to restore the option-2
   within-column-for-all no-op if ever wanted).
   ========================================================================== */
@media (min-width:769px){
  /* Leaf WIDE spec tables -> full-bleed band. Option 1 (principal 2026-09-17):
     scoped to an ENUMERATED wide-leaf page-id allow-list, NOT the prior site-wide
     .od-op form (code-review blocker: the site-wide selector over-reached onto the
     Touch hub 454494 PCAP-vs-RTP .spectable, a .spectable outside #od-bbt-wrap on
     the combined Touch hub+BBT page). Allow-list = the 3 leaves whose .spectable
     overflows the ~1144 content column and hides columns (survey 2026-09-17):
     3573 Character LCD, 3717 Graphic LCD, 40809 JAZZ Graphic LCD. The page-id
     scoping already excludes the 7 BBT pages, so the :not(#od-bbt-wrap) guard is
     dropped; the :has() gate stays so a hypothetical static-only wrap is never
     banded. border/radius zeroed on the band so the wrap's 1px border + 14px
     corner don't show at the viewport edge (mirrors bbt_v2_component.py:220 and
     embbt_fluid_sticky_patch.py FULLBLEED_RULE). */
  /* WIDE tables only (>= 8 columns) full-bleed. The 2nd :has() is a column-count
     gate -- a table with an 8th cell in any row. Per-table refinement (principal
     2026-09-17, -50): JAZZ's 7-col Backlight/Accessories tables (max-content only
     ~200px over the column) floated centered in the 100vw band and looked off; the
     gate keeps them in-column (rule below) while its 12-col "Mode Options" tables
     and the genuinely-wide Character LCD (17-col) / Graphic LCD (13-col) tables
     still band. Uses `tr > *:nth-child(8)` not `thead th:...` because JAZZ's header
     cells are <th> inside <tbody> rows, no <thead> (verified live). */
  body.page-id-3573 .od-op .spectable-wrap:has(> .spectable:not(.spectable-static)):has(> .spectable tr > *:nth-child(8)),
  body.page-id-3717 .od-op .spectable-wrap:has(> .spectable:not(.spectable-static)):has(> .spectable tr > *:nth-child(8)),
  body.page-id-40809 .od-op .spectable-wrap:has(> .spectable:not(.spectable-static)):has(> .spectable tr > *:nth-child(8)){width:100vw;max-width:100vw;min-width:0;margin-left:calc(50% - 50vw);margin-right:0;border-left:none;border-right:none;border-radius:0;max-height:none;overflow:visible}
  body.page-id-3573 .od-op .spectable-wrap:has(> .spectable tr > *:nth-child(8)) > .spectable:not(.spectable-static),
  body.page-id-3717 .od-op .spectable-wrap:has(> .spectable tr > *:nth-child(8)) > .spectable:not(.spectable-static),
  body.page-id-40809 .od-op .spectable-wrap:has(> .spectable tr > *:nth-child(8)) > .spectable:not(.spectable-static){width:max-content;max-width:100%;min-width:0;margin-left:auto;margin-right:auto}
  /* NARROW tables (< 8 columns, e.g. JAZZ's 7-col) stay in the content column at
     natural width: drop the base .spectable{min-width:1320px} so they don't
     stretch/scroll, no band. The wrap keeps its base box (overflow-x:auto for the
     rare ~30px overflow, border/radius intact -- it's not at the viewport edge). */
  body.page-id-3573 .od-op .spectable-wrap:not(:has(> .spectable tr > *:nth-child(8))) > .spectable:not(.spectable-static),
  body.page-id-3717 .od-op .spectable-wrap:not(:has(> .spectable tr > *:nth-child(8))) > .spectable:not(.spectable-static),
  body.page-id-40809 .od-op .spectable-wrap:not(:has(> .spectable tr > *:nth-child(8))) > .spectable:not(.spectable-static){min-width:0;width:max-content;max-width:100%;margin:0}
  /* Release Woodmart base.css body{overflow-x:clip}, which would otherwise make
     <body> the sticky scroll container AND clip the over-wide (max-content) table
     so its far columns are unreachable. Desktop-only (mobile keeps the leaf's own
     stacked-card layout). Exact mirror of the BBT sticky-dedup body fix. */
  body.page-id-3573,body.page-id-3717,body.page-id-40809{overflow-x:visible}
  .od-op table.cmp{width:max-content;max-width:100%;min-width:0;margin-left:0;margin-right:0}
}
/* With the leaf thead now pinned to the VIEWPORT (the wrap box is released above),
   Woodmart's re-sticking site nav (.whb-header.whb-sticked .whb-main-header{position:
   fixed}) would cover the pinned table header on scroll-up. Drop the re-stick on
   these 3 leaves, exactly as the 7 BBT pages do (line ~1504 / od-style -44). */
body.page-id-3573 .whb-main-header,body.page-id-3717 .whb-main-header,body.page-id-40809 .whb-main-header{position:static !important}
@media (max-width:768px){
  .od-op table.cmp{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
}

/* =====================================================================
   VISUAL POLISH (od-style-1-0-51, 2026-09-17, principal) -- three fixes on
   the leaf/hub product tables, all P5-verified on staging at 1680px.
   Rollback for ALL THREE: re-enqueue -50 + rm od-style-1-0-51.css.
   ===================================================================== */

/* FIX 1 -- Leaf custom-band heading contrast. The fragment's own
   `.customband h2,.customband h3{color:#fff}` loses its h3 half in scope_css
   (verified live: JAZZ 40809 + Graphic LCD 3717 render the <h3> band heading at
   var(--wd-title-color) #1a2230 on the dark band; Character LCD's <h2> is
   correctly white). Restore white on both tags, page-agnostic, beating Woodmart
   base.css `h1..h6{color:var(--wd-title-color)}`. */
.od-op .customband h2,.od-op .customband h3{color:#fff !important}

/* FIX 2 -- Tighter leaf/hub table cells: 11px 14px -> 8px 12px (principal
   2026-09-17, "leaf + hub only"). Beats the fragment's own
   `.od-op .spectable th/td{padding:11px 14px}` (equal specificity, but the
   fragment CSS is inline-after in <body>) via !important. Covers leaf .spectable
   + hub table.cmp; the 7 BBT pages (#od-bbt-wrap, outside .od-op) keep their
   component padding. */
.od-op .spectable th,.od-op .spectable td,.od-op table.cmp th,.od-op table.cmp td{padding:8px 12px !important}

/* FIX 3 -- JAZZ narrow (in-column) spec-table cards hug their table and center.
   The < 8-col JAZZ sub-tables (Backlight, Accessories) render in a .spectable-wrap
   card that is the full ~1052 content column while the table is only 822-1048px,
   left-aligned -> 120-230px of dead white to the right (verified live, page-id-40809).
   The wrap CANNOT be shrunk with width:max-content/fit-content: a `.spectable` with
   {width:max-content;max-width:100%} inside a shrink-to-fit block resolves, in Chrome,
   to the full column (a table-intrinsic circular constraint; even display:inline-block
   on the wrap stays 1052 -- verified live). So instead move the card chrome
   (border/radius/bg) OFF the wrap ONTO the table and center the table: the visible
   card becomes the table itself, hugging its content with no dead space, left-aligned to
   the content-column edge (principal 2026-09-17: left-align, not centered). Chrome values
   copied from the fragment's `.spectable-wrap` (border 1px #e2e7ee = --line, radius 14px,
   bg #fff); literals, not var(), so this is independent of fragment custom-property scope.
   The :not(...nth-child(8)) narrow gate mirrors the -50 in-column rule; scoped to the 3
   wide-leaf allow-list pages, so wide banded tables (>=8 col) keep the wrap card
   untouched. Only JAZZ has narrow tables today (no-op on 3573/3717). */
@media (min-width:769px){
  body.page-id-3573 .od-op .spectable-wrap:not(:has(> .spectable tr > *:nth-child(8))),
  body.page-id-3717 .od-op .spectable-wrap:not(:has(> .spectable tr > *:nth-child(8))),
  body.page-id-40809 .od-op .spectable-wrap:not(:has(> .spectable tr > *:nth-child(8))){border:none;border-radius:0;background:transparent;overflow:visible}
  body.page-id-3573 .od-op .spectable-wrap:not(:has(> .spectable tr > *:nth-child(8))) > .spectable:not(.spectable-static),
  body.page-id-3717 .od-op .spectable-wrap:not(:has(> .spectable tr > *:nth-child(8))) > .spectable:not(.spectable-static),
  body.page-id-40809 .od-op .spectable-wrap:not(:has(> .spectable tr > *:nth-child(8))) > .spectable:not(.spectable-static){margin-left:0;margin-right:auto;border:1px solid #e2e7ee;border-radius:14px;background:#fff;overflow:hidden}
}

/* =====================================================================
   VISUAL POLISH (od-style-1-0-54, 2026-09-18, principal) -- three follow-on
   fixes on the leaf/hub product tables. P4-verified on staging at 1680px
   (computed geometry + CSSOM rule-match on JAZZ 40809, Character 3573, Graphic
   3717); the real-Chrome visual sign-off is the principal's. Builds on the
   -51..-53 polish block above.
   Rollback for ALL THREE: re-enqueue -53 + rm od-style-1-0-54.css.
   ===================================================================== */

/* FIX 4 -- JAZZ wide "Mode Options" tables (page 40809) hug their content
   instead of stretching edge-to-edge. The -49 wide-leaf band rule INTENDS a wide
   .spectable to size to max-content and centre in the 100vw band (Graphic LCD
   3717 obeys it: its 13-col table = 1433px, centred). JAZZ's two 12-col Mode
   tables did NOT obey it -- the fragment's inline `.od-op .spectable{width:100%}`
   won the cascade over the band rule's `width:max-content` on 40809 (Graphic's
   did not; identical rules + markup, the divergence was not root-caused, the band
   rule simply lost the race there), so the table filled the full ~1665px band and
   spread ~214px of dead inter-column white space. Force max-content + centred with
   !important, scoped to 40809 ONLY so the Character (3573, 17-col overflow-scroll)
   and Graphic (3717, already correct) wide tables stay untouched. Verified live:
   JAZZ-A Mode -> 1451px, JAZZ-B Mode -> 1370px, both centred in the band, no
   internal dead space. Narrow (<8-col) JAZZ tables keep their -53 left-aligned
   in-column hug (this rule's :has(8th-child) gate excludes them). */
@media (min-width:769px){
  body.page-id-40809 .od-op .spectable-wrap:has(> .spectable tr > *:nth-child(8)) > .spectable:not(.spectable-static){
    width:max-content !important; max-width:100% !important; margin-left:auto !important; margin-right:auto !important;
  }
}

/* FIX 5 -- Standardize the leaf/hub table action buttons across ALL .od-op tables
   (principal 2026-09-18, "all leaves and hubs and tables"):
   (a) rounded 6px corners everywhere (Character LCD's were 0px / sharp);
   (b) uniform padding 6px 14px;
   (c) "Buy Here" = solid orange fill; "Contact Us" = orange outline only, so
       fill-vs-outline reads buy-vs-contact without reading the label.
   Buy Here is ALWAYS class `button-demo` with a product-search href. "Contact Us"
   is authored two ways (verified live 2026-09-18): class `button-contact`
   (Character 3573, JAZZ 40809), OR class `button-demo` with a contact-us / mail
   href (Graphic 3717 -- 28 Contact links classed button-demo, which is exactly
   why they rendered identical to Buy). So Contact is targeted by class OR by a
   contact-us / mailto: / mail: href, catching both patterns without ever catching
   a Buy button (Buy hrefs are product-search only). Orange = #1a7d2e (the theme's
   own button-demo fill). The `body` prefix + background-color longhand raise
   specificity over the theme's `.button-demo{background:#1a7d2e !important}`
   (style.css) so the outline case wins on the button-demo-classed Contact links.
   NOTE: these buttons carry `transition:.25s`, so a JS-injected style change
   animates the radius/colour and reads mid-transition; the deployed CSS is the
   initial computed value on load (no transition) and renders final immediately. */
.od-op .spectable a.button-demo, .od-op .spectable a.button-contact,
.od-op table.cmp a.button-demo, .od-op table.cmp a.button-contact{
  border-radius:6px !important; padding:6px 14px !important;
}
.od-op .spectable a.button-demo, .od-op table.cmp a.button-demo{
  background-color:#1a7d2e !important; color:#fff !important; border:2px solid #1a7d2e !important;
}
body .od-op .spectable a.button-contact, body .od-op table.cmp a.button-contact,
body .od-op .spectable a.button-demo[href*="contact-us"], body .od-op table.cmp a.button-demo[href*="contact-us"],
body .od-op .spectable a.button-demo[href^="mailto"], body .od-op table.cmp a.button-demo[href^="mailto"],
body .od-op .spectable a.button-demo[href^="mail:"], body .od-op table.cmp a.button-demo[href^="mail:"]{
  background-color:transparent !important; color:#1a7d2e !important; border:2px solid #1a7d2e !important;
}

/* FIX 5 widen (-55, principal 2026-09-18): the legacy `.buy` / `.contact` class
   vocabulary. Monochrome-TFT leaf 88788 authored its Buy/Contact CTAs as a.buy /
   a.contact (NOT button-demo/button-contact), so the -54 rules matched none of them
   and they rendered legacy green. Blast-radius sweep (all 342 sitemap pages, 2026-09-18)
   confirms a.buy/a.contact inside .od-op .spectable/table.cmp are ONLY ever genuine
   Buy-Here / Contact-Us CTAs -- 38 total (10 buy + 28 contact) across exactly 2 pages,
   zero non-CTA occurrences. Effect: 88788's 1 buy + 1 contact go green->orange (the fix);
   the e-paper BBT's 36 are ALREADY orange via that page's own inline <style>, so this is
   a same-value no-op there (the !important wins on the identical colour). FIX 6 centering
   is deliberately NOT widened to .buy/.contact -- doing so would re-center e-paper BBT's
   left-aligned cells, an unrequested change; 88788's own cells already centre. The 2
   bare-class <a> Contact links on 88788 (and 3 bare Buy links on dev-tools/browse-by-table)
   carry no class to match and are routed to content re-cut, not styled here. */
.od-op .spectable a.buy, .od-op .spectable a.contact,
.od-op table.cmp a.buy, .od-op table.cmp a.contact{
  border-radius:6px !important; padding:6px 14px !important;
}
.od-op .spectable a.buy, .od-op table.cmp a.buy{
  background-color:#1a7d2e !important; color:#fff !important; border:2px solid #1a7d2e !important;
}
body .od-op .spectable a.contact, body .od-op table.cmp a.contact{
  background-color:transparent !important; color:#1a7d2e !important; border:2px solid #1a7d2e !important;
}

/* FIX 6 -- Center the Buy/Contact button within its cell at every width. The
   wide-view off-center case (principal): a JAZZ Stock-column `Contact Us` sat in a
   `text-align:left` <td> with no centering wrapper, so in the stretched wide table
   it drifted ~98px left of the cell centre while the div-wrapped Buy buttons
   centred (it read centred at narrow width because the cell was then only button-
   wide). FIX 4's hug shrinks that column too, but this makes centering robust
   regardless of table width or authoring wrapper. Scoped via :has() to cells that
   actually hold an action button, so ordinary left-aligned data cells are
   untouched. */
.od-op .spectable td:has(a.button-demo), .od-op .spectable td:has(a.button-contact),
.od-op table.cmp td:has(a.button-demo), .od-op table.cmp td:has(a.button-contact){
  text-align:center !important;
}

/* Phase A (2026-09-20, -56): center product-table HEADINGS only (thead th) across all
   product tables — BBT `.od-op .spectable`, hub chooser `table.cmp`, leaf/rounded-card
   `.spectable-wrap`, and the bespoke Embedded `#embbt-section .spectable`. Data cells (td)
   and row-header cells (tbody th) stay LEFT-aligned (a prior fix deliberately removed td
   centering; not touched here). Each selector outranks the inline `th,td{text-align:left}`
   rules by specificity, so centering wins with no !important. Rollback: re-enqueue -55 + rm -56. */
.od-op .spectable thead th,.od-op table.cmp thead th,#embbt-section .spectable thead th{text-align:center}
/* card-leaf (oled_leaf_v2 .spectable-wrap) emits its own equal-specificity th{left} inline and loads later; !important lets the site rule win there */
.od-op .spectable-wrap thead th{text-align:center !important}

/* FIX 7 REVISED (2026-09-20, principal) -- close the sticky-header gap above the green
   announcement bar on leaf/product pages. Ground truth from the real logged-in DOM
   (page 455448): `.whb-header.whb-sticky-prepared` carries padding-top = header height as a
   placeholder, while the inner `.whb-main-header` is left `position:static` in normal flow,
   so the placeholder becomes empty space above the top bar (header h=198, top bar pushed to
   top:99). It is NOT admin-bar gated -- it reproduces with `#wpadminbar` ABSENT, so the
   earlier `body.admin-bar` scoping never matched. WoodMart's scroll-stick "prepare" reserves
   the placeholder but fails to lift the inner header out of flow on non-home pages; the
   homepage DOES lift it (inner absolute) so it never gaps -- hence :not(.home). The sticky
   does not actually engage on these pages (inner never goes fixed on scroll), so the
   placeholder is dead weight; removing it returns the header to its correct flush render at
   any viewport width. Homepage keeps its load-bearing padding untouched. Supersedes the
   inert admin-bar-scoped rule from -58. Rollback: re-enqueue od-style-1-0-58.css. */
body:not(.home) .whb-header.whb-sticky-prepared{
  padding-top:0 !important;
}

/* == od-style -60 (2026-10-06): mega-menu 8 "Integrated Embedded Systems" (item 456051) bold ==
   Its two column siblings, "Start a Custom Project" (454540) and "Talk to an Engineer" (454541),
   are forced to 700 by the Customizer Additional CSS (post 380936). 456051 was added after that
   rule, so it rendered 400. Match it here. Rollback: re-enqueue od-style-1-0-59.css. */
.mega-menu-item-456051 > a.mega-menu-link{
  font-weight:700 !important;
}

/* == od-style -61 (2026-10-07, principal): (1) header gap on template blog posts; (2) compact bold Custom Products menu ==
   (1) On blog-template posts (body.od-bp-on) od-blogpost-1-0-1.css pins .whb-main-header
   position:static so the header scrolls away. After any scroll down/up Woodmart leaves
   .whb-sticky-prepared on the header, whose padding-top:var(--wd-header-h) placeholder only
   makes sense when the inner header is lifted out of flow (absolute/fixed). With the inner
   header static, the placeholder became a 231px (99px <=1024) white gap above the top bar.
   The -59 rule above (padding-top:0) LOSES here: the Additional CSS rule
   `body:not(.home):not(.page-id-…)x10 .whb-header.whb-sticky-prepared{padding-top:var(--wd-header-h)!important}`
   is also !important, specificity (0,13,1) vs (0,3,1), so it wins. The :not(#od-61) id
   bump gives (1,3,1), enough to beat it without editing Additional CSS. Scoped to the
   template posts only: every other page is unaffected (sticky pages keep the placeholder
   their absolute/fixed header needs). Rollback: re-enqueue od-style-1-0-60.css. */
body.od-bp-on:not(#od-61) .whb-header.whb-sticky-prepared{
  padding-top:0 !important;
}
/* Same pages: Woodmart shrinks the rows to their *-sticky-h heights once .whb-sticked is set
   (231 -> 153px); with a static header that shrink jerks the scrolled content up 78px. Pin the
   sticky heights to the normal ones, exactly as Additional CSS already does for the BBT pages. */
body.od-bp-on{
  --wd-top-bar-sticky-h: var(--wd-top-bar-h);
  --wd-header-general-sticky-h: var(--wd-header-general-h);
  --wd-header-bottom-sticky-h: var(--wd-header-bottom-h);
}

/* (2) Custom Products mega menu (item 8055) only: every column item bold (700), matching the
   CTA trio 454540/454541/456051 that already rendered 700, and tighter vertical rhythm
   (item padding 15px -> 7px, nested-list 6px top margins removed, 10px panel inset).
   Panel 226px -> 158px tall at desktop. Other grid menus (454520, 454935) untouched. */
@media (min-width: 1025px) {
  #mega-menu-wrap-main-menu #mega-menu-main-menu > li#mega-menu-item-8055 > ul.mega-sub-menu {
    padding: 10px 0 !important;
  }
  #mega-menu-wrap-main-menu #mega-menu-main-menu > li#mega-menu-item-8055 > ul.mega-sub-menu > li.mega-menu-row > ul.mega-sub-menu,
  #mega-menu-wrap-main-menu #mega-menu-main-menu > li#mega-menu-item-8055 > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu {
    margin-top: 0 !important;
  }
  #mega-menu-wrap-main-menu #mega-menu-main-menu > li#mega-menu-item-8055 > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
  }
  #mega-menu-wrap-main-menu #mega-menu-main-menu > li#mega-menu-item-8055 > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link {
    font-weight: 700 !important;
  }
}