:root {
    --xix-black: #101010;
    --xix-red: #E4262C;
    --xix-white: #FFFFFF;
    --xix-amber: #F2A93B;
    --xix-text: #4A4A4A;
    --xix-light: #F2F2F2;
    /* PDF-defined supporting colors */
    --xix-footer-link: #D9D9D9;
    --xix-success-bg: #DCF5DF;
    --xix-success-text: #1E7B34;
}

/*=====================================================
LOGIN POP UP
======================================================*/

/* Personal Account Active */
body li[data-cy="personalLogin"].active {
    background: #E4262C !important;
    background-image: none !important;
}

/* Personal Account Continue button */
body button[data-cy="continueBtn"] {
    background: #E4262C !important;
    border: none !important;
}

/* My Account Active */
body li[data-acctype="myBiz"].active {
    background: #E4262C !important;
    background-image: none !important;
}

body #btn_email_login,
body #btnMobileLogin {
    background: #E4262C !important;
    background-image: none !important;
    color: #fff !important;
}


/* ==========================================================
   XIX Trips Typography System
========================================================== */

body {
    background: #FFFFFF;
    color: #4A4A4A;
    font-family: "Inter", "Poppins", "Helvetica Neue", sans-serif;
    font-size: 14px;
    line-height: 1.5;
}

/* H1 - Page Titles */
h1 {
    font-size: 32px;
    font-weight: 700;
    color: #101010;
}

/* H2 - Section Headings */
h2 {
    font-size: 24px;
    font-weight: 700;
    color: #101010;
}

/* H3 - Card / Component Titles */
h3 {
    font-size: 18px;
    font-weight: 600;
    color: #101010;
}

/* Body Text */
p {
    font-size: 14px;
    font-weight: 400;
    color: #4A4A4A;
}

/* Small / Caption Text */
.font11,
.font12 {
    font-size: 12px;
    font-weight: 400;
    color: #4A4A4A;
}

/* search button in card */
.primaryBtn,
.widgetSearchBtn {
    background: #E4262C !important;
    color: #FFFFFF !important;
    border: none !important;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
}






/* ===============================
  this is for Airport Names from to departure fonts control
================================ */

.airPortName,
.fsw_inputField,
.font30 {
    color: #101010;
    font-weight: 700;
}

/* =====================================
this is for 
    One Way
Round Trip
Multi City desiging
===================================== */

.fswTabs li {
    color: #101010 !important;
    font-weight: 700;
}

    .fswTabs li.selected {
        color: #E4262C !important;
        border-bottom: 3px solid #E4262C !important;
    }

    .fswTabs li:hover {
        color: #E4262C !important;
    }

/* this is for Active radio circle red */

.tabsCircle {
    border-color: #E4262C !important;
}

.fswTabs li.selected .tabsCircle {
    background: #E4262C !important;
}





/* ----------------------------------------------------------
  this code do EXTRA SAVINGS badge yellow
  
---------------------------------------------------------- */

.titleTag {
    background: #F2A93B !important;
    background-image: none !important;
}

    .titleTag .dtTag {
        color: #101010 !important;
        font-size: 12px !important;
        font-weight: 700 !important;
    }






/* ==========================================================
   
Regular
Regular fares

Student
Extra discounts/baggage

Senior Citizen
Up to ₹ 600 off

Armed Forces
Up to ₹ 600 off

Doctor and Nurses
Up to ₹ 600 off this code for this active status show red
========================================================== */

/* Reset all fare cards to default */
#fareTypeOptions .fareCardItem {
    background-color: #FFFFFF !important;
    border-color: #D8D8D8 !important;
}

    /* Reset all fare card title colors */
    #fareTypeOptions .fareCardItem .blackText {
        color: #4A4A4A !important;
    }

    /* Currently selected fare card */
    #fareTypeOptions .fareCardItem:has(input[type="radio"]:checked) {
        background-color: #FFFFFF !important;
        border-color: #E4262C !important;
    }

        /* Currently selected fare title */
        #fareTypeOptions .fareCardItem:has(input[type="radio"]:checked) .blackText {
            color: #E4262C !important;
        }

        /* Selected radio outer circle */
        #fareTypeOptions .fareCardItem:has(input[type="radio"]:checked) .customRadioBtn .outer {
            border-color: #E4262C !important;
        }

        /* Selected radio inner circle */
        #fareTypeOptions .fareCardItem:has(input[type="radio"]:checked) .customRadioBtn .inner {
            background-color: #E4262C !important;
        }



/* ----------------------------------------------------------
   SEARCH & FORM CARDS background
---------------------------------------------------------- */

/* Search & Form Card */
.fsw_inner {
    background-color: var(--xix-light) !important;
}

/* Individual fields */
.flt_fsw_inputBox {
    background-color: transparent !important;
}

    /* Field labels */
    .flt_fsw_inputBox .lbl_input {
        color: var(--xix-text) !important;
    }

    /* Field values */
    .flt_fsw_inputBox .fsw_inputField,
    .flt_fsw_inputBox .airPortName {
        color: var(--xix-black) !important;
    }

/* ----------------------------------------------------------
   FOOTER
---------------------------------------------------------- */

.site-footer {
    background-color: var(--xix-black) !important;
}

    .site-footer a {
        color: var(--xix-footer-link) !important;
    }



/* ----------------------------------------------------------
   (Handpicked Collections for You ) formatting
---------------------------------------------------------- */

.hpClcn__heading {
    font-size: 32px !important;
    font-weight: 700 !important;
    color: var(--xix-black) !important;
}


/* ----------------------------------------------------------
   TOP 8 / TOP 9 / TOP 11 Badge Designing
---------------------------------------------------------- */

.hpClcn__slider--itemDescTop {
    background-color: var(--xix-amber) !important;
    color: var(--xix-black) !important;
    font-weight: 700 !important;
}
/*-----------------------------------------------------------
    That is login button formatting
--------------------------------------------------------- */
#userLoggedOut {
    background: var(--xix-red) !important;
    color: var(--xix-white) !important;
}

    #userLoggedOut * {
        color: var(--xix-white) !important;
        -webkit-text-fill-color: var(--xix-white) !important;
    }



/* ==========================================================
   XIX Trips - Header & Navigation
========================================================== */

/* Home page header strip */
.landingContainer .prependTop5.appendBottom30 {
    background: var(--xix-black) !important;
    background-image: none !important;
}

/* Home navigation + inner page header background */
.chHeaderWrapper.navOnly nav,
.singleHeader .headerOuter,
.singleHeader .chHeaderWrapper,
.singleHeader .chHeaderContainer,
.singleHeader .chHeaderWrapper nav {
    background: var(--xix-black) !important;
    background-image: none !important;
}

    /* Inactive navigation text */
    .navOnly .chHeaderContainer nav ul li a .chNavText,
    .singleHeader .chHeaderContainer nav .chNavText {
        color: var(--xix-white) !important;
    }

/* Home navigation inactive text: remove underline */
.navOnly .chHeaderContainer nav ul li a .chNavText {
    border-bottom: none !important;
    text-decoration: none !important;
}

/* Active navigation text */
.navOnly .chHeaderContainer nav a.active .chNavText,
.singleHeader .chHeaderContainer nav a.active .chNavText {
    color: var(--xix-red) !important;
}

/* Active navigation underline */
.navOnly .chHeaderContainer nav a.active::after,
.singleHeader .chHeaderContainer nav a.active::after {
    background: var(--xix-red) !important;
}

/* NEW badge */
.navOnly .newTagImage,
.singleHeader .newTagImage {
    background: var(--xix-amber) !important;
    background-image: none !important;
    color: var(--xix-black) !important;
}


/*--------------------------------------------SERACH FLIGHT PAGE EDITING-----------------------------------------------------------------*/
/*=====================================================
XIX TRIPS - SEARCH HEADER
=====================================================*/

header.search-bar #search-widget,
header.search-bar .hsw,
header.search-bar .hsw_inner {
    background: #101010 !important;
    background-image: none !important;
}

header.search-bar .search-bar-fare-selection-container {
    background: #101010 !important;
}

.fakeDivHeight10 {
    background: #101010 !important;
}



/*=====================================================
XIX TRIPS - SEARCH FIELDS EDITING
=====================================================*/

.hsw_inputBox,
.selectDropdown {
    background: #fff !important;
    cursor: pointer;
}

.lbl_input {
    color: #5B5B5B !important;
}

.hsw_inputField,
.hsw_inputField::placeholder,
.multiDropDownVal {
    color: #101010 !important;
}



/*=====================================================
XIX TRIPS - FARE TYPE EDITING
=====================================================*/

