html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 .1rem white, 0 0 0 .25rem rgba(37, 99, 235, .22);
}

html {
    min-height: 100%;
    position: relative;
}

body {
    background: #f4f6f8;
    color: #1f2933;
    font-family: "Segoe UI", Arial, sans-serif;
    margin: 0;
}

.app-navbar {
    background: #ffffff;
    border-bottom: 1px solid #d9e1ea;
    min-height: 58px;
}

.app-navbar .nav-link,
.app-navbar .navbar-brand {
    color: #18212f;
}

.app-main-nav {
    gap: 2px;
}

.app-navbar .dropdown-menu {
    border-color: #d9e1ea;
    border-radius: 6px;
    box-shadow: 0 14px 30px rgba(31, 41, 51, .12);
    max-height: calc(100vh - 84px);
    min-width: 248px;
    overflow-y: auto;
}

.app-navbar .dropdown-header {
    color: #607086;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.app-shell {
    margin: 0 auto;
    max-width: 1320px;
    padding: 24px;
}

.eyebrow {
    color: #607086;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .08em;
    margin: 0 0 6px;
    text-transform: uppercase;
}

.login-page {
    align-items: center;
    display: flex;
    justify-content: center;
    min-height: calc(100vh - 106px);
}

.login-panel {
    background: #ffffff;
    border: 1px solid #d9e1ea;
    border-radius: 8px;
    box-shadow: 0 18px 42px rgba(31, 41, 51, .08);
    max-width: 420px;
    padding: 28px;
    width: 100%;
}

.login-header {
    margin-bottom: 22px;
}

.login-header h1,
.dashboard-header h1,
.section-heading h2 {
    letter-spacing: 0;
    margin: 0;
}

.login-form {
    display: grid;
    gap: 16px;
}

.form-field {
    display: grid;
    gap: 7px;
}

.form-field label {
    color: #3b4656;
    font-size: .9rem;
    font-weight: 600;
}

.form-control,
.form-select {
    border-color: #cbd5df;
    border-radius: 6px;
    min-height: 42px;
}

.btn-primary {
    background: #2563eb;
    border-color: #2563eb;
    border-radius: 6px;
    min-height: 42px;
}

.dashboard-header {
    align-items: flex-end;
    display: flex;
    gap: 20px;
    justify-content: space-between;
    margin-bottom: 22px;
}

.dashboard-header h1 {
    font-size: clamp(1.55rem, 2.2vw, 2.2rem);
    font-weight: 700;
}

.header-meta {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.header-meta span {
    background: #ffffff;
    border: 1px solid #d9e1ea;
    border-radius: 999px;
    color: #4b5b70;
    font-size: .86rem;
    padding: 7px 11px;
}

.dashboard-logout-form {
    margin: 0;
}

.dashboard-logout-btn {
    border-radius: 999px;
    font-weight: 700;
    min-height: 34px;
    padding-inline: 14px;
}

.status-pill.status-ok {
    background: #e9f8ef;
    border-color: #b9e6c8;
    color: #166534;
}

.status-pill.status-warn {
    background: #fff7ed;
    border-color: #fed7aa;
    color: #9a3412;
}

.status-pill {
    background: #f7f9fc;
    border: 1px solid #d9e1ea;
    border-radius: 999px;
    color: #40516a;
    display: inline-block;
    font-size: .78rem;
    font-weight: 700;
    line-height: 1;
    padding: 5px 8px;
    white-space: nowrap;
}

.status-pill.status-success {
    background: #e9f8ef;
    border-color: #b9e6c8;
    color: #166534;
}

.status-pill.status-warning {
    background: #fff7ed;
    border-color: #fed7aa;
    color: #9a3412;
}

.status-pill.status-danger {
    background: #fef2f2;
    border-color: #fecaca;
    color: #991b1b;
}

.metric-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    margin-bottom: 26px;
}

.metric-card {
    background: #ffffff;
    border: 1px solid #d9e1ea;
    border-radius: 8px;
    min-height: 126px;
    padding: 18px;
}

.metric-card span {
    color: #607086;
    display: block;
    font-size: .88rem;
    font-weight: 700;
}

.metric-card strong {
    color: #111827;
    display: block;
    font-size: 2rem;
    line-height: 1.15;
    margin-top: 12px;
}

.metric-card small {
    color: #6b7280;
    display: block;
    margin-top: 8px;
}

.dashboard-operational-metrics {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    margin-bottom: 18px;
}

.dashboard-operational-metrics article,
.dashboard-panel {
    background: #ffffff;
    border: 1px solid #d9e1ea;
    border-radius: 8px;
}

.dashboard-operational-metrics article {
    min-height: 116px;
    padding: 18px;
}

.dashboard-operational-metrics span {
    color: #607086;
    display: block;
    font-size: .88rem;
    font-weight: 700;
}

.dashboard-operational-metrics strong {
    color: #111827;
    display: block;
    font-size: 1.9rem;
    line-height: 1.15;
    margin-top: 12px;
}

.dashboard-operational-metrics small {
    color: #6b7280;
    display: block;
    margin-top: 8px;
}

.dashboard-overview-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, .85fr);
    grid-template-areas:
        "rooms revenue"
        "rooms status";
    margin-bottom: 18px;
}

.dashboard-panel {
    min-width: 0;
    padding: 18px;
}

.dashboard-panel .panel-heading {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    margin-bottom: 14px;
}

.dashboard-panel .panel-heading h2 {
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0;
}

.dashboard-panel .panel-heading span {
    color: #607086;
    font-size: .84rem;
    font-weight: 600;
    text-align: right;
}

.dashboard-room-panel {
    grid-area: rooms;
}

.dashboard-revenue-panel {
    grid-area: revenue;
}

.dashboard-status-panel {
    grid-area: status;
}

.dashboard-room-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(136px, 1fr));
    max-height: 374px;
    overflow: auto;
    padding-right: 4px;
}

.dashboard-room-tile {
    border: 1px solid #d9e1ea;
    border-radius: 8px;
    display: grid;
    gap: 4px;
    min-height: 106px;
    padding: 12px;
}

.dashboard-room-tile strong,
.dashboard-room-tile span,
.dashboard-room-tile small,
.dashboard-room-tile em {
    min-width: 0;
    overflow-wrap: anywhere;
}

.dashboard-room-tile strong {
    font-size: 1.35rem;
    line-height: 1.1;
}

.dashboard-room-tile span {
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .02em;
}

.dashboard-room-tile small {
    color: #4b5563;
}

.dashboard-room-tile em {
    font-style: normal;
    font-weight: 700;
}

.dashboard-room-tile.room-vacant {
    background: #f0fdf4;
    border-color: #bbf7d0;
    color: #166534;
}

.dashboard-room-tile.room-occupied {
    background: #fff1f2;
    border-color: #fecdd3;
    color: #9f1239;
}

.dashboard-room-tile.room-housekeeping {
    background: #fff7ed;
    border-color: #fed7aa;
    color: #9a3412;
}

.dashboard-room-tile.room-blocked,
.dashboard-room-tile.room-other {
    background: #f8fafc;
    border-color: #cbd5e1;
    color: #334155;
}

.dashboard-revenue-chart {
    align-items: end;
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(14, minmax(18px, 1fr));
    min-height: 232px;
}

.dashboard-revenue-day {
    align-items: stretch;
    display: grid;
    gap: 8px;
    grid-template-rows: 180px 32px;
    min-width: 0;
}

.dashboard-revenue-track {
    align-items: end;
    background: #eef2f7;
    border-radius: 6px;
    display: flex;
    height: 180px;
    overflow: hidden;
}

.dashboard-revenue-track span {
    background: #2563eb;
    border-radius: 6px 6px 0 0;
    display: block;
    min-height: 2px;
    width: 100%;
}

.dashboard-revenue-day small {
    color: #6b7280;
    font-size: .72rem;
    text-align: center;
    white-space: normal;
}

.dashboard-status-list {
    display: grid;
    gap: 12px;
}

.dashboard-status-row {
    display: grid;
    gap: 7px;
}

.dashboard-status-row div {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.dashboard-status-row span {
    color: #344054;
    font-size: .86rem;
    font-weight: 700;
}

.dashboard-status-row strong {
    color: #111827;
    font-size: .9rem;
}

.dashboard-status-row i {
    background: #edf2f7;
    border-radius: 999px;
    display: block;
    height: 9px;
    overflow: hidden;
}

.dashboard-status-row b {
    background: #16a34a;
    display: block;
    height: 100%;
}

.dashboard-reservation-panel {
    margin-bottom: 24px;
}

.dashboard-booking-panel {
    margin-bottom: 18px;
}

.dashboard-booking-table {
    min-width: 1080px;
}

.dashboard-booking-table td strong,
.dashboard-booking-table td small {
    display: block;
}

.dashboard-booking-table td small {
    color: #607086;
    font-size: .78rem;
    margin-top: 3px;
}

.dashboard-booking-actions {
    align-items: center;
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    min-width: 160px;
}

.dashboard-booking-actions form {
    margin: 0;
}

.dashboard-reservation-table {
    min-width: 860px;
}

.work-section {
    margin-top: 10px;
}

.section-heading {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}

.section-heading h2 {
    font-size: 1.15rem;
    font-weight: 700;
}

.module-list {
    background: #ffffff;
    border: 1px solid #d9e1ea;
    border-radius: 8px;
    overflow: hidden;
}

.module-row {
    align-items: center;
    border-bottom: 1px solid #e4ebf2;
    display: grid;
    gap: 16px;
    grid-template-columns: 1fr auto;
    min-height: 82px;
    padding: 16px 18px;
}

.module-row:last-child {
    border-bottom: 0;
}

.module-row h3 {
    font-size: .98rem;
    font-weight: 700;
    margin: 0 0 5px;
}

.module-row p {
    color: #607086;
    margin: 0;
}

.module-status {
    background: #eef2f6;
    border-radius: 999px;
    color: #39485d;
    font-size: .82rem;
    font-weight: 700;
    padding: 7px 10px;
    white-space: nowrap;
}

.module-status.status-ok {
    background: #e9f8ef;
    color: #166534;
}

.module-status.status-warn {
    background: #fff7ed;
    color: #9a3412;
}

.module-status.status-info {
    background: #eaf1ff;
    color: #1d4ed8;
}

.module-status.status-danger {
    background: #fee2e2;
    color: #991b1b;
}

.section-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.section-tabs a {
    align-items: center;
    background: #ffffff;
    border: 1px solid #d9e1ea;
    border-radius: 8px;
    color: #39485d;
    display: inline-flex;
    font-weight: 700;
    gap: 8px;
    min-height: 40px;
    padding: 8px 12px;
    text-decoration: none;
}

.section-tabs a.active {
    background: #eaf1ff;
    border-color: #bad0ff;
    color: #1d4ed8;
}

.section-tabs span {
    background: #eef2f6;
    border-radius: 999px;
    color: #4b5b70;
    font-size: .78rem;
    padding: 3px 7px;
}

.page-header {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 18px;
}

.header-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.page-header h1 {
    font-size: clamp(1.45rem, 2vw, 2rem);
    font-weight: 700;
    letter-spacing: 0;
    margin: 0;
}

.master-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(320px, 410px) minmax(0, 1fr);
}

