/* ================================================================
   ENHANCEMENTS — Scroll reveal animace + zaoblené rohy
   TamToMy Broker šablona
   ================================================================ */

/* ----------------------------------------------------------------
   1. ZAOBLENÉ ROHY — konzistentní border-radius napříč celým webem
   ---------------------------------------------------------------- */

/* --- Fotky / obrázky (sjednoceno na 16px pro všechny rohy) --- */
.welcome-section .broker-content .photo-broker {
    border-radius: 16px !important;
}

.main-image-holder {
    border-radius: 16px !important;
}

.main-image-holder img {
    border-radius: 16px !important;
}

.cover-image {
    border-radius: 16px !important;
}

.wp-block-media-text .wp-block-media-text__media {
    border-radius: 16px !important;
    overflow: hidden !important;
}

/* --- Videa a médiatika (zaoblení rohů sjednocené na 16px / 1.25rem) --- */
video,
iframe,
figure.wp-block-video,
.wp-block-video,
.wp-block-video video,
.wp-block-media-text__media video,
.wp-block-media-text__media figure,
.wp-block-embed,
.wp-block-embed iframe,
.wp-block-embed video,
.wp-block-embed__wrapper {
    border-radius: 16px !important;
    overflow: hidden !important;
}

.wp-block-media-text__media video,
.wp-block-video video {
    display: block !important;
    width: 100% !important;
    border-radius: 16px !important;
}

/* --- Karty / boxy (sjednoceno na 16px pro všechny rohy) --- */
.global-grid .gl-item .image-zone {
    border-radius: 16px !important;
    border-top-left-radius: 16px !important;
    border-top-right-radius: 16px !important;
    border-bottom-left-radius: 16px !important;
    border-bottom-right-radius: 16px !important; /* Oprava: Spodní pravý roh už není ostrý */
}

.global-grid .gl-item .image-zone img {
    border-radius: 16px !important;
}

.global-grid .gl-item .image-zone.white {
    border-radius: 16px !important;
}

.news-item {
    border-radius: 16px !important;
}

.ar-item.ar-hidden {
    border-radius: 16px !important;
}

.ar-reference .ar-item {
    border-radius: 16px !important;
}

.small-news .ar-item .news-holder {
    border-radius: 16px !important;
}

.gallery li a {
    border-radius: 16px !important;
}

.loans {
    border-radius: 16px !important;
}

/* --- Tlačítka (Pill style - 50px) --- */
.btn,
.wp-block-button__link,
.estate-info-grid .box a.flop,
form p label .wpcf7-form-control.wpcf7-submit,
form.hf-form input[type="submit"],
form.hf-form button[type="submit"],
.ar-align-center a.ar-large-btn {
    border-radius: 50px !important;
    -webkit-mask-image: -webkit-radial-gradient(white, black); /* Oprava Safari bugu s ořezem border-radius */
}

.btn:after,
.wp-block-button__link:after,
.estate-info-grid .box a.flop:after,
form p label .wpcf7-form-control.wpcf7-submit:after,
form.hf-form input[type="submit"]:after,
form.hf-form button[type="submit"]:after,
.ar-align-center a.ar-large-btn:after {
    border-radius: 50px !important;
}

/* --- Kruhová tlačítka a šipky (Kruhové - 50% pro propojení s kulatými tlačítky) --- */
.global-grid .gl-item .square {
    border-radius: 50% !important;
}

.slick-prev,
.slick-next {
    border-radius: 50% !important;
}

.ar-estate-grid .box i {
    border-radius: 50% !important;
}

.ar-reference .ar-item .logic .box.profile {
    border-radius: 50% !important;
}

/* --- Formulářová pole (12px pro příjemný vzhled) --- */
form p label .wpcf7-form-control:not(.wpcf7-acceptance),
form.hf-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
form.hf-form textarea,
form.hf-form select {
    border-radius: 12px !important;
}

