/* =============================================================================
   Odznak certifikace IFS Food
   -----------------------------------------------------------------------------
   Drží se pravidel designového systému:
   · zelená #3F7A1E jako PÍSMO na tomhle webu znamená jedinou věc — cenu za
     jednotku. Odznak ji proto nepoužívá; štít i text jsou inkoustové.
   · plochová zelená #7CC93C je jen plocha a vždy s hranou, takže ji odznak
     nepoužívá vůbec: není to tlačítko.
   · odkazy mají klikací plochu aspoň 24 px.
   Hodnoty se berou z tokenů, aby odznak šel s paletou.
   ========================================================================== */

.rm-cert {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--border-hairline, #E8E2D8);
  border-radius: var(--radius-1, 12px);
  background: var(--white, #FFFFFF);
  color: var(--text-body, #1A1A1A);
}

.rm-cert__znak {
  flex: 0 0 auto;
  display: inline-flex;
  color: var(--text-body, #1A1A1A);
  margin-top: 1px;
}

.rm-cert__telo { min-width: 0; }

.rm-cert__nadpis {
  margin: 0;
  font-family: var(--font-screen, "DM Sans", system-ui, sans-serif);
  font-size: 14.5px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.rm-cert__text {
  margin: 4px 0 0;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--text-muted, #5F5F5A);
  max-width: 56ch;
}

/* Údaje z certifikátu. Tabulkové číslice, ať jde číslo přečíst a opsat. */
.rm-cert__udaje {
  margin: 7px 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 7px;
  font-family: var(--font-mono, "DM Sans", system-ui, sans-serif);
  font-size: 12px;
  color: var(--text-muted, #5F5F5A);
  font-variant-numeric: tabular-nums;
}
.rm-cert__polozka { white-space: nowrap; }

/* Oddělovač mezi údaji. Samotná mezera nestačila: „18.848.294 ASTRAFOOD a.s."
   se četlo jako jeden údaj, a na mobilu se seznam navíc láme do tří řádků.
   Tečka je stejná jako v patičce webu. */
.rm-cert__polozka:not(:last-child)::after {
  content: "\00B7";
  margin-left: 7px;
  /* Barvu dědí po .rm-cert__udaje. Světlejší oddělovač by se sice líp odlišil
     od údajů, jenže tečka je text jako každý jiný a #8E8476 na bílé kontrastní
     práh nesplní. */
}

.rm-cert__rozsah {
  margin: 6px 0 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--text-muted, #5F5F5A);
}

.rm-cert__odkazy {
  margin: 9px 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
}
.rm-cert__odkaz {
  display: inline-flex;
  align-items: center;
  min-height: 24px;           /* systém nepřipouští klikací plochu pod 24 px */
  font-size: 13px;
  color: var(--text-body, #1A1A1A);
  text-decoration: underline;
}
.rm-cert__odkaz:hover,
.rm-cert__odkaz:focus { color: var(--link-hover, #1E3010); }
.rm-cert__odkaz:focus-visible {
  outline: 2px solid var(--focus-ring, #3F7A1E);
  outline-offset: 2px;
}

/* Co odkaz udělá a co za ním je, se píše VIDITELNĚ, ne jen do aria-label:
   vidoucí člověk potřebuje totéž varování. Proto ne aria-label — ten by
   viditelný text přepsal a čtečka by předčítala něco jiného, než je vidět.
   Poznámka je součástí odkazu, tak si drží jeho barvu i podtržení. */
.rm-cert__odkaz-pozn {
  margin-left: 5px;
  font-size: max(12px, 85%);
  font-weight: 400;
}

.rm-cert__pozn {
  margin: 5px 0 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--text-muted, #5F5F5A);
}

/* --- varianty ------------------------------------------------------------- */

/* Úvodní stránka: stojí v pásu slibů, tak ať drží jeho šířku. */
.rm-cert--uvod {
  margin: 0 auto;
  max-width: var(--measure-text, 62ch);
}

/* Detail jídla: sedí nad tlačítkem do košíku, kde se rozhoduje o nákupu,
   takže zůstává stručný a nekřičí. */
.rm-cert--detail {
  margin: 14px 0 0;
  padding: 12px 14px;
  background: var(--shelf-surface, #F3EFE8);
  border-color: transparent;
}
.rm-cert--detail .rm-cert__text { font-size: 13px; }

/* Pokladna: jen jeden řádek mezi ostatními ujištěními, bez vysvětlování. */
.rm-cert--pokladna {
  padding: 10px 12px;
  gap: 9px;
  background: transparent;
  border: 0;
}
.rm-cert--pokladna .rm-cert__nadpis { font-size: 13px; font-weight: 600; }
.rm-cert--pokladna .rm-cert__udaje { font-size: 11.5px; margin-top: 3px; }
.rm-cert--pokladna .rm-cert__odkazy { margin-top: 6px; }

@media (max-width: 767px) {
  .rm-cert { padding: 12px 14px; }
  .rm-cert__udaje { gap: 3px 12px; }
}

/* adaptisultracart nechá v .order-checkout zobrazené jen své vlastní děti
   a .checkout-reassure:
     body#checkout .order-checkout > *:not(#js-checkout-summary)
       :not(#opc-summary-foot):not(.checkout-reassure) { display: none !important }
   Odznak je další dítě, takže se sice vykreslil do HTML, ale v prohlížeči měl
   display:none a rozměry 0x0. Do .checkout-reassure ho obalit nejde — ta je
   vodorovný proužek s 11,5px textem a odznak by rozhodila. */
/* Odznak nese v pokladně i třídu .checkout-reassure (viz odznak.tpl), takže
   na něj spadnou styly toho vodorovného proužku: 11,5px text, zarovnání na
   střed, jiné odsazení. Tady se mu vracejí jeho vlastní hodnoty — selektor
   má o jednu třídu víc než modulový `body#checkout .checkout-reassure`,
   takže vyhrává i bez !important. */
body#checkout .order-checkout > .rm-cert.checkout-reassure {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 9px;
  padding: 10px 12px;
  font-size: inherit;
  color: var(--text-body, #1A1A1A);
}