/* css/kontextova-sprava.css */

/* ==========================================================================
   💬 ZDIEĽANÝ SYSTÉM KONTEXTOVÝCH SPRÁV (sekcia zadania "Implementácia
   zdieľaného systému kontextových správ (informačný + potvrdzovací typ)",
   doplnená sekciou zadania "Kontextové správy bez backdropu (s blokovaním
   appky)") - rovnaký backdrop+centrovaná-karta ŠTRUKTÚRA ako #o-projekte-
   overlay (css/detail.css), ale BEZ vizuálneho stmavenia/blur - okienko
   pôsobí "voľne plávajúce" nad appkou, odlíšené VÝHRADNE výrazným
   border/box-shadow karty nižšie (.kontextova-sprava-card). Kompaktný
   rozmer karty (zadanie bod 1 pôvodnej úlohy - "primeraný krátkemu textu +
   prípadným tlačidlám, nie plnohodnotný veľký modal"). Z-Index 400 (> 300,
   ostatné "jednoduché" lightboxy appky) - môže sa vyvolať odkiaľkoľvek,
   vždy musí zostať navrchu.

   BLOKOVANIE APPKY (zadanie, bod 2) - .kontextova-sprava-backdrop nižšie
   ostáva PLNOPLOŠNÝ "click-catcher" (position:absolute; inset:0, rovnaké
   rozmery ako predtým), IBA jeho pozadie je teraz transparent namiesto
   tmavej vrstvy - vizuálne neviditeľný, ale STÁLE fyzicky prítomný v DOM
   strome a STÁLE zachytáva kliky (žiadna zmena pointer-events). Keďže je
   vykreslený PRED .kontextova-sprava-card v tom istom rodičovi (poradie v
   DOM = poradie vykreslenia v rámci rovnakého stacking kontextu), karta ho
   vizuálne prekrýva a jej vlastné kliky teda NIKDY nezasiahnu backdrop pod
   ňou (backdrop nie je predok karty, listener naň sa klikom NA kartu
   nespustí) - klik KDEKOĽVEK MIMO karty (aj keď appka pod ním vyzerá úplne
   normálne, nestmavená) preto vždy najprv zasiahne TENTO neviditeľný
   click-catcher (je nad zvyškom appky vďaka z-indexu #kontextova-sprava-
   overlay), NIE element appky pod ním - klik sa tak "spotrebuje" na
   zatvorenie okienka (js/kontextova-sprava.js, zatvorKontextovuSpravu),
   nikdy nepokračuje ďalej do appky. Platí identicky pre OBA typy (info aj
   potvrdenie) - žiadna typovo-špecifická vetva tu netreba, ide o vlastnosť
   spoločného .kontextova-sprava-backdrop elementu. */
#kontextova-sprava-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 400;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    /* Rovnaká horná/spodná rezerva ako #o-projekte-overlay (css/detail.css) -
       karta tak nikdy neprekryje header/spodný rad, nech je appka
       akokoľvek malá. */
    padding: 72px 20px calc(24px + 30px + (40px * var(--ui-scale-kompenzacia, 1))) 20px;
}

/* ID selektor #kontextova-sprava-overlay ("display:flex" vyššie) by inak
   VŽDY vyhral nad holým ".kontextova-sprava-hidden" bez ohľadu na poradie
   v súbore (rovnaká špecifickosť triedy prehráva s ID) - rovnaký bug ako v
   sekciách zadania "Opraviť chýbajúci nadpis 'Prémiová Rezidencia'..." a
   #vyber-blokov-favorites-panel - #kontextova-sprava-overlay.kontextova-
   sprava-hidden (rovnaká ID-úroveň špecifickosti) sa mu vyhýba nastálo. */
#kontextova-sprava-overlay.kontextova-sprava-hidden {
    display: none;
}

.kontextova-sprava-backdrop {
    position: absolute;
    inset: 0;
    background: transparent;
}

/* ==========================================================================
   SPOLOČNÝ ZÁKLAD VEĽKOSTI KONTEXTOVÝCH OKIEN (--ks-*)
   Každé nové nápovedné/tooltip okno MUSÍ ísť cez zobrazKontextovaSprava()
   (js/kontextova-sprava.js) - dedí tak .kontextova-sprava-card a tieto
   premenné. Veľkosť okna (font, šírka, padding, krížik) sa NESMIE nastavovať
   lokálne v pravidlách konkrétneho okna - mení sa JEDINE tu, v hodnotách
   --ks-* (základ = PC/touch-table, override pre dotyk nižšie pod
   .ui-k-aktivne, nie @media hover:none, ktoré by zasiahlo aj touch-desktop).
   Dotyk: K*scale == uiMinScaleFactor (0,6) VŽDY, takže calc(Npx*K) a rem
   (koreň 16px*K) dávajú rovnakú REÁLNU veľkosť na všetkých dotykových
   zariadeniach (1,3rem = ~12,5px, 560px*K = ~336px, 43px*K = ~26px).
   ========================================================================== */
