:root {
  --ink:#172033;
  --muted:#667085;
  --line:#d9e2ef;
  --page:#eef6ff;
  --surface:#ffffff;
  --sidebar-a:#0f5132;
  --sidebar-b:#0b7285;
  --sidebar-c:#1d3557;
  --accent:#0ea5a4;
  --accent-2:#f59f00;
  --accent-3:#e03131;
}

html,
body {
  max-width:100%;
  overflow-x:hidden;
}

body {
  color:var(--ink);
  font-size:16px;
  background:
    radial-gradient(circle at top left, rgba(14,165,164,.18), transparent 34rem),
    radial-gradient(circle at 80% 0%, rgba(245,159,0,.16), transparent 28rem),
    linear-gradient(135deg, #f7fbff 0%, var(--page) 48%, #fff7e6 100%);
  min-height:100vh;
}

.auth-body {
  background:
    radial-gradient(circle at 12% 10%, rgba(99,230,190,.42), transparent 22rem),
    radial-gradient(circle at 82% 12%, rgba(255,212,59,.34), transparent 24rem),
    radial-gradient(circle at 60% 90%, rgba(28,126,214,.22), transparent 26rem),
    linear-gradient(135deg, #052e2b 0%, #0b4f6c 45%, #172033 100%);
}

.auth-page {
  display:grid;
  place-items:center;
  min-height:100vh;
  padding:2rem;
}

.login-shell {
  display:grid;
  grid-template-columns:1.05fr .95fr;
  width:min(1080px, 100%);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.24);
  border-radius:1.5rem;
  background:rgba(255,255,255,.12);
  box-shadow:0 34px 90px rgba(0,0,0,.28);
  backdrop-filter:blur(18px);
}

.login-hero {
  position:relative;
  min-height:620px;
  padding:3.25rem;
  color:#fff;
  background:
    linear-gradient(145deg, rgba(14,165,164,.85), rgba(29,53,87,.94)),
    radial-gradient(circle at top right, rgba(255,255,255,.28), transparent 18rem);
}

.login-hero::after {
  content:"";
  position:absolute;
  right:-7rem;
  bottom:-7rem;
  width:18rem;
  height:18rem;
  border:36px solid rgba(255,255,255,.12);
  border-radius:50%;
}

.login-badge {
  display:inline-flex;
  padding:.55rem .85rem;
  border:1px solid rgba(255,255,255,.32);
  border-radius:999px;
  color:#103325;
  font-weight:800;
  background:linear-gradient(135deg, #fff3bf, #63e6be);
}

.login-hero h1 {
  max-width:560px;
  margin:5rem 0 1rem;
  font-size:clamp(2.4rem, 5vw, 4.8rem);
  line-height:.95;
  font-weight:900;
  letter-spacing:-.06em;
}

.login-hero p {
  max-width:460px;
  color:rgba(255,255,255,.82);
  font-size:1.05rem;
}

.login-highlights {
  display:flex;
  flex-wrap:wrap;
  gap:.7rem;
  margin-top:2rem;
}

.login-highlights span {
  padding:.55rem .75rem;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(255,255,255,.12);
}

.login-card {
  align-self:center;
  margin:2rem;
  padding:2rem;
  border:1px solid rgba(255,255,255,.82);
  border-radius:1.25rem;
  background:rgba(255,255,255,.94);
  box-shadow:0 22px 60px rgba(16,24,40,.18);
}

.login-card-header {
  display:flex;
  align-items:center;
  gap:.85rem;
  margin-bottom:1.5rem;
}

.login-card-header h2 {
  margin:0;
  font-weight:900;
}

.login-logo {
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  border-radius:1rem;
  color:#103325;
  font-weight:900;
  background:linear-gradient(135deg, #fff3bf, #63e6be);
  box-shadow:0 14px 30px rgba(14,165,164,.24);
}

.login-form .form-label {
  color:#344054;
  font-weight:800;
}

.captcha-box {
  display:grid;
  grid-template-columns:1fr 140px;
  gap:1rem;
  align-items:center;
  padding:1rem;
  border:1px solid #99e9f2;
  border-radius:1rem;
  background:linear-gradient(135deg, #e3fafc, #fff9db);
}

.captcha-question {
  color:#0b4f6c;
  font-size:1.45rem;
  font-weight:900;
  letter-spacing:.04em;
}

.login-footer-note {
  margin-top:1rem;
  color:#667085;
  font-size:.86rem;
  text-align:center;
}

.app-shell {
  width:100%;
  min-height:100vh;
  overflow-x:hidden;
}

.app-shell main {
  min-width:0;
  max-width:calc(100vw - 260px);
}

.sidebar {
  width:260px;
  min-width:260px;
  min-height:100vh;
  background:
    linear-gradient(165deg, rgba(15,81,50,.98), rgba(11,114,133,.96) 48%, rgba(29,53,87,.98)),
    linear-gradient(45deg, rgba(255,255,255,.06), transparent);
  box-shadow:16px 0 40px rgba(15,81,50,.18);
}

.brand-panel {
  display:flex;
  align-items:center;
  gap:.8rem;
  padding:.65rem;
  border:1px solid rgba(255,255,255,.18);
  border-radius:.75rem;
  background:rgba(255,255,255,.1);
}

.brand-panel h4 {
  font-size:.92rem;
  line-height:1.25;
}

.brand-mark {
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:.7rem;
  color:#103325;
  font-weight:800;
  background:linear-gradient(135deg, #fff3bf, #63e6be);
}

.menu-actions {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.5rem;
}

.menu-action-btn {
  color:#fff;
  border:1px solid rgba(255,255,255,.22);
  border-radius:.65rem;
  font-size:.78rem;
  font-weight:800;
  background:rgba(255,255,255,.12);
}

.menu-action-btn:hover {
  color:#103325;
  background:linear-gradient(135deg, #fff3bf, #63e6be);
}

.sidebar .nav-link {
  border-radius:.55rem;
  margin-bottom:.15rem;
  font-size:.94rem;
  padding:.46rem .58rem;
  transition:background .18s ease, transform .18s ease;
}

.sidebar .nav-link:hover,
.sidebar .menu-toggle:focus {
  background:rgba(255,255,255,.16);
  transform:translateX(3px);
}

.sidebar .menu-toggle {
  width:100%;
  border:0;
  text-align:left;
  font-weight:800;
  background:rgba(255,255,255,.1);
}

.sidebar .menu-toggle::after {
  content:"v";
  float:right;
  opacity:.8;
}

.sidebar .menu-toggle[aria-expanded="false"]::after { content:">"; }

.menu-group {
  margin:.2rem 0 .65rem .55rem;
  padding-left:.55rem;
  border-left:1px solid rgba(255,255,255,.22);
}

.menu-group .nav-link {
  font-size:.88rem;
  padding:.34rem .55rem;
}

.topbar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1rem;
  padding:.78rem .95rem;
  border:1px solid rgba(255,255,255,.75);
  border-radius:.85rem;
  background:rgba(255,255,255,.74);
  box-shadow:0 18px 45px rgba(29,53,87,.08);
  backdrop-filter:blur(12px);
}

.topbar-chip {
  padding:.45rem .75rem;
  border-radius:999px;
  color:#064e3b;
  background:#d3f9d8;
  font-weight:700;
  font-size:.85rem;
}

.topbar-user {
  min-width:190px;
  padding:.55rem .8rem;
  border:1px solid #b2f2bb;
  border-radius:.75rem;
  background:linear-gradient(135deg, #ebfbee, #e3fafc);
}

.topbar-actions {
  display:flex;
  align-items:center;
  gap:.75rem;
}

.logout-btn {
  border:0;
  border-radius:.75rem;
  padding:.65rem 1rem;
  font-weight:800;
  background:linear-gradient(135deg, #fa5252, #f59f00);
  box-shadow:0 12px 24px rgba(224,49,49,.18);
}

.app-footer {
  padding:1rem;
  color:#52637a;
  font-size:.9rem;
  text-align:center;
  border:1px solid rgba(217,226,239,.9);
  border-radius:.85rem;
  background:rgba(255,255,255,.72);
}

.page-heading h2,
h2.mb-4 {
  font-weight:800;
  letter-spacing:0;
  font-size:clamp(1.15rem, 2vw, 1.75rem);
}

.btn-primary,
.btn-action {
  border:0;
  background:linear-gradient(135deg, #0ea5a4, #1c7ed6);
  box-shadow:0 10px 22px rgba(14,165,164,.22);
}

.btn-primary:hover,
.btn-action:hover {
  background:linear-gradient(135deg, #099268, #1864ab);
}

.card {
  border:1px solid rgba(217,226,239,.9);
  border-radius:.85rem;
  box-shadow:0 16px 45px rgba(29,53,87,.08);
  background:rgba(255,255,255,.92);
}

.stat-card {
  border:0;
  overflow:hidden;
  position:relative;
}

.stat-card::before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:6px;
  background:linear-gradient(180deg, var(--accent), var(--accent-2));
}

.table {
  --bs-table-striped-bg:#f7fbff;
  --bs-table-hover-bg:#e6fcf5;
}

.screen-fit-card {
  max-width:100%;
  overflow:hidden;
}

.table-fit {
  width:100% !important;
  margin-bottom:.35rem !important;
  font-size:.82rem;
}

.table-fit th,
.table-fit td {
  padding:.26rem .34rem;
  white-space:nowrap;
  vertical-align:middle;
}

.table-fit td {
  max-width:145px;
  overflow:hidden;
  text-overflow:ellipsis;
}

.table-fit td:hover {
  overflow:visible;
  white-space:normal;
  word-break:break-word;
}

.table-ultra-compact {
  font-size:.72rem;
}

.table-ultra-compact th,
.table-ultra-compact td {
  padding:.18rem .24rem;
}

.table-ultra-compact td {
  max-width:112px;
}

.report-fit-table {
  table-layout:fixed;
  width:100% !important;
}

.report-fit-table th,
.report-fit-table td {
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:normal;
  text-align:center;
  line-height:1.15;
}

.report-fit-table th {
  vertical-align:middle;
}

.report-fit-table td:hover {
  overflow-wrap:anywhere;
  white-space:normal;
}

.report-fit-table.dataTable {
  margin-left:0 !important;
  margin-right:0 !important;
}

.entry-page-fit-table {
  table-layout:fixed;
  width:100% !important;
}

.entry-page-fit-table th,
.entry-page-fit-table td {
  white-space:normal;
  overflow-wrap:anywhere;
  text-align:center;
  line-height:1.12;
}

.entry-page-fit-table th {
  vertical-align:middle;
}

.entry-page-fit-table td {
  max-width:none;
}

.entry-page-fit-table .btn-sm {
  padding:.18rem .32rem;
  font-size:.62rem;
}

.entry-page-fit-table.dataTable {
  margin-left:0 !important;
  margin-right:0 !important;
}

.dataTables_wrapper {
  font-size:.92rem;
}

.dataTables_wrapper .row {
  --bs-gutter-y:.35rem;
}

.dataTables_scrollBody {
  border-bottom:1px solid #d9e2ef;
}

.table thead th {
  color:#183153;
  background:#e7f5ff;
  border-bottom:1px solid #c5d8eb;
  font-size:.78rem;
  text-transform:uppercase;
}

.filter-card-compact .form-label {
  margin-bottom:.2rem;
  font-size:.9rem;
  font-weight:800;
}

.filter-card-compact .form-control,
.filter-card-compact .form-select,
.filter-card-compact .btn {
  min-height:34px;
  padding:.32rem .55rem;
  font-size:.92rem;
}

.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select,
.form-control,
.form-select {
  border-color:#c9d7e8;
  border-radius:.65rem;
}

.form-control:focus,
.form-select:focus {
  border-color:#0ea5a4;
  box-shadow:0 0 0 .2rem rgba(14,165,164,.16);
}

.entry-modal-header {
  color:#fff;
  border:0;
  background:
    linear-gradient(135deg, rgba(14,165,164,.98), rgba(28,126,214,.98)),
    radial-gradient(circle at top right, rgba(255,255,255,.2), transparent 16rem);
}

.entry-modal-header .btn-close { filter:invert(1) grayscale(1) brightness(2); }
.entry-modal-body { background:linear-gradient(180deg, #f8fbff, #fff); }
.modal-content { border:0; border-radius:1rem; overflow:hidden; box-shadow:0 28px 80px rgba(16,24,40,.22); }
.modal-footer { background:#f8fbff; }

.field-card {
  height:100%;
  padding:.52rem;
  border:1px solid #d9e2ef;
  border-radius:.85rem;
  background:#fff;
}

.field-card-calculated {
  border-color:#99e9f2;
  background:linear-gradient(180deg, #e3fafc, #ffffff);
}

.field-card .form-label {
  margin-bottom:.25rem;
  color:#344054;
  font-size:.9rem;
  font-weight:700;
}

.entry-form-grid .form-control,
.entry-form-grid .form-select {
  min-height:34px;
  padding:.32rem .55rem;
  font-size:.95rem;
}

.entry-form-grid .form-text {
  margin-top:.2rem;
  font-size:.78rem;
}

.entry-form-grid .field-card {
  min-height:100%;
}

.modal-xl {
  --bs-modal-width:min(1320px, calc(100vw - 1.25rem));
}

.modal-dialog-scrollable .modal-body {
  max-height:calc(100vh - 185px);
}

.badge.text-bg-info {
  color:#064e3b !important;
  background:#b2f2bb !important;
}

.alert-info {
  border:1px solid #99e9f2;
  background:linear-gradient(135deg, #e3fafc, #fff9db);
}

canvas { max-height:320px; }

@media (max-width: 1400px) {
  .sidebar { width:230px; min-width:230px; padding:.75rem !important; }
  .app-shell main { max-width:calc(100vw - 230px); padding:1rem !important; }
  .brand-mark { width:38px; height:38px; }
  .brand-panel h4 { font-size:.78rem; }
  .table-fit { font-size:.74rem; }
  .table-fit th,
  .table-fit td { padding:.22rem .28rem; }
  .dataTables_wrapper { font-size:.84rem; }
  .card-body { padding:.75rem; }
}

@media (max-width: 1100px) {
  .sidebar { width:210px; min-width:210px; }
  .app-shell main { max-width:calc(100vw - 210px); padding:.75rem !important; }
  .sidebar .nav-link { font-size:.86rem; padding:.36rem .45rem; }
  .menu-action-btn { font-size:.76rem; padding:.25rem .3rem; }
  .table-fit { font-size:.7rem; }
  .table thead th { font-size:.7rem; }
  .topbar { font-size:.94rem; }
}

@media (max-width: 768px) {
  .app-shell { flex-direction:column; }
  .sidebar { width:100%; min-width:100%; min-height:auto; }
  .app-shell main { max-width:100vw; }
  main { padding:1rem !important; }
  .topbar { align-items:flex-start; flex-direction:column; }
  .topbar-actions { width:100%; align-items:stretch; flex-direction:column; }
  .topbar-user { min-width:100%; }
  .auth-page { padding:1rem; }
  .login-shell { grid-template-columns:1fr; }
  .login-hero { min-height:auto; padding:2rem; }
  .login-hero h1 { margin:2.5rem 0 1rem; }
  .login-card { margin:1rem; padding:1.25rem; }
  .captcha-box { grid-template-columns:1fr; }
  .menu-actions { grid-template-columns:1fr 1fr; }
  .table-fit { font-size:.72rem; }
  .table-fit th,
  .table-fit td { padding:.34rem .42rem; }
  .table-fit td { max-width:150px; }
  .dataTables_wrapper .dataTables_filter,
  .dataTables_wrapper .dataTables_length {
    text-align:left !important;
  }
  .dataTables_wrapper .dataTables_filter input {
    width:100%;
    margin-left:0;
  }
  .page-heading {
    align-items:flex-start !important;
    flex-direction:column;
  }
}

@media print {
  .sidebar, .topbar, .no-print, .dataTables_filter, .dataTables_length, .dataTables_paginate, .dataTables_info { display:none !important; }
  main { padding:0 !important; }
  .card { border:0; box-shadow:none; }
}