.guest-master-grid {
    grid-template-columns: minmax(420px, 560px) minmax(0, 1fr);
}

.partner-master-grid {
    grid-template-columns: minmax(430px, 600px) minmax(0, 1fr);
}

.reservation-master-grid {
    grid-template-columns: minmax(520px, 720px) minmax(0, 1fr);
}

.checkin-master-grid {
    grid-template-columns: minmax(540px, 760px) minmax(0, 1fr);
}

.checkout-master-grid {
    grid-template-columns: minmax(520px, 700px) minmax(0, 1fr);
}

.stay-extension-master-grid {
    grid-template-columns: minmax(430px, 560px) minmax(0, 1fr);
}

.folio-master-grid {
    grid-template-columns: minmax(460px, 620px) minmax(0, 1fr);
}

.invoice-master-grid {
    grid-template-columns: minmax(460px, 620px) minmax(0, 1fr);
}

.hotel-profile-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(520px, 1fr) minmax(300px, 390px);
}

.rateplan-master-grid {
    grid-template-columns: minmax(520px, 700px) minmax(0, 1fr);
}

.housekeeping-master-grid {
    grid-template-columns: minmax(420px, 500px) minmax(0, 1fr);
}

.maintenance-master-grid {
    grid-template-columns: minmax(430px, 520px) minmax(0, 1fr);
}

.room-allocation-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(560px, 1.35fr) minmax(420px, 1fr);
}

.day-closing-grid {
    grid-template-columns: minmax(330px, 410px) minmax(0, 1fr);
}

.night-audit-grid {
    grid-template-columns: minmax(330px, 410px) minmax(0, 1fr);
}

.pos-setup-grid {
    grid-template-columns: minmax(420px, 560px) minmax(0, 1fr);
}

.pos-waiter-grid {
    grid-template-columns: minmax(520px, 700px) minmax(0, 1fr);
}

.pos-printer-grid {
    grid-template-columns: minmax(420px, 560px) minmax(0, 1fr);
}

.inventory-master-grid {
    grid-template-columns: minmax(430px, 560px) minmax(0, 1fr);
}

.inventory-opening-stock-grid {
    grid-template-columns: minmax(430px, 560px) minmax(0, 1fr);
}

.inventory-dashboard-grid {
    grid-template-columns: minmax(420px, 560px) minmax(0, 1fr);
}

.inventory-category-grid {
    grid-template-columns: minmax(360px, 460px) minmax(0, 1fr);
}

.inventory-supplier-grid {
    grid-template-columns: minmax(430px, 560px) minmax(0, 1fr);
}

.inventory-department-grid {
    grid-template-columns: minmax(360px, 460px) minmax(0, 1fr);
}

.asset-master-grid {
    grid-template-columns: minmax(470px, 600px) minmax(0, 1fr);
}

.payroll-master-grid {
    grid-template-columns: minmax(390px, 520px) minmax(0, 1fr);
}

.payroll-settings-grid {
    grid-template-columns: minmax(500px, 680px) minmax(0, 1fr);
}

.employee-setup-grid {
    grid-template-columns: minmax(480px, 620px) minmax(0, 1fr);
}

.employee-salary-grid {
    grid-template-columns: minmax(620px, 820px) minmax(0, 1fr);
}

.attendance-leave-grid {
    grid-template-columns: minmax(460px, 600px) minmax(0, 1fr);
}

.attendance-import-grid {
    grid-template-columns: minmax(420px, 520px) minmax(0, 1fr);
}

.leave-approval-grid {
    grid-template-columns: minmax(420px, 520px) minmax(0, 1fr);
}

.payroll-run-process-grid {
    grid-template-columns: minmax(430px, 540px) minmax(0, 1fr);
}

.payroll-run-history-grid,
.payroll-run-sheet-grid,
.payroll-run-payslip-grid,
.payroll-run-disbursement-grid {
    grid-template-columns: minmax(420px, 520px) minmax(0, 1fr);
}

.staff-payroll-grid,
.staff-attendance-grid,
.staff-payroll-run-grid {
    grid-template-columns: minmax(430px, 560px) minmax(0, 1fr);
}

.loan-advance-entry-grid,
.loan-advance-report-grid {
    grid-template-columns: minmax(440px, 560px) minmax(0, 1fr);
}

.inventory-purchase-grid {
    grid-template-columns: minmax(620px, 820px) minmax(0, 1fr);
}

.inventory-issue-grid,
.inventory-wastage-grid,
.inventory-adjustment-grid {
    grid-template-columns: minmax(620px, 820px) minmax(0, 1fr);
}

.master-grid {
    grid-template-columns: minmax(0, 1fr);
}

.restaurant-pos-shell {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1.45fr) minmax(380px, .85fr);
}

.kitchen-kot-shell {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1.25fr) minmax(360px, .75fr);
}

.pos-audit-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.restaurant-pos-main,
.restaurant-pos-side,
.kitchen-kot-main,
.kitchen-kot-side {
    display: grid;
    gap: 18px;
    min-width: 0;
}

.workflow-side {
    display: grid;
    gap: 18px;
    min-width: 0;
}

.master-panel {
    background: #ffffff;
    border: 1px solid #d9e1ea;
    border-radius: 8px;
    min-width: 0;
    padding: 18px;
}

.panel-heading {
    border-bottom: 1px solid #e4ebf2;
    margin: -2px 0 16px;
    padding-bottom: 12px;
}

.panel-heading h2 {
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0;
    margin: 0;
}

.form-section-title {
    border-top: 1px solid #e4ebf2;
    color: #263242;
    font-size: .88rem;
    font-weight: 800;
    margin-top: 4px;
    padding-top: 14px;
    text-transform: uppercase;
}

.form-section-title:first-of-type {
    border-top: 0;
    margin-top: 0;
    padding-top: 0;
}

.master-form {
    display: grid;
    gap: 14px;
}

.form-row,
.tax-rate-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

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

