/* Theme variables */
:root{
  --cb-primary:#0d6efd;
  --cb-primary-600:#0b5ed7;
  --cb-accent:#4dabf7;
  --cb-muted:#6c757d;
  --cb-bg:#f8f9fa;
  --cb-surface:#ffffff;
  --cb-border:#e9ecef;
  --cb-shadow:0 6px 18px rgba(0,0,0,.06);
}

/* Dark theme variables */
html[data-theme="dark"]{
  --cb-primary:#4dabf7;
  --cb-primary-600:#339af0;
  --cb-accent:#74c0fc;
  --cb-muted:#adb5bd;
  --cb-bg:#111216;
  --cb-surface:#17181d;
  --cb-border:#2b2d33;
  --cb-shadow:0 6px 18px rgba(0,0,0,.4);
}

/* Base */
html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{-webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale}

.page-wrapper .page-body-wrapper { background-color: var(--cb-bg); }
 .logo-wrapper img{
     max-width: 120px;
}
 .f-light {
     color: hsl(204deg 2.39% 17.06% / 80%);
}
 .room-checklist{
     padding: 14px;
     font-size: 15px;
}
 .booking-actions span {
     display: flex;
     margin: 8px;
}
.page-header.close_icon {
    z-index: 100;
}
 .error {
     color: #dc3545;
}
 .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper{
     background: #ededed;
}
 table {
     width: 100%;
     border-collapse: collapse;
}
 th, td {
     padding: 8px;
     text-align: left;
     vertical-align: middle;
}
 th {
     background-color: #f8fafc;
}
 tr:hover {
     background-color: #d1e7ff;
    /* Highlight on hover */
}
 .booking-details{
     font-size: 18px;
     text-transform: uppercase;
     font-weight: bold;
}
 .booking-details span {
     font-size: 20px;
}
 .chart-select{
     background-color: rgba(43, 94, 94, .06);
     border-color: rgba(43, 94, 94, .06);
     height: 30px;
     border-radius: 2px;
     padding: 2px;
}
 .booking-nav a{
     padding: 5px 10px;
     font-size: 16px;
     text-transform: full-width;
     color:#9d9c9c;
}
 .booking-nav .active {
     color: #fff;
     background: #2b5f60;
     border-radius: 6px;
}
 .booking-actions .dropdown-menu .dropdown-item{
     font-weight:bold;
}
 .card .card-body{
     overflow: visible;
}
 .img-fluid{
     width: auto;
     max-width: 100%;
     height: auto;
}
 th {
     background-color: #f8fafc;
     position: static;
     z-index: auto;
}
 thead th {
     top: auto;
}
 th.sticky-header {
     background: #fff;
     position: sticky;
     z-index: 2;
     top: 0;
}
 tbody th {
     position: static;
     left: auto;
     z-index: auto;
     background-color: inherit;
     width: auto;
}
 .th-sticky {
     position: sticky;
     left: 0;
     z-index: 1;
     background-color: #fff;
     width: 120px;
}
 tbody {
     overflow: visible;
}
 .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper{
     z-index: 100;
     box-shadow:none;
}

.year-filter {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #f8fafc;
    border: 1px solid #e6ebf3;
    padding: 6px 14px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05);
  }

  .year-filter label {
    margin-bottom: 0;
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #6c757d;
    font-weight: 600;
  }

  .year-filter select {
    border: none;
    background: transparent;
    font-weight: 600;
    color: #1b1f3b;
    padding: 0;
    box-shadow: none !important;
  }

.year-filter select:focus {
    outline: none;
  }

.filter-shell{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    background:#f8fafc;
    border-radius:14px;
    padding:16px;
}

.filter-shell .filter-group{
    display:flex;
    flex-direction:column;
    gap:6px;
    min-width:160px;
}

.filter-shell label{
    font-size:0.68rem;
    letter-spacing:0.06em;
    text-transform:uppercase;
    color:#6c757d;
    font-weight:600;
    margin:0;
}

.filter-shell select,
.filter-shell input[type="date"]{
    border-radius:10px;
    border:1px solid #d0d7e2;
    box-shadow:none;
    font-size:0.9rem;
    padding:8px 12px;
    color:#1b1f3b;
}

.filter-shell select:focus,
.filter-shell input[type="date"]:focus{
    border-color:#0d6efd;
    box-shadow:0 0 0 3px rgba(13,110,253,.12);
}

/* =========================================================
   Global Modal UI System (Modern App Experience)
   ========================================================= */
:root{
  --modal-bg:#ffffff;
  --modal-surface:#f8fafc;
  --modal-text:#0f172a;
  --modal-muted:#64748b;
  --modal-border:#e2e8f0;
  --modal-border-strong:#cfd8e3;
  --modal-overlay:rgba(15,23,42,.5);
  --modal-shadow:0 24px 64px rgba(15,23,42,.22);
  --modal-radius:16px;
  --modal-radius-sm:12px;
  --modal-title-size:1.03rem;
}

html[data-theme="dark"]{
  --modal-bg:#171c24;
  --modal-surface:#1d2430;
  --modal-text:#e5e7eb;
  --modal-muted:#9aa6b5;
  --modal-border:#2b3443;
  --modal-border-strong:#394355;
  --modal-overlay:rgba(2,6,23,.74);
  --modal-shadow:0 28px 64px rgba(0,0,0,.52);
}

.modal{
  --bs-modal-margin:1.2rem;
  --bs-modal-border-width:1px;
  --bs-modal-border-color:var(--modal-border);
  --bs-modal-border-radius:var(--modal-radius);
  --bs-modal-bg:var(--modal-bg);
  --bs-modal-color:var(--modal-text);
  backdrop-filter: blur(2px);
}

.modal-backdrop.show{
  opacity:1;
  background:var(--modal-overlay);
}

.modal .modal-dialog{
  --cb-modal-max: min(500px, calc(100vw - 2rem));
  width:min(calc(100vw - 2rem), var(--cb-modal-max));
  max-width:min(calc(100vw - 2rem), var(--cb-modal-max));
  margin-top:1.2rem;
  margin-bottom:1.2rem;
}

.modal .modal-dialog.modal-sm{
  --cb-modal-max: 320px;
}

.modal .modal-dialog.modal-lg{
  --cb-modal-max: 820px;
}

.modal .modal-dialog.modal-xl{
  --cb-modal-max: 1140px;
}

.modal .modal-content{
  border:1px solid var(--modal-border);
  border-radius:var(--modal-radius);
  background:var(--modal-bg);
  box-shadow:var(--modal-shadow);
  overflow:hidden;
}

.modal .modal-header{
  position:relative;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  border-bottom:1px solid var(--modal-border);
  background:
    radial-gradient(120% 100% at 0% 0%, rgba(13,110,253,.08) 0%, rgba(13,110,253,0) 55%),
    linear-gradient(180deg, var(--modal-bg) 0%, var(--modal-surface) 100%);
  padding:1rem 1.1rem .9rem;
}

.modal .modal-header::after{
  content:"";
  position:absolute;
  left:1.1rem;
  bottom:0;
  width:42px;
  height:2px;
  border-radius:999px;
  background:var(--cb-primary);
  opacity:.8;
}

