/* ==========================================================================
   Triptickers Global Typography - Plus Jakarta Sans
   Ultra-Premium, Modern International Travel Standard
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400;1,500;1,600;1,700&display=swap');

:root {
    --font-family-base: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    --font-family-sans-serif: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    --font-family-heading: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

/* Universal Font Application */
*, *::before, *::after {
    font-family: inherit;
}

html, body {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Headings: Bold, Crisp, Proportional Kerning & Sizing */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    color: #0f2444;
}

/* Protection for all Dark Sections, Banners, Heroes, Portals, and Dark Containers */
.vd-hero, .vd-hero h1, .vd-hero h2, .vd-hero h3, .vd-hero h4, .vd-hero h5, .vd-hero h6,
.app-hero-section, .app-hero-section h1, .app-hero-section h2, .app-hero-section h3, .app-hero-section h4, .app-hero-section .app-hero-title,
.app-hero-title,
.app-pro-hero, .app-pro-hero h1, .app-pro-hero h2, .app-pro-hero h3, .app-pro-hero-title,
.dest-hero-banner, .dest-hero-banner h1, .dest-hero-banner h2, .dest-hero-banner h3, .dest-hero-title,
.bravo_banner, .bravo_banner h1, .bravo_banner h2, .bravo_banner h3, .bravo_banner .title,
.banner-wrap, .banner-wrap h1, .banner-wrap h2, .banner-wrap h3,
.portal-hero, .portal-hero h1, .portal-hero h2, .portal-hero h3,
.trips-hero, .trips-hero h1, .trips-hero h2, .trips-hero h3,
.spt-hero, .spt-hero h1, .spt-hero h2, .spt-hero h3, .spt-hero-title,
.tt-notify-hero, .tt-notify-hero h1, .tt-notify-hero h2, .tt-notify-hero h3,
.vendor-refund-hero, .vendor-refund-hero h1, .vendor-refund-hero h2, .vendor-refund-hero h3,
.bday-hero, .bday-hero h1, .bday-hero h2, .bday-hero h3,
.payment-page-hero, .payment-page-hero h1, .payment-page-hero h2, .payment-page-hero h3,
.package-hero, .package-hero h1, .package-hero h2, .package-hero h3,
.rate-sheet-hero, .rate-sheet-hero h1, .rate-sheet-hero h2, .rate-sheet-hero h3,
.supplier-sheet-hero, .supplier-sheet-hero h1, .supplier-sheet-hero h2, .supplier-sheet-hero h3,
.tt-neo-hero-banner, .tt-neo-hero-banner h1, .tt-neo-hero-banner h2,
.modal-hero-banner, .modal-hero-banner h1, .modal-hero-banner h2,
.bg-dark, .bg-dark h1, .bg-dark h2, .bg-dark h3, .bg-dark h4, .bg-dark h5, .bg-dark h6,
.bg-primary h1, .bg-primary h2, .bg-primary h3,
.bg-navy h1, .bg-navy h2, .bg-navy h3,
.text-white, .text-white h1, .text-white h2, .text-white h3, .text-white h4, .text-white h5, .text-white h6,
[class*="-hero"] h1, [class*="-hero"] h2, [class*="-hero"] h3,
[class*="hero-"] h1, [class*="hero-"] h2, [class*="hero-"] h3,
[class*="-banner"] h1, [class*="-banner"] h2, [class*="-banner"] h3,
.bravo_footer h1, .bravo_footer h2, .bravo_footer h3, .bravo_footer h4, .bravo_footer h5, .bravo_footer h6,
.mail-footer h1, .mail-footer h2, .mail-footer h3 {
    color: #ffffff !important;
}