/* Fare Type title */
.search-bar-fare-selection-container .lighterGreyText {
    color: #FFFFFF !important;
}
/* Fare Type background */
.search-bar-fare-selection-container,
.search-bar-fare-selection-container .fareSelectionContainer,
.search-bar-fare-selection-container .fareTypeWrapper,
.search-bar-fare-selection-container .makeFlex.hrtlCenter {
    background: #101010 !important;
}

/* Selected fare radio */
.search-bar .fareCardItem.active .radioSelect {
    background: #E4262C !important;
    border: 3px solid #FFFFFF !important;
}

/* Fare type cards */
.fareTypeOptions .fareCardItem {
    background: #FFFFFF !important;
    border: 1px solid #D8D8D8 !important;
    color: #101010 !important;
}
    /* Selected fare */
    .fareTypeOptions .fareCardItem.active,
    .fareTypeOptions .fareCardItem.selected {
        background: #E4262C !important;
        border-color: #E4262C !important;
        color: #FFFFFF !important;
    }



/*=====================================================
XIX TRIPS - Applied fillter EDITING
=====================================================*/
/*clear all button*/
body .filterWrapper .clearFilter,
body .filterWrapper .clearAll {
    color: #E4262C !important;
    font-weight: 600 !important;
}



/* price slider Filled Part */
#priceSlider .ui-slider-range {
    background: #E4262C !important;
}


/*=====================================================
XIX TRIPS - Date CONTAINER EDITING
=====================================================*/

.weeklyFareItems.activeDate {
    border-bottom: 3px solid #E4262C !important;
    background: #FFF8F8 !important;
}



/* ===========================
   VIEW PRICES BUTTON
=========================== */

/* View Prices Button */
.ViewFareBtn {
    min-width: 150px !important;
    height: 38px !important;
    border: 2px solid #E4262C !important;
    border-radius: 12px !important;
    background: #FFFFFF !important;
    color: #E4262C !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    transition: .3s;
}


    .ViewFareBtn:hover {
        background: #E4262C !important;
        color: #fff !important;
    }












/* ==========================================================
   XIX TRIPS - REVIEW DETAILS / BOOKING PAGE Editing
========================================================== */


/* ----------------------------------------------------------
   PAGE BACKGROUND
   PDF: Pure White
---------------------------------------------------------- */

body.fontScale.listingV2bg,
.flightBody {
    background: var(--xix-white) !important;
}


    /* Remove old blue background layer */
    .flightBody > .bgGradient {
        display: none !important;
    }


/* ----------------------------------------------------------
   "COMPLETE YOUR BOOKING" HEADER
   PDF: XIX Black
---------------------------------------------------------- */

.pageStickyHder {
    background: var(--xix-black) !important;
}

    .pageStickyHder .headerTitle,
    .pageStickyHder .pageLinksUl li,
    .pageStickyHder .pageLinksUl span {
        color: var(--xix-white) !important;
    }


/* ----------------------------------------------------------
   MAIN CARDS
   PDF: Pure White
---------------------------------------------------------- */

.oneCard-element,
.componentContainer,
.fareSummary {
    background: var(--xix-white) !important;
}


/* ----------------------------------------------------------
   SECTION HEADINGS
   PDF: #101010
---------------------------------------------------------- */

.pageStickyHder .headerTitle {
    font-size: 24px !important;
    font-weight: 700 !important;
}

.fareSummary > div:first-child [data-test="component-title"] {
    color: var(--xix-black) !important;
    font-size: 24px !important;
    font-weight: 700 !important;
}


/* ----------------------------------------------------------
   BODY / NORMAL TEXT
   PDF: #4A4A4A
---------------------------------------------------------- */

.fareSummary .darkText,
.fareSummary .fareRow__text {
    color: var(--xix-text) !important;
}


/* ----------------------------------------------------------
   FARE ROW HEADINGS
   PDF: #101010
---------------------------------------------------------- */

.fareSummary .fareHeader,
.fareSummary .fareHeader b,
.fareSummary [data-test="component-tot_txt"] {
    color: var(--xix-black) !important;
}


/* ----------------------------------------------------------
   PRICE DISPLAY
   PDF: Signal Red #E4262C
---------------------------------------------------------- */

#idBaseFareText,
#idTaxesandSurchargesText,
#idOtherServicesTotal,
.fareSummary [data-test="component-tot_fare"],
.addedPriceWrapper .js-addedPrice {
    color: var(--xix-red) !important;
    font-weight: 800 !important;
}


/* Total Amount */
.fareSummary [data-test="component-tot_fare"] {
    font-size: 22px !important;
}


/* ----------------------------------------------------------
   REFUNDABLE TAG
   PDF:
   Background #DCF5DF
   Text #1E7B34
---------------------------------------------------------- */

.refundabletag {
    background: #DCF5DF !important;
    background-image: none !important;
    color: #1E7B34 !important;
}

    .refundabletag font {
        color: #1E7B34 !important;
    }


/* ----------------------------------------------------------
   continue button formatting
---------------------------------------------------------- */

.buttonPrimary {
    background: var(--xix-red) !important;
    color: var(--xix-white) !important;
}


/* ----------------------------------------------------------
   View Fare Rules text formatting
---------------------------------------------------------- */

.linkText,
[data-test="component-cta_link"] {
    color: var(--xix-red) !important;
}







/* ==========================================================
   XIX TRIPS - PAYMENT PAY PAGE Editing
========================================================== */

/* Payment Details heading */
.sectionTitle {
    color: #101010 !important;
}

/* Pay Amount text */
.paymentLabel,
.paymentValue {
    color: #101010 !important;
}

/* Radio button */
input[type="radio"] {
    accent-color: #E4262C !important;
}

/* Pay Now button */
#btnsubmit {
    background: #E4262C !important;
    border: 1px solid #E4262C !important;
    color: #fff !important;
}

    #btnsubmit:hover {
        background: #C91F25 !important;
    }



/*--------------------------------------------------MOBILE VERSION EDITING-------------------------------------------------------*/


/*----------------------------------------LOGIN LOGOUT EDIT START HERE------------------------------------------------*/
/* =========================================
   LOGIN NOW BUTTON
   ========================================= */

a[data-cy="LoginProfileBtn_click"] {
    display: inline-flex !important;
    align-items: center !important;
    padding: 0px 8px !important;
    background: var(--xix-white) !important;
    border-radius: 20px !important;
    color: var(--xix-black) !important;
    text-decoration: none !important;
    font-family: "Inter", "Poppins", "Helvetica Neue", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 550 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
    transition: all 0.2s ease !important;
}

    /* Login icon */
    a[data-cy="LoginProfileBtn_click"] .bVzLGE {
        width: 25px !important;
        height: 15px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: var(--xix-red) !important;
        border-radius: 50% !important;
        position: relative !important;
        opacity: 1 !important;
        filter: none !important;
    }
    /* =========================================
   LOGIN NOW - USER ICON
   ========================================= */

    a[data-cy="LoginProfileBtn_click"] .bVzLGE {
        width: 15px !important;
        height: 28px !important;
        display: inline-block !important;
        flex: 0 0 30px !important;
        position: relative !important;
        background: var(--xix-red) !important;
        border-radius: 50% !important;
        background-image: none !important;
    }

        /* User head */
        a[data-cy="LoginProfileBtn_click"] .bVzLGE::before {
            content: "" !important;
            position: absolute !important;
            top: 6px !important;
            left: 10px !important;
            width: 8px !important;
            height: 8px !important;
            background: var(--xix-white) !important;
            border-radius: 50% !important;
            display: block !important;
        }

        /* User body */
        a[data-cy="LoginProfileBtn_click"] .bVzLGE::after {
            content: "" !important;
            position: absolute !important;
            left: 6px !important;
            bottom: 5px !important;
            width: 16px !important;
            height: 9px !important;
            background: var(--xix-white) !important;
            border-radius: 10px 10px 6px 6px !important;
            display: block !important;
        }

    /* Hover */
    a[data-cy="LoginProfileBtn_click"]:hover {
        border-color: var(--xix-red) !important;
        box-shadow: 0 4px 12px rgba(228, 38, 44, 0.15) !important;
    }

    a[data-cy="LoginProfileBtn_click"]:hover {
        color: var(--xix-white) !important;
    }
/* =========================================
   LOGGED-IN PROFILE
   ========================================= */