.modal .modal-title{
  color:var(--modal-text);
  font-weight:700;
  letter-spacing:.01em;
  font-size:var(--modal-title-size);
  line-height:1.25;
  margin:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.modal .modal-header > div:first-child{
  min-width:0;
}

.modal .modal-subtitle,
.modal .modal-header small,
.modal .modal-header .text-muted{
  font-size:.78rem;
  color:var(--modal-muted) !important;
  margin-top:.2rem;
  line-height:1.35;
}

.modal .modal-body{
  background:var(--modal-bg);
  color:var(--modal-text);
  padding: clamp(.85rem, 1.6vw, 1rem) !important;
  overflow-wrap:break-word;
}

.modal .modal-footer{
  border-top:1px solid var(--modal-border);
  background:var(--modal-surface);
  padding:.8rem 1.1rem;
  gap:.5rem;
  align-items:center;
  justify-content:flex-end;
}

.modal .modal-footer > *{
  margin:0;
}

.modal .btn-close{
  border-radius:999px;
  width:32px;
  height:32px;
  opacity:.92;
  background-position:center;
  transition:all .14s ease;
}

.modal .btn-close:hover{
  opacity:1;
  transform:translateY(-1px);
  border-color:var(--modal-border-strong);
  box-shadow:0 6px 14px rgba(15,23,42,.12);
}

.modal .btn-close:focus{
  box-shadow:0 0 0 3px rgba(13,110,253,.16);
}

.modal .form-label{
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:var(--modal-muted);
  font-weight:700;
  margin-bottom:.4rem;
}

.modal .form-control,
.modal .form-select,
.modal textarea.form-control{
  border-radius:10px;
  border-color:var(--modal-border-strong);
  background:var(--modal-bg);
  color:var(--modal-text);
  min-height:40px;
  box-shadow:none;
}

.modal textarea.form-control{
  min-height:96px;
  resize:vertical;
}

.modal .form-control:focus,
.modal .form-select:focus{
  border-color:var(--cb-primary);
  box-shadow:0 0 0 3px rgba(13,110,253,.14);
}

.modal .form-text{
  color:var(--modal-muted);
}

.modal .invalid-feedback,
.modal .text-danger{
  font-size:.78rem;
}

.modal .row > [class*="col-"]{
  margin-bottom:.15rem;
}

.modal .table{
  --bs-table-bg: transparent;
  --bs-table-striped-bg: #f8fafc;
  --bs-table-hover-bg: #eff6ff;
}

.modal .card{
  border:1px solid var(--modal-border);
  border-radius:12px;
  background:var(--modal-bg);
  box-shadow:0 6px 18px rgba(15,23,42,.05);
}

.modal .card .card-header{
  border-bottom:1px solid var(--modal-border);
  background:var(--modal-surface);
}

.modal .alert{
  border-radius:10px;
  border-width:1px;
}

.modal .btn{
  border-radius:10px;
  font-weight:600;
}

.modal .btn-primary{
  box-shadow:0 6px 16px rgba(13,110,253,.2);
}

.modal .dropdown-menu{
  border:1px solid var(--modal-border);
  border-radius:12px;
  box-shadow:0 12px 30px rgba(15,23,42,.14);
  padding:.35rem;
}

.modal .dropdown-item{
  border-radius:8px;
  font-weight:500;
}

.modal .dropdown-item:hover{
  background:#eff6ff;
}

.modal.right-slide .modal-dialog{
  margin-right:0;
}

.modal .spinner-border{
  width:1.7rem;
  height:1.7rem;
}

/* Sticky helpers for long content modals */
.modal.modal-sticky .modal-content{
  max-height: calc(100vh - 2.4rem);
}

.modal.modal-sticky .modal-header{
  position: sticky;
  top: 0;
  z-index: 6;
}

.modal.modal-sticky .modal-body{
  overflow-y: auto;
}

.modal.modal-sticky .modal-footer{
  position: sticky;
  bottom: 0;
  z-index: 6;
}

/* Scrollbar polish in modal body */
.modal .modal-body::-webkit-scrollbar{
  width:8px;
  height:8px;
}

.modal .modal-body::-webkit-scrollbar-track{
  background: transparent;
}

.modal .modal-body::-webkit-scrollbar-thumb{
  background:#cdd6e3;
  border-radius:999px;
}

/* Size polish */
.modal.modal-sm .modal-content,
.modal.modal-lg .modal-content,
.modal.modal-xl .modal-content{
  border-radius: var(--modal-radius);
}

.modal.modal-sm .modal-title{
  --modal-title-size:.95rem;
}

.modal.modal-xl .modal-title{
  --modal-title-size:1.08rem;
}

@media (max-width: 767.98px){
  .modal .modal-dialog{
    margin:.45rem;
  }

  .modal .modal-header,
  .modal .modal-body,
  .modal .modal-footer{
    padding-left:.85rem;
    padding-right:.85rem;
  }

  .modal .modal-title{
    --modal-title-size:.95rem;
    white-space:normal;
  }

  .modal .modal-footer{
    justify-content:stretch;
  }

  .modal .modal-footer .btn,
  .modal .modal-footer a.btn{
    width:100%;
  }
}

@media (prefers-reduced-motion: reduce){
  .modal .btn-close{
    transition:none;
  }
}

/* =========================================================
   Modal Variants (Semantic + Purpose + Density)
   Usage:
   <div class="modal fade modal-danger" ...>
   <div class="modal fade modal-success" ...>
   <div class="modal fade modal-compact" ...>
   <div class="modal fade modal-confirm" ...>
   <div class="modal fade modal-form" ...>
   <div class="modal fade modal-details" ...>
   ========================================================= */
.modal.modal-danger{
  --modal-accent:#dc2626;
  --modal-accent-soft:#fee2e2;
  --modal-accent-border:#fecaca;
}

.modal.modal-success{
  --modal-accent:#059669;
  --modal-accent-soft:#d1fae5;
  --modal-accent-border:#a7f3d0;
}

.modal.modal-danger .modal-header,
.modal.modal-success .modal-header{
  border-bottom-color:var(--modal-accent-border);
  background:
    radial-gradient(120% 100% at 0% 0%, color-mix(in srgb, var(--modal-accent) 14%, transparent) 0%, transparent 56%),
    linear-gradient(180deg, var(--modal-bg) 0%, var(--modal-surface) 100%);
}

.modal.modal-danger .modal-header::after,
.modal.modal-success .modal-header::after{
  background:var(--modal-accent);
  opacity:.95;
}

.modal.modal-danger .modal-title,
.modal.modal-success .modal-title{
  color:var(--modal-accent);
}

.modal.modal-danger .btn-primary{
  background-color:#dc2626;
  border-color:#dc2626;
  box-shadow:0 6px 16px rgba(220,38,38,.25);
}

.modal.modal-danger .btn-primary:hover{
  background-color:#b91c1c;
  border-color:#b91c1c;
}

.modal.modal-success .btn-primary{
  background-color:#059669;
  border-color:#059669;
  box-shadow:0 6px 16px rgba(5,150,105,.24);
}

.modal.modal-success .btn-primary:hover{
  background-color:#047857;
  border-color:#047857;
}

.modal.modal-danger .alert{
  background:#fef2f2;
  border-color:#fecaca;
  color:#991b1b;
}

.modal.modal-success .alert{
  background:#ecfdf5;
  border-color:#a7f3d0;
  color:#065f46;
}

.modal.modal-confirm .modal-footer{
  justify-content:center;
}

.modal.modal-form .modal-body{
  background: linear-gradient(180deg, #fff 0%, #fcfdff 100%);
}

.modal.modal-form .form-group,
.modal.modal-form .mb-3{
  margin-bottom: .95rem !important;
}

.modal.modal-details .modal-body{
  padding-top: .85rem;
}

.modal.modal-details .card{
  box-shadow:none;
}

.modal.modal-compact .modal-content{
  border-radius:14px;
}

.modal.modal-compact .modal-header{
  padding:.72rem .85rem .66rem;
}

.modal.modal-compact .modal-title{
  --modal-title-size:.92rem;
}

.modal.modal-compact .modal-header::after{
  left:.85rem;
  width:34px;
}

.modal.modal-compact .modal-body{
  padding:.75rem .85rem;
}

.modal.modal-compact .modal-footer{
  padding:.65rem .85rem;
}

.modal.modal-compact .form-control,
.modal.modal-compact .form-select{
  min-height:36px;
  font-size:.86rem;
}

.modal.modal-compact .btn{
  padding-top:.36rem;
  padding-bottom:.36rem;
  font-size:.85rem;
}

.filter-shell .custom-range{
    display:flex;
    align-items:center;
    gap:12px;
}

.filter-shell .custom-range>div{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.filter-shell .filter-actions{
    display:flex;
    align-items:center;
    gap:8px;
    margin-left:auto;
}

.filter-shell .year-chip-group{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
}

.filter-shell .year-chip-group .year-filter-btn{
    border-radius:999px;
    border:1px solid #d0d7e2;
    background:#ffffff;
    color:#1b1f3b;
    padding:4px 12px;
    font-size:.82rem;
    font-weight:600;
    transition:all .2s ease;
}

.filter-shell .year-chip-group .year-filter-btn.active{
    background:#0d6efd;
    color:#ffffff;
    border-color:#0d6efd;
    box-shadow:0 6px 16px rgba(13,110,253,.25);
}

.filter-shell .year-chip-group .year-filter-btn:not(.active):hover{
    border-color:#0d6efd;
    color:#0d6efd;
}
#paymentVerifyModal {
    z-index: 5000;
}
@media (max-width:991.98px){
    .filter-shell{
        flex-direction:column;
        align-items:stretch;
    }

    .filter-shell .filter-group{
        width:100%;
    }

    .filter-shell .filter-actions{
        width:100%;
        justify-content:flex-end;
    }
}

@media (max-width:575.98px){
    .filter-shell{
        padding:14px;
    }

    .filter-shell .filter-actions{
        flex-direction:column;
        align-items:stretch;
    }

    .filter-shell .filter-actions .btn,
    .filter-shell .filter-actions a{
        width:100%;
    }
}
  
 @media only screen and (max-width: 575.98px) {
     .btn {
         padding: 0.5rem 0.9rem;
         font-size: 0.875rem;
    }
}
.page-wrapper .page-header{
     background: var(--cb-surface) !important;
     position: inherit;
}
.page-wrapper .page-header[style*="position: fixed"]{box-shadow:0 2px 12px rgba(0,0,0,.06)}
.hover-bg-light:hover{background:#f1f3f5}
.text-muted-2{color:#868e96}
.rounded-lg{border-radius:12px}
.shadow-soft{box-shadow:var(--cb-shadow)}
.elevation-1{box-shadow:0 1px 2px rgba(0,0,0,.04)}
.elevation-2{box-shadow:0 2px 8px rgba(0,0,0,.08)}
.elevation-3{box-shadow:0 10px 24px rgba(0,0,0,.12)}
 .page-wrapper .page-body-wrapper .page-body{
     margin-top:0px !important;
}
 .page-wrapper .page-header .header-wrapper .nav-right>ul>li{
     padding: 5px !important;
}
.page-wrapper.compact-wrapper .page-body-wrapper .page-body{
    margin-left: 0;
}

div#sidebarOffcanvas {
    position: fixed;              /* stays in place even when scrolling */
    top: 0;
    left: 0;
    height: 100vh;                /* full viewport height */
    width: min(88vw, 340px);
    max-width: 100%;
    background: #fff;             /* clean background */
    z-index: 1050;                /* Bootstrap offcanvas default z-index */
    box-shadow: 2px 0 10px rgba(0,0,0,0.1); /* subtle shadow on edge */
    transform: translateX(-100%); /* hidden by default */
    transition: transform 0.3s ease-in-out; /* smooth slide effect */
    overflow-y: auto;             /* allow scrolling if menu is long */
}

/* Purchase Order form tweaks */
.po-lines-wrapper {
    border-radius: 0.5rem;
}

.po-lines-wrapper table#po-lines td,
.po-lines-wrapper table#po-lines th {
    vertical-align: middle;
}

.po-lines-actions .fa-info-circle {
    font-size: 0.85rem;
}

@media (max-width: 991.98px) {
    .po-lines-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .po-lines-actions .btn {
        width: 100%;
        order: 1;
    }

    .po-lines-actions .text-muted {
        order: 2;
        justify-content: flex-start;
    }
}

@media (max-width: 767.98px) {
    .po-lines-wrapper {
        border: 1px solid rgba(0, 0, 0, 0.08);
        padding: 0.5rem;
    }

    .po-lines-wrapper table#po-lines {
        border-collapse: separate;
        border-spacing: 0;
    }

    .po-lines-wrapper table#po-lines thead {
        display: none;
    }

    .po-lines-wrapper table#po-lines tr.po-line-row {
        display: block;
        margin-bottom: 1rem;
        border: 1px solid rgba(0, 0, 0, 0.06);
        border-radius: 0.5rem;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.04);
        padding: 0.75rem;
        background: #fff;
    }

    .po-lines-wrapper table#po-lines tr.po-line-row:last-child {
        margin-bottom: 0;
    }

    .po-lines-wrapper table#po-lines td {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        row-gap: 0.35rem;
        border: 0;
        padding: 0.25rem 0;
    }

    .po-lines-wrapper table#po-lines td::before {
        content: attr(data-label);
        font-size: 0.75rem;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: #868e96;
    }

    .po-lines-wrapper table#po-lines td[data-label="Line Total"] {
        text-align: left;
    }

    .po-lines-wrapper table#po-lines td[data-label="Actions"] {
        padding-top: 0.5rem;
    }

    .po-lines-wrapper table#po-lines tfoot {
        display: block;
        border: 1px solid rgba(0, 0, 0, 0.06);
        border-radius: 0.5rem;
        padding: 0.75rem;
        background: #fff;
    }

    .po-lines-wrapper table#po-lines tfoot td {
        padding: 0.25rem 0;
    }

    .po-lines-wrapper table#po-lines tfoot td:first-child {
        text-align: left;
    }

    .po-lines-actions .text-muted {
        display: flex;
    }
}

