/*
 * movo-functions.css
 * -------------------
 * All CSS previously inlined as <style> blocks inside movo-functions.php,
 * consolidated into this one stylesheet and enqueued site-wide from there
 * (see wp_enqueue_style( 'movo-functions', ... ) near the top of that file).
 *
 * Each section below is labelled with the page(s) it was originally scoped
 * to in PHP (e.g. "Single product page only (is_product())", "Cart page
 * only (is_cart())"). That page-gating logic lived in the PHP wrapper, not
 * in the CSS itself, so loading this file globally is safe -- rules simply
 * have no matching elements to apply to on pages outside their original
 * scope. The labels are kept purely as documentation so it stays clear
 * which page(s) each section was written for.
 *
 * Do not hand-edit the selectors' meaning without also checking
 * movo-functions.php for any JS in the same original hook that depends on
 * the same classes.
 */

/* ============================================================ */
/* Category hero banner / carousel / mobile teaser -- global, every page */
/* ============================================================ */
.movo-cat-hero__content{ display: flex; align-items: center; }
.movo-topbanner{
  text-align: left;
  width: 100%;
}
.movo-topbanner p{ margin: 4px 0; line-height: 1.4; color: #ffffff; }
.movo-topbanner__lead{
  display: inline-block;
  font-size: 1.3rem;
  font-weight: 700;
  padding-bottom: 8px;
  border-bottom: 3px solid #ffffff;
}
.movo-topbanner__lead strong{ color: #ffffff; }
.movo-topbanner__line{ font-size: .95rem; color: rgba(255,255,255,.85); }
.movo-topbanner__note{
  display: inline-block;
  margin: 12px 0 6px !important;
  padding: 7px 16px;
  background: #ffffff;
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 600;
  color: #0d6f3e !important;
}
.movo-topbanner__cta{
  font-weight: 700;
  margin-top: 10px !important;
  color: #FFD166;
  font-size: 1.05rem;
}

/* Carousel, resized to exactly fill the hero's white panel — panel's own size is untouched. */
.movo-cat-hero__panel .mc-carousel{
  position: relative;
  width: 100%;
  height: 220px;
  max-width: none;
  margin: 0;
  border-radius: 4px;
  overflow: hidden;
  border: none;
  box-shadow: none;
}
@media (max-width: 782px){
  .movo-cat-hero__panel .mc-carousel{ margin-left: 0; margin-right: 0; }
}

/* category banner image — fills the ENTIRE white half of the hero, edge to edge */
.movo-cat-hero{ position: relative; overflow: hidden; }
.movo-cat-hero__banner-img{
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  height: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 0;
}
@media (max-width: 782px){
  .movo-cat-hero__banner-img{ display: none; }
}

.movo-cat-hero__carousel{
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  height: 100%;
}
.movo-cat-hero__carousel-slide{
  position: absolute;
  inset: 0;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: 0;
  transition: opacity 1.2s ease;
}
.movo-cat-hero__carousel-slide.is-active{
  opacity: 1;
}
@media (max-width: 782px){
  .movo-cat-hero__carousel{ display: none; }
}

.movo-cat-about{ background: #fff; border-bottom: 1px solid #DDE2E6; }
.movo-cat-about__inner{ max-width: 1450px; margin: 0 auto; padding: 28px 32px; }
.movo-cat-about__inner p{ font-size: 14px; line-height: 1.7; color: #5B6570; max-width: 90ch; margin: 0 0 10px; }
.movo-cat-about__inner p:last-child{ margin-bottom: 0; }

/* Search results — the "Meklēšanas rezultāti: X" heading, pulled OUT of the
   hero (see the render_block filter around movo-cat-hero) so the hero itself
   can show its normal full image/carousel on search pages instead of an
   empty white panel.
   It is hidden from sight but deliberately NOT removed: this is the page's
   only <h1>, so it stays in the markup for screen readers and for the page's
   heading structure. The clip/1px pattern is the standard way to do that —
   display:none would hide it from assistive tech too.
   To show it again, delete this block and restore the plain version:
     .movo-search-title-outside{ max-width:1450px; margin:0 auto; padding:24px 32px 4px; }
     .movo-search-title-outside .wp-block-query-title{ margin:0; font-size:26px;
       font-weight:700; color:#14181B; line-height:1.2; }
     @media (max-width:782px){ .movo-search-title-outside{ padding:18px 20px 0; }
       .movo-search-title-outside .wp-block-query-title{ font-size:20px; } } */
.movo-search-title-outside{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Mobile search panel — stacking fix (why the phone search did nothing).
   The backdrop (.movo-overlay, position:fixed, inset:0, z-index 9990) is
   shared by the burger menu and the search panel. In search mode it's made
   transparent so it isn't visible — but it still sat ON TOP of the search
   panel and swallowed every tap: document.elementFromPoint() at the submit
   button's own centre returned the overlay, not the button. Tapping the
   field or the magnifier therefore just closed the panel instead of
   searching. Desktop was unaffected: above 1125px the search stays inline
   in the header, with no panel or overlay involved.
   Raising the panel can't fix this — it lives inside <header>, which is
   position:sticky; z-index:1000, so the whole header (and everything in it)
   is trapped in a stacking context below the overlay's 9990. The fix is the
   other direction: drop the overlay just under the header, but ONLY in its
   search variant, so the burger menu's own dimming keeps its original 9990.
   Tap-outside-to-close still works — the overlay still covers the whole
   viewport around the header. */
.movo-overlay.movo-overlay--search{ z-index: 999 !important; }

/* Category hero — full-bleed image mode (any category with a thumbnail set) */
.movo-cat-hero--has-image{
  background: none !important;
  height: 320px;
}
.movo-cat-hero--has-image .movo-cat-hero__banner-img{
  width: 100% !important;
  z-index: 0;
  background-position: center 75%;
}
.movo-cat-hero--has-image .movo-cat-hero__carousel{
  width: 100% !important;
  z-index: 0;
}
.movo-cat-hero--has-image .movo-cat-hero__inner{
  position: relative;
  z-index: 1;
  display: block !important;
  height: 320px;
  box-sizing: border-box;
  padding: 0 !important;
}
.movo-cat-hero--has-image .movo-cat-hero__inner::before{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #1E8A4C 0%, #1E8A4C 45%, rgba(30,138,76,.85) 52%, rgba(30,138,76,0) 65%);
  z-index: 1;
  pointer-events: none;
}
.movo-cat-hero--has-image .movo-cat-hero__panel{
  display: contents;
}
.movo-cat-hero--has-image .movo-cat-hero__content{
  position: relative;
  z-index: 2;
  display: flex !important;
  flex-direction: column;
  align-items: flex-start !important;
  text-align: left !important;
  max-width: 620px;
  min-height: 320px;
  box-sizing: border-box;
  justify-content: center;
  padding: 0 0 0 var(--wp--preset--spacing--50, 3.125rem);
  margin: 0 !important;
}
.movo-cat-hero--has-image .movo-cat-hero__kicker{
  font: 700 12px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: rgba(255,255,255,.8);
  margin-bottom: 12px;
}
.movo-cat-hero--has-image .movo-cat-hero__btns{
  display: flex;
  gap: 12px;
  margin-top: 22px;
}
.movo-cat-hero--has-image .movo-cat-hero__btn{
  display: inline-block;
  padding: 12px 22px;
  font: 700 14px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  text-decoration: none;
  background: #fff;
  color: #14532D;
  border-radius: 2px;
}
.movo-cat-hero--has-image .movo-cat-hero__btn--ghost{
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255,255,255,.7);
}
@media (max-width: 782px){
  .movo-cat-hero--has-image .movo-cat-hero__content{ max-width: none; padding: 32px 0; }
}

/* ===== Mobile hero for the front page AND search results: show the image
   behind the text instead of hiding it (the carousel is display:none on
   mobile everywhere by default, further up this file).
   Search needs the whole block, not just the carousel line: without the
   ::before gradient the hero's desktop split-gradient faded to white on the
   right and the white text became unreadable over it, and the type was still
   at desktop sizes. Scoped to these two body classes so category pages, which
   have their own treatment below, are untouched. ===== */
@media (max-width: 782px){
  body.home .movo-cat-hero__banner-img,
  body.search .movo-cat-hero__banner-img{ display: block; }
  body.home .movo-cat-hero__carousel,
  body.search .movo-cat-hero__carousel{ display: block; }
  body.home .movo-cat-hero--has-image,
  body.search .movo-cat-hero--has-image{ height: auto; min-height: 240px; }
  body.home .movo-cat-hero--has-image .movo-cat-hero__inner,
  body.search .movo-cat-hero--has-image .movo-cat-hero__inner{ height: auto; min-height: 240px; }
  body.home .movo-cat-hero--has-image .movo-cat-hero__inner::before,
  body.search .movo-cat-hero--has-image .movo-cat-hero__inner::before{
    background: linear-gradient(180deg, rgba(15,72,40,.42) 0%, rgba(15,72,40,.3) 60%, rgba(15,72,40,.22) 100%);
  }
  body.home .movo-cat-hero--has-image .movo-cat-hero__content,
  body.search .movo-cat-hero--has-image .movo-cat-hero__content{
    min-height: auto;
    padding: 18px 20px;
  }
  body.home .movo-topbanner p,
  body.search .movo-topbanner p{ text-shadow: 0 1px 4px rgba(0,0,0,.55); margin: 3px 0; }
  body.home .movo-topbanner__lead,
  body.search .movo-topbanner__lead{ font-size: 1.05rem; }
  body.home .movo-topbanner__line,
  body.search .movo-topbanner__line{ font-size: .82rem; }
  body.home .movo-topbanner__note,
  body.search .movo-topbanner__note{ padding: 5px 12px; font-size: .74rem; margin: 8px 0 4px !important; }
  body.home .movo-topbanner__cta,
  body.search .movo-topbanner__cta{ font-size: .92rem; margin-top: 6px !important; }
}

/* ===== Mobile teaser — ALL category pages. Short image + inline "Lasīt vairāk"
   instead of the full description, freeing up room for the photo. Scoped to
   body.tax-product_cat so the front page (its own separate treatment) is untouched. ===== */
.movo-mobile-teaser{ display: none; }
@media (max-width: 782px){
  body.tax-product_cat .movo-cat-hero__banner-img{ display: block; }
  body.tax-product_cat .movo-cat-hero--has-image{ height: auto; min-height: 240px; }
  body.tax-product_cat .movo-cat-hero--has-image .movo-cat-hero__inner{ height: auto; min-height: 240px; }
  body.tax-product_cat .movo-cat-hero--has-image .movo-cat-hero__inner::before{
    background: linear-gradient(180deg, rgba(15,72,40,.42) 0%, rgba(15,72,40,.3) 60%, rgba(15,72,40,.22) 100%);
  }
  body.tax-product_cat .movo-cat-hero--has-image .movo-cat-hero__content{
    min-height: auto;
    padding: 18px 20px;
  }
  body.tax-product_cat .movo-cat-hero__content h1{
    text-shadow: 0 1px 4px rgba(0,0,0,.55);
    font-size: 1.4rem;
  }
  body.tax-product_cat .movo-cat-hero .wp-block-term-description{ display: none !important; }
  body.tax-product_cat .movo-mobile-teaser{ display: block; }
  body.tax-product_cat .movo-mobile-teaser__snippet{
    color: rgba(255,255,255,.92);
    text-shadow: 0 1px 4px rgba(0,0,0,.55);
    font-size: .88rem;
    line-height: 1.5;
    margin: 6px 0 0;
  }
  body.tax-product_cat .movo-mobile-teaser__toggle{
    color: #FFD166;
    font-weight: 700;
    text-decoration: underline;
    white-space: nowrap;
  }
  body.tax-product_cat .movo-mobile-teaser__full{ display: none; }
  body.tax-product_cat .movo-mobile-teaser.is-open .movo-mobile-teaser__snippet{ display: none; }
  body.tax-product_cat .movo-mobile-teaser.is-open .movo-mobile-teaser__full{
    display: block;
    background: #EAF6EF;
    border: 1px solid #CDE9D8;
    color: #14181B;
    padding: 14px 16px;
    border-radius: 8px;
    margin-top: 8px;
    font-size: .85rem;
    line-height: 1.6;
  }
  body.tax-product_cat .movo-mobile-teaser.is-open .movo-mobile-teaser__full p{ margin: 0 0 10px; }
  body.tax-product_cat .movo-mobile-teaser.is-open .movo-mobile-teaser__full .movo-mobile-teaser__toggle{
    color: #0d6f3e;
  }
}

/* ============================================================ */
/* (inline, ungated -- global) */
/* ============================================================ */
.wc-block-mini-cart__shopping-button.wp-block-woocommerce-mini-cart-shopping-button-block,
a.wc-block-mini-cart__shopping-button{
  background:#1F8A54 !important;
  color:#fff !important;
  border-color:#1F8A54 !important;
  border-radius:6px !important;
}
.wc-block-mini-cart__shopping-button:hover{ background:#186E43 !important; }
.wc-block-mini-cart__shopping-button .wc-block-components-button__text{ color:#fff !important; }

/* ============================================================ */
/* (inline, ungated -- global) */
/* ============================================================ */
/* ===== Mobile-only — trust bar mobile carousel: show 2 items per "page",
   auto-rotate between page 1 (items 1-2) and page 2 (items 3-4). Uses a fixed
   50%/50% flex split (not CSS Grid auto-tracks) with hard overflow:hidden
   clamps, so content length can NEVER force either column wider — this is
   deliberately brute-force to rule out any browser-engine edge case. ===== */
@media (max-width: 782px){
  .movo-trust-bar{
    overflow: hidden !important;
  }
  .movo-trust-bar__grid{
    display: flex !important;
    flex-wrap: wrap !important;
    height: 88px !important;
    min-height: 88px !important;
    max-height: 88px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }
  .movo-trust-bar__item{
    flex: 0 0 50% !important;
    width: 50% !important;
    max-width: 50% !important;
    height: 88px !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
    overflow: hidden !important;
    align-items: flex-start !important;
    padding-top: 16px !important;
  }
  .movo-trust-bar__item > div{
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }
  .movo-trust-bar__title,
  .movo-trust-bar__sub{
    max-width: 100% !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
  }
  .movo-trust-bar__item:nth-child(3),
  .movo-trust-bar__item:nth-child(4){
    display: none !important;
  }
  .movo-trust-bar__grid.movo-trust-page-2 .movo-trust-bar__item:nth-child(1),
  .movo-trust-bar__grid.movo-trust-page-2 .movo-trust-bar__item:nth-child(2){
    display: none !important;
  }
  .movo-trust-bar__grid.movo-trust-page-2 .movo-trust-bar__item:nth-child(3),
  .movo-trust-bar__grid.movo-trust-page-2 .movo-trust-bar__item:nth-child(4){
    display: flex !important;
  }
  .movo-trust-bar__item:nth-child(2){ border-right: 0 !important; }
  .movo-trust-bar__grid.movo-trust-page-2 .movo-trust-bar__item:nth-child(3){ border-right: 1px solid rgba(255,255,255,.12) !important; }
  .movo-trust-bar__grid.movo-trust-page-2 .movo-trust-bar__item:nth-child(4){ border-right: 0 !important; }
}

/* ============================================================ */
/* (inline, ungated -- global) */
/* ============================================================ */
.movo-toolbar{
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.movo-toolbar__row{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.movo-toolbar__row--right{ justify-content: flex-end; }
.movo-toolbar__group{ display: flex; align-items: center; gap: 10px; }
.movo-toolbar__filter select{
  border: 1px solid #D7DCE0;
  border-radius: 6px;
  padding: 8px 14px;
  font: 600 12.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  background: #fff;
  color: #14181B;
  max-width: 220px;
}
.movo-toolbar__label{
  font: 700 11px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #5B6670;
}
.movo-seg{
  display: inline-flex;
  flex-wrap: wrap;
  border: 1px solid #D7DCE0;
  border-radius: 6px;
  overflow: hidden;
}
.movo-seg__item{
  padding: 8px 14px;
  font: 600 12.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  color: #14181B;
  text-decoration: none !important;
  border-right: 1px solid #D7DCE0;
  border-bottom: 1px solid #D7DCE0;
  background: #fff;
}
.movo-seg__item:last-child{ border-right: none; }
.movo-seg__item:hover{ background: #F7F8F9; }
.movo-seg__item.is-active{
  background: #1E8A4C;
  color: #fff;
}
@media (max-width: 950px){
  /* The desktop "PRODUKTU KATALOGS" hover-dropdown sidebar is not shown on
     mobile (its own CSS takes it out of flow via position:fixed), but its
     50px reserved slot in .movo-shoprow was left behind as empty space
     above the product grid. Remove it. */
  .movo-shoprow{ min-height: 0 !important; }
  .movo-grid-5{ margin-top: -24px !important; }
  .movo-subcats{ margin-top: -23px !important; }
}

/* ===== "PRODUKTU KATALOGS" bar — equal corners.
   The green head was 47px tall inside a 50px container that clips with
   overflow:hidden, so 3px of the container's white background showed as a
   strip underneath it, and its own radius was 6px 6px 0 0 — rounded on top,
   square at the bottom. Make it fill the container and round all four
   corners. While the dropdown is open the bottom corners go square again so
   the head still meets the category list below it. ===== */
@media (min-width: 951px){
  body .movo-shoprow .movo-catmenu__head{
    height: 50px !important;
    box-sizing: border-box !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    border-radius: 8px !important;
  }
  body .movo-shoprow .movo-catmenu:hover > .movo-catmenu__head,
  body .movo-shoprow .movo-catmenu:focus-within > .movo-catmenu__head{
    border-radius: 8px 8px 0 0 !important;
  }
}
.movo-toolbar__mobile-bar{ display: none; }
.movo-toolbar__backdrop{ display: none; }
.movo-toolbar__panel-header{ display: none; }
.movo-toolbar__apply-btn{ display: none; }

/* ===== Desktop — the panel holds two rows (Stāvoklis+Cena, then the brand /
   colour / sort selects). It is a plain block, so those rows stacked and the
   selects sat a line below the filter buttons. Lay the panel out as one row
   instead, with the selects pushed to the right edge. flex-wrap is kept so a
   narrow desktop window still falls back to two lines rather than squashing
   the controls. ===== */
@media (min-width: 601px){
  .movo-toolbar__panel{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px 20px;
  }
  .movo-toolbar__row{ flex: 0 1 auto; }
  .movo-toolbar__row--right{ margin-left: auto; }
}
@media (max-width: 600px){
  .movo-toolbar__row{ align-items: flex-start; }
  .movo-toolbar__group{ display: flex; flex-direction: column; align-items: stretch; width: 100%; gap: 6px; }
  .movo-seg{ display: flex; flex-wrap: wrap; width: 100%; }
  .movo-toolbar__row--right{ justify-content: flex-start; }
  .movo-toolbar__filter, .movo-toolbar__sort{ width: 100%; }
  .movo-toolbar__filter select, .movo-toolbar__sort select{ max-width: none; width: 100%; }

  /* Compact bar always visible: "Filtri (N)" button + a small sort select */
  .movo-toolbar__mobile-bar{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
  }
  .movo-toolbar__sort--mobile{ flex: 1; max-width: 180px; width: auto; }
  .movo-toolbar__sort--mobile select{ width: 100%; }
  .movo-toolbar__filters-btn{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #D7DCE0;
    border-radius: 6px;
    padding: 10px 16px;
    background: #fff;
    font: 700 13px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    color: #14181B;
  }
  .movo-toolbar__filters-count{
    display: inline-block;
    background: #1E8A4C;
    color: #fff;
    border-radius: 999px;
    padding: 1px 7px;
    font-size: 11px;
  }

  /* Bottom-sheet panel — off-screen by default, slides up when body.movo-filters-open */
  .movo-toolbar__panel{
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    z-index: 1001;
    max-height: 80vh;
    overflow-y: auto;
    border-radius: 16px 16px 0 0;
    padding: 16px 16px 20px;
    box-shadow: 0 -6px 24px rgba(0,0,0,.18);
    transform: translateY(110%);
    transition: transform .3s ease;
  }
  body.movo-filters-open .movo-toolbar__panel{
    transform: translateY(0);
  }
  .movo-toolbar__panel-header{
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
    font: 700 15px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    color: #14181B;
  }
  .movo-toolbar__panel-close{
    border: none;
    background: #F1F3F4;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    font-size: 15px;
    line-height: 1;
  }
  .movo-toolbar__apply-btn{
    display: block !important;
    width: 100%;
    margin-top: 18px;
    background: #1E8A4C;
    color: #fff;
    border: none;
    padding: 13px;
    border-radius: 8px;
    font: 700 14px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  }

  .movo-toolbar__backdrop{
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 1000;
  }
  body.movo-filters-open .movo-toolbar__backdrop{
    display: block;
  }
  body.movo-filters-open{
    overflow: hidden;
  }
}
.movo-toolbar__sort select{
  border: 1px solid #D7DCE0;
  border-radius: 6px;
  padding: 8px 14px;
  font: 600 12.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  background: #fff;
  color: #14181B;
}

/* ============================================================ */
/* (inline, ungated -- global) */
/* ============================================================ */
.movo-card-meta{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px 0;
}
.movo-card-brand{
  font: 700 10.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #5B6670;
}
.movo-card-grade{
  font: 700 10.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  border: 1px solid #1E8A4C;
  color: #156B3B;
  padding: 4px 8px;
  border-radius: 4px;
  white-space: nowrap;
}

/* ===== Struck-through full price (movo-full-price.php) — red, to match the
   red corner ribbon it appears alongside.
   The Customizer declares .movo-fullprice-value four times: red once, then
   grey twice on top of it with !important, and the last one wins — which is
   why it had gone pale. The `body` prefix outranks all of them; the Customizer
   loads after this file, so an equal-specificity rule here would lose. ===== */
body .movo-fullprice-value{
  color: #C0392B !important;
  text-decoration: line-through !important;
  text-decoration-color: #C0392B !important;
  text-decoration-thickness: 2px !important;
  font-size: .9em !important;
  font-weight: 600 !important;
}

/* The Customizer centres .movo-price-stack, which is right on the cards but
   wrong on the product page, where the title, badges and everything else are
   left-aligned — a discounted product's price sat 350px off to the right
   while an undiscounted one started at the column edge.
   flex-end, not flex-start: the stack is flex-direction:row-reverse (so the
   selling price shows before the struck-through one), which puts main-start
   on the right. */
body.single-product .movo-price-stack{
  justify-content: flex-end !important;
}

/* ============================================================ */
/* Single product page only (is_product()) */
/* ============================================================ */
.movo-related-banner{
  background: #1E8A4C;
  color: #fff;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 14px 20px;
  margin: var(--wp--preset--spacing--30, 32px) 0 0;
}
.wp-block-woocommerce-product-collection{ border-top: none !important; }

/* the old blanket "hide the add-to-cart button in related products" rule
   still exists elsewhere in Additional CSS — this specific, more specific
   selector wins it back for the catalog-style cards. */
body.single-product .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-button{
  display: block !important;
}

/* Related-product cards: same grid + card-actions treatment as the catalog
   grid (movo-grid-5), just 4 columns — CSS Grid gives every row equal-height
   cards for free, so movo-card-actions can safely sit at the bottom. */
body.single-product .wp-block-woocommerce-product-collection ul.wc-block-product-template{
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0,1fr)) !important;
  gap: 16px !important;
}
/* WooCommerce's own "columns-4 > li{width:calc(25% - ...)}" rule computes
   that 25% against the grid TRACK (not the row), collapsing each card to a
   sliver — kill it so the card just fills its grid cell. */
body.single-product .wp-block-woocommerce-product-collection ul.wc-block-product-template > li{
  width: auto !important;
}
@media (max-width: 1100px){
  body.single-product .wp-block-woocommerce-product-collection ul.wc-block-product-template{
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  }
}
@media (max-width: 600px){
  body.single-product .wp-block-woocommerce-product-collection ul.wc-block-product-template{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
}
body.single-product .wp-block-woocommerce-product-collection .wc-block-product{
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}
body.single-product .wp-block-woocommerce-product-collection .movo-card-actions{
  margin-top: auto !important;
}

/* The sitewide "main product" title/price/button rules — .single-product
   .wp-block-post-title{font-size:30px}, .single-product ...product-price
   .woocommerce-Price-amount{font-size:30px}, and the big green PDP button —
   are unscoped enough to also hit these related-product cards and win on
   specificity. Reclaim the catalog-card sizing here, higher-specificity. */
body.single-product .wp-block-woocommerce-product-collection .wp-block-post-title{
  font-size: 15.5px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  margin-bottom: 8px !important;
}
body.single-product .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-price .woocommerce-Price-amount{
  font-size: 21px !important;
}
body.single-product .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-button .wp-block-button__link{
  padding: 9px 16px !important;
  font-size: 13.5px !important;
}

/* ============================================================ */
/* Single product page only (is_product()) */
/* ============================================================ */
.movo-pdp-badges{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:8px; }
.movo-pdp-brand{ font:700 11px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; letter-spacing:.1em; text-transform:uppercase; color:#5B6670; }
.movo-pdp-grade{ font:700 11px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; border:1px solid #1E8A4C; color:#156B3B; padding:5px 10px; border-radius:4px; }
.movo-pdp-warranty{ font:700 11px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; background:#EAF6EE; color:#0d6f3e; padding:5px 10px; border-radius:4px; }

.movo-pdp-specs{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid #DDE2E6; border-bottom:1px solid #DDE2E6; margin:16px 0; }
.movo-pdp-specs__cell{ padding:14px 16px; border-right:1px solid #DDE2E6; }
.movo-pdp-specs__cell:last-child{ border-right:none; }
.movo-pdp-specs__label{ font:700 10.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; letter-spacing:.08em; text-transform:uppercase; color:#5B6670; margin-bottom:6px; }
.movo-pdp-specs__value{ font:800 18px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; color:#14181B; }

.movo-pdp-grade-note{ border-top:1px solid #DDE2E6; padding-top:20px; margin-top:24px; }
.movo-pdp-grade-note h3{ font-size:18px; margin:0 0 8px; }
.movo-pdp-grade-note p{ font-size:14px; line-height:1.6; color:#5B6670; margin:0 0 14px; max-width:60ch; }
.movo-pdp-grade-note__btn{ display:inline-block; border:1px solid #201E1D; padding:9px 16px; font:700 12.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; color:#14181B; text-decoration:none; }
.movo-pdp-grade-note__btn:hover{ background:#14181B; color:#fff; }

.movo-pdp-cta{ background:#1E8A4C; margin-top:32px; }
.movo-pdp-cta__inner{
  max-width:1450px; margin:0 auto; padding:40px 32px;
  display:flex; align-items:center; justify-content:space-between; gap:48px; flex-wrap:wrap;
}
.movo-pdp-cta__left{ flex:0 1 480px; }
.movo-pdp-cta__right{ flex:1 1 420px; max-width:560px; }
.movo-pdp-cta__kicker{ font:700 11px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; letter-spacing:.15em; color:rgba(255,255,255,.85); margin-bottom:12px; }
.movo-pdp-cta__heading{ font-size:32px; font-weight:800; line-height:1.15; color:#fff; letter-spacing:-.01em; }
.movo-pdp-cta__text{ font-size:15px; font-weight:400; line-height:1.6; color:rgba(255,255,255,.92); margin-bottom:18px; }
.movo-pdp-cta__btns{ display:flex; gap:10px; flex-wrap:wrap; }
.movo-pdp-cta__btn{ display:inline-block; padding:11px 20px; font:700 13px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; text-decoration:none; background:#fff; color:#0d6f3e; }
.movo-pdp-cta__btn--ghost{ background:transparent; color:#fff; border:1px solid rgba(255,255,255,.6); }
@media (max-width:782px){
  .movo-pdp-cta__inner{
    flex-direction:column;
    align-items:flex-start;
    gap:14px;
    padding:28px 20px !important;
  }
  /* Bug fix: the desktop flex-basis values (480px/420px, meant as WIDTHS in
     the row layout) were leaking through as HEIGHT flex-basis once the
     mobile media query switched to flex-direction:column — stretching this
     block to ~1000px tall for ~170px of real content. Reset to auto. */
  .movo-pdp-cta__left,
  .movo-pdp-cta__right{
    flex:0 0 auto !important;
    width:100%;
    max-width:none;
  }
  .movo-pdp-cta__heading{ font-size:22px; }
  .movo-pdp-cta__text{ margin-bottom:14px; }
}

@media (max-width:782px){
  .movo-pdp-specs{ grid-template-columns:1fr; }
  .movo-pdp-specs__cell{ border-right:none; border-bottom:1px solid #DDE2E6; }
}
.single-product .wp-block-add-to-cart-form .stock.in-stock{
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #14181B;
}
.single-product .wp-block-add-to-cart-form .stock.in-stock::before{
  content: "";
  width: 10px;
  height: 10px;
  background: #1E8A4C;
  flex: 0 0 auto;
}
.movo-pdp-ask{
  display: inline-block;
  margin-left: 10px;
  padding: 12px 16px;
  border: 1px solid #201E1D;
  color: #14181B;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  border-radius: 6px;
  white-space: nowrap;
}
.movo-pdp-ask:hover{ background: #14181B; color: #fff; }

.movo-qty{
  display: flex;
  align-items: stretch;
  border: 1px solid #D7DCE0;
  height: 48px;
  flex: 0 0 auto;
  box-sizing: border-box;
}
body.single-product .movo-qty .movo-qty__btn{
  width: 36px !important;
  flex: 0 0 auto !important;
  border: none !important;
  border-radius: 0 !important;
  background: #fff !important;
  font-size: 16px !important;
  line-height: 1 !important;
  color: #14181B !important;
  cursor: pointer;
  padding: 0 !important;
}
body.single-product .movo-qty .movo-qty__minus{ border-right: 1px solid #D7DCE0 !important; }
body.single-product .movo-qty .movo-qty__plus{ border-left: 1px solid #D7DCE0 !important; }
body.single-product .movo-qty .movo-qty__btn:hover:not(:disabled){ background: #F4F6F7 !important; }
body.single-product .movo-qty .movo-qty__btn:disabled{ color: #C7CDD3 !important; cursor: not-allowed; }
.single-product .quantity.movo-qty input.movo-qty__input{
  width: 48px !important;
  border: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  text-align: center;
  font: 700 15px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  -moz-appearance: textfield;
}
.movo-qty__input::-webkit-outer-spin-button,
.movo-qty__input::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}

body.single-product .movo-delivery--flat{
  border-top: 1px solid #14181B !important;
  border-bottom: 1px solid #14181B !important;
  border-radius: 0 !important;
  background: transparent !important;
  gap: 0 !important;
}
body.single-product .movo-delivery__cell{
  flex: 1 1 0 !important;
  padding: 18px 22px !important;
  border-right: 1px solid #14181B !important;
}
body.single-product .movo-delivery__cell:last-child{
  border-right: none !important;
}
body.single-product .movo-delivery__title{
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #14181B !important;
  margin-bottom: 8px !important;
}
body.single-product .movo-delivery__price{
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #14181B !important;
  line-height: 1.2 !important;
  margin-bottom: 6px !important;
}
body.single-product .movo-delivery__price--free{
  color: #1E8A4C !important;
}
body.single-product .movo-delivery__sub{
  font-size: 13px !important;
  color: #5B6570 !important;
  line-height: 1.4 !important;
}
@media (max-width: 640px){
  /* Uz pakomātu + Ar kurjeru side by side (2 cols); Saņemšana veikalā full-width, highlighted as the free option */
  body.single-product .movo-delivery--flat{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
  body.single-product .movo-delivery__cell{
    flex: initial !important;
    padding: 14px 16px !important;
    border-bottom: 1px solid #14181B !important;
  }
  body.single-product .movo-delivery__cell:nth-child(2){
    border-right: none !important;
  }
  body.single-product .movo-delivery__price{
    font-size: 17px !important;
  }
  body.single-product .movo-delivery__cell:last-child{
    grid-column: 1 / -1 !important;
    border-right: none !important;
    border-bottom: none !important;
    background: #EAF6EF !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    column-gap: 10px !important;
  }
  body.single-product .movo-delivery__cell:last-child .movo-delivery__title{
    margin-bottom: 0 !important;
  }
  body.single-product .movo-delivery__cell:last-child .movo-delivery__title::before{
    content: "\2713  ";
    color: #1E8A4C !important;
  }
  body.single-product .movo-delivery__cell:last-child .movo-delivery__price{
    margin-left: auto !important;
    margin-bottom: 0 !important;
    font-size: 17px !important;
  }
  body.single-product .movo-delivery__cell:last-child .movo-delivery__sub{
    flex: 1 1 100% !important;
    margin-top: 4px !important;
  }
}

.single-product .movo-pdp-tabs--single > ul.tabs{ display: none !important; }
.single-product .movo-pdp-split{
  display: flex;
  align-items: flex-start;
  gap: 48px;
}
.single-product .movo-pdp-split__col{
  flex: 1 1 0;
  min-width: 0;
}
.single-product .movo-pdp-split__col--specs{
  border-left: 1px solid #D7DCE0;
  padding-left: 48px;
}
.single-product .movo-pdp-split__col--specs h2{ margin-top: 0; }
.single-product .movo-pdp-spec-rows{ margin-top: 4px; }
.single-product .movo-pdp-spec-row{
  display: flex;
  gap: 20px;
  padding: 14px 0;
  border-bottom: 1px solid #14181B;
  font-size: 15px;
}
.single-product .movo-pdp-spec-row:last-child{ border-bottom: none; }
.single-product .movo-pdp-spec-row__label{
  flex: 0 0 140px;
  color: #14181B;
  font-weight: 700;
}
.single-product .movo-pdp-spec-row__value{
  color: #14181B;
  font-weight: 400;
}
@media (max-width: 782px){
  .single-product .movo-pdp-split{ flex-direction: column; gap: 24px; }
  .single-product .movo-pdp-split__col--specs{ border-left: none; border-top: 1px solid #D7DCE0; padding-left: 0; padding-top: 24px; }
}

/* ============================================================ */
/* Single product page only (is_product()) */
/* ============================================================ */
.single-product .single_add_to_cart_button.movo-added{
  background: #156B3B !important;
}

/* ============================================================ */
/* (inline, ungated -- global) */
/* ============================================================ */
.movo-grade-scale__toggle{ display: none; }
@media (max-width: 782px){
  .movo-grade-scale__toggle{
    display: inline-block;
    margin-top: 12px;
    margin-left: 12px;
    color: #1E8A4C;
    font: 700 13px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    text-decoration: underline;
  }
  .movo-grade-scale:not(.is-open) .movo-grade-scale__right{
    display: none;
  }
  .movo-grade-scale{
    padding: 8px 0 10px !important;
  }
  /* .movo-grade-scale__left still carried its desktop padding (40px 32px)
     on mobile — that's what was adding ~40px of extra empty space above the
     "STĀVOKĻA SKALA" text on top of the section's own (already-reduced)
     8px padding. */
  .movo-grade-scale__left{
    padding: 4px 20px 16px !important;
  }
}

/* ===== Footer, partner logos ("Mūs atradīsi arī") — lay them out in a row.
   The footer is a 5-column grid, so this block is the 6th item and wraps onto
   a row of its own, where it used 246px of 1400px and stacked its three
   120px logos one per line with ~1150px of empty space beside them. Let it
   span three columns instead and the logos sit side by side at full size. ===== */
@media (min-width: 783px){
  .movo-foot__col:last-child{
    grid-column: span 3 !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 9px 16px !important;
  }
  /* margin-right:100% rather than flex-basis:100% — both push the logos onto
     the next line, but a full-width heading also stretches its green
     border-bottom across the whole block. The Customizer keeps that underline
     text-width with align-self:flex-start, which only works while the column
     is a flex COLUMN; in a row it stops constraining the width. */
  .movo-foot__col:last-child .movo-foot__head{
    flex: 0 0 auto !important;
    margin-right: 100% !important;
  }
}

/* ===== Mobile-only — footer: 2-column grid instead of one long stacked column.
   "Seko mums" + "Mūs atradīsi arī" sit side by side as the last row; the partner
   logos shrink and sit in a row instead of stacking one-per-row.
   The row needs grid-column: 1/-1 to actually work: inside a single 165px
   column two 90px logos plus the gap need ~190px, so they kept wrapping back
   to one per line however the flex rules were written. Spanning both columns
   gives 350px, which fits all three. ===== */
@media (max-width: 782px){
  .movo-foot{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 24px 20px !important;
  }
  .movo-foot__social{
    grid-column: auto !important;
  }
  .movo-foot__col:last-child{
    grid-column: 1 / -1 !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
  }
  .movo-foot__col:last-child .movo-foot__head{
    flex: 0 0 auto !important;
    margin-right: 100% !important;
  }
  .movo-foot__col:last-child img{
    width: 90px !important;
    height: auto !important;
  }
}

/* ===== Mobile-only — single product page: "Jauda"/"SKU" spec cells side by side
   instead of stacked one-per-row. ===== */
@media (max-width: 782px){
  .movo-pdp-specs{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }
  .movo-pdp-specs__cell{
    border-right: 1px solid #DDE2E6 !important;
    border-bottom: none !important;
  }
  .movo-pdp-specs__cell:nth-child(2n){
    border-right: none !important;
  }
}

/* ===== Mobile-only — single product page: bold the "Apraksts" and
   "Ko nozīmē stāvoklis X" headings (were rendering at normal weight). ===== */
@media (max-width: 782px){
  .single-product .movo-pdp-split__col--desc h2,
  .single-product .movo-pdp-grade-note h3{
    font-weight: 800 !important;
  }
}

/* ===== "Skatīt visus: <kategorija>" button under "Ko nozīmē stāvoklis X" —
   green like the other buttons on the site, instead of the outlined black one. ===== */
.movo-pdp-grade-note__btn{
  background: #1F8A54 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
  padding: 12px 24px !important;
}
.movo-pdp-grade-note__btn:hover{
  background: #186E43 !important;
  color: #fff !important;
}

/* ===== "Atgriezties katalogā" button (Stāvokļa skala section) — green like
   the other buttons on the site, instead of the outlined black one. ===== */
.movo-grade-scale__btn{
  background: #1F8A54 !important;
  color: #fff !important;
  border: none !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
  padding: 12px 24px !important;
}
.movo-grade-scale__btn:hover{
  background: #186E43 !important;
  color: #fff !important;
}

/* ===== Mobile-only — "Specifikācija" list (Zīmols/Modelis/Jauda/…):
   tighter rows so the list takes less vertical space. ===== */
@media (max-width: 782px){
  .single-product .movo-pdp-spec-row{
    padding: 9px 0 !important;
    font-size: 13px !important;
    gap: 10px !important;
  }
  .single-product .movo-pdp-spec-row__label{
    flex: 0 0 auto !important;
    white-space: nowrap !important;
  }
  .single-product .movo-pdp-spec-row__value{
    flex: 1 1 auto !important;
    min-width: 0 !important;
    overflow-wrap: break-word !important;
  }
}

/* ===== Mobile-only — hold the gallery's final size from the first paint.
   This is the page's layout-shift problem. WooCommerce renders every gallery
   image stacked in the wrapper and hides the lot with opacity:0; the box still
   takes the space. When FlexSlider finally initialises it collapses into a
   single square viewport plus a thumbnail strip, and everything below jumps
   up — measured at 177px unthrottled and 658px on a throttled phone, which is
   what put mobile CLS at 0.42-1.22 against Google's 0.1 limit.

   Measured at 360/390/412/430px, the settled gallery is always
   "width + 96px": a 1:1 viewport plus a 96px strip (80px thumb + 8px padding
   top and bottom). So before FlexSlider exists, clip the wrapper to that same
   square and reserve the 96px the strip will take. The box then measures the
   same before and after, and nothing moves.

   The un-initialised state is detected by the absence of .flex-viewport,
   which FlexSlider creates. Where :has() is unsupported the rules simply do
   not apply and the old behaviour returns — no breakage. ===== */
@media (max-width: 782px){
  .woocommerce-product-gallery:not(:has(.flex-viewport)){
    padding-bottom: 96px;
    box-sizing: content-box;
  }
  .woocommerce-product-gallery:not(:has(.flex-viewport)) .woocommerce-product-gallery__wrapper{
    aspect-ratio: 1 / 1;
    overflow: hidden;
  }
  /* keep the strip at exactly the height reserved above, whatever the thumbs */
  .woocommerce-product-gallery ol.flex-control-thumbs{
    height: 96px;
    box-sizing: border-box;
  }
}

/* ===== Mobile-only — product image gallery: counter badge + dot
   indicators on the main image (thumbnail strip below stays as-is). ===== */
@media (max-width: 782px){
  .woocommerce-product-gallery{ position: relative; }
  .movo-gallery-counter{
    position: absolute;
    top: 12px;
    right: 12px;
    background: rgba(20,24,27,.65);
    color: #fff;
    font: 700 12px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    padding: 5px 10px;
    border-radius: 20px;
    z-index: 5;
    pointer-events: none;
  }
  .movo-gallery-dots{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    z-index: 5;
  }
  .movo-gallery-dots .movo-gallery-dot{
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(20,24,27,.3);
    border: none;
    padding: 0;
    cursor: pointer;
    transition: width .15s ease, background .15s ease;
  }
  .movo-gallery-dots .movo-gallery-dot.is-active{
    background: #1E8A4C;
    width: 16px;
    border-radius: 4px;
  }
}

/* ===== Desktop-only — product image gallery height.
   Measured before: the gallery block was 635px tall, made up of
   2px border + 30.8px counter + 30.8px dots + 421.5px image
   + 106px thumb strip + 44px bottom margin.
   The counter and the dots are a mobile-only feature (the CSS that
   positions them absolutely lives in the max-width:782px block above),
   so on desktop they were two EMPTY boxes adding 61.6px of dead space.
   Hiding them brings the block to 550px with the photo left at its
   original size and the thumbs barely touched.
   The image gets a fixed height + object-fit:contain so the total is
   exactly 550px for portrait products too, not just square ones. ===== */
@media (min-width: 783px){
  .single-product .movo-gallery-counter,
  .single-product .movo-gallery-dots{
    display: none !important;
  }
  .single-product .woocommerce-product-gallery{
    margin-bottom: 28px !important;
  }
  /* 420 image + 100 thumb strip. The min-height keeps the card at 550 even
     for a product with a single image, where FlexSlider renders no strip. */
  .single-product .woocommerce-product-gallery{
    min-height: 520px !important;
  }
  .single-product .woocommerce-product-gallery .flex-viewport{
    height: 420px !important;
  }
  .single-product .woocommerce-product-gallery__image img{
    width: 100% !important;
    height: 420px !important;
    object-fit: contain !important;
  }
  /* fixed height, not just padding: products with few enough thumbnails to
     fit need no scrollbar, which made their gallery 540px instead of 550px. */
  .single-product .woocommerce-product-gallery ol.flex-control-thumbs{
    padding: 6px 0 !important;
    height: 100px !important;
    box-sizing: border-box !important;
  }
  /* flex-basis, not width — the strip is a flex row and its basis wins */
  .single-product .woocommerce-product-gallery ol.flex-control-thumbs li{
    flex: 0 0 78px !important;
  }
  .single-product .woocommerce-product-gallery ol.flex-control-thumbs li,
  .single-product .woocommerce-product-gallery ol.flex-control-thumbs li img{
    width: 78px !important;
    height: 78px !important;
  }
}

/* ===== Desktop-only — line the buy row up with the bottom of the image.
   The gallery is a fixed 550px but the right column is not: titles run 1-3
   lines and short descriptions 2-4, which measured out to a 95px spread
   across products, so fixed margins can only ever align ONE product.
   These gaps are therefore driven by --movo-pdp-gap and the slack above the
   buy block by --movo-pdp-push; movo_pdp_align_buy_row() in
   movo-functions.php measures each page and sets them. The values below are
   the resting defaults, used as-is if that script never runs.
   The badge row stays put at the top, level with the top of the image. ===== */
@media (min-width: 783px){
  /* WooCommerce renders product-meta as a 0px-tall div wrapping an EMPTY
     group, so it shows nothing but still split the space around it into two
     gaps instead of one — its inner flex group blocks margin collapse-through.
     Hide it only while that group is genuinely empty, so the block still
     appears if a product ever fills it. */
  body.single-product .wp-block-woocommerce-product-meta:has(> .wp-block-group:empty){
    display: none !important;
  }
  body.single-product .wp-block-woocommerce-product-meta{
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  /* body-prefixed: the Customizer's own rules have the same specificity and
     load after this file, so a plain .single-product selector loses to them. */
  body.single-product .wp-block-post-title,
  body.single-product .wp-block-woocommerce-product-price,
  body.single-product .movo-pdp-specs,
  body.single-product .wp-block-post-excerpt,
  body.single-product .movo-warranty-box{
    margin-top: var(--movo-pdp-gap, 12px) !important;
    margin-bottom: var(--movo-pdp-gap, 12px) !important;
  }
  /* padding, not margin — margin here would collapse with the gap above it
     and the push would be swallowed instead of moving the buy row down. */
  body.single-product .wp-block-add-to-cart-form{
    margin-top: var(--movo-pdp-gap, 12px) !important;
    padding-top: var(--movo-pdp-push, 0px) !important;
  }
  /* the form is display:flex, so margins inside it do NOT collapse —
     the gap below the stock line is its margin-bottom alone. */
  body.single-product .wp-block-add-to-cart-form .stock.in-stock{
    margin-top: 10px !important;
    margin-bottom: 16px !important;
  }
  body.single-product .wp-block-add-to-cart-form form.cart{
    margin-top: 0 !important;
  }
}

/* ============================================================ */
/* Single product page only (is_product()) */
/* ============================================================ */
@media (max-width: 782px){
  .movo-breadcrumb-collapsed{
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    color: #5B6570 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
  }
  .movo-breadcrumb-crumb{
    color: #5B6570 !important;
    text-decoration: none !important;
    flex: 0 0 auto !important;
  }
  .movo-breadcrumb-crumb--last{
    color: #14181B !important;
    flex: 0 1 auto !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  .movo-breadcrumb-sep,
  .movo-breadcrumb-ellipsis{
    color: #B7BEC6 !important;
    flex: 0 0 auto !important;
  }
}

/* ============================================================ */
/* (inline, ungated -- global -- 'Stavokla skala' spacing, every page type it appears on) */
/* ============================================================ */
@media (max-width: 782px){
  .movo-grade-scale{
    margin-top: 30px !important;
  }
  /* Subcategory-tiles pages: the (empty, zero-height) .movo-grid-5 "no
     results" placeholder that sits between the tiles and the grade scale
     carries margin-top:-24px from the product-grid spacing fix — its
     negative margin collapses straight through into the 30px above, netting
     only 6px. Compensate by 24px here so the net gap is still 30px. */
  body:has(.movo-subcats) .movo-grid-5 + .movo-grade-scale{
    margin-top: 54px !important;
  }
}

/* ============================================================ */
/* (inline, ungated -- global) */
/* ============================================================ */
/* ===== Mini-cart drawer — free-shipping bar, warranty notice, upsell ===== */
.movo-freeship-bar{
  background: #1E8A4C;
  color: #fff;
  padding: 16px 20px;
  margin: -1px -1px 0;
}
.movo-freeship-bar__text{
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 10px;
}
.movo-freeship-bar__track{
  height: 6px;
  border-radius: 3px;
  background: rgba(255,255,255,.3);
  overflow: hidden;
}
.movo-freeship-bar__fill{
  height: 100%;
  background: #fff;
  border-radius: 3px;
  transition: width .3s ease;
}
.movo-freeship-bar.is-complete{ background: #156B3B; }

.movo-cart-warranty{
  margin: 16px 20px;
  padding: 14px 16px;
  background: #EAF6EF;
  border-left: 3px solid #1E8A4C;
  border-radius: 4px;
}
.movo-cart-warranty__title{
  display: block;
  color: #14181B;
  font-size: 14px;
  margin-bottom: 4px;
}
.movo-cart-warranty__text{
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: #5B6570;
}

.movo-cart-upsell{ margin: 0 20px 16px; }
.movo-cart-upsell__kicker{
  font: 700 11px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #5B6570;
  margin-bottom: 10px;
}
.movo-cart-upsell__card{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid #EAECEE;
}
.movo-cart-upsell__img{
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  border: 1px solid #D7DCE0;
  border-radius: 4px;
  overflow: hidden;
}
.movo-cart-upsell__img img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.movo-cart-upsell__info{ flex: 1 1 auto; min-width: 0; }
.movo-cart-upsell__name{
  font-size: 13.5px;
  font-weight: 600;
  color: #14181B;
  line-height: 1.35;
  margin-bottom: 2px;
}
.movo-cart-upsell__price{ font-size: 13px; color: #5B6570; }
.movo-cart-upsell__btn{ flex: 0 0 auto; }
.movo-cart-upsell__btn .button.add_to_cart_button{
  display: inline-block !important;
  border: 1px solid #D7DCE0 !important;
  background: #fff !important;
  color: #14181B !important;
  font: 700 12.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif !important;
  padding: 9px 14px !important;
  border-radius: 4px !important;
  text-decoration: none !important;
}
.movo-cart-upsell__btn .button.add_to_cart_button:hover{
  background: #F7F8F9 !important;
}
.movo-cart-upsell__btn .added_to_cart{ display: none !important; }

/* ============================================================ */
/* Cart AND Checkout pages only (is_cart() || is_checkout()) */
/* ============================================================ */
/* ===== Step banner (cart + checkout) ===== */
.movo-cart-steps{ background: #1E8A4C; margin: 0 0 32px; }
.movo-cart-steps__inner{
  max-width: 1200px; margin: 0 auto; padding: 20px 24px;
  display: flex; align-items: flex-end; justify-content: space-between;
  flex-wrap: wrap; gap: 16px;
}
.movo-cart-steps__kicker{
  display: block; font: 700 11px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.8); margin-bottom: 8px;
}
.movo-cart-steps__title{ font-size: 36px; font-weight: 800; color: #fff; margin: 0; line-height: 1; }
.movo-cart-steps__tabs{ display: flex; gap: 4px; }
.movo-cart-steps__tab{
  font: 700 12.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  letter-spacing: .04em; text-transform: uppercase; color: rgba(255,255,255,.75);
  padding: 12px 18px; border: 1px solid rgba(255,255,255,.35); background: transparent;
}
.movo-cart-steps__tab.is-active{ background: #fff; color: #14181B; border-color: #fff; }
.movo-cart-steps__tab.is-done{ color: #fff; border-color: rgba(255,255,255,.6); }

/* Checkout wizard "Turpināt pirkumu" buttons between steps. */
.movo-checkout-next-btn{
  display: block; width: 100%; margin-top: 18px; padding: 14px;
  background: #1E8A4C; color: #fff; border: none; border-radius: 6px;
  font: 700 14px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; cursor: pointer;
}
.movo-checkout-next-btn:hover{ background: #186E43; }

/* Checkout wizard step visibility — keyed off data-movo-step on the stable
   <form> root (see the JS comment above applyVisibility() for why this is
   NOT done via inline style on the fieldsets themselves: React resets
   those on its own re-renders). !important because the elements otherwise
   render at their normal, always-visible default. */
form.wc-block-checkout__form[data-movo-step="0"] .wp-block-woocommerce-checkout-shipping-method-block,
form.wc-block-checkout__form[data-movo-step="0"] .wp-block-woocommerce-checkout-shipping-methods-block,
form.wc-block-checkout__form[data-movo-step="0"] .wp-block-woocommerce-checkout-billing-address-block,
form.wc-block-checkout__form[data-movo-step="0"] .wp-block-woocommerce-checkout-payment-block,
form.wc-block-checkout__form[data-movo-step="0"] .wp-block-woocommerce-checkout-order-note-block,
form.wc-block-checkout__form[data-movo-step="0"] .wp-block-woocommerce-checkout-terms-block,
form.wc-block-checkout__form[data-movo-step="0"] .wp-block-woocommerce-checkout-actions-block{ display: none !important; }

form.wc-block-checkout__form[data-movo-step="1"] .wp-block-woocommerce-checkout-contact-information-block,
form.wc-block-checkout__form[data-movo-step="1"] .wp-block-woocommerce-checkout-shipping-address-block,
form.wc-block-checkout__form[data-movo-step="1"] .wp-block-woocommerce-checkout-payment-block,
form.wc-block-checkout__form[data-movo-step="1"] .wp-block-woocommerce-checkout-order-note-block,
form.wc-block-checkout__form[data-movo-step="1"] .wp-block-woocommerce-checkout-terms-block,
form.wc-block-checkout__form[data-movo-step="1"] .wp-block-woocommerce-checkout-actions-block{ display: none !important; }

form.wc-block-checkout__form[data-movo-step="2"] .wp-block-woocommerce-checkout-contact-information-block,
form.wc-block-checkout__form[data-movo-step="2"] .wp-block-woocommerce-checkout-shipping-address-block,
form.wc-block-checkout__form[data-movo-step="2"] .wp-block-woocommerce-checkout-shipping-method-block,
form.wc-block-checkout__form[data-movo-step="2"] .wp-block-woocommerce-checkout-billing-address-block,
form.wc-block-checkout__form[data-movo-step="2"] .wp-block-woocommerce-checkout-shipping-methods-block{ display: none !important; }

/* "Norēķinu adrese" (billing address, shown only when "Izmantot to pašu
   adresi rēķinam" is unchecked) sits in the DOM between shipping-address
   and shipping-methods — its native position, right after the Piegāde/
   Saņemt-uz-vietas toggle, made it look like it belonged to "Saņemt uz
   vietas" specifically. All of the form's step fieldsets are plain direct
   siblings (confirmed via a live DOM dump), so this reorders them visually
   with flex + "order" — no DOM move, none of the React-listener risk that
   applies to actually inserting/relocating nodes. Only billing-address
   changes position (after shipping-methods, i.e. below the whole Piegāde
   step's content); everything else keeps its natural order. */
form.wc-block-checkout__form{ display: flex !important; flex-direction: column !important; }
form.wc-block-checkout__form .wp-block-woocommerce-checkout-billing-address-block{ order: 3 !important; }
/* "Saņemt uz vietas" (pickup) selected → no delivery address needed, hide
   the "Piegādes adrese" block entirely. data-movo-pickup is set by the JS
   further down (watches the shipping-method option's own selected state). */
form.wc-block-checkout__form[data-movo-pickup="1"] .wp-block-woocommerce-checkout-billing-address-block{ display: none !important; }
form.wc-block-checkout__form .wp-block-woocommerce-checkout-shipping-methods-block{ order: 2 !important; }
form.wc-block-checkout__form .wp-block-woocommerce-checkout-payment-block{ order: 4 !important; }
form.wc-block-checkout__form .wp-block-woocommerce-checkout-order-note-block{ order: 5 !important; }
form.wc-block-checkout__form .wp-block-woocommerce-checkout-terms-block{ order: 6 !important; }
form.wc-block-checkout__form .wp-block-woocommerce-checkout-actions-block{ order: 7 !important; }
@media (max-width: 900px){
  .movo-cart-steps__inner{ flex-direction: column; align-items: stretch !important; }
  .movo-cart-steps__title{ font-size: 26px; }
  .movo-cart-steps__tabs{ width: 100%; }
  .movo-cart-steps__tab{ flex: 1 1 0; text-align: center; padding: 10px 8px; }
}

/* ============================================================ */
/* Cart page only (is_cart()) */
/* ============================================================ */
/* ===== Cart page — overall layout =====
   Deliberately NOT overriding display/grid-template-columns here — the
   block's own .wc-block-components-sidebar-layout is a flex row with
   percentage widths (main 65%, sidebar 35%) and its own container-query
   breakpoint (699px container width) for stacking to 1 column. Forcing
   display:grid with a fixed 360px track fought that: WC's native
   "sidebar { width:35% }" rule then computed 35% *of our 360px cell*
   (≈126px) instead of 35% of the row — squeezing the sidebar unusably
   narrow at in-between viewport widths. Only add visual polish here. */
.wp-block-woocommerce-cart.alignwide{ box-sizing: border-box !important; max-width: 1200px !important; margin-left: auto !important; margin-right: auto !important; padding: 0 24px !important; }
.wc-block-components-main{ padding-left: 40px !important; }
/* Deliberately NOT position:sticky on the summary sidebar — WooCommerce's
   own JS separately adds a "--sticky" class to the checkout button on
   scroll (switching *it* to position:fixed, pinned to the viewport bottom —
   a mobile "sticky buy bar" pattern that isn't scoped to mobile only). With
   our sidebar also sticky, the two independent sticky/fixed mechanisms
   fought each other: the button would detach to the bottom of the screen
   while the rest of the sticky sidebar stayed near the top, overlapping the
   totals. Simplest reliable fix: don't make the sidebar sticky at all, and
   neutralise WC's own sticky-button class everywhere (not just desktop). */
.wc-block-cart__submit-container--sticky{
  position: static !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  width: auto !important;
  z-index: auto !important;
  background: transparent !important;
  padding: 0 !important;
}
.wc-block-cart__submit-container--sticky:before{ display: none !important; }

/* ===== Cart items ===== */
.wc-block-cart-items{ border-top: 1px solid #14181B; }
.wc-block-cart-items__header{
  font: 700 11px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  letter-spacing: .06em; text-transform: uppercase; color: #5B6570;
}
.wc-block-cart-items__row{ padding: 20px 0 !important; border-bottom: 1px solid #DDE2E6 !important; align-items: flex-start !important; }
.wc-block-cart-item__image{ width: 120px !important; }
.wc-block-cart-item__image img{
  width: 120px !important; height: 120px !important; object-fit: contain !important;
  border: 1px solid #D7DCE0 !important; border-radius: 4px !important;
}
.wc-block-cart-item__product-name{ font-size: 16px !important; font-weight: 700 !important; color: #14181B !important; }
.wc-block-cart-item__total .wc-block-components-formatted-money-amount{ font-size: 18px !important; font-weight: 800 !important; color: #14181B !important; }
.wc-block-cart-item__quantity .wc-block-components-quantity-selector{ border-color: #D7DCE0 !important; border-radius: 4px !important; }
.wc-block-cart-item__remove-link{ color: #5B6570 !important; font-size: 13px !important; text-decoration: underline !important; }

/* ===== "Bieži pērk kopā" ===== */
.movo-cart-together{ max-width: 1200px; margin: 32px auto 0; padding: 0 24px; }
.movo-cart-together__kicker{
  font: 700 11px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  letter-spacing: .08em; text-transform: uppercase; color: #5B6570; margin-bottom: 14px;
}
.movo-cart-together__grid{ display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 16px; }
.movo-cart-together__card{ display: flex; flex-direction: column; }
.movo-cart-together__img{ display: block; aspect-ratio: 4/3; border: 1px solid #D7DCE0; border-radius: 4px; overflow: hidden; margin-bottom: 8px; }
.movo-cart-together__img img{ width: 100%; height: 100%; object-fit: contain; }
.movo-cart-together__name{
  font-size: 14px; font-weight: 600; color: #14181B; text-decoration: none;
  line-height: 1.35; margin-bottom: 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.movo-cart-together__price{ font-size: 14px; color: #5B6570; margin-bottom: 10px; }
.movo-cart-together__btn{ margin-top: auto; }
.movo-cart-together__btn .button.add_to_cart_button{
  display: block !important; width: 100% !important; text-align: center !important;
  border: 1px solid #D7DCE0 !important; background: #fff !important; color: #14181B !important;
  font: 700 12.5px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif !important;
  padding: 10px 14px !important; border-radius: 4px !important; text-decoration: none !important;
}
.movo-cart-together__btn .button.add_to_cart_button:hover{ background: #F7F8F9 !important; }
.movo-cart-together__btn .added_to_cart{ display: none !important; }

/* ===== Summary sidebar ===== */
.wp-block-woocommerce-cart-order-summary-block{ border: 1px solid #DDE2E6; border-radius: 6px; overflow: hidden; }
.movo-freeship-bar--cartpage{ margin: 0; }
/* The top-of-product-list copy only exists for mobile (see the render_block
   filter above) — hidden by default/desktop, shown only under the same
   900px breakpoint the rest of the mobile cart layout uses; the sidebar
   copy is hidden there instead so only one is ever visible at a time. */
.movo-freeship-bar--cartpage-top{ display: none; }
@media (max-width: 900px){
  .movo-freeship-bar--cartpage-top{ display: block; margin: 0 0 16px; }
  .movo-freeship-bar--cartpage{ display: none !important; }
}
/* Cart page order summary shows item price only — shipping isn't chosen
   until checkout, so the "Piegāde" row is hidden here (the "Kopā aptuveni"
   total is separately overwritten to match, via JS — see the free-shipping
   bar script above). */
body.woocommerce-cart .wp-block-woocommerce-cart-order-summary-shipping-block{ display: none !important; }

/* Shipping-options preview panel — informational only, appended at the
   bottom of the order-summary card. */
.movo-cart-shipping-preview{
  margin: 4px 20px 18px; padding: 12px 14px; background: #F7F8F9;
  border: 1px solid #EAECEE; border-radius: 6px;
}
.movo-cart-shipping-preview__title{
  font: 700 11px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  letter-spacing: .06em; text-transform: uppercase; color: #5B6570; margin-bottom: 10px;
}
.movo-cart-shipping-preview__opt{
  display: flex; align-items: center; gap: 8px; padding: 6px 4px; margin: 0 -4px;
  font-size: 13.5px; color: #14181B; cursor: pointer; border-radius: 4px;
}
.movo-cart-shipping-preview__opt:hover{ background: #EFF2F1; }
.movo-cart-shipping-preview__opt.is-selected{ background: #EAF6EF; }
.movo-cart-shipping-preview__opt.is-selected .movo-cart-shipping-preview__name,
.movo-cart-shipping-preview__opt.is-selected .movo-cart-shipping-preview__price{ font-weight: 700; }
.movo-cart-shipping-preview__opt input{ flex: 0 0 auto; margin: 0; accent-color: #1E8A4C; cursor: pointer; }
.movo-cart-shipping-preview__name{ flex: 1 1 auto; }
.movo-cart-shipping-preview__price{ font-weight: 700; color: #14181B; }
.movo-cart-shipping-preview__note{
  margin-top: 8px; padding-top: 8px; border-top: 1px solid #EAECEE;
  font-size: 12px; color: #5B6570; line-height: 1.4;
}
.wc-block-cart__totals-title{
  text-transform: uppercase !important; font-size: 12.5px !important; letter-spacing: .06em !important;
  color: #5B6570 !important; padding: 18px 20px 0 !important;
}
.wp-block-woocommerce-cart-order-summary-block .wc-block-components-totals-item{ padding: 10px 20px !important; }
.wp-block-woocommerce-cart-order-summary-block .wc-block-components-totals-footer-item{
  border-top: 1px solid #14181B !important; padding-top: 16px !important; margin-top: 6px !important;
}
.wp-block-woocommerce-cart-order-summary-block .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wp-block-woocommerce-cart-order-summary-block .wc-block-components-totals-footer-item .wc-block-components-totals-item__value{
  font-size: 20px !important; font-weight: 800 !important; color: #14181B !important;
}
.wc-block-cart__submit{ padding: 16px 20px 20px; }
.wc-block-cart__submit-button{
  background: #1E8A4C !important; border: none !important; border-radius: 6px !important;
  font-weight: 700 !important; width: 100% !important; padding: 14px !important;
}
.wc-block-cart__submit-button:hover{ background: #186E43 !important; }
.movo-cart-trustline{
  text-align: center; font-size: 12.5px; color: #5B6570; padding: 0 20px 18px;
}

/* Empty "store notices" wrapper sits right above the cart content and (with
   WooCommerce's own default padding) shows as a stray white box even when
   there's no actual message — only keep it visible when a real notice is inside. */
.wc-block-store-notices:not(:has(.wc-block-components-notice-banner)){
  display: none !important;
}
/* Also hide the native page-title "Grozs" heading — our own step banner
   already shows the title, so the plain one above it was a duplicate. */
.woocommerce-cart .entry-header,
.woocommerce-cart h1.wp-block-post-title{
  display: none !important;
}

@media (max-width: 900px){
  .wc-block-components-main{ padding-left: 0 !important; }
  .wp-block-woocommerce-cart-order-summary-block{ position: static; }
  .movo-cart-together__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 600px){
  .movo-cart-together__grid{ grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 12px !important; }
  .movo-cart-together__name{ font-size: 13px !important; }
  .movo-cart-together__price{ font-size: 13px !important; }
}

/* Overflow hardening — the WooCommerce cart table + together-grid cards
   need min-width:0 to actually shrink inside their grid/flex tracks on
   narrow screens instead of forcing the page wider than the viewport. */
@media (max-width: 900px){
  .wc-block-cart-items, .wc-block-cart-items table{ width: 100% !important; max-width: 100% !important; }
  /* Without table-layout:fixed, an auto-layout table sizes its columns to
     fit content (e.g. the price text) even past its own declared width —
     that's what was pushing the price cell (and the table itself) wider
     than the viewport and clipping it. Fixed layout makes columns actually
     respect the table's own width, wrapping/shrinking content instead. */
  .wc-block-cart-items table{ table-layout: fixed !important; }
  .wc-block-cart-item__total{ overflow-wrap: break-word !important; }
  .wc-block-cart-items__row{ min-width: 0 !important; }
  .wc-block-cart-item__product{ min-width: 0 !important; }
  .wc-block-cart-item__total{ min-width: 0 !important; }
  .movo-cart-together__card{ min-width: 0 !important; }
  .movo-cart-together__name{ overflow-wrap: break-word !important; }
  .wp-block-woocommerce-cart{ overflow-x: hidden !important; }
  /* WC's own loading "skeleton" shimmer placeholders render at a fixed
     pixel width (matching the eventual real content's estimated size)
     before the real content hydrates — on a narrow screen that placeholder
     can briefly be wider than the viewport, which is what let the page be
     nudged/dragged sideways for a moment while the cart was loading. */
  .wc-block-components-skeleton__element{ max-width: 100% !important; }
  html:has(body.woocommerce-cart){ overflow-x: hidden !important; }
  body.woocommerce-cart{ overflow-x: hidden !important; }
}

/* ============================================================ */
/* Checkout page only (movo_is_real_checkout_page()) */
/* ============================================================ */
/* ===== Checkout page — reuses the cart page's step-banner look ===== */
.movo-checkout-steps{ margin-bottom: 32px; }

/* ===== Overall layout — same box-sizing fix + centered width as cart ===== */
.wp-block-woocommerce-checkout.alignwide{
  box-sizing: border-box !important; max-width: 1200px !important;
  margin-left: auto !important; margin-right: auto !important; padding: 0 24px !important;
}
.woocommerce-checkout .entry-header,
.woocommerce-checkout h1.wp-block-post-title{ display: none !important; }

/* ===== Section boxes — every checkout step EXCEPT payment, styled like
   cards to match the cart items / order-summary boxes. Payment block is
   deliberately EXCLUDED from this selector list — its Montonio content is
   untouched, but the plain outer step wrapper (heading + spacing) around it
   still gets the same card treatment as the others for visual consistency.
   Kontaktinformācija is ALSO excluded here — unlike the others it is split
   into several independent cards (email / persona toggle / business fields)
   by the rules further below, instead of one shared card. ===== */
.wp-block-woocommerce-checkout-shipping-method-block,
.wp-block-woocommerce-checkout-shipping-address-block,
.wp-block-woocommerce-checkout-shipping-methods-block,
.wp-block-woocommerce-checkout-payment-block{
  border: 1px solid #D7DCE0 !important; border-radius: 8px !important; padding: 20px !important; margin-bottom: 18px !important;
  background: #fff !important; box-shadow: 0 1px 2px rgba(20,24,27,.04) !important;
}

/* Kontaktinformācija fieldset itself becomes a plain, borderless wrapper —
   its children (email field, persona toggle, business-fields group) each
   get their OWN card styling below instead of sharing one box. This is what
   lets the persona toggle render as an independent box "between the email
   box and the Piegādes adrese box", per the user's explicit request. */
.wp-block-woocommerce-checkout-contact-information-block{
  border: none !important; background: transparent !important; box-shadow: none !important;
  padding: 0 !important; margin-bottom: 0 !important;
}
.wp-block-woocommerce-checkout-contact-information-block .wc-block-components-checkout-step__heading{
  margin-bottom: 10px !important;
}

/* E-pasta adrese — its own independent card (email untouched otherwise).
   WC's own design floats the label INSIDE the input as a placeholder when
   empty, only moving above once focused/filled — chasing that with pixel
   offsets (an earlier version of this rule) never fully settled right
   across browsers. Simpler and fully robust instead: pin the label as a
   normal, always-visible line of text ABOVE the input (position: static,
   no WC transform/animation), so it can never overlap the input in any
   state. The ".wc-block-components-text-input" class is included in the
   selector purely to match WC's own ".is-active" rule's specificity (two
   classes) — otherwise WC's own higher-specificity is-active rule would
   still win while focused/filled and the label would jump back to its
   floating behaviour in that state. */
.wc-block-components-address-form__email{
  box-sizing: border-box !important;
  border: 1px solid #D7DCE0 !important; border-radius: 8px !important; padding: 16px 20px !important;
  background: #fff !important; box-shadow: 0 1px 2px rgba(20,24,27,.04) !important;
  margin: 0 0 18px !important;
  /* WC's markup order is <input> then <label> (the floating-label design
     relies on absolute positioning, not DOM order) — flex + "order" below
     visually puts the label first without touching that markup. */
  display: flex !important;
  flex-direction: column !important;
}
.wc-block-components-address-form__email.wc-block-components-text-input label{
  position: static !important;
  order: -1 !important;
  display: block !important;
  transform: none !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #5B6570 !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  background: none !important;
}
.wc-block-components-checkout-step__title{
  font-size: 15px !important; font-weight: 800 !important; color: #14181B !important;
  text-transform: uppercase; letter-spacing: .04em;
}
.wc-block-components-checkout-step__heading{ margin-bottom: 14px !important; }

/* Guest-checkout notice — plain small print below the cards (no box of its
   own), now that Kontaktinformācija's card is split into several boxes. */
.wc-block-checkout__guest-checkout-notice{ margin: 0 0 18px !important; font-size: 12.5px; color: #5B6570; }

/* Privātpersona / Juridiska persona — the real eu-vat-for-woocommerce
   checkbox+label stays in the DOM (never moved/removed — see the JS
   comment above), just visually hidden with an accessible-hide technique
   (not display:none, so it stays focusable/functional, just invisible and
   out of the flow) in favour of the .movo-persona-toggle pair above it. */
.movo-b2b-toggle{
  position: absolute !important; width: 1px !important; height: 1px !important;
  overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important;
}
.movo-b2b-hide{ display: none !important; }

/* The toggle itself is now its own independent card (border/shadow/bg),
   sitting between the E-pasta adrese card above and the Piegādes adrese
   card below — matching the seamless-card treatment used for the business
   fields group further down. */
.movo-persona-toggle{
  box-sizing: border-box !important;
  display: flex; gap: 10px;
  border: 1px solid #D7DCE0 !important; border-radius: 8px !important; padding: 16px 20px !important;
  background: #fff !important; box-shadow: 0 1px 2px rgba(20,24,27,.04) !important;
  margin: 0 0 18px !important;
}
.movo-persona-option{
  display: flex; align-items: center; gap: 8px; padding: 10px 16px;
  border: 1px solid #D7DCE0; border-radius: 6px; cursor: pointer;
  font-size: 14px; font-weight: 600; color: #14181B; background: #fff;
}
.movo-persona-option:hover{ border-color: #1E8A4C; }
.movo-persona-option.is-active{ border-color: #1E8A4C; background: #EAF6EF; }
.movo-persona-dot{
  flex: 0 0 auto; width: 16px; height: 16px; border-radius: 50%;
  border: 1.5px solid #B8BFC5; position: relative;
}
.movo-persona-option.is-active .movo-persona-dot{ border-color: #1E8A4C; }
.movo-persona-option.is-active .movo-persona-dot::after{
  content: ""; position: absolute; inset: 3px; border-radius: 50%; background: #1E8A4C;
}
@media (max-width: 480px){
  .movo-persona-toggle{ flex-direction: column; gap: 8px; }
}

/* Juridiskas personas fields (VAT + the 4 custom fields registered above) —
   grouped into their OWN card, visually separate from Kontaktinformācija's
   email field, WITHOUT moving them in the DOM (they're real React-managed
   checkout fields; moving nodes like this broke event handling elsewhere in
   this file — see the persona-toggle JS comment — so this is done with pure
   CSS instead: each field wrapper becomes one seamless "slice" of a single
   bordered card by removing the default gap between them and giving only
   the first/last slice a top/bottom border + corner radius. Kontakt-
   informācija's own card (the email field) is completely untouched.
   Labels use the same static-always-above treatment as the E-pasta adrese
   field just above — WC's floating-label math assumes zero wrapper
   padding, so ANY padding added here (even a little) makes it land the
   label half inside the input; chasing it with pixel offsets per state
   never fully settled right everywhere, so the floating behaviour is
   bypassed entirely instead. */
.wc-block-components-address-form__alg_eu_vat-billing_eu_vat_number,
.wc-block-components-address-form__movo-company-name,
.wc-block-components-address-form__movo-company-reg-number,
.wc-block-components-address-form__movo-company-bank-account,
.wc-block-components-address-form__movo-company-legal-address{
  box-sizing: border-box !important;
  background: #fff !important;
  border-left: 1px solid #D7DCE0 !important;
  border-right: 1px solid #D7DCE0 !important;
  padding: 10px 20px !important;
  margin: 0 !important;
  /* WC's markup order is <input> then <label> — flex + "order" on the
     label (below) visually puts it first without touching that markup. */
  display: flex !important;
  flex-direction: column !important;
}
.wc-block-components-address-form__alg_eu_vat-billing_eu_vat_number.wc-block-components-text-input label,
.wc-block-components-address-form__movo-company-name.wc-block-components-text-input label,
.wc-block-components-address-form__movo-company-reg-number.wc-block-components-text-input label,
.wc-block-components-address-form__movo-company-bank-account.wc-block-components-text-input label,
.wc-block-components-address-form__movo-company-legal-address.wc-block-components-text-input label{
  position: static !important;
  order: -1 !important;
  display: block !important;
  transform: none !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #5B6570 !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  background: none !important;
}
.wc-block-components-address-form__alg_eu_vat-billing_eu_vat_number{
  border-top: 1px solid #D7DCE0 !important;
  border-top-left-radius: 8px !important;
  border-top-right-radius: 8px !important;
  padding-top: 18px !important;
  margin-top: 18px !important;
}
.wc-block-components-address-form__movo-company-legal-address{
  border-bottom: 1px solid #D7DCE0 !important;
  border-bottom-left-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
  padding-bottom: 18px !important;
}

/* ===== Order-summary sidebar — same card look as the cart page ===== */
.wp-block-woocommerce-checkout-order-summary-block{ border: 1px solid #D7DCE0; border-radius: 8px; overflow: hidden; box-shadow: 0 1px 2px rgba(20,24,27,.04); }
/* Mobile: this same block is moved (via JS) to the top of the form, above
   every fieldset — give it the same bottom spacing as the other cards. */
.checkout-order-summary-block-fill-wrapper{ margin-bottom: 18px !important; }
.movo-checkout-stocknotice{
  display: flex; align-items: flex-start; gap: 8px;
  margin: 16px 20px 0; padding: 10px 12px; background: #EAF6EF; border: 1px solid #CDE9D8;
  border-radius: 6px; font-size: 12.5px; line-height: 1.5; color: #14181B;
}
.movo-checkout-stocknotice svg{ flex: 0 0 auto; width: 16px; height: 16px; margin-top: 2px; }

/* Kopējā informācija step, mobile only: the order-summary card sits at the
   BOTTOM here (see the moveSummary() script above) right before "Turpināt
   pirkumu" — trimmed down since it's no longer the first thing on the page
   the way it is on the other steps: drops the stock/cutoff notice and the
   "Piegāde" cost row (redundant this early — shipping method hasn't even
   been chosen yet, that happens on the next step), and tightens the
   internal row spacing so the whole card takes up less vertical space. */
@media (max-width: 900px){
  form.wc-block-checkout__form[data-movo-step="0"] .movo-checkout-stocknotice,
  form.wc-block-checkout__form[data-movo-step="0"] .wp-block-woocommerce-checkout-order-summary-shipping-block{
    display: none !important;
  }
  form.wc-block-checkout__form[data-movo-step="0"] .wc-block-components-checkout-step__heading{
    padding: 14px 20px !important; margin: 0 !important;
  }
  form.wc-block-checkout__form[data-movo-step="0"] .wc-block-components-order-summary-item{
    padding-top: 10px !important; padding-bottom: 10px !important;
  }
  form.wc-block-checkout__form[data-movo-step="0"] .wc-block-components-totals-item{
    padding-top: 8px !important; padding-bottom: 8px !important;
  }
}

/* ===== Mobile order-summary toggle bar ("Pasūtījuma kopsavilkums · total ⌄") —
   native WC element, only rendered client-side below the ~700px container
   breakpoint. Restyled into a tidy tappable bar instead of its bare default. ===== */
.wc-block-components-checkout-order-summary__title{
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  gap: 10px; padding: 16px 20px !important; margin: 0 !important; cursor: pointer;
  border: none !important;
}
.wc-block-components-checkout-order-summary__title-text{
  margin: 0 !important; font-size: 14px !important; font-weight: 700 !important; color: #14181B !important;
  flex: 1 1 auto;
}
.wc-block-components-checkout-order-summary__title-price{
  font-size: 16px !important; font-weight: 800 !important; color: #14181B !important;
}
.wc-block-components-checkout-order-summary__title-icon{ flex: 0 0 auto; display: flex; color: #5B6570; }
.wc-block-components-checkout-order-summary__content{ border-top: 1px solid #EDEFF1; }

@media (max-width: 900px){
  .wp-block-woocommerce-checkout-shipping-method-block,
  .wp-block-woocommerce-checkout-shipping-address-block,
  .wp-block-woocommerce-checkout-shipping-methods-block,
  .wp-block-woocommerce-checkout-payment-block{ padding: 16px !important; margin-bottom: 14px !important; }
  .movo-persona-toggle{ padding: 16px !important; margin-bottom: 14px !important; }
  .wc-block-components-address-form__email{ padding: 16px !important; margin-bottom: 14px !important; }
  /* Comfortable tap targets — taller text inputs + more room between form rows. */
  .wc-block-components-text-input input,
  .wc-block-components-address-form select{ min-height: 46px !important; font-size: 16px !important; }
  .wc-block-components-address-form .wc-block-components-text-input,
  .wc-block-components-address-form .wc-block-components-country-input,
  .wc-block-components-address-form .wc-block-components-state-input{ margin-bottom: 12px !important; }

  /* Hide the collapsed "Pasūtījuma kopsavilkums" peek bar that WC Blocks
     shows at the very top on mobile (a second, redundant render of the
     order summary — the full version is moved to the top instead by the
     wp_footer script below, via a separate fill/slot). */
 /* .wc-block-components-sidebar.wc-block-checkout__sidebar{ display: none !important; }*/
.wc-block-components-sidebar-layout.wc-block-checkout{
    display: flex !important; flex-direction: column !important;
  }
  .wc-block-components-sidebar.wc-block-checkout__sidebar{
    display: block !important; width: 100% !important; max-width: none !important;
    padding-left: 0 !important; padding-right: 0 !important; order: -1 !important;
  }
  .wc-block-components-main.wc-block-checkout__main{
    width: 100% !important; max-width: none !important;
    padding-left: 0 !important; order: 0 !important;
  }
  .wc-block-components-sidebar-layout.wc-block-checkout:has(form[data-movo-step="0"]) .wc-block-components-sidebar.wc-block-checkout__sidebar{
    order: 1 !important;
  }
  .wc-block-components-checkout-order-summary__content{ display: block !important; }
  .wc-block-components-checkout-order-summary__title{
    cursor: default !important; pointer-events: none !important;
  }
  .wc-block-components-checkout-order-summary__title-icon{ display: none !important; }
  /* Montonio's own bank-transfer logo grid — only the LAYOUT (columns/sizing)
     is touched here, never the logos, plugin markup, or bank list itself
     (per instruction: don't modify the Montonio plugin or its bank logos).
     Montonio's own CSS fixes each card at a hard 100x100px, which only fits
     2 per row on a phone-width screen; overridden to a responsive 3-column
     grid so the same cards just take less vertical space. !important is
     needed because Montonio injects its CSS at runtime, after this block. */
  .montonio-bank-items{
    display: grid !important; grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
  }
  .montonio-bank{
    width: 100% !important; height: auto !important; aspect-ratio: 1 / 1 !important;
    padding: 8px !important; margin: 0 !important;
  }
}

/* cart + mini-cart row: lay the three cells into real columns */
.wc-block-cart-items__row {
  grid-template-columns: 80px 1fr auto !important;  /* image | details (fills) | line-total */
  gap: 12px !important;
  align-items: start !important;
}
.wc-block-cart-item__image {
  width: 80px !important;   /* reserve space for the 64px img + padding */
}