a[data-cy="loggedIn_Profile_click"] {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 6px 12px !important;
    background: var(--xix-white) !important;
    border: 1px solid #e6e6e6 !important;
    border-radius: 20px !important;
    color: var(--xix-black) !important;
    text-decoration: none !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
    transition: all 0.2s ease !important;
}

    /* Avatar */
    a[data-cy="loggedIn_Profile_click"] .userProfileAbbr {
        width: 25px !important;
        height: 20px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: var(--xix-red) !important;
        color: var(--xix-white) !important;
        border-radius: 50% !important;
        font-size: 13px !important;
        font-weight: 700 !important;
    }

    /* Guest / Username */
    a[data-cy="loggedIn_Profile_click"] .userLoggedInPWA {
        color: var(--xix-black) !important;
        font-family: "Inter", "Poppins", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        letter-spacing: 0.2px !important;
    }

    /* Hover */
    a[data-cy="loggedIn_Profile_click"]:hover {
        border-color: var(--xix-red) !important;
        box-shadow: 0 4px 12px rgba(228, 38, 44, 0.15) !important;
    }

        a[data-cy="loggedIn_Profile_click"]:hover .userLoggedInPWA {
            color: var(--xix-white) !important;
        }

#loginSubmitButton, .uiButton .button--primary {
    background: var(--xix-red) !important;
}

/* =========================================
   MOBILE MENU ICON
   ========================================= */

/* =========================================
   HAMBURGER MENU - WHITE
   ========================================= */

[data-cy="sideMenuIconClick"] {
    color: var(--xix-white) !important;
}

    [data-cy="sideMenuIconClick"] span {
        display: block !important;
        width: 16px !important;
        height: 2px !important;
        background: var(--xix-white) !important;
        background-color: var(--xix-white) !important;
        border: 0 !important;
        box-shadow: none !important;
        opacity: 1 !important;
    }


    /*------------------------------------------Login logout edit end here-------------------------------------------------------*/
/* ==========================================================
   XIX TRIPS - HOME PAGE
========================================================== */

@media (max-width: 767px) {

    /* ------------------------------------------------------
       MOBILE HEADER
       PDF: #101010 background
    ------------------------------------------------------ */

    .mobile .frJBog {
        background: var(--xix-black) !important;
        background-image: none !important;
    }


    /* ------------------------------------------------------
       PRIMARY MOBILE NAVIGATION
       PDF:
       Background #101010
       Inactive text #FFFFFF
    ------------------------------------------------------ */

    .mobile .UQyCp {
        background: var(--xix-black) !important;
    }

        .mobile .UQyCp a p {
            color: var(--xix-black) !important;
        }

        /* Active item, when your application adds .active */
        .mobile .UQyCp a.active p {
            color: var(--xix-red) !important;
        }


    /* ------------------------------------------------------
       LOGIN / PROFILE CTA
       PDF:
       Background #E4262C
       Text #FFFFFF
    ------------------------------------------------------ */

    .mobile a[data-cy="LoginProfileBtn_click"],
    .mobile a[data-cy="loggedIn_Profile_click"] {
        background: var(--xix-red) !important;
        background-image: none !important;
        color: var(--xix-white) !important;
    }

        .mobile a[data-cy="LoginProfileBtn_click"] *,
        .mobile a[data-cy="loggedIn_Profile_click"] * {
            color: var(--xix-white) !important;
        }


    /* ------------------------------------------------------
       FOOTER / USEFUL LINKS
       PDF:
       Background #101010
       Links #D9D9D9
    ------------------------------------------------------ */

    .mobile .usefullLinks {
        background: var(--xix-black) !important;
    }

        .mobile .usefullLinks h2,
        .mobile .usefullLinks a,
        .mobile .usefullLinks .lightGreyText {
            color: #D9D9D9 !important;
        }
}




/* ==========================================================
   XIX TRIPS - MOBILE FLIGHT PAGE
========================================================== */

@media (max-width: 767px) {

    /* ======================================================
       FULL FLIGHT SEARCH HEADER
       Black #101010
    ====================================================== */


    body.mobile.in .lndngFltPrgsvWrap--hdr {
        position: relative !important;
        background: #101010 !important;
        color: #FFFFFF !important;
        box-shadow: 0 0 0 100vmax #101010 !important;
        clip-path: inset(0 -100vmax) !important;
    }

    body.mobile.in h1.seo-heading {
        background: #101010 !important;
    }

    /* Header text */
    body.mobile.in .lndngFltPrgsvWrap--hdr,
    body.mobile.in .lndngFltPrgsvWrap--hdr * {
        color: #FFFFFF !important;
    }

    /* ===========================================
   XIX - Header Back Arrow
=========================================== */

    body.mobile.in .sp__srchFrmSprt--bckArw {
        color: #FFFFFF !important;
        filter: brightness(0) invert(1) !important;
        opacity: 1 !important;
    }

    /* =====================================================
   XIX - Hindi Button
===================================================== */

    /* Button */
    body.mobile.in .languageSwitch,
    body.mobile.in .langSwitcherCls {
        background: #101010 !important;
        border: 2px solid #FFFFFF !important;
        border-radius: 20px !important;
    }

        /* Hindi text */
        body.mobile.in .languageSwitch .languageText,
        body.mobile.in .langSwitcherCls .languageText,
        body.mobile.in .languageText_eng,
        body.mobile.in .blueText {
            color: #FFFFFF !important;
        }



    /* ======================================================
       ONE WAY / ROUNDTRIP / MULTICITY
    ====================================================== */

    /* Normal tabs */
    body.mobile.in .tripTypTab li,
    body.mobile.in [role="tab"] {
        background: #FFFFFF !important;
        color: #101010 !important;
        border-bottom: 3px solid transparent !important;
        box-shadow: none !important;
    }

        /* Active tab */
        body.mobile.in .tripTypTab li.selected,
        body.mobile.in .tripTypTab li.active,
        body.mobile.in [role="tab"][aria-selected="true"],
        body.mobile.in [role="tab"].active {
            background: #FFFFFF !important;
            background-image: none !important;
            color: #E4262C !important;
            border-bottom: 3px solid #E4262C !important;
            box-shadow: none !important;
        }

            body.mobile.in .tripTypTab li.selected *,
            body.mobile.in .tripTypTab li.active *,
            body.mobile.in [role="tab"][aria-selected="true"] * {
                color: #E4262C !important;
            }


    /* ======================================================
       5. SEARCH / FORM CARDS
       #F2F2F2
    ====================================================== */

    body.mobile.in .srchForm,
    body.mobile.in .srchForm.version2,
    body.mobile.in .searchWidgetContainer,
    body.mobile.in .widgetContainer {
        background: var(--xix-white) !important;
        background-image: none !important;
    }

    body.mobile.in .srchForm__fields--searchField {
        background: #F2F2F2 !important;
        background-image: none !important;
        border-color: #D8D8D8 !important;
    }

        /* Labels */
        body.mobile.in .srchForm__fields--searchField .greyText,
        body.mobile.in .srchForm__fields--searchField .lightGreyText {
            color: #4A4A4A !important;
        }

        /* Values */
        body.mobile.in .srchForm__fields--searchField .blackText,
        body.mobile.in .srchForm__fields--searchField .darkGreyText,
        body.mobile.in .srchForm__fields--searchField .latoBlack,
        body.mobile.in .autocomplete-input {
            color: #101010 !important;
        }


    /*----------------------------------------------------------
Swap Arrow (From -> To)
----------------------------------------------------------*/


    body.mobile.in .sp__srchFrmSprt--swapBlue {
        background: none !important;
        width: 36px !important;
        height: 36px !important;
        border: 1px solid #101010 !important;
        border-radius: 50% !important;
        position: relative !important;
    }

        /* Draw the ⇅ symbol */
        body.mobile.in .sp__srchFrmSprt--swapBlue::before {
            content: "⇅";
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%,-50%);
            color: #101010;
            font-size: 22px;
            font-weight: 700;
            line-height: 1;
        }

    /* ==========================================
   XIX - Add Return Date (Mobile)
========================================== */

    /* + ADD RETURN DATE */
    body.mobile.in #roundtripadd .blueText,
    body.mobile.in #roundtripadd .dynFont11,
    body.mobile.in #roundtripadd .latoBold {
        color: #101010 !important;
    }



    /* ======================================================
       Choose CABIN CLASS OPTIONS buttons
    ====================================================== */

    body.mobile.in .travClassView__choseCbn ul li {
        background: #FFFFFF !important;
        color: #101010 !important;
        border: 1px solid #D8D8D8 !important;
    }

        /* Selected cabin */
        body.mobile.in .travClassView__choseCbn ul li.active {
            background: #E4262C !important;
            color: #FFFFFF !important;
            border-color: #E4262C !important;
        }

    /* ======================================================
       8. EXTRA SAVINGS
       PDF: Warning Amber #F2A93B
    ====================================================== */
    body.mobile.in .specialFareContainer .titleTag {
        background: #F2A93B !important;
        background-image: none !important;
    }

    body.mobile.in .specialFareContainer .mobileTag {
        color: #101010 !important;
        font-weight: 700 !important;
    }


    /* ------------------------------------------------------
       SELECTED FARE CARD Regular/ student etc.
    ------------------------------------------------------ */

    /* Selected Fare Card */
    body.mobile.in [style*="background-color: rgb(234,245,255)"],
    body.mobile.in [style*="background-color: rgb(234, 245, 255)"] {
        background: #fff !important;
        border: 1px solid #E4262C !important;
    }

    /* Description */
    body.mobile.in .white-space-no-wrap,
    body.mobile.in .successGreen {
        color: #101010 !important;
    }

    /* ======================================================
       9. SEARCH FLIGHTS BUTTON
       Red #E4262C + White text
    ====================================================== */

    body.mobile.in .primaryBtn,
    body.mobile.in .widgetSearchBtn,
    body.mobile.in .srchForm button.button--primary,
    body.mobile.in #searchBtn {
        background: #E4262C !important;
        color: #FFFFFF !important;
        font-weight: 700 !important;
    }




    /* ======================================================
       NEW Badge = Amber
    ====================================================== */



    body.mobile.in .fareTileWrap .new-strip {
        background: #F2A93B !important;
        color: #101010 !important;
        font-weight: 700 !important;
    }



    /*----------------------------------------------------------
Explore Fare Calendar edit
----------------------------------------------------------*/

    /* Fare calendar link */
    body.mobile.in .fareTileWrap a {
        color: #E4262C !important;
    }
    /* Card */
    body.mobile.in .fareTileWrap {
        background: #FFFFFF !important;
    }
        /*icon*/
        body.mobile.in .fareTileWrap i,
        body.mobile.in .fareTileWrap svg,
        body.mobile.in .fareTileWrap img {
            filter: brightness(0) !important;
        }
}










