/* ================================================================
   UTAZÁSFIGYELŐ — Final Travel Polish
   ================================================================ */

:root {
    --uf-warm-bg: #f7f5f0;
    --uf-warm-bg-2: #f3f1eb;
    --uf-navy: #142235;
    --uf-body: #4f5d68;
    --uf-muted: #7c8991;
    --uf-teal: #0f766e;
    --uf-teal-dark: #0a5f59;
    --uf-blue: #176b87;
    --uf-border-warm: #e7e3db;
}


/* ================================================================
   GLOBAL BACKGROUND
   ================================================================ */

html,
body {
    background: var(--uf-warm-bg) !important;
}

body {
    background-image:
        linear-gradient(
            180deg,
            #fbfaf7 0px,
            #f7f5f0 390px,
            #f5f4ef 100%
        ) !important;
}


/* ================================================================
   HEADER
   ================================================================ */

body > header,
.site-header,
.main-header {
    position: sticky;
    top: 0;
    z-index: 1000;

    min-height: 72px;

    background:
        rgba(255, 255, 255, .91) !important;

    border-bottom:
        1px solid rgba(224, 228, 230, .82);

    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);

    box-shadow:
        0 4px 24px rgba(25, 35, 45, .035);
}


/* Existing header container */

body > header > div,
.site-header > div,
.main-header > div {
    min-height: 72px;

    display: flex;
    align-items: center;
}


/* ================================================================
   LOGO
   ================================================================ */

body > header a:first-child,
.site-header a:first-child,
.main-header a:first-child {
    letter-spacing: -.045em;
}


/* ================================================================
   NAVIGATION
   ================================================================ */

body > header nav,
.site-header nav,
.main-header nav {
    display: flex;
    align-items: center;
    gap: 6px;
}

body > header nav a,
.site-header nav a,
.main-header nav a {
    display: inline-flex;
    align-items: center;

    min-height: 40px;

    padding: 0 13px;

    border-radius: 10px;

    color: #334155;

    font-size: 13px;
    font-weight: 650;

    text-decoration: none;

    transition:
        color .15s ease,
        background .15s ease;
}

body > header nav a:hover,
.site-header nav a:hover,
.main-header nav a:hover {
    color: var(--uf-teal);

    background: #edf6f4;
}


/* ================================================================
   HERO FINOMÍTÁS
   ================================================================ */

.uf-travel-hero {
    margin-top: 0;

    box-shadow:
        0 24px 62px rgba(32, 43, 52, .15) !important;
}

.uf-travel-hero-content {
    background:
        linear-gradient(
            90deg,
            rgba(9, 27, 38, .08),
            transparent 70%
        );
}

.uf-travel-kicker {
    text-shadow:
        0 1px 8px rgba(0,0,0,.18);
}

.uf-travel-destination {
    text-shadow:
        0 3px 18px rgba(0,0,0,.25);
}

.uf-travel-tagline {
    max-width: 520px;

    font-size: 17px;

    text-shadow:
        0 2px 10px rgba(0,0,0,.25);
}


/* ================================================================
   FLOATING TRIP CARD
   ================================================================ */

.uf-floating-trip-card {
    border:
        1px solid rgba(255,255,255,.7);

    box-shadow:
        0 26px 70px rgba(9, 28, 39, .22) !important;
}

.uf-floating-price strong {
    font-size: 32px !important;
}

.uf-floating-price strong::after {
    content: " / fő";

    color: #7a8790;

    font-size: 12px;
    font-weight: 550;

    letter-spacing: 0;
}


/* ================================================================
   SHORTCUT BAR
   ================================================================ */

.uf-trip-shortcuts {
    border-color:
        #e7e4dd !important;

    box-shadow:
        0 14px 42px rgba(36, 48, 58, .10)
        !important;
}

.uf-trip-shortcut {
    transition:
        background .15s ease,
        transform .15s ease;
}

.uf-trip-shortcut:hover {
    background: #f7faf9 !important;
}


/* ================================================================
   TRUST STRIP
   ================================================================ */

.uf-trust-strip {
    margin-top: 21px !important;
    margin-bottom: 28px !important;

    color: #6d797f !important;
}


/* ================================================================
   MAIN TRAVEL SECTIONS
   ================================================================ */

.trip-page > .section,
.trip-page .section,
.uf-exp-section,
.uf-extra-section {
    margin-top: 26px !important;

    padding:
        30px 32px !important;

    border:
        1px solid var(--uf-border-warm)
        !important;

    border-radius:
        24px !important;

    background:
        #fff !important;

    box-shadow:
        0 8px 30px rgba(32, 43, 52, .045)
        !important;
}


/* ================================================================
   SECTION TITLES
   ================================================================ */

.trip-page .section h2,
.uf-exp-title,
.uf-extra-title {
    color:
        var(--uf-navy) !important;

    font-weight: 760 !important;

    letter-spacing: -.032em !important;
}

.trip-page .section h2 {
    font-size: 25px !important;
}

.section-subtitle,
.uf-exp-description,
.uf-extra-subtitle {
    color:
        var(--uf-body) !important;

    font-size: 14px !important;

    line-height: 1.65 !important;
}


/* ================================================================
   SECTION SEPARATION
   ================================================================ */

.uf-exp-section {
    margin-top: 32px !important;
}

.uf-extra-section {
    margin-bottom: 46px;
}


/* ================================================================
   EXPERIENCE CARDS
   ================================================================ */

.uf-experience-grid {
    gap: 18px !important;
}

