/* "Mikor hova?" tool (includes/mikor-hova/). Mobile first; design-system tokens only. Hibiscus (CTA) only on the booking
   buttons of the inline offer cards; levels/tags are soft tints with dark text; the level is always written as text. */
.exn-mikorhova { --_gap: var(--exn-space-sm); display: grid; gap: var(--exn-space-md); min-width: 0; }
.exn-mh__form { display: grid; gap: var(--exn-space-sm); padding: var(--exn-space-md); background: var(--exn-white); border: var(--exn-border-default); border-radius: var(--exn-radius-md); min-width: 0; }
.exn-mh__fs { border: 0; margin: 0; padding: 0; min-width: 0; }
.exn-mh__legend { display: block; padding: 0; margin: 0 0 var(--exn-space-2xs); font-size: var(--exn-fs-xs); font-weight: var(--exn-fw-bold); letter-spacing: .04em; text-transform: uppercase; color: var(--exn-color-text-muted); }
.exn-mh__chips { display: flex; gap: var(--exn-space-2xs); overflow-x: auto; scrollbar-width: thin; padding: 2px 2px 6px; margin: -2px; scroll-snap-type: x proximity; }
.exn-mh__segs { display: flex; flex-wrap: wrap; gap: var(--exn-space-2xs); }
.exn-mh-chip, .exn-mh-seg { position: relative; flex: none; scroll-snap-align: start; }
.exn-mh-chip input, .exn-mh-seg input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.exn-mh-chip span:not(.exn-sr-only), .exn-mh-seg span { display: inline-flex; align-items: center; gap: 4px; min-height: 44px; padding: 0 14px; border: var(--exn-border-input); border-radius: var(--exn-radius-pill); background: var(--exn-white); color: var(--exn-lagoon-900); font-size: var(--exn-fs-sm); font-weight: var(--exn-fw-medium); white-space: nowrap; transition: background-color var(--exn-duration-fast), border-color var(--exn-duration-fast); }
.exn-mh-chip small { font-size: var(--exn-fs-xs); color: var(--exn-color-text-muted); }
.exn-mh-chip input:hover + span, .exn-mh-seg input:hover + span { border-color: var(--exn-lagoon-900); }
.exn-mh-chip input:checked + span, .exn-mh-seg input:checked + span { background: var(--exn-lagoon-900); border-color: var(--exn-lagoon-900); color: var(--exn-white); font-weight: var(--exn-fw-semibold); }
.exn-mh-chip input:checked + span small { color: inherit; }
.exn-mh-chip input:focus-visible + span, .exn-mh-seg input:focus-visible + span { outline: 3px solid var(--exn-color-border-focus); outline-offset: 2px; }
.exn-mh__fs--budget { display: flex; align-items: center; gap: var(--exn-space-xs); flex-wrap: wrap; }
.exn-mh__fs--budget .exn-mh__legend { margin: 0; }
.exn-mh__select { width: auto; min-width: 12rem; min-height: 44px; }
.exn-mh__submit { justify-self: start; }
.exn-mikorhova.is-js .exn-mh__submit { display: none; }

.exn-mh__summary { margin: 0; font-weight: var(--exn-fw-bold); font-size: var(--exn-fs-lg); color: var(--exn-color-text-strong); }
.exn-mh__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--exn-space-xs); }
.exn-mh__result { display: grid; gap: var(--exn-space-sm); min-width: 0; scroll-margin-top: 90px; }
.exn-mikorhova.is-busy .exn-mh__list { opacity: .6; }

