:root { --mviaa: #0b4f6c; --mviaa-accent: #f29e4c; }
body { background: #f4f6f9; }
.bg-mviaa { background: var(--mviaa); }
.btn-mviaa { background: var(--mviaa-accent); color: #1b1b1b; border: 0; }
.btn-mviaa:hover { background: #e38b32; }
.card { border: 0; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.stat { font-size: 1.6rem; font-weight: 600; }
.offer-row:hover { background: #fffaf3; }
.fare-net { font-weight: 600; }
.fare-pub { color: #6c757d; font-size: .85rem; }
.tree ul { list-style: none; padding-left: 1.4rem; border-left: 1px dashed #c8d0da; margin-left: .4rem; }
.tree li { margin: .25rem 0; }
.amount-credit { color: #198754; }
.amount-debit { color: #dc3545; }
@media print { .no-print, nav, footer { display: none !important; } body { background: #fff; } .card { box-shadow: none; } }

/* Fields rejected by server-side validation (ASP.NET adds these classes) */
.input-validation-error { border-color: #dc3545 !important; }
.field-validation-error { display: block; }

/* ---------- Agent sign-up (Account/Register) ---------- */
.signup-card { max-width: 1140px; padding: 1.5rem 2rem 2rem; }
.signup-title { text-align: center; text-transform: uppercase; font-weight: 700; font-size: 1.9rem; color: var(--mviaa); letter-spacing: .5px; margin-bottom: .25rem; }
.signup-section { font-size: 1.15rem; font-weight: 600; color: var(--mviaa); margin: 1.75rem 0 .9rem; }
.signup-card .form-floating > label { color: #4a5a78; }
.btn-otp { background: var(--mviaa); color: #fff; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; min-height: calc(3.5rem + 2px); box-shadow: 0 2px 4px rgba(0,0,0,.15); }
.btn-otp:hover, .btn-otp:focus { background: #093f57; color: #fff; }
.btn-otp:disabled { background: #7d97a6; color: #fff; }
.otp-row .input-group { max-width: 26rem; }
.channel-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; }
.channel-option { display: flex; flex-direction: column; gap: .2rem; border: 1.5px solid #d6dde6; border-radius: .5rem; padding: .65rem .8rem; cursor: pointer; height: 100%; font-size: .85rem; color: #4a5a78; }
.channel-option strong { color: #1b1b1b; font-size: .95rem; }
.btn-check:checked + .channel-option { border-color: var(--mviaa); background: #eef5f8; box-shadow: inset 0 0 0 1px var(--mviaa); }
.btn-check:focus-visible + .channel-option { outline: 2px solid var(--mviaa-accent); outline-offset: 2px; }
@media (max-width: 767.98px) {
    .signup-card { padding: 1rem; }
    .signup-title { font-size: 1.45rem; }
    .channel-options { grid-template-columns: 1fr; }
}

/* ---------- Offline booking (Offline/*) ---------- */
.ob-hero { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.1rem 1.35rem; border-radius: .9rem; color: #fff;
    background: radial-gradient(circle at 92% 0%, rgba(242,158,76,.35), transparent 45%), linear-gradient(120deg, var(--mviaa), #0e6a8f); box-shadow: 0 6px 18px rgba(11,79,108,.25); }
.ob-hero h3 { color: #fff; font-weight: 700; }
.ob-hero p { color: rgba(255,255,255,.85); max-width: 46rem; }
.ob-card { padding: 1.1rem 1.25rem; margin-bottom: 1rem; border-radius: .9rem; }
.ob-step { display: flex; align-items: center; gap: .6rem; margin-bottom: .9rem; }
.ob-step-no { width: 1.9rem; height: 1.9rem; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: .9rem; color: #fff; background: var(--mviaa); flex: none; }
.ob-step-title { font-size: 1.05rem; font-weight: 700; color: var(--mviaa); margin: 0; }
.ob-trip-toggle { display: flex; flex-wrap: wrap; gap: .5rem; }
.ob-trip-pill { display: inline-flex; align-items: center; gap: .4rem; padding: .45rem 1rem; border: 1.5px solid #d6dde6; border-radius: 999px; cursor: pointer; font-weight: 600; font-size: .9rem; color: #4a5a78; background: #fff; }
.btn-check:checked + .ob-trip-pill { border-color: var(--mviaa); background: #eef5f8; color: var(--mviaa); box-shadow: inset 0 0 0 1px var(--mviaa); }
.btn-check:focus-visible + .ob-trip-pill { outline: 2px solid var(--mviaa-accent); outline-offset: 2px; }
.ob-seg, .ob-pax { border: 1px solid #e3e8ef; border-radius: .75rem; padding: .75rem .85rem .85rem; margin-bottom: .75rem; background: #fbfcfe; }
.ob-seg-head, .ob-pax-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .5rem; }
.ob-pax-head { justify-content: flex-start; }
.ob-seg-badge { font-weight: 600; font-size: .85rem; color: var(--mviaa); }
.ob-icon-btn { width: 2rem; height: 2rem; display: inline-grid; place-items: center; border: 1px solid #d6dde6; border-radius: 50%; background: #fff; color: #4a5a78; padding: 0; }
.ob-icon-btn:hover { background: #eef5f8; color: var(--mviaa); }
.ob-icon-danger:hover { background: #fdecec; color: #b42318; border-color: #f3c2c2; }
.ob-avatar { width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; color: #fff; flex: none; }
.ob-avatar-adult { background: var(--mviaa); }
.ob-avatar-child { background: #198754; }
.ob-avatar-infant { background: var(--mviaa-accent); color: #1b1b1b; }
.ob-summary { position: sticky; top: 1rem; padding: 1.1rem 1.25rem; border-radius: .9rem; border-top: 4px solid var(--mviaa-accent); }
.ob-sum-route { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .75rem; color: #6c757d; font-size: .9rem; }
.ob-chip { display: inline-flex; align-items: center; gap: .15rem; padding: .25rem .6rem; border-radius: 999px; background: #eef5f8; color: var(--mviaa); font-weight: 600; font-size: .85rem; }
.ob-chip small { margin-left: .35rem; font-weight: 500; color: #4a5a78; }
.ob-sum-list { display: grid; grid-template-columns: auto 1fr; gap: .25rem .75rem; font-size: .88rem; margin-bottom: .75rem; }
.ob-sum-list dt { color: #6c757d; font-weight: 500; }
.ob-sum-list dd { margin: 0; font-weight: 600; text-align: right; }
.ob-steps-info { list-style: none; padding: 0; display: grid; gap: .35rem; }
.ob-steps-info i { color: var(--mviaa); margin-right: .3rem; }
.ob-mobile-bar { position: sticky; bottom: 0; z-index: 1020; display: flex; justify-content: space-between; align-items: center; gap: .75rem;
    margin: 0 -12px; padding: .65rem 12px; background: #fff; border-top: 1px solid #e3e8ef; box-shadow: 0 -4px 14px rgba(0,0,0,.08); }
.ob-list { display: grid; gap: .6rem; }
.ob-list-item { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .85rem 1.1rem; border-radius: .8rem; text-decoration: none; color: inherit; transition: box-shadow .15s, transform .15s; }
.ob-list-item:hover, .ob-list-item:focus-visible { box-shadow: 0 6px 18px rgba(0,0,0,.1); transform: translateY(-1px); color: inherit; }
.ob-list-route { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .3rem; }
.ob-list-side { text-align: right; flex: none; }
.ob-timeline { list-style: none; padding-left: 1rem; border-left: 2px dashed #cfd8e3; margin: .5rem 0 .75rem; }
.ob-timeline li { position: relative; padding: 0 0 .6rem .5rem; }
.ob-timeline li::before { content: ""; position: absolute; left: -1.42rem; top: .35rem; width: .7rem; height: .7rem; border-radius: 50%; background: var(--mviaa); box-shadow: 0 0 0 3px #eef5f8; }
.ob-debit { padding: .6rem .8rem; border-radius: .6rem; background: #f3faf6; border: 1px solid #cde9d8; font-size: .95rem; }
@media (max-width: 575.98px) {
    .ob-hero { padding: .9rem 1rem; }
    .ob-card { padding: .9rem; }
    .ob-list-item { flex-direction: column; align-items: flex-start; }
    .ob-list-side { text-align: left; display: flex; gap: .75rem; align-items: center; }
}

/* ---------- Hotels (shared styles in _content/Ventrip.Web.Common/css/hotels.css) ---------- */
.b2b-hotel-hero { padding: 1.25rem; border-radius: 1rem; color: #fff;
    background: radial-gradient(circle at 90% 0%, rgba(242,158,76,.4), transparent 45%), linear-gradient(120deg, var(--mviaa), #0e6a8f); box-shadow: 0 8px 22px rgba(11,79,108,.25); }
.b2b-hotel-hero .hs-form { margin-top: .25rem; }
@media (min-width: 992px) { .b2b-hotel-hero { padding: 1.6rem 1.75rem; } }
.product-badge { display: inline-flex; align-items: center; gap: .25rem; font-size: .72rem; font-weight: 700; padding: .15rem .45rem; border-radius: 999px; background: #eef5f8; color: var(--mviaa); }
.product-badge.is-hotel { background: #fff3e6; color: #a34f00; }

/* ---------- Main menu ---------- */
.app-nav { box-shadow: 0 2px 10px rgba(0,0,0,.18); }
.app-nav .nav-link { display: flex; align-items: center; gap: .4rem; font-weight: 500; color: rgba(255,255,255,.82); border-radius: .5rem; padding: .5rem .75rem !important; }
.app-nav .nav-link:hover, .app-nav .nav-link:focus-visible { color: #fff; background: rgba(255,255,255,.08); }
.app-nav .nav-link.active { color: #fff; background: rgba(255,255,255,.14); box-shadow: inset 0 -3px 0 var(--mviaa-accent); }
.app-menu { border: 0; border-radius: .8rem; box-shadow: 0 12px 32px rgba(11,31,75,.18); padding: .4rem; min-width: 17rem; }
.app-menu .dropdown-item { display: grid; grid-template-columns: 1.6rem 1fr; align-items: center; column-gap: .35rem; border-radius: .55rem; padding: .5rem .65rem; font-weight: 500; white-space: normal; }
.app-menu .dropdown-item > i { grid-row: span 2; font-size: 1.1rem; color: var(--mviaa); }
.app-menu .dropdown-item small { grid-column: 2; color: #6c757d; font-weight: 400; font-size: .76rem; }
.app-menu .dropdown-item:hover, .app-menu .dropdown-item:focus { background: #eef5f8; }
.app-menu .dropdown-item:active { background: var(--mviaa); color: #fff; }
.app-menu .dropdown-item:active small, .app-menu .dropdown-item:active > i { color: #fff; }
.app-avatar { width: 2.1rem; height: 2.1rem; border-radius: 50%; display: grid; place-items: center; background: var(--mviaa-accent); color: #1b1b1b; font-weight: 700; font-size: .85rem; flex: none; }
.app-user-org { font-size: .72rem; color: rgba(255,255,255,.65); max-width: 14rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-user .dropdown-toggle { text-decoration: none; }
@media (max-width: 991.98px) {
    .app-nav .navbar-collapse { max-height: calc(100vh - 4rem); overflow-y: auto; padding: .5rem 0 .75rem; }
    .app-menu { box-shadow: none; background: rgba(255,255,255,.06); min-width: 0; }
    .app-menu .dropdown-item { color: #fff; }
    .app-menu .dropdown-item > i, .app-menu .dropdown-item small { color: rgba(255,255,255,.7); }
    .app-menu .dropdown-item:hover { background: rgba(255,255,255,.1); }
    .app-menu .dropdown-header { color: rgba(255,255,255,.6); }
    .app-menu .dropdown-divider { border-color: rgba(255,255,255,.15); }
    .app-user { border-top: 1px solid rgba(255,255,255,.15); margin-top: .5rem; padding-top: .5rem; }
}

/* ---------- Accounts: notes, report ---------- */
.ob-hero-debit { background: radial-gradient(circle at 92% 0%, rgba(242,158,76,.35), transparent 45%), linear-gradient(120deg, #7a1f2b, #a8323e); }
.ob-table thead th { font-size: .74rem; text-transform: uppercase; letter-spacing: .4px; color: #6c757d; background: #f8fafc; border-bottom-width: 1px; white-space: nowrap; }
.ob-table td, .ob-table th { padding-left: .9rem; padding-right: .9rem; }
.kpi-card { position: relative; height: 100%; padding: .85rem .95rem; border-radius: .85rem; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.08); border-left: 4px solid var(--mviaa); }
.kpi-card.is-pos { border-left-color: #198754; }
.kpi-card.is-neg { border-left-color: #dc3545; }
.kpi-icon { position: absolute; top: .7rem; right: .8rem; font-size: 1.2rem; color: #c3ced9; }
.kpi-label { font-size: .75rem; text-transform: uppercase; letter-spacing: .4px; color: #6c757d; font-weight: 600; }
.kpi-value { font-size: 1.2rem; font-weight: 700; margin-top: .15rem; word-break: break-word; }
.kpi-card.is-pos .kpi-value { color: #146c43; }
.kpi-card.is-neg .kpi-value { color: #b02a37; }
.kpi-sub { font-size: .75rem; color: #6c757d; }
.pnl .table td, .pnl .table th { padding: .45rem .5rem; }
.pnl-head th { background: #eef5f8; color: var(--mviaa); font-size: .8rem; text-transform: uppercase; letter-spacing: .5px; }
.pnl-total th { border-top: 1px solid #adb5bd; }
.pnl-net th { font-size: 1.05rem; background: #e8f5ee; color: #146c43; border-top: 2px solid #146c43; border-bottom: 3px double #146c43; }
.pnl-net.is-neg th { background: #fdecec; color: #b02a37; border-color: #b02a37; }
.pnl-info { display: grid; grid-template-columns: 1fr auto; gap: .2rem 1rem; font-size: .86rem; }
.pnl-info dt { font-weight: 400; color: #4a5a78; }
.pnl-info dd { margin: 0; text-align: right; font-weight: 600; }
.report-chart { position: relative; height: 260px; }
.channel-bars { display: grid; gap: .7rem; }
.channel-bar .progress { height: 1.35rem; margin-top: .25rem; background: #eef2f6; }
.channel-bar .progress-bar { background: linear-gradient(90deg, var(--mviaa), #1582ad); font-size: .75rem; justify-content: flex-start; padding-left: .5rem; overflow: visible; white-space: nowrap; }
.report-tabs { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; }
.report-tabs .nav-link { white-space: nowrap; font-weight: 600; color: #4a5a78; }
.report-tabs .nav-link.active { color: var(--mviaa); }
.note-voucher { max-width: 760px; overflow: hidden; border-radius: 1rem; }
.note-voucher-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.25rem 1.5rem; color: #fff; }
.note-voucher-head.is-credit { background: linear-gradient(120deg, #146c43, #1f9160); }
.note-voucher-head.is-debit { background: linear-gradient(120deg, #7a1f2b, #a8323e); }
.note-brand { font-size: 1.3rem; font-weight: 800; letter-spacing: .5px; }
.note-title { font-size: 1.15rem; font-weight: 800; letter-spacing: 1px; }
.note-amount { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .9rem 1.1rem; border-radius: .7rem; font-size: 1.05rem; }
.note-amount strong { font-size: 1.5rem; }
.note-amount.is-credit { background: #e8f5ee; color: #146c43; }
.note-amount.is-debit { background: #fdecec; color: #b02a37; }
@media (max-width: 575.98px) {
    .kpi-value { font-size: 1.02rem; }
    .report-chart { height: 220px; }
    .note-amount { flex-direction: column; align-items: flex-start; }
}
@media print {
    .app-nav, .report-tabs, .alert-dismissible .btn-close { display: none !important; }
    .tab-content > .tab-pane { display: block !important; opacity: 1 !important; }
    .ob-hero { background: none !important; color: #000; box-shadow: none; padding: 0; }
    .ob-hero h3, .ob-hero p { color: #000 !important; }
    .note-voucher-head { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    .kpi-card, .ob-card { box-shadow: none !important; border: 1px solid #ddd; break-inside: avoid; }
}

/* ---------- Dashboard by product ---------- */
.dash-quick { background: var(--dash-color); border-color: var(--dash-color); color: #fff; }
.dash-quick:hover, .dash-quick:focus-visible { filter: brightness(1.08); color: #fff; background: var(--dash-color); border-color: var(--dash-color); }
.dash-product { border-top: 4px solid var(--dash-color); display: flex; flex-direction: column; }
.dash-product-icon { width: 2.2rem; height: 2.2rem; border-radius: 50%; display: grid; place-items: center; color: var(--dash-color);
    background: color-mix(in srgb, var(--dash-color) 14%, #fff); font-size: 1.05rem; }
.dash-share { height: 6px; background: #eef1f5; }
.dash-share .progress-bar { background: var(--dash-color); }
.dash-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin: .25rem 0 .75rem; }
.dash-facts div { background: #f6f8fb; border-radius: 8px; padding: .4rem .55rem; }
.dash-facts dt { font-size: .72rem; font-weight: 500; color: #6c757d; }
.dash-facts dd { margin: 0; font-weight: 700; font-size: 1.05rem; }
/* Charts get a fixed-height box so Chart.js never collapses them (maintainAspectRatio: false). */
.dash-chart { position: relative; height: 300px; }
.dash-chart.is-small { height: 280px; }