.uf-experience-card {
    border:
        1px solid #eae7df !important;

    border-radius:
        20px !important;

    overflow: hidden;

    background:
        #fff !important;

    box-shadow:
        0 3px 14px rgba(35, 45, 52, .035);

    transition:
        transform .18s ease,
        box-shadow .18s ease;
}

.uf-experience-card:hover {
    transform:
        translateY(-4px);

    box-shadow:
        0 16px 38px rgba(35, 45, 52, .10)
        !important;
}

.uf-experience-media {
    height: 210px !important;
}


/* ================================================================
   LOCAL IDEAS
   ================================================================ */

.uf-local-grid {
    gap: 12px !important;
}

.uf-local-card {
    border:
        0 !important;

    border-radius:
        16px !important;

    background:
        #f8f7f3 !important;

    box-shadow:
        inset 0 0 0 1px #ebe8e1;
}

.uf-local-card:hover {
    background:
        #fff !important;
}


/* ================================================================
   PROVIDER CARDS
   ================================================================ */

.uf-provider-card {
    border:
        0 !important;

    background:
        #f8f7f3 !important;

    box-shadow:
        inset 0 0 0 1px #ebe8e1;
}


/* ================================================================
   ANCILLARY CARDS
   ================================================================ */

.uf-extra-section {
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfaf6 100%
        ) !important;
}

.uf-extra-card {
    border:
        0 !important;

    background:
        white !important;

    box-shadow:
        inset 0 0 0 1px #e8e4dc,
        0 6px 18px rgba(25, 40, 49, .035);
}


/* ================================================================
   BUTTONS
   ================================================================ */

.uf-btn,
.uf-travel-button {
    font-weight: 720 !important;
}

.uf-btn-primary,
.uf-travel-button-primary {
    background:
        var(--uf-teal) !important;
}

.uf-btn-primary:hover,
.uf-travel-button-primary:hover {
    background:
        var(--uf-teal-dark) !important;
}


/* ================================================================
   FOOTER
   ================================================================ */

footer {
    margin-top: 0;

    padding:
        34px 20px 40px;

    background:
        transparent !important;

    color:
        #77838a;

    font-size:
        12px;

    text-align: center;
}


/* ================================================================
   REMOVE OLD VISUAL LEFTOVERS
   ================================================================ */

.trip-page .legacy-trip-summary,
.trip-page .old-trip-summary,
.trip-page .trip-summary-dark {
    display: none !important;
}


/* ================================================================
   RESPONSIVE
   ================================================================ */

@media(max-width: 760px) {

    body > header,
    .site-header,
    .main-header {
        min-height: 62px;
    }

    body > header > div,
    .site-header > div,
    .main-header > div {
        min-height: 62px;
    }

    .trip-page > .section,
    .trip-page .section,
    .uf-exp-section,
    .uf-extra-section {
        padding:
            22px 20px !important;

        border-radius:
            20px !important;
    }

    .uf-experience-media {
        height:
            190px !important;
    }

}


/* ================================================================
   HOTFIX — DARK BACKGROUND TEXT CONTRAST
   ================================================================ */

/*
|--------------------------------------------------------------------------
| Travel hero title
|--------------------------------------------------------------------------
*/

.trip-page .uf-travel-hero .uf-travel-destination {
    color: #ffffff !important;

    text-shadow:
        0 3px 20px rgba(0, 0, 0, .38) !important;
}


/*
|--------------------------------------------------------------------------
| Hero secondary text
|--------------------------------------------------------------------------
*/

.trip-page .uf-travel-hero .uf-travel-tagline,
.trip-page .uf-travel-hero .uf-travel-fact strong {
    color: #ffffff !important;
}

.trip-page .uf-travel-hero .uf-travel-kicker,
.trip-page .uf-travel-hero .uf-travel-fact-label {
    color: rgba(255,255,255,.78) !important;
}


/*
|--------------------------------------------------------------------------
| Legacy dark flight section
|--------------------------------------------------------------------------
|
| A régi repülő részletező blokk még sötét hátteret használ.
| Minden címét kifejezetten világosra állítjuk.
|
*/

.trip-page .trip-hero h1,
.trip-page .trip-hero h2,
.trip-page .trip-hero h3,

.trip-page .trip-summary h1,
.trip-page .trip-summary h2,
.trip-page .trip-summary h3,

.trip-page .trip-summary-dark h1,
.trip-page .trip-summary-dark h2,
.trip-page .trip-summary-dark h3,

.trip-page .legacy-trip-summary h1,
.trip-page .legacy-trip-summary h2,
.trip-page .legacy-trip-summary h3,

.trip-page .old-trip-summary h1,
.trip-page .old-trip-summary h2,
.trip-page .old-trip-summary h3,

.trip-page .route-title,
.trip-page .trip-title {
    color: #ffffff !important;
}


/*
|--------------------------------------------------------------------------
| Biztonsági célzás a repülő részletek utáni első sötét blokkra
|--------------------------------------------------------------------------
*/

#uf-flight-details + section h1,
#uf-flight-details + section h2,
#uf-flight-details + section h3,

#uf-flight-details + div h1,
#uf-flight-details + div h2,
#uf-flight-details + div h3 {
    color: #ffffff !important;
}


/*
|--------------------------------------------------------------------------
| Dark section body text
|--------------------------------------------------------------------------
*/

.trip-page .trip-hero p,
.trip-page .trip-summary p,
.trip-page .trip-summary-dark p,
.trip-page .legacy-trip-summary p,
.trip-page .old-trip-summary p {
    color: rgba(255,255,255,.82) !important;
}

