/* Gosscard — delight & engagement vrstva.
   Etické mikrointerakce: uspokojivá zpětná vazba, plynulost, radost z používání.
   Aditivní — nezasahuje do logiky, jen do „feelingu". */

/* --- Plynulé přechody na interaktivních prvcích --- */
.groupLeftPannelWallItem,
.btn, .btn-primary, button,
.search-container input,
.page-head__inner [role="button"] {
    transition: transform .18s cubic-bezier(.34, 1.56, .64, 1),
                box-shadow .2s ease,
                filter .15s ease,
                background-color .15s ease;
    will-change: transform;
}

/* --- Wall karta: hover lift → prohlížení ožije --- */
.groupLeftPannelWallItem {
    /* Bylo 14px mimo škálu — karty teď drží stejný poloměr jako zbytek UI. */
    border-radius: var(--gc-radius-lg, 16px);
}
.groupLeftPannelWallItem:hover {
    transform: translateY(-3px);
    box-shadow: var(--gc-shadow-md, 0 10px 26px rgba(30, 64, 175, .13)),
                var(--gc-shadow-sm, 0 2px 6px rgba(0, 0, 0, .06));
}

/* --- Tlačítka: hover jas + press feedback --- */
.btn:hover, button:hover { filter: brightness(1.04); }
.btn:active, button:active { transform: scale(.95); }

/* --- Reakce: „pop" při kliknutí (JS přidá .gd-pop) --- */
@keyframes gdPop {
    0%   { transform: scale(1); }
    35%  { transform: scale(1.5); }
    60%  { transform: scale(.88); }
    100% { transform: scale(1); }
}
.gd-pop { animation: gdPop .42s cubic-bezier(.34, 1.56, .64, 1); }

/* --- Létající emoji burst při reakci (radost z akce) --- */
@keyframes gdFloat {
    0%   { opacity: 0; transform: translate(-50%, 0) scale(.5); }
    15%  { opacity: 1; }
    100% { opacity: 0; transform: translate(-50%, -54px) scale(1.2); }
}
.gd-burst {
    position: fixed;
    z-index: 100000;
    pointer-events: none;
    font-size: 22px;
    line-height: 1;
    animation: gdFloat .9s ease-out forwards;
}

/* --- Přístupnost: viditelný focus (bez potlačení) ---
   Do 2026-08 tohle pravidlo nikdy nefungovalo: public.css shazoval outline
   i box-shadow přes `!important` na a/button. Potlačení je pryč.
   Zároveň plná barva místo rgba(...,.5) — poloprůhledná modrá vycházela na bílé
   na ~2,2:1, což je pod 3:1, které WCAG 1.4.11 po indikátoru fokusu chce. */
.btn:focus-visible, button:focus-visible, a:focus-visible,
[tabindex]:focus-visible, summary:focus-visible {
    outline: 3px solid var(--gc-primary-strong, #0069d9);
    outline-offset: 2px;
}
/* Formulářová pole tady SCHVÁLNĚ nejsou. Indikátor fokusu jim kreslí projekt sám:
   `.form-control:focus` a `.inputSet:focus` v publicredesign.css dávají prstenec
   přes `box-shadow: var(--gc-focus-ring)` a obarvují rámeček, přihlašovací pole
   ho dostávají od obalu (`.loginpage-input-group:focus-within` v public.css).
   Obrys navíc kreslil DRUHOU modrou linku kolem téhož pole (nahlášeno 19. 8. 2026).

   POZOR NA MĚŘENÍ: `.form-control` má `transition: all .2s ease !important`, takže
   `getComputedStyle` hned po `focus()` vrátí rozpracovanou hodnotu — dva PLNĚ
   PRŮHLEDNÉ stíny — a vypadá to, že indikátor chybí. Injektovaný
   `*{transition:none}` to nepřebije (jejich pravidlo je `!important`). Měřit až
   po ~300 ms, nebo rovnou screenshotem. */

/* --- Toast: pozitivní zpětná vazba --- */
.gd-toast-wrap {
    position: fixed; left: 50%; bottom: calc(26px + var(--gc-safe-bottom, 0px)); transform: translateX(-50%);
    z-index: 100001; display: flex; flex-direction: column; gap: 8px; align-items: center;
    pointer-events: none;
}
.gd-toast {
    display: flex; align-items: center; gap: 10px;
    background: rgba(17, 24, 39, .93); color: #fff;
    padding: 12px 18px; border-radius: 999px;
    font-size: 15px; font-weight: 600; letter-spacing: .1px;
    box-shadow: 0 12px 34px rgba(0, 0, 0, .3);
    opacity: 0; transform: translateY(14px) scale(.96);
    transition: opacity .28s ease, transform .3s cubic-bezier(.34, 1.56, .64, 1);
    max-width: 92vw;
}
.gd-toast--in { opacity: 1; transform: translateY(0) scale(1); }
.gd-toast-emoji { font-size: 19px; }

/* --- Reakční orb: hover glow (příjemnější, tappable) --- */
.pointReactionOrb { transition: transform .15s ease, box-shadow .18s ease, filter .15s ease; }
.pointReactionOrb:hover { box-shadow: 0 5px 16px rgba(30, 64, 175, .2); }

/* --- Jemný pulz odznaku nepřečtených: 3× pak stop. Upozorní na REÁLNOU aktivitu, nenásilně. --- */
@keyframes gdBadgePulse {
    0%   { box-shadow: 0 0 0 0 rgba(239, 68, 68, .5); }
    70%  { box-shadow: 0 0 0 8px rgba(239, 68, 68, 0); }
    100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); }
}
.gc-mini-chat-badge { animation: gdBadgePulse 2s ease-out 3; }

/* ==========================================================================
   Přístupnost: prefers-reduced-motion (WCAG 2.3.3)
   Projekt má 31 @keyframes a stovky `transition`, ale respektovalo je jen pár
   selektorů. Tenhle blok pokrývá zbytek plošně. Načítá se pozdě, takže přebije
   i pravidla z dřívějších souborů; `!important` je tu nutný, protože většina
   animací sedí v deklaracích s vlastním `!important` (jQuery UI, publicredesign).

   OVĚŘENO, že nic nespoléhá na doběhnutí animace: `transitionend`/`animationend`
   se ve vlastním JS nevyskytuje (jen v nepoužívaném bootstrap.js, který má navíc
   `emulateTransitionEnd` s vlastním timeoutem). Toast v js/gosscard-delight.js
   i emoji burst se uklízejí přes setTimeout, ne přes událost — .01ms přechody
   jim proto nevadí.
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }

    /* Výjimka: „načítám" kolečka. Zastavené kolečko čte uživatel jako zaseknutou
       aplikaci — proto se netlumí na nulu, jen výrazně zpomalí. Stejný kompromis
       už projekt dělá u .gcTranslateSpinner v public.css. */
    .loader,
    .loaderWall,
    .gcTranslateSpinner,
    .gc-map-loading-spinner,
    .gc-posts-preview-spin,
    .gc-nav-start.is-busy .gc-nav-start-icon,
    .btnSetSearch.is-loading::after,
    .searchBtnForm.is-loading::after {
        animation-duration: 2.4s !important;
        animation-iteration-count: infinite !important;
    }
}