/*--------------------------------------ACCORDING UI UPDATES-----------------------------------------------------------*/


/*header*/
.landingContainer {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

    .landingContainer .prependTop5.appendBottom30 {
        width: 100% !important;
        max-width: none !important;
        padding: 0 40px !important;
        background: #101010 !important;
    }


/* Move service menu slightly downward (Gap Between header and navbar) */
.chHeaderWrapper.navOnly {
    margin-top: 25px !important;
}

.landingSearchWidget {
    margin-top: 25px;
}




/*return font size adjust*/
#return::placeholder {
    font-weight: 500 !important;
}


/*view flight details alignment*/


.viewFltDtlsCta {
    margin-right: 16px !important;
}



/* Search page login button formatting */
body.listingV2bg #userLoggedOut {
    
    border-radius: 6px;
  
    padding: 0 12px;
    cursor: pointer;
}

    body.listingV2bg #userLoggedOut #loginTrigger {
        display: flex;
        align-items: center;
        width: 100%;
    }

    body.listingV2bg #userLoggedOut .userInfoBoxLabel {
        width: 29px;
        height: 31px;
        border-radius: 50%;
        background: rgba(255,255,255,.18);
        display: flex;
        align-items: center;
        justify-content: center;
        margin-right: 12px;
    }

    body.listingV2bg #userLoggedOut [data-cy="account"] {
        display: flex;
        flex-direction: column;
        line-height: 1.2;
    }

        body.listingV2bg #userLoggedOut [data-cy="account"] span {
            color: #fff;
            font-size: 13px;
            font-weight: 500;
        }



/*in search page one way, round trip etc. dropdown */
.dropDownList li:hover {
    background: #f5363d !important;
    color: #fff !important;
}

/*Applied flitter editing*/

#tooltip-wrapper li {
    background: #FFF1F1;
    color: var(--xix-black) !important;
}

#tooltip-wrapper .filterCross {
    background: #fff !important;
    border: 1px solid #ddd;
    border-radius: 50%;
}

    #tooltip-wrapper .filterCross::before {
        content: "×";
        color: #000 !important;
        font-size: 12px;
        font-weight: 700;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
    }


/* Checked checkbox background */
.commonCheckbox.primaryCheckbox input:checked + .box {
    background: #E4262C !important;
    border-color: var(--xix-black) !important;
}

    /* Tick color */
    .commonCheckbox.primaryCheckbox input:checked + .box .check {
        border-color: #fff !important;
    }


/* Selected time slot - Brand Red */
.filterTimeSlots.slotSelected {
    background: var(--xix-red) !important; /* ya #E4262C */
    border-color: var(--xix-red) !important;
}

    .filterTimeSlots.slotSelected .displayText {
        color: #fff !important;
    }

        .filterTimeSlots.slotSelected .displayText b {
            color: #fff !important;
        }

/*------------------hotel page editing----------------------*/

#filterPriceSlider .ui-slider-range {
    background: var(--xix-red) !important;
}


/* Active sort button */
.sortOption.active {
    background: var(--xix-red) !important; /* ya #E4262C */
    border-color: var(--xix-red) !important;
    color: #fff !important;
}

/* Optional: hover bhi red */
.sortOption:hover {
    border-color: var(--xix-red);
}

.sortOption.active:hover {
    background: var(--xix-red) !important;
    color: #fff !important;
}


/* Hotel search fields */
.frm_inputBox {
    background: #fff !important;
    border: 1px solid #ddd !important;
    border-radius: 6px;
    /* Equal Size */
    width: 200px !important;
    min-width: 200px !important;
    height: 64px !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 8px 12px;
    box-sizing: border-box;
}


/*--------------------------------------07-08---------------------------------------------*/

/* Header service icons spacing */
.headerIconsGap {
    gap: 24px !important;
}

/* Remove hover tooltip/extra title from service icons */
.headerIcons .navFullTitle {
    display: none !important;
}

/* Keep service icon text black on hover */
.headerIcons:hover .chNavText {
    color: #101010 !important;
}



/* Scroll header - Login / Create Account */
#userLoggedOutNav {
    background: #f5363d !important;
    border-radius: 6px !important;
    width: 210px !important;
    height: 45px !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 14px !important;
    cursor: pointer;
}

    /* Inner login area */
    #userLoggedOutNav #loginTrigger {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
    }

    /* User icon circle */
    #userLoggedOutNav .userInfoBoxLabel {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        border: 3px solid var(--xix-white) !important;
        border-radius: 50% !important;
        background: rgba(255, 255, 255, 0.18) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin-right: 12px !important;
    }

    /* Login / Create Account text */
    #userLoggedOutNav [data-cy="account"] {
        display: flex !important;
        flex-direction: column !important;
        line-height: 1.5 !important;
    }

        #userLoggedOutNav [data-cy="account"] span {
            color: var(--xix-white) !important;
            font-size: 14px !important;
            font-weight: 600 !important;
        }




/* Selected flight bottom strip */
.splitviewSticky {
    background: #101010 !important;
}

    /* Flight Details - Brand Red */
    .splitviewSticky .toggle-flight-details,
    .splitviewSticky .skyBlueText {
        color: #E4262C !important;
    }

    /* Sticky footer - last column */
    .splitviewSticky > .stickyFlightDtl:last-child {
        margin-left: 0 !important;
        padding-left: 0 !important;
    }

        .splitviewSticky > .stickyFlightDtl:last-child .pushRight {
            width: 100%;
            justify-content: flex-start !important;
        }

        .splitviewSticky > .stickyFlightDtl:last-child .gap-x-10 {
            margin-left: auto !important;
        }

        .splitviewSticky > .stickyFlightDtl:last-child .textRight {
            text-align: left !important;
            margin-left: 0 !important;
        }


/*sidebar applied filter*/
.simplev2 > .filtersHeading[data-test="component-title"] {
    background-image: linear-gradient( 20deg, #ffffff, #ffffff, #ffe6e6 ) !important;
}

    .simplev2 > .filtersHeading[data-test="component-title"] .gradientBorder {
        background-image: linear-gradient( to right, #ff7777, #E4262C ) !important;
    }









/* =========================================
   LOGGED-IN USER - NORMAL + STICKY HEADER
   ========================================= */

#userLoggedIn,
.stickyHeader #userLoggedIn {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

    /* User trigger */
    #userLoggedIn #loginTrigger,
    .stickyHeader #userLoggedIn #loginTrigger {
        background: transparent !important;
        background-color: transparent !important;
        border: none !important;
        box-shadow: none !important;
        padding: 0 !important;
    }

    /* =========================================
   RED USER CIRCLE
   ========================================= */

    #userLoggedIn .userInfoBoxLabel,
    .stickyHeader #userLoggedIn .userInfoBoxLabel {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        background: #E4262C !important;
        background-color: #E4262C !important;
        border: 2px solid #FFFFFF !important;
        border-radius: 50% !important;
        color: #FFFFFF !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin-right: 8px !important;
    }

        /* U */
        #userLoggedIn .userInfoBoxLabel span,
        .stickyHeader #userLoggedIn .userInfoBoxLabel span {
            color: #FFFFFF !important;
            font-weight: 700 !important;
        }

    /* =========================================
   HI GUEST
   ========================================= */

    #userLoggedIn .chUserInfoName,
    .stickyHeader #userLoggedIn .chUserInfoName {
        color: #E4262C !important;
        font-weight: 700 !important;
    }

    /* =========================================
   ARROW
   ========================================= */

    #userLoggedIn .arrowDown,
    .stickyHeader #userLoggedIn .arrowDown {
        border-top-color: #E4262C !important;
    }


