/* Evano — project styles on top of dsgn.systems. Tokens only; component internals untouched. */

/* Headings in Outfit (geometric like the logo); body text stays Inter. dsgn has no heading-font
   token, so the heading text styles and component titles get it here. All use weight 600. */
:root { --ev-font-heading: 'Outfit', var(--dsgn-font-sans); }
:is(h1, h2, h3, .dsgn-display, .dsgn-heading, .dsgn-heading-s, .dsgn-title,
    .dsgn-card-title, .dsgn-feature-title, .dsgn-dialog-title) {
  font-family: var(--ev-font-heading);
}

/* Hero contacts: a plain list of ghost buttons, centred under the text */
.contact-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Opening hours: times are muted, rows that are not regular surgery hours are muted as a whole,
   today is emphasised */
.hours dd,
.hours .hours-special :is(dt, dd) { color: var(--dsgn-text-muted); }
.hours [data-today] :is(dt, dd) {
  color: var(--dsgn-text);
  font-weight: var(--dsgn-font-weight-semibold);
}
.closures,
.insurers ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Booking cards: the text row takes the spare height, so the buttons line up at the bottom
   whatever the text length (rows: icon, title, text, actions) */
#objednani .dsgn-card { grid-template-rows: auto auto 1fr auto; }

/* Insurers row */
.insurers { align-items: center; }
.insurers-title {
  margin: 0;
  font-size: var(--dsgn-font-size-body-s);
  line-height: var(--dsgn-line-height-body-s);
  font-weight: var(--dsgn-font-weight-medium);
}

/* Services */
.service h3 { margin: 0; }

/* About: round portrait */
.portrait { inline-size: 8rem; }
#o-lekarce blockquote { margin: 0; }
#o-lekarce blockquote p { margin: 0; }
#o-lekarce blockquote.dsgn-lead { max-inline-size: none; }
/* Feature texts: two even lines instead of a long first line and a short second one */
#o-lekarce .dsgn-feature-text {
  max-inline-size: 18rem;
  margin-inline: auto;
  text-wrap: balance;
}

/* Testimonials fill the row height */
.reviews { inline-size: 100%; text-align: start; }

/* Logo: inline SVG in the text colour (fill="currentColor"), keeps its own proportions */
.brand-logo {
  display: block;
  block-size: auto;
  inline-size: 7.5rem;
  color: var(--dsgn-text);
}

/* Address under the opening hours title, linked to the map */
.hours-address {
  font-style: normal;
  font-size: var(--dsgn-font-size-body-s);
  line-height: var(--dsgn-line-height-body-s);
}

/* Legal text page: spacing comes from the stacks, not from default margins */
.legal :is(h1, h2, p) { margin: 0; }
.legal section p { max-inline-size: 68ch; }
/* A note under a table spans the table width, so its lines do not stop short of the table edge */
.legal .dsgn-table-wrap ~ p { max-inline-size: none; text-wrap: pretty; }

/* Price list: service names wrap on narrow screens so prices stay visible without scrolling */
.price-table :is(th, td) { background: var(--dsgn-surface-raised); }
.price-table th[scope="row"] {
  white-space: normal;
  font-weight: var(--dsgn-font-weight-regular);
}
.price-table td[data-numeric] { vertical-align: top; }

/* Online consultation steps: a numbered list laid out as features */
.steps-list { margin: 0; padding: 0; list-style: none; }

/* Crisis cover button: hidden until main.js finds a closure in progress. dsgn's button display
   would otherwise beat the browser's [hidden] rule. */
.crisis-button[hidden] { display: none; }

/* Crisis cover dialog: tighter spacing, no default margins */
.crisis :is(h3, p) { margin: 0; }
