/*
 * REHLTAK — Reference alignment
 * Homepage only. No booking/API logic changes.
 */

body.v8-home-page {
    --rx-navy: #072c52;
    --rx-blue: #0869bf;
    --rx-cyan: #149bcb;
    --rx-orange: #f5a623;
    --rx-border: #dbe5ee;
    background: #f4f8fc !important;
}

body.v8-home-page .v8-home {
    font-family: "IBM Plex Sans Arabic", Inter, sans-serif !important;
}

body.v8-home-page .v8-home .rxp-container,
body.v8-home-page .v8-header .topbar-inner,
body.v8-home-page .v8-footer .rx-footer-inner {
    width: min(1320px, calc(100% - 64px)) !important;
    max-width: 1320px !important;
    margin-inline: auto !important;
}

/* Desktop */

@media (min-width: 768px) {

    body.v8-home-page .v8-header {
        min-height: 60px !important;
        background: #072c52 !important;
    }

    body.v8-home-page .v8-header .topbar-inner {
        min-height: 60px !important;
    }

    body.v8-home-page .v8-home .v8-hero {
        min-height: 430px !important;
    }

    body.v8-home-page .v8-home .rxp-hero-copy {
        max-width: 660px !important;
    }

    body.v8-home-page .v8-home .rxp-hero-copy h1 {
        font-size: clamp(34px, 3vw, 48px) !important;
        line-height: 1.3 !important;
        font-weight: 800 !important;
    }

    body.v8-home-page .v8-home .rxp-hero-copy p {
        font-size: 16px !important;
        line-height: 1.8 !important;
    }

    body.v8-home-page .v8-home .v8-search {
        width: min(1120px, 100%) !important;
        max-width: 1120px !important;
        margin-inline: auto !important;
        padding: 8px 12px 14px !important;
        border-radius: 22px !important;
        background: #fff !important;
        box-shadow: 0 15px 38px rgba(5, 38, 75, .19) !important;
    }

    body.v8-home-page .v8-home .v8-tabs {
        width: min(690px, 100%) !important;
        max-width: 690px !important;
        margin-inline-start: 0 !important;
        margin-inline-end: auto !important;
        min-height: 48px !important;
        border-radius: 14px !important;
    }

    body.v8-home-page .v8-home .v8-search .rxp-search-forms {
        padding: 10px 10px 12px !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields {
        display: grid !important;
        grid-template-columns:
            minmax(125px, 1.1fr)
            34px
            minmax(125px, 1.1fr)
            minmax(115px, 1fr)
            minmax(115px, 1fr)
            minmax(155px, 1.25fr)
            minmax(100px, .8fr) !important;
        gap: 9px !important;
        align-items: stretch !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields > * {
        min-width: 0 !important;
        grid-row: 1 !important;
        grid-column: auto !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields .ota-field,
    body.v8-home-page .v8-home .rx-reference-flight-fields .v8-flight-submit {
        min-height: 64px !important;
        border-radius: 11px !important;
    }

    body.v8-home-page .v8-home .v8-quick {
        width: min(1320px, calc(100% - 64px)) !important;
        max-width: 1320px !important;
        margin-inline: auto !important;
        border-radius: 18px !important;
    }

    body.v8-home-page .v8-home .v8-destinations {
        padding-block: 28px !important;
    }

    body.v8-home-page .v8-home .v8-trust {
        padding-block: 18px !important;
    }

    body.v8-home-page .v8-home .v8-app-promo {
        min-height: 120px !important;
        margin-block: 18px 26px !important;
    }
}

/* Mobile */

@media (max-width: 767px) {

    body.v8-home-page .v8-header {
        height: 62px !important;
        min-height: 62px !important;
        background: #fff !important;
    }

    body.v8-home-page .v8-header .topbar-inner {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        height: 62px !important;
        min-height: 62px !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    body.v8-home-page .v8-header .v8-menu-toggle {
        position: absolute !important;
        display: flex !important;
        left: 12px !important;
        right: auto !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 30 !important;
    }

    body.v8-home-page .v8-header .rx-mobile-lang {
        position: absolute !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
        left: 53px !important;
        right: auto !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        min-width: 46px !important;
        height: 30px !important;
        padding: 0 5px !important;
        border: 1px solid #d9e8f4 !important;
        border-radius: 8px !important;
        background: #f1f8fd !important;
        color: #075e9d !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        text-decoration: none !important;
        z-index: 30 !important;
    }

    body.v8-home-page .v8-header .brand {
        position: absolute !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        left: 50% !important;
        right: auto !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: 112px !important;
        height: 56px !important;
        margin: 0 !important;
        padding: 0 !important;
        z-index: 20 !important;
    }

    body.v8-home-page .v8-header .brand-logo {
        width: 108px !important;
        max-width: 108px !important;
        height: auto !important;
        max-height: 52px !important;
        object-fit: contain !important;
        transform: none !important;
    }

    body.v8-home-page .v8-header .v8-mobile-profile {
        position: absolute !important;
        right: 14px !important;
        left: auto !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 30 !important;
    }

    body.v8-home-page .v8-home .rxp-container {
        width: calc(100% - 20px) !important;
        max-width: none !important;
    }

    body.v8-home-page .v8-home .v8-search {
        width: calc(100% - 24px) !important;
        max-width: none !important;
        margin-inline: auto !important;
        padding: 7px !important;
        border-radius: 18px !important;
        background: #fff !important;
        box-shadow: 0 12px 30px rgba(6, 45, 81, .18) !important;
    }

    body.v8-home-page .v8-home .v8-tabs {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        width: 100% !important;
        gap: 4px !important;
        padding: 4px !important;
    }

    body.v8-home-page .v8-home .v8-tabs .ota-tab {
        min-width: 0 !important;
        min-height: 56px !important;
        padding: 5px 2px !important;
        font-size: 11px !important;
    }

    body.v8-home-page .v8-home .rxp-search-forms {
        padding: 12px 10px 14px !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields {
        position: relative !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 9px !important;
        width: 100% !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields > * {
        min-width: 0 !important;
        grid-column: auto !important;
        grid-row: auto !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields > :nth-child(1) {
        grid-column: 1 / -1 !important;
        grid-row: 1 !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields > :nth-child(2) {
        position: absolute !important;
        inset-inline-start: 14px !important;
        top: 50px !important;
        width: 32px !important;
        height: 32px !important;
        z-index: 5 !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields > :nth-child(3) {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields > :nth-child(4) {
        grid-column: 1 !important;
        grid-row: 3 !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields > :nth-child(5) {
        grid-column: 2 !important;
        grid-row: 3 !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields > :nth-child(6) {
        grid-column: 1 / -1 !important;
        grid-row: 4 !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields > :nth-child(7) {
        grid-column: 1 / -1 !important;
        grid-row: 5 !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields .ota-field {
        min-height: 62px !important;
        padding: 9px 11px !important;
        border: 1px solid #dce7f1 !important;
        border-radius: 10px !important;
        background: #fff !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields .ota-field > span {
        font-size: 12px !important;
        font-weight: 700 !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields input,
    body.v8-home-page .v8-home .rx-reference-flight-fields select {
        width: 100% !important;
        min-width: 0 !important;
        font-size: 13px !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields input[type="date"] {
        direction: ltr !important;
        font-size: 12px !important;
    }

    body.v8-home-page .v8-home .rx-reference-flight-fields .v8-flight-submit {
        width: 100% !important;
        min-height: 52px !important;
        border-radius: 10px !important;
        background: #0875c5 !important;
        color: #fff !important;
        font-size: 15px !important;
        font-weight: 800 !important;
    }

    body.v8-home-page .v8-home .v8-quick {
        width: calc(100% - 20px) !important;
        margin-inline: auto !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    body.v8-home-page .v8-home .v8-quick > a {
        min-height: 85px !important;
    }

    body.v8-home-page .v8-home .v8-quick strong {
        font-size: 11px !important;
    }

    body.v8-home-page .v8-home .v8-destinations {
        padding-block: 24px !important;
    }

    body.v8-home-page .v8-home .v8-trust {
        padding-block: 18px !important;
    }

    body.v8-home-page {
        padding-bottom: calc(70px + env(safe-area-inset-bottom)) !important;
    }
}

/* Shared refinements */

body.v8-home-page .v8-home .rx-reference-flight-fields .ota-field {
    min-width: 0 !important;
}

body.v8-home-page .v8-home .rx-reference-flight-fields .ota-field input,
body.v8-home-page .v8-home .rx-reference-flight-fields .ota-field select {
    max-width: 100% !important;
}

body.v8-home-page .v8-home .rx-reference-flight-fields .ota-swap {
    display: grid !important;
    place-items: center !important;
    align-self: center !important;
    justify-self: center !important;
    border-radius: 50% !important;
    background: #eaf6ff !important;
    color: #0875c5 !important;
    border: 1px solid #d7eafa !important;
}

body.v8-home-page .v8-home .rxp-business.v7-business {
    display: none !important;
}

body.v8-home-page .v8-home .v8-destinations .rxp-destination {
    border-radius: 13px !important;
    overflow: hidden !important;
}

body.v8-home-page .v8-home .rxp-quick-icon svg {
    color: #149bcb !important;
}

body.v8-home-page .v8-home a:focus-visible,
body.v8-home-page .v8-home button:focus-visible {
    outline: 3px solid #f5a623 !important;
    outline-offset: 3px !important;
}

/* Mobile airport swap positioning */
@media (max-width: 767px) {

    body.v8-home-page .v8-home
    .rx-reference-flight-fields > .ota-swap {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        right: auto !important;
        inset: auto !important;
        inset-block-start: 50px !important;
        inset-inline-start: 50% !important;
        transform: translateX(-50%) !important;
        width: 34px !important;
        height: 34px !important;
        z-index: 10 !important;
    }
}