.kontextova-sprava-card {
    --ks-font-size: 0.85rem;
    --ks-line-height: 1.5;
    --ks-card-width: min(calc(360px * var(--ui-scale-kompenzacia, 1)), calc(100cqw - 40px));
    --ks-card-padding: calc(22px * var(--ui-scale-kompenzacia, 1));
    --ks-text-pad-right: calc(20px * var(--ui-scale-kompenzacia, 1));
    --ks-close-size: calc(32px * var(--ui-scale-kompenzacia, 1));
    --ks-close-font: 0.9rem;
}

.ui-k-aktivne .kontextova-sprava-card {
    --ks-font-size: 1.3rem;
    --ks-card-width: min(calc(560px * var(--ui-scale-kompenzacia, 1)), 60cqw, calc(100cqw - 40px));
    --ks-card-padding: calc(34px * var(--ui-scale-kompenzacia, 1));
    --ks-text-pad-right: calc(28px * var(--ui-scale-kompenzacia, 1));
    --ks-close-size: calc(43px * var(--ui-scale-kompenzacia, 1));
    --ks-close-font: 1.2rem;
}

/* Krížik: .detail-close-btn je zdieľaná s detailom bytu (css/detail.css) -
   rozmer sa prepisuje IBA tu, scoped na .kontextova-sprava-close, vyššou
   špecificitou (2 triedy) než základ. Hitbox (::before 73px*K, detail.css)
   ostáva nedotknutý. */
.kontextova-sprava-card .kontextova-sprava-close {
    width: var(--ks-close-size);
    height: var(--ks-close-size);
    font-size: var(--ks-close-font);
}

.kontextova-sprava-card {
    position: relative;
    width: var(--ks-card-width);
    max-height: 100%;
    overflow-y: auto;
    background: rgb(var(--surface-card-rgb) / 0.98);
    /* Bez tmavého backdropu za sebou (zadanie, "Kontextové správy bez
       backdropu...") sa karta musí odlíšiť od appky VÝHRADNE vlastným
       rámom/tieňom - výraznejšie než predtým (border hrubší a nepriehľadnejší,
       box-shadow tmavší/širší s doplnkovým 1px "obrysovým" tieňom navyše,
       ktorý funguje ako jemná obrysová čiara aj na svetlom pozadí appky za
       ňou, kde by samotný mäkký box-shadow sám osebe nestačil). */
    border: 2px solid rgb(var(--accent-rgb) / 0.55);
    border-radius: 16px;
    padding: var(--ks-card-padding);
    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.85), 0 0 0 1px rgba(0, 0, 0, 0.4);
    text-align: center;
}

.kontextova-sprava-text {
    font-size: var(--ks-font-size);
    line-height: var(--ks-line-height);
    color: var(--text-body);
    /* Priestor pre krížik (typ 'info', pravý horný roh) - iba pravý okraj,
       text ostáva vycentrovaný na zvyšnej šírke karty. Neškodné aj pre typ
       'potvrdenie' (bez krížika) - o niečo väčšia pravá medzera tam nevadí,
       text je aj tak krátky/vycentrovaný. */
    padding: 0 var(--ks-text-pad-right) 0 0;
}

.kontextova-sprava-actions {
    display: flex;
    gap: calc(12px * var(--ui-scale-kompenzacia, 1));
    margin-top: calc(18px * var(--ui-scale-kompenzacia, 1));
}

.kontextova-sprava-actions .detail-action-btn {
    flex: 1 1 0;
}

/* Okno s tlačidlom (zobrazKontextovaSprava s volbou tlacidlo, napr. potvrdenie po odoslaní formulára): presne vycentrované vo
   viewporte. Ostatné okná majú asymetrickú rezervu (72px hore, dole pre spodný rad), tu je padding symetrický. */
#kontextova-sprava-overlay.kontextova-sprava-vo-viewporte {
    padding: 20px;
}

.kontextova-sprava-akcia {
    display: flex;
    justify-content: center;
    margin-top: calc(18px * var(--ui-scale-kompenzacia, 1));
}

.ui-k-aktivne .kontextova-sprava-tlacidlo {
    font-size: 1.3rem;
}