.exn-mh-row { display: grid; gap: var(--exn-space-xs); padding: var(--exn-space-md); background: var(--exn-white); border: var(--exn-border-default); border-left: var(--exn-border-width-accent) solid var(--exn-neutral-300); border-radius: var(--exn-radius-md); min-width: 0; }
.exn-mh-row.is-ideal { border-left-color: var(--exn-color-highlight); }
.exn-mh-row.is-good { border-left-color: var(--exn-turquoise-300); }
.exn-mh-row.is-tradeoff { border-left-color: var(--exn-sand-400); }
.exn-mh-row__main, .exn-mh-row__side { display: grid; gap: var(--exn-space-2xs); min-width: 0; }
.exn-mh-row__head { display: flex; align-items: center; gap: var(--exn-space-xs); flex-wrap: wrap; }
.exn-mh-row__rank { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: var(--exn-radius-circle); background: var(--exn-neutral-100); font-size: var(--exn-fs-sm); font-weight: var(--exn-fw-bold); font-variant-numeric: tabular-nums; color: var(--exn-lagoon-900); }
.exn-mh-row__name { margin: 0; font-size: var(--exn-fs-h5); line-height: 1.25; }
.exn-mh-row__name a { color: var(--exn-color-text-strong); text-decoration: none; }
.exn-mh-row__name a:hover { text-decoration: underline; }
.exn-mh-level { margin-left: auto; padding: 3px 10px; border-radius: var(--exn-radius-pill); font-size: var(--exn-fs-xs); font-weight: var(--exn-fw-bold); white-space: nowrap; background: var(--exn-neutral-100); color: var(--exn-neutral-800); }
.exn-mh-level.is-ideal { background: var(--exn-color-success-bg); color: var(--exn-green-800); }
.exn-mh-level.is-good { background: var(--exn-color-info-bg); color: var(--exn-lagoon-900); }
.exn-mh-level.is-tradeoff { background: var(--exn-sand-100); color: var(--exn-sand-800); }
.exn-mh-row__facts { display: flex; flex-wrap: wrap; gap: 4px var(--exn-space-sm); margin: 0; font-size: var(--exn-fs-sm); color: var(--exn-color-text-muted); font-variant-numeric: tabular-nums; }
.exn-mh-row__facts > span { display: inline-flex; align-items: center; gap: 4px; }
.exn-mh-ico { width: 16px; height: 16px; flex: none; color: var(--exn-neutral-600); }
.exn-mh-row__tags { display: flex; flex-wrap: wrap; gap: 4px; list-style: none; margin: 2px 0 0; padding: 0; }
.exn-mh-tag { padding: 3px 10px; border-radius: var(--exn-radius-pill); font-size: var(--exn-fs-xs); font-weight: var(--exn-fw-semibold); line-height: 1.35; background: var(--exn-color-highlight-soft); color: var(--exn-lagoon-900); }
.exn-mh-tag.is-warn { background: var(--exn-sand-50); color: var(--exn-sand-800); box-shadow: inset 0 0 0 1px var(--exn-sand-200); }
.exn-mh-row__price { margin: 0; font-size: var(--exn-fs-sm); color: var(--exn-color-text-muted); font-variant-numeric: tabular-nums; }
.exn-mh-row__amount { font-size: var(--exn-fs-lg); color: var(--exn-color-text-strong); white-space: nowrap; }
.exn-mh-row__none { font-style: italic; }
.exn-mh-row__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--exn-space-xs); margin-top: 2px; }
.exn-mh-row__more { min-height: 40px; padding: 0 var(--exn-space-sm); border: 0; background: none; color: var(--exn-color-text-link); font: var(--exn-fw-semibold) var(--exn-fs-sm)/1 var(--exn-font-sans); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.exn-mh-row__more::after { content: " ▾"; text-decoration: none; display: inline-block; margin-left: 2px; }
.exn-mh-row__more[aria-expanded="true"]::after { content: " ▴"; }
.exn-mh-row__more:focus-visible { outline: 3px solid var(--exn-color-border-focus); outline-offset: 2px; border-radius: var(--exn-radius-xs); }
.exn-mh-row__offers { grid-column: 1 / -1; display: grid; gap: var(--exn-space-sm); grid-template-columns: minmax(0, 1fr); padding-top: var(--exn-space-xs); }
.exn-mh-row__offers .exn-card { min-width: 0; }
.exn-mh-row__offers p { margin: 0; font-size: var(--exn-fs-sm); }

.exn-mh__group { border-top: var(--exn-border-default); padding-top: var(--exn-space-xs); }
.exn-mh__group > summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; font-weight: var(--exn-fw-semibold); color: var(--exn-lagoon-900); }
.exn-mh__group > summary:focus-visible { outline: 3px solid var(--exn-color-border-focus); outline-offset: 2px; }
.exn-mh__list.is-muted .exn-mh-row { background: var(--exn-neutral-50); }
.exn-mh__meta { margin: 0; font-size: var(--exn-fs-xs); color: var(--exn-color-text-muted); }
.exn-mh-teaser { margin: var(--exn-space-sm) 0 0; font-size: var(--exn-fs-sm); color: var(--exn-color-text-muted); }
.exn-mh-teaser .exn-link { font-weight: var(--exn-fw-bold); }
.exn-mh-method__src { font-size: var(--exn-fs-sm); color: var(--exn-color-text-muted); }

@media (min-width: 640px) {
  .exn-mh-row__offers { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
}
@media (min-width: 1024px) {
  .exn-mh__form { grid-template-columns: minmax(0, 1fr) auto auto; align-items: end; column-gap: var(--exn-space-lg); }
  .exn-mh__fs--months { grid-column: 1 / -1; }
  .exn-mh__chips { flex-wrap: wrap; overflow: visible; }
  .exn-mh-row { grid-template-columns: minmax(0, 1fr) 300px; align-items: center; column-gap: var(--exn-space-lg); }
  .exn-mh-row__side { justify-items: end; text-align: right; }
  .exn-mh-row__actions { justify-content: flex-end; }
  .exn-mh-level { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .exn-mh-chip span, .exn-mh-seg span { transition: none; }
}
.exn-mh-answer { margin: 0 0 var(--exn-space-sm); font-weight: var(--exn-fw-semibold); }
.exn-mh-links { display: flex; flex-wrap: wrap; gap: var(--exn-space-2xs) var(--exn-space-md); list-style: none; margin: var(--exn-space-sm) 0 0; padding: 0; }
.exn-mh-row__offers[hidden], .exn-mh-row__more[hidden] { display: none; }
@media (min-width: 1024px) {
  .exn-mh-row { grid-template-columns: minmax(0, 1fr) auto; }
  .exn-mh-row__actions { flex-wrap: nowrap; }
}
.exn-mh-row__offers > p { grid-column: 1 / -1; }