.toggle-row {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.toggle-row label,
.filter-check {
    align-items: center;
    color: #3b4656;
    display: inline-flex;
    font-size: .92rem;
    font-weight: 600;
    gap: 8px;
    margin: 0;
}

.toggle-row input,
.filter-check input {
    height: 17px;
    width: 17px;
}

.form-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.delete-form {
    border-top: 1px solid #e4ebf2;
    margin-top: 16px;
    padding-top: 16px;
}

.filter-bar {
    align-items: center;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(180px, 1fr) auto auto;
    margin-bottom: 14px;
}

.room-filter-bar {
    grid-template-columns: minmax(180px, 1fr) minmax(145px, .65fr) minmax(145px, .65fr) auto auto;
}

.room-status-filter-bar {
    grid-template-columns: minmax(180px, 1fr) minmax(145px, .55fr) minmax(120px, .45fr) minmax(145px, .55fr) auto auto;
}

.housekeeping-filter-bar {
    grid-template-columns: minmax(136px, .4fr) minmax(136px, .4fr) minmax(145px, .45fr) minmax(145px, .45fr) minmax(145px, .45fr) minmax(190px, 1fr) auto auto;
}

.maintenance-filter-bar {
    grid-template-columns: minmax(136px, .4fr) minmax(136px, .4fr) minmax(145px, .45fr) minmax(145px, .45fr) minmax(145px, .45fr) minmax(190px, 1fr) auto;
}

.room-allocation-filter-bar {
    grid-template-columns: minmax(260px, 1fr) minmax(170px, .45fr) auto;
}

.guest-filter-bar {
    grid-template-columns: minmax(220px, 1fr) auto auto;
}

.service-filter-bar {
    grid-template-columns: minmax(190px, 1fr) minmax(145px, .55fr) auto auto;
}

.partner-filter-bar {
    grid-template-columns: minmax(220px, 1fr) minmax(145px, .55fr) auto auto;
}

.reservation-filter-bar {
    grid-template-columns: minmax(220px, 1fr) minmax(145px, .45fr) auto;
}

.checkin-filter-bar {
    grid-template-columns: minmax(220px, 1fr) minmax(145px, .45fr) auto;
}

.checkin-arrival-filter-bar {
    grid-template-columns: minmax(170px, .45fr) auto;
}

.checkout-filter-bar {
    grid-template-columns: minmax(220px, 1fr) auto;
}

.folio-filter-bar {
    grid-template-columns: minmax(220px, 1fr) minmax(130px, .45fr) auto;
}

.folio-void-filter-bar {
    grid-template-columns: minmax(170px, .45fr) minmax(170px, .45fr) auto;
}

.invoice-filter-bar {
    grid-template-columns: minmax(220px, 1fr) minmax(135px, .45fr) auto;
}

.rateplan-filter-bar {
    grid-template-columns: minmax(220px, 1fr) auto auto;
}

.pos-setup-filter-bar {
    grid-template-columns: minmax(220px, 1fr) auto auto;
    margin-bottom: 14px;
}

.restaurant-pos-filter-bar {
    grid-template-columns: minmax(180px, .55fr) minmax(170px, .45fr) minmax(220px, 1fr) auto;
}

.kitchen-kot-filter-bar {
    grid-template-columns: minmax(145px, .35fr) minmax(145px, .35fr) minmax(135px, .35fr) minmax(150px, .4fr) minmax(220px, 1fr) auto;
}

.pos-audit-filter-bar {
    grid-template-columns: minmax(145px, .35fr) minmax(145px, .35fr) minmax(260px, 1fr) auto;
}

.pos-folio-filter-bar {
    grid-template-columns: minmax(145px, .35fr) minmax(145px, .35fr) minmax(260px, 1fr) auto;
}

.pos-report-filter-bar {
    grid-template-columns: minmax(145px, .35fr) minmax(145px, .35fr) minmax(190px, .45fr) minmax(260px, 1fr) auto;
}

.hotel-report-filter-bar {
    grid-template-columns: minmax(145px, .35fr) minmax(145px, .35fr) minmax(150px, .35fr) minmax(145px, .35fr) minmax(155px, .4fr) minmax(260px, 1fr) auto;
}

.report-check-filter {
    align-items: center;
    display: inline-flex;
    gap: 7px;
    min-height: 42px;
    white-space: nowrap;
}

.report-check-filter input {
    height: 16px;
    width: 16px;
}

.inventory-filter-bar {
    grid-template-columns: minmax(220px, 1fr) minmax(160px, .45fr) auto auto;
}

.inventory-opening-stock-filter-bar {
    grid-template-columns: minmax(230px, 1fr) minmax(160px, .45fr) auto auto;
}

.asset-filter-bar {
    grid-template-columns: minmax(230px, 1fr) minmax(145px, .45fr) auto auto;
}

.payroll-filter-bar {
    grid-template-columns: minmax(230px, 1fr) auto;
}

.employee-filter-bar {
    grid-template-columns: minmax(230px, 1fr) auto;
}

.attendance-filter-bar {
    grid-template-columns: minmax(230px, 1fr) auto;
}

.leave-approval-filter-bar {
    grid-template-columns: minmax(230px, 1fr) minmax(140px, .4fr) auto;
}

.payroll-run-filter-bar {
    grid-template-columns: minmax(230px, 1fr) auto;
}

.staff-payroll-filter-bar {
    grid-template-columns: minmax(230px, 1fr) auto auto;
}

.payroll-disbursement-filter-bar {
    grid-template-columns: minmax(260px, 1fr) minmax(140px, .35fr) auto;
}

.payroll-report-filter-bar {
    grid-template-columns: minmax(260px, 1fr) minmax(150px, .4fr) minmax(140px, .35fr) minmax(150px, .4fr) minmax(230px, 1fr) auto;
}

.payroll-report-attendance-filter-bar {
    grid-template-columns: minmax(145px, .35fr) minmax(145px, .35fr) minmax(150px, .4fr) minmax(190px, .55fr) minmax(120px, .3fr) minmax(230px, 1fr) auto;
}

.payroll-report-leave-filter-bar {
    grid-template-columns: minmax(145px, .35fr) minmax(145px, .35fr) minmax(150px, .35fr) minmax(190px, .55fr) minmax(170px, .45fr) minmax(130px, .35fr) minmax(230px, 1fr) auto;
}

.payroll-report-loan-filter-bar {
    grid-template-columns: minmax(145px, .35fr) minmax(145px, .35fr) minmax(150px, .35fr) minmax(145px, .35fr) minmax(145px, .35fr) minmax(230px, .75fr) minmax(230px, 1fr) auto;
}

.loan-advance-filter-bar {
    grid-template-columns: minmax(240px, 1fr) auto;
}

.inventory-purchase-filter-bar {
    grid-template-columns: minmax(145px, .35fr) minmax(145px, .35fr) minmax(230px, 1fr) auto;
}

.inventory-issue-filter-bar,
.inventory-wastage-filter-bar,
.inventory-adjustment-filter-bar {
    grid-template-columns: minmax(145px, .35fr) minmax(145px, .35fr) minmax(230px, 1fr) auto;
}

.inventory-report-filter-bar {
    grid-template-columns: minmax(145px, .35fr) minmax(170px, .45fr) minmax(150px, .4fr) minmax(250px, 1fr) auto auto auto;
}

.inventory-ledger-filter-bar {
    grid-template-columns: minmax(145px, .35fr) minmax(145px, .35fr) minmax(170px, .45fr) minmax(220px, .65fr) minmax(155px, .4fr) minmax(250px, 1fr) auto auto;
}

.asset-register-filter-bar {
    grid-template-columns: minmax(145px, .32fr) minmax(145px, .32fr) minmax(170px, .42fr) minmax(170px, .42fr) minmax(170px, .42fr) minmax(145px, .35fr) minmax(180px, .48fr) minmax(240px, 1fr) auto auto;
}

.table-wrap {
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    max-width: 100%;
    min-width: 0;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable both-edges;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x pan-y;
}

.staff-payroll-selected-staff,
.staff-attendance-summary,
.staff-payroll-summary {
    background: #f7f9fc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    display: grid;
    gap: 10px;
    padding: 12px;
}

.staff-payroll-selected-staff {
    grid-template-columns: minmax(0, 1fr);
}

.staff-attendance-summary,
.staff-payroll-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 16px;
}

.staff-payroll-selected-staff span,
.staff-attendance-summary span,
.staff-payroll-summary span {
    color: #65758b;
    display: block;
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
}

.staff-payroll-selected-staff strong,
.staff-attendance-summary strong,
.staff-payroll-summary strong {
    color: #263242;
    display: block;
    font-size: .95rem;
    overflow-wrap: anywhere;
}

.staff-payroll-component-heading,
.staff-generate-payroll-form {
    margin-top: 18px;
}

.staff-payroll-table-actions {
    margin-top: 14px;
}

.staff-attendance-wrap {
    max-height: 68vh;
}

.staff-payroll-staff-table {
    min-width: 1160px;
}

.staff-attendance-table {
    min-width: 820px;
}

.staff-payroll-line-table {
    min-width: 1260px;
}

.data-table {
    border-collapse: collapse;
    margin: 0;
    min-width: 760px;
    width: 100%;
}

.rooms-table {
    min-width: 920px;
}

.room-status-table {
    min-width: 1080px;
}

.housekeeping-table {
    min-width: 1320px;
}

.maintenance-table {
    min-width: 1420px;
}

.room-allocation-inhouse-table {
    min-width: 760px;
}

.room-allocation-assigned-table {
    min-width: 620px;
}

.room-allocation-available-table {
    min-width: 760px;
}

.day-closing-table {
    min-width: 840px;
}

.night-audit-table {
    min-width: 1120px;
}

.pos-items-table {
    min-width: 900px;
}

.pos-tables-table {
    min-width: 560px;
}

.pos-waiters-table {
    min-width: 1040px;
}

.restaurant-order-table {
    min-width: 560px;
}

.restaurant-kot-table {
    min-width: 860px;
}

.kitchen-kot-table {
    min-width: 1080px;
}

.kitchen-kot-line-table {
    min-width: 460px;
}

.pos-audit-kot-table {
    min-width: 1260px;
}

.pos-audit-bill-table {
    min-width: 1180px;
}

.pos-audit-log-table {
    min-width: 980px;
}

.pos-report-table {
    min-width: 1120px;
}

.inventory-items-table {
    min-width: 1280px;
}

.inventory-category-table {
    min-width: 520px;
}

.asset-table {
    min-width: 1220px;
}

.inventory-purchase-table {
    min-width: 960px;
}

.inventory-purchase-line-table {
    min-width: 940px;
}

.inventory-issue-table,
.inventory-wastage-table,
.inventory-adjustment-table {
    min-width: 840px;
}

.inventory-issue-line-table,
.inventory-wastage-line-table,
.inventory-adjustment-line-table {
    min-width: 1040px;
}

.inventory-current-stock-table {
    min-width: 1540px;
}

.inventory-ledger-table {
    min-width: 1620px;
}

.asset-register-table {
    min-width: 1780px;
}

.asset-register-summary-table {
    min-width: 780px;
}

.payroll-simple-table {
    min-width: 560px;
}

.payroll-shift-table,
.payroll-leave-table,
.payroll-holiday-table,
.payroll-salary-table {
    min-width: 980px;
}

.employee-table {
    min-width: 1280px;
}

.employee-structure-table,
.employee-bank-table {
    min-width: 980px;
}

.attendance-table {
    min-width: 1220px;
}

.leave-application-table,
.leave-approval-table,
.overtime-table {
    min-width: 1080px;
}

.payroll-run-table {
    min-width: 1480px;
}

.payroll-run-history-table,
.payroll-run-detail-table,
.payroll-disbursement-table {
    min-width: 1120px;
}

.payroll-head-table {
    min-width: 520px;
}

.employee-salary-line-table {
    min-width: 920px;
}

.restaurant-menu-table {
    min-width: 520px;
}

.restaurant-bills-table {
    min-width: 620px;
}

.guests-table {
    min-width: 1080px;
}

.services-table {
    min-width: 940px;
}

.partners-table {
    min-width: 1080px;
}

.reservations-table {
    min-width: 1280px;
}

.checkins-table {
    min-width: 980px;
}

.checkin-arrivals-table {
    min-width: 760px;
}

.checkout-inhouse-table {
    min-width: 780px;
}

.checkout-history-table {
    min-width: 680px;
}

.stay-extension-inhouse-table {
    min-width: 780px;
}

.stay-extension-history-table {
    min-width: 680px;
}

.folio-list-table {
    min-width: 900px;
}

.folio-charge-table,
.folio-payment-table {
    min-width: 980px;
}

.invoice-list-table {
    min-width: 900px;
}

.invoice-line-table {
    min-width: 980px;
}

.invoice-payment-table {
    min-width: 760px;
}

.rateplans-table {
    min-width: 760px;
}

.rateplan-tariffs-table {
    min-width: 1040px;
}

.reservation-line-table {
    min-width: 560px;
}

.checkin-room-table {
    min-width: 620px;
}

.checkin-guest-table {
    min-width: 1180px;
}

.line-toolbar {
    align-items: center;
    color: #52627a;
    display: flex;
    flex-wrap: wrap;
    font-size: .86rem;
    font-weight: 700;
    gap: 10px;
    justify-content: space-between;
}

.checkout-room-table {
    min-width: 620px;
}

.line-editor-wrap {
    max-height: 390px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x pan-y;
}

.compact-table-wrap {
    max-height: 320px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x pan-y;
}

.numeric-input {
    min-width: 92px;
}

.reservation-meta,
.reservation-totals {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    color: #39485d;
    display: flex;
    flex-wrap: wrap;
    font-size: .9rem;
    font-weight: 700;
    gap: 14px;
    padding: 10px 12px;
}