.b2bLoginLink .b2bLoginText {
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    color: inherit;
}

/* HOME STICKY HEADER USER */
.stickyHeader .userInfoBoxLabel {
    background: #E4262C !important;
    background-color: #E4262C !important;
    color: #FFFFFF !important;
}

    .stickyHeader .userInfoBoxLabel span {
        color: #FFFFFF !important;
    }

.stickyHeader .chUserInfoName {
    color: #E4262C !important;
}

.stickyHeader .arrowDown {
    border-top-color: #E4262C !important;
}


/* =========================================
   USER DROPDOWN - HOVER FIX
========================================= */

#userLoggedIn {
    position: relative !important;
}

    /* Keep dropdown attached to user area */
    #userLoggedIn .userDropdown {
        position: absolute !important;
        top: 100% !important;
        right: 0 !important;
        margin-top: 0 !important;
        z-index: 99999 !important;
    }

        /* Invisible bridge between user button and dropdown */
        #userLoggedIn .userDropdown::before {
            content: "" !important;
            position: absolute !important;
            top: -12px !important;
            left: 0 !important;
            right: 0 !important;
            height: 12px !important;
            background: transparent !important;
        }

    /* Keep dropdown visible while mouse is anywhere
   inside user area OR dropdown */
    #userLoggedIn:hover .userDropdown {
        visibility: visible !important;
        opacity: 1 !important;
    }


.cancel-actions .btn-back,
.cancel-actions .btn-charges {
    background-color: #E4262C !important;
    color: #FFFFFF !important;
    border: 1px solid #E4262C !important;
}

/* Back to My Trips */
.cancel-actions .btn-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 22px;
    border-radius: 4px;
    text-decoration: none !important;
    font-weight: 600;
}

/* Get Cancellation Charges */
.cancel-actions .btn-charges {
    padding: 14px 28px;
    border-radius: 4px;
    font-weight: 600;
    cursor: pointer;
}

    /* Hover */
    .cancel-actions .btn-back:hover,
    .cancel-actions .btn-charges:hover {
        background-color: #c91f25 !important;
        color: #FFFFFF !important;
        border-color: #c91f25 !important;
    }


/*-----------------------------------------------------search.Mobile editing start here-------------------------------------------------------------*/
/* Spinner */
#spinnerContainer .custom-spinner {
    border-color: #e4262c;
    border-top-color: transparent;
}

/* Spinner text */
#spinnerContainer .spinner-text {
    color: #e4262c !important;
}

/* =========================================================
   XIX TRIPS - FLIGHT SEARCH HEADER
   Step 1: Header background only
   ========================================================= */

.listingHeaderMain {
    background: var(--xix-black) !important;
}

/*edit button*/
.srchFrmsListing__header__editIcon {
    filter: brightness(0) saturate(100%) invert(24%) sepia(96%) saturate(4420%) hue-rotate(352deg) brightness(91%) contrast(94%) !important;
}


/* =========================================================
   XIX TRIPS - WEEKLY FARE CALENDAR
   Same layout, only visual override
   ========================================================= */

#calenderarea.weeklyFareWrapper {
    background: var(--xix-white) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: hidden;
}

/* Calendar scrolling area */
#calenderarea .weeklyScrollCal {
    background: var(--xix-white) !important;
}

/* Month - AUG */
#calenderarea .monthName {
    background: var(--xix-black) !important;
    color: var(--xix-white) !important;
    font-weight: 700 !important;
}

/* Individual date boxes */
#calenderarea .flexiitemCal {
    background: var(--xix-white) !important;
    color: var(--xix-text) !important;
    border-right: 1px solid #E5E5E5 !important;
    border-bottom: 2px solid transparent !important;
}

/* Date text */
#calenderarea .flexiCalDate {
    color: var(--xix-text) !important;
    font-weight: 600 !important;
}

/* Price */
#calenderarea .flexiCalPrice {
    color: var(--xix-text) !important;
    font-weight: 700 !important;
}

/* Selected / active date */
#calenderarea .flexiitemCal.flexiCalActive {
    background: var(--xix-red) !important;
    color: var(--xix-white) !important;
    border-bottom-color: var(--xix-red) !important;
}

    /* Active date text + price */
    #calenderarea .flexiitemCal.flexiCalActive .flexiCalDate,
    #calenderarea .flexiitemCal.flexiCalActive .flexiCalPrice {
        color: var(--xix-white) !important;
    }

/* Cheapest fare - remove old green */
#calenderarea .flexiCalPrice[style] {
    color: var(--xix-red) !important;
}
/*calender icon edit*/
#calenderarea .flexiCalIcon {
    background: var(--xix-red) !important;
    -webkit-mask-image: url('/img/iconold/pwa_flight_sprite.png');
    mask-image: url('/img/iconold/pwa_flight_sprite.png');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: -115px -23px;
    mask-position: -115px -23px;
    -webkit-mask-size: 200px 341px;
    mask-size: 200px 341px;
    filter: none !important;
}

/* =========================================================
   XIX TRIPS - FLIGHT SEARCH RESULT CARD
   Layout unchanged - CSS override only
   ========================================================= */

.listing-card-wrpr {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin-bottom: 10px !important;
    overflow: visible !important;
}

    /* Card body */
    .listing-card-wrpr .flightCardBody {
        background: var(--xix-white) !important;
        color: var(--xix-black) !important;
        box-shadow: 0 2px 8px rgba(16, 16, 16, 0.10) !important;
        border-radius: 10px !important;
    }

    /* Airline name */
    .listing-card-wrpr .airways-name,
    .listing-card-wrpr .airways-name b,
    .listing-card-wrpr .airways-name font {
        color: var(--xix-black) !important;
        font-family: "Inter", "Poppins", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 16px !important;
        font-weight: 600 !important;
    }

    /* Airline logo */
    .listing-card-wrpr .airline-logo {
        border-radius: 4px !important;
    }

    /* Departure / arrival time */
    .listing-card-wrpr .dept-time,
    .listing-card-wrpr .reaching-time {
        color: var(--xix-black) !important;
        font-family: "Inter", "Poppins", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 18px !important;
        font-weight: 700 !important;
    }

    /* Departure / arrival city */
    .listing-card-wrpr .dept-city,
    .listing-card-wrpr .arrival-city,
    .listing-card-wrpr .dept-city font,
    .listing-card-wrpr .arrival-city font {
        color: var(--xix-text) !important;
        font-size: 12px !important;
    }

    /* Duration */
    .listing-card-wrpr .fli-stops p[data-test="component-duration"] {
        color: var(--xix-text) !important;
        font-size: 11px !important;
    }

    /* Non stop */
    .listing-card-wrpr .fli-stops-desc {
        color: var(--xix-text) !important;
        font-size: 11px !important;
    }

    /* Flight separator - brand red */
    .listing-card-wrpr .fli-stops-seperator,
    .listing-card-wrpr .fli-stops-seperator-green {
        background: var(--xix-red) !important;
    }

    /* PRICE */
    .listing-card-wrpr .actual-price,
    .listing-card-wrpr .actual-price span {
        color: var(--xix-red) !important;
        font-family: "Inter", "Poppins", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 17px !important;
        font-weight: 600 !important;
        line-height: 1.1 !important;
        white-space: nowrap !important;
    }

    /* Per adult */
    .listing-card-wrpr .greyTxt {
        color: var(--xix-text) !important;
        font-size: 10px !important;
        line-height: 1.2 !important;
    }

    /* Keep price inside card */
    .listing-card-wrpr .price {
        min-width: 0 !important;
        max-width: 30% !important;
        flex-shrink: 1 !important;
        box-sizing: border-box !important;
    }

    .listing-card-wrpr .fli-time-section {
        min-width: 0 !important;
        flex-shrink: 1 !important;
    }

    .listing-card-wrpr .fli-stops {
        min-width: 0 !important;
        flex-shrink: 1 !important;
    }
    /* Remove old unwanted green/blue styling */
    .listing-card-wrpr .fli-stops-seperator-green {
        background-color: var(--xix-red) !important;
    }