/* Theme Orange Highlighting across all pages & heroes */
.text-theme-orange,
.text-orange,
.vd-hero h1 .text-theme-orange,
.vd-hero h1 .text-orange,
.vd-hero h1 .vd-text-orange,
.app-hero-title .text-theme-orange,
.app-hero-title .text-orange,
.app-pro-hero-title span,
[class*="hero"] .text-theme-orange,
[class*="hero"] .text-orange,
[class*="banner"] .text-theme-orange,
[class*="banner"] .text-orange {
    color: #F47C20 !important;
    background: linear-gradient(135deg, #FF9E40 0%, #F47C20 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* Native Mobile-App Heading Scale (Clean, Sleek & Modern) */
h1, .h1 {
    font-size: clamp(19px, 2vw, 24px) !important;
    font-weight: 800 !important;
    letter-spacing: -0.025em !important;
    line-height: 1.25 !important;
}

/* Dedicated Page & Section Hero Headings (Prominent on desktop, responsive on mobile) */
.tt-vendor-hero h1,
.tt-vendor-copy > h1,
.app-hero-title,
.vd-hero h1,
.dest-hero-banner h1,
.bravo_banner h1,
.banner-wrap h1 {
    font-size: clamp(32px, 3.8vw, 48px) !important;
    line-height: 1.16 !important;
    letter-spacing: -0.025em !important;
}

@media (max-width: 768px) {
    .tt-vendor-hero h1,
    .tt-vendor-copy > h1,
    .app-hero-title,
    .vd-hero h1,
    .dest-hero-banner h1,
    .bravo_banner h1,
    .banner-wrap h1 {
        font-size: 26px !important;
        line-height: 1.22 !important;
    }
}

h2, .h2 {
    font-size: clamp(16.5px, 1.6vw, 20px) !important;
    font-weight: 750 !important;
    letter-spacing: -0.02em !important;
    line-height: 1.28 !important;
}

h3, .h3 {
    font-size: clamp(15px, 1.3vw, 17.5px) !important;
    font-weight: 700 !important;
    letter-spacing: -0.015em !important;
    line-height: 1.32 !important;
}

h4, .h4 {
    font-size: clamp(13.5px, 1.1vw, 15.5px) !important;
    font-weight: 650 !important;
    letter-spacing: -0.01em !important;
    line-height: 1.36 !important;
}

h5, .h5 {
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
    line-height: 1.4 !important;
}

h6, .h6 {
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
    line-height: 1.4 !important;
}

/* ==========================================================================
   Vendor Rich-Text & Editor Content Normalization Engine
   Prevents vendor WYSIWYG editor overrides (large headings, inline font-sizes)
   from blowing up headings. Enforces crisp, unified Mobile App sizing.
   ========================================================================== */
.tt-policy-richtext h1, .tt-policy-richtext h2,
.tt-app-description-body h1, .tt-app-description-body h2,
.g-overview h1, .g-overview h2,
.tour-overview h1, .tour-overview h2,
.hotel-overview h1, .hotel-overview h2,
.bravo_detail_tour h1, .bravo_detail_tour h2,
.bravo_detail_hotel h1, .bravo_detail_hotel h2,
.bravo_detail_car h1, .bravo_detail_car h2,
.bravo_detail_space h1, .bravo_detail_space h2,
.bravo_detail_boat h1, .bravo_detail_boat h2,
.bravo_detail_event h1, .bravo_detail_event h2,
.tt-app-section-card h1, .tt-app-section-card h2,
.post-content h1, .post-content h2,
.description h1, .description h2,
.bravo_content h1, .bravo_content h2 {
    font-size: 17.5px !important;
    font-weight: 800 !important;
    color: #0f2444 !important;
    line-height: 1.32 !important;
    letter-spacing: -0.02em !important;
    margin: 16px 0 8px 0 !important;
}

.tt-policy-richtext h3, .tt-policy-richtext h4,
.tt-app-description-body h3, .tt-app-description-body h4,
.g-overview h3, .g-overview h4,
.tour-overview h3, .tour-overview h4,
.hotel-overview h3, .hotel-overview h4,
.bravo_detail_tour h3, .bravo_detail_tour h4,
.bravo_detail_hotel h3, .bravo_detail_hotel h4,
.bravo_detail_car h3, .bravo_detail_car h4,
.bravo_detail_space h3, .bravo_detail_space h4,
.bravo_detail_boat h3, .bravo_detail_boat h4,
.bravo_detail_event h3, .bravo_detail_event h4,
.tt-app-section-card h3, .tt-app-section-card h4,
.post-content h3, .post-content h4,
.description h3, .description h4,
.bravo_content h3, .bravo_content h4 {
    font-size: 15.5px !important;
    font-weight: 750 !important;
    color: #0f2444 !important;
    line-height: 1.34 !important;
    letter-spacing: -0.015em !important;
    margin: 12px 0 6px 0 !important;
}

.tt-policy-richtext h5, .tt-policy-richtext h6,
.tt-app-description-body h5, .tt-app-description-body h6,
.g-overview h5, .g-overview h6,
.tt-app-section-card h5, .tt-app-section-card h6 {
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #0f2444 !important;
    margin: 10px 0 4px 0 !important;
}

/* Headings with vendor inline font-size styles */
.tt-policy-richtext h1[style*="font-size"], .tt-policy-richtext h2[style*="font-size"],
.tt-app-description-body h1[style*="font-size"], .tt-app-description-body h2[style*="font-size"],
.g-overview h1[style*="font-size"], .g-overview h2[style*="font-size"],
.tt-app-section-card h1[style*="font-size"], .tt-app-section-card h2[style*="font-size"] {
    font-size: 17.5px !important;
    font-weight: 800 !important;
}

.tt-policy-richtext h3[style*="font-size"], .tt-policy-richtext h4[style*="font-size"],
.tt-app-description-body h3[style*="font-size"], .tt-app-description-body h4[style*="font-size"],
.g-overview h3[style*="font-size"], .g-overview h4[style*="font-size"],
.tt-app-section-card h3[style*="font-size"], .tt-app-section-card h4[style*="font-size"] {
    font-size: 15.5px !important;
    font-weight: 750 !important;
}

/* Paragraphs & Spans with vendor inline font-size styles */
.tt-policy-richtext p [style*="font-size"],
.tt-policy-richtext span[style*="font-size"],
.tt-policy-richtext li [style*="font-size"],
.tt-app-description-body p [style*="font-size"],
.tt-app-description-body span[style*="font-size"],
.tt-app-description-body li [style*="font-size"],
.g-overview p [style*="font-size"],
.g-overview span[style*="font-size"],
.g-overview li [style*="font-size"],
.bravo_content p [style*="font-size"],
.bravo_content span[style*="font-size"] {
    font-size: 14px !important;
    line-height: 1.68 !important;
}

/* Old HTML <font size="..."> tags reset */
font[size] {
    font-size: 14px !important;
}

/* Standalone Bold Heading Lines inside Paragraphs */
.tt-policy-richtext p > strong:only-child,
.tt-policy-richtext p > b:only-child,
.tt-app-description-body p > strong:only-child,
.tt-app-description-body p > b:only-child,
.g-overview p > strong:only-child,
.g-overview p > b:only-child {
    display: inline-block;
    font-size: 16.5px !important;
    font-weight: 800 !important;
    color: #0f2444 !important;
    margin: 10px 0 4px 0 !important;
    letter-spacing: -0.02em !important;
}

/* Mobile Screens (<768px): Authentic Mobile App Look */
@media (max-width: 768px) {
    h1, .h1 {
        font-size: 18px !important;
        line-height: 1.25 !important;
        letter-spacing: -0.025em !important;
    }
    h2, .h2 {
        font-size: 16px !important;
        line-height: 1.28 !important;
        letter-spacing: -0.02em !important;
    }
    h3, .h3 {
        font-size: 14.5px !important;
        line-height: 1.3 !important;
        letter-spacing: -0.015em !important;
    }
    h4, .h4 {
        font-size: 13.5px !important;
        line-height: 1.35 !important;
    }
    h5, .h5, h6, .h6 {
        font-size: 12px !important;
    }

    /* Content Headings on Mobile */
    .tt-policy-richtext h1, .tt-policy-richtext h2,
    .tt-app-description-body h1, .tt-app-description-body h2,
    .g-overview h1, .g-overview h2,
    .tour-overview h1, .tour-overview h2,
    .hotel-overview h1, .hotel-overview h2,
    .bravo_detail_tour h1, .bravo_detail_tour h2,
    .bravo_detail_hotel h1, .bravo_detail_hotel h2,
    .bravo_detail_car h1, .bravo_detail_car h2,
    .tt-app-section-card h1, .tt-app-section-card h2,
    .post-content h1, .post-content h2,
    .description h1, .description h2 {
        font-size: 16px !important;
        margin: 14px 0 6px 0 !important;
        line-height: 1.3 !important;
    }

    .tt-policy-richtext h3, .tt-policy-richtext h4,
    .tt-app-description-body h3, .tt-app-description-body h4,
    .g-overview h3, .g-overview h4,
    .tt-app-section-card h3, .tt-app-section-card h4 {
        font-size: 14.5px !important;
        margin: 10px 0 4px 0 !important;
    }

    /* Content Body on Mobile */
    .tt-policy-richtext,
    .tt-policy-richtext p,
    .tt-policy-richtext p span,
    .tt-policy-richtext li,
    .tt-policy-richtext [style*="font-size"],
    .tt-app-description-body,
    .tt-app-description-body p,
    .tt-app-description-body p span,
    .tt-app-description-body li,
    .g-overview,
    .g-overview p,
    .g-overview li,
    .g-overview [style*="font-size"],
    .bravo_content p,
    .bravo_content li {
        font-size: 13.5px !important;
        line-height: 1.65 !important;
    }

    .tt-policy-richtext p > strong:only-child,
    .tt-policy-richtext p > b:only-child,
    .tt-app-description-body p > strong:only-child,
    .tt-app-description-body p > b:only-child,
    .g-overview p > strong:only-child,
    .g-overview p > b:only-child {
        font-size: 15px !important;
    }
}

/* Paragraphs & General Content */
p, .desc, .sub-title, .lead, blockquote {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    letter-spacing: -0.01em;
}

p {
    line-height: 1.65;
}

/* Form Controls, Inputs, Buttons & Selects */
input, button, select, textarea, optgroup, option,
.form-control, .btn, .custom-select, .select2-container,
.input-number-group, .select2-selection {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    letter-spacing: -0.01em;
}

.btn {
    font-weight: 600 !important;
    letter-spacing: -0.015em;
}

/* Navigation, Badges, Labels & Breadcrumbs */
.nav-link, .navbar-brand, .badge, .label, label, .breadcrumb, .breadcrumb-item,
.menu-item, .dropdown-item, .pagination, .page-link {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

label {
    font-weight: 600;
    letter-spacing: -0.015em;
}

/* Modals, Cards, Popups, Tables & Dropdowns */
.modal, .modal-title, .modal-body, .modal-footer,
.card, .card-title, .card-body, .card-footer,
.dropdown-menu, .popover, .tooltip,
table, th, td {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

th {
    font-weight: 700;
    letter-spacing: -0.015em;
}

/* Datepickers, Calendars & Select2 */
.daterangepicker, .drp-calendar, .drp-buttons,
.select2, .select2-dropdown, .select2-results {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

/* Travel Cards, Booking Engine & Price Numbers: Tabular and Ultra-Crisp */
.price, .text-price, .val, .count, .price-val, .item-price,
.service-price, .booking-price, .amount, [data-price],
.rate-number, .total-price, .price-wrapper {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    font-feature-settings: "tnum" on, "lnum" on;
    font-variant-numeric: tabular-nums lining-nums;
    letter-spacing: -0.02em;
}

/* Preserve Icon Fonts from being overridden by universal selector */
.fa, .fas, .far, .fal, .fad, .fab,
[class^="fa-"], [class*=" fa-"],
.icon {
    font-family: FontAwesome !important;
}

.icofont,
[class^="icofont-"],
[class*=" icofont-"],
.fa[class*="icofont-"],
i[class*="icofont-"],
span[class*="icofont-"] {
    font-family: 'IcoFont' !important;
}

.ion, [class^="ion-"], [class*=" ion-"] {
    font-family: "Ionicons" !important;
}

/* Search Form Location Icon Fix */
.bravo_form .field-icon.icofont-map,
.bravo_form .field-icon[class*="icofont-"],
.field-icon.icofont-map {
    font-family: 'IcoFont' !important;
    font-style: normal !important;
    font-weight: normal !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
}

