/* Project patches — Tailwind utility classes that upstream uses but their
 * purged build doesn't include. Linked AFTER styles.css in partials/head.php.
 *
 * Refresh policy: when assets/css/styles.css is re-pulled from upstream,
 * check if any of these landed in the new build (you can delete those).
 * The ones below have been verified missing as of 2026-06-01. */

/* --- Accessibility: WCAG AA contrast --------------------------------------
 * Upstream --go-amber (#c97b1a) is only ~3.1–3.3:1 on the cream/white section
 * backgrounds — below AA (4.5:1) for the small uppercase eyebrow labels.
 * Darken to #985a0e: 5.52:1 on white, 4.72:1 on the darkest cream card (#f6ecdc).
 * Overrides the :root token in styles.css (loaded earlier), so it survives a
 * re-curl. NOTE: amber TEXT on the dark-green sections (why-go, famous-quotes
 * eyebrows) would FAIL with this darker value — those are re-pointed to
 * --go-amber-light (#e8961e, 5.1:1 on green) in their markup. The per-circle
 * CTA-button accents (circles.accent in the DB: coral/cyan/amber on white text)
 * are a SEPARATE contrast issue — design + DB data, tracked, not fixed here. */
:root { --go-amber: #985a0e; }

/* Low-opacity white utilities on the dark (green / stone-black) sections.
 * Tailwind's purged build drops some of these (text-white/40 rendered as the
 * inherited near-black = invisible disclaimer text), and 40–50% white fails AA
 * on the dark bgs anyway. Define them at 72% — passes AA 4.5:1 on every dark
 * section bg we use (#1a3d25 / #161612 / #2c4d36 / #22221e all need ≥60%).
 * Loaded after styles.css so this wins. */
.text-white\/30, .text-white\/40, .text-white\/50, .text-white\/60 { color: rgba(255, 255, 255, 0.72); }

/* Section vertical padding — Macaly's build only ships py-1..py-6, py-14, py-16.
 * py-24 was used historically and may reappear; ship it just in case. */
.py-20 { padding-top: 5rem;  padding-bottom: 5rem;  }
.py-24 { padding-top: 6rem;  padding-bottom: 6rem;  }
.pt-24 { padding-top: 6rem; }
.pb-24 { padding-bottom: 6rem; }

/* Arbitrary-value grid templates — used in proc-go-love + famous-quotes for
 * content/image splits. Without these the columns stack 1-up vertically. */
.md\:grid-cols-\[2fr\,3fr\]:where(@media (min-width: 768px)) { /* fallback for old browsers */ }
@media (min-width: 768px) {
  .md\:grid-cols-\[2fr\,3fr\] { grid-template-columns: 2fr 3fr; }
  .md\:grid-cols-\[3fr\,2fr\] { grid-template-columns: 3fr 2fr; }
}
@media (min-width: 1024px) {
  .lg\:grid-cols-\[3fr\,2fr\] { grid-template-columns: 3fr 2fr; }
}

/* Other small misses found in the audit */
.h-36 { height: 9rem; }      /* event-card image height */
.-mt-2 { margin-top: -0.5rem; }
.text-amber-300 { color: #fcd34d; }   /* form field-error text */
.mt-16 { margin-top: 4rem; } /* „Proběhlé akce" archive heading offset on /turnaje-a-akce */

/* Article body (/aktuality/{slug}) — styles Parsedown's bare h2/h3/p/ul/ol/
 * blockquote/img/a; the purged Tailwind build ships no element defaults.
 * Headings inherit serif from the global h1-h4 rule — only color/size/
 * spacing here. Body stays DM Sans (serif is for headings only). */
.article-body { color: #3f4a40; font-size: 1.0625rem; line-height: 1.75; }
.article-body > * + * { margin-top: 1.15rem; }
.article-body h2 { color: var(--go-green); font-size: 1.6rem; line-height: 1.25; margin-top: 2.25rem; }
.article-body h3 { color: var(--go-green); font-size: 1.3rem; line-height: 1.3; margin-top: 1.75rem; }
/* NOTE: no `.article-body p { margin:0 }` here — its (0,1,1) specificity would
 * beat the (0,1,0) owl rule above and kill paragraph spacing. The Tailwind
 * preflight already zeroes element margins. */
.article-body a { color: var(--go-amber); text-decoration: underline; text-underline-offset: 2px; }
.article-body a:hover { opacity: .85; }
.article-body strong { color: var(--go-green); font-weight: 700; }
.article-body ul, .article-body ol { padding-left: 1.4rem; }
.article-body ul { list-style: disc; }
.article-body ol { list-style: decimal; }
.article-body li + li { margin-top: .4rem; }
.article-body blockquote {
  border-left: 4px solid var(--go-amber);
  padding: .25rem 0 .25rem 1.1rem;
  color: #5a7060;
  font-style: italic;
}
.article-body img { border-radius: 1rem; max-width: 100%; height: auto; }
.article-body code {
  background: rgba(26, 61, 37, .06);
  padding: .1rem .35rem;
  border-radius: .35rem;
  font-size: .9em;
}

/* Přihláška form — visible checkbox feedback. The native checkbox is
 * sr-only (visually hidden) and the next sibling div is the "fake" box;
 * when the real checkbox is checked, fill the fake box amber. */
#prihlaska input[type="checkbox"]:checked + div {
  background: var(--go-amber) !important;
  border-color: var(--go-amber) !important;
}
#prihlaska input[type="checkbox"]:checked + div::after {
  content: "✓";
  color: white;
  font-weight: 700;
  font-size: 0.85rem;
  line-height: 1;
}

/* Responsive padding ramp — used on the AI/Go callout card */
.p-12 { padding: 3rem; }

/* xl: responsive variants — used by the header social icons (show ≥1280px
 * so the nav doesn't crowd at typical-laptop widths) */
@media (min-width: 1280px) {
  .xl\:inline-flex { display: inline-flex; }
  .xl\:flex { display: flex; }
}
@media (min-width: 768px) {
  .md\:p-10 { padding: 2.5rem; }
}
@media (min-width: 1024px) {
  .lg\:p-12 { padding: 3rem; }
  /* Nav breakpoint moved md→lg: with the „Aktuality" item the 8-link desktop
   * nav overflows at 768-1023px, so the burger menu serves that range. */
  .lg\:hidden { display: none; }
}

/* Defensive — these arbitrary opacity values are used on decorative
 * background stones. Ship the exact ones referenced. */
.opacity-\[0\.04\] { opacity: 0.04; }
.opacity-\[0\.08\] { opacity: 0.08; }
.opacity-\[0\.10\] { opacity: 0.10; }
.opacity-\[0\.12\] { opacity: 0.12; }
.opacity-\[0\.15\] { opacity: 0.15; }
.opacity-\[0\.18\] { opacity: 0.18; }
.opacity-\[0\.20\] { opacity: 0.20; }

/* Přihláška form custom controls (partials/prihlaska.php) — CSS-only
 * :checked states so the form works without JS. Base box styles live here
 * (not inline) because inline styles would beat the :checked selectors. */
.prihlaska-box { background: rgba(255,255,255,0.1); border: 2px solid rgba(255,255,255,0.25); color: #fff; }
.prihlaska-tick { opacity: 0; transition: opacity .15s; }
input:checked + .prihlaska-box { background: var(--go-amber); border-color: var(--go-amber); }
input:checked + .prihlaska-box .prihlaska-tick { opacity: 1; }
input:focus-visible + .prihlaska-box { outline: 2px solid var(--go-amber); outline-offset: 2px; }
.prihlaska-level { background: rgba(255,255,255,0.1); color: rgba(255,255,255,0.85); border: 2px solid rgba(255,255,255,0.1); } /* 0.85: AA on the ~#415f4a effective bg (0.6 failed) */
input:checked + .prihlaska-level { background: var(--go-amber); color: #fff; border-color: var(--go-amber); }
input:focus-visible + .prihlaska-level { outline: 2px solid #fff; outline-offset: 2px; }