/* =========================================
   FLIGHT FILTER BAR - XIX TRIPS
   ========================================= */

.filterBarWrapper {
    background: var(--xix-white) !important;
    border-radius: 8px !important;
    box-shadow: 0 3px 10px rgba(16, 16, 16, 0.25) !important;
    overflow: hidden !important;
}

    /* Filter item container */
    .filterBarWrapper .filterItemList {
        background: var(--xix-white) !important;
    }

    /* Individual filters */
    .filterBarWrapper .filterItems {
        color: var(--xix-black) !important;
        background: transparent !important;
        font-weight: 600 !important;
        border: none !important;
    }

        /* Selected / active filter */
        .filterBarWrapper .filterItems.active,
        .filterBarWrapper .filterItems.selected {
            background: var(--xix-red) !important;
            color: var(--xix-white) !important;
        }

        /* Hover */
        .filterBarWrapper .filterItems:hover {
            background: var(--xix-red) !important;
            color: var(--xix-white) !important;
        }


    /* =========================================
   FILTER ACTIVE TICK - HIDE
   ========================================= */

    .filterBarWrapper .qfApplied {
        display: none !important;
    }

    /* =========================================
   SORT & FILTERS
========================================= */

    .filterBarWrapper .sorterBar {
        background: #000 !important;
        color: #fff !important;
    }

    /* Sort & Filters text */
    .filterBarWrapper .sorterBar {
        font-size: 11px !important;
        font-weight: 500 !important;
    }

        .filterBarWrapper .sorterBar .sortIcon {
            display: inline-block !important;
            width: 15px !important;
            height: 15px !important;
            background-image: url('/img/icon/pwa_flight_sprite.png') !important;
            background-size: 200px 341px !important;
            background-position: -170px -93px !important;
            background-repeat: no-repeat !important;
            background-color: transparent !important;
            filter: none !important;
            flex-shrink: 0 !important;
        }

.filterBar-v1-new .sorterBar .filterCount {
    color: var(--xix-black) !important;
}

.fltBtn.btnRectangle {
    background: #E4262C !important;
    color: #FFFFFF !important;
    border: 1px solid #E4262C !important;
}

#idClearFilter {
    color: var(--xix-red) !important;
}

.filterTabs.active {
    border-bottom-color: var(--xix-red) !important;
}

.active .sorter-tick {
    border-color: var(--xix-red) !important;
}

.sortOptionRow .active, .sortOptionRow .active .sortbytype {
    color: var(--xix-red) !important;
}

.filterItem-selected {
    background-color: var(--xix-red) !important;
    color: var(--xix-white) !important;
}

.tripTypTab li.selected {
    background-color: var(--xix-red) !important;
}

button[data-cy="search"].button--primary {
    background-image: none !important;
    background-color: var(--xix-red) !important;
    border-color: var(--xix-red) !important;
}

.fareOptionsWrapper .fareCardItem {
    background-color: #FFFFFF !important;
    border-color: #D8D8D8 !important;
}

    .fareOptionsWrapper .fareCardItem[style*="rgb(234, 245, 255)"] {
        background-color: #FFFFFF !important;
        border-color: #E4262C !important;
    }

        .fareOptionsWrapper .fareCardItem[style*="rgb(234, 245, 255)"] .blackText {
            color: #E4262C !important;
        }


    .titleTag .mobileTag {
        color: var(--xix-black) !important;
    }
.srchForm__fields--searchFieldAltr .blueText {
    color: var(--xix-black) !important;
}

