/* =========================================================================
   compat.css — dorovnání Bootstrapu 3 na Bootstrap 5
   -------------------------------------------------------------------------
   Renderery admin3_frontend historicky emitují Bootstrap 3 markup. Ten je
   dnes doplněný o admin3-vlastní ekvivalenty (data-bs-*, .a3-input-addon,
   .a3-hide-sm), ale některé BS3 třídy z výstupu nezmizely a v BS5 neexistují.

   Šablona navíc z Bootstrapu 5 načítá jen `bootstrap-grid.min.css` (mřížka),
   ne komponentní CSS — vzhled si dělá sama. Chybějící kousky, na kterých ale
   závisí bootstrapový JS (collapse, dropdown), jsou proto tady.
   ========================================================================= */

/* ── Mřížka: col-xs-* (BS3) → chování bezprefixového .col-* (BS5) ────

   VŠECHNO je zabalené v `:where()`, a to je na tomhle bloku to podstatné.
   V Bootstrapu 3 platil `col-xs-*` ve všech šířkách, ale `col-sm-*`,
   `col-md-*` a `col-lg-*` ho nad svým bodem zlomu přebily — protože stály
   v souboru níž. Tady je pořadí opačné: `compat.css` se načítá AŽ ZA
   `bootstrap-grid.min.css`, takže při shodné specificitě (0,1,0) vyhrával
   `col-xs-*` úplně všude a větší body zlomu byly tiše mrtvé.

   Projevilo se to na stránce „Kontaktní údaje": `col-md-12 col-sm-4 col-xs-6`
   drželo boxy na 50 % i na širokém monitoru, takže se do sloupce nevešly
   údaje a `text-overflow` z baseline z „Jihomoravský" udělal „Jiho…".

   `:where()` sráží specificitu na nulu, takže KAŽDÝ bootstrapový `col-*-*`
   je přebije bez ohledu na pořadí souborů — přesně jako v BS3. Zároveň zůstává
   v platnosti tam, kde element žádnou další `col-` třídu nemá. */

:where(.col-xs-1),  :where(.col-xs-2),  :where(.col-xs-3),  :where(.col-xs-4),
:where(.col-xs-5),  :where(.col-xs-6),  :where(.col-xs-7),  :where(.col-xs-8),
:where(.col-xs-9),  :where(.col-xs-10), :where(.col-xs-11), :where(.col-xs-12) {
	flex: 0 0 auto;
	padding-right: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
	padding-left: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
}

:where(.col-xs-1)  { width: 8.33333333%; }
:where(.col-xs-2)  { width: 16.66666667%; }
:where(.col-xs-3)  { width: 25%; }
:where(.col-xs-4)  { width: 33.33333333%; }
:where(.col-xs-5)  { width: 41.66666667%; }
:where(.col-xs-6)  { width: 50%; }
:where(.col-xs-7)  { width: 58.33333333%; }
:where(.col-xs-8)  { width: 66.66666667%; }
:where(.col-xs-9)  { width: 75%; }
:where(.col-xs-10) { width: 83.33333333%; }
:where(.col-xs-11) { width: 91.66666667%; }
:where(.col-xs-12) { width: 100%; }

/* ── Viditelnost podle šířky (BS3) ────────────────────────────────── */

@media (max-width: 575px)  { .hidden-xs { display: none !important; } }
@media (max-width: 767px)  { .hidden-sm { display: none !important; } }
@media (max-width: 991px)  { .hidden-md { display: none !important; } }
@media (min-width: 992px)  { .visible-xs, .visible-sm { display: none !important; } }

/* ── Chování, na které spoléhá bootstrapový JS ─────────────────────── */

/* Collapse — Bootstrap JS přepíná .show a mezistav .collapsing. */
.collapse:not(.show) { display: none; }

.collapsing {
	height: 0;
	overflow: hidden;
	transition: height var(--nol-prechod-dlouhy) ease;
}

@media (prefers-reduced-motion: reduce) {
	.collapsing { transition: none; }
}

/* Dropdown — základ; konkrétní vzhled mega menu je v layout.css. */
.dropdown-menu { display: none; }
.dropdown-menu.show { display: block; }

/* ── Drobnosti z BS3, které renderery ještě používají ──────────────── */

.pull-left  { float: left; }
.pull-right { float: right; }

.img-responsive { max-width: 100%; height: auto; }

.mb-0 { margin-bottom: 0 !important; }
