/* ============================================================
   app-badges.css — odkazy na mobilní aplikaci (App Store + Google Play)
   Nový, samostatný soubor. Sdílené CSS se nemění.

   Oficiální badge assety (design system/assets/badges/) se NEUPRAVUJÍ —
   jejich zaoblené rohy jsou povolená výjimka z border-radius: 0
   (licenční podmínky App Store i Google Play vyžadují použití beze změn).

   OPTICKÉ SJEDNOCENÍ VÝŠKY:
   Apple SVG (viewBox 119.66×40) vyplňuje svůj rám od kraje ke kraji.
   Google PNG (646×250) má nahoře i dole zapečený PRŮHLEDNÝ okraj 29 px
   (viditelná dlaždice 646×192) — vlevo/vpravo žádný. Viditelná výška je
   tedy jen 192/250 = 0,768 souboru. Kdyby oba měly stejnou CSS výšku,
   Google by opticky vypadal menší.

   Řešení (bez úpravy grafiky, poměr stran zachován): Google badge se
   vykreslí VYŠŠÍ (V / 0,768) a wrapper s pevnou výškou + overflow:hidden
   + svislé vycentrování symetricky odřízne oba průhledné okraje, takže
   VIDITELNÁ dlaždice má přesně cílovou výšku V. Google cílíme přes
   [href*="play.google.com"] — bez zásahu do HTML.
   ============================================================ */

/* ---------- A. Badge řádek v sekci Objednávání (viditelná výška 48px) ---------- */
.app-badges {
  margin-top: 22px;
}

.app-badges__label {
  display: block;
  margin-bottom: 10px;
  font-size: 13px;
  font-weight: 500;
  color: var(--muted, #79828C);
}

.app-badges__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.app-badges__link {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  transition: opacity .15s ease, transform .15s ease;
}

.app-badges__link:hover {
  opacity: .85;
  transform: translateY(-1px);
}

.app-badges__link:focus-visible {
  outline: 2px solid var(--blue-600, #0e6fb8);
  outline-offset: 3px;
}

/* Apple (a výchozí): dlaždice vyplňuje rám → viditelná výška = height. */
.app-badges__link img {
  display: block;
  height: 48px;
  width: auto;
}

/* Google: kompenzace průhledného okraje 29/250. Wrapper ořízne, viditelných 48px. */
.app-badges__link[href*="play.google.com"] {
  height: 48px;
  overflow: hidden;
}
.app-badges__link[href*="play.google.com"] img {
  height: 62.5px; /* 48 / 0.768 → viditelná dlaždice = 48px */
}

/* ---------- B. Blok „Aplikace" v patičce (viditelná výška 40px) ---------- */

.s-footer__app-badges {
  display: flex;
  flex-direction: column;
  align-items: flex-start; /* levé zarovnání obou dlaždic */
  gap: 8px;
  margin-top: 14px;
}

.s-footer__app-badge {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  transition: opacity .15s ease;
}

.s-footer__app-badge:hover { opacity: .85; }

.s-footer__app-badge:focus-visible {
  outline: 2px solid var(--blue-600, #0e6fb8);
  outline-offset: 3px;
}

/* Apple (a výchozí): viditelná výška = height. */
.s-footer__app-badge img {
  display: block;
  height: 40px;
  width: auto;
}

/* Google: kompenzace okraje → viditelných 40px, levá hrana zarovnaná. */
.s-footer__app-badge[href*="play.google.com"] {
  height: 40px;
  overflow: hidden;
}
.s-footer__app-badge[href*="play.google.com"] img {
  height: 52.083px; /* 40 / 0.768 → viditelná dlaždice = 40px */
}