/* When active/open */
div#sidebarOffcanvas.show {
    transform: translateX(0);
}

/* Booking Details Card */
.card { border:none;border-radius:8px;background-color:var(--cb-surface);box-shadow:0 1px 3px rgba(0,0,0,.06) }
.card-header{background:#fff;border-bottom:1px solid var(--cb-border);font-weight:600}
html[data-theme="dark"] .card-header{background:var(--cb-surface)}
.card-hover:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.08)}
 .card-title {
     font-size: 1.25rem;
     margin-bottom: 1rem;
}
 .card-body p {
     margin-bottom: 0.75rem;
     color: #555;
}
 .card-body strong {
     color: #333;
     font-weight: 500;
}
 .badge {
     font-size: 0.9em;
     padding: 0.4em 0.8em;
}
/* Section Titles */
 .section-title {
     font-size: 1rem;
     text-transform: uppercase;
     letter-spacing: 0.5px;
     font-weight: 600;
}
/* Action Items */
 .action-item {
     border: none;
     background-color: #fff;
     padding: 1rem;
     border-radius: 6px;
     margin-bottom: 0.5rem;
     transition: all 0.2s ease;
     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}
 .action-item:hover {
     background-color: #e9ecef;
     transform: translateY(-2px);
     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}
.action-item i {
     font-size: 1.2rem;
     color: #6c757d;
}

