:root {
  --bg: #f5f7fb;
  --card: #ffffff;
  --text: #111827;
  --muted: #667085;
  --line: #e5e7eb;
  --navy: #07152b;
  --navy2: #0f1d34;
  --teal: #0f766e;
  --red: #dc2626;
  --amber: #d97706;
  --shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
}
* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: Inter, Arial, sans-serif;
  background: var(--bg);
  color: var(--text);
}
button, input, select, textarea {
  font: inherit;
}
button {
  cursor: pointer;
  border: none;
}
.login-page {
  min-height: 100vh;
  background:
    linear-gradient(90deg, rgba(7,21,43,.60), rgba(7,21,43,.22)),
    url('/assets/login-bg.png');
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px;
}
.login-card {
  width: 430px;
  padding: 34px;
  border-radius: 24px;
  color: white;
  background: rgba(7, 21, 43, 0.55);
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(15px);
  box-shadow: 0 20px 70px rgba(0,0,0,.30);
}
.login-card h1 { margin: 0 0 8px; font-size: 32px; line-height: 1.1; }
.login-card p { margin: 0 0 26px; opacity: .85; }
.login-card label { display:block; margin:16px 0 8px; font-size: 13px; opacity: .9; }
.login-card input {
  width: 100%;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 12px;
  padding: 13px;
  color: white;
  background: rgba(255,255,255,.10);
  outline: none;
}
.login-card input::placeholder { color: rgba(255,255,255,.55); }
.login-card button {
  width: 100%;
  margin-top: 22px;
  padding: 13px 16px;
  border-radius: 12px;
  background: var(--teal);
  color: white;
  font-weight: 700;
}
.login-meta {
  margin-top: 18px;
  display:flex;
  justify-content:space-between;
  font-size: 12px;
  opacity: .85;
}
.shell { display: flex; min-height: 100vh; }
.sidebar {
  width: 260px;
  background: var(--navy);
  color: white;
  padding: 22px;
  display:flex;
  flex-direction:column;
  position: fixed;
  inset: 0 auto 0 0;
}
.brand { font-weight: 800; font-size: 21px; margin-bottom: 26px; }
.userline { color: rgba(255,255,255,.55); margin-bottom: 14px; line-height: 1.35; }
.nav { display:flex; flex-direction:column; gap:10px; }
.nav button {
  text-align:left;
  color:white;
  background: transparent;
  border:1px solid rgba(255,255,255,.16);
  border-radius: 12px;
  padding: 12px 16px;
}
.nav button.active, .nav button:hover { background: var(--teal); border-color: var(--teal); }
.sidebar-bottom {
  margin-top:auto;
  border-top:1px solid rgba(255,255,255,.12);
  padding-top: 14px;
}
.lang-toggle {
  font-size: 12px;
  color: rgba(255,255,255,.62);
  display:flex;
  gap: 8px;
  align-items:center;
  margin-bottom: 12px;
}
.lang-toggle span { cursor:pointer; }
.lang-toggle .active { color:white; font-weight:800; }
.version { font-size: 12px; color: rgba(255,255,255,.55); margin-bottom: 12px; }
.logout-small {
  width: 100%;
  padding: 9px 10px;
  border-radius: 10px;
  color: white;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
}
.logout-small:hover { background: rgba(255,255,255,.14); }
.main {
  margin-left: 260px;
  width: calc(100% - 260px);
  padding: 34px 36px;
}
.page-head {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
  margin-bottom: 18px;
}
.page-title h1 { margin:0; font-size: 34px; letter-spacing:-.02em; }
.project { color: var(--muted); margin-top: 8px; font-size: 17px; }
.period-inline { display:flex; align-items:center; gap:8px; }
.period-inline select, .period-inline input {
  height: 40px;
  border:1px solid var(--line);
  border-radius: 10px;
  padding: 0 12px;
  background:white;
}
.kpi-grid {
  display:grid;
  grid-template-columns: repeat(7, minmax(0,1fr));
  gap: 14px;
  margin: 18px 0 26px;
}
.kpi-card {
  background: var(--card);
  border:1px solid var(--line);
  border-radius: 18px;
  padding: 18px 18px;
  min-height: 128px;
  box-shadow: var(--shadow);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.kpi-title {
  min-height: 36px;
  color: var(--muted);
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: .08em;
  font-weight: 800;
}
.kpi-value {
  font-size: 34px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -.03em;
  color: #111827;
}
.section-title {
  margin: 28px 0 14px;
  font-size: 19px;
  font-weight: 900;
}
.chart-grid {
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 16px;
}
.chart-card {
  background:white;
  border:1px solid var(--line);
  border-radius:18px;
  padding: 20px;
  box-shadow: var(--shadow);
  min-height: 230px;
}
.chart-card h3 {
  margin: 0 0 16px;
  font-size: 17px;
}
.no-data { color: var(--muted); padding: 20px 0; }
.bar-row { display:grid; grid-template-columns: 150px 1fr 50px; gap: 12px; align-items:center; margin: 10px 0; }
.bar-track { height: 10px; background:#eef2f7; border-radius: 99px; overflow:hidden; }
.bar-fill { height:100%; background: linear-gradient(90deg, #0f766e, #38bdf8); border-radius:99px; }
.actions-row {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap: 16px;
  margin-bottom: 14px;
}
.actions-left, .actions-right {
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
}
.btn {
  border-radius: 10px;
  padding: 10px 14px;
  background: #e9edf3;
  color: #111827;
  font-weight:700;
}
.btn.primary { background: var(--teal); color:white; }
.btn.dark { background:#253249; color:white; }
.btn.danger { background: var(--red); color:white; }
.btn.small { padding: 6px 9px; font-size: 13px; }
.table-wrap {
  background:white;
  border:1px solid var(--line);
  border-radius:16px;
  overflow-x: scroll; overflow-y: auto; scrollbar-gutter: stable both-edges;
  max-height: 70vh;
}
table { width:100%; border-collapse:collapse; min-width: 2100px; }
th, td {
  border-bottom:1px solid var(--line);
  padding: 9px 10px;
  text-align:left;
  white-space:normal;
  vertical-align:middle;
  font-size: 13px;
}
th {
  position: sticky;
  top: 0;
  z-index: 1;
  background:#f8fafc;
  color:#111827;
  font-size:12px;
  text-transform: none;
}

.action-inline { display:flex; gap: 6px; align-items:center; }
.icon-btn {
  width:34px;
  height:34px;
  border-radius:9px;
  background:#eef2f7;
  color:#111827;
}
.icon-btn.delete { background:#fee2e2; color:#991b1b; }
.modal-backdrop {
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:10;
  padding: 22px;
}
.modal {
  width: min(1080px, 96vw);
  max-height: 92vh;
  overflow-x: scroll; overflow-y: auto; scrollbar-gutter: stable both-edges;
  background:white;
  border-radius: 22px;
  padding: 24px;
  box-shadow: 0 30px 100px rgba(0,0,0,.35);
}
.modal-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; }
.modal h2 { margin:0; }
.close { background:#edf0f5; border-radius:10px; width:34px; height:34px; }
.form-grid {
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 14px;
}
.form-field label {
  display:block;
  font-size: 13px;
  margin-bottom: 6px;
  color:#1f2937;
}
.form-field input, .form-field select, .form-field textarea {
  width:100%;
  border:1px solid var(--line);
  border-radius:10px;
  padding: 10px 11px;
  min-height: 42px;
}
.form-field textarea { min-height: 74px; }
.form-actions { display:flex; gap:10px; margin-top:18px; }
.cards {
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 16px;
}
.panel {
  background:white;
  border:1px solid var(--line);
  border-radius:16px;
  padding:18px;
  box-shadow: var(--shadow);
}
.panel h3 { margin:0 0 14px; }
.setting-list { display:flex; flex-direction:column; gap: 10px; }
.setting-item { display:flex; gap:8px; align-items:center; }
.setting-item input { flex:1; padding:10px; border:1px solid var(--line); border-radius:10px; }
.filters {
  display:flex;
  gap:10px;
  margin-bottom: 14px;
  flex-wrap:wrap;
}
.filters input, .filters select {
  border:1px solid var(--line);
  border-radius:10px;
  padding:10px;
  background:white;
}
@media (max-width: 1100px) {
  .sidebar { width:220px; }
  .main { margin-left:220px; width:calc(100% - 220px); padding: 24px; }
  .kpi-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .chart-grid, .cards { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 760px) {
  .login-page { justify-content:center; padding:22px; }
  .sidebar { position:relative; width:100%; min-height:auto; }
  .shell { flex-direction:column; }
  .main { margin-left:0; width:100%; padding: 18px; }
  .page-head, .actions-row { flex-direction:column; align-items:stretch; }
  .kpi-grid { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
}
.table-wrap::-webkit-scrollbar { height: 12px; width: 12px; }
.table-wrap::-webkit-scrollbar-thumb { background: #94a3b8; border-radius: 99px; }
.table-wrap::-webkit-scrollbar-track { background: #e5e7eb; border-radius: 99px; }
.flight-table th:first-child, .flight-table td:first-child {
  position: sticky; left: 0; z-index: 2; background: inherit;
  min-width: 112px; box-shadow: 1px 0 0 var(--line);
}
.flight-table th:first-child { z-index: 3; background:#f8fafc; }
tr.incomplete-row td { background: #fff7ed; border-bottom-color: #fed7aa; }
.audit-table { min-width: 980px; table-layout: fixed; }
.audit-table th:nth-child(1), .audit-table td:nth-child(1) { width: 170px; }
.audit-table th:nth-child(2), .audit-table td:nth-child(2) { width: 145px; }
.audit-table th:nth-child(3), .audit-table td:nth-child(3) { width: 110px; }
.audit-table th:nth-child(4), .audit-table td:nth-child(4) { width: 140px; }
.audit-table th:nth-child(5), .audit-table td:nth-child(5) { width: 130px; }
.audit-table th:nth-child(6), .audit-table td:nth-child(6) { width: auto; white-space:normal; }


/* ===== V7 responsive + refined UI overrides ===== */
.mobile-topbar {
  display: none;
  background: var(--navy);
  color: white;
  padding: 12px 14px;
  align-items: center;
  justify-content: space-between;
  position: sticky;
  top: 0;
  z-index: 20;
}
.mobile-topbar .mobile-brand {
  font-weight: 800;
  font-size: 17px;
}
.hamburger {
  width: 38px;
  height: 34px;
  border-radius: 10px;
  background: rgba(255,255,255,.10);
  color: white;
  font-size: 20px;
}
.drawer-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  z-index: 25;
}
.export-wrap {
  position: relative;
  display: inline-flex;
}
.export-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  width: 230px;
  background: white;
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 16px 50px rgba(15, 23, 42, 0.18);
  padding: 8px;
  z-index: 12;
  display: none;
}
.export-menu.open { display: block; }
.export-menu button {
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  border-radius: 10px;
  background: transparent;
  color: var(--text);
  font-weight: 700;
}
.export-menu button:hover {
  background: #f1f5f9;
}
.export-menu .divider {
  height: 1px;
  background: var(--line);
  margin: 6px 0;
}
.compact-month {
  height: 40px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 0 10px;
  background: white;
}
.action-cell-normal {
  min-width: 88px;
}
@media (max-width: 760px) {
  .mobile-topbar { display: flex; }
  .shell { flex-direction: column; }
  .sidebar {
    position: fixed;
    top: 0;
    left: -290px;
    width: 280px;
    height: 100vh;
    z-index: 30;
    transition: left .22s ease;
    border-radius: 0 18px 18px 0;
  }
  .sidebar.open { left: 0; }
  .drawer-backdrop.open { display: block; }
  .main {
    margin-left: 0;
    width: 100%;
    padding: 18px 14px 24px;
  }
  .page-title h1 {
    font-size: 30px;
  }
  .page-head {
    gap: 12px;
  }
  .actions-right, .actions-left {
    width: 100%;
  }
  .actions-right .btn,
  .actions-left .btn,
  .export-wrap,
  .export-wrap .btn {
    width: 100%;
  }
  .export-menu {
    width: 100%;
  }
  .compact-month {
    width: 100%;
  }
  .table-wrap {
    max-height: 62vh;
  }
  table {
    font-size: 12px;
  }
  th, td {
    padding: 8px 9px;
    font-size: 12px;
  }
  .icon-btn {
    width: 30px;
    height: 30px;
  }
  .login-page {
    min-height: 100vh;
    padding: 22px;
  }
  .login-card {
    width: min(100%, 420px);
  }
}


/* ===== V8 dashboard/card refinements ===== */
.kpi-grid {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}
.kpi-card {
  min-width: 0;
  min-height: 118px;
  padding: 17px 16px;
}
.kpi-title {
  min-height: 40px;
  font-size: 10.5px;
  line-height: 1.25;
  letter-spacing: .055em;
  overflow-wrap: anywhere;
}
.kpi-value {
  font-size: clamp(26px, 2.8vw, 32px);
  font-weight: 800;
  letter-spacing: -.02em;
  white-space: nowrap;
}
.route-compact .bar-row {
  grid-template-columns: 190px 1fr 42px;
}
.route-compact .bar-row > div:first-child {
  font-size: 14px;
  line-height: 1.25;
  font-weight: 500;
}
.donut-layout {
  display: grid;
  grid-template-columns: 170px 1fr;
  gap: 18px;
  align-items: center;
  min-height: 150px;
}
.donut-chart {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  position: relative;
  background: conic-gradient(#0f766e 0deg, #38bdf8 0deg);
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.04);
}
.donut-chart::after {
  content: "";
  position: absolute;
  inset: 38px;
  background: #fff;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.05);
}
.donut-center {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  font-weight: 800;
  font-size: 20px;
}
.donut-legend {
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.legend-row {
  display: grid;
  grid-template-columns: 12px 1fr auto;
  gap: 9px;
  align-items: center;
  font-size: 14px;
}
.legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
}
.optional-text {
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
}
@media (max-width: 760px) {
  .kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .kpi-card {
    min-height: 104px;
    padding: 14px;
  }
  .kpi-title {
    min-height: 34px;
    font-size: 9.5px;
  }
  .kpi-value {
    font-size: 26px;
  }
  .donut-layout {
    grid-template-columns: 1fr;
    justify-items: center;
  }
  .donut-legend {
    width: 100%;
  }
  .route-compact .bar-row {
    grid-template-columns: 135px 1fr 34px;
  }
  .route-compact .bar-row > div:first-child {
    font-size: 12px;
  }
}


/* ===== V9 liquid glass dashboard + table stability ===== */
.main {
  background:
    radial-gradient(circle at 18% 8%, rgba(56, 189, 248, 0.10), transparent 24%),
    radial-gradient(circle at 82% 4%, rgba(15, 118, 110, 0.10), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.60), rgba(245,247,251,.85));
}
.kpi-card,
.chart-card,
.panel,
.table-wrap {
  background: linear-gradient(145deg, rgba(255,255,255,.92), rgba(255,255,255,.72));
  border: 1px solid rgba(226,232,240,.82);
  box-shadow:
    0 12px 34px rgba(15, 23, 42, 0.075),
    inset 0 1px 0 rgba(255,255,255,.72);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.kpi-card {
  min-height: 122px;
  border-radius: 20px;
  position: relative;
  overflow: hidden;
}
.kpi-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 3px;
  width: 100%;
  background: linear-gradient(90deg, rgba(15,118,110,.85), rgba(56,189,248,.55), rgba(99,102,241,.35));
}
.kpi-title {
  font-size: clamp(11.5px, 0.9vw, 13px);
  line-height: 1.32;
  letter-spacing: .035em;
  font-weight: 750;
  color: #64748b;
  min-height: 42px;
}
.kpi-value {
  font-size: clamp(25px, 2.45vw, 31px);
  font-weight: 760;
  letter-spacing: -.025em;
  color: #0f172a;
}
.section-title {
  letter-spacing: -.015em;
}
.chart-card {
  border-radius: 22px;
}
.chart-card h3 {
  letter-spacing: -.015em;
}
.form-error {
  color: #dc2626;
  font-size: 12px;
  margin-top: 6px;
  font-weight: 650;
}
.form-field.has-error input,
.form-field.has-error select {
  border-color: #dc2626;
  box-shadow: 0 0 0 3px rgba(220,38,38,.10);
}

/* Flight table anti-overlap fix */
.flight-table {
  table-layout: fixed;
  min-width: 2550px;
}
.flight-table th,
.flight-table td {
  white-space: normal;
  word-break: normal;
  overflow-wrap: break-word;
  line-height: 1.25;
  vertical-align: middle;
}
.flight-table th:nth-child(1),
.flight-table td:nth-child(1) {
  width: 135px;
  min-width: 135px;
  max-width: 135px;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
  background: #fff;
}
.flight-table th:nth-child(1) {
  background: #f8fafc;
}
.flight-table th:nth-child(2),
.flight-table td:nth-child(2) { width: 155px; }
.flight-table th:nth-child(3),
.flight-table td:nth-child(3) { width: 115px; }
.flight-table th:nth-child(4),
.flight-table td:nth-child(4) { width: 145px; }
.flight-table th:nth-child(5),
.flight-table td:nth-child(5) { width: 145px; }
.flight-table th:nth-child(6),
.flight-table td:nth-child(6) { width: 145px; }
.flight-table th:nth-child(7),
.flight-table td:nth-child(7) { width: 135px; }
.flight-table th:nth-child(8),
.flight-table td:nth-child(8) { width: 110px; }
.flight-table th:nth-child(9),
.flight-table td:nth-child(9) { width: 135px; }
.flight-table th:nth-child(10),
.flight-table td:nth-child(10) { width: 160px; }
.flight-table th:nth-child(11),
.flight-table td:nth-child(11) { width: 135px; }
.flight-table th:nth-child(12),
.flight-table td:nth-child(12) { width: 190px; }
.flight-table th:nth-child(13),
.flight-table td:nth-child(13),
.flight-table th:nth-child(14),
.flight-table td:nth-child(14) { width: 175px; }
.flight-table th:nth-child(15),
.flight-table td:nth-child(15) { width: 150px; }
.flight-table th:nth-child(16),
.flight-table td:nth-child(16),
.flight-table th:nth-child(17),
.flight-table td:nth-child(17) { width: 135px; }
.flight-table th:nth-child(18),
.flight-table td:nth-child(18),
.flight-table th:nth-child(19),
.flight-table td:nth-child(19) { width: 115px; }
.flight-table th:nth-child(20),
.flight-table td:nth-child(20) { width: 145px; }
.flight-table th:nth-child(21),
.flight-table td:nth-child(21) { width: 155px; }
.flight-table th:nth-child(22),
.flight-table td:nth-child(22) { width: 160px; }
.flight-table th:nth-child(23),
.flight-table td:nth-child(23),
.flight-table th:nth-child(24),
.flight-table td:nth-child(24) { width: 220px; }
.flight-table th:nth-child(25),
.flight-table td:nth-child(25) { width: 95px; }

@media (max-width: 760px) {
  .kpi-title {
    font-size: 11px;
    min-height: 34px;
  }
  .kpi-value {
    font-size: 25px;
  }
  .flight-table {
    min-width: 2350px;
  }
  .flight-table th:nth-child(1),
  .flight-table td:nth-child(1) {
    width: 125px;
    min-width: 125px;
    max-width: 125px;
  }
}

/* V10 additions */
.sidebar-drone{margin:22px auto 18px;width:82%;min-height:170px;display:flex;align-items:center;justify-content:center;opacity:.92;pointer-events:none}
.sidebar-drone img{width:100%;max-width:230px;height:auto;object-fit:contain;filter:drop-shadow(0 16px 24px rgba(0,0,0,.20));animation:droneFloat 5.5s ease-in-out infinite}
@keyframes droneFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.coldcare-link{text-align:left;color:white;background:transparent;border:1px solid rgba(255,255,255,.16);border-radius:12px;padding:12px 16px;font:inherit;text-decoration:none;display:block}
.coldcare-link:hover{background:var(--teal);border-color:var(--teal)}
.flight-filters{display:grid;grid-template-columns:minmax(220px,1.4fr) repeat(5,minmax(140px,1fr)) auto;gap:10px;align-items:center;margin:12px 0 16px}
.flight-filters input,.flight-filters select{height:40px;border:1px solid var(--line);border-radius:10px;padding:0 11px;background:rgba(255,255,255,.82);min-width:0}
.flight-filters .btn{height:40px;padding:0 13px}
.line-chart{width:100%;min-height:185px}.line-chart svg{width:100%;height:170px;overflow:visible}.chart-line{fill:none;stroke:url(#lineGrad);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}.chart-area{opacity:.16}.point{fill:#0f766e;stroke:#fff;stroke-width:2}.line-chart-meta{display:flex;justify-content:space-between;color:#64748b;font-size:12px;margin-top:6px}
.route-compact .bar-row{grid-template-columns:180px 1fr 38px!important}.route-compact .bar-row>div:first-child{font-size:13.5px!important;line-height:1.25!important;font-weight:520!important}
.donut-chart{box-shadow:inset 0 0 18px rgba(255,255,255,.28),0 14px 38px rgba(15,118,110,.12);filter:saturate(.92)}.donut-chart::before{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 28% 22%,rgba(255,255,255,.42),rgba(255,255,255,0) 45%);z-index:1;pointer-events:none}.donut-chart::after{inset:45px;background:rgba(255,255,255,.86);backdrop-filter:blur(8px)}.donut-center{font-weight:760}.legend-row{font-size:13px}
html[data-lang="TH"] .kpi-title{font-size:clamp(13px,1.02vw,15px);line-height:1.38;font-weight:800;letter-spacing:0}
html[data-lang="TH"] .section-title,html[data-lang="TH"] .chart-card h3,html[data-lang="TH"] .page-title h1{letter-spacing:0}
.form-grid,.form-field{min-width:0}.form-field input,.form-field select,.form-field textarea{min-width:0}
@media (max-width:1024px),(pointer:coarse){.mobile-topbar{display:flex}.shell{flex-direction:column}.sidebar{position:fixed;top:0;left:-290px;width:280px;height:100vh;z-index:30;transition:left .22s ease;border-radius:0 18px 18px 0}.sidebar.open{left:0}.drawer-backdrop.open{display:block}.main{margin-left:0;width:100%}.sidebar-drone{width:78%;min-height:115px;margin:18px auto 14px}}
@media (max-width:1024px){.flight-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.modal-backdrop{align-items:flex-start;padding:calc(70px + env(safe-area-inset-top)) 10px 16px;overflow-y:auto}.modal{width:100%;max-height:calc(100vh - 92px - env(safe-area-inset-top));border-radius:20px;padding:20px 16px}.form-grid{grid-template-columns:1fr!important;gap:13px}.form-field input,.form-field select,.form-field textarea{min-height:44px;height:auto;font-size:16px;line-height:1.25;padding:10px 12px}input[type=date],input[type=time]{min-height:44px;-webkit-appearance:none;appearance:none}.flight-filters{grid-template-columns:1fr}.flight-table{min-width:1850px!important}.flight-table th,.flight-table td{padding:7px 8px;font-size:12px}.flight-table th:nth-child(1),.flight-table td:nth-child(1){width:110px!important;min-width:110px!important;max-width:110px!important}.flight-table th:nth-child(2),.flight-table td:nth-child(2){width:120px!important}.flight-table th:nth-child(3),.flight-table td:nth-child(3){width:92px!important}.flight-table th:nth-child(4),.flight-table td:nth-child(4),.flight-table th:nth-child(5),.flight-table td:nth-child(5){width:112px!important}.flight-table th:nth-child(6),.flight-table td:nth-child(6),.flight-table th:nth-child(7),.flight-table td:nth-child(7){width:105px!important}.route-compact .bar-row{grid-template-columns:125px 1fr 30px!important}.route-compact .bar-row>div:first-child{font-size:12px!important}}
@media (orientation:landscape) and (max-height:540px){.modal-backdrop{padding:18px}.modal{max-height:calc(100vh - 36px)}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px 16px}.form-field input,.form-field select,.form-field textarea{min-height:40px;font-size:15px}}


/* V10.2 Last 15 Day Flights bar chart */
.daily-bar-chart {
  width: 100%;
  min-height: 220px;
}
.daily-bar-chart svg {
  width: 100%;
  height: 215px;
  overflow: visible;
}
.daily-bar-chart .axis {
  stroke: #cbd5e1;
  stroke-width: 1;
}
.daily-bar-chart .grid {
  stroke: rgba(148, 163, 184, .26);
  stroke-width: 1;
}
.daily-bar-chart .axis-label {
  fill: #64748b;
  font-size: 11px;
}
.daily-bar-chart .bar {
  fill: url(#barGrad);
  rx: 7;
  transition: opacity .15s ease, transform .15s ease;
}
.daily-bar-chart .bar:hover {
  opacity: .78;
}
.daily-bar-chart .bar-zero {
  fill: rgba(148, 163, 184, .28);
}
.daily-bar-chart .value-label {
  fill: #0f172a;
  font-size: 11px;
  font-weight: 700;
}
.daily-bar-chart .chart-caption {
  display: flex;
  justify-content: space-between;
  color: #64748b;
  font-size: 12px;
  margin-top: 4px;
}


/* ===== V18 safe patch ===== */
.sidebar-subtitle{font-size:13px;font-weight:650;color:rgba(255,255,255,.66);letter-spacing:.08em;margin-bottom:24px;text-transform:uppercase}
.sidebar-drone{display:none!important}
button,.icon-btn,.close,.btn,.logout-small{pointer-events:auto!important;cursor:pointer}
.drawer-backdrop,#drawerBackdrop{pointer-events:none}
.drawer-backdrop.open,#drawerBackdrop.open{pointer-events:auto}
.duration-stack{display:flex;flex-direction:column;gap:2px;margin-top:6px;line-height:1}
.duration-row{display:flex;align-items:baseline;gap:6px}
.duration-number{font-size:clamp(26px,2.2vw,38px);font-weight:800;letter-spacing:-.04em;color:#0f172a}
.duration-unit{font-size:13px;font-weight:750;color:#64748b;text-transform:uppercase}


/* ===== V19 flight status table fixes ===== */
.flight-table th:nth-child(1), .flight-table td:nth-child(1){
  position:sticky!important;
  left:0!important;
  z-index:8!important;
  width:58px!important;
  min-width:58px!important;
  max-width:58px!important;
  text-align:center!important;
  background:#fff;
  box-shadow:1px 0 0 var(--line);
}
.flight-table th:nth-child(1){background:#f8fafc;z-index:10!important}
.flight-table th:nth-child(2), .flight-table td:nth-child(2){
  position:sticky!important;
  left:58px!important;
  z-index:7!important;
  min-width:132px!important;
  background:#fff;
  box-shadow:1px 0 0 var(--line);
}
.flight-table th:nth-child(2){background:#f8fafc;z-index:9!important}
.status-emoji{
  font-size:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:999px;
  background:rgba(255,255,255,.75);
  box-shadow:inset 0 0 0 1px rgba(15,23,42,.08);
}
tr.incomplete-row td{background:#fed7aa!important;border-bottom-color:#fb923c!important}
tr.warning-row td{background:#fef3c7!important;border-bottom-color:#f59e0b!important}
tr.incident-row td{background:#fee2e2!important;border-bottom-color:#ef4444!important}
tr.incomplete-row td:nth-child(1),tr.incomplete-row td:nth-child(2){background:#fed7aa!important}
tr.warning-row td:nth-child(1),tr.warning-row td:nth-child(2){background:#fef3c7!important}
tr.incident-row td:nth-child(1),tr.incident-row td:nth-child(2){background:#fee2e2!important}
.action-header-blank{color:transparent!important}
button,.icon-btn,.close,.btn{pointer-events:auto!important}


/* ===== V20 Flight Log layout recovery ===== */

/* Desktop/tablet: filters in one clean row */
.flight-filters{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  flex-wrap:nowrap!important;
  width:100%!important;
  max-width:none!important;
  margin:22px 0 28px!important;
}

.flight-filters > input#flightSearch{
  flex:0 0 300px!important;
  width:300px!important;
  min-width:240px!important;
  max-width:340px!important;
}

.flight-filters .mobile-filter-extra{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  flex:1 1 auto!important;
  flex-wrap:nowrap!important;
}

.flight-filters select{
  flex:0 0 210px!important;
  width:210px!important;
  min-width:170px!important;
}

.flight-filters #filterMission{
  flex-basis:240px!important;
  width:240px!important;
}

.flight-filters #filterRoute{
  flex-basis:230px!important;
  width:230px!important;
}

.flight-filters label{
  flex:0 0 auto!important;
  white-space:nowrap!important;
}

.flight-filters #resetFilters{
  flex:0 0 auto!important;
  white-space:nowrap!important;
}

/* Restore table visual stability */
.table-wrap{
  width:100%!important;
  overflow:auto!important;
}

.flight-table{
  min-width:1900px!important;
  table-layout:fixed!important;
}

.flight-table th,
.flight-table td{
  white-space:normal!important;
  word-break:normal!important;
  overflow-wrap:break-word!important;
  vertical-align:middle!important;
}

.flight-table th:nth-child(1),
.flight-table td:nth-child(1){
  width:70px!important;
  min-width:70px!important;
  max-width:70px!important;
}

.flight-table th:nth-child(2),
.flight-table td:nth-child(2){
  left:70px!important;
  width:150px!important;
  min-width:150px!important;
  max-width:150px!important;
}

/* Mobile: keep only search visible, same as earlier requirement */
@media(max-width:760px){
  .flight-filters{
    display:block!important;
    margin:18px 0 20px!important;
  }
  .flight-filters > input#flightSearch{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    flex:auto!important;
  }
  .flight-filters .mobile-filter-extra{
    display:none!important;
  }
  .export-wrap{
    display:none!important;
  }
}

/* Medium width: allow wrapping without stacking awkwardly */
@media(min-width:761px) and (max-width:1320px){
  .flight-filters{
    flex-wrap:wrap!important;
  }
  .flight-filters .mobile-filter-extra{
    flex-wrap:wrap!important;
  }
}

.page-head{
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:20px!important;
}
.actions-right{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  flex-wrap:nowrap!important;
}


/* ===== V20 FULL final stability patch ===== */
.page-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:20px!important}
.actions-right{display:flex!important;align-items:center!important;gap:12px!important;flex-wrap:nowrap!important}
.period-inline{display:flex!important;align-items:center!important;gap:12px!important}
.export-report-btn{background:linear-gradient(135deg,#0f766e,#0891b2)!important;color:#fff!important;white-space:nowrap!important}
.flight-filters{display:flex!important;align-items:center!important;gap:14px!important;flex-wrap:nowrap!important;width:100%!important;max-width:none!important;margin:22px 0 28px!important}
.flight-filters > input#flightSearch{flex:0 0 300px!important;width:300px!important;min-width:240px!important;max-width:340px!important}
.flight-filters .mobile-filter-extra{display:flex!important;align-items:center!important;gap:14px!important;flex:1 1 auto!important;flex-wrap:nowrap!important}
.flight-filters select{flex:0 0 210px!important;width:210px!important;min-width:170px!important}
.flight-filters #filterMission{flex-basis:240px!important;width:240px!important}
.flight-filters #filterRoute{flex-basis:230px!important;width:230px!important}
.flight-filters label{flex:0 0 auto!important;white-space:nowrap!important}
.flight-filters #resetFilters{flex:0 0 auto!important;white-space:nowrap!important}
.table-wrap{width:100%!important;overflow:auto!important}
.flight-table{min-width:1900px!important;table-layout:fixed!important}
.flight-table th,.flight-table td{white-space:normal!important;word-break:normal!important;overflow-wrap:break-word!important;vertical-align:middle!important}
.flight-table th:nth-child(1),.flight-table td:nth-child(1){position:sticky!important;left:0!important;z-index:8!important;width:70px!important;min-width:70px!important;max-width:70px!important;text-align:center!important;background:#fff;box-shadow:1px 0 0 var(--line)}
.flight-table th:nth-child(1){background:#f8fafc;z-index:10!important}
.flight-table th:nth-child(2),.flight-table td:nth-child(2){position:sticky!important;left:70px!important;z-index:7!important;width:150px!important;min-width:150px!important;max-width:150px!important;background:#fff;box-shadow:1px 0 0 var(--line)}
.flight-table th:nth-child(2){background:#f8fafc;z-index:9!important}
.status-emoji{font-size:20px;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:999px;background:rgba(255,255,255,.75);box-shadow:inset 0 0 0 1px rgba(15,23,42,.08)}
tr.incomplete-row td{background:#fed7aa!important;border-bottom-color:#fb923c!important}
tr.warning-row td{background:#fef3c7!important;border-bottom-color:#f59e0b!important}
tr.incident-row td{background:#fee2e2!important;border-bottom-color:#ef4444!important}
tr.incomplete-row td:nth-child(1),tr.incomplete-row td:nth-child(2){background:#fed7aa!important}
tr.warning-row td:nth-child(1),tr.warning-row td:nth-child(2){background:#fef3c7!important}
tr.incident-row td:nth-child(1),tr.incident-row td:nth-child(2){background:#fee2e2!important}
.action-header-blank{color:transparent!important}
.duration-stack{display:flex;flex-direction:column;gap:2px;margin-top:6px;line-height:1}
.duration-row{display:flex;align-items:baseline;gap:6px}
.duration-number{font-size:clamp(26px,2.2vw,38px);font-weight:800;letter-spacing:-.04em;color:#0f172a}
.duration-unit{font-size:13px;font-weight:750;color:#64748b;text-transform:uppercase}
.kpi-value.danger-value{color:#dc2626!important}
button,.icon-btn,.close,.btn,.logout-small{pointer-events:auto!important;cursor:pointer!important}
@media(max-width:760px){
  .flight-filters{display:block!important;margin:18px 0 20px!important}
  .flight-filters > input#flightSearch{width:100%!important;max-width:none!important;min-width:0!important;flex:auto!important}
  .flight-filters .mobile-filter-extra{display:none!important}
  .export-wrap,.export-report-btn{display:none!important}
  .flight-table th:nth-child(1),.flight-table td:nth-child(1){width:54px!important;min-width:54px!important;max-width:54px!important}
  .flight-table th:nth-child(2),.flight-table td:nth-child(2){left:54px!important;width:120px!important;min-width:120px!important;max-width:120px!important}
}
@media(min-width:761px) and (max-width:1320px){.flight-filters,.flight-filters .mobile-filter-extra{flex-wrap:wrap!important}}


/* ===== V21 root interaction fix ===== */
/* Old builds had (pointer:coarse) rules that could make sidebar/backdrop behave like mobile on desktop/tablet and steal focus. */
@media (min-width:761px){
  .mobile-topbar{display:none!important}
  .shell{display:block!important}
  .sidebar{
    position:fixed!important;
    top:0!important;
    left:0!important;
    width:280px!important;
    height:100vh!important;
    min-height:100vh!important;
    z-index:5!important;
    border-radius:0!important;
    transition:none!important;
  }
  .sidebar.open{left:0!important}
  .drawer-backdrop,
  #drawerBackdrop{
    display:none!important;
    pointer-events:none!important;
  }
  .main{
    margin-left:280px!important;
    width:calc(100% - 280px)!important;
    min-height:100vh!important;
    position:relative!important;
    z-index:1!important;
  }
}
@media (max-width:760px){
  .mobile-topbar{display:flex!important}
  .sidebar{
    position:fixed!important;
    top:0!important;
    left:-290px!important;
    width:280px!important;
    height:100vh!important;
    z-index:30!important;
    border-radius:0 18px 18px 0!important;
  }
  .sidebar.open{left:0!important}
  .drawer-backdrop{display:none!important;pointer-events:none!important}
  .drawer-backdrop.open{display:block!important;pointer-events:auto!important}
  .main{margin-left:0!important;width:100%!important}
}

/* Ensure interactive fields are always above cosmetic layers */
.flight-filters, .setting-list, .form-field, input, select, textarea, button{
  position:relative;
  z-index:3;
  pointer-events:auto!important;
}

/* Flight Log layout */
.flight-filters{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  flex-wrap:nowrap!important;
  width:100%!important;
  max-width:none!important;
  margin:22px 0 28px!important;
}
.flight-filters > input#flightSearch{
  flex:0 0 300px!important;
  width:300px!important;
  min-width:240px!important;
  max-width:340px!important;
}
.flight-filters .mobile-filter-extra{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  flex:1 1 auto!important;
  flex-wrap:nowrap!important;
}
.flight-filters select{
  flex:0 0 210px!important;
  width:210px!important;
  min-width:170px!important;
}
.flight-filters #filterMission{flex-basis:240px!important;width:240px!important}
.flight-filters #filterRoute{flex-basis:230px!important;width:230px!important}
.flight-filters label,.flight-filters #resetFilters{flex:0 0 auto!important;white-space:nowrap!important}

.table-wrap{width:100%!important;overflow:auto!important}
.flight-table{min-width:1900px!important;table-layout:fixed!important}
.flight-table th,.flight-table td{white-space:normal!important;word-break:normal!important;overflow-wrap:break-word!important;vertical-align:middle!important}
.flight-table th:nth-child(1),.flight-table td:nth-child(1){position:sticky!important;left:0!important;z-index:8!important;width:70px!important;min-width:70px!important;max-width:70px!important;text-align:center!important;background:#fff;box-shadow:1px 0 0 var(--line)}
.flight-table th:nth-child(1){background:#f8fafc!important;z-index:10!important}
.flight-table th:nth-child(2),.flight-table td:nth-child(2){position:sticky!important;left:70px!important;z-index:7!important;width:150px!important;min-width:150px!important;max-width:150px!important;background:#fff;box-shadow:1px 0 0 var(--line)}
.flight-table th:nth-child(2){background:#f8fafc!important;z-index:9!important}
.status-emoji{font-size:20px;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:999px;background:rgba(255,255,255,.75);box-shadow:inset 0 0 0 1px rgba(15,23,42,.08)}
tr.incomplete-row td{background:#fed7aa!important;border-bottom-color:#fb923c!important}
tr.warning-row td{background:#fef3c7!important;border-bottom-color:#f59e0b!important}
tr.incident-row td{background:#fee2e2!important;border-bottom-color:#ef4444!important}
tr.incomplete-row td:nth-child(1),tr.incomplete-row td:nth-child(2){background:#fed7aa!important}
tr.warning-row td:nth-child(1),tr.warning-row td:nth-child(2){background:#fef3c7!important}
tr.incident-row td:nth-child(1),tr.incident-row td:nth-child(2){background:#fee2e2!important}

.export-report-btn{background:linear-gradient(135deg,#0f766e,#0891b2)!important;color:#fff!important;white-space:nowrap!important}
.duration-stack{display:flex;flex-direction:column;gap:2px;margin-top:6px;line-height:1}
.duration-row{display:flex;align-items:baseline;gap:6px}
.duration-number{font-size:clamp(26px,2.2vw,38px);font-weight:800;letter-spacing:-.04em;color:#0f172a}
.duration-unit{font-size:13px;font-weight:750;color:#64748b;text-transform:uppercase}
.kpi-value.danger-value{color:#dc2626!important}

@media(max-width:760px){
  .flight-filters{display:block!important;margin:18px 0 20px!important}
  .flight-filters > input#flightSearch{width:100%!important;max-width:none!important;min-width:0!important;flex:auto!important}
  .flight-filters .mobile-filter-extra{display:none!important}
  .export-wrap,.export-report-btn{display:none!important}
}
@media(min-width:761px) and (max-width:1320px){
  .flight-filters,.flight-filters .mobile-filter-extra{flex-wrap:wrap!important}
}


/* ===== V22 action button UX + table scroll stability ===== */
.flight-table th:last-child,
.flight-table td:last-child{
  position: sticky!important;
  right: 0!important;
  z-index: 8!important;
  width: 132px!important;
  min-width: 132px!important;
  max-width: 132px!important;
  background: #fff!important;
  box-shadow: -1px 0 0 var(--line), -10px 0 18px rgba(15,23,42,.045)!important;
}
.flight-table th:last-child{
  background:#f8fafc!important;
  z-index:11!important;
}
tr.incomplete-row td:last-child{background:#fed7aa!important}
tr.warning-row td:last-child{background:#fef3c7!important}
tr.incident-row td:last-child{background:#fee2e2!important}

.action-cell-normal{
  width:132px!important;
  min-width:132px!important;
  max-width:132px!important;
  text-align:center!important;
}
.action-inline{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  min-width:112px!important;
}
.icon-btn{
  width:46px!important;
  min-width:46px!important;
  height:46px!important;
  border-radius:14px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:18px!important;
  line-height:1!important;
  touch-action:manipulation!important;
}
.icon-btn.delete{
  width:46px!important;
  min-width:46px!important;
}
.flight-edit-btn{
  width:52px!important;
  min-width:52px!important;
}
.table-wrap{
  overscroll-behavior-x:contain!important;
  scroll-behavior:auto!important;
}
@media(max-width:760px){
  .flight-table th:last-child,
  .flight-table td:last-child{
    width:120px!important;
    min-width:120px!important;
    max-width:120px!important;
  }
  .action-cell-normal{
    width:120px!important;
    min-width:120px!important;
    max-width:120px!important;
  }
  .icon-btn{
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
  }
}


/* ===== V23 no-native-select filter fix ===== */
.custom-select{
  position:relative!important;
  z-index:50!important;
  min-width:210px;
}
.custom-select-btn{
  width:100%;
  height:52px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,255,255,.92);
  color:var(--text);
  padding:0 42px 0 16px;
  font-size:16px;
  font-weight:650;
  text-align:left;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  position:relative;
}
.custom-select-btn::after{
  content:"⌄";
  position:absolute;
  right:14px;
  top:50%;
  transform:translateY(-50%);
  font-size:18px;
}
.custom-select-menu{
  display:none;
  position:absolute;
  top:calc(100% + 8px);
  left:0;
  right:0;
  z-index:99999;
  background:white;
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:0 18px 52px rgba(15,23,42,.20);
  padding:8px;
  max-height:280px;
  overflow:auto;
}
.custom-select.open .custom-select-menu{
  display:block;
}
.custom-select-menu button{
  width:100%;
  min-height:42px;
  border-radius:10px;
  background:white;
  color:var(--text);
  padding:9px 10px;
  text-align:left;
  font-size:15px;
  font-weight:650;
}
.custom-select-menu button:hover{
  background:#f1f5f9;
}
.flight-filters select{
  display:none!important;
}
.flight-filters .mobile-filter-extra{
  overflow:visible!important;
}
.flight-filters,
.page-head,
.main,
.panel,
.cards{
  overflow:visible!important;
}
.table-wrap{
  overflow:auto!important;
}
#flightSearch{
  height:52px!important;
  font-size:16px!important;
}
@media(max-width:760px){
  .custom-select{display:none!important}
}


/* ===== V24 text input focus stability ===== */
.stable-text-input,
#flightSearch,
.setting-list input,
.setting-list textarea{
  position:relative!important;
  z-index:100!important;
  pointer-events:auto!important;
  user-select:text!important;
  -webkit-user-select:text!important;
  touch-action:manipulation!important;
  background:#fff!important;
}
.setting-list,
.flight-filters{
  position:relative!important;
  z-index:90!important;
}
.custom-select{
  z-index:80!important;
}
.custom-select.open{
  z-index:99999!important;
}
.drawer-backdrop:not(.open),
#drawerBackdrop:not(.open){
  display:none!important;
  pointer-events:none!important;
}
.main::before,
.main::after,
.panel::before,
.panel::after,
.table-wrap::before,
.table-wrap::after{
  pointer-events:none!important;
}


/* ===== V25 Action column: no sticky/fixed right column ===== */
.flight-table th:last-child,
.flight-table td:last-child{
  position:static!important;
  right:auto!important;
  z-index:auto!important;
  width:132px!important;
  min-width:132px!important;
  max-width:132px!important;
  background:inherit!important;
  box-shadow:none!important;
}
.flight-table th:last-child{
  background:#f8fafc!important;
}
.action-cell-normal{
  width:132px!important;
  min-width:132px!important;
  max-width:132px!important;
  text-align:center!important;
}
.action-inline{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
}
.icon-btn{
  width:46px!important;
  min-width:46px!important;
  height:46px!important;
  border-radius:14px!important;
}
.flight-edit-btn{
  width:52px!important;
  min-width:52px!important;
}
tr.incomplete-row td:last-child{background:#fed7aa!important}
tr.warning-row td:last-child{background:#fef3c7!important}
tr.incident-row td:last-child{background:#fee2e2!important}
@media(max-width:760px){
  .flight-table th:last-child,
  .flight-table td:last-child,
  .action-cell-normal{
    width:120px!important;
    min-width:120px!important;
    max-width:120px!important;
  }
}


/* ===== V26 dropdown/export overlay fixes ===== */
.period-inline .custom-select{
  min-width:230px!important;
}
.period-inline .custom-select-menu{
  max-height:360px!important;
}
.custom-select-menu button[data-value=""]{
  min-height:42px!important;
}
.custom-select-menu button:empty{
  display:none!important;
}
.export-wrap{
  position:relative!important;
  z-index:200000!important;
}
.export-wrap .export-menu,
.export-menu{
  z-index:200001!important;
  min-width:300px!important;
  width:300px!important;
  top:calc(100% + 10px)!important;
  right:0!important;
  background:rgba(255,255,255,.98)!important;
  border:1px solid rgba(226,232,240,.95)!important;
  box-shadow:0 22px 70px rgba(15,23,42,.22)!important;
}
.export-menu.open{
  display:block!important;
}
.export-menu button{
  color:#0f172a!important;
  opacity:1!important;
  font-weight:800!important;
  min-height:44px!important;
}
.export-menu button:hover{
  background:#f1f5f9!important;
}
.export-menu .compact-month{
  width:100%!important;
  margin:8px 0!important;
  color:#0f172a!important;
}
.flight-filters .custom-select{
  z-index:1000!important;
}
.flight-filters .custom-select.open{
  z-index:150000!important;
}
.period-inline .custom-select{
  z-index:1000!important;
}
.period-inline .custom-select.open{
  z-index:150000!important;
}


/* ===== V27 Audit custom filters + production interaction check ===== */
.audit-filters{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  flex-wrap:wrap!important;
  width:100%!important;
  margin:22px 0 28px!important;
  position:relative!important;
  z-index:90!important;
  overflow:visible!important;
}
.audit-filters > input#auditSearch{
  flex:0 0 330px!important;
  width:330px!important;
  max-width:100%!important;
  height:52px!important;
  font-size:16px!important;
  background:#fff!important;
}
.audit-filters .custom-select{
  flex:0 0 260px!important;
  min-width:230px!important;
}
.audit-filters .custom-select.open{
  z-index:150000!important;
}
.audit-filters select{
  display:none!important;
}
@media(max-width:760px){
  .audit-filters{display:block!important}
  .audit-filters > input#auditSearch{width:100%!important;flex:auto!important}
  .audit-filters .custom-select{display:none!important}
}


/* ===== V28 filter layout containment + selected label update ===== */
html, body{overflow-x:hidden!important}
.main{
  box-sizing:border-box!important;
  max-width:calc(100vw - 280px)!important;
  overflow-x:hidden!important;
}
@media(max-width:760px){.main{max-width:100vw!important}}

.flight-filters{
  display:grid!important;
  grid-template-columns:minmax(240px,1.25fr) repeat(4,minmax(180px,.8fr)) auto auto!important;
  align-items:center!important;
  gap:14px!important;
  width:100%!important;
  max-width:100%!important;
  box-sizing:border-box!important;
  overflow:visible!important;
}
.flight-filters > input#flightSearch{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  flex:initial!important;
}
.flight-filters .mobile-filter-extra{display:contents!important}
.flight-filters .custom-select{
  min-width:0!important;
  width:100%!important;
  max-width:100%!important;
  flex:initial!important;
}
.flight-filters .custom-select-btn{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
}
.flight-filters .incomplete-label{
  white-space:nowrap!important;
  min-width:max-content!important;
}
.flight-filters #resetFilters{min-width:96px!important}
@media(min-width:761px) and (max-width:1500px){
  .flight-filters{grid-template-columns:minmax(240px,1fr) repeat(2,minmax(200px,1fr))!important}
  .flight-filters .incomplete-label,.flight-filters #resetFilters{width:max-content!important}
}
@media(max-width:760px){
  .flight-filters{display:block!important}
  .flight-filters .mobile-filter-extra{display:none!important}
}
.custom-select-btn{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.custom-select-menu{min-width:100%!important}
.page-head{
  max-width:100%!important;
  box-sizing:border-box!important;
}
.actions-right{flex-shrink:0!important}


/* ===== V29 production polish and export fixes ===== */
.external-menu{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important}
.external-icon{opacity:.72;font-size:15px}
.incomplete-label{
  padding:9px 12px!important;
  border-radius:12px!important;
  border:1px solid transparent!important;
}
.incomplete-label input{display:none!important}
.checkbox-ui{
  width:18px;height:18px;border:2px solid #64748b;border-radius:5px;display:inline-flex;align-items:center;justify-content:center;margin-right:8px;background:#fff;
}
.incomplete-label.active{
  background:rgba(15,118,110,.12)!important;
  border-color:#0f766e!important;
  color:#0f766e!important;
}
.incomplete-label.active .checkbox-ui{
  background:#0f766e!important;
  border-color:#0f766e!important;
}
.incomplete-label.active .checkbox-ui::after{
  content:"✓";color:#fff;font-weight:900;font-size:14px;line-height:1;
}
.export-menu{
  z-index:300000!important;
}
.audit-filters + #auditTable{
  position:relative;
  z-index:1;
}
.sidebar-bottom .logout-small + .logout-small{
  margin-top:8px;
}


/* ===== V30 production final fixes ===== */
.sidebar-bottom #changePasswordBtn{display:none!important}
.settings-cards.single-settings{grid-template-columns:minmax(280px,720px)!important}
.settings-cards .panel:first-child{grid-column:auto!important}

.compact-action-btn{padding:10px 16px!important;min-height:42px!important}

/* compact filter controls and prevent reset overflow */
.flight-filters{
  grid-template-columns:minmax(220px,1.2fr) repeat(4,minmax(160px,.8fr)) max-content max-content!important;
  gap:10px!important;
}
.flight-filters .custom-select-btn,
#flightSearch{
  height:44px!important;
  font-size:14px!important;
  border-radius:12px!important;
  padding-top:0!important;
  padding-bottom:0!important;
}
.flight-filters #resetFilters{
  min-width:78px!important;
  height:44px!important;
  padding:0 14px!important;
  border-radius:12px!important;
}
.incomplete-label{
  height:44px!important;
  padding:0 10px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  white-space:nowrap!important;
  cursor:pointer!important;
}
.incomplete-label input{
  position:absolute!important;
  opacity:0!important;
  pointer-events:none!important;
}
.checkbox-ui{
  width:18px!important;
  height:18px!important;
  border:2px solid #64748b!important;
  border-radius:5px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:#fff!important;
  flex:0 0 auto!important;
}
.incomplete-label.active{
  background:rgba(15,118,110,.12)!important;
  border-color:#0f766e!important;
  color:#0f766e!important;
}
.incomplete-label.active .checkbox-ui{
  background:#0f766e!important;
  border-color:#0f766e!important;
}
.incomplete-label.active .checkbox-ui::after{
  content:"✓"!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:900!important;
}
.custom-select.has-value .custom-select-btn{
  background:#f1f5f9!important;
  border-color:#94a3b8!important;
  box-shadow:inset 0 0 0 1px rgba(100,116,139,.16)!important;
}
@media(min-width:761px) and (max-width:1500px){
  .flight-filters{
    grid-template-columns:minmax(220px,1fr) repeat(3,minmax(150px,1fr))!important;
  }
}
.external-menu .external-icon{margin-left:auto!important;opacity:.75!important}

.export-menu button{cursor:pointer!important}
.export-menu input{cursor:pointer!important}

@media(max-width:760px){
  .incomplete-label{display:none!important}
}


/* ===== V31 final requested patch ===== */
/* Incomplete-only removed */
.incomplete-label{display:none!important}

/* Compact flight filter layout after removing incomplete filter */
.flight-filters{
  grid-template-columns:minmax(230px,1.15fr) repeat(4,minmax(150px,.85fr)) max-content!important;
  gap:10px!important;
}
.flight-filters #resetFilters{
  min-width:76px!important;
  height:44px!important;
  padding:0 14px!important;
  border-radius:12px!important;
}
.flight-filters .custom-select-btn,
#flightSearch{
  height:44px!important;
  font-size:14px!important;
  border-radius:12px!important;
}
@media(min-width:761px) and (max-width:1500px){
  .flight-filters{grid-template-columns:minmax(220px,1fr) repeat(3,minmax(150px,1fr))!important}
}

/* Settings layout */
.profile-fields{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:14px!important;
  max-width:560px!important;
}
.profile-fields .form-field input{
  width:100%!important;
}
.settings-cards{
  grid-template-columns:minmax(320px,.8fr) minmax(480px,1fr)!important;
  align-items:start!important;
}
.user-management-panel{
  grid-column:1 / -1!important;
}
.user-management-wrap table.user-table{
  min-width:100%!important;
  width:100%!important;
  table-layout:auto!important;
}
.user-management-wrap{
  max-height:560px!important;
}
@media(max-width:1100px){
  .settings-cards{grid-template-columns:1fr!important}
}

/* Active selected filter styling */
.custom-select.has-value .custom-select-btn{
  background:#f1f5f9!important;
  border-color:#94a3b8!important;
}

/* ensure export menus clickable */
.export-menu,.export-menu *{pointer-events:auto!important}


/* ===== V32 export/password final patch ===== */
.export-wrap{position:relative!important;z-index:500000!important}
.export-menu.open,
.export-menu[style*="block"]{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
}
.export-menu button,
.export-menu input{
  pointer-events:auto!important;
}
.flight-filters{
  grid-template-columns:minmax(230px,1.15fr) repeat(4,minmax(150px,.85fr)) max-content!important;
}
.incomplete-label{display:none!important}


/* ===== V33 export delegation + audit filter styling ===== */
.audit-filters{
  gap:10px!important;
  align-items:center!important;
}
.audit-filters > input#auditSearch,
.audit-filters .custom-select-btn{
  height:44px!important;
  font-size:14px!important;
  border-radius:12px!important;
  border:1px solid var(--line)!important;
  outline:none!important;
  box-shadow:none!important;
  background:#fff!important;
}
.audit-filters > input#auditSearch:focus,
.audit-filters .custom-select-btn:focus{
  border-color:#94a3b8!important;
  box-shadow:0 0 0 3px rgba(148,163,184,.18)!important;
}
.audit-filters > input#auditSearch{
  flex:0 0 360px!important;
  width:360px!important;
  padding:0 16px!important;
}
.audit-filters .custom-select{
  flex:0 0 250px!important;
  min-width:250px!important;
}
.export-wrap{position:relative!important;z-index:500000!important}
.export-menu{
  pointer-events:auto!important;
}
.export-menu.open,
.export-menu[style*="block"]{
  display:block!important;
  z-index:999999!important;
  pointer-events:auto!important;
  visibility:visible!important;
  opacity:1!important;
}
.export-menu button,
.export-menu input{
  pointer-events:auto!important;
  position:relative!important;
  z-index:1000000!important;
}


/* ===== V34 final polish ===== */
.table-pagination{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:10px;
  margin:10px 4px 0;
  font-size:12px;
  color:#64748b;
}
.pagination-left,.pagination-right{display:flex;align-items:center;gap:6px}
.table-pagination select{
  height:30px;
  border:1px solid var(--line);
  border-radius:9px;
  padding:0 8px;
  background:#fff;
  font-weight:700;
  font-size:12px;
}
.page-btn,.page-nav{
  height:30px;
  min-width:30px;
  border:1px solid var(--line);
  background:#fff;
  border-radius:9px;
  font-weight:800;
  cursor:pointer;
  color:#0f172a;
}
.page-btn.active{
  background:#0f766e;
  color:#fff;
  border-color:#0f766e;
}
.page-nav:disabled{opacity:.35;cursor:not-allowed}
.page-gap{padding:0 2px;color:#94a3b8}

.audit-filters > input#auditSearch,
.audit-filters .custom-select-btn{
  height:44px!important;
  font-size:14px!important;
  border-radius:12px!important;
  border:1px solid var(--line)!important;
  outline:none!important;
  box-shadow:none!important;
}
.audit-filters > input#auditSearch:focus,
.audit-filters .custom-select-btn:focus{
  border-color:#94a3b8!important;
  box-shadow:0 0 0 3px rgba(148,163,184,.18)!important;
}
.audit-filters{gap:10px!important}
.audit-filters > input#auditSearch{width:360px!important;flex:0 0 360px!important}
.audit-filters .custom-select{min-width:250px!important;flex:0 0 250px!important}

/* add EN visual balance */
.lang-toggle .en-flag::before{content:"🇬🇧 ";font-weight:400}

.ghost-action{visibility:hidden!important;pointer-events:none!important}


/* ===== V35 final requested fixes ===== */
.table-pagination{
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  gap:10px!important;
  margin:10px 4px 0!important;
  font-size:12px!important;
  color:#64748b!important;
}
.pagination-left,.pagination-right{display:flex!important;align-items:center!important;gap:6px!important}
.table-pagination select{
  height:30px!important;
  border:1px solid var(--line)!important;
  border-radius:9px!important;
  padding:0 8px!important;
  background:#fff!important;
  font-weight:700!important;
  font-size:12px!important;
}
.page-btn,.page-nav{
  height:30px!important;
  min-width:30px!important;
  border:1px solid var(--line)!important;
  background:#fff!important;
  border-radius:9px!important;
  font-weight:800!important;
  cursor:pointer!important;
  color:#0f172a!important;
}
.page-btn.active{background:#0f766e!important;color:#fff!important;border-color:#0f766e!important}
.page-nav:disabled{opacity:.35!important;cursor:not-allowed!important}
.page-gap{padding:0 2px!important;color:#94a3b8!important}

.en-flag::before{content:"🇬🇧 ";font-weight:400}
.ghost-action{visibility:hidden!important;pointer-events:none!important}

.battery-util-list{display:grid;gap:10px}
.battery-util-row{display:grid;grid-template-columns:90px 1fr 92px;align-items:center;gap:12px}
.battery-id{font-weight:900}
.battery-metrics{text-align:right;font-size:12px;line-height:1.25}
.battery-metrics span{color:#64748b;font-weight:700}


/* ===== V36 CSV import + pagination polish ===== */
.table-pagination select{
  font-weight:500!important;
  position:relative!important;
  z-index:30!important;
}
.table-pagination, .table-pagination *{
  font-weight:500!important;
}
.page-btn.active{font-weight:700!important}
.import-preview{
  padding:12px 14px;
  border:1px dashed var(--line);
  border-radius:12px;
  color:#64748b;
  background:#f8fafc;
  line-height:1.5;
}
.muted-small{
  color:#64748b;
  font-size:13px;
  margin:0 0 12px;
  line-height:1.5;
}
.data-migration-panel{
  align-self:start;
}


/* ===== V37 settings layout polish ===== */
.data-migration-panel{
  order:3;
}
.user-management-panel{
  order:4;
}


/* ===== V38 mobile Safari production fixes ===== */
@media (max-width: 900px){
  body.drawer-open,
  body.modal-open{
    overflow:hidden!important;
    position:fixed!important;
    width:100%!important;
    touch-action:none!important;
  }

  .mobile-topbar{
    position:sticky!important;
    top:0!important;
    z-index:8000!important;
  }

  .drawer-backdrop{
    position:fixed!important;
    inset:0!important;
    z-index:9000!important;
    background:rgba(2,6,23,.55)!important;
    pointer-events:none!important;
  }
  .drawer-backdrop.open{
    pointer-events:auto!important;
  }

  .sidebar{
    position:fixed!important;
    top:0!important;
    left:0!important;
    bottom:0!important;
    height:100dvh!important;
    max-height:100dvh!important;
    width:min(82vw,360px)!important;
    z-index:10000!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    touch-action:pan-y!important;
    transform:translateX(-105%)!important;
  }
  .sidebar.open{
    transform:translateX(0)!important;
  }

  .drawer-close{
    display:flex!important;
    position:absolute!important;
    top:18px!important;
    right:18px!important;
    width:42px!important;
    height:42px!important;
    align-items:center!important;
    justify-content:center!important;
    border:0!important;
    border-radius:14px!important;
    background:rgba(255,255,255,.10)!important;
    color:#fff!important;
    font-size:22px!important;
    z-index:10002!important;
  }

  body.drawer-open .main,
  body.drawer-open .content,
  body.drawer-open #main{
    pointer-events:none!important;
  }

  body.drawer-open .flight-filters,
  body.drawer-open .table-pagination,
  body.drawer-open .export-menu,
  body.drawer-open select,
  body.drawer-open input{
    z-index:1!important;
  }

  .modal-backdrop{
    position:fixed!important;
    inset:0!important;
    z-index:30000!important;
    pointer-events:auto!important;
    touch-action:none!important;
  }
  .modal{
    position:relative!important;
    z-index:30001!important;
    max-height:calc(100dvh - 28px)!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    touch-action:pan-y!important;
  }

  body.modal-open .flight-filters,
  body.modal-open .table-pagination,
  body.modal-open .export-menu,
  body.modal-open .custom-select-menu{
    display:none!important;
  }
  body.modal-open #main,
  body.modal-open .main,
  body.modal-open .content{
    pointer-events:none!important;
  }
  body.modal-open .modal-backdrop,
  body.modal-open .modal-backdrop *{
    pointer-events:auto!important;
  }

  .table-pagination select{
    position:relative!important;
    z-index:1!important;
  }
  .flight-filters input,
  .flight-filters select,
  .flight-filters .custom-select{
    position:relative!important;
    z-index:1!important;
  }
}

/* desktop drawer close hidden */
.drawer-close{display:none}
body:not(.drawer-open) .drawer-backdrop{pointer-events:none}

/* make native controls less likely to float over modal on iOS */
body.modal-open select,
body.modal-open input[type="search"],
body.modal-open input.stable-text-input{
  transform:translateZ(0);
}


/* ===== V39 Settings layout: Data Migration directly under My Profile ===== */
.settings-left-stack{
  display:flex!important;
  flex-direction:column!important;
  gap:16px!important;
  align-self:start!important;
}
.settings-left-stack .panel{
  width:100%!important;
}
.system-configuration-panel{
  align-self:start!important;
}
.data-migration-panel{
  order:initial!important;
  margin-top:0!important;
}
.user-management-panel{
  grid-column:1 / -1!important;
}
@media(max-width:1100px){
  .settings-left-stack{
    display:flex!important;
  }
}


/* ===== V41 mobile Add/Edit Flight safe-area fix ===== */
:root{
  --mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
}

@media (max-width:900px){
  .modal-backdrop{
    padding:12px 10px calc(12px + var(--mobile-safe-bottom))!important;
    align-items:flex-start!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }

  .modal{
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    max-height:calc(100dvh - 24px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    padding-bottom:calc(132px + var(--mobile-safe-bottom))!important;
    border-radius:24px!important;
  }

  .modal .form-grid{
    grid-template-columns:1fr!important;
    gap:16px!important;
  }

  .modal .form-actions,
  .modal .flight-modal-actions{
    position:sticky!important;
    bottom:calc(8px + var(--mobile-safe-bottom))!important;
    z-index:50!important;
    display:flex!important;
    gap:10px!important;
    padding:12px 0 calc(12px + var(--mobile-safe-bottom))!important;
    margin-top:18px!important;
    background:linear-gradient(180deg, rgba(255,255,255,.72), #fff 35%)!important;
    border-top:1px solid rgba(226,232,240,.8)!important;
  }

  .modal .form-actions .btn,
  .modal .flight-modal-actions .btn{
    min-height:52px!important;
    flex:1 1 0!important;
    border-radius:14px!important;
    font-size:16px!important;
  }

  .modal input,
  .modal select,
  .modal textarea{
    font-size:16px!important;
  }

  .modal textarea{
    min-height:112px!important;
  }

  body.modal-open .flight-filters,
  body.modal-open .table-pagination,
  body.modal-open .export-menu,
  body.modal-open .custom-select-menu{
    display:none!important;
  }
}

/* Extra bottom breathing room when iOS Safari URL bar overlaps controls */
@supports (-webkit-touch-callout:none){
  @media (max-width:900px){
    .modal{
      padding-bottom:calc(160px + var(--mobile-safe-bottom))!important;
    }
  }
}


/* ===== V42 mobile modal actions: keep Save/Cancel at the real bottom of form ===== */
@media (max-width:900px){
  .modal{
    padding-bottom:calc(96px + env(safe-area-inset-bottom, 0px))!important;
    scroll-padding-bottom:calc(120px + env(safe-area-inset-bottom, 0px))!important;
  }

  .modal .form-actions,
  .modal .flight-modal-actions{
    position:static!important;
    bottom:auto!important;
    z-index:auto!important;
    display:flex!important;
    gap:10px!important;
    padding:18px 0 calc(72px + env(safe-area-inset-bottom, 0px))!important;
    margin-top:22px!important;
    background:transparent!important;
    border-top:0!important;
  }

  .modal .form-actions .btn,
  .modal .flight-modal-actions .btn{
    min-height:52px!important;
    flex:1 1 0!important;
    border-radius:14px!important;
    font-size:16px!important;
  }

  .modal form{
    padding-bottom:calc(24px + env(safe-area-inset-bottom, 0px))!important;
  }
}


/* ===== V44 mobile drawer hamburger close fix ===== */
@media (max-width:900px){
  .sidebar.open .drawer-close{
    display:flex!important;
    pointer-events:auto!important;
    cursor:pointer!important;
    touch-action:manipulation!important;
    z-index:10005!important;
  }
}
@media (min-width:901px){
  .drawer-close{display:none!important}
}




/* ===== V50 CLEAN MOBILE TABLE LAYOUT ===== */
/* This block intentionally replaces V45-V49 table overrides. */

/* Core mobile layout */
@media (max-width:900px), (hover:none) and (orientation:landscape){
  html, body{
    max-width:100vw!important;
    overflow-x:hidden!important;
  }

  .mobile-topbar{
    display:flex!important;
    position:sticky!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100vw!important;
    max-width:100vw!important;
    z-index:8000!important;
    box-sizing:border-box!important;
  }

  .content,
  .main,
  #main{
    width:100vw!important;
    max-width:100vw!important;
    margin:0!important;
    padding-left:12px!important;
    padding-right:12px!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
  }

  body:not(.drawer-open) .shell{
    width:100vw!important;
    max-width:100vw!important;
    margin:0!important;
    transform:none!important;
  }

  body:not(.drawer-open) .sidebar{
    transform:translate3d(-105%,0,0)!important;
    pointer-events:none!important;
  }

  body.drawer-open .sidebar{
    transform:translate3d(0,0,0)!important;
    pointer-events:auto!important;
    z-index:10020!important;
  }

  body:not(.drawer-open) .drawer-backdrop{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  body.drawer-open .drawer-backdrop,
  .drawer-backdrop.open{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    z-index:9000!important;
  }
}

/* All table wrappers: real horizontal scroll only */
.table-wrap{
  padding:0!important;
  margin-left:0!important;
  margin-right:0!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-x pan-y!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}

.table-wrap table{
  margin:0!important;
  border-spacing:0!important;
}

.table-wrap th,
.table-wrap td{
  position:static!important;
  left:auto!important;
  right:auto!important;
  transform:none!important;
  box-sizing:border-box!important;
  vertical-align:middle!important;
  z-index:auto!important;
}

/* Flight Log table only */
@media (max-width:900px){
  .flight-log-table-wrap{
    width:100%!important;
    max-width:100%!important;
    border-radius:18px!important;
    background:#fff!important;
  }

  .flight-log-table{
    width:1180px!important;
    min-width:1180px!important;
    max-width:none!important;
    table-layout:fixed!important;
    border-collapse:collapse!important;
  }

  .flight-log-table th,
  .flight-log-table td{
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    border-left:1px solid #e5e7eb!important;
    border-bottom:1px solid #e5e7eb!important;
    white-space:nowrap!important;
    padding-top:10px!important;
    padding-bottom:10px!important;
  }

  .flight-log-table th:first-child,
  .flight-log-table td:first-child{
    border-left:0!important;
  }

  .flight-log-table th:nth-child(1),
  .flight-log-table td:nth-child(1){
    width:66px!important;
    min-width:66px!important;
    max-width:66px!important;
    text-align:center!important;
    padding-left:4px!important;
    padding-right:4px!important;
  }

  .flight-log-table th:nth-child(2),
  .flight-log-table td:nth-child(2){
    width:128px!important;
    min-width:128px!important;
    max-width:128px!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }

  .flight-log-table th:nth-child(3),
  .flight-log-table td:nth-child(3){
    width:150px!important;
    min-width:150px!important;
    max-width:150px!important;
    padding-left:10px!important;
    padding-right:10px!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  .flight-log-table th:nth-child(4),
  .flight-log-table td:nth-child(4){
    width:120px!important;
    min-width:120px!important;
    max-width:120px!important;
    padding-left:10px!important;
    padding-right:10px!important;
  }

  .flight-log-table th:nth-child(5),
  .flight-log-table td:nth-child(5){
    width:180px!important;
    min-width:180px!important;
    max-width:180px!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }

  .flight-log-table th:nth-child(6),
  .flight-log-table td:nth-child(6){
    width:170px!important;
    min-width:170px!important;
    max-width:170px!important;
  }

  .flight-log-table th:nth-child(7),
  .flight-log-table td:nth-child(7){
    width:150px!important;
    min-width:150px!important;
    max-width:150px!important;
  }

  .flight-log-table th:nth-child(8),
  .flight-log-table td:nth-child(8){
    width:140px!important;
    min-width:140px!important;
    max-width:140px!important;
  }

  .flight-log-table th:nth-child(9),
  .flight-log-table td:nth-child(9){
    width:100px!important;
    min-width:100px!important;
    max-width:100px!important;
  }

  .flight-log-table td:first-child .status-icon,
  .flight-log-table td:first-child .status-badge,
  .flight-log-table .status-icon,
  .flight-log-table .status-badge{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    max-width:34px!important;
    font-size:21px!important;
    line-height:34px!important;
    margin:0 auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  .flight-log-table td:first-child img,
  .flight-log-table td:first-child svg{
    max-width:30px!important;
    max-height:30px!important;
  }
}

/* Desktop left edge should be flush */
@media (min-width:901px){
  .flight-log-table-wrap,
  .table-wrap{
    padding-left:0!important;
  }

  .flight-log-table,
  .table-wrap table{
    margin-left:0!important;
  }
}

/* Settings/User Management: independent scroll, no Flight Log column rules */
@media (max-width:900px){
  .settings-page,
  .settings-grid,
  .settings-left-stack,
  .user-management-panel,
  .panel{
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  .user-table-wrap,
  .settings-page .table-wrap,
  .user-management-panel .table-wrap,
  .audit-page .table-wrap{
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-x pan-y!important;
    pointer-events:auto!important;
  }

  .user-management-table,
  .user-management-panel table{
    width:920px!important;
    min-width:920px!important;
    max-width:none!important;
    table-layout:fixed!important;
    border-collapse:collapse!important;
    margin:0!important;
  }
}


/* ===== V51 desktop/notebook left gutter fix ===== */
/* Keep mobile V50 behavior, remove desktop/table-card left inset at scrollLeft=0. */
@media (min-width:901px){
  .flight-log-table-wrap,
  .table-wrap{
    padding-left:0!important;
    padding-right:0!important;
    margin-left:0!important;
    overflow-x:auto!important;
    background:#fff!important;
  }

  .flight-log-table-wrap .flight-log-table,
  .flight-log-table-wrap table,
  .table-wrap > table{
    margin-left:0!important;
    margin-right:0!important;
    border-collapse:collapse!important;
    border-spacing:0!important;
  }

  .flight-log-table-wrap th:first-child,
  .flight-log-table-wrap td:first-child,
  .table-wrap > table th:first-child,
  .table-wrap > table td:first-child{
    border-left:0!important;
  }

  .flight-log-table-wrap::-webkit-scrollbar-track,
  .table-wrap::-webkit-scrollbar-track{
    margin-left:0!important;
  }
}

/* Notebook width still desktop but visually tight: ensure the table starts flush in the rounded card. */
@media (min-width:901px) and (max-width:1440px){
  .flight-log-table-wrap{
    padding-left:0!important;
  }
  .flight-log-table-wrap table{
    transform:none!important;
    left:0!important;
  }
}


/* ===== V52 User Management vertical scroll fix ===== */
/* V50/V51 hid vertical overflow globally; restore vertical scroll for long management tables. */

/* Keep Flight Log horizontal-only to avoid row/card bleed */
.flight-log-table-wrap{
  overflow-x:auto!important;
  overflow-y:hidden!important;
}

/* User Management and Settings tables need vertical scroll when rows exceed card height */
.user-management-panel .table-wrap,
.user-table-wrap{
  overflow-x:auto!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-x pan-y!important;
  max-height:min(62vh, 680px)!important;
  overscroll-behavior:contain!important;
}

/* Desktop / notebook: table card should scroll down inside the panel */
@media (min-width:901px){
  .user-management-panel .table-wrap,
  .user-table-wrap{
    max-height:calc(100vh - 310px)!important;
    min-height:240px!important;
  }
}

/* Mobile: allow both horizontal and vertical scroll inside the table area */
@media (max-width:900px){
  .user-management-panel .table-wrap,
  .user-table-wrap{
    max-height:58vh!important;
    overflow-x:auto!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-x pan-y!important;
  }

  .settings-page .table-wrap:not(.flight-log-table-wrap),
  .audit-page .table-wrap:not(.flight-log-table-wrap){
    overflow-x:auto!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-x pan-y!important;
  }
}

/* Prevent the global .table-wrap overflow-y:hidden from affecting non-flight tables */
.table-wrap:not(.flight-log-table-wrap){
  overflow-y:auto!important;
}


/* ===== V53 targeted fixes ===== */

/* Hard fix: remove the remaining visual white gutter before Status on Flight Log only */
.flight-log-table-wrap{
  padding-left:0!important;
  margin-left:0!important;
  background:transparent!important;
  scrollbar-gutter:auto!important;
}

.flight-log-table-wrap .flight-log-table,
.flight-log-table-wrap table{
  margin-left:0!important;
  border-collapse:collapse!important;
  border-spacing:0!important;
  transform:none!important;
  left:0!important;
}

.flight-log-table-wrap::before,
.flight-log-table-wrap table::before,
.flight-log-table-wrap .flight-log-table::before{
  content:none!important;
  display:none!important;
  width:0!important;
  min-width:0!important;
  padding:0!important;
  margin:0!important;
}

.flight-log-table-wrap > *{
  margin-left:0!important;
}

.flight-log-table-wrap th:first-child,
.flight-log-table-wrap td:first-child{
  border-left:0!important;
  margin-left:0!important;
  background-clip:padding-box!important;
}

/* Do not fight native text selection/editing in Settings */
.settings-page input,
.settings-page textarea,
.settings-page select,
.system-configuration-panel input,
.system-configuration-panel textarea,
.system-configuration-panel select{
  user-select:text!important;
  -webkit-user-select:text!important;
  touch-action:auto!important;
  overflow-x:auto!important;
}

/* Settings config fields: allow horizontal text cursor/selection without forcing page/table scroll reset */
.system-configuration-panel input,
.system-configuration-panel textarea{
  white-space:pre!important;
  overflow:auto!important;
  -webkit-overflow-scrolling:auto!important;
}

/* Non-table panels should not inherit table scroll locks */
.settings-page .panel:not(.user-management-panel),
.system-configuration-panel{
  overflow:visible!important;
  touch-action:auto!important;
}


/* ===== V54 consolidated fixes ===== */

/* Flight Log header line breaks */
.flight-log-table th{
  white-space:normal!important;
  line-height:1.15!important;
}

/* Stable, compact Flight Log column widths. Keep enough width to prevent overlap. */
.flight-log-table{
  table-layout:fixed!important;
  border-collapse:collapse!important;
}

/* Status */
.flight-log-table th:nth-child(1),
.flight-log-table td:nth-child(1){
  width:72px!important;
  min-width:72px!important;
  max-width:72px!important;
  text-align:center!important;
}

/* Flight ID */
.flight-log-table th:nth-child(2),
.flight-log-table td:nth-child(2){
  width:142px!important;
  min-width:142px!important;
  max-width:142px!important;
}

/* Drone ID */
.flight-log-table th:nth-child(3),
.flight-log-table td:nth-child(3){
  width:150px!important;
  min-width:150px!important;
  max-width:150px!important;
}

/* Date */
.flight-log-table th:nth-child(4),
.flight-log-table td:nth-child(4){
  width:125px!important;
  min-width:125px!important;
  max-width:125px!important;
}

/* RPIC / Pilot */
.flight-log-table th:nth-child(5),
.flight-log-table td:nth-child(5){
  width:175px!important;
  min-width:175px!important;
  max-width:175px!important;
}

/* Copilot / VO */
.flight-log-table th:nth-child(6),
.flight-log-table td:nth-child(6){
  width:175px!important;
  min-width:175px!important;
  max-width:175px!important;
}

/* Mission Type */
.flight-log-table th:nth-child(7),
.flight-log-table td:nth-child(7){
  width:145px!important;
  min-width:145px!important;
  max-width:145px!important;
}

/* Flight Status */
.flight-log-table th:nth-child(8),
.flight-log-table td:nth-child(8){
  width:140px!important;
  min-width:140px!important;
  max-width:140px!important;
}

/* Battery ID */
.flight-log-table th:nth-child(9),
.flight-log-table td:nth-child(9){
  width:85px!important;
  min-width:85px!important;
  max-width:85px!important;
}

/* Coldcare ID */
.flight-log-table th:nth-child(10),
.flight-log-table td:nth-child(10){
  width:130px!important;
  min-width:130px!important;
  max-width:130px!important;
}

/* Payload Type */
.flight-log-table th:nth-child(11),
.flight-log-table td:nth-child(11){
  width:185px!important;
  min-width:185px!important;
  max-width:185px!important;
}

/* Payload Weight */
.flight-log-table th:nth-child(12),
.flight-log-table td:nth-child(12){
  width:120px!important;
  min-width:120px!important;
  max-width:120px!important;
}

/* Flight Plan ID */
.flight-log-table th:nth-child(13),
.flight-log-table td:nth-child(13){
  width:190px!important;
  min-width:190px!important;
  max-width:190px!important;
}

/* Origin */
.flight-log-table th:nth-child(14),
.flight-log-table td:nth-child(14){
  width:170px!important;
  min-width:170px!important;
  max-width:170px!important;
}

/* Destination */
.flight-log-table th:nth-child(15),
.flight-log-table td:nth-child(15){
  width:170px!important;
  min-width:170px!important;
  max-width:170px!important;
}

/* Weather */
.flight-log-table th:nth-child(16),
.flight-log-table td:nth-child(16){
  width:135px!important;
  min-width:135px!important;
  max-width:135px!important;
}

/* Battery Takeoff */
.flight-log-table th:nth-child(17),
.flight-log-table td:nth-child(17){
  width:120px!important;
  min-width:120px!important;
  max-width:120px!important;
}

/* Battery Landing */
.flight-log-table th:nth-child(18),
.flight-log-table td:nth-child(18){
  width:120px!important;
  min-width:120px!important;
  max-width:120px!important;
}

/* Takeoff Time */
.flight-log-table th:nth-child(19),
.flight-log-table td:nth-child(19){
  width:115px!important;
  min-width:115px!important;
  max-width:115px!important;
}

/* Landing Time */
.flight-log-table th:nth-child(20),
.flight-log-table td:nth-child(20){
  width:115px!important;
  min-width:115px!important;
  max-width:115px!important;
}

/* Flight Duration */
.flight-log-table th:nth-child(21),
.flight-log-table td:nth-child(21){
  width:125px!important;
  min-width:125px!important;
  max-width:125px!important;
}

/* Preflight */
.flight-log-table th:nth-child(22),
.flight-log-table td:nth-child(22){
  width:155px!important;
  min-width:155px!important;
  max-width:155px!important;
}

/* Incident Severity */
.flight-log-table th:nth-child(23),
.flight-log-table td:nth-child(23){
  width:120px!important;
  min-width:120px!important;
  max-width:120px!important;
}

/* Abnormality Observation */
.flight-log-table th:nth-child(24),
.flight-log-table td:nth-child(24){
  width:240px!important;
  min-width:240px!important;
  max-width:240px!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}

/* Remark */
.flight-log-table th:nth-child(25),
.flight-log-table td:nth-child(25){
  width:190px!important;
  min-width:190px!important;
  max-width:190px!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}

/* Action */
.flight-log-table th:nth-child(26),
.flight-log-table td:nth-child(26){
  width:85px!important;
  min-width:85px!important;
  max-width:85px!important;
  text-align:center!important;
}

/* Stop table/layout helpers from interfering with text selection */
.settings-page input,
.settings-page textarea,
.settings-page select,
.modal input,
.modal textarea,
.modal select{
  user-select:text!important;
  -webkit-user-select:text!important;
  touch-action:auto!important;
}

/* Keep Flight Log table scroll real and stable */
.flight-log-table-wrap{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-x pan-y!important;
}


/* ===== V55 table containment fix ===== */
/* Keep every row background/action button inside the scrollable table/card edge. */

.flight-log-table-wrap{
  position:relative!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  background:#fff!important;
  border-radius:18px!important;
  padding:0!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
  contain:paint!important;
}

/* Use separate borders so row backgrounds paint cleanly to the last column */
.flight-log-table-wrap .flight-log-table{
  border-collapse:separate!important;
  border-spacing:0!important;
  table-layout:fixed!important;
  margin:0!important;
  background:#fff!important;
}

/* Size table by sum of columns, including action column, so nothing hangs outside */
.flight-log-table{
  width:3312px!important;
  min-width:3312px!important;
  max-width:none!important;
}

.flight-log-table th,
.flight-log-table td{
  box-sizing:border-box!important;
  position:static!important;
  overflow:hidden!important;
  background-clip:padding-box!important;
}

/* Make row background apply to every cell, including action column */
.flight-log-table tbody tr td{
  background:inherit!important;
}

.flight-log-table tbody tr.warning,
.flight-log-table tbody tr.warning td{
  background:#fff4c2!important;
}

.flight-log-table tbody tr.danger,
.flight-log-table tbody tr.danger td{
  background:#f8d7da!important;
}

.flight-log-table tbody tr.pending,
.flight-log-table tbody tr.pending td{
  background:#ffd7a3!important;
}

/* Action column must be real table column, not visually floating outside */
.flight-log-table th.action-cell-normal,
.flight-log-table td.action-cell-normal,
.flight-log-table th:last-child,
.flight-log-table td:last-child{
  width:96px!important;
  min-width:96px!important;
  max-width:96px!important;
  padding:8px 8px!important;
  text-align:center!important;
  background:inherit!important;
  overflow:hidden!important;
  border-right:0!important;
}

.flight-log-table .action-inline{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
}

.flight-log-table .action-inline .icon-btn{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  max-width:44px!important;
  padding:0!important;
  margin:0!important;
  border-radius:14px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 44px!important;
}

/* Desktop/notebook: card clips internal table cleanly at rounded border */
@media (min-width:901px){
  .flight-log-table-wrap{
    width:100%!important;
    max-width:100%!important;
    clip-path:inset(0 round 18px)!important;
  }
}

/* Mobile: avoid pink/delete half-button outside right edge and keep scroll area tidy */
@media (max-width:900px){
  .flight-log-table{
    width:3312px!important;
    min-width:3312px!important;
  }

  .flight-log-table th.action-cell-normal,
  .flight-log-table td.action-cell-normal,
  .flight-log-table th:last-child,
  .flight-log-table td:last-child{
    width:96px!important;
    min-width:96px!important;
    max-width:96px!important;
    padding-left:8px!important;
    padding-right:8px!important;
  }

  .flight-log-table .action-inline .icon-btn{
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    max-width:44px!important;
  }
}

/* Prevent any child control from painting outside table wrap */
.flight-log-table-wrap *{
  max-width:revert-layer;
}


/* ===== V56 Audit detail + pagination ===== */
.audit-table-wrap{
  max-height:none!important;
  overflow-x:auto!important;
  overflow-y:auto!important;
}
.audit-table{
  min-width:1180px!important;
  table-layout:fixed!important;
}
.audit-table th:nth-child(1), .audit-table td:nth-child(1){width:190px!important;}
.audit-table th:nth-child(2), .audit-table td:nth-child(2){width:150px!important;}
.audit-table th:nth-child(3), .audit-table td:nth-child(3){width:120px!important;}
.audit-table th:nth-child(4), .audit-table td:nth-child(4){width:150px!important;}
.audit-table th:nth-child(5), .audit-table td:nth-child(5){width:150px!important;}
.audit-table th:nth-child(6), .audit-table td:nth-child(6){width:250px!important;}
.audit-table th:nth-child(7), .audit-table td:nth-child(7){width:360px!important;}
.audit-detail-cell{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  line-height:1.35!important;
}
#auditPagination{
  margin-top:14px!important;
}


/* ===== V57 mobile scroll + text selection fix ===== */

/* Let the document scroll normally. Previous patches locked overflow/touch handling too broadly. */
html,
body{
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior-y:auto!important;
}

/* Text selection/copy should work across the app. */
body,
#app,
.main,
.content,
.page,
.panel,
.table-wrap,
table,
th,
td,
input,
textarea,
select,
button,
label,
p,
div,
span{
  -webkit-user-select:text!important;
  user-select:text!important;
}

/* Keep buttons tappable but still do not block page text selection elsewhere. */
button,
.btn,
.icon-btn{
  -webkit-user-select:none!important;
  user-select:none!important;
}

/* Mobile: Settings and Audit pages must scroll vertically. */
@media (max-width:900px), (hover:none) and (orientation:landscape){
  body:not(.drawer-open):not(.modal-open){
    overflow-y:auto!important;
    overflow-x:hidden!important;
    position:static!important;
    height:auto!important;
    min-height:100dvh!important;
    touch-action:pan-y!important;
  }

  body:not(.drawer-open):not(.modal-open) #app,
  body:not(.drawer-open):not(.modal-open) .shell,
  body:not(.drawer-open):not(.modal-open) .main,
  body:not(.drawer-open):not(.modal-open) .content,
  body:not(.drawer-open):not(.modal-open) #main{
    overflow-y:visible!important;
    height:auto!important;
    min-height:100dvh!important;
    max-height:none!important;
    touch-action:pan-y!important;
  }

  #main.settings-page,
  #main.audit-page,
  .settings-page,
  .audit-page{
    overflow-y:visible!important;
    height:auto!important;
    max-height:none!important;
    touch-action:pan-y!important;
    -webkit-overflow-scrolling:touch!important;
  }

  .settings-page .panel,
  .audit-page .panel,
  .settings-page .settings-grid,
  .settings-page .settings-left-stack{
    overflow:visible!important;
    height:auto!important;
    max-height:none!important;
    touch-action:pan-y!important;
  }

  /* Audit table can scroll inside horizontally, but should not trap vertical page scroll. */
  .audit-table-wrap,
  .settings-page .table-wrap:not(.flight-log-table-wrap),
  .user-table-wrap{
    overflow-x:auto!important;
    overflow-y:visible!important;
    max-height:none!important;
    touch-action:pan-x pan-y!important;
    -webkit-overflow-scrolling:touch!important;
  }

  /* User management table may still need vertical scrolling inside if very long, but allow page scroll too. */
  .user-management-panel .table-wrap,
  .user-table-wrap{
    max-height:none!important;
    overflow-y:visible!important;
  }

  /* Inputs/textarea/select: preserve native drag selection and cursor behavior. */
  input,
  textarea,
  select,
  .stable-text-input,
  .settings-page input,
  .settings-page textarea,
  .settings-page select{
    touch-action:auto!important;
    -webkit-user-select:text!important;
    user-select:text!important;
  }
}

/* Only lock scroll when drawer or modal is truly open. */
body.drawer-open,
body.modal-open{
  overflow:hidden!important;
}

/* But allow modal content itself to scroll and text to be selected. */
.modal,
.modal *,
.modal-backdrop .modal{
  -webkit-user-select:text!important;
  user-select:text!important;
}
.modal{
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
}

/* Desktop/notebook: do not trap vertical wheel on audit/settings table cards. */
@media (min-width:901px){
  .audit-table-wrap,
  .settings-page .table-wrap:not(.flight-log-table-wrap),
  .user-table-wrap{
    overflow-x:auto!important;
    overflow-y:visible!important;
    max-height:none!important;
  }
}


/* ===== V58 Flight Log table cell isolation + row color fix ===== */
/* Fix text bleeding into Status/Flight ID and row color distortion from inherited backgrounds. */

/* Main table: fixed layout, clipped cells, no inherited background leakage */
.flight-log-table-wrap{
  isolation:isolate!important;
  background:#fff!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  border-radius:18px!important;
  contain:paint!important;
}

.flight-log-table{
  border-collapse:separate!important;
  border-spacing:0!important;
  table-layout:fixed!important;
  background:#fff!important;
  margin:0!important;
}

/* Every cell clips its own content; no text may paint into neighbor cells */
.flight-log-table th,
.flight-log-table td{
  position:relative!important;
  z-index:0!important;
  overflow:hidden!important;
  clip-path:inset(0)!important;
  contain:paint!important;
  box-sizing:border-box!important;
  background:#fff!important;
  background-clip:padding-box!important;
  color:#111827!important;
  text-overflow:ellipsis!important;
  vertical-align:middle!important;
  border-left:1px solid #e5e7eb!important;
  border-bottom:1px solid #e5e7eb!important;
}

.flight-log-table th:first-child,
.flight-log-table td:first-child{
  border-left:0!important;
}

/* Header always neutral */
.flight-log-table thead th{
  background:#f8fafc!important;
  white-space:normal!important;
  line-height:1.15!important;
}

/* Body default row */
.flight-log-table tbody tr:not(.warning):not(.danger):not(.pending) td{
  background:#fff!important;
}

/* Row states: apply to cells directly, not via inherit */
.flight-log-table tbody tr.warning td{
  background:#fff4c2!important;
}

.flight-log-table tbody tr.danger td{
  background:#f8d7da!important;
}

.flight-log-table tbody tr.pending td{
  background:#ffd7a3!important;
}

/* First columns must stay visually clean and not receive neighbor text */
.flight-log-table th:nth-child(1),
.flight-log-table td:nth-child(1){
  width:72px!important;
  min-width:72px!important;
  max-width:72px!important;
  padding-left:6px!important;
  padding-right:6px!important;
  text-align:center!important;
  white-space:nowrap!important;
}

.flight-log-table th:nth-child(2),
.flight-log-table td:nth-child(2){
  width:142px!important;
  min-width:142px!important;
  max-width:142px!important;
  padding-left:12px!important;
  padding-right:12px!important;
  white-space:nowrap!important;
}

/* Text-heavy cells: wrap inside their own cell only */
.flight-log-table td:nth-child(11),
.flight-log-table td:nth-child(14),
.flight-log-table td:nth-child(15),
.flight-log-table td:nth-child(24),
.flight-log-table td:nth-child(25){
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}

/* Numeric/small fields stay one-line */
.flight-log-table td:nth-child(9),
.flight-log-table td:nth-child(12),
.flight-log-table td:nth-child(17),
.flight-log-table td:nth-child(18),
.flight-log-table td:nth-child(19),
.flight-log-table td:nth-child(20),
.flight-log-table td:nth-child(21),
.flight-log-table td:nth-child(23){
  white-space:nowrap!important;
  overflow-wrap:normal!important;
}

/* Status icon should not be clipped incorrectly */
.flight-log-table td:first-child .status-icon,
.flight-log-table td:first-child .status-badge,
.flight-log-table .status-icon,
.flight-log-table .status-badge{
  position:relative!important;
  z-index:1!important;
  overflow:hidden!important;
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  max-width:34px!important;
  margin:0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Action buttons stay inside last column */
.flight-log-table th:last-child,
.flight-log-table td:last-child,
.flight-log-table th.action-cell-normal,
.flight-log-table td.action-cell-normal{
  background-clip:padding-box!important;
  overflow:hidden!important;
  text-align:center!important;
  width:96px!important;
  min-width:96px!important;
  max-width:96px!important;
}

/* Prevent old inherited row background rule from V55 from winning */
.flight-log-table tbody tr td{
  background-clip:padding-box!important;
}

/* Mobile and desktop both use the same cell isolation */
@media (max-width:900px){
  .flight-log-table th,
  .flight-log-table td{
    overflow:hidden!important;
    clip-path:inset(0)!important;
    contain:paint!important;
  }
}


/* ===== V59 restore row condition color + contain action column ===== */
/* V58 intentionally isolated cells; this restores condition colors by painting each TD directly. */

.flight-log-table-wrap{
  background:#fff!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  border-radius:18px!important;
  contain:paint!important;
}

/* Default body cells */
.flight-log-table tbody tr td{
  background-color:#fff!important;
  background-image:none!important;
  background-clip:padding-box!important;
}

/* Condition rows: support all class names used across earlier versions */
.flight-log-table tbody tr.warning td,
.flight-log-table tbody tr.warn td,
.flight-log-table tbody tr.row-warning td,
.flight-log-table tbody tr.status-warning td,
.flight-log-table tbody tr.incomplete td{
  background-color:#fff4c2!important;
}

.flight-log-table tbody tr.danger td,
.flight-log-table tbody tr.critical td,
.flight-log-table tbody tr.row-danger td,
.flight-log-table tbody tr.status-danger td,
.flight-log-table tbody tr.emergency td{
  background-color:#f8d7da!important;
}

.flight-log-table tbody tr.pending td,
.flight-log-table tbody tr.aborted td,
.flight-log-table tbody tr.row-pending td,
.flight-log-table tbody tr.status-pending td,
.flight-log-table tbody tr.orange td{
  background-color:#ffd7a3!important;
}

/* If the app colors rows inline or by border only, catch cells with emergency/incident content via old classes */
.flight-log-table tr[class*="warn"] td{ background-color:#fff4c2!important; }
.flight-log-table tr[class*="danger"] td{ background-color:#f8d7da!important; }
.flight-log-table tr[class*="critical"] td{ background-color:#f8d7da!important; }
.flight-log-table tr[class*="abort"] td{ background-color:#ffd7a3!important; }

/* Keep header neutral */
.flight-log-table thead th{
  background-color:#f8fafc!important;
}

/* Action column: make it fully inside the table and wide enough for edit/delete buttons */
.flight-log-table th:last-child,
.flight-log-table td:last-child,
.flight-log-table th.action-cell-normal,
.flight-log-table td.action-cell-normal{
  width:132px!important;
  min-width:132px!important;
  max-width:132px!important;
  padding:8px 10px!important;
  text-align:center!important;
  overflow:hidden!important;
  border-right:0!important;
}

/* Real action container */
.flight-log-table td:last-child .action-inline,
.flight-log-table td.action-cell-normal .action-inline{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  width:112px!important;
  min-width:112px!important;
  max-width:112px!important;
  margin:0 auto!important;
  overflow:hidden!important;
}

/* Button sizing */
.flight-log-table td:last-child .icon-btn,
.flight-log-table td.action-cell-normal .icon-btn,
.flight-log-table .action-inline .icon-btn{
  width:48px!important;
  height:48px!important;
  min-width:48px!important;
  max-width:48px!important;
  flex:0 0 48px!important;
  padding:0!important;
  margin:0!important;
  border-radius:14px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Add room for larger action column by extending total table width.
   Existing column sum + action expansion. */
.flight-log-table{
  width:3360px!important;
  min-width:3360px!important;
  max-width:none!important;
}

/* Do not let scroll container clip inside action column before its right edge */
.flight-log-table-wrap .flight-log-table{
  margin-right:0!important;
}

/* Preserve cell isolation from V58 */
.flight-log-table th,
.flight-log-table td{
  overflow:hidden!important;
  clip-path:inset(0)!important;
  contain:paint!important;
}


/* ===== V60 reliable row condition backgrounds ===== */
/* Apply backgrounds using JS-generated row-normal/row-warning/row-danger/row-aborted classes. */

/* Remove V58/V59 white cell override for classified rows by overriding later */
.flight-log-table tbody tr.row-normal td{
  background-color:#ffffff!important;
}

.flight-log-table tbody tr.row-warning td,
.flight-log-table tbody tr.row-warning td:first-child,
.flight-log-table tbody tr.row-warning td:last-child{
  background-color:#fff4c2!important;
}

.flight-log-table tbody tr.row-danger td,
.flight-log-table tbody tr.row-danger td:first-child,
.flight-log-table tbody tr.row-danger td:last-child{
  background-color:#f8d7da!important;
}

.flight-log-table tbody tr.row-aborted td,
.flight-log-table tbody tr.row-aborted td:first-child,
.flight-log-table tbody tr.row-aborted td:last-child{
  background-color:#ffd7a3!important;
}

/* Keep action buttons readable on colored rows */
.flight-log-table tbody tr.row-warning td.action-cell-normal,
.flight-log-table tbody tr.row-danger td.action-cell-normal,
.flight-log-table tbody tr.row-aborted td.action-cell-normal,
.flight-log-table tbody tr.row-warning td:last-child,
.flight-log-table tbody tr.row-danger td:last-child,
.flight-log-table tbody tr.row-aborted td:last-child{
  background-color:inherit!important;
}

/* Because inherit can be unreliable after earlier patches, reset child button backgrounds only */
.flight-log-table tbody tr.row-warning .icon-btn,
.flight-log-table tbody tr.row-danger .icon-btn,
.flight-log-table tbody tr.row-aborted .icon-btn{
  background-clip:padding-box!important;
}

/* Preserve condition line colors */
.flight-log-table tbody tr.row-warning td{ border-bottom-color:#f59e0b!important; }
.flight-log-table tbody tr.row-danger td{ border-bottom-color:#ef4444!important; }
.flight-log-table tbody tr.row-aborted td{ border-bottom-color:#f97316!important; }


/* ===== V61 definitive row tone background fix ===== */
/* Uses data-tone from JS, not legacy row classes. This is intentionally last and strongest. */

/* Do not allow older white-cell rules to win for condition rows */
.flight-log-table tbody tr[data-tone="normal"] > td{
  background:#ffffff!important;
  background-color:#ffffff!important;
}

.flight-log-table tbody tr[data-tone="warning"] > td{
  background:#fff4c2!important;
  background-color:#fff4c2!important;
}

.flight-log-table tbody tr[data-tone="danger"] > td{
  background:#f8d7da!important;
  background-color:#f8d7da!important;
}

.flight-log-table tbody tr[data-tone="aborted"] > td{
  background:#ffd7a3!important;
  background-color:#ffd7a3!important;
}

/* Keep colored row background under action buttons as well */
.flight-log-table tbody tr[data-tone="warning"] > td.action-cell-normal,
.flight-log-table tbody tr[data-tone="warning"] > td:last-child{
  background:#fff4c2!important;
  background-color:#fff4c2!important;
}
.flight-log-table tbody tr[data-tone="danger"] > td.action-cell-normal,
.flight-log-table tbody tr[data-tone="danger"] > td:last-child{
  background:#f8d7da!important;
  background-color:#f8d7da!important;
}
.flight-log-table tbody tr[data-tone="aborted"] > td.action-cell-normal,
.flight-log-table tbody tr[data-tone="aborted"] > td:last-child{
  background:#ffd7a3!important;
  background-color:#ffd7a3!important;
}

/* Preserve border indicators */
.flight-log-table tbody tr[data-tone="warning"] > td{border-bottom-color:#f59e0b!important;}
.flight-log-table tbody tr[data-tone="danger"] > td{border-bottom-color:#ef4444!important;}
.flight-log-table tbody tr[data-tone="aborted"] > td{border-bottom-color:#f97316!important;}

/* Keep header neutral */
.flight-log-table thead th{
  background:#f8fafc!important;
  background-color:#f8fafc!important;
}

/* Extra guard: cell content stays clipped inside own cell */
.flight-log-table td{
  overflow:hidden!important;
  clip-path:inset(0)!important;
  contain:paint!important;
}

/* Text cells can wrap only within the cell, not bleed to Status/Flight ID */
.flight-log-table td[data-cell="origin"],
.flight-log-table td[data-cell="destination"],
.flight-log-table td[data-cell="payloadType"],
.flight-log-table td[data-cell="abnormalityObservation"],
.flight-log-table td[data-cell="remark"]{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}


/* ===== V62 inline row background definitive fix ===== */
/* Flight row color is now written inline on every TD by app.js. Keep legacy rules from washing it out. */
.flight-log-table tbody tr[data-tone] > td{
  background-clip:padding-box!important;
}

.flight-log-table tbody tr[data-tone="warning"] > td{ background-color:#fff4c2!important; background:#fff4c2!important; }
.flight-log-table tbody tr[data-tone="danger"] > td{ background-color:#f8d7da!important; background:#f8d7da!important; }
.flight-log-table tbody tr[data-tone="aborted"] > td{ background-color:#ffd7a3!important; background:#ffd7a3!important; }
.flight-log-table tbody tr[data-tone="normal"] > td{ background-color:#ffffff!important; background:#ffffff!important; }

.flight-log-table tbody tr[data-tone="warning"] > td{ border-bottom-color:#f59e0b!important; }
.flight-log-table tbody tr[data-tone="danger"] > td{ border-bottom-color:#ef4444!important; }
.flight-log-table tbody tr[data-tone="aborted"] > td{ border-bottom-color:#f97316!important; }

.flight-log-table td{
  overflow:hidden!important;
  clip-path:inset(0)!important;
  contain:paint!important;
}


/* ===== V63 absolute row background override ===== */
/* This is intentionally last. It uses inline --row-bg set on every TD. */
.flight-log-table tbody tr[data-tone] > td[style],
.flight-log-table tbody tr[data-tone] > td.action-cell-normal[style]{
  background:var(--row-bg)!important;
  background-color:var(--row-bg)!important;
  background-image:none!important;
}

/* Strong final fallback by tone */
.flight-log-table tbody tr[data-tone="warning"] > td{
  --row-bg:#fff4c2;
  background:#fff4c2!important;
  background-color:#fff4c2!important;
}
.flight-log-table tbody tr[data-tone="danger"] > td{
  --row-bg:#f8d7da;
  background:#f8d7da!important;
  background-color:#f8d7da!important;
}
.flight-log-table tbody tr[data-tone="aborted"] > td{
  --row-bg:#ffd7a3;
  background:#ffd7a3!important;
  background-color:#ffd7a3!important;
}
.flight-log-table tbody tr[data-tone="normal"] > td{
  --row-bg:#ffffff;
  background:#ffffff!important;
  background-color:#ffffff!important;
}


/* ===== V64 Flight Log vertical scroll + newest-first support ===== */
/* Let the page scroll vertically while keeping table horizontal scroll. */
html,
body{
  height:auto!important;
  min-height:100%!important;
  overflow-y:auto!important;
}

body:not(.modal-open):not(.drawer-open){
  overflow-y:auto!important;
  overflow-x:hidden!important;
  position:static!important;
}

.shell,
.app-shell,
.main,
.content,
#main{
  height:auto!important;
  min-height:100dvh!important;
  max-height:none!important;
  overflow-y:visible!important;
}

.flight-log-page,
#main:not(.settings-page):not(.audit-page){
  overflow-y:visible!important;
  height:auto!important;
  max-height:none!important;
}

/* Horizontal table scroll only; do not trap vertical page scrolling. */
.flight-log-table-wrap{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  max-height:none!important;
  touch-action:pan-x pan-y!important;
  -webkit-overflow-scrolling:touch!important;
}

/* Keep pagination visible after table but allow page to continue scrolling. */
#flightPagination,
.table-pagination{
  position:relative!important;
  bottom:auto!important;
  z-index:1!important;
}

/* Mobile portrait: ensure the browser can scroll page content below the table. */
@media (max-width:900px){
  body:not(.modal-open):not(.drawer-open),
  #app,
  .shell,
  .main,
  .content,
  #main{
    height:auto!important;
    min-height:100dvh!important;
    max-height:none!important;
    overflow-y:visible!important;
    touch-action:pan-y!important;
  }

  .flight-log-table-wrap{
    overflow-x:auto!important;
    overflow-y:hidden!important;
    touch-action:pan-x pan-y!important;
  }

  .flight-log-page,
  .page{
    padding-bottom:120px!important;
  }
}


/* ===== V66 Flight form required validation ===== */
#flightForm .form-field.required-error label{
  color:#b91c1c!important;
}

#flightForm .form-field.required-error input,
#flightForm .form-field.required-error select,
#flightForm .form-field.required-error textarea{
  border-color:#ef4444!important;
  box-shadow:0 0 0 3px rgba(239,68,68,.16)!important;
  background:#fff7f7!important;
}

#flightForm .form-level-error{
  margin:12px 0 0;
  color:#b91c1c;
  font-weight:800;
  font-size:14px;
  min-height:18px;
}

#flightForm .form-field.required-error::after{
  content:'Required';
  display:block;
  margin-top:5px;
  color:#b91c1c;
  font-size:12px;
  font-weight:800;
}

html[lang="th"] #flightForm .form-field.required-error::after{
  content:'จำเป็นต้องกรอก';
}


/* ===== V67 final condition tooltip styling ===== */
.status-emoji{
  cursor:help!important;
}

.status-emoji:focus{
  outline:3px solid rgba(14,165,233,.35)!important;
  outline-offset:3px!important;
  border-radius:999px!important;
}

.status-emoji-warning{
  filter:saturate(1.05);
}

.status-emoji-critical{
  filter:saturate(1.15);
}


/* ===== V69 Flight Log sort dropdown + mobile responsive guard ===== */
#filterSortCustom,
.sort-filter{
  min-width:150px!important;
}

@media (max-width:900px){
  #filterSortCustom,
  .sort-filter{
    width:100%!important;
    min-width:0!important;
    flex:1 1 100%!important;
  }

  .flight-filters,
  .mobile-filter-extra{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:10px!important;
    align-items:stretch!important;
  }

  .flight-filters input,
  .flight-filters select,
  .flight-filters button,
  .flight-filters .custom-select,
  .mobile-filter-extra .custom-select{
    min-width:0!important;
  }

  .flight-log-table-wrap{
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
  }
}


/* ===== V70 BVLOS Departure / Arrival flight form ===== */
.bvlos-flight-form{
  display:flex!important;
  flex-direction:column!important;
  gap:14px!important;
}

.flight-form-section{
  border:1px solid #dbe4ef!important;
  border-radius:14px!important;
  overflow:hidden!important;
  background:#ffffff!important;
}

.flight-form-section .section-title{
  padding:14px 16px!important;
  border-bottom:1px solid #dbe4ef!important;
}

.flight-form-section .section-title h3{
  margin:0!important;
  font-size:18px!important;
  font-weight:900!important;
}

.flight-form-section .section-title p{
  margin:3px 0 0!important;
  color:#64748b!important;
  font-size:13px!important;
}

.departure-section .section-title{
  background:linear-gradient(90deg,rgba(15,118,110,.10),rgba(56,189,248,.05))!important;
}

.arrival-section .section-title{
  background:linear-gradient(90deg,rgba(59,130,246,.10),rgba(99,102,241,.05))!important;
}

.bvlos-grid{
  padding:14px 16px 16px!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(150px,1fr))!important;
  gap:14px 16px!important;
}

.arrival-grid{
  grid-template-columns:repeat(4,minmax(170px,1fr))!important;
}

.arrival-note{
  border:1px solid #fde68a!important;
  background:#fffbeb!important;
  color:#92400e!important;
  border-radius:10px!important;
  padding:10px 12px!important;
  font-weight:700!important;
  font-size:13px!important;
}

.modal .modal-subtitle{
  margin:2px 0 0!important;
  color:#64748b!important;
  font-size:13px!important;
}

.flight-log-table th[data-col="takeoffRpic"],
.flight-log-table th[data-col="landingRpic"],
.flight-log-table th[data-col="takeoffVo"],
.flight-log-table th[data-col="landingVo"]{
  white-space:nowrap!important;
}

@media (max-width:1100px){
  .bvlos-grid,
  .arrival-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media (max-width:700px){
  .bvlos-grid,
  .arrival-grid{
    grid-template-columns:1fr!important;
  }

  .flight-form-section .section-title{
    padding:12px!important;
  }

  .bvlos-grid{
    padding:12px!important;
  }
}


/* =========================================================
   V85 CLEAN CSS PATCH
   Clean replacement for the accumulated V72-V84 table patches.
   Purpose: keep Status + Flight ID fixed without duplicate/blank columns.
   ========================================================= */

/* ---------- Flight Log table: stable fixed columns ---------- */
.flight-log-table-wrap{
  position:relative!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  padding-left:0!important;
  margin-left:0!important;
  max-width:100%!important;
}

.flight-log-table{
  table-layout:fixed!important;
  width:2790px!important;
  min-width:2790px!important;
  max-width:none!important;
  margin-left:0!important;
  border-collapse:separate!important;
  border-spacing:0!important;
}

/* colgroup widths */
.flight-log-table col[data-col="_status"]{ width:70px!important; }
.flight-log-table col[data-col="flightId"]{ width:140px!important; }
.flight-log-table col[data-col="date"]{ width:118px!important; }
.flight-log-table col[data-col="droneId"]{ width:150px!important; }
.flight-log-table col[data-col="takeoffRpic"]{ width:170px!important; }
.flight-log-table col[data-col="takeoffVo"]{ width:170px!important; }
.flight-log-table col[data-col="missionType"]{ width:130px!important; }
.flight-log-table col[data-col="origin"]{ width:160px!important; }
.flight-log-table col[data-col="destination"]{ width:160px!important; }
.flight-log-table col[data-col="payloadType"]{ width:135px!important; }
.flight-log-table col[data-col="payloadWeight"]{ width:92px!important; }
.flight-log-table col[data-col="batteryId"]{ width:95px!important; }
.flight-log-table col[data-col="coldcareId"]{ width:115px!important; }
.flight-log-table col[data-col="weatherCondition"]{ width:125px!important; }
.flight-log-table col[data-col="batteryTakeoff"]{ width:105px!important; }
.flight-log-table col[data-col="takeoffTime"]{ width:92px!important; }
.flight-log-table col[data-col="landingTime"]{ width:92px!important; }
.flight-log-table col[data-col="flightDuration"]{ width:112px!important; }
.flight-log-table col[data-col="batteryLanding"]{ width:105px!important; }
.flight-log-table col[data-col="landingRpic"]{ width:150px!important; }
.flight-log-table col[data-col="landingVo"]{ width:150px!important; }
.flight-log-table col[data-col="flightStatus"]{ width:128px!important; }
.flight-log-table col[data-col="incidentSeverity"]{ width:100px!important; }
.flight-log-table col[data-col="abnormalityObservation"]{ width:180px!important; }
.flight-log-table col[data-col="remark"]{ width:160px!important; }
.flight-log-table col[data-col="action"]{ width:132px!important; }

.flight-log-table th,
.flight-log-table td{
  box-sizing:border-box!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  vertical-align:middle!important;
  padding:10px 12px!important;
  line-height:1.25!important;
  border-left:1px solid #e5e7eb!important;
  color:#0f172a!important;
  visibility:visible!important;
  opacity:1!important;
}

.flight-log-table th{
  background:#f8fafc!important;
  font-weight:800!important;
}

/* Freeze only Status and Flight ID. No overlay, no hidden duplicate columns. */
.flight-log-table th[data-col="_status"],
.flight-log-table td[data-cell="_status"]{
  position:sticky!important;
  position:-webkit-sticky!important;
  left:0!important;
  z-index:30!important;
  width:70px!important;
  min-width:70px!important;
  max-width:70px!important;
  text-align:center!important;
  padding-left:6px!important;
  padding-right:6px!important;
  background:var(--row-bg,#fff)!important;
  background-color:var(--row-bg,#fff)!important;
  box-shadow:1px 0 0 #e5e7eb!important;
}

.flight-log-table th[data-col="flightId"],
.flight-log-table td[data-cell="flightId"]{
  position:sticky!important;
  position:-webkit-sticky!important;
  left:70px!important;
  z-index:29!important;
  width:140px!important;
  min-width:140px!important;
  max-width:140px!important;
  background:var(--row-bg,#fff)!important;
  background-color:var(--row-bg,#fff)!important;
  border-right:2px solid #e5e7eb!important;
  box-shadow:1px 0 0 #e5e7eb!important;
}

.flight-log-table thead th[data-col="_status"],
.flight-log-table thead th[data-col="flightId"]{
  z-index:50!important;
  background:#f8fafc!important;
  background-color:#f8fafc!important;
}

.flight-log-table th[data-col="_status"] *,
.flight-log-table td[data-cell="_status"] *,
.flight-log-table th[data-col="flightId"] *,
.flight-log-table td[data-cell="flightId"] *{
  visibility:visible!important;
  color:inherit!important;
  opacity:1!important;
}

/* Row colors on sticky cells */
.flight-log-table tbody tr[data-tone="pending"] td[data-cell="_status"],
.flight-log-table tbody tr[data-tone="pending"] td[data-cell="flightId"],
.flight-log-table tbody tr.pending-row td[data-cell="_status"],
.flight-log-table tbody tr.pending-row td[data-cell="flightId"]{
  background:#f4f0ff!important;
  background-color:#f4f0ff!important;
}

.flight-log-table tbody tr[data-tone="warning"] td[data-cell="_status"],
.flight-log-table tbody tr[data-tone="warning"] td[data-cell="flightId"],
.flight-log-table tbody tr.row-warning td[data-cell="_status"],
.flight-log-table tbody tr.row-warning td[data-cell="flightId"]{
  background:#fff4c2!important;
  background-color:#fff4c2!important;
}

.flight-log-table tbody tr[data-tone="danger"] td[data-cell="_status"],
.flight-log-table tbody tr[data-tone="danger"] td[data-cell="flightId"],
.flight-log-table tbody tr.row-danger td[data-cell="_status"],
.flight-log-table tbody tr.row-danger td[data-cell="flightId"]{
  background:#f8d7da!important;
  background-color:#f8d7da!important;
}

/* Pending Arrival full row */
.flight-log-table tbody tr.pending-row > td,
.flight-log-table tbody tr.row-pending > td,
.flight-log-table tbody tr[data-tone="pending"] > td{
  background:#f4f0ff!important;
  background-color:#f4f0ff!important;
  border-top:1px solid #b79cff!important;
  border-bottom:1px solid #b79cff!important;
}

/* Center requested columns */
.flight-log-table th[data-col="payloadWeight"],
.flight-log-table th[data-col="batteryId"],
.flight-log-table th[data-col="coldcareId"],
.flight-log-table th[data-col="weatherCondition"],
.flight-log-table th[data-col="batteryTakeoff"],
.flight-log-table th[data-col="takeoffTime"],
.flight-log-table th[data-col="landingTime"],
.flight-log-table th[data-col="flightDuration"],
.flight-log-table th[data-col="batteryLanding"],
.flight-log-table td[data-cell="payloadWeight"],
.flight-log-table td[data-cell="batteryId"],
.flight-log-table td[data-cell="coldcareId"],
.flight-log-table td[data-cell="weatherCondition"],
.flight-log-table td[data-cell="batteryTakeoff"],
.flight-log-table td[data-cell="takeoffTime"],
.flight-log-table td[data-cell="landingTime"],
.flight-log-table td[data-cell="flightDuration"],
.flight-log-table td[data-cell="batteryLanding"]{
  text-align:center!important;
  vertical-align:middle!important;
}

.flight-log-table th[data-col="payloadWeight"],
.flight-log-table th[data-col="batteryTakeoff"],
.flight-log-table th[data-col="flightDuration"],
.flight-log-table th[data-col="batteryLanding"]{
  text-align:center!important;
  line-height:1.1!important;
  white-space:normal!important;
}

/* Action column stays inside table edge */
.flight-log-table th[data-col="action"],
.flight-log-table td[data-cell="action"],
.flight-log-table th.action-header-blank,
.flight-log-table td.action-cell-normal{
  position:static!important;
  width:132px!important;
  min-width:132px!important;
  max-width:132px!important;
  overflow:visible!important;
  text-align:center!important;
}

.flight-log-table td[data-cell="action"] .action-inline{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:8px!important;
  flex-wrap:nowrap!important;
}

/* ---------- Flight Log filters ---------- */
.flight-filters{
  display:grid!important;
  grid-template-columns:360px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:center!important;
  width:100%!important;
  max-width:100%!important;
  margin:12px 0 16px!important;
}

.flight-filters > #flightSearch{
  width:360px!important;
  max-width:360px!important;
  min-width:0!important;
  flex:none!important;
}

.flight-filters .mobile-filter-extra{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(88px,1fr)) 90px!important;
  gap:10px!important;
  align-items:center!important;
  min-width:0!important;
  max-width:100%!important;
}

.flight-filters .mobile-filter-extra > *,
.flight-filters .mobile-filter-extra .custom-select,
.flight-filters .mobile-filter-extra button{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
}

.flight-filters #resetFilters{
  width:90px!important;
  min-width:90px!important;
  max-width:90px!important;
}

@media (max-width:900px){
  .flight-filters{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
  }

  .flight-filters > #flightSearch{
    width:100%!important;
    max-width:100%!important;
  }

  .flight-filters .mobile-filter-extra{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
  }

  .flight-filters .mobile-filter-extra > *,
  .flight-filters #resetFilters{
    width:100%!important;
    max-width:100%!important;
  }
}

/* Modal section gap cleanup retained */
.modal .flight-form-section,
.flight-form-section{
  padding-top:0!important;
  padding-bottom:0!important;
  margin-top:0!important;
  overflow:hidden!important;
}

.modal .flight-form-section .section-title,
.flight-form-section .section-title{
  margin-top:0!important;
  border-top-left-radius:0!important;
  border-top-right-radius:0!important;
}


/* =========================================================
   V86 PATCH - sticky bottom horizontal scrollbar + section colors
   ========================================================= */
.flight-floating-scroll{
  position:fixed!important;
  bottom:14px!important;
  height:18px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  z-index:9999!important;
  display:none!important;
  background:rgba(226,232,240,.78)!important;
  border-radius:999px!important;
  box-shadow:0 6px 18px rgba(15,23,42,.12)!important;
  -webkit-overflow-scrolling:touch!important;
}
.flight-floating-scroll.is-visible{display:block!important;}
.flight-floating-scroll-inner{height:1px!important;}
.flight-floating-scroll::-webkit-scrollbar{height:14px!important;}
.flight-floating-scroll::-webkit-scrollbar-track{background:#e5e7eb!important;border-radius:999px!important;}
.flight-floating-scroll::-webkit-scrollbar-thumb{background:#94a3b8!important;border-radius:999px!important;border:2px solid #e5e7eb!important;}
.flight-log-pagination,.pagination{margin-bottom:28px!important;}
.flight-log-table-wrap::after{
  content:""!important;
  position:absolute!important;
  top:0!important;
  right:0!important;
  width:34px!important;
  height:100%!important;
  pointer-events:none!important;
  background:linear-gradient(90deg, rgba(248,250,252,0), rgba(148,163,184,.22))!important;
  z-index:6!important;
}

/* Restore full section background colors in Add/Edit Flight form */
.flight-form-section:nth-of-type(1){
  background:#eefaf5!important;
  border-color:#bfe7d6!important;
}
.flight-form-section:nth-of-type(1) .section-title{
  background:#dff4ec!important;
  border-bottom:1px solid #bfe7d6!important;
}
.flight-form-section:nth-of-type(2){
  background:#f5f0ff!important;
  border-color:#d7c8ff!important;
}
.flight-form-section:nth-of-type(2) .section-title{
  background:#ebe2ff!important;
  border-bottom:1px solid #d7c8ff!important;
}
.flight-form-section .bvlos-grid,
.flight-form-section .arrival-grid,
.flight-form-section .form-grid{
  background:transparent!important;
}
@media (max-width:900px){
  .flight-floating-scroll{bottom:10px!important;height:16px!important;}
  .flight-log-pagination,.pagination{margin-bottom:24px!important;}
}



/* =========================================================
   V87 PATCH - remove right-edge hint, full Take-off/Landing labels,
   reliable flags, consistent edit/delete icons
   ========================================================= */

/* Remove right-edge shadow hint */
.flight-log-table-wrap::after{
  display:none!important;
  content:none!important;
  background:none!important;
}

/* Header width adjustment for full words */
.flight-log-table col[data-col="batteryTakeoff"]{ width:128px!important; }
.flight-log-table col[data-col="takeoffTime"]{ width:118px!important; }
.flight-log-table col[data-col="landingTime"]{ width:118px!important; }
.flight-log-table col[data-col="batteryLanding"]{ width:128px!important; }

/* Recalculate table width after wider full-word columns:
   previous 2790 + 23 + 26 + 26 + 23 = 2888 */
.flight-log-table{
  width:2888px!important;
  min-width:2888px!important;
}

/* Center multiline full-word headers */
.flight-log-table th[data-col="batteryTakeoff"],
.flight-log-table th[data-col="batteryLanding"],
.flight-log-table th[data-col="takeoffTime"],
.flight-log-table th[data-col="landingTime"]{
  text-align:center!important;
  line-height:1.12!important;
}

/* Reliable flag icons for Windows: CSS-drawn badges instead of emoji flags */
.flag-icon{
  display:inline-block!important;
  width:18px!important;
  height:12px!important;
  margin-right:4px!important;
  border-radius:2px!important;
  vertical-align:-1px!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.35)!important;
  overflow:hidden!important;
}

.flag-th{
  background:linear-gradient(
    to bottom,
    #a51931 0 16.66%,
    #ffffff 16.66% 33.33%,
    #2d2a4a 33.33% 66.66%,
    #ffffff 66.66% 83.33%,
    #a51931 83.33% 100%
  )!important;
}

.flag-gb{
  position:relative!important;
  background:#012169!important;
}

.flag-gb::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(27deg, transparent 42%, #fff 42% 48%, #c8102e 48% 52%, #fff 52% 58%, transparent 58%),
    linear-gradient(153deg, transparent 42%, #fff 42% 48%, #c8102e 48% 52%, #fff 52% 58%, transparent 58%),
    linear-gradient(to right, transparent 38%, #fff 38% 45%, #c8102e 45% 55%, #fff 55% 62%, transparent 62%),
    linear-gradient(to bottom, transparent 34%, #fff 34% 43%, #c8102e 43% 57%, #fff 57% 66%, transparent 66%)!important;
}

/* Consistent action buttons and icons */
.flight-log-table .action-inline{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
}

.flight-log-table .icon-btn,
.flight-log-table button.icon-btn,
.flight-log-table .edit-btn,
.flight-log-table .delete-btn{
  width:52px!important;
  height:52px!important;
  min-width:52px!important;
  min-height:52px!important;
  max-width:52px!important;
  max-height:52px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  line-height:1!important;
  font-size:22px!important;
  border-radius:16px!important;
}

.flight-log-table .icon-btn svg,
.flight-log-table button.icon-btn svg,
.flight-log-table .edit-btn svg,
.flight-log-table .delete-btn svg{
  width:22px!important;
  height:22px!important;
  min-width:22px!important;
  min-height:22px!important;
}

.flight-log-table .icon-btn img,
.flight-log-table button.icon-btn img,
.flight-log-table .edit-btn img,
.flight-log-table .delete-btn img{
  width:22px!important;
  height:22px!important;
  object-fit:contain!important;
}

/* If icon is emoji/text, keep the size consistent */
.flight-log-table .icon-btn,
.flight-log-table .edit-btn,
.flight-log-table .delete-btn{
  font-size:22px!important;
}

/* Mobile action buttons slightly smaller but still consistent */
@media (max-width:700px){
  .flight-log-table .icon-btn,
  .flight-log-table button.icon-btn,
  .flight-log-table .edit-btn,
  .flight-log-table .delete-btn{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    min-height:48px!important;
    max-width:48px!important;
    max-height:48px!important;
    font-size:21px!important;
  }

  .flight-log-table .icon-btn svg,
  .flight-log-table button.icon-btn svg,
  .flight-log-table .edit-btn svg,
  .flight-log-table .delete-btn svg,
  .flight-log-table .icon-btn img,
  .flight-log-table button.icon-btn img,
  .flight-log-table .edit-btn img,
  .flight-log-table .delete-btn img{
    width:21px!important;
    height:21px!important;
  }
}



/* =========================================================
   V88 PATCH - full labels, one scrollbar, flags, dashboard cleanup, icon consistency
   ========================================================= */

/* Remove V86 floating horizontal scrollbar. Keep only the real table scrollbar. */
.flight-floating-scroll,
.flight-floating-scroll.is-visible{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Remove extra margin reserved for the floating scrollbar */
.flight-log-pagination,
.pagination{
  margin-bottom:0!important;
}

/* Ensure no right-edge hint */
.flight-log-table-wrap::after{
  display:none!important;
  content:none!important;
  background:none!important;
}

/* Wider columns for full Take-off / Landing labels */
.flight-log-table col[data-col="takeoffRpic"]{ width:185px!important; }
.flight-log-table col[data-col="takeoffVo"]{ width:185px!important; }
.flight-log-table col[data-col="landingRpic"]{ width:165px!important; }
.flight-log-table col[data-col="landingVo"]{ width:165px!important; }
.flight-log-table col[data-col="batteryTakeoff"]{ width:132px!important; }
.flight-log-table col[data-col="batteryLanding"]{ width:132px!important; }
.flight-log-table col[data-col="takeoffTime"]{ width:125px!important; }
.flight-log-table col[data-col="landingTime"]{ width:125px!important; }

/* Adjust total width from V87 2888 to fit wider labels */
.flight-log-table{
  width:2960px!important;
  min-width:2960px!important;
}

/* Header Thai font slightly larger and readable */
html[lang="th"] .flight-log-table th,
body.lang-th .flight-log-table th,
.flight-log-table th{
  font-size:14px!important;
}

/* Header alignment for updated fields */
.flight-log-table th[data-col="takeoffRpic"],
.flight-log-table th[data-col="takeoffVo"],
.flight-log-table th[data-col="landingRpic"],
.flight-log-table th[data-col="landingVo"],
.flight-log-table th[data-col="batteryTakeoff"],
.flight-log-table th[data-col="batteryLanding"],
.flight-log-table th[data-col="takeoffTime"],
.flight-log-table th[data-col="landingTime"]{
  text-align:center!important;
  line-height:1.12!important;
}

/* Keep requested body columns centered */
.flight-log-table td[data-cell="batteryId"],
.flight-log-table td[data-cell="coldcareId"],
.flight-log-table th[data-col="batteryId"],
.flight-log-table th[data-col="coldcareId"]{
  text-align:center!important;
}

/* Reliable CSS flags */
.flag-icon{
  display:inline-block!important;
  width:18px!important;
  height:12px!important;
  margin-right:5px!important;
  border-radius:2px!important;
  vertical-align:-1px!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.45)!important;
  overflow:hidden!important;
  flex:0 0 auto!important;
}

.flag-th{
  background:linear-gradient(to bottom,#a51931 0 16.66%,#fff 16.66% 33.33%,#2d2a4a 33.33% 66.66%,#fff 66.66% 83.33%,#a51931 83.33% 100%)!important;
}

.flag-gb{
  position:relative!important;
  background:#012169!important;
}

.flag-gb::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(27deg, transparent 41%, #fff 41% 48%, #c8102e 48% 52%, #fff 52% 59%, transparent 59%),
    linear-gradient(153deg, transparent 41%, #fff 41% 48%, #c8102e 48% 52%, #fff 52% 59%, transparent 59%),
    linear-gradient(to right, transparent 38%, #fff 38% 45%, #c8102e 45% 55%, #fff 55% 62%, transparent 62%),
    linear-gradient(to bottom, transparent 34%, #fff 34% 43%, #c8102e 43% 57%, #fff 57% 66%, transparent 66%)!important;
}

/* Consistent action icon buttons */
.flight-log-table .action-inline{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
}

.flight-log-table .icon-btn,
.flight-log-table button.icon-btn,
.flight-log-table .edit-btn,
.flight-log-table .delete-btn{
  width:52px!important;
  height:52px!important;
  min-width:52px!important;
  min-height:52px!important;
  max-width:52px!important;
  max-height:52px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  line-height:1!important;
  font-size:22px!important;
  border-radius:16px!important;
}

.flight-log-table .icon-btn svg,
.flight-log-table button.icon-btn svg,
.flight-log-table .edit-btn svg,
.flight-log-table .delete-btn svg,
.flight-log-table .icon-btn img,
.flight-log-table button.icon-btn img,
.flight-log-table .edit-btn img,
.flight-log-table .delete-btn img{
  width:22px!important;
  height:22px!important;
  min-width:22px!important;
  min-height:22px!important;
  object-fit:contain!important;
}

/* Hide None/ไม่มี rows in Incident Severity dashboard card if any remains after JS cleanup */
.card:has(h3),
.dashboard-card:has(h3),
.stat-card:has(h3){
  --incident-cleanup:1;
}

@media (max-width:700px){
  .flight-log-table .icon-btn,
  .flight-log-table button.icon-btn,
  .flight-log-table .edit-btn,
  .flight-log-table .delete-btn{
    width:48px!important;
    height:48px!important;
    min-width:48px!important;
    min-height:48px!important;
    max-width:48px!important;
    max-height:48px!important;
    font-size:21px!important;
  }
}



/* =========================================================
   V89 PATCH - keep floating scrollbar, fix flags, hide None severity
   ========================================================= */

/* Keep only the floating horizontal scrollbar visible. Hide native table scrollbar visually. */
.flight-log-table-wrap{
  scrollbar-width:none!important; /* Firefox */
}
.flight-log-table-wrap::-webkit-scrollbar{
  height:0!important;
  width:0!important;
  display:none!important;
}

/* Undo V88 hidden floating scrollbar */
.flight-floating-scroll{
  position:fixed!important;
  bottom:14px!important;
  height:18px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  z-index:9999!important;
  display:none!important;
  visibility:visible!important;
  pointer-events:auto!important;
  background:rgba(226,232,240,.86)!important;
  border-radius:999px!important;
  box-shadow:0 6px 18px rgba(15,23,42,.14)!important;
  -webkit-overflow-scrolling:touch!important;
}
.flight-floating-scroll.is-visible{
  display:block!important;
  visibility:visible!important;
}
.flight-floating-scroll-inner{height:1px!important;}
.flight-floating-scroll::-webkit-scrollbar{height:14px!important;display:block!important;}
.flight-floating-scroll::-webkit-scrollbar-track{background:#e5e7eb!important;border-radius:999px!important;}
.flight-floating-scroll::-webkit-scrollbar-thumb{background:#94a3b8!important;border-radius:999px!important;border:2px solid #e5e7eb!important;}
.flight-log-pagination,.pagination{margin-bottom:28px!important;}

/* Keep right-edge hint removed */
.flight-log-table-wrap::after{
  display:none!important;
  content:none!important;
  background:none!important;
}

/* Language flags: deterministic size and spacing, no emoji dependency */
.flag-icon{
  display:inline-block!important;
  width:18px!important;
  height:12px!important;
  margin:0 5px 0 0!important;
  border-radius:2px!important;
  vertical-align:-1px!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.45)!important;
  overflow:hidden!important;
  flex:0 0 auto!important;
}
.flag-th{
  background:linear-gradient(to bottom,#a51931 0 16.66%,#fff 16.66% 33.33%,#2d2a4a 33.33% 66.66%,#fff 66.66% 83.33%,#a51931 83.33% 100%)!important;
}
.flag-gb{
  position:relative!important;
  background:#012169!important;
}
.flag-gb::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(27deg, transparent 41%, #fff 41% 48%, #c8102e 48% 52%, #fff 52% 59%, transparent 59%),
    linear-gradient(153deg, transparent 41%, #fff 41% 48%, #c8102e 48% 52%, #fff 52% 59%, transparent 59%),
    linear-gradient(to right, transparent 38%, #fff 38% 45%, #c8102e 45% 55%, #fff 55% 62%, transparent 62%),
    linear-gradient(to bottom, transparent 34%, #fff 34% 43%, #c8102e 43% 57%, #fff 57% 66%, transparent 66%)!important;
}

/* Hide any remaining None/ไม่มี row in incident severity cards as a CSS fallback */
/* Action icon consistency retained */
.flight-log-table .icon-btn,
.flight-log-table button.icon-btn,
.flight-log-table .edit-btn,
.flight-log-table .delete-btn{
  width:52px!important;
  height:52px!important;
  min-width:52px!important;
  min-height:52px!important;
  max-width:52px!important;
  max-height:52px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  line-height:1!important;
  font-size:22px!important;
  border-radius:16px!important;
}



/* =========================================================
   V90 PATCH - final fix: incident None source, language flags, mobile floating scroll
   ========================================================= */

/* Floating scrollbar: visible and easier to drag. Native table scrollbar hidden. */
.flight-log-table-wrap{
  scrollbar-width:none!important;
  padding-bottom:0!important;
}
.flight-log-table-wrap::-webkit-scrollbar{
  height:0!important;
  width:0!important;
  display:none!important;
}

.flight-floating-scroll{
  position:fixed!important;
  bottom:18px!important;
  height:22px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  z-index:9999!important;
  display:none!important;
  visibility:visible!important;
  pointer-events:auto!important;
  background:rgba(226,232,240,.92)!important;
  border-radius:999px!important;
  box-shadow:0 8px 22px rgba(15,23,42,.12)!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:pan-x!important;
}
.flight-floating-scroll.is-visible{
  display:block!important;
}
.flight-floating-scroll-inner{
  height:1px!important;
}
.flight-floating-scroll::-webkit-scrollbar{
  height:16px!important;
  display:block!important;
}
.flight-floating-scroll::-webkit-scrollbar-track{
  background:#e5e7eb!important;
  border-radius:999px!important;
}
.flight-floating-scroll::-webkit-scrollbar-thumb{
  background:#94a3b8!important;
  border-radius:999px!important;
  border:2px solid #e5e7eb!important;
}

.flight-log-pagination,
.pagination{
  margin-bottom:42px!important;
}

/* Do not show right edge shadow */
.flight-log-table-wrap::after{
  display:none!important;
  content:none!important;
  background:none!important;
}

/* Reliable non-emoji flags; no duplicate spacing */
.flag-icon{
  display:inline-block!important;
  width:18px!important;
  height:12px!important;
  margin:0 5px 0 0!important;
  border-radius:2px!important;
  vertical-align:-1px!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.45)!important;
  overflow:hidden!important;
  flex:0 0 auto!important;
}
.flag-th{
  background:linear-gradient(to bottom,#a51931 0 16.66%,#fff 16.66% 33.33%,#2d2a4a 33.33% 66.66%,#fff 66.66% 83.33%,#a51931 83.33% 100%)!important;
}
.flag-gb{
  position:relative!important;
  background:#012169!important;
}
.flag-gb::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(27deg, transparent 41%, #fff 41% 48%, #c8102e 48% 52%, #fff 52% 59%, transparent 59%),
    linear-gradient(153deg, transparent 41%, #fff 41% 48%, #c8102e 48% 52%, #fff 52% 59%, transparent 59%),
    linear-gradient(to right, transparent 38%, #fff 38% 45%, #c8102e 45% 55%, #fff 55% 62%, transparent 62%),
    linear-gradient(to bottom, transparent 34%, #fff 34% 43%, #c8102e 43% 57%, #fff 57% 66%, transparent 66%)!important;
}

/* Mobile: prevent floating bar from blocking pagination too much */
@media (max-width:700px){
  .flight-floating-scroll{
    bottom:76px!important;
    height:20px!important;
    left:24px!important;
    right:24px!important;
  }
  .flight-floating-scroll::-webkit-scrollbar{
    height:14px!important;
  }
  .flight-log-pagination,
  .pagination{
    margin-bottom:58px!important;
  }
}

/* Incident card fallback: if JS leaves an empty card, no fake None row should be styled */
.bar-row[data-key="None"],
.bar-row[data-key="ไม่มี"]{
  display:none!important;
}



/* =========================================================
   V91 PATCH - final flags, source-level incident filter, modal-safe floating scrollbar
   ========================================================= */

/* Language toggle: fixed source markup, no injected duplicates */
.lang-toggle{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  white-space:nowrap!important;
}
.lang-toggle [data-lang]{
  display:inline-flex!important;
  align-items:center!important;
  gap:5px!important;
  white-space:nowrap!important;
}
.lang-toggle .lang-sep{
  opacity:.7!important;
}
.lang-toggle .en-flag{
  display:none!important;
}
.flag-icon{
  display:inline-block!important;
  width:18px!important;
  height:12px!important;
  margin:0!important;
  border-radius:2px!important;
  vertical-align:-1px!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.45)!important;
  overflow:hidden!important;
  flex:0 0 auto!important;
}
.flag-th{
  background:linear-gradient(to bottom,#a51931 0 16.66%,#fff 16.66% 33.33%,#2d2a4a 33.33% 66.66%,#fff 66.66% 83.33%,#a51931 83.33% 100%)!important;
}
.flag-gb{
  position:relative!important;
  background:#012169!important;
}
.flag-gb::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(27deg, transparent 41%, #fff 41% 48%, #c8102e 48% 52%, #fff 52% 59%, transparent 59%),
    linear-gradient(153deg, transparent 41%, #fff 41% 48%, #c8102e 48% 52%, #fff 52% 59%, transparent 59%),
    linear-gradient(to right, transparent 38%, #fff 38% 45%, #c8102e 45% 55%, #fff 55% 62%, transparent 62%),
    linear-gradient(to bottom, transparent 34%, #fff 34% 43%, #c8102e 43% 57%, #fff 57% 66%, transparent 66%)!important;
}

/* Floating horizontal scrollbar: only on Flight Log page, not inside modal */
.flight-log-table-wrap{
  scrollbar-width:none!important;
}
.flight-log-table-wrap::-webkit-scrollbar{
  height:0!important;
  width:0!important;
  display:none!important;
}
.flight-floating-scroll{
  position:fixed!important;
  bottom:18px!important;
  height:18px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  z-index:9999!important;
  display:none!important;
  visibility:visible!important;
  pointer-events:auto!important;
  background:transparent!important;
  border-radius:999px!important;
  box-shadow:none!important;
  -webkit-overflow-scrolling:touch!important;
  touch-action:none!important;
}
.flight-floating-scroll.is-visible{
  display:block!important;
}
body.modal-open .flight-floating-scroll,
.modal-open .flight-floating-scroll,
body:has(.modal-backdrop) .flight-floating-scroll,
body:has(.modal) .flight-floating-scroll{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
.flight-floating-scroll-inner{
  height:1px!important;
}
.flight-floating-scroll::-webkit-scrollbar{
  height:16px!important;
  display:block!important;
}
.flight-floating-scroll::-webkit-scrollbar-track{
  background:rgba(226,232,240,.92)!important;
  border-radius:999px!important;
}
.flight-floating-scroll::-webkit-scrollbar-thumb{
  background:#94a3b8!important;
  border-radius:999px!important;
  border:2px solid rgba(226,232,240,.92)!important;
}
.flight-floating-scroll.dragging::-webkit-scrollbar-thumb{
  background:#64748b!important;
}
.flight-log-pagination,
.pagination{
  margin-bottom:34px!important;
}

/* Incident Severity fallback in case cached dashboard remains */
.bar-row[data-key="None"],
.bar-row[data-key="none"],
.bar-row[data-key="ไม่มี"]{
  display:none!important;
}

/* Mobile: keep floating bar above browser bottom UI and away from pagination */
@media (max-width:700px){
  .flight-floating-scroll{
    bottom:88px!important;
    height:18px!important;
  }
  .flight-floating-scroll::-webkit-scrollbar{
    height:14px!important;
  }
  .flight-log-pagination,
  .pagination{
    margin-bottom:64px!important;
  }
}



/* =========================================================
   V94 STATIC SCROLL PATCH - based on V91, floating scrollbar removed
   ========================================================= */

/* Remove all floating scrollbar elements/behavior completely */
.flight-floating-scroll,
.flight-floating-scroll.is-visible,
.flight-floating-scroll-inner{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}

/* Restore normal/static horizontal table scrolling */
.flight-log-table-wrap{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-width:auto!important;
  overscroll-behavior-x:auto!important;
  padding-bottom:0!important;
}

.flight-log-table-wrap::-webkit-scrollbar{
  height:14px!important;
  width:auto!important;
  display:block!important;
}

.flight-log-table-wrap::-webkit-scrollbar-track{
  background:#e5e7eb!important;
  border-radius:999px!important;
}

.flight-log-table-wrap::-webkit-scrollbar-thumb{
  background:#94a3b8!important;
  border-radius:999px!important;
  border:2px solid #e5e7eb!important;
}

/* Reset spacing that was reserved for floating scrollbar */
.flight-log-pagination,
.pagination{
  margin-bottom:0!important;
}

/* Keep right-edge shadow/hint removed */
.flight-log-table-wrap::after{
  display:none!important;
  content:none!important;
  background:none!important;
}

/* Mobile/tablet: use native horizontal swipe exactly like normal table scroll */
@media (max-width:900px){
  .flight-log-table-wrap{
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:auto!important;
    touch-action:pan-x pan-y!important;
    overscroll-behavior-x:auto!important;
    max-width:100%!important;
  }

  .flight-log-table-wrap::-webkit-scrollbar{
    height:12px!important;
    display:block!important;
  }

  .flight-log-pagination,
  .pagination{
    margin-bottom:0!important;
  }
}



/* =========================================================
   V96 PATCH - real Edit column before Status, Delete remains at end
   Base: V94 static scroll. No visual CSS reorder hacks.
   ========================================================= */

/* New compact edit column before Status */
.flight-log-table col[data-col="_edit"]{
  width:48px!important;
}

/* Tighten Flight ID to reduce fixed area */
.flight-log-table col[data-col="flightId"]{
  width:112px!important;
}

/* The first 3 columns are sticky in their real DOM order:
   Edit (48) + Status (70) + Flight ID (112) */
.flight-log-table th[data-col="_edit"],
.flight-log-table td[data-cell="_edit"]{
  position:sticky!important;
  position:-webkit-sticky!important;
  left:0!important;
  z-index:62!important;
  width:48px!important;
  min-width:48px!important;
  max-width:48px!important;
  text-align:center!important;
  vertical-align:middle!important;
  padding:6px!important;
  background:var(--row-bg,#fff)!important;
  background-color:var(--row-bg,#fff)!important;
  border-left:1px solid #e5e7eb!important;
  box-shadow:1px 0 0 #e5e7eb!important;
}

.flight-log-table th[data-col="_status"],
.flight-log-table td[data-cell="_status"]{
  left:48px!important;
  z-index:61!important;
  width:70px!important;
  min-width:70px!important;
  max-width:70px!important;
}

.flight-log-table th[data-col="flightId"],
.flight-log-table td[data-cell="flightId"]{
  left:118px!important; /* 48 edit + 70 status */
  z-index:60!important;
  width:112px!important;
  min-width:112px!important;
  max-width:112px!important;
  border-right:2px solid #e5e7eb!important;
}

/* Header above body */
.flight-log-table thead th[data-col="_edit"]{
  z-index:95!important;
  background:#f8fafc!important;
  background-color:#f8fafc!important;
}
.flight-log-table thead th[data-col="_status"]{ z-index:94!important; }
.flight-log-table thead th[data-col="flightId"]{ z-index:93!important; }

/* Compact edit button */
.flight-log-table .compact-edit,
.flight-log-table td[data-cell="_edit"] .icon-btn{
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  min-height:32px!important;
  max-width:32px!important;
  max-height:32px!important;
  padding:0!important;
  border-radius:10px!important;
  font-size:16px!important;
  line-height:1!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* Delete stays in the existing final action column */
.flight-log-table td[data-cell="action"] .action-inline,
.flight-log-table td.action-cell-normal .action-inline{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:0!important;
}

/* Row color continuity for the new sticky edit cell */
.flight-log-table tbody tr[data-tone="pending"] td[data-cell="_edit"],
.flight-log-table tbody tr.pending-row td[data-cell="_edit"]{
  background:#f4f0ff!important;
  background-color:#f4f0ff!important;
}

.flight-log-table tbody tr[data-tone="warning"] td[data-cell="_edit"],
.flight-log-table tbody tr.row-warning td[data-cell="_edit"]{
  background:#fff4c2!important;
  background-color:#fff4c2!important;
}

.flight-log-table tbody tr[data-tone="danger"] td[data-cell="_edit"],
.flight-log-table tbody tr.row-danger td[data-cell="_edit"]{
  background:#f8d7da!important;
  background-color:#f8d7da!important;
}

/* Adjust total table width: +48 edit, -28 flightId = net +20 */
.flight-log-table{
  width:2980px!important;
  min-width:2980px!important;
}

/* Mobile: keep the frozen area compact */
@media (max-width:900px){
  .flight-log-table th[data-col="_edit"],
  .flight-log-table td[data-cell="_edit"]{
    left:0!important;
    width:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    padding:5px!important;
  }

  .flight-log-table th[data-col="_status"],
  .flight-log-table td[data-cell="_status"]{
    left:46px!important;
    width:70px!important;
    min-width:70px!important;
    max-width:70px!important;
  }

  .flight-log-table th[data-col="flightId"],
  .flight-log-table td[data-cell="flightId"]{
    left:116px!important;
    width:112px!important;
    min-width:112px!important;
    max-width:112px!important;
  }

  .flight-log-table .compact-edit,
  .flight-log-table td[data-cell="_edit"] .icon-btn{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
    max-width:30px!important;
    max-height:30px!important;
    font-size:15px!important;
  }
}
