/* ── Variables ─────────────────────────────────────────────── */
:root {
    --font-family-primary: Godwit;
    --font-family-stack: Godwit, NotoSans, NotoSansJP, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-size-xs: 12px;
    --font-size-sm: 12.45px;
    --font-size-md: 15px;
    --font-size-lg: 16px;
    --font-size-xl: 17.55px;
    --font-size-2xl: 20px;
    --font-size-3xl: 24px;
    --font-size-4xl: 26px;
    --font-weight-base: 400;
    --line-height-base: 24px;
    --color-text-primary: #242628;
    --color-surface-base: #000000;
    --color-text-tertiary: #0000ee;
    --color-text-inverse: #434343;
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 15px;
    --space-4: 16px;
    --space-5: 17.55px;
    --space-6: 19.95px;
    --space-7: 20.79px;
    --space-8: 24px;
    --radius-xs: 6px;
    --primary: #003580;
    --primary-light: #0071c2;
    --accent: #febb02;
    --accent-dark: #e0a800;
    --danger: #d0312d;
    --success: #008009;
    --text: #1a1a2e;
    --text-muted: #6c757d;
    --bg: #f4f6fb;
    --card-bg: #ffffff;
    --border: #e5e8f0;
    --radius: 12px;
    --radius-lg: 20px;
    --shadow: 0 4px 24px rgba(0,0,0,0.08);
    --shadow-hover: 0 12px 40px rgba(0,53,128,0.18);
    --transition: 0.28s cubic-bezier(.4,0,.2,1);
    --navbar-h: 68px;
}

/* ── Base ───────────────────────────────────────────────────── */
*, *::before, *::after {
    box-sizing: border-box;
}

html {
    font-size: 15px;
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-family-stack);
    background: var(--bg);
    color: var(--color-text-primary);
    margin: 0;
    padding-bottom: 80px;
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-base);
    line-height: var(--line-height-base);
}

h1, h2, h3, h4, h5, h6 {
    font-family: inherit;
    font-weight: 700;
}

/* ── Scrollbar ─────────────────────────────────────────────── */
::-webkit-scrollbar {
    width: 7px;
}

::-webkit-scrollbar-track {
    background: #f0f2f8;
}

::-webkit-scrollbar-thumb {
    background: var(--primary-light);
    border-radius: 4px;
}

/* ================================================================
   NAVBAR
   ================================================================ */
.navbar {
    background: #212529 !important;
    box-shadow: 0 3px 16px rgba(0,0,0,0.3);
    padding: 0 0;
    min-height: var(--navbar-h);
}

.navbar-brand {
    font-family: 'Playfair Display', serif;
    font-size: 1.5rem;
    font-weight: 700;
    color: #fff !important;
    letter-spacing: 1px;
    padding: 14px 0;
}

    .navbar-brand .fa-hotel {
        color: var(--accent);
    }

.nav-link {
    color: rgba(255,255,255,0.85) !important;
    font-weight: 600;
    font-size: 0.9rem;
    padding: 8px 14px !important;
    border-radius: 8px;
    transition: var(--transition);
}

    .nav-link:hover,
    .nav-link.active {
        color: var(--accent) !important;
        background: rgba(255,255,255,0.08);
    }

.dropdown-menu {
    border: none;
    border-radius: var(--radius);
    box-shadow: 0 16px 48px rgba(0,0,0,0.16);
    padding: 8px;
    animation: dropIn .2s ease;
}

@keyframes dropIn {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }

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

.dropdown-item {
    border-radius: 8px;
    padding: 9px 16px;
    font-weight: 500;
    transition: var(--transition);
}

    .dropdown-item:hover {
        background: #f0f4ff;
        color: var(--primary);
    }

/* ================================================================
   HERO SECTION
   ================================================================ */
.hero-section {
    min-height: 100vh;
    background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('https://images.unsplash.com/photo-1542314831-068cd1dbfeeb?w=1600&q=80') center center/cover no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}



.hero-title {
    font-family: 'Playfair Display', serif;
    font-size: clamp(2.2rem, 6vw, 4.5rem);
    color: #fff;
    text-shadow: 0 3px 20px rgba(0,0,0,0.4);
    margin-bottom: 16px;
}

.hero-subtitle {
    color: rgba(255,255,255,0.85);
    font-size: 1.15rem;
    margin-bottom: 2rem;
}

.search-widget {
    background: rgba(255,255,255,0.97);
    border-radius: var(--radius-lg);
    padding: 22px 26px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.28);
    max-width: 700px;
    margin: 0 auto;
    backdrop-filter: blur(10px);
    position: relative;
    z-index: 2;
}

    .search-widget .form-control,
    .search-widget .form-select {
        border: 1.5px solid var(--border);
        border-radius: 10px;
        height: 48px;
        font-size: 0.9rem;
        font-weight: 500;
        padding: 0 14px;
        transition: var(--transition);
        background: #f8faff;
    }

        .search-widget .form-control:focus,
        .search-widget .form-select:focus {
            border-color: var(--primary-light);
            box-shadow: 0 0 0 3px rgba(0,113,194,0.15);
            background: #fff;
        }

    .search-widget label {
        font-weight: 700;
        font-size: 0.78rem;
        color: var(--text-muted);
        text-transform: uppercase;
        letter-spacing: .5px;
        margin-bottom: 4px;
    }

/* ================================================================
   BUTTONS  (yêu cầu #3)
   ================================================================ */

/* Base */
.btn {
    font-family: 'Nunito', sans-serif;
    font-weight: 700;
    border-radius: 10px;
    padding: 9px 22px;
    font-size: 0.9rem;
    letter-spacing: .3px;
    transition: all var(--transition);
    position: relative;
    overflow: hidden;
    border: none;
}

    .btn::after {
        content: '';
        position: absolute;
        inset: 0;
        background: rgba(255,255,255,0);
        transition: background .2s;
        border-radius: inherit;
    }

    .btn:hover::after {
        background: rgba(255,255,255,0.12);
    }

    .btn:active {
        transform: scale(0.97);
    }

/* Book Now / Đặt phòng */
.btn-book,
.btn-book-now {
    background: linear-gradient(135deg, #febb02 0%, #f07800 100%);
    color: #1a1a2e;
    box-shadow: 0 4px 16px rgba(254,187,2,0.35);
    font-size: 0.95rem;
    padding: 10px 26px;
}

    .btn-book:hover,
    .btn-book-now:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 28px rgba(254,187,2,0.5);
        color: #1a1a2e;
    }

/* Create / Thêm mới */
.btn-create {
    background: linear-gradient(135deg, #003580, #0071c2);
    color: #fff;
    box-shadow: 0 4px 16px rgba(0,53,128,0.3);
}

    .btn-create:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 28px rgba(0,53,128,0.4);
        color: #fff;
    }

/* Edit / Chỉnh sửa */
.btn-edit {
    background: linear-gradient(135deg, #0071c2, #0097e6);
    color: #fff;
    box-shadow: 0 4px 12px rgba(0,113,194,0.25);
}

    .btn-edit:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(0,113,194,0.4);
        color: #fff;
    }

/* Details / Chi tiết */
.btn-details {
    background: linear-gradient(135deg, #6c757d, #495057);
    color: #fff;
    box-shadow: 0 4px 12px rgba(108,117,125,0.25);
}

    .btn-details:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(108,117,125,0.4);
        color: #fff;
    }

/* Delete / Xóa */
.btn-delete {
    background: linear-gradient(135deg, #d0312d, #c0392b);
    color: #fff;
    box-shadow: 0 4px 12px rgba(208,49,45,0.25);
}

    .btn-delete:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(208,49,45,0.4);
        color: #fff;
    }

/* Save / Lưu */
.btn-save {
    background: linear-gradient(135deg, #008009, #00a31a);
    color: #fff;
    box-shadow: 0 4px 12px rgba(0,128,9,0.25);
    padding: 11px 32px;
    font-size: 1rem;
}

    .btn-save:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 28px rgba(0,128,9,0.4);
        color: #fff;
    }

/* Back / Quay lại */
.btn-back {
    background: #fff;
    color: var(--text);
    border: 2px solid var(--border);
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

    .btn-back:hover {
        background: #f0f4ff;
        border-color: var(--primary-light);
        color: var(--primary);
        transform: translateX(-3px);
    }

/* Cancel / Hủy */
.btn-cancel {
    background: #f8f9fa;
    color: #6c757d;
    border: 1.5px solid #dee2e6;
}

    .btn-cancel:hover {
        background: #fff0f0;
        border-color: #d0312d;
        color: #d0312d;
    }

/* ================================================================
   ROOM CARDS  (kiểu booking.com)
   ================================================================ */
.room-card {
    background: var(--card-bg);
    border: none;
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow);
    transition: var(--transition);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    height: 100%;
}

    .room-card .card-body {
        display: flex;
        flex-direction: column;
        flex: 1;
    }

    .room-card .d-flex {
        margin-top: auto;
    }

    .room-card:hover {
        transform: translateY(-6px);
        box-shadow: var(--shadow-hover);
    }

    .room-card h4 {
        min-height: 60px;
    }

    .room-card p {
        min-height: 50px;
    }

.room-img-wrap {
    position: relative;
    overflow: hidden;
    height: 220px;
}

.room-img {
    width: 100%;
    height: 340px;
    object-fit: cover;
}

.room-card:hover .room-img {
    transform: scale(1.06);
}

.room-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 20px;
    letter-spacing: .3px;
}

.room-rating {
    position: absolute;
    top: 12px;
    right: 12px;
    background: rgba(0,0,0,0.6);
    color: var(--accent);
    font-size: 0.8rem;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 8px;
}

.room-card-body {
    padding: 18px 20px 20px;
}

.room-name {
    font-family: 'Playfair Display', serif;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 6px;
}

.room-type-tag {
    font-size: 0.78rem;
    color: var(--primary-light);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
    margin-bottom: 8px;
}

.room-amenities {
    font-size: 0.82rem;
    color: var(--text-muted);
    margin-bottom: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.room-price-block {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
}

.room-price {
    font-family: 'Playfair Display', serif;
    font-size: 1.4rem;
    font-weight: 700;
    color: #d0312d;
    line-height: 1;
}

.room-price-night {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-muted);
}

/* ================================================================
   FORM CARDS  (Create/Edit/Details/Delete)  – yêu cầu #4
   Dịch sang trái, cân đối hơn
   ================================================================ */
.form-page-wrapper {
    padding: 40px 0 60px;
}

.form-card {
    background: var(--card-bg);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    padding: 36px 40px;
    max-width: 720px;
    /* Dịch sang trái: margin-left nhỏ hơn, không center */
    margin-left: 0;
    margin-right: auto;
}

@media (max-width: 768px) {
    .form-card {
        padding: 24px 20px;
        margin: 0 12px;
    }
}

.form-card .form-label {
    font-weight: 700;
    font-size: 0.88rem;
    color: var(--text);
    margin-bottom: 5px;
}

.form-card .form-control,
.form-card .form-select {
    border: 1.5px solid var(--border);
    border-radius: 10px;
    padding: 10px 14px;
    font-size: 0.9rem;
    transition: var(--transition);
    background: #fafcff;
}

    .form-card .form-control:focus,
    .form-card .form-select:focus {
        border-color: var(--primary-light);
        box-shadow: 0 0 0 3px rgba(0,113,194,0.12);
        background: #fff;
    }

.form-section-title {
    font-family: 'Playfair Display', serif;
    font-size: 1.7rem;
    color: var(--primary);
    margin-bottom: 6px;
}

.form-section-sub {
    color: var(--text-muted);
    font-size: 0.88rem;
    margin-bottom: 28px;
}

/* Image upload/preview */
.img-preview-box {
    width: 100%;
    height: 220px;
    border: 2px dashed var(--border);
    border-radius: var(--radius);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #f8faff;
    transition: var(--transition);
    cursor: pointer;
}

    .img-preview-box:hover {
        border-color: var(--primary-light);
        background: #f0f4ff;
    }

    .img-preview-box img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: calc(var(--radius) - 2px);
        display: none;
    }

        .img-preview-box img.show {
            display: block;
        }

.img-placeholder {
    color: var(--text-muted);
    text-align: center;
    padding: 20px;
}

/* ================================================================
   ROOM DETAILS PAGE  (yêu cầu #5 – giống booking.com)
   ================================================================ */
.room-detail-hero {
    border-radius: var(--radius-lg);
    overflow: hidden;
    position: relative;
    height: 420px;
    box-shadow: var(--shadow-hover);
}

    .room-detail-hero img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .room-detail-hero .overlay {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        background: linear-gradient(transparent, rgba(0,0,0,0.6));
        padding: 30px 24px 20px;
        color: #fff;
    }

.detail-card {
    background: var(--card-bg);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    padding: 28px 32px;
}

.detail-info-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 0;
    border-bottom: 1px solid var(--border);
    font-size: 0.92rem;
}

    .detail-info-row:last-child {
        border-bottom: none;
    }

    .detail-info-row .icon {
        width: 32px;
        color: var(--primary-light);
        font-size: 1.1rem;
    }

    .detail-info-row .label {
        color: var(--text-muted);
        font-weight: 600;
        min-width: 120px;
    }

    .detail-info-row .value {
        font-weight: 700;
        color: var(--text);
    }

.amenity-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #f0f4ff;
    color: var(--primary);
    border-radius: 20px;
    padding: 5px 14px;
    font-size: 0.82rem;
    font-weight: 700;
    margin: 4px;
}

/* ================================================================
   SEARCH RESULTS
   ================================================================ */
.search-results-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
    flex-wrap: wrap;
    gap: 12px;
}

.results-count {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--text);
}

.filter-sidebar {
    background: var(--card-bg);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    padding: 24px;
    position: sticky;
    top: calc(var(--navbar-h) + 16px);
}

    .filter-sidebar h6 {
        font-family: 'Nunito', sans-serif;
        font-size: 0.78rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .5px;
        color: var(--text-muted);
        margin-bottom: 10px;
    }

/* ================================================================
   BOOKING / PAYMENT PAGE  (yêu cầu #8)
   ================================================================ */
.payment-method-card {
    border: 2px solid var(--border);
    border-radius: var(--radius);
    padding: 16px 18px;
    cursor: pointer;
    transition: var(--transition);
    display: flex;
    align-items: center;
    gap: 14px;
}

    .payment-method-card:hover,
    .payment-method-card.selected {
        border-color: var(--primary-light);
        background: #f0f6ff;
    }

    .payment-method-card input[type=radio] {
        display: none;
    }

.payment-method-icon {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    flex-shrink: 0;
}

.payment-summary-card {
    background: linear-gradient(135deg, var(--primary) 0%, #0071c2 100%);
    border-radius: var(--radius-lg);
    padding: 24px 28px;
    color: #fff;
}

    .payment-summary-card .total-price {
        font-family: 'Playfair Display', serif;
        font-size: 2rem;
        font-weight: 700;
        color: var(--accent);
    }

/* ================================================================
   SUPPORT WIDGET (yêu cầu #11)
   ================================================================ */
#support-fab {
    position: fixed;
    bottom: 28px;
    left: 24px;
    z-index: 9999;
}

.support-btn {
    width: 56px;
    height: 56px;
    background: linear-gradient(135deg, var(--primary), var(--primary-light));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.4rem;
    cursor: pointer;
    box-shadow: 0 6px 24px rgba(0,53,128,0.4);
    transition: var(--transition);
    border: none;
    outline: none;
}

    .support-btn:hover {
        transform: scale(1.12) rotate(15deg);
        box-shadow: 0 10px 36px rgba(0,53,128,0.5);
    }

.support-popup {
    position: absolute;
    bottom: 68px;
    left: 0;
    width: 320px;
    background: var(--card-bg);
    border-radius: 18px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.22);
    overflow: hidden;
    display: none;
    animation: popIn .28s cubic-bezier(.4,0,.2,1);
    transform-origin: bottom left;
}

    .support-popup.open {
        display: block;
    }

@keyframes popIn {
    from {
        opacity: 0;
        transform: scale(0.8) translateY(16px);
    }

    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.support-popup-header {
    background: linear-gradient(135deg, var(--primary), var(--primary-light));
    padding: 18px 20px;
    color: #fff;
}

    .support-popup-header h6 {
        font-family: 'Nunito', sans-serif;
        font-size: 1rem;
        font-weight: 800;
        margin: 0;
    }

.support-popup-body {
    padding: 16px 20px;
    max-height: 360px;
    overflow-y: auto;
}

.support-contact-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
    font-size: 0.88rem;
}

    .support-contact-item:last-child {
        border-bottom: none;
    }

    .support-contact-item .s-icon {
        width: 32px;
        height: 32px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1rem;
        flex-shrink: 0;
    }

.support-channel-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 14px;
    border-radius: 10px;
    font-size: 0.88rem;
    font-weight: 700;
    text-decoration: none;
    transition: var(--transition);
    margin-bottom: 6px;
    border: none;
    cursor: pointer;
}

    .support-channel-btn.messenger {
        background: #e8f4ff;
        color: #0866ff;
    }

        .support-channel-btn.messenger:hover {
            background: #0866ff;
            color: #fff;
        }

    .support-channel-btn.zalo {
        background: #e6f2ff;
        color: #006af5;
    }

        .support-channel-btn.zalo:hover {
            background: #006af5;
            color: #fff;
        }

/* ================================================================
   ALERTS & TOASTS
   ================================================================ */
.alert {
    border: none;
    border-radius: var(--radius);
    font-weight: 600;
    font-size: 0.9rem;
}

.alert-success {
    background: #e8f8ea;
    color: #005a08;
}

.alert-danger {
    background: #fff0f0;
    color: #8b0000;
}

.alert-warning {
    background: #fff8e1;
    color: #7a5300;
}

.alert-info {
    background: #e8f4ff;
    color: #003d7a;
}

/* ================================================================
   TABLE  (admin lists)
   ================================================================ */
.table-modern {
    border-collapse: separate;
    border-spacing: 0;
    background: var(--card-bg);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow);
    font-size: 0.88rem;
}

    .table-modern thead tr {
        background: linear-gradient(135deg, var(--primary), #0071c2);
        color: #fff;
    }

    .table-modern thead th {
        padding: 14px 18px;
        font-weight: 700;
        font-size: 0.82rem;
        text-transform: uppercase;
        letter-spacing: .5px;
        border: none;
    }

    .table-modern tbody tr {
        transition: var(--transition);
        border-bottom: 1px solid var(--border);
    }

        .table-modern tbody tr:hover {
            background: #f4f8ff;
        }

    .table-modern tbody td {
        padding: 13px 18px;
        vertical-align: middle;
        border: none;
    }

/* ================================================================
   BOOKING SUCCESS
   ================================================================ */
.success-icon {
    width: 90px;
    height: 90px;
    background: linear-gradient(135deg, #e8f8ea, #c8f0cd);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2.8rem;
    color: var(--success);
    margin: 0 auto 20px;
    animation: successPop .5s cubic-bezier(.4,0,.2,1);
}

@keyframes successPop {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    70% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/* ================================================================
   RESPONSIVE UTILITIES
   ================================================================ */
@media (max-width: 576px) {
    .hero-section {
        min-height: 70vh;
    }

    .room-detail-hero {
        height: 260px;
    }

    .detail-card {
        padding: 18px 16px;
    }

    .payment-summary-card {
        padding: 18px;
    }

    .search-widget {
        padding: 16px;
    }

    .btn {
        padding: 8px 16px;
        font-size: 0.85rem;
    }
}

@media (max-width: 768px) {
    .form-card {
        margin: 0 16px;
    }

    .filter-sidebar {
        position: static;
        margin-bottom: 24px;
    }

    .room-card:hover {
        transform: translateY(-3px);
    }
}

/* ================================================================
   MISC UTILITIES
   ================================================================ */
.text-price {
    color: #d0312d;
    font-weight: 800;
}

.text-primary-hotel {
    color: var(--primary);
}

.bg-primary-hotel {
    background: var(--primary);
    color: #fff;
}

.rounded-xl {
    border-radius: var(--radius-lg) !important;
}

.badge-status {
    font-size: 0.78rem;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 20px;
    letter-spacing: .3px;
}

.skeleton {
    background: linear-gradient(90deg, #e8eaf0 25%, #f8faff 50%, #e8eaf0 75%);
    background-size: 200% 100%;
    animation: skeleton 1.5s infinite;
    border-radius: 8px;
}

@keyframes skeleton {
    from {
        background-position: 200% 0;
    }

    to {
        background-position: -200% 0;
    }
}

/* Page transitions */
.fade-in {
    animation: fadeIn .4s ease;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(12px);
    }

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

/* ===== HMS Hotel modern UI ===== */
:root {
    --hotel-dark: #111827;
    --hotel-primary: #0f766e;
    --hotel-accent: #f59e0b;
    --hotel-soft: #f8fafc;
    --hotel-border: #e5e7eb;
}

.hotel-body {
    background: linear-gradient(180deg,#f8fafc 0%,#ffffff 45%,#f8fafc 100%);
    color: #111827;
}

.hotel-navbar {
    background: rgba(17,24,39,.96);
    backdrop-filter: blur(12px);
    box-shadow: 0 12px 35px rgba(15,23,42,.18);
}

    .hotel-navbar .navbar-brand, .hotel-navbar .nav-link {
        color: #fff !important;
    }

    .hotel-navbar .nav-link {
        font-weight: 600;
        border-radius: 999px;
        padding: .55rem .85rem !important;
        transition: .2s;
    }

        .hotel-navbar .nav-link:hover {
            background: rgba(255,255,255,.10);
            color: #fbbf24 !important;
        }

.brand-icon {
    display: inline-flex;
    width: 34px;
    height: 34px;
    border-radius: 12px;
    background: #f59e0b;
    color: #111827;
    align-items: center;
    justify-content: center;
    margin-right: .35rem;
}

.hotel-dropdown {
    border: 0;
    border-radius: 18px;
    box-shadow: 0 20px 60px rgba(15,23,42,.18);
    padding: .65rem;
}

    .hotel-dropdown .dropdown-item {
        border-radius: 12px;
        padding: .65rem .85rem;
        font-weight: 600;
    }

.login-pill {
    display: inline-flex;
    align-items: center;
    background: rgba(255,255,255,.12);
    color: #fff;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 999px;
    padding: .5rem .85rem;
    font-size: .92rem;
}

.hotel-footer {
    background: #111827;
}

.hotel-card {
    border: 1px solid var(--hotel-border);
    border-radius: 24px;
    box-shadow: 0 18px 45px rgba(15,23,42,.08);
    overflow: hidden;
    background: #fff;
}

.hotel-section-title {
    font-weight: 800;
    letter-spacing: -.02em;
}

.hotel-muted {
    color: #64748b;
}

.hotel-btn-primary {
    background: var(--hotel-primary);
    border-color: var(--hotel-primary);
    color: #fff;
    border-radius: 999px;
    font-weight: 700;
}

    .hotel-btn-primary:hover {
        background: #115e59;
        border-color: #115e59;
        color: #fff;
        transform: translateY(-1px);
    }

.hotel-btn-outline {
    border: 1px solid var(--hotel-border);
    border-radius: 999px;
    font-weight: 700;
    background: #fff;
}

    .hotel-btn-outline:hover {
        background: #f8fafc;
        transform: translateY(-1px);
    }

.search-panel {
    margin-top: -52px;
    position: relative;
    z-index: 3;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 25px 70px rgba(15,23,42,.18);
    border: 1px solid rgba(226,232,240,.9);
    padding: 22px;
}

.search-control {
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: .8rem 1rem;
    background: #f8fafc;
}

    .search-control:focus {
        border-color: #0f766e;
        box-shadow: 0 0 0 .2rem rgba(15,118,110,.12);
        background: #fff;
    }

.search-label {
    font-weight: 800;
    font-size: .82rem;
    color: #475569;
    margin-bottom: .4rem;
}

.room-list-card {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 0;
    border-radius: 24px;
    border: 1px solid #e5e7eb;
    background: #fff;
    overflow: hidden;
    box-shadow: 0 16px 45px rgba(15,23,42,.08);
    transition: .25s;
}

    .room-list-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 22px 55px rgba(15,23,42,.14);
    }

.room-list-img {
    width: 100%;
    height: 100%;
    min-height: 235px;
    object-fit: cover;
}

.room-badge {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    border-radius: 999px;
    padding: .35rem .65rem;
    font-weight: 700;
    font-size: .82rem;
}

.room-price {
    font-size: 1.45rem;
    font-weight: 900;
    color: #dc2626;
}

.room-list-card .room-meta-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    min-height: 30px;
}

.room-list-card .room-badge {
    position: static;
    inset: auto;
    flex: 0 0 auto;
    white-space: nowrap;
}

.room-list-media {
    position: relative;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    outline: none;
}

.room-image-meta {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 2;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    max-width: calc(100% - 32px);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
    pointer-events: none;
}

.room-list-card:hover .room-image-meta,
.room-list-media:focus .room-image-meta,
.room-list-media:focus-within .room-image-meta {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.room-list-card:hover .room-list-img,
.room-list-media:focus .room-list-img {
    filter: brightness(.78);
    transform: scale(1.02);
}

.room-list-media .room-list-img {
    transition: filter .25s ease, transform .35s ease;
}

@media (hover: none) {
    .room-image-meta {
        opacity: 1;
        visibility: visible;
        transform: none;
    }
}

.price-old {
    color: #8a94a6;
    font-size: .95rem;
    font-weight: 700;
    text-decoration: line-through;
}

.promo-price {
    color: #dc2626;
    line-height: 1.1;
}

.promo-code {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    background: #fff7d6;
    color: #8a5a00;
    font-weight: 800;
    letter-spacing: .04em;
    padding: .35rem .75rem;
}

.amenity-chip {
    border-radius: 999px;
    background: #f1f5f9;
    color: #334155;
    padding: .35rem .65rem;
    font-weight: 600;
    font-size: .85rem;
}

@media(max-width:768px) {
    .room-list-card {
        grid-template-columns: 1fr
    }

    .room-list-img {
        height: 220px
    }

    .search-panel {
        margin-top: 0;
        border-radius: 0 0 24px 24px
    }
}

.invoice-box {
    background: #fff;
    border-radius: 28px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 20px 60px rgba(15,23,42,.10);
}

.timeline-item {
    border-left: 3px solid #0f766e;
    padding-left: 18px;
    position: relative;
    margin-bottom: 18px;
}

    .timeline-item:before {
        content: "";
        position: absolute;
        left: -9px;
        top: 4px;
        width: 15px;
        height: 15px;
        border-radius: 50%;
        background: #0f766e;
        border: 3px solid #ccfbf1;
    }

/* ===== FIX 31/05: room/review/history layout ===== */
main {
    min-height: calc(100vh - 170px);
}

.hotel-navbar {
    z-index: 1030;
}

    .hotel-navbar .container {
        max-width: 1320px;
    }

.login-pill {
    color: #f8fafc !important;
    background: rgba(255,255,255,.10) !important;
    white-space: nowrap;
}

.room-list-card {
    display: grid !important;
    grid-template-columns: 320px minmax(0,1fr) !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 245px !important;
    border-radius: 22px !important;
    background: #fff !important;
    border: 1px solid #dbe4f0 !important;
    overflow: hidden !important;
    box-shadow: 0 10px 30px rgba(15,23,42,.08) !important;
}

    .room-list-card > .room-list-img,
    .room-list-card .room-list-img {
        width: 320px !important;
        max-width: 320px !important;
        height: 100% !important;
        min-height: 245px !important;
        max-height: 285px !important;
        object-fit: cover !important;
        display: block !important;
    }

    .room-list-card > div {
        min-width: 0 !important;
    }

    .room-list-card h3 {
        line-height: 1.25;
    }

.room-price {
    white-space: nowrap;
}

.review-card {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 24px;
    box-shadow: 0 16px 40px rgba(15,23,42,.08);
    padding: 24px;
    height: 100%;
}

.review-stars {
    color: #f59e0b;
    letter-spacing: 2px;
}

.empty-state {
    background: #fff;
    border: 1px dashed #cbd5e1;
    border-radius: 24px;
    padding: 34px;
    text-align: center;
    color: #64748b;
}

.history-table th {
    font-weight: 800;
    color: #334155;
    font-size: .88rem;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.history-table td, .history-table th {
    padding: 1rem !important;
}

@media(max-width:992px) {
    .room-list-card {
        grid-template-columns: 1fr !important;
    }

        .room-list-card > .room-list-img,
        .room-list-card .room-list-img {
            width: 100% !important;
            max-width: 100% !important;
            height: 230px !important;
            min-height: 230px !important;
            max-height: 230px !important;
        }
}

/* ===== Production booking UI refresh ===== */
:root {
    --lux-navy: #06234a;
    --lux-blue: #0b4c8c;
    --lux-teal: #11a6a6;
    --lux-mist: #f3f7fb;
    --lux-line: #dce7f2;
    --lux-ink: #102033;
}

body.hotel-body {
    background: var(--lux-mist);
    color: var(--lux-ink);
    padding-bottom: 0;
}

.page-loader {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: grid;
    place-items: center;
    background: #fff;
    transition: opacity .35s ease, visibility .35s ease;
}

.page-loader.loaded {
    opacity: 0;
    visibility: hidden;
}

.loader-ring {
    width: 46px;
    height: 46px;
    border: 4px solid #dbeafe;
    border-top-color: var(--lux-teal);
    border-radius: 50%;
    animation: spin .8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.hotel-navbar {
    background: rgba(6,35,74,.96) !important;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.brand-icon {
    background: linear-gradient(135deg, var(--lux-teal), #7dd3fc);
    color: #fff;
}

.lux-hero {
    position: relative;
    min-height: 720px;
    background: url("https://images.unsplash.com/photo-1564501049412-61c2a3083791?auto=format&fit=crop&w=1800&q=85") center/cover no-repeat;
    overflow: hidden;
}

.lux-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(6,35,74,.92), rgba(6,35,74,.62) 48%, rgba(17,166,166,.35));
}

.min-vh-75 {
    min-height: 620px;
}

.lux-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    text-transform: uppercase;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .14em;
    color: #a7f3d0;
    margin-bottom: 1rem;
}

.lux-eyebrow.dark {
    color: var(--lux-teal);
}

.lux-hero-title {
    max-width: 850px;
    font-family: "Be Vietnam Pro", "Segoe UI", sans-serif;
    font-size: clamp(2.7rem, 5.4vw, 5.25rem);
    line-height: 1.08;
    font-weight: 800;
    letter-spacing: -.025em;
    text-wrap: balance;
    margin-bottom: 1.25rem;
}

.lux-hero-text {
    max-width: 680px;
    font-size: 1.2rem;
    color: rgba(255,255,255,.82);
    margin-bottom: 2rem;
}

.lux-btn-accent {
    background: linear-gradient(135deg, var(--lux-teal), #22d3ee);
    color: #06234a;
    border: 0;
    border-radius: 999px;
    box-shadow: 0 18px 40px rgba(17,166,166,.3);
}

.lux-btn-accent:hover {
    color: #06234a;
    transform: translateY(-2px);
}

.lux-btn-ghost {
    color: #fff;
    border: 1px solid rgba(255,255,255,.35);
    background: rgba(255,255,255,.08);
    border-radius: 999px;
}

.lux-btn-ghost:hover {
    color: #fff;
    background: rgba(255,255,255,.16);
}

.lux-search-panel {
    position: relative;
    z-index: 5;
    margin-top: -74px;
    padding: 24px;
    background: #fff;
    border: 1px solid var(--lux-line);
    border-radius: 22px;
    box-shadow: 0 24px 70px rgba(6,35,74,.18);
}

.lux-booking-tabs {
    position: relative;
    z-index: 6;
    margin-top: -94px;
    display: inline-flex;
    gap: 8px;
    padding: 8px;
    border-radius: 18px 18px 0 0;
    background: rgba(255,255,255,.96);
    border: 1px solid var(--lux-line);
    border-bottom: 0;
    box-shadow: 0 18px 45px rgba(6,35,74,.12);
}

.lux-booking-tabs a {
    display: inline-flex;
    align-items: center;
    padding: .8rem 1rem;
    border-radius: 12px;
    color: var(--lux-navy);
    text-decoration: none;
    font-weight: 900;
}

.lux-booking-tabs a.active,
.lux-booking-tabs a:hover {
    background: linear-gradient(135deg, var(--lux-blue), var(--lux-teal));
    color: #fff;
}

.booking-hero.mini {
    min-height: 360px;
    display: flex;
    align-items: center;
    position: relative;
    background-size: cover;
    background-position: center;
}

.booking-hero.mini::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(6,35,74,.9), rgba(6,35,74,.45));
}

.booking-hero.mini > .container {
    position: relative;
    z-index: 1;
}

.flight-bg {
    background-image: url("https://images.unsplash.com/photo-1436491865332-7a61a109cc05?auto=format&fit=crop&w=1800&q=85");
}

.tour-bg {
    background-image: url("https://images.unsplash.com/photo-1507525428034-b723cf961d3e?auto=format&fit=crop&w=1800&q=85");
}

.travel-list-card {
    display: grid;
    grid-template-columns: 320px 1fr;
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid var(--lux-line);
    background: #fff;
    box-shadow: 0 16px 42px rgba(6,35,74,.08);
}

.travel-list-card > img {
    width: 100%;
    height: 100%;
    min-height: 250px;
    object-fit: cover;
}

.travel-list-body {
    padding: 24px;
}

.hotel-btn-primary {
    background: linear-gradient(135deg, var(--lux-blue), var(--lux-teal));
    border: 0;
    color: #fff;
    box-shadow: 0 12px 30px rgba(11,76,140,.18);
}

.hotel-btn-primary:hover {
    background: linear-gradient(135deg, #083b70, #0f9292);
    color: #fff;
}

.hotel-card,
.lux-room-card,
.review-card,
.lux-stat,
.lux-service {
    border-radius: 18px;
    border: 1px solid var(--lux-line);
    background: #fff;
    box-shadow: 0 16px 42px rgba(6,35,74,.08);
}

.lux-stat {
    padding: 28px;
    transition: transform .22s ease, box-shadow .22s ease;
}

.lux-stat:hover,
.lux-room-card:hover,
.lux-service:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 58px rgba(6,35,74,.13);
}

.lux-stat strong {
    display: block;
    font-size: clamp(1.6rem, 3vw, 2.5rem);
    color: var(--lux-navy);
    line-height: 1;
}

.lux-stat span {
    color: #64748b;
    font-weight: 700;
}

.lux-section-head {
    display: flex;
    justify-content: space-between;
    gap: 1.5rem;
    align-items: end;
    margin-bottom: 1.7rem;
}

.lux-section-head h2 {
    font-size: clamp(2rem, 4vw, 3.2rem);
    font-weight: 900;
    letter-spacing: -.04em;
    margin: 0;
    color: var(--lux-navy);
}

.lux-section-head p {
    color: #64748b;
    margin: .35rem 0 0;
    max-width: 680px;
}

.lux-room-card {
    overflow: hidden;
    height: 100%;
    transition: transform .22s ease, box-shadow .22s ease;
}

.lux-room-image {
    position: relative;
    height: 255px;
    overflow: hidden;
}

.lux-room-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .35s ease;
}

.lux-room-card:hover .lux-room-image img {
    transform: scale(1.06);
}

.lux-room-rating {
    position: absolute;
    top: 16px;
    right: 16px;
    display: inline-flex;
    gap: .35rem;
    align-items: center;
    padding: .45rem .7rem;
    border-radius: 999px;
    background: rgba(6,35,74,.86);
    color: #fbbf24;
    font-weight: 800;
}

.lux-band {
    padding: 72px 0;
    background: linear-gradient(180deg, #fff, #eaf7f8);
}

.lux-service {
    padding: 24px;
    min-height: 170px;
    transition: .22s ease;
}

.lux-service i {
    display: inline-grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 14px;
    background: #e0f7f7;
    color: var(--lux-teal);
    margin-bottom: 1rem;
    font-size: 1.25rem;
}

.lux-service strong,
.lux-service span {
    display: block;
}

.lux-service span {
    color: #64748b;
    margin-top: .35rem;
}

.hotel-footer {
    background: #061a35;
}

.hotel-footer a {
    display: block;
    color: rgba(255,255,255,.66);
    text-decoration: none;
    margin-top: .55rem;
}

.hotel-footer a:hover {
    color: #67e8f9;
}

.footer-social {
    display: inline-grid !important;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255,255,255,.1);
    color: #fff !important;
}

.ai-chat-widget {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 1070;
}

.ai-chat-toggle {
    width: 62px;
    height: 62px;
    border: 0;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--lux-blue), var(--lux-teal));
    color: #fff;
    font-size: 1.35rem;
    box-shadow: 0 18px 40px rgba(6,35,74,.28);
    transition: .22s ease;
}

.ai-chat-toggle:hover {
    transform: translateY(-3px) scale(1.04);
}

.ai-chat-panel {
    position: absolute;
    right: 0;
    bottom: 78px;
    width: min(380px, calc(100vw - 32px));
    height: 560px;
    display: none;
    flex-direction: column;
    overflow: hidden;
    border-radius: 22px;
    background: #fff;
    border: 1px solid var(--lux-line);
    box-shadow: 0 28px 80px rgba(6,35,74,.28);
}

.ai-chat-panel.open {
    display: flex;
    animation: popIn .2s ease;
}

.ai-chat-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px;
    background: linear-gradient(135deg, var(--lux-navy), var(--lux-blue));
    color: #fff;
}

.ai-chat-header span {
    display: block;
    font-size: .82rem;
    color: rgba(255,255,255,.72);
}

.ai-chat-header button {
    border: 0;
    background: rgba(255,255,255,.12);
    color: #fff;
    border-radius: 10px;
    width: 34px;
    height: 34px;
}

.ai-chat-body {
    flex: 1;
    padding: 16px;
    overflow-y: auto;
    background: #f8fbff;
}

.ai-msg {
    width: fit-content;
    max-width: 86%;
    padding: 11px 13px;
    border-radius: 16px;
    margin-bottom: 10px;
    white-space: pre-wrap;
    line-height: 1.45;
    font-size: .92rem;
}

.ai-msg.bot {
    background: #fff;
    border: 1px solid var(--lux-line);
    color: var(--lux-ink);
}

.ai-msg.user {
    margin-left: auto;
    background: linear-gradient(135deg, var(--lux-blue), var(--lux-teal));
    color: #fff;
}

.ai-msg.typing::after {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-left: 6px;
    border-radius: 50%;
    background: var(--lux-teal);
    animation: pulse .8s infinite;
}

@keyframes pulse {
    50% { opacity: .35; transform: translateY(-2px); }
}

.ai-chat-form {
    display: flex;
    gap: 8px;
    padding: 12px;
    border-top: 1px solid var(--lux-line);
}

.ai-chat-form input {
    flex: 1;
    border: 1px solid var(--lux-line);
    border-radius: 999px;
    padding: .75rem 1rem;
    outline: none;
}

.ai-chat-form button {
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 50%;
    background: var(--lux-teal);
    color: #fff;
}

.ai-chat-note {
    padding: 0 14px 12px;
    color: #64748b;
    font-size: .8rem;
}

.dashboard-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    min-height: 112px;
    border: 1px solid var(--lux-line);
    border-radius: 18px;
    background: #fff;
    color: var(--lux-navy);
    text-decoration: none;
    font-weight: 800;
    transition: .22s ease;
}

.dashboard-link i {
    font-size: 1.55rem;
    color: var(--lux-teal);
}

.dashboard-link:hover {
    transform: translateY(-4px);
    color: var(--lux-navy);
    box-shadow: 0 16px 38px rgba(6,35,74,.12);
}

@media (max-width: 992px) {
    .lux-section-head {
        align-items: start;
        flex-direction: column;
    }
}

@media (max-width: 576px) {
    .lux-hero {
        min-height: 620px;
    }

    .min-vh-75 {
        min-height: 520px;
    }

    .lux-search-panel {
        margin-top: 0;
        border-radius: 0 0 22px 22px;
    }

    .ai-chat-widget {
        right: 16px;
        bottom: 16px;
    }

    .ai-chat-panel {
        height: 74vh;
    }
}

/* ===== Customer navbar compact mode ===== */
.customer-layout .hotel-navbar {
    min-height: 64px;
}

.customer-layout .hotel-navbar .container {
    max-width: min(1760px, calc(100% - 28px));
}

.customer-layout .hotel-navbar .navbar-brand {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    margin-right: .75rem;
    padding: .7rem 0;
    white-space: nowrap;
    font-size: 1.28rem;
    letter-spacing: .02em;
}

.customer-layout .hotel-navbar .brand-icon {
    width: 32px;
    height: 32px;
    border-radius: 10px;
}

.customer-layout .hotel-navbar .navbar-collapse,
.customer-layout .hotel-navbar .navbar-nav {
    min-width: 0;
}

@media (min-width: 1200px) {
    .customer-layout .hotel-navbar .navbar-nav {
        flex-wrap: nowrap;
    }

    .customer-layout .hotel-navbar .nav-item {
        flex: 0 0 auto;
    }

    .customer-layout .hotel-navbar .nav-link {
        display: inline-flex;
        align-items: center;
        gap: .28rem;
        white-space: nowrap;
        line-height: 1;
        font-size: .82rem;
        padding: .48rem .48rem !important;
    }

    .customer-layout .hotel-navbar .nav-link i {
        margin-right: 0 !important;
        font-size: .92rem;
    }

    .customer-layout .hotel-navbar .navbar-nav.ms-auto {
        gap: .45rem !important;
        flex: 0 0 auto;
    }

    .customer-layout .hotel-navbar .login-pill {
        max-width: 238px;
        padding: .42rem .62rem;
        white-space: nowrap;
        font-size: .82rem;
    }

    .customer-layout .hotel-navbar .login-pill i {
        margin-right: .25rem !important;
    }

    .customer-layout .hotel-navbar .login-pill strong {
        display: inline-block;
        max-width: 118px;
        overflow: hidden;
        text-overflow: ellipsis;
        vertical-align: bottom;
        white-space: nowrap;
    }

    .customer-layout .hotel-navbar .btn-warning {
        display: inline-flex;
        align-items: center;
        gap: .25rem;
        padding: .55rem .85rem !important;
        line-height: 1.05;
        white-space: nowrap;
        border-radius: 999px !important;
    }

    .customer-layout .hotel-navbar .btn-warning i {
        margin-right: 0 !important;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .customer-layout .navbar-expand-lg .navbar-collapse {
        display: none !important;
    }

    .customer-layout .navbar-expand-lg .navbar-toggler {
        display: block;
    }

    .customer-layout .navbar-expand-lg .navbar-collapse.show {
        display: block !important;
    }
}

/* ===== Room details action alignment ===== */
.room-detail-actions .btn {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.room-detail-actions form {
    display: flex;
    margin: 0;
}

@media (max-width: 575.98px) {
    .room-detail-actions > .btn,
    .room-detail-actions > form,
    .room-detail-actions > form .btn {
        width: 100%;
    }
}

/* ===== Customer account menu ===== */
.account-menu-toggle {
    min-width: 218px;
    max-width: 250px;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    gap: .65rem;
    padding: .38rem .72rem;
    color: #fff;
    text-decoration: none;
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 999px;
}

.account-menu-toggle:hover,
.account-menu-toggle:focus,
.account-menu-toggle.show {
    color: #fff;
    background: rgba(255, 255, 255, .14);
}

.account-menu-toggle::after {
    margin-left: auto;
}

.account-avatar {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #0f3159;
    background: #ffc107;
    border-radius: 50%;
}

.account-menu-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1.15;
}

.account-menu-copy small {
    color: rgba(255, 255, 255, .7);
    font-size: .68rem;
}

.account-menu-copy strong {
    display: block;
    overflow: hidden;
    color: #fff;
    font-size: .83rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-dropdown {
    width: 290px;
    margin-top: .7rem !important;
    padding: .65rem;
    border: 0;
    border-radius: 8px;
    box-shadow: 0 18px 50px rgba(15, 35, 60, .2);
}

.account-dropdown-heading {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .55rem .65rem;
}

.account-avatar-lg {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
}

.account-dropdown-heading > span:last-child {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.account-dropdown-heading strong,
.account-dropdown-heading small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-dropdown-heading small {
    color: #6b7280;
    font-size: .75rem;
}

.account-dropdown .dropdown-item {
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .65rem .7rem;
    border-radius: 6px;
}

.account-dropdown .dropdown-item i {
    width: 20px;
    color: #60758d;
    text-align: center;
}

.account-dropdown .account-logout,
.account-dropdown .account-logout i {
    color: #c52c3a;
}

/* ===== Customer profile hub ===== */
.customer-account-page {
    min-height: calc(100vh - var(--navbar-h));
    background: #f3f6fa;
}

.account-page-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.account-eyebrow {
    color: #0796a8;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .08em;
}

.account-page-heading h1 {
    margin: .25rem 0;
    color: #102a43;
    font-size: clamp(1.8rem, 3vw, 2.45rem);
    font-weight: 800;
}

.account-page-heading p,
.account-content-header p {
    margin: 0;
    color: #68778a;
}

.account-password-btn {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    padding: .72rem 1rem;
    color: #102a43;
    font-weight: 700;
    background: #fff;
    border: 1px solid #d8e0e9;
}

.account-password-btn:hover {
    color: #102a43;
    background: #eaf8fa;
    border-color: #18aebb;
}

.account-sidebar,
.account-content-panel {
    background: #fff;
    border: 1px solid #e1e7ef;
    border-radius: 8px;
    box-shadow: 0 12px 34px rgba(31, 50, 73, .08);
}

.account-profile-summary {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: 1.25rem;
    border-bottom: 1px solid #edf1f5;
}

.account-profile-avatar {
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: #102a43;
    border-radius: 50%;
    font-size: 1rem;
    font-weight: 800;
}

.account-profile-summary > div:last-child {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.account-profile-summary strong,
.account-profile-summary span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-profile-summary strong {
    color: #102a43;
}

.account-profile-summary span,
.account-profile-summary small {
    color: #7a8797;
    font-size: .78rem;
}

.account-side-nav {
    display: flex;
    flex-direction: column;
    padding: .65rem;
}

.account-side-nav a {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: .75rem .85rem;
    color: #475569;
    text-decoration: none;
    border-radius: 6px;
    font-weight: 650;
}

.account-side-nav a i {
    width: 20px;
    color: #7a8da3;
    text-align: center;
}

.account-side-nav a:hover,
.account-side-nav a.active {
    color: #075c68;
    background: #eaf8fa;
}

.account-side-nav a:hover i,
.account-side-nav a.active i {
    color: #0ba8b8;
}

.account-side-nav .account-side-logout {
    margin-top: .4rem;
    color: #bd2937;
    border-top: 1px solid #edf1f5;
    border-radius: 0 0 6px 6px;
}

.account-side-nav .account-side-logout i {
    color: #bd2937;
}

.account-content-panel {
    overflow: hidden;
}

.account-content-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem 1.75rem;
    border-bottom: 1px solid #edf1f5;
}

.account-content-header span {
    color: #0ba8b8;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .08em;
}

.account-content-header h2 {
    margin: .2rem 0;
    color: #102a43;
    font-size: 1.35rem;
    font-weight: 800;
}

.account-content-header > i {
    color: #d8e4ec;
    font-size: 2.4rem;
}

.account-alert {
    margin: 1.4rem 1.75rem 0;
}

.account-profile-form {
    padding: 1.75rem;
}

.account-profile-form .form-label {
    margin-bottom: .45rem;
    color: #30445a;
    font-size: .86rem;
    font-weight: 750;
}

.account-input-wrap {
    position: relative;
}

.account-input-wrap > i {
    position: absolute;
    top: 50%;
    left: .9rem;
    z-index: 2;
    color: #8393a5;
    transform: translateY(-50%);
}

.account-input-wrap .form-control {
    min-height: 48px;
    padding-left: 2.7rem;
    border-color: #d8e0e9;
    border-radius: 6px;
}

.account-input-wrap .form-control:focus {
    border-color: #19aab8;
    box-shadow: 0 0 0 .2rem rgba(25, 170, 184, .12);
}

.account-form-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.75rem;
    padding-top: 1.25rem;
    border-top: 1px solid #edf1f5;
}

.account-form-actions > span {
    color: #738195;
    font-size: .82rem;
}

.account-form-actions > span i {
    margin-right: .35rem;
    color: #2b915c;
}

.account-save-btn {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    min-height: 44px;
    padding: .65rem 1.15rem;
    color: #fff;
    background: #0b8f9d;
    font-weight: 750;
}

.account-save-btn:hover {
    color: #fff;
    background: #087682;
}

@media (max-width: 991.98px) {
    .account-menu-toggle {
        max-width: 100%;
        margin-top: .5rem;
    }
}

@media (max-width: 767.98px) {
    .account-page-heading,
    .account-form-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .account-password-btn,
    .account-save-btn {
        justify-content: center;
        width: 100%;
    }
}

/* ===== GenZ-inspired home page ===== */
.tvk-home {
    --tvk-blue: #0b73de;
    --tvk-blue-dark: #0b3f74;
    --tvk-sky: #eaf7ff;
    --tvk-orange: #ff6d2d;
    --tvk-red: #ff5b67;
    --tvk-green: #10b981;
    --tvk-ink: #24364b;
    --tvk-muted: #71839b;
    --tvk-line: #e6eef7;
    background: #fff;
    color: var(--tvk-ink);
}

.tvk-home a {
    text-decoration: none;
}

.tvk-hero {
    position: relative;
    min-height: 625px;
    padding: 0 0 78px;
    background:
        linear-gradient(180deg, rgba(3, 37, 69, .88) 0%, rgba(6, 64, 111, .55) 42%, rgba(5, 20, 39, .86) 100%),
        url("https://cellphones.com.vn/sforum/wp-content/uploads/2022/05/21-3.jpg") center center / cover no-repeat;
    overflow: visible;
}

.tvk-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 9% -18%, rgba(9, 163, 230, .9) 0 110px, transparent 112px),
        linear-gradient(180deg, rgba(255,255,255,.08), transparent 24%);
    pointer-events: none;
}

.tvk-hero-inner {
    position: relative;
    z-index: 2;
}

.tvk-top-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: .55rem 1.25rem;
    min-height: 86px;
    color: rgba(255,255,255,.94);
    font-size: 1rem;
    font-weight: 850;
}

.tvk-top-links span,
.tvk-top-links a {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    color: rgba(255,255,255,.94);
}

.tvk-top-links a:hover {
    color: #fff;
}

.tvk-flag {
    justify-content: center;
    width: 30px;
    height: 22px;
    color: #ffeb3b !important;
    background: #ec1c24;
    border-radius: 3px;
    font-size: .72rem;
    font-weight: 900;
}

.tvk-help-pill {
    padding: .75rem 1rem;
    background: rgba(0, 21, 45, .42);
    border-radius: 8px;
}

.tvk-login-pill,
.tvk-register-pill {
    min-height: 58px;
    padding: 0 1.4rem;
    border-radius: 999px;
    font-weight: 900;
}

.tvk-login-pill {
    color: #064a8f !important;
    background: #dff2ff;
}

.tvk-register-pill {
    color: #fff !important;
    background: #0b9df4;
}

.tvk-product-menu {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 2rem;
    min-height: 58px;
    margin: 0 calc(50% - 50vw) 66px;
    padding: 0 1rem;
    border-top: 1px solid rgba(255,255,255,.14);
    border-bottom: 1px solid rgba(255,255,255,.14);
    background: rgba(16, 80, 130, .24);
}

.tvk-product-menu a {
    color: rgba(255,255,255,.92);
    font-weight: 900;
    white-space: nowrap;
}

.tvk-product-menu a:hover {
    color: #fff;
}

.tvk-eyebrow {
    margin: 0 0 .5rem;
    color: #b8e4ff;
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.tvk-hero h1 {
    max-width: 900px;
    margin: 0 auto 76px;
    font-size: clamp(2.1rem, 4.2vw, 3rem);
    font-weight: 900;
    letter-spacing: -.02em;
    text-shadow: 0 3px 18px rgba(0,0,0,.28);
}

.tvk-hero-copy {
    margin: 0 auto;
    color: rgba(255,255,255,.78);
    font-weight: 600;
}

.tvk-search-card {
    width: min(1460px, calc(100% - 24px));
    margin: 0 auto -118px;
}

.tvk-service-tabs {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    gap: .35rem;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 0 0 .55rem;
    border-bottom: 1px solid rgba(255,255,255,.62);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow-x: auto;
}

.tvk-service-tabs a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    min-width: max-content;
    padding: .75rem 1.3rem;
    color: rgba(255,255,255,.78);
    border-radius: 999px;
    font-size: 1.05rem;
    font-weight: 900;
    white-space: nowrap;
}

.tvk-service-tabs a i {
    font-size: 1.35rem;
}

.tvk-service-tabs a.active,
.tvk-service-tabs a:hover {
    color: #0e3157;
    background: #fff;
}

.tvk-search-form {
    margin-top: 1.85rem;
    padding: 0 1rem;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.tvk-subtabs {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    margin-bottom: 1.35rem;
}

.tvk-subtabs span,
.tvk-pill-tabs a,
.tvk-city-tabs span,
.tvk-discover-tabs span {
    display: inline-flex;
    align-items: center;
    padding: .4rem .8rem;
    color: #556a82;
    background: #f3f8fd;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 800;
}

.tvk-subtabs span.active,
.tvk-pill-tabs a.active,
.tvk-city-tabs span.active,
.tvk-discover-tabs span.active {
    color: #fff;
    background: var(--tvk-blue);
}

.tvk-search-form label {
    display: block;
    margin-bottom: .75rem;
    color: #fff;
    font-size: .92rem;
    font-weight: 800;
}

.tvk-input {
    position: relative;
}

.tvk-input i {
    position: absolute;
    top: 50%;
    left: .95rem;
    color: var(--tvk-blue);
    transform: translateY(-50%);
}

.tvk-input .form-control {
    min-height: 64px;
    padding-left: 2.6rem;
    border: 1px solid rgba(9, 30, 58, .18);
    border-radius: 0;
    font-size: 1rem;
    font-weight: 800;
    box-shadow: none;
}

.tvk-search-btn {
    min-height: 64px;
    color: #fff;
    background: var(--tvk-orange);
    border-radius: 0 18px 18px 0;
    font-size: 1.35rem;
}

.tvk-search-btn:hover {
    color: #fff;
    background: #ef5520;
}

.tvk-main {
    padding-top: 104px;
}

.tvk-promo-banner {
    display: grid;
    grid-template-columns: 1fr 170px;
    gap: 1rem;
    min-height: 180px;
    padding: 1.6rem;
    color: #fff;
    border-radius: 14px;
    background:
        linear-gradient(90deg, rgba(3,120,165,.96), rgba(45,210,185,.9)),
        repeating-linear-gradient(45deg, rgba(255,255,255,.12) 0 12px, transparent 12px 24px);
    box-shadow: 0 18px 44px rgba(6, 35, 74, .14);
}

.tvk-promo-banner h2 {
    max-width: 720px;
    margin: .65rem 0 .45rem;
    font-size: clamp(1.55rem, 4vw, 2.7rem);
    font-weight: 900;
    letter-spacing: -.04em;
}

.tvk-badge,
.tvk-tag {
    display: inline-flex;
    width: fit-content;
    padding: .3rem .55rem;
    color: #fff;
    background: var(--tvk-red);
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 900;
}

.tvk-tag {
    background: var(--tvk-blue);
}

.tvk-tag.red {
    background: var(--tvk-red);
}

.tvk-qr-placeholder,
.tvk-phone-placeholder,
.tvk-image-box,
.tvk-mini-image {
    display: grid;
    place-items: center;
    align-content: center;
    gap: .45rem;
    color: #698097;
    text-align: center;
    background: linear-gradient(135deg, #e8f4ff, #f7fbff);
    border: 1px dashed #b9d5ec;
}

.tvk-qr-placeholder {
    min-height: 138px;
    color: var(--tvk-blue);
    background: rgba(255,255,255,.9);
    border-radius: 12px;
}

.tvk-qr-placeholder i,
.tvk-phone-placeholder i,
.tvk-image-box i,
.tvk-mini-image i {
    font-size: 2rem;
}

.tvk-section {
    padding: 34px 0 8px;
}

.tvk-section-head {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 1rem;
    margin-bottom: 1rem;
}

.tvk-section-head h2,
.tvk-discover h2,
.tvk-newsletter-card h2 {
    margin: 0;
    color: #1f3349;
    font-size: clamp(1.25rem, 2.4vw, 1.75rem);
    font-weight: 900;
    letter-spacing: -.02em;
}

.tvk-section-head p {
    margin: .25rem 0 0;
    color: var(--tvk-muted);
    font-weight: 600;
}

.tvk-section-head a {
    color: var(--tvk-blue);
    font-weight: 900;
    white-space: nowrap;
}

.tvk-section-head.red h2 {
    color: var(--tvk-red);
}

.tvk-section-head.guide h2 {
    color: #36756b;
}

.tvk-voucher-card {
    display: grid;
    grid-template-columns: 38px 1fr auto;
    gap: .8rem;
    align-items: center;
    height: 100%;
    padding: 1rem;
    background: #fff;
    border: 1px solid var(--tvk-line);
    border-radius: 12px;
    box-shadow: 0 10px 28px rgba(6,35,74,.06);
}

.tvk-voucher-card > i {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    color: var(--tvk-blue);
    background: #eaf7ff;
    border-radius: 50%;
}

.tvk-voucher-card strong,
.tvk-voucher-card span {
    display: block;
}

.tvk-voucher-card strong {
    color: #283d54;
    font-size: .88rem;
}

.tvk-voucher-card span {
    color: var(--tvk-muted);
    font-size: .76rem;
}

.tvk-voucher-card button {
    color: var(--tvk-blue);
    background: #f2f8ff;
    border: 0;
    border-radius: 999px;
    padding: .35rem .6rem;
    font-size: .76rem;
    font-weight: 900;
}

.tvk-scroll-grid,
.tvk-offer-row,
.tvk-guide-grid {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(215px, 1fr);
    gap: 1rem;
    overflow-x: auto;
    padding-bottom: .45rem;
}

.tvk-deal-card,
.tvk-hotel-card,
.tvk-guide-card,
.tvk-category-grid a {
    position: relative;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--tvk-line);
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(6,35,74,.08);
    transition: transform .2s ease, box-shadow .2s ease;
}

.tvk-deal-card:hover,
.tvk-hotel-card:hover,
.tvk-guide-card:hover,
.tvk-category-grid a:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 42px rgba(6,35,74,.12);
}

.tvk-image-box {
    min-height: 130px;
    background: linear-gradient(135deg, #e8f4ff, #fdfefe);
}

.tvk-image-box.hotel {
    min-height: 148px;
    color: #0b73de;
}

.tvk-image-box.coral {
    color: #ef4444;
    background: linear-gradient(135deg, #fff0ed, #fff9f4);
}

.tvk-image-box.guide {
    min-height: 185px;
    color: #0f8f9a;
    background: linear-gradient(135deg, #e6fbf7, #eff8ff);
}

.tvk-deal-card h3,
.tvk-hotel-card h3 {
    min-height: 42px;
    margin: .55rem 0 .35rem;
    color: #253a52;
    font-size: .96rem;
    font-weight: 850;
}

.tvk-deal-card p,
.tvk-hotel-card p {
    margin: 0 0 .35rem;
    color: var(--tvk-muted);
    font-size: .78rem;
    font-weight: 650;
}

.tvk-deal-card strong,
.tvk-hotel-card strong {
    display: block;
    color: #ef5520;
    font-size: .94rem;
}

.home-data-card {
    position: relative;
    overflow: hidden;
}

.home-data-card .tvk-image-box {
    position: relative;
    min-height: 155px;
}

.home-data-card .home-card-badge {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 11px;
    border-radius: 0 0 10px 0;
    background: #0878d1;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
}

.home-data-card .home-card-badge.coral {
    background: #ff6670;
}

.home-section-links {
    display: flex;
    align-items: center;
    gap: 14px;
}

.home-section-links a {
    white-space: nowrap;
}

.home-data-card small {
    display: block;
    min-height: 18px;
    margin-bottom: 4px;
    color: #6b7c8f;
    font-size: 10px;
}

/* Bố cục trang chủ theo bản thiết kế chuẩn. */
.tvk-main {
    display: flex;
    flex-direction: column;
}

.tvk-main > * { order: 100; }
.tvk-main > .tvk-admin-image-manager { order: 0; }
.tvk-main > .tvk-promo-banner { order: 10; }
.tvk-main > .home-promotion-section { order: 20; }
.tvk-main > .home-booking-section { order: 30; }
.tvk-main > .home-category-section { order: 40; }
.tvk-main > .home-offer-section { order: 50; }
.tvk-main > .home-room-section { order: 60; }
.tvk-main > .home-activity-section { order: 70; }

.tvk-category-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.tvk-category-grid a {
    color: #273b53;
}

.tvk-mini-image {
    min-height: 120px;
    border-width: 0 0 1px;
    border-style: solid;
    border-color: var(--tvk-line);
    border-radius: 0;
}

.tvk-category-grid span {
    display: block;
    padding: .85rem;
    font-weight: 850;
}

.tvk-pill-tabs,
.tvk-city-tabs,
.tvk-discover-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: 1rem;
}

.tvk-small-banner {
    min-height: 135px;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.1rem;
    color: #fff;
    border-radius: 12px;
    background: linear-gradient(135deg, #0788d7, #35c5d8);
    font-size: 1.1rem;
    font-weight: 900;
}

.tvk-small-banner.green {
    background: linear-gradient(135deg, #059669, #30c7a8);
}

.tvk-small-banner.red {
    background: linear-gradient(135deg, #d53b55, #ff8a6b);
}

.tvk-small-banner i {
    font-size: 2.3rem;
}

.tvk-soft-btn,
.tvk-primary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: .65rem 1.35rem;
    color: var(--tvk-blue);
    background: #edf8ff;
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 900;
}

.tvk-primary-btn {
    color: #fff;
    background: #0b64b9;
}

.tvk-soft-btn:hover {
    color: var(--tvk-blue);
    background: #dff2ff;
}

.tvk-primary-btn:hover {
    color: #fff;
    background: #094f93;
}

.tvk-rating {
    color: #f59e0b;
    font-size: .8rem;
    font-weight: 850;
}

.tvk-sale {
    display: inline-flex;
    margin: .45rem 0;
    padding: .25rem .5rem;
    color: #fff;
    background: var(--tvk-orange);
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 900;
}

.tvk-hotel-card small {
    display: block;
    color: var(--tvk-muted);
    font-size: .72rem;
}

.tvk-empty {
    padding: 1.4rem;
    color: var(--tvk-muted);
    background: #f6fbff;
    border: 1px dashed #bdd7ee;
    border-radius: 12px;
    text-align: center;
    font-weight: 750;
}

.tvk-guide-grid {
    grid-auto-columns: minmax(175px, 1fr);
}

.tvk-guide-card {
    color: #fff;
}

.tvk-guide-card strong {
    position: absolute;
    left: 1rem;
    bottom: 1rem;
    color: #fff;
    text-shadow: 0 2px 12px rgba(0,0,0,.45);
}

.tvk-discover {
    padding-bottom: 48px;
}

.tvk-discover ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.tvk-discover li + li {
    margin-top: .55rem;
}

.tvk-discover a {
    color: #53677f;
    font-size: .84rem;
    font-weight: 650;
}

.tvk-discover a:hover {
    color: var(--tvk-blue);
}

.tvk-newsletter {
    padding: 54px 0;
    background:
        linear-gradient(115deg, rgba(2, 111, 190, .94) 0 45%, rgba(5, 66, 118, .78) 45%),
        radial-gradient(circle at 80% 50%, rgba(255,255,255,.3), transparent 35%),
        #0d68b7;
}

.tvk-newsletter-card {
    display: grid;
    grid-template-columns: 1fr 210px;
    gap: 2rem;
    align-items: center;
    color: #fff;
}

.tvk-newsletter-card h2 {
    max-width: 700px;
    color: #fff;
    font-size: clamp(1.5rem, 3.5vw, 2.15rem);
}

.tvk-newsletter-card p {
    margin: .8rem 0 0;
    color: rgba(255,255,255,.78);
    font-weight: 700;
}

.tvk-newsletter-form {
    display: flex;
    width: min(560px, 100%);
    gap: .6rem;
    margin-top: 1rem;
}

.tvk-newsletter-form input {
    flex: 1;
    min-height: 44px;
    padding: 0 1rem;
    border: 0;
    border-radius: 8px;
}

.tvk-newsletter-form button {
    min-height: 44px;
    padding: 0 1rem;
    color: #fff;
    background: var(--tvk-orange);
    border: 0;
    border-radius: 8px;
    font-weight: 900;
}

.tvk-phone-placeholder {
    min-height: 230px;
    color: #fff;
    background: rgba(255,255,255,.14);
    border-color: rgba(255,255,255,.38);
    border-radius: 24px;
}

@media (max-width: 991.98px) {
    .tvk-main {
        padding-top: 135px;
    }

    .tvk-promo-banner,
    .tvk-newsletter-card {
        grid-template-columns: 1fr;
    }

    .tvk-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tvk-section-head {
        align-items: start;
        flex-direction: column;
    }
}

@media (max-width: 575.98px) {
    .tvk-hero {
        padding-bottom: 145px;
    }

    .tvk-search-card {
        margin-bottom: -185px;
    }

    .tvk-main {
        padding-top: 195px;
    }

    .tvk-service-tabs {
        border-radius: 18px;
    }

    .tvk-service-tabs a {
        flex: 1 1 44%;
        justify-content: center;
    }

    .tvk-voucher-card {
        grid-template-columns: 38px 1fr;
    }

    .tvk-voucher-card button {
        grid-column: 2;
        width: fit-content;
    }

    .tvk-category-grid {
        grid-template-columns: 1fr;
    }

    .tvk-newsletter-form {
        flex-direction: column;
    }
}

/* ===== GenZ fidelity pass ===== */
.tvk-home {
    --tvk-blue: #0194f3;
    --tvk-blue-deep: #0064b7;
    --tvk-orange: #ff5e1f;
    --tvk-ink: #26384d;
    --tvk-muted: #687b8f;
    --tvk-line: #dce8f5;
    --tvk-bg: #ffffff;
    font-family: "Inter", "Be Vietnam Pro", Arial, sans-serif;
    font-size: 14px;
    line-height: 1.35;
}

.tvk-home .container {
    max-width: 1180px;
}

.tvk-home h1,
.tvk-home h2,
.tvk-home h3,
.tvk-home strong,
.tvk-home a,
.tvk-home button,
.tvk-home label {
    font-family: "Inter", "Be Vietnam Pro", Arial, sans-serif;
}

.tvk-hero {
    min-height: 417px;
    padding-bottom: 34px;
    background-position: center 44%;
}

.tvk-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(4, 39, 72, .9), rgba(10, 86, 150, .35) 46%, rgba(1, 23, 47, .76));
    pointer-events: none;
}

.tvk-hero-inner {
    z-index: 3;
}

.tvk-top-links {
    min-height: 46px;
    gap: .95rem;
    font-size: 12px;
    line-height: 1;
}

.tvk-top-links span,
.tvk-top-links a {
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}

.tvk-flag {
    width: 20px;
    height: 14px;
    font-size: 8px !important;
}

.tvk-help-pill {
    min-height: 34px;
    padding: 0 .7rem;
    background: rgba(3, 25, 52, .56);
    border-radius: 8px;
}

.tvk-login-pill,
.tvk-register-pill {
    min-height: 34px;
    padding: 0 1rem;
    font-size: 13px !important;
}

.tvk-login-pill {
    box-shadow: 0 8px 24px rgba(255,255,255,.08);
}

.tvk-product-menu {
    min-height: 50px;
    margin-bottom: 42px;
    gap: 1.85rem;
    background: rgba(19, 83, 137, .22);
}

.tvk-product-menu a {
    font-size: 13px;
    font-weight: 800;
}

.tvk-hero h1 {
    margin-bottom: 38px;
    font-size: 28px;
    line-height: 1.18;
}

.tvk-search-card {
    width: min(1100px, calc(100% - 34px));
    margin-bottom: -64px;
}

.tvk-service-tabs {
    justify-content: flex-start;
    gap: .35rem;
    padding-bottom: 8px;
}

.tvk-service-tabs a {
    min-height: 38px;
    padding: 0 .9rem;
    color: rgba(255,255,255,.82);
    font-size: 13px;
    font-weight: 800;
}

.tvk-service-tabs a i {
    font-size: 16px;
}

.tvk-service-tabs a.active,
.tvk-service-tabs a:hover {
    color: #102a43;
    background: #fff;
    box-shadow: 0 6px 16px rgba(0,0,0,.1);
}

.tvk-search-form {
    margin-top: 14px;
    padding: 0;
}

.tvk-subtabs {
    margin-bottom: 12px;
}

.tvk-subtabs span,
.tvk-pill-tabs a,
.tvk-city-tabs span,
.tvk-discover-tabs span {
    min-height: 28px;
    padding: 0 .75rem;
    color: #47748e;
    background: #edf8ff;
    font-size: 11px;
    font-weight: 800;
}

.tvk-subtabs span.active,
.tvk-pill-tabs a.active,
.tvk-city-tabs span.active,
.tvk-discover-tabs span.active {
    color: #fff;
    background: var(--tvk-blue);
}

.tvk-search-form label {
    margin-bottom: 8px;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
}

.tvk-input i {
    left: 13px;
    color: var(--tvk-blue);
    font-size: 18px;
}

.tvk-input .form-control {
    min-height: 48px;
    padding-left: 42px;
    color: #1f2d3d;
    background: #fff;
    border-color: rgba(23, 49, 79, .22);
    font-size: 13px;
    font-weight: 700;
}

.tvk-search-form .row > div:first-child .form-control {
    border-radius: 14px 0 0 14px;
}

.tvk-search-btn {
    min-height: 48px;
    border-radius: 0 14px 14px 0;
    font-size: 18px;
    box-shadow: none;
}

.tvk-main {
    padding-top: 92px;
}

.tvk-section {
    padding: 25px 0 0;
}

.tvk-section-head {
    margin-bottom: 14px;
}

.tvk-section-head h2,
.tvk-discover h2 {
    color: #26384d;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.25;
}

.tvk-section-head p {
    margin-top: 5px;
    color: #687b8f;
    font-size: 12px;
    font-weight: 500;
}

.tvk-section-head a {
    font-size: 12px;
    font-weight: 800;
}

.tvk-promo-banner {
    min-height: 150px;
    padding: 18px;
    border-radius: 8px;
    background:
        linear-gradient(90deg, rgba(0, 133, 171, .95), rgba(47, 211, 189, .92)),
        linear-gradient(135deg, rgba(255,255,255,.16), transparent 55%);
    box-shadow: 0 8px 24px rgba(29, 64, 100, .12);
}

.tvk-promo-banner h2 {
    max-width: 620px;
    font-size: 25px;
    line-height: 1.12;
}

.tvk-promo-banner p {
    margin: 0;
    color: rgba(255,255,255,.86);
    font-size: 12px;
}

.tvk-badge,
.tvk-tag {
    min-height: 20px;
    padding: 0 .5rem;
    align-items: center;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 800;
}

.tvk-qr-placeholder {
    min-height: 112px;
    border-radius: 8px;
}

.tvk-voucher-card {
    grid-template-columns: 28px 1fr auto;
    min-height: 72px;
    gap: .55rem;
    padding: 12px;
    border-radius: 8px;
    box-shadow: 0 3px 12px rgba(15, 54, 89, .07);
}

.tvk-voucher-card > i {
    width: 28px;
    height: 28px;
    font-size: 12px;
}

.tvk-voucher-card strong {
    font-size: 12px;
    font-weight: 700;
}

.tvk-voucher-card span {
    margin-top: 3px;
    font-size: 10px;
}

.tvk-voucher-card button {
    padding: .22rem .5rem;
    font-size: 10px;
}

.tvk-scroll-grid,
.tvk-offer-row,
.tvk-guide-grid {
    grid-auto-columns: minmax(205px, 1fr);
    gap: 12px;
}

.tvk-deal-card,
.tvk-hotel-card,
.tvk-guide-card,
.tvk-category-grid a {
    border-color: #dfeaf5;
    border-radius: 8px;
    box-shadow: 0 3px 12px rgba(15, 54, 89, .08);
}

.tvk-deal-card .p-3,
.tvk-hotel-card .p-3 {
    padding: 10px !important;
}

.tvk-image-box {
    min-height: 105px;
    background:
        linear-gradient(135deg, rgba(1,148,243,.18), rgba(255,255,255,.74)),
        repeating-linear-gradient(45deg, rgba(1,148,243,.08) 0 10px, transparent 10px 20px);
    border: 0;
}

.tvk-image-box.hotel {
    min-height: 126px;
}

.tvk-image-box.coral {
    background:
        linear-gradient(135deg, rgba(255,91,103,.2), rgba(255,255,255,.7)),
        repeating-linear-gradient(45deg, rgba(255,94,31,.1) 0 10px, transparent 10px 20px);
}

.tvk-image-box.guide {
    min-height: 155px;
}

.tvk-image-box i,
.tvk-mini-image i {
    font-size: 24px;
}

.tvk-image-box span,
.tvk-mini-image span,
.tvk-qr-placeholder span,
.tvk-phone-placeholder span {
    font-size: 11px;
    font-weight: 700;
}

.tvk-deal-card h3,
.tvk-hotel-card h3 {
    min-height: 32px;
    margin: 7px 0 4px;
    color: #26384d;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
}

.tvk-deal-card p,
.tvk-hotel-card p {
    font-size: 10.5px;
    line-height: 1.25;
}

.tvk-deal-card strong,
.tvk-hotel-card strong {
    color: #ff5e1f;
    font-size: 12px;
    font-weight: 800;
}

.tvk-category-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.tvk-mini-image {
    min-height: 118px;
    background:
        linear-gradient(135deg, rgba(1,148,243,.16), rgba(255,255,255,.76)),
        repeating-linear-gradient(45deg, rgba(1,148,243,.08) 0 10px, transparent 10px 20px);
}

.tvk-category-grid span {
    padding: 9px 10px;
    font-size: 12px;
    font-weight: 700;
}

.tvk-pill-tabs,
.tvk-city-tabs,
.tvk-discover-tabs {
    gap: 8px;
    margin-bottom: 13px;
}

.tvk-offer-row {
    grid-auto-columns: minmax(250px, 1fr);
}

.tvk-small-banner {
    min-height: 104px;
    padding: 14px;
    border-radius: 8px;
    font-size: 15px;
}

.tvk-small-banner i {
    font-size: 28px;
}

.tvk-soft-btn,
.tvk-primary-btn {
    min-height: 34px;
    padding: .45rem 1.15rem;
    font-size: 11px;
}

.tvk-primary-btn {
    min-width: 220px;
    background: #0d65b7;
}

.tvk-rating,
.tvk-hotel-card small {
    font-size: 10px;
}

.tvk-sale {
    margin: 5px 0;
    border-radius: 4px;
    font-size: 10px;
}

.tvk-guide-grid {
    grid-auto-columns: minmax(160px, 1fr);
}

.tvk-guide-card strong {
    font-size: 15px;
}

.tvk-discover {
    padding-top: 34px;
    padding-bottom: 42px;
}

.tvk-discover a {
    color: #586b80;
    font-size: 11px;
}

.tvk-discover li + li {
    margin-top: 7px;
}

.tvk-newsletter {
    padding: 42px 0;
    background:
        linear-gradient(110deg, #0194f3 0 34%, rgba(1,148,243,.88) 34% 35%, rgba(4,65,117,.35) 35%),
        url("https://cellphones.com.vn/sforum/wp-content/uploads/2022/05/21-3.jpg") center 58% / cover no-repeat;
}

.tvk-newsletter-card {
    grid-template-columns: minmax(0, 1fr) 170px;
    gap: 1.2rem;
}

.tvk-newsletter-card h2 {
    max-width: 650px;
    color: #fff;
    font-size: 22px;
    line-height: 1.18;
}

.tvk-newsletter-form {
    width: min(530px, 100%);
    gap: 8px;
    margin-top: 14px;
}

.tvk-newsletter-form input,
.tvk-newsletter-form button {
    min-height: 36px;
    border-radius: 5px;
    font-size: 12px;
}

.tvk-newsletter-form button {
    padding: 0 .9rem;
    background: #ff5e1f;
}

.tvk-newsletter-card p {
    font-size: 12px;
}

.tvk-phone-placeholder {
    min-height: 170px;
    border-radius: 18px;
}

.tvk-footer {
    padding: 44px 0 70px;
    color: #fff;
    background: #031f47;
}

.tvk-footer h3 {
    margin: 0 0 13px;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
}

.tvk-footer a {
    display: block;
    margin-top: 8px;
    color: rgba(255,255,255,.74);
    font-size: 11px;
    font-weight: 600;
}

.tvk-footer a:hover {
    color: #fff;
}

.tvk-payment-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    max-width: 290px;
}

.tvk-payment-grid span {
    display: grid;
    place-items: center;
    min-height: 31px;
    color: #174168;
    background: #fff;
    border-radius: 4px;
    font-size: 9px;
    font-weight: 800;
}

@media (min-width: 992px) {
    .tvk-scroll-grid,
    .tvk-guide-grid {
        overflow-x: visible;
    }

    .tvk-deal-card {
        width: 100%;
    }
}

@media (max-width: 991.98px) {
    .tvk-top-links {
        justify-content: center;
        min-height: auto;
        padding: 14px 0;
    }

    .tvk-product-menu {
        justify-content: flex-start;
        overflow-x: auto;
        margin-bottom: 34px;
    }

    .tvk-search-card {
        margin-bottom: -90px;
    }

    .tvk-main {
        padding-top: 120px;
    }

    .tvk-service-tabs {
        overflow-x: auto;
    }
}

@media (max-width: 575.98px) {
    .tvk-hero {
        min-height: 610px;
        padding-bottom: 40px;
    }

    .tvk-hero h1 {
        margin-bottom: 24px;
        font-size: 25px;
    }

    .tvk-search-card {
        margin-bottom: -150px;
    }

    .tvk-main {
        padding-top: 180px;
    }

    .tvk-search-form .row > div:first-child .form-control,
    .tvk-input .form-control,
    .tvk-search-btn {
        border-radius: 12px;
    }

    .tvk-category-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .tvk-newsletter-card {
        grid-template-columns: 1fr;
    }

    .tvk-payment-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* ===== Employee management profile table ===== */
.employee-summary-search-row > [class*="col-"] {
    display: flex;
}

.employee-summary-search-row .hotel-card {
    width: 100%;
}

.employee-table-hint {
    padding: .85rem 1.25rem;
    color: #567086;
    background: #f5faff;
    border-bottom: 1px solid #e2edf7;
    font-size: .9rem;
    font-weight: 700;
}

.employee-table-wrap {
    overflow-x: auto;
}

.employee-wide-table {
    min-width: 2450px;
    font-size: .88rem;
}

.employee-wide-table th {
    color: #40556b;
    font-size: .78rem;
    font-weight: 800;
    white-space: nowrap;
}

.employee-wide-table td {
    white-space: nowrap;
    vertical-align: middle;
}

.employee-wide-table .employee-long-cell {
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.customer-admin-table {
    min-width: 1580px;
    table-layout: fixed;
}

.customer-admin-table th,
.customer-admin-table td {
    padding: .7rem .75rem;
}

.customer-admin-table td {
    overflow: hidden;
    text-overflow: ellipsis;
}

.admin-users-table {
    min-width: 1320px;
}

.admin-users-table th,
.admin-users-table td {
    white-space: nowrap;
}

.password-hash-cell {
    display: inline-block;
    max-width: 340px;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    color: #0f5132;
    background: #eaf7ef;
    border: 1px solid #cbe8d4;
    border-radius: 999px;
    padding: .28rem .65rem;
    font-size: .76rem;
}

.password-hash-toggle {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    max-width: 430px;
    border: 0;
    background: transparent;
    padding: 0;
    text-align: left;
}

.password-hash-toggle .hash-toggle-label {
    color: #0d6efd;
    font-size: .78rem;
    font-weight: 700;
}

.password-hash-toggle:hover .password-hash-cell {
    border-color: #8fc7a1;
    background: #dff3e7;
}

.employee-actions-col {
    width: 210px;
}

.employee-form-section {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #e7edf4;
}

.employee-form-section:last-of-type {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: 0;
}

.employee-form-section h2 {
    margin-bottom: 1.1rem;
    color: #12385f;
    font-size: 1.1rem;
    font-weight: 850;
}

.employee-detail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.employee-detail-grid > div {
    padding: 1rem;
    background: #f8fbff;
    border: 1px solid #e1ebf5;
    border-radius: 14px;
}

.employee-detail-grid span {
    display: block;
    margin-bottom: .35rem;
    color: #6b7d90;
    font-size: .8rem;
    font-weight: 700;
}

.employee-detail-grid strong {
    display: block;
    color: #1f344a;
    overflow-wrap: anywhere;
}

.employee-detail-wide {
    grid-column: span 2;
}

.booking-admin-hint {
    padding: .85rem 1.25rem;
    color: #567086;
    background: #f5faff;
    border-bottom: 1px solid #e2edf7;
    font-size: .9rem;
    font-weight: 700;
}

.booking-admin-table-wrap {
    overflow-x: auto;
}

.booking-admin-table {
    min-width: 1450px;
    font-size: .88rem;
}

.booking-admin-table th {
    color: #40556b;
    font-size: .78rem;
    font-weight: 800;
    white-space: nowrap;
}

.booking-admin-table td {
    white-space: nowrap;
    vertical-align: middle;
}

.booking-admin-table td:nth-child(2) .hotel-muted {
    max-width: 280px;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 991.98px) {
    .employee-detail-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .employee-detail-grid {
        grid-template-columns: 1fr;
    }

    .employee-detail-wide {
        grid-column: auto;
    }
}

/* ===== Flight booking seats and invoice ===== */
.flight-booking-page .hotel-card {
    border-radius: 18px;
}

.flight-route-times {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .8rem;
    min-width: min(100%, 520px);
}

.flight-route-times > div,
.summary-line,
.summary-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.flight-route-times > div {
    padding: .8rem;
    background: #f6faff;
    border: 1px solid #e0ebf5;
    border-radius: 14px;
}

.flight-route-times span,
.summary-line span {
    color: #6b7d90;
    font-size: .82rem;
    font-weight: 700;
}

.seat-legend {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    color: #60758d;
    font-size: .86rem;
    font-weight: 700;
}

.seat-legend span {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}

.seat-dot {
    width: 14px;
    height: 14px;
    display: inline-block;
    border-radius: 4px;
}

.seat-dot.available {
    background: #e8f4ff;
    border: 1px solid #9fd1ff;
}

.seat-dot.selected {
    background: #0b8f9d;
}

.seat-dot.occupied {
    background: #23364d;
}

.aircraft-shell {
    padding: 1rem;
    background: linear-gradient(180deg, #f8fbff, #eef5fb);
    border: 1px solid #dce8f3;
    border-radius: 24px;
}

.aircraft-front {
    width: fit-content;
    margin: 0 auto 1rem;
    padding: .45rem 1rem;
    color: #0f5f8d;
    background: #dff5ff;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 900;
}

.seat-map {
    display: grid;
    gap: .55rem;
    justify-content: center;
}

.business-seat-map {
    grid-template-columns: repeat(4, 58px);
}

.economy-seat-map {
    grid-template-columns: repeat(6, 52px);
}

.seat-cell {
    min-height: 42px;
    color: #075b8a;
    background: #e9f6ff;
    border: 1px solid #aad7fb;
    border-radius: 10px;
    font-size: .82rem;
    font-weight: 850;
    transition: .16s ease;
}

.seat-cell:hover:not(.occupied) {
    transform: translateY(-2px);
    background: #d7efff;
}

.seat-cell.selected {
    color: #fff;
    background: linear-gradient(135deg, #0874bf, #0ba8b8);
    border-color: #0874bf;
}

.seat-cell.occupied,
.seat-cell:disabled {
    color: #fff;
    cursor: not-allowed;
    background: #24364b;
    border-color: #24364b;
    opacity: .95;
}

.flight-payment-summary .summary-line {
    padding: .6rem 0;
    border-bottom: 1px solid #edf2f7;
}

.summary-total {
    padding-top: .85rem;
    font-size: 1.08rem;
    font-weight: 900;
}

.summary-total strong {
    color: #d73131;
    font-size: 1.35rem;
}

.flight-invoice-box {
    max-width: 980px;
    margin: 0 auto;
    padding: 2rem;
    background: #fff;
    border: 1px solid #e0e8f2;
    border-radius: 22px;
    box-shadow: 0 16px 45px rgba(20, 48, 78, .1);
}

.invoice-info-list {
    display: grid;
    gap: .75rem;
}

.invoice-info-list > div,
.invoice-total-card > div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .8rem 0;
    border-bottom: 1px solid #edf2f7;
}

.invoice-info-list span,
.invoice-total-card span {
    color: #6b7d90;
    font-weight: 700;
}

.invoice-info-list strong,
.invoice-total-card strong {
    text-align: right;
}

.invoice-total-card {
    padding: 1rem 1.25rem;
    background: #f8fbff;
    border: 1px solid #e0ebf5;
    border-radius: 16px;
}

.invoice-grand-total {
    align-items: center;
    border-bottom: 0 !important;
}

.invoice-grand-total strong {
    color: #d73131;
    font-size: 1.5rem;
}

@media (max-width: 767.98px) {
    .flight-route-times {
        grid-template-columns: 1fr;
    }

    .business-seat-map {
        grid-template-columns: repeat(3, 58px);
    }

    .economy-seat-map {
        grid-template-columns: repeat(4, 52px);
    }
}

@media print {
    body {
        background: #fff !important;
    }

    .hotel-navbar,
    .hotel-footer,
    .ai-chat-widget,
    .no-print {
        display: none !important;
    }

    .flight-invoice-box {
        max-width: 100%;
        border: 0;
        box-shadow: none;
        padding: 0;
    }
}

/* ===== Home hero reference alignment ===== */
.tvk-hero {
    min-height: 614px;
    padding-bottom: 64px;
    background:
        linear-gradient(180deg, rgba(7, 20, 35, .52) 0%, rgba(7, 22, 40, .42) 42%, rgba(4, 18, 34, .48) 100%),
        url("/images/home/GenZ-hero-bg.jpg") center 50% / cover no-repeat;
}

.tvk-hero::after {
    background:
        radial-gradient(circle at 17.5% -30%, #0879b9 0 106px, transparent 108px),
        linear-gradient(180deg, rgba(255,255,255,.06), transparent 22%);
}

.tvk-hero::before {
    background: rgba(4, 17, 31, .22);
}

.tvk-hero .container {
    max-width: 1494px;
}

.tvk-top-links {
    min-height: 70px;
    justify-content: flex-end;
    gap: 1.5rem;
    padding-right: .1rem;
}

.tvk-top-links .tvk-flag,
.tvk-top-links > span:not(.tvk-flag) {
    display: none;
}

.tvk-top-links a {
    color: rgba(255,255,255,.95);
    font-size: 14px;
    font-weight: 800;
}

.tvk-help-pill {
    min-height: 40px;
    padding: 0 .95rem;
    background: rgba(2, 18, 36, .5);
}

.tvk-login-pill,
.tvk-register-pill {
    min-height: 48px;
    padding: 0 1.35rem;
    font-size: 15px !important;
}

.tvk-register-pill {
    min-width: 98px;
    justify-content: center;
}

.tvk-product-menu {
    min-height: 58px;
    justify-content: center;
    gap: 1.95rem;
    margin-bottom: 38px;
    border-color: rgba(255,255,255,.16);
    background: rgba(11, 41, 69, .16);
}

.tvk-product-menu a {
    color: rgba(255,255,255,.92);
    font-size: 14px;
    font-weight: 850;
}

.tvk-product-menu a:nth-child(4),
.tvk-product-menu a:last-child {
    padding: .65rem .9rem;
    background: rgba(2, 18, 36, .48);
    border-radius: 8px;
}

.tvk-hero h1 {
    margin-bottom: 35px;
    font-size: 32px;
    line-height: 1.15;
    text-shadow: 0 3px 16px rgba(0,0,0,.28);
}

.tvk-search-card {
    width: min(1494px, calc(100% - 28px));
    margin-bottom: 0;
}

.tvk-service-tabs {
    align-items: center;
    justify-content: flex-start;
    gap: .85rem;
    padding: 0 0 .55rem;
    overflow: visible;
    scrollbar-width: none;
}

.tvk-service-tabs::-webkit-scrollbar {
    display: none;
}

.tvk-service-tabs a {
    min-height: 44px;
    padding: 0 1rem;
    color: rgba(255,255,255,.9);
    font-size: 15px;
    font-weight: 850;
    border: 1px solid transparent;
}

.tvk-service-tabs a:not(.active):nth-child(4),
.tvk-service-tabs a:not(.active):nth-child(6),
.tvk-service-tabs a:not(.active):nth-child(7) {
    border-color: rgba(255,255,255,.78);
    background: rgba(0,0,0,.13);
}

.tvk-service-tabs a.active {
    color: #111827;
    background: #fff;
}

.tvk-service-tabs a i {
    font-size: 19px;
}

.tvk-search-form {
    margin-top: 21px;
}

.tvk-search-form .row {
    --bs-gutter-x: 0;
    --bs-gutter-y: 0;
    display: grid;
    grid-template-columns: minmax(360px, 1fr) minmax(360px, 1fr) minmax(360px, 1fr) 64px;
    align-items: end;
}

.tvk-search-form .row > [class*="col-"] {
    width: auto;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
}

.tvk-subtabs {
    gap: .8rem;
    margin-bottom: 14px;
}

.tvk-subtabs span {
    min-height: 34px;
    padding: 0 .92rem;
    color: #fff;
    background: rgba(4, 20, 38, .52);
    font-size: 13px;
}

.tvk-subtabs span.active {
    background: #0194f3;
}

.tvk-search-form label {
    margin-bottom: 9px;
    color: #fff;
    font-size: 13px;
    font-weight: 850;
}

.tvk-input .form-control {
    min-height: 54px;
    font-size: 16px;
    border-color: rgba(0,0,0,.24);
}

.tvk-input .form-control[readonly] {
    background: #fff;
    cursor: default;
}

.tvk-input i {
    left: 16px;
    font-size: 21px;
}

.tvk-search-form .row > div:first-child .form-control {
    border-radius: 18px 0 0 18px;
}

.tvk-search-btn {
    min-height: 54px;
    border-radius: 0 18px 18px 0;
    font-size: 21px;
    background: #ff5e2c;
}

.tvk-top-links .fa-percent {
    display: none;
}

.tvk-main {
    padding-top: 44px;
}

@media (max-width: 991.98px) {
    .tvk-hero {
        min-height: 650px;
    }

    .tvk-top-links {
        justify-content: center;
        gap: .75rem;
        padding: .75rem 0;
    }

    .tvk-product-menu,
    .tvk-service-tabs {
        justify-content: flex-start;
        overflow-x: auto;
    }

    .tvk-search-card {
        margin-bottom: -132px;
    }

    .tvk-main {
        padding-top: 150px;
    }
}

@media (max-width: 575.98px) {
    .tvk-hero {
        min-height: 720px;
    }

    .tvk-hero h1 {
        font-size: 25px;
    }

    .tvk-search-card {
        margin-bottom: -190px;
    }

    .tvk-main {
        padding-top: 215px;
    }

    .tvk-input .form-control,
    .tvk-search-form .row > div:first-child .form-control,
    .tvk-search-btn {
        border-radius: 14px;
    }
}

/* ===== Home hero final visual match ===== */
.tvk-hero {
    min-height: 500px !important;
    padding-bottom: 18px !important;
    background:
        linear-gradient(180deg, rgba(10, 30, 48, .10) 0%, rgba(11, 35, 58, .06) 42%, rgba(6, 24, 42, .10) 100%),
        url("/images/home/GenZ-hero-bg.jpg") center 49% / cover no-repeat !important;
}

.tvk-hero::before {
    background: transparent !important;
}

.tvk-hero::after {
    background:
        radial-gradient(circle at 9.3% -18%, #0879b9 0 118px, transparent 120px),
        linear-gradient(180deg, rgba(255,255,255,.03), transparent 20%) !important;
}

.tvk-home,
.tvk-home h1,
.tvk-home a,
.tvk-home button,
.tvk-home label,
.tvk-home input {
    font-family: "Segoe UI", Arial, sans-serif !important;
}

.tvk-hero .container {
    max-width: min(1460px, 78vw) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.tvk-top-links {
    min-height: 70px !important;
    gap: 1.45rem !important;
}

.tvk-top-links a {
    font-size: 15px !important;
    font-weight: 700 !important;
}

.tvk-help-pill {
    min-height: 39px !important;
    padding: 0 .92rem !important;
    background: transparent !important;
}

.tvk-login-pill,
.tvk-register-pill {
    min-height: 54px !important;
    padding: 0 1.3rem !important;
    font-size: 16px !important;
    font-weight: 700 !important;
}

.tvk-register-pill {
    min-width: 106px !important;
}

.tvk-product-menu {
    min-height: 52px !important;
    gap: 2.1rem !important;
    margin-bottom: 37px !important;
    background: rgba(20, 76, 115, .12) !important;
    border-color: rgba(255,255,255,.18) !important;
}

.tvk-product-menu a {
    font-size: 14px !important;
    font-weight: 700 !important;
}

.tvk-product-menu a:nth-child(4),
.tvk-product-menu a:last-child {
    background: transparent !important;
}

.tvk-hero h1 {
    margin-bottom: 34px !important;
    font-size: 32px !important;
    font-weight: 800 !important;
    letter-spacing: -.35px;
    text-shadow: 0 2px 10px rgba(0,0,0,.24) !important;
}

.tvk-search-card {
    width: min(1460px, 78vw) !important;
    max-width: min(1460px, 78vw) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.tvk-service-tabs {
    gap: 1.05rem !important;
    padding-bottom: 9px !important;
    border-bottom: 1px solid rgba(255,255,255,.68) !important;
}

.tvk-service-tabs a {
    min-height: 46px !important;
    padding: 0 1rem !important;
    color: rgba(255,255,255,.88) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.tvk-service-tabs a.active {
    color: #111827 !important;
    background: #fff !important;
    border-color: #fff !important;
    box-shadow: 0 8px 20px rgba(0,0,0,.12) !important;
}

.tvk-service-tabs a:not(.active):nth-child(4),
.tvk-service-tabs a:not(.active):nth-child(6),
.tvk-service-tabs a:not(.active):nth-child(7) {
    background: transparent !important;
    border-color: transparent !important;
}

.tvk-service-tabs a i {
    font-size: 21px !important;
}

.tvk-search-form {
    margin-top: 22px !important;
}

.tvk-subtabs {
    gap: .75rem !important;
    margin-bottom: 14px !important;
}

.tvk-subtabs span {
    min-height: 34px !important;
    padding: 0 .92rem !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    background: rgba(5, 23, 40, .42) !important;
}

.tvk-subtabs span.active {
    background: #0b99ec !important;
}

.tvk-search-form label {
    margin-bottom: 9px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-shadow: 0 2px 7px rgba(0,0,0,.24);
}

.tvk-search-form .row {
    grid-template-columns: minmax(0, 31.6%) minmax(0, 32.2%) minmax(0, 31.4%) 5.1rem !important;
}

.tvk-input .form-control {
    min-height: 58px !important;
    padding-left: 3rem !important;
    color: #111827 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    background: rgba(255,255,255,.96) !important;
    border-color: rgba(4, 24, 44, .19) !important;
}

.tvk-input .form-control::placeholder {
    color: rgba(23, 37, 56, .28) !important;
}

.tvk-input i {
    left: 17px !important;
    font-size: 22px !important;
}

.tvk-search-form .row > div:first-child .form-control {
    border-radius: 20px 0 0 20px !important;
}

.tvk-search-btn {
    min-height: 58px !important;
    border-radius: 0 20px 20px 0 !important;
    font-size: 22px !important;
    background: #ff5e2c !important;
}

.tvk-home-account {
    display: inline-flex;
    align-items: center;
}

.tvk-home-account-toggle {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    text-decoration: none !important;
    text-shadow: 0 2px 8px rgba(0,0,0,.18);
}

.tvk-home-avatar {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: #1c9cf0;
    border: 3px solid #d88a2b;
    border-radius: 999px;
    font-size: .82rem;
    box-shadow: 0 4px 12px rgba(0,0,0,.16);
}

.tvk-home-account-toggle::after {
    margin-left: .35rem;
}

.tvk-home-account-menu {
    min-width: 240px;
    padding: .65rem;
    color: #10233f;
    background: #fff;
    border: 1px solid rgba(15, 45, 80, .08);
    border-radius: 16px;
    box-shadow: 0 18px 42px rgba(13, 38, 72, .22);
}

.tvk-home-account-menu strong {
    color: #172033;
}

.tvk-home-account-menu small {
    color: #64748b !important;
    font-weight: 700;
}

.tvk-home-account-menu .dropdown-divider {
    margin: .65rem 0;
    border-color: #d7e0ea;
}

.tvk-home-account-menu .dropdown-item {
    color: #152238;
    padding: .65rem 1rem;
    font-weight: 700;
    border-radius: 10px;
}

.tvk-home-account-menu .dropdown-item i {
    color: #0b8ee8;
}

.tvk-home-account-menu .dropdown-item:hover,
.tvk-home-account-menu .dropdown-item:focus {
    color: #023b73;
    background: #eaf6ff;
}

/* ===== Home image admin controls ===== */
.tvk-admin-image-manager {
    margin-bottom: 2rem;
    padding: 1.25rem;
    background: #fff;
    border: 1px solid #d7e7f7;
    border-radius: 22px;
    box-shadow: 0 18px 40px rgba(15, 66, 112, .08);
}

.tvk-admin-image-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 1rem;
    max-height: 620px;
    overflow: auto;
    padding-right: .25rem;
}

.tvk-admin-image-card {
    padding: .75rem;
    background: #f8fbff;
    border: 1px solid #dbeaf8;
    border-radius: 16px;
}

.tvk-admin-image-card label {
    display: block;
    margin: .65rem 0 .35rem;
    color: #46617d;
    font-size: .78rem;
    font-weight: 800;
}

.tvk-admin-image-card .form-control {
    margin-bottom: .4rem;
}

.tvk-admin-image-preview {
    min-height: 108px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    color: #6c829a;
    background: repeating-linear-gradient(45deg, #e2f6ff 0 14px, #f3fbff 14px 28px);
    border: 1px solid #d5e6f5;
    border-radius: 12px;
    overflow: hidden;
}

.tvk-admin-image-preview i {
    font-size: 1.6rem;
}

.has-home-image {
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

.tvk-promo-banner.has-home-image {
    color: #fff;
    background-blend-mode: overlay;
    background-color: rgba(0, 60, 120, .24);
}

.tvk-qr-placeholder.has-home-image,
.tvk-image-box.has-home-image,
.tvk-mini-image.has-home-image,
.tvk-phone-placeholder.has-home-image,
.tvk-admin-image-preview.has-home-image {
    background-position: center !important;
    background-size: cover !important;
}

.tvk-small-banner.has-home-image {
    color: #fff;
    background-color: rgba(0, 65, 120, .25) !important;
    background-blend-mode: overlay;
}

.tvk-image-box.has-home-image i,
.tvk-image-box.has-home-image span,
.tvk-mini-image.has-home-image i,
.tvk-phone-placeholder.has-home-image i,
.tvk-phone-placeholder.has-home-image span,
.tvk-qr-placeholder.has-home-image i,
.tvk-qr-placeholder.has-home-image span {
    display: none;
}

.tvk-service-tab-button,
.tvk-more-button {
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
}

.tvk-service-tabs .tvk-service-tab-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 999px;
    color: #26384d;
    white-space: nowrap;
}

.tvk-service-tabs .tvk-service-tab-button:hover,
.tvk-more-button:hover {
    background: #eef8ff;
    color: #0194f3;
}

.tvk-subtabs button {
    border: 0;
    border-radius: 999px;
    background: #f2f7fb;
    color: #516174;
    padding: 7px 14px;
    font-weight: 800;
}

.tvk-subtabs button.active {
    background: var(--tvk-blue);
    color: #fff;
}

.tvk-product-menu .dropdown {
    display: inline-flex;
}

.tvk-more-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    padding: 8px 12px;
    color: #fff;
}

.tvk-more-menu {
    min-width: 260px;
    border: 0;
    border-radius: 8px;
    box-shadow: 0 18px 50px rgba(15, 35, 60, .18);
    padding: 10px;
}

.tvk-more-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: 14px;
    border-radius: 8px;
    padding: 14px 16px;
    font-weight: 800;
}

.tvk-more-menu .dropdown-item i {
    width: 24px;
    color: #6b7785;
    text-align: center;
}

.tvk-products-modal .modal-content {
    border: 0;
    border-radius: 8px;
}

.tvk-products-modal .modal-title {
    font-size: 32px;
    font-weight: 900;
    color: #5e6872;
}

.tvk-other-products {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.tvk-other-products a {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 82px;
    padding: 18px;
    border: 1px solid #dce8f5;
    border-radius: 8px;
    color: #101d2d;
    text-decoration: none;
    font-size: 18px;
}

.tvk-other-products a:hover {
    border-color: #0194f3;
    background: #f3fbff;
}

.tvk-other-products i {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #f1f7fb;
    color: var(--page-accent, #0194f3);
}

.tvk-simple-page {
    --page-accent: #0194f3;
    min-height: 100vh;
    background: #fff;
    color: #213247;
    font-family: "Inter", "Be Vietnam Pro", sans-serif;
}

.tvk-simple-nav {
    height: 76px;
    border-bottom: 1px solid #e9eef5;
    background: #fff;
}

.tvk-simple-nav .container {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.tvk-simple-brand {
    font-size: 30px;
    font-weight: 900;
    color: #1a8fdc;
    text-decoration: none;
}

.tvk-simple-links {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}

.tvk-simple-links a,
.tvk-simple-auth a {
    color: #4a5a6c;
    text-decoration: none;
    font-weight: 700;
}

.tvk-simple-auth {
    display: flex;
    align-items: center;
    gap: 10px;
}

.tvk-simple-auth a {
    border-radius: 999px;
    padding: 10px 16px;
    background: #e9f6ff;
    color: #087fc8;
}

.tvk-simple-auth a:last-child {
    background: #0194f3;
    color: #fff;
}

.tvk-service-hero {
    background: linear-gradient(135deg, var(--page-accent), #0874c9);
    color: #fff;
}

.tvk-service-hero .container {
    min-height: 330px;
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(260px, .7fr);
    align-items: center;
    gap: 40px;
}

.tvk-service-copy span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 800;
    margin-bottom: 16px;
}

.tvk-service-copy h1,
.tvk-destination-title h1 {
    font-size: clamp(40px, 6vw, 72px);
    font-weight: 900;
    letter-spacing: 0;
    margin: 0;
}

.tvk-service-copy h2 {
    font-size: 26px;
    font-weight: 800;
    margin: 12px 0;
}

.tvk-service-copy p,
.tvk-destination-title p {
    max-width: 720px;
    font-size: 18px;
    line-height: 1.7;
    margin: 0;
}

.tvk-hero-illustration {
    min-height: 220px;
    display: grid;
    place-items: center;
}

.tvk-hero-illustration i {
    font-size: 150px;
    opacity: .28;
}

.tvk-service-search {
    position: relative;
    z-index: 2;
    margin-top: -46px;
    padding: 22px;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(12, 45, 80, .16);
}

.tvk-service-search h3 {
    font-size: 18px;
    font-weight: 900;
    margin-bottom: 14px;
}

.tvk-service-search label {
    font-size: 12px;
    font-weight: 800;
    color: #516174;
}

.tvk-feature-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.tvk-feature-card,
.tvk-reason-card {
    position: relative;
    min-height: 168px;
    border: 1px solid #dce8f5;
    border-radius: 8px;
    padding: 22px;
    background: #fff;
    color: #213247;
    text-decoration: none;
    box-shadow: 0 10px 28px rgba(15, 35, 60, .06);
}

.tvk-feature-card i,
.tvk-reason-card i {
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: color-mix(in srgb, var(--page-accent) 12%, white);
    color: var(--page-accent);
    font-size: 22px;
    margin-bottom: 18px;
}

.tvk-feature-card strong,
.tvk-reason-card h3 {
    display: block;
    font-size: 18px;
    font-weight: 900;
    margin-bottom: 8px;
}

.tvk-feature-card small,
.tvk-reason-card p {
    color: #6f7f91;
    line-height: 1.55;
}

.tvk-card-badge {
    position: absolute;
    top: 14px;
    right: 14px;
    border-radius: 999px;
    background: #ff5e1f;
    color: #fff;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 900;
}

.tvk-step-list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.tvk-step-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px;
    border: 1px solid #dce8f5;
    border-radius: 8px;
    background: #f9fcff;
}

.tvk-step-item span {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--page-accent);
    color: #fff;
    font-weight: 900;
}

.tvk-destination-hero {
    background: #f5f9fc;
}

.tvk-destination-hero .container {
    padding: 0 12px 42px;
}

.tvk-destination-mosaic {
    display: grid;
    grid-template-columns: 2fr 1fr;
    grid-template-rows: 160px 160px;
    gap: 6px;
    margin-bottom: 34px;
}

.tvk-destination-mosaic div {
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, var(--page-accent), #1e3a8a);
    color: rgba(255, 255, 255, .8);
    font-size: 72px;
}

.tvk-destination-mosaic div:first-child {
    grid-row: 1 / span 2;
}

.tvk-destination-title {
    max-width: 880px;
    margin: 0 auto;
}

.tvk-destination-title span {
    display: block;
    color: #178bd4;
    font-weight: 800;
    margin: 10px 0 14px;
}

.tvk-guide-search {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 260px;
    border: 1px solid #dce8f5;
    border-radius: 999px;
    padding: 10px 16px;
}

.tvk-guide-search input {
    border: 0;
    outline: 0;
    width: 100%;
}

.tvk-practical {
    background: #172831;
    color: #fff;
    padding: 54px 0;
}

.tvk-practical h2 {
    font-weight: 900;
}

.tvk-practical p {
    color: rgba(255, 255, 255, .72);
}

.tvk-tip-list {
    display: grid;
    gap: 12px;
    max-width: 880px;
}

.tvk-tip-list button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 0;
    border-radius: 6px;
    background: #fff;
    color: #172831;
    padding: 14px 18px;
    font-weight: 800;
}

.tvk-trip-actions {
    display: flex;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
}

.tvk-trip-actions a {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 35, 60, .08);
    padding: 16px 28px;
    color: #213247;
    text-decoration: none;
    font-weight: 900;
}

@media (max-width: 992px) {
    .tvk-simple-nav {
        height: auto;
        padding: 14px 0;
    }

    .tvk-simple-nav .container,
    .tvk-service-hero .container {
        grid-template-columns: 1fr;
        flex-direction: column;
        align-items: flex-start;
    }

    .tvk-feature-grid,
    .tvk-step-list,
    .tvk-other-products {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 576px) {
    .tvk-feature-grid,
    .tvk-step-list,
    .tvk-other-products {
        grid-template-columns: 1fr;
    }

    .tvk-service-hero .container {
        min-height: 420px;
    }
}

/* ===== OTA listing redesign: rooms, flights, tours ===== */
.ota-page {
    --ota-blue: #0194f3;
    --ota-orange: #ff5e1f;
    --ota-green: #10b981;
    --ota-ink: #1f3147;
    --ota-muted: #66788f;
    --ota-line: #dce8f5;
    --ota-soft: #f4f8fc;
    background: var(--ota-soft);
    color: var(--ota-ink);
    min-height: 100vh;
    padding-bottom: 56px;
}

.ota-hero {
    position: relative;
    overflow: hidden;
    color: #fff;
    background:
        linear-gradient(90deg, rgba(0, 54, 101, .88), rgba(0, 102, 181, .68)),
        url("https://images.unsplash.com/photo-1566073771259-6a8506099945?auto=format&fit=crop&w=1800&q=80") center / cover no-repeat;
}

.ota-hero-flights {
    background:
        linear-gradient(90deg, rgba(7, 47, 88, .88), rgba(1, 148, 243, .58)),
        url("https://images.unsplash.com/photo-1436491865332-7a61a109cc05?auto=format&fit=crop&w=1800&q=80") center / cover no-repeat;
}

.ota-hero-tours {
    background:
        linear-gradient(90deg, rgba(8, 75, 80, .88), rgba(16, 185, 129, .56)),
        url("https://images.unsplash.com/photo-1507525428034-b723cf961d3e?auto=format&fit=crop&w=1800&q=80") center / cover no-repeat;
}

.ota-hero .container {
    min-height: 360px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding-top: 56px;
    padding-bottom: 92px;
}

.ota-hero-copy {
    max-width: 860px;
}

.ota-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .14);
    color: #fff;
    font-weight: 900;
    padding: 9px 14px;
    margin-bottom: 18px;
}

.ota-hero h1 {
    max-width: 880px;
    font-size: clamp(38px, 5vw, 68px);
    line-height: 1.04;
    font-weight: 900;
    letter-spacing: 0;
    margin: 0;
}

.ota-hero p {
    max-width: 760px;
    margin: 18px 0 0;
    color: rgba(255, 255, 255, .86);
    font-size: 18px;
    line-height: 1.7;
}

.ota-hero-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.ota-hero-stats span {
    display: inline-flex;
    flex-direction: column;
    min-width: 138px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 8px;
    background: rgba(255, 255, 255, .12);
    padding: 12px 14px;
    color: rgba(255, 255, 255, .8);
    font-size: 13px;
}

.ota-hero-stats strong {
    color: #fff;
    font-size: 20px;
    font-weight: 900;
}

.ota-hero-action {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: max-content;
    border-radius: 999px;
    background: #fff;
    color: var(--ota-blue);
    text-decoration: none;
    font-weight: 900;
    padding: 14px 20px;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .2);
}

.ota-search-shell {
    position: relative;
    z-index: 2;
    margin-top: -58px;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(13, 43, 76, .16);
    padding: 22px;
}

.ota-search-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.ota-search-title strong {
    display: block;
    font-size: 20px;
    font-weight: 900;
}

.ota-search-title small {
    color: var(--ota-muted);
}

.ota-search-title button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 0;
    border-radius: 999px;
    background: var(--ota-orange);
    color: #fff;
    font-weight: 900;
    padding: 13px 22px;
}

.ota-search-grid {
    display: grid;
    gap: 14px;
}

.ota-search-grid.rooms {
    grid-template-columns: 1.2fr 1fr 1fr .7fr .95fr .95fr .8fr .8fr;
}

.ota-search-grid.flights {
    grid-template-columns: 1fr 1fr .9fr .7fr;
}

.ota-search-grid.tours {
    grid-template-columns: 1.4fr .9fr .7fr;
}

.ota-search-grid label {
    display: grid;
    gap: 7px;
    margin: 0;
}

.ota-search-grid span {
    color: #526278;
    font-size: 12px;
    font-weight: 900;
}

.ota-search-grid input,
.ota-search-grid select {
    min-height: 46px;
    border: 1px solid var(--ota-line);
    border-radius: 8px;
    background: #f9fcff;
    color: var(--ota-ink);
    padding: 10px 12px;
    font-weight: 700;
}

.ota-search-grid input:focus,
.ota-search-grid select:focus {
    outline: 3px solid rgba(1, 148, 243, .14);
    border-color: var(--ota-blue);
    background: #fff;
}

.ota-quick-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 18px 0 28px;
}

.ota-quick-filters a {
    border: 1px solid var(--ota-line);
    border-radius: 999px;
    background: #fff;
    color: #405268;
    text-decoration: none;
    font-weight: 800;
    padding: 9px 14px;
}

.ota-quick-filters a:hover {
    border-color: var(--ota-blue);
    color: var(--ota-blue);
}

.ota-content-grid {
    display: grid;
    grid-template-columns: 286px minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

.ota-side-panel,
.ota-admin-panel,
.ota-empty {
    border: 1px solid var(--ota-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 35, 60, .05);
}

.ota-side-panel {
    position: sticky;
    top: 94px;
    padding: 22px;
}

.ota-side-panel h2 {
    font-size: 18px;
    font-weight: 900;
    margin-bottom: 18px;
}

.ota-side-item {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 12px;
    align-items: start;
    padding: 14px 0;
    border-top: 1px solid #eef3f8;
}

.ota-side-item i {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #eef8ff;
    color: var(--ota-blue);
}

.ota-side-item span {
    color: var(--ota-muted);
    font-weight: 700;
    line-height: 1.5;
}

.ota-result-list {
    display: grid;
    gap: 16px;
}

.ota-section-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}

.ota-section-head.compact {
    margin-bottom: 4px;
}

.ota-section-head span {
    display: block;
    color: var(--ota-blue);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.ota-section-head h2 {
    margin: 3px 0 0;
    color: var(--ota-ink);
    font-size: 28px;
    font-weight: 900;
}

.ota-admin-panel {
    padding: 22px;
}

.ota-stay-card,
.ota-flight-card {
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr) 220px;
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--ota-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 35, 60, .05);
}

.ota-card-image {
    position: relative;
    min-height: 220px;
    overflow: hidden;
}

.ota-card-image img,
.ota-airline-mark img,
.ota-tour-image img,
.ota-tour-card.admin > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ota-card-image span,
.ota-tour-image span {
    position: absolute;
    top: 14px;
    left: 14px;
    border-radius: 999px;
    background: rgba(1, 34, 64, .78);
    color: #fff;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 900;
}

.ota-card-main {
    padding: 22px;
}

.ota-card-title {
    display: flex;
    justify-content: space-between;
    gap: 14px;
}

.ota-card-title h3,
.ota-tour-card h3 {
    color: var(--ota-ink);
    font-size: 22px;
    font-weight: 900;
    margin: 0 0 8px;
}

.ota-card-title p {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--ota-muted);
    margin: 0;
    font-weight: 700;
}

.ota-card-title p i {
    color: #ef4444;
}

.ota-rating {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: fit-content;
    border-radius: 999px;
    background: #fff7d6;
    color: #956104;
    padding: 7px 10px;
    font-weight: 900;
}

.ota-card-desc {
    color: var(--ota-muted);
    line-height: 1.65;
    margin: 14px 0;
}

.ota-card-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ota-card-tags span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border-radius: 999px;
    background: #f1f7fb;
    color: #43576e;
    padding: 7px 10px;
    font-size: 12px;
    font-weight: 900;
}

.ota-card-price {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    border-left: 1px solid var(--ota-line);
    padding: 22px;
    text-align: right;
}

.ota-card-price small {
    color: var(--ota-muted);
    font-weight: 800;
}

.ota-card-price strong {
    color: #ff5e1f;
    font-size: 25px;
    font-weight: 900;
}

.ota-old-price {
    color: #95a3b3 !important;
    text-decoration: line-through;
}

.ota-sale {
    align-self: flex-end;
    border-radius: 999px;
    background: #e9fbf4;
    color: #047857;
    padding: 5px 9px;
    font-size: 12px;
    font-weight: 900;
}

.ota-flight-card {
    grid-template-columns: 180px minmax(0, 1fr) 180px 220px;
    align-items: stretch;
}

.ota-airline-mark {
    display: grid;
    grid-template-rows: 1fr auto;
    min-height: 210px;
    overflow: hidden;
    background: #eef8ff;
}

.ota-airline-mark span {
    padding: 12px;
    font-weight: 900;
}

.ota-flight-route {
    display: grid;
    grid-template-columns: 1fr minmax(130px, .8fr) 1fr;
    align-items: center;
    gap: 16px;
    padding: 24px;
}

.ota-flight-route div:not(.ota-flight-line) {
    display: grid;
    gap: 6px;
}

.ota-flight-route strong {
    font-size: 30px;
    font-weight: 900;
}

.ota-flight-route span {
    color: var(--ota-muted);
    font-weight: 800;
}

.ota-flight-line {
    position: relative;
    display: grid;
    place-items: center;
    color: var(--ota-blue);
}

.ota-flight-line::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    border-top: 2px dashed #b8daf2;
}

.ota-flight-line span,
.ota-flight-line i {
    position: relative;
    background: #fff;
    padding: 3px 8px;
    z-index: 1;
    font-weight: 900;
}

.ota-flight-meta {
    display: grid;
    align-content: center;
    gap: 12px;
    border-left: 1px solid var(--ota-line);
    padding: 22px;
}

.ota-flight-meta span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--ota-muted);
    font-weight: 800;
}

.ota-empty {
    display: grid;
    place-items: center;
    gap: 8px;
    padding: 54px 20px;
    text-align: center;
}

.ota-empty i {
    color: var(--ota-blue);
    font-size: 42px;
}

.ota-empty strong {
    font-size: 22px;
    font-weight: 900;
}

.ota-empty span {
    color: var(--ota-muted);
}

.ota-tour-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.ota-tour-card {
    overflow: hidden;
    border: 1px solid var(--ota-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 35, 60, .05);
}

.ota-tour-card.admin {
    display: grid;
    grid-template-rows: 190px 1fr;
    height: 100%;
}

.ota-tour-card.admin > div {
    padding: 18px;
}

.ota-card-badge-soft {
    display: inline-flex;
    border-radius: 999px;
    background: #eef8ff;
    color: var(--ota-blue);
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 900;
    margin-bottom: 10px;
}

.ota-tour-card.admin p,
.ota-tour-card.admin small {
    color: var(--ota-muted);
    font-weight: 700;
}

.ota-tour-card.admin strong {
    display: block;
    color: #ff5e1f;
    font-size: 22px;
    font-weight: 900;
}

.ota-tour-image {
    position: relative;
    height: 220px;
    overflow: hidden;
}

.ota-tour-body {
    padding: 20px;
}

.ota-tour-timeline {
    display: grid;
    gap: 8px;
    margin: 16px 0;
    color: #4c5d72;
    font-weight: 800;
}

.ota-tour-timeline span {
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.ota-tour-timeline i {
    color: var(--ota-green);
}

.ota-tour-bottom {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 14px;
    border-top: 1px solid #eef3f8;
    padding-top: 16px;
}

.ota-tour-bottom .ota-card-price {
    border: 0;
    padding: 0;
    text-align: left;
}

.tours-head {
    margin-top: 8px;
}

@media (max-width: 1200px) {
    .ota-search-grid.rooms {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ota-flight-card {
        grid-template-columns: 160px minmax(0, 1fr) 210px;
    }

    .ota-flight-meta {
        grid-column: 2 / span 1;
        border-left: 0;
        border-top: 1px solid var(--ota-line);
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 992px) {
    .ota-hero .container,
    .ota-search-title,
    .ota-section-head,
    .ota-tour-bottom {
        align-items: flex-start;
        flex-direction: column;
    }

    .ota-search-title button {
        width: 100%;
    }

    .ota-search-grid.rooms,
    .ota-search-grid.flights,
    .ota-search-grid.tours,
    .ota-content-grid,
    .ota-tour-grid {
        grid-template-columns: 1fr;
    }

    .ota-side-panel {
        position: static;
    }

    .ota-stay-card,
    .ota-flight-card {
        grid-template-columns: 1fr;
    }

    .ota-card-image,
    .ota-airline-mark {
        min-height: 230px;
    }

    .ota-card-price,
    .ota-flight-meta {
        border-left: 0;
        border-top: 1px solid var(--ota-line);
        text-align: left;
    }

    .ota-sale {
        align-self: flex-start;
    }
}

@media (max-width: 576px) {
    .ota-hero .container {
        min-height: 430px;
        padding-bottom: 86px;
    }

    .ota-hero-stats {
        display: grid;
        grid-template-columns: 1fr;
    }

    .ota-search-shell,
    .ota-admin-panel {
        padding: 16px;
    }

    .ota-flight-route {
        grid-template-columns: 1fr;
    }

    .ota-flight-line {
        justify-items: start;
    }

    .ota-flight-line::before {
        display: none;
    }
}

/* ===== GenZ-like global shell for non-home pages ===== */
.GenZ-app-shell {
    background: #f5f8fb;
    font-family: "Inter", "Be Vietnam Pro", sans-serif;
}

.tvk-app-header {
    z-index: 1030;
    box-shadow: 0 8px 24px rgba(15, 35, 60, .08);
}

.tvk-utility-bar {
    background: #fff;
    border-bottom: 1px solid #edf2f7;
    font-size: 13px;
}

.tvk-utility-bar .container,
.tvk-utility-left,
.tvk-utility-right {
    display: flex;
    align-items: center;
    gap: 16px;
}

.tvk-utility-bar .container {
    justify-content: space-between;
    min-height: 38px;
}

.tvk-utility-bar a,
.tvk-utility-bar span {
    color: #475569;
    text-decoration: none;
    font-weight: 700;
}

.tvk-utility-bar a:hover {
    color: #0194f3;
}

.tvk-flag-mini {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 18px;
    border-radius: 4px;
    background: #ef4444;
    color: #fff !important;
    font-size: 11px;
    font-weight: 900;
}

.tvk-main-nav {
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid #e7eef7;
    min-height: 64px;
}

.tvk-brand {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #1688d8;
    text-decoration: none;
    font-size: 30px;
    font-weight: 900;
    letter-spacing: 0;
    margin-right: 24px;
}

.tvk-brand span {
    width: 18px;
    height: 18px;
    display: inline-block;
    border-radius: 4px 14px 14px 14px;
    background: #1688d8;
    transform: rotate(-25deg);
}

.tvk-product-nav {
    align-items: center;
    gap: 4px;
}

.tvk-product-nav .nav-link,
.tvk-account-nav .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 8px;
    color: #405268;
    font-size: 14px;
    font-weight: 800;
    padding: 10px 12px !important;
}

.tvk-product-nav .nav-link:hover,
.tvk-product-nav .nav-link:focus,
.tvk-account-nav .nav-link:hover,
.tvk-account-nav .nav-link:focus {
    background: #eef8ff;
    color: #0194f3;
}

.tvk-nav-menu {
    min-width: 260px;
    border: 0;
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(15, 35, 60, .18);
    padding: 10px;
}

.tvk-nav-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 8px;
    color: #334155;
    font-weight: 800;
    padding: 12px 14px;
}

.tvk-nav-menu .dropdown-item i {
    width: 22px;
    color: #0194f3;
    text-align: center;
}

.tvk-nav-menu .dropdown-item:hover {
    background: #eef8ff;
    color: #0194f3;
}

.tvk-other-nav {
    min-width: 310px;
}

.tvk-login-link,
.tvk-register-link,
.tvk-user-pill,
.tvk-manage-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 999px;
    text-decoration: none;
    font-weight: 900;
    padding: 10px 16px;
}

.tvk-login-link {
    background: #e9f6ff;
    color: #087fc8;
}

.tvk-register-link {
    background: #0194f3;
    color: #fff;
}

.tvk-user-pill {
    color: #087fc8;
    background: #e9f6ff;
}

.tvk-user-pill span {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #0194f3;
    color: #fff;
}

.tvk-manage-pill {
    background: #fff7ed !important;
    color: #c2410c !important;
}

.tvk-account-dropdown {
    border: 0;
    border-radius: 8px;
    box-shadow: 0 20px 60px rgba(15, 35, 60, .18);
}

.tvk-main-content {
    min-height: 55vh;
}

.tvk-global-footer {
    background: #082f63;
    color: #fff;
}

.tvk-footer-newsletter {
    background: #0ea5e9;
    color: #fff;
}

.tvk-footer-newsletter .container {
    min-height: 92px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.tvk-footer-newsletter strong {
    display: block;
    font-size: 20px;
    font-weight: 900;
}

.tvk-footer-newsletter span {
    color: rgba(255, 255, 255, .86);
}

.tvk-footer-newsletter form {
    display: flex;
    gap: 10px;
    min-width: min(440px, 100%);
}

.tvk-footer-newsletter input {
    flex: 1;
    border: 0;
    border-radius: 8px;
    padding: 13px 14px;
}

.tvk-footer-newsletter button {
    border: 0;
    border-radius: 8px;
    background: #ff5e1f;
    color: #fff;
    font-weight: 900;
    padding: 13px 18px;
}

.tvk-footer-brand {
    color: #fff;
    font-size: 34px;
    font-weight: 900;
}

.tvk-global-footer h6 {
    color: #fff;
    font-weight: 900;
    margin-bottom: 16px;
}

.tvk-global-footer a {
    display: block;
    color: rgba(255, 255, 255, .76);
    text-decoration: none;
    font-weight: 700;
    margin-bottom: 10px;
}

.tvk-global-footer a:hover {
    color: #fff;
}

.tvk-partner-btn {
    display: inline-flex !important;
    width: fit-content;
    border-radius: 999px;
    background: #0194f3;
    color: #fff !important;
    padding: 11px 16px;
    font-weight: 900 !important;
}

.tvk-footer-payments {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    max-width: 280px;
}

.tvk-footer-payments span {
    display: grid;
    place-items: center;
    min-height: 34px;
    border-radius: 6px;
    background: #fff;
    color: #0f315f;
    font-size: 12px;
    font-weight: 900;
}

.tvk-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, .12);
    color: rgba(255, 255, 255, .72);
    padding: 18px 0;
    text-align: center;
    font-size: 13px;
}

/* ===== OTA detail pages ===== */
.ota-detail-page {
    background: #f5f8fb;
    color: #1f3147;
}

.ota-detail-gallery {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(220px, .7fr);
    grid-template-rows: 190px 190px;
    gap: 8px;
    margin-bottom: 26px;
}

.ota-detail-main-photo {
    position: relative;
    grid-row: 1 / span 2;
    overflow: hidden;
    border-radius: 8px 0 0 8px;
}

.ota-detail-main-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ota-detail-main-photo span {
    position: absolute;
    left: 18px;
    bottom: 18px;
    border-radius: 999px;
    background: rgba(0, 31, 63, .8);
    color: #fff;
    padding: 8px 12px;
    font-weight: 900;
}

.ota-detail-photo-tile {
    display: grid;
    place-items: center;
    align-content: center;
    gap: 10px;
    background: linear-gradient(135deg, #dff4ff, #fff);
    border: 1px solid #dce8f5;
    color: #087fc8;
    font-weight: 900;
}

.ota-detail-photo-tile i {
    font-size: 42px;
}

.ota-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 24px;
    align-items: start;
}

.ota-detail-main,
.ota-booking-box,
.ota-flight-detail-hero,
.ota-tour-detail-hero {
    border: 1px solid #dce8f5;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 35, 60, .05);
}

.ota-detail-main {
    padding: 26px;
}

.ota-detail-heading {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    border-bottom: 1px solid #eef3f8;
    padding-bottom: 22px;
    margin-bottom: 22px;
}

.ota-eyebrow-light {
    display: inline-flex;
    color: #0194f3;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.ota-detail-heading h1,
.ota-flight-detail-hero h1,
.ota-tour-detail-hero h1 {
    color: #1f3147;
    font-size: clamp(32px, 4vw, 50px);
    font-weight: 900;
    letter-spacing: 0;
    margin: 0;
}

.ota-detail-heading p {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #66788f;
    margin: 10px 0 0;
    font-weight: 800;
}

.ota-detail-heading p i {
    color: #ef4444;
}

.ota-detail-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 22px;
}

.ota-detail-facts span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 999px;
    background: #f1f7fb;
    color: #43576e;
    padding: 9px 12px;
    font-weight: 900;
}

.ota-detail-facts i {
    color: #0194f3;
}

.ota-detail-section {
    border-top: 1px solid #eef3f8;
    padding-top: 24px;
    margin-top: 24px;
}

.ota-detail-section:first-of-type {
    border-top: 0;
    padding-top: 0;
    margin-top: 0;
}

.ota-detail-section h2 {
    font-size: 24px;
    font-weight: 900;
    margin-bottom: 14px;
}

.ota-detail-section p {
    color: #66788f;
    line-height: 1.75;
}

.ota-amenity-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.ota-amenity-grid span {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #dce8f5;
    border-radius: 8px;
    background: #f9fcff;
    padding: 14px;
    font-weight: 800;
}

.ota-amenity-grid i {
    color: #10b981;
}

.ota-booking-box {
    position: sticky;
    top: 116px;
    padding: 22px;
}

.ota-booking-price {
    display: grid;
    gap: 7px;
    margin-bottom: 18px;
}

.ota-booking-price small,
.ota-booking-price span {
    color: #66788f;
    font-weight: 800;
}

.ota-booking-price strong {
    color: #ff5e1f;
    font-size: 30px;
    font-weight: 900;
}

.ota-booking-note {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 12px;
    align-items: center;
    border-radius: 8px;
    background: #eef8ff;
    color: #405268;
    padding: 14px;
    margin-bottom: 18px;
    font-weight: 800;
}

.ota-booking-note i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #0194f3;
    color: #fff;
}

.ota-review-list {
    display: grid;
    gap: 14px;
}

.ota-review-card {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    border: 1px solid #dce8f5;
    border-radius: 8px;
    padding: 16px;
}

.ota-review-card strong,
.ota-review-card small {
    display: block;
}

.ota-review-card small {
    color: #66788f;
}

.ota-review-card > span {
    color: #f59e0b;
    font-weight: 900;
}

.ota-review-card p {
    grid-column: 1 / -1;
    margin: 0;
}

.ota-empty.compact {
    display: block;
    padding: 18px;
    text-align: left;
    color: #66788f;
}

.ota-review-form {
    display: grid;
    gap: 14px;
}

.ota-review-form label {
    display: grid;
    gap: 8px;
    font-weight: 900;
}

.ota-flight-detail-hero,
.ota-tour-detail-hero {
    display: grid;
    grid-template-columns: 340px minmax(0, 1fr);
    overflow: hidden;
    margin-bottom: 24px;
}

.ota-flight-detail-hero img,
.ota-tour-detail-hero img {
    width: 100%;
    height: 260px;
    object-fit: cover;
}

.ota-flight-detail-hero > div,
.ota-tour-detail-hero > div {
    display: grid;
    align-content: center;
    padding: 26px;
}

.ota-flight-detail-hero p,
.ota-tour-detail-hero p {
    color: #66788f;
    font-weight: 800;
    line-height: 1.65;
    margin: 12px 0 0;
}

.ota-flight-route.detail {
    border: 1px solid #dce8f5;
    border-radius: 8px;
    background: #f9fcff;
}

.ota-flight-route small {
    color: #66788f;
    font-weight: 800;
}

.ota-itinerary {
    display: grid;
    gap: 12px;
}

.ota-itinerary div {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 8px 14px;
    border: 1px solid #dce8f5;
    border-radius: 8px;
    padding: 16px;
}

.ota-itinerary span {
    grid-row: 1 / span 2;
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #0194f3;
    color: #fff;
    font-weight: 900;
}

.ota-itinerary strong {
    font-weight: 900;
}

.ota-itinerary p {
    margin: 0;
}

@media (max-width: 1200px) {
    .tvk-utility-bar .container,
    .tvk-utility-left,
    .tvk-utility-right {
        flex-wrap: wrap;
    }
}

@media (max-width: 992px) {
    .tvk-utility-bar {
        display: none;
    }

    .tvk-product-nav,
    .tvk-account-nav {
        align-items: stretch;
        gap: 6px;
        padding-top: 12px;
    }

    .tvk-login-link,
    .tvk-register-link,
    .tvk-user-pill,
    .tvk-manage-pill {
        justify-content: center;
        width: 100%;
    }

    .tvk-footer-newsletter .container,
    .tvk-footer-newsletter form,
    .ota-detail-heading {
        flex-direction: column;
        align-items: flex-start;
    }

    .ota-detail-gallery,
    .ota-detail-layout,
    .ota-flight-detail-hero,
    .ota-tour-detail-hero {
        grid-template-columns: 1fr;
    }

    .ota-detail-main-photo {
        grid-row: auto;
        border-radius: 8px 8px 0 0;
        min-height: 280px;
    }

    .ota-detail-photo-tile {
        min-height: 130px;
    }

    .ota-booking-box {
        position: static;
    }

    .ota-amenity-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 576px) {
    .tvk-brand {
        font-size: 26px;
    }

    .tvk-footer-newsletter form {
        display: grid;
    }

    .ota-detail-main,
    .ota-booking-box {
        padding: 18px;
    }
}

/* ===== GenZ-like checkout, auth, bookings, invoices ===== */
.tvk-checkout-page,
.tvk-management-page,
.tvk-invoice-page {
    background: #f5f8fb;
    color: #1f3147;
    font-family: "Inter", "Be Vietnam Pro", Arial, sans-serif;
}

.tvk-checkout-hero {
    min-height: 285px;
    display: flex;
    align-items: center;
    color: #fff;
    background:
        linear-gradient(90deg, rgba(8, 91, 155, .94), rgba(0, 148, 243, .82)),
        url("https://images.unsplash.com/photo-1507525428034-b723cf961d3e?w=1800&q=80") center/cover;
}

.tvk-hotel-checkout {
    background:
        linear-gradient(90deg, rgba(6, 74, 136, .94), rgba(0, 148, 243, .78)),
        url("https://images.unsplash.com/photo-1566073771259-6a8506099945?w=1800&q=80") center/cover;
}

.tvk-flight-checkout {
    background:
        linear-gradient(90deg, rgba(7, 85, 158, .94), rgba(0, 148, 243, .78)),
        url("https://images.unsplash.com/photo-1436491865332-7a61a109cc05?w=1800&q=80") center/cover;
}

.tvk-tour-checkout {
    background:
        linear-gradient(90deg, rgba(10, 100, 120, .94), rgba(0, 148, 243, .72)),
        url("https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?w=1800&q=80") center/cover;
}

.tvk-checkout-hero h1 {
    max-width: 760px;
    margin: 10px 0 8px;
    font-size: clamp(34px, 5vw, 56px);
    font-weight: 900;
    letter-spacing: 0;
}

.tvk-checkout-hero p {
    max-width: 640px;
    color: rgba(255, 255, 255, .88);
    font-size: 17px;
    font-weight: 700;
}

.tvk-back-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    text-decoration: none;
    font-weight: 900;
}

.tvk-checkout-stack {
    margin-top: -54px;
    padding-bottom: 56px;
}

.tvk-checkout-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 24px;
    align-items: start;
}

.tvk-checkout-main {
    display: grid;
    gap: 18px;
}

.tvk-step-card,
.tvk-flight-summary-card,
.tvk-price-panel,
.tvk-trip-card,
.tvk-booking-card,
.tvk-invoice-shell,
.tvk-auth-card {
    border: 1px solid #dce8f5;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 35, 60, .06);
}

.tvk-step-card {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 18px;
    padding: 22px;
}

.tvk-step-number {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #e9f6ff;
    color: #0194f3;
    font-weight: 900;
}

.tvk-section-title span,
.tvk-page-heading span,
.tvk-auth-heading span {
    display: block;
    color: #0194f3;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.tvk-section-title h2,
.tvk-page-heading h1,
.tvk-auth-heading h2 {
    margin: 0 0 14px;
    color: #1f3147;
    font-weight: 900;
    letter-spacing: 0;
}

.tvk-field-label,
.tvk-auth-form label span,
.tvk-seat-toolbar label span {
    display: block;
    margin-bottom: 7px;
    color: #405268;
    font-size: 13px;
    font-weight: 900;
}

.tvk-input {
    min-height: 46px;
    border: 1px solid #d7e3f0;
    border-radius: 8px;
    background: #fff;
    color: #1f3147;
    font-weight: 700;
    box-shadow: none;
}

.tvk-input:focus {
    border-color: #0194f3;
    box-shadow: 0 0 0 3px rgba(1, 148, 243, .14);
}

.tvk-checkout-sidebar {
    position: sticky;
    top: 118px;
    display: grid;
    gap: 16px;
}

.tvk-trip-card {
    overflow: hidden;
}

.tvk-trip-card img {
    width: 100%;
    height: 190px;
    object-fit: cover;
}

.tvk-trip-card-body {
    padding: 18px;
}

.tvk-trip-card h2 {
    margin: 10px 0;
    color: #1f3147;
    font-size: 22px;
    font-weight: 900;
}

.tvk-trip-card p {
    display: flex;
    gap: 8px;
    color: #66788f;
    font-weight: 800;
    margin: 8px 0 0;
}

.tvk-soft-pill,
.tvk-success-pill {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border-radius: 999px;
    padding: 7px 11px;
    font-size: 12px;
    font-weight: 900;
}

.tvk-soft-pill {
    background: #e9f6ff;
    color: #087fc8;
}

.tvk-success-pill {
    background: #e9fbf4;
    color: #047857;
}

.tvk-price-panel {
    padding: 20px;
}

.tvk-price-panel h3 {
    color: #1f3147;
    font-size: 20px;
    font-weight: 900;
    margin-bottom: 14px;
}

.tvk-price-row,
.tvk-grand-total {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid #edf3f8;
    padding: 11px 0;
}

.tvk-price-row span,
.tvk-price-row small {
    color: #66788f;
    font-weight: 800;
}

.tvk-price-row strong {
    color: #1f3147;
    font-weight: 900;
    text-align: right;
}

.tvk-discount strong {
    color: #059669;
}

.tvk-grand-total {
    align-items: flex-end;
    border-bottom: 0;
    margin: 8px 0 14px;
}

.tvk-grand-total span {
    color: #1f3147;
    font-weight: 900;
}

.tvk-grand-total strong {
    color: #ff5e1f;
    font-size: 28px;
    font-weight: 900;
    text-align: right;
}

.tvk-primary-btn,
.tvk-outline-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    border-radius: 8px;
    font-weight: 900;
}

.tvk-primary-btn {
    border: 0;
    background: #ff5e1f;
    color: #fff;
    box-shadow: 0 12px 22px rgba(255, 94, 31, .22);
}

.tvk-primary-btn:hover {
    background: #f45112;
    color: #fff;
}

.tvk-outline-btn {
    border: 1px solid #bfe5ff;
    background: #fff;
    color: #087fc8;
}

.tvk-outline-btn:hover {
    background: #eef8ff;
    color: #0194f3;
}

.tvk-secure-note {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 12px;
    color: #66788f;
    font-weight: 800;
}

.tvk-flight-summary-card {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr) auto auto;
    gap: 18px;
    align-items: center;
    padding: 18px;
}

.tvk-airline-avatar {
    width: 64px;
    height: 64px;
    overflow: hidden;
    border-radius: 8px;
    background: #eef8ff;
}

.tvk-airline-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tvk-flight-summary-card span {
    color: #66788f;
    font-size: 13px;
    font-weight: 900;
}

.tvk-flight-summary-card h2 {
    margin: 4px 0 0;
    color: #1f3147;
    font-size: 24px;
    font-weight: 900;
}

.tvk-flight-summary-card h2 i {
    color: #0194f3;
    font-size: 18px;
}

.tvk-flight-timepair {
    display: grid;
    text-align: right;
}

.tvk-flight-timepair strong {
    color: #1f3147;
    font-size: 24px;
    font-weight: 900;
}

.tvk-flight-timepair small {
    color: #66788f;
    font-weight: 800;
}

.tvk-seat-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.tvk-seat-toolbar label {
    min-width: 240px;
}

.tvk-aircraft {
    border-radius: 18px 18px 8px 8px;
    background: linear-gradient(#f7fbff, #fff);
    border: 1px solid #dce8f5;
    padding: 18px;
}

.tvk-management-page,
.tvk-invoice-page {
    padding: 42px 0 64px;
}

.tvk-page-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 24px;
}

.tvk-page-heading p {
    color: #66788f;
    font-weight: 800;
    margin: 0;
}

.tvk-booking-grid {
    display: grid;
    gap: 16px;
}

.tvk-booking-card {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr) 220px;
    gap: 18px;
    align-items: center;
    padding: 18px;
}

.tvk-booking-icon {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #e9f6ff;
    color: #0194f3;
    font-size: 20px;
}

.tvk-booking-topline {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.tvk-booking-topline span,
.tvk-booking-topline strong {
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 12px;
    font-weight: 900;
}

.tvk-booking-topline span {
    background: #f1f7fb;
    color: #405268;
}

.tvk-booking-topline strong {
    background: #e9fbf4;
    color: #047857;
}

.tvk-booking-body h2 {
    margin: 8px 0 5px;
    color: #1f3147;
    font-size: 22px;
    font-weight: 900;
}

.tvk-booking-body p {
    color: #66788f;
    font-weight: 800;
    margin-bottom: 10px;
}

.tvk-booking-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tvk-booking-meta span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border-radius: 999px;
    background: #f7fafc;
    color: #405268;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 900;
}

.tvk-booking-price {
    display: grid;
    gap: 8px;
    text-align: right;
}

.tvk-booking-price small {
    color: #66788f;
    font-weight: 800;
}

.tvk-booking-price strong {
    color: #ff5e1f;
    font-size: 24px;
    font-weight: 900;
}

.tvk-empty-state {
    display: grid;
    place-items: center;
    gap: 8px;
    border: 1px dashed #c9d9e8;
    border-radius: 8px;
    background: #fff;
    padding: 54px 20px;
    text-align: center;
}

.tvk-empty-state i {
    color: #0194f3;
    font-size: 42px;
}

.tvk-empty-state strong {
    color: #1f3147;
    font-size: 22px;
    font-weight: 900;
}

.tvk-empty-state span {
    color: #66788f;
    font-weight: 800;
}

.tvk-invoice-shell {
    max-width: 980px;
    margin: 0 auto;
    padding: 28px;
}

.tvk-invoice-header,
.tvk-invoice-columns,
.tvk-invoice-total {
    display: grid;
    gap: 18px;
}

.tvk-invoice-header {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    border-bottom: 1px solid #edf3f8;
    padding-bottom: 22px;
}

.tvk-invoice-header h1 {
    margin: 12px 0 4px;
    font-weight: 900;
}

.tvk-invoice-header p,
.tvk-invoice-date span {
    color: #66788f;
    font-weight: 800;
}

.tvk-invoice-date {
    text-align: right;
}

.tvk-invoice-route {
    display: grid;
    grid-template-columns: 1fr minmax(180px, .7fr) 1fr;
    gap: 20px;
    align-items: center;
    border: 1px solid #dce8f5;
    border-radius: 8px;
    background: #f9fcff;
    padding: 20px;
    margin: 24px 0;
}

.tvk-invoice-route > div:not(.tvk-invoice-route-line) {
    display: grid;
    gap: 4px;
}

.tvk-invoice-route > div:last-child {
    text-align: right;
}

.tvk-invoice-route span,
.tvk-invoice-route small {
    color: #66788f;
    font-weight: 800;
}

.tvk-invoice-route strong {
    color: #1f3147;
    font-size: 28px;
    font-weight: 900;
}

.tvk-invoice-route-line {
    position: relative;
    display: grid;
    place-items: center;
    color: #0194f3;
    font-weight: 900;
}

.tvk-invoice-route-line::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    border-top: 2px dashed #b8daf2;
}

.tvk-invoice-route-line span,
.tvk-invoice-route-line i {
    position: relative;
    z-index: 1;
    background: #f9fcff;
    padding: 3px 8px;
}

.tvk-invoice-columns {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tvk-invoice-columns h2 {
    color: #1f3147;
    font-size: 20px;
    font-weight: 900;
}

.tvk-info-list {
    display: grid;
    border: 1px solid #dce8f5;
    border-radius: 8px;
    overflow: hidden;
}

.tvk-info-list div {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    padding: 13px 14px;
    border-bottom: 1px solid #edf3f8;
}

.tvk-info-list div:last-child {
    border-bottom: 0;
}

.tvk-info-list span {
    color: #66788f;
    font-weight: 800;
}

.tvk-info-list strong {
    color: #1f3147;
    font-weight: 900;
    text-align: right;
}

.tvk-invoice-total {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-radius: 8px;
    background: #082f63;
    color: #fff;
    padding: 18px;
    margin-top: 24px;
}

.tvk-invoice-total div {
    display: grid;
    gap: 4px;
}

.tvk-invoice-total span {
    color: rgba(255, 255, 255, .72);
    font-weight: 800;
}

.tvk-invoice-total strong {
    font-size: 22px;
    font-weight: 900;
}

.tvk-invoice-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 22px;
}

.tvk-auth-body {
    min-height: 100vh;
    margin: 0;
    background: #f5f8fb;
    color: #1f3147;
    font-family: "Inter", "Be Vietnam Pro", Arial, sans-serif;
}

.tvk-auth-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(340px, .9fr) minmax(360px, 480px);
}

.tvk-auth-shell-wide {
    grid-template-columns: minmax(340px, .8fr) minmax(520px, 720px);
}

.tvk-auth-visual {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 42px;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(4, 82, 148, .96), rgba(0, 148, 243, .72)),
        url("https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?w=1600&q=80") center/cover;
}

.tvk-auth-brand {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    color: #fff;
    text-decoration: none;
    font-size: 34px;
    font-weight: 900;
}

.tvk-auth-brand span {
    width: 18px;
    height: 18px;
    border-radius: 4px 14px 14px 14px;
    background: #fff;
    transform: rotate(-25deg);
}

.tvk-auth-visual h1 {
    max-width: 560px;
    margin: 16px 0 12px;
    font-size: clamp(34px, 5vw, 58px);
    font-weight: 900;
}

.tvk-auth-visual p {
    max-width: 520px;
    color: rgba(255, 255, 255, .84);
    font-size: 17px;
    font-weight: 700;
}

.tvk-auth-card {
    align-self: center;
    width: min(100% - 40px, 520px);
    margin: 40px auto;
    padding: 30px;
}

.tvk-register-card {
    width: min(100% - 40px, 680px);
}

.tvk-auth-heading p {
    color: #66788f;
    font-weight: 800;
}

.tvk-auth-form {
    display: grid;
    gap: 15px;
}

.tvk-auth-form label {
    display: grid;
}

.tvk-auth-options {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: #66788f;
    font-size: 13px;
    font-weight: 800;
}

.tvk-auth-options a,
.tvk-auth-switch a {
    color: #0194f3;
    font-weight: 900;
    text-decoration: none;
}

.tvk-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #8ba0b6;
    font-size: 13px;
    font-weight: 900;
}

.tvk-divider::before,
.tvk-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: #edf3f8;
}

.tvk-auth-social {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.tvk-auth-social .btn {
    border: 1px solid #d7e3f0;
    border-radius: 8px;
    background: #fff;
    color: #405268;
    font-weight: 900;
}

.tvk-auth-switch {
    margin: 0;
    color: #66788f;
    text-align: center;
    font-weight: 800;
}

.tvk-demo-box {
    display: grid;
    gap: 4px;
    border-radius: 8px;
    background: #f7fafc;
    border: 1px solid #dce8f5;
    padding: 14px;
    margin-top: 18px;
    color: #405268;
    font-size: 13px;
    font-weight: 800;
}

.tvk-demo-box strong {
    color: #1f3147;
}

.tvk-form-group-title {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #1f3147;
    font-weight: 900;
}

.tvk-form-group-title i {
    color: #0194f3;
}

.tvk-role-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.tvk-role-grid input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.tvk-role-grid label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #d7e3f0;
    border-radius: 8px;
    background: #fff;
    color: #405268;
    min-height: 46px;
    font-weight: 900;
    cursor: pointer;
}

.tvk-role-grid input:checked + label {
    border-color: #0194f3;
    background: #e9f6ff;
    color: #087fc8;
}

@media print {
    .tvk-app-header,
    .tvk-global-footer,
    .no-print {
        display: none !important;
    }

    .tvk-invoice-page {
        padding: 0;
        background: #fff;
    }

    .tvk-invoice-shell {
        box-shadow: none;
        border: 0;
    }
}

@media (max-width: 992px) {
    .tvk-checkout-layout,
    .tvk-auth-shell,
    .tvk-auth-shell-wide,
    .tvk-invoice-columns,
    .tvk-invoice-total {
        grid-template-columns: 1fr;
    }

    .tvk-checkout-sidebar {
        position: static;
    }

    .tvk-auth-visual {
        min-height: 360px;
    }

    .tvk-flight-summary-card,
    .tvk-booking-card,
    .tvk-invoice-header,
    .tvk-invoice-route {
        grid-template-columns: 1fr;
        text-align: left;
    }

    .tvk-flight-timepair,
    .tvk-invoice-date,
    .tvk-invoice-route > div:last-child,
    .tvk-booking-price {
        text-align: left;
    }

    .tvk-seat-toolbar,
    .tvk-page-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .tvk-seat-toolbar label {
        min-width: 0;
    }

    .tvk-invoice-route-line {
        justify-items: start;
    }

    .tvk-invoice-route-line::before {
        display: none;
    }
}

@media (max-width: 576px) {
    .tvk-checkout-hero {
        min-height: 330px;
    }

    .tvk-step-card {
        grid-template-columns: 1fr;
        padding: 18px;
    }

    .tvk-auth-card {
        width: calc(100% - 24px);
        padding: 22px;
    }

    .tvk-auth-visual {
        padding: 28px 22px;
    }

    .tvk-auth-social,
    .tvk-role-grid {
        grid-template-columns: 1fr;
    }
}

/* ===== GenZ source-token refinement from provided css&Html.txt ===== */
:root {
    --tvk-blue: #0194f3;
    --tvk-blue-deep: #0071ce;
    --tvk-blue-bright: #0a9af2;
    --tvk-blue-soft: #f5fbff;
    --tvk-blue-tint: #d1f0ff;
    --tvk-orange: #fd5d1c;
    --tvk-green: #029d24;
    --tvk-ink: #242628;
    --tvk-ink-2: #4f5254;
    --tvk-muted: #707577;
    --tvk-muted-2: #a2a6a8;
    --tvk-line: #f0f1f2;
    --tvk-line-strong: #c1c4c6;
    --tvk-page: #f7f9fa;
    --tvk-white: #fff;
    --tvk-radius-xs: 4px;
    --tvk-radius-sm: 8px;
    --tvk-radius: 10px;
    --tvk-pill: 999px;
    --tvk-shadow-menu: 0 4px 10px rgba(3, 18, 26, .15);
    --tvk-shadow-card: 0 1px 4px rgba(3, 18, 26, .12);
    --tvk-shadow-lift: 0 8px 24px rgba(3, 18, 26, .14);
    --tvk-font: "Inter", "Be Vietnam Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

html,
body,
.GenZ-app-shell,
.tvk-auth-body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: var(--tvk-font);
    color: var(--tvk-ink);
}

body.GenZ-app-shell,
.tvk-checkout-page,
.tvk-management-page,
.tvk-invoice-page,
.ota-page {
    background: var(--tvk-page);
}

.GenZ-app-shell *,
.tvk-auth-body * {
    font-variant-ligatures: none;
}

.tvk-app-header {
    box-shadow: var(--tvk-shadow-menu);
}

.tvk-top-brand {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--tvk-blue);
    text-decoration: none;
    font-size: 22px;
    font-weight: 900;
    margin-right: 22px;
}

.tvk-top-brand span {
    width: 14px;
    height: 14px;
    display: inline-block;
    border-radius: 3px 12px 12px 12px;
    background: var(--tvk-blue);
    transform: rotate(-25deg);
}

.tvk-utility-bar {
    border-bottom-color: var(--tvk-line);
    color: var(--tvk-muted);
}

.tvk-utility-bar .container {
    min-height: 64px;
}

.tvk-main-nav {
    min-height: 64px;
    border-bottom-color: var(--tvk-line);
    background: rgba(255, 255, 255, .98);
}

.tvk-main-nav .tvk-brand {
    display: none;
}

.tvk-brand,
.tvk-product-nav .nav-link:hover,
.tvk-product-nav .nav-link:focus,
.tvk-account-nav .nav-link:hover,
.tvk-account-nav .nav-link:focus,
.tvk-nav-menu .dropdown-item:hover,
.tvk-auth-options a,
.tvk-auth-switch a,
.tvk-outline-btn,
.tvk-section-title span,
.tvk-page-heading span,
.tvk-auth-heading span,
.ota-eyebrow,
.ota-section-head span,
.ota-card-title p i,
.ota-detail-facts i {
    color: var(--tvk-blue);
}

.tvk-brand span,
.tvk-user-pill span,
.tvk-step-number,
.tvk-booking-icon,
.ota-booking-note i,
.ota-itinerary span {
    background: var(--tvk-blue);
}

.tvk-product-nav .nav-link,
.tvk-account-nav .nav-link,
.tvk-utility-bar a,
.tvk-utility-bar span,
.tvk-nav-menu .dropdown-item {
    color: var(--tvk-ink-2);
    font-size: 14px;
    font-weight: 700;
}

.tvk-product-nav .nav-link:hover,
.tvk-product-nav .nav-link:focus,
.tvk-account-nav .nav-link:hover,
.tvk-account-nav .nav-link:focus,
.tvk-nav-menu .dropdown-item:hover,
.tvk-login-link,
.tvk-user-pill,
.tvk-soft-pill,
.ota-card-badge-soft,
.ota-quick-filters a:hover {
    background: var(--tvk-blue-soft);
}

.tvk-register-link,
.tvk-partner-btn,
.tvk-footer-newsletter,
.seat-cell.selected {
    background: var(--tvk-blue);
}

.tvk-nav-menu,
.tvk-account-dropdown {
    border-radius: var(--tvk-radius);
    box-shadow: var(--tvk-shadow-menu);
}

.tvk-nav-menu .dropdown-item,
.tvk-product-nav .nav-link,
.tvk-account-nav .nav-link,
.tvk-login-link,
.tvk-register-link,
.tvk-user-pill,
.tvk-manage-pill {
    border-radius: var(--tvk-radius);
}

.tvk-primary-btn,
.hotel-btn-primary,
.ota-search-title button,
.tvk-footer-newsletter button {
    border: 0;
    background: var(--tvk-orange);
    color: var(--tvk-white);
    border-radius: var(--tvk-radius);
    box-shadow: none;
    font-weight: 700;
}

.tvk-primary-btn:hover,
.hotel-btn-primary:hover,
.ota-search-title button:hover,
.tvk-footer-newsletter button:hover {
    background: #e94f11;
    color: var(--tvk-white);
    box-shadow: var(--tvk-shadow-lift);
}

.tvk-outline-btn,
.hotel-btn-outline,
.ota-quick-filters a {
    border-color: var(--tvk-blue-tint);
    border-radius: var(--tvk-radius);
    color: var(--tvk-blue);
    font-weight: 700;
}

.tvk-outline-btn:hover,
.hotel-btn-outline:hover {
    border-color: var(--tvk-blue);
    background: var(--tvk-blue-soft);
    color: var(--tvk-blue);
}

.tvk-step-card,
.tvk-flight-summary-card,
.tvk-price-panel,
.tvk-trip-card,
.tvk-booking-card,
.tvk-invoice-shell,
.tvk-auth-card,
.ota-search-shell,
.ota-admin-panel,
.ota-side-panel,
.ota-stay-card,
.ota-flight-card,
.ota-tour-card,
.ota-detail-main,
.ota-booking-box,
.ota-flight-detail-hero,
.ota-tour-detail-hero {
    border-color: var(--tvk-line);
    border-radius: var(--tvk-radius);
    box-shadow: var(--tvk-shadow-card);
}

.tvk-step-card:hover,
.tvk-booking-card:hover,
.ota-stay-card:hover,
.ota-flight-card:hover,
.ota-tour-card:hover {
    box-shadow: var(--tvk-shadow-lift);
}

.tvk-input,
.search-control,
.form-control,
.form-select,
.tvk-footer-newsletter input {
    border-color: #dfe3e6;
    border-radius: var(--tvk-radius);
    color: var(--tvk-ink);
    font-weight: 600;
}

.tvk-input:focus,
.search-control:focus,
.form-control:focus,
.form-select:focus {
    border-color: var(--tvk-blue-bright);
    box-shadow: 0 0 0 3px rgba(10, 154, 242, .14);
}

.tvk-field-label,
.tvk-auth-form label span,
.tvk-seat-toolbar label span,
.search-label,
.ota-search-grid label span {
    color: var(--tvk-ink-2);
    font-size: 12px;
    font-weight: 700;
}

.tvk-checkout-hero,
.ota-hero {
    background-color: var(--tvk-blue-deep);
}

.tvk-checkout-hero h1,
.ota-hero-copy h1,
.ota-detail-heading h1,
.ota-flight-detail-hero h1,
.ota-tour-detail-hero h1,
.tvk-auth-visual h1,
.tvk-page-heading h1 {
    letter-spacing: 0;
    font-weight: 800;
}

.tvk-checkout-hero p,
.ota-hero-copy p,
.tvk-page-heading p,
.ota-card-desc,
.ota-detail-section p,
.tvk-trip-card p,
.tvk-auth-heading p,
.tvk-info-list span,
.tvk-price-row span {
    color: var(--tvk-muted);
}

.tvk-checkout-hero p,
.ota-hero-copy p,
.tvk-auth-visual p {
    color: rgba(255, 255, 255, .9);
}

.tvk-grand-total strong,
.tvk-booking-price strong,
.ota-card-price strong,
.ota-tour-card.admin strong,
.ota-booking-price strong {
    color: var(--tvk-orange);
}

.tvk-success-pill,
.tvk-discount strong,
.ota-sale {
    color: var(--tvk-green);
}

.tvk-success-pill,
.ota-sale {
    background: #efffed;
}

.tvk-footer-brand,
.tvk-global-footer {
    background: #05285d;
}

.tvk-global-footer {
    color: var(--tvk-white);
}

.tvk-footer-bottom {
    border-top-color: rgba(255, 255, 255, .14);
}

.tvk-auth-card,
.tvk-register-card {
    border-radius: var(--tvk-radius);
}

.tvk-auth-visual {
    background:
        linear-gradient(135deg, rgba(0, 113, 206, .94), rgba(10, 154, 242, .74)),
        url("https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?w=1600&q=80") center/cover;
}

.tvk-auth-social .btn,
.tvk-role-grid label {
    border-color: #dfe3e6;
    border-radius: var(--tvk-radius);
    color: var(--tvk-ink-2);
}

.tvk-role-grid input:checked + label {
    border-color: var(--tvk-blue);
    background: var(--tvk-blue-soft);
    color: var(--tvk-blue-deep);
}

.ota-hero-stats span,
.ota-card-tags span,
.ota-detail-facts span,
.tvk-booking-meta span,
.tvk-booking-topline span {
    background: var(--tvk-blue-soft);
    color: var(--tvk-ink-2);
    border-radius: var(--tvk-pill);
}

.tvk-booking-topline strong {
    background: #efffed;
    color: var(--tvk-green);
}

/* ===== Hotel landing page matching GenZ hotel screenshot ===== */
.hotel-home-page {
    background: var(--tvk-white);
    color: var(--tvk-ink);
    font-family: var(--tvk-font);
}

.hotel-home-hero {
    padding: 32px 0 0;
    background: #fff;
}

.hotel-hero-shell {
    min-height: 374px;
    overflow: hidden;
    border-radius: 20px;
    display: flex;
    align-items: flex-end;
    background:
        linear-gradient(180deg, rgba(3, 18, 26, 0) 16%, rgba(3, 18, 26, .2) 56%, rgba(3, 18, 26, .34) 100%),
        url("https://images.unsplash.com/photo-1540541338287-41700207dee6?w=1800&q=85") center/cover;
    box-shadow: var(--tvk-shadow-card);
}

.hotel-hero-copy {
    width: calc(100% - 96px);
    max-width: none;
    margin: 0 48px 28px;
    border-radius: 20px 20px 0 0;
    background: rgba(3, 18, 26, .58);
    padding: 24px 28px 54px;
    color: #fff;
    backdrop-filter: blur(1px);
}

.hotel-hero-copy span {
    display: inline-flex;
    margin-bottom: 8px;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.hotel-hero-copy h1 {
    margin: 0 0 8px;
    font-size: clamp(28px, 3vw, 36px);
    font-weight: 800;
    letter-spacing: 0;
}

.hotel-hero-copy p {
    margin: 0;
    color: rgba(255, 255, 255, .9);
    font-size: 15px;
    font-weight: 600;
}

.hotel-search-panel {
    position: relative;
    z-index: 2;
    margin: -30px auto 0;
    width: calc(100% - 96px);
    max-width: 1440px;
    border: 1px solid var(--tvk-line);
    border-radius: 0 0 24px 24px;
    background: #fff;
    padding: 30px 32px 34px;
    box-shadow: 0 10px 28px rgba(3, 18, 26, .08);
}

.hotel-search-grid {
    display: grid;
    grid-template-columns: minmax(310px, 1fr) minmax(360px, 1.12fr) minmax(310px, 1fr) 220px;
    gap: 24px;
    align-items: start;
}

.hotel-search-grid label,
.hotel-advanced-search {
    display: grid;
    gap: 6px;
}

.hotel-search-grid label {
    min-width: 0;
}

.hotel-search-grid label span {
    color: var(--tvk-ink-2);
    min-height: 24px;
    overflow: hidden;
    font-size: 15px;
    font-weight: 600;
    line-height: 24px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hotel-field-wrap {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    min-height: 68px;
    border: 1px solid #cfd6dc;
    border-radius: 12px;
    background: #fff;
    padding: 0 16px;
}

.hotel-field-wrap > i {
    color: var(--tvk-ink-2);
    font-size: 24px;
}

.hotel-field-wrap em {
    display: inline-grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #dff4ff;
    color: var(--tvk-blue-deep);
    font-style: normal;
}

.hotel-field-wrap:focus-within {
    border-color: var(--tvk-blue-bright);
    box-shadow: 0 0 0 3px rgba(10, 154, 242, .14);
}

.hotel-search-grid input,
.hotel-search-grid select {
    width: 100%;
    min-height: 64px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--tvk-ink);
    padding: 0 6px;
    font-size: 18px;
    font-weight: 500;
}

.hotel-search-grid input::placeholder {
    color: #737b82;
    font-weight: 500;
    opacity: 1;
}

.hotel-advanced-search input,
.hotel-advanced-search select {
    width: 100%;
    min-height: 44px;
    border: 1px solid #dfe3e6;
    border-radius: 8px;
    background: #fff;
    color: var(--tvk-ink);
    padding: 0 12px;
    font-size: 14px;
    font-weight: 700;
}

.hotel-search-grid input:focus,
.hotel-search-grid select:focus {
    outline: none;
    box-shadow: none;
}

.hotel-search-grid input:focus,
.hotel-search-grid select:focus,
.hotel-advanced-search input:focus,
.hotel-advanced-search select:focus {
    border-color: var(--tvk-blue-bright);
    box-shadow: 0 0 0 3px rgba(10, 154, 242, .14);
    outline: none;
}

.hotel-search-grid button {
    align-self: start;
    min-height: 68px;
    margin-top: 30px;
    border: 0;
    border-radius: 999px;
    background: var(--tvk-blue);
    color: #fff;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 0;
}

.hotel-advanced-search {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 12px;
    display: none;
}

.hotel-search-grid label small {
    color: var(--tvk-muted);
    min-height: 18px;
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
    margin-left: 4px;
}

.hotel-home-content {
    padding-top: 34px;
}

.hotel-benefit-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 34px;
}

.hotel-benefit-row article {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 12px;
    align-items: center;
    border: 1px solid var(--tvk-line);
    border-radius: 8px;
    background: #fff;
    padding: 16px;
    box-shadow: var(--tvk-shadow-card);
}

.hotel-benefit-row i {
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    background: var(--tvk-blue-soft);
    color: var(--tvk-blue);
}

.hotel-benefit-row strong {
    display: block;
    color: var(--tvk-ink);
    font-size: 14px;
    font-weight: 800;
}

.hotel-benefit-row span {
    color: var(--tvk-muted);
    font-size: 12px;
    font-weight: 600;
}

.hotel-section {
    margin: 0 0 42px;
}

.hotel-section-title-row {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.hotel-section-title-row h2,
.hotel-info-columns h2,
.hotel-faq-section h2,
.hotel-host-card h2,
.hotel-seo-links h2 {
    margin: 0;
    color: var(--tvk-ink);
    font-size: 22px;
    font-weight: 800;
    letter-spacing: 0;
}

.hotel-section-title-row p {
    margin: 4px 0 0;
    color: var(--tvk-muted);
    font-size: 14px;
    font-weight: 600;
}

.hotel-section-title-row a {
    color: var(--tvk-blue);
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
}

.hotel-room-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    border-radius: 8px;
    background: #f2fbff;
    padding: 18px;
}

.hotel-mini-card,
.hotel-empty-card {
    overflow: hidden;
    border: 1px solid var(--tvk-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: var(--tvk-shadow-card);
}

.hotel-mini-image {
    position: relative;
    display: block;
    height: 150px;
    overflow: hidden;
    color: #fff;
    text-decoration: none;
}

.hotel-mini-image img,
.hotel-city-card img,
.hotel-other-grid img,
.hotel-article-row img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hotel-mini-image span {
    position: absolute;
    left: 10px;
    top: 10px;
    border-radius: 999px;
    background: rgba(1, 148, 243, .92);
    color: #fff;
    padding: 5px 9px;
    font-size: 11px;
    font-weight: 800;
}

.hotel-mini-body {
    display: grid;
    gap: 5px;
    padding: 12px;
}

.hotel-mini-body h3 {
    margin: 0;
    color: var(--tvk-ink);
    font-size: 14px;
    font-weight: 800;
}

.hotel-mini-body p,
.hotel-card-rating,
.hotel-mini-body small {
    margin: 0;
    color: var(--tvk-muted);
    font-size: 12px;
    font-weight: 700;
}

.hotel-mini-body small {
    text-decoration: line-through;
}

.hotel-mini-body strong {
    color: var(--tvk-orange);
    font-size: 15px;
    font-weight: 800;
}

.hotel-mini-cta {
    justify-self: start;
    border-radius: 999px;
    background: var(--tvk-orange);
    color: #fff;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.hotel-empty-card {
    display: grid;
    place-items: center;
    gap: 6px;
    min-height: 250px;
    text-align: center;
    padding: 20px;
}

.hotel-empty-card i {
    color: var(--tvk-blue);
    font-size: 32px;
}

.hotel-banner-pair {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 24px;
}

.hotel-promo-banner {
    min-height: 120px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 8px;
    padding: 20px;
    overflow: hidden;
}

.hotel-promo-banner.dark {
    background:
        linear-gradient(90deg, rgba(5, 40, 93, .96), rgba(5, 40, 93, .58)),
        url("https://images.unsplash.com/photo-1566073771259-6a8506099945?w=900&q=80") center/cover;
    color: #fff;
}

.hotel-promo-banner.yellow {
    background: linear-gradient(135deg, #ffe347, #ffc629);
    color: #5b3c00;
}

.hotel-promo-banner span {
    font-size: 13px;
    font-weight: 800;
}

.hotel-promo-banner strong {
    font-size: 24px;
    font-weight: 900;
}

.hotel-voucher-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    border: 1px solid var(--tvk-line);
    border-radius: 8px;
    background: #f7fcff;
    padding: 16px 18px;
    margin-bottom: 34px;
}

.hotel-voucher-box div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.hotel-voucher-box i {
    color: var(--tvk-blue);
}

.hotel-voucher-box span {
    color: var(--tvk-ink-2);
    font-size: 14px;
    font-weight: 700;
}

.hotel-voucher-box strong {
    border-radius: 8px;
    background: #fff;
    padding: 9px 14px;
    color: var(--tvk-ink);
    font-size: 13px;
    font-weight: 900;
}

.hotel-voucher-box button {
    border: 0;
    border-radius: 999px;
    background: var(--tvk-blue);
    color: #fff;
    padding: 8px 14px;
    font-weight: 800;
}

.hotel-city-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.hotel-city-card {
    position: relative;
    height: 132px;
    overflow: hidden;
    border-radius: 8px;
    color: #fff;
    text-decoration: none;
    box-shadow: var(--tvk-shadow-card);
}

.hotel-city-card::after,
.hotel-other-grid a::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(3, 18, 26, .05), rgba(3, 18, 26, .58));
}

.hotel-city-card span,
.hotel-other-grid span {
    position: absolute;
    left: 14px;
    bottom: 12px;
    z-index: 1;
    color: #fff;
    font-size: 15px;
    font-weight: 800;
}

.hotel-other-grid,
.hotel-article-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.hotel-other-grid a {
    position: relative;
    height: 160px;
    overflow: hidden;
    border-radius: 8px;
    color: #fff;
    text-decoration: none;
}

.hotel-article-row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.hotel-article-row article {
    overflow: hidden;
    border: 1px solid var(--tvk-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: var(--tvk-shadow-card);
}

.hotel-article-row img {
    height: 116px;
}

.hotel-article-row strong,
.hotel-article-row span {
    display: block;
    padding: 0 12px;
}

.hotel-article-row strong {
    margin-top: 10px;
    color: var(--tvk-ink);
    font-size: 13px;
    font-weight: 800;
}

.hotel-article-row span {
    margin: 6px 0 12px;
    color: var(--tvk-muted);
    font-size: 12px;
    font-weight: 700;
}

.hotel-info-columns {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
    gap: 24px;
    margin: 34px 0;
}

.hotel-info-columns article {
    border-radius: 8px;
    background: #fff;
    padding: 22px;
}

.hotel-info-columns p {
    color: var(--tvk-muted);
    line-height: 1.75;
    font-size: 14px;
    font-weight: 600;
}

.hotel-data-card {
    border: 1px solid var(--tvk-line);
    box-shadow: var(--tvk-shadow-card);
}

.hotel-data-card div {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid var(--tvk-line);
    padding: 12px 0;
}

.hotel-data-card div:last-child {
    border-bottom: 0;
}

.hotel-data-card span {
    color: var(--tvk-muted);
    font-size: 13px;
    font-weight: 700;
}

.hotel-data-card strong {
    color: var(--tvk-ink);
    font-size: 13px;
    font-weight: 800;
    text-align: right;
}

.hotel-faq-section {
    margin: 36px 0;
}

.hotel-faq-section h2 {
    margin-bottom: 14px;
}

.hotel-faq-section details {
    border-bottom: 1px solid var(--tvk-line);
    background: #fff;
}

.hotel-faq-section summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    padding: 14px 2px;
    color: var(--tvk-ink);
    font-size: 14px;
    font-weight: 800;
}

.hotel-faq-section summary::-webkit-details-marker {
    display: none;
}

.hotel-faq-section summary i {
    color: var(--tvk-blue);
}

.hotel-faq-section p {
    margin: 0;
    padding: 0 0 14px;
    color: var(--tvk-muted);
    font-size: 13px;
    font-weight: 600;
}

.hotel-host-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 24px;
    align-items: center;
    border-radius: 8px;
    background: #f5fbff;
    padding: 28px;
    margin: 36px 0;
}

.hotel-host-card p {
    color: var(--tvk-muted);
    font-weight: 700;
}

.hotel-host-placeholder {
    min-height: 160px;
    border: 1px solid var(--tvk-line);
    border-radius: 8px;
    background: #fff;
}

.hotel-seo-links {
    margin: 38px 0 52px;
}

.hotel-seo-links h2 {
    margin-bottom: 14px;
}

.hotel-seo-links div {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px 22px;
}

.hotel-seo-links a {
    color: var(--tvk-blue);
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}

.hotel-admin-panel {
    margin: 24px 0 56px;
}

@media (max-width: 1200px) {
    .hotel-search-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hotel-search-grid button {
        grid-column: span 2;
    }
}

@media (max-width: 992px) {
    .hotel-benefit-row,
    .hotel-room-strip,
    .hotel-city-grid,
    .hotel-other-grid,
    .hotel-article-row,
    .hotel-info-columns,
    .hotel-host-card {
        grid-template-columns: 1fr;
    }

    .hotel-banner-pair,
    .hotel-advanced-search {
        grid-template-columns: 1fr;
    }

    .hotel-seo-links div {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 576px) {
    .hotel-home-hero {
        padding-top: 10px;
    }

    .hotel-hero-shell {
        min-height: 300px;
    }

    .hotel-hero-copy {
        padding: 0 18px 70px;
    }

    .hotel-search-panel {
        margin-top: -58px;
        padding: 12px;
    }

    .hotel-search-grid {
        grid-template-columns: 1fr;
    }

    .hotel-search-grid button {
        grid-column: auto;
    }

    .hotel-benefit-row article {
        grid-template-columns: 36px 1fr;
        padding: 12px;
    }

    .hotel-section-title-row {
        align-items: start;
        flex-direction: column;
    }

    .hotel-seo-links div {
        grid-template-columns: 1fr;
    }
}

/* ===== GenZ-like hotel search and listing page ===== */
.tvk-hotel-results-page {
    background: #f5f7fa;
    color: #1f2d3d;
    font-family: var(--tvk-font, "Be Vietnam Pro", "Inter", sans-serif);
}

.tvk-hotel-hero {
    position: relative;
    overflow: hidden;
    padding: 22px 0 92px;
    background:
        linear-gradient(135deg, rgba(1, 94, 180, .98), rgba(3, 145, 231, .94)),
        url("https://images.unsplash.com/photo-1566073771259-6a8506099945?w=1800&q=85") center/cover;
    color: #fff;
}

.tvk-hotel-hero::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 96px;
    background: linear-gradient(180deg, rgba(245, 247, 250, 0), #f5f7fa);
}

.tvk-hotel-hero > .container {
    position: relative;
    z-index: 1;
}

.tvk-hotel-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 38px;
    color: rgba(255, 255, 255, .86);
    font-size: 13px;
    font-weight: 700;
}

.tvk-hotel-breadcrumb a {
    color: #fff;
    text-decoration: none;
}

.tvk-hotel-breadcrumb i {
    font-size: 10px;
    opacity: .74;
}

.tvk-hotel-hero-copy {
    max-width: 720px;
    padding-bottom: 64px;
}

.tvk-hotel-hero-copy span {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    background: rgba(255, 255, 255, .18);
    padding: 7px 12px;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
}

.tvk-hotel-hero-copy h1 {
    margin: 14px 0 10px;
    max-width: 680px;
    color: #fff;
    font-size: 38px;
    line-height: 1.18;
    font-weight: 900;
    letter-spacing: 0;
}

.tvk-hotel-hero-copy p {
    max-width: 650px;
    margin: 0;
    color: rgba(255, 255, 255, .92);
    font-size: 16px;
    line-height: 1.7;
    font-weight: 600;
}

.tvk-hotel-search-card {
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: -74px;
    z-index: 2;
    border: 1px solid #dfe7ef;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(31, 45, 61, .18);
}

.tvk-hotel-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 14px 16px 0;
}

.tvk-hotel-tabs button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: #52616f;
    padding: 0 13px;
    font-size: 13px;
    font-weight: 800;
}

.tvk-hotel-tabs button.active {
    background: #e8f6ff;
    color: #007ce0;
}

.tvk-hotel-search-grid {
    display: grid;
    grid-template-columns: minmax(260px, 1.4fr) repeat(3, minmax(150px, .78fr)) minmax(150px, .72fr);
    gap: 12px;
    align-items: end;
    padding: 14px 16px 16px;
}

.tvk-hotel-search-grid label {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.tvk-hotel-search-grid label span,
.tvk-hotel-filter-panel label span {
    color: #35405a;
    font-size: 12px;
    font-weight: 800;
}

.tvk-hotel-field {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    min-height: 52px;
    border: 1px solid #ccd6e0;
    border-radius: 8px;
    background: #fff;
    padding: 0 12px;
}

.tvk-hotel-field:focus-within {
    border-color: #0194f3;
    box-shadow: 0 0 0 3px rgba(1, 148, 243, .14);
}

.tvk-hotel-field i {
    color: #0194f3;
    font-size: 17px;
}

.tvk-hotel-field input,
.tvk-hotel-quick-filters input,
.tvk-hotel-quick-filters select,
.tvk-hotel-filter-panel input,
.tvk-hotel-filter-panel select {
    width: 100%;
    border: 0;
    outline: none;
    background: transparent;
    color: #1f2d3d;
    font-size: 14px;
    font-weight: 700;
}

.tvk-hotel-field input {
    min-width: 0;
}

.tvk-hotel-field input::placeholder {
    color: #7f8b97;
}

.tvk-hotel-search-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 52px;
    border: 0;
    border-radius: 8px;
    background: #ff5e1f;
    color: #fff;
    padding: 0 18px;
    font-size: 16px;
    font-weight: 900;
    box-shadow: 0 10px 22px rgba(255, 94, 31, .28);
}

.tvk-hotel-quick-filters {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    border-top: 1px solid #edf1f5;
    padding: 0 16px 16px;
}

.tvk-hotel-quick-filters input,
.tvk-hotel-quick-filters select,
.tvk-hotel-filter-panel input,
.tvk-hotel-filter-panel select {
    min-height: 42px;
    border: 1px solid #d9e0e7;
    border-radius: 8px;
    background: #fff;
    padding: 0 12px;
}

.tvk-hotel-content {
    position: relative;
    z-index: 3;
    padding-top: 100px;
    padding-bottom: 54px;
}

.tvk-hotel-trust-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}

.tvk-hotel-trust-row article {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    border: 1px solid #e1e8ef;
    border-radius: 8px;
    background: #fff;
    padding: 14px;
    box-shadow: 0 8px 22px rgba(31, 45, 61, .06);
}

.tvk-hotel-trust-row i {
    display: inline-grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #e8f6ff;
    color: #0194f3;
}

.tvk-hotel-trust-row strong {
    display: block;
    color: #1f2d3d;
    font-size: 14px;
    font-weight: 900;
}

.tvk-hotel-trust-row span {
    color: #687786;
    font-size: 12px;
    font-weight: 700;
}

.tvk-hotel-promo-strip {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 18px;
}

.tvk-hotel-promo-strip article {
    min-height: 122px;
    border-radius: 8px;
    background:
        linear-gradient(90deg, rgba(6, 52, 119, .96), rgba(1, 148, 243, .8)),
        url("https://images.unsplash.com/photo-1520250497591-112f2f40a3f4?w=1200&q=80") center/cover;
    color: #fff;
    padding: 18px 20px;
}

.tvk-hotel-promo-strip article.accent {
    background:
        linear-gradient(90deg, rgba(255, 94, 31, .94), rgba(255, 198, 41, .82)),
        url("https://images.unsplash.com/photo-1540541338287-41700207dee6?w=1200&q=80") center/cover;
}

.tvk-hotel-promo-strip span,
.tvk-hotel-promo-strip small {
    display: block;
    font-size: 13px;
    font-weight: 800;
}

.tvk-hotel-promo-strip strong {
    display: block;
    margin: 7px 0;
    font-size: 22px;
    line-height: 1.25;
    font-weight: 900;
}

.tvk-hotel-main-grid {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.tvk-hotel-filter-panel {
    position: sticky;
    top: 116px;
    border: 1px solid #dde6ee;
    border-radius: 8px;
    background: #fff;
    padding: 16px;
    box-shadow: 0 8px 22px rgba(31, 45, 61, .06);
}

.tvk-filter-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
}

.tvk-filter-head strong {
    color: #1f2d3d;
    font-size: 16px;
    font-weight: 900;
}

.tvk-filter-head a {
    color: #0194f3;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.tvk-hotel-filter-panel form {
    display: grid;
    gap: 13px;
}

.tvk-hotel-filter-panel label {
    display: grid;
    gap: 7px;
}

.tvk-hotel-filter-panel button {
    min-height: 42px;
    border: 0;
    border-radius: 8px;
    background: #0194f3;
    color: #fff;
    font-weight: 900;
}

.tvk-map-preview {
    display: grid;
    gap: 6px;
    justify-items: start;
    margin-top: 16px;
    border-radius: 8px;
    background: #eef8ff;
    padding: 14px;
}

.tvk-map-preview i {
    color: #0194f3;
    font-size: 26px;
}

.tvk-map-preview strong {
    color: #1f2d3d;
    font-size: 14px;
    font-weight: 900;
}

.tvk-map-preview span {
    color: #687786;
    font-size: 12px;
    font-weight: 700;
}

.tvk-hotel-results {
    display: grid;
    gap: 14px;
}

.tvk-results-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border: 1px solid #dde6ee;
    border-radius: 8px;
    background: #fff;
    padding: 16px 18px;
}

.tvk-results-toolbar span {
    color: #0194f3;
    font-size: 12px;
    font-weight: 900;
}

.tvk-results-toolbar h2 {
    margin: 4px 0;
    color: #1f2d3d;
    font-size: 22px;
    font-weight: 900;
    letter-spacing: 0;
}

.tvk-results-toolbar p {
    margin: 0;
    color: #687786;
    font-size: 13px;
    font-weight: 700;
}

.tvk-results-toolbar button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    border: 1px solid #d6e1ea;
    border-radius: 8px;
    background: #fff;
    color: #35405a;
    padding: 0 13px;
    font-weight: 800;
    white-space: nowrap;
}

.tvk-hotel-result-card {
    display: grid;
    grid-template-columns: 244px minmax(0, 1fr) 210px;
    gap: 16px;
    border: 1px solid #dde6ee;
    border-radius: 8px;
    background: #fff;
    padding: 12px;
    box-shadow: 0 8px 22px rgba(31, 45, 61, .06);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.tvk-hotel-result-card:hover {
    border-color: #b9dff9;
    box-shadow: 0 16px 34px rgba(31, 45, 61, .12);
    transform: translateY(-2px);
}

.tvk-hotel-result-image {
    position: relative;
    overflow: hidden;
    min-height: 196px;
    border-radius: 8px;
    background: #e8eef3;
}

.tvk-hotel-result-image img,
.tvk-hotel-city-grid img,
.tvk-featured-stay-grid img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tvk-result-sale {
    position: absolute;
    left: 10px;
    top: 10px;
    border-radius: 999px;
    background: #ff5e1f;
    color: #fff;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 900;
}

.tvk-hotel-result-body {
    min-width: 0;
    padding: 4px 0;
}

.tvk-result-topline,
.tvk-result-rating,
.tvk-result-amenities {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.tvk-result-topline span {
    color: #687786;
    font-size: 12px;
    font-weight: 800;
}

.tvk-hotel-result-body h3 {
    margin: 8px 0;
    color: #1f2d3d;
    font-size: 20px;
    line-height: 1.35;
    font-weight: 900;
    letter-spacing: 0;
}

.tvk-hotel-result-body h3 a {
    color: inherit;
    text-decoration: none;
}

.tvk-result-rating strong {
    border-radius: 6px;
    background: #0a6ada;
    color: #fff;
    padding: 4px 7px;
    font-size: 13px;
    font-weight: 900;
}

.tvk-result-rating span {
    color: #0a6ada;
    font-size: 13px;
    font-weight: 900;
}

.tvk-result-rating small {
    color: #7f8b97;
    font-size: 12px;
    font-weight: 700;
}

.tvk-hotel-result-body p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    margin: 10px 0;
    color: #52616f;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 600;
}

.tvk-result-amenities span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border-radius: 999px;
    background: #f1f8ec;
    color: #228b22;
    padding: 5px 9px;
    font-size: 12px;
    font-weight: 800;
}

.tvk-hotel-result-price {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
    gap: 5px;
    border-left: 1px solid #edf1f5;
    padding: 8px 4px 8px 16px;
    text-align: right;
}

.tvk-hotel-result-price span,
.tvk-hotel-result-price em {
    color: #687786;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
}

.tvk-hotel-result-price small {
    color: #9aa5b1;
    font-size: 12px;
    font-weight: 800;
    text-decoration: line-through;
}

.tvk-hotel-result-price strong {
    color: #ff5e1f;
    font-size: 20px;
    font-weight: 900;
}

.tvk-hotel-result-price a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 150px;
    min-height: 42px;
    margin-top: 8px;
    border-radius: 8px;
    background: #ff5e1f;
    color: #fff;
    padding: 0 18px;
    font-size: 14px;
    font-weight: 900;
    text-decoration: none;
}

.tvk-hotel-empty-state {
    display: grid;
    justify-items: center;
    gap: 8px;
    border: 1px solid #dde6ee;
    border-radius: 8px;
    background: #fff;
    padding: 42px 20px;
    text-align: center;
}

.tvk-hotel-empty-state i {
    color: #0194f3;
    font-size: 38px;
}

.tvk-hotel-empty-state strong {
    color: #1f2d3d;
    font-size: 18px;
    font-weight: 900;
}

.tvk-hotel-empty-state span {
    color: #687786;
    font-size: 13px;
    font-weight: 700;
}

.tvk-hotel-destination-section {
    margin-top: 34px;
}

.tvk-section-heading {
    margin-bottom: 14px;
}

.tvk-section-heading h2 {
    margin: 0;
    color: #1f2d3d;
    font-size: 22px;
    font-weight: 900;
    letter-spacing: 0;
}

.tvk-section-heading p {
    margin: 5px 0 0;
    color: #687786;
    font-size: 13px;
    font-weight: 700;
}

.tvk-hotel-city-grid,
.tvk-featured-stay-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.tvk-hotel-city-grid a,
.tvk-featured-stay-grid a {
    position: relative;
    overflow: hidden;
    min-height: 150px;
    border-radius: 8px;
    background: #dce5ec;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 8px 22px rgba(31, 45, 61, .08);
}

.tvk-hotel-city-grid a::after,
.tvk-featured-stay-grid a::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(31, 45, 61, 0), rgba(31, 45, 61, .72));
}

.tvk-hotel-city-grid span,
.tvk-featured-stay-grid strong,
.tvk-featured-stay-grid span {
    position: absolute;
    z-index: 1;
    left: 14px;
    right: 14px;
}

.tvk-hotel-city-grid span,
.tvk-featured-stay-grid strong {
    bottom: 34px;
    color: #fff;
    font-size: 15px;
    font-weight: 900;
}

.tvk-featured-stay-grid span {
    bottom: 14px;
    color: rgba(255, 255, 255, .88);
    font-size: 12px;
    font-weight: 700;
}

@media (max-width: 1200px) {
    .tvk-hotel-search-card {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        margin-top: -42px;
    }

    .tvk-hotel-hero-copy {
        padding-bottom: 70px;
    }

    .tvk-hotel-search-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tvk-hotel-search-button {
        grid-column: span 2;
    }

    .tvk-hotel-content {
        padding-top: 30px;
    }

    .tvk-hotel-main-grid {
        grid-template-columns: 250px minmax(0, 1fr);
    }

    .tvk-hotel-result-card {
        grid-template-columns: 220px minmax(0, 1fr);
    }

    .tvk-hotel-result-price {
        grid-column: 2;
        border-left: 0;
        border-top: 1px solid #edf1f5;
        padding: 12px 0 0;
    }
}

@media (max-width: 992px) {
    .tvk-hotel-hero {
        padding-bottom: 46px;
    }

    .tvk-hotel-hero-copy h1 {
        font-size: 32px;
    }

    .tvk-hotel-trust-row,
    .tvk-hotel-promo-strip,
    .tvk-hotel-main-grid,
    .tvk-hotel-city-grid,
    .tvk-featured-stay-grid {
        grid-template-columns: 1fr;
    }

    .tvk-hotel-filter-panel {
        position: static;
    }
}

@media (max-width: 768px) {
    .tvk-hotel-search-grid,
    .tvk-hotel-quick-filters {
        grid-template-columns: 1fr;
    }

    .tvk-hotel-search-button {
        grid-column: auto;
    }

    .tvk-results-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .tvk-hotel-result-card {
        grid-template-columns: 1fr;
    }

    .tvk-hotel-result-image {
        min-height: 220px;
    }

    .tvk-hotel-result-price {
        grid-column: auto;
        align-items: flex-start;
        text-align: left;
    }
}

@media (max-width: 576px) {
    .tvk-hotel-hero {
        padding-top: 16px;
    }

    .tvk-hotel-breadcrumb {
        margin-bottom: 22px;
    }

    .tvk-hotel-hero-copy {
        padding-bottom: 58px;
    }

    .tvk-hotel-hero-copy h1 {
        font-size: 26px;
    }

    .tvk-hotel-search-card {
        margin-top: -28px;
    }

    .tvk-hotel-tabs {
        overflow-x: auto;
        flex-wrap: nowrap;
    }

    .tvk-hotel-tabs button {
        flex: 0 0 auto;
    }

    .tvk-hotel-trust-row article {
        grid-template-columns: 38px minmax(0, 1fr);
    }
}

/* ===== Home search bar exact visual adjustment ===== */
.tvk-home .tvk-search-card {
    width: min(1464px, calc(100% - 18px)) !important;
    max-width: min(1464px, calc(100% - 18px)) !important;
}

.tvk-home .tvk-search-form {
    margin-top: 20px !important;
}

.tvk-home .tvk-subtabs {
    margin-bottom: 38px !important;
}

.tvk-home .tvk-search-form .row {
    --bs-gutter-x: 0 !important;
    --bs-gutter-y: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(340px, 1.1fr) minmax(340px, 1.1fr) minmax(340px, 1.08fr) 58px !important;
    align-items: end !important;
    overflow: visible !important;
    border: 3px solid rgba(45, 60, 76, .42) !important;
    border-radius: 20px !important;
    background: #fff !important;
    box-shadow: 0 8px 18px rgba(5, 22, 38, .22) !important;
}

.tvk-home .tvk-search-form .row > [class*="col-"] {
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
}

.tvk-home .tvk-search-form .row > [class*="col-"]:not(:last-child) {
    border-right: 1px solid rgba(23, 37, 56, .62) !important;
}

.tvk-home .tvk-search-form label {
    position: absolute !important;
    bottom: calc(100% + 16px) !important;
    left: 0 !important;
    z-index: 2 !important;
    display: block !important;
    margin: 0 !important;
    color: #fff !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .38) !important;
    white-space: nowrap !important;
}

.tvk-home .tvk-search-form .row > [class*="col-"] {
    position: relative !important;
}

.tvk-home .tvk-input {
    position: relative !important;
    height: 52px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
}

.tvk-home .tvk-input .form-control,
.tvk-home .tvk-input .form-control[readonly] {
    height: 52px !important;
    min-height: 52px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: #03121d !important;
    padding: 0 16px 0 48px !important;
    font-size: 16px !important;
    line-height: 52px !important;
    font-weight: 600 !important;
    box-shadow: none !important;
}

.tvk-home .tvk-input .form-control::placeholder {
    color: #c4c9cf !important;
    opacity: 1 !important;
    font-weight: 600 !important;
}

.tvk-home .tvk-input i {
    position: absolute !important;
    left: 15px !important;
    top: 50% !important;
    z-index: 2 !important;
    width: 20px !important;
    color: #0b99ec !important;
    font-size: 20px !important;
    line-height: 1 !important;
    text-align: center !important;
    transform: translateY(-50%) !important;
}

.tvk-home .tvk-search-form .row > div:first-child .form-control,
.tvk-home .tvk-search-form .row > div:first-child .tvk-input {
    border-radius: 17px 0 0 17px !important;
}

.tvk-home .tvk-search-btn {
    width: 58px !important;
    min-width: 58px !important;
    height: 52px !important;
    min-height: 52px !important;
    border: 0 !important;
    border-radius: 0 17px 17px 0 !important;
    background: #ff5e2c !important;
    color: #fff !important;
    padding: 0 !important;
    font-size: 19px !important;
    box-shadow: none !important;
}

.tvk-home .tvk-search-btn i {
    font-size: 19px !important;
    font-weight: 700 !important;
}

.tvk-home .tvk-home-suggestions {
    position: absolute !important;
    top: calc(100% + 3px) !important;
    left: -3px !important;
    z-index: 40 !important;
    display: none !important;
    width: calc(100% + 6px) !important;
    overflow: hidden !important;
    border: 1px solid #e7ebef !important;
    border-radius: 0 0 4px 4px !important;
    background: #f7f9fb !important;
    box-shadow: 0 10px 22px rgba(5, 22, 38, .16) !important;
}

.tvk-home .tvk-home-suggestions.is-open {
    display: block !important;
}

.tvk-home .tvk-home-suggestions strong {
    display: block !important;
    padding: 15px 16px 10px !important;
    color: #03121d !important;
    font-size: 17px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
}

.tvk-home .tvk-home-suggestions button {
    display: block !important;
    width: 100% !important;
    min-height: 42px !important;
    border: 0 !important;
    border-top: 1px solid #edf0f3 !important;
    background: transparent !important;
    color: #03121d !important;
    padding: 0 16px !important;
    text-align: left !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

.tvk-home .tvk-home-suggestions span {
    display: block !important;
    padding: 0 16px 16px !important;
    color: #687786 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

.tvk-home .tvk-home-suggestions button:hover,
.tvk-home .tvk-home-suggestions button:focus {
    background: #eef7ff !important;
    color: #007ce0 !important;
    outline: none !important;
}

@media (max-width: 1199.98px) {
    .tvk-home .tvk-search-form .row {
        grid-template-columns: 1fr 1fr !important;
        border-radius: 18px !important;
    }

    .tvk-home .tvk-search-form .row > [class*="col-"] {
        border-right: 0 !important;
        border-bottom: 1px solid rgba(23, 37, 56, .18) !important;
    }

    .tvk-home .tvk-search-form .row > [class*="col-"]:nth-child(odd) {
        border-right: 1px solid rgba(23, 37, 56, .18) !important;
    }

    .tvk-home .tvk-search-form .row > [class*="col-"]:last-child {
        border: 0 !important;
    }

    .tvk-home .tvk-search-btn {
        width: 100% !important;
        border-radius: 0 0 18px 0 !important;
    }

    .tvk-home .tvk-home-suggestions {
        width: calc(100% + 4px) !important;
        left: -2px !important;
    }
}

@media (max-width: 767.98px) {
    .tvk-home .tvk-search-form .row {
        grid-template-columns: 1fr !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        gap: 12px !important;
    }

    .tvk-home .tvk-search-form .row > [class*="col-"] {
        border: 0 !important;
    }

    .tvk-home .tvk-search-form label {
        position: static !important;
        margin-bottom: 7px !important;
        font-size: 13px !important;
    }

    .tvk-home .tvk-input,
    .tvk-home .tvk-input .form-control,
    .tvk-home .tvk-input .form-control[readonly],
    .tvk-home .tvk-search-form .row > div:first-child .form-control,
    .tvk-home .tvk-search-form .row > div:first-child .tvk-input {
        border-radius: 14px !important;
    }

    .tvk-home .tvk-input {
        border: 1px solid rgba(45, 60, 76, .28) !important;
    }

    .tvk-home .tvk-search-btn {
        width: 100% !important;
        border-radius: 14px !important;
    }

    .tvk-home .tvk-home-suggestions {
        position: static !important;
        width: 100% !important;
        margin-top: 4px !important;
        border-radius: 8px !important;
    }

    .tvk-home .tvk-home-suggestions strong {
        font-size: 16px !important;
        padding: 14px 16px 10px !important;
    }

    .tvk-home .tvk-home-suggestions button {
        min-height: 40px !important;
        font-size: 14px !important;
    }
}

/* ===== Global Godwit font and final visual corrections ===== */
:root {
    --font-family-primary: "Godwit";
    --font-family-stack: "Godwit", "Aptos", "Inter", "Be Vietnam Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --tvk-font: var(--font-family-stack);
}

html,
body,
button,
input,
select,
textarea,
.tvk-home,
.GenZ-app-shell,
.ota-page,
.tvk-hotel-results-page,
.hotel-body {
    font-family: var(--font-family-stack) !important;
}

.navbar-brand,
.room-name,
.room-card h4,
.hotel-section-title,
.tvk-footer-brand {
    font-family: var(--font-family-stack) !important;
}

.tvk-hotel-hero {
    padding-bottom: 132px !important;
}

.tvk-hotel-hero-copy {
    padding-bottom: 34px !important;
}

.tvk-hotel-hero-copy h1 {
    max-width: 900px !important;
    margin-top: 0 !important;
    font-size: clamp(32px, 3.2vw, 46px) !important;
    line-height: 1.18 !important;
}

.tvk-hotel-search-card {
    bottom: -62px !important;
}

.ota-hero-flights .ota-hero-stats span {
    border-color: rgba(255, 255, 255, .72) !important;
    background: rgba(255, 255, 255, .92) !important;
    color: #1f3147 !important;
}

.ota-hero-flights .ota-hero-stats strong {
    color: #102033 !important;
}

/* ===== Hotel page header and hero matched to latest reference ===== */
.tvk-hotel-landing-header {
    background: #fff !important;
    border-bottom: 1px solid #eef1f4 !important;
    box-shadow: 0 8px 24px rgba(31, 45, 61, .06) !important;
}

.tvk-hotel-landing-header .tvk-utility-bar {
    min-height: 68px !important;
    background: #fff !important;
    border: 0 !important;
}

.tvk-hotel-landing-header .tvk-utility-bar .container {
    max-width: 1540px !important;
    justify-content: flex-end !important;
    gap: 18px !important;
    min-height: 68px !important;
}

.tvk-hotel-landing-header .tvk-utility-left,
.tvk-hotel-landing-header .tvk-utility-right {
    display: flex !important;
    align-items: center !important;
    gap: 22px !important;
}

.tvk-hotel-landing-header .tvk-top-brand {
    display: none !important;
}

.tvk-hotel-landing-header .tvk-utility-bar a,
.tvk-hotel-landing-header .tvk-utility-bar span {
    color: #2f363d !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.tvk-hotel-landing-header .tvk-login-link,
.tvk-hotel-landing-header .tvk-register-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 46px !important;
    border-radius: 23px !important;
    padding: 0 18px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

.tvk-hotel-landing-header .tvk-login-link {
    background: #d8f0fb !important;
    color: #005aa8 !important;
}

.tvk-hotel-landing-header .tvk-register-link {
    background: #1498e8 !important;
    color: #fff !important;
}

.tvk-hotel-landing-header .tvk-main-nav {
    min-height: 48px !important;
    background: #fff !important;
    border-top: 0 !important;
    border-bottom: 1px solid #edf1f5 !important;
    box-shadow: none !important;
}

.tvk-hotel-landing-header .tvk-main-nav .container {
    max-width: 1540px !important;
}

.tvk-hotel-landing-header .tvk-brand,
.tvk-hotel-landing-header .tvk-account-nav,
.tvk-hotel-landing-header .tvk-product-nav .nav-item:last-child {
    display: none !important;
}

.tvk-hotel-landing-header .navbar-collapse {
    display: flex !important;
}

.tvk-hotel-landing-header .tvk-product-nav {
    display: flex !important;
    align-items: center !important;
    gap: 28px !important;
    margin: 0 !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-link {
    min-height: 48px !important;
    padding: 0 !important;
    background: transparent !important;
    color: #6b737b !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    box-shadow: none !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-link i {
    display: none !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-link:hover,
.tvk-hotel-landing-header .tvk-product-nav .nav-link:focus {
    color: #1498e8 !important;
}

.tvk-hotel-results-page {
    background: #fff !important;
}

.tvk-hotel-results-page .tvk-main-content {
    background: #fff !important;
}

.tvk-hotel-hero {
    overflow: visible !important;
    padding: 30px 0 142px !important;
    background: #fff !important;
    color: #fff !important;
}

.tvk-hotel-hero::after {
    display: none !important;
}

    .tvk-hotel-hero > .container {
        max-width: 1540px !important;
        min-height: 376px !important;
        overflow: visible !important;
        border-radius: 22px !important;
        background: linear-gradient(180deg, rgba(0, 0, 0, .02) 0%, rgba(0, 0, 0, .08) 46%, rgba(0, 0, 0, .18) 100%), url("https://i.pinimg.com/736x/c1/b8/16/c1b816b5bdc0007fd31e326037eed932.jpg") center 42% / cover no-repeat !important;
        box-shadow: 0 18px 38px rgba(31, 45, 61, .08) !important;
    }

.tvk-hotel-breadcrumb {
    display: none !important;
}

.tvk-hotel-hero-copy {
    position: absolute !important;
    left: 50px !important;
    right: 50px !important;
    bottom: 80px !important;
    width: auto !important;
    max-width: none !important;
    border-radius: 20px !important;
    background: rgba(13, 35, 44, .48) !important;
    padding: 24px 26px 28px !important;
    backdrop-filter: blur(1px) !important;
}

.tvk-hotel-hero-copy h1 {
    max-width: none !important;
    margin: 0 0 8px !important;
    color: #fff !important;
    font-size: 32px !important;
    line-height: 1.22 !important;
    font-weight: 750 !important;
}

.tvk-hotel-hero-copy p {
    max-width: none !important;
    margin: 0 !important;
    color: #fff !important;
    font-size: 18px !important;
    line-height: 1.55 !important;
    font-weight: 450 !important;
}

.tvk-hotel-search-card {
    left: 50px !important;
    right: 50px !important;
    bottom: -130px !important;
    overflow: visible !important;
    border: 1px solid #e7edf3 !important;
    border-radius: 24px !important;
    background: #fff !important;
    box-shadow: 0 16px 34px rgba(31, 45, 61, .08) !important;
}

.tvk-hotel-tabs {
    gap: 20px !important;
    padding: 18px 30px 8px !important;
}

.tvk-hotel-tabs button {
    min-height: 46px !important;
    border-radius: 23px !important;
    padding: 0 18px !important;
    color: #4e5862 !important;
    font-size: 16px !important;
    font-weight: 650 !important;
}

.tvk-hotel-tabs button.active {
    background: #e8f6ff !important;
    color: #0089df !important;
}

.tvk-hotel-search-grid {
    grid-template-columns: minmax(280px, 1.02fr) minmax(340px, 1.12fr) minmax(280px, 1fr) 188px !important;
    gap: 18px !important;
    align-items: start !important;
    padding: 18px 30px 28px !important;
}

.tvk-hotel-search-grid label {
    gap: 7px !important;
}

.tvk-hotel-search-grid label span {
    color: #091827 !important;
    font-size: 14px !important;
    font-weight: 650 !important;
}

.tvk-hotel-search-grid label small {
    margin-left: 6px !important;
    color: #596574 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
}

.tvk-hotel-field {
    grid-template-columns: 34px minmax(0, 1fr) 32px !important;
    min-height: 54px !important;
    border: 1px solid #cbd4dd !important;
    border-radius: 12px !important;
    padding: 0 14px !important;
}

.tvk-hotel-field i {
    color: #111820 !important;
    font-size: 21px !important;
}

.tvk-hotel-field input {
    min-height: 52px !important;
    color: #111820 !important;
    font-size: 18px !important;
    font-weight: 450 !important;
}

.tvk-hotel-field input::placeholder {
    color: #9da6b1 !important;
    font-weight: 450 !important;
}

.tvk-hotel-field em {
    display: inline-grid !important;
    place-items: center !important;
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    background: #dff4ff !important;
    color: #0b7dc5 !important;
    font-style: normal !important;
}

.tvk-hotel-field em i {
    color: #0b7dc5 !important;
    font-size: 12px !important;
}

.tvk-hotel-search-button {
    align-self: end !important;
    min-height: 60px !important;
    border-radius: 999px !important;
    background: #1597e8 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
}

.tvk-hotel-content {
    padding-top: 42px !important;
}

@media (max-width: 1200px) {
    .tvk-hotel-hero > .container,
    .tvk-hotel-landing-header .tvk-utility-bar .container,
    .tvk-hotel-landing-header .tvk-main-nav .container {
        max-width: calc(100% - 32px) !important;
    }

    .tvk-hotel-search-card {
        left: 24px !important;
        right: 24px !important;
    }

    .tvk-hotel-search-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 768px) {
    .tvk-hotel-landing-header .tvk-utility-bar .container,
    .tvk-hotel-landing-header .tvk-main-nav .container {
        max-width: calc(100% - 24px) !important;
    }

    .tvk-hotel-landing-header .tvk-utility-bar .container {
        justify-content: flex-start !important;
        flex-wrap: wrap !important;
        min-height: auto !important;
        padding: 12px 0 !important;
    }

    .tvk-hotel-landing-header .tvk-main-nav {
        min-height: auto !important;
    }

    .tvk-hotel-hero {
        padding-top: 16px !important;
        padding-bottom: 210px !important;
    }

    .tvk-hotel-hero > .container {
        max-width: calc(100% - 24px) !important;
        min-height: 320px !important;
    }

    .tvk-hotel-hero-copy {
        left: 16px !important;
        right: 16px !important;
        bottom: 120px !important;
        padding: 18px !important;
    }

    .tvk-hotel-hero-copy h1 {
        font-size: 24px !important;
    }

    .tvk-hotel-hero-copy p {
        font-size: 14px !important;
    }

    .tvk-hotel-search-card {
        left: 12px !important;
        right: 12px !important;
        bottom: -190px !important;
    }

    .tvk-hotel-search-grid {
        grid-template-columns: 1fr !important;
        padding: 14px !important;
    }
}

/* Last pass: hotel search button must line up with the input row, tabs hidden */
.tvk-hotel-tabs {
    display: none !important;
}

.tvk-hotel-search-grid {
    padding-top: 26px !important;
}

.tvk-hotel-search-button {
    align-self: start !important;
    margin-top: 22px !important;
}

@media (max-width: 768px) {
    .tvk-hotel-search-button {
        margin-top: 0 !important;
    }
}

/* Final hotel top alignment: menu rails match the hero image edges */
.tvk-hotel-landing-header .tvk-utility-bar .container,
.tvk-hotel-landing-header .tvk-main-nav .container,
.tvk-hotel-hero > .container {
    width: min(1540px, calc(100% - 48px)) !important;
    max-width: 1540px !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.tvk-hotel-landing-header .tvk-utility-bar .container {
    justify-content: space-between !important;
}

.tvk-hotel-landing-header .tvk-utility-left,
.tvk-hotel-landing-header .tvk-utility-right {
    flex: 0 0 auto !important;
}

.tvk-hotel-landing-header .tvk-utility-right {
    margin-left: auto !important;
}

.tvk-hotel-landing-header .tvk-product-nav {
    justify-content: flex-start !important;
    width: 100% !important;
    gap: 28px !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-item:first-child .nav-link {
    padding-left: 0 !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-item:last-child {
    display: flex !important;
}

@media (max-width: 1320px) {
    .tvk-hotel-landing-header .tvk-utility-bar .container,
    .tvk-hotel-landing-header .tvk-main-nav .container,
    .tvk-hotel-hero > .container {
        width: calc(100% - 48px) !important;
        max-width: none !important;
    }
}

/* Hotel top header matched to the pasted GenZ header sample */
.tvk-hotel-landing-header {
    background: #fff !important;
    border-bottom: 1px solid #f0f1f2 !important;
    box-shadow: 0 2px 24px rgba(11, 11, 11, .10) !important;
}

.tvk-hotel-landing-header .tvk-utility-bar {
    min-height: 72px !important;
    background: #fff !important;
}

.tvk-hotel-landing-header .tvk-utility-bar .container,
.tvk-hotel-landing-header .tvk-main-nav .container {
    width: min(1232px, calc(100% - 48px)) !important;
    max-width: 1232px !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.tvk-hotel-landing-header .tvk-utility-bar .container {
    min-height: 72px !important;
    justify-content: flex-end !important;
    gap: 24px !important;
}

.tvk-hotel-landing-header .tvk-utility-left,
.tvk-hotel-landing-header .tvk-utility-right {
    gap: 12px !important;
}

.tvk-hotel-landing-header .tvk-utility-bar a {
    min-height: 40px !important;
    border-radius: 8px !important;
    padding: 0 10px !important;
    background: transparent !important;
    color: #242628 !important;
    font-size: 16px !important;
    line-height: 24px !important;
    font-weight: 600 !important;
}

.tvk-hotel-landing-header .tvk-utility-bar a:hover,
.tvk-hotel-landing-header .tvk-utility-bar a:focus {
    background: #f0f2f4 !important;
    color: #242628 !important;
}

.tvk-hotel-landing-header .tvk-utility-bar a.tvk-menu-highlight {
    background: transparent !important;
    color: #242628 !important;
}

.tvk-hotel-landing-header .tvk-login-link,
.tvk-hotel-landing-header .tvk-register-link {
    min-height: 48px !important;
    border-radius: 24px !important;
    padding: 0 20px !important;
    font-size: 16px !important;
    line-height: 24px !important;
    font-weight: 600 !important;
}

.tvk-hotel-landing-header .tvk-login-link {
    min-width: 144px !important;
    background: #d1f0ff !important;
    color: #024590 !important;
}

.tvk-hotel-landing-header .tvk-register-link {
    min-width: 101px !important;
    background: #0a9af2 !important;
    color: #fff !important;
}

.tvk-hotel-landing-header .tvk-login-link:hover,
.tvk-hotel-landing-header .tvk-login-link:focus {
    background: #d1f0ff !important;
    color: #024590 !important;
}

.tvk-hotel-landing-header .tvk-register-link:hover,
.tvk-hotel-landing-header .tvk-register-link:focus {
    background: #0a9af2 !important;
    color: #fff !important;
}

.tvk-hotel-landing-header .tvk-main-nav {
    min-height: 50px !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    background: #fff !important;
}

.tvk-hotel-landing-header .navbar-collapse {
    min-height: 50px !important;
}

.tvk-hotel-landing-header .tvk-product-nav {
    gap: 10px !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-link {
    min-height: 42px !important;
    border-radius: 8px !important;
    padding: 0 14px !important;
    background: transparent !important;
    color: #707577 !important;
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 600 !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-link:hover,
.tvk-hotel-landing-header .tvk-product-nav .nav-link:focus {
    background: #f0f2f4 !important;
    color: #707577 !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-link.tvk-menu-highlight {
    background: transparent !important;
    color: #707577 !important;
}

@media (max-width: 1320px) {
    .tvk-hotel-landing-header .tvk-utility-bar .container,
    .tvk-hotel-landing-header .tvk-main-nav .container {
        width: calc(100% - 48px) !important;
    }
}

/* Last pass: hotel search button must line up with the input row, tabs hidden */
.tvk-hotel-tabs {
    display: none !important;
}

.tvk-hotel-search-grid {
    padding-top: 26px !important;
}

.tvk-hotel-search-button {
    align-self: start !important;
    margin-top: 22px !important;
}

@media (max-width: 768px) {
    .tvk-hotel-search-button {
        margin-top: 0 !important;
    }
}

/* Hotel search refinement: remove property tabs and align submit with inputs */
.tvk-hotel-tabs {
    display: none !important;
}

.tvk-hotel-search-grid {
    padding-top: 26px !important;
}

.tvk-hotel-search-button {
    align-self: start !important;
    margin-top: 22px !important;
}

@media (max-width: 768px) {
    .tvk-hotel-search-button {
        margin-top: 0 !important;
    }
}

/* Final hotel header sizing/alignment to match the compact GenZ reference */
.tvk-hotel-landing-header {
    box-shadow: none !important;
}

.tvk-hotel-landing-header .tvk-utility-bar,
.tvk-hotel-landing-header .tvk-utility-bar .container {
    min-height: 86px !important;
}

.tvk-hotel-landing-header .tvk-main-nav {
    min-height: 62px !important;
}

.tvk-hotel-landing-header .tvk-utility-bar .container,
.tvk-hotel-landing-header .tvk-main-nav .container {
    width: min(1500px, calc(100% - 400px)) !important;
    max-width: 1500px !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.tvk-hotel-landing-header .tvk-utility-left,
.tvk-hotel-landing-header .tvk-utility-right {
    gap: 14px !important;
}

.tvk-hotel-landing-header .tvk-utility-bar .container {
    gap: 18px !important;
    justify-content: flex-end !important;
}

.tvk-hotel-landing-header .tvk-utility-bar a {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 44px !important;
    border-radius: 7px !important;
    padding: 0 11px !important;
    color: #20272d !important;
    font-size: 15px !important;
    font-weight: 600 !important;
}

.tvk-hotel-landing-header .tvk-utility-bar a:hover,
.tvk-hotel-landing-header .tvk-utility-bar a:focus,
.tvk-hotel-landing-header .tvk-utility-bar a.tvk-menu-highlight {
    background: #f0f2f4 !important;
    color: #20272d !important;
}

.tvk-hotel-landing-header .tvk-login-link,
.tvk-hotel-landing-header .tvk-register-link {
    min-height: 60px !important;
    border-radius: 30px !important;
    padding: 0 24px !important;
    font-size: 15px !important;
}

.tvk-hotel-landing-header .tvk-login-link {
    background: #d8f0fb !important;
    color: #064e92 !important;
}

.tvk-hotel-landing-header .tvk-login-link:hover,
.tvk-hotel-landing-header .tvk-login-link:focus {
    background: #d8f0fb !important;
    color: #064e92 !important;
}

.tvk-hotel-landing-header .tvk-register-link:hover,
.tvk-hotel-landing-header .tvk-register-link:focus {
    background: #1498e8 !important;
    color: #fff !important;
}

.tvk-hotel-landing-header .tvk-product-nav {
    gap: 24px !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-link {
    min-height: 44px !important;
    border-radius: 7px !important;
    padding: 0 10px !important;
    color: #6b737b !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-link:hover,
.tvk-hotel-landing-header .tvk-product-nav .nav-link:focus,
.tvk-hotel-landing-header .tvk-product-nav .nav-link.tvk-menu-highlight {
    background: #f0f2f4 !important;
    color: #6b737b !important;
}

@media (max-width: 1700px) {
    .tvk-hotel-landing-header .tvk-utility-bar .container,
    .tvk-hotel-landing-header .tvk-main-nav .container {
        width: calc(100% - 48px) !important;
        max-width: 1500px !important;
    }
}

/* Final hotel hero/search sizing from the 1232x300 GenZ reference */
.tvk-hotel-hero {
    padding: 30px 0 116px !important;
}

    .tvk-hotel-hero > .container {
        width: min(1232px, calc(100% - 48px)) !important;
        max-width: 1232px !important;
        height: 300px !important;
        min-height: 300px !important;
        border-radius: 20px !important;
        background: linear-gradient(180deg, rgba(0, 0, 0, .02) 0%, rgba(0, 0, 0, .06) 44%, rgba(0, 0, 0, .16) 100%), url("https://i.pinimg.com/736x/c1/b8/16/c1b816b5bdc0007fd31e326037eed932.jpg") 50% 50% / 100% 100% no-repeat !important;
    }

.tvk-hotel-hero-copy {
    left: 50px !important;
    right: 50px !important;
    bottom: 66px !important;
    border-radius: 18px !important;
    padding: 18px 22px 20px !important;
}

.tvk-hotel-hero-copy h1 {
    margin-bottom: 6px !important;
    font-size: 30px !important;
    line-height: 1.18 !important;
    font-weight: 700 !important;
}

.tvk-hotel-hero-copy p {
    font-size: 16px !important;
    line-height: 1.4 !important;
    font-weight: 400 !important;
}

.tvk-hotel-search-card {
    left: 50px !important;
    right: 50px !important;
    bottom: -118px !important;
    border-radius: 22px !important;
}

.tvk-hotel-tabs {
    gap: 18px !important;
    padding: 14px 30px 6px !important;
}

.tvk-hotel-tabs button {
    min-height: 40px !important;
    border-radius: 20px !important;
    padding: 0 16px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.tvk-hotel-search-grid {
    grid-template-columns: minmax(260px, 1fr) minmax(320px, 1.1fr) minmax(260px, 1fr) 150px !important;
    gap: 14px !important;
    padding: 14px 30px 26px !important;
}

.tvk-hotel-search-grid label {
    gap: 6px !important;
}

.tvk-hotel-search-grid label span {
    font-size: 12px !important;
    line-height: 16px !important;
    font-weight: 600 !important;
}

.tvk-hotel-search-grid label small {
    font-size: 10px !important;
    line-height: 12px !important;
    font-weight: 600 !important;
}

.tvk-hotel-field {
    grid-template-columns: 34px minmax(0, 1fr) 28px !important;
    min-height: 42px !important;
    border-color: #c1c4c6 !important;
    border-radius: 9px !important;
    padding: 0 12px !important;
}

.tvk-hotel-field i {
    color: #242628 !important;
    font-size: 22px !important;
}

.tvk-hotel-field input {
    min-height: 26px !important;
    color: #242628 !important;
    font-size: 15px !important;
    line-height: 24px !important;
    font-weight: 400 !important;
}

.tvk-hotel-field input::placeholder {
    color: #9ca3ad !important;
    font-weight: 400 !important;
}

.tvk-hotel-field em {
    width: 24px !important;
    height: 24px !important;
    background: #d1f0ff !important;
}

.tvk-hotel-field em i {
    font-size: 11px !important;
}

.tvk-hotel-search-button {
    min-height: 48px !important;
    width: 150px !important;
    border-radius: 24px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
}

.tvk-hotel-search-button i {
    font-size: 22px !important;
}

.tvk-hotel-content {
    padding-top: 36px !important;
}

@media (max-width: 1320px) {
    .tvk-hotel-hero > .container {
        width: calc(100% - 48px) !important;
    }
}

@media (max-width: 1200px) {
    .tvk-hotel-search-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .tvk-hotel-search-button {
        width: 150px !important;
    }
}

@media (max-width: 768px) {
    .tvk-hotel-hero {
        padding: 16px 0 200px !important;
    }

    .tvk-hotel-hero > .container {
        width: calc(100% - 24px) !important;
        height: 300px !important;
        min-height: 300px !important;
    }

    .tvk-hotel-hero-copy {
        left: 16px !important;
        right: 16px !important;
        bottom: 118px !important;
    }

    .tvk-hotel-search-card {
        left: 12px !important;
        right: 12px !important;
        bottom: -190px !important;
    }

    .tvk-hotel-search-grid {
        grid-template-columns: 1fr !important;
        padding: 14px !important;
    }
}

/* Last pass: hotel search button must line up with the input row, tabs hidden */
.tvk-hotel-tabs {
    display: none !important;
}

.tvk-hotel-search-grid {
    padding-top: 26px !important;
}

.tvk-hotel-search-button {
    align-self: start !important;
    margin-top: 22px !important;
}

@media (max-width: 768px) {
    .tvk-hotel-search-button {
        margin-top: 0 !important;
    }
}

/* Absolute final hotel top alignment: menu rails match the hero image edges */
.tvk-hotel-landing-header .tvk-utility-bar .container,
.tvk-hotel-landing-header .tvk-main-nav .container,
.tvk-hotel-hero > .container {
    width: min(1540px, calc(100% - 48px)) !important;
    max-width: 1540px !important;
    margin-right: auto !important;
    margin-left: auto !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.tvk-hotel-landing-header .tvk-utility-bar .container {
    justify-content: space-between !important;
}

.tvk-hotel-landing-header .tvk-utility-left,
.tvk-hotel-landing-header .tvk-utility-right {
    flex: 0 0 auto !important;
}

.tvk-hotel-landing-header .tvk-utility-right {
    margin-left: auto !important;
}

.tvk-hotel-landing-header .tvk-product-nav {
    justify-content: flex-start !important;
    width: 100% !important;
    gap: 28px !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-item:first-child .nav-link {
    padding-left: 0 !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-item:last-child {
    display: flex !important;
}

@media (max-width: 1320px) {
    .tvk-hotel-landing-header .tvk-utility-bar .container,
    .tvk-hotel-landing-header .tvk-main-nav .container,
    .tvk-hotel-hero > .container {
        width: calc(100% - 48px) !important;
        max-width: none !important;
    }
}

/* Extra side whitespace on the hotel page top area */
.tvk-hotel-landing-header .tvk-utility-bar .container,
.tvk-hotel-landing-header .tvk-main-nav .container,
.tvk-hotel-hero > .container {
    width: min(1360px, calc(100% - 160px)) !important;
    max-width: 1360px !important;
    margin-right: auto !important;
    margin-left: auto !important;
}

.tvk-hotel-search-card {
    left: 50px !important;
    right: 50px !important;
}

@media (max-width: 1320px) {
    .tvk-hotel-landing-header .tvk-utility-bar .container,
    .tvk-hotel-landing-header .tvk-main-nav .container,
    .tvk-hotel-hero > .container {
        width: calc(100% - 48px) !important;
        max-width: none !important;
    }
}

/* Final hotel auth/menu colors */
.tvk-hotel-landing-header .tvk-utility-bar a.tvk-login-link {
    min-height: 48px !important;
    min-width: 144px !important;
    border-radius: 999px !important;
    padding: 0 22px !important;
    background: #9bd8f5 !important;
    color: #034b91 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
}

.tvk-hotel-landing-header .tvk-utility-bar a.tvk-register-link {
    min-height: 48px !important;
    min-width: 122px !important;
    border-radius: 999px !important;
    padding: 0 24px !important;
    background: #1597e8 !important;
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
}

.tvk-hotel-landing-header .tvk-utility-bar a.tvk-login-link:hover,
.tvk-hotel-landing-header .tvk-utility-bar a.tvk-login-link:focus {
    background: #9bd8f5 !important;
    color: #034b91 !important;
}

.tvk-hotel-landing-header .tvk-utility-bar a.tvk-register-link:hover,
.tvk-hotel-landing-header .tvk-utility-bar a.tvk-register-link:focus {
    background: #1597e8 !important;
    color: #fff !important;
}

.tvk-hotel-landing-header .tvk-utility-bar a:not(.tvk-login-link):not(.tvk-register-link),
.tvk-hotel-landing-header .tvk-product-nav .nav-link {
    background: transparent !important;
}

.tvk-hotel-landing-header .tvk-utility-bar a:not(.tvk-login-link):not(.tvk-register-link):hover,
.tvk-hotel-landing-header .tvk-utility-bar a:not(.tvk-login-link):not(.tvk-register-link):focus,
.tvk-hotel-landing-header .tvk-product-nav .nav-link:hover,
.tvk-hotel-landing-header .tvk-product-nav .nav-link:focus {
    background: transparent !important;
}

/* Absolute cleanup for stale rendered hotel header markup */
.tvk-hotel-landing-header .tvk-utility-right a[href="/Bookings"] i,
.tvk-hotel-landing-header .tvk-utility-right a[href*="/History/Bookings"] i {
    display: none !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-link.tvk-menu-highlight,
.tvk-hotel-landing-header .tvk-product-nav .nav-link.tvk-menu-highlight:hover,
.tvk-hotel-landing-header .tvk-product-nav .nav-link.tvk-menu-highlight:focus {
    background: transparent !important;
}

/* Hotel header: keep top utility links next to "Dat cho cua toi" */
.tvk-hotel-landing-header .tvk-utility-left {
    gap: 0 !important;
}

.tvk-hotel-landing-header .tvk-utility-right {
    gap: 28px !important;
    align-items: center !important;
    margin-left: auto !important;
}

.tvk-hotel-landing-header .tvk-utility-right a:not(.tvk-login-link):not(.tvk-register-link) {
    min-height: 42px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
}

@media (max-width: 992px) {
    .tvk-hotel-landing-header .tvk-utility-bar .container {
        align-items: flex-start !important;
        gap: 14px !important;
    }

    .tvk-hotel-landing-header .tvk-utility-right {
        flex-wrap: wrap !important;
        gap: 10px 18px !important;
    }
}

/* Hotel service menu: make product buttons sit closer together */
.tvk-hotel-landing-header .tvk-product-nav {
    gap: 14px !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-link {
    padding-right: 6px !important;
    padding-left: 6px !important;
}

@media (max-width: 1200px) {
    .tvk-hotel-landing-header .tvk-product-nav {
        gap: 8px !important;
    }
}

/* Hotel menu divider: subtle shadow under the product nav line */
.tvk-hotel-landing-header .tvk-main-nav {
    border-bottom: 1px solid #eef1f4 !important;
    box-shadow: 0 8px 18px rgba(15, 35, 55, .08) !important;
}

/* Hotel logged-in state: show account in the top utility row */
.tvk-hotel-landing-header .tvk-hotel-user-menu {
    display: inline-flex !important;
    align-items: center !important;
}

.tvk-hotel-landing-header .tvk-utility-bar .tvk-hotel-user-menu > .tvk-user-pill {
    min-height: 42px !important;
    border-radius: 999px !important;
    padding: 0 14px 0 8px !important;
    gap: 8px !important;
    background: #f2f7fb !important;
    color: #034b91 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

.tvk-hotel-landing-header .tvk-utility-bar .tvk-hotel-user-menu > .tvk-user-pill span {
    width: 28px !important;
    height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: #d1f0ff !important;
    color: #0a8fdc !important;
}

.tvk-hotel-landing-header .tvk-utility-bar .tvk-hotel-user-menu > .tvk-user-pill:hover,
.tvk-hotel-landing-header .tvk-utility-bar .tvk-hotel-user-menu > .tvk-user-pill:focus {
    background: #e7f5fc !important;
    color: #034b91 !important;
}

/* Flight landing: match the hotel menu/search language with a GenZ-style flight search */
.flights-page {
    background: #fff !important;
    padding-bottom: 60px !important;
}

.flights-page > .ota-hero-flights,
.flights-page > .container > .ota-search-shell {
    display: none !important;
}

.tvk-flight-hero {
    background: #fff !important;
    padding: 20px 0 218px !important;
}

    .tvk-flight-hero > .container {
        position: relative !important;
        width: min(1632px, calc(100% - 270px)) !important;
        max-width: 1632px !important;
        height: 412px !important;
        min-height: 412px !important;
        border-radius: 20px !important;
        background: linear-gradient(180deg, rgba(0, 0, 0, .02) 0%, rgba(0, 0, 0, .08) 45%, rgba(0, 0, 0, .30) 100%), url("https://i.pinimg.com/1200x/3e/80/1a/3e801a8beca80b5d5e5bf892f06728a6.jpg") 50% 48% / cover no-repeat !important;
        box-shadow: 0 20px 44px rgba(15, 35, 55, .08) !important;
    }

.tvk-flight-hero-copy {
    position: absolute !important;
    left: 56px !important;
    right: 56px !important;
    bottom: 102px !important;
    color: #fff !important;
    z-index: 2 !important;
}

.tvk-flight-hero-copy h1 {
    margin: 0 !important;
    color: #fff !important;
    font-size: 31px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, .28) !important;
}

.tvk-flight-search-card {
    position: absolute !important;
    left: 52px !important;
    right: 52px !important;
    bottom: -204px !important;
    z-index: 3 !important;
    display: grid !important;
    gap: 24px !important;
    border-radius: 22px !important;
    background: #fff !important;
    padding: 46px 30px 30px !important;
    box-shadow: 0 18px 42px rgba(20, 43, 67, .10) !important;
}

.tvk-flight-search-top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 24px !important;
}

.tvk-flight-tabs,
.tvk-flight-options {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
}

.tvk-flight-tabs button,
.tvk-flight-options button,
.tvk-flight-checkbox {
    min-height: 40px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #f2f8fc !important;
    color: #005fae !important;
    padding: 0 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
}

.tvk-flight-tabs button.active {
    background: #d1f0ff !important;
}

.tvk-flight-options button,
.tvk-flight-checkbox {
    background: transparent !important;
}

.tvk-flight-checkbox input {
    width: 28px !important;
    height: 28px !important;
    margin: 0 !important;
    border: 1px solid #0194f3 !important;
    border-radius: 6px !important;
    appearance: none !important;
    position: relative !important;
    background: #f7fbff !important;
    flex: 0 0 auto !important;
}

.tvk-flight-checkbox input:checked {
    background: #e9ffe7 !important;
}

.tvk-flight-checkbox input:checked::after {
    content: "✓" !important;
    position: absolute !important;
    inset: 0 !important;
    display: grid !important;
    place-items: center !important;
    color: #16a34a !important;
    font-size: 17px !important;
    font-weight: 900 !important;
}

.tvk-flight-search-grid {
    display: grid !important;
    grid-template-columns: minmax(220px, .9fr) 52px minmax(220px, .9fr) minmax(185px, .72fr) minmax(185px, .72fr) 1.12fr !important;
    gap: 16px !important;
    align-items: end !important;
}

.tvk-flight-field-wrap {
    display: grid !important;
    gap: 8px !important;
    margin: 0 !important;
}

.tvk-flight-swap-button {
    width: 48px !important;
    height: 48px !important;
    align-self: end !important;
    justify-self: center !important;
    margin-bottom: 12px !important;
    border: 4px solid #fff !important;
    border-radius: 50% !important;
    background: #1597e8 !important;
    color: #fff !important;
    display: inline-grid !important;
    place-items: center !important;
    padding: 0 !important;
    box-shadow: 0 5px 14px rgba(21, 151, 232, .28) !important;
    cursor: pointer !important;
    position: relative !important;
    z-index: 3 !important;
    transition: transform .2s ease, background .2s ease, box-shadow .2s ease !important;
}

.tvk-flight-swap-button i {
    color: #fff !important;
    font-size: 16px !important;
}

.tvk-flight-swap-button:hover {
    background: #078bd0 !important;
    box-shadow: 0 7px 18px rgba(21, 151, 232, .34) !important;
    transform: scale(1.06) !important;
}

.tvk-flight-swap-button.is-swapping {
    animation: tvk-flight-swap-spin .28s ease;
}

@keyframes tvk-flight-swap-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(180deg); }
}

.tvk-flight-field-wrap > span {
    color: #111827 !important;
    font-size: 13px !important;
    line-height: 18px !important;
    font-weight: 700 !important;
}

.tvk-flight-field {
    min-height: 72px !important;
    border: 1px solid #c8d0d8 !important;
    border-radius: 9px !important;
    background: #fff !important;
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) 28px !important;
    align-items: center !important;
    padding: 0 14px !important;
}

.tvk-flight-field i {
    color: #48515a !important;
    font-size: 22px !important;
}

.tvk-flight-field input {
    min-width: 0 !important;
    width: 100% !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    color: #111827 !important;
    font-size: 17px !important;
    line-height: 24px !important;
    font-weight: 500 !important;
}

.tvk-flight-field em {
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    background: #d1f0ff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #1296e8 !important;
}

.tvk-flight-field em i {
    color: inherit !important;
    font-size: 14px !important;
}

.tvk-flight-search-button {
    min-height: 60px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #1597e8 !important;
    color: #fff !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    padding: 0 28px !important;
    box-shadow: 0 12px 24px rgba(21, 151, 232, .22) !important;
}

.tvk-flight-inspiration {
    width: fit-content !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: #0064c8 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

.tvk-flight-picker {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
}

.tvk-flight-picker > button[aria-expanded="true"],
.tvk-flight-picker.is-open > button {
    color: #005fae !important;
}

.tvk-flight-picker.is-open > button .fa-chevron-down {
    transform: rotate(180deg) !important;
}

.tvk-flight-passenger-panel,
.tvk-flight-cabin-panel {
    position: absolute !important;
    top: calc(100% + 12px) !important;
    right: 0 !important;
    z-index: 30 !important;
    display: none !important;
    background: #fff !important;
    box-shadow: 0 16px 38px rgba(15, 35, 55, .12) !important;
}

.tvk-flight-picker.is-open .tvk-flight-passenger-panel,
.tvk-flight-picker.is-open .tvk-flight-cabin-panel {
    display: block !important;
}

.tvk-flight-passenger-panel {
    width: 400px !important;
    padding: 22px 20px 20px !important;
}

.tvk-passenger-row {
    display: grid !important;
    grid-template-columns: 34px minmax(120px, 1fr) 40px 46px 40px !important;
    gap: 10px !important;
    align-items: center !important;
    margin-bottom: 18px !important;
}

.tvk-passenger-row > i {
    width: 30px !important;
    height: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #737b84 !important;
    font-size: 22px !important;
}

.tvk-passenger-row strong {
    display: block !important;
    color: #050b12 !important;
    font-size: 20px !important;
    line-height: 24px !important;
    font-weight: 800 !important;
}

.tvk-passenger-row span {
    display: block !important;
    color: #5f6872 !important;
    font-size: 14px !important;
    line-height: 18px !important;
    font-weight: 500 !important;
}

.tvk-passenger-row button {
    width: 40px !important;
    height: 40px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #d1f0ff !important;
    color: #0194f3 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 24px !important;
    line-height: 1 !important;
    font-weight: 500 !important;
}

.tvk-passenger-row button:disabled {
    opacity: .7 !important;
    color: #8fb8cf !important;
}

.tvk-passenger-row output {
    min-width: 46px !important;
    height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-bottom: 1px solid #c8d0d8 !important;
    color: #020817 !important;
    font-size: 20px !important;
    font-weight: 500 !important;
}

.tvk-passenger-done {
    width: 160px !important;
    min-height: 40px !important;
    margin: 12px 0 0 auto !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #d1f0ff !important;
    color: #005fae !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 16px !important;
    font-weight: 700 !important;
}

.tvk-flight-cabin-panel {
    width: 272px !important;
    padding: 0 !important;
}

.tvk-flight-cabin-panel button {
    width: 100% !important;
    min-height: 56px !important;
    border: 0 !important;
    border-bottom: 1px solid #edf0f3 !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: #050b12 !important;
    padding: 0 30px !important;
    justify-content: flex-start !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    text-align: left !important;
}

.tvk-flight-cabin-panel button.active,
.tvk-flight-cabin-panel button:hover {
    background: #fffef6 !important;
    font-weight: 800 !important;
}

/* Flight search compact typography */
.tvk-flight-tabs button,
.tvk-flight-options button,
.tvk-flight-checkbox {
    font-size: 13px !important;
    font-weight: 700 !important;
}

.tvk-flight-field-wrap > span {
    font-size: 12px !important;
    line-height: 16px !important;
}

.tvk-flight-field input {
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 500 !important;
}

.tvk-flight-field i {
    font-size: 19px !important;
}

.tvk-flight-search-button {
    font-size: 16px !important;
    font-weight: 700 !important;
}

.tvk-flight-inspiration {
    font-size: 13px !important;
}

.tvk-passenger-row strong {
    font-size: 17px !important;
    line-height: 21px !important;
}

.tvk-passenger-row span {
    font-size: 13px !important;
}

.tvk-passenger-row output {
    font-size: 18px !important;
}

.tvk-flight-cabin-panel button {
    font-size: 16px !important;
}

/* Flight date fields: keep the full date visible */
.tvk-flight-field:has(input[type="date"]) {
    grid-template-columns: 30px minmax(112px, 1fr) 28px !important;
    padding-right: 10px !important;
    padding-left: 10px !important;
}

.tvk-flight-field input[type="date"] {
    min-width: 112px !important;
    padding-right: 0 !important;
    font-size: 13px !important;
    letter-spacing: 0 !important;
}

.tvk-flight-field input[type="date"]::-webkit-calendar-picker-indicator {
    display: none !important;
    opacity: 0 !important;
    -webkit-appearance: none !important;
}

/* Flight city and date picker panels */
.tvk-flight-field-wrap.is-focused .tvk-flight-field {
    border-color: #70d600 !important;
    box-shadow: 0 0 0 2px rgba(112, 214, 0, .16) !important;
}

.tvk-flight-airport-wrap {
    position: relative !important;
}

.tvk-flight-airport-panel {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    z-index: 60 !important;
    width: 720px !important;
    max-width: min(720px, calc(100vw - 40px)) !important;
    max-height: 430px !important;
    display: none !important;
    overflow: auto !important;
    border: 1px solid #e5ebf0 !important;
    border-radius: 8px !important;
    background: #fff !important;
    box-shadow: 0 18px 42px rgba(15, 35, 55, .14) !important;
}

.tvk-flight-airport-panel.is-open {
    display: block !important;
}

.tvk-flight-airport-title {
    position: sticky !important;
    top: 0 !important;
    z-index: 1 !important;
    background: #fff !important;
    border-bottom: 1px solid #edf1f5 !important;
    padding: 14px 20px !important;
    color: #627080 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

.tvk-flight-airport-list {
    display: grid !important;
}

.tvk-flight-airport-list button {
    min-height: 78px !important;
    border: 0 !important;
    border-bottom: 1px solid #edf1f5 !important;
    background: #fff !important;
    color: #0f172a !important;
    padding: 12px 20px !important;
    display: grid !important;
    grid-template-columns: 26px 1fr !important;
    gap: 14px !important;
    align-items: center !important;
    text-align: left !important;
}

.tvk-flight-airport-list button:hover,
.tvk-flight-airport-list button:first-child {
    background: #eef8fd !important;
}

.tvk-flight-airport-list button > i {
    color: #4b5563 !important;
    font-size: 17px !important;
}

.tvk-flight-airport-list strong {
    color: #111827 !important;
    font-size: 16px !important;
    font-weight: 800 !important;
}

.tvk-flight-airport-list em {
    margin-left: 8px !important;
    color: #66788a !important;
    font-style: normal !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

.tvk-flight-airport-list small {
    display: block !important;
    margin-top: 3px !important;
    color: #66788a !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

.tvk-flight-date-panel {
    position: absolute !important;
    left: -24px !important;
    right: -24px !important;
    top: 190px !important;
    z-index: 55 !important;
    display: none !important;
    border: 1px solid #e7edf3 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 18px 44px rgba(15, 35, 55, .12) !important;
    padding: 20px 24px 18px !important;
}

.tvk-flight-date-panel.is-open {
    display: block !important;
}

.tvk-flight-calendar-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 26px !important;
}

.tvk-flight-calendar-month h3 {
    margin: 4px 0 16px !important;
    color: #001f5c !important;
    font-size: 22px !important;
    line-height: 28px !important;
    font-weight: 800 !important;
    text-align: center !important;
}

.tvk-flight-calendar-weekdays,
.tvk-flight-calendar-days {
    display: grid !important;
    grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
}

.tvk-flight-calendar-weekdays {
    border-bottom: 1px solid #edf1f5 !important;
    color: #6b7280 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-align: center !important;
}

.tvk-flight-calendar-weekdays span {
    padding-bottom: 8px !important;
}

.tvk-flight-calendar-weekdays span:last-child {
    color: #e11d48 !important;
}

.tvk-flight-calendar-days button,
.tvk-flight-calendar-days > span {
    min-height: 82px !important;
    border: 0 !important;
    border-bottom: 1px solid #eef2f6 !important;
    background: #fff !important;
    color: #001f5c !important;
    display: grid !important;
    align-content: center !important;
    justify-items: center !important;
    gap: 6px !important;
    padding: 4px !important;
}

.tvk-flight-calendar-days button strong {
    min-width: 40px !important;
    height: 40px !important;
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 17px !important;
    font-weight: 700 !important;
}

.tvk-flight-calendar-days button small {
    color: #697586 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}

.tvk-flight-calendar-days button:nth-child(7n) strong,
.tvk-flight-calendar-days button:nth-child(7n) small {
    color: #e11d48 !important;
}

.tvk-flight-calendar-days button.is-today {
    background: #eef8fd !important;
}

.tvk-flight-calendar-days button.is-selected strong {
    border: 2px solid #70d600 !important;
    background: #edffd7 !important;
    color: #0071ce !important;
}

.tvk-flight-calendar-nav {
    position: absolute !important;
    top: 30px !important;
    width: 36px !important;
    height: 36px !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: transparent !important;
    color: #6b7280 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.tvk-flight-calendar-nav.prev {
    left: 18px !important;
}

.tvk-flight-calendar-nav.next {
    right: 18px !important;
}

.tvk-flight-search-card[data-flight-trip-mode="multicity"] .tvk-flight-date-panel {
    top: 250px !important;
}

.tvk-flight-content {
    width: min(1632px, calc(100% - 270px)) !important;
    max-width: 1632px !important;
}

@media (max-width: 1500px) {
    .tvk-flight-hero > .container,
    .tvk-flight-content {
        width: calc(100% - 48px) !important;
        max-width: none !important;
    }
}

@media (max-width: 768px) {
    .tvk-flight-hero {
        padding: 16px 0 420px !important;
    }

    .tvk-flight-hero > .container {
        width: calc(100% - 24px) !important;
        height: 360px !important;
        min-height: 360px !important;
    }

    .tvk-flight-hero-copy {
        left: 18px !important;
        right: 18px !important;
        bottom: 214px !important;
    }

    .tvk-flight-hero-copy h1 {
        font-size: 24px !important;
    }

    .tvk-flight-search-card {
        left: 12px !important;
        right: 12px !important;
        bottom: -405px !important;
        padding: 18px !important;
    }

    .tvk-flight-search-top,
    .tvk-flight-search-grid {
        grid-template-columns: 1fr !important;
        align-items: stretch !important;
    }

    

    .tvk-flight-search-top {
        flex-direction: column !important;
    }

    .tvk-flight-search-button {
        width: 100% !important;
    }

    .tvk-flight-content {
        width: calc(100% - 24px) !important;
    }
}

/* Flight search modes */
.tvk-flight-search-card[data-flight-trip-mode="multicity"] {
    bottom: -330px !important;
    padding-top: 34px !important;
}

.tvk-flight-hero[data-flight-trip-mode="multicity"] {
    padding-bottom: 350px !important;
}

.tvk-flight-search-card[data-flight-trip-mode="multicity"] .tvk-flight-search-grid {
    display: none !important;
}

.tvk-flight-search-card:not([data-flight-trip-mode="multicity"]) .tvk-flight-multicity-grid {
    display: none !important;
}

.tvk-flight-return-wrap.is-disabled > span {
    color: #9aa4af !important;
}

.tvk-flight-return-wrap.is-disabled .tvk-flight-field {
    background: #f0f2f4 !important;
    border-color: #cfd5dc !important;
    cursor: not-allowed !important;
}

.tvk-flight-return-wrap.is-disabled .tvk-flight-field i,
.tvk-flight-return-wrap.is-disabled .tvk-flight-field input {
    color: #8b96a3 !important;
    cursor: not-allowed !important;
}

.tvk-flight-return-wrap.is-disabled .tvk-flight-field em {
    display: none !important;
}

.tvk-flight-multicity-grid {
    display: grid !important;
    grid-template-columns: minmax(240px, 1fr) minmax(240px, 1fr) minmax(360px, 2fr) !important;
    gap: 14px 16px !important;
    align-items: end !important;
}

.tvk-flight-date-wide {
    min-width: 0 !important;
}

.tvk-flight-add-leg {
    width: fit-content !important;
    min-height: 40px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #d1f0ff !important;
    color: #005fae !important;
    padding: 0 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

.tvk-flight-search-button-wide {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-height: 60px !important;
}

.tvk-flight-search-card[data-flight-trip-mode="multicity"] + .tvk-flight-inspiration,
.tvk-flight-search-card[data-flight-trip-mode="multicity"] .tvk-flight-inspiration {
    margin-top: -4px !important;
}

@media (max-width: 1500px) {
    .tvk-flight-search-card[data-flight-trip-mode="multicity"] {
        bottom: -344px !important;
    }
}

@media (max-width: 1200px) {
    .tvk-flight-multicity-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .tvk-flight-date-wide,
    .tvk-flight-search-button-wide {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 768px) {
    .tvk-flight-hero[data-flight-trip-mode="multicity"] {
        padding-bottom: 640px !important;
    }

    .tvk-flight-search-card[data-flight-trip-mode="multicity"] {
        bottom: -620px !important;
    }

    .tvk-flight-multicity-grid {
        grid-template-columns: 1fr !important;
    }

    .tvk-flight-date-wide {
        grid-column: auto !important;
    }
}

/* Main nav dropdown: keep text visible on the white More menu */
.tvk-main-nav .tvk-nav-menu .dropdown-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    color: #1f2937 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 20px !important;
    opacity: 1 !important;
}

.tvk-main-nav .tvk-nav-menu .dropdown-item i {
    width: 20px !important;
    color: #6b7280 !important;
    opacity: 1 !important;
    text-align: center !important;
}

.tvk-main-nav .tvk-nav-menu .dropdown-item:hover,
.tvk-main-nav .tvk-nav-menu .dropdown-item:focus {
    background: #f2f8fc !important;
    color: #005fae !important;
}

.tvk-main-nav .tvk-nav-menu .dropdown-item:hover i,
.tvk-main-nav .tvk-nav-menu .dropdown-item:focus i {
    color: #005fae !important;
}

/* Strong override for Home More/Other dropdown text visibility */
.tvk-app-header .tvk-main-nav ul.tvk-more-dropdown-menu {
    min-width: 300px !important;
    padding: 12px !important;
    background: #fff !important;
    border: 0 !important;
    border-radius: 8px !important;
    box-shadow: 0 14px 38px rgba(15, 35, 55, .18) !important;
}

.tvk-app-header .tvk-main-nav ul.tvk-more-dropdown-menu > li > a.dropdown-item {
    width: 100% !important;
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    overflow: visible !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: #1f2937 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 20px !important;
    text-indent: 0 !important;
    white-space: nowrap !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.tvk-app-header .tvk-main-nav ul.tvk-more-dropdown-menu > li > a.dropdown-item i {
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #6b7280 !important;
    font-size: 15px !important;
    opacity: 1 !important;
}

.tvk-app-header .tvk-main-nav ul.tvk-more-dropdown-menu > li > a.dropdown-item:hover,
.tvk-app-header .tvk-main-nav ul.tvk-more-dropdown-menu > li > a.dropdown-item:focus {
    background: #eef8ff !important;
    color: #005fae !important;
}

.tvk-app-header .tvk-main-nav ul.tvk-more-dropdown-menu > li > a.dropdown-item:hover i,
.tvk-app-header .tvk-main-nav ul.tvk-more-dropdown-menu > li > a.dropdown-item:focus i {
    color: #005fae !important;
}

/* Home hero More dropdown: force readable text color */
.tvk-hero .tvk-product-menu .tvk-more-menu .dropdown-item,
.tvk-product-menu .tvk-more-menu .dropdown-item {
    color: #1f2937 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 20px !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

.tvk-hero .tvk-product-menu .tvk-more-menu .dropdown-item i,
.tvk-product-menu .tvk-more-menu .dropdown-item i {
    color: #6b7280 !important;
    opacity: 1 !important;
}

.tvk-hero .tvk-product-menu .tvk-more-menu .dropdown-item:hover,
.tvk-hero .tvk-product-menu .tvk-more-menu .dropdown-item:focus,
.tvk-product-menu .tvk-more-menu .dropdown-item:hover,
.tvk-product-menu .tvk-more-menu .dropdown-item:focus {
    background: #eef8ff !important;
    color: #005fae !important;
}

/* ===== Admin shell with left management navigation ===== */
.admin-shell-body {
    background: #f5f7fb !important;
}

.admin-shell {
    min-height: 100vh;
    display: flex;
    background: #f5f7fb;
    color: #172033;
}

.admin-sidebar {
    position: sticky;
    top: 0;
    width: 292px;
    height: 100vh;
    flex: 0 0 292px;
    display: flex;
    flex-direction: column;
    padding: 22px 16px;
    background: #ffffff;
    border-right: 1px solid rgba(15, 23, 42, .08);
    box-shadow: 10px 0 30px rgba(15, 23, 42, .04);
    overflow-y: auto;
    z-index: 20;
}

.admin-sidebar-brand {
    padding: 4px 8px 18px;
    border-bottom: 1px solid rgba(15, 23, 42, .08);
    margin-bottom: 16px;
}

.admin-sidebar-brand a {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #0f172a;
    text-decoration: none;
    font-size: 1.35rem;
    font-weight: 900;
    letter-spacing: -.04em;
}

.admin-sidebar-brand small {
    display: block;
    margin-top: 8px;
    color: #64748b;
    font-weight: 700;
}

.admin-brand-icon,
.admin-user-mini > span,
.admin-topbar-account > span {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: #eef4ff;
    color: #2563eb;
}

.admin-sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

.admin-nav-group-title {
    margin: 18px 10px 7px;
    font-size: .73rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #94a3b8;
}

.admin-nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 12px;
    border-radius: 14px;
    color: #475569;
    text-decoration: none;
    font-weight: 800;
    line-height: 1.15;
    transition: background .2s ease, color .2s ease, transform .2s ease;
}

.admin-nav-link i {
    width: 20px;
    text-align: center;
}

.admin-nav-link:hover,
.admin-nav-link.active {
    background: #eef4ff;
    color: #0f5fd7;
    transform: translateX(2px);
}

.admin-sidebar-footer {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(15, 23, 42, .08);
}

.admin-user-mini {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 10px;
    border-radius: 16px;
    background: #f8fafc;
}

.admin-user-mini strong,
.admin-topbar-account strong {
    display: block;
    color: #0f172a;
    font-size: .92rem;
}

.admin-user-mini small,
.admin-topbar-account small,
.admin-topbar-kicker {
    color: #64748b;
    font-size: .78rem;
    font-weight: 700;
}

.admin-sidebar-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 12px;
}

.admin-sidebar-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 40px;
    border-radius: 12px;
    background: #f1f5f9;
    color: #334155;
    text-decoration: none;
    font-weight: 800;
    font-size: .82rem;
}

.admin-main-panel {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.admin-topbar {
    position: sticky;
    top: 0;
    z-index: 15;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    min-height: 86px;
    padding: 18px 32px;
    background: rgba(245, 247, 251, .92);
    backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(15, 23, 42, .06);
}

.admin-topbar h1 {
    margin: 2px 0 0;
    font-size: clamp(1.35rem, 2vw, 2rem);
    font-weight: 900;
    letter-spacing: -.045em;
    color: #0f172a;
}

.admin-topbar-account {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 25px rgba(15, 23, 42, .06);
}

.admin-main-content {
    width: 100%;
    max-width: 1560px;
    margin: 0 auto;
    padding: 28px 32px 48px;
}

.admin-page-hero {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 18px;
    margin-bottom: 24px;
    padding: 28px;
    border-radius: 28px;
    background: #fff;
    border: 1px solid rgba(15, 23, 42, .08);
    box-shadow: 0 20px 45px rgba(15, 23, 42, .06);
}

.admin-content-grid {
    display: grid;
    grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
    gap: 22px;
    align-items: start;
}

.admin-form-card,
.admin-list-card,
.admin-edit-card {
    border: 1px solid rgba(15, 23, 42, .08) !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .055) !important;
}

.admin-search-form {
    width: min(100%, 560px);
}

.admin-table thead th {
    background: #f8fafc;
    color: #334155;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    border-bottom: 1px solid rgba(15, 23, 42, .08);
}

.admin-table tbody td {
    border-color: rgba(15, 23, 42, .06);
}

.tvk-utility-bar .container,
.tvk-utility-left,
.tvk-utility-right {
    min-width: 0;
}

.tvk-utility-left,
.tvk-utility-right {
    flex-wrap: nowrap !important;
    gap: 14px !important;
}

.tvk-utility-left a,
.tvk-utility-right a {
    white-space: nowrap;
    line-height: 1.15;
}

.tvk-login-link,
.tvk-register-link {
    white-space: nowrap;
    min-width: max-content;
}

@media (max-width: 1199.98px) {
    .admin-shell {
        display: block;
    }

    .admin-sidebar {
        position: relative;
        width: 100%;
        height: auto;
        max-height: none;
        border-right: 0;
        border-bottom: 1px solid rgba(15, 23, 42, .08);
    }

    .admin-sidebar-nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-nav-group-title {
        grid-column: 1 / -1;
    }

    .admin-content-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .admin-topbar,
    .admin-page-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-main-content,
    .admin-topbar {
        padding-left: 16px;
        padding-right: 16px;
    }

    .admin-sidebar-nav {
        grid-template-columns: 1fr;
    }

    .admin-topbar-account {
        width: 100%;
    }

    .tvk-utility-bar .container,
    .tvk-utility-left,
    .tvk-utility-right {
        flex-wrap: wrap !important;
    }
}

.tvk-top-links {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: nowrap;
    min-width: 0;
}

.tvk-top-links a,
.tvk-top-links .dropdown,
.tvk-help-pill,
.tvk-login-pill,
.tvk-register-pill,
.tvk-home-account-toggle,
.tvk-simple-auth a,
.tvk-simple-user {
    white-space: nowrap;
    line-height: 1.15;
}

@media (max-width: 991.98px) {
    .tvk-top-links {
        justify-content: center;
        flex-wrap: wrap;
    }
}

/* ===== GenZ Travel revisions ===== */
:root {
    --genz-font: "Godwit", "Be Vietnam Pro", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --genz-blue: #0b94e5;
    --genz-orange: #ff5a1f;
    --genz-dark: #101a2a;
}

html, body, button, input, select, textarea, .tvk-simple-page, .admin-shell, .dropdown-menu {
    font-family: var(--genz-font) !important;
}

.tvk-flight-hero {
    padding: 14px 0 150px !important;
    min-height: 500px !important;
}
.tvk-flight-hero > .container {
    min-height: 292px !important;
    height: 292px !important;
}
.tvk-flight-hero-copy {
    bottom: 82px !important;
}
.tvk-flight-search-card {
    bottom: -145px !important;
    padding: 34px 30px 26px !important;
}

.traveloka-like-header {
    background: #fff;
    border-bottom: 1px solid #edf2f7;
    box-shadow: 0 6px 20px rgba(15, 23, 42, .06);
    position: relative;
    z-index: 20;
}
.travel-top-row,
.travel-product-links {
    display: flex;
    align-items: center;
    gap: 28px;
}
.travel-top-row {
    min-height: 86px;
    justify-content: space-between;
}
.travel-brand,
.travel-brand:hover {
    color: #0f172a;
    font-weight: 900;
    font-size: 23px;
    text-decoration: none;
    letter-spacing: -.6px;
}
.travel-brand span {
    display: inline-block;
    width: 20px;
    height: 15px;
    margin-left: 5px;
    border-radius: 12px 12px 12px 0;
    background: linear-gradient(135deg, #0ea5e9, #1677ff);
    transform: rotate(25deg);
}
.travel-top-links,
.travel-auth-links,
.travel-product-links {
    display: flex;
    align-items: center;
    gap: 26px;
}
.travel-top-links a,
.travel-product-links a {
    color: #202a35;
    text-decoration: none;
    font-weight: 700;
    white-space: nowrap;
}
.travel-product-row {
    background: #fff;
    border-top: 1px solid #f1f5f9;
}
.travel-product-links {
    min-height: 74px;
    gap: 34px;
    overflow-x: auto;
}
.travel-product-links a {
    color: #6b7280;
    font-size: 15px;
}
.travel-product-links a:hover,
.travel-top-links a:hover {
    color: var(--genz-blue);
}
.travel-login-pill,
.travel-login-pill:hover {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 26px;
    border-radius: 999px;
    background: #cdefff;
    color: #0b5e9e;
    font-weight: 900;
    text-decoration: none;
}
.travel-register-pill,
.travel-register-pill:hover {
    display: inline-flex;
    align-items: center;
    padding: 15px 28px;
    border-radius: 999px;
    background: #1199e8;
    color: #fff;
    font-weight: 900;
    text-decoration: none;
}

.bus-hero-gradient {
    background: linear-gradient(180deg, #43b4e9 0%, #0873c9 100%);
    min-height: 430px;
    color: #fff;
    padding: 74px 0 120px;
}
.bus-hero-copy {
    width: min(560px, 100%);
    margin-left: 130px;
}
.bus-hero-copy h1 {
    font-size: 30px;
    font-weight: 900;
    line-height: 1.15;
    margin-bottom: 28px;
}
.bus-hero-copy p {
    font-size: 18px;
    line-height: 1.55;
    font-weight: 800;
}
.bus-search-overlap {
    margin-top: -64px;
    position: relative;
    z-index: 4;
}
.bus-search-card,
.airport-search-card,
.car-search-card {
    background: #fff;
    border-radius: 18px;
    padding: 30px 32px;
    box-shadow: 0 18px 36px rgba(15, 23, 42, .10);
}
.bus-search-card h2 {
    color: #15202b;
    font-size: 22px;
    font-weight: 900;
    margin-bottom: 12px;
}
.bus-search-grid {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) 48px minmax(220px, 1fr);
    gap: 18px;
    align-items: end;
}
.bus-search-grid label,
.airport-search-card label,
.car-search-card label {
    display: grid;
    gap: 8px;
    color: #111827;
    font-weight: 900;
}
.travel-field {
    min-height: 44px;
    border: 1px solid #b8c0ca;
    border-radius: 5px;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: #fff;
}
.travel-field i {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #69737f;
    border-right: 1px solid #cfd6df;
    font-size: 19px;
}
.travel-field input,
.travel-field select {
    width: 100%;
    border: 0;
    outline: 0;
    min-height: 44px;
    padding: 0 12px;
    font-size: 18px;
    font-weight: 700;
    color: #111827;
    background: #fff;
}
.travel-field input::placeholder { color: #8a8f98; }
.swap-button {
    width: 46px;
    height: 46px;
    border-radius: 999px;
    border: 4px solid #fff;
    background: #0798e8;
    color: #fff;
    box-shadow: 0 2px 8px rgba(14, 165, 233, .28);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: end;
    margin-bottom: 0;
}
.bus-roundtrip-toggle .check-row {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
}
.bus-roundtrip-toggle input,
.car-mode-row input {
    width: 22px;
    height: 22px;
    accent-color: var(--genz-blue);
}
.return-date-field { display: none !important; }
.return-date-field.is-visible { display: grid !important; }
.orange-search-button {
    border: 0;
    min-height: 48px;
    border-radius: 7px;
    background: var(--genz-orange);
    color: #fff;
    font-size: 18px;
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 28px;
    white-space: nowrap;
}
.bus-results-wrap,
.activities-content {
    padding: 46px 0 80px;
}
.travel-section-head,
.activities-result-head,
.admin-page-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 22px;
}
.travel-section-head span,
.admin-page-head span {
    color: var(--genz-blue);
    font-weight: 900;
    text-transform: uppercase;
    font-size: 13px;
}
.travel-section-head h2,
.admin-page-head h2 {
    color: #111827;
    font-weight: 900;
    margin: 3px 0 0;
}
.admin-only-link {
    color: var(--genz-blue);
    text-decoration: none;
    font-weight: 800;
}
.bus-trip-list {
    display: grid;
    gap: 16px;
}
.bus-trip-card {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 24px;
    padding: 22px;
    border: 1px solid #e5edf5;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .06);
}
.bus-operator {
    color: #0b94e5;
    font-weight: 900;
}
.bus-trip-card h3 {
    margin: 6px 0;
    font-weight: 900;
}
.bus-trip-card p {
    color: #64748b;
    font-weight: 700;
}
.bus-route-meta {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    color: #334155;
    font-weight: 700;
}
.bus-route-meta span {
    display: inline-flex;
    gap: 7px;
    align-items: center;
}
.bus-trip-side {
    display: grid;
    gap: 8px;
    justify-items: end;
    align-content: center;
}
.bus-trip-side strong {
    color: #f04b20;
    font-size: 22px;
    font-weight: 900;
}
.bus-trip-side button {
    border: 0;
    border-radius: 999px;
    padding: 10px 22px;
    background: var(--genz-blue);
    color: #fff;
    font-weight: 900;
}
.travel-empty-state {
    border: 1px dashed #cbd5e1;
    border-radius: 22px;
    background: #f8fafc;
    min-height: 220px;
    display: grid;
    place-items: center;
    text-align: center;
    gap: 10px;
    padding: 32px;
    color: #64748b;
}
.travel-empty-state i {
    font-size: 42px;
    color: var(--genz-blue);
}
.travel-empty-state strong {
    color: #111827;
    font-size: 20px;
}

.airport-blue-strip,
.car-blue-strip {
    height: 76px;
    background: #087ad2;
}
.airport-search-container,
.car-search-container {
    margin-top: -58px;
    padding-bottom: 80px;
}
.airport-search-card {
    display: grid;
    grid-template-columns: minmax(230px, 1fr) 46px minmax(260px, 1fr) 210px 150px 150px;
    gap: 14px;
    align-items: end;
    border-radius: 8px;
}
.airport-swap { margin-bottom: 0; }

.car-search-card {
    border-radius: 8px;
    padding: 28px 30px 22px;
}
.car-mode-row {
    display: flex;
    align-items: center;
    gap: 28px;
    font-size: 20px;
    font-weight: 900;
}
.car-mode-row label {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
}
.car-mode-row input[type="radio"] {
    width: 24px;
    height: 24px;
}
.car-search-card hr {
    border-color: #eef2f7;
    margin: 22px 0;
}
.car-mode-panel {
    display: none;
    grid-template-columns: minmax(280px, 2fr) 1fr .8fr 1.4fr .8fr 180px;
    gap: 12px;
    align-items: end;
}
.car-mode-panel.is-active { display: grid; }
.car-mode-panel.driver-panel {
    grid-template-columns: minmax(300px, 1.5fr) 1fr 1.2fr 1fr 180px;
}
.car-mode-panel small {
    color: #6b7280;
    font-weight: 700;
}
.location-wide { min-width: 0; }

.activities-hero {
    min-height: 238px;
    padding: 42px 0 70px;
    color: #fff;
    background: linear-gradient(135deg, rgba(0, 29, 53, .84), rgba(8, 66, 111, .6)), url('https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&fit=crop&w=1800&q=80') center/cover;
}
.activities-hero span {
    display: inline-block;
    margin-bottom: 18px;
    font-weight: 800;
}
.activities-hero h1 {
    font-size: 34px;
    font-weight: 900;
    margin-bottom: 20px;
}
.activities-search-bar {
    display: grid;
    grid-template-columns: 185px minmax(280px, 1fr) 125px;
    width: min(760px, 100%);
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .18);
}
.activities-search-bar select,
.activities-search-bar input,
.activities-search-bar button {
    height: 44px;
    border: 0;
    padding: 0 16px;
    font-weight: 800;
}
.activities-search-bar button {
    background: #0b94e5;
    color: #fff;
}
.activities-category-tabs {
    display: flex;
    gap: 14px;
    justify-content: center;
    flex-wrap: wrap;
    margin: -42px auto 28px;
    position: relative;
    z-index: 2;
}
.activities-category-tabs a {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 52px;
    padding: 0 22px;
    border-radius: 999px;
    color: #2563eb;
    text-decoration: none;
    background: #fff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, .09);
    font-weight: 900;
}
.activities-category-tabs a.active {
    background: #eaf8ff;
    color: #087ad2;
}
.activities-layout-grid {
    display: grid;
    grid-template-columns: 245px 1fr;
    gap: 26px;
    align-items: start;
}
.activities-filter-panel {
    background: #fff;
    border-radius: 16px;
    padding: 22px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .08);
    display: grid;
    gap: 18px;
    position: sticky;
    top: 98px;
}
.activities-filter-panel strong {
    font-weight: 900;
}
.activities-filter-panel label {
    display: grid;
    gap: 8px;
    font-weight: 800;
    color: #475569;
}
.activities-filter-panel select,
.activities-filter-panel input {
    min-height: 40px;
    border: 1px solid #d9e2ec;
    border-radius: 10px;
    padding: 0 10px;
}
.activities-result-head {
    margin-bottom: 14px;
}
.activities-result-head span {
    font-weight: 900;
    color: #111827;
}
.activities-result-head select {
    border: 1px solid #d9e2ec;
    border-radius: 999px;
    padding: 9px 14px;
    font-weight: 800;
}
.activities-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}
.activity-card {
    background: #fff;
    border: 1px solid #e5edf5;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .06);
}
.activity-image {
    position: relative;
    height: 160px;
    background: #e2e8f0;
}
.activity-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.activity-image button {
    position: absolute;
    right: 10px;
    top: 10px;
    border: 0;
    background: rgba(15, 23, 42, .72);
    color: #fff;
    width: 32px;
    height: 32px;
    border-radius: 8px;
}
.activity-body {
    padding: 14px;
    display: grid;
    gap: 7px;
}
.activity-body h3 {
    font-size: 15px;
    line-height: 1.35;
    min-height: 42px;
    margin: 0;
    font-weight: 900;
}
.activity-body p,
.activity-rating {
    margin: 0;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
}
.activity-body p i,
.activity-rating i {
    color: #0b94e5;
    margin-right: 5px;
}
.activity-rating i { color: #f59e0b; }
.activity-badge {
    width: max-content;
    border-radius: 6px;
    padding: 4px 7px;
    background: #fff7ed;
    color: #ea580c;
    font-size: 11px;
    font-weight: 900;
}
.activity-body small {
    color: #94a3b8;
    font-size: 11px;
}
.activity-body strong {
    color: #f04b20;
    font-weight: 900;
}
.activity-body del {
    color: #94a3b8;
    font-size: 12px;
}

.admin-management-page {
    padding: 10px 0 36px;
}
.admin-page-card {
    background: #fff;
    border-radius: 24px;
    box-shadow: 0 18px 40px rgba(15, 23, 42, .08);
    padding: 26px;
    border: 1px solid #e7eef6;
}
.narrow-admin-card {
    max-width: 1040px;
    margin: 0 auto;
}
.admin-page-head p {
    margin: 5px 0 0;
    color: #64748b;
    font-weight: 700;
}
.admin-inline-search {
    display: grid;
    grid-template-columns: repeat(4, minmax(170px, 1fr)) 170px;
    gap: 12px;
    align-items: end;
    background: #f8fafc;
    border: 1px solid #e5edf5;
    border-radius: 18px;
    padding: 16px;
    margin-bottom: 18px;
}
.admin-inline-search label,
.admin-edit-form label.form-label {
    display: grid;
    gap: 6px;
    font-weight: 900;
    color: #334155;
}
.admin-inline-search input,
.admin-inline-search select {
    min-height: 42px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    padding: 0 12px;
    font-weight: 700;
    background: #fff;
}
.admin-inline-search button {
    min-height: 42px;
    border: 0;
    border-radius: 999px;
    background: #0b94e5;
    color: #fff;
    font-weight: 900;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.admin-stat-strip {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 18px;
}
.admin-stat-strip article {
    background: #f8fafc;
    border: 1px solid #e5edf5;
    border-radius: 16px;
    padding: 16px;
}
.admin-stat-strip strong {
    display: block;
    font-size: 28px;
    font-weight: 900;
    color: #0b94e5;
}
.admin-stat-strip span {
    color: #64748b;
    font-weight: 800;
}
.admin-clean-table th {
    white-space: nowrap;
    color: #334155;
    font-weight: 900;
}
.admin-clean-table td {
    vertical-align: middle;
    color: #334155;
}
.admin-clean-table td small {
    display: block;
    color: #64748b;
    font-weight: 700;
    margin-top: 3px;
}
.admin-form-actions {
    display: flex;
    gap: 12px;
    margin-top: 24px;
}
.admin-check-card {
    min-height: 42px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    padding: 0 14px;
    display: flex !important;
    align-items: center;
    gap: 10px !important;
    font-weight: 800;
}
.admin-check-card input { width: 18px; height: 18px; accent-color: #0b94e5; }

/* Combo management */
.combo-admin-page {
    --combo-blue: #087ad2;
    --combo-dark: #172033;
    --combo-muted: #718096;
    display: grid;
    gap: 20px;
}
.combo-admin-hero {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 158px;
    padding: 30px 32px;
    border-radius: 24px;
    color: #fff;
    background: linear-gradient(120deg, #087ad2 0%, #0b94e5 58%, #35b6ef 100%);
    box-shadow: 0 18px 38px rgba(8, 122, 210, .2);
}
.combo-admin-hero::after {
    content: "";
    position: absolute;
    right: -55px;
    bottom: -100px;
    width: 260px;
    height: 260px;
    border: 42px solid rgba(255, 255, 255, .09);
    border-radius: 50%;
}
.combo-admin-hero-copy,
.combo-admin-actions {
    position: relative;
    z-index: 1;
}
.combo-admin-hero-copy {
    display: flex;
    align-items: center;
    gap: 20px;
}
.combo-admin-icon {
    flex: 0 0 68px;
    width: 68px;
    height: 68px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 20px;
    background: rgba(255, 255, 255, .16);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2);
    font-size: 29px;
}
.combo-admin-eyebrow {
    display: block;
    margin-bottom: 4px;
    color: rgba(255, 255, 255, .82);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.combo-admin-hero h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(25px, 3vw, 34px);
    font-weight: 900;
}
.combo-admin-hero p {
    margin: 7px 0 0;
    color: rgba(255, 255, 255, .84);
    font-weight: 600;
}
.combo-admin-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.combo-admin-actions .btn,
.combo-empty-state .btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border-radius: 12px;
    padding: 10px 18px;
    font-weight: 800;
}
.combo-btn-primary {
    border: 1px solid #fff;
    color: var(--combo-blue);
    background: #fff;
}
.combo-btn-primary:hover {
    color: #0568b6;
    background: #f4faff;
}
.combo-btn-secondary {
    border: 1px solid rgba(255, 255, 255, .36);
    color: #fff;
    background: rgba(255, 255, 255, .12);
}
.combo-btn-secondary:hover {
    border-color: rgba(255, 255, 255, .7);
    color: #fff;
    background: rgba(255, 255, 255, .2);
}
.combo-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}
.combo-stat-grid article {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px;
    border: 1px solid #e7edf5;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .05);
}
.combo-stat-icon {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 14px;
    font-size: 19px;
}
.combo-stat-icon.is-blue { color: #087ad2; background: #e9f5ff; }
.combo-stat-icon.is-green { color: #179b63; background: #e8f8f1; }
.combo-stat-icon.is-orange { color: #dc7c18; background: #fff3e3; }
.combo-stat-icon.is-purple { color: #7554d8; background: #f0edff; }
.combo-stat-grid small {
    display: block;
    overflow: hidden;
    color: var(--combo-muted);
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.combo-stat-grid strong {
    display: block;
    margin-top: 2px;
    color: var(--combo-dark);
    font-size: 25px;
    font-weight: 900;
    line-height: 1.15;
}
.combo-stat-grid .combo-stat-price { font-size: 19px; white-space: nowrap; }
.combo-stat-price em { color: var(--combo-muted); font-size: 12px; font-style: normal; }
.combo-list-card { padding: 0; overflow: hidden; border-radius: 20px; }
.combo-list-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 24px;
    border-bottom: 1px solid #e8eef5;
}
.combo-list-heading h3 {
    margin: 0;
    color: var(--combo-dark);
    font-size: 20px;
    font-weight: 900;
}
.combo-list-heading p {
    margin: 4px 0 0;
    color: var(--combo-muted);
    font-size: 13px;
    font-weight: 700;
}
.combo-filter-bar { display: flex; align-items: center; gap: 10px; }
.combo-search-box {
    width: min(340px, 34vw);
    min-height: 42px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    border: 1px solid #d8e1eb;
    border-radius: 12px;
    background: #f8fafc;
    color: #94a3b8;
}
.combo-search-box:focus-within {
    border-color: #58abe7;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(8, 122, 210, .1);
}
.combo-search-box input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: #334155;
    font-weight: 650;
}
.combo-status-filter {
    width: 190px;
    min-height: 42px;
    border-color: #d8e1eb;
    border-radius: 12px;
    color: #475569;
    font-weight: 700;
}
.combo-table-wrap { min-height: 190px; }
.combo-admin-table { min-width: 930px; }
.combo-admin-table thead th {
    padding: 13px 20px;
    border-bottom: 1px solid #e8eef5;
    background: #f8fafc;
    color: #64748b;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .035em;
    text-transform: uppercase;
    white-space: nowrap;
}
.combo-admin-table tbody td {
    padding: 17px 20px;
    border-color: #eef2f6;
    color: #475569;
}
.combo-admin-table tbody tr.combo-data-row:hover { background: #fbfdff; }
.combo-name-cell { display: flex; align-items: center; gap: 13px; min-width: 230px; }
.combo-row-icon {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    color: #087ad2;
    background: #eaf5fe;
}
.combo-name-cell strong { display: block; max-width: 280px; color: #1e293b; font-weight: 900; }
.combo-name-cell small {
    display: block;
    max-width: 290px;
    overflow: hidden;
    margin-top: 3px;
    color: #8491a3;
    font-size: 12px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.combo-component-list { display: flex; flex-wrap: wrap; gap: 6px; max-width: 390px; }
.combo-component-list span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 180px;
    padding: 5px 9px;
    overflow: hidden;
    border: 1px solid #dceaf6;
    border-radius: 8px;
    color: #3b6f94;
    background: #f3f9fe;
    font-size: 11px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.combo-component-list span.is-empty { color: #7c8797; border-color: #e1e6ec; background: #f7f8fa; }
.combo-component-count { display: block; margin-top: 6px; color: #94a3b8; font-size: 11px; font-weight: 700; }
.combo-price { color: #e84b35; font-size: 16px; font-weight: 900; white-space: nowrap; }
.combo-price span { color: #8491a3; font-size: 10px; }
.combo-created-date { color: #64748b; font-size: 13px; font-weight: 700; white-space: nowrap; }
.combo-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}
.combo-status i { width: 7px; height: 7px; border-radius: 50%; }
.combo-status.is-active { color: #16895a; background: #e9f8f1; }
.combo-status.is-active i { background: #21ad74; box-shadow: 0 0 0 3px rgba(33, 173, 116, .13); }
.combo-status.is-inactive { color: #8a6470; background: #f5edf0; }
.combo-status.is-inactive i { background: #a57986; }
.combo-empty-state { display: grid; justify-items: center; gap: 7px; padding: 42px 20px; text-align: center; }
.combo-empty-state > span {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    margin-bottom: 4px;
    border-radius: 16px;
    color: #087ad2;
    background: #eaf5fe;
    font-size: 20px;
}
.combo-empty-state strong { color: #243044; font-size: 17px; }
.combo-empty-state p { margin: 0 0 5px; color: #8491a3; font-size: 13px; }
.combo-empty-state .combo-btn-primary { color: #fff; border-color: #087ad2; background: #087ad2; }
@media (max-width: 1199.98px) {
    .combo-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
    .combo-admin-page { gap: 14px; }
    .combo-admin-hero { align-items: flex-start; padding: 24px 20px; }
    .combo-admin-hero,
    .combo-list-heading { flex-direction: column; }
    .combo-admin-hero-copy { align-items: flex-start; }
    .combo-admin-icon { flex-basis: 52px; width: 52px; height: 52px; border-radius: 15px; font-size: 22px; }
    .combo-admin-actions { width: 100%; justify-content: stretch; }
    .combo-admin-actions .btn { flex: 1 1 150px; }
    .combo-list-heading { align-items: stretch; padding: 18px; }
    .combo-filter-bar { align-items: stretch; flex-direction: column; }
    .combo-search-box,
    .combo-status-filter { width: 100%; }
}
@media (max-width: 479.98px) {
    .combo-stat-grid { grid-template-columns: 1fr; }
    .combo-admin-hero-copy { display: block; }
    .combo-admin-icon { margin-bottom: 14px; }
}
.permission-user-picker {
    margin-bottom: 18px;
}
.permission-user-picker label {
    display: grid;
    gap: 8px;
    font-weight: 900;
    color: #334155;
}
.permission-user-picker select {
    width: min(640px, 100%);
    min-height: 46px;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    padding: 0 14px;
    font-weight: 800;
}
.permission-selected-user {
    display: flex;
    align-items: center;
    gap: 14px;
    border-radius: 18px;
    background: #eef8ff;
    padding: 16px;
    margin-bottom: 18px;
    color: #0f172a;
}
.permission-selected-user > i {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: #0b94e5;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.permission-selected-user strong,
.permission-selected-user span { display: block; }
.permission-selected-user em {
    margin-left: auto;
    color: #0b94e5;
    font-weight: 900;
    font-style: normal;
}
.permission-table-wrap {
    overflow-x: auto;
    border: 1px solid #e5edf5;
    border-radius: 18px;
}
.permission-table {
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
}
.permission-table th,
.permission-table td {
    padding: 14px 16px;
    border-bottom: 1px solid #edf2f7;
    text-align: center;
}
.permission-table th:first-child,
.permission-table td:first-child {
    text-align: left;
}
.permission-table th {
    background: #f8fafc;
    color: #334155;
    font-weight: 900;
}
.permission-table td:first-child i {
    width: 28px;
    color: #0b94e5;
}
.permission-table td:first-child strong {
    margin-right: 7px;
}
.permission-table td:first-child small {
    color: #94a3b8;
    font-weight: 700;
}
.permission-table input[type="checkbox"] {
    width: 22px;
    height: 22px;
    accent-color: #0b94e5;
}
.customer-admin-table td,
.employee-wide-table td {
    white-space: normal !important;
}
.customer-name-cell,
.employee-name-cell,
.employee-long-cell {
    min-width: 220px;
    max-width: 360px;
    overflow: visible !important;
    text-overflow: clip !important;
}

@media (max-width: 1200px) {
    .bus-hero-copy { margin-left: 0; }
    .airport-search-card,
    .car-mode-panel,
    .car-mode-panel.driver-panel,
    .admin-inline-search {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .activities-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .activities-layout-grid { grid-template-columns: 1fr; }
    .activities-filter-panel { position: static; }
}
@media (max-width: 768px) {
    .travel-top-row,
    .travel-product-links,
    .travel-top-links,
    .travel-auth-links,
    .car-mode-row {
        flex-wrap: wrap;
        gap: 12px;
    }
    .bus-search-grid,
    .airport-search-card,
    .car-mode-panel,
    .car-mode-panel.driver-panel,
    .activities-search-bar,
    .admin-inline-search,
    .admin-stat-strip,
    .bus-trip-card {
        grid-template-columns: 1fr;
    }
    .swap-button { justify-self: center; }
    .activities-card-grid { grid-template-columns: 1fr; }
    .bus-hero-gradient { padding: 46px 0 110px; }
    .bus-hero-copy h1 { font-size: 26px; }
}

.employee-filter-menu { min-width: 260px; }
.employee-wide-table .sticky-col { position: sticky; background: #fff; z-index: 3; }
.employee-wide-table thead .sticky-col { background: #f8f9fa; z-index: 4; }
.employee-wide-table .sticky-col-1 { left: 0; min-width: 90px; }
.employee-wide-table .sticky-col-2 { left: 90px; min-width: 140px; }
.employee-wide-table .sticky-col-3 { left: 230px; min-width: 240px; box-shadow: 8px 0 12px rgba(15,23,42,.06); }

/* ===== Employee management layout fixes ===== */
.employee-search-card .employee-search-group { flex-wrap: nowrap; }
.employee-filter-select { max-width: 190px; font-weight: 700; }

.employee-admin-table {
    table-layout: fixed;
    min-width: 2350px;
    font-size: .82rem;
}
.employee-admin-table th,
.employee-admin-table td {
    padding: .58rem .45rem;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    vertical-align: middle;
}
.employee-admin-table .employee-name-cell,
.employee-admin-table .employee-long-cell {
    min-width: 0;
    max-width: none;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
.employee-admin-table .employee-name-cell div {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.employee-admin-table .sticky-col-1 { left: 0; width: 72px; min-width: 72px; }
.employee-admin-table .sticky-col-2 { left: 72px; width: 128px; min-width: 128px; }
.employee-admin-table .sticky-col-3 { left: 200px; width: 210px; min-width: 210px; }
.employee-admin-table th:nth-child(4), .employee-admin-table td:nth-child(4) { width: 130px; }
.employee-admin-table th:nth-child(5), .employee-admin-table td:nth-child(5) { width: 118px; }
.employee-admin-table th:nth-child(6), .employee-admin-table td:nth-child(6) { width: 80px; }
.employee-admin-table th:nth-child(7), .employee-admin-table td:nth-child(7) { width: 98px; }
.employee-admin-table th:nth-child(8), .employee-admin-table td:nth-child(8) { width: 190px; }
.employee-admin-table th:nth-child(9), .employee-admin-table td:nth-child(9) { width: 105px; }
.employee-admin-table th:nth-child(10), .employee-admin-table td:nth-child(10) { width: 112px; }
.employee-admin-table th:nth-child(11), .employee-admin-table td:nth-child(11) { width: 115px; }
.employee-admin-table th:nth-child(12), .employee-admin-table td:nth-child(12) { width: 125px; }
.employee-admin-table th:nth-child(13), .employee-admin-table td:nth-child(13) { width: 130px; }
.employee-admin-table th:nth-child(14), .employee-admin-table td:nth-child(14) { width: 135px; }
.employee-admin-table th:nth-child(15), .employee-admin-table td:nth-child(15) { width: 115px; }
.employee-admin-table th:nth-child(16), .employee-admin-table td:nth-child(16) { width: 115px; }
.employee-admin-table th:nth-child(17), .employee-admin-table td:nth-child(17) { width: 190px; }
.employee-admin-table th:nth-child(18), .employee-admin-table td:nth-child(18) { width: 88px; }
.employee-admin-table th:nth-child(19), .employee-admin-table td:nth-child(19) { width: 120px; }
.employee-admin-table th:nth-child(20), .employee-admin-table td:nth-child(20) { width: 135px; }
.employee-admin-table th:nth-child(21), .employee-admin-table td:nth-child(21) { width: 105px; }
.employee-admin-table th:nth-child(22), .employee-admin-table td:nth-child(22) { width: 155px; }

@media (max-width: 992px) {
    .employee-search-card .employee-search-group { flex-wrap: wrap; }
    .employee-filter-select { max-width: none; min-width: 180px; }
}

/* Requested navigation/dropdown fixes */
.tvk-product-menu .tvk-travel-dropdown,
.travel-product-links .tvk-travel-dropdown {
    display: inline-flex;
    position: relative;
}

.travel-product-links .tvk-more-button {
    border: 0;
    background: transparent;
    color: #64748b;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 42px;
}

.tvk-product-menu .tvk-other-button,
.travel-product-links .tvk-other-button,
.tvk-main-nav .nav-link.dropdown-toggle:has(.fa-border-all) {
    color: #0b73d9 !important;
}

.tvk-product-menu .tvk-more-menu,
.travel-product-links .tvk-more-menu {
    min-width: 300px;
    padding: 12px;
    border: 0;
    border-radius: 8px;
    box-shadow: 0 14px 38px rgba(15, 35, 55, .18);
}

.tvk-product-menu .tvk-other-menu,
.travel-product-links .tvk-other-menu {
    min-width: 320px;
}

.travel-product-links .tvk-more-menu .dropdown-item,
.tvk-product-menu .tvk-more-menu .dropdown-item {
    min-height: 44px;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    color: #1f2937 !important;
    font-weight: 800 !important;
    border-radius: 8px;
}

.travel-product-links .tvk-more-menu .dropdown-item i,
.tvk-product-menu .tvk-more-menu .dropdown-item i {
    width: 22px;
    min-width: 22px;
    text-align: center;
    color: #6b7280 !important;
}

/* Activity filter and clickable cards */
.activities-price-filter input[type="range"] {
    width: 100%;
    padding: 0;
}

.activities-price-limits {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: #64748b;
    font-weight: 800;
}

.activity-card {
    position: relative;
}

.activity-card-link {
    position: absolute;
    inset: 0;
    z-index: 2;
}

.activity-image button,
.activity-card a:not(.activity-card-link) {
    position: relative;
    z-index: 3;
}

.activity-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(15, 23, 42, .12);
}

/* 2026 requested fixes: More/Khac buttons, promo public page and activities cards */
.tvk-product-nav .nav-link.dropdown-toggle,
.travel-product-links .tvk-more-button,
.tvk-product-menu .tvk-more-button {
    font: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    color: #fff !important;
}
.tvk-product-nav .nav-link.dropdown-toggle i,
.travel-product-links .tvk-more-button i,
.tvk-product-menu .tvk-more-button i { color: #fff !important; }

.traveloka-like-header,
.travel-product-row,
.travel-product-links,
.tvk-travel-dropdown { overflow: visible !important; }
.traveloka-like-header { z-index: 1050 !important; }
.travel-product-links { position: relative; }
.travel-product-links .dropdown-menu { z-index: 1060 !important; }

.activities-page .traveloka-like-header { position: relative; z-index: 2000 !important; }
.activities-page .activities-hero { position: relative; z-index: 1; }
.activity-card { overflow: visible !important; }
.activity-body, .activity-body h3 { overflow: visible !important; }
.activity-body h3 {
    white-space: nowrap !important;
    text-overflow: clip !important;
    min-height: auto !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
}
.activity-card-link { z-index: 1 !important; }
.activity-image button { z-index: 3 !important; }

.promo-traveloka-page { background:#fff; min-height:100vh; }
.promo-traveloka-wrap { max-width:1080px; margin:0 auto; padding:44px 18px 70px; }
.promo-step-card { border:1px solid #e8eef5; border-radius:10px; padding:0 22px 34px; box-shadow:0 8px 24px rgba(15,35,60,.04); }
.promo-step-tabs { display:flex; gap:0; margin-bottom:28px; }
.promo-step-tabs span { padding:14px 22px; font-weight:800; color:#0b57a4; font-size:13px; }
.promo-step-tabs span.active { background:#0b57a4; color:#fff; }
.promo-step-card h1,.promo-step-card h2 { text-align:center; color:#003b95; font-weight:900; margin:22px 0; }
.promo-step-card h1 { font-size:28px; }
.promo-step-card h2 { font-size:25px; margin-top:42px; }
.promo-category-tabs,.promo-pill-row { display:flex; justify-content:center; gap:24px; flex-wrap:wrap; margin-bottom:22px; }
.promo-category-tabs button,.promo-pill-row button { border:0; background:#f3f9ff; color:#0b57a4; border-radius:999px; padding:9px 16px; font-weight:800; }
.promo-category-tabs button { background:transparent; color:#29384a; border-radius:0; padding:8px 2px; }
.promo-category-tabs button.active { color:#0b57a4; border-bottom:3px solid #78d500; }
.promo-pill-row button.active { background:#0194f3; color:#fff; }
.promo-coupon-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; overflow:hidden; }
.promo-coupon-card { background:#fff; border-radius:16px; padding:18px; box-shadow:0 8px 24px rgba(15,35,60,.14); display:grid; grid-template-columns:54px 1fr; gap:12px; align-items:start; }
.promo-bank-logo { width:48px; height:48px; border-radius:9px; display:grid; place-items:center; color:#0b57a4; font-weight:900; font-size:20px; }
.promo-coupon-info { display:grid; gap:3px; color:#29384a; min-width:0; }
.promo-coupon-info strong { font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.promo-coupon-info span,.promo-coupon-info small { font-size:12px; color:#697586; }
.promo-copy-row { grid-column:1 / -1; display:flex; gap:10px; align-items:center; margin-top:10px; }
.promo-copy-row code { flex:1; background:#f2f6fb; color:#64748b; border-radius:8px; padding:9px 12px; font-weight:800; }
.promo-copy-row button { border:0; background:#c7edff; color:#0b73d9; border-radius:999px; padding:8px 22px; font-weight:900; }
.promo-suggest-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.promo-suggest-grid article { border-radius:10px; overflow:hidden; box-shadow:0 8px 22px rgba(15,35,60,.13); background:#fff; display:grid; gap:7px; padding-bottom:12px; }
.promo-suggest-grid img { width:100%; height:145px; object-fit:cover; }
.promo-suggest-grid strong { padding:0 12px; font-weight:800; color:#26384d; }
.promo-suggest-grid span { padding:0 12px; color:#ff5a1f; font-weight:900; }
.promo-banner-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.promo-banner-grid div { min-height:110px; border-radius:8px; padding:20px; display:flex; align-items:center; color:#fff; font-weight:900; font-size:22px; background:linear-gradient(135deg,#02a7f0,#0572d6); }
.promo-banner-grid-bottom div { background:linear-gradient(135deg,#0ea5e9,#1d6eea); }
.promo-faq-list { margin-top:38px; display:grid; gap:8px; }
.promo-faq-list details { border-bottom:1px solid #edf2f7; padding:15px 18px; }
.promo-faq-list summary { cursor:pointer; font-weight:900; color:#111827; }
.promo-empty { grid-column:1/-1; text-align:center; padding:30px; color:#64748b; font-weight:800; }
@media (max-width: 900px) {
    .promo-coupon-row,.promo-banner-grid { grid-template-columns:1fr; }
    .promo-suggest-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 560px) { .promo-suggest-grid { grid-template-columns:1fr; } }

/* Fix 2026-07-08: keep Home More/Khac visible on white product bar, keep Activities Khac white on image area */
.travel-product-links .tvk-more-button,
.travel-product-row .travel-product-links .tvk-more-button {
    color: #64748b !important;
    background: transparent !important;
    font: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
}
.travel-product-links .tvk-more-button i,
.travel-product-row .travel-product-links .tvk-more-button i {
    color: currentColor !important;
}
.travel-product-links .tvk-more-button.tvk-other-button,
.travel-product-row .travel-product-links .tvk-more-button.tvk-other-button {
    color: #0b73d9 !important;
}
.travel-product-links .tvk-more-button:hover,
.travel-product-row .travel-product-links .tvk-more-button:hover {
    color: #0194f3 !important;
    background: #eef8ff !important;
}
.activities-page .tvk-product-menu .tvk-other-button,
.activities-page .activity-hero .tvk-other-button,
.activities-page .activities-hero .tvk-other-button,
.activities-page .hero-product-menu .tvk-other-button {
    color: #ffffff !important;
}
.activities-page .tvk-product-menu .tvk-other-button i,
.activities-page .activity-hero .tvk-other-button i,
.activities-page .activities-hero .tvk-other-button i,
.activities-page .hero-product-menu .tvk-other-button i {
    color: #ffffff !important;
}

/* 2026-07-08 fix requested: correct More/Khac colors by page context */
/* On white product navigation rows (hotel, flight, bus, transfer, car, etc.), keep More/Khac gray. */
.travel-product-links .tvk-more-button,
.travel-product-links .tvk-more-button i,
.travel-product-links .tvk-other-button,
.travel-product-links .tvk-other-button i,
.tvk-app-header:not(.tvk-hotel-landing-header) .tvk-product-nav .nav-link.dropdown-toggle,
.tvk-app-header:not(.tvk-hotel-landing-header) .tvk-product-nav .nav-link.dropdown-toggle i {
    color: #6b7280 !important;
}

/* On the dark hero/product area, make the Khac button next to Hoat dong & Vui choi white. */
.tvk-hero .tvk-product-menu .tvk-other-button,
.tvk-hero .tvk-product-menu .tvk-other-button i,
.tvk-hero .tvk-service-tabs .tvk-service-tab-button,
.tvk-hero .tvk-service-tabs .tvk-service-tab-button i {
    color: #ffffff !important;
}

/* Keep More visible on dark hero while white-row pages stay gray via the rules above. */
.tvk-hero .tvk-product-menu .tvk-more-button,
.tvk-hero .tvk-product-menu .tvk-more-button i {
    color: #ffffff !important;
}

/* User request 22: make hotel and flight page menu match the white reference header */
.tvk-hotel-landing-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1020 !important;
    background: #fff !important;
    border-bottom: 1px solid #e8edf2 !important;
    box-shadow: none !important;
}

.tvk-hotel-landing-header .tvk-utility-bar,
.tvk-hotel-landing-header .tvk-utility-bar .container {
    min-height: 86px !important;
    height: 86px !important;
    background: #fff !important;
}

.tvk-hotel-landing-header .tvk-utility-bar .container,
.tvk-hotel-landing-header .tvk-main-nav .container {
    width: min(1508px, calc(100% - 408px)) !important;
    max-width: 1508px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.tvk-hotel-landing-header .tvk-utility-bar .container {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 28px !important;
}

.tvk-hotel-landing-header .tvk-utility-left {
    flex: 0 0 auto !important;
}

.tvk-hotel-landing-header .tvk-top-brand {
    padding: 0 !important;
    min-height: auto !important;
    background: transparent !important;
    color: #111827 !important;
    font-size: 18px !important;
    line-height: 24px !important;
    font-weight: 700 !important;
}

.tvk-hotel-landing-header .tvk-utility-right {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 20px !important;
    flex: 1 1 auto !important;
}

.tvk-hotel-landing-header .tvk-utility-bar a:not(.tvk-login-link):not(.tvk-register-link):not(.tvk-user-pill) {
    min-height: 44px !important;
    padding: 0 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #111827 !important;
    font-family: "Inter", "Be Vietnam Pro", Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 24px !important;
    font-weight: 700 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
}

.tvk-hotel-landing-header .tvk-utility-bar a:not(.tvk-login-link):not(.tvk-register-link):not(.tvk-user-pill):hover,
.tvk-hotel-landing-header .tvk-utility-bar a:not(.tvk-login-link):not(.tvk-register-link):not(.tvk-user-pill):focus {
    background: transparent !important;
    color: #0b86e8 !important;
}

.tvk-hotel-landing-header .tvk-login-link,
.tvk-hotel-landing-header .tvk-register-link {
    min-height: 54px !important;
    height: 54px !important;
    border-radius: 28px !important;
    padding: 0 27px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    font-size: 16px !important;
    line-height: 24px !important;
    font-weight: 700 !important;
}

.tvk-hotel-landing-header .tvk-login-link {
    min-width: 172px !important;
    background: #a9ddf4 !important;
    color: #07508f !important;
}

.tvk-hotel-landing-header .tvk-register-link {
    min-width: 138px !important;
    background: #159be8 !important;
    color: #fff !important;
}

.tvk-hotel-landing-header .tvk-main-nav {
    min-height: 80px !important;
    height: 80px !important;
    padding: 0 !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    background: #fff !important;
}

.tvk-hotel-landing-header .navbar-collapse,
.tvk-hotel-landing-header .tvk-main-nav .container {
    min-height: 80px !important;
    height: 80px !important;
}

.tvk-hotel-landing-header .tvk-brand,
.tvk-hotel-landing-header .tvk-account-nav {
    display: none !important;
}

.tvk-hotel-landing-header .tvk-product-nav {
    display: flex !important;
    align-items: center !important;
    gap: 28px !important;
    margin: 0 !important;
    width: 100% !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-link {
    min-height: 44px !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgb(107, 115, 123) !important;
    font-family: "Inter", "Be Vietnam Pro", Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 24px !important;
    font-weight: 700 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    white-space: nowrap !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-link > i:not(.fa-chevron-down) {
    display: none !important;
}

.tvk-hotel-landing-header .tvk-product-nav .nav-link:hover,
.tvk-hotel-landing-header .tvk-product-nav .nav-link:focus,
.tvk-hotel-landing-header .tvk-product-nav .nav-link.tvk-menu-highlight {
    background: transparent !important;
    color: rgb(107, 115, 123) !important;
}

.tvk-hotel-landing-header .tvk-product-nav .dropdown-toggle::after {
    margin-left: 4px !important;
    vertical-align: middle !important;
}

@media (max-width: 1700px) {
    .tvk-hotel-landing-header .tvk-utility-bar .container,
    .tvk-hotel-landing-header .tvk-main-nav .container {
        width: calc(100% - 48px) !important;
        max-width: 1508px !important;
    }
}

.tvk-service-results-wrap{padding:34px 0 56px}.travel-demo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:22px}.travel-demo-card{position:relative;background:#fff;border:1px solid #e5eef7;border-radius:22px;overflow:hidden;box-shadow:0 14px 35px rgba(15,23,42,.08);transition:.2s ease}.travel-demo-card:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(15,23,42,.14)}.travel-demo-card img{width:100%;height:170px;object-fit:cover;display:block}.travel-demo-body{padding:16px}.travel-demo-badge{display:inline-flex;align-items:center;padding:5px 10px;border-radius:999px;background:#e7f4ff;color:#0874bd;font-weight:700;font-size:12px;margin-bottom:10px}.travel-demo-body h3{font-size:18px;font-weight:800;color:#0f172a;margin:0 0 8px}.travel-demo-body p{display:flex;gap:7px;color:#64748b;margin:0 0 8px}.travel-demo-body small{color:#475569;font-weight:600}.travel-demo-price{margin-top:12px;display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}.travel-demo-price strong{color:#f97316;font-size:18px}.travel-demo-price del{color:#94a3b8}.travel-demo-link{position:absolute;inset:0;z-index:2}.service-data-page .tvk-service-hero{background:linear-gradient(135deg,var(--page-accent),#55c7ff)}

/* Product/activity detail page: display the selected item's actual image and information. */
.tvk-service-hero.has-detail-image .container{grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:48px;align-items:center}
.tvk-detail-hero-image{height:330px;border-radius:24px;overflow:hidden;box-shadow:0 22px 50px rgba(2,32,71,.28);background:#eaf4fb}
.tvk-detail-hero-image img{width:100%;height:100%;display:block;object-fit:cover}
.tvk-detail-summary{position:relative;z-index:3;margin-top:-44px;background:#fff;border:1px solid #e2ebf3;border-radius:20px;padding:24px 28px;display:flex;justify-content:space-between;gap:30px;box-shadow:0 18px 45px rgba(15,23,42,.13)}
.tvk-detail-summary-main h3{font-size:22px;font-weight:800;margin:12px 0;color:#17263a}.tvk-detail-summary-main p{margin:8px 0;color:#586b83}.tvk-detail-summary-main p i{width:22px;color:var(--page-accent)}
.tvk-detail-tags{display:flex;gap:8px;flex-wrap:wrap}.tvk-detail-tags span{padding:6px 11px;border-radius:999px;background:#eaf6ff;color:#087bc2;font-size:13px;font-weight:750}.tvk-detail-rating i{color:#f5a000!important}.tvk-detail-rating small{color:#7b8a9d}
.tvk-detail-price-box{min-width:255px;border-left:1px solid #e6edf4;padding-left:28px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.tvk-detail-price-box small{color:#718096}.tvk-detail-price-box strong{font-size:25px;color:#f4511e;margin:3px 0}.tvk-detail-price-box del{color:#94a3b8;margin-bottom:12px}.tvk-detail-price-box .btn{width:100%;color:#fff}.tvk-back-link{margin-top:10px;color:#177dc1;text-decoration:none;font-weight:700}.tvk-reason-card a{display:inline-block;margin-top:6px;color:var(--page-accent);font-weight:700;text-decoration:none}
@media(max-width:900px){.tvk-service-hero.has-detail-image .container{grid-template-columns:1fr}.tvk-detail-hero-image{height:260px}.tvk-detail-summary{margin-top:20px;flex-direction:column}.tvk-detail-price-box{border-left:0;border-top:1px solid #e6edf4;padding-left:0;padding-top:20px;min-width:0;width:100%}}

/* ===== Clean responsive product/activity detail layout ===== */
.tvk-detail-page {
    background: #f7f9fc;
}

.tvk-detail-page .tvk-service-hero {
    padding: 42px 0 46px;
    overflow: hidden;
}

.tvk-detail-page .tvk-service-hero.has-detail-image .container {
    min-height: 0;
    grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
    gap: 56px;
    align-items: center;
}

.tvk-detail-page .tvk-service-copy {
    min-width: 0;
}

.tvk-detail-page .tvk-service-copy span {
    margin-bottom: 12px;
}

.tvk-detail-page .tvk-service-copy h1 {
    font-size: clamp(42px, 4.4vw, 64px);
    line-height: 1.04;
    overflow-wrap: anywhere;
}

.tvk-detail-page .tvk-service-copy h2 {
    font-size: clamp(21px, 2vw, 28px);
    line-height: 1.3;
    margin: 14px 0 10px;
}

.tvk-detail-page .tvk-service-copy p {
    max-width: 620px;
    font-size: 16px;
    line-height: 1.65;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tvk-detail-page .tvk-detail-hero-image {
    width: 100%;
    height: 315px;
    border: 4px solid rgba(255,255,255,.22);
    border-radius: 22px;
    box-shadow: 0 18px 38px rgba(2,32,71,.25);
}

.tvk-detail-page > .container {
    padding-top: 30px;
    padding-bottom: 56px;
}

.tvk-detail-page .tvk-detail-summary {
    margin-top: 0;
    padding: 26px 30px;
    border-radius: 18px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 290px;
    gap: 32px;
    align-items: center;
    box-shadow: 0 10px 28px rgba(15,23,42,.08);
}

.tvk-detail-page .tvk-detail-summary-main {
    min-width: 0;
}

.tvk-detail-page .tvk-detail-summary-main h3 {
    margin: 14px 0 12px;
}

.tvk-detail-page .tvk-detail-summary-main p {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 10px 0;
}

.tvk-detail-page .tvk-detail-price-box {
    min-width: 0;
    width: 100%;
    padding-left: 30px;
    align-items: stretch;
}

.tvk-detail-page .tvk-detail-price-box strong {
    font-size: 28px;
    line-height: 1.2;
    white-space: nowrap;
}

.tvk-detail-page .tvk-detail-price-box .btn {
    min-height: 48px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    font-size: 16px;
    font-weight: 800;
}

.tvk-detail-page .tvk-back-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 12px;
}

.tvk-detail-page .tvk-section {
    margin-top: 34px;
}

.tvk-detail-page .tvk-section-head {
    margin-bottom: 16px;
}

.tvk-detail-page .tvk-section-head h2 {
    margin-bottom: 5px;
}

.tvk-detail-page .tvk-feature-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.tvk-detail-page .tvk-feature-card,
.tvk-detail-page .tvk-reason-card {
    min-height: 150px;
    padding: 20px;
    border-radius: 14px;
}

.tvk-detail-page .tvk-feature-card i,
.tvk-detail-page .tvk-reason-card i {
    width: 46px;
    height: 46px;
    margin-bottom: 14px;
}

.tvk-detail-page .tvk-step-list {
    gap: 14px;
}

.tvk-detail-page .tvk-step-item {
    min-height: 82px;
    border-radius: 12px;
}

@media (max-width: 1100px) {
    .tvk-detail-page .tvk-service-hero.has-detail-image .container {
        grid-template-columns: minmax(0, 1fr) minmax(360px, .95fr);
        gap: 34px;
    }
    .tvk-detail-page .tvk-service-copy h1 {
        font-size: clamp(38px, 5vw, 54px);
    }
}

@media (max-width: 900px) {
    .tvk-detail-page .tvk-service-hero {
        padding: 34px 0;
    }
    .tvk-detail-page .tvk-service-hero.has-detail-image .container {
        grid-template-columns: 1fr;
        gap: 24px;
    }
    .tvk-detail-page .tvk-detail-hero-image {
        height: 280px;
    }
    .tvk-detail-page .tvk-detail-summary {
        grid-template-columns: 1fr;
        gap: 22px;
    }
    .tvk-detail-page .tvk-detail-price-box {
        border-left: 0;
        border-top: 1px solid #e6edf4;
        padding: 22px 0 0;
    }
}

@media (max-width: 700px) {
    .tvk-detail-page .tvk-feature-grid {
        grid-template-columns: 1fr;
    }
    .tvk-detail-page .tvk-detail-summary {
        padding: 22px 20px;
    }
    .tvk-detail-page .tvk-detail-hero-image {
        height: 230px;
    }
}

/* Interactive booking panel for travel detail pages */
.tvk-booking-trigger{width:100%;min-height:52px;border:0;border-radius:14px;padding:0 18px;background:linear-gradient(135deg,#ff6b35,#f4511e);color:#fff;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;font-size:16px;font-weight:800;line-height:1.2;box-shadow:0 10px 22px rgba(244,81,30,.24);transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;cursor:pointer}.tvk-booking-trigger:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(244,81,30,.3);filter:saturate(1.08)}.tvk-booking-trigger:focus-visible{outline:3px solid rgba(1,148,243,.3);outline-offset:3px}.tvk-booking-trigger .tvk-booking-chevron{font-size:12px;transition:transform .2s ease}.tvk-booking-trigger.is-open .tvk-booking-chevron{transform:rotate(180deg)}
.tvk-booking-panel{margin-top:18px;background:#fff;border:1px solid #dce7f1;border-radius:20px;padding:26px 28px;box-shadow:0 16px 38px rgba(15,23,42,.09);opacity:0;transform:translateY(-10px);transition:opacity .22s ease,transform .22s ease}.tvk-booking-panel.is-visible{opacity:1;transform:translateY(0)}.tvk-booking-panel-head{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;padding-bottom:20px;border-bottom:1px solid #e8eef5}.tvk-booking-kicker{display:inline-flex;align-items:center;gap:8px;color:var(--page-accent);font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.tvk-booking-panel-head h3{margin:7px 0 5px;font-size:24px;font-weight:850;color:#17263a}.tvk-booking-panel-head p{margin:0;color:#64748b}.tvk-booking-close{width:40px;height:40px;flex:0 0 40px;border:0;border-radius:50%;background:#eef6fc;color:#25638c;display:grid;place-items:center;cursor:pointer;transition:.2s ease}.tvk-booking-close:hover{background:#dff1fd;transform:rotate(5deg)}
.tvk-booking-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(220px,.9fr);gap:16px;align-items:end;padding-top:22px}.tvk-booking-field label{display:block;margin-bottom:8px;color:#34465c;font-size:13px;font-weight:800}.tvk-booking-input{height:50px;border:1px solid #d7e2ec;border-radius:12px;background:#fff;display:flex;align-items:center;gap:10px;padding:0 14px;transition:border-color .2s,box-shadow .2s}.tvk-booking-input:focus-within{border-color:var(--page-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--page-accent) 15%,transparent)}.tvk-booking-input i{color:var(--page-accent)}.tvk-booking-input input,.tvk-booking-input select{width:100%;border:0;outline:0;background:transparent;color:#1f3147;font-weight:650;min-width:0}.tvk-quantity-control{height:50px;border:1px solid #d7e2ec;border-radius:12px;display:grid;grid-template-columns:44px 1fr 44px;overflow:hidden}.tvk-quantity-control button{border:0;background:#edf7fe;color:#087bc2;font-size:22px;font-weight:800;cursor:pointer}.tvk-quantity-control button:hover{background:#dff1fd}.tvk-quantity-control input{width:100%;border:0;text-align:center;font-weight:800;color:#17263a;appearance:textfield}.tvk-quantity-control input::-webkit-inner-spin-button{display:none}.tvk-booking-total{grid-column:1/4;display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:16px 18px;border-radius:14px;background:#f6f9fc;border:1px solid #e4ecf4}.tvk-booking-total small{color:#64748b}.tvk-booking-total strong{font-size:22px;color:#f4511e}.tvk-booking-total span{margin-left:auto;color:#7b8a9d;font-size:13px}.tvk-booking-submit{grid-column:4;grid-row:2;min-height:58px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--page-accent),#0876c1);color:#fff;font-weight:850;display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;box-shadow:0 10px 24px rgba(1,148,243,.22);transition:.2s ease}.tvk-booking-submit:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(1,148,243,.3)}.tvk-booking-message{margin-top:18px;padding:16px 18px;border-radius:14px;background:#ecfdf3;border:1px solid #b7efca;color:#18733a;display:flex;gap:12px;align-items:flex-start}.tvk-booking-message i{font-size:22px;margin-top:2px}.tvk-booking-message strong{display:block}.tvk-booking-message p{margin:3px 0 0;color:#43815a}
@media(max-width:1050px){.tvk-booking-form{grid-template-columns:repeat(2,minmax(0,1fr))}.tvk-booking-total{grid-column:1/2}.tvk-booking-submit{grid-column:2;grid-row:auto}.tvk-booking-total span{width:100%;margin-left:0}}
@media(max-width:700px){.tvk-booking-panel{padding:22px 18px}.tvk-booking-panel-head h3{font-size:21px}.tvk-booking-form{grid-template-columns:1fr}.tvk-booking-total,.tvk-booking-submit{grid-column:1}.tvk-booking-submit{min-height:52px}.tvk-detail-page .tvk-detail-price-box .tvk-booking-trigger{white-space:normal}}

/* 2026 UX fixes: search popovers, sliders, save button and professional admin */
.tvk-search-trigger{border:0;background:#fff;text-align:left;cursor:pointer;display:flex;align-items:center;gap:12px}.tvk-search-popover{display:none;position:absolute;z-index:1060;top:calc(100% + 8px);left:0;min-width:320px;background:#fff;border:1px solid #dbe4f0;border-radius:16px;padding:16px;box-shadow:0 18px 45px rgba(15,23,42,.18)}.tvk-search-popover.open{display:block}.tvk-date-popover{grid-template-columns:1fr 1fr;gap:12px}.tvk-date-popover.open{display:grid}.tvk-date-popover button{grid-column:1/-1}.tvk-search-popover label{display:flex;flex-direction:column;gap:6px;font-weight:700}.tvk-search-popover input{border:1px solid #cbd5e1;border-radius:10px;padding:10px}.tvk-counter-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid #eef2f7}.tvk-counter-row>div{display:flex;align-items:center;gap:12px}.tvk-counter-row button{width:32px;height:32px;border:1px solid #cbd5e1;border-radius:50%;background:#fff;font-size:20px;line-height:1}.tvk-price-values{display:flex;justify-content:space-between;font-size:13px;margin:8px 0 14px}.tvk-dual-range{position:relative;height:28px}.tvk-range-track,.tvk-range-fill{position:absolute;top:12px;height:5px;border-radius:99px}.tvk-range-track{left:0;right:0;background:#dbe4f0}.tvk-range-fill{background:#149be7}.tvk-dual-range input[type=range]{position:absolute;left:0;top:2px;width:100%;height:20px;background:transparent;pointer-events:none;appearance:none}.tvk-dual-range input::-webkit-slider-thumb{appearance:none;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid #149be7;box-shadow:0 2px 8px rgba(0,0,0,.2);pointer-events:auto;cursor:grab}.tvk-hotel-result-card{position:relative}.tvk-save-room-form{position:absolute;top:14px;left:245px;z-index:5}.tvk-save-room-btn{width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.95);box-shadow:0 5px 18px rgba(15,23,42,.2);font-size:18px;color:#334155}.tvk-save-room-btn.saved{color:#ef4444}.dashboard-pro{color:#0f172a}.dashboard-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:22px}.dashboard-kicker{font-size:12px;font-weight:800;color:#2563eb;letter-spacing:.08em}.dashboard-head h1{font-size:32px;font-weight:900;margin:4px 0}.dashboard-head p{color:#64748b;margin:0}.dashboard-filter{display:flex;gap:10px;background:#fff;padding:12px;border:1px solid #e2e8f0;border-radius:16px;box-shadow:0 10px 30px rgba(15,23,42,.06)}.dashboard-filter select,.dashboard-filter input{border:1px solid #dbe3ef;border-radius:10px;padding:9px 11px}.dashboard-filter button{border:0;border-radius:10px;background:#ff5a24;color:#fff;font-weight:800;padding:0 18px}.dashboard-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:20px}.dashboard-stat-grid article{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:18px;min-width:0;box-shadow:0 8px 25px rgba(15,23,42,.04)}.dashboard-stat-grid article>i{color:#2563eb;font-size:20px}.dashboard-stat-grid span{display:block;color:#64748b;font-size:13px;margin:10px 0 5px}.dashboard-stat-grid strong{display:block;font-size:clamp(20px,2vw,30px);line-height:1.15;overflow-wrap:anywhere}.dashboard-stat-grid small{color:#64748b}.dashboard-main-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(300px,1fr);gap:20px}.dashboard-panel{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:20px;box-shadow:0 8px 25px rgba(15,23,42,.04)}.panel-title{display:flex;justify-content:space-between;align-items:flex-start;gap:15px}.panel-title h3,.dashboard-panel h3{font-size:18px;font-weight:850}.panel-title p{color:#64748b;font-size:13px}.panel-title>strong{font-size:22px;color:#2563eb}.chart-wrap{height:360px}.mini-chart{height:230px}.alert-card{display:flex;gap:12px;padding:14px;border-radius:14px;margin-bottom:12px}.alert-card i{font-size:20px}.alert-card span{display:block;font-size:12px;margin-top:3px}.alert-card.danger{background:#fff1f2;color:#be123c}.alert-card.warning{background:#fffbeb;color:#b45309}.dashboard-bottom-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;margin-top:20px}.metric-list{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.metric-list div,.finance-summary div{background:#f8fafc;border-radius:12px;padding:14px}.metric-list span,.finance-summary span{display:block;color:#64748b;font-size:12px}.metric-list strong,.finance-summary strong{font-size:22px}.finance-summary{display:grid;grid-template-columns:1fr 1fr;gap:12px}.payment-search-bar{display:flex;gap:10px;margin:18px 0 8px}.payment-search-input{flex:1;display:flex;align-items:center;gap:10px;border:1px solid #dbe3ef;border-radius:12px;padding:0 14px}.payment-search-input input{border:0;outline:0;width:100%;padding:12px 0}.payment-search-bar select,.payment-search-bar button,.payment-search-bar>a{border-radius:12px;padding:10px 16px;border:1px solid #dbe3ef}.payment-search-bar button{background:#2563eb;color:#fff;font-weight:700}.payment-counts{display:flex;gap:20px;color:#64748b;font-size:13px;margin-bottom:14px}.payment-table thead th{background:#f8fafc;padding:14px}.payment-table td{padding:14px}.payment-amount{font-weight:800;color:#ea580c}.method-badge,.status-badge{display:inline-block;border-radius:99px;padding:6px 10px;font-size:12px;font-weight:700}.method-badge{background:#eff6ff;color:#1d4ed8}.status-badge.active{background:#ecfdf5;color:#047857}.status-badge.deleted{background:#fef2f2;color:#b91c1c}@media(max-width:1100px){.dashboard-stat-grid{grid-template-columns:repeat(2,1fr)}.dashboard-main-grid,.dashboard-bottom-grid{grid-template-columns:1fr}.metric-list{grid-template-columns:repeat(3,1fr)}}@media(max-width:700px){.dashboard-head,.dashboard-filter,.payment-search-bar{flex-direction:column;align-items:stretch}.dashboard-stat-grid{grid-template-columns:1fr}.metric-list{grid-template-columns:repeat(2,1fr)}.tvk-search-popover{min-width:280px;max-width:calc(100vw - 30px)}.tvk-save-room-form{left:auto;right:14px}}


/* 47 - Search widgets, payment schema compatibility and compact wishlist button */
.tvk-hotel-result-image-wrap{position:relative;min-width:0;min-height:196px;overflow:hidden;border-radius:8px}
.tvk-hotel-result-image-wrap .tvk-hotel-result-image{display:block;width:100%;height:100%;min-height:196px}
.tvk-hotel-result-image-wrap .tvk-save-room-form{position:absolute;top:10px;right:10px;left:auto;z-index:8;margin:0;opacity:0;visibility:hidden;transform:translateY(-4px) scale(.92);transition:opacity .18s ease,transform .18s ease,visibility .18s ease}
.tvk-hotel-result-image-wrap:hover .tvk-save-room-form,.tvk-save-room-form:focus-within{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.tvk-hotel-result-image-wrap .tvk-save-room-btn{width:30px;height:30px;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.9);border-radius:50%;background:rgba(255,255,255,.94);box-shadow:0 4px 14px rgba(15,23,42,.2);font-size:13px;color:#334155;cursor:pointer}
.tvk-hotel-result-image-wrap .tvk-save-room-btn:hover{background:#fff;color:#ef4444;transform:scale(1.06)}
.tvk-hotel-result-image-wrap .tvk-save-room-btn.saved{color:#ef4444}
.tvk-search-trigger{min-height:50px;border:1px solid #cbd5e1!important;border-radius:12px!important;padding:0 16px!important;width:100%;background:#fff!important}
.tvk-search-trigger:focus,.tvk-search-trigger[aria-expanded=true]{outline:0;border-color:#70d400!important;box-shadow:0 0 0 3px rgba(112,212,0,.16)}
.tvk-search-popover{border-radius:12px;padding:18px;box-shadow:0 16px 38px rgba(15,23,42,.18);border:1px solid #e2e8f0}
.tvk-date-popover{min-width:520px}
.tvk-date-popover label{font-size:14px;color:#0f172a}
.tvk-date-popover input{height:44px;font-size:15px}
.tvk-counter-row{padding:13px 2px;font-size:16px;font-weight:750}
.tvk-counter-row button{width:38px;height:38px;background:#e0f2fe;border:0;color:#0f172a}
.tvk-counter-row button:hover{background:#bae6fd}
@media(max-width:768px){.tvk-date-popover{min-width:min(520px,calc(100vw - 32px))}.tvk-hotel-result-image-wrap{min-height:220px}.tvk-hotel-result-image-wrap .tvk-hotel-result-image{min-height:220px}.tvk-hotel-result-image-wrap .tvk-save-room-form{opacity:1;visibility:visible;transform:none}}


/* === 48 UX refinement === */
.tvk-hotel-search-card,.tvk-search-card{overflow:visible!important;position:relative;z-index:30}
.tvk-hotel-search-grid label,.tvk-search-card .position-relative{position:relative}
.tvk-search-popover{top:calc(100% + 10px)!important;left:0!important;right:auto!important;min-width:360px;max-width:min(720px,calc(100vw - 32px));z-index:5000!important;background:#fff}
.tvk-date-popover{width:620px;grid-template-columns:1fr 1fr!important;gap:18px!important;padding:22px!important}
.tvk-date-popover label{font-size:14px}.tvk-date-popover input{height:48px;font-size:15px;background:#fff}
.tvk-counter-row{min-width:320px;padding:13px 0}.tvk-counter-row span{font-size:16px;font-weight:800}.tvk-counter-row button{width:42px;height:42px;background:#e0f2fe;border:0;color:#0f172a}
.tvk-destination-field{position:relative}.tvk-destination-dropdown{display:none;position:absolute;left:-1px;right:-1px;top:calc(100% + 8px);max-height:340px;overflow-y:auto;background:#fff;border:1px solid #dbe4f0;border-radius:14px;box-shadow:0 18px 45px rgba(15,23,42,.18);z-index:5001;padding:8px}.tvk-destination-dropdown.is-open{display:block}.tvk-destination-heading{font-size:15px;font-weight:900;padding:10px 12px}.tvk-destination-dropdown button{display:flex;width:100%;align-items:center;justify-content:space-between;border:0;border-bottom:1px solid #eef2f7;background:#fff;padding:12px;text-align:left;border-radius:8px}.tvk-destination-dropdown button:hover{background:#eff6ff}.tvk-destination-dropdown button span{font-size:12px;color:#0284c7;background:#e0f2fe;padding:4px 8px;border-radius:999px}
#homeCitySuggestions{max-height:340px!important;overflow-y:auto!important}
.tvk-dual-range{height:52px!important}.tvk-range-track,.tvk-range-fill{top:23px!important}.tvk-dual-range input[type=range]{height:28px!important}.tvk-dual-range input[type=range]:first-of-type{top:3px!important}.tvk-dual-range input[type=range]:last-of-type{top:19px!important}.tvk-dual-range input::-webkit-slider-thumb{width:22px!important;height:22px!important;border-width:3px!important}
.payment-search-bar{position:relative;flex-wrap:wrap}.payment-filter-toggle{background:#fff!important;color:#2563eb!important;border-color:#bfdbfe!important}.payment-advanced-filter{display:none;width:100%;grid-template-columns:repeat(3,minmax(160px,1fr)) auto;gap:12px;padding:16px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:14px}.payment-advanced-filter.open{display:grid}.payment-advanced-filter label{font-size:12px;font-weight:800;color:#475569}.payment-advanced-filter input{display:block;width:100%;margin-top:6px;padding:10px;border:1px solid #cbd5e1;border-radius:10px}.payment-advanced-filter .apply-date-filter{align-self:end;height:42px}
.delete-page{min-height:70vh;display:grid;place-items:center}.delete-card{width:min(720px,100%);background:#fff;border:1px solid #e2e8f0;border-radius:24px;padding:34px;box-shadow:0 24px 70px rgba(15,23,42,.12);text-align:center}.delete-icon{width:72px;height:72px;margin:0 auto 16px;border-radius:22px;display:grid;place-items:center;background:#fff1f2;color:#e11d48;font-size:28px}.delete-kicker{font-size:12px;font-weight:900;color:#2563eb;letter-spacing:.08em}.delete-card h1{font-size:30px;font-weight:900;margin:8px 0}.delete-card>p{color:#64748b}.delete-summary{display:grid;grid-template-columns:1fr 1fr;gap:12px;text-align:left;margin:24px 0}.delete-summary div{background:#f8fafc;border-radius:14px;padding:14px}.delete-summary span{display:block;color:#64748b;font-size:12px}.delete-summary strong{display:block;margin-top:5px}.delete-actions{display:flex;justify-content:center;gap:12px}.btn-cancel,.btn-confirm-delete{border:0;border-radius:12px;padding:12px 20px;font-weight:800;text-decoration:none}.btn-cancel{background:#e2e8f0;color:#334155}.btn-confirm-delete{background:#e11d48;color:#fff}
.dashboard-vista{max-width:1800px}.dashboard-topbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:16px}.dashboard-topbar h1{font-size:28px;font-weight:900;margin:0}.dashboard-topbar p{margin:3px 0 0;color:#64748b}.vista-stats{grid-template-columns:repeat(6,minmax(0,1fr))}.vista-stats article{padding:14px}.vista-stats strong{font-size:clamp(16px,1.35vw,23px)}.vista-grid-main{display:grid;grid-template-columns:2.1fr 1fr;gap:16px}.vista-grid-secondary{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:16px;margin-top:16px}.occupancy-gauge{width:150px;height:150px;border-radius:50%;margin:14px auto;display:flex;flex-direction:column;align-items:center;justify-content:center;background:conic-gradient(#14b8a6 calc(var(--occ,72)*1%),#e2e8f0 0);position:relative}.occupancy-gauge:before{content:"";position:absolute;inset:18px;border-radius:50%;background:#fff}.occupancy-gauge strong,.occupancy-gauge span{position:relative;z-index:1}.occupancy-gauge strong{font-size:28px}.occupancy-gauge span{font-size:12px;color:#64748b}.room-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.room-kpis div{background:#f8fafc;padding:10px;border-radius:10px}.room-kpis span{display:block;font-size:11px;color:#64748b}.alert-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.alert-row span{padding:14px;border-radius:12px;background:#f8fafc}.vista-alerts{margin-top:16px}
@media(max-width:1250px){.vista-stats{grid-template-columns:repeat(3,1fr)}.vista-grid-secondary{grid-template-columns:1fr 1fr}.vista-grid-secondary section:last-child{grid-column:1/-1}}
@media(max-width:800px){.tvk-date-popover{width:calc(100vw - 30px);grid-template-columns:1fr!important}.payment-advanced-filter{grid-template-columns:1fr}.delete-summary{grid-template-columns:1fr}.dashboard-topbar,.vista-grid-main,.vista-grid-secondary{display:block}.vista-grid-main>*,.vista-grid-secondary>*{margin-bottom:14px}.vista-stats{grid-template-columns:1fr 1fr}.alert-row{grid-template-columns:1fr}}


/* 49 final search overlay fixes */
.tvk-home .tvk-search-card,
.tvk-home .tvk-search-form,
.tvk-hotel-hero,
.tvk-hotel-hero .container,
.tvk-hotel-search-card,
.tvk-hotel-search-grid { overflow: visible !important; }
.tvk-home .tvk-search-card,
.tvk-hotel-search-card { position: relative !important; z-index: 200 !important; }
.tvk-home .tvk-search-form .row > div,
.tvk-hotel-search-grid > label { position: relative !important; }
.tvk-search-trigger { position: relative; z-index: 1; min-width: 0; }
.tvk-search-trigger > i:first-child { flex: 0 0 auto; position: static !important; margin: 0 !important; }
.tvk-search-trigger > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tvk-search-popover {
  z-index: 99999 !important;
  top: calc(100% + 10px) !important;
  left: 0 !important;
  right: auto !important;
  transform: none !important;
  overflow: visible !important;
}
.tvk-search-popover.open { display: block !important; }
.tvk-calendar-popover {
  width: 410px !important;
  min-width: 410px !important;
  max-width: calc(100vw - 30px) !important;
  padding: 14px !important;
  border-radius: 14px !important;
}
.tvk-calendar-popover.open { display: block !important; }
.tvk-calendar { width: 100%; }
.tvk-calendar-head { display:grid; grid-template-columns:36px 1fr 36px; align-items:center; margin-bottom:10px; }
.tvk-calendar-head strong { text-align:center; font-size:19px; font-weight:800; color:#0f172a; }
.tvk-calendar-head button { width:34px; height:34px; border:0; background:transparent; color:#0ea5e9; font-size:30px; line-height:1; border-radius:50%; }
.tvk-calendar-head button:hover { background:#eff6ff; }
.tvk-calendar-week,.tvk-calendar-days { display:grid; grid-template-columns:repeat(7,1fr); text-align:center; }
.tvk-calendar-week { padding-bottom:8px; border-bottom:1px solid #d9e0e8; color:#475569; font-size:14px; }
.tvk-calendar-week .sun,.tvk-calendar-days .sun { color:#ef1616; }
.tvk-calendar-days { gap:4px 2px; padding-top:8px; }
.tvk-calendar-days .empty { height:38px; }
.tvk-calendar-days button { height:38px; border:0; background:transparent; border-radius:999px; font-size:16px; color:#0f172a; position:relative; z-index:1; }
.tvk-calendar-days button:hover:not(.disabled) { background:#e0f2fe; }
.tvk-calendar-days button.disabled { color:#cbd5e1; cursor:not-allowed; }
.tvk-calendar-days button.in-range { background:#dff3ff; border-radius:0; }
.tvk-calendar-days button.selected { background:#0797e6; color:#fff; box-shadow:0 0 0 2px #0797e6; }
.tvk-popover-done { width:100%; margin-top:12px; height:44px; border:0; border-radius:10px; background:#1769ff; color:#fff; font-weight:800; }
#homeGuestPopover,#roomGuestPopover { width:365px !important; min-width:365px !important; padding:16px 20px !important; }
.tvk-counter-row { min-height:72px; padding:13px 0 !important; }
.tvk-counter-row > span { font-size:17px; font-weight:800; color:#132238; }
.tvk-counter-row button { width:46px !important; height:46px !important; background:#dff3ff !important; border:0 !important; font-size:22px !important; }
.tvk-counter-row strong { min-width:26px; text-align:center; font-size:18px; }
#homeCitySuggestions,.tvk-destination-dropdown {
  z-index:99998 !important;
  max-height:330px !important;
  overflow-y:auto !important;
  overscroll-behavior:contain;
  scrollbar-width:thin;
}
.tvk-home .tvk-main,.tvk-hotel-content,.tvk-hotel-trust-row { position:relative; z-index:1 !important; }
@media (max-width: 900px){
  .tvk-calendar-popover,#homeGuestPopover,#roomGuestPopover{width:min(410px,calc(100vw - 24px))!important;min-width:0!important;left:50%!important;transform:translateX(-50%)!important}
}

/* 50 - booking search panels matched to supplied reference */
#homeDatePopover,#roomDatePopover{
  width:410px!important;min-width:410px!important;max-width:calc(100vw - 20px)!important;
  padding:10px 12px 18px!important;border-radius:10px!important;
  border:1px solid #d9dee7!important;box-shadow:0 4px 12px rgba(15,23,42,.16)!important;
}
#homeDatePopover .tvk-popover-done,#roomDatePopover .tvk-popover-done{display:none!important}
.tvk-calendar-head{margin:0 0 6px!important;grid-template-columns:34px 1fr 34px!important}
.tvk-calendar-head strong{font-size:20px!important;color:#050b14!important}
.tvk-calendar-head button{font-size:27px!important;color:#cbd5e1!important}
.tvk-calendar-week{font-size:15px!important;padding:5px 0 8px!important}
.tvk-calendar-days{gap:4px 2px!important;padding-top:10px!important}
.tvk-calendar-days .empty,.tvk-calendar-days button{height:60px!important}
.tvk-calendar-days button{font-size:17px!important;font-weight:650!important}
.tvk-calendar-days button.selected{background:#fff!important;color:#0f172a!important;box-shadow:inset 0 0 0 2px #0797e6!important}
.tvk-calendar-days button.in-range{background:#0797e6!important;color:#fff!important;border-radius:0!important}
.tvk-calendar-days button.selected:first-of-type{border-radius:999px 0 0 999px!important}
#homeGuestPopover,#roomGuestPopover{
  width:365px!important;min-width:365px!important;padding:12px 18px 14px!important;
  border-radius:10px!important;border:1px solid #d9dee7!important;
  box-shadow:0 4px 12px rgba(15,23,42,.18)!important;
}
.tvk-counter-row{min-height:60px!important;padding:10px 2px!important}
.tvk-counter-row>span{display:flex!important;align-items:center!important;gap:14px!important;font-size:17px!important}
.tvk-counter-row>span>i{width:22px!important;text-align:center!important;font-size:22px!important;font-weight:400!important;color:#17212f!important}
.tvk-counter-row>div{gap:14px!important}
.tvk-counter-row button{width:42px!important;height:42px!important;font-size:21px!important;background:#dff3ff!important;color:#142033!important}
.tvk-counter-row strong{font-size:18px!important;min-width:22px!important}
.tvk-guest-done{display:block;margin:12px 0 0 auto;border:0;background:transparent;color:#078ef0;font-size:17px;font-weight:800;padding:4px 2px;cursor:pointer}
.tvk-guest-done:hover{text-decoration:underline}
#homeDateTrigger,#roomDateTrigger,#homeGuestTrigger,#roomGuestTrigger{height:52px!important;border:1px solid #cbd5e1!important;border-radius:10px!important;padding:0 14px!important}
#homeDateTrigger>i,#roomDateTrigger>i,#homeGuestTrigger>i:first-child,#roomGuestTrigger>i:first-child{font-size:24px!important;color:#17212f!important}
#homeDateTrigger>span,#roomDateTrigger>span,#homeGuestTrigger>span,#roomGuestTrigger>span{font-size:16px!important;font-weight:500!important;color:#17212f!important}
#homeGuestTrigger>i:last-child,#roomGuestTrigger em{margin-left:auto!important;width:34px!important;height:34px!important;border-radius:50%!important;background:#dff3ff!important;display:grid!important;place-items:center!important;color:#0f172a!important;font-style:normal!important;transition:transform .18s ease!important}
#homeGuestTrigger:has(+ #homeGuestPopover.open)>i:last-child,#roomGuestTrigger:has(+ #roomGuestPopover.open) em{transform:rotate(180deg)!important}
@media(max-width:600px){
 #homeDatePopover,#roomDatePopover,#homeGuestPopover,#roomGuestPopover{width:calc(100vw - 24px)!important;min-width:0!important}
 .tvk-calendar-days .empty,.tvk-calendar-days button{height:48px!important}
}

/* Home search panels: exact requested layout, scoped to home only */
#homeDatePopover{
  width:min(800px,calc(100vw - 24px))!important;
  min-width:720px!important;
  padding:0 0 24px!important;
  border:1px solid #d7dde6!important;
  border-radius:4px!important;
  background:#fff!important;
  box-shadow:0 5px 16px rgba(15,23,42,.18)!important;
  overflow:hidden!important;
}
#homeDatePopover .tvk-home-date-panel-head h3{margin:0;padding:20px;font-size:26px;font-weight:800;color:#050b14;border-bottom:1px solid #edf0f4}
#homeDatePopover .tvk-home-date-summary{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid #edf0f4}
#homeDatePopover .tvk-home-date-summary>div{padding:12px 20px 10px}
#homeDatePopover .tvk-home-date-summary span{display:block;color:#667085;font-size:15px;line-height:1.25}
#homeDatePopover .tvk-home-date-summary strong{display:block;margin-top:3px;font-size:18px;line-height:1.25;color:#050b14}
#homeDatePopover .tvk-home-calendar{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:26px 16px 0}
#homeDatePopover .tvk-home-month{min-width:0}
#homeDatePopover .tvk-home-month-head{display:grid;grid-template-columns:36px 1fr 36px;align-items:center;margin-bottom:10px}
#homeDatePopover .tvk-home-month-head strong{text-align:center;font-size:20px;font-weight:800;color:#050b14;white-space:nowrap}
#homeDatePopover .tvk-home-month-head button{width:34px;height:34px;border:0;background:transparent;color:#0797e6;font-size:30px;line-height:1;cursor:pointer}
#homeDatePopover .tvk-home-month:first-child .tvk-home-month-head button{color:#cbd5e1}
#homeDatePopover .tvk-home-week,#homeDatePopover .tvk-home-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));text-align:center}
#homeDatePopover .tvk-home-week{padding:6px 0 8px;border-bottom:1px solid #ccd3dc;color:#475569;font-size:14px}
#homeDatePopover .tvk-home-week .sun,#homeDatePopover .tvk-home-days .sun{color:red}
#homeDatePopover .tvk-home-days{padding-top:8px;row-gap:12px}
#homeDatePopover .tvk-home-days .empty,#homeDatePopover .tvk-home-days button{height:52px}
#homeDatePopover .tvk-home-days button{border:0;background:transparent;font-size:16px;font-weight:600;color:#111827;position:relative;cursor:pointer}
#homeDatePopover .tvk-home-days button.disabled{color:#c9ced5;cursor:not-allowed}
#homeDatePopover .tvk-home-days button.in-range{background:#0797e6;color:#fff;border-radius:0}
#homeDatePopover .tvk-home-days button.selected{background:#fff;color:#111827;box-shadow:inset 0 0 0 2px #0797e6;border-radius:999px;z-index:1}
#homeGuestPopover{
  width:468px!important;min-width:468px!important;padding:18px 20px 20px!important;
  border:1px solid #d7dde6!important;border-radius:5px!important;background:#fff!important;
  box-shadow:0 5px 16px rgba(15,23,42,.18)!important
}
#homeGuestPopover .tvk-counter-row{min-height:70px!important;padding:10px 6px!important;border-bottom:1px solid #e5e7eb!important}
#homeGuestPopover .tvk-counter-row>span{font-size:18px!important;font-weight:600!important;gap:16px!important}
#homeGuestPopover .tvk-counter-row>span>i{font-size:23px!important;color:#0797e6!important}
#homeGuestPopover .tvk-counter-row>div{display:grid!important;grid-template-columns:48px 72px 48px!important;align-items:center!important;gap:0!important}
#homeGuestPopover .tvk-counter-row button{width:48px!important;height:48px!important;border-radius:8px!important;background:#f4f6f8!important;color:#0797e6!important;font-size:24px!important}
#homeGuestPopover .tvk-counter-row strong{min-width:72px!important;height:48px!important;display:grid!important;place-items:center!important;border-bottom:1px solid #d5dae1!important;font-size:18px!important}
#homeGuestPopover .tvk-guest-done{margin:14px 0 0 auto!important;padding:10px 16px!important;border-radius:8px!important;background:#0797e6!important;color:#fff!important;font-size:17px!important;text-decoration:none!important}
#homeDateTrigger,#homeGuestTrigger{border-radius:0!important;height:60px!important;border:1px solid #8492a6!important;background:#fff!important;padding:0 16px!important}
#homeDateTrigger>i,#homeGuestTrigger>i:first-child{color:#0797e6!important;font-size:25px!important}
#homeDateTrigger>span,#homeGuestTrigger>span{font-size:18px!important;font-weight:600!important;color:#050b14!important}
#homeGuestTrigger>i:last-child{background:transparent!important;color:#0797e6!important}
@media(max-width:900px){
 #homeDatePopover{min-width:0!important;width:calc(100vw - 24px)!important;left:50%!important;transform:translateX(-50%)!important}
 #homeDatePopover .tvk-home-calendar{grid-template-columns:1fr}
 #homeDatePopover .tvk-home-month:nth-child(2){display:none}
 #homeGuestPopover{min-width:0!important;width:calc(100vw - 24px)!important;left:50%!important;transform:translateX(-50%)!important}
}

/* Home search correction: keep the existing structure, fix icon alignment and calendar grid only */
.tvk-home #homeDateTrigger,
.tvk-home #homeGuestTrigger {
  display: flex !important;
  align-items: center !important;
  height: 52px !important;
  min-height: 52px !important;
  padding: 0 16px !important;
  gap: 12px !important;
  line-height: 1 !important;
}
.tvk-home #homeDateTrigger > i:first-child,
.tvk-home #homeGuestTrigger > i:first-child {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  flex: 0 0 24px !important;
  width: 24px !important;
  height: 52px !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}
.tvk-home #homeDateTrigger > span,
.tvk-home #homeGuestTrigger > span {
  display: flex !important;
  align-items: center !important;
  height: 52px !important;
  line-height: 1.2 !important;
}
.tvk-home #homeGuestTrigger > i:last-child {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  margin-left: auto !important;
}

.tvk-home #homeDatePopover {
  width: 800px !important;
  min-width: 800px !important;
  max-width: calc(100vw - 24px) !important;
}
.tvk-home #homeDatePopover .tvk-home-calendar {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 20px !important;
  padding: 26px 16px 0 !important;
}
.tvk-home #homeDatePopover .tvk-home-month-head button,
.tvk-home #homeDatePopover .tvk-home-days button {
  grid-column: auto !important;
}
.tvk-home #homeDatePopover .tvk-home-week,
.tvk-home #homeDatePopover .tvk-home-days {
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  width: 100% !important;
}
.tvk-home #homeDatePopover .tvk-home-days {
  row-gap: 12px !important;
  column-gap: 0 !important;
}
.tvk-home #homeDatePopover .tvk-home-days .empty,
.tvk-home #homeDatePopover .tvk-home-days button {
  width: 100% !important;
  height: 52px !important;
  min-width: 0 !important;
  padding: 0 !important;
}
@media (max-width: 900px) {
  .tvk-home #homeDatePopover {
    width: calc(100vw - 24px) !important;
    min-width: 0 !important;
  }
  .tvk-home #homeDatePopover .tvk-home-calendar {
    grid-template-columns: 1fr !important;
  }
}

/* Hotel search panels matched to the working home search, without changing page structure */
.tvk-hotel-results-page #roomDateTrigger,
.tvk-hotel-results-page #roomGuestTrigger {
  display:flex!important;
  align-items:center!important;
  height:52px!important;
  min-height:52px!important;
  padding:0 16px!important;
  gap:12px!important;
  line-height:1!important;
}
.tvk-hotel-results-page #roomDateTrigger>i:first-child,
.tvk-hotel-results-page #roomGuestTrigger>i:first-child {
  position:static!important;
  inset:auto!important;
  transform:none!important;
  flex:0 0 24px!important;
  width:24px!important;
  height:52px!important;
  margin:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  line-height:1!important;
}
.tvk-hotel-results-page #roomDateTrigger>span,
.tvk-hotel-results-page #roomGuestTrigger>span {
  display:flex!important;
  align-items:center!important;
  height:52px!important;
  line-height:1.2!important;
  min-width:0!important;
}
.tvk-hotel-results-page #roomGuestTrigger>em {
  position:static!important;
  inset:auto!important;
  margin-left:auto!important;
  flex:0 0 34px!important;
}
.tvk-hotel-results-page #roomDatePopover {
  width:800px!important;
  min-width:800px!important;
  max-width:calc(100vw - 24px)!important;
  padding:0 0 24px!important;
  border:1px solid #d7dde6!important;
  border-radius:4px!important;
  background:#fff!important;
  box-shadow:0 5px 16px rgba(15,23,42,.18)!important;
  overflow:hidden!important;
  z-index:9999!important;
}
.tvk-hotel-results-page #roomDatePopover .tvk-home-date-panel-head h3{margin:0;padding:20px;font-size:26px;font-weight:800;color:#050b14;border-bottom:1px solid #edf0f4}
.tvk-hotel-results-page #roomDatePopover .tvk-home-date-summary{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid #edf0f4}
.tvk-hotel-results-page #roomDatePopover .tvk-home-date-summary>div{padding:12px 20px 10px}
.tvk-hotel-results-page #roomDatePopover .tvk-home-date-summary span{display:block;color:#667085;font-size:15px;line-height:1.25}
.tvk-hotel-results-page #roomDatePopover .tvk-home-date-summary strong{display:block;margin-top:3px;font-size:18px;line-height:1.25;color:#050b14}
.tvk-hotel-results-page #roomDatePopover .tvk-home-calendar{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:20px!important;padding:26px 16px 0!important}
.tvk-hotel-results-page #roomDatePopover .tvk-home-month{min-width:0}
.tvk-hotel-results-page #roomDatePopover .tvk-home-month-head{display:grid;grid-template-columns:36px 1fr 36px;align-items:center;margin-bottom:10px}
.tvk-hotel-results-page #roomDatePopover .tvk-home-month-head strong{text-align:center;font-size:20px;font-weight:800;color:#050b14;white-space:nowrap}
.tvk-hotel-results-page #roomDatePopover .tvk-home-month-head button{grid-column:auto!important;width:34px;height:34px;border:0;background:transparent;color:#0797e6;font-size:30px;line-height:1;cursor:pointer}
.tvk-hotel-results-page #roomDatePopover .tvk-home-week,
.tvk-hotel-results-page #roomDatePopover .tvk-home-days{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;width:100%!important;text-align:center}
.tvk-hotel-results-page #roomDatePopover .tvk-home-week{padding:6px 0 8px;border-bottom:1px solid #ccd3dc;color:#475569;font-size:14px}
.tvk-hotel-results-page #roomDatePopover .tvk-home-week .sun,
.tvk-hotel-results-page #roomDatePopover .tvk-home-days .sun{color:red}
.tvk-hotel-results-page #roomDatePopover .tvk-home-days{padding-top:8px;row-gap:12px!important;column-gap:0!important}
.tvk-hotel-results-page #roomDatePopover .tvk-home-days .empty,
.tvk-hotel-results-page #roomDatePopover .tvk-home-days button{grid-column:auto!important;width:100%!important;height:52px!important;min-width:0!important;padding:0!important}
.tvk-hotel-results-page #roomDatePopover .tvk-home-days button{border:0;background:transparent;font-size:16px;font-weight:600;color:#111827;position:relative;cursor:pointer}
.tvk-hotel-results-page #roomDatePopover .tvk-home-days button.disabled{color:#c9ced5;cursor:not-allowed}
.tvk-hotel-results-page #roomDatePopover .tvk-home-days button.in-range{background:#0797e6;color:#fff;border-radius:0}
.tvk-hotel-results-page #roomDatePopover .tvk-home-days button.selected{background:#fff;color:#111827;box-shadow:inset 0 0 0 2px #0797e6;border-radius:999px;z-index:1}
.tvk-hotel-results-page #roomGuestPopover{
  width:468px!important;min-width:468px!important;padding:18px 20px 20px!important;
  border:1px solid #d7dde6!important;border-radius:5px!important;background:#fff!important;
  box-shadow:0 5px 16px rgba(15,23,42,.18)!important;z-index:9999!important
}
.tvk-hotel-results-page #roomGuestPopover .tvk-counter-row{min-height:70px!important;padding:10px 6px!important;border-bottom:1px solid #e5e7eb!important}
.tvk-hotel-results-page #roomGuestPopover .tvk-counter-row>span{font-size:18px!important;font-weight:600!important;gap:16px!important}
.tvk-hotel-results-page #roomGuestPopover .tvk-counter-row>span>i{font-size:23px!important;color:#0797e6!important}
.tvk-hotel-results-page #roomGuestPopover .tvk-counter-row>div{display:grid!important;grid-template-columns:48px 72px 48px!important;align-items:center!important;gap:0!important}
.tvk-hotel-results-page #roomGuestPopover .tvk-counter-row button{width:48px!important;height:48px!important;border-radius:8px!important;background:#f4f6f8!important;color:#0797e6!important;font-size:24px!important}
.tvk-hotel-results-page #roomGuestPopover .tvk-counter-row strong{min-width:72px!important;height:48px!important;display:grid!important;place-items:center!important;border-bottom:1px solid #d5dae1!important;font-size:18px!important}
.tvk-hotel-results-page #roomGuestPopover .tvk-guest-done{margin:14px 0 0 auto!important;padding:10px 16px!important;border-radius:8px!important;background:#0797e6!important;color:#fff!important;font-size:17px!important;text-decoration:none!important}
@media(max-width:900px){
 .tvk-hotel-results-page #roomDatePopover{width:calc(100vw - 24px)!important;min-width:0!important;left:50%!important;transform:translateX(-50%)!important}
 .tvk-hotel-results-page #roomDatePopover .tvk-home-calendar{grid-template-columns:1fr!important}
 .tvk-hotel-results-page #roomDatePopover .tvk-home-month:nth-child(2){display:none}
 .tvk-hotel-results-page #roomGuestPopover{min-width:0!important;width:calc(100vw - 24px)!important;left:50%!important;transform:translateX(-50%)!important}
}

/* Hotel search placement and overlay fix: center like flight search */
.tvk-hotel-results-page .tvk-hotel-hero {
  position: relative !important;
  z-index: 100 !important;
  overflow: visible !important;
}

.tvk-hotel-results-page .tvk-hotel-hero > .container {
  position: relative !important;
  z-index: 101 !important;
  overflow: visible !important;
}

.tvk-hotel-results-page .tvk-hotel-search-card {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  width: min(1260px, calc(100% - 100px)) !important;
  max-width: 1260px !important;
  transform: translateX(-50%) !important;
  z-index: 1000 !important;
  overflow: visible !important;
}

.tvk-hotel-results-page .tvk-hotel-search-grid,
.tvk-hotel-results-page .tvk-hotel-search-grid > label {
  position: relative !important;
  overflow: visible !important;
}

.tvk-hotel-results-page .tvk-search-popover,
.tvk-hotel-results-page .tvk-destination-dropdown {
  z-index: 100000 !important;
}

.tvk-hotel-results-page .tvk-hotel-content,
.tvk-hotel-results-page .tvk-hotel-content > section,
.tvk-hotel-results-page .tvk-hotel-content > div {
  position: relative !important;
  z-index: 1 !important;
}

@media (max-width: 1200px) {
  .tvk-hotel-results-page .tvk-hotel-search-card {
    width: calc(100% - 48px) !important;
  }
}

@media (max-width: 768px) {
  .tvk-hotel-results-page .tvk-hotel-search-card {
    width: calc(100% - 24px) !important;
    left: 50% !important;
    right: auto !important;
  }
}

.permission-region-card{margin:18px 0;padding:18px;border:1px solid #e5e7eb;border-radius:14px;background:#f8fafc}.permission-region-card label{display:block;font-weight:700;margin-bottom:8px}.permission-region-card small{display:block;margin-top:8px;color:#64748b}

/* Unified admin booking management (room / flight / tour / bus / cruise) */
.travel-booking-page{padding:1.5rem 0 2.5rem}.travel-booking-toolbar{display:flex;flex-wrap:wrap;gap:.65rem;align-items:center;justify-content:flex-end}.travel-booking-filter{display:flex;flex-wrap:wrap;gap:.5rem}.travel-booking-filter .btn{border-radius:12px;font-weight:700;min-width:92px}.travel-booking-search{display:grid;grid-template-columns:minmax(260px,1fr) 190px 120px;gap:.75rem;align-items:center}.travel-booking-board{overflow:auto}.travel-booking-table{min-width:1050px;margin:0}.travel-booking-table thead th{padding:1rem .9rem;background:#f8fafc;color:#334155;border-bottom:1px solid #e2e8f0;white-space:nowrap}.travel-booking-table tbody td{padding:.9rem;border-bottom:1px solid #e9eef5;vertical-align:middle}.travel-booking-table tbody tr{transition:.18s ease;background:#fff}.travel-booking-table tbody tr:hover{background:#f8fbff}.travel-order-code{font-weight:900;color:#0f172a}.travel-service-name{font-weight:800;color:#0f172a;max-width:260px}.travel-customer-name{font-weight:800;color:#0f172a}.travel-customer-contact{display:block;color:#64748b;font-size:.82rem;margin-top:.18rem}.travel-money{font-weight:900;color:#e11d48;white-space:nowrap}.travel-created{white-space:nowrap;color:#475569}.travel-status-cell{min-width:310px}.travel-status-form{display:grid;grid-template-columns:minmax(160px,1fr) 76px;gap:.55rem;align-items:center}.travel-status-form .form-select{border-radius:12px;min-height:42px;font-weight:700}.travel-status-form .btn{border-radius:12px;min-height:42px;white-space:nowrap;font-weight:800}.travel-status-badge{display:inline-flex;align-items:center;gap:.4rem;border-radius:999px;padding:.42rem .72rem;font-weight:800;font-size:.78rem;white-space:nowrap}.travel-status-badge::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}.status-pending{background:#fef3c7;color:#b45309}.status-confirmed{background:#dbeafe;color:#1d4ed8}.status-completed{background:#dcfce7;color:#15803d}.status-cancelled{background:#fee2e2;color:#b91c1c}.travel-empty{padding:4rem 1rem!important;text-align:center;color:#64748b}.travel-empty i{font-size:2rem;display:block;margin-bottom:.8rem;color:#cbd5e1}.travel-summary-chip{display:inline-flex;align-items:center;gap:.5rem;padding:.62rem .85rem;border-radius:14px;background:#fff;border:1px solid #e2e8f0;font-weight:800;color:#334155}.travel-summary-chip strong{color:#2563eb}.travel-order-strip{width:5px;border-radius:5px;background:#eab308;display:inline-block;height:44px;margin-right:.5rem;vertical-align:middle}.travel-order-strip.pending{background:#eab308}.travel-order-strip.confirmed{background:#f97316}.travel-order-strip.completed{background:#10b981}.travel-order-strip.cancelled{background:#ef4444}@media(max-width:991px){.travel-booking-search{grid-template-columns:1fr 170px}.travel-booking-search button{grid-column:1/-1}.travel-booking-toolbar{justify-content:flex-start}}@media(max-width:575px){.travel-booking-search{grid-template-columns:1fr}.travel-booking-search button{grid-column:auto}.travel-booking-filter{width:100%;overflow:auto;flex-wrap:nowrap;padding-bottom:.25rem}}
.promo-category-tabs a,.promo-pill-row a{display:inline-block;text-decoration:none;border:0;background:#f3f9ff;color:#0b57a4;border-radius:999px;padding:9px 16px;font-weight:800}
.promo-category-tabs a{background:transparent;color:#29384a;border-radius:0;padding:8px 2px}
.promo-category-tabs a.active{color:#0b57a4;border-bottom:3px solid #78d500}
.promo-pill-row a.active{background:#0194f3;color:#fff}
.promo-suggest-grid>a{text-decoration:none;color:inherit}

.tvk-back-management {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .48rem .85rem;
    border-radius: 999px;
    background: #fff3cd;
    color: #6b4f00 !important;
    font-weight: 700;
    border: 1px solid #ffe08a;
}
.tvk-back-management:hover { background: #ffe69c; color: #4d3900 !important; }

/* ===== UI refresh: dialogs, review management and hotel services ===== */
.modal-content{border:0;border-radius:24px;box-shadow:0 28px 80px rgba(15,23,42,.25);overflow:hidden}.modal-header{padding:1.25rem 1.5rem;border-bottom:1px solid #edf1f7;background:linear-gradient(135deg,#f8fbff,#fff)}.modal-title{font-weight:850;color:#17233c}.modal-body{padding:1.5rem}.modal-footer{padding:1rem 1.5rem;border-top:1px solid #edf1f7;background:#fbfcfe}.modal .btn{border-radius:999px;font-weight:700;padding:.65rem 1.2rem}.modal-backdrop.show{opacity:.48;backdrop-filter:blur(3px)}
.admin-form-page{max-width:860px;margin:0 auto;padding:28px}.admin-form-card{background:#fff;border:1px solid #e8eef6;border-radius:24px;padding:30px;box-shadow:0 18px 45px rgba(15,23,42,.08)}.admin-form-heading{display:flex;gap:16px;align-items:flex-start;margin-bottom:26px}.admin-form-icon{width:54px;height:54px;display:grid;place-items:center;border-radius:16px;background:#eaf5ff;color:#0879e8;font-size:1.35rem}.admin-form-heading>div>span{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#0879e8}.admin-form-heading h1{font-size:1.7rem;font-weight:900;color:#17233c;margin:.2rem 0}.admin-form-heading p{margin:0;color:#667085}.modern-admin-form{display:grid;gap:18px}.form-field label{display:block;font-weight:750;color:#344054;margin-bottom:8px}.modern-admin-form .form-control,.modern-admin-form .form-select{border:1px solid #d9e2ef;border-radius:14px;padding:.85rem 1rem}.modern-admin-form .form-control:focus,.modern-admin-form .form-select:focus{border-color:#1687ef;box-shadow:0 0 0 4px rgba(22,135,239,.12)}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:8px}.delete-confirm-card{text-align:center;max-width:700px;margin:auto}.delete-warning-icon{width:78px;height:78px;margin:0 auto 18px;display:grid;place-items:center;border-radius:50%;background:#fff0f0;color:#dc3545;font-size:2rem}.delete-confirm-card h1{font-weight:900;color:#17233c}.delete-confirm-card>p{color:#667085}.review-delete-preview{text-align:left;background:#f8fafc;border:1px solid #e8eef6;border-radius:18px;padding:20px;margin:24px 0}.review-delete-preview>div:first-child{display:flex;justify-content:space-between;gap:12px}.review-delete-preview span{color:#667085;font-size:.85rem}.review-delete-preview blockquote{margin:14px 0 0;color:#475467}.review-stars{color:#ffb400}.review-score-badge{display:inline-flex;align-items:center;gap:6px;background:#fff7db;color:#a96f00;border-radius:999px;padding:.42rem .75rem;font-weight:800}.review-comment-cell{max-width:420px;white-space:normal;color:#475467}
.service-search-form label{min-width:min(520px,100%)}.service-management-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.service-management-card{background:#fff;border:1px solid #e5ebf3;border-radius:22px;padding:22px;box-shadow:0 12px 30px rgba(15,23,42,.06)}.service-card-top{display:flex;gap:13px;align-items:flex-start}.service-icon{width:46px;height:46px;flex:0 0 46px;display:grid;place-items:center;border-radius:14px;background:#eaf5ff;color:#0879e8}.service-card-top h3{font-size:1.08rem;font-weight:850;margin:0 0 4px;color:#17233c}.service-card-top p{font-size:.85rem;color:#667085;margin:0}.service-status{white-space:nowrap;border-radius:999px;padding:.38rem .65rem;font-size:.72rem;font-weight:800}.service-status.active{background:#dcfce7;color:#047857}.service-status.hidden{background:#fee2e2;color:#b91c1c}.service-price{font-size:1.35rem;font-weight:900;color:#ff5b35;margin:18px 0}.service-price small{font-size:.75rem;color:#667085;font-weight:650}.service-room-form{border-top:1px solid #edf1f7;padding-top:16px}.service-room-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.service-room-head span{font-size:.78rem;color:#667085}.service-room-list{display:grid;gap:8px;max-height:230px;overflow:auto;padding-right:4px;margin-bottom:14px}.service-room-option{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #e7edf5;border-radius:13px;cursor:pointer}.service-room-option:hover{background:#f7fbff;border-color:#b8d9fb}.service-room-option input{position:absolute;opacity:0}.service-room-option .checkmark{width:22px;height:22px;display:grid;place-items:center;border:2px solid #c8d4e3;border-radius:7px;color:transparent}.service-room-option input:checked+.checkmark{background:#0879e8;border-color:#0879e8;color:#fff}.service-room-option strong,.service-room-option small{display:block}.service-room-option strong{font-size:.85rem;color:#17233c}.service-room-option small{font-size:.72rem;color:#7a8798}.service-card-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}.service-card-actions form{display:inline}.service-card-actions .btn{font-size:.78rem}.tvk-flight-hero{background-size:cover!important;background-position:center!important}.promo-suggest-grid img{object-fit:cover}
@media(max-width:991.98px){.service-management-grid{grid-template-columns:1fr}}@media(max-width:575.98px){.admin-form-page{padding:14px}.admin-form-card{padding:20px;border-radius:18px}.admin-form-heading{flex-direction:column}.form-actions{flex-direction:column-reverse}.form-actions .btn{width:100%}.service-management-card{padding:16px}.service-card-top{flex-wrap:wrap}.service-status{margin-left:59px}}


/* Nút đặt chuyến xe khách */
.bus-select-link {
    min-width: 168px;
    min-height: 46px;
    padding: 11px 22px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border: 1px solid #dbe7f3;
    background: #fff;
    color: #075985;
    font-weight: 900;
    text-decoration: none;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .08);
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.bus-select-link:hover {
    color: #075985;
    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(15, 23, 42, .14);
}
.bus-select-local {
    border: 0;
    color: #fff;
    background: linear-gradient(135deg, #0797e8 0%, #0067c5 100%);
    box-shadow: 0 10px 22px rgba(0, 103, 197, .28);
}
.bus-select-local:hover {
    color: #fff;
    background: linear-gradient(135deg, #0288d1 0%, #0057aa 100%);
    box-shadow: 0 14px 28px rgba(0, 103, 197, .34);
}
.bus-select-link i {
    font-size: 15px;
}
@media (max-width: 768px) {
    .bus-trip-side {
        justify-items: stretch;
    }
    .bus-select-link {
        width: 100%;
    }
}

/* Hộp thoại xác nhận tùy chỉnh */
.app-confirm-modal .modal-dialog {
    max-width: 440px;
    padding: 16px;
}

.app-confirm-modal .modal-content {
    overflow: hidden;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .24);
}

.app-confirm-header {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 28px 28px 10px;
    background: linear-gradient(180deg, #fff7ed 0%, #fff 100%);
}

.app-confirm-icon {
    display: grid;
    width: 74px;
    height: 74px;
    place-items: center;
    border: 8px solid #ffedd5;
    border-radius: 50%;
    color: #ea580c;
    background: #fff7ed;
    font-size: 30px;
}

.app-confirm-close {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 34px;
    height: 34px;
    padding: 0;
    border-radius: 50%;
    background-color: #f1f5f9;
    background-size: 11px;
    opacity: .75;
}

.app-confirm-close:hover {
    opacity: 1;
    transform: rotate(8deg);
}

.app-confirm-content {
    padding: 12px 32px 26px;
    text-align: center;
}

.app-confirm-title {
    margin-bottom: 10px;
    color: #0f172a;
    font-size: 22px;
    font-weight: 800;
}

.app-confirm-message {
    color: #64748b;
    font-size: 15px;
    line-height: 1.65;
}

.app-confirm-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding: 0 28px 28px;
}

.app-confirm-actions .btn {
    min-height: 46px;
    border-radius: 14px;
    font-weight: 700;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.app-confirm-cancel {
    border: 1px solid #e2e8f0;
    color: #475569;
    background: #f8fafc;
}

.app-confirm-cancel:hover {
    border-color: #cbd5e1;
    color: #0f172a;
    background: #f1f5f9;
}

.app-confirm-accept {
    border: 0;
    color: #fff;
    background: linear-gradient(135deg, #ef4444, #dc2626);
    box-shadow: 0 10px 24px rgba(220, 38, 38, .25);
}

.app-confirm-accept:hover {
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(220, 38, 38, .32);
}

@media (max-width: 480px) {
    .app-confirm-modal .modal-dialog { padding: 8px; }
    .app-confirm-content { padding-inline: 22px; }
    .app-confirm-actions { grid-template-columns: 1fr; padding-inline: 22px; }
    .app-confirm-cancel { order: 2; }
}

/* Contact support inbox */
.contact-inbox-page { display: grid; gap: 18px; }
.contact-inbox-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    padding: 6px 2px 2px;
}
.contact-inbox-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #087ad2;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.contact-inbox-head h2 { margin: 6px 0 0; color: #172033; font-size: 30px; font-weight: 900; }
.contact-inbox-head p { margin: 6px 0 0; color: #718096; font-weight: 650; }
.contact-inbox-summary { display: flex; gap: 10px; }
.contact-inbox-summary article {
    min-width: 116px;
    padding: 13px 16px;
    border: 1px solid #e5ebf2;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 7px 20px rgba(15, 23, 42, .045);
}
.contact-inbox-summary span { display: block; color: #7b8798; font-size: 11px; font-weight: 800; }
.contact-inbox-summary strong { display: block; margin-top: 2px; color: #243044; font-size: 22px; font-weight: 900; }
.contact-inbox-summary .is-pending strong { color: #dd821d; }
.contact-inbox-summary .is-replied strong { color: #159464; }
.contact-alert { margin: 0; }
.contact-inbox-card { padding: 0; overflow: hidden; border-radius: 20px; }
.contact-inbox-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    border-bottom: 1px solid #e9eef4;
}
.contact-inbox-search {
    width: min(390px, 42vw);
    min-height: 43px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 14px;
    border: 1px solid #d9e2eb;
    border-radius: 12px;
    color: #94a3b8;
    background: #f8fafc;
}
.contact-inbox-search:focus-within { border-color: #67afe3; background: #fff; box-shadow: 0 0 0 3px rgba(8,122,210,.09); }
.contact-inbox-search input { width: 100%; border: 0; outline: 0; color: #334155; background: transparent; font-weight: 650; }
.contact-filter-buttons { display: flex; gap: 6px; padding: 4px; border-radius: 12px; background: #f1f5f9; }
.contact-filter-buttons button {
    min-height: 34px;
    padding: 6px 13px;
    border: 0;
    border-radius: 9px;
    color: #64748b;
    background: transparent;
    font-size: 12px;
    font-weight: 850;
}
.contact-filter-buttons button.active { color: #087ad2; background: #fff; box-shadow: 0 3px 9px rgba(15,23,42,.08); }
.contact-message-list { display: grid; }
.contact-message-item { display: grid; grid-template-columns: 245px minmax(0, 1fr); border-bottom: 1px solid #edf1f5; scroll-margin-top: 20px; }
.contact-message-item:last-of-type { border-bottom: 0; }
.contact-message-item:target { background: #fbfdff; box-shadow: inset 4px 0 #0b94e5; }
.contact-message-meta { padding: 22px 20px; border-right: 1px solid #edf1f5; background: #fbfcfe; }
.contact-avatar {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    margin-bottom: 12px;
    border-radius: 14px;
    color: #087ad2;
    background: #e7f4fd;
    font-size: 17px;
    font-weight: 900;
}
.contact-sender strong { display: block; margin-bottom: 7px; color: #243044; font-weight: 900; }
.contact-sender span { display: flex; align-items: center; gap: 7px; margin-top: 5px; overflow-wrap: anywhere; color: #718096; font-size: 12px; font-weight: 650; }
.contact-sender i { width: 13px; color: #8ba0b5; }
.contact-message-time { display: flex; align-items: center; gap: 6px; margin-top: 15px; color: #94a3b8; font-size: 11px; font-weight: 700; }
.contact-message-content { min-width: 0; padding: 22px 24px; }
.contact-message-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; }
.contact-message-code { color: #8a98a9; font-size: 11px; font-weight: 800; }
.contact-message-title-row h3 { margin: 3px 0 0; color: #1e293b; font-size: 18px; font-weight: 900; }
.contact-state-badge { display: inline-flex; align-items: center; gap: 7px; padding: 7px 10px; border-radius: 999px; font-size: 11px; font-weight: 900; white-space: nowrap; }
.contact-state-badge i { width: 7px; height: 7px; border-radius: 50%; }
.contact-state-badge.is-pending { color: #b76b16; background: #fff2dd; }
.contact-state-badge.is-pending i { background: #eb941f; }
.contact-state-badge.is-replied { color: #148457; background: #e8f8f0; }
.contact-state-badge.is-replied i { background: #20a970; }
.contact-customer-message { margin: 14px 0 0; color: #516174; line-height: 1.7; white-space: pre-line; }
.contact-saved-reply { margin-top: 17px; padding: 15px 17px; border-left: 3px solid #20a970; border-radius: 0 13px 13px 0; background: #f0faf5; }
.contact-saved-reply > span { display: flex; align-items: center; gap: 8px; color: #16895a; font-size: 12px; font-weight: 900; }
.contact-saved-reply p { margin: 8px 0; color: #395c4c; line-height: 1.65; white-space: pre-line; }
.contact-saved-reply small { color: #6f9181; font-weight: 700; }
.contact-reply-box { margin-top: 17px; border: 1px solid #dce5ee; border-radius: 14px; overflow: hidden; background: #fff; }
.contact-reply-box summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 15px;
    color: #37637f;
    background: #f7fafc;
    font-size: 13px;
    font-weight: 850;
    cursor: pointer;
    list-style: none;
}
.contact-reply-box summary::-webkit-details-marker { display: none; }
.contact-reply-box summary span { display: flex; align-items: center; gap: 8px; }
.contact-reply-box summary > i { transition: transform .2s ease; }
.contact-reply-box[open] summary > i { transform: rotate(180deg); }
.contact-reply-box form { padding: 15px; border-top: 1px solid #e5ebf1; }
.contact-reply-box label { display: block; margin-bottom: 7px; color: #45566a; font-size: 12px; font-weight: 850; }
.contact-reply-box textarea { width: 100%; resize: vertical; min-height: 104px; padding: 12px 14px; border: 1px solid #cfdbe6; border-radius: 11px; outline: 0; color: #334155; line-height: 1.55; }
.contact-reply-box textarea:focus { border-color: #58a9e2; box-shadow: 0 0 0 3px rgba(8,122,210,.09); }
.contact-reply-actions { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 10px; }
.contact-reply-actions small { color: #8391a2; }
.contact-reply-actions button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 8px 16px;
    border: 0;
    border-radius: 10px;
    color: #fff;
    background: #087ad2;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}
.contact-reply-actions button:hover { background: #056cb9; }
.contact-done-form { margin-top: 10px; text-align: right; }
.contact-done-form button { border: 0; color: #7b8798; background: transparent; font-size: 11px; font-weight: 750; }
.contact-done-form button:hover { color: #475569; text-decoration: underline; }
.contact-inbox-empty { display: grid; justify-items: center; gap: 7px; padding: 48px 20px; text-align: center; }
.contact-inbox-empty > span { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 16px; color: #087ad2; background: #eaf5fe; font-size: 21px; }
.contact-inbox-empty strong { color: #243044; font-size: 17px; }
.contact-inbox-empty p { margin: 0; color: #8491a3; }

/* Customer support response history */
.customer-support-history { padding: 0 0 64px; background: #fff; }
.customer-support-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.customer-support-head > div > span { color: #087ad2; font-size: 12px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.customer-support-head h2 { margin: 5px 0 0; color: #172033; font-weight: 900; }
.customer-support-head p { margin: 5px 0 0; color: #718096; }
.customer-support-count { padding: 8px 13px; border-radius: 999px; color: #087ad2; background: #eaf5fe; font-size: 12px; font-weight: 900; }
.customer-support-list { display: grid; gap: 13px; }
.customer-support-item { padding: 20px 22px; border: 1px solid #e3eaf1; border-radius: 17px; background: #fff; box-shadow: 0 8px 22px rgba(15,23,42,.045); }
.customer-support-item-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; }
.customer-support-item-head > div > span { color: #8a98a9; font-size: 11px; font-weight: 750; }
.customer-support-item-head h3 { margin: 3px 0 0; color: #243044; font-size: 17px; font-weight: 900; }
.customer-support-status { display: inline-flex; align-items: center; gap: 7px; padding: 7px 10px; border-radius: 999px; font-size: 11px; font-weight: 900; white-space: nowrap; }
.customer-support-status i { width: 7px; height: 7px; border-radius: 50%; }
.customer-support-status.is-pending { color: #b46a17; background: #fff2df; }
.customer-support-status.is-pending i { background: #eb941f; }
.customer-support-status.is-replied { color: #16865a; background: #e9f8f1; }
.customer-support-status.is-replied i { background: #21a970; }
.customer-support-question { margin: 13px 0 0; color: #617084; line-height: 1.65; white-space: pre-line; }
.customer-support-answer { margin-top: 15px; padding: 15px 17px; border-radius: 13px; background: #eff9f5; }
.customer-support-answer > span { color: #16865a; font-size: 12px; font-weight: 900; }
.customer-support-answer > span i { margin-right: 7px; }
.customer-support-answer p { margin: 8px 0; color: #385b4b; line-height: 1.65; white-space: pre-line; }
.customer-support-answer small { color: #779184; font-weight: 700; }
.customer-support-waiting { display: flex; align-items: center; gap: 8px; margin-top: 14px; color: #98713e; font-size: 12px; font-weight: 750; }
.customer-support-empty { display: grid; justify-items: center; gap: 8px; padding: 38px 20px; border: 1px dashed #cedae5; border-radius: 17px; color: #8491a3; text-align: center; background: #fafcfe; }
.customer-support-empty i { color: #7eafd2; font-size: 31px; }
.customer-support-empty strong { color: #45566a; }
.customer-support-empty p { margin: 0; }

@media (max-width: 991.98px) {
    .contact-inbox-head { align-items: stretch; flex-direction: column; }
    .contact-inbox-summary { width: 100%; }
    .contact-inbox-summary article { flex: 1; }
    .contact-inbox-toolbar { align-items: stretch; flex-direction: column; }
    .contact-inbox-search { width: 100%; }
    .contact-filter-buttons { align-self: flex-start; }
    .contact-message-item { grid-template-columns: 1fr; }
    .contact-message-meta { display: flex; align-items: center; gap: 12px; border-right: 0; border-bottom: 1px solid #edf1f5; }
    .contact-avatar { flex: 0 0 44px; margin: 0; }
    .contact-sender { flex: 1; }
    .contact-message-time { margin: 0; }
}
@media (max-width: 575.98px) {
    .contact-inbox-summary { display: grid; grid-template-columns: repeat(3, 1fr); }
    .contact-inbox-summary article { min-width: 0; padding: 11px; }
    .contact-inbox-summary span { min-height: 30px; }
    .contact-filter-buttons { width: 100%; overflow-x: auto; }
    .contact-filter-buttons button { flex: 1; }
    .contact-message-meta { align-items: flex-start; flex-wrap: wrap; padding: 17px; }
    .contact-message-time { width: 100%; margin-left: 56px; }
    .contact-message-content { padding: 18px 17px; }
    .contact-message-title-row,
    .contact-reply-actions,
    .customer-support-head,
    .customer-support-item-head { align-items: stretch; flex-direction: column; }
    .contact-state-badge,
    .customer-support-status { align-self: flex-start; }
    .contact-reply-actions button { width: 100%; }
    .customer-support-count { align-self: flex-start; }
}
/* Đồng bộ giao diện quản lý đưa đón sân bay và cho thuê xe */
.transport-admin-page .admin-page-head h2 {
    margin: .15rem 0 .35rem;
    font-size: clamp(1.8rem, 3vw, 2.55rem);
    font-weight: 800;
}

.transport-admin-page .admin-page-head p { margin: 0; color: #64748b; }

.transport-stat { display: flex; align-items: center; gap: 1rem; min-height: 92px; }
.transport-stat-icon { width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; font-size: 1.3rem; }
.transport-stat small { display: block; color: #64748b; font-weight: 600; }
.transport-stat strong { display: block; color: #0f172a; font-size: 1.65rem; line-height: 1.1; }

.transport-search-group .form-select { max-width: 230px; }
.transport-table-title { padding: 1rem 1.25rem; border-bottom: 1px solid #e2e8f0; background: #f8fbff; }
.transport-table-title strong { display: block; color: #0f172a; font-size: 1.05rem; }
.transport-table-title span { color: #64748b; font-size: .85rem; }
.transport-admin-table { min-width: 980px; }
.transport-admin-table thead th { padding: .95rem 1rem; white-space: nowrap; color: #475569; background: #f8fafc; font-size: .82rem; text-transform: uppercase; letter-spacing: .025em; }
.transport-admin-table tbody td { padding: 1rem; border-color: #edf2f7; }
.transport-admin-table tbody tr:hover { background: #f8fbff; }
.transport-route { display: block; max-width: 260px; margin-bottom: .25rem; }
.transport-route i { width: 18px; margin-right: .35rem; }

@media (max-width: 767.98px) {
    .transport-admin-page .admin-page-head { align-items: flex-start; gap: 1rem; }
    .transport-search-group { display: grid; grid-template-columns: 44px 1fr; }
    .transport-search-group .form-select { max-width: none; grid-column: 1 / -1; }
    .transport-search-group .btn { grid-column: 1 / -1; }
}

/* ===== Flight search canonical desktop layout =====
   One source of truth: no legacy Phase 6.1/6.2/6.3 grid overrides below this point. */
.tvk-flight-route-swap {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    flex: 0 0 46px !important;
    align-self: flex-end !important;
    margin: 0 0 13px !important;
    padding: 0 !important;
    border: 4px solid #fff !important;
    border-radius: 50% !important;
    background: #1597e8 !important;
    color: #fff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 5px 14px rgba(21,151,232,.28) !important;
}
.tvk-flight-route-swap i {
    color: #fff !important;
    font-size: 16px !important;
}

@media (min-width: 901px) {
    .tvk-flight-search-card:not([data-flight-trip-mode="multicity"]) .tvk-flight-search-grid {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: flex-end !important;
        gap: 12px !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .tvk-flight-search-card:not([data-flight-trip-mode="multicity"]) .tvk-flight-col-from,
    .tvk-flight-search-card:not([data-flight-trip-mode="multicity"]) .tvk-flight-col-to {
        flex: 1 1 205px !important;
        min-width: 170px !important;
    }

    .tvk-flight-search-card:not([data-flight-trip-mode="multicity"]) .tvk-flight-col-departure {
        flex: .82 1 180px !important;
        min-width: 155px !important;
    }

    .tvk-flight-search-card:not([data-flight-trip-mode="multicity"]) .tvk-flight-col-return {
        flex: .95 1 210px !important;
        min-width: 180px !important;
    }

    .tvk-flight-search-card:not([data-flight-trip-mode="multicity"]) .tvk-flight-col-submit {
        flex: 0 1 205px !important;
        width: auto !important;
        min-width: 165px !important;
        height: 72px !important;
        min-height: 72px !important;
        margin: 0 !important;
        padding: 0 18px !important;
        align-self: flex-end !important;
        white-space: nowrap !important;
    }

    .tvk-flight-search-card:not([data-flight-trip-mode="multicity"]) .tvk-flight-search-grid > input[type="hidden"] {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        flex: 0 0 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .tvk-flight-search-card:not([data-flight-trip-mode="multicity"]) .tvk-flight-field-wrap,
    .tvk-flight-search-card:not([data-flight-trip-mode="multicity"]) .tvk-flight-field,
    .tvk-flight-search-card:not([data-flight-trip-mode="multicity"]) .tvk-flight-field input {
        min-width: 0 !important;
    }
}

@media (max-width: 900px) {
    .tvk-flight-search-card:not([data-flight-trip-mode="multicity"]) .tvk-flight-search-grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }
    .tvk-flight-route-swap {
        margin: 0 auto !important;
        transform: rotate(90deg) !important;
        align-self: center !important;
    }
    .tvk-flight-search-card:not([data-flight-trip-mode="multicity"]) .tvk-flight-col-submit {
        width: 100% !important;
    }
}


/* Home navigation cards and offer tabs are real links. */
.tvk-pill-tabs a { text-decoration: none; cursor: pointer; }
.tvk-pill-tabs a:hover { color: #fff; background: var(--tvk-blue); transform: translateY(-1px); }
.tvk-offer-link { display: block; color: inherit; text-decoration: none; min-width: 0; }
.tvk-offer-link:hover { color: inherit; text-decoration: none; }
.tvk-offer-link .tvk-small-banner { height: 100%; transition: transform .18s ease, box-shadow .18s ease; }
.tvk-offer-link:hover .tvk-small-banner { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(15, 23, 42, .16); }

/* Phase 9.1 - Promotions: 8 combo suggestions + see more */
.promo-combo-suggest-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.promo-combo-suggest-grid>a{display:block;text-decoration:none;color:inherit}
.promo-combo-card{height:100%;transition:transform .18s ease,box-shadow .18s ease;border:1px solid #edf2f7}
.promo-combo-card:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(15,35,60,.18)}
.promo-combo-card-body{display:grid;gap:6px;padding:0 12px 4px}
.promo-combo-card-body small{color:#0b73d9;font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.03em}
.promo-combo-card-body strong{padding:0!important;min-height:40px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.promo-combo-card-body span{padding:0!important}
.promo-combo-card-placeholder{border-style:dashed}
.promo-combo-more{display:flex;justify-content:center;margin-top:24px}
.promo-combo-more-btn{display:inline-flex;align-items:center;gap:9px;text-decoration:none;background:#0194f3;color:#fff!important;border-radius:999px;padding:11px 24px;font-weight:900;box-shadow:0 8px 20px rgba(1,148,243,.2)}
.promo-combo-more-btn:hover{background:#0879d9;color:#fff!important;transform:translateY(-1px)}
@media (max-width:900px){.promo-combo-suggest-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.promo-combo-suggest-grid{grid-template-columns:1fr}}

/* Phase 10 - advertising, inspiration articles and global partner showcase */
.genz-home-ad-zone{margin-top:28px;padding-bottom:10px}.genz-ad-title-row{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:12px;color:#fff}.genz-ad-title-row span{font-weight:800;font-size:15px}.genz-ad-title-row a{color:#fff;text-decoration:none;font-weight:700;font-size:13px;opacity:.9}.genz-ad-carousel{border-radius:22px;overflow:hidden;box-shadow:0 18px 45px rgba(7,39,78,.22);background:#fff}.genz-ad-slide{height:270px;position:relative;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0797e9,#0a63d6);text-decoration:none;overflow:hidden}.genz-ad-slide img{width:100%;height:100%;object-fit:cover;display:block}.genz-ad-empty{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;padding:24px;background:radial-gradient(circle at 20% 30%,rgba(255,255,255,.22),transparent 32%),linear-gradient(135deg,#0a9bea,#0965d7)}.genz-ad-empty i{font-size:38px;margin-bottom:10px}.genz-ad-empty strong{font-size:24px}.genz-ad-empty span{margin-top:4px;opacity:.9}.genz-ad-sponsored{position:absolute;top:14px;left:16px;z-index:3;background:rgba(255,255,255,.93);color:#526171;font-size:11px;font-weight:800;padding:5px 9px;border-radius:999px;box-shadow:0 4px 16px rgba(0,0,0,.12)}.genz-ad-carousel .carousel-control-prev,.genz-ad-carousel .carousel-control-next{width:52px;height:52px;top:50%;transform:translateY(-50%);background:#fff;opacity:1;border-radius:50%;box-shadow:0 8px 20px rgba(0,0,0,.15)}.genz-ad-carousel .carousel-control-prev{left:14px}.genz-ad-carousel .carousel-control-next{right:14px}.genz-ad-carousel .carousel-control-prev-icon,.genz-ad-carousel .carousel-control-next-icon{filter:invert(41%) sepia(95%) saturate(2214%) hue-rotate(179deg) brightness(94%) contrast(96%);width:18px;height:18px}.genz-ad-carousel .carousel-indicators{margin-bottom:10px}.genz-ad-carousel .carousel-indicators button{width:8px;height:8px;border-radius:50%}

.genz-inspiration-section{padding:64px 0 54px;background:#fff}.genz-inspiration-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:24px}.genz-inspiration-head h2{margin:5px 0 6px;font-size:30px;font-weight:850;color:#25364a}.genz-inspiration-head p{margin:0;color:#758196}.genz-kicker{color:#078ee5;font-weight:800;font-size:13px}.genz-kicker i{margin-right:6px}.genz-inspiration-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.genz-article-card{display:block;background:#fff;border:1px solid #e6edf5;border-radius:16px;overflow:hidden;color:inherit;text-decoration:none;box-shadow:0 9px 26px rgba(29,53,87,.08);transition:.22s ease}.genz-article-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(29,53,87,.14);color:inherit}.genz-article-card img{width:100%;height:180px;object-fit:cover}.genz-article-card>div{padding:15px 16px 17px}.genz-article-card h3{font-size:17px;line-height:1.35;margin:0 0 10px;color:#23344a;font-weight:800}.genz-article-card p{font-size:12px;font-style:italic;color:#8a93a1;margin:0 0 5px}.genz-article-card span{font-size:12px;color:#6f7c90}.genz-article-card span i{color:#16a6e7;margin-right:4px}.genz-inspiration-more{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:13px 25px;border-radius:999px;background:#f5f8fb;color:#078ee5;text-decoration:none;font-weight:800}.genz-inspiration-more:hover{background:#eaf5fd;color:#0475c2}.genz-inspiration-more.top-link{padding:10px 18px;font-size:13px}.genz-inspiration-bottom{text-align:center;margin-top:28px}

.genz-partner-showcase{padding:46px 0 38px;background:#fafcff;border-top:1px solid #edf1f6}.genz-partner-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:22px}.genz-partner-head span{color:#078ee5;font-size:13px;font-weight:800}.genz-partner-head h2{margin:4px 0 0;color:#25364a;font-size:27px;font-weight:850}.genz-partner-head>a{font-weight:800;text-decoration:none;color:#078ee5}.genz-partner-logos{display:grid;grid-template-columns:repeat(8,minmax(120px,1fr));gap:10px;align-items:stretch}.partner-wordmark{min-height:76px;background:#fff;border:1px solid #e8edf4;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#596475;font-size:14px;font-weight:900;letter-spacing:.04em;padding:8px;box-shadow:0 5px 16px rgba(20,45,74,.05)}.partner-wordmark small{display:block;font-size:8px;font-weight:700;letter-spacing:.12em;color:#9aa4b2;margin-top:3px}.genz-partner-note{text-align:center;margin:18px 0 0;color:#8b96a6;font-size:12px}

@media(max-width:1199px){.genz-inspiration-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.genz-partner-logos{grid-template-columns:repeat(4,minmax(120px,1fr))}}
@media(max-width:767px){.genz-home-ad-zone{margin-top:18px}.genz-ad-slide{height:180px}.genz-ad-title-row,.genz-inspiration-head,.genz-partner-head{align-items:flex-start;flex-direction:column}.genz-inspiration-section{padding:42px 0}.genz-inspiration-grid{grid-template-columns:1fr}.genz-article-card img{height:190px}.genz-partner-logos{grid-template-columns:repeat(2,minmax(0,1fr))}.genz-inspiration-head h2,.genz-partner-head h2{font-size:23px}}


/* Phase 10.2 - production-style advertisement zones */
.genz-home-ad-zone{margin-top:24px}.genz-ad-carousel,.genz-mid-ad-carousel{border-radius:22px;overflow:hidden;box-shadow:0 16px 40px rgba(5,45,88,.18)}.genz-ad-slide,.genz-mid-ad-slide{position:relative;display:block;width:100%;overflow:hidden;background:#e8f4ff}.genz-ad-slide{height:270px}.genz-mid-ad-slide{height:230px}.genz-ad-slide img,.genz-mid-ad-slide img{width:100%;height:100%;object-fit:cover;display:block}.genz-mid-ad-zone{margin:30px 0 34px}.genz-ad-sponsored{position:absolute;z-index:3;top:14px;left:16px;padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.92);color:#526071;font-size:10px;font-weight:900;letter-spacing:.08em;box-shadow:0 3px 10px rgba(0,0,0,.08)}.genz-ad-carousel .carousel-control-prev,.genz-ad-carousel .carousel-control-next,.genz-mid-ad-carousel .carousel-control-prev,.genz-mid-ad-carousel .carousel-control-next{width:7%}.genz-ad-carousel .carousel-indicators,.genz-mid-ad-carousel .carousel-indicators{margin-bottom:10px}.genz-ad-carousel .carousel-indicators [data-bs-target],.genz-mid-ad-carousel .carousel-indicators [data-bs-target]{width:8px;height:8px;border-radius:50%;border:0}.genz-ad-admin-page{display:flex;flex-direction:column;gap:24px}.genz-ad-admin-intro{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;padding:24px;border-radius:20px;background:linear-gradient(135deg,#fff,#f4f9ff);border:1px solid #dbe8f6}.genz-ad-admin-intro h2{font-size:28px;font-weight:850;margin:6px 0 8px}.genz-ad-admin-intro p{margin:0;color:#64748b;max-width:800px}.genz-ad-admin-zone{padding:22px;border:1px solid #e0e8f2;border-radius:20px;background:#fff;box-shadow:0 12px 30px rgba(15,23,42,.05)}.genz-ad-admin-zone-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:18px}.genz-ad-admin-zone-head h3{font-size:21px;font-weight:850;margin:0 0 5px}.genz-ad-admin-zone-head p{margin:0;color:#64748b}.genz-ad-admin-zone-head>span{font-size:12px;font-weight:800;color:#078ee5;background:#eef8ff;padding:8px 12px;border-radius:999px}.genz-ad-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.genz-ad-admin-card{border:1px solid #e3eaf3;border-radius:17px;padding:14px;background:#fbfdff}.genz-ad-admin-card.is-live{border-color:#a9ddc5}.genz-ad-admin-preview{height:150px;border-radius:13px;overflow:hidden;position:relative;background:#eef3f8;margin-bottom:14px}.genz-ad-admin-preview img{width:100%;height:100%;object-fit:cover}.empty-preview{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#94a3b8;gap:8px}.empty-preview i{font-size:30px}.live-badge{position:absolute;top:10px;right:10px;background:rgba(12,129,76,.92);color:#fff;padding:6px 9px;border-radius:999px;font-size:9px;font-weight:900}.live-badge i{font-size:6px;vertical-align:middle}.genz-ad-admin-form{display:grid;gap:8px}.genz-ad-admin-form label{font-size:11px;font-weight:800;color:#475569;margin-top:2px}.genz-ad-or{text-align:center;position:relative;color:#94a3b8;font-size:10px}.genz-ad-or:before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:#e2e8f0}.genz-ad-or span{position:relative;background:#fbfdff;padding:0 8px}.genz-ad-admin-form .btn{margin-top:6px}
@media(max-width:991px){.genz-ad-admin-grid{grid-template-columns:1fr}.genz-ad-admin-intro,.genz-ad-admin-zone-head{align-items:flex-start;flex-direction:column}.genz-ad-slide{height:210px}.genz-mid-ad-slide{height:190px}}
@media(max-width:575px){.genz-ad-slide,.genz-mid-ad-slide{height:150px}.genz-ad-title-row{gap:8px}.genz-ad-title-row a{font-size:11px}}

/* Phase 10.3 - compact ad manager + requested banner sizing */
/* Small ad zone: preserve each creative's natural ratio and let width/height vary by image. */
.genz-home-ad-zone{margin-top:18px;padding-bottom:8px}
.genz-home-ad-zone .genz-ad-title-row{max-width:1480px;margin-left:auto;margin-right:auto;margin-bottom:8px}
.genz-home-ad-zone .genz-ad-carousel{width:100%;max-width:1480px;margin:0 auto;background:transparent;box-shadow:none;border-radius:0;overflow:visible}
.genz-home-ad-zone .genz-ad-carousel .carousel-inner{overflow:visible}
.genz-home-ad-zone .genz-ad-carousel .carousel-item{text-align:center;padding:2px 56px 8px}
.genz-home-ad-zone .genz-ad-slide{display:inline-flex;width:auto;max-width:100%;height:auto;min-height:0;align-items:center;justify-content:center;background:transparent;border-radius:14px;overflow:hidden;box-shadow:0 8px 24px rgba(15,23,42,.12)}
.genz-home-ad-zone .genz-ad-slide img{display:block;width:auto!important;height:auto!important;max-width:100%;max-height:112px;object-fit:contain}
.genz-home-ad-zone .genz-ad-sponsored{top:6px;left:8px}
.genz-home-ad-zone .carousel-control-prev,.genz-home-ad-zone .carousel-control-next{width:38px!important;height:38px!important;top:50%;transform:translateY(-50%);border-radius:50%;background:#fff;box-shadow:0 5px 16px rgba(15,23,42,.14);opacity:1}
.genz-home-ad-zone .carousel-control-prev{left:6px}.genz-home-ad-zone .carousel-control-next{right:6px}

/* Large ad zone: stable size like the reference, regardless of source image dimensions. */
.genz-mid-ad-zone{max-width:1480px;margin:60px auto 58px}
.genz-mid-ad-carousel{width:100%;border-radius:14px;overflow:hidden;background:#eef6ff;box-shadow:none}
.genz-mid-ad-slide{display:block;width:100%;height:340px!important;overflow:hidden;background:#eef6ff}
.genz-mid-ad-slide img{width:100%!important;height:100%!important;object-fit:cover!important;display:block}
.genz-mid-ad-carousel .carousel-control-prev,.genz-mid-ad-carousel .carousel-control-next{width:48px;height:48px;top:50%;transform:translateY(-50%);border-radius:50%;background:#fff;opacity:1;box-shadow:0 6px 18px rgba(15,23,42,.16)}
.genz-mid-ad-carousel .carousel-control-prev{left:14px}.genz-mid-ad-carousel .carousel-control-next{right:14px}

/* Compact advertisement management */
.genz-ad-manager-compact{display:flex;flex-direction:column;gap:16px}
.genz-ad-manager-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;background:#fff;border:1px solid #e4eaf1;border-radius:16px}
.genz-ad-manager-toolbar h2{margin:3px 0 0;font-size:24px;font-weight:850;color:#1f2f43}
.genz-ad-manager-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.genz-ad-search{height:38px;min-width:300px;display:flex;align-items:center;gap:8px;padding:0 12px;border:1px solid #dce4ee;border-radius:10px;background:#f8fafc;color:#748197}
.genz-ad-search input{width:100%;border:0;outline:0;background:transparent;font-size:13px}
.genz-ad-manager-note{display:flex;gap:18px;flex-wrap:wrap;padding:10px 14px;border-radius:11px;background:#f2f8fd;color:#617083;font-size:12px}
.genz-ad-table-wrap{background:#fff;border:1px solid #e4eaf1;border-radius:16px;overflow:hidden}
.genz-ad-table{width:100%;border-collapse:collapse;font-size:13px}
.genz-ad-table th{padding:11px 13px;background:#f8fafc;color:#66758a;font-size:11px;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid #e7edf4}
.genz-ad-table td{padding:10px 13px;border-bottom:1px solid #eef2f6;vertical-align:middle;color:#39495d}
.genz-ad-table tbody tr:last-child td{border-bottom:0}.genz-ad-table tbody tr:hover{background:#fbfdff}
.genz-ad-table td strong{display:block;color:#24364c}.genz-ad-table td small{display:block;color:#98a3b2;margin-top:2px;font-size:10px}
.genz-ad-mini-preview{width:92px;height:48px;border-radius:8px;background:#eef3f7;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#9aa6b5}.genz-ad-mini-preview img{width:100%;height:100%;object-fit:cover}.genz-ad-mini-preview i{font-size:18px}
.genz-zone-pill{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:800}.genz-zone-pill.small-zone{background:#eef8ff;color:#087fc8}.genz-zone-pill.large-zone{background:#fff3e7;color:#b56514}
.genz-ad-link-cell{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#6b7789!important}
.genz-status-live{color:#087b4d;font-size:11px;font-weight:800}.genz-status-live i{font-size:6px;margin-right:5px}.genz-status-empty{color:#98a3b2;font-size:11px;font-weight:700}
.genz-ad-search-empty{text-align:center;padding:30px;color:#8a97a7}
.genz-ad-modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.genz-ad-modal-grid .full{grid-column:1/-1}.genz-ad-modal-grid label{display:block;font-size:11px;font-weight:800;color:#536176;margin-bottom:5px}
.genz-edit-ad-preview{display:flex;align-items:center;gap:12px;padding:10px;border:1px solid #e6ebf1;border-radius:11px;background:#f8fafc}.genz-edit-ad-preview img{width:120px;height:58px;object-fit:cover;border-radius:8px}.genz-edit-ad-preview strong,.genz-edit-ad-preview small{display:block}
@media(max-width:991px){.genz-mid-ad-slide{height:240px!important}.genz-ad-manager-toolbar{align-items:flex-start;flex-direction:column}.genz-ad-manager-actions{width:100%}.genz-ad-search{min-width:0;flex:1}.genz-ad-table-wrap{overflow-x:auto}.genz-ad-table{min-width:860px}}
@media(max-width:575px){.genz-home-ad-zone .genz-ad-slide img{max-height:78px}.genz-home-ad-zone .genz-ad-carousel .carousel-item{padding-left:42px;padding-right:42px}.genz-mid-ad-slide{height:150px!important}.genz-ad-modal-grid{grid-template-columns:1fr}.genz-ad-modal-grid .full{grid-column:auto}.genz-ad-search{width:100%;flex-basis:100%}}

/* Phase 11 - database-driven marketing content */
.partner-db-logo{display:flex;align-items:center;justify-content:center;min-width:150px;min-height:62px;padding:10px 16px;border:1px solid #eef2f7;border-radius:14px;background:#fff;text-decoration:none}
.partner-db-logo img{max-width:150px;max-height:46px;object-fit:contain;display:block}
.genz-article-summary{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:.35rem 0;color:#667085!important;font-style:normal!important}
.genz-content-admin .table thead th{font-size:.78rem;text-transform:uppercase;letter-spacing:.03em;color:#667085;background:#f8fafc}
.genz-content-admin .table td{vertical-align:middle}


/* =========================================================
   Phase 12 - Travel guide index + article details
   ========================================================= */
.guide-page{background:#fff;color:#172b43}.guide-search-band{background:#0795e8;padding:18px 0}.guide-search-form{height:54px;background:#fff;border-radius:8px;display:flex;align-items:center;padding-left:18px;box-shadow:0 8px 24px rgba(0,61,111,.12)}.guide-search-form>i{color:#7c8c9e}.guide-search-form input{flex:1;height:100%;border:0;outline:0;padding:0 14px;font-size:15px}.guide-search-form button{height:42px;margin-right:6px;border:0;border-radius:7px;background:#087fd1;color:#fff;font-weight:800;padding:0 24px}.guide-category-strip{border-bottom:1px solid #edf1f5;background:#fff}.guide-category-pills{display:flex;gap:10px;overflow:auto;padding:15px 0}.guide-category-pills a{white-space:nowrap;text-decoration:none;color:#53657a;font-weight:750;border-radius:999px;padding:9px 16px;background:#f3f7fa}.guide-category-pills a.active,.guide-category-pills a:hover{background:#0795e8;color:#fff}.guide-featured{padding:28px 0 8px}.guide-featured-card{display:flex;align-items:flex-end;min-height:360px;border-radius:20px;overflow:hidden;background-size:cover;background-position:center;text-decoration:none;color:#fff;padding:38px;box-shadow:0 18px 40px rgba(24,52,80,.15)}.guide-featured-card:hover{color:#fff}.guide-featured-copy{max-width:760px}.guide-featured-copy>span{display:inline-flex;background:#ff5f44;border-radius:999px;padding:7px 12px;font-size:12px;font-weight:900}.guide-featured-copy h1{font-size:38px;line-height:1.12;font-weight:900;margin:13px 0 10px}.guide-featured-copy p{font-size:16px;max-width:680px;margin:0 0 14px;color:rgba(255,255,255,.9)}.guide-featured-copy small{font-weight:700;color:#fff}.guide-section{padding:48px 0}.guide-section.alt{background:#f8fbfd}.guide-section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:22px}.guide-section-head h2{font-size:27px;margin:0 0 5px;font-weight:900;color:#24374d}.guide-section-head p{margin:0;color:#7a8796}.guide-section-head>a{color:#078ee5;text-decoration:none;font-weight:800}.guide-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.guide-list-card{display:block;border:1px solid #e5ebf2;border-radius:13px;overflow:hidden;background:#fff;text-decoration:none;color:inherit;box-shadow:0 8px 24px rgba(19,42,69,.06);transition:.2s ease}.guide-list-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(19,42,69,.12);color:inherit}.guide-list-image{height:190px;background:#eef4f8;overflow:hidden}.guide-list-image img{width:100%;height:100%;object-fit:cover}.guide-image-placeholder{height:100%;display:grid;place-items:center;font-size:34px;color:#aab8c6}.guide-list-body{padding:15px 16px 17px}.guide-card-category{display:inline-flex;color:#078ee5;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;margin-bottom:7px}.guide-list-body h3{font-size:18px;line-height:1.35;font-weight:850;color:#20344a;margin:0 0 8px}.guide-list-body p{font-size:13px;color:#697b8f;line-height:1.55;margin:0 0 11px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.guide-list-body small{color:#8a96a5}.guide-empty{text-align:center;padding:60px 20px;border:1px dashed #cdd8e3;border-radius:16px}.guide-empty i{font-size:40px;color:#0795e8}.guide-empty h3{margin:14px 0 5px}

.article-page{background:#fff;color:#26384b}.article-top{padding:38px 0 22px}.article-narrow{max-width:1080px}.article-breadcrumb{display:flex;align-items:center;gap:9px;font-size:13px;margin-bottom:18px}.article-breadcrumb a{color:#078ee5;text-decoration:none;font-weight:700}.article-breadcrumb i{font-size:9px;color:#9aa7b4}.article-top h1{font-size:42px;line-height:1.15;font-weight:900;color:#182d45;max-width:980px;margin:0 0 13px}.article-lead{font-size:18px;line-height:1.65;color:#5f7185;max-width:900px}.article-byline{display:flex;align-items:center;gap:11px;margin-top:20px}.article-author-badge{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#e8f6ff;color:#078ee5}.article-byline div:last-child{display:flex;flex-direction:column}.article-byline strong{font-size:14px}.article-byline span{font-size:12px;color:#8290a0}.article-hero{padding:10px 0 36px}.article-hero img{display:block;width:100%;max-height:560px;object-fit:cover;border-radius:18px;box-shadow:0 18px 42px rgba(25,47,74,.12)}.article-main{padding:8px 0 70px}.article-layout{display:grid;grid-template-columns:minmax(0,760px) 300px;justify-content:center;gap:48px;align-items:start}.article-content{font-size:17px;line-height:1.8;color:#3c4c5e}.article-content h2{font-size:29px;line-height:1.3;color:#18324d;font-weight:900;margin:36px 0 13px}.article-content h3{font-size:22px;line-height:1.4;color:#203b55;font-weight:850;margin:28px 0 10px}.article-content p{white-space:pre-line;margin:0 0 20px}.article-content figure{margin:28px 0}.article-content figure img{width:100%;max-height:520px;object-fit:cover;border-radius:14px}.article-tags{display:flex;gap:8px;flex-wrap:wrap;margin:34px 0}.article-tags span{background:#f0f7fc;color:#087dca;border-radius:999px;padding:7px 11px;font-size:12px;font-weight:800}.article-related-cta{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px;border-radius:14px;background:#f3f9fd;border:1px solid #dcecf7}.article-related-cta p{font-size:13px;margin:2px 0 0;color:#6c7d8d}.article-related-cta a{white-space:nowrap;text-decoration:none;color:#fff;background:#078ee5;border-radius:9px;padding:10px 14px;font-weight:800;font-size:13px}.article-sidebar{position:sticky;top:105px;display:grid;gap:16px}.article-side-card{border:1px solid #e3eaf1;border-radius:14px;padding:18px;background:#fff;box-shadow:0 10px 26px rgba(22,48,75,.06)}.article-side-card h3{font-size:17px;font-weight:900;margin:0 0 13px}.article-side-item{display:grid;grid-template-columns:86px 1fr;gap:10px;padding:11px 0;border-top:1px solid #edf1f4;text-decoration:none;color:inherit}.article-side-item:first-of-type{border-top:0}.article-side-item img{width:86px;height:64px;border-radius:8px;object-fit:cover}.article-side-item span{display:flex;flex-direction:column;gap:5px}.article-side-item strong{font-size:13px;line-height:1.35}.article-side-item small{font-size:11px;color:#8a96a4}.article-back-guide{display:flex;gap:11px;align-items:center;border-radius:14px;background:#078ee5;color:#fff!important;text-decoration:none;padding:17px}.article-back-guide>i{font-size:24px}.article-back-guide span{display:flex;flex-direction:column}.article-back-guide small{color:rgba(255,255,255,.8)}

@media(max-width:991px){.guide-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.article-layout{grid-template-columns:1fr}.article-sidebar{position:static}.article-top h1{font-size:34px}.guide-featured-card{min-height:300px}.guide-featured-copy h1{font-size:31px}}
@media(max-width:640px){.guide-card-grid{grid-template-columns:1fr}.guide-featured-card{min-height:270px;padding:24px}.guide-featured-copy h1{font-size:26px}.guide-featured-copy p{font-size:14px}.guide-section-head{align-items:flex-start;flex-direction:column}.article-top h1{font-size:29px}.article-lead{font-size:16px}.article-content{font-size:16px}.article-content h2{font-size:25px}.article-related-cta{align-items:flex-start;flex-direction:column}.guide-search-form button{padding:0 14px}.guide-search-form input{min-width:0}}

/* Phase 14 - interactive bus seat picker */
.bus-seat-picker{border:1px solid #dce6f1;border-radius:20px;padding:20px;background:#f8fbff}.bus-seat-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:#667085}.bus-seat-legend span{display:inline-flex;align-items:center;gap:6px}.seat-dot{width:13px;height:13px;border-radius:4px;border:1px solid #b9c8d8;background:#fff}.seat-dot.selected{background:#0d6efd;border-color:#0d6efd}.seat-dot.occupied{background:#d7dce3;border-color:#c6ccd4}.bus-driver{max-width:540px;margin:0 auto 14px;padding:9px 14px;border:1px dashed #b7c7d9;border-radius:12px;text-align:center;color:#526071;background:#fff;font-size:13px;font-weight:700}.bus-seat-grid{max-width:540px;margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(68px,1fr));gap:12px 18px;padding:18px;border-radius:18px;background:#eef5fb;border:1px solid #d8e4ef}.bus-seat-grid.is-sleeper{grid-template-columns:repeat(2,minmax(90px,1fr));max-width:420px}.bus-seat{min-height:58px;border:1px solid #b9cadb;border-radius:13px;background:#fff;color:#30445b;display:flex;align-items:center;justify-content:center;gap:8px;font-weight:800;transition:.16s ease;box-shadow:0 3px 8px rgba(30,60,90,.05)}.bus-seat:hover:not(:disabled){transform:translateY(-2px);border-color:#0d6efd;color:#0d6efd}.bus-seat.is-selected{background:#0d6efd;border-color:#0d6efd;color:#fff;box-shadow:0 8px 18px rgba(13,110,253,.23)}.bus-seat.is-occupied{background:#dfe4ea;border-color:#d1d7de;color:#8b96a5;cursor:not-allowed;box-shadow:none}.bus-seat i{font-size:15px}@media(max-width:575px){.bus-seat-picker{padding:14px}.bus-seat-grid{grid-template-columns:repeat(2,minmax(70px,1fr));gap:10px;padding:12px}.bus-seat-legend{gap:8px}}

/* Phase 14 - combo detail presentation */
.combo-book-detail{display:grid;grid-template-columns:230px 1fr;gap:20px;padding:18px;border:1px solid #dce7f2;border-radius:18px;background:#f8fbff}.combo-book-detail[hidden]{display:none!important}.combo-book-detail>img{width:100%;height:180px;object-fit:cover;border-radius:14px}.combo-included-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.combo-included-grid>div{display:flex;gap:10px;padding:10px 12px;border-radius:12px;background:#fff;border:1px solid #e5edf5}.combo-included-grid i{width:22px;color:#0d6efd;margin-top:3px}.combo-included-grid span{display:grid;font-size:13px;color:#526071}.combo-included-grid b{color:#17233c;margin-bottom:2px}.combo-total-preview{padding:12px 16px;border:1px solid #fed7aa;border-radius:14px;background:#fff7ed;display:grid}.combo-total-preview span,.combo-total-preview small{color:#7c6a58;font-size:12px}.combo-total-preview strong{font-size:22px;color:#e3343b}.combo-catalog-card>img{height:210px;object-fit:cover}.combo-catalog-includes{display:grid;gap:7px;padding:12px 0 16px;border-top:1px solid #edf1f5}.combo-catalog-includes>strong{font-size:13px;color:#334155}.combo-catalog-includes span{font-size:13px;color:#64748b}.combo-catalog-includes i{width:22px;color:#0d6efd}@media(max-width:767px){.combo-book-detail{grid-template-columns:1fr}.combo-book-detail>img{height:210px}.combo-included-grid{grid-template-columns:1fr}}


/* Phase 14 - scrollable marketing article editor */
#articleModal .modal-dialog{height:calc(100vh - 2rem);margin-top:1rem;margin-bottom:1rem}
#articleModal .article-editor-modal{max-height:calc(100vh - 2rem);min-height:0;overflow:hidden}
#articleModal .modal-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
#articleModal .modal-header,#articleModal .modal-footer{flex:0 0 auto}
@media(max-width:575px){#articleModal .modal-dialog{height:calc(100vh - 1rem);margin:.5rem}#articleModal .article-editor-modal{max-height:calc(100vh - 1rem)}}