/* App layout + theme overrides (moved from layout inline styles) */
#loading-overlay{position:fixed;inset:0;background:#ffffff;display:flex;align-items:center;justify-content:center;z-index:9999;transition:opacity .25s ease, visibility .25s ease}
#loading-overlay.loaded{opacity:0;visibility:hidden}
.loading-wrap{display:flex;flex-direction:column;align-items:center;gap:14px}
.loading-spinner{width:42px;height:42px;border:4px solid #e9ecef;border-top-color:#0d6efd;border-radius:50%;animation:spin 1s linear infinite}
.loading-text{font-family:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:14px;color:#6c757d}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-color-scheme: dark){#loading-overlay{background:#0b0b0c}.loading-text{color:#adb5bd}}
@media (prefers-reduced-motion: reduce){.loading-spinner{animation:none}}
@media (max-width:576px){.chart-container{height:260px!important}}
@media (max-width:992px){
  .page-wrapper .page-body-wrapper .sidebar-wrapper{position:fixed;top:75px;bottom:0;height:auto;overflow:hidden}
  .page-wrapper .page-body-wrapper .sidebar-wrapper #sidebar-menu{height:100%}
  .page-wrapper .page-body-wrapper .sidebar-wrapper #simple-bar{max-height:calc(100vh - 95px);overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:80px}
}
img{max-width:100%;height:auto}
.page-wrapper .page-body{min-height:calc(100vh - 150px);background:transparent}
@media (max-width:992px){
  .page-wrapper .page-body{padding:16px}
  .card{border-radius:14px}
  .card-header{gap:10px}
  .table-responsive{border-radius:12px}
  .btn{white-space:nowrap}
  .btn-group,.dropdown{width:auto}
  .form-control,.form-select{min-height:44px}
  .footer .row>div{width:100%;text-align:center!important}
  .footer .row>div+div{margin-top:6px}
}
:root{
  --app-bg:#f7f3ee;
  --app-surface:#ffffff;
  --app-ink:#1f2937;
  --app-muted:#64748b;
  --app-accent:#0f766e;
  --app-accent-strong:#115e59;
  --app-accent-soft:rgba(15,118,110,0.12);
}
body{background:var(--app-bg);color:var(--app-ink)}
.card{background:var(--app-surface);border-color:rgba(15,23,42,0.08)}
.card-header{background:#f8fafc}
.table-light{background:#f8fafc}
.text-muted{color:var(--app-muted)!important}
a{color:var(--app-accent)}
a:hover{color:var(--app-accent-strong)}
.btn-primary{background-color:var(--app-accent);border-color:var(--app-accent)}
.btn-primary:hover,.btn-primary:focus{background-color:var(--app-accent-strong);border-color:var(--app-accent-strong)}
.badge-soft-success,.bg-success-subtle{background:rgba(16,185,129,0.16)!important;color:#047857!important}
.badge-soft-warning,.bg-warning-subtle{background:rgba(245,158,11,0.18)!important;color:#92400e!important}
.dashboard-sidebar{
  width:260px;
  background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%);
  border-right:1px solid rgba(15,23,42,0.08);
  transition:width .2s ease;
  overflow-x:hidden;
}
.sidebar-collapsed .dashboard-sidebar{width:84px}
.dashboard-sidebar .sidebar-header{
  position:sticky;
  top:0;
  z-index:2;
  background:#ffffff;
  border-bottom:1px solid rgba(15,23,42,0.06);
}
.dashboard-sidebar .sidebar-brand{letter-spacing:0.02em}
.dashboard-sidebar .sidebar-scroll{padding-bottom:12px}
.dashboard-sidebar .sidebar-body,
.dashboard-sidebar .sidebar-scroll{
  overflow-x:hidden;
}
.dashboard-sidebar .sidebar-pins .list-group-item{background:transparent}
.dashboard-sidebar .sidebar-group-toggle{
  border-radius:0;
  background:rgba(15,118,110,0.06);
  color:#4b5563;
  border:1px solid rgba(15,118,110,0.12);
  position:relative;
  overflow:hidden;
}
.dashboard-sidebar .sidebar-group-toggle:hover{
  background:rgba(15,118,110,0.12);
  color:#0f766e;
}
.dashboard-sidebar .sidebar-group-toggle::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(15,118,110,0.12),transparent);
  opacity:0;
  transition:opacity .2s ease;
}
.dashboard-sidebar .sidebar-group-toggle:hover::after{opacity:1}
.dashboard-sidebar .list-group-item{
  border-radius:12px;
  margin:4px 0;
  padding-left:14px;
  padding-right:12px;
  color:#374151;
  transition:background .15s ease,color .15s ease,transform .15s ease;
}
.dashboard-sidebar .sidebar-nav-link{
  gap:0;
}
.dashboard-sidebar .sidebar-nav-link__icon{
  flex:0 0 1.1rem;
  width:1.1rem;
  text-align:center;
  line-height:1;
}
.dashboard-sidebar .sidebar-nav-link__label{
  min-width:0;
  line-height:1.2;
}
.dashboard-sidebar .list-group-item i{color:#64748b}
.dashboard-sidebar .list-group-item:hover{
  background:rgba(15,118,110,0.08);
  color:#0f766e;
  transform:none;
}
.dashboard-sidebar .list-group-item.active{
  color:var(--app-accent-strong);
  font-weight:600;
  position:relative;
}
.dashboard-sidebar .list-group-item.active i{color:var(--app-accent)}
.dashboard-sidebar .list-group-item.active::before{
  content:"";
  position:absolute;
  left:0;
  top:8px;
  bottom:8px;
  width:4px;
  border-radius:999px;
  background:var(--app-accent);
}
.dashboard-sidebar .menu-pin{opacity:0;transition:opacity .15s ease}
.dashboard-sidebar .list-group-item:hover .menu-pin{opacity:1}
.dashboard-sidebar .sidebar-footer{
  background:#ffffff;
  border-top:1px solid rgba(15,23,42,0.06);
  width:100%;
}
.dashboard-sidebar .sidebar-footer .sidebar-label{
  width:100%;
  flex:1 1 auto;
}
.dashboard-sidebar .sidebar-footer .d-flex{
  width:100%;
}
.sidebar-user-menu .sidebar-user-trigger{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.35rem;
  padding:.1rem 0;
  color:inherit;
  border:0;
  text-align:left;
}
.sidebar-user-menu .sidebar-user-content{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  align-items:center;
  gap:.55rem;
}
.sidebar-user-menu .sidebar-user-icon{
  flex:0 0 auto;
  line-height:1;
}
.sidebar-user-menu .sidebar-user-meta{
  min-width:0;
  line-height:1.15;
}
.sidebar-user-menu .sidebar-user-meta .small{
  margin-top:2px;
}
.sidebar-user-menu .sidebar-user-trigger:hover,
.sidebar-user-menu .sidebar-user-trigger:focus{
  color:inherit;
}
.sidebar-user-menu .sidebar-user-trigger.dropdown-toggle::after{
  display:none;
}
.sidebar-user-menu .dropdown-menu{
  min-width:0;
  border:1px solid rgba(15,23,42,0.08);
  border-radius:14px;
  padding:.4rem;
}
.sidebar-user-menu .dropdown-item{
  border-radius:10px;
  padding:.55rem .7rem;
  font-weight:600;
}
.sidebar-user-menu .sidebar-user-caret{
  color:#64748b;
  flex:0 0 auto;
  font-size:.72rem;
  line-height:1;
}
.dashboard-sidebar .sidebar-search .form-control{border-radius:999px}
.dashboard-sidebar .sidebar-search .input-group-text{border-radius:999px 0 0 999px}
html{scrollbar-color:rgba(100,116,139,0.6) transparent;scrollbar-width:thin}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{
  background:rgba(100,116,139,0.45);
  border-radius:999px;
  border:3px solid transparent;
  background-clip:padding-box;
}
*::-webkit-scrollbar-thumb:hover{background:rgba(100,116,139,0.7)}
.dashboard-sidebar .sidebar-scroll,
.offcanvas-body [data-sidebar-container],
.page-wrapper .page-body-wrapper .sidebar-wrapper #simple-bar{
  scrollbar-width:thin;
  scrollbar-color:rgba(100, 116, 139, 0.606) transparent;
}
.dashboard-sidebar .sidebar-scroll::-webkit-scrollbar,
.offcanvas-body [data-sidebar-container]::-webkit-scrollbar,
.page-wrapper .page-body-wrapper .sidebar-wrapper #simple-bar::-webkit-scrollbar{
  width:8px;
  height:8px;
}
.dashboard-sidebar .sidebar-scroll::-webkit-scrollbar-track,
.offcanvas-body [data-sidebar-container]::-webkit-scrollbar-track,
.page-wrapper .page-body-wrapper .sidebar-wrapper #simple-bar::-webkit-scrollbar-track{
  background:transparent;
}
.dashboard-sidebar .sidebar-scroll::-webkit-scrollbar-thumb,
.offcanvas-body [data-sidebar-container]::-webkit-scrollbar-thumb,
.page-wrapper .page-body-wrapper .sidebar-wrapper #simple-bar::-webkit-scrollbar-thumb{
  background:rgba(100,116,139,0);
  border-radius:999px;
  border:2px solid transparent;
  background-clip:padding-box;
  transition:background-color .2s ease;
}
.dashboard-sidebar .sidebar-scroll:hover::-webkit-scrollbar-thumb,
.offcanvas-body [data-sidebar-container]:hover::-webkit-scrollbar-thumb,
.page-wrapper .page-body-wrapper .sidebar-wrapper #simple-bar:hover::-webkit-scrollbar-thumb{
  background:rgba(100,116,139,0.6);
}
 .action-item.text-success i {
     color: #28a745;
}
 .action-item.text-danger i {
     color: #dc3545;
}
/* Footer Buttons */
 .custom-btn {
     padding: 0.5rem 1.5rem;
     border-radius: 6px;
     font-weight: 500;
     transition: all 0.2s ease;
}
 .custom-btn:hover {
     transform: translateY(-1px);
     box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.btn-primary {
     background-color: var(--cb-primary);
     border-color: var(--cb-primary);
}
.btn-primary:hover {
     background-color: var(--cb-primary-600);
     border-color: var(--cb-primary-600);
}
.btn{border-radius:8px}
.btn:focus{box-shadow:0 0 0 .2rem rgba(13,110,253,.25)}
.btn-outline-primary{color:var(--cb-primary);border-color:var(--cb-primary)}
.btn-outline-primary:hover{background:var(--cb-primary);color:#fff}
 .btn-outline-secondary {
     color: #6c757d;
     border-color: #6c757d;
}
 .btn-outline-secondary:hover {
     background-color: #6c757d;
     color: #fff;
}
.modal.right-slide .modal-dialog {
     position: fixed;
     right: 0;
     top: 0;
     margin: 0;
     height: 100%;
     transform: translateX(100%);
     transition: transform 0.3s ease-in-out;
}

/* Tables - Bootstrap .table refinements */
.table thead th{background:var(--cb-surface);border-bottom:1px solid var(--cb-border);text-transform:none;font-weight:600;color:#495057}
html[data-theme="dark"] .table thead th{color:#ced4da}
.table tbody tr:hover{background:rgba(0,0,0,.03)}
.table > :not(caption) > * > *{box-shadow:none}

/* Forms */
.form-control,.form-select{border-color:var(--cb-border);border-radius:8px;background:var(--cb-surface);color:inherit}
.form-control:focus,.form-select:focus{border-color:var(--cb-primary);box-shadow:0 0 0 .2rem rgba(13,110,253,.15)}
.input-group-text{border-color:var(--cb-border)}

/* Sidebar */
.sidebar-wrapper{background:var(--cb-surface)}
.sidebar-wrapper .sidebar-links .sidebar-list .sidebar-link{border-radius:8px;margin:2px 8px;padding:10px 12px}
.sidebar-wrapper .sidebar-links .sidebar-list .sidebar-link:hover{background:#eef2f7}
.sidebar-main-title h6{font-weight:700;color:#6c757d;text-transform:uppercase;letter-spacing:.5px}

/* Badges */
.badge-soft-primary{background:rgba(13,110,253,.15);color:#0b5ed7}
.badge-soft-success{background:rgba(25,135,84,.15);color:#157347}
.badge-soft-warning{background:rgba(255,193,7,.2);color:#946200}
.badge-soft-danger{background:rgba(220,53,69,.15);color:#b02a37}
.badge-soft-secondary{background:rgba(134,142,150,.18);color:#495057}

/* Skeleton loader utility */
.skeleton{position:relative;overflow:hidden;background:#e9ecef}
.skeleton::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);animation:skeleton 1.2s infinite}
@keyframes skeleton{to{transform:translateX(100%)}}

/* Chips */
.chip{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .5rem;border-radius:999px;background:#f1f3f5;color:#495057;font-size:.825rem}
.chip i{font-size:.9rem;color:#868e96}

/* Header profile nav improvements */
.profile-nav .user-name{max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .modal.right-slide.show .modal-dialog {
     transform: translateX(0);
}
 .modal.right-slide .modal-content {
     height: 100%;
     border-radius: 0;
     border: none;
}
 .modal-dialog.modal-lg {
     width: 80%;
}
.bg-light { background-color: #e9ecef !important; color: #212529; border-radius: 0 !important; }
html[data-theme="dark"] .bg-light { background:#21242b !important; color:#e9ecef; }
 .logo-wrapper img {
     max-width: 125px;
}
.logo-wrapper { border-bottom: 2px solid var(--cb-border); }
 .logo-icon-wrapper .img-fluid {
     max-width: 175px;
}
.table-responsive {
    min-height: 200px;
}
.footer{
    margin-left: 0 !important;
}
.modal-content { border-radius: 12px; overflow: hidden; box-shadow: 0 6px 24px rgba(0, 0, 0, 0.2); }
.modal.right-slide .modal-dialog { position: fixed; right: 0; margin: 0; height: 100%; transform: translateX(100%); transition: transform 0.3s ease-in-out; max-width: 700px; }
.modal.right-slide.show .modal-dialog { transform: translateX(0); }
.modal-header { background: #f8f9fa; border-bottom: 1px solid #e9ecef; padding: 1rem 1.25rem; }
.modal-title { font-weight: 600; font-size: 1.05rem; }
.summary-container { background: #fff; border: 1px solid #e0e0e0; border-radius: 8px; transition: box-shadow 0.2s ease, transform 0.2s ease; }
.summary-container:hover { box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); transform: translateY(-2px); }
.detail-item { display: flex; justify-content: space-between; padding: 8px 0; border-bottom: 1px dashed #ddd; }
.detail-item:last-child { border-bottom: none; }
.label { color: #6c757d; font-size: 0.9rem; }
.value { color: #212529; font-size: 0.92rem; font-weight: 500; text-align: right; }
.section-title { font-size: 0.95rem; color: #495057; font-weight: 600; margin-bottom: 0.75rem; border-left: 4px solid #198754; padding-left: 0.5rem; }
.action-item { background: #fff; border: 1px solid #e9ecef; border-radius: 6px; padding: 0.75rem 1rem; font-size: 0.9rem; transition: all 0.2s ease; display: flex; align-items: center; }
.action-item:hover { background: #f8f9fa; border-color: #198754; color: #198754; text-decoration: none; }
.action-item i { font-size: 1.1rem; }
#loading { min-height: 220px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #495057; }
.spinner-border { width: 2.5rem; height: 2.5rem; }
@media (max-width: 768px) { .modal.right-slide.show .modal-dialog { width: 100%; max-width: 100%; } .summary-container .col-md-6 { width: 100%; margin-bottom: 1rem; } }


@media (max-width: 576px) {
  .user-name {
    display: inline-block;
    max-width: 95px; 
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
  }
}

 .chip{
    display:inline-flex;align-items:center;gap:.4rem;
    background:#f8f9fa;border:1px solid #e9ecef;border-radius:999px;
    padding:.25rem .6rem;font-weight:500;
    cursor: pointer;
  }

/* Dashboard Sidebar */
.dashboard-sidebar{
    width: 272px;
    top: 0;
    left: 0;
    background-color: #fff;
    box-shadow: 0 0 20px rgba(15,23,42,.08);
    transition: width .3s ease, transform .3s ease;
    z-index: 1020;
}
.dashboard-sidebar .sidebar-header{
    background: rgba(248,249,250,.85);
}
.dashboard-sidebar .sidebar-logo-compact{
    max-height: 28px;
    display: none;
}
.dashboard-sidebar .sidebar-scroll{
    padding-top: .75rem;
    padding-bottom: 1.5rem;
}
.dashboard-sidebar .list-group{
    border-radius: 12px;
}
.dashboard-sidebar .list-group-item{
    border: 0;
    margin: 0;
    border-radius:0;
    background-color: transparent;
    color: #495057;
    transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.dashboard-sidebar .list-group-item:hover{
    background-color: #f8f9fa;
}
.dashboard-sidebar .list-group-item .bi{
    color: #6c757d;
}
.dashboard-sidebar .sidebar-footer{
    background: rgba(248,249,250,.85);
}
.sidebar-group-title{
    letter-spacing: .12em;
}

.page-wrapper .page-body-wrapper{
    margin-left: 272px;
    transition: margin-left .3s ease;
}

.sidebar-collapsed .dashboard-sidebar{
    width: 92px;
}
.sidebar-collapsed .dashboard-sidebar .sidebar-label,
.sidebar-collapsed .dashboard-sidebar .sidebar-group-title{
    display: none !important;
}
.sidebar-collapsed .dashboard-sidebar .sidebar-brand-copy{
    display: none !important;
}
.sidebar-collapsed .dashboard-sidebar .list-group-item{
    justify-content: center;
    padding-left: .75rem !important;
    padding-right: .75rem !important;
}
.sidebar-collapsed .dashboard-sidebar .sidebar-nav-link{
    gap: 0;
}
.sidebar-collapsed .dashboard-sidebar .list-group-item .bi{
    margin: 0;
}
.sidebar-collapsed .dashboard-sidebar .sidebar-logo-main{
    display: none;
}
.sidebar-collapsed .dashboard-sidebar .sidebar-logo-compact{
    display: inline-flex;
}
.sidebar-collapsed .dashboard-sidebar .sidebar-footer .sidebar-user-trigger{
    justify-content: center;
    padding-left: .5rem !important;
    padding-right: .5rem !important;
}
.sidebar-collapsed .dashboard-sidebar .sidebar-footer .sidebar-user-trigger > span{
    justify-content: center;
}
.sidebar-collapsed .dashboard-sidebar .sidebar-footer .sidebar-user-content{
    justify-content: center;
}
.sidebar-collapsed .dashboard-sidebar .sidebar-footer .sidebar-user-trigger .bi{
    margin-right: 0 !important;
}
.sidebar-collapsed .dashboard-sidebar .sidebar-footer .sidebar-user-caret{
    display: none;
}
.sidebar-collapsed .page-wrapper .page-body-wrapper{
    margin-left: 92px;
}

@media (max-width: 1199.98px){
    .dashboard-sidebar{
        transform: translateX(-100%);
    }
    .page-wrapper .page-body-wrapper{
        margin-left: 0;
    }
}


/* Header nav hit-area and transitions */
.page-wrapper .page-header .header-wrapper .nav-right>ul{gap:8px}
.page-wrapper .page-header .header-wrapper .nav-right>ul>li{padding:6px 8px;border-radius:8px}
.page-wrapper .page-header .header-wrapper .nav-right>ul>li:hover{background:rgba(0,0,0,.04)}
html[data-theme="dark"] .page-wrapper .page-header .header-wrapper .nav-right>ul>li:hover{background:rgba(255,255,255,.06)}
.nav-menus a,.nav-menus button{transition:background-color .15s ease,color .15s ease,box-shadow .15s ease}
.nav-menus button:focus-visible,.nav-menus a:focus-visible{outline:2px solid var(--cb-primary);outline-offset:2px}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  *{animation:none!important;transition:none!important}
}

/* =========================================================
   Enterprise Design System Layer (Global Override)
   Single source of truth for product-wide consistency.
   ========================================================= */
:root{
  --ux-bg:#f3f6fb;
  --ux-surface:#ffffff;
  --ux-surface-muted:#f8fafd;
  --ux-border:#dbe4ef;
  --ux-border-strong:#c8d6e7;
  --ux-text:#0f172a;
  --ux-text-muted:#66758a;
  --ux-primary:#2563eb;
  --ux-primary-strong:#1d4ed8;
  --ux-success:#059669;
  --ux-warning:#b45309;
  --ux-danger:#dc2626;
  --ux-radius-sm:10px;
  --ux-radius:14px;
  --ux-shadow-sm:0 2px 8px rgba(15,23,42,.06);
  --ux-shadow:0 10px 28px rgba(15,23,42,.08);
}

body.app-enterprise{
  background:var(--ux-bg);
  color:var(--ux-text);
  font-family:"Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-optical-sizing:auto;
  line-height:1.5;
}

.page-wrapper .page-body-wrapper{
  background:var(--ux-bg);
}

.page-wrapper .page-body-wrapper .page-body{
  padding:22px 22px 28px;
}

.app-topbar{
  position:fixed;
  inset:0 0 auto 0;
  z-index:1025;
  background:rgba(255,255,255,.93);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--ux-border);
}

.app-topbar .header-wrapper{
  min-height:72px;
  padding-inline:16px;
}

.app-topbar-divider{
  height:24px;
  border-left:1px solid var(--ux-border-strong);
}

.page-wrapper .page-header .header-wrapper .nav-right>ul>li{
  border-radius:10px;
}

/* Typography hierarchy */
h1,h2,h3,h4,h5,h6{
  color:var(--ux-text);
  letter-spacing:-.01em;
}

.page-title,
.card-title{
  font-weight:700;
}

small,.small,.text-muted{
  color:var(--ux-text-muted) !important;
}

/* Cards and sections */
.card{
  border:1px solid var(--ux-border);
  border-radius:var(--ux-radius);
  box-shadow:var(--ux-shadow-sm);
  overflow:hidden;
}

.card-header{
  background:linear-gradient(180deg,#fff,var(--ux-surface-muted));
  border-bottom:1px solid var(--ux-border);
  padding:.78rem .95rem;
}

.card-body{
  padding:.95rem;
}

/* Buttons */
.sidebar-group .btn{
  border-radius:0;
  font-weight:600;
  letter-spacing:.01em;
  min-height:38px;
}

.btn-primary{
  background:var(--ux-primary);
  border-color:var(--ux-primary);
  box-shadow:0 6px 16px rgba(37,99,235,.2);
}

.btn-primary:hover,
.btn-primary:focus{
  background:var(--ux-primary-strong);
  border-color:var(--ux-primary-strong);
}

.btn-outline-secondary{
  border-color:var(--ux-border-strong);
  color:#334155;
}

.btn-outline-secondary:hover{
  background:#f1f5f9;
  border-color:#b8c7d9;
  color:#0f172a;
}

/* Forms */
.form-label{
  font-size:.74rem;
  text-transform:uppercase;
  letter-spacing:.06em;
  font-weight:700;
  color:var(--ux-text-muted);
  margin-bottom:.36rem;
}

.form-control,
.form-select,
textarea.form-control{
  border:1px solid var(--ux-border-strong);
  border-radius:10px;
  min-height:40px;
  background:#fff;
}

.form-control:focus,
.form-select:focus,
textarea.form-control:focus{
  border-color:var(--ux-primary);
  box-shadow:0 0 0 3px rgba(37,99,235,.14);
}

.invalid-feedback{
  font-size:.78rem;
}

/* Table consistency (override legacy global table styles) */
.page-body table{
  border-collapse:separate;
  border-spacing:0;
  width:100%;
}

.page-body th,
.page-body td{
  background:transparent;
  border:0;
  padding:.7rem .75rem;
  text-align:left;
}

.table{
  --bs-table-bg:transparent;
  --bs-table-striped-bg:#f8fbff;
  --bs-table-hover-bg:#f1f6ff;
  margin-bottom:0;
}

.table thead th{
  position:sticky;
  top:0;
  z-index:1;
  background:#f8fbff;
  border-bottom:1px solid var(--ux-border);
  font-size:.76rem;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#475569;
}

.table tbody td{
  border-bottom:1px solid #edf2f8;
  font-size:.89rem;
  color:#1f2937;
}

.table-responsive{
  border-radius:12px;
  background:#fff;
}

/* Badges and chips */
.badge{
  border-radius:999px;
  padding:.38rem .62rem;
  font-weight:700;
  letter-spacing:.01em;
}

.chip{
  border-radius:999px;
  border:1px solid var(--ux-border);
  background:#f8fafc;
}

/* Alerts and notifications */
.alert{
  border-radius:12px;
  border:1px solid transparent;
}

.app-flash-stack{
  display:flex;
  flex-direction:column;
  gap:.68rem;
  margin-bottom:.95rem;
}

.app-flash{
  border:1px solid var(--ux-border);
  border-left-width:4px;
  border-radius:12px;
  box-shadow:0 8px 20px rgba(15,23,42,.06);
  background:#fff;
  padding:12px 14px;
  margin:0;
}

.app-flash.alert-success{ border-left-color:var(--ux-success); }
.app-flash.alert-danger{ border-left-color:var(--ux-danger); }
.app-flash.alert-warning{ border-left-color:var(--ux-warning); }
.app-flash.alert-primary{ border-left-color:var(--ux-primary); }

.app-flash__icon{
  width:34px;
  height:34px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#eef2ff;
  color:#334155;
  flex-shrink:0;
}

.app-flash.alert-success .app-flash__icon{ background:#dcfce7; color:#047857; }
.app-flash.alert-danger .app-flash__icon{ background:#fee2e2; color:#b91c1c; }
.app-flash.alert-warning .app-flash__icon{ background:#fef3c7; color:#92400e; }
.app-flash.alert-primary .app-flash__icon{ background:#dbeafe; color:#1d4ed8; }

.app-flash__title{
  font-size:.79rem;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-weight:800;
  color:#334155;
  margin-bottom:2px;
}

.app-flash__message{
  font-size:.9rem;
  color:#1f2937;
  font-weight:600;
}

.app-flash--inline{
  margin:1rem;
}

/* Empty, loading and state helpers */
.app-empty-state{
  border:1px dashed var(--ux-border-strong);
  border-radius:12px;
  background:#fbfdff;
  padding:1.1rem;
  text-align:center;
  color:var(--ux-text-muted);
}

.app-section-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:.65rem;
}

.app-section-head__title{
  font-size:1rem;
  font-weight:800;
  color:var(--ux-text);
}

.app-section-head__meta{
  font-size:.8rem;
  color:var(--ux-text-muted);
}

/* Accessibility */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:2px solid var(--ux-primary);
  outline-offset:2px;
}

.btn:disabled,
.form-control:disabled,
.form-select:disabled{
  opacity:.65;
  cursor:not-allowed;
}

/* Compact mobile rhythm */
@media (max-width: 991.98px){
  .page-wrapper .page-body-wrapper .page-body{
    padding:14px;
  }
  .app-topbar .header-wrapper{
    min-height:64px;
    padding-inline:12px;
  }
  .card-body{
    padding:.82rem;
  }
}

/* =========================================================
   App Shell Layout Contract
   Fixes header/sidebar overlap and keeps all breakpoints aligned.
   ========================================================= */
.app-enterprise{
  --shell-header-h:72px;
  --shell-sidebar-w:272px;
  --shell-sidebar-w-collapsed:92px;
}

.app-enterprise .page-wrapper{
  min-height:100vh;
}

.app-enterprise .page-wrapper .app-topbar{
  left:18px;
  position:sticky;
  top:0;
  width:calc(100% - var(--shell-sidebar-w));
  height:var(--shell-header-h);
  z-index:1030;
  border-bottom:1px solid var(--ux-border);
}

.app-enterprise .page-wrapper .app-topbar .header-wrapper{
  --bs-gutter-x:0;
  margin-left:0;
  margin-right:0;
  height:100%;
  min-height:var(--shell-header-h);
  padding-inline:16px;
}

.app-enterprise .page-wrapper .page-body-wrapper{
  margin-left:var(--shell-sidebar-w) !important;
  margin-top:0 !important;
  min-height:100vh;
  transition:margin-left .25s ease;
}

.app-enterprise .page-wrapper .page-body-wrapper .page-body{
  min-height:calc(100vh - 56px);
}

.app-enterprise .dashboard-sidebar{
  position:fixed;
  top:0;
  left:0;
  width:var(--shell-sidebar-w);
  height:100vh;
  z-index:1020;
  overflow:hidden;
}

.app-enterprise .dashboard-sidebar .sidebar-header{
  min-height:var(--shell-header-h);
  height:var(--shell-header-h);
  display:flex;
  align-items:center;
}

.app-enterprise .dashboard-sidebar .sidebar-body{
  min-height:calc(100vh - var(--shell-header-h));
  max-height:calc(100vh - var(--shell-header-h));
}

.app-enterprise .dashboard-sidebar .sidebar-scroll{
  height:100%;
  width: 100%;
  overflow-y:auto;
}

.app-enterprise.sidebar-collapsed .dashboard-sidebar{
  width:var(--shell-sidebar-w-collapsed);
}

.app-enterprise.sidebar-collapsed .page-wrapper .app-topbar{
  left:var(--shell-sidebar-w-collapsed);
  width:calc(100% - var(--shell-sidebar-w-collapsed));
}

.app-enterprise.sidebar-collapsed .page-wrapper .page-body-wrapper{
  margin-left:var(--shell-sidebar-w-collapsed) !important;
}

/* Layouts without desktop sidebar must keep full-width topbar/content */
.app-enterprise.app-no-sidebar .page-wrapper .app-topbar{
  left:0;
  width:100%;
}

.app-enterprise.app-no-sidebar .page-wrapper .page-body-wrapper{
  margin-left:0 !important;
}

/* Mobile and tablet: sidebar becomes off-canvas drawer */
@media (max-width: 1199.98px){
  .app-enterprise{
    --shell-header-h:64px;
  }

  .app-enterprise .app-mobile-topbar{
    position:sticky;
    top:0;
    z-index:1030;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:var(--shell-header-h);
    padding:10px 16px;
    background:rgba(255,255,255,0.94);
    border-bottom:1px solid rgba(15,23,42,0.08);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
  }

  .app-enterprise .app-mobile-topbar__brand{
    display:flex;
    align-items:center;
    flex:1 1 auto;
  }

  .app-enterprise .page-wrapper .app-topbar{
    left:0;
    width:100%;
  }

  .app-enterprise .page-wrapper .page-body-wrapper{
    margin-left:0 !important;
  }

  .app-enterprise .dashboard-sidebar{
    transform:translateX(-100%);
  }
}

/* Keep mobile drawer above header with proper backdrop layering */
#sidebarOffcanvas{
  z-index:1045 !important;
}

.offcanvas-backdrop.show{
  z-index:1040 !important;
  opacity:.42;
}

/* Header action sizing should never inherit full-width mobile button rules */
.app-enterprise .app-topbar .btn{
  width:auto;
  margin:0;
}

.app-mobile-topbar{
  display:none;
}

.app-mobile-topbar__brand{
  min-width:0;
}

.app-mobile-topbar__logo{
  display:block;
  width:auto;
  height:40px;
  max-width:min(58vw, 180px);
  object-fit:contain;
  object-position:left center;
}

.app-mobile-nav-toggle{
  z-index:1035;
  flex:0 0 auto;
}

#sidebarOffcanvas.sidebar-mobile-drawer{
  width:min(88vw, 340px);
  border-right:0;
  background:linear-gradient(180deg,#fbfdff 0%,#f4f8fb 100%);
  box-shadow:0 24px 56px rgba(15,23,42,0.22);
}

#sidebarOffcanvas.sidebar-mobile-drawer .offcanvas-header{
  padding:18px 18px 14px;
  align-items:flex-start;
  background:linear-gradient(180deg,#ffffff 0%,#f7fbff 100%);
  border-bottom:1px solid rgba(15,23,42,0.08);
}

.sidebar-mobile-drawer__brand{
  display:flex;
  align-items:center;
  flex:1 1 auto;
  min-width:0;
}

.sidebar-mobile-user-summary .min-w-0{
  min-width:0;
}

/* =========================================================
   CheckInBuddy Brand Polish
   Minimal shell-only refinement: colors, top bar, sidebar.
   ========================================================= */
:root{
  --app-bg:#F8FAFC;
  --app-surface:#FFFFFF;
  --app-ink:#0F172A;
  --app-muted:#64748B;
  --app-accent:#2457FF;
  --app-accent-strong:#1D46CC;
  --app-accent-soft:#EEF3FF;
  --ux-bg:#F8FAFC;
  --ux-surface:#FFFFFF;
  --ux-surface-muted:#F1F5F9;
  --ux-border:#E2E8F0;
  --ux-border-strong:#CBD5E1;
  --ux-text:#0F172A;
  --ux-text-muted:#64748B;
  --ux-body:#334155;
  --ux-primary:#2457FF;
  --ux-primary-strong:#1D46CC;
  --ux-primary-soft:#EEF3FF;
  --ux-success:#16A34A;
  --ux-warning:#D97706;
  --ux-danger:#DC2626;
  --ux-shadow-sm:0 2px 10px rgba(15,23,42,.04);
  --ux-shadow:0 12px 28px rgba(15,23,42,.06);
  --cb-primary:#2457FF;
  --cb-primary-600:#1D46CC;
  --cb-surface:#FFFFFF;
  --cb-border:#E2E8F0;
}

body.app-enterprise{
  background:var(--ux-bg);
  color:var(--ux-body);
}

.app-enterprise .page-wrapper .page-body-wrapper{
  padding-top:0;
  background:var(--ux-bg);
}

.app-enterprise .page-wrapper .page-body-wrapper .page-body{
  min-height:calc(100vh - var(--shell-header-h));
  padding:22px 22px 28px;
}

@media (min-width: 1200px){
  .app-enterprise .page-wrapper .page-body-wrapper .page-body{
    margin-top: 0 !important;
  }
}

.app-enterprise .page-wrapper .app-topbar{
  position:fixed;
  top:0;
  width:calc(100% - var(--shell-sidebar-w));
  height:var(--shell-header-h);
  background:rgba(255,255,255,.97);
  border-bottom:1px solid var(--ux-border);
  box-shadow:0 1px 0 rgba(15,23,42,.03), 0 8px 24px rgba(15,23,42,.03);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.app-enterprise.sidebar-collapsed .page-wrapper .app-topbar{
  left:var(--shell-sidebar-w-collapsed);
  width:calc(100% - var(--shell-sidebar-w-collapsed));
}

.app-topbar .header-wrapper{
  padding-inline:24px;
}

.app-topbar__inner{
  height:100%;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:1.25rem;
}

.app-topbar__actions{
  display:flex;
  align-items:center;
  min-width:0;
}

.app-topbar__actions{
  justify-content:flex-end;
  gap:.9rem;
  flex:0 0 auto;
  margin-left:auto;
}

.app-topbar__workspace {
    display: flex;
    align-items: center;
    gap: .7rem;
    min-height: 46px;
    padding: .45rem .8rem .45rem .5rem;
}

.app-topbar__workspace-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:var(--ux-primary-soft);
  color:var(--ux-primary);
}

.app-topbar__workspace-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  line-height:1.05;
}

.app-topbar__workspace-copy small{
  color:var(--ux-text-muted);
  font-size:.68rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.app-topbar__workspace-copy strong{
  color:var(--ux-text);
  font-size:.84rem;
  font-weight:700;
  white-space:nowrap;
}

.app-topbar__account{
  display:inline-flex;
  align-items:center;
  gap:.7rem;
  min-height:46px;
  padding:.35rem .6rem .35rem .35rem;
  border-radius:16px;
  border:0;
  background:var(--ux-surface);
  color:var(--ux-text);
  box-shadow:0;
  transition:border-color .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.app-topbar__account:hover,
.app-topbar__account:focus{
  border-color:rgba(36,87,255,.18);
  color:var(--ux-text);
  background:#fff;
  box-shadow:var(--ux-shadow);
}

.app-topbar__avatar{
  width:36px;
  height:36px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--ux-primary);
  color:#FFFFFF;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.04em;
}

.app-topbar__user-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  line-height:1.05;
  text-align:left;
}

.app-topbar__user-copy strong{
  color:var(--ux-text);
  font-size:.84rem;
  font-weight:700;
  white-space:nowrap;
}

.app-topbar__user-copy small{
  color:var(--ux-text-muted);
  font-size:.72rem;
  font-weight:600;
}

.app-topbar__account-caret{
  color:#94A3B8;
  font-size:.76rem;
}

.app-topbar__menu{
  min-width:15rem;
  padding:.45rem;
  border:1px solid var(--ux-border);
  border-radius:18px;
  box-shadow:0 18px 36px rgba(15,23,42,.08);
}

.app-topbar__menu-head{
  display:flex;
  flex-direction:column;
  gap:.18rem;
  padding:.45rem .45rem .65rem;
}

.app-topbar__menu-head strong{
  color:var(--ux-text);
  font-size:.88rem;
  font-weight:800;
}

.app-topbar__menu-head span{
  color:var(--ux-text-muted);
  font-size:.78rem;
  font-weight:600;
}

.app-topbar__menu .dropdown-item{
  border-radius:12px;
  padding:.72rem .8rem;
  font-size:.86rem;
  font-weight:600;
}

.app-topbar__menu .dropdown-item:hover{
  background:var(--ux-surface-muted);
  color:var(--ux-text);
}

.app-enterprise .dashboard-sidebar{
  background:var(--ux-surface);
  border-right:1px solid var(--ux-border);
  box-shadow:none;
}

.app-enterprise .dashboard-sidebar .sidebar-header,
.app-enterprise .dashboard-sidebar .sidebar-footer{
  background:var(--ux-surface);
  border-color:rgba(15,23,42,.08) !important;
}

.sidebar-brand{
  position:relative;
  min-width:0;
  flex:1 1 auto;
  max-width:100%;
  gap:.82rem !important;
  padding:.3rem .35rem;
  border-radius:18px;
  transition:background-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.sidebar-brand:hover{
  background:rgba(36,87,255,.06);
  box-shadow:inset 0 0 0 1px rgba(36,87,255,.08);
  transform:translateX(1px);
}

.sidebar-logo-main{
  display:block;
  flex:0 0 46px;
  width:46px;
  height:46px;
  max-width:46px;
  max-height:46px;
  object-fit:contain;
  object-position:center;
  border-radius:16px;
  background:transparent;
  border:0;
  padding:0;
  filter:drop-shadow(0 10px 18px rgba(36,87,255,.16)) drop-shadow(0 2px 6px rgba(15,23,42,.08));
}

.sidebar-logo-compact{
  width:34px;
  height:34px;
  max-width:34px;
  max-height:34px;
  object-fit:contain;
  object-position:center;
  border-radius:12px;
  background:var(--ux-surface-muted);
  border:1px solid var(--ux-border);
  padding:.28rem;
}

.sidebar-brand-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:.22rem;
  height:auto;
  line-height:1;
}

.sidebar-brand-kicker{
  display:inline-flex;
  align-items:center;
  font-size:.64rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ux-primary);
}


.sidebar-brand-name{
  color:var(--ux-text);
  font-size:1rem;
  font-weight:800;
  letter-spacing:-.035em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.dashboard-sidebar .sidebar-group-toggle{
  background:var(--ux-surface-muted);
  border:1px solid var(--ux-border);
  color:var(--ux-text-muted);
}

.dashboard-sidebar .sidebar-group-toggle:hover{
  background:var(--ux-primary-soft);
  border-color:rgba(36,87,255,.14);
  color:var(--ux-primary);
}

.dashboard-sidebar .sidebar-group-toggle::after{
  background:linear-gradient(90deg, rgba(36,87,255,.08), transparent);
}

.dashboard-sidebar .sidebar-group-toggle .badge{
  background:#FFFFFF !important;
  border-color:var(--ux-border) !important;
  color:var(--ux-text-muted) !important;
}

.dashboard-sidebar .list-group-item{
  border:1px solid transparent;
  color:var(--ux-body);
}

.dashboard-sidebar .list-group-item .bi,
.dashboard-sidebar .menu-pin,
.sidebar-user-menu .sidebar-user-caret{
  color:var(--ux-text-muted);
}

.dashboard-sidebar .list-group-item:hover{
  background:var(--ux-surface-muted);
  border-color:var(--ux-border);
  color:var(--ux-text);
}

.dashboard-sidebar .list-group-item:hover .bi,
.dashboard-sidebar .list-group-item:hover .menu-pin{
  color:var(--ux-primary);
}

.dashboard-sidebar .list-group-item.active{
  background:var(--ux-primary-soft);
  border-color:rgba(36,87,255,.14);
  color:var(--ux-primary);
  font-weight:700;
}

.dashboard-sidebar .list-group-item.active i{
  color:var(--ux-primary);
}

.dashboard-sidebar .list-group-item.active::before{
  left:6px;
  top:9px;
  bottom:9px;
  width:3px;
  background:var(--ux-primary);
}

.sidebar-group{
  margin-top:0 !important;
}

.sidebar-user-menu .sidebar-user-trigger{
  padding:.2rem 0;
}

.sidebar-user-menu .dropdown-menu{
  border:1px solid var(--ux-border);
  box-shadow:var(--ux-shadow);
}

.sidebar-user-menu .dropdown-item:hover{
  background:var(--ux-surface-muted);
  color:var(--ux-text);
}

.app-enterprise .app-mobile-topbar{
  background:rgba(255,255,255,.98);
  border-bottom:1px solid var(--ux-border);
  box-shadow:0 1px 0 rgba(15,23,42,.03);
}

.app-mobile-nav-toggle{
  border:1px solid var(--ux-border);
  color:var(--ux-text);
  background:var(--ux-surface);
}

.app-mobile-nav-toggle:hover,
.app-mobile-nav-toggle:focus{
  border-color:rgba(36,87,255,.18);
  color:var(--ux-primary);
  background:var(--ux-primary-soft);
}

#sidebarOffcanvas.sidebar-mobile-drawer{
  display:flex;
  flex-direction:column;
  height:100vh;
  height:100dvh;
  max-height:100vh;
  max-height:100dvh;
  background:var(--ux-surface);
  box-shadow:0 18px 40px rgba(15,23,42,.12);
  overflow:hidden;
}

#sidebarOffcanvas.sidebar-mobile-drawer .offcanvas-header{
  flex:0 0 auto;
  background:var(--ux-surface);
  border-bottom:1px solid var(--ux-border);
}

@media (max-width: 1199.98px){
  .app-enterprise .page-wrapper .page-body-wrapper{
    padding-top:0;
  }

  .app-enterprise .page-wrapper .page-body-wrapper .page-body{
    min-height:auto;
  }
}

.sidebar-mobile-drawer__logo{
  display:block;
  width:auto;
  max-width:min(68vw, 208px);
  height:40px;
  max-height:40px;
  flex:0 1 auto;
  object-fit:contain;
  object-position:left center;
  background:transparent;
  border:0;
}

.sidebar-mobile-drawer__logo-fallback{
  width:44px;
  height:44px;
  border-radius:14px;
  flex:0 0 44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  letter-spacing:.04em;
  color:#0f172a;
  background:linear-gradient(135deg,#e0f2fe 0%,#dbeafe 100%);
  border:1px solid rgba(96,165,250,0.2);
}

.sidebar-mobile-drawer__body{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  background:transparent;
  min-height:0;
  overflow:hidden;
}

.sidebar-mobile-drawer__nav{
  flex:1 1 auto;
  min-height:0;
  width:100%;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:12px 6px 16px !important;
}

#sidebarOffcanvas .sidebar-group{
  margin-top:0px !important;
}

#sidebarOffcanvas .sidebar-group-toggle,
#sidebarOffcanvas .sidebar-group-toggle--mobile{
  min-height:46px;
  padding:12px 14px !important;
  border-radius:0;
  background:rgba(255,255,255,0.82);
  border:1px solid rgba(148,163,184,0.18);
  box-shadow:0 8px 18px rgba(15,23,42,0.06);
  color:#334155;
}

#sidebarOffcanvas .sidebar-group-toggle:hover,
#sidebarOffcanvas .sidebar-group-toggle:focus{
  background:#ffffff;
  color:#0f172a;
}

#sidebarOffcanvas .sidebar-group-toggle .badge{
  background:#fff !important;
  border:1px solid rgba(148,163,184,0.18) !important;
  color:#64748b !important;
  font-weight:700;
}

#sidebarOffcanvas .sidebar-group [data-menu-group-items]{
  padding-top:8px;
}

#sidebarOffcanvas .list-group-item{
  margin:0;
  border-radius:16px;
  padding-left:10px;
  padding-right:10px;
}

#sidebarOffcanvas .sidebar-nav-link,
#sidebarOffcanvas .sidebar-nav-link--mobile{
  min-height:50px;
  padding-top:5px !important;
  padding-bottom:5px !important;
  padding-left:14px;
  padding-right:14px;
  border-radius:16px;
  background:transparent;
  border:1px solid transparent;
}

#sidebarOffcanvas .sidebar-nav-link__icon{
  width:1.25rem;
  flex:0 0 1.25rem;
}

#sidebarOffcanvas .menu-pin-wrapper{
  display:inline-flex;
  align-items:center;
  flex:0 0 auto;
  margin-left:auto;
}

#sidebarOffcanvas .menu-pin{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 !important;
  border-radius:999px;
  opacity:1 !important;
  background:rgba(255,255,255,0.82);
}

#sidebarOffcanvas .menu-pin i{
  color:currentColor;
}

#sidebarOffcanvas .sidebar-nav-link:hover{
  background:rgba(37,99,235,0.06);
  border-color:rgba(37,99,235,0.12);
  color:#1d4ed8;
}

#sidebarOffcanvas .list-group-item.active{
  background:linear-gradient(135deg,#eef6ff 0%,#e6f4ea 100%);
  border:1px solid rgba(37,99,235,0.16);
  color:#0f172a;
  box-shadow:0 10px 20px rgba(37,99,235,0.08);
}

#sidebarOffcanvas .list-group-item.active .sidebar-nav-link__icon{
  color:#2563eb;
}

#sidebarOffcanvas .list-group-item.active::before{
  left:8px;
  top:10px;
  bottom:10px;
}

#sidebarOffcanvas .sidebar-group-toggle .sidebar-chevron{
  color:#64748b;
}

#sidebarOffcanvas .sidebar-pins .sidebar-group-toggle{
  background:linear-gradient(135deg,rgba(250,245,255,0.92) 0%,rgba(255,251,235,0.92) 100%);
  border-color:rgba(217,119,6,0.16);
}

#sidebarOffcanvas .sidebar-mobile-drawer__footer{
  position:relative;
  margin-top:auto;
  flex:0 0 auto;
  width:100%;
  padding:10px 10px calc(env(safe-area-inset-bottom, 0px) + 10px) !important;
  background:linear-gradient(180deg,rgba(248,250,252,0.18) 0%,rgba(255,255,255,0.96) 18%,#ffffff 100%);
  border-top:1px solid rgba(15,23,42,0.08) !important;
  box-shadow:0 -10px 24px rgba(15,23,42,0.05);
}

.sidebar-mobile-user-card{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  background:linear-gradient(180deg,rgba(255,255,255,0.98) 0%,rgba(248,250,252,0.98) 100%);
  padding:12px;
  border:1px solid rgba(148,163,184,0.16);
  border-radius:18px;
  box-shadow:0 -12px 28px rgba(15,23,42,0.05);
}

.sidebar-mobile-user-summary{
  display:flex;
  align-items:center;
  flex:1 1 auto;
  gap:12px;
  min-width:0;
  padding:10px 12px;
  border-radius:16px;
  background:linear-gradient(135deg,rgba(239,246,255,0.96) 0%,rgba(248,250,252,0.96) 100%);
  border:1px solid rgba(191,219,254,0.6);
}

.sidebar-mobile-user-avatar{
  width:46px;
  height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:.98rem;
  line-height:1;
  font-weight:800;
  letter-spacing:.06em;
  color:#1d4ed8;
  flex:0 0 46px;
  border-radius:14px;
  border:1px solid rgba(96,165,250,0.24);
  background:linear-gradient(135deg,rgba(219,234,254,1) 0%,rgba(224,242,254,0.94) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.65);
}

.sidebar-mobile-user-copy{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
  flex:1 1 auto;
}

.sidebar-mobile-user-line{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
}

.sidebar-mobile-user-line > *{
  min-width:0;
}

.sidebar-mobile-user-separator{
  flex:0 0 auto;
  color:#94a3b8;
  font-size:.72rem;
}

.sidebar-mobile-user-kicker{
  font-size:.67rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#64748b;
  margin-bottom:2px;
}

.sidebar-mobile-user-name{
  flex:0 1 auto;
  font-size:.94rem;
  font-weight:800;
  color:#0f172a;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.sidebar-mobile-user-property-inline{
  flex:1 1 auto;
  font-size:.78rem;
  font-weight:600;
  color:#64748b;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.sidebar-mobile-user-property{
  margin-top:3px;
  display:flex;
  align-items:center;
  gap:6px;
  font-size:.74rem;
  color:#64748b;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.sidebar-mobile-user-property i{
  flex:0 0 auto;
  color:#2563eb;
}

.sidebar-mobile-user-property span{
  overflow:hidden;
  text-overflow:ellipsis;
}

.sidebar-mobile-user-card .dropup{
  flex:0 0 auto;
}

.sidebar-mobile-user-menu{
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border-radius:14px;
  border:1px solid rgba(148,163,184,0.24);
  background:#ffffff;
  color:#475569;
  box-shadow:0 8px 18px rgba(15,23,42,0.06);
  transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease;
}

.sidebar-mobile-user-menu:hover,
.sidebar-mobile-user-menu:focus,
.sidebar-mobile-user-menu.show{
  background:#eff6ff;
  border-color:rgba(96,165,250,0.34);
  color:#1d4ed8;
  box-shadow:0 10px 22px rgba(37,99,235,0.12);
}

.sidebar-mobile-user-menu i{
  font-size:1.05rem;
  line-height:1;
}

.sidebar-mobile-user-dropdown{
  min-width:190px;
  padding:8px;
  margin-bottom:10px !important;
  border:1px solid rgba(226,232,240,0.92);
  border-radius:16px;
  box-shadow:0 20px 44px rgba(15,23,42,0.16);
}

.sidebar-mobile-user-dropdown .dropdown-item{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:42px;
  border-radius:12px;
  font-weight:700;
  color:#0f172a;
}

.sidebar-mobile-user-dropdown .dropdown-item:hover,
.sidebar-mobile-user-dropdown .dropdown-item:focus{
  background:#f8fafc;
}

.sidebar-mobile-user-dropdown__icon{
  width:28px;
  height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 28px;
  border-radius:999px;
  background:rgba(37,99,235,0.1);
  color:#1d4ed8;
}

.sidebar-mobile-user-dropdown__danger{
  color:#b91c1c !important;
}

.sidebar-mobile-user-dropdown__danger .sidebar-mobile-user-dropdown__icon{
  background:rgba(239,68,68,0.1);
  color:#dc2626;
}

.sidebar-mobile-user-dropdown__danger:hover,
.sidebar-mobile-user-dropdown__danger:focus{
  background:linear-gradient(180deg,#fff7f7 0%,#fff1f2 100%) !important;
  color:#991b1b !important;
}

.sidebar-mobile-user-dropdown .dropdown-divider{
  margin:8px 4px;
  border-top-color:rgba(226,232,240,0.9);
}

.sidebar-mobile-user-actions{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
  margin-top:0;
  visibility:visible;
  opacity:1;
}

.sidebar-mobile-user-actions > *{
  min-width:0;
}

.sidebar-mobile-user-actions .btn{
  width:100%;
  min-height:46px;
  padding:0 12px;
  border-radius:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-weight:700;
  font-size:.82rem;
  line-height:1;
  white-space:nowrap;
}

.sidebar-mobile-action{
  border:1px solid transparent;
  transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease;
}

.sidebar-mobile-action__icon{
  width:28px;
  height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  flex:0 0 28px;
  font-size:.92rem;
}

.sidebar-mobile-action--profile{
  border-color:rgba(148,163,184,0.2);
  background:#f8fafc;
  color:#0f172a;
  box-shadow:0 8px 18px rgba(15,23,42,0.05);
}

.sidebar-mobile-action--profile .sidebar-mobile-action__icon{
  background:rgba(37,99,235,0.1);
  color:#1d4ed8;
}

.sidebar-mobile-action--logout{
  border-color:rgba(248,113,113,0.2);
  background:linear-gradient(180deg,#fff7f7 0%,#fff1f2 100%);
  color:#b91c1c;
  box-shadow:0 8px 18px rgba(239,68,68,0.08);
}

.sidebar-mobile-action--logout .sidebar-mobile-action__icon{
  background:rgba(239,68,68,0.1);
  color:#dc2626;
}

.sidebar-mobile-action:hover,
.sidebar-mobile-action:focus{
  box-shadow:0 10px 22px rgba(15,23,42,0.08);
}

.sidebar-mobile-action--profile:hover,
.sidebar-mobile-action--profile:focus{
  border-color:rgba(96,165,250,0.34);
  background:#eff6ff;
  color:#0f172a;
}

.sidebar-mobile-action--logout:hover,
.sidebar-mobile-action--logout:focus{
  border-color:rgba(248,113,113,0.28);
  background:linear-gradient(180deg,#fff1f2 0%,#ffe4e6 100%);
  color:#991b1b;
}

.sidebar-mobile-user-actions form{
  display:block;
  min-width:0;
  width:100%;
}

.app-enterprise .app-mobile-nav-toggle{
  width:46px;
  height:46px;
  padding:0;
  font-size:1.2rem;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:#ffffff !important;
  background-color:#ffffff !important;
  color:#0f172a !important;
  opacity:1 !important;
  backdrop-filter:blur(10px);
}

.app-enterprise .app-mobile-nav-toggle:hover,
.app-enterprise .app-mobile-nav-toggle:focus{
  background:#ffffff !important;
  background-color:#ffffff !important;
  color:#0f172a !important;
}

@media (max-width: 575.98px){
  .app-mobile-topbar{
    padding:10px 12px;
  }

  .app-mobile-topbar__logo{
    height:36px;
    max-width:min(62vw, 156px);
  }

  #sidebarOffcanvas.sidebar-mobile-drawer{
    width:min(92vw, 340px);
  }

  #sidebarOffcanvas.sidebar-mobile-drawer .offcanvas-header{
    padding:16px 16px 12px;
  }

  .sidebar-mobile-drawer__nav{
    padding:10px 4px 12px !important;
  }

  .sidebar-mobile-drawer__footer{
    padding:8px 8px calc(env(safe-area-inset-bottom, 0px) + 8px) !important;
  }

  .sidebar-mobile-user-card{
    padding:11px 10px;
  }

  .sidebar-mobile-user-summary{
    padding:10px;
  }

  .sidebar-mobile-user-avatar{
    width:42px;
    height:42px;
    flex-basis:42px;
    font-size:.9rem;
  }

  .sidebar-mobile-user-menu{
    width:40px;
    height:40px;
  }

  .sidebar-mobile-user-dropdown{
    min-width:176px;
  }
}

@media (max-width: 767.98px){
  .app-enterprise .page-wrapper.compact-wrapper .page-body-wrapper .page-body{
    width:100%;
    margin-left:0;
    padding-left:0;
    padding-right:0;
  }
}
 .table-responsive{
     width: 100%;
     max-width: 100%;
     overflow-x: auto;
     overflow-y: hidden;
     -webkit-overflow-scrolling: touch;
}
 .table-responsive > .table,
 .table-responsive > table{
     margin-bottom: 0;
     min-width: 100%;
}
 img,
 svg,
 canvas,
 video{
     max-width:100%;
     height:auto;
}