/* --- Ostatní prvky --- */
.side-panel {
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

.ar-smooth {
    border-top-left-radius: 16px !important;
    border-bottom-left-radius: 16px !important;
}

.estate-info-grid .box:nth-child(1) {
    border-top-left-radius: 16px !important;
    border-bottom-left-radius: 16px !important;
}

.estate-info-grid .box:nth-last-child(1) {
    border-top-right-radius: 16px !important;
    border-bottom-right-radius: 16px !important;
}

.hf-message {
    border-radius: 12px !important;
}

header .header-nav ul.main-menu > li > ul.sub-menu {
    border-radius: 12px !important;
}


/* ----------------------------------------------------------------
   2. SCROLL REVEAL — postupné načítání obsahu
   ---------------------------------------------------------------- */

/* Výchozí stav — skrytý element čekající na zobrazení */
.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}

/* Varianta — přijde zleva */
.reveal-left {
    opacity: 0;
    transform: translateX(-50px);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}

/* Varianta — přijde zprava */
.reveal-right {
    opacity: 0;
    transform: translateX(50px);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}

/* Varianta — přiblíží se (scale) */
.reveal-scale {
    opacity: 0;
    transform: scale(0.92);
    transition: opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: opacity, transform;
}

/* Aktivní stav — prvek je viditelný */
.reveal.is-visible,
.reveal-left.is-visible,
.reveal-right.is-visible,
.reveal-scale.is-visible {
    opacity: 1;
    transform: none;
}

/* Prodlevy pro postupné zobrazení skupin karet */
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }
.reveal-delay-5 { transition-delay: 0.5s; }

/* Titulky sekcí — plynulý nájezd */
.ar-h3.reveal,
h2.reveal {
    transform: translateY(24px);
}

/* Fotky týmu — speciální efekt */
.ar-person .ar-item.reveal {
    transform: translateY(30px);
}

/* Nemovitosti karty */
.estate .ar-item.reveal {
    transform: translateY(30px);
}

/* Blog karty */
.news-item.reveal,
.small-news .ar-item.reveal {
    transform: translateY(30px);
}