.sp__srchFrmSprt--swapBlue {
    background-image: none !important;
    width: 24px;
    height: 24px;
    position: relative;
    border: 1px solid var(--xix-black) !important;
    border-radius:25px;
}

    .sp__srchFrmSprt--swapBlue::before {
        content: "⇅";
        color: #000000;
        font-size: 22px;
        font-weight: bold;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
/*------------------------------------------------MOBILE FLIGHTS & FARE DETAILS PAGE EDIT START HERE-------------------------------------------------*/

/* =========================================
   FLIGHT & FARE DETAILS 
   Main Page Background
========================================= */

body.listingV2bg {
    background: var(--xix-white) !important;
}

/* =========================================
   FLIGHT & FARE DETAILS HEADER
========================================= */

.overlayHead {
    background: var(--xix-black) !important;
   
    border-bottom: 2px solid var(--xix-red) !important;
}

    /* Header text */
    .overlayHead .blackTxt {
        color: var(--xix-white) !important;
        font-size: 20px !important;
        font-weight: 700 !important;
    }

    /* Close icon */
    .overlayHead .crossIconGrey {
        filter: brightness(0) invert(1) !important;
    }


/* =========================================
   FLIGHT OVERLAY BACKGROUND
   ========================================= */

.flightOverlayContent {
    background: var(--xix-white) !important;
}

.rtOverlayWrap {
    background: var(--xix-white) !important;
}
/* =========================================
   FLIGHT ROUTE HEADER
   ========================================= */

.flightDtlCardHead {
    background: var(--xix-red) !important;
    color: var(--xix-white) !important;
    border-radius: 8px 8px 0 0 !important;
}

    .flightDtlCardHead .rtDesti,
    .flightDtlCardHead .whiteTxt,
    .flightDtlCardHead b {
        color: var(--xix-white) !important;
    }


/* =========================================
   FLIGHT DETAILS CONTENT
   ========================================= */

.flightDtlCard {
    background: var(--xix-white) !important;
    color: var(--xix-black) !important;
    border: 0 !important;
}

    /* Airline name + flight number */
    .flightDtlCard .LatoBold,
    .flightDtlCard .LatoBold b,
    .flightDtlCard .LatoBold small {
        color: var(--xix-black) !important;
    }

    /* Departure / Arrival time */
    .flightDtlCard .font24.blackTxt {
        color: var(--xix-black) !important;
    }

    /* Airport and terminal text */
    .flightDtlCard font[color="#4a4a4a"] {
        color: var(--xix-text) !important;
    }

    .flightDtlCard font[color="#9b9b9b"] {
        color: #777777 !important;
    }

    /* Date */
    .flightDtlCard .append_bottom8 b {
        color: var(--xix-text) !important;
    }

    /* Flight duration */
    .flightDtlCard .legDuration {
        color: var(--xix-black) !important;
    }

/* =========================================
   CHANGE OF PLANES / LAYOVER
   ========================================= */

.flightDtlSeperator {
    background: #fff0f0 !important;
    border: 1px solid #ffd6d6 !important;
    border-radius: 6px !important;
    padding: 12px !important;
    margin: 10px 0 !important;
}

    /* Layover content */
    .flightDtlSeperator .rtLayOverInfo {
        color: var(--xix-black) !important;
    }

        /* Change of planes text */
        .flightDtlSeperator .rtLayOverInfo b,
        .flightDtlSeperator .rtLayOverInfo p,
        .flightDtlSeperator .rtLayOverInfo font {
            color: var(--xix-black) !important;
        }

        /* Layover location - Jaipur */
        .flightDtlSeperator .rtLayOverInfo b {
            color: var(--xix-black) !important;
        }

    /* Layover icon */
    .flightDtlSeperator .rtLayOverInfo__Icon {
        filter: hue-rotate(320deg) saturate(2) !important;
    }

    /* Remove old separator styling */
    .flightDtlSeperator::before,
    .flightDtlSeperator::after {
        display: none !important;
    }

/* =========================================
   SELECT SERVICES - XIX TRIPS
   ========================================= */

.rtFareFamily {
    background: var(--xix-white) !important;
}

    /* Select Services heading */
    .rtFareFamily > div:first-child p {
        color: var(--xix-black) !important;
        font-size: 18px !important;
        font-weight: 700 !important;
    }

/* Fare card */
.rtFareCard {
    background: #fff0f0 !important;
    border: 1px solid #D9D9D9 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

    /* Active / selected fare */
    .rtFareCard.active {
        border: 1px solid var(--xix-red) !important;
    }

    /* =========================================
   SELECT SERVICES - FARE HEADER
   ========================================= */

    /* Eco Value */
    .rtFareCard .rtFareHeading p.LatoBlack {
        color: var(--xix-black) !important;
        font-weight: 700 !important;
    }

    /* Fare description */
    .rtFareCard .rtFareHeading .greyTxt {
        color: #4A4A4A !important;
    }

    /* Fare price */
    .rtFareCard .rtFareHeading .text-right p {
        color: var(--xix-red) !important;
        font-weight: 700 !important;
    }


    /* =========================================
   ACTIVE RADIO BUTTON
   ========================================= */

    .rtFareCard.active .customRadioBtn .outer {
        border-color: var(--xix-red) !important;
    }

    .rtFareCard.active .customRadioBtn .inner {
        background-color: var(--xix-red) !important;
    }


    /* Radio button input */
    .rtFareCard .customRadioBtn input[type="radio"] {
        accent-color: var(--xix-red) !important;
    }

    /* =========================================
   SELECT SERVICES - INCLUSIONS
   ========================================= */

    /* Inclusion list */
    .rtFareCard .rtInclusions {
        color: var(--xix-black) !important;
    }

        /* Each inclusion row */
        .rtFareCard .rtInclusions li {
            color: var(--xix-black) !important;
        }

    /* Left side labels */
    .rtFareCard .rtInclusionsLeft span {
        color: var(--xix-black) !important;
        font-weight: 500 !important;
    }

    /* Right side values */
    .rtFareCard .rtInclusions li > span {
        color: var(--xix-black) !important;
    }

        /* Bold values */
        .rtFareCard .rtInclusions li > span b {
            color: var(--xix-black) !important;
        }

    /* Service icons */
    .rtFareCard .rtInclusionsLeft img {
        opacity: 1 !important;
    }
    /* =========================================
   SELECT SERVICES - SHOW MORE
   ========================================= */

    .rtFareCard .blueTxt {
        color: var(--xix-red) !important;
        font-weight: 500 !important;
    }

        /* Show more text */
        .rtFareCard .blueTxt > span:first-child {
            color: var(--xix-red) !important;
        }

        /* Chevron */
        .rtFareCard .blueTxt .icon-chevron {
            color: var(--xix-red) !important;
            border-color: var(--xix-red) !important;
        }
/* =========================================
   FLIGHT FARE DETAILS - FOOTER
   ========================================= */

.overlayFooter.zIndex10 {
    background: var(--xix-black) !important;
    color: var(--xix-white) !important;
}

/* Fare price */
.overlayFooter .footerPrice {
    color: var(--xix-white) !important;
    font-size: 20px !important;
    font-weight: 800 !important;
}

/* Adult label */
.overlayFooter .footerPriceTxt {
    color: var(--xix-white) !important;
    font-size: 11px !important;
}

/* Continue CTA */
.overlayFooter .fltBtn.btnCapsule {
    background: var(--xix-red) !important;
    color: var(--xix-white) !important;
    border: 1px solid var(--xix-red) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
}
/* =========================================
   REMOVE BLUE SPACE ABOVE FOOTER
   ========================================= */

.flightOverlayContent,
.rtOverlayWrap,
.rtFareFamily {
    background: var(--xix-white) !important;
}
.overlay-wrpr.rtOverlayWrap {
    background: var(--xix-white) !important;
}

.flightOverlayContent {
    background: #ffffff !important;
}
/* =========================================
   XIX TRIPS - FLIGHT FARE DETAILS TYPOGRAPHY
   ========================================= */

.overlay-wrpr.rtOverlayWrap,
.overlay-wrpr.rtOverlayWrap * {
    font-family: "Inter", "Poppins", "Helvetica Neue", Arial, sans-serif !important;
}


/*--------------------------------------------------------REVIEW DETAILS PAGE EDITING START HERE---------------------------------------------------------------*/


/* =========================================
   REVIEW DETAILS 
   ========================================= */

.revTvlrTopSection {
    background: var(--xix-white) !important;
    background-image: none !important;
}

    /* =========================================
   REVIEW DETAILS - STEP 2
   Flight details text
   ========================================= */

    .revTvlrTopSection,
    .revTvlrTopSection p,
    .revTvlrTopSection span {
        color: var(--xix-black) !important;
    }

/* =========================================
   REVIEW DETAILS - TYPOGRAPHY
   XIX Trips Brand Guide
   ========================================= */

/* Main typography */
body.listingV2bg {
    font-family: "Inter", "Poppins", "Helvetica Neue", Arial, sans-serif !important;
}

    /* "Trip to" */
    body.listingV2bg .rtSubHead {
        font-size: 14px !important;
        font-weight: 400 !important;
        color: var(--xix-text) !important;
    }

    /* Main destination - Bangalore */
    body.listingV2bg .rtHead {
        font-size: 32px !important;
        line-height: 1.2 !important;
        font-weight: 700 !important;
        color: var(--xix-black) !important;
    }

    /* Flight route / airline / component titles */
    body.listingV2bg .rtFlightDtl,
    body.listingV2bg .rtFlightDtl p,
    body.listingV2bg .rtFlightDtl span {
        font-size: 14px !important;
        color: var(--xix-text) !important;
    }

        /* Route & airline names */
        body.listingV2bg .rtFlightDtl b,
        body.listingV2bg .rtFlightDtl strong {
            font-weight: 600 !important;
            color: var(--xix-black) !important;
            margin-left: 4px !important;
        }

        /* Flight time */
        body.listingV2bg .rtFlightDtl .font24 {
            font-size: 18px !important;
            font-weight: 700 !important;
            color: var(--xix-black) !important;
        }

        /* Dates / airport / secondary information */
        body.listingV2bg .rtFlightDtl small,
        body.listingV2bg .rtFlightDtl .greyTxt {
            font-size: 12px !important;
            font-weight: 400 !important;
            color: var(--xix-text) !important;
        }

    /* Layover text */
    body.listingV2bg .rtLayOverInfo {
        font-size: 14px !important;
        color: var(--xix-text) !important;
    }

        /* Layover heading */
        body.listingV2bg .rtLayOverInfo b {
            font-size: 14px !important;
            font-weight: 600 !important;
            color: var(--xix-black) !important;
        }

    /* =========================================
   REVIEW DETAILS - FLIGHT INFORMATION
   ========================================= */

    /* Route - DEL-BOM / BOM-BLR */
    body.listingV2bg .rtFlightDtl .font14 {
        font-size: 14px !important;
        line-height: 1.4 !important;
        font-weight: 600 !important;
        color: var(--xix-black) !important;
    }

    /* Flight time */
    body.listingV2bg .rtFlightDtl .font24 {
        font-size: 20px !important;
        line-height: 1.2 !important;
        font-weight: 700 !important;
        color: var(--xix-black) !important;
        white-space: nowrap !important;
    }

    /* Date */
    body.listingV2bg .rtFlightDtl p {
        color: var(--xix-text);
    }

/* Prevent horizontal overflow */
body.listingV2bg {
    overflow-x: hidden !important;
}

    /* Flight times should stay on one line */
    body.listingV2bg .rtFlightDtl .font24 {
        white-space: nowrap !important;
    }

    /* Dates can wrap naturally inside their column */
    body.listingV2bg .rtFlightDtl p.append_bottom8 {
        white-space: normal !important;
        overflow-wrap: break-word !important;
    }

    /* Keep flight details inside their available width */
    body.listingV2bg .rtFlightDtl,
    body.listingV2bg .rtFlightDtl > div {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Duration - 2h 15m / 1h 55m */
    body.listingV2bg .rtFlightDtl .timeDuration,
    body.listingV2bg .rtFlightDtl .legDuration {
        font-size: 13px !important;
        font-weight: 500 !important;
        color: var(--xix-text) !important;
        white-space: nowrap !important;
    }

    /* Non stop */
    body.listingV2bg .rtFlightDtl .defaultTxt {
        font-size: 12px !important;
        color: var(--xix-text) !important;
    }

    /* Airport / city */
    body.listingV2bg .rtFlightDtl .LatoBlack {
        font-size: 14px !important;
        font-weight: 600 !important;
        color: var(--xix-black) !important;
    }

    /* Airline name */
    body.listingV2bg .rtFlightDtl .LatoBold {
        font-size: 14px !important;
        font-weight: 600 !important;
        color: var(--xix-black) !important;
    }

    /* Flight number */
    body.listingV2bg .rtFlightDtl small {
        font-size: 12px !important;
        font-weight: 400 !important;
        color: var(--xix-text) !important;
    }

    /* =========================================
   REVIEW DETAILS - FLIGHT DATE FIX
   ========================================= */

    body.listingV2bg .rtFlightDtl {
        overflow: hidden !important;
    }

        body.listingV2bg .rtFlightDtl p {
            max-width: 100% !important;
            box-sizing: border-box !important;
        }

            /* Date text */
            body.listingV2bg .rtFlightDtl p.append_bottom8 {
                font-size: 12px !important;
                line-height: 18px !important;
                white-space: normal !important;
                overflow-wrap: normal !important;
                word-break: normal !important;
            }

        /* Keep each flight-detail section inside its column */
        body.listingV2bg .rtFlightDtl > div {
            min-width: 0 !important;
            max-width: 100% !important;
            box-sizing: border-box !important;
        }

        /* Right-side airport/date content */
        body.listingV2bg .rtFlightDtl .text-right {
            min-width: 0 !important;
            max-width: 100% !important;
            overflow: hidden !important;
        }

/* =========================================
   REVIEW DETAILS - CHANGE OF PLAN CARD
   ========================================= */

.revTvlrWhiteCard {
    background: var(--xix-white) !important;
    border: 1px solid rgba(113, 61, 204, 0.20) !important;
    border-left: 4px solid var(--xix-red) !important;
    border-radius: 10px !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.10) !important;
    padding: 14px 16px !important;
    margin: 18px 0 !important;
}

    /* Inner content */
    .revTvlrWhiteCard .rtLayOverInfo {
        display: flex !important;
        align-items: flex-start !important;
    }

    /* Icon */
    .revTvlrWhiteCard .rtLayOverInfo__Icon {
        flex: 0 0 28px !important;
        width: 28px !important;
        height: 28px !important;
        margin-top: 1px !important;
        background-size: contain !important;
        background-position: center !important;
        background-repeat: no-repeat !important;
    }

    /* Text wrapper */
    .revTvlrWhiteCard .prepend_left10 {
        margin-left: 10px !important;
    }

    /* Change of planes */
    .revTvlrWhiteCard p {
        margin: 0 !important;
        line-height: 1.45 !important;
    }

        .revTvlrWhiteCard p:first-child {
            margin-bottom: 3px !important;
        }

            /* Red heading */
            .revTvlrWhiteCard p:first-child b,
            .revTvlrWhiteCard p:first-child font {
                color: var(--xix-red) !important;
                font-weight: 600 !important;
            }

    /* Layover text */
    .revTvlrWhiteCard .dot-text-separator,
    .revTvlrWhiteCard .dot-text-separator font {
        color: var(--xix-text) !important;
        font-size: 13px !important;
    }

        /* Airport name */
        .revTvlrWhiteCard .dot-text-separator b {
            color: var(--xix-black) !important;
            font-weight: 600 !important;
        }

.timelineHeaderTabs .headerTab.activeTab {
    border-bottom: 4px solid var(--xix-red) !important;
}

.baggagePersuasion {
    background-image: linear-gradient( 270deg, #ffffff 0%, #fff4f4 55%, #E4262C 100% ) !important;
}

.revTvlrBottomSection{
    background-image:none !important;
}

#addEmail span font {
    color: var(--xix-red) !important;
}

#addMobile span font {
    color: var(--xix-red) !important;
}
/* =========================================
   TERMS & CONDITIONS TEXT
   ========================================= */

.revTvlrWhiteCard .labeltext a,
.revTvlrWhiteCard .labeltext a span {
    color: var(--xix-red) !important;
}

#GENDAR_input .rt-tabs-item.selected {
    background-color: var(--xix-red) !important;
    color: var(--xix-white) !important;
}

