:root {
  --gts-navy: #0b1f3a;
  --gts-navy-2: #12375d;
  --gts-blue: #2563eb;
  --gts-blue-dark: #1d4ed8;
  --gts-green: #15803d;
  --gts-red: #dc2626;
  --gts-amber: #d97706;
  --gts-bg: #f3f6fb;
  --gts-surface: #ffffff;
  --gts-surface-soft: #f8fafc;
  --gts-text: #172033;
  --gts-muted: #64748b;
  --gts-border: #dce5ef;
  --gts-border-strong: #c7d3e2;
  --gts-shadow-sm: 0 4px 14px rgba(15, 23, 42, .045);
  --gts-shadow: 0 14px 38px rgba(15, 23, 42, .065);
  --gts-radius-sm: 10px;
  --gts-radius: 16px;
  --gts-sidebar: 272px;
  --gts-font: Inter, "Segoe UI", Roboto, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { min-width: 320px; background: var(--gts-bg); }
body {
  margin: 0;
  background: var(--gts-bg);
  color: var(--gts-text);
  font-family: var(--gts-font) !important;
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body button, body input, body select, body textarea, body table, body th,
body td, body label, body p, body h1, body h2, body h3, body h4, body h5,
body h6, body a, body small, body strong, body .modal, body .swal2-popup {
  font-family: var(--gts-font) !important;
}
body img { max-width: 100%; }
body a { text-underline-offset: 3px; }
body :focus-visible { outline: 3px solid rgba(37, 99, 235, .25); outline-offset: 2px; }

/* One isolated navigation component for every authenticated page. */
#gtsGlobalSidebar {
  width: var(--gts-sidebar) !important;
  min-width: var(--gts-sidebar) !important;
  max-width: var(--gts-sidebar) !important;
  height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  position: fixed !important;
  inset: 0 auto 0 0 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  color: #fff !important;
  background: linear-gradient(180deg, #081b33 0%, #10375f 100%) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: 8px 0 32px rgba(15, 23, 42, .13) !important;
  z-index: 1000 !important;
  scrollbar-color: rgba(255,255,255,.2) transparent;
  scrollbar-width: thin;
  transition: transform .24s ease;
}
#gtsGlobalSidebar *, #gtsGlobalSidebar *::before, #gtsGlobalSidebar *::after { box-sizing: border-box; }
#gtsGlobalSidebar .sidebar-header {
  flex: 0 0 auto !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 22px 14px 20px !important;
  background: rgba(3, 18, 36, .2) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 0 !important;
  text-align: center !important;
}
#gtsGlobalSidebar .sidebar-brand {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
}
#gtsGlobalSidebar .sidebar-logo {
  display: block !important;
  width: 205px !important;
  height: 178px !important;
  max-width: 205px !important;
  max-height: 178px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  object-fit: contain !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: drop-shadow(0 5px 12px rgba(0,0,0,.22)) !important;
}
#gtsGlobalSidebar .sidebar-identity { width: 100% !important; text-align: center !important; }
#gtsGlobalSidebar .sidebar-title {
  margin: 0 !important;
  color: #fff !important;
  font-size: 23px !important;
  font-weight: 900 !important;
  line-height: 1.15 !important;
  letter-spacing: .055em !important;
}
#gtsGlobalSidebar .sidebar-subtitle {
  margin: 6px 0 0 !important;
  color: #bed0e2 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}