/* Uvítací sekce — lehčí animace (již je viditelná při načtení) */
.welcome-section .broker-name > * {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 0.8s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.welcome-section .broker-name span.position { animation-delay: 0.1s; }
.welcome-section .broker-name span.name     { animation-delay: 0.25s; }
.welcome-section .broker-name span.surname  { animation-delay: 0.35s; }
.welcome-section .broker-name div.bio       { animation-delay: 0.5s; }
.welcome-section .broker-name a.btn         { animation-delay: 0.65s; }

.welcome-section .estate-info-grid {
    opacity: 0;
    animation: fadeInUp 0.8s cubic-bezier(0.22, 1, 0.36, 1) 0.8s forwards;
}

.welcome-section .photo-broker {
    opacity: 0;
    transform: translateX(30px);
    animation: fadeInRight 1s cubic-bezier(0.22, 1, 0.36, 1) 0.2s forwards;
}

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInRight {
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Reduce motion — respektujeme uživatelské nastavení */
@media (prefers-reduced-motion: reduce) {
    .reveal,
    .reveal-left,
    .reveal-right,
    .reveal-scale {
        opacity: 1;
        transform: none;
        transition: none;
    }

    .welcome-section .broker-name > *,
    .welcome-section .estate-info-grid,
    .welcome-section .photo-broker {
        opacity: 1;
        transform: none;
        animation: none;
    }
}

/* ----------------------------------------------------------------
   3. OPRAVA FONTU — vynucení správného písma pro popis nemovitosti
   ---------------------------------------------------------------- */
.global-desc .desc,
.global-desc .desc p,
.global-desc .desc span,
.global-desc .desc div,
.global-desc .desc pre,
.global-desc .desc code,
.ar-single-desc,
.ar-single-desc p,
.ar-single-desc span,
.ar-single-desc div,
.entry-content p,
.entry-content span {
    font-family: 'gotham-book', arial, sans-serif !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    white-space: normal !important;
}

.ar-single-desc pre,
.ar-single-desc code {
    white-space: pre-wrap !important;
}

/* ----------------------------------------------------------------
   4. OPRAVA POZICOVÁNÍ HP — první sekce HP pod fixní hlavičkou
   ---------------------------------------------------------------- */
body.home .under-header {
    display: block !important;
    height: 120px !important; /* Zobrazení odsazení i na velkých monitorech (nad 1400px) */
}

@media screen and (max-width: 1400px) {
    body.home .under-header {
        height: 120px !important;
    }
}

@media screen and (max-width: 800px) {
    body.home .under-header {
        height: 84px !important;
    }
}

/* ----------------------------------------------------------------
   5. OPRAVA OŘÍZNUTÍ FOTKY — zabránění useknutí hlavy na HP
   ---------------------------------------------------------------- */

/* Varianta A: Klasická fotka v zaobleném rámečku (tuto máte aktivní) */
.welcome-section .broker-content .photo-broker {
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center top !important; /* Zarovnání k hornímu okraji rámečku (neusekne se hlava) */
    top: 50px !important;    /* Vracíme odsazení rámečku odshora */
    bottom: 50px !important; /* Vracíme odsazení rámečku odspoda (nelevituje) */
    border-radius: 16px !important;
}

/* Varianta B: Oříznutá fotka postavy bez pozadí (stojící na zemi) */
.welcome-section .broker-content .photo-broker-fixed {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: bottom right !important;
    top: 0 !important;
    bottom: 0 !important;
    border-radius: 0 !important;
}

/* Mobilní zobrazení (pro obě varianty sjednoceno tak, aby byla fotka celá) */
@media screen and (max-width: 800px) {
    .welcome-section .broker-content .photo-broker,
    .welcome-section .broker-content .photo-broker-fixed {
        background-size: contain !important;
        background-position: bottom center !important;
        height: 400px !important;
        position: relative !important;
        width: 100% !important;
        margin-top: 20px !important;
        top: auto !important;
        bottom: auto !important;
    }
}

/* ----------------------------------------------------------------
   6. ZAMEZENÍ HORIZONTÁLNÍMU POSUVNÍKU (SCROLLBARU)
   ---------------------------------------------------------------- */
html,
body {
    overflow-x: clip !important; /* Zabrání přetečení prvků při posunech v animacích */
}

/* Fallback pro starší prohlížeče, které nepodporují 'clip' */
@supports not (overflow-x: clip) {
    html,
    body {
        overflow-x: hidden !important;
    }
}

/* ----------------------------------------------------------------
   7. FILTROVÁNÍ REFERENCÍ (Přepínač na podstránce /reference)
   ---------------------------------------------------------------- */
.ar-reference-filter {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin: 0 auto 40px auto;
    max-width: 800px;
}

.filter-btn {
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: rgba(255, 255, 255, 0.85);
    color: #333;
    padding: 10px 24px;
    font-size: 13px;
    font-weight: bold;
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.25s ease;
    box-shadow: rgba(0, 0, 0, 0.03) 0px 2px 4px;
    font-family: 'gotham-book', arial, sans-serif;
}

.filter-btn:hover {
    background: #ffffff;
    border-color: rgba(0, 0, 0, 0.15);
    transform: translateY(-1px);
    box-shadow: rgba(0, 0, 0, 0.06) 0px 3px 6px;
}

.filter-btn.active {
    background: var(--secondary-color) !important; /* V tmavě modré/sekundární barvě webu */
    color: var(--white-color) !important;
    border-color: var(--secondary-color) !important;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 8px;
}

/* ----------------------------------------------------------------
   8. ÚPRAVA BAREV — změna z černé na sekundární barvu
   ---------------------------------------------------------------- */

/* Formulářové inputy — změna černého borderu na primární barvu */
form p label .wpcf7-form-control:not(.wpcf7-acceptance),
form.hf-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
form.hf-form textarea,
form.hf-form select {
    border: 2px solid var(--primary-color) !important;
}

/* Změna barvy rámečku při focusu pro interaktivní odezvu na sekundární barvu */
form p label .wpcf7-form-control:not(.wpcf7-acceptance):focus,
form.hf-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):focus,
form.hf-form textarea:focus,
form.hf-form select:focus {
    border-color: var(--secondary-color) !important;
}

/* AppFooter — změna černého pozadí na sekundární barvu */
.AppFooter {
    background: var(--secondary-color) !important;
}

/* ----------------------------------------------------------------
   9. SAFARI FLICKER BUG — oprava problikávání tlačítek na Safari
   ---------------------------------------------------------------- */
.btn,
.wp-block-button__link,
.estate-info-grid .box a.flop,
form p label .wpcf7-form-control.wpcf7-submit,
form.hf-form input[type="submit"],
form.hf-form button[type="submit"],
.ar-align-center a.ar-large-btn {
    -webkit-transform: translate3d(0, 0, 0) !important;
    transform: translate3d(0, 0, 0) !important;
    -webkit-backface-visibility: hidden !important;
    backface-visibility: hidden !important;
}

.btn:after,
.wp-block-button__link:after,
.estate-info-grid .box a.flop:after {
    -webkit-transform: translate3d(0, 0, 0) !important;
    transform: translate3d(0, 0, 0) !important;
    -webkit-backface-visibility: hidden !important;
    backface-visibility: hidden !important;
}

/* ----------------------------------------------------------------
   10. LOGO NA POZADÍ BÉŽOVÝCH SEKCE (.glitch)
   ---------------------------------------------------------------- */
/* Pouze pro béžové pozadí (vynechá tmavě modré .glitch-secondary) */
body .glitch:not(.glitch-secondary):after {
    display: block !important;
    content: '' !important;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100% !important;
    height: 100% !important;
    background-image: url('../../img/logo-bg.png') !important;
    background-repeat: no-repeat !important;
    /* Umístíme ho jako obří oříznutý grafický motiv na pravém okraji */
    background-position: calc(100% + 150px) 50% !important;
    background-size: 700px !important;
    mix-blend-mode: screen !important;
    opacity: 0.35 !important; /* Zvýšeno na 35% pro lepší viditelnost */
    z-index: -1 !important;
    pointer-events: none;
    border-radius: 0 !important;
    transform: none !important;
}

/* Na tmavě modrých sekcích (.glitch-secondary) logo zakážeme, aby nerušilo */
body .glitch.glitch-secondary:after {
    display: none !important;
    content: none !important;
}

/* Responzivní přizpůsobení velikosti loga pro tablety a mobily */
@media (max-width: 1024px) {
    body .glitch:not(.glitch-secondary):after {
        background-size: 550px !important;
        background-position: calc(100% + 100px) 50% !important;
        opacity: 0.25 !important; /* Zvýšeno na 25% */
    }
}

@media (max-width: 768px) {
    body .glitch:not(.glitch-secondary):after {
        background-size: 350px !important;
        background-position: calc(100% + 80px) 50% !important;
        opacity: 0.16 !important; /* Zvýšeno na 16% */
    }
}

/* ================================================================
   POJIŠŤOVACÍ TABULKA — [pojisteni-tabulka]
   ================================================================ */

.poj-table-wrap {
    width: 100%;
    margin: 2em 0;
    font-size: 14px;
}

.poj-table-scroll {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 12px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}

/* --- Tabulka --- */
.poj-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    min-width: 640px;
}