.online-request-heading {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.online-request-heading span {
    color: #607086;
    font-size: .86rem;
    font-weight: 700;
}

.online-request-wrap {
    margin-bottom: 18px;
    max-height: 360px;
}

.online-request-table {
    min-width: 1180px;
}

.online-request-table td strong,
.online-request-table td small {
    display: block;
}

.online-request-table td small {
    color: #607086;
    font-size: .78rem;
    margin-top: 3px;
}

.online-request-actions {
    align-items: center;
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    min-width: 160px;
}

.online-request-actions form {
    margin: 0;
}

.online-request-empty {
    border-bottom: 1px solid #e4ebf2;
    margin-bottom: 18px;
    padding-bottom: 18px;
}

.checkout-meta {
    align-items: flex-start;
}

.folio-meta {
    align-items: flex-start;
}

.invoice-meta {
    align-items: flex-start;
}

.folio-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.invoice-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

.invoice-total-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 14px;
}

.invoice-total-grid div {
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    padding: 10px 12px;
}

.invoice-total-grid span,
.invoice-total-grid strong {
    display: block;
}

.invoice-total-grid span {
    color: #607086;
    font-size: .82rem;
    font-weight: 700;
    text-transform: uppercase;
}

.invoice-total-grid strong {
    color: #263242;
    font-size: 1rem;
    margin-top: 3px;
}

.folio-entry-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.compact-form {
    gap: 12px;
}

.inline-form {
    margin: 0;
}

.empty-note,
.empty-cell {
    color: #607086;
    font-weight: 600;
}

.empty-cell {
    text-align: center;
}

.table-subtext {
    color: #607086;
    display: block;
    font-size: .82rem;
    margin-top: 2px;
}

.print-invoice {
    max-width: 920px;
    margin: 0 auto;
}

.print-toolbar {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-bottom: 14px;
}

.invoice-paper {
    background: #ffffff;
    border: 1px solid #d9e1ea;
    border-radius: 8px;
    color: #172033;
    padding: 30px;
}

.invoice-print-header {
    border-bottom: 2px solid #172033;
    margin-bottom: 20px;
    padding-bottom: 14px;
    text-align: center;
}

.invoice-print-header h1 {
    font-size: 1.6rem;
    font-weight: 800;
    letter-spacing: 0;
    margin: 0;
}

.invoice-print-header p {
    margin: 4px 0 0;
}

.invoice-print-meta {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 20px;
}

.invoice-print-meta strong,
.invoice-print-meta span,
.invoice-print-totals span,
.invoice-print-totals strong {
    display: block;
}

.invoice-print-meta strong {
    margin-bottom: 5px;
}

.invoice-print-table {
    border-collapse: collapse;
    width: 100%;
}

.invoice-print-table th,
.invoice-print-table td {
    border-bottom: 1px solid #d9e1ea;
    padding: 9px 8px;
}

.invoice-print-table th {
    background: #f8fafc;
    font-size: .82rem;
    text-transform: uppercase;
}

.invoice-print-table td span {
    color: #607086;
    display: block;
    font-size: .84rem;
}

.invoice-print-totals {
    display: grid;
    gap: 6px;
    justify-content: end;
    margin-top: 18px;
}

.invoice-print-totals div {
    display: grid;
    gap: 30px;
    grid-template-columns: 110px 110px;
}

.invoice-print-footer {
    border-top: 1px solid #d9e1ea;
    display: flex;
    justify-content: space-between;
    margin-top: 34px;
    padding-top: 16px;
}