#gtsGlobalSidebar .sidebar-company {
  margin: 4px 0 0 !important;
  color: #82a2c1 !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#gtsGlobalSidebar .sidebar-menu {
  width: 100% !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 12px !important;
  background: transparent !important;
  border: 0 !important;
}
#gtsGlobalSidebar .sidebar-menu > li {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  list-style: none !important;
}
#gtsGlobalSidebar .sidebar-menu > li.nav-section {
  padding: 16px 10px 7px !important;
  color: #8eabc7 !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  line-height: 1.3 !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
}
#gtsGlobalSidebar .sidebar-menu > li > a {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 42px !important;
  margin: 2px 0 !important;
  padding: 11px 12px !important;
  color: #dbe7f2 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
  text-decoration: none !important;
  transition: color .16s ease, background .16s ease, transform .16s ease !important;
}
#gtsGlobalSidebar .sidebar-menu > li > a:hover {
  color: #fff !important;
  background: rgba(255,255,255,.09) !important;
  transform: translateX(2px);
}
#gtsGlobalSidebar .sidebar-menu > li > a.active {
  color: #fff !important;
  background: rgba(255,255,255,.13) !important;
  box-shadow: inset 3px 0 #4ade80 !important;
}
#gtsGlobalSidebar .sidebar-menu > li > a > i {
  display: inline-block !important;
  flex: 0 0 18px !important;
  width: 18px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #93b4d3 !important;
  font-size: 13px !important;
  line-height: 1 !important;
  text-align: center !important;
}
#gtsGlobalSidebar .sidebar-menu > li > a.active > i { color: #4ade80 !important; }
#gtsGlobalSidebar .sidebar-account {
  flex: 0 0 auto !important;
  width: 100% !important;
  padding: 10px 12px !important;
  background: rgba(3,18,36,.22) !important;
  border-top: 1px solid rgba(255,255,255,.09) !important;
}
#gtsGlobalSidebar .sidebar-account-label {
  padding: 0 10px 6px !important;
  color: #8eabc7 !important;
  font-size: 10px !important;
  font-weight: 850 !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
}
#gtsGlobalSidebar .sidebar-signout {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  min-height: 42px !important;
  padding: 11px 12px !important;
  color: #fee2e2 !important;
  background: rgba(239,68,68,.1) !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 750 !important;
  text-decoration: none !important;
  transition: background .16s ease, color .16s ease !important;
}
#gtsGlobalSidebar .sidebar-signout:hover {
  color: #fff !important;
  background: rgba(239,68,68,.22) !important;
}
#gtsGlobalSidebar .sidebar-signout i { width: 18px; text-align: center; }
#gtsGlobalSidebar .sidebar-footer {
  flex: 0 0 auto !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 16px 20px !important;
  color: #91abc3 !important;
  background: rgba(3,18,36,.12) !important;
  border: 0 !important;
  border-top: 1px solid rgba(255,255,255,.09) !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
  text-align: center !important;
}

