/*
Theme Name: Eco-Fridge Child
Theme URI: https://eco-fridge.co.uk
Description: Astra child theme for ECO-Fridge Ltd. Header/footer/mega-menu = NATIVE Astra Pro (Header/Footer Builder + Nav Menu mega). Only these remain here: design tokens, brand accents over the native components, "from-price"/£POA pricing, product add-ons, hero slider, subcategory tiles, blog. Design close to eco-fridge.co.uk (Oswald/Open Sans, brand #228B22).
Author: O2 Digital
Author URI: https://seo2agency.com/
Template: astra
Version: 0.8.6
Text Domain: eco-fridge-child
*/

/* =========================================================================
   DESIGN TOKENS — taken 1:1 from the original eco-fridge theme
   ========================================================================= */
:root {
  /* Tied to the Astra global palette (editable in Customizer → Global → Colors);
     fallback = the original eco-fridge palette if Astra isn't loaded. */
  --ef-brand: var(--ast-global-color-0, #1f821f);      /* brand green (4.9:1 on white) */
  --ef-brand-dark: var(--ast-global-color-1, #1b6f1b); /* hover */
  --ef-brand-light: #81c784;                            /* light green (tile hover border) */
  --ef-brand-deep: #18673a;     /* darker, cooler green: commercial menu bar, 3-column footer, scroll-to-top */
  --ef-brand-deep-hover: #11502d;
  --ef-bg: var(--ast-global-color-5, #ffffff);
  --ef-text: var(--ast-global-color-3, #333);
  --ef-meta: #6b7280;        /* 4.8:1 on white (WCAG AA) */
  --ef-border: var(--ast-global-color-7, #e5e7eb);
  --ef-divider: #eee;
  --ef-stripe: #f8f9fa;
  --ef-font-body: 'Open Sans', 'Open Sans Fallback', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --ef-font-head: 'Oswald', 'Oswald Fallback', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  /* cards (category carousels, product grids): resting + lifted "3D" shadows */
  --ef-card-shadow: 0 1px 2px rgba(0,0,0,.05);
  --ef-card-shadow-hover: 0 22px 40px -10px rgba(0,0,0,.28), 0 10px 16px -8px rgba(0,0,0,.16), 0 0 0 1px rgba(34,139,34,.08);
}

/* Local fallbacks sized like the web fonts, so text keeps its size while
   Oswald / Open Sans load (no layout shift when they swap in). Values measured
   from the font files against Arial (Windows/macOS) — Roboto (Android) has the
   same widths within 0.1%, so one set fits both. Not Arial Narrow: the size-adjust
   is for Arial, on the narrow face it made the text far too narrow. */
@font-face { font-family: 'Oswald Fallback'; src: local('Arial'), local('ArialMT'), local('Roboto'), local('Roboto-Regular'); size-adjust: 81.27%; ascent-override: 146.8%; descent-override: 35.56%; line-gap-override: 0%; }
@font-face { font-family: 'Open Sans Fallback'; src: local('Arial'), local('ArialMT'), local('Roboto'), local('Roboto-Regular'); size-adjust: 104.23%; ascent-override: 102.55%; descent-override: 28.11%; line-gap-override: 0%; }

/* The green category bar stays on one line while the fonts load (it wrapped
   with the wider fallback font, then jumped back: a large layout shift). */
.ef-cat-nav .ef-menu { flex-wrap: nowrap; }
.ef-cat-nav .ef-menu > li > a { white-space: nowrap; }


/* =========================================================================
   TIPOGRAFIE — Oswald (titluri) + Open Sans (body), ca originalul
   ========================================================================= */
body,
button,
input,
select,
textarea,
.wp-block-uagb-container,
.wp-block-uagb-info-box {
  font-family: var(--ef-font-body);
  color: var(--ef-text);
}

h1, h2, h3, h4, h5, h6,
.uagb-heading-text,
.wp-block-uagb-advanced-heading .uagb-heading-text,
.site-title,
.entry-title,
.widget-title {
  font-family: var(--ef-font-head);
  font-weight: 500;
  color: var(--ef-text);
  letter-spacing: 0.01em;
}

/* Section headings in the original style: uppercase, condensed */
.ef-section-title {
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

/* =========================================================================
   CULORI BRAND — linkuri, butoane, accente
   ========================================================================= */
a { color: var(--ef-brand); }
a:hover, a:focus { color: var(--ef-text); }

.ast-button,
.button,
.wp-block-button__link,
.wp-block-uagb-buttons-child .uagb-buttons-repeater,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .button.alt,
.single_add_to_cart_button {
  background-color: var(--ef-brand) !important;
  border-color: var(--ef-brand) !important;
  color: #fff !important;
  border-radius: 2px;
  font-family: var(--ef-font-head);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.ast-button:hover,
.button:hover,
.wp-block-button__link:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.single_add_to_cart_button:hover {
  background-color: var(--ef-brand-dark) !important;
  border-color: var(--ef-brand-dark) !important;
  color: #fff !important;
}

/* "From £X +VAT" price in the original style */
.ef-from-price { color: var(--ef-text); font-weight: 700; }
.ef-from-price .amount { color: var(--ef-brand); }

/* Breadcrumbs WooCommerce — linkuri verzi + separator „>>" */
.woocommerce-breadcrumb a { color: var(--ef-brand); text-decoration: none; }
.woocommerce-breadcrumb a:hover { color: var(--ef-brand-dark); text-decoration: underline; }
.woocommerce-breadcrumb .ef-crumb-sep { color: var(--ef-meta); font-weight: 700; }

/* =========================================================================
   FILTER SIDEBAR on category archives (left)
   ========================================================================= */
/* Shared look (desktop + the mobile dropdown panels): option rows with a custom
   checkbox, a count badge and a hover tint; groups collapse under a chevron
   (inc/product-filters.php); a styled price slider. */
.ef-pf-list,
.ef-pf-sub { list-style: none; margin: 0; padding: 0; }
.ef-pf-item { margin: 0; }
.ef-pf-row { display: flex; align-items: center; gap: 2px; }
.ef-pf-opt {
  position: relative; flex: 1 1 auto; min-width: 0;
  display: flex; align-items: center; gap: 10px;
  margin: 0 0 2px; padding: 7px 10px; border-radius: 8px;
  color: var(--ef-text); font-size: .9rem; font-weight: 400; line-height: 1.3; cursor: pointer;
  transition: background-color .15s ease, color .15s ease;
}
.ef-pf-opt:hover { background: #f1f8f1; color: var(--ef-brand-dark); }
/* the real checkbox stays focusable, the box beside it is what shows */
.ef-pf-opt input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.ef-pf-box {
  flex: 0 0 18px; height: 18px; box-sizing: border-box;
  border: 1.5px solid #c3cad3; border-radius: 5px; background: #fff center / 12px no-repeat;
  transition: background-color .15s ease, border-color .15s ease;
}
.ef-pf-opt:hover .ef-pf-box { border-color: var(--ef-brand); }
.ef-pf-opt input:focus-visible + .ef-pf-box { box-shadow: 0 0 0 3px rgba(34,139,34,.3); }
.ef-pf-opt input:checked + .ef-pf-box {
  background-color: var(--ef-brand); border-color: var(--ef-brand);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.ef-pf-opt:has(input:checked) { color: var(--ef-brand-dark); font-weight: 600; }
.ef-pf-name { flex: 1 1 auto; min-width: 0; }
.ef-pf-count {
  flex: 0 0 auto; margin-left: auto; min-width: 26px; padding: 1px 8px; border-radius: 999px;
  background: #eef1f4; color: #4b5563; font-size: .72rem; font-weight: 600; text-align: center;
}
.ef-pf-opt:has(input:checked) .ef-pf-count { background: var(--ef-brand); color: #fff; }
/* the chevron that opens a group (reset Astra's global button look) */
.ef-pf .ef-pf-toggle {
  flex: 0 0 30px; width: 30px; height: 30px; min-height: 0;
  display: inline-flex; align-items: center; justify-content: center;
  margin: 0 0 2px; padding: 0 !important; border: 0; border-radius: 8px;
  background: transparent !important; color: var(--ef-brand) !important; box-shadow: none; line-height: 1; cursor: pointer;
}
.ef-pf .ef-pf-toggle:hover { background: #f1f8f1 !important; }
.ef-pf .ef-pf-toggle:focus-visible { outline: 2px solid var(--ef-brand); outline-offset: 1px; }
.ef-pf-toggle svg { transition: transform .2s ease; }
.ef-pf-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
/* a group's ranges: indented under a thin guide line */
.ef-pf-sub { margin: 0 0 4px 19px; padding-left: 8px; border-left: 2px solid var(--ef-divider); }
.ef-pf-sub[hidden] { display: none; }
.ef-pf-sub .ef-pf-opt { padding: 6px 8px; font-size: .85rem; }
/* the filters in use: a count on each facet's title, removable chips at the top */
.ef-pf-n {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; margin-left: 2px; padding: 0 5px; border-radius: 999px;
  background: var(--ef-brand); color: #fff; font-size: .7rem; font-weight: 700; letter-spacing: 0; line-height: 1;
}
.ef-pf-active { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 12px 0 4px; }
.ef-pf-active__label { font-size: .78rem; font-weight: 600; color: var(--ef-meta); margin-right: 2px; }
.ef-pf-chip {
  display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
  padding: 4px 6px 4px 10px; border: 1px solid var(--ef-brand-light); border-radius: 999px;
  background: #e8f5e9; color: var(--ef-brand-dark); font-size: .78rem; font-weight: 600; line-height: 1.2;
  text-decoration: none; transition: background-color .15s ease, border-color .15s ease;
}
.ef-pf-chip:hover,
.ef-pf-chip:focus-visible { background: #fff; border-color: var(--ef-brand); color: var(--ef-brand-dark); }
.ef-pf-chip__x {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 18px; height: 18px;
  border-radius: 50%; background: var(--ef-brand); color: #fff; font-size: .85rem; line-height: 1;
}
/* while the next filtered page loads */
.ef-pf-loading #primary { opacity: .55; pointer-events: none; transition: opacity .2s ease; }

/* price filter: slim track, round handles, value pills, full-width button */
#secondary .widget_price_filter .price_slider_wrapper .ui-widget-content,
#secondary .widget_price_filter .ui-slider {
  height: 4px; margin: 16px 9px 18px; border: 0; border-radius: 4px; background: #e3e8ee;
}
#secondary .widget_price_filter .ui-slider .ui-slider-range { background: var(--ef-brand); border-radius: 4px; }
#secondary .widget_price_filter .ui-slider .ui-slider-handle {
  top: -7px; width: 18px; height: 18px; margin-left: -9px; border-radius: 50%;
  background: #fff; border: 2px solid var(--ef-brand); box-shadow: 0 2px 6px rgba(0,0,0,.18);
  cursor: grab; outline: none;
}
#secondary .widget_price_filter .ui-slider .ui-slider-handle:focus-visible { box-shadow: 0 0 0 4px rgba(34,139,34,.25); }
#secondary .widget_price_filter .price_slider_amount {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px; text-align: left;
}
#secondary .widget_price_filter .price_slider_amount .price_label {
  order: -1; width: 100%; float: none; font-size: .82rem; color: var(--ef-meta);
}
#secondary .widget_price_filter .price_label .from,
#secondary .widget_price_filter .price_label .to {
  display: inline-block; margin: 0 2px; padding: 2px 8px; border-radius: 6px;
  background: #f1f8f1; border: 1px solid #cfe8d0; color: var(--ef-text); font-weight: 700;
}
#secondary .widget_price_filter .price_slider_amount .button {
  float: none; width: 100%; margin: 0; padding: 9px 14px; border-radius: 8px;
  font-size: .85rem; letter-spacing: .04em;
}
#secondary .widget_price_filter .price_slider_amount .clear { display: none; }

/* —— DESKTOP (≥922px): the filters sit in one card panel —— */
@media (min-width: 922px) {
  /* a wider sidebar column, so the panel has room for its rows */
  .ast-left-sidebar #secondary { width: 25%; padding-right: 28px; }
  .ast-left-sidebar #primary { width: 75%; padding-left: 32px; }
  #secondary .sidebar-main {
    background: #fff; border: 1px solid var(--ef-brand-light); border-radius: 14px;
    box-shadow: 0 1px 2px rgba(0,0,0,.04), 0 12px 28px -16px rgba(0,0,0,.18);
    padding: 4px 16px 6px; margin-bottom: 28px;
  }
  #secondary .ast-filter-wrap { margin: 0; padding: 0; }
  #secondary .ast-filter-wrap > .widget,
  .astra-off-canvas-sidebar .ast-filter-wrap .widget,
  .ast-filter-wrap .ast-woo-sidebar-widget.widget {
    margin: 0; padding: 16px 0; border-bottom: 1px solid var(--ef-divider);
  }
  #secondary .ast-filter-wrap > .widget:last-child { border-bottom: 0; }
  body #secondary .ast-filter-wrap .widget-title,
  body #secondary .ast-filter-wrap .widgettitle {
    display: flex; align-items: center; gap: 8px;
    font-family: var(--ef-font-head) !important; font-size: .95rem !important; font-weight: 600; line-height: 1.2;
    text-transform: uppercase; letter-spacing: .06em; color: var(--ef-text);
    border: 0; padding: 0; margin: 0 0 10px;
  }
  body #secondary .ast-filter-wrap .widget-title::before,
  body #secondary .ast-filter-wrap .widgettitle::before {
    content: ""; flex: 0 0 4px; width: 4px; height: 14px; border-radius: 2px; background: var(--ef-brand);
  }
  .ef-filters-head {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding: 14px 0 12px; border-bottom: 1px solid var(--ef-divider);
  }
}
.ef-filters-head__title {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--ef-font-head); font-size: 1.05rem; letter-spacing: .02em; color: var(--ef-text);
}
.ef-filters-head__title svg { color: var(--ef-brand); }
.ef-filters-clear {
  font-size: .78rem; font-weight: 600; color: var(--ef-brand); text-decoration: none;
  border: 1px solid var(--ef-brand-light); border-radius: 999px; padding: 3px 10px; white-space: nowrap;
}
.ef-filters-clear:hover { background: var(--ef-brand); border-color: var(--ef-brand); color: #fff; }

/* —— DESKTOP: Categories starts closed under its title, a chevron opens it —— */
@media (min-width: 922px) {
  #secondary .widget:has(> .ef-pf[data-collapsible]) > .widget-title { cursor: pointer; margin-bottom: 0; user-select: none; }
  #secondary .widget:has(> .ef-pf[data-collapsible]).ef-open > .widget-title { margin-bottom: 10px; }
  #secondary .widget:has(> .ef-pf[data-collapsible]):not(.ef-open) > .ef-pf { display: none; }
}
/* the chevron of a section that opens (desktop Categories, every section in the panel) */
#secondary .widget:has(> .ef-pf[data-collapsible]) > .widget-title::after,
.ef-drawer #secondary .widget-title::after,
.ef-drawer #secondary .widgettitle::after {
  content: ""; flex: 0 0 auto; width: 8px; height: 8px; margin: -4px 4px 0 auto;
  border-right: 2px solid var(--ef-brand); border-bottom: 2px solid var(--ef-brand);
  transform: rotate(45deg); transition: transform .2s ease, margin .2s ease;
}
#secondary .widget.ef-open > .widget-title::after,
#secondary .widget.ef-open > .widgettitle::after,
#secondary .widget:has(> .ef-pf[data-collapsible]).ef-open > .widget-title::after { transform: rotate(-135deg); margin-top: 4px; }
#secondary [role="button"].widget-title:focus-visible,
#secondary [role="button"].widgettitle:focus-visible { outline: 2px solid var(--ef-brand); outline-offset: 3px; border-radius: 4px; }

/* —— MOBILE/TABLET (≤921px): a bar at the top of the content (Filters button +
   sorting) that sticks under the header; the filters open in a side panel
   (inc/shop-filters.php builds both and moves the sidebar into the panel). —— */
@media (max-width: 921px) {
  /* until the script has moved it into the panel, the sidebar stays out of view */
  .ast-container > #secondary { display: none; }
  .ef-mbar {
    position: sticky; top: var(--ef-mbar-top, 0px); z-index: 50;
    display: flex; align-items: center; gap: 10px;
    margin: 0 0 14px; padding: 10px 0;
    background: #fff; border-bottom: 1px solid var(--ef-divider);
  }
  .ef-mbar .ef-mbar__filters {
    flex: 1 1 0; min-width: 0; height: 42px; min-height: 0;
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    margin: 0; padding: 0 14px !important; border: 1px solid var(--ef-brand-light); border-radius: 10px;
    background: #fff !important; color: var(--ef-text) !important; box-shadow: none;
    font-family: var(--ef-font-body); font-size: .9rem; font-weight: 600; line-height: 1; letter-spacing: 0; text-transform: none;
  }
  .ef-mbar .ef-mbar__filters svg { color: var(--ef-brand); }
  .ef-mbar .ef-mbar__filters:focus-visible { outline: 2px solid var(--ef-brand); outline-offset: 2px; }
  .ef-mbar__sort { flex: 1 1 0; min-width: 0; }
  .ef-mbar__sort .woocommerce-ordering { margin: 0; float: none !important; width: 100% !important; }
  .ef-mbar__sort select.orderby {
    width: 100%; max-width: none; height: 42px; margin: 0; padding: 0 30px 0 12px;
    border: 1px solid var(--ef-brand-light); border-radius: 10px; background-color: #fff;
    color: var(--ef-text); font-size: .9rem; font-weight: 600;
  }
  /* the result count stays above the grid, on its own line (Astra Pro pins this
     container to the bottom of the screen on phones and pushes the grid down) */
  .ast-header-break-point .ast-shop-toolbar-container { position: static !important; display: block; margin: 0 0 10px; z-index: auto; }
  .ast-shop-toolbar-container .ast-shop-toolbar-aside-wrap { margin: 0 !important; }
  .ast-shop-toolbar-container .ast-shop-toolbar-aside-wrap:empty { display: none; }
  .ast-header-break-point.ast-woocommerce-shop-page-modern-style ul.products { margin-top: 0; }
}

/* the Filters side panel (only ever opened on mobile/tablet) */
.ef-drawer { position: fixed; inset: 0; z-index: 100000; }
.ef-drawer[hidden] { display: none; }
html.ef-drawer-open { overflow: hidden; }
.ef-drawer__backdrop { position: absolute; inset: 0; background: rgba(17, 24, 39, .5); }
.ef-drawer__panel {
  position: absolute; top: 0; bottom: 0; left: 0; width: min(420px, 88vw);
  display: flex; flex-direction: column; background: #fff;
  box-shadow: 8px 0 30px rgba(0,0,0,.2); animation: ef-drawer-in .22s ease-out;
}
@keyframes ef-drawer-in { from { transform: translateX(-100%); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) { .ef-drawer__panel { animation: none; } }
.ef-drawer__head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 8px 10px 16px; border-bottom: 1px solid var(--ef-divider);
  font-family: var(--ef-font-head); font-size: 1.15rem; color: var(--ef-text);
}
.ef-drawer .ef-drawer__close {
  width: 44px; height: 44px; min-height: 0; display: inline-flex; align-items: center; justify-content: center;
  margin: 0; padding: 0 !important; border: 0; border-radius: 10px;
  background: transparent !important; color: var(--ef-text) !important; box-shadow: none;
  font-size: 1.8rem; line-height: 1;
}
.ef-drawer .ef-drawer__close:hover { background: #f1f8f1 !important; }
.ef-drawer__body { flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; padding: 0 16px; }
.ef-drawer__foot { padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--ef-divider); }
.ef-drawer .ef-drawer__done {
  width: 100%; margin: 0; padding: 13px 16px; border: 0; border-radius: 10px;
  background: var(--ef-brand) !important; color: #fff !important; font-size: .95rem; font-weight: 600;
}
.ef-drawer .ef-drawer__done:hover { background: var(--ef-brand-dark) !important; }
/* the sidebar inside the panel: sections one under another, each opened by its title */
.ef-drawer #secondary,
.ef-drawer #secondary .sidebar-main {
  display: block; float: none; position: static; width: 100% !important;
  margin: 0; padding: 0; background: none; border: 0; box-shadow: none;
}
.ef-drawer #secondary .ast-filter-wrap { display: block !important; margin: 0; padding: 0; }
.ef-drawer .ef-filters-head { display: flex; justify-content: flex-end; padding: 12px 0 0; border: 0; }
.ef-drawer .ef-filters-head__title { display: none; }
.ef-drawer .ef-filters-head:not(:has(.ef-filters-clear)) { display: none; }
.ef-drawer .ef-pf-active { padding: 10px 0 12px; border-bottom: 1px solid var(--ef-divider); }
.ef-drawer #secondary .widget { margin: 0; padding: 0; border-bottom: 1px solid var(--ef-divider); }
.ef-drawer #secondary .widget:last-child { border-bottom: 0; }
.ef-drawer #secondary .widget-title,
.ef-drawer #secondary .widgettitle {
  display: flex; align-items: center; gap: 8px; margin: 0; padding: 16px 0;
  border: 0; background: none; cursor: pointer; user-select: none;
  font-family: var(--ef-font-head) !important; font-size: .95rem !important; font-weight: 600; line-height: 1.2;
  text-transform: uppercase; letter-spacing: .06em; color: var(--ef-text);
}
.ef-drawer #secondary .widget:not(.ef-open) > :not(.widget-title):not(.widgettitle) { display: none; }
.ef-drawer #secondary .widget.ef-open > :not(.widget-title):not(.widgettitle) { padding-bottom: 14px; }

