/* Site-wide theme fixes. Loaded on every page (base_meta, product_meta). */
/* Keyboard focus stays visible in the header; the theme resets outlines. */
html body .root .header a:focus-visible,html body .root .header button:focus-visible,html body .root .header input:focus-visible{outline:3px solid #ff7c1b!important;outline-offset:3px!important}

/* Owner 17.10: native size choices stay compact. */
.root:not(.cq-s08-page) .product__weight{display:flex;flex-wrap:nowrap;align-items:stretch;gap:8px;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}
.root:not(.cq-s08-page) .product__weight>.weight{flex:0 0 auto;width:auto;min-width:0;max-width:none;margin:0}
.root:not(.cq-s08-page) .product__weight>.weight>span{display:inline-flex;align-items:center;justify-content:center;min-height:44px;width:auto;padding:8px 14px;box-sizing:border-box;white-space:nowrap}

/* Viewing indicator belongs to the viewing phrase, never to the review count. */
.root .page-info::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:#3ddc84;margin-right:8px;vertical-align:middle}

/* Preserve the original compact floating navigation; the new corporate link stays in the full header and burger menu. */
.root .cq-header-island .header__nav>[data-cq-corporate-menu]{display:none}

/* Price controls follow the composition in normal flow, with a readable gap. */
.root .product__main>.product__content{margin-bottom:32px}

/* Owner 21.10: the language switcher stays inside the main mobile menu and never covers an open submenu. */
.root .nav-mobile__primary{z-index:0}
.root .nav-mobile:has(.nav-mobile__secondary.open) .nav-mobile__lng{visibility:hidden}
/* Phone and city buttons under the open menu header: a solid band behind them, and they no longer touch at 320 px. */
@media(max-width:767.98px){.nav-open .header::before{content:"";position:absolute;left:0;right:0;top:100%;height:48px;background-color:var(--dark);pointer-events:none}}
@media(max-width:374.98px){.nav-open .header :is(.header__phone--sm,.header__city){padding:4px 10px;font-size:14px}}

/* Owner 21.10: one minimal gap between page blocks and one card padding (theme margins were 0-90 px, Codex cards 14-48 px).
   :not(#cq-x) only raises specificity above the theme's own !important spacing rules. */
:root{--cq-gap:24px;--cq-pad:24px;--cq-pad-sm:16px;--cq-radius:12px}
@media(min-width:768px){:root{--cq-gap:32px;--cq-pad:40px;--cq-pad-sm:20px}}
html body .root:not(.root--home):not(:has(.cart-body)) :is(.main,.page)>.container>:not(#cq-x),
html body .root:not(.root--home):not(:has(.cart-body)) .product__main>:not(#cq-x),
html body .root:not(.root--home):not(:has(.cart-body)) .page>:is(.section,.map),
html body .root:not(.root--home):not(:has(.cart-body))>:is(.selection-section,.cq-inner-service-band){margin-top:0!important;margin-bottom:var(--cq-gap)!important}
/* The last block of .main keeps the 24/32 gap to the footer (.main has no bottom padding; .page has its own). */
html body .root:not(.root--home):not(:has(.cart-body)) :is(.page>.container,.product__main)>:not(#cq-x):last-child{margin-bottom:0!important}
html body .root:not(.root--home):not(:has(.cart-body)) :is(.main>.container,.page>.container,.product__main)>:not(#cq-x)>:first-child{margin-top:0!important}
html body .root:not(.root--home):not(:has(.cart-body)) :is(.main>.container,.page>.container,.product__main)>:not(#cq-x)>:last-child{margin-bottom:0!important}
html body .root:not(.root--home):not(:has(.cart-body)) .page>.container:not(:last-child){margin-bottom:var(--cq-gap)!important}
/* The shop page wraps its blocks in one more unnamed div (theme gap 80 px). */
html body .root:not(.root--home):not(:has(.cart-body)) :is(.main,.page)>.container>:not([class])>:not(#cq-x){margin-top:0!important;margin-bottom:var(--cq-gap)!important}
html body .root:not(.root--home):not(:has(.cart-body)) :is(.main,.page)>.container>:not([class])>:not(#cq-x):last-child{margin-bottom:0!important}
html body .root .shop-header:not(#cq-x){padding-top:0!important;padding-bottom:0!important}
html body .root .product-header:not(#cq-x){margin-bottom:var(--cq-pad-sm)!important}
/* Shop product: filling cards that had not loaded yet kept a square placeholder and stretched the slider by 66 px. */
html body .root .cq-shop-filling-group .item-filling img{aspect-ratio:91/58;width:100%;height:auto}
html body .root .cq-shop-selected-filling-badges:not(#cq-x){margin-top:12px!important}
/* Shop product: options column to the stories block is one block gap (was 56-71 px). */
html body .root .row:has(>.cq-product-cro--home-stories)>.col-xl-6>:not(#cq-x):last-child{margin-bottom:0!important}
html body .root .row:has(>.cq-product-cro--home-stories):not(#cq-x){row-gap:var(--cq-gap)!important}
html body .root .cq-product-cro--home-stories:not(#cq-x),html body .root .cq-product-cro--home-stories>.cq-home-stories-section:not(#cq-x){margin-top:0!important}
html body .root .advantages__item:not(#cq-x){padding:24px!important}
html body .root .cq-brands-section:not(#cq-x){border-radius:var(--cq-radius)!important}
html body .root:not(.root--home):not(:has(.cart-body)) :is(.main,.page)>.container>:not(#cq-x):is(.breadcrumb,.page-info,.cq-product-cro--after-page-info){margin-bottom:12px!important}
/* Catalog intro card: on phones the theme frames .card__main and leaves .card transparent. */
html body .root:not(.root--home):not(:has(.cart-body)) :is(.main,.page)>.container>:not(#cq-x).card{padding:0!important}
@media(min-width:768px){html body .root:not(.root--home):not(:has(.cart-body)) :is(.main,.page)>.container>:not(#cq-x).card{padding:var(--cq-pad)!important}}
/* The filling picker kept 23 px of empty space under its card. */
html body .root:not(.root--home):not(:has(.cart-body))>.selection-section>.selection-container{padding-bottom:0!important}
/* The stories slider kept an 18 px theme margin under its arrows. */
html body .root:not(.root--home):not(:has(.cart-body)) .cq-product-home-stories{margin-bottom:0!important}
/* The decorative gold rails stay visible (as on prod) but take no room: drawn in the middle of the 24/32 px gap, they no longer add to it. */
html body .root .cq-home-transition:not(#cq-x):not(#cq-y){height:0!important;min-height:0!important;margin:0!important;padding:0!important;overflow:visible!important;transform:translateY(calc(var(--cq-gap)/-2))!important}
html body .root--home .section__showcase>.cq-home-transition:not(#cq-x):not(#cq-y){transform:translateY(calc(var(--cq-row)/-2))!important}
/* In the home grid the rail is a 0 px row with a gap on each side: the next row moves up by one gap (2 columns from 1260 px). */
html body .root--home .section__showcase>.cq-home-transition+.showcase:not(#cq-x){margin-top:calc(var(--cq-row)*-1)!important}
@media(min-width:1260px){html body .root--home .section__showcase>.cq-home-transition+.showcase+.showcase:not(#cq-x){margin-top:calc(var(--cq-row)*-1)!important}}
/* Framed blocks: theme card padding and radius. */
html body .root :is(.cq-closer-look,.cq-inner-process,[data-cq-corporate] .cp-card,.s09-narrow,.final-order,.faq,.cqfo-fulfillment-card,.cq-inner-service){padding:var(--cq-pad)!important;border-radius:var(--cq-radius)!important}
/* White plates «Пример изделия» and «Калорийность»: nested padding 16/20; the «Ближе к делу» slider window: radius 12. */
html body .root :is(.card-item__info,.product-info):not(#cq-x){padding:var(--cq-pad-sm)!important;border-radius:var(--cq-radius)!important}
html body .root .cq-closer-look__shell:not(#cq-x){border-radius:var(--cq-radius)!important}
html body .root :is([data-cq-corporate] .cp-fact,[data-cq-corporate] .cp-row,[data-cq-corporate] .cp-offer,.cq-inner-story-card,.cq-inner-step,.cq-home-flow-card,.cq-home-trust-card:not(.cq-home-trust--product-service>*)){padding:var(--cq-pad-sm)!important;border-radius:var(--cq-radius)!important}
/* The three small cards on order pages («Цена фиксируется», «Учтем аллергены», «Лабораторные испытания») keep the compact prod size (owner 22.10). */
html body .root :is(.cq-s08__size-price,.cq-home-story-card,.cq-home-proof-hub,.product-card,.shop-item,.selection,.card__box){border-radius:var(--cq-radius)!important}

/* Home: the same gap between blocks (theme gaps were 20-70 px). The showcase grid keeps 16 px between its own cards on phones. */
html body .root--home>.container>:not(#cq-x),
html body .root--home .main>.container>.section:not(#cq-x){margin-top:0!important;margin-bottom:var(--cq-gap)!important}
html body .root--home .section__showcase{--cq-row:16px;row-gap:var(--cq-row)!important}
@media(min-width:768px){html body .root--home .section__showcase{--cq-row:var(--cq-gap)}}
html body .root--home .section__showcase>:not(#cq-x):not(.showcase){margin-top:calc(var(--cq-gap) - var(--cq-row))!important;margin-bottom:calc(var(--cq-gap) - var(--cq-row))!important}
html body .root--home .section__showcase>:not(#cq-x)>:not(#cq-x):last-child{margin-bottom:0!important}
html body .root--home .main .section.order-3>.section__header{margin-top:0!important;margin-bottom:var(--cq-pad-sm)!important}
html body .root--home .cq-home-proof-hub{padding:var(--cq-pad)!important}
html body .root--home .cq-home-proof-hub__cards{padding-bottom:0!important}
html body .root--home .cq-home-proof-card{padding:var(--cq-pad-sm)!important;border-radius:var(--cq-radius)!important}
html body .root--home .cq-home-flow-section{padding-top:var(--cq-pad)!important;padding-bottom:var(--cq-pad)!important}
html body .root--home :is(.cq-home-trust-card,.showcase){border-radius:var(--cq-radius)!important}
/* Long card text (pickup hours) is shown in full: the card grows instead of the text running under the arrow. */
html body .root--home .cq-home-proof-card:not(#cq-x){height:auto!important}
html body .root--home .cq-home-proof-card small:not(#cq-x){max-height:none!important;overflow:visible!important}

/* The last mobile menu row stays reachable above the browser toolbar on small phones. */
.root .nav-mobile__primary{padding-bottom:calc(32px + env(safe-area-inset-bottom,0px));box-sizing:border-box}
/* Owner 24.10, real iPhone: round social buttons (overflow:hidden + radius) inside the scrolling menu were cut in half while scrolling.
   Their own drawing layer and no clipping keep them whole; the icon is exactly the 40 px circle, so nothing spills. */
.root .nav-mobile .btn-social{overflow:visible;-webkit-transform:translateZ(0);transform:translateZ(0)}

/* Six footer social buttons fit inside the card on narrow phones. */
@media(max-width:400px){.root .footer__buttons{gap:6px}.root .footer__buttons .btn-social{width:36px;height:36px}}

/* The step after the trust row keeps the 24/32 px block gap on every /kupit/ page. */
html body .root .cq-product-cro--before-description+[data-info-group]:not(#cq-x){margin-top:24px!important}
@media(min-width:768px){html body .root .cq-product-cro--before-description+[data-info-group]:not(#cq-x){margin-top:32px!important}}
/* Phone menu, de: «Bestellung aufgeben» reached the screen edge at 32 px; the size follows the screen width (other languages fit). */
html[lang^="de"] .nav-mobile__parent:not(#cq-x){font-size:min(32px,calc((100vw - 30px)/11.4))!important}
/* Owner 23.10: phones and tablets show «Выберите начинку» right under the photo (cq_fill_under_photo.tpl moves the block). */
html body .root .selection.cq-fill-empty:not(#cq-x){display:none!important}
/* /kupit/ pastries: the filling step stays in place in the page (the order steps follow each other there) and is only shown first in its column. */
@media(max-width:1259.98px){html body .root .col-xl-6:has(>.cq-shop-filling-group--pirozhnie):not(#cq-x){display:flex;flex-direction:column}html body .root .col-xl-6>.cq-shop-filling-group--pirozhnie:not(#cq-x){order:-1;margin-top:0!important;margin-bottom:24px!important}}
@media(min-width:768px) and (max-width:1259.98px){html body .root .col-xl-6>.cq-shop-filling-group--pirozhnie:not(#cq-x){margin-bottom:32px!important}}
/* Owner 23.10: «Купить в 1 клик» and the works gallery on /kupit/ cakes and bento lie above the site header (1200) and close
   with the same orange cross in the screen corner; the gallery has one «Выбрать эту работу» button for the shown photo. */
html body .fancybox__container:has(:is(#order,#order_success,#buyOneClick,#gallery,#not_filled,#added_to_cart)):not(#cq-x){z-index:1300}
/* The «Вы не выбрали предыдущий пункт» hint lies above the site header too (both were 1200). */
html body .float-notification[data-notification]:not(#cq-x){z-index:1300}
html body #gallery:not(#cq-x){position:relative}
html body #gallery>.cq-gallery-pick:not(#cq-x){position:absolute;left:50%;bottom:16px;z-index:5;margin-left:-110px;width:220px;white-space:nowrap}
/* iOS: Swiper gives every slide its own drawing layer (backface-hidden); with 109 slides that alone ran the page out of memory. */
html body #gallery .swiper-slide:not(#cq-x){transform:none!important;backface-visibility:visible!important}
html body #gallery [data-modal-gallery].cq-gallery-near .swiper-slide:not(.cq-near):not(#cq-x){visibility:hidden}
/* Owner 23.10: on phones the works and filling carousels under the open gallery got a drawing layer per slide (74–76 layers); hide them while the gallery is open. */
html body:has(.fancybox__container #gallery) #up :is([data-cakes],[data-filling]):not(#cq-x){visibility:hidden}
html body :is(#order,#order_success,#buyOneClick,#gallery)>.modal__close:not(#cq-x){background:rgba(25,25,25,.85);color:#ff7c1b}
html body :is(#order,#order_success,#buyOneClick,#gallery)>.modal__close:not(#cq-x) svg{fill:currentColor}
html body :is(#order,#order_success,#buyOneClick,#gallery)>.modal__close:not(#cq-x):focus-visible{outline:3px solid #ff7c1b;outline-offset:2px}
/* Phones and tablets: the works grid shows the same orange «Выбрать» / «Выбрано» as the PC; the whole card stays tappable. */
@media(max-width:1259.98px){html body .cake-item__check:not(#cq-x)::before{display:none}html body .cake-item__check:not(#cq-x)::after{top:auto;left:auto;right:8px;bottom:8px;width:auto;height:auto;padding:9px 14px;border-radius:20px;background-color:var(--orange,#ff7c1b);color:#fff;font-weight:600;font-size:12px;line-height:14px;white-space:nowrap;content:attr(data-check-in)}html body .cake-item__check.added:not(#cq-x)::after{content:attr(data-check-out)}}