/* --- Záhlaví sloupců --- */
.poj-table thead tr {
    border-bottom: 2px solid #e8eef5;
}

.poj-table__col-head {
    padding: 28px 16px 22px;
    text-align: center;
    vertical-align: top;
    width: 14%;
    border-left: 1px solid #e8eef5;
}

.poj-table__col-head:first-of-type {
    border-left: none;
}

.poj-table__col-name {
    display: block;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: var(--primary-color, #1a5fa8);
    margin-bottom: 8px;
    text-transform: uppercase;
}

.poj-table__col-desc {
    display: block;
    font-size: 13px;
    line-height: 1.55;
    color: #4a5568;
    font-weight: 400;
}

/* --- Zvýraznění MAX sloupce --- */
.poj-table__col-head--max {
    background: color-mix(in srgb, var(--primary-color, #1a5fa8) 6%, transparent);
}

.poj-table td:last-child {
    background: color-mix(in srgb, var(--primary-color, #1a5fa8) 4%, transparent);
}

/* --- Řádky --- */
.poj-table__row {
    border-bottom: 1px solid #e8eef5;
    transition: background 200ms ease;
}

.poj-table__row:last-child {
    border-bottom: none;
}

.poj-table__row:hover {
    background: #f7fafd;
}

/* --- Popisek řádku (první buňka) --- */
.poj-table__row-label {
    padding: 16px 18px;
    vertical-align: middle;
    text-align: left;
    white-space: nowrap;
}

thead .poj-table__row-label {
    width: 44%;
}

.poj-table__row-name {
    font-size: 15px;
    font-weight: 600;
    color: #0d1a27;
    margin-right: 6px;
}

/* --- Datová buňka --- */
.poj-table__cell {
    text-align: center;
    vertical-align: middle;
    padding: 14px 16px;
    border-left: 1px solid #e8eef5;
}

/* --- SVG ikony ✓ / ✗ --- */
.poj-icon {
    display: inline-block;
    width: 22px;
    height: 22px;
    flex-shrink: 0;
}

.poj-icon--yes {
    color: #2db37a;
}

.poj-icon--no {
    color: #c0c9d4;
}

/* ----------------------------------------------------------------
   TOOLTIP — ℹ️ ikona s bublinkou
   ---------------------------------------------------------------- */

.poj-tooltip {
    position: relative;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    cursor: pointer;
    margin-left: 4px;
}

.poj-tooltip__icon {
    width: 16px;
    height: 16px;
    color: var(--primary-color, #1a5fa8);
    opacity: 0.55;
    transition: opacity 180ms ease, transform 180ms ease;
    flex-shrink: 0;
    display: block;
}

.poj-tooltip:hover .poj-tooltip__icon,
.poj-tooltip:focus .poj-tooltip__icon,
.poj-tooltip:focus-within .poj-tooltip__icon {
    opacity: 1;
    transform: scale(1.15);
}

/* Bublinka */
.poj-tooltip__bubble {
    position: absolute;
    left: 0;
    bottom: calc(100% + 10px);
    transform: none;
    width: min(260px, calc(100vw - 32px));
    background: #1a2a3a;
    color: #fff;
    font-size: 12px;
    line-height: 1.6;
    font-weight: 400;
    padding: 10px 14px;
    border-radius: 8px;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transition: opacity 200ms ease, visibility 200ms ease;
    z-index: 200;
    white-space: normal;
    text-align: left;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
}

/* Šipka dolů — zarovnaná doleva k ikoně */
.poj-tooltip__bubble::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 10px;
    transform: none;
    border: 6px solid transparent;
    border-top-color: #1a2a3a;
}

/* Zobrazení bublinky */
.poj-tooltip:hover .poj-tooltip__bubble,
.poj-tooltip:focus .poj-tooltip__bubble,
.poj-tooltip:focus-within .poj-tooltip__bubble {
    opacity: 1;
    visibility: visible;
}

/* Bublinka u prvních dvou řádků — zobrazit dolů, aby nepřetékala za header */
.poj-table__row:nth-child(-n+2) .poj-tooltip__bubble {
    bottom: auto;
    top: calc(100% + 10px);
}

.poj-table__row:nth-child(-n+2) .poj-tooltip__bubble::after {
    top: auto;
    bottom: 100%;
    border-top-color: transparent;
    border-bottom-color: #1a2a3a;
    left: 10px;
    transform: none;
}

/* ----------------------------------------------------------------
   RESPONSIVITA — mobil (pod 640px)
   ---------------------------------------------------------------- */
@media (max-width: 640px) {
    .poj-table-scroll {
        border-radius: 8px;
    }

    .poj-table {
        min-width: 100%;
    }

    .poj-table thead {
        display: none;
    }

    .poj-table__row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0;
        border-bottom: 2px solid #e8eef5;
        padding: 12px 0;
    }

    .poj-table__row-label {
        grid-column: 1 / -1;
        display: flex;
        align-items: center;
        padding: 8px 16px 4px;
        white-space: normal;
    }

    .poj-table__row-name {
        font-weight: 700;
        font-size: 13px;
    }

    .poj-table__cell {
        border-left: none;
        border-top: 1px solid #e8eef5;
        padding: 8px 12px;
        display: flex;
        align-items: center;
        gap: 6px;
        font-size: 12px;
        color: #6b7a8d;
    }

    .poj-table__cell::before {
        content: attr(data-label);
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 0.06em;
        color: var(--primary-color, #1a5fa8);
        text-transform: uppercase;
        display: block;
        margin-right: 4px;
        min-width: 48px;
    }

    .poj-icon {
        width: 18px;
        height: 18px;
    }

    .poj-tooltip__bubble {
        width: min(220px, calc(100vw - 24px));
        left: 0;
        transform: none;
    }

    .poj-tooltip__bubble::after {
        left: 10px;
        transform: none;
    }
}