/* Astra's "Out of stock" label on product cards: red, so it stands out */
.woocommerce ul.products li.product .ast-shop-product-out-of-stock,
.woocommerce-page ul.products li.product .ast-shop-product-out-of-stock { color: #c62828; font-weight: 700; }

/* Product grid card — subtle border like the original */
.ef-product-card {
  border: 1px solid var(--ef-border);
  background: #fff;
  transition: box-shadow .2s ease;
}
.ef-product-card:hover { box-shadow: 0 6px 18px rgba(0,0,0,.08); }

/* WooCommerce hides the product gallery (inline opacity: 0) until its slider script
   runs at the end of the page, so the main product image painted late and the LCP
   on product pages was 5 s in PageSpeed. The rules below already keep the layout
   stable before the slider starts, so the gallery can be visible from the start. */
.woocommerce-js div.product div.images.woocommerce-product-gallery { opacity: 1 !important; }

/* Content sections — white background (white-background products blend naturally) */
.ef-section-alt { background: #fff; }

/* Areas that display products: white background, no box/tint around the images */
.woocommerce ul.products li.product,
.woocommerce div.product .woocommerce-product-gallery,
.ast-woocommerce-container,
#content .site-content,
.ef-product-card { background: #fff; }
.ef-product-card { border-color: transparent; }

/* Product gallery before its slider starts: show only the first image. Until the
   script wraps the slides in .flex-viewport, every image was stacked full width
   (the page grew by thousands of px, then collapsed: a large layout shift). */
/* = the gap under the slider viewport (a single image gets no slider, so no gap) */
.woocommerce-js div.product div.images.woocommerce-product-gallery > .woocommerce-product-gallery__wrapper:has(> .woocommerce-product-gallery__image + .woocommerce-product-gallery__image) { margin-bottom: 1em; }
.woocommerce-js div.product div.images.woocommerce-product-gallery > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:nth-child(n+2) { display: none; }
/* Same for the Astra Pro thumbnails: until their slider wraps them in .flex-viewport,
   lay them out as the slider will (4 per row, 15px apart) instead of full width. */
.woocommerce-product-gallery--columns-4 .ast-single-product-thumbnails > .woocommerce-product-gallery-thumbnails__wrapper { display: flex; gap: 15px; overflow: hidden; }
.woocommerce-product-gallery--columns-4 .ast-single-product-thumbnails > .woocommerce-product-gallery-thumbnails__wrapper > .ast-woocommerce-product-gallery__image { flex: 0 0 calc((100% - 45px) / 4); min-width: 0; }
/* While the sliders start (the slides are moved into .flex-viewport a few frames
   before their widths are set inline), keep the slides in one row at their final
   width, so the gallery never grows thousands of px tall for a moment. The inline
   widths the slider sets afterwards are the same values. */
.woocommerce-product-gallery,
.woocommerce-product-gallery .ast-single-product-thumbnails { container-type: inline-size; }
.woocommerce-product-gallery .flex-viewport > .woocommerce-product-gallery__wrapper { display: flex; align-items: flex-start; }
.woocommerce-product-gallery .flex-viewport > .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image { flex: 0 0 auto; width: 100cqw; }
.woocommerce-product-gallery--columns-4 .ast-single-product-thumbnails .flex-viewport > .woocommerce-product-gallery-thumbnails__wrapper { display: flex; align-items: flex-start; }
.woocommerce-product-gallery--columns-4 .ast-single-product-thumbnails .flex-viewport > .woocommerce-product-gallery-thumbnails__wrapper > .ast-woocommerce-product-gallery__image { flex: 0 0 auto; width: calc((100cqw - 45px) / 4); margin-right: 15px; }
.ef-product-card:hover { border-color: var(--ef-border); }

/* =========================================================================
   CUSTOM 2-ROW HEADER (driven by the WP menu #342) — hides the native Astra header
   (footer + banner stay native — we do NOT hide them)
   ========================================================================= */
#masthead.site-header,
.ast-above-header-wrap,
.ast-below-header-wrap { display: none !important; }

.ef-header {
  position: sticky;
  top: 0;
  z-index: 999;
  background: #fff;
  box-shadow: 0 2px 10px rgba(0,0,0,.07);
}
/* Logged in: stick right under the fixed WordPress admin bar (32px; 46px up to
   782px; below 600px the bar scrolls away), so the header stays whole and fixed
   instead of sliding under the bar, which looked like a "shrink". */
.admin-bar .ef-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .ef-header { top: 46px; } }
@media (max-width: 600px) { .admin-bar .ef-header { top: 0; } }
/* toggle in Customize → "Green Category Bar" → Sticky top header */
.ef-header.ef-nosticky { position: static; }
.ef-header-inner {
  max-width: 1240px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  padding: 0 20px;
}

/* —— row 1 —— */
.ef-header-row1 .ef-header-inner { justify-content: space-between; gap: 24px; min-height: 80px; }
.ef-logo { display: inline-flex; align-items: center; }
.ef-logo-img { max-height: 58px; width: auto; display: block; }
.ef-row1-right { display: flex; align-items: center; gap: 24px; }

/* —— row 2 (brand bar) —— */
.ef-header-row2 { background: var(--ef-brand-deep); }
.ef-header-row2 .ef-header-inner { justify-content: space-between; gap: 16px; min-height: 46px; position: relative; }

/* —— nav-uri —— */
.ef-menu { list-style: none; display: flex; flex-wrap: wrap; margin: 0; padding: 0; gap: 2px; }
.ef-menu li { position: relative; }
.ef-menu a {
  display: block; text-decoration: none;
  font-family: var(--ef-font-head);
  text-transform: uppercase; letter-spacing: .02em;
  transition: color .15s ease, background .15s ease;
}
.ef-primary-nav .ef-menu a { color: var(--ef-text); padding: 8px 12px; font-size: .9rem; }
.ef-primary-nav .ef-menu a:hover { color: var(--ef-brand); }
.ef-cat-nav .ef-menu > li > a { color: #fff; padding: 12px 13px; font-size: .8rem; line-height: 19px; } /* fixed line box: no height change when the web font swaps in */
/* narrow desktops: the one-line green bar still fits next to the cart */
@media (min-width: 993px) and (max-width: 1180px) {
  .ef-cat-nav .ef-menu > li > a { padding-left: 6px; padding-right: 6px; font-size: .76rem; }
  .ef-menu > li.menu-item-has-children > a::after { margin-left: 5px; }
  /* row 1 (7 items + search) stays on one line too */
  .ef-primary-nav .ef-menu a { padding-left: 7px; padding-right: 7px; font-size: .85rem; }
  .ef-row1-right .ef-header-search { width: 190px; max-width: 190px; flex: 0 0 190px; }
}
.ef-cat-nav .ef-menu > li > a:hover { background: rgba(0,0,0,.14); }

/* down arrow after a top-level item that opens a dropdown / mega menu */
.ef-menu > li.menu-item-has-children > a::after {
  content: ""; display: inline-block;
  width: 6px; height: 6px; margin-left: 8px;
  border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: translateY(-3px) rotate(45deg);
  transition: transform .18s ease;
}
.ef-menu > li.menu-item-has-children:hover > a::after { transform: translateY(0) rotate(225deg); }

/* simple dropdowns (row 1: Markets → the market pages) */
.ef-menu .sub-menu {
  position: absolute; top: 100%; left: 0; min-width: 240px; max-width: 320px;
  background: #fff; box-shadow: 0 10px 26px rgba(0,0,0,.15);
  list-style: none; margin: 0; padding: 6px 0; z-index: 60;
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.ef-menu li:hover > .sub-menu { opacity: 1; visibility: visible; transform: translateY(0); }
.ef-menu .sub-menu a {
  color: var(--ef-text) !important; text-transform: none; letter-spacing: 0;
  font-family: var(--ef-font-body); font-size: .87rem; padding: 9px 16px; white-space: nowrap;
}
.ef-menu .sub-menu a:hover { background: var(--ef-stripe); color: var(--ef-brand) !important; }
/* second-level dropdown (Markets) — flyout to the right */
.ef-menu .sub-menu .sub-menu { top: 0; left: 100%; }
.ef-row1-right .ef-menu > li:last-child .sub-menu { left: auto; right: 0; }
.ef-row1-right .ef-menu > li:last-child .sub-menu .sub-menu { left: auto; right: 100%; }

/* row 1 dropdown on desktop: a light rounded card, rounded rows, and an arrow
   that slides in on hover */
@media (min-width: 993px) {
  .ef-primary-nav .ef-menu > li > .sub-menu {
    top: calc(100% - 5px); padding: 8px; min-width: 250px;
    border: 1px solid #e3ebe3; border-radius: 14px;
    box-shadow: 0 18px 40px -14px rgba(16,60,30,.28), 0 2px 6px rgba(16,60,30,.06);
  }
  /* invisible bridge over the gap, so the menu stays open on the way down */
  .ef-primary-nav .ef-menu > li > .sub-menu::before {
    content: ""; position: absolute; left: 0; right: 0; top: -6px; height: 6px;
  }
  .ef-primary-nav .ef-menu .sub-menu a {
    display: flex; align-items: center;
    padding: 10px 12px; border-radius: 9px; font-size: .9rem;
    transition: background .18s ease, color .18s ease;
  }
  /* the arrow opens up in front of the label, with a space after it */
  .ef-primary-nav .ef-menu .sub-menu a::before {
    content: "\2192"; flex: 0 0 auto; overflow: hidden;
    width: 0; margin-right: 0; opacity: 0;
    font-size: 1rem; line-height: 1; color: var(--ef-brand);
    transition: width .18s ease, margin .18s ease, opacity .18s ease;
  }
  .ef-primary-nav .ef-menu .sub-menu a:hover { background: #f1f7f1; }
  .ef-primary-nav .ef-menu .sub-menu a:hover::before { width: 1em; margin-right: 8px; opacity: 1; }
}

/* —— MEGA MENUS (row 2) ——
   A soft card that drops from the green bar: rounded bottom corners, a
   diffuse shadow, a short fade + slide. Display / Storage Cabinets: a grid of
   compact tiles (product image in a pale square, name beside it, an arrow on
   hover). Commercial Fridges / Freezers: grouped text links with the same
   hover (pale green row + arrow) as the row-1 dropdowns. */
.ef-cat-nav {
  --ef-mega-tint: #f2f7f3;
  --ef-mega-line: #e3ebe5;
  --ef-mega-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E");
}
.ef-cat-nav .ef-menu > li.ef-mega-full { position: static; } /* mega spans the container width */
.ef-mega {
  position: absolute; top: 100%;
  background: #fff;
  border: 1px solid var(--ef-mega-line); border-top: 0;
  border-radius: 0 0 18px 18px;
  box-shadow: 0 28px 50px -18px rgba(16, 52, 30, .32), 0 6px 14px -8px rgba(0, 0, 0, .12);
  padding: 22px 24px 24px; z-index: 70;
  /* never taller than the screen below the sticky header (80 + 46px; +32px admin
     bar): a taller panel scrolls inside itself, so every item can be reached */
  max-height: calc(100vh - 126px - 16px); max-height: calc(100dvh - 126px - 16px);
  overflow-y: auto; overscroll-behavior: contain;
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity .2s ease, transform .22s cubic-bezier(.2, .7, .2, 1), visibility .2s;
}
.ef-mega-full > .ef-mega { left: 0; right: 0; }
.ef-cat-nav .ef-menu > li:hover > .ef-mega,
.ef-cat-nav .ef-menu > li:focus-within > .ef-mega { opacity: 1; visibility: visible; transform: translateY(0); }

/* Display / Storage Cabinets: 4 columns of compact tiles */
.ef-mega-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px 14px; }
.ef-cat-nav .ef-mega-tile {
  position: relative;
  display: flex; align-items: center; gap: 14px;
  min-height: 74px; padding: 8px 38px 8px 8px; line-height: 1.3;
  text-decoration: none; color: var(--ef-text);
  border-radius: 12px;
  transition: background .18s ease;
}
.ef-cat-nav .ef-mega-tile-img {
  flex: 0 0 58px; width: 58px; height: 58px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 10px; background: var(--ef-mega-tint);
  transition: background .18s ease, transform .2s ease;
}
.ef-cat-nav .ef-mega-tile-img img { max-width: 46px; max-height: 50px; width: auto; height: auto; object-fit: contain; mix-blend-mode: multiply; }
.ef-cat-nav .ef-mega-tile-name {
  font-family: var(--ef-font-head); font-size: .84rem; line-height: 1.3;
  letter-spacing: .02em; text-transform: uppercase; color: var(--ef-text);
  transition: color .18s ease;
}
.ef-cat-nav .ef-mega-tile::after {
  content: ""; position: absolute; right: 12px; top: 50%;
  width: 16px; height: 16px; margin-top: -8px;
  background: var(--ef-brand);
  -webkit-mask: var(--ef-mega-arrow) center / contain no-repeat; mask: var(--ef-mega-arrow) center / contain no-repeat;
  opacity: 0; transform: translateX(-6px);
  transition: opacity .18s ease, transform .18s ease;
}
.ef-cat-nav .ef-mega-tile:hover,
.ef-cat-nav .ef-mega-tile:focus-visible { background: var(--ef-mega-tint); color: var(--ef-text); }
.ef-cat-nav .ef-mega-tile:hover .ef-mega-tile-img { background: #fff; transform: scale(1.04); }
.ef-cat-nav .ef-mega-tile:hover .ef-mega-tile-name { color: var(--ef-brand); }
.ef-cat-nav .ef-mega-tile:hover::after,
.ef-cat-nav .ef-mega-tile:focus-visible::after { opacity: 1; transform: none; }
@media (max-width: 1200px) { .ef-mega-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.admin-bar .ef-mega { max-height: calc(100vh - 158px - 16px); max-height: calc(100dvh - 158px - 16px); }

/* Display / Storage Cabinets (.ef-mega-grid): large tiles — the image as big as
   the column allows on top, the range name under it on up to 3 lines (the space
   for 3 lines is kept on every tile, so the names line up row by row). The font
   size is the largest at which the longest name ("Standard Upright Stainless Steel
   Gastronorm Chiller & Fish/Meat Cabinet") still fits in 3 lines at 5 and 6 columns. */
.ef-cat-nav .ef-mega-grid .ef-mega-tile {
  flex-direction: column; align-items: stretch; gap: 10px;
  min-height: 0; padding: 10px 6px 12px;
}
.ef-cat-nav .ef-mega-grid .ef-mega-tile-img {
  flex: 0 0 auto; width: 100%; height: 140px; padding: 10px; box-sizing: border-box;
}
.ef-cat-nav .ef-mega-grid .ef-mega-tile-img img { max-width: 100%; max-height: 100%; }
.ef-cat-nav .ef-mega-grid .ef-mega-tile-name {
  font-size: .88rem; line-height: 1.3; letter-spacing: .01em; text-align: center;
  min-height: calc(3 * 1.3em);
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden;
}
/* the hover arrow sits in the image's top-right corner */
.ef-cat-nav .ef-mega-grid .ef-mega-tile::after { top: 18px; right: 18px; margin-top: 0; }

/* —— grouped COMPACT mega (Commercial Fridges / Freezers) — opens to the right of its menu item —— */
.ef-cat-nav .ef-menu > li.ef-mega-compact { position: relative; }
.ef-mega-compact > .ef-mega { left: 0; width: max-content; min-width: 560px; max-width: min(1040px, 96vw); padding: 22px 22px 20px; border-radius: 0 0 18px 18px; }
.ef-mega-groups { display: flex; flex-wrap: wrap; gap: 28px; align-items: flex-start; }
.ef-mega-col { display: flex; flex-direction: column; min-width: 250px; }
/* tier-2 header: brand green, a short accent line under it */
.ef-cat-nav .ef-mega-head {
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px;
  padding: 0 12px 12px; margin-bottom: 6px; text-decoration: none;
}
.ef-cat-nav .ef-mega-head::after { content: ""; width: 28px; height: 3px; border-radius: 3px; background: var(--ef-brand); transition: width .2s ease; }
.ef-cat-nav .ef-mega-head:hover::after { width: 48px; }
.ef-cat-nav .ef-mega-head-img { display: none; } /* tier-2 icon removed */
.ef-cat-nav .ef-mega-head-txt {
  font-family: var(--ef-font-head); text-transform: uppercase; letter-spacing: .03em;
  font-size: 1.02rem; color: var(--ef-brand);
}
/* tier-3: text links; tier-4: sub-links on a thin guide line */
.ef-cat-nav .ef-mega-col-items { display: flex; flex-direction: column; gap: 2px; }
.ef-cat-nav .ef-mega-compact .ef-mega-tile { min-height: 0; padding: 8px 34px 8px 12px; border-radius: 9px; gap: 0; }
.ef-cat-nav .ef-mega-compact .ef-mega-tile::after { right: 10px; width: 14px; height: 14px; margin-top: -7px; }
.ef-cat-nav .ef-mega-compact .ef-mega-tile-name { font-family: var(--ef-font-body); font-size: .9rem; font-weight: 500; letter-spacing: 0; text-transform: none; }
.ef-cat-nav .ef-mega-compact .ef-mega-tile-img { display: none; } /* tier-3 icons removed (Commercial) */
.ef-cat-nav .ef-mega-subitems { display: flex; flex-direction: column; margin: 0 0 6px 20px; padding-left: 10px; border-left: 2px solid var(--ef-mega-line); }
.ef-cat-nav .ef-mega-subitem {
  font-family: var(--ef-font-body); font-size: .82rem; color: #5b6660 !important;
  padding: 4px 8px; border-radius: 6px; text-decoration: none; white-space: nowrap; text-transform: none; letter-spacing: 0;
  transition: color .15s ease, background .15s ease;
}
.ef-cat-nav .ef-mega-subitem:hover { color: var(--ef-brand) !important; background: var(--ef-mega-tint); }
@media (prefers-reduced-motion: reduce) {
  .ef-mega, .ef-cat-nav .ef-mega-tile, .ef-cat-nav .ef-mega-tile::after, .ef-cat-nav .ef-mega-tile-img { transition: none; }
}

/* header search */
.ef-header-search { width: 250px; max-width: 38vw; }
.ef-header-search .dgwt-wcas-search-wrapp { max-width: 100%; margin: 0; }

/* NATIVE Astra cart + info (item count + total) — on the green bar (row 2) = WHITE */
.ef-header-cart { display: inline-flex; align-items: center; gap: 8px; }
.ef-header-cart .ast-site-header-cart { line-height: 1; }
/* WHITE only on the cart TRIGGER (icon + counter), NOT on the flyout opened on hover */
.ef-header-cart .cart-container,
.ef-header-cart .cart-container i.astra-icon,
.ef-header-cart .ast-cart-menu-wrap .count,
.ef-header-cart .ast-cart-menu-wrap .count .ast-count-text { color: #fff !important; }
.ef-header-cart .ast-cart-menu-wrap .count { border-color: #fff !important; }
.ef-header-cart .ast-menu-cart-outline .cart-container,
.ef-header-cart .ast-menu-cart-with-border .cart-container { border-color: rgba(255,255,255,.6) !important; }

/* —— Mini-cart flyout (hover pop-up): readable text (black), on stable WooCommerce classes —— */
.ef-header-cart .widget_shopping_cart_content,
.ef-header-cart .woocommerce-mini-cart__total,
.ef-header-cart .woocommerce-mini-cart__total *,
.ef-header-cart .woocommerce-mini-cart-item .quantity,
.ef-header-cart .woocommerce-mini-cart-item .amount,
.ef-header-cart .woocommerce-mini-cart-item bdi,
.ef-header-cart .woocommerce-mini-cart-item > a:not(.remove) { color: var(--ef-text) !important; }

/* the remove (×) button: BLACK, clear, round with a border */
.ef-header-cart .woocommerce-mini-cart-item a.remove.remove_from_cart_button {
  color: #111 !important; opacity: 1 !important;
  width: 22px; height: 22px; border: 1px solid #111; border-radius: 50%;
  background: #fff; display: inline-flex; align-items: center; justify-content: center;
}
.ef-header-cart .woocommerce-mini-cart-item a.remove.remove_from_cart_button svg { width: 13px; height: 13px; fill: #111 !important; color: #111 !important; }
.ef-header-cart .woocommerce-mini-cart-item a.remove.remove_from_cart_button:hover { background: #111; color: #fff !important; }
.ef-header-cart .woocommerce-mini-cart-item a.remove.remove_from_cart_button:hover svg { fill: #fff !important; color: #fff !important; }

/* cart info: "N items / £Total" */
.ef-cart-info { display: inline-flex; flex-direction: column; line-height: 1.15; color: #fff; font-family: var(--ef-font-head); }
.ef-cart-count { font-size: .68rem; text-transform: uppercase; letter-spacing: .02em; opacity: .95; }
.ef-cart-total { font-size: .88rem; font-weight: 700; }
.ef-cart-total .amount, .ef-cart-total bdi { color: #fff !important; }

/* row 1 actions (cart + hamburger) — only on mobile/tablet, right */
.ef-row1-actions { display: none; align-items: center; gap: 12px; }
.ef-row1-cart-slot { display: inline-flex; align-items: center; }

/* hamburger (hidden on desktop) */
.ef-menu-toggle { display: none; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 44px; height: 40px; padding: 0; border: none; background: transparent; cursor: pointer; }
.ef-menu-toggle span { display: block; width: 24px; height: 3px; background: var(--ef-text); border-radius: 2px; transition: .2s; }

/* overlay flyout */
.ef-nav-overlay { display: none; }

/* —— mobile / tablet —— */
@media (max-width: 992px) {
  .ef-header-row1 .ef-header-inner { min-height: 66px; }
  .ef-row1-actions { display: flex; }

  /* hamburger top-right: black on white, with a border (both normal and pressed) */
  .ef-menu-toggle {
    display: flex;
    background: #fff !important;
    border: 1px solid #111;
    border-radius: 6px;
    width: 46px; height: 40px;
  }
  .ef-menu-toggle span,
  .ef-header.ef-nav-open .ef-menu-toggle span { background: #111; }
  .ef-menu-toggle:hover, .ef-menu-toggle:focus, .ef-menu-toggle:active,
  .ef-header.ef-nav-open .ef-menu-toggle { background: #fff !important; }

  /* cart moved to row 1 (white background) → only the TRIGGER dark; the flyout is styled separately */
  .ef-row1-cart-slot .cart-container,
  .ef-row1-cart-slot .cart-container i.astra-icon,
  .ef-row1-cart-slot .ast-cart-menu-wrap .count,
  .ef-row1-cart-slot .ast-cart-menu-wrap .count .ast-count-text { color: var(--ef-text) !important; }
  .ef-row1-cart-slot .ast-cart-menu-wrap .count { border-color: var(--ef-text) !important; background: var(--ef-brand); color: #fff !important; }
  .ef-row1-cart-slot .ast-menu-cart-outline .cart-container,
  .ef-row1-cart-slot .ast-menu-cart-with-border .cart-container { border-color: var(--ef-border) !important; }
  .ef-cart-info { display: none; } /* on mobile, only the cart icon */
  /* until the footer script moves the cart up into row 1, keep it out of the green
     bar: shown there first, it made the bar taller, then the page jumped up (CLS) */
  .ef-header-row2 .ef-header-cart { display: none; }

  /* row 1 menu = 70% FLYOUT from the right + overlay */
  .ef-row1-right {
    position: fixed; top: 0; right: 0; left: auto; height: 100vh; height: 100dvh;
    width: 70%; max-width: 380px;
    background: #fff; box-shadow: -10px 0 30px rgba(0,0,0,.2);
    transform: translateX(100%); transition: transform .28s ease;
    z-index: 1001; overflow-y: auto; padding: 76px 22px 28px;
    flex-direction: column; align-items: stretch; gap: 0; display: flex;
  }
  .ef-header.ef-nav-open .ef-row1-right { transform: translateX(0); }
  /* the search in the drawer opens full screen (ecofridge-blocks search.css);
     a transform would keep it inside the drawer */
  .ef-header.ef-nav-open .ef-row1-right:has(.efb-search.is-full) { transform: none; }
  .ef-nav-overlay {
    display: block; position: fixed; inset: 0; background: rgba(0,0,0,.45);
    opacity: 0; visibility: hidden; transition: opacity .28s ease, visibility .28s; z-index: 1000;
  }
  .ef-header.ef-nav-open .ef-nav-overlay { opacity: 1; visibility: visible; }

  .ef-primary-nav .ef-menu { flex-direction: column; }
  .ef-primary-nav .ef-menu a { padding: 12px 4px; border-bottom: 1px solid var(--ef-border); }
  .ef-menu .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; min-width: 0; max-width: none; padding-left: 12px; }
  .ef-menu .sub-menu .sub-menu { left: 0; padding-left: 20px; }
  .ef-header-search { width: 100%; max-width: 100%; margin-top: 10px; }
  .ef-header-row2 .ef-header-inner { overflow-x: auto; }
  .ef-cat-nav .ef-menu { flex-wrap: nowrap; }
  .ef-cat-nav .ef-menu > li > a { white-space: nowrap; }
  .ef-mega { display: none !important; } /* on mobile: the link goes to the category page */
  .ef-cat-nav .ef-menu > li.menu-item-has-children > a::after { display: none; } /* no dropdown there */
  .ef-menu > li.menu-item-has-children:hover > a::after { transform: translateY(-3px) rotate(45deg); } /* submenus are always open */
}

/* =========================================================================
   NATIVE Astra FOOTER — brand green like the commercial menu bar and the
   scroll-to-top button, white text
   (the content = HTML elements in the Footer Builder, editable from the Customizer)
   ========================================================================= */
/* main row (3 columns): brand green background, white text and links */
.site-primary-footer-wrap,
.site-primary-footer-wrap[data-section="section-primary-footer-builder"] {
  background-color: var(--ef-brand-deep); border-top-color: var(--ef-brand-deep);
}
.site-footer .ast-builder-html-element,
.site-footer .ast-builder-html-element p { color: rgba(255,255,255,.86); line-height: 1.7; }
/* column headings: uppercase, a short light-green accent bar under them */
.site-footer .ast-builder-html-element h3,
.site-footer .footer-widget-area .widget-title {
  font-family: var(--ef-font-head);
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #fff;
  font-size: 1rem;
  margin: 0 0 18px;
  /* inline-block: the accent bar follows the column's alignment */
  display: inline-block;
  padding-bottom: 10px;
  border: 0;
  background: linear-gradient(var(--ef-brand-light), var(--ef-brand-light)) left bottom / 28px 3px no-repeat;
}
.site-footer .ast-builder-html-element ul,
.site-footer .footer-widget-area ul { list-style: none; margin: 0; padding: 0; }
.site-footer .ast-builder-html-element li,
.site-footer .footer-widget-area li { margin: 0 0 6px; color: #fff; }
/* inline links (phone, email): white, a faint line under them that turns light green on hover */
.site-footer .ast-builder-html-element a,
.site-footer .footer-widget-area a {
  color: #fff; font-weight: 600; text-decoration: none;
  background: linear-gradient(rgba(255,255,255,.3), rgba(255,255,255,.3)) left bottom / 100% 1px no-repeat;
  padding-bottom: 1px; transition: color .2s ease, background .2s ease, transform .2s ease;
}
.site-footer .ast-builder-html-element a:hover,
.site-footer .ast-builder-html-element a:focus-visible,
.site-footer .footer-widget-area a:hover,
.site-footer .footer-widget-area a:focus-visible {
  color: #fff; text-decoration: none;
  background-image: linear-gradient(var(--ef-brand-light), var(--ef-brand-light));
}
/* link lists (Support / Contact Us, the Information menu): a small chevron,
   softer text, and on hover the link turns white and slides a little to the right */
.site-footer li > a {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 3px 0; background: none !important;
  color: rgba(255,255,255,.84) !important; font-weight: 500;
}
.site-footer li > a::before {
  content: ""; flex: 0 0 auto; width: 6px; height: 6px;
  border-top: 2px solid var(--ef-brand-light); border-right: 2px solid var(--ef-brand-light);
  transform: rotate(45deg); transition: transform .2s ease;
}
.site-footer li > a:hover,
.site-footer li > a:focus-visible { color: #fff !important; transform: translateX(4px); }
.site-footer li > a:hover::before,
.site-footer li > a:focus-visible::before { transform: translateX(2px) rotate(45deg); }
.site-footer .ast-builder-html-element p:has(+ .ef-footer-links) { margin-bottom: 10px; }
.site-footer .ef-footer-links { margin: 0 !important; }
/* image links (Facebook badge): no underline or hover fill over the image; on hover
   the badge lifts a little with a soft shadow and stays fully sharp */
.site-footer .ast-builder-html-element a:has(img),
.site-footer .ast-builder-html-element a:has(img):hover,
.site-footer .ast-builder-html-element a:has(img):focus-visible {
  display: inline-block; padding-bottom: 0; background: none; border-radius: 4px;
}
.site-footer .ast-builder-html-element a:has(img):focus-visible { outline: 2px solid var(--ef-brand-light); outline-offset: 3px; }
.site-footer .ast-builder-html-element a img {
  display: block; border-radius: 4px;
  transition: transform .2s ease, box-shadow .2s ease;
}
.site-footer .ast-builder-html-element a:hover img,
.site-footer .ast-builder-html-element a:focus-visible img {
  transform: translateY(-2px); box-shadow: 0 6px 14px rgba(0,0,0,.35);
}
@media (prefers-reduced-motion: reduce) {
  .site-footer .ast-builder-html-element a:hover img,
  .site-footer .ast-builder-html-element a:focus-visible img { transform: none; }
}
/* mobile/tablet (columns stacked): each column is its own block with room above
   its heading; centred accent bar; link lists become rounded
   "pill" buttons (easy to tap), wrapping and centred, without the chevron */
@media (max-width: 921px) {
  .site-primary-footer-wrap { padding-top: 12px !important; padding-bottom: 16px !important; }
  .site-primary-footer-wrap .site-footer-section { margin: 0 !important; padding: 26px 0; }
  .site-footer .ast-builder-html-element h3,
  .site-footer .footer-widget-area .widget-title { background-position: center bottom; margin-bottom: 16px; }
  .site-footer .ast-builder-html-element ul,
  .site-footer .footer-widget-area ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
  .site-footer li { margin: 0 !important; }
  .site-footer li > a {
    padding: 8px 16px; border: 1px solid rgba(255,255,255,.24); border-radius: 999px; font-size: .9rem;
    transition: background-color .2s ease, border-color .2s ease;
  }
  .site-footer li > a::before { display: none; }
  .site-footer li > a:hover,
  .site-footer li > a:focus-visible { transform: none; background-color: rgba(255,255,255,.1) !important; border-color: var(--ef-brand-light); }
}

/* bottom row (copyright): black, white text, light green links */
.site-below-footer-wrap { background: #000; color: #fff; }
.site-below-footer-wrap,
.site-below-footer-wrap p,
.site-below-footer-wrap .ast-footer-copyright { color: #fff; }
.site-below-footer-wrap p { margin: 0; }
/* links: light green, no underline; on hover they turn white and a thin
   light-green line grows under them (no bold → the text doesn't shift) */
.site-below-footer-wrap a {
  color: #a5d6a7; font-weight: 600; text-decoration: none;
  background: linear-gradient(var(--ef-brand-light), var(--ef-brand-light)) left bottom / 0 1px no-repeat;
  padding-bottom: 1px; transition: color .2s ease, background-size .25s ease;
}
.site-below-footer-wrap a:hover,
.site-below-footer-wrap a:focus-visible { color: #fff; background-size: 100% 1px; text-decoration: none; }
.ef-footer-credit { font-size: .82rem; opacity: .9; margin-top: 4px !important; }
/* The scroll-to-top button is brand green too: a white ring keeps it visible over the footer. */
#ast-scroll-top { box-shadow: 0 0 0 2px var(--ef-brand-light), 0 4px 12px rgba(0,0,0,.18); background-color: var(--ef-brand-deep) !important; }
#ast-scroll-top:hover { background-color: var(--ef-brand-deep-hover) !important; }

/* =========================================================================
   FiboSearch SEARCH — rectangular with rounded corners, NO magnifier
   ========================================================================= */
/* completely hide the magnifier / submit button + icons */
.ef-header-search .dgwt-wcas-search-submit,
.ef-header-search .dgwt-wcas-search-icon,
.ef-header-search .dgwt-wcas-ico-magnifier,
.ef-header-search .dgwt-wcas-ico-magnifier-handler,
.ef-header-search .dgwt-wcas-voice-search { display: none !important; }
/* rectangular input with rounded corners (no space reserved for the magnifier) */
.ef-header-search input[type="search"],
.ef-header-search .dgwt-wcas-sf-wrapp input[type="search"] {
  border: 2px solid var(--ef-brand-light) !important; /* light green border */
  border-radius: 8px !important;                       /* rounded corners */
  padding-right: 14px !important;
}
.ef-header-search input[type="search"]:focus,
.ef-header-search .dgwt-wcas-sf-wrapp input[type="search"]:focus {
  border-color: var(--ef-brand) !important;
  outline: none;
}
.dgwt-wcas-suggestion-product .dgwt-wcas-st-title { font-family: var(--ef-font-body); }

/* =========================================================================
   INTERNAL PAGES CONTENT
   ========================================================================= */
.ef-page-content { line-height: 1.75; }
.ef-page-content h2, .ef-page-content h3 { margin-top: 1.4em; }
.ef-page-content img { max-width: 100%; height: auto; }
.ef-page-content table { width: 100%; border-collapse: collapse; margin: 1.2em 0; }
.ef-page-content table td, .ef-page-content table th { border: 1px solid var(--ef-border); padding: 8px 10px; }
.ef-video { position: relative; margin: 1.5em 0; }

/* Formular de contact WPForms — accente brand 1:1 */
.ef-contact-form { max-width: 720px; margin: 8px 0 0; }
.ef-contact-form .wpforms-field-label { font-family: var(--ef-font-head); font-weight: 600; color: var(--ef-text); }
.ef-contact-form .wpforms-submit,
div.wpforms-container .wpforms-submit {
  background: var(--ef-brand) !important;
  border-color: var(--ef-brand) !important;
  color: #fff !important;
  font-family: var(--ef-font-head);
  text-transform: uppercase;
  letter-spacing: .03em;
  border-radius: 3px;
  padding: 12px 30px;
}
.ef-contact-form .wpforms-submit:hover,
div.wpforms-container .wpforms-submit:hover {
  background: var(--ef-brand-dark) !important;
  border-color: var(--ef-brand-dark) !important;
}
.ef-contact-form input[type="text"],
.ef-contact-form input[type="email"],
.ef-contact-form textarea {
  border: 1px solid var(--ef-border);
  border-radius: 3px;
}

/* Contact */
.ef-contact-details {
  margin-top: 1.5em; padding: 24px; background: var(--ef-stripe);
  border: 1px solid var(--ef-border); border-radius: 4px;
}
.ef-contact-details h3 { margin-top: 0; }

/* Markets hub grid */
.ef-markets-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 1.5em 0; }
@media (max-width: 900px) { .ef-markets-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .ef-markets-grid { grid-template-columns: 1fr; } }
.ef-markets-grid a {
  display: flex; align-items: center; justify-content: center; text-align: center;
  min-height: 90px; padding: 16px; background: #fff; color: var(--ef-text);
  border: 1px solid var(--ef-border); border-radius: 4px;
  font-family: var(--ef-font-head); text-transform: uppercase; letter-spacing: .02em;
  transition: all .2s ease;
}
.ef-markets-grid a:hover { background: var(--ef-brand); color: #fff; border-color: var(--ef-brand); }

/* =========================================================================
   SUBCATEGORY GRID (Display / Storage) — tiles with icons
   ========================================================================= */
.ef-subcat-grid {
  display: grid;
  grid-template-columns: repeat(var(--ef-cols, 5), 1fr);
  gap: 18px;
  margin: 8px auto 0;
  max-width: 1200px;
}
@media (max-width: 1100px) { .ef-subcat-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 820px)  { .ef-subcat-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px)  { .ef-subcat-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; } }
.ef-subcat-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: #fff;               /* white, so the product (white background) blends in */
  border: 1px solid transparent;  /* no border at rest → natural look */
  border-radius: 10px;
  padding: 16px 10px 14px;
  text-decoration: none;
  color: #000;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.ef-subcat-tile:hover {
  border-color: var(--ef-brand-light); /* light green border, rounded corners */
  box-shadow: 0 6px 18px rgba(0,0,0,.06);
  color: #000;
}
.ef-subcat-img {
  display: flex; align-items: center; justify-content: center;
  height: 128px; width: 100%; margin-bottom: 12px;
}
.ef-subcat-img img { max-height: 128px; max-width: 100%; width: auto; object-fit: contain; }
.ef-subcat-name {
  font-family: var(--ef-font-head);
  font-size: .9rem;
  line-height: 1.32;
  font-weight: 500;
  color: #000;
}

/* =========================================================================
   CATEGORY CAROUSELS — after the short description, before the product grid:
   "Shop by category" (two type banners) and "Subcategories" (carousel).
   Large arrows sit over the edges of the track, so they take no width of
   their own; 3 large cards per view on desktop; every image shown whole.
   ========================================================================= */
.ef-cat-carousel-wrap { margin: 22px 0 34px; }
.ef-cat-carousel-wrap .ef-cat-carousel + .ef-cc-heading { margin-top: 30px; }
.ef-cc-heading {
  font-family: var(--ef-font-head);
  text-transform: uppercase;
  letter-spacing: .03em;
  font-size: 1.15rem;
  color: var(--ef-text);
  margin: 0 0 14px;
}

.ef-cat-carousel { position: relative; }
.ef-cc-track {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: 12px 4px 30px;   /* room for the lifted card and its shadow */
  /* Snap point = the 4px padding, so the track is already at rest when the page
     loads. Without it the browser snapped the track by 4px on load; Chrome counts
     that as a scroll and stops measuring LCP (PageSpeed NO_LCP on the home page). */
  scroll-padding-inline: 4px;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.ef-cc-track::-webkit-scrollbar { display: none; }
.ef-cc-card {
  flex: 0 0 calc((100% - 40px) / 3);   /* 3 large cards on desktop */
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  background: #fff;
  border: 1px solid var(--ef-brand-light);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: var(--ef-card-shadow);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.ef-cc-card:hover,
.ef-cc-card:focus-visible {
  transform: translateY(-8px);
  box-shadow: var(--ef-card-shadow-hover);
  border-color: var(--ef-brand);
}
/* Fixed box, image fitted whole inside it (never cropped). */
.ef-cc-img {
  display: flex; align-items: center; justify-content: center;
  height: 240px; min-height: 0; background: #fff; padding: 16px;
}
.ef-cc-img img {
  width: 100%; height: 100%;
  max-width: 100%; max-height: 100%;
  object-fit: contain;
  margin: 0;
}
.ef-cc-name {
  display: block; text-align: center;
  font-family: var(--ef-font-head); font-size: 1.02rem; line-height: 1.3;
  color: var(--ef-text);
  padding: 14px 12px 18px;
  border-top: 1px solid var(--ef-divider);
  background: #fafafa;
  margin-top: auto;
  transition: color .18s ease;
}
.ef-cc-card:hover .ef-cc-name { color: var(--ef-brand); }

/* Large round arrows over the track's edges (half outside), no reserved gutter. */
.ef-cc-arrow {
  position: absolute; top: calc(50% - 7px); transform: translateY(-50%);
  width: 54px; height: 54px; border-radius: 50%;
  border: 1px solid var(--ef-border); background: rgba(255,255,255,.96); color: var(--ef-text);
  font-size: 2.4rem; line-height: 1; cursor: pointer; z-index: 3;
  box-shadow: 0 6px 18px rgba(0,0,0,.16);
  display: flex; align-items: center; justify-content: center;
  padding: 0 0 4px;
  transition: background .18s ease, color .18s ease, border-color .18s ease, opacity .18s ease;
}
.ef-cc-arrow:hover { background: var(--ef-brand); color: #fff; border-color: var(--ef-brand); }
.ef-cc-arrow:disabled { opacity: 0; pointer-events: none; }
.ef-cc-prev { left: -20px; } .ef-cc-next { right: -20px; }
.ef-cat-carousel.is-static .ef-cc-arrow { display: none; }

@media (max-width: 900px) {
  .ef-cc-card { flex-basis: calc((100% - 20px) / 2); }
  .ef-cc-img { height: 210px; }
  .ef-cc-prev { left: -8px; } .ef-cc-next { right: -8px; }
}
@media (max-width: 520px) {
  .ef-cc-track { gap: 14px; }
  .ef-cc-card { flex-basis: 78%; }       /* one large card + a peek of the next */
  .ef-cc-img { height: 220px; }
  .ef-cc-name { font-size: .95rem; }
  .ef-cc-arrow { width: 46px; height: 46px; font-size: 2rem; }
  .ef-cc-prev { left: 4px; } .ef-cc-next { right: 4px; }
}

/* Two-column variant (the two type banners): 2 cards on desktop and tablet,
   1 on mobile. These are wide line-up banners (~2.5:1 to 3.2:1) whose products
   run to both edges, so the box matches the widest banner and the image is fitted
   whole — the banners sit on white like the card, so the fit leaves no visible bars. */
.ef-cat-carousel--2col .ef-cc-card { flex: 0 0 calc((100% - 20px) / 2); }
.ef-cat-carousel--2col .ef-cc-img {
  height: auto;
  aspect-ratio: 3 / 1;
  padding: 0;
  overflow: hidden;
}
/* /shop banners (Commercial Fridge / Freezer): their overview images are ~2:1. */
.ef-cat-carousel--2col.ef-cat-carousel--wide .ef-cc-img { aspect-ratio: 2 / 1; }
@media (max-width: 640px) {
  .ef-cat-carousel--2col .ef-cc-card { flex-basis: 100%; }
}

/* =========================================================================
   PRODUCT GRIDS — cards with a light green outline that lift with a strong
   "3D" shadow on hover (same as the category carousels), quantity − / +
   ========================================================================= */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  min-width: 0;   /* grid item: never widen its column (the quantity input's intrinsic width) */
  border: 1px solid var(--ef-brand-light);
  border-radius: 12px;
  padding: 14px 14px 18px !important;
  background: #fff;
  box-shadow: var(--ef-card-shadow);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover,
.woocommerce ul.products li.product:focus-within {
  transform: translateY(-8px);
  box-shadow: var(--ef-card-shadow-hover);
  border-color: var(--ef-brand);
  z-index: 2;
}
@media (prefers-reduced-motion: reduce) {
  .ef-cc-card, .woocommerce ul.products li.product { transition: none; }
  .ef-cc-card:hover, .woocommerce ul.products li.product:hover { transform: none; }
}

/* Equal-height cards: the quantity + Add to cart row sits at the bottom of each card. */
.woocommerce ul.products li.product { display: flex; flex-direction: column; }
.woocommerce ul.products li.product .astra-shop-summary-wrap { display: flex; flex-direction: column; flex: 1 1 auto; }
.ef-loop-buy { display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; margin-top: auto; padding-top: 10px; }
.ef-loop-buy .button { margin: 0 !important; flex: 1 1 100%; display: inline-flex !important; align-items: center; justify-content: center; text-align: center; }
.ef-loop-buy .added_to_cart { flex: 0 0 100%; text-align: center; }
.ef-qty { display: flex; flex: 1 1 100%; min-width: 0; border: 1px solid var(--ef-brand-light); border-radius: 4px; overflow: hidden; background: #fff; }
.ef-qty__btn {
  flex: 0 0 36px; width: 36px; min-height: 38px; padding: 0 !important; margin: 0; border: 0 !important; border-radius: 0 !important;
  background: #eef6ee !important; color: var(--ef-brand) !important;
  font-size: 18px; font-weight: 700; line-height: 1; cursor: pointer; box-shadow: none !important;
}
.ef-qty__btn:hover { background: var(--ef-brand) !important; color: #fff !important; }
.ef-qty__btn:focus-visible, .ef-qty__input:focus-visible { outline: 2px solid var(--ef-brand); outline-offset: -2px; }
.ef-qty__input {
  flex: 1 1 auto; width: auto !important; min-width: 0; max-width: none; min-height: 38px; padding: 0 !important; margin: 0; border: 0 !important; box-shadow: none !important;
  text-align: center; font-weight: 600; -moz-appearance: textfield; appearance: textfield; background: #fff;
}
.ef-qty__input::-webkit-outer-spin-button, .ef-qty__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* =========================================================================
   PRODUCT GRIDS — every product image shown whole inside a square box
   (WooCommerce thumbnails are uncropped, see migration/33).
   ========================================================================= */
.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background: #fff;
}

/* =========================================================================
   HERO SLIDER homepage (4 slide-uri, crossfade)
   ========================================================================= */
.ef-hero {
  position: relative;
  width: 100%;
  min-height: 480px;
  background: #ffffff;                          /* white — the products (white background) blend in */
  border-bottom: 1px solid var(--ef-border);
  overflow: hidden;
}
.ef-hero-track { position: relative; width: 100%; min-height: 480px; }
.ef-hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .7s ease;
  pointer-events: none;
}
.ef-hero-slide.is-active { opacity: 1; visibility: visible; pointer-events: auto; }
.ef-hero-inner {
  max-width: 1200px;
  margin: 0 auto;
  min-height: 480px;
  display: flex;
  align-items: center;
  gap: 40px;
  padding: 40px 40px;
}
.ef-hero-text { flex: 1 1 52%; max-width: 560px; }
.ef-hero-eyebrow {
  display: inline-block;
  font-family: var(--ef-font-head);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: .8rem;
  font-weight: 600;
  color: var(--ef-brand);
  margin-bottom: 12px;
}
.ef-hero-title {
  font-family: var(--ef-font-head);
  font-size: 2.5rem;
  line-height: 1.12;
  font-weight: 600;
  color: #2b2f36;
  margin: 0 0 16px;
}
.ef-hero-desc { font-size: 1.05rem; line-height: 1.6; color: #4a4f57; margin: 0 0 26px; }
.ef-hero-btn {
  display: inline-block;
  background: var(--ef-brand);
  color: #fff !important;
  font-family: var(--ef-font-head);
  text-transform: uppercase;
  letter-spacing: .03em;
  font-size: .95rem;
  padding: 13px 28px;
  border-radius: 3px;
  text-decoration: none;
  transition: background .2s ease;
}
.ef-hero-btn:hover { background: var(--ef-brand-dark); color: #fff !important; }
.ef-hero-media { flex: 1 1 48%; display: flex; align-items: center; justify-content: center; }
.ef-hero-media img { max-height: 400px; width: auto; max-width: 100%; filter: drop-shadow(0 18px 30px rgba(0,0,0,.18)); }

/* controale */
.ef-hero-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px; height: 44px;
  border: none;
  background: rgba(255,255,255,.75);
  color: #2b2f36;
  font-size: 1.8rem;
  line-height: 1;
  border-radius: 50%;
  cursor: pointer;
  z-index: 3;
  transition: background .2s ease;
}
.ef-hero-nav:hover { background: #fff; color: var(--ef-brand); }
.ef-hero-prev { left: 16px; } .ef-hero-next { right: 16px; }
.ef-hero-dots {
  position: absolute;
  bottom: 18px; left: 0; right: 0;
  display: flex; justify-content: center; gap: 10px;
  z-index: 3;
}
.ef-hero-dot {
  width: 11px; height: 11px;
  border-radius: 50%;
  border: 2px solid var(--ef-brand);
  background: transparent;
  padding: 0; cursor: pointer;
  transition: background .2s ease;
}
.ef-hero-dot.is-active { background: var(--ef-brand); }

@media (max-width: 880px) {
  .ef-hero, .ef-hero-track { min-height: 0; }
  .ef-hero-inner { flex-direction: column-reverse; text-align: center; min-height: 0; padding: 34px 22px 56px; gap: 22px; }
  .ef-hero-text { max-width: 100%; }
  .ef-hero-title { font-size: 1.85rem; }
  .ef-hero-media img { max-height: 250px; }
  /* when stacked, inactive slides can't be absolute (variable height) */
  .ef-hero-slide { position: relative; }
  .ef-hero-slide:not(.is-active) { display: none; }
  .ef-hero-nav { width: 38px; height: 38px; font-size: 1.5rem; }
}

/* =========================================================================
   CLIENTS — "Some of Our Clients" strip on the homepage
   ========================================================================= */
.ef-clients-intro {
  max-width: 820px;
  margin: 0 auto 28px;
  text-align: center;
  color: var(--ef-text);
}
.ef-clients-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  align-items: center;
  gap: 26px 34px;
  max-width: 1100px;
  margin: 0 auto;
}
@media (max-width: 900px) { .ef-clients-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 560px) { .ef-clients-grid { grid-template-columns: repeat(3, 1fr); gap: 20px; } }
.ef-client-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 70px;
}
.ef-client-logo img {
  max-width: 100%;
  max-height: 66px;
  width: auto;
  height: auto;
  filter: grayscale(100%);
  opacity: .72;
  transition: filter .25s ease, opacity .25s ease;
}
.ef-client-logo img:hover {
  filter: grayscale(0);
  opacity: 1;
}

/* =========================================================================
   SINGLE PRODUCT PAGE
   ========================================================================= */
.ef-price { font-family: var(--ef-font-head); }
.ef-price .ef-vat { font-size: .6em; color: var(--ef-meta); text-transform: uppercase; letter-spacing: .04em; }
.ef-price--poa { color: var(--ef-brand); font-weight: 700; }

.ef-back-link { max-width: 1200px; margin: 0 auto 10px; padding: 8px 0; }
.ef-back-link a {
  font-family: var(--ef-font-head); text-transform: uppercase; letter-spacing: .02em;
  font-size: .85rem; color: #111; text-decoration: none; transition: color .15s ease;
}
.ef-back-link a:hover { color: var(--ef-brand); }

.ef-product-notes {
  clear: both; margin: 24px 0; padding: 20px 24px;
  background: var(--ef-stripe); border: 1px solid var(--ef-border); border-radius: 4px;
}
.ef-product-notes ul { list-style: none; margin: 0 0 10px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 28px; }
.ef-product-notes li { position: relative; padding-left: 22px; }
.ef-product-notes li::before { content: "\2713"; position: absolute; left: 0; color: var(--ef-brand); font-weight: 700; }
.ef-tc-note { font-size: .82rem; color: var(--ef-meta); margin: 0; }

/* Delivery/payment lines + trade notes + T&C (the block at the bottom of the product page) */
.ef-delivery-lines { list-style: none; margin: 8px 0 12px; padding: 0; }
.ef-delivery-lines li { position: relative; padding-left: 18px; font-size: .88rem; color: var(--ef-meta); margin: 4px 0; }
.ef-delivery-lines li::before { content: "\2013"; position: absolute; left: 0; color: var(--ef-brand); font-weight: 700; }
.ef-trade-notes { margin: 16px 0 0; border-top: 1px solid var(--ef-border); padding-top: 14px; }
.ef-trade-notes p { font-size: .86rem; color: var(--ef-text); margin: 0 0 8px; line-height: 1.5; }
.ef-terms { margin: 16px 0 0; border-top: 1px solid var(--ef-border); padding-top: 14px; }
.ef-terms h3 { font-size: 1rem; margin: 0 0 8px; text-transform: uppercase; letter-spacing: .02em; }
.ef-terms p { font-size: .78rem; color: var(--ef-meta); line-height: 1.55; margin: 0; text-align: justify; }
.ef-recently-viewed { clear: both; margin: 32px 0 0; }
.ef-recently-viewed > h2 { margin: 0 0 16px; }

/* Add-ons */
.ef-addons { margin: 14px 0 18px; }
.ef-addon {
  display: flex; align-items: flex-start; gap: 10px; cursor: pointer;
  padding: 12px 14px; border: 1px solid var(--ef-brand-light); border-radius: 4px;
  margin-bottom: 8px; background: #fff; line-height: 1.4;
}
.ef-addon input { margin-top: 3px; }
.ef-addon em { color: var(--ef-brand); font-style: normal; font-weight: 700; }

/* Product page: all options in ONE light-green frame, rows divided by fine
   lines; the warranty options inside have no frames of their own. */
form.cart .ef-addons {
  border: 1px solid var(--ef-brand-light); border-radius: 8px; overflow: hidden; background: #fff;
}
form.cart .ef-addons > .ef-addon,
form.cart .ef-addons > .ef-addon-group {
  margin: 0; border: 0; border-radius: 0; box-shadow: none; border-bottom: 1px solid #e3efe3;
}
form.cart .ef-addons > :last-child { border-bottom: 0; }
form.cart .ef-addons > .ef-addon:hover,
form.cart .ef-addons > .ef-addon-group > summary:hover { background: #f6fbf6; }
form.cart .ef-addons > .ef-addon-group[open] { border-color: #e3efe3; box-shadow: none; }
form.cart .ef-addon-group__body { gap: 2px; padding: 0 14px 10px 36px; }
form.cart .ef-addon-group__body .ef-addon--radio {
  border: 0; border-radius: 6px; padding: 8px 10px; background: transparent; align-items: center;
}
form.cart .ef-addon-group__body .ef-addon--radio:hover { background: #f6fbf6; }
form.cart .ef-addon-group__body .ef-addon--radio:has(input:checked) { background: #ebf6eb; }
form.cart .ef-addon-group__body .ef-addon--radio input { margin-top: 0; }

/* Warranty: a collapsed panel (arrow down → up) with two exclusive options */
.ef-addon-group {
  border: 1px solid var(--ef-brand-light); border-radius: 4px; background: #fff;
  margin-bottom: 8px; transition: border-color .2s ease, box-shadow .2s ease;
}
.ef-addon-group[open] { border-color: var(--ef-brand); box-shadow: 0 6px 18px -10px rgba(0,0,0,.25); }
.ef-addon-group > summary {
  display: flex; align-items: center; gap: 10px; padding: 12px 14px;
  cursor: pointer; list-style: none; user-select: none; line-height: 1.4;
}
.ef-addon-group > summary::-webkit-details-marker { display: none; }
.ef-addon-group > summary:focus-visible { outline: 2px solid var(--ef-brand); outline-offset: 2px; }
.ef-addon-group__title { font-weight: 700; }
.ef-addon-group__value {
  margin-left: auto; font-size: .82rem; color: var(--ef-meta);
  background: var(--ef-stripe); border-radius: 999px; padding: 2px 10px;
}
.ef-addon-group.is-added .ef-addon-group__value { color: #fff; background: var(--ef-brand); }
.ef-addon-group__chevron { flex: 0 0 auto; margin-left: -2px; color: var(--ef-brand); transition: transform .2s ease; }
.ef-addon-group[open] .ef-addon-group__chevron { transform: rotate(180deg); }
.ef-addon-group__body { padding: 0 14px 12px; display: grid; gap: 8px; }
.ef-addon-group .ef-addon { margin: 0; }
.ef-addon--radio { transition: border-color .15s ease, background-color .15s ease; }
.ef-addon--radio:has(input:checked) { border-color: var(--ef-brand); background: #f3faf3; }
.ef-addon--radio input { accent-color: var(--ef-brand); }
.ef-addon input[type="checkbox"] { accent-color: var(--ef-brand); }
.ef-addon:hover { border-color: var(--ef-brand); }

/* Product page quantity (Astra's − / + links): same look as the grid's .ef-qty */
.single-product form.cart .quantity {
  display: inline-flex; align-items: stretch; width: auto; border: 1px solid var(--ef-brand-light);
  border-radius: 4px; overflow: hidden; background: #fff;
}
.single-product form.cart .quantity .minus,
.single-product form.cart .quantity .plus {
  display: flex; align-items: center; justify-content: center; flex: 0 0 36px; width: 36px; min-height: 38px;
  padding: 0 !important; margin: 0; border: 0 !important; border-radius: 0 !important;
  background: #eef6ee !important; color: var(--ef-brand) !important;
  font-size: 18px; font-weight: 700; line-height: 1; text-decoration: none; box-shadow: none !important;
}
.single-product form.cart .quantity .minus:hover,
.single-product form.cart .quantity .plus:hover { background: var(--ef-brand) !important; color: #fff !important; }
.single-product form.cart .quantity .qty {
  flex: 1 1 auto; width: auto !important; min-width: 0; min-height: 38px; padding: 0 !important; margin: 0;
  border: 0 !important; box-shadow: none !important; text-align: center; font-weight: 600;
  -moz-appearance: textfield; appearance: textfield; background: #fff;
}
.single-product form.cart .quantity .screen-reader-text { position: absolute !important; }
.single-product form.cart .quantity .qty { flex: 0 0 64px; width: 64px !important; max-width: 64px; }
.single-product form.cart .single_add_to_cart_button {
  min-height: 40px; display: inline-flex; align-items: center; justify-content: center;
}
.single-product form.cart .quantity .qty::-webkit-outer-spin-button,
.single-product form.cart .quantity .qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* =========================================================================
   CART PAGE (/cart) — classic layout: items on the left, totals on the right
   ========================================================================= */
/* Astra's modern cart layout already builds the two columns natively:
   #ast-cart-wrapper is a flex row holding .ast-cart-non-sticky (the items form,
   68%) and .cart-collaterals (the totals, 30%). Do NOT float these — the form
   sits INSIDE .ast-cart-non-sticky, so floating it sizes it against the wrong
   parent, and any pair of widths summing over 100% makes flex-wrap drop the
   totals below the items. Widening the items column = widen .ast-cart-non-sticky
   and keep the two widths under 100%. */

/* cross-sells are removed server-side (see inc/woo-single.php §4g); this is a
   safety net in case a plugin renders the block again */
.woocommerce-cart .cross-sells { display: none !important; }
/* the "Cart totals" panel — light framing so it reads as a distinct column */
.woocommerce-cart .cart_totals > h2 { font-size: 1.15rem; }
.woocommerce-cart .cart_totals table { background: var(--ef-stripe); }

/* per-item add-on checkboxes under each cart product name */
.ef-cart-item-addons { margin: 8px 0 0; display: flex; flex-direction: column; gap: 4px; }
.ef-cart-item-addons .ef-addon {
  padding: 4px 0; border: 0; border-radius: 0; margin: 0; background: transparent;
  font-size: .82rem; align-items: center; line-height: 1.3;
}
.ef-cart-item-addons .ef-addon input { margin: 0; }
.ef-cart-item-addons .ef-addon em { font-size: .95em; }

/* =========================================================================
   CART & CHECKOUT — modern cards with green accents (cart = classic template,
   checkout = WooCommerce Checkout block), clear delivery wording
   ========================================================================= */
/* Cart table as a card */
.woocommerce-cart .woocommerce-cart-form .shop_table {
  border: 1px solid #dfe8df !important; border-radius: 20px !important; overflow: hidden;
  border-collapse: separate; background: #fff; box-shadow: 0 10px 30px -12px rgba(16,60,30,.18);
}
.woocommerce-cart .woocommerce-cart-form .shop_table thead th {
  background: #eef6ee; font-family: var(--ef-font-head); font-weight: 500;
  text-transform: uppercase; letter-spacing: .03em; font-size: .85rem; color: var(--ef-text);
}
.woocommerce-cart .woocommerce-cart-form .shop_table td { vertical-align: middle; }
.woocommerce-cart .woocommerce-cart-form .product-name > a { color: var(--ef-text); font-weight: 600; text-decoration: none; }
.woocommerce-cart .woocommerce-cart-form .product-name > a:hover { color: var(--ef-brand); }
.woocommerce-cart .woocommerce-cart-form .product-thumbnail img { width: 84px; height: 84px; object-fit: contain; background: #fff; }
.woocommerce-cart .woocommerce-cart-form .product-subtotal { font-weight: 700; color: var(--ef-text); }
.woocommerce-cart .woocommerce-cart-form a.remove { color: #9aa3a0 !important; border: 1px solid #d9dfdc; }
.woocommerce-cart .woocommerce-cart-form a.remove:hover { color: #fff !important; background: #c62828 !important; border-color: #c62828; }
/* quantity − / + like the product grids */
.woocommerce-cart .quantity { display: inline-flex; align-items: stretch; border: 1px solid var(--ef-brand-light); border-radius: 4px; overflow: hidden; background: #fff; }
/* the hidden label sits between − and the input; out of the flow, or it adds a
   white strip after + (the product page does the same) */
.woocommerce-cart .quantity .screen-reader-text { position: absolute !important; }
.woocommerce-cart .quantity .minus,
.woocommerce-cart .quantity .plus { display: flex; align-items: center; justify-content: center; margin: 0 !important; background: #eef6ee !important; color: var(--ef-brand) !important; border: 0 !important; font-weight: 700; }
.woocommerce-cart .quantity .minus:hover,
.woocommerce-cart .quantity .plus:hover { background: var(--ef-brand) !important; color: #fff !important; }
.woocommerce-cart .quantity .qty { border: 0 !important; font-weight: 600; }
.ef-continue-shopping { margin: 16px 0 0; }
/* postcodes we do not deliver to (inc/cart-checkout.php): cart totals and checkout */
.ef-no-delivery td { padding-top: 0 !important; }
.ef-no-delivery__msg {
  margin: 8px 0 12px; padding: 10px 14px;
  border-left: 4px solid #d97706; border-radius: 6px;
  background: #fff7e6; color: #5c3d00;
  font-size: 14px; line-height: 1.5;
}
/* checkout: "Ship" shown as not available (still clickable, to change the address) */
.wc-block-checkout__shipping-method-option.ef-ship-unavailable { opacity: .55; background: #f6f6f6; }
.wc-block-checkout__shipping-method-option.ef-ship-unavailable .wc-block-checkout__shipping-method-option-price { display: none; }
.ef-ship-unavailable__note { display: block; width: 100%; margin-top: 4px; font-size: 12px; line-height: 1.3; color: #5c3d00; }
.ef-continue-shopping a { font-family: var(--ef-font-head); text-transform: uppercase; letter-spacing: .03em; color: var(--ef-brand); text-decoration: none; }
.ef-continue-shopping a:hover { text-decoration: underline; }

/* Cart totals as a rounded card: a plain title with a thin rule under it
   (across the whole card), no coloured bar */
.woocommerce-cart .cart-collaterals .cart_totals {
  border: 1px solid #dfe8df !important; border-radius: 20px; background: #fff;
  box-shadow: 0 10px 30px -12px rgba(16,60,30,.18); overflow: hidden;
  padding: 0 22px 22px !important;
}
.woocommerce-cart .cart_totals > h2 {
  font-family: var(--ef-font-head); font-weight: 500; text-transform: uppercase; letter-spacing: .04em;
  font-size: 1.1rem !important; color: var(--ef-text) !important; background: none !important;
  margin: 0 -22px 6px !important; padding: 20px 22px 16px !important;
  border: 0 !important; border-bottom: 1px solid #e6ede6 !important;
}
.woocommerce-cart .cart_totals table { background: #fff; border: 0 !important; }
.woocommerce-cart .cart_totals table th,
.woocommerce-cart .cart_totals table td { border-left: 0 !important; border-right: 0 !important; }
.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td { font-size: 1.15rem; color: var(--ef-text); border-top: 2px solid var(--ef-brand-light); }
.ef-free-delivery { color: var(--ef-brand); font-weight: 700; }
.woocommerce-cart .cart_totals small { color: #6b7280; line-height: 1.4; }
.woocommerce-cart .wc-proceed-to-checkout .checkout-button {
  border-radius: 8px; font-size: 1.05rem !important; letter-spacing: .04em;
  box-shadow: 0 8px 18px -6px rgba(34,139,34,.55); transition: transform .2s ease, box-shadow .2s ease;
}
.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover { transform: translateY(-2px); box-shadow: 0 14px 24px -8px rgba(34,139,34,.6); }
.woocommerce-cart .wc-proceed-to-checkout .checkout-button::after { content: " \2192"; }

/* Checkout block */
.wc-block-checkout { --ef-ring: 0 0 0 2px rgba(34,139,34,.25); }
.wc-block-checkout .wc-block-components-title,
.wc-block-checkout .wc-block-components-checkout-step__title {
  font-family: var(--ef-font-head) !important; font-weight: 500 !important; letter-spacing: .02em;
}
.wc-block-checkout .wc-block-components-checkout-step__title::before {
  content: ""; display: inline-block; width: 4px; height: 1em; margin-right: 10px; vertical-align: -2px;
  background: var(--ef-brand); border-radius: 2px;
}
.wc-block-checkout .wc-block-components-text-input input:focus,
.wc-block-checkout .wc-block-components-combobox .components-combobox-control input:focus,
.wc-block-checkout .wc-blocks-components-select .wc-blocks-components-select__select:focus,
.wc-block-checkout .wc-block-components-textarea:focus {
  border-color: var(--ef-brand) !important; box-shadow: var(--ef-ring) !important; outline: 0;
}
.wc-block-checkout .wc-block-components-radio-control__input:checked { border-color: var(--ef-brand) !important; }
.wc-block-checkout .wc-block-components-radio-control__input:checked::before { background: var(--ef-brand) !important; }
.wc-block-checkout .wc-block-components-checkbox__input:checked { background: var(--ef-brand) !important; border-color: var(--ef-brand) !important; }
/* text fields: roomier, soft 1px border, the floating label clear of the edge
   (Astra pins the active label at top: -2px, against the border) */
.wc-block-checkout .wc-block-components-text-input input,
.wc-block-checkout .wc-block-components-combobox .components-combobox-control input,
.wc-block-checkout .wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-checkout .wc-block-components-textarea {
  border: 1px solid #cfdacf !important; border-radius: 10px !important;
}
.wc-block-checkout .wc-block-components-text-input input {
  height: 56px !important; padding: 26px 14px 8px !important;
}
.wc-block-checkout .wc-block-components-text-input label { left: 15px !important; }
.wc-block-checkout .wc-block-components-text-input.is-active label { top: 7px !important; }
/* shipping address, delivery and payment boxes look like the email field:
   white, the same soft 1px border and 10px corners (the green radio dot alone
   marks the chosen option) */
.wc-block-checkout .wc-block-components-address-card,
.wc-block-checkout .wc-block-components-radio-control__option,
.wc-block-checkout .wc-block-components-radio-control-accordion-option {
  background: #fff !important; border: 1px solid #cfdacf !important; border-radius: 10px !important;
  box-shadow: none !important;
}
.wc-block-checkout .wc-block-components-radio-control,
.wc-block-checkout .wc-block-components-radio-control--highlight-checked { border-radius: 10px; }
/* the group's own outline would draw a second line next to the option's */
.wc-block-checkout .wc-block-components-radio-control--highlight-checked::after,
.wc-block-checkout .wc-block-components-radio-control-accordion-option::after,
.wc-block-checkout .wc-block-components-radio-control__option::after { border: 0 !important; box-shadow: none !important; }
/* a payment method is an outer box holding the option row + its description:
   only the outer box is framed */
.wc-block-checkout .wc-block-components-radio-control-accordion-option .wc-block-components-radio-control__option {
  border: 0 !important; border-radius: 0 !important; background: transparent !important;
}
/* several options stacked: a small gap between them instead of shared lines */
.wc-block-checkout .wc-block-components-radio-control > * + * { margin-top: 8px; }
.wc-block-checkout .wc-block-components-checkout-place-order-button,
.wc-block-checkout .wc-block-components-button.contained {
  background: var(--ef-brand) !important; color: #fff !important; border-radius: 8px !important;
  font-family: var(--ef-font-head); text-transform: uppercase; letter-spacing: .04em; font-size: 1.05rem;
  box-shadow: 0 8px 18px -6px rgba(34,139,34,.55);
}
.wc-block-checkout .wc-block-components-checkout-place-order-button:hover { background: var(--ef-brand-dark) !important; }
.wc-block-checkout .wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block {
  border: 1px solid #dfe8df !important; border-radius: 20px; overflow: hidden; background: #fff;
  box-shadow: 0 10px 30px -12px rgba(16,60,30,.18);
}
.wc-block-checkout .wc-block-components-order-summary .wc-block-components-order-summary-item__quantity {
  background: var(--ef-brand); color: #fff; border-color: #fff;
}
.wc-block-checkout a { color: var(--ef-brand); }
/* the order summary lists name, price and quantity only: the product's short
   description (finance badge, "Click Here For Energy Specification") is for
   the product page */
.wc-block-checkout .wc-block-components-order-summary-item .wc-block-components-product-metadata__description { display: none; }

/* =========================================================================
   HOMEPAGE — rhythm/spacing + long-form SEO content (responsive)
   ========================================================================= */
/* images in wp:html / Spectra blocks never exceed the container */
.wp-block-uagb-container img,
.ast-container .wp-block-html img,
.ef-seo-content img { max-width: 100%; height: auto; }

/* on mobile we reduce the vertical padding of homepage sections (Spectra sets 55px) */
@media (max-width: 600px) {
  .wp-block-uagb-container.uagb-is-root-container { padding-top: 34px !important; padding-bottom: 34px !important; }
}

/* long-form SEO content: readable width + clean typography */
.ef-seo-content,
.ef-range-content {
  max-width: 1000px;
  margin: 0 auto;
  line-height: 1.75;
  color: var(--ef-text);
}
/* the category content appears below the product grid, with clear separation */
.ef-range-content {
  clear: both;
  margin-top: 40px;
  padding-top: 28px;
  border-top: 1px solid var(--ef-border);
}
.ef-range-content img { max-width: 100%; height: auto; }
.ef-range-content h2, .ef-range-content h3 { font-family: var(--ef-font-head); color: #2b2f36; margin: 1.4em 0 .5em; }
.ef-range-content h2 { font-size: 1.5rem; }
.ef-range-content h3 { font-size: 1.2rem; }
.ef-range-content p { margin: 0 0 1.1em; }
.ef-range-content a { color: var(--ef-brand); }
.ef-range-content table { display: block; width: 100%; overflow-x: auto; border-collapse: collapse; margin: 1.2em 0; }
.ef-range-content td, .ef-range-content th { border: 1px solid var(--ef-border); padding: 8px 10px; }
@media (max-width: 600px) {
  .ef-range-content h2 { font-size: 1.3rem; }
  .ef-range-content h3 { font-size: 1.1rem; }
}
.ef-seo-content h2,
.ef-seo-content h3 {
  font-family: var(--ef-font-head);
  margin: 1.5em 0 .5em;
  color: #2b2f36;
}
.ef-seo-content h2 { font-size: 1.5rem; }
.ef-seo-content h3 { font-size: 1.2rem; }
.ef-seo-content p { margin: 0 0 1.1em; }
.ef-seo-content ul,
.ef-seo-content ol { margin: 0 0 1.1em 1.3em; }
.ef-seo-content li { margin: 0 0 .4em; }
.ef-seo-content a { color: var(--ef-brand); }
/* tables in legacy content: don't overflow the screen (own horizontal scroll) */
.ef-seo-content table { display: block; width: 100%; overflow-x: auto; border-collapse: collapse; margin: 1.2em 0; }
.ef-seo-content td,
.ef-seo-content th { border: 1px solid var(--ef-border); padding: 8px 10px; }
@media (max-width: 600px) {
  .ef-seo-content h2 { font-size: 1.3rem; }
  .ef-seo-content h3 { font-size: 1.1rem; }
}

/* =========================================================================
   IMAGES IN EDITABLE TEXT — on their own line, with a blank line's space
   above and below (posts, pages, product descriptions, category texts, FAQ
   answers). Floated left/right images keep the text beside them and get the
   blank line below. Component images (logos, cards, sliders, grids) are untouched.
   ========================================================================= */
:is(.entry-content, .ef-range-content, .ef-seo-content, .term-description, .woocommerce-product-details__short-description, .woocommerce-Tabs-panel, .efbl-faq__a-inner, .efb-toggle__body)
  :is(p, h2, h3, h4, h5, h6, td, th, li, dd, .wp-block-html) img:not(.alignleft):not(.alignright):not(.emoji):not(.avatar):not(:is(.efb-logos, .efb-offers, .efb-tiles, .efb-cards, .efb-products, .efb-hero, .efb-cta, .efbl-carousel, .efbl-cats, .efbl-articles, .efbl-reviews, .ef-also-read) img) {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 1.6rem auto;
}
:is(.entry-content, .ef-range-content, .ef-seo-content, .term-description, .woocommerce-product-details__short-description, .woocommerce-Tabs-panel, .efbl-faq__a-inner, .efb-toggle__body)
  :is(figure.wp-block-image, .wp-caption):not(.alignleft):not(.alignright) {
  margin-top: 1.6rem;
  margin-bottom: 1.6rem;
}
:is(.entry-content, .ef-range-content, .ef-seo-content, .term-description, .woocommerce-product-details__short-description, .woocommerce-Tabs-panel, .efbl-faq__a-inner, .efb-toggle__body)
  :is(figure.wp-block-image, .wp-caption) img { margin-top: 0; margin-bottom: 0; }
:is(.entry-content, .ef-range-content, .ef-seo-content, .term-description, .woocommerce-product-details__short-description, .woocommerce-Tabs-panel, .efbl-faq__a-inner, .efb-toggle__body)
  :is(img, figure, .wp-caption):is(.alignleft, .alignright) {
  margin-top: .4rem;
  margin-bottom: 1.6rem;
}
/* A link wrapping an image becomes a block too, so the image sits on its own line. */
:is(.entry-content, .ef-range-content, .ef-seo-content, .term-description, .woocommerce-Tabs-panel, .efbl-faq__a-inner, .efb-toggle__body)
  :is(p, h2, h3, h4, h5, h6, td, th, li) > a:is(:has(> img:not(.alignleft):not(.alignright)), :has(> picture > img:not(.alignleft):not(.alignright))) { display: block; }

/* Links inside running text are underlined, not told apart by colour alone
   (accessibility: link-in-text-block). */
:is(.efbl-long-desc, .efbl-faq__a-inner, .ef-range-content, .term-description) p a:not(.button):not(.efb-button) {
  text-decoration: underline;
  text-decoration-color: var(--ef-brand-light);
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

/* Text contrast (WCAG AA 4.5:1): Astra/WooCommerce greys and faded text on
   shop pages, the red offer labels. */
.woocommerce nav.woocommerce-breadcrumb,
.woocommerce-page nav.woocommerce-breadcrumb { color: #5f6b66; }
.woocommerce .ast-woo-product-category,
.ast-woo-product-category { color: #5f6b66 !important; opacity: 1 !important; }
.woocommerce .ef-price del,
.ef-price del { color: #6b7280 !important; opacity: 1 !important; }
.efb-offers .efb-offer__label { color: #d10000; }
.efbl-table th a { color: var(--ef-brand-deep); }
.woocommerce nav.woocommerce-breadcrumb a,
.woocommerce-page nav.woocommerce-breadcrumb a { color: var(--ef-brand-deep); text-decoration: underline; text-decoration-color: var(--ef-brand-light); text-underline-offset: 3px; }
.ef-tc-note a,
.ef-product-notes a,
:is(.efbl-long-desc, .efbl-faq__a-inner, .ef-range-content, .term-description) li a:not(.button) { text-decoration: underline; text-underline-offset: 2px; }

/* Cart: the add-ons are edited with the checkboxes under the product name, so
   the "Removal & Disposal: Added" item data below them is not repeated there
   (it still shows at checkout, in the order and in the emails). */
.woocommerce-cart-form .product-name .ef-cart-item-addons ~ dl.variation { display: none; }

/* =========================================================================
   PRODUCT DETAILS (inc/product-details.php) – price with VAT, Model / Brand,
   Features section (two columns, icons), Brand tab
   ========================================================================= */
.single-product .summary .ef-price-inc-vat { margin: -6px 0 10px; font-size: .95rem; color: var(--ef-text); }
.single-product .summary .ef-price-inc-vat span { color: #5d6b63; font-size: .85em; }
.single-product .summary ul.ef-product-specs { list-style: none; margin: 0 0 18px; padding: 10px 14px; border: 1px solid var(--ef-brand-light); border-radius: 10px; background: #f6faf7; }
.single-product .summary ul.ef-product-specs li { margin: 2px 0; font-size: .95rem; line-height: 1.5; }
.ef-product-specs__label { font-weight: 700; color: var(--ef-text); margin-right: 4px; }

/* Features: own section above the tabs – the list in two columns, an icon on a light green disc instead of each bullet */
.single-product .ef-features-section { clear: both; margin: 8px 0 34px; padding: 22px 26px 12px; border: 1px solid var(--ef-brand-light); border-radius: 12px; background: #fff; }
.single-product .ef-features-section__title { margin: 0 0 16px; font-size: 1.5rem; }
ul.ef-features { list-style: none; margin: 0 0 1.2em; padding: 0; }
.ef-features-tab ul.ef-features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 36px; }
ul.ef-features li { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 10px; padding: 0; list-style: none; }
ul.ef-features li::before { content: none; display: none; }
@media (max-width: 640px) {
  .ef-features-tab ul.ef-features { grid-template-columns: 1fr; }
  .single-product .ef-features-section { padding: 18px 16px 8px; }
}
.ef-feature-icon {
  flex: 0 0 26px; width: 26px; height: 26px; border-radius: 50%;
  background: #e4f2e4; border: 1px solid var(--ef-brand-light);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 14px; line-height: 1;
}
.ef-feature-text { padding-top: 2px; }

/* Technical Specs / Brand / Energy tabs */
.woocommerce-Tabs-panel h2.ef-tab-heading { margin-top: 0; }
.ef-brand-tab { display: flex; gap: 28px; align-items: flex-start; }
.ef-brand-tab__logo { flex: 0 0 180px; }
.ef-brand-tab__logo img { width: 180px; height: auto; display: block; }
.ef-brand-tab__more { font-weight: 600; }
@media (max-width: 640px) {
  .ef-brand-tab { flex-direction: column; gap: 14px; }
  .ef-brand-tab__logo { flex-basis: auto; }
  .ef-brand-tab__logo img { width: 140px; }
}