/* Shared overlays and helper controls. Functional vendor widget CSS stays loaded. */
:root { --koi-cookie-clearance: 0px; }
html { scroll-padding-block-end: calc(var(--koi-cookie-clearance) + 5rem); }
html.koi-has-cookie-banner body { padding-block-end: var(--koi-cookie-clearance); }
:where(a, button, input, select, textarea, summary, [tabindex]) {
  scroll-margin-block-start: 7rem;
  scroll-margin-block-end: calc(var(--koi-cookie-clearance) + 5rem);
}

/* Sharing is a disclosure; links and actions keep their native semantics. */
.koi-share { position: relative; display: inline-grid; min-width: 0; max-width: 100%; }
.koi-share__button,
.koi-share__menu :is(button, a),
.koi-zoom-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-width: 2.75rem;
  min-height: 2.75rem;
  padding: .65rem 1rem;
  border: 1px solid #c6cbc7;
  border-radius: var(--koi-radius-sm);
  background: var(--koi-surface);
  color: var(--koi-ink);
  font: 600 .875rem/1.4 var(--koi-font-ui);
  text-decoration: none;
  cursor: pointer;
}
.koi-share__button svg,
.koi-zoom-trigger svg {
  flex: 0 0 1.125rem;
  width: 1.125rem;
  height: 1.125rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.koi-share__button:hover,
.koi-share__button[aria-expanded="true"],
.koi-share__menu :is(a, button):hover,
.koi-zoom-trigger:hover { background: var(--koi-bg); border-color: var(--koi-ink); }
.koi-share__menu {
  position: absolute;
  inset-block-start: calc(100% + .5rem);
  inset-inline-end: 0;
  z-index: 10001;
  display: grid;
  width: max-content;
  min-width: min(13rem, 80vw);
  max-width: min(20rem, calc(100vw - 2rem));
  max-height: calc(100dvh - 2rem);
  overflow-y: auto;
  padding: .375rem;
  border: 1px solid #c6cbc7;
  border-radius: var(--koi-radius);
  background: var(--koi-surface);
  box-shadow: 0 .75rem 2rem rgb(9 13 14 / .12);
}
.koi-share__menu[hidden] { display: none; }
.koi-share__menu.is-above { inset-block-start: auto; inset-block-end: calc(100% + .5rem); }
.koi-share__menu :is(a, button) { justify-content: flex-start; width: 100%; border: 0; text-align: start; overflow-wrap: anywhere; }
.koi-share__status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.koi-share--loop { margin: .5rem 1rem 1rem; }
.food-product-card .koi-share--loop { margin-inline: 0; }

.woocommerce .flex-control-thumbs img[role="button"] { cursor: pointer; }
.woocommerce .flex-control-thumbs img[aria-pressed="true"] { box-shadow: 0 0 0 2px var(--koi-red); }
.woocommerce .flex-control-thumbs img[role="button"]:focus-visible { outline: 3px solid var(--koi-red); outline-offset: 5px; }

/* Image magnification is explicit; the image itself is never cropped in the dialog. */
.koi-loupe-frame { position: relative; isolation: isolate; touch-action: pan-y; }
.koi-zoom-trigger { position: absolute; inset-inline-end: .75rem; inset-block-end: .75rem; z-index: 3; box-shadow: 0 .25rem .75rem rgb(9 13 14 / .12); }
.koi-loupe-overlay {
  position: absolute;
  z-index: 2;
  width: min(15rem, 30vw);
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 2px solid var(--koi-surface);
  border-radius: var(--koi-radius-sm);
  background: var(--koi-surface);
  box-shadow: 0 .5rem 1.5rem rgb(9 13 14 / .2);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -50%);
}
.koi-loupe-overlay-image,
.woocommerce div.product div.images .koi-loupe-overlay-image { position: absolute; max-width: none; max-height: none; object-fit: fill; border: 0; border-radius: 0; padding: 0; margin: 0; background: transparent; pointer-events: none; }
.koi-loupe-frame.is-loupe-active .koi-loupe-overlay { opacity: 1; }
.koi-image-inspector-open { overflow: hidden; }
.koi-image-inspector {
  position: fixed;
  inset: 0;
  z-index: 100100;
  display: grid;
  place-items: center;
  padding: max(1rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));
  overscroll-behavior: contain;
}
.koi-image-inspector[hidden] { display: none; }
.koi-image-inspector__backdrop { position: absolute; inset: 0; background: rgb(9 13 14 / .94); }
.koi-image-inspector__panel { position: relative; z-index: 1; display: grid; justify-items: center; gap: 1rem; width: min(75rem, 100%); max-height: 100%; }
.koi-image-inspector__image { display: block; width: auto; max-width: 100%; max-height: calc(100vh - 7rem); max-height: calc(100dvh - 7rem); object-fit: contain; background: var(--koi-surface); touch-action: pinch-zoom; }
.koi-image-inspector__close { position: absolute; inset-block-start: .5rem; inset-inline-end: .5rem; display: grid; place-items: center; width: 3rem; height: 3rem; padding: 0; border: 1px solid #fff; border-radius: 50%; background: var(--koi-dark); color: #fff; font: 400 2rem/1 var(--koi-font-ui); cursor: pointer; }
.koi-image-inspector__hint { margin: 0; color: #fff; font: 400 .875rem/1.5 var(--koi-font-ui); text-align: center; }
.koi-image-inspector :focus-visible { outline: 3px solid #fff; outline-offset: 4px; }

/* Consent has equal-sized decisions and readable details; it remains nonmodal. */
.koi-cookie-banner {
  inset-inline: 1rem;
  bottom: max(1rem, env(safe-area-inset-bottom));
  z-index: 10000;
  width: calc(100% - 2rem);
  max-width: 68rem;
  max-height: min(38rem, calc(100vh - 13rem));
  max-height: min(38rem, calc(100dvh - 13rem));
  gap: 1rem 2rem;
  padding: 1.5rem;
  border-color: #c6cbc7;
  border-radius: var(--koi-radius-lg);
  background: var(--koi-surface);
  color: var(--koi-ink);
  box-shadow: 0 .5rem 2rem rgb(9 13 14 / .14);
  font-family: var(--koi-font-ui);
}
.koi-cookie-banner h2 { margin-block-end: .5rem; font-size: 1.125rem; font-weight: 650; }
.koi-cookie-banner :is(p, label, small, a),
.koi-cookie-banner__optional :is(strong, small) { font-size: .875rem; line-height: 1.55; }
.koi-cookie-banner__actions { gap: .75rem; margin-block-end: .5rem; }
.koi-cookie-banner button { min-height: 3rem; padding: .75rem 1rem; border-radius: var(--koi-radius-sm); background: var(--koi-dark); font-size: .875rem; font-weight: 600; }
.koi-cookie-banner [data-koi-cookie-accept] { border-color: var(--koi-red); background: var(--koi-red); color: #fff; }
.koi-cookie-banner [data-koi-cookie-accept]:hover { border-color: var(--koi-red-hover); background: var(--koi-red-hover); }
.koi-cookie-banner [data-koi-cookie-necessary] { border-color: #737b75; background: var(--koi-surface); color: var(--koi-ink); }
.koi-cookie-banner [data-koi-cookie-necessary]:hover { background: var(--koi-bg); }
.koi-cookie-banner label { min-height: 2.75rem; align-items: center; }
.koi-cookie-banner input[type="checkbox"] { flex-basis: 1.25rem; width: 1.25rem; height: 1.25rem; accent-color: var(--koi-red); }
.koi-cookie-banner__details summary { display: flex; align-items: center; min-height: 2.75rem; padding: .5rem 0; font-size: .875rem; }
.koi-cookie-banner nav a { display: inline-flex; align-items: center; min-height: 2.75rem; }
.koi-cookie-banner :focus-visible,
.koi-cookie-settings:focus-visible { outline: 3px solid var(--koi-red); outline-offset: 3px; }
.koi-cookie-settings, .koi-cookie-status { font: 400 .875rem/1.5 var(--koi-font-ui); }

/* Advice stays in a quiet, compact black panel. Vendor keyboard sizing stays active. */
.koi-ai-support {
  --koi-ai-ink: var(--koi-dark);
  --koi-ai-red: var(--koi-red);
  --koi-ai-paper: #fff;
  --koi-ai-muted: #c9cfcb;
  right: max(16px, env(safe-area-inset-right));
  bottom: calc(max(16px, env(safe-area-inset-bottom)) + var(--koi-cookie-clearance));
  font-family: var(--koi-font-ui);
}
.koi-ai-support .koi-ai-support__launcher { width: 56px; height: 56px; border: 1px solid #6c746f; background: var(--koi-dark); box-shadow: 0 .25rem 1rem rgb(9 13 14 / .16); transition: background-color 140ms ease; }
.koi-ai-support .koi-ai-support__launcher:is(:hover, :focus-visible) { transform: none; box-shadow: 0 .25rem 1rem rgb(9 13 14 / .2); background: #252c28; }
.koi-ai-support .koi-ai-support__launcher img { width: 44px; height: 44px; filter: none; }
.koi-ai-support__pulse { width: 10px; height: 10px; inset: 2px 2px auto auto; box-shadow: none; }
.koi-ai-support .koi-ai-support__panel { bottom: 68px; max-height: min(44rem, calc(100dvh - 7rem - var(--koi-cookie-clearance))); grid-template-rows: auto minmax(0, 1fr) auto; border-color: #626c65; border-radius: var(--koi-radius-lg); background: var(--koi-dark); box-shadow: 0 1rem 3rem rgb(9 13 14 / .22); }
.koi-ai-support__head { gap: 1rem; }
.koi-ai-support .koi-ai-support__identity strong { font-size: 1rem; font-weight: 650; line-height: 1.3; }
.koi-ai-support .koi-ai-support__identity span { font-size: .875rem; line-height: 1.4; }
.koi-ai-support .koi-ai-support__head button { flex: 0 0 44px; width: 44px; height: 44px; padding: 0; }
.koi-ai-support .koi-ai-support__message { font-size: .9375rem; line-height: 1.55; border-radius: var(--koi-radius); overflow-wrap: anywhere; }
.koi-ai-support .koi-ai-support__choice { min-height: 2.75rem; border-radius: var(--koi-radius-sm); font-size: .875rem; font-weight: 600; }
.koi-ai-support .koi-ai-support__choice:is(:hover, :focus-visible) { transform: none; }
.koi-ai-support .koi-ai-support__form textarea { font-size: 1rem; line-height: 1.5; border-radius: var(--koi-radius-sm); }
.koi-ai-support .koi-ai-support__form button { border-radius: var(--koi-radius-sm); font-size: .875rem; font-weight: 600; text-transform: none; }
.koi-ai-support .koi-ai-support__form .koi-ai-support__cookie-link { min-height: 2.75rem; padding-block: .5rem; }
.koi-ai-support :focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

/* The language picker retains TranslatePress keyboard/open/hidden behavior. */
nav.trp-floating-switcher {
  --bg: var(--koi-surface);
  --bg-hover: var(--koi-bg);
  --text: var(--koi-ink);
  --text-hover: var(--koi-ink);
  --font-size: .875rem;
  --border-radius: .75rem;
  --switcher-padding: .25rem;
  --transition-duration: 140ms;
  z-index: 9997;
  right: auto;
  left: max(16px, env(safe-area-inset-left));
  bottom: calc(max(16px, env(safe-area-inset-bottom)) + var(--koi-cookie-clearance));
  width: max-content;
  max-width: min(17rem, calc(100vw - 104px));
  border: 1px solid #c6cbc7;
  border-radius: var(--koi-radius);
  padding: 4px;
  background: var(--koi-surface);
  box-shadow: 0 .25rem 1rem rgb(9 13 14 / .1);
}
nav.trp-floating-switcher.is-open { z-index: 10002; width: min(12rem, calc(100vw - 32px)); max-width: calc(100vw - 32px); }
.trp-floating-switcher .trp-language-item { box-sizing: border-box; min-height: 44px; padding: 10px 12px; }
.trp-floating-switcher .trp-language-item .trp-flag-image { flex: 0 0 var(--flag-size, 18px); }
.trp-floating-switcher .trp-language-item-name { color: var(--koi-ink); font-size: .875rem; min-width: 0; flex: 1 1 auto; white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: break-word; word-break: normal; font-family: var(--koi-font-ui); }
.trp-floating-switcher .trp-current-language-item__wrapper { min-height: 44px; }
/* Use the vendor synchronous branch; a missed transitionend must not lock list scrolling. */
.trp-floating-switcher .trp-switcher-dropdown-list { transition: none; }
.trp-floating-switcher.is-open .trp-switcher-dropdown-list { max-height: min(22rem, var(--koi-language-list-height, calc(100dvh - 7rem))); }
nav.trp-floating-switcher.koi-language-positioned.is-open { overflow: visible; }
.trp-floating-switcher.koi-language-positioned .trp-switcher-dropdown-list {
  position: absolute;
  left: 0;
  bottom: calc(100% - var(--koi-language-trigger-top, 4px) + 4px);
  width: 100%;
  box-sizing: border-box;
  flex-direction: column;
  scroll-padding-block: 4px;
  border: 1px solid #c6cbc7;
  border-radius: var(--koi-radius);
  background: var(--koi-surface);
  box-shadow: 0 .25rem 1rem rgb(9 13 14 / .1);
}
.trp-floating-switcher.koi-language-list-below .trp-switcher-dropdown-list { top: calc(var(--koi-language-trigger-bottom, 48px) + 4px); bottom: auto; }
.trp-floating-switcher .trp-switcher-dropdown-list :where(a, button, [tabindex]) { scroll-margin-block: 4px; }
.trp-floating-switcher :focus-visible { outline: 3px solid var(--koi-red); outline-offset: -3px; }

/* A static reveal default makes content available before JS and on slow devices. */
.reveal, .reveal.is-visible { opacity: 1; transform: none; visibility: visible; pointer-events: auto; }
.hero-carousel__viewport { touch-action: pan-y pinch-zoom; }
@media (hover: none), (pointer: coarse), (max-width: 720px) { .koi-loupe-overlay { display: none; } }
@media (max-width: 720px) {
  .koi-cookie-banner { grid-template-columns: minmax(0, 1fr); inset-inline: .5rem; bottom: max(.5rem, env(safe-area-inset-bottom)); width: calc(100% - 1rem); padding: 1rem; gap: .75rem; border-radius: var(--koi-radius); }
  .koi-cookie-banner__actions { gap: .5rem; }
  .koi-cookie-banner button { padding-inline: .5rem; }
  .koi-ai-support .koi-ai-support__panel { bottom: calc(max(.5rem, env(safe-area-inset-bottom)) + var(--koi-ai-keyboard-offset, 0px)); max-height: calc(var(--koi-ai-visual-height, 100dvh) - 1rem); grid-template-rows: auto minmax(0, 1fr) auto; }
  .koi-ai-support .koi-ai-support__form { grid-template-columns: minmax(0, 1fr) 5.5rem; }
  .koi-ai-support .koi-ai-support__messages { min-height: 6rem; }
  .koi-image-inspector__hint { max-width: 28ch; }
}
@media (prefers-reduced-motion: reduce) {
  .koi-share *, .koi-ai-support *, .koi-cookie-banner *, .trp-floating-switcher *, .koi-image-inspector *, .koi-loupe-overlay { animation: none; transition: none; }
  .koi-ai-support .koi-ai-support__launcher, .koi-ai-support .koi-ai-support__choice { transform: none; }
}
@media (prefers-reduced-transparency: reduce) { .koi-image-inspector__backdrop { background: var(--koi-dark); } }
@media (prefers-contrast: more) {
  .koi-share__button, .koi-share__menu, .koi-zoom-trigger, .koi-cookie-banner, nav.trp-floating-switcher { border-color: currentColor; }
  .koi-ai-support__panel, .koi-ai-support__message, .koi-ai-support__choice { border-color: #fff; }
  .koi-image-inspector__backdrop { background: var(--koi-dark); }
}