.hotel-profile-media-panel {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.image-upload-block {
    border-bottom: 1px solid #e4ebf2;
    display: grid;
    gap: 12px;
    padding-bottom: 18px;
}

.profile-image-preview {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    color: #607086;
    display: flex;
    font-weight: 700;
    justify-content: center;
    overflow: hidden;
}

.profile-image-preview img {
    height: 100%;
    object-fit: contain;
    width: 100%;
}

.profile-logo-preview {
    aspect-ratio: 2 / 1;
}

.profile-qr-preview {
    aspect-ratio: 1 / 1;
    max-height: 330px;
}

.profile-summary {
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    color: #607086;
    display: grid;
    gap: 4px;
    padding: 12px;
}

.profile-summary strong {
    color: #263242;
    font-size: 1rem;
}

.rateplan-include-row {
    align-content: center;
    align-self: end;
    min-height: 42px;
}

.room-status-shell {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(360px, 430px) minmax(0, 1fr);
}

.room-status-summary {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 16px;
}

.room-status-summary div {
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    padding: 10px 12px;
}

.payroll-settings-summary {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.payroll-settings-summary div {
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    padding: 10px 12px;
}

.payroll-settings-summary span,
.payroll-settings-summary strong {
    display: block;
}

.payroll-settings-summary span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.payroll-settings-summary strong {
    color: #263242;
    font-size: 1.05rem;
}

.payroll-run-summary,
.loan-advance-summary {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    margin-bottom: 14px;
}

.payroll-run-summary div,
.loan-advance-summary div {
    background: #f7f9fc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    padding: 10px 12px;
}

.payroll-run-summary span,
.payroll-run-summary strong,
.loan-advance-summary span,
.loan-advance-summary strong {
    display: block;
}

.payroll-run-summary span,
.loan-advance-summary span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.payroll-run-summary strong,
.loan-advance-summary strong {
    color: #263242;
    font-size: 1.05rem;
}

.compact-summary {
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
}

.payroll-run-save-form {
    border-top: 1px solid #e4ebf2;
    margin-top: 12px;
    padding-top: 12px;
}

.payroll-head-wrap {
    margin-top: 14px;
}

.payroll-history-detail-wrap {
    max-height: 360px;
}

.payslip-preview {
    background: #ffffff;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    padding: 18px;
}

.payslip-preview h2 {
    font-size: 1.15rem;
    font-weight: 800;
    letter-spacing: 0;
    margin: 0 0 14px;
}

.payslip-meta {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 16px;
}

.payslip-meta span {
    background: #f7f9fc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    color: #40516a;
    padding: 8px 10px;
}

.payroll-disbursement-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.payroll-disbursement-hidden-check {
    display: none;
}

.room-status-summary span,
.room-status-summary strong {
    display: block;
}

.room-status-summary span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
}

.room-status-summary strong {
    color: #263242;
    font-size: 1.1rem;
}

.room-status-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.room-status-toggle-row {
    align-self: end;
    min-height: 42px;
}

.room-status-pill {
    display: inline-block;
}

.housekeeping-editor-meta {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.housekeeping-editor-meta div,
.housekeeping-summary div {
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    padding: 10px 12px;
}

.housekeeping-editor-meta span,
.housekeeping-editor-meta strong,
.housekeeping-summary span,
.housekeeping-summary strong {
    display: block;
}

.housekeeping-editor-meta span,
.housekeeping-summary span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.housekeeping-editor-meta strong,
.housekeeping-summary strong {
    color: #263242;
    font-size: 1.05rem;
}

.housekeeping-due-row {
    align-items: center;
    display: grid;
    gap: 10px;
    grid-template-columns: auto minmax(0, 1fr);
}

.housekeeping-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.housekeeping-summary {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.housekeeping-status-pill {
    display: inline-block;
}

.maintenance-editor-meta {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.maintenance-editor-meta div,
.maintenance-summary div {
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    padding: 10px 12px;
}

.maintenance-editor-meta span,
.maintenance-editor-meta strong,
.maintenance-summary span,
.maintenance-summary strong {
    display: block;
}

.maintenance-editor-meta span,
.maintenance-summary span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.maintenance-editor-meta strong,
.maintenance-summary strong {
    color: #263242;
    font-size: 1.05rem;
}

.maintenance-ooo-row {
    align-items: center;
    display: grid;
    gap: 10px;
    grid-template-columns: auto auto minmax(0, 1fr);
}

.maintenance-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.maintenance-summary {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.maintenance-status-pill {
    display: inline-block;
}

.room-allocation-inhouse-wrap {
    max-height: 330px;
}

.room-allocation-selected,
.room-allocation-action-state {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.room-allocation-action-state {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.room-allocation-selected div,
.room-allocation-action-state div {
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    padding: 10px 12px;
}

.room-allocation-selected span,
.room-allocation-selected strong,
.room-allocation-action-state span,
.room-allocation-action-state strong {
    display: block;
}

.room-allocation-selected span,
.room-allocation-action-state span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.room-allocation-selected strong,
.room-allocation-action-state strong {
    color: #263242;
    font-size: 1.05rem;
}

.room-allocation-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.room-allocation-status-pill {
    display: inline-block;
}

.restaurant-session-summary {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.restaurant-session-summary div {
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    padding: 10px 12px;
}

.restaurant-session-summary span,
.restaurant-session-summary strong {
    display: block;
}

.restaurant-session-summary span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.restaurant-session-summary strong {
    color: #263242;
    font-size: 1.05rem;
}

.restaurant-menu-wrap {
    max-height: 320px;
}

.kitchen-kot-heading {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: space-between;
}

.kitchen-kot-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.kitchen-kot-stats span {
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 999px;
    color: #607086;
    font-size: .82rem;
    font-weight: 700;
    padding: 6px 10px;
}

.kitchen-kot-stats strong {
    color: #263242;
}

.kitchen-kot-ticket-meta {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 14px;
}

.kitchen-kot-ticket-meta div {
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    padding: 10px 12px;
}

.kitchen-kot-ticket-meta span,
.kitchen-kot-ticket-meta strong {
    display: block;
}

.kitchen-kot-ticket-meta span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.kitchen-kot-ticket-meta strong {
    color: #263242;
    font-size: 1.05rem;
}

.kitchen-kot-line-wrap {
    max-height: 360px;
}

.kitchen-kot-actions {
    display: grid;
    gap: 12px;
}

.kitchen-kot-action-form {
    margin: 0;
}

.empty-panel-text {
    color: #607086;
    font-weight: 600;
    margin: 0;
}

.pos-audit-summary {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 18px;
}

.pos-audit-summary div {
    background: #ffffff;
    border: 1px solid #d9e1ea;
    border-radius: 8px;
    padding: 12px 14px;
}

.pos-audit-summary span,
.pos-audit-summary strong {
    display: block;
}

.pos-audit-summary span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.pos-audit-summary strong {
    color: #263242;
    font-size: 1.35rem;
    margin-top: 4px;
}

.pos-audit-row-action {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(170px, 1fr) auto;
    margin: 0;
    min-width: 260px;
}

.pos-audit-log-panel {
    margin-top: 18px;
}

.pos-folio-summary {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 18px;
}

.pos-folio-summary div {
    background: #ffffff;
    border: 1px solid #d9e1ea;
    border-radius: 8px;
    padding: 12px 14px;
}

.pos-folio-summary span,
.pos-folio-summary strong {
    display: block;
}

.pos-folio-summary span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.pos-folio-summary strong {
    color: #263242;
    font-size: 1.35rem;
    margin-top: 4px;
}

.pos-folio-table .select-cell {
    text-align: center;
    width: 52px;
}

.pos-report-summary,
.hotel-report-summary,
.payroll-report-summary {
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(210px, 1fr) minmax(260px, 1fr) minmax(140px, .45fr) minmax(150px, .45fr);
    margin-bottom: 18px;
}

.inventory-report-summary {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.inventory-dashboard-metrics {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    margin-bottom: 18px;
}

.inventory-dashboard-metrics article {
    background: #ffffff;
    border: 1px solid #d9e1ea;
    border-radius: 8px;
    min-height: 118px;
    padding: 14px;
}

.inventory-dashboard-metrics span,
.inventory-dashboard-metrics strong,
.inventory-dashboard-metrics small {
    display: block;
}

.inventory-dashboard-metrics span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.inventory-dashboard-metrics strong {
    color: #111827;
    font-size: 1.45rem;
    line-height: 1.2;
    margin-top: 10px;
}

.inventory-dashboard-metrics small {
    color: #6b7280;
    margin-top: 6px;
}

.inventory-dashboard-low-table {
    min-width: 760px;
}

.inventory-dashboard-movement-table {
    min-width: 1320px;
}

.pos-report-summary div,
.hotel-report-summary div,
.payroll-report-summary div {
    background: #ffffff;
    border: 1px solid #d9e1ea;
    border-radius: 8px;
    padding: 12px 14px;
}

.pos-report-summary span,
.pos-report-summary strong,
.hotel-report-summary span,
.hotel-report-summary strong,
.payroll-report-summary span,
.payroll-report-summary strong {
    display: block;
}

.pos-report-summary span,
.hotel-report-summary span,
.payroll-report-summary span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.pos-report-summary strong,
.hotel-report-summary strong,
.payroll-report-summary strong {
    color: #263242;
    font-size: 1.05rem;
    margin-top: 4px;
}

.pos-report-panel,
.hotel-report-panel,
.payroll-report-panel {
    margin-bottom: 18px;
}

.inventory-purchase-line-wrap {
    max-height: 420px;
}

.employee-salary-line-wrap {
    max-height: 420px;
}

.inventory-issue-line-wrap,
.inventory-wastage-line-wrap,
.inventory-adjustment-line-wrap {
    max-height: 420px;
}

.inventory-purchase-totals {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.asset-value-summary {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.inventory-issue-totals,
.inventory-wastage-totals,
.inventory-adjustment-totals,
.inventory-opening-stock-totals {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.inventory-opening-stock-totals {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.inventory-adjustment-totals {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.inventory-purchase-totals div,
.asset-value-summary div,
.inventory-issue-totals div,
.inventory-wastage-totals div,
.inventory-adjustment-totals div,
.inventory-opening-stock-totals div {
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    padding: 10px 12px;
}

.inventory-purchase-totals span,
.inventory-purchase-totals strong,
.inventory-purchase-totals label,
.asset-value-summary span,
.asset-value-summary strong,
.inventory-issue-totals span,
.inventory-issue-totals strong,
.inventory-wastage-totals span,
.inventory-wastage-totals strong,
.inventory-adjustment-totals span,
.inventory-adjustment-totals strong,
.inventory-opening-stock-totals span,
.inventory-opening-stock-totals strong {
    display: block;
}

.inventory-purchase-totals span,
.inventory-purchase-totals label,
.asset-value-summary span,
.inventory-issue-totals span,
.inventory-wastage-totals span,
.inventory-adjustment-totals span,
.inventory-opening-stock-totals span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.inventory-purchase-totals strong,
.asset-value-summary strong,
.inventory-issue-totals strong,
.inventory-wastage-totals strong,
.inventory-adjustment-totals strong,
.inventory-opening-stock-totals strong {
    color: #263242;
    font-size: 1.05rem;
}

.allocation-selected-row {
    background: #edf6ff;
}

.allocation-selected-row td {
    border-top-color: #bfd7f0;
}

.selected-row {
    background: #edf6ff;
}

.selected-row td {
    border-top-color: #bfd7f0;
}

.day-closing-status {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.day-closing-status div {
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    padding: 10px 12px;
}

.day-closing-status span,
.day-closing-status strong {
    display: block;
}

.day-closing-status span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.day-closing-status strong {
    color: #263242;
    font-size: 1.05rem;
}

.day-closing-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.night-audit-job,
.night-audit-summary {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.night-audit-job div,
.night-audit-summary div {
    background: #f8fafc;
    border: 1px solid #e4ebf2;
    border-radius: 8px;
    padding: 10px 12px;
}

.night-audit-job span,
.night-audit-job strong,
.night-audit-summary span,
.night-audit-summary strong {
    display: block;
}

.night-audit-job span,
.night-audit-summary span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.night-audit-job strong,
.night-audit-summary strong {
    color: #263242;
    font-size: 1.05rem;
}

.night-audit-job div:last-child,
.night-audit-summary div:last-child {
    grid-column: 1 / -1;
}

.night-audit-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.document-panel {
    border-top: 1px solid #e4ebf2;
    margin-top: 18px;
    padding-top: 18px;
}

.document-upload {
    display: grid;
    gap: 12px;
    margin-bottom: 14px;
}

.document-table {
    min-width: 780px;
}

.document-actions {
    align-items: center;
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    width: 150px;
}

.document-actions form {
    margin: 0;
}

.data-table th {
    background: #f8fafc;
    color: #39485d;
    font-size: .82rem;
    font-weight: 800;
    padding: 11px 12px;
    text-transform: uppercase;
}

.data-table td {
    border-top: 1px solid #e4ebf2;
    color: #263242;
    padding: 11px 12px;
    vertical-align: middle;
}

.data-table tbody tr:hover {
    background: #f8fbff;
}

.numeric {
    text-align: right;
}

.action-cell {
    text-align: right;
    width: 86px;
}

.table-count {
    color: #607086;
    font-size: .88rem;
    margin: 10px 0 0;
}

@media (max-width: 720px) {
    .app-shell {
        padding: 18px;
        max-width: 100%;
        overflow-x: hidden;
    }

    .dashboard-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .header-meta {
        justify-content: flex-start;
    }

    .module-row {
        grid-template-columns: 1fr;
    }

    .module-status {
        justify-self: start;
    }

    .dashboard-overview-grid {
        grid-template-areas:
            "rooms"
            "revenue"
            "status";
        grid-template-columns: 1fr;
    }

    .dashboard-panel .panel-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-panel .panel-heading span {
        text-align: left;
    }

    .dashboard-room-grid {
        max-height: none;
    }

    .dashboard-revenue-chart {
        gap: 5px;
        min-height: 210px;
    }

    .dashboard-revenue-day {
        grid-template-rows: 158px 32px;
    }

    .dashboard-revenue-track {
        height: 158px;
    }

    .page-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .master-grid,
    .guest-master-grid,
    .partner-master-grid,
    .reservation-master-grid,
    .checkin-master-grid,
    .checkout-master-grid,
    .stay-extension-master-grid,
    .folio-master-grid,
    .invoice-master-grid,
    .hotel-profile-grid,
    .rateplan-master-grid,
    .housekeeping-master-grid,
    .maintenance-master-grid,
    .room-allocation-grid,
    .day-closing-grid,
    .night-audit-grid,
    .pos-setup-grid,
    .pos-waiter-grid,
    .pos-printer-grid,
    .inventory-master-grid,
    .inventory-opening-stock-grid,
    .inventory-dashboard-grid,
    .inventory-category-grid,
    .inventory-supplier-grid,
    .inventory-department-grid,
    .asset-master-grid,
    .payroll-master-grid,
    .payroll-settings-grid,
    .employee-setup-grid,
    .employee-salary-grid,
    .attendance-leave-grid,
    .attendance-import-grid,
    .leave-approval-grid,
    .payroll-run-process-grid,
    .payroll-run-history-grid,
    .payroll-run-sheet-grid,
    .payroll-run-payslip-grid,
    .payroll-run-disbursement-grid,
    .staff-payroll-grid,
    .staff-attendance-grid,
    .staff-payroll-run-grid,
    .loan-advance-entry-grid,
    .loan-advance-report-grid,
    .inventory-purchase-grid,
    .inventory-issue-grid,
    .inventory-wastage-grid,
    .inventory-adjustment-grid,
    .restaurant-pos-shell,
    .kitchen-kot-shell,
    .pos-audit-grid,
    .room-status-shell,
    .folio-entry-grid,
    .invoice-total-grid,
    .invoice-print-meta,
    .form-row,
    .tax-rate-grid,
    .filter-bar,
    .room-filter-bar,
    .room-status-filter-bar,
    .housekeeping-filter-bar,
    .maintenance-filter-bar,
    .room-allocation-filter-bar,
    .guest-filter-bar,
    .service-filter-bar,
    .partner-filter-bar,
    .reservation-filter-bar,
    .checkin-filter-bar,
    .checkin-arrival-filter-bar,
    .checkout-filter-bar,
    .folio-filter-bar,
    .folio-void-filter-bar,
    .invoice-filter-bar,
    .pos-setup-filter-bar,
    .restaurant-pos-filter-bar,
    .kitchen-kot-filter-bar,
    .pos-audit-filter-bar,
    .pos-folio-filter-bar,
    .pos-report-filter-bar,
    .hotel-report-filter-bar,
    .inventory-filter-bar,
    .inventory-opening-stock-filter-bar,
    .asset-filter-bar,
    .payroll-filter-bar,
    .employee-filter-bar,
    .attendance-filter-bar,
    .leave-approval-filter-bar,
    .payroll-run-filter-bar,
    .staff-payroll-filter-bar,
    .payroll-disbursement-filter-bar,
    .payroll-report-filter-bar,
    .payroll-report-attendance-filter-bar,
    .payroll-report-leave-filter-bar,
    .payroll-report-loan-filter-bar,
    .loan-advance-filter-bar,
    .inventory-purchase-filter-bar,
    .inventory-issue-filter-bar,
    .inventory-wastage-filter-bar,
    .inventory-adjustment-filter-bar,
    .inventory-report-filter-bar,
    .inventory-ledger-filter-bar,
    .asset-register-filter-bar,
    .pos-audit-summary,
    .pos-folio-summary,
    .pos-report-summary,
    .hotel-report-summary,
    .payroll-report-summary,
    .inventory-purchase-totals,
    .asset-value-summary,
    .payroll-settings-summary,
    .inventory-issue-totals,
    .inventory-wastage-totals,
    .inventory-adjustment-totals,
    .inventory-opening-stock-totals,
    .inventory-dashboard-metrics,
    .dashboard-operational-metrics,
    .inventory-report-summary {
        grid-template-columns: 1fr;
    }

    .rateplan-filter-bar {
        grid-template-columns: 1fr;
    }

    .document-actions {
        justify-content: flex-start;
    }

    .table-wrap,
    .line-editor-wrap,
    .compact-table-wrap {
        max-width: 100%;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        touch-action: pan-x pan-y;
    }

    .line-editor-wrap,
    .compact-table-wrap {
        max-height: 68dvh;
    }

    .data-table input,
    .data-table select,
    .data-table textarea {
        min-height: 34px;
        touch-action: manipulation;
    }
}

@media print {
    @page {
        margin: 10mm;
    }

    .app-navbar,
    .print-toolbar,
    .filter-bar,
    .header-actions {
        display: none;
    }

    .app-shell {
        padding: 0;
    }

    .invoice-paper {
        border: 0;
        border-radius: 0;
        padding: 0;
    }

    .invoice-print-header {
        margin-bottom: 12px;
        padding-bottom: 8px;
    }

    .invoice-print-header h1 {
        font-size: 1.35rem;
    }

    .invoice-print-meta {
        font-size: .86rem;
        gap: 10px 16px;
        line-height: 1.35;
        margin-bottom: 12px;
    }

    .invoice-print-meta strong {
        margin-bottom: 2px;
    }

    .invoice-print-table th,
    .invoice-print-table td {
        font-size: .82rem;
        line-height: 1.25;
        padding: 5px 7px;
    }

    .invoice-print-table td span {
        font-size: .76rem;
    }

    .invoice-print-totals {
        font-size: .86rem;
        gap: 3px;
        margin-top: 10px;
        break-inside: avoid;
    }

    .invoice-print-footer {
        font-size: .82rem;
        margin-top: 16px;
        padding-top: 8px;
        break-inside: avoid;
    }
}

/* Management app UI refresh */
.app-body {
    --app-bg: #eef3f8;
    --app-surface: #ffffff;
    --app-surface-soft: #f8fafc;
    --app-border: #d8e2ee;
    --app-border-strong: #c3d0df;
    --app-text: #111827;
    --app-muted: #5f6f84;
    --app-muted-strong: #40516a;
    --app-primary: #2563eb;
    --app-primary-dark: #1d4ed8;
    --app-success: #15803d;
    --app-warning: #b45309;
    --app-danger: #be123c;
    --app-shadow-sm: 0 1px 2px rgba(15, 23, 42, .05);
    --app-shadow-md: 0 14px 34px rgba(15, 23, 42, .08);
    background:
        linear-gradient(180deg, #f7fafc 0, var(--app-bg) 280px);
    color: var(--app-text);
    font-family: "Segoe UI", Arial, sans-serif;
    min-width: 320px;
}

.app-body .app-navbar {
    background: rgba(255, 255, 255, .97);
    border-bottom: 1px solid var(--app-border);
    box-shadow: 0 1px 0 rgba(15, 23, 42, .03);
    min-height: 62px;
    position: sticky;
    top: 0;
    z-index: 1040;
}

.app-body .app-nav-container {
    gap: 12px;
    margin: 0 auto;
    max-width: 1500px;
    padding-left: 24px;
    padding-right: 24px;
}

.app-body .app-brand {
    align-items: center;
    color: var(--app-text);
    display: inline-flex;
    font-size: 1.02rem;
    font-weight: 800;
    gap: 10px;
    letter-spacing: 0;
    margin-right: 18px;
    min-height: 42px;
    white-space: nowrap;
}

.app-body .app-brand-mark {
    background: var(--app-primary);
    border-radius: 8px;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .25);
    display: inline-block;
    height: 26px;
    position: relative;
    width: 26px;
}

.app-body .app-brand-mark::before,
.app-body .app-brand-mark::after {
    background: #ffffff;
    border-radius: 2px;
    content: "";
    position: absolute;
}

.app-body .app-brand-mark::before {
    height: 13px;
    left: 7px;
    top: 6px;
    width: 4px;
}

.app-body .app-brand-mark::after {
    height: 4px;
    left: 7px;
    top: 11px;
    width: 12px;
}

.app-body .app-main-nav {
    gap: 4px;
}

.app-body .app-navbar .nav-link {
    border-radius: 6px;
    color: #243246;
    font-size: .9rem;
    font-weight: 700;
    line-height: 1.2;
    min-height: 38px;
    padding: 10px 9px;
}

.app-body .app-navbar .nav-link:hover,
.app-body .app-navbar .nav-link:focus,
.app-body .app-navbar .nav-link.active,
.app-body .app-navbar .dropdown.show > .nav-link {
    background: #edf4ff;
    color: var(--app-primary-dark);
}

.app-body .app-navbar .dropdown-menu {
    border: 1px solid var(--app-border);
    border-radius: 8px;
    box-shadow: var(--app-shadow-md);
    min-width: 272px;
    padding: 8px;
}

.app-body .dropdown-item {
    border-radius: 6px;
    color: #243246;
    font-size: .9rem;
    min-height: 34px;
    padding: 8px 10px;
}

.app-body .dropdown-item:hover,
.app-body .dropdown-item:focus,
.app-body .dropdown-item.active {
    background: #edf4ff;
    color: var(--app-primary-dark);
}

.app-body .dropdown-divider {
    border-top-color: #e6edf5;
    margin: 6px 0;
}

.app-body .app-userbar {
    align-items: center;
    border-left: 1px solid #e6edf5;
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    margin-left: 10px;
    padding-left: 14px;
}

.app-body .app-userchip {
    background: #f3f6fa;
    border: 1px solid var(--app-border);
    border-radius: 999px;
    color: var(--app-muted-strong);
    font-size: .82rem;
    font-weight: 800;
    max-width: 150px;
    overflow: hidden;
    padding: 6px 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-body .app-logout-btn {
    border-color: var(--app-border-strong);
    border-radius: 6px;
    color: var(--app-muted-strong);
    font-weight: 800;
    min-height: 34px;
}

.app-body .navbar-toggler {
    border-color: var(--app-border-strong);
    border-radius: 8px;
    min-height: 38px;
    min-width: 42px;
}

.app-body .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2836, 50, 70, 0.95%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.4' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.app-body .app-shell {
    max-width: 1500px;
    padding: 24px;
}

.app-body .dashboard-header,
.app-body .page-header {
    background: rgba(255, 255, 255, .72);
    border: 1px solid rgba(216, 226, 238, .85);
    border-radius: 8px;
    box-shadow: var(--app-shadow-sm);
    margin-bottom: 18px;
    padding: 16px 18px;
}

.app-body .dashboard-header h1,
.app-body .page-header h1 {
    color: var(--app-text);
    font-size: 1.55rem;
    line-height: 1.2;
}

.app-body .eyebrow {
    color: #64748b;
    font-size: .72rem;
    letter-spacing: .08em;
}

.app-body .header-meta span,
.app-body .status-pill,
.app-body .module-status {
    border-radius: 999px;
    font-weight: 800;
}

.app-body .metric-card,
.app-body .dashboard-operational-metrics article,
.app-body .dashboard-panel,
.app-body .master-panel,
.app-body .module-list {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    box-shadow: var(--app-shadow-sm);
}

.app-body .dashboard-panel,
.app-body .master-panel {
    padding: 20px;
}

.app-body .dashboard-operational-metrics,
.app-body .metric-grid {
    gap: 16px;
}

.app-body .dashboard-operational-metrics article,
.app-body .metric-card {
    border-top: 4px solid #d7e6ff;
    min-height: 118px;
    padding: 17px 18px;
}

.app-body .dashboard-operational-metrics article:nth-child(2n),
.app-body .metric-card:nth-child(2n) {
    border-top-color: #ccebd7;
}

.app-body .dashboard-operational-metrics article:nth-child(3n),
.app-body .metric-card:nth-child(3n) {
    border-top-color: #ffe0b5;
}

.app-body .dashboard-operational-metrics span,
.app-body .metric-card span {
    color: var(--app-muted);
    font-size: .82rem;
}

.app-body .dashboard-operational-metrics strong,
.app-body .metric-card strong {
    color: #0f172a;
    font-size: 1.82rem;
    margin-top: 10px;
}

.app-body .dashboard-operational-metrics small,
.app-body .metric-card small,
.app-body .module-row p {
    color: var(--app-muted);
    line-height: 1.45;
}

.app-body .panel-heading {
    border-bottom-color: #e7eef6;
    margin-bottom: 16px;
    padding-bottom: 12px;
}

.app-body .panel-heading h2,
.app-body .dashboard-panel .panel-heading h2 {
    color: #0f172a;
    font-size: 1rem;
}

.app-body .panel-heading span {
    color: var(--app-muted);
    font-weight: 700;
}

.app-body .dashboard-overview-grid {
    gap: 18px;
    grid-template-columns: minmax(0, 1.28fr) minmax(340px, .72fr);
}

.app-body .dashboard-room-grid {
    gap: 12px;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    max-height: 430px;
}

.app-body .dashboard-room-tile {
    border-radius: 8px;
    min-height: 118px;
    padding: 13px 14px;
}

.app-body .dashboard-room-tile strong {
    font-size: 1.28rem;
}

.app-body .dashboard-room-tile span {
    font-size: .72rem;
    letter-spacing: .04em;
}

.app-body .dashboard-revenue-track,
.app-body .dashboard-status-row i {
    background: #edf3f9;
}

.app-body .dashboard-revenue-track span {
    background: var(--app-primary);
}

.app-body .dashboard-status-row b {
    background: var(--app-success);
}

.app-body .master-grid {
    gap: 20px;
}

.app-body .section-tabs {
    background: rgba(255, 255, 255, .7);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    padding: 8px;
}

.app-body .section-tabs a {
    border-radius: 6px;
    min-height: 38px;
}

.app-body .form-section-title {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #e7eef6;
    border-left: 4px solid var(--app-primary);
    border-radius: 8px;
    color: #1e293b;
    display: flex;
    font-size: .78rem;
    min-height: 38px;
    padding: 9px 12px;
}

.app-body .form-section-title:first-of-type {
    border-top: 1px solid #e7eef6;
    margin-top: 0;
    padding-top: 9px;
}

.app-body .form-field label,
.app-body .booking-panel label {
    color: #334155;
    font-size: .82rem;
    font-weight: 800;
}

.app-body .form-control,
.app-body .form-select {
    background-color: #ffffff;
    border-color: var(--app-border-strong);
    border-radius: 6px;
    color: #142033;
    min-height: 40px;
}

.app-body textarea.form-control {
    min-height: 88px;
}

.app-body .form-control:hover,
.app-body .form-select:hover {
    border-color: #9fb2c8;
}

.app-body .form-control:focus,
.app-body .form-select:focus {
    border-color: var(--app-primary);
    box-shadow: 0 0 0 .2rem rgba(37, 99, 235, .14);
}

.app-body .btn {
    border-radius: 6px;
    font-weight: 800;
}

.app-body .btn-primary {
    background: var(--app-primary);
    border-color: var(--app-primary);
}

.app-body .btn-primary:hover,
.app-body .btn-primary:focus {
    background: var(--app-primary-dark);
    border-color: var(--app-primary-dark);
}

.app-body .master-grid > .master-panel > .master-form > button[type="submit"].btn-primary,
.app-body .master-grid > .master-panel > .master-form > .btn-primary.w-100 {
    box-shadow: 0 12px 26px rgba(37, 99, 235, .2);
    min-height: 44px;
    position: sticky;
    bottom: 12px;
    z-index: 20;
}

.app-body .restaurant-pos-shell .master-form > button[type="submit"].btn-primary,
.app-body .restaurant-pos-shell .master-form > .btn-primary.w-100,
.app-body .kitchen-kot-shell .master-form > button[type="submit"].btn-primary,
.app-body .kitchen-kot-shell .master-form > .btn-primary.w-100,
.app-body .compact-form > button[type="submit"].btn-primary,
.app-body .compact-form > .btn-primary.w-100 {
    box-shadow: none;
    position: static;
}

.app-body .filter-bar {
    background: #f8fafc;
    border: 1px solid #e3ebf4;
    border-radius: 8px;
    padding: 10px;
}

.app-body .table-wrap,
.app-body .line-editor-wrap,
.app-body .compact-table-wrap {
    border-color: var(--app-border);
    border-radius: 8px;
}

.app-body .data-table {
    color: #243246;
    font-size: .88rem;
}

.app-body .data-table thead th {
    background: #f5f8fb;
    border-bottom: 1px solid var(--app-border);
    color: #26364a;
    font-size: .76rem;
    letter-spacing: .02em;
    position: sticky;
    top: 0;
    z-index: 2;
}

.app-body .data-table tbody tr:hover {
    background: #f8fbff;
}

.app-body .data-table td,
.app-body .data-table th {
    vertical-align: middle;
}

.app-body .data-table .numeric,
.app-body .numeric {
    font-variant-numeric: tabular-nums;
}

.app-body .data-table input,
.app-body .data-table select,
.app-body .data-table textarea {
    border-color: var(--app-border-strong);
    border-radius: 6px;
}

.app-body .line-toolbar {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #e7eef6;
    border-radius: 8px;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    margin-bottom: 10px;
    padding: 10px 12px;
}

.app-body .line-toolbar span {
    color: var(--app-muted-strong);
    font-weight: 700;
}

.app-body .empty-cell {
    color: var(--app-muted);
    font-weight: 700;
    padding: 18px;
    text-align: center;
}

.app-body .dashboard-booking-actions .btn {
    min-width: 76px;
}

.app-body .restaurant-pos-shell,
.app-body .kitchen-kot-shell {
    align-items: start;
}

.app-body .restaurant-pos-side,
.app-body .kitchen-kot-side,
.app-body .workflow-side {
    position: sticky;
    top: 82px;
}

@media (max-width: 1190px) {
    .app-body .app-navbar .navbar-collapse {
        background: #ffffff;
        border: 1px solid var(--app-border);
        border-radius: 8px;
        box-shadow: var(--app-shadow-md);
        margin-top: 10px;
        padding: 10px;
    }

    .app-body .app-main-nav {
        gap: 2px;
    }

    .app-body .app-userbar {
        border-left: 0;
        border-top: 1px solid #e6edf5;
        flex-wrap: wrap;
        margin-left: 0;
        margin-top: 8px;
        padding-left: 0;
        padding-top: 10px;
    }
}

@media (max-width: 991px) {
    .app-body .app-nav-container {
        padding-left: 16px;
        padding-right: 16px;
    }

    .app-body .app-shell {
        padding: 16px;
    }

    .app-body .dashboard-header,
    .app-body .page-header {
        align-items: stretch;
        flex-direction: column;
    }

    .app-body .header-actions,
    .app-body .header-meta {
        justify-content: flex-start;
    }

    .app-body .dashboard-overview-grid {
        grid-template-areas:
            "rooms"
            "revenue"
            "status";
        grid-template-columns: 1fr;
    }

    .app-body .restaurant-pos-side,
    .app-body .kitchen-kot-side,
    .app-body .workflow-side {
        position: static;
    }
}

@media (max-width: 640px) {
    .app-body .app-shell {
        padding: 12px;
    }

    .app-body .dashboard-header,
    .app-body .page-header,
    .app-body .dashboard-panel,
    .app-body .master-panel {
        padding: 14px;
    }

    .app-body .dashboard-header h1,
    .app-body .page-header h1 {
        font-size: 1.35rem;
    }

    .app-body .dashboard-room-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-height: none;
    }

    .app-body .dashboard-room-tile {
        min-height: 104px;
        padding: 10px;
    }

    .app-body .line-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .app-body .master-grid > .master-panel > .master-form > button[type="submit"].btn-primary,
    .app-body .master-grid > .master-panel > .master-form > .btn-primary.w-100 {
        bottom: 8px;
    }
}

/* Public hotel website */
body.public-body {
    background: #f6f7f5;
    color: #18212f;
}

.public-body a {
    text-decoration: none;
}

.public-container {
    margin: 0 auto;
    max-width: 1180px;
    padding: 0 24px;
    width: 100%;
}

.public-site-header {
    background: rgba(255, 255, 255, .95);
    border-bottom: 1px solid rgba(24, 33, 47, .1);
    position: sticky;
    top: 0;
    z-index: 20;
}

.public-navbar {
    min-height: 70px;
    padding: 0;
}

.public-nav-inner {
    align-items: center;
    display: flex;
    min-height: 70px;
}

.public-brand {
    color: #102f32;
    display: inline-grid;
    font-weight: 800;
    line-height: 1;
    max-width: 260px;
    min-width: 0;
}

.public-brand span {
    font-size: 1.08rem;
    overflow-wrap: anywhere;
}

.public-brand small {
    color: #bd6c35;
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: 0;
    margin-top: 4px;
    text-transform: uppercase;
}

.public-toggler {
    border-color: rgba(16, 47, 50, .2);
    border-radius: 8px;
}

.public-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2816, 47, 50, 0.9%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.public-nav-links {
    align-items: center;
    gap: 2px;
}

.public-nav-links .nav-link {
    color: #243443;
    font-size: .95rem;
    font-weight: 700;
    padding: 10px 12px;
}

.public-nav-links .nav-link:hover,
.public-login-link:hover {
    color: #bd6c35;
}

.public-nav-actions {
    align-items: center;
    display: flex;
    gap: 12px;
    margin-left: 14px;
}

.public-login-link {
    color: #3c4f5f;
    font-size: .9rem;
    font-weight: 700;
}

.public-book-btn,
.public-primary-btn,
.public-secondary-btn {
    align-items: center;
    border-radius: 8px;
    display: inline-flex;
    font-weight: 800;
    justify-content: center;
    min-height: 44px;
    padding: 10px 18px;
}

.public-book-btn,
.public-primary-btn {
    background: #bd6c35;
    border-color: #bd6c35;
    color: #ffffff;
}

.public-book-btn:hover,
.public-primary-btn:hover {
    background: #9e5527;
    border-color: #9e5527;
    color: #ffffff;
}

.public-secondary-btn {
    background: rgba(255, 255, 255, .14);
    border-color: rgba(255, 255, 255, .55);
    color: #ffffff;
}

.public-secondary-btn:hover {
    background: #ffffff;
    border-color: #ffffff;
    color: #102f32;
}

.public-page {
    overflow: hidden;
}

.public-hero {
    background-image: var(--hotel-image);
    background-position: center;
    background-size: cover;
    min-height: min(590px, calc(100vh - 150px));
}

.public-hero-layer {
    background: linear-gradient(90deg, rgba(8, 29, 30, .88) 0%, rgba(8, 29, 30, .64) 42%, rgba(8, 29, 30, .18) 100%);
    min-height: inherit;
}

.public-hero-grid {
    align-items: center;
    box-sizing: border-box;
    display: grid;
    gap: 36px;
    grid-template-columns: minmax(0, 760px);
    min-height: inherit;
    padding-bottom: 30px;
    padding-top: 30px;
}

.public-hero-copy {
    color: #ffffff;
    max-width: 650px;
}

.public-eyebrow {
    color: #c57942;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: 0;
    margin: 0 0 10px;
    text-transform: uppercase;
}

.public-hero-copy .public-eyebrow {
    color: #f4bd73;
}

.public-hero-copy h1 {
    font-size: 4rem;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1;
    margin: 0;
}

.public-hero-copy p:not(.public-eyebrow) {
    color: rgba(255, 255, 255, .86);
    font-size: 1.12rem;
    line-height: 1.7;
    margin: 20px 0 0;
    max-width: 590px;
}

.public-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.booking-section {
    background: #102f32;
    color: #ffffff;
    padding: 34px 0 42px;
}

.booking-section-grid {
    align-items: center;
    display: grid;
    gap: 28px;
    grid-template-columns: minmax(0, .75fr) minmax(360px, 1fr);
}

.booking-section-copy {
    max-width: 500px;
}

.booking-section-copy .public-eyebrow {
    color: #f4bd73;
}

.booking-section-copy h2 {
    color: #ffffff;
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.18;
    margin: 0;
}

.booking-section-copy p:not(.public-eyebrow) {
    color: rgba(255, 255, 255, .78);
    line-height: 1.7;
    margin: 16px 0 0;
}

.site-open-form {
    display: grid;
    gap: 12px;
    margin-top: 22px;
    max-width: 420px;
}

.site-open-form label {
    color: rgba(255, 255, 255, .84);
    display: grid;
    font-size: .9rem;
    font-weight: 800;
    gap: 7px;
    margin: 0;
}

.site-open-form .form-control {
    background: rgba(255, 255, 255, .96);
    border-color: rgba(255, 255, 255, .35);
}

.booking-status-panel {
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 8px;
    display: grid;
    gap: 12px;
    margin-top: 22px;
    padding: 14px;
}

.booking-status-panel h3 {
    color: #ffffff;
    font-size: 1rem;
    font-weight: 800;
    margin: 0;
}

.booking-status-form {
    display: grid;
    gap: 10px;
}

.booking-status-form label {
    color: rgba(255, 255, 255, .86);
    display: grid;
    font-size: .86rem;
    font-weight: 800;
    gap: 6px;
    margin: 0;
}

.booking-status-form .form-control {
    background: rgba(255, 255, 255, .96);
    border-color: rgba(255, 255, 255, .28);
}

.booking-status-form .text-danger {
    color: #fecdd3 !important;
    font-size: .78rem;
    font-weight: 700;
}

.booking-status-result {
    background: #ffffff;
    border: 1px solid rgba(24, 33, 47, .12);
    border-radius: 8px;
    color: #102f32;
    display: grid;
    gap: 8px;
    padding: 12px;
}

.booking-status-result div {
    align-items: start;
    display: grid;
    gap: 6px;
    grid-template-columns: 88px minmax(0, 1fr);
}

.booking-status-result span {
    color: #607086;
    font-size: .78rem;
    font-weight: 800;
}

.booking-status-result strong {
    color: #102f32;
    font-size: .88rem;
    overflow-wrap: anywhere;
}

.booking-status-result p {
    background: #edf8f0;
    border: 1px solid #b7e3c0;
    border-radius: 8px;
    color: #166534 !important;
    font-weight: 800;
    line-height: 1.5 !important;
    margin: 4px 0 0 !important;
    padding: 10px;
}

.booking-panel {
    background: #ffffff;
    border: 1px solid rgba(24, 33, 47, .12);
    border-radius: 8px;
    box-shadow: 0 24px 70px rgba(2, 18, 24, .24);
    display: grid;
    gap: 10px;
    padding: 18px;
}

.booking-heading h2 {
    color: #102f32;
    font-size: 1.25rem;
    font-weight: 800;
    letter-spacing: 0;
    margin: 0;
}

.booking-alert {
    background: #edf8f0;
    border: 1px solid #b7e3c0;
    border-radius: 8px;
    color: #166534;
    font-weight: 700;
    padding: 10px 12px;
}

.booking-alert-error {
    background: #fff1f2;
    border-color: #fecdd3;
    color: #9f1239;
}

.booking-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.booking-panel label {
    color: #324252;
    display: grid;
    font-size: .9rem;
    font-weight: 800;
    gap: 5px;
    margin: 0;
}

.booking-panel .form-control,
.booking-panel .form-select {
    background: #fbfcfd;
    border-color: #c9d2dc;
    min-height: 38px;
    padding-bottom: 6px;
    padding-top: 6px;
}

.booking-panel .text-danger {
    font-size: .78rem;
    font-weight: 700;
}

.booking-submit {
    margin-top: 4px;
    width: 100%;
}

.public-stat-band {
    background: #101922;
    color: #ffffff;
}

.public-stat-grid {
    display: grid;
    gap: 1px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding-bottom: 18px;
    padding-top: 18px;
}

.public-stat-grid div {
    border-right: 1px solid rgba(255, 255, 255, .16);
    display: grid;
    gap: 4px;
    min-height: 74px;
    padding: 8px 22px;
}

.public-stat-grid div:last-child {
    border-right: 0;
}

.public-stat-grid strong {
    color: #f4bd73;
    font-size: 1.7rem;
    line-height: 1.1;
}

.public-stat-grid span {
    color: rgba(255, 255, 255, .78);
    font-weight: 700;
}

.public-section {
    padding: 76px 0;
}

.public-section-heading {
    max-width: 720px;
}

.public-section-heading h2,
.dining-copy h2,
.public-footer h2 {
    color: #102f32;
    font-size: 2.25rem;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.15;
    margin: 0;
}

.room-card-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 30px;
}

.room-card {
    background: #ffffff;
    border: 1px solid rgba(24, 33, 47, .1);
    border-radius: 8px;
    overflow: hidden;
}

.room-card-image {
    background-image: var(--hotel-image);
    background-size: 190%;
    min-height: 190px;
}

.room-card-image-one {
    background-position: 8% 52%;
}

.room-card-image-two {
    background-position: 54% 50%;
}

.room-card-image-three {
    background-position: 92% 46%;
}

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

.room-card span {
    color: #b94e48;
    display: block;
    font-size: .88rem;
    font-weight: 900;
    margin-bottom: 8px;
}

.room-card h3,
.amenity-list h3 {
    color: #102f32;
    font-size: 1.14rem;
    font-weight: 800;
    letter-spacing: 0;
    margin: 0 0 10px;
}

.room-card p,
.amenity-list p,
.dining-copy p,
.public-footer p {
    color: #5b6875;
    line-height: 1.65;
    margin: 0;
}

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

.room-product-card .room-card-body {
    display: grid;
    flex: 1;
    gap: 12px;
}

.room-product-meta {
    align-items: baseline;
    background: #f4f8f7;
    border: 1px solid #d7e5e2;
    border-radius: 8px;
    display: flex;
    gap: 8px;
    padding: 10px 12px;
}

.room-product-meta strong {
    color: #102f32;
    font-size: 1.45rem;
    line-height: 1;
}

.room-product-meta small {
    color: #5b6875;
    font-weight: 800;
}

.public-product-btn {
    background: #102f32;
    border-color: #102f32;
    border-radius: 8px;
    color: #ffffff;
    font-weight: 800;
    min-height: 42px;
}

.public-product-btn:hover {
    background: #17484b;
    border-color: #17484b;
    color: #ffffff;
}

.public-product-btn:disabled {
    background: #d8dee4;
    border-color: #d8dee4;
    color: #667380;
}

.public-empty-state {
    background: #ffffff;
    border: 1px solid rgba(24, 33, 47, .1);
    border-radius: 8px;
    margin-top: 30px;
    padding: 24px;
}

.public-empty-state h3 {
    color: #102f32;
    font-size: 1.15rem;
    font-weight: 800;
    margin: 0 0 8px;
}

.public-empty-state p {
    color: #5b6875;
    margin: 0;
}

.public-amenity-band {
    background: #eaf2f2;
}

.public-amenity-grid {
    display: grid;
    gap: 36px;
    grid-template-columns: minmax(260px, .75fr) minmax(0, 1.25fr);
}

.amenity-list {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.amenity-list article {
    background: #ffffff;
    border: 1px solid rgba(16, 47, 50, .12);
    border-radius: 8px;
    min-height: 142px;
    padding: 20px;
}

.dining-grid {
    align-items: center;
    display: grid;
    gap: 40px;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
}

.dining-image {
    background-image: var(--hotel-image);
    background-position: 42% 50%;
    background-size: 175%;
    border-radius: 8px;
    min-height: 430px;
}

.dining-copy p:not(.public-eyebrow) {
    font-size: 1.04rem;
    margin-top: 18px;
}

.dining-points {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}

.dining-points span {
    background: #fff4e6;
    border: 1px solid #f3c28d;
    border-radius: 999px;
    color: #8a431d;
    font-size: .88rem;
    font-weight: 800;
    padding: 9px 12px;
}

.public-gallery-strip {
    display: grid;
    gap: 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.gallery-tile {
    background-image: var(--hotel-image);
    background-size: 170%;
    min-height: 260px;
}

.gallery-one {
    background-position: 5% 47%;
}

.gallery-two {
    background-position: 50% 55%;
}

.gallery-three {
    background-position: 94% 52%;
}

.public-footer {
    background: #101922;
    color: #ffffff;
    padding: 46px 0;
}

.public-footer-grid {
    align-items: end;
    display: grid;
    gap: 24px;
    grid-template-columns: minmax(0, 1.4fr) minmax(180px, .45fr) minmax(220px, .55fr);
}

.public-footer h2 {
    color: #ffffff;
    font-size: 1.65rem;
}

.public-footer p {
    color: rgba(255, 255, 255, .72);
    margin-top: 12px;
}

.public-footer span,
.public-footer strong {
    display: block;
}

.public-footer span {
    color: #f4bd73;
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
}

.public-footer strong {
    color: #ffffff;
    font-size: 1.02rem;
    margin-top: 7px;
}

@media (max-width: 991px) {
    .public-nav-inner {
        padding-bottom: 12px;
        padding-top: 12px;
    }

    .public-nav-links {
        align-items: stretch;
        margin-top: 12px;
    }

    .public-nav-actions {
        align-items: stretch;
        flex-direction: column;
        margin: 12px 0 0;
    }

    .public-login-link,
    .public-book-btn {
        justify-content: center;
        text-align: center;
    }

    .public-hero-grid,
    .booking-section-grid,
    .public-amenity-grid,
    .dining-grid,
    .public-footer-grid {
        grid-template-columns: 1fr;
    }

    .public-hero-grid {
        align-items: start;
        padding-bottom: 34px;
        padding-top: 46px;
    }

    .public-hero-copy h1 {
        font-size: 3rem;
    }

    .booking-panel {
        max-width: 560px;
    }

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

    .dining-image {
        min-height: 340px;
    }
}

@media (max-width: 720px) {
    .public-container {
        padding-left: 18px;
        padding-right: 18px;
    }

    .public-hero {
        min-height: auto;
    }

    .public-hero-layer {
        background: linear-gradient(180deg, rgba(8, 29, 30, .9) 0%, rgba(8, 29, 30, .74) 72%, rgba(8, 29, 30, .58) 100%);
    }

    .public-hero-copy h1 {
        font-size: 2.35rem;
    }

    .public-hero-copy p:not(.public-eyebrow) {
        font-size: 1rem;
    }

    .booking-grid,
    .public-stat-grid,
    .amenity-list,
    .public-gallery-strip {
        grid-template-columns: 1fr;
    }

    .public-stat-grid div {
        border-bottom: 1px solid rgba(255, 255, 255, .16);
        border-right: 0;
    }

    .public-stat-grid div:last-child {
        border-bottom: 0;
    }

    .public-section {
        padding: 54px 0;
    }

    .public-section-heading h2,
    .dining-copy h2 {
        font-size: 1.75rem;
    }

    .room-card-image,
    .gallery-tile {
        min-height: 210px;
    }

    .dining-image {
        min-height: 280px;
    }
}