:root {
  --bs-body-bg: #f3f5fa;
  --sidebar-w: 248px;
  --sidebar-bg: #ffffff;
  --brand: #0d6efd;
  --brand-soft: #eef3ff;
}

html, body { -webkit-tap-highlight-color: transparent; }
body { padding-bottom: env(safe-area-inset-bottom); }

/* ---------- PWA splash ---------- */
.pwa-splash {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: grid;
  place-items: center;
  background: #0d6efd;
  color: #fff;
  opacity: 1;
  transition: opacity .32s ease, visibility .32s ease;
}
.pwa-splash.is-hiding { opacity: 0; visibility: hidden; }
.pwa-splash-inner { display: grid; gap: 1rem; place-items: center; }
.pwa-splash img { width: 96px; height: 96px; border-radius: 24px; box-shadow: 0 18px 50px rgba(15,23,42,.25); }
.pwa-splash-title { font-size: 1.35rem; font-weight: 700; }

/* ---------- Cards / forms ---------- */
.card { border: 0; border-radius: 14px; box-shadow: 0 1px 3px rgba(15,23,42,.06); }
.card .card-header { border-radius: 14px 14px 0 0; }
.form-control, .form-select { font-size: 1rem; min-height: 44px; border-radius: 10px; }
.form-control:focus, .form-select:focus { box-shadow: 0 0 0 .2rem rgba(13,110,253,.15); }
.btn { min-height: 44px; border-radius: 10px; }
.btn-sm { min-height: 36px; border-radius: 8px; }
.btn-link { min-height: auto; }
.table thead th { white-space: nowrap; font-weight: 600; color: #475569; font-size: .85rem; text-transform: uppercase; letter-spacing: .03em; }
.table > :not(caption) > * > * { padding: .8rem .75rem; }
.table-card { overflow: hidden; }
.badge { font-weight: 500; padding: .4em .65em; }
.app-list-tabs { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; }
.app-list-tabs .nav-link { white-space: nowrap; }

/* ---------- Sidebar layout (desktop ≥ lg) ---------- */
.app-shell { width: 100%; }
.app-content { max-width: 1200px; }

@media (min-width: 992px) {
  body.has-sidebar .app-shell { padding-left: var(--sidebar-w); }
  .app-sidebar.offcanvas-lg {
    position: fixed;
    top: 0;
    left: 0;
    width: var(--sidebar-w);
    height: 100vh;
    background: var(--sidebar-bg);
    border-right: 1px solid #e5e7eb;
    box-shadow: 0 1px 2px rgba(15,23,42,.04);
    z-index: 1030;
    display: flex;
    flex-direction: column;
    transform: none !important;
    visibility: visible !important;
  }
  .app-sidebar .offcanvas-body { overflow-y: auto; }
  .app-navbar { padding-left: var(--sidebar-w); }
  .app-footer { padding-left: var(--sidebar-w); }
  .app-content { padding-left: 1.25rem; padding-right: 1.25rem; }
}

/* Sidebar nav items */
.sidebar-nav .list-group-item {
  border: 0;
  border-left: 3px solid transparent;
  padding: .75rem 1rem;
  color: #334155;
  font-weight: 500;
  background: transparent;
}
.sidebar-nav .list-group-item:hover { background: #f8fafc; color: var(--brand); }
.sidebar-nav .list-group-item.active-link {
  background: var(--brand-soft);
  color: var(--brand);
  border-left-color: var(--brand);
}
.sidebar-nav .list-group-item i { width: 1.25rem; text-align: center; }
.sidebar-user .avatar { width: 38px; height: 38px; }

/* ---------- Mobile tweaks ---------- */
@media (max-width: 575.98px) {
  .table-card .table { font-size: .9rem; }
  .hide-sm { display: none !important; }
  .app-content { padding-left: .75rem; padding-right: .75rem; }
}

/* ---------- Notifications dropdown ---------- */
.notif-menu { width: 340px; max-width: 92vw; padding: 0; border: 0; border-radius: 12px; }
.notif-list { max-height: 60vh; overflow-y: auto; }
.notif-item {
  display: flex; gap: .6rem; padding: .65rem .9rem;
  border-bottom: 1px solid #f1f5f9;
  text-decoration: none; color: inherit;
  align-items: flex-start;
}
.notif-item:last-child { border-bottom: 0; }
.notif-item:hover { background: #f8fafc; }
.notif-item.unread { background: var(--brand-soft); }
.notif-item .notif-icon {
  width: 32px; height: 32px; border-radius: 50%;
  display:flex; align-items:center; justify-content:center;
  background:#e0e7ff; color: var(--brand); flex-shrink: 0;
}
.notif-item .notif-body { min-width: 0; flex-grow: 1; }
.notif-item .notif-title { font-weight: 600; font-size: .9rem; line-height: 1.2; }
.notif-item .notif-text { font-size: .82rem; color:#64748b; }
.notif-item .notif-time { font-size: .72rem; color:#94a3b8; }

/* ---------- Tom Select polish (Bootstrap 5 theme) ---------- */
.ts-wrapper.form-select,
.ts-wrapper.form-control { padding: 0; min-height: 44px; }
.ts-wrapper .ts-control { min-height: 44px; border-radius: 10px; padding: .45rem .75rem; }
.ts-wrapper.focus .ts-control { box-shadow: 0 0 0 .2rem rgba(13,110,253,.15); border-color: #86b7fe; }
.ts-dropdown { border-radius: 10px; box-shadow: 0 6px 24px rgba(15,23,42,.12); }
.ts-dropdown .option.active { background: var(--brand-soft); color: var(--brand); }
.ts-wrapper.multi .ts-control { align-items: center; }

/* ---------- Misc ---------- */
.list-group-item-action.active-link { background: var(--brand-soft); color: var(--brand); font-weight: 500; }
.stat-card .display-6 { font-weight: 600; }

/* ---------- Login polish ---------- */
.login-page {
  min-height: 100vh;
  background:
    radial-gradient(1200px 500px at 0% -20%, #dbeafe 0%, rgba(219, 234, 254, 0) 55%),
    radial-gradient(1200px 500px at 100% 120%, #e9d5ff 0%, rgba(233, 213, 255, 0) 55%),
    #f8fafc;
}
.login-page .card {
  backdrop-filter: blur(2px);
}

/* ---------- 2026 Theme refresh overrides ---------- */
:root {
  --bs-body-bg: #f5f7ff;
  --sidebar-w: 250px;
  --sidebar-bg: #ffffff;
  --brand: #2563eb;
  --brand-dark: #1d4ed8;
  --brand-soft: #e9f0ff;
  --text-900: #0f172a;
  --text-700: #334155;
  --border-soft: #e5eaf5;
}

body {
  color: var(--text-700);
  background: radial-gradient(1200px 380px at 50% -220px, #dbeafe 0%, rgba(219, 234, 254, 0) 60%), var(--bs-body-bg);
}
body.has-mobile-nav { padding-bottom: calc(82px + env(safe-area-inset-bottom)); }

.app-topbar.navbar {
  background: linear-gradient(90deg, var(--brand), #3b82f6 55%, #1d4ed8 100%) !important;
  box-shadow: 0 8px 20px rgba(37, 99, 235, .25);
}
.app-topbar .navbar-brand {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  white-space: nowrap;
  line-height: 1.15;
  letter-spacing: 0;
  text-shadow: none;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}
.app-topbar .navbar-brand i {
  font-size: 1.15rem;
  line-height: 1;
  display: inline-block;
}
.app-topbar .btn.btn-outline-light {
  border-color: rgba(255,255,255,.55);
  background: rgba(255,255,255,.06);
}
.app-topbar .btn.btn-outline-light:hover { background: rgba(255,255,255,.18); }
.app-topbar .btn.btn-light {
  background: #fff;
  color: #1e3a8a;
  border: 0;
}

.app-sidebar.offcanvas-lg {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  border-right: 1px solid var(--border-soft);
}
.app-sidebar .nav-link {
  color: #33507b;
  border-radius: 10px;
  margin: 2px 8px;
  padding: .62rem .78rem;
  font-weight: 500;
}
.app-sidebar .nav-link:hover {
  color: var(--brand);
  background: #eef4ff;
}
.app-sidebar .nav-link.active {
  color: #fff;
  background: linear-gradient(90deg, var(--brand), #3b82f6);
  box-shadow: 0 8px 16px rgba(37, 99, 235, .22);
}

.card {
  border-radius: 16px;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .06);
  border: 1px solid rgba(229, 234, 245, .7);
}
.card .card-header {
  background: #fff;
  border-bottom: 1px solid #edf2fb;
  font-weight: 600;
}
.section-card { overflow: hidden; }

.stat-card {
  transition: transform .16s ease, box-shadow .16s ease;
}
.stat-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 24px rgba(30, 64, 175, .12);
}
.stat-card.stat-primary { border-top: 3px solid #2563eb; }
.stat-card.stat-info { border-top: 3px solid #0284c7; }
.stat-card.stat-teal { border-top: 3px solid #0d9488; }
.stat-card.stat-warn { border-top: 3px solid #d97706; }
.stat-card .h3, .stat-card .h5 { color: var(--text-900); font-weight: 700; }

.form-control, .form-select {
  border-color: #d9e2f3;
  background: #fff;
}
.form-control:focus, .form-select:focus {
  border-color: #7aa2ff;
  box-shadow: 0 0 0 .2rem rgba(37, 99, 235, .16);
}

.btn-primary {
  background: linear-gradient(90deg, var(--brand), #3b82f6);
  border: 0;
}
.btn-primary:hover { background: linear-gradient(90deg, var(--brand-dark), #2563eb); }
.btn-outline-primary {
  color: var(--brand);
  border-color: #9bb7ff;
}
.btn-outline-primary:hover {
  background: var(--brand-soft);
  color: var(--brand-dark);
  border-color: #7ca1ff;
}

.table thead th {
  color: #5b6b84;
  font-size: .78rem;
  letter-spacing: .05em;
}
.table-striped > tbody > tr:nth-of-type(odd) > * {
  background-color: #fbfdff;
}
.table > :not(caption) > * > * {
  border-bottom-color: #edf2fb;
}

/* Login redesign */
.login-wrap { max-width: 900px; }
.login-card { overflow: hidden; border-radius: 20px; }
.login-brand-pane {
  background: linear-gradient(155deg, #1d4ed8 0%, #2563eb 45%, #60a5fa 100%);
}
.login-brand-title {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: .75rem;
}
.login-page .input-group .btn {
  min-height: 44px;
}

@media (max-width: 991.98px) {
  .login-wrap { max-width: 450px; }
}

/* Mobile bottom nav */
.app-mobile-nav {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1040;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  background: rgba(255, 255, 255, .98);
  border-top: 1px solid #dce6fb;
  box-shadow: 0 -8px 20px rgba(15, 23, 42, .08);
  padding: .3rem .2rem calc(.35rem + env(safe-area-inset-bottom));
  backdrop-filter: blur(8px);
}
.app-mobile-nav-item {
  text-decoration: none;
  color: #64748b;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .2rem;
  min-height: 54px;
  border-radius: 10px;
  font-size: .7rem;
  font-weight: 500;
}
.app-mobile-nav-item i {
  font-size: 1.15rem;
  line-height: 1;
}
.app-mobile-nav-item.active {
  color: var(--brand);
  background: #edf3ff;
}
.app-mobile-nav-item:active {
  transform: translateY(1px);
}

@media (min-width: 992px) {
  body.has-mobile-nav { padding-bottom: 0; }
  .app-mobile-nav { display: none !important; }
}

/* Mobile record cards (lists) */
.app-list-cards {
  display: flex;
  flex-direction: column;
  gap: .65rem;
}
.app-record-card {
  border-radius: 14px;
  box-shadow: 0 1px 4px rgba(15, 23, 42, .07);
}
.app-record-card .card-body {
  padding: .85rem 1rem;
}
.app-record-card-head {
  margin-bottom: .5rem;
}
.app-record-card-title {
  font-weight: 600;
  font-size: 1.05rem;
  line-height: 1.35;
  color: var(--text-900, #0f172a);
}
.app-record-field {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: .75rem;
  padding: .4rem 0;
  border-bottom: 1px solid #f1f5f9;
  font-size: .9rem;
}
.app-record-field:last-of-type {
  border-bottom: 0;
}
.app-record-label {
  color: #64748b;
  flex-shrink: 0;
  max-width: 42%;
}
.app-record-value {
  text-align: right;
  min-width: 0;
  word-break: break-word;
}
.app-record-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: .75rem;
  padding-top: .75rem;
  border-top: 1px solid #e2e8f0;
}
.app-record-actions .btn,
.app-record-actions .app-action-btn {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
  font-size: .875rem;
  flex: 1 1 calc(50% - .25rem);
}
.app-record-actions form.d-inline {
  display: flex !important;
  flex: 1 1 calc(50% - .25rem);
  margin: 0;
}
.app-record-actions form.d-inline .btn,
.app-record-actions form.d-inline .app-action-btn {
  width: 100%;
  flex: 1;
}
.app-record-actions .btn-label {
  font-weight: 500;
}

/* Desktop tables: icon-only row actions */
.app-list-table-wrap .app-action-btn {
  min-height: auto;
  flex: none;
}
.app-list-table-wrap .btn-label,
table .btn .btn-label {
  display: none !important;
}