/* =========================================
   PASSENGER TITLE DROPDOWN
   ========================================= */

/* Selected text */
#TITLE_input .floating-input,
#TITLE_input select {
    color: var(--xix-black) !important;
}

/* Placeholder / Label */
#TITLE_input label {
    color: var(--xix-black) !important;
}

/* Dropdown options */
#TITLE_input select option {
    color: var(--xix-black) !important;
    background: var(--xix-white) !important;
}

/* Focus state */
#TITLE_input .floating-input:focus,
#TITLE_input select:focus {
    color: var(--xix-black) !important;
}
.rtformFeild .floating-input,
.rtformFeild input,
.rtformFeild select,
.rtformFeild label {
    color: var(--xix-black) !important;
    
}
.rtformFeild .date-input, .rtformFeild .select-input, .rtformFeild.text-type-field .rtInput {
   
    border: 1px solid var(--xix-black) !important;
   
}

.dob-group {
    border: 1px solid var(--xix-black) !important;
}

/* Avail extra benefits & earn points */
p.font12.greyTxt[style*="padding-top"] font {
    color: var(--xix-red) !important;
}

/* Frequent Traveller dropdown icon */
#chevronToggle.blue-chevron {
    background-color: transparent !important;
    filter: brightness(0) saturate(100%) invert(23%) sepia(96%) saturate(3550%) hue-rotate(353deg) brightness(91%) contrast(91%) !important;
}

.fltBtn.btnRectangle span {
    color: var(--xix-white) !important;
}

/* =========================================
   REVIEW DETAILS - FOOTER
   ========================================= */

#black_footer.rt_footer {
    background: var(--xix-black) !important;
    border-top: none !important;
    box-shadow: none !important;
    width: 100% !important;
}

#black_footer .blackFooter {
    background: var(--xix-black) !important;
    color: var(--xix-white) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
}

/* Price */
#black_footer .footerPrice,
#black_footer #idtotaldisplayamount {
    color: var(--xix-white) !important;
    font-family: "Inter", "Poppins", "Helvetica Neue", Arial, sans-serif !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    margin-bottom:6px !important;
}

/* FOR 1 ADULT */
#black_footer .footerPriceTxt {
    color: var(--xix-footer-link) !important;
    font-family: "Inter", "Poppins", "Helvetica Neue", Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 0.3px !important;
}

/* Continue button */
#black_footer #idcontinuebutton {
    background: var(--xix-red) !important;
    color: var(--xix-white) !important;
    border: 1px solid var(--xix-red) !important;
    font-family: "Inter", "Poppins", "Helvetica Neue", Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    cursor: pointer !important;
}

    /* Continue hover */
    #black_footer #idcontinuebutton:hover {
        background: var(--xix-red) !important;
        color: var(--xix-white) !important;
    }

/* =========================================
   TRIP HEADER - PREMIUM CARD
   ========================================= */

#TRIP_HEADER {
    background: var(--xix-white) !important;
    border: 1px solid #e6e6e6 !important;
    border-radius: 12px !important;
    /* Premium shadow */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

    

    /* Flight sections */
    #TRIP_HEADER .rtFlightDtl {
        background: var(--xix-white) !important;
        border-bottom: 1px solid #eeeeee !important;
    }

        /* Remove last unnecessary divider */
        #TRIP_HEADER .rtFlightDtl:last-child {
            border-bottom: none !important;
        }

    /* Keep inner content clean */
    #TRIP_HEADER .rtFlightDtlRow {
        box-sizing: border-box !important;
    }

    /* Slightly softer inner spacing */
    #TRIP_HEADER .flightsInfoDtl {
        box-sizing: border-box !important;
    }

.reviewDtlsOverlay .dividerSm {
    background: var(--xix-red) !important;
}

.reviewDtlsOverlay .tvlrDtlsCard .title:before {
    background: var(--xix-red) !important;
}

.tvlrDtlsCard {
    background: #fff2f2 !important;
    border:1px solid var(--xix-red) !important;
}

/*-------------------------MOBILE BOOKING PAGE EDIT--------------------------------*/
.ancillary-header .fli-tabs-item.active {
    border-color: var(--xix-red) !important;
}

/* =========================================
   ACTIVE SECTOR TAB
   ========================================= */

.sectorV1.active {
    background: var(--xix-red) !important;
    color: var(--xix-white) !important;
    border-color: var(--xix-red) !important;
}

    .sectorV1.active .sectorTabDtls p {
        color: var(--xix-white) !important;
    }
/* =========================================
   SEAT SELECTION FOOTER
   ========================================= */

.blackFooter {
    background: var(--xix-black) !important;
    color: var(--xix-white) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
}

    /* Price */
    .blackFooter .footerPrice,
    .blackFooter #seatTotalAmount {
        color: var(--xix-white) !important;
        font-family: "Inter", "Poppins", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 20px !important;
        font-weight: 700 !important;
        margin-right:6px !important;
    }

    /* Info icon */
    .blackFooter .greyInfoIcon {
        opacity: 0.8 !important;
    }

    /* NEXT button */
    .blackFooter .black-btn-wrpr .fltBtn {
        background: var(--xix-red) !important;
        color: var(--xix-white) !important;
        border: 1px solid var(--xix-red) !important;
        border-radius: 6px !important;
        font-family: "Inter", "Poppins", "Helvetica Neue", Arial, sans-serif !important;
        font-size: 14px !important;
        font-weight: 600 !important;
    }

        /* Hover */
        .blackFooter .black-btn-wrpr .fltBtn:hover {
            background: var(--xix-red) !important;
            color: var(--xix-white) !important;
        }

        /*meals*/
.fltMealAddBtn {
    border: 1px solid var(--xix-red) !important;
    color: var(--xix-red) !important;
    background: var(--xix-white) !important;
}

    .fltMealAddBtn font {
        color: var(--xix-red) !important;
    }