/* Shared side notifications used by native alert() and non-interactive SweetAlert messages. */
.gts-toast-region {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 20050;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(390px, calc(100vw - 28px));
  pointer-events: none;
}
.gts-toast {
  --toast-accent: #2563eb;
  display: grid;
  grid-template-columns: 22px minmax(0,1fr) 24px;
  gap: 10px;
  align-items: start;
  padding: 13px 12px 13px 14px;
  color: #1e293b;
  background: rgba(255,255,255,.98);
  border: 1px solid #dce5ef;
  border-left: 4px solid var(--toast-accent);
  border-radius: 12px;
  box-shadow: 0 16px 42px rgba(15,23,42,.18);
  pointer-events: auto;
  animation: gts-toast-in .2s ease-out both;
}
.gts-toast.is-success { --toast-accent: #16a34a; }
.gts-toast.is-error { --toast-accent: #dc2626; }
.gts-toast.is-warning { --toast-accent: #d97706; }
.gts-toast.is-info, .gts-toast.is-question { --toast-accent: #2563eb; }
.gts-toast-icon { color: var(--toast-accent); font-size: 17px; line-height: 22px; text-align: center; }
.gts-toast-copy { min-width: 0; }
.gts-toast-title { margin: 0 0 2px; color: #0f172a; font-size: 13px; font-weight: 850; line-height: 1.35; }
.gts-toast-message { color: #475569; font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
.gts-toast-close { width: 24px; height: 24px; padding: 0; color: #64748b; background: transparent; border: 0; border-radius: 6px; cursor: pointer; font-size: 18px; line-height: 1; }
.gts-toast-close:hover { color: #0f172a; background: #f1f5f9; }
.gts-toast.is-leaving { animation: gts-toast-out .18s ease-in both; }
@keyframes gts-toast-in { from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: translateX(0); } }
@keyframes gts-toast-out { to { opacity: 0; transform: translateX(24px); } }
@media (max-width: 600px) { .gts-toast-region { top: 68px; right: 10px; width: calc(100vw - 20px); } }
@media (prefers-reduced-motion: reduce) { .gts-toast, .gts-toast.is-leaving { animation: none; } }

#gtsMobileNavToggle {
  display: none;
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 1100;
  width: 44px;
  height: 44px;
  place-items: center;
  padding: 0;
  color: #fff;
  background: var(--gts-navy);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(15,23,42,.24);
  cursor: pointer;
}
#gtsSidebarBackdrop { display: none; margin: 0 !important; padding: 0 !important; border: 0 !important; }

/* Consistent page canvas and spacing. */
body .main-container,
body > .main-content,
body > main.main,
body > main.owner-main {
  width: auto !important;
  max-width: none !important;
  min-height: 100vh !important;
  margin: 0 0 0 var(--gts-sidebar) !important;
  padding: 28px !important;
  overflow-x: hidden;
  color: var(--gts-text);
  background: var(--gts-bg);
}
body .main-container > :first-child,
body > .main-content > :first-child,
body > main.main > :first-child,
body > main.owner-main > :first-child { margin-top: 0; }

/* Typography and page headings. */
body .main-container h1, body > .main-content h1, body > main.main h1, body > main.owner-main h1,
body .main-container h2, body > .main-content h2, body > main.main h2, body > main.owner-main h2,
body .main-container h3, body > .main-content h3, body > main.main h3, body > main.owner-main h3 {
  color: var(--gts-navy);
  font-weight: 850;
  line-height: 1.22;
  letter-spacing: -.025em;
}
body .main-container h1, body > .main-content h1, body > main.main h1, body > main.owner-main h1 {
  margin-top: 0;
  font-size: clamp(25px, 2vw, 32px);
}
body .page-header, body .page-head, body .topbar, body .header-section {
  gap: 16px;
  margin-bottom: 20px;
}
body .page-header p, body .page-head p, body .topbar p, body .header-section p,
body .text-muted, body .muted, body .sub, body small { color: var(--gts-muted) !important; }

/* Cards and grouped sections. */
body .main-container .card, body > .main-content .card, body > main.main .card, body > main.owner-main .card,
body .main-container .panel, body .main-container .content-card, body .main-container .table-container,
body .main-container .card-gts, body .main-container .form-section, body .main-container .summary-card,
body .main-container .metric-card, body .main-container .kpi, body .main-container .d-card {
  background: var(--gts-surface);
  border: 1px solid var(--gts-border) !important;
  border-radius: var(--gts-radius) !important;
  box-shadow: var(--gts-shadow-sm) !important;
}
body .main-container .card:hover, body > .main-content .card:hover, body > main.owner-main .card:hover {
  border-color: #d2deeb !important;
}
body .card-head, body .card-header, body .card-title {
  border-color: #e7edf4 !important;
}
body .card-head h2, body .card-header h2, body .card-title h2 { margin: 0; }

/* Forms: uniform sizing, clear labels, and accessible focus. */
body .main-container label, body > .main-content label, body > main.main label, body > main.owner-main label {
  color: #334155;
  font-size: 12px;
  font-weight: 750;
}
body .main-container input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
body .main-container select, body .main-container textarea,
body > .main-content input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
body > .main-content select, body > .main-content textarea,
body > main.main input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
body > main.main select, body > main.main textarea,
body > main.owner-main input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
body > main.owner-main select, body > main.owner-main textarea {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  color: var(--gts-text);
  background: #fff;
  border: 1px solid var(--gts-border-strong) !important;
  border-radius: var(--gts-radius-sm) !important;
  box-shadow: none !important;
  font-size: 14px;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
body textarea { min-height: 88px; resize: vertical; }
body input::placeholder, body textarea::placeholder { color: #94a3b8; opacity: 1; }
body .main-container input:focus, body .main-container select:focus, body .main-container textarea:focus,
body > .main-content input:focus, body > .main-content select:focus, body > .main-content textarea:focus,
body > main.main input:focus, body > main.main select:focus, body > main.main textarea:focus {
  border-color: #60a5fa !important;
  box-shadow: 0 0 0 3px rgba(37,99,235,.12) !important;
  outline: 0 !important;
}
body input:disabled, body select:disabled, body textarea:disabled {
  color: #64748b !important;
  background: #f1f5f9 !important;
  cursor: not-allowed;
}
body .form-group, body .field { margin-bottom: 13px; }
body .form-group > label, body .field > label, body .form-label { display: block; margin-bottom: 6px; }
body label.btn-upload-file {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  color: #fff !important;
  opacity: 1 !important;
}

/* Buttons and action bars. */
body .main-container button, body .main-container .btn,
body > .main-content button, body > .main-content .btn,
body > main.main button, body > main.main .btn,
body > main.owner-main button, body > main.owner-main .btn {
  min-height: 42px;
  padding: 10px 15px;
  border-radius: var(--gts-radius-sm) !important;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.25;
  cursor: pointer;
  transition: transform .14s ease, filter .14s ease, box-shadow .14s ease;
}
body .main-container button:hover, body .main-container .btn:hover,
body > .main-content button:hover, body > .main-content .btn:hover,
body > main.main button:hover, body > main.main .btn:hover { filter: brightness(.97); }
body .main-container button:active, body .main-container .btn:active,
body > .main-content button:active, body > .main-content .btn:active,
body > main.main button:active, body > main.main .btn:active { transform: translateY(1px); }
body .btn:disabled, body button:disabled { opacity: .58; cursor: not-allowed; transform: none !important; }

/* Tabs, filters, and secondary navigation. */
body .tabs, body .nav-tabs, body .tab-navigation, body .settings-tabs {
  scrollbar-width: thin;
}
body .tabs a, body .tab-btn, body .tab-button, body .settings-tabs button {
  min-height: 42px;
  border-radius: 10px !important;
  font-weight: 800 !important;
}
body .filters, body .filter-bar, body .filter-section, body .controls-row {
  align-items: end;
  gap: 10px;
}

/* Tables and DataTables. */
body .main-container .table-responsive, body .main-container .table-container, body .main-container .table-wrapper,
body > .main-content .table-responsive, body > .main-content .table-container, body > .main-content .table-wrapper,
body > main.main .table, body > main.main .table-responsive, body > main.main .table-container {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 12px;
}
body .main-container table, body > .main-content table, body > main.main table, body > main.owner-main table {
  width: 100%;
  background: #fff;
  border-collapse: separate;
  border-spacing: 0;
}
body .main-container thead th, body > .main-content thead th,
body > main.main thead th, body > main.owner-main thead th {
  padding: 12px 14px;
  color: #fff !important;
  background: var(--gts-navy) !important;
  border-color: rgba(255,255,255,.08) !important;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: .045em;
  line-height: 1.3;
  text-transform: uppercase;
  white-space: nowrap;
}
body .main-container thead th:first-child, body > .main-content thead th:first-child,
body > main.main thead th:first-child { border-top-left-radius: 10px; }
body .main-container thead th:last-child, body > .main-content thead th:last-child,
body > main.main thead th:last-child { border-top-right-radius: 10px; }
body .main-container tbody td, body > .main-content tbody td,
body > main.main tbody td, body > main.owner-main tbody td {
  padding: 12px 14px;
  color: #334155;
  background: #fff;
  border-bottom: 1px solid #e9eff5;
  font-size: 13px;
  vertical-align: middle;
}
body .main-container tbody tr:hover td, body > .main-content tbody tr:hover td,
body > main.main tbody tr:hover td, body > main.owner-main tbody tr:hover td { background: #f8fafc; }
body .dataTables_wrapper .dataTables_length, body .dataTables_wrapper .dataTables_filter,
body .dataTables_wrapper .dataTables_info, body .dataTables_wrapper .dataTables_paginate {
  margin: 10px 0;
  color: var(--gts-muted) !important;
  font-size: 12px;
}
body .dataTables_wrapper .dataTables_paginate .paginate_button {
  border: 1px solid var(--gts-border) !important;
  border-radius: 8px !important;
}

/* Status, feedback, and empty states. */
body .badge, body .badge-status, body .status-badge, body .code {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 9px;
  border-radius: 999px !important;
  font-size: 10px;
  font-weight: 850;
  line-height: 1.2;
}
body .notice, body .alert, body .success-message, body .error, body .error-message, body .note {
  border-radius: 12px !important;
  line-height: 1.5;
}
body .empty, body .empty-state, body .no-data {
  padding: 30px 18px !important;
  color: #94a3b8 !important;
  text-align: center !important;
}

/* Dialogs remain compatible with Bootstrap, custom modals, and SweetAlert. */
body .modal-window, body .modal-content, body dialog, body .swal2-popup {
  color: var(--gts-text);
  background: #fff;
  border: 1px solid var(--gts-border) !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 70px rgba(15,23,42,.2) !important;
}
body .modal-header { border-bottom: 1px solid #e7edf4 !important; }
body .modal-footer { border-top: 1px solid #e7edf4 !important; }
body .modal-backdrop, body .sidebar-backdrop { backdrop-filter: blur(2px); }

/* Utility grids collapse safely without changing form workflows. */
body .dashboard-grid, body .content-grid, body .form-grid, body .grid,
body .row, body .source-grid, body .status-grid, body .kpi-grid { min-width: 0; }
body .card, body .panel, body .content-card, body .form-section { min-width: 0; }

@media (max-width: 1100px) {
  body .main-container, body > .main-content, body > main.main, body > main.owner-main { padding: 22px !important; }
  body .dashboard-grid, body .content-grid { gap: 14px; }
}

@media (max-width: 900px) {
  #gtsGlobalSidebar { transform: translateX(-100%) !important; }
  body.nav-open #gtsGlobalSidebar { transform: translateX(0) !important; }
  #gtsMobileNavToggle { display: grid; }
  body.nav-open #gtsSidebarBackdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 900;
    background: rgba(2, 6, 23, .58);
  }
  body.nav-open { overflow: hidden; }
  body .main-container, body > .main-content, body > main.main, body > main.owner-main {
    width: 100% !important;
    min-height: 100vh !important;
    margin-left: 0 !important;
    padding: 72px 14px 28px !important;
  }
  body .dashboard-grid, body .content-grid, body .form-grid, body .grid,
  body .source-grid, body .status-grid { grid-template-columns: minmax(0, 1fr) !important; }
  body .page-header, body .page-head, body .topbar, body .header-section {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  body .main-container h1, body > .main-content h1, body > main.main h1, body > main.owner-main h1 { font-size: 25px; }
}

@media (max-width: 600px) {
  body .main-container, body > .main-content, body > main.main, body > main.owner-main { padding-inline: 10px !important; }
  body .main-container .card, body > .main-content .card, body > main.main .card,
  body .main-container .panel, body .main-container .content-card { border-radius: 13px !important; }
  body .row { grid-template-columns: minmax(0, 1fr) !important; }
  body .filters, body .filter-bar, body .filter-section, body .controls-row {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  body .filters > *, body .filter-bar > *, body .filter-section > *, body .controls-row > * { width: 100% !important; }
  body .main-container button, body .main-container .btn,
  body > .main-content button, body > .main-content .btn,
  body > main.main button, body > main.main .btn { min-height: 44px; }
  body .main-container thead th, body > .main-content thead th, body > main.main thead th,
  body .main-container tbody td, body > .main-content tbody td, body > main.main tbody td { padding: 10px 11px; }
}

@media print {
  #gtsGlobalSidebar, #gtsMobileNavToggle, #gtsSidebarBackdrop { display: none !important; }
  body .main-container, body > .main-content, body > main.main, body > main.owner-main {
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: #fff !important;
  }
  body .card, body .panel, body .content-card, body .table-container {
    box-shadow: none !important;
  }
}

/* Shared, bounded table pagination */
.gts-table-pager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 4px 2px;
  color: #5b6b84;
  font-size: 13px;
}
.gts-page-controls, .gts-page-nav, .gts-page-size { display: flex; align-items: center; gap: 7px; }
.gts-page-size select {
  min-width: 70px !important;
  width: auto !important;
  min-height: 36px !important;
  padding: 6px 26px 6px 10px !important;
  border: 1px solid #d4deeb !important;
  border-radius: 9px !important;
  background-color: #fff !important;
}
.gts-page-button {
  display: inline-grid;
  place-items: center;
  min-width: 36px;
  height: 36px;
  padding: 0 9px;
  border: 1px solid #d4deeb;
  border-radius: 9px;
  background: #fff;
  color: #17345c;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.gts-page-button:hover:not(:disabled) { border-color: #2864e8; color: #1754dc; background: #f2f6ff; }
.gts-page-button.is-active { color: #fff; border-color: #2864e8; background: #2864e8; }
.gts-page-button:disabled { opacity: .42; cursor: not-allowed; }
.gts-page-ellipsis { display: inline-grid; place-items: center; width: 24px; color: #8190a7; }

@media (max-width: 680px) {
  .gts-table-pager { align-items: stretch; flex-direction: column; }
  .gts-page-controls { justify-content: space-between; }
  .gts-page-nav { gap: 4px; }
  .gts-page-button { min-width: 33px; height: 34px; padding-inline: 7px; }
}

@media print { .gts-table-pager { display: none !important; } }

/* Accounting journal: keep every line inside its card at all widths. */
body .journal-lines {
  display: grid;
  gap: 10px;
  width: 100%;
  min-width: 0;
}
body .journal-line {
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.4fr) 42px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
body .journal-line .journal-cell,
body .journal-line input,
body .journal-line select { min-width: 0; max-width: 100%; }

@media (max-width: 760px) {
  body .journal-line { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  body .journal-line .journal-cell.account,
  body .journal-line .journal-cell.memo { grid-column: 1 / -1; }
  body .journal-line .remove { grid-column: 2; justify-self: end; }
}

@media (max-width: 430px) {
  body .journal-line { grid-template-columns: minmax(0, 1fr); }
  body .journal-line .journal-cell.account,
  body .journal-line .journal-cell.memo,
  body .journal-line .remove { grid-column: 1; }
  body .journal-line .remove { width: 100%; justify-self: stretch; }
}

/* Global responsive safety layer. Keeps legacy pages usable without changing their workflow. */
html, body { max-width: 100%; }
body { overflow-x: clip; }
img, video, canvas { max-width: 100%; }
body main *, body .main-container *, body .main-content * { box-sizing: border-box; }
body main > *, body .main-container > *, body .main-content > *,
body .grid > *, body .row > *, body .dashboard-grid > *, body .content-grid > * { min-width: 0; }
.gts-table-scroll { width: 100%; max-width: 100%; overflow: auto; -webkit-overflow-scrolling: touch; border-radius: inherit; }
.gts-table-scroll:focus { outline: 3px solid rgba(37,99,235,.18); outline-offset: 2px; }
dialog, [role="dialog"], .modal-content { max-width: calc(100vw - 24px); max-height: calc(100vh - 24px); }

@media (max-width: 900px) {
  body main, body .main-container, body .main-content, body .owner-main { max-width: 100vw !important; }
  body input, body select, body textarea { max-width: 100%; min-width: 0; }
  body form[style*="grid-template-columns"], body div[style*="grid-template-columns"] { max-width: 100%; }
  body .card, body .panel, body .content-card, body .table-container { max-width: 100%; }
}

@media (max-width: 520px) {
  body .btn, body button, body input[type="submit"] { white-space: normal; }
  body .tabs, body .tab-nav, body .nav-tabs { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  body dialog, body [role="dialog"], body .modal-content { width: calc(100vw - 16px) !important; margin: 8px !important; }
}