/* GS Modern UI — global visual layer for the admin system */
:root {
  --gs-primary: #e5252a;
  --gs-primary-dark: #bd161b;
  --gs-primary-soft: #fff1f2;
  --gs-navy: #4b5563;
  --gs-navy-2: #6b7280;
  --gs-bg: #f2f3f5;
  --gs-surface: #ffffff;
  --gs-border: #e5eaf1;
  --gs-text: #182230;
  --gs-muted: #667085;
  --gs-success: #16a34a;
  --gs-warning: #d97706;
  --gs-danger: #dc2626;
  --gs-info: #2563eb;
  --gs-radius: 12px;
  --gs-shadow: 0 5px 18px rgba(15, 23, 42, .07);
  --gs-shadow-lg: 0 14px 35px rgba(15, 23, 42, .12);
}

html, body {
  font-family: "Cairo", "Segoe UI", Tahoma, Arial, sans-serif !important;
  background: var(--gs-bg);
  color: var(--gs-text);
}

html, body, #app_wrapper, table.lt, table.lt > tbody,
table.lt > tbody > tr, td.sidebar-con, .sidebar-con {
  background: #c7cbd1 !important;
}

td.content-con, .content-con, #content { background: var(--gs-bg) !important; }

body { font-size: 13px; }
a { color: var(--gs-info); transition: color .18s ease, background .18s ease, box-shadow .18s ease; }
a:hover, a:focus { color: var(--gs-primary); text-decoration: none; }

/* Top navigation */
#header.navbar {
  min-height: 62px;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: rgba(255,255,255,.97) !important;
  box-shadow: 0 1px 0 var(--gs-border), 0 4px 16px rgba(15,23,42,.05);
  position: fixed !important;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
  z-index: 1035;
}
body:not(.login-page) { padding-top: 62px !important; }
#header .container { width: 100%; padding-inline: 20px; }
#header .navbar-brand {
  min-height: 62px;
  display: flex;
  align-items: center;
  padding: 10px 14px;
  background: transparent !important;
}
#header .navbar-brand img { max-height: 40px !important; width: auto; object-fit: contain; }
#header .navbar-brand .logo { color: var(--gs-primary); font-weight: 800; font-size: 21px; }
#header .header-nav .nav > li > a,
#header .navbar-toggle {
  min-height: 62px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #475467 !important;
  border: 0 !important;
  background: transparent !important;
}
#header .header-nav .nav > li > a:hover,
#header .header-nav .nav > li.open > a {
  color: var(--gs-primary) !important;
  background: var(--gs-primary-soft) !important;
}
#header .header-nav .nav > li > a > i,
#header .header-nav .nav > li > a > .fa,
#header .btn-visible-sm > a > .fa,
#header .navbar-toggle > .fa {
  font-size: 19px !important;
  line-height: 1 !important;
  min-width: 20px;
  text-align: center;
}
#header .header-nav .nav > li.dropdown > a.btn {
  min-width: 44px;
  padding-inline: 12px !important;
}
#header .header-nav .nav > li > a .padding05 {
  margin-inline-start: 5px;
}
#header .header-nav .nav > li.gs-language-switcher > a.btn {
  width: 40px;
  height: 40px;
  min-height: 40px !important;
  margin-top: 11px;
  padding: 7px !important;
  border-radius: 10px !important;
  background: #646b75 !important;
}
#header .header-nav .nav > li.gs-language-switcher.open > a.btn,
#header .header-nav .nav > li.gs-language-switcher > a.btn:hover { background: #e5252a !important; }
#header .header-nav .nav > li.gs-language-switcher > a.btn > .fa-globe {
  position: static !important;
  display: block;
  width: 26px !important;
  min-width: 26px;
  color: #fff !important;
  font-size: 22px !important;
  line-height: 26px !important;
  transform: none !important;
}
#header .mini_avatar { width: 34px; height: 34px; border-radius: 50% !important; object-fit: cover; border: 2px solid #fff; box-shadow: 0 0 0 1px var(--gs-border); }
#header .user span { color: var(--gs-text); font-weight: 700; }
#header .number { border-radius: 20px; min-width: 18px; height: 18px; line-height: 18px; font-size: 10px; }

#header .header-nav .nav > li.gs-plan-badge > a.gs-plan-badge__link {
  gap: 8px;
  padding: 9px 12px !important;
  cursor: pointer;
}
#header .gs-plan-badge__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 10px;
  color: #fff;
  background: linear-gradient(135deg, #e5252a, #bd161b);
  box-shadow: 0 5px 12px rgba(229, 37, 42, .22);
}
#header .gs-plan-badge__icon > i.fa {
  min-width: 0 !important;
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1 !important;
}
#header .gs-plan-badge__name {
  color: #344054;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .2px;
  line-height: 1;
  white-space: nowrap;
}
#header .gs-plan-badge__link:hover .gs-plan-badge__name,
#header .gs-plan-badge__link:focus .gs-plan-badge__name { color: #bd161b; }

/* Sidebar */
#sidebar-left {
  background: linear-gradient(180deg, rgba(213,216,221,.68) 0%, rgba(185,190,198,.62) 100%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(115%);
  backdrop-filter: blur(10px) saturate(115%);
  box-shadow: 4px 0 20px rgba(75,85,99,.11);
}
#sidebar-left, td.sidebar-con, .sidebar-con {
  min-height: calc(100vh - 62px);
  background-color: rgba(199,203,209,.56) !important;
}
#sidebar-left .sidebar-nav { padding-top: 12px; }
#sidebar-left #sidebar_menu ul,
#sidebar-left #sidebar_menu li { background: transparent !important; }
#sidebar_menu > ul > li { margin: 3px 10px; }
#sidebar-left #sidebar_menu .nav > li > a,
#sidebar-left #sidebar_menu > ul > li > a,
#sidebar-left #sidebar_menu li > a {
  color: #fff !important;
  background: rgba(75,85,99,.78) !important;
  border: 0 !important;
  border-radius: 9px;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  font-weight: 600;
  min-height: 42px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  position: relative;
  text-align: center !important;
  padding: 8px 35px !important;
}
#sidebar-left #sidebar_menu li > a > i {
  color: #e5e7eb !important;
  width: 22px;
  text-align: center;
  transition: color .18s ease;
  position: absolute;
  inset-inline-start: 9px;
  top: 50%;
  transform: translateY(-50%);
}
#sidebar-left #sidebar_menu li > a > .text {
  display: block !important;
  width: 100%;
  margin: 0 !important;
  text-align: center !important;
  line-height: 1.45;
}
#sidebar-left #sidebar_menu li > a > .chevron {
  position: absolute !important;
  inset-inline-end: 9px;
  top: 50% !important;
  transform: translateY(-50%);
  margin: 0 !important;
}
#sidebar-left #sidebar_menu li > a:hover,
#sidebar-left #sidebar_menu li.active > a,
#sidebar-left #sidebar_menu li.current > a,
#sidebar-left #sidebar_menu li.open > a {
  color: #fff !important;
  background: linear-gradient(135deg, rgba(229,37,42,.90), rgba(189,22,27,.88)) !important;
  box-shadow: 0 7px 16px rgba(229,37,42,.2);
}
#sidebar-left #sidebar_menu li > a:hover i,
#sidebar-left #sidebar_menu li.active > a i,
#sidebar-left #sidebar_menu li.current > a i,
#sidebar-left #sidebar_menu li.open > a i { color: #fff !important; }
#sidebar_menu ul ul { margin: 4px 0 7px; }
#sidebar-left #sidebar_menu ul ul li > a {
  font-size: 12px;
  color: #f8fafc !important;
  background: rgba(100,107,117,.68) !important;
  padding-block: 8px !important;
}
#sidebar-left #sidebar_menu ul ul li > a:hover,
#sidebar-left #sidebar_menu ul ul li.active > a {
  color: #fff !important;
  background: rgba(229,37,42,.90) !important;
  box-shadow: none;
}

/* Never allow the legacy black skin to override the grey/red identity */
body.black #sidebar-left,
body.blue #sidebar-left,
body.grey #sidebar-left { background: linear-gradient(180deg, rgba(213,216,221,.68) 0%, rgba(185,190,198,.62) 100%) !important; }
body.black #sidebar-left #sidebar_menu li > a,
body.blue #sidebar-left #sidebar_menu li > a,
body.grey #sidebar-left #sidebar_menu li > a { background-color: rgba(75,85,99,.78) !important; color: #fff !important; }
body.black #sidebar-left #sidebar_menu li.active > a,
body.black #sidebar-left #sidebar_menu li > a:hover,
body.blue #sidebar-left #sidebar_menu li.active > a,
body.blue #sidebar-left #sidebar_menu li > a:hover,
body.grey #sidebar-left #sidebar_menu li.active > a,
body.grey #sidebar-left #sidebar_menu li > a:hover { background: rgba(229,37,42,.90) !important; }

#main-menu-act {
  color: #fff !important;
  background: rgba(100,107,117,.72) !important;
  border: 0 !important;
}
#main-menu-act:hover { background: rgba(229,37,42,.90) !important; }

/* Replace remaining legacy black blocks with the approved grey */
.bblack, .bg-black, .black-bg,
.quick-button.bblack, .quick-button-small.bblack {
  background: #646b75 !important;
  border-color: #646b75 !important;
}
#footer, footer, .footer {
  color: #fff !important;
  background: #646b75 !important;
  border-color: #747b85 !important;
}
.gs-footer { background: #646b75 !important; }
.gs-footer a { color: #fff !important; }
.gs-footer .gs-to-top { color: #e5252a !important; }
#modal-loading .blackbg { background: rgba(75,85,99,.72) !important; }

/* Main content */
#content { background: var(--gs-bg) !important; padding: 22px !important; min-height: calc(100vh - 62px); }
.content-con { background: var(--gs-bg) !important; }
.page-header, .page-head, .content-header { border-color: var(--gs-border) !important; }
.page-header h1, .page-head h1, #content h1 { color: var(--gs-navy); font-weight: 800; letter-spacing: -.2px; }
.breadcrumb { background: transparent; padding-inline: 0; color: var(--gs-muted); }

/* Panels and boxes */
.box, .panel, .well, .widget, .form-container, .table-responsive {
  border: 1px solid var(--gs-border) !important;
  border-radius: var(--gs-radius) !important;
  background: var(--gs-surface);
  box-shadow: var(--gs-shadow);
}
.box { overflow: hidden; }
.box .box-header, .panel-heading {
  min-height: 50px;
  padding: 13px 16px !important;
  background: #fff !important;
  border-bottom: 1px solid var(--gs-border) !important;
  color: var(--gs-navy) !important;
  font-weight: 800;
}
.box .box-content, .panel-body { padding: 17px !important; background: #fff; }
.well { padding: 18px; }

/* Buttons */
.btn {
  border-radius: 8px !important;
  min-height: 36px;
  padding: 7px 13px;
  font-weight: 700;
  border-width: 1px;
  box-shadow: none;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn:hover { transform: translateY(-1px); box-shadow: 0 5px 12px rgba(15,23,42,.10); }
.btn:active { transform: translateY(0); }
.btn-primary, .btn-success {
  color: #fff !important;
  background: linear-gradient(135deg, var(--gs-primary), var(--gs-primary-dark)) !important;
  border-color: var(--gs-primary-dark) !important;
}
.btn-primary:hover, .btn-success:hover { background: var(--gs-primary-dark) !important; }
.btn-default { background: #fff !important; color: #344054 !important; border-color: #d0d5dd !important; }
.btn-info { background: #2563eb !important; border-color: #1d4ed8 !important; }
.btn-warning { background: #f59e0b !important; border-color: #d97706 !important; }
.btn-danger { background: #dc2626 !important; border-color: #b91c1c !important; }
.btn-group > .btn { min-height: 34px; }

/* Forms */
.form-control, select.form-control, .select2-container .select2-choice,
.select2-container-multi .select2-choices, .input-group-addon {
  min-height: 40px;
  border-color: #d7dee8 !important;
  border-radius: 8px !important;
  background: #fff;
  box-shadow: none !important;
}
.form-control { padding: 8px 11px; color: var(--gs-text); }
.form-control:focus, .select2-container-active .select2-choice,
.select2-dropdown-open .select2-choice {
  border-color: var(--gs-primary) !important;
  box-shadow: 0 0 0 3px rgba(229,37,42,.11) !important;
}
.input-group .form-control { border-radius: 0 8px 8px 0 !important; }
.input-group-addon { display: table-cell; color: var(--gs-muted); background: #f8fafc; padding-inline: 12px; }
html[dir="rtl"] .input-group .form-control, body.rtl .input-group .form-control { border-radius: 8px 0 0 8px !important; }
label { color: #344054; font-weight: 700; margin-bottom: 6px; }
.help-block { color: var(--gs-muted); }

/* Settings pages */
#content fieldset {
  margin: 10px 0 22px;
  padding: 24px 20px 8px;
  border: 1px solid #d5dae1 !important;
  border-radius: 12px;
  background: #fff;
}
#content fieldset > legend {
  width: auto;
  margin: 0;
  padding: 7px 15px;
  border: 1px solid #d5dae1;
  border-radius: 8px;
  background: #f8fafc;
  color: #475467;
  font-size: 17px;
  font-weight: 800;
}
#content .form-group { margin-bottom: 18px; }
#content .form-group label { display: block; min-height: 22px; line-height: 1.45; }
#content .form-control,
#content .select2-container,
#content .select2-container .select2-choice { width: 100% !important; }
#content .select2-container .select2-choice {
  height: 42px !important;
  padding: 7px 12px !important;
  line-height: 26px !important;
}
#content .select2-container.form-control,
#content div.select2-container,
#content span.select2-container {
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
}
#content .select2-container .select2-choice {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  background: #fff !important;
  border: 1px solid #d7dee8 !important;
}
#content select.select2-offscreen,
#content .select2-offscreen {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
#content .select2-container .select2-choice > .select2-chosen {
  margin: 0 0 0 28px !important;
  line-height: 26px !important;
}
html[dir="rtl"] #content .form-horizontal .control-label,
html[dir="rtl"] #content label { text-align: right !important; }
html[dir="rtl"] #content .select2-container .select2-choice > .select2-chosen {
  margin: 0 0 0 30px !important;
  text-align: right !important;
}
html[dir="rtl"] #content .row > [class*="col-"] { float: right; }
html[dir="rtl"] #content .select2-container .select2-choice .select2-arrow {
  right: auto !important;
  left: 0 !important;
  border-right: 1px solid #d7dee8 !important;
  border-left: 0 !important;
}

/* Tables and DataTables */
table.table { background: #fff; margin-bottom: 0; font-size: 11px !important; }
.table-responsive { overflow: hidden; }
.table-bordered { border: 1px solid #e1e5eb !important; border-collapse: separate !important; border-spacing: 0; }
.table > thead > tr > th {
  background: linear-gradient(180deg, #f7f8fa, #eceff2) !important;
  color: #344054 !important;
  border-bottom: 1px solid var(--gs-border) !important;
  font-weight: 800;
  padding: 7px 7px !important;
  height: 30px;
  white-space: nowrap;
}
.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > td { border-color: #e5e7eb !important; }
.table > tbody > tr > td {
  height: 30px;
  padding: 5px 7px !important;
  border-top: 1px solid #eef0f3 !important;
  vertical-align: middle;
  line-height: 1.25;
}
.table-striped > tbody > tr:nth-child(odd) > td { background: #fafbfc; }
.table > tbody > tr:hover > td { background: #fff3f3 !important; }
.table > tbody > tr { transition: background .15s ease; }
.table .label { padding: 3px 7px; font-size: 10px; line-height: 1.2; }
.dataTables_wrapper .form-control,
.dataTables_wrapper select,
.dataTables_wrapper input { min-height: 30px !important; height: 30px !important; padding: 4px 7px !important; font-size: 11px; }
.dataTables_wrapper .row:first-child,
.dataTables_wrapper .row:last-child { padding: 7px 10px !important; }
.dataTables_info { font-size: 11px; padding-top: 7px !important; }
.dataTables_wrapper .pagination { margin: 3px 0 !important; }
.dataTables_wrapper .pagination > li > a,
.dataTables_wrapper .pagination > li > span { padding: 4px 8px !important; font-size: 11px; }
.dataTables_wrapper { background: #fff; border-radius: var(--gs-radius); }
.dataTables_wrapper .row:first-child, .dataTables_wrapper .row:last-child { padding: 12px 14px; margin: 0; }
.pagination > li > a, .pagination > li > span {
  border-color: var(--gs-border); color: #475467; margin-inline: 2px; border-radius: 7px !important;
}
.pagination > .active > a, .pagination > .active > span,
.pagination > .active > a:hover { background: var(--gs-primary) !important; border-color: var(--gs-primary) !important; }

/* Modern quick links */
.box-content .quick-button,
.box-content a.quick-button.small {
  min-height: 94px !important;
  margin: 6px 0 12px !important;
  padding: 14px 8px !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #4b5563 !important;
  background: #fff !important;
  border: 1px solid #d9dee5 !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 16px rgba(75,85,99,.09) !important;
}
.box-content .quick-button > i,
.box-content a.quick-button.small > i {
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 !important;
  border-radius: 12px;
  color: #fff !important;
  background: linear-gradient(135deg, #e5252a, #bd161b) !important;
  font-size: 19px !important;
  box-shadow: 0 7px 14px rgba(229,37,42,.20);
}
.box-content .quick-button > p,
.box-content a.quick-button.small > p {
  margin: 0 !important;
  color: #4b5563 !important;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}
.box-content .quick-button:hover,
.box-content a.quick-button.small:hover {
  transform: translateY(-4px);
  border-color: #e5252a !important;
  box-shadow: 0 12px 25px rgba(75,85,99,.15) !important;
}

/* Grey/red headings instead of legacy blue */
.box-header h2.blue, .box-header h2.blue a,
.panel-heading .blue, #content h1.blue, #content h2.blue,
#content h3.blue, #content .blue:not(.btn) { color: #4b5563 !important; }
.box-header h2.blue > i, .panel-heading .blue > i,
#content h2.blue > i, #content h3.blue > i { color: #e5252a !important; }
.box-header { border-top: 3px solid #e5252a !important; }
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover { color: #e5252a !important; background: #fff !important; }

/* Dropdowns, modals, tabs */
.dropdown-menu {
  border: 1px solid var(--gs-border);
  border-radius: 10px;
  box-shadow: var(--gs-shadow-lg);
  padding: 7px;
}
.dropdown-menu > li > a { border-radius: 7px; padding: 8px 11px; color: #344054; }
.dropdown-menu > li > a:hover { background: var(--gs-primary-soft); color: var(--gs-primary); }
.modal-backdrop, .modal-backdrop.in { z-index: 1050 !important; }
.modal, .modal.in, body.modal-open .modal.in { z-index: 1060 !important; pointer-events: auto !important; }
.modal .modal-dialog, .modal .modal-content, .modal .modal-header,
.modal .modal-body, .modal .modal-footer, .modal a, .modal button,
.modal input, .modal select, .modal textarea, .modal .select2-container {
  pointer-events: auto !important;
}
.modal-dialog {
  width: 540px !important;
  max-width: calc(100% - 30px) !important;
  margin: 18px auto !important;
}
.modal-dialog.modal-sm, .modal-sm { width: 360px !important; max-width: calc(100% - 30px) !important; }
.modal-dialog.modal-lg, .modal-lg { width: 640px !important; max-width: calc(100% - 30px) !important; }
.modal-content {
  border: 1px solid rgba(255,255,255,.75);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 28px 80px rgba(75,85,99,.28);
  overflow: hidden;
  max-height: calc(100vh - 36px);
  display: flex;
  flex-direction: column;
}
.modal-content > form {
  display: flex !important;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  max-height: calc(100vh - 36px);
  overflow: hidden;
}
body > #subscriptionRenewalModal {
  position: fixed !important;
  z-index: 1060 !important;
  pointer-events: auto !important;
}
body > #subscriptionRenewalModal .modal-dialog,
body > #subscriptionRenewalModal .modal-content,
body > #subscriptionRenewalModal .modal-body,
body > #subscriptionRenewalModal .modal-footer,
body > #subscriptionRenewalModal a,
body > #subscriptionRenewalModal button {
  position: relative;
  z-index: 1061;
  pointer-events: auto !important;
}

.modal-header {
  position: relative;
  min-height: 52px;
  padding: 12px 18px !important;
  flex: 0 0 auto;
  border-bottom: 1px solid var(--gs-border) !important;
  background: linear-gradient(135deg, #f8fafc, #eef0f3) !important;
}
.modal-header:after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 3px;
  background: linear-gradient(90deg, #646b75 0 80%, #e5252a 80% 100%);
}
.modal-title { color: #374151 !important; font-size: 17px; font-weight: 800; line-height: 27px; }
.modal-header .close {
  position: absolute !important;
  top: 9px !important;
  width: 32px !important;
  height: 32px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  border: 1px solid #d5dae1 !important;
  border-radius: 50%;
  background: #fff !important;
  color: #646b75 !important;
  font-size: 0 !important;
  line-height: 1 !important;
  opacity: 1;
  text-shadow: none;
  z-index: 3;
}
.modal-header .close > span,
.modal-header .close > i { display: none !important; }
.modal-header .close:before {
  content: "\00d7";
  display: block;
  color: inherit;
  font-family: Arial, sans-serif;
  font-size: 23px;
  font-weight: 400;
  line-height: 1;
}
.modal-header .close:hover { color: #fff !important; background: #e5252a !important; border-color: #e5252a !important; }
.modal-body {
  padding: 14px 16px !important;
  background: #fff;
  overflow-y: auto;
  flex: 1 1 auto;
  font-size: 12px;
}
.modal-body .introtext { margin-bottom: 10px; }
.modal-body .form-group { margin-bottom: 9px !important; }
.modal-body label { min-height: 0 !important; margin-bottom: 3px !important; color: #374151; font-size: 12px; font-weight: 800; }
.modal-body .form-control,
.modal-body .select2-container,
.modal-body .select2-container .select2-choice {
  min-height: 34px !important;
  height: 34px !important;
  border-radius: 7px !important;
  font-size: 12px !important;
}
.modal-body .form-group .form-control,
.modal-body .form-group .select2-container,
.modal-body .input-group {
  width: 100% !important;
  max-width: 280px !important;
}
.modal-body textarea.form-control { max-width: 100% !important; }
html[dir="rtl"] .modal-body .form-group .form-control,
html[dir="rtl"] .modal-body .form-group .select2-container,
html[dir="rtl"] .modal-body .input-group,
body.rtl .modal-body .form-group .form-control,
body.rtl .modal-body .form-group .select2-container,
body.rtl .modal-body .input-group { margin-right: 0 !important; margin-left: auto !important; }
html[dir="ltr"] .modal-body .form-group .form-control,
html[dir="ltr"] .modal-body .form-group .select2-container,
html[dir="ltr"] .modal-body .input-group,
body.ltr .modal-body .form-group .form-control,
body.ltr .modal-body .form-group .select2-container,
body.ltr .modal-body .input-group { margin-left: 0 !important; margin-right: auto !important; }
.modal-body .form-control { padding: 5px 8px !important; }
.modal-body textarea.form-control { min-height: 68px !important; height: auto !important; }
.modal-body .select2-container.form-control { padding: 0 !important; border: 0 !important; background: transparent !important; }
.modal-body .select2-container .select2-choice { padding: 3px 8px !important; line-height: 26px !important; }
.modal-body .select2-container .select2-choice > .select2-chosen { line-height: 26px !important; }
.modal-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 16px !important;
  flex: 0 0 auto;
  border-top: 1px solid var(--gs-border) !important;
  background: #f8fafc !important;
  position: relative;
  z-index: 5;
}
.modal-footer .btn { margin: 0 !important; min-width: 90px; min-height: 32px; padding: 5px 10px; font-size: 12px; }
html[dir="rtl"] .modal-header .close,
body.rtl .modal-header .close {
  right: auto !important;
  left: 14px !important;
  float: none !important;
}
html[dir="ltr"] .modal-header .close,
body.ltr .modal-header .close {
  right: 14px !important;
  left: auto !important;
  float: none !important;
}
html[dir="rtl"] .modal-title { padding-left: 48px; }
html[dir="ltr"] .modal-title { padding-right: 48px; }
html[dir="rtl"] .modal-title, html[dir="rtl"] .modal-body { text-align: right; }
html[dir="rtl"] .modal-footer { justify-content: flex-start; direction: rtl; }

/* Compact supplier form: two balanced columns + one preserved custom field */
.supplier-form-compact.modal-lg { width: 600px !important; }
.supplier-form-compact .modal-body { font-size: 14px !important; }
.supplier-form-compact .modal-body label,
.supplier-form-compact .modal-body p { font-size: 14px !important; line-height: 1.45; }
.supplier-form-compact .modal-body .row {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 220px));
  justify-content: center;
  gap: 0 12px;
  margin: 0 !important;
}
.supplier-form-compact .modal-body .row > .col-md-6 { display: contents !important; }
.supplier-form-compact .modal-body .row > .col-md-6:first-child > .form-group:nth-child(1) { grid-column: 2; grid-row: 1; }
.supplier-form-compact .modal-body .row > .col-md-6:first-child > .form-group:nth-child(2) { grid-column: 2; grid-row: 2; }
.supplier-form-compact .modal-body .row > .col-md-6:first-child > .form-group:nth-child(3) { grid-column: 2; grid-row: 3; }
.supplier-form-compact .modal-body .row > .col-md-6:first-child > .form-group:nth-child(4) { grid-column: 2; grid-row: 4; }
.supplier-form-compact .modal-body .row > .col-md-6:first-child > .form-group:nth-child(5) { grid-column: 2; grid-row: 5; }
.supplier-form-compact .modal-body .row > .col-md-6:first-child > .form-group:nth-child(6) { grid-column: 1; grid-row: 1; }
.supplier-form-compact .modal-body .row > .col-md-6:first-child > .form-group:nth-child(7) { grid-column: 1; grid-row: 2; }
.supplier-form-compact .modal-body .row > .col-md-6:first-child > .form-group:nth-child(8) { grid-column: 1; grid-row: 3; }
.supplier-form-compact .modal-body .row > .col-md-6:last-child > .form-group:nth-child(1) { grid-column: 1; grid-row: 4; }
.supplier-form-compact .modal-body .row > .col-md-6:last-child > .form-group:nth-child(2) { grid-column: 1; grid-row: 5; }
.supplier-form-compact .modal-body .row > .col-md-6:last-child > .form-group:nth-child(3) {
  grid-column: 1;
  grid-row: 6;
  width: 220px;
  justify-self: stretch;
}
.supplier-form-compact .form-control,
.supplier-form-compact .select2-container { width: 220px !important; max-width: 220px !important; font-size: 14px !important; }
.supplier-form-compact .modal-footer {
  justify-content: center !important;
  direction: inherit;
}
html[dir="rtl"] .supplier-form-compact .form-control,
body.rtl .supplier-form-compact .form-control,
html[dir="rtl"] .supplier-form-compact .select2-chosen,
body.rtl .supplier-form-compact .select2-chosen { text-align: right !important; direction: rtl; }
html[dir="ltr"] .supplier-form-compact .form-control,
body.ltr .supplier-form-compact .form-control,
html[dir="ltr"] .supplier-form-compact .select2-chosen,
body.ltr .supplier-form-compact .select2-chosen { text-align: left !important; direction: ltr; }
@media (max-width: 680px) {
  .supplier-form-compact.modal-lg { width: calc(100% - 16px) !important; }
  .supplier-form-compact .modal-body .row { display: block !important; }
  .supplier-form-compact .modal-body .row > .col-md-6 { display: block !important; }
  .supplier-form-compact .modal-body .form-group { width: 100% !important; }
  .supplier-form-compact .form-control,
  .supplier-form-compact .select2-container { width: 100% !important; max-width: 100% !important; }
}
.nav-tabs { border-bottom-color: var(--gs-border); }
.nav-tabs > li > a { border-radius: 8px 8px 0 0; color: var(--gs-muted); font-weight: 700; }
.nav-tabs > li.active > a { color: var(--gs-primary); border-top: 2px solid var(--gs-primary) !important; }

/* Alerts and labels */
.alert { border: 0; border-radius: 10px; padding: 13px 15px; }
.alert-success { background: #ecfdf3; color: #166534; }
.alert-danger { background: #fef2f2; color: #991b1b; }
.alert-warning { background: #fffbeb; color: #92400e; }
.alert-info { background: #eff6ff; color: #1e40af; }
.label { border-radius: 20px; padding: 5px 9px; font-weight: 700; }

/* Dashboard cards compatibility */
.gs-card, .gs-panel { border-color: var(--gs-border) !important; box-shadow: var(--gs-shadow) !important; }
.gs-card:hover { box-shadow: var(--gs-shadow-lg) !important; }

/* Loading */
#loading { background-color: rgba(255,255,255,.92) !important; backdrop-filter: blur(3px); }

/* Login */
body.login-page { min-width: 320px; background: #eef2f7; }
.login-page .page-back {
  min-height: 100vh;
  position: relative;
  isolation: isolate;
}
.login-page .page-back:before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(135deg, rgba(75,85,99,.88), rgba(107,114,128,.72));
}
.login-page .contents {
  width: min(440px, calc(100% - 30px));
  margin: 30px auto !important;
  padding: 26px !important;
  border: 1px solid rgba(255,255,255,.62) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.96) !important;
  box-shadow: 0 25px 70px rgba(2,6,23,.34) !important;
  backdrop-filter: blur(12px);
}
.login-page .contents > .text-center { color: var(--gs-primary); font-size: 21px; font-weight: 800; margin-bottom: 14px; }
.login-page #login .container,
.login-page #forgot_password .container,
.login-page #register .container { width: 100% !important; padding: 0; }
.login-page .login-form-div { width: 100%; }
.login-page .login-content { margin-top: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; }
.login-page .div-title h3 { color: var(--gs-navy) !important; font-weight: 800; font-size: 20px; text-align: center; margin: 5px 0 22px; }
.login-page .textbox-wrap { margin-bottom: 14px; }
.login-page .form-action { margin-top: 8px; }
.login-page .form-action .btn { min-width: 125px; }
.login-page .login-form-links { border: 0 !important; border-radius: 10px !important; background: #f8fafc !important; padding: 12px 14px !important; }

/* RTL */
html[dir="rtl"] body, body.rtl { direction: rtl; text-align: right; }
html[dir="rtl"] #sidebar_menu a, body.rtl #sidebar_menu a { text-align: right; }
html[dir="rtl"] .dropdown-menu, body.rtl .dropdown-menu { text-align: right; }
html[dir="rtl"] .table > thead > tr > th,
html[dir="rtl"] .table > tbody > tr > td,
body.rtl .table > thead > tr > th,
body.rtl .table > tbody > tr > td { text-align: right; }
html[dir="rtl"] .close, body.rtl .close { float: left; }

/* Responsive */
@media (max-width: 991px) {
  #content { padding: 16px !important; }
  #header .container { padding-inline: 10px; }
  .box .box-content, .panel-body { padding: 14px !important; }
}
@media (max-width: 767px) {
  html, body { width: 100%; max-width: 100%; overflow-x: hidden !important; }
  #header.navbar {
    height: 58px !important;
    min-height: 58px !important;
    overflow: visible !important;
  }
  body:not(.login-page) { padding-top: 58px !important; }
  #header > .container {
    width: 100% !important;
    height: 58px !important;
    min-height: 58px !important;
    padding: 0 12px !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: relative !important;
  }
  #header .navbar-brand {
    width: auto !important;
    height: 58px !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 8px 4px !important;
    float: none !important;
    flex: 0 1 auto;
    position: absolute !important;
    top: 0 !important;
  }
  #header .navbar-brand img {
    max-height: 38px !important;
    max-width: 150px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    transform: none !important;
  }
  #header .header-nav { display: none !important; }
  #header .btn-visible-sm {
    width: 94px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    flex: 0 0 94px;
    display: flex !important;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    position: absolute !important;
    top: 7px !important;
  }
  html[dir="ltr"] #header .navbar-brand,
  body.ltr #header .navbar-brand { left: 12px !important; right: auto !important; }
  html[dir="ltr"] #header .btn-visible-sm,
  body.ltr #header .btn-visible-sm { right: 14px !important; left: auto !important; }
  html[dir="rtl"] #header .navbar-brand,
  body.rtl #header .navbar-brand { right: 12px !important; left: auto !important; }
  html[dir="rtl"] #header .btn-visible-sm,
  body.rtl #header .btn-visible-sm { left: 14px !important; right: auto !important; }
  html[dir="ltr"] #header .navbar-brand img,
  body.ltr #header .navbar-brand img,
  html[dir="rtl"] #header .navbar-brand img,
  body.rtl #header .navbar-brand img { transform: none !important; }
  #header .btn-visible-sm > a { display: none !important; }
  #header .btn-visible-sm > a[href*="logout"] {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #e5252a !important;
    border-radius: 10px !important;
    background: #e5252a !important;
    color: #fff !important;
    box-shadow: 0 5px 14px rgba(229,37,42,.22);
  }
  #header .btn-visible-sm > a[href*="logout"]:hover,
  #header .btn-visible-sm > a[href*="logout"]:focus { background: #bd161b !important; color: #fff !important; }
  #header .btn-visible-sm .navbar-toggle {
    position: static !important;
    display: flex !important;
    width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--gs-border) !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: var(--gs-shadow);
  }
  #header .btn-visible-sm > a > .fa,
  #header .navbar-toggle > .fa { font-size: 20px !important; }
  #content { min-height: calc(100vh - 58px); margin-top: 0 !important; padding: 12px !important; }
  #content .page-header, #content .page-head, #content .content-header,
  #content .breadcrumb { color: var(--gs-text) !important; }
  #content .container, #content .container-fluid,
  #content .box, #content .panel, #content fieldset { width: 100% !important; max-width: 100% !important; }
  #content .row { margin-right: -6px !important; margin-left: -6px !important; }
  #content .row > [class*="col-"] { width: 100%; float: none !important; padding-right: 6px; padding-left: 6px; }
  #content .form-control, #content .select2-container { max-width: 100% !important; }
  #content img, #content canvas, #content svg { max-width: 100%; }
  .table-responsive { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .box-header, .panel-heading { min-height: 46px; }
  .box-header h2, .panel-heading { font-size: 15px !important; }
  .quick-button, a.quick-button, .quick-button-small { max-width: 100%; }
  .gs-stat-card, .dashboard-stat, .small-box { min-height: 0 !important; }
  .btn { min-height: 38px; }
  .table-responsive { border-radius: 10px !important; }
  .login-page .contents { padding: 20px 15px !important; }
  .modal-dialog, .modal-dialog.modal-sm, .modal-dialog.modal-lg {
    width: calc(100% - 16px) !important;
    max-width: none !important;
    margin: 8px auto !important;
  }
  .modal-header { padding: 14px 16px !important; }
  .modal-body { padding: 16px !important; }
  .modal-footer { padding: 12px 16px !important; }
  .modal-footer .btn { flex: 1 1 calc(50% - 8px); }
}

/* ==========================================================================
   GARWAN SOFT v22.58 - SIDEBAR COLLAPSE CONTROL
   Keep menu icons visible when collapsed and pin the control above the list.
   ========================================================================== */

@media (min-width: 992px) {
    table.lt {
        table-layout: fixed !important;
    }

    td.sidebar-con,
    .sidebar-con {
        width: 250px !important;
        min-width: 250px !important;
        max-width: 250px !important;
    }

    body.sidebar-minified td.sidebar-con,
    body.sidebar-minified .sidebar-con {
        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;
    }

    td.content-con,
    .content-con {
        width: auto !important;
    }

    #sidebar-left:not(.minified) {
        width: 250px !important;
    }

    #sidebar-left > #main-menu-act {
        position: sticky !important;
        top: 0 !important;
        z-index: 25 !important;
        width: calc(100% - 20px) !important;
        height: 36px !important;
        min-height: 36px !important;
        margin: 0 10px 8px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 0 !important;
        border-radius: 8px !important;
        background: rgba(100,107,117,.72) !important;
        box-shadow: 0 4px 10px rgba(31, 41, 55, .12) !important;
        text-decoration: none !important;
    }

    #sidebar-left > #main-menu-act > i {
        position: static !important;
        inset: auto !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        color: #fff !important;
        font-size: 15px !important;
        line-height: 1 !important;
    }

    #sidebar-left > #main-menu-act:hover,
    #sidebar-left > #main-menu-act:focus {
        background: rgba(229,37,42,.90) !important;
    }

    #sidebar-left {
        -ms-overflow-style: none !important;
        scrollbar-width: none !important;
    }

    #sidebar-left::-webkit-scrollbar {
        width: 0 !important;
        height: 0 !important;
        display: none !important;
    }

    #sidebar-left .ps-scrollbar-y-rail,
    #sidebar-left .ps-scrollbar-x-rail {
        display: none !important;
    }

    #sidebar-left.minified {
        padding-inline: 4px !important;
    }

    #sidebar-left.minified > #main-menu-act {
        width: 32px !important;
        margin: 0 0 8px !important;
    }

    #sidebar-left.minified #sidebar_menu,
    #sidebar-left.minified #sidebar_menu > ul {
        width: 32px !important;
        margin-inline: 0 !important;
        padding-inline: 0 !important;
    }

    #sidebar-left.minified #sidebar_menu > ul > li {
        width: 32px !important;
        margin: 3px 0 !important;
    }

    #sidebar-left.minified #sidebar_menu li > a {
        width: 32px !important;
        min-width: 32px !important;
        min-height: 38px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: hidden !important;
        border-radius: 8px !important;
    }

    #sidebar-left.minified #sidebar_menu li > a > i:not(.chevron) {
        position: static !important;
        inset: auto !important;
        display: block !important;
        width: 20px !important;
        margin: 0 !important;
        transform: none !important;
        text-align: center !important;
        font-size: 15px !important;
        line-height: 20px !important;
    }

    #sidebar-left.minified #sidebar_menu li > a > .text,
    #sidebar-left.minified #sidebar_menu li:hover > a > .text,
    #sidebar-left.minified #sidebar_menu li > a > .chevron,
    #sidebar-left.minified #sidebar_menu li:hover > a > .chevron,
    #sidebar-left.minified #sidebar_menu li > ul,
    #sidebar-left.minified #sidebar_menu li:hover > ul {
        display: none !important;
    }
}

@media print {
  #header, #sidebar-left, .no-print { display: none !important; }
  #content { padding: 0 !important; background: #fff !important; }
  .box, .panel, .well { box-shadow: none !important; border-color: #ddd !important; }
}


/* ==========================================================================
   GARWAN SOFT v22.52 - FIXED SIDEBAR
   Built on latest themes.zip. Does not touch loader files.
   ========================================================================== */

@media (min-width: 992px) {
    #sidebar-left {
        position: fixed !important;
        top: 62px !important;
        bottom: 0 !important;
        height: calc(100vh - 62px) !important;
        max-height: calc(100vh - 62px) !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        z-index: 1015 !important;
        margin: 0 !important;
        padding-bottom: 18px !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    /* Keep the layout cell width so content does not slide under the fixed sidebar. */
    td.sidebar-con,
    .sidebar-con {
        position: relative !important;
        vertical-align: top !important;
    }

    /* Legacy core.js may remove .sidebar-fixed depending on cookies.
       The new UI must remain fixed regardless of that old preference. */
    #sidebar-left.sidebar-fixed,
    #sidebar-left:not(.sidebar-fixed) {
        position: fixed !important;
        top: 62px !important;
        bottom: 0 !important;
        height: calc(100vh - 62px) !important;
    }

    #sidebar-left .sidebar-nav {
        min-height: 100% !important;
        padding-bottom: 22px !important;
    }
}

/* Mobile/tablet keeps the normal collapsible sidebar behavior. */
@media (max-width: 991px) {
    #sidebar-left,
    #sidebar-left.sidebar-fixed {
        position: static !important;
        top: auto !important;
        bottom: auto !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

/* ==========================================================================
   Garwan Soft - Professional Page Transition Loader v1
   Replaces the old yellow/legacy loader with animated GS logo.
   ========================================================================== */

#loading.gs-page-loader {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483000 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    background:
        radial-gradient(circle at 50% 45%, rgba(229, 37, 42, .055) 0, rgba(229, 37, 42, 0) 33%),
        rgba(247, 248, 249, .91) !important;
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
    opacity: 1;
    visibility: visible;
    pointer-events: all !important;
    transition: opacity .28s ease, visibility .28s ease !important;
}

#loading.gs-page-loader.gs-page-loader--hidden {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

#loading.gs-page-loader .gs-page-loader__stage {
    position: relative;
    width: 190px;
    height: 190px;
    display: flex;
    align-items: center;
    justify-content: center;
    transform: translateZ(0);
}

#loading.gs-page-loader .gs-page-loader__logo-wrap {
    position: relative;
    z-index: 4;
    width: 92px;
    height: 92px;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: gsLoaderFloat 2.1s cubic-bezier(.45,.05,.55,.95) infinite;
}

#loading.gs-page-loader .gs-page-loader__logo {
    position: relative;
    z-index: 2;
    display: block;
    width: 82px;
    height: auto;
    max-height: 82px;
    object-fit: contain;
    filter: drop-shadow(0 12px 18px rgba(28, 30, 33, .12));
    animation: gsLoaderLogoPulse 1.9s ease-in-out infinite;
    user-select: none;
    -webkit-user-drag: none;
}

#loading.gs-page-loader .gs-page-loader__glow {
    position: absolute;
    inset: 13px;
    z-index: 1;
    border-radius: 50%;
    background: rgba(229, 37, 42, .16);
    filter: blur(16px);
    animation: gsLoaderGlow 1.8s ease-in-out infinite;
}

#loading.gs-page-loader .gs-page-loader__orbit {
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    border-style: solid;
    pointer-events: none;
}

#loading.gs-page-loader .gs-page-loader__orbit--outer {
    width: 132px;
    height: 132px;
    margin: -66px 0 0 -66px;
    border-width: 2px;
    border-color: rgba(38, 42, 46, .09);
    border-top-color: #e5252a;
    border-right-color: rgba(229, 37, 42, .42);
    animation: gsLoaderSpin 1.35s linear infinite;
}

#loading.gs-page-loader .gs-page-loader__orbit--inner {
    width: 112px;
    height: 112px;
    margin: -56px 0 0 -56px;
    border-width: 1px;
    border-color: rgba(38, 42, 46, .08);
    border-bottom-color: rgba(71, 76, 82, .58);
    animation: gsLoaderSpinReverse 1.9s linear infinite;
}

#loading.gs-page-loader .gs-page-loader__line {
    position: absolute;
    left: 50%;
    bottom: 16px;
    width: 106px;
    height: 3px;
    margin-left: -53px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(38, 42, 46, .08);
}

#loading.gs-page-loader .gs-page-loader__line > span {
    display: block;
    width: 46%;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #8b8f94 0%, #e5252a 72%, #bd161b 100%);
    animation: gsLoaderSweep 1.25s ease-in-out infinite;
}

#loading.gs-page-loader .gs-page-loader__caption {
    position: absolute;
    bottom: -9px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    color: #4b5055;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2.7px;
    opacity: .72;
}

@keyframes gsLoaderSpin {
    to { transform: rotate(360deg); }
}

@keyframes gsLoaderSpinReverse {
    to { transform: rotate(-360deg); }
}

@keyframes gsLoaderFloat {
    0%, 100% { transform: translateY(0) scale(1); }
    50% { transform: translateY(-5px) scale(1.018); }
}

@keyframes gsLoaderLogoPulse {
    0%, 100% { opacity: .92; transform: scale(.98); }
    50% { opacity: 1; transform: scale(1.035); }
}

@keyframes gsLoaderGlow {
    0%, 100% { opacity: .34; transform: scale(.84); }
    50% { opacity: .8; transform: scale(1.13); }
}

@keyframes gsLoaderSweep {
    0% { transform: translateX(-120%); }
    55% { transform: translateX(118%); }
    100% { transform: translateX(118%); }
}

@media (max-width: 767px) {
    #loading.gs-page-loader .gs-page-loader__stage {
        width: 158px;
        height: 158px;
    }

    #loading.gs-page-loader .gs-page-loader__logo-wrap {
        width: 78px;
        height: 78px;
    }

    #loading.gs-page-loader .gs-page-loader__logo {
        width: 68px;
        max-height: 68px;
    }

    #loading.gs-page-loader .gs-page-loader__orbit--outer {
        width: 112px;
        height: 112px;
        margin: -56px 0 0 -56px;
    }

    #loading.gs-page-loader .gs-page-loader__orbit--inner {
        width: 94px;
        height: 94px;
        margin: -47px 0 0 -47px;
    }
}

@media (prefers-reduced-motion: reduce) {
    #loading.gs-page-loader *,
    #loading.gs-page-loader *::before,
    #loading.gs-page-loader *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* Modal/AJAX operations must not be blocked by the page-transition loader. */
body.modal-open #loading.gs-page-loader {
    display: none !important;
}


/* ==========================================================================
   GARWAN SOFT v22.54 - FIXED FOOTER
   Built on v22.53. Keeps Loader + Fixed Sidebar untouched.
   ========================================================================== */

/* Reserve space so page content is never hidden behind the fixed footer. */
body:not(.login-page) {
    padding-bottom: 58px !important;
}

#footer,
.gs-footer {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    min-height: 52px !important;
    z-index: 1028 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* Keep footer content vertically centered and compact. */
#footer .container,
.gs-footer .container,
#footer .container-fluid,
.gs-footer .container-fluid {
    min-height: 52px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Prevent the fixed sidebar from sitting behind the footer on desktop. */
@media (min-width: 992px) {
    #sidebar-left,
    #sidebar-left.sidebar-fixed,
    #sidebar-left:not(.sidebar-fixed) {
        bottom: 52px !important;
        height: calc(100vh - 114px) !important; /* 62px header + 52px footer */
        max-height: calc(100vh - 114px) !important;
    }
}

/* Mobile header is 58px; keep footer fixed but reserve enough content space. */
@media (max-width: 991px) {
    body:not(.login-page) {
        padding-bottom: 58px !important;
    }

    #footer,
    .gs-footer {
        min-height: 50px !important;
    }

    #footer .container,
    .gs-footer .container,
    #footer .container-fluid,
    .gs-footer .container-fluid {
        min-height: 50px !important;
    }
}

@media print {
    #footer,
    .gs-footer {
        position: static !important;
    }

    body {
        padding-bottom: 0 !important;
    }
}


/* ==========================================================================
   GARWAN SOFT v22.55 - TRANSPARENT GLASS FOOTER
   Built directly on v22.54. Loader/sidebar/footer positioning unchanged.
   ========================================================================== */

#footer,
.gs-footer,
footer.footer {
    background: rgba(75, 85, 99, .62) !important;
    -webkit-backdrop-filter: blur(12px) saturate(135%) !important;
    backdrop-filter: blur(12px) saturate(135%) !important;
    border-top: 1px solid rgba(255, 255, 255, .18) !important;
    box-shadow: 0 -6px 22px rgba(15, 23, 42, .08) !important;
}

#footer,
#footer p,
#footer span,
#footer a,
.gs-footer,
.gs-footer p,
.gs-footer span,
.gs-footer a {
    color: #fff !important;
}

#footer a:hover,
.gs-footer a:hover {
    color: #ffd9db !important;
}

/* Slightly more opaque on very small screens for readability. */
@media (max-width: 767px) {
    #footer,
    .gs-footer,
    footer.footer {
        background: rgba(75, 85, 99, .72) !important;
        -webkit-backdrop-filter: blur(10px) saturate(125%) !important;
        backdrop-filter: blur(10px) saturate(125%) !important;
    }
}


/* ==========================================================================
   GARWAN SOFT v22.56 - COMPACT FRAMED FOOTER
   Built directly on v22.55.
   Only the text area is framed; empty left/right footer space stays transparent.
   ========================================================================== */

/* Full footer strip remains fixed but visually transparent. */
#footer,
.gs-footer,
footer.footer {
    background: transparent !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border-top: 0 !important;
    box-shadow: none !important;
    pointer-events: none;
}

/* Keep the wrapper centered without painting the whole screen width. */
#footer .container,
.gs-footer .container,
#footer .container-fluid,
.gs-footer .container-fluid {
    background: transparent !important;
    min-height: 52px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
}

/* Professional compact capsule around the footer text only. */
#footer .gs-footer-brand,
.gs-footer .gs-footer-brand,
#footer p,
.gs-footer p {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: calc(100vw - 32px) !important;
    min-height: 36px !important;
    margin: 0 auto !important;
    padding: 7px 22px !important;
    box-sizing: border-box !important;

    color: #fff !important;
    background: rgba(75, 85, 99, .70) !important;
    -webkit-backdrop-filter: blur(12px) saturate(135%) !important;
    backdrop-filter: blur(12px) saturate(135%) !important;

    border: 1px solid rgba(255, 255, 255, .30) !important;
    border-radius: 12px !important;
    box-shadow:
        0 7px 22px rgba(15, 23, 42, .13),
        inset 0 1px 0 rgba(255, 255, 255, .14) !important;

    line-height: 1.5 !important;
    white-space: nowrap;
    pointer-events: auto;
}

/* Small red premium accent at both sides of the framed text. */
#footer .gs-footer-brand::before,
#footer .gs-footer-brand::after,
.gs-footer .gs-footer-brand::before,
.gs-footer .gs-footer-brand::after {
    content: "";
    display: block;
    flex: 0 0 auto;
    width: 4px;
    height: 18px;
    border-radius: 99px;
    background: #e5252a;
}

#footer .gs-footer-brand::before,
.gs-footer .gs-footer-brand::before {
    margin-inline-end: 11px;
}

#footer .gs-footer-brand::after,
.gs-footer .gs-footer-brand::after {
    margin-inline-start: 11px;
}

#footer .gs-footer-brand a,
.gs-footer .gs-footer-brand a,
#footer p a,
.gs-footer p a {
    color: #fff !important;
    text-decoration: none !important;
    font-weight: 700;
}

#footer .gs-footer-brand a:hover,
.gs-footer .gs-footer-brand a:hover,
#footer p a:hover,
.gs-footer p a:hover {
    color: #ffd7d9 !important;
}

/* Mobile: compact and wrap safely if the available width becomes narrow. */
@media (max-width: 767px) {
    #footer .gs-footer-brand,
    .gs-footer .gs-footer-brand,
    #footer p,
    .gs-footer p {
        min-height: 34px !important;
        max-width: calc(100vw - 20px) !important;
        padding: 6px 12px !important;
        border-radius: 10px !important;
        white-space: normal;
        text-align: center !important;
        font-size: 11px !important;
    }

    #footer .gs-footer-brand::before,
    #footer .gs-footer-brand::after,
    .gs-footer .gs-footer-brand::before,
    .gs-footer .gs-footer-brand::after {
        height: 15px;
    }
}

@media print {
    #footer,
    .gs-footer,
    footer.footer {
        pointer-events: auto;
    }

    #footer .gs-footer-brand,
    .gs-footer .gs-footer-brand,
    #footer p,
    .gs-footer p {
        background: transparent !important;
        color: #333 !important;
        border-color: #ddd !important;
        box-shadow: none !important;
    }
}


/* ==========================================================================
   GARWAN SOFT v22.57 - CENTER FOOTER AT BOTTOM
   Built directly on v22.56.
   Keeps loader, fixed sidebar, compact framed footer and modern footer data.
   ========================================================================== */

/* Force the footer host to span the viewport and center its content. */
#footer,
.gs-footer,
footer.footer {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    text-align: center !important;
}

/* Do not let legacy floats/widths shift the footer container. */
#footer .container,
.gs-footer .container,
#footer .container-fluid,
.gs-footer .container-fluid {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 12px 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    float: none !important;
}

/* Center the compact framed footer precisely at the bottom of the viewport. */
#footer .gs-footer-brand,
.gs-footer .gs-footer-brand {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    float: none !important;
    margin: 0 auto !important;
    transform: none !important;
    text-align: center !important;
    justify-content: center !important;
}

/* RTL/LTR must not move the centered footer. */
html[dir="rtl"] #footer .gs-footer-brand,
html[dir="ltr"] #footer .gs-footer-brand,
body.rtl #footer .gs-footer-brand,
body.ltr #footer .gs-footer-brand,
html[dir="rtl"] .gs-footer .gs-footer-brand,
html[dir="ltr"] .gs-footer .gs-footer-brand,
body.rtl .gs-footer .gs-footer-brand,
body.ltr .gs-footer .gs-footer-brand {
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
}

/* Mobile: keep it centered and slightly above the screen edge. */
@media (max-width: 767px) {
    #footer .container,
    .gs-footer .container,
    #footer .container-fluid,
    .gs-footer .container-fluid {
        padding-bottom: 6px !important;
    }
}

/* Subscription renewal actions: isolated from the generic modal footer rules. */
@media (min-width: 768px) {
    #subscriptionRenewalModal .modal-dialog {
        width: 760px !important;
    }

    #subscriptionRenewalModal .subscription-renewal-actions {
        display: flex !important;
        flex-flow: row nowrap !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 10px !important;
        width: 100% !important;
        text-align: center !important;
    }

    #subscriptionRenewalModal .subscription-renewal-actions > .btn {
        width: auto !important;
        min-width: 120px !important;
        margin: 0 !important;
        padding-right: 16px !important;
        padding-left: 16px !important;
        flex: 0 0 auto !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        white-space: nowrap !important;
    }

    #subscriptionRenewalModal .subscription-renewal-actions > .btn:nth-child(2) {
        min-width: 190px !important;
    }

    #subscriptionRenewalModal .subscription-renewal-actions > .btn:nth-child(3) {
        min-width: 145px !important;
    }

    #subscriptionRenewalModal .subscription-renewal-actions > .btn:nth-child(4) {
        min-width: 175px !important;
    }
}

@media (max-width: 767px) {
    #subscriptionRenewalModal .subscription-renewal-actions {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
    }

    #subscriptionRenewalModal .subscription-renewal-actions > .btn {
        width: 100% !important;
        min-height: 42px !important;
        margin: 0 !important;
        flex: 0 0 auto !important;
    }
}


/* =========================================================
   GS Modern UI — Dark mode
   Light mode is the existing/default design and is untouched.
   Activated only by html/body.gs-dark-theme.
   ========================================================= */
html.gs-dark-theme,
html.gs-dark-theme body,
body.gs-dark-theme {
  --gs-primary-soft: rgba(229,37,42,.14);
  --gs-bg: #11151c;
  --gs-surface: #1a2029;
  --gs-border: #313946;
  --gs-text: #f3f4f6;
  --gs-muted: #aeb7c4;
  --gs-shadow: 0 5px 18px rgba(0,0,0,.28);
  --gs-shadow-lg: 0 14px 35px rgba(0,0,0,.38);
  background: #11151c !important;
  color: var(--gs-text) !important;
  color-scheme: dark;
}

html.gs-dark-theme body,
html.gs-dark-theme #app_wrapper,
html.gs-dark-theme table.lt,
html.gs-dark-theme table.lt > tbody,
html.gs-dark-theme table.lt > tbody > tr,
html.gs-dark-theme td.sidebar-con,
html.gs-dark-theme .sidebar-con {
  background: #171c24 !important;
}

html.gs-dark-theme td.content-con,
html.gs-dark-theme .content-con,
html.gs-dark-theme #content {
  background: #11151c !important;
  color: var(--gs-text) !important;
}

html.gs-dark-theme #header.navbar {
  background: rgba(24,29,38,.98) !important;
  box-shadow: 0 1px 0 var(--gs-border), 0 4px 16px rgba(0,0,0,.24);
}
html.gs-dark-theme #header .header-nav .nav > li > a,
html.gs-dark-theme #header .navbar-toggle {
  color: #d5dbe5 !important;
}
html.gs-dark-theme #header .header-nav .nav > li > a:hover,
html.gs-dark-theme #header .header-nav .nav > li.open > a {
  color: #fff !important;
  background: #252d38 !important;
}
html.gs-dark-theme #header .user span,
html.gs-dark-theme .breadcrumb,
html.gs-dark-theme .breadcrumb a {
  color: #dce2ea !important;
}

html.gs-dark-theme #sidebar-left,
html.gs-dark-theme td.sidebar-con,
html.gs-dark-theme .sidebar-con {
  background: #171c24 !important;
  box-shadow: 4px 0 20px rgba(0,0,0,.25);
}
html.gs-dark-theme #sidebar-left #sidebar_menu .nav > li > a,
html.gs-dark-theme #sidebar-left #sidebar_menu > ul > li > a,
html.gs-dark-theme #sidebar-left #sidebar_menu li > a {
  background: #343c48 !important;
  color: #f3f4f6 !important;
}
html.gs-dark-theme #sidebar-left #sidebar_menu li > a:hover,
html.gs-dark-theme #sidebar-left #sidebar_menu li.active > a,
html.gs-dark-theme #sidebar-left #sidebar_menu li.open > a {
  background: #454f5e !important;
}

html.gs-dark-theme .box,
html.gs-dark-theme .box-content,
html.gs-dark-theme .box-header,
html.gs-dark-theme .panel,
html.gs-dark-theme .panel-default,
html.gs-dark-theme .well,
html.gs-dark-theme .modal-content,
html.gs-dark-theme .dropdown-menu,
html.gs-dark-theme .popover,
html.gs-dark-theme .gs-panel,
html.gs-dark-theme .gs-card {
  background: #1a2029 !important;
  color: #f3f4f6 !important;
  border-color: #313946 !important;
}

html.gs-dark-theme .box-header,
html.gs-dark-theme .panel-heading,
html.gs-dark-theme .modal-header,
html.gs-dark-theme .modal-footer,
html.gs-dark-theme .gs-panel .gs-panel-hd {
  background: #202731 !important;
  color: #f3f4f6 !important;
  border-color: #313946 !important;
}

html.gs-dark-theme .table,
html.gs-dark-theme table {
  color: #e8edf4;
}
html.gs-dark-theme .table > thead > tr > th,
html.gs-dark-theme .table > tbody > tr > th,
html.gs-dark-theme .table > tfoot > tr > th,
html.gs-dark-theme .table > thead > tr > td,
html.gs-dark-theme .table > tbody > tr > td,
html.gs-dark-theme .table > tfoot > tr > td {
  border-color: #313946 !important;
}
html.gs-dark-theme .table-striped > tbody > tr:nth-of-type(odd),
html.gs-dark-theme .table-striped > tbody > tr:nth-child(odd) > td {
  background: #1d242e !important;
}
html.gs-dark-theme .table-hover > tbody > tr:hover > td,
html.gs-dark-theme .table-hover > tbody > tr:hover > th {
  background: #27303c !important;
}
html.gs-dark-theme .gs-table thead th,
html.gs-dark-theme .table > thead > tr > th {
  background: #242c37 !important;
  color: #e8edf4 !important;
}

html.gs-dark-theme .form-control,
html.gs-dark-theme input[type="text"],
html.gs-dark-theme input[type="email"],
html.gs-dark-theme input[type="password"],
html.gs-dark-theme input[type="number"],
html.gs-dark-theme input[type="search"],
html.gs-dark-theme input[type="tel"],
html.gs-dark-theme input[type="url"],
html.gs-dark-theme textarea,
html.gs-dark-theme select,
html.gs-dark-theme .select2-container .select2-choice,
html.gs-dark-theme .select2-container-multi .select2-choices {
  background: #121821 !important;
  color: #f3f4f6 !important;
  border-color: #394352 !important;
}
html.gs-dark-theme .form-control::placeholder,
html.gs-dark-theme input::placeholder,
html.gs-dark-theme textarea::placeholder {
  color: #8f9aa8 !important;
}
html.gs-dark-theme .select2-drop,
html.gs-dark-theme .select2-results,
html.gs-dark-theme .select2-search input {
  background: #171d26 !important;
  color: #f3f4f6 !important;
  border-color: #394352 !important;
}

html.gs-dark-theme .dropdown-menu > li > a,
html.gs-dark-theme .popover-content,
html.gs-dark-theme label,
html.gs-dark-theme .control-label,
html.gs-dark-theme h1,
html.gs-dark-theme h2,
html.gs-dark-theme h3,
html.gs-dark-theme h4,
html.gs-dark-theme h5,
html.gs-dark-theme h6,
html.gs-dark-theme p {
  color: #e7ecf3;
}
html.gs-dark-theme .dropdown-menu > li > a:hover,
html.gs-dark-theme .dropdown-menu > li > a:focus {
  background: #29323e !important;
  color: #fff !important;
}

html.gs-dark-theme .nav-tabs {
  border-color: #313946 !important;
}
html.gs-dark-theme .nav-tabs > li > a {
  color: #b9c2ce !important;
}
html.gs-dark-theme .nav-tabs > li.active > a,
html.gs-dark-theme .nav-tabs > li.active > a:hover,
html.gs-dark-theme .nav-tabs > li.active > a:focus {
  background: #1a2029 !important;
  color: #fff !important;
  border-color: #313946 #313946 transparent !important;
}

html.gs-dark-theme .pagination > li > a,
html.gs-dark-theme .pagination > li > span {
  background: #1a2029 !important;
  border-color: #313946 !important;
  color: #dce3ec !important;
}
html.gs-dark-theme .pagination > .active > a,
html.gs-dark-theme .pagination > .active > span {
  background: var(--gs-primary) !important;
  border-color: var(--gs-primary) !important;
  color: #fff !important;
}

html.gs-dark-theme hr,
html.gs-dark-theme .modal-header,
html.gs-dark-theme .modal-footer {
  border-color: #313946 !important;
}

/* Theme chooser itself */
.gs-theme-menu .gs-theme-choice {
  display: flex !important;
  align-items: center;
  gap: 9px;
  padding: 10px 14px !important;
  font-weight: 700;
}
.gs-theme-menu .gs-theme-choice i {
  width: 18px;
  text-align: center;
}
html.gs-light-theme #cssLight,
html.gs-dark-theme #cssDark {
  color: var(--gs-primary) !important;
  font-weight: 800;
}
html.gs-dark-theme .gs-theme-menu {
  background: #1a2029 !important;
}


/* =========================================================
   GS Dark Mode — visual compatibility fix
   Scope: dark mode only. Light mode remains unchanged.
   Fixes legacy white surfaces, reports, DataTables, filters,
   tabs, Select2, cards, toolbars and secondary text.
   ========================================================= */

/* Generic white/light legacy surfaces */
html.gs-dark-theme .box-content,
html.gs-dark-theme .panel-body,
html.gs-dark-theme .tab-content,
html.gs-dark-theme .well,
html.gs-dark-theme .jumbotron,
html.gs-dark-theme fieldset,
html.gs-dark-theme .dataTables_wrapper,
html.gs-dark-theme .table-responsive,
html.gs-dark-theme .reports-table,
html.gs-dark-theme .report-content,
html.gs-dark-theme .report-box,
html.gs-dark-theme .report-card,
html.gs-dark-theme .white,
html.gs-dark-theme .bwhite {
  background: #1a2029 !important;
  color: #e7ecf3 !important;
  border-color: #313946 !important;
}

/* Legacy content containers that explicitly force white */
html.gs-dark-theme #content .box-content,
html.gs-dark-theme #content .panel-body,
html.gs-dark-theme #content .tab-content,
html.gs-dark-theme #content fieldset,
html.gs-dark-theme #content .well {
  background-color: #1a2029 !important;
}

/* Box / report headers */
html.gs-dark-theme .box-header,
html.gs-dark-theme .panel-heading,
html.gs-dark-theme .box-header h2,
html.gs-dark-theme .box-header h2.blue,
html.gs-dark-theme .box-header h2.blue a,
html.gs-dark-theme .panel-heading .blue,
html.gs-dark-theme #content h1.blue,
html.gs-dark-theme #content h2.blue,
html.gs-dark-theme #content h3.blue,
html.gs-dark-theme #content .blue:not(.btn) {
  background: #202731 !important;
  color: #e8edf4 !important;
  border-color: #313946 !important;
}
html.gs-dark-theme .box-header h2 > i,
html.gs-dark-theme .panel-heading i,
html.gs-dark-theme #content h2 > i,
html.gs-dark-theme #content h3 > i {
  color: #ff3439 !important;
}

/* Report toolbar / action area */
html.gs-dark-theme .btn-default,
html.gs-dark-theme .btn-default:focus,
html.gs-dark-theme .btn-default:hover,
html.gs-dark-theme .btn-default:active,
html.gs-dark-theme .btn-group > .btn,
html.gs-dark-theme .input-group-addon,
html.gs-dark-theme .input-group-btn .btn,
html.gs-dark-theme .date-range,
html.gs-dark-theme .daterangepicker-input {
  background: #202731 !important;
  color: #e8edf4 !important;
  border-color: #3a4452 !important;
}
html.gs-dark-theme .btn-default:hover,
html.gs-dark-theme .btn-group > .btn:hover {
  background: #2a3441 !important;
  color: #fff !important;
}

/* Datepicker / daterangepicker */
html.gs-dark-theme .daterangepicker,
html.gs-dark-theme .datepicker,
html.gs-dark-theme .datetimepicker,
html.gs-dark-theme .daterangepicker .calendar,
html.gs-dark-theme .daterangepicker .ranges,
html.gs-dark-theme .datepicker table,
html.gs-dark-theme .datetimepicker table {
  background: #1a2029 !important;
  color: #e7ecf3 !important;
  border-color: #394352 !important;
}
html.gs-dark-theme .daterangepicker td.available:hover,
html.gs-dark-theme .daterangepicker th.available:hover,
html.gs-dark-theme .datepicker table tr td.day:hover,
html.gs-dark-theme .datetimepicker table tr td:hover {
  background: #2a3441 !important;
  color: #fff !important;
}

/* Cards and report statistic blocks */
html.gs-dark-theme .gs-card,
html.gs-dark-theme .gs-panel,
html.gs-dark-theme .stat-box,
html.gs-dark-theme .small-box,
html.gs-dark-theme .info-box,
html.gs-dark-theme .report-summary,
html.gs-dark-theme .report-summary-card,
html.gs-dark-theme .summary-card,
html.gs-dark-theme .card,
html.gs-dark-theme [class*="report-card"] {
  background: #1a2029 !important;
  color: #f3f4f6 !important;
  border-color: #313946 !important;
}
html.gs-dark-theme .gs-card *,
html.gs-dark-theme .gs-panel *,
html.gs-dark-theme .stat-box *,
html.gs-dark-theme .info-box *,
html.gs-dark-theme .report-summary *,
html.gs-dark-theme .summary-card * {
  color: inherit;
}
html.gs-dark-theme .text-muted,
html.gs-dark-theme .help-block,
html.gs-dark-theme small,
html.gs-dark-theme .small,
html.gs-dark-theme .muted,
html.gs-dark-theme .report-subtitle,
html.gs-dark-theme .summary-note {
  color: #aeb7c4 !important;
}

/* DataTables overall */
html.gs-dark-theme .dataTables_wrapper,
html.gs-dark-theme .dataTables_wrapper .row,
html.gs-dark-theme .dataTables_wrapper .dataTables_scroll,
html.gs-dark-theme .dataTables_wrapper .dataTables_scrollBody,
html.gs-dark-theme .dataTables_wrapper .dataTables_scrollHead {
  background: transparent !important;
  color: #e7ecf3 !important;
}
html.gs-dark-theme .dataTables_wrapper label,
html.gs-dark-theme .dataTables_wrapper .dataTables_info,
html.gs-dark-theme .dataTables_wrapper .dataTables_length,
html.gs-dark-theme .dataTables_wrapper .dataTables_filter {
  color: #cbd3de !important;
}

/* DataTables search + page length controls */
html.gs-dark-theme .dataTables_wrapper input[type="search"],
html.gs-dark-theme .dataTables_wrapper select,
html.gs-dark-theme .dataTables_wrapper .form-control,
html.gs-dark-theme .dataTables_length select,
html.gs-dark-theme .dataTables_filter input {
  background: #121821 !important;
  color: #f3f4f6 !important;
  border-color: #3a4452 !important;
}

/* Table headers / rows / cells */
html.gs-dark-theme table.dataTable,
html.gs-dark-theme .table-bordered,
html.gs-dark-theme .table-striped,
html.gs-dark-theme .table-hover {
  background: #1a2029 !important;
  color: #e7ecf3 !important;
  border-color: #394352 !important;
}
html.gs-dark-theme table.dataTable thead th,
html.gs-dark-theme table.dataTable thead td,
html.gs-dark-theme .table > thead > tr > th {
  background: #232b36 !important;
  color: #f2f5f8 !important;
  border-color: #394352 !important;
}
html.gs-dark-theme table.dataTable tbody td,
html.gs-dark-theme table.dataTable tbody th,
html.gs-dark-theme .table > tbody > tr > td,
html.gs-dark-theme .table > tbody > tr > th {
  background: #1d242e !important;
  color: #e5eaf0 !important;
  border-color: #394352 !important;
}

/* Zebra rows must never revert to white */
html.gs-dark-theme table.dataTable.stripe tbody tr.odd,
html.gs-dark-theme table.dataTable.display tbody tr.odd,
html.gs-dark-theme .table-striped > tbody > tr:nth-of-type(odd),
html.gs-dark-theme .table-striped > tbody > tr:nth-child(odd) > td,
html.gs-dark-theme table.dataTable tbody tr.odd > td {
  background: #202833 !important;
  color: #e7ecf3 !important;
}
html.gs-dark-theme table.dataTable tbody tr.even > td {
  background: #1a2029 !important;
  color: #e7ecf3 !important;
}

/* Hover / selected / warning-like rows: keep contrast readable */
html.gs-dark-theme table.dataTable tbody tr:hover > td,
html.gs-dark-theme .table-hover > tbody > tr:hover > td {
  background: #2a3441 !important;
  color: #fff !important;
}
html.gs-dark-theme table.dataTable tbody tr.selected > td,
html.gs-dark-theme table.dataTable tbody tr.active > td {
  background: #303b49 !important;
  color: #fff !important;
}
html.gs-dark-theme .table > tbody > tr.danger > td,
html.gs-dark-theme .table > tbody > tr.warning > td,
html.gs-dark-theme .danger,
html.gs-dark-theme .warning {
  color: #f4f6f8 !important;
}
html.gs-dark-theme .table > tbody > tr.danger > td {
  background: #4a2b2d !important;
}
html.gs-dark-theme .table > tbody > tr.warning > td {
  background: #4a4027 !important;
}

/* Filter row/footer inside DataTables */
html.gs-dark-theme table.dataTable tfoot th,
html.gs-dark-theme table.dataTable tfoot td,
html.gs-dark-theme .table > tfoot > tr > th,
html.gs-dark-theme .table > tfoot > tr > td {
  background: #1f2731 !important;
  color: #dce3ec !important;
  border-color: #394352 !important;
}
html.gs-dark-theme table.dataTable tfoot input,
html.gs-dark-theme table.dataTable tfoot select {
  background: #121821 !important;
  color: #f3f4f6 !important;
  border-color: #3a4452 !important;
}

/* Table action dropdown buttons */
html.gs-dark-theme .table .dropdown-toggle,
html.gs-dark-theme table.dataTable .dropdown-toggle,
html.gs-dark-theme .table .btn-default,
html.gs-dark-theme table.dataTable .btn-default {
  background: #252e39 !important;
  color: #e7ecf3 !important;
  border-color: #414b59 !important;
}

/* Pagination */
html.gs-dark-theme .dataTables_wrapper .pagination > li > a,
html.gs-dark-theme .dataTables_wrapper .pagination > li > span {
  background: #1a2029 !important;
  color: #dbe2eb !important;
  border-color: #394352 !important;
}
html.gs-dark-theme .dataTables_wrapper .pagination > li > a:hover {
  background: #29323e !important;
  color: #fff !important;
}
html.gs-dark-theme .dataTables_wrapper .pagination > .active > a,
html.gs-dark-theme .dataTables_wrapper .pagination > .active > span {
  background: #e5252a !important;
  border-color: #e5252a !important;
  color: #fff !important;
}

/* Tabs */
html.gs-dark-theme .nav-tabs {
  border-bottom-color: #394352 !important;
}
html.gs-dark-theme .nav-tabs > li > a {
  background: #202731 !important;
  color: #aeb7c4 !important;
  border-color: #394352 !important;
}
html.gs-dark-theme .nav-tabs > li > a:hover {
  background: #29323e !important;
  color: #fff !important;
}
html.gs-dark-theme .nav-tabs > li.active > a,
html.gs-dark-theme .nav-tabs > li.active > a:hover,
html.gs-dark-theme .nav-tabs > li.active > a:focus {
  background: #1a2029 !important;
  color: #fff !important;
  border-color: #394352 #394352 #1a2029 !important;
}

/* Select2 legacy and modern variants */
html.gs-dark-theme .select2-container .select2-choice,
html.gs-dark-theme .select2-container .select2-selection,
html.gs-dark-theme .select2-container--default .select2-selection--single,
html.gs-dark-theme .select2-container--default .select2-selection--multiple {
  background: #121821 !important;
  color: #f3f4f6 !important;
  border-color: #3a4452 !important;
}
html.gs-dark-theme .select2-container .select2-choice .select2-chosen,
html.gs-dark-theme .select2-selection__rendered {
  color: #f3f4f6 !important;
}
html.gs-dark-theme .select2-dropdown,
html.gs-dark-theme .select2-drop,
html.gs-dark-theme .select2-results,
html.gs-dark-theme .select2-results__options,
html.gs-dark-theme .select2-search input,
html.gs-dark-theme .select2-search__field {
  background: #171d26 !important;
  color: #f3f4f6 !important;
  border-color: #394352 !important;
}
html.gs-dark-theme .select2-results__option--highlighted[aria-selected],
html.gs-dark-theme .select2-results .select2-highlighted {
  background: #2c3643 !important;
  color: #fff !important;
}

/* Generic inputs including disabled/read-only */
html.gs-dark-theme input,
html.gs-dark-theme textarea,
html.gs-dark-theme select,
html.gs-dark-theme .form-control {
  background-color: #121821 !important;
  color: #f3f4f6 !important;
  border-color: #3a4452 !important;
}
html.gs-dark-theme input[disabled],
html.gs-dark-theme input[readonly],
html.gs-dark-theme select[disabled],
html.gs-dark-theme textarea[disabled],
html.gs-dark-theme .form-control[disabled],
html.gs-dark-theme .form-control[readonly] {
  background: #202731 !important;
  color: #cfd7e2 !important;
  opacity: 1 !important;
}

/* Legends and field labels */
html.gs-dark-theme legend,
html.gs-dark-theme .control-label,
html.gs-dark-theme label {
  color: #dce3ec !important;
  border-color: #394352 !important;
}

/* Legacy report/chart description strips which remain white */
html.gs-dark-theme .box-content > .row,
html.gs-dark-theme .box-content > p.introtext,
html.gs-dark-theme .introtext,
html.gs-dark-theme .report-description,
html.gs-dark-theme .chart-description,
html.gs-dark-theme .dataTables_wrapper + p,
html.gs-dark-theme .box-content .text-center {
  color: #c8d1dc !important;
}
html.gs-dark-theme .introtext,
html.gs-dark-theme .report-description,
html.gs-dark-theme .chart-description {
  background: transparent !important;
}

/* Prevent inline/light background utility classes from making white islands */
html.gs-dark-theme .bg-white,
html.gs-dark-theme .white-bg,
html.gs-dark-theme .bg-light,
html.gs-dark-theme .light-bg {
  background: #1a2029 !important;
  color: #e7ecf3 !important;
}

/* Borders and horizontal separators */
html.gs-dark-theme .border,
html.gs-dark-theme .border-top,
html.gs-dark-theme .border-bottom,
html.gs-dark-theme .border-left,
html.gs-dark-theme .border-right,
html.gs-dark-theme hr {
  border-color: #394352 !important;
}

/* Keep status labels/buttons with their semantic colors readable */
html.gs-dark-theme .label-success,
html.gs-dark-theme .badge-success,
html.gs-dark-theme .btn-success {
  color: #fff !important;
}
html.gs-dark-theme .label-danger,
html.gs-dark-theme .badge-danger,
html.gs-dark-theme .btn-danger {
  color: #fff !important;
}
html.gs-dark-theme .label-warning,
html.gs-dark-theme .badge-warning,
html.gs-dark-theme .btn-warning {
  color: #fff !important;
}

/* Mobile: keep dark tables and cards within viewport */
@media (max-width: 767px) {
  html.gs-dark-theme .table-responsive,
  html.gs-dark-theme .dataTables_wrapper {
    background: #1a2029 !important;
  }
  html.gs-dark-theme .dataTables_wrapper .row {
    margin-left: 0;
    margin-right: 0;
  }
}


/* =========================================================
   GS Dark Mode — final visual polish
   Scope: dark mode only.
   Highcharts + report cards/tables + quick links.
   ========================================================= */

/* Highcharts: eliminate white chart canvas in dark mode */
html.gs-dark-theme .highcharts-container,
html.gs-dark-theme .highcharts-root,
html.gs-dark-theme .highcharts-background {
  background: #1a2029 !important;
}
html.gs-dark-theme .highcharts-background {
  fill: #1a2029 !important;
}
html.gs-dark-theme .highcharts-plot-background {
  fill: #1a2029 !important;
}

/* Highcharts grid / axes */
html.gs-dark-theme .highcharts-grid-line {
  stroke: #36404d !important;
}
html.gs-dark-theme .highcharts-axis-line,
html.gs-dark-theme .highcharts-tick {
  stroke: #536071 !important;
}
html.gs-dark-theme .highcharts-axis-title,
html.gs-dark-theme .highcharts-axis-labels text,
html.gs-dark-theme .highcharts-data-label text,
html.gs-dark-theme .highcharts-stack-labels text,
html.gs-dark-theme .highcharts-legend-item text,
html.gs-dark-theme .highcharts-title,
html.gs-dark-theme .highcharts-subtitle {
  fill: #dce3ec !important;
  color: #dce3ec !important;
  text-shadow: none !important;
}

/* Highcharts data labels that were hard-coded black */
html.gs-dark-theme .highcharts-data-label text,
html.gs-dark-theme .highcharts-data-label span {
  fill: #f3f4f6 !important;
  color: #f3f4f6 !important;
}

/* Highcharts tooltip */
html.gs-dark-theme .highcharts-tooltip-box {
  fill: #202731 !important;
  stroke: #4b5665 !important;
}
html.gs-dark-theme .highcharts-tooltip text,
html.gs-dark-theme .highcharts-tooltip span,
html.gs-dark-theme .highcharts-tooltip div {
  color: #f3f4f6 !important;
  fill: #f3f4f6 !important;
}

/* Charts embedded in boxes */
html.gs-dark-theme #ov-chart,
html.gs-dark-theme #bschart,
html.gs-dark-theme #lmbschart,
html.gs-dark-theme [id*="chart"],
html.gs-dark-theme [class*="chart-container"] {
  background: #1a2029 !important;
}

/* Profit/Loss and report main surfaces */
html.gs-dark-theme .report-wrapper,
html.gs-dark-theme .report-container,
html.gs-dark-theme .profit-loss-report,
html.gs-dark-theme .profit-loss-summary,
html.gs-dark-theme .summary-wrapper,
html.gs-dark-theme .summary-grid {
  background: #1a2029 !important;
  color: #e7ecf3 !important;
}

/* Report titles and secondary headings */
html.gs-dark-theme .report-wrapper h1,
html.gs-dark-theme .report-wrapper h2,
html.gs-dark-theme .report-wrapper h3,
html.gs-dark-theme .report-container h1,
html.gs-dark-theme .report-container h2,
html.gs-dark-theme .report-container h3,
html.gs-dark-theme .profit-loss-report h1,
html.gs-dark-theme .profit-loss-report h2,
html.gs-dark-theme .profit-loss-report h3,
html.gs-dark-theme .summary-title,
html.gs-dark-theme .report-title {
  color: #f1f5f9 !important;
}

/* Report cards that still appear white */
html.gs-dark-theme .report-wrapper .card,
html.gs-dark-theme .report-container .card,
html.gs-dark-theme .profit-loss-report .card,
html.gs-dark-theme .summary-wrapper .card,
html.gs-dark-theme .summary-card,
html.gs-dark-theme .report-card,
html.gs-dark-theme .stat-card,
html.gs-dark-theme .metric-card {
  background: #1f2731 !important;
  color: #f3f4f6 !important;
  border-color: #3a4452 !important;
}

/* Report card values / labels */
html.gs-dark-theme .report-wrapper .card .value,
html.gs-dark-theme .report-container .card .value,
html.gs-dark-theme .profit-loss-report .card .value,
html.gs-dark-theme .summary-card .value,
html.gs-dark-theme .metric-card .value,
html.gs-dark-theme .stat-card .value,
html.gs-dark-theme .report-wrapper .amount,
html.gs-dark-theme .report-container .amount {
  color: #f8fafc !important;
}
html.gs-dark-theme .report-wrapper .card .label,
html.gs-dark-theme .report-container .card .label,
html.gs-dark-theme .profit-loss-report .card .label,
html.gs-dark-theme .summary-card .label,
html.gs-dark-theme .metric-card .label,
html.gs-dark-theme .stat-card .label {
  color: #b8c2cf !important;
}

/* Generic report text that was almost invisible */
html.gs-dark-theme .report-wrapper td,
html.gs-dark-theme .report-wrapper th,
html.gs-dark-theme .report-container td,
html.gs-dark-theme .report-container th,
html.gs-dark-theme .profit-loss-report td,
html.gs-dark-theme .profit-loss-report th,
html.gs-dark-theme .summary-wrapper td,
html.gs-dark-theme .summary-wrapper th {
  color: #e2e8f0 !important;
}

/* Report totals and row descriptions */
html.gs-dark-theme .report-total,
html.gs-dark-theme .grand-total,
html.gs-dark-theme .summary-total,
html.gs-dark-theme .row-title,
html.gs-dark-theme .row-label,
html.gs-dark-theme .report-row-title {
  color: #f3f4f6 !important;
}

/* Keep small secondary texts readable rather than near-white-on-white */
html.gs-dark-theme .report-wrapper .text-muted,
html.gs-dark-theme .report-container .text-muted,
html.gs-dark-theme .profit-loss-report .text-muted,
html.gs-dark-theme .summary-wrapper .text-muted {
  color: #aeb7c4 !important;
}

/* Quick links: remove remaining light cards in dark mode */
html.gs-dark-theme .box-content .quick-button,
html.gs-dark-theme .box-content a.quick-button.small,
html.gs-dark-theme a.quick-button,
html.gs-dark-theme .quick-button {
  background: #202731 !important;
  color: #e7ecf3 !important;
  border-color: #3a4452 !important;
  box-shadow: 0 6px 16px rgba(0,0,0,.24) !important;
}
html.gs-dark-theme .box-content .quick-button > p,
html.gs-dark-theme .box-content a.quick-button.small > p,
html.gs-dark-theme a.quick-button > p,
html.gs-dark-theme .quick-button > p {
  color: #dce3ec !important;
}
html.gs-dark-theme .box-content .quick-button:hover,
html.gs-dark-theme .box-content a.quick-button.small:hover,
html.gs-dark-theme a.quick-button:hover,
html.gs-dark-theme .quick-button:hover {
  background: #2a3441 !important;
  border-color: #e5252a !important;
  color: #fff !important;
}

/* Quick links icon frame should not stay white */
html.gs-dark-theme .quick-button > i,
html.gs-dark-theme a.quick-button > i,
html.gs-dark-theme .box-content .quick-button > i,
html.gs-dark-theme .box-content a.quick-button.small > i {
  border-color: transparent !important;
}

/* Legacy literal white utility text/background collisions */
html.gs-dark-theme .white:not(.btn):not(.label):not(.badge) {
  color: #e7ecf3 !important;
}
html.gs-dark-theme .bwhite:not(.btn):not(.label):not(.badge) {
  background: #1a2029 !important;
  color: #e7ecf3 !important;
}

/* Make report table rows and totals consistently dark */
html.gs-dark-theme .report-wrapper table tbody tr,
html.gs-dark-theme .report-container table tbody tr,
html.gs-dark-theme .profit-loss-report table tbody tr,
html.gs-dark-theme .summary-wrapper table tbody tr {
  background: #1a2029 !important;
}
html.gs-dark-theme .report-wrapper table tbody tr:nth-child(odd),
html.gs-dark-theme .report-container table tbody tr:nth-child(odd),
html.gs-dark-theme .profit-loss-report table tbody tr:nth-child(odd),
html.gs-dark-theme .summary-wrapper table tbody tr:nth-child(odd) {
  background: #202833 !important;
}
html.gs-dark-theme .report-wrapper table td,
html.gs-dark-theme .report-wrapper table th,
html.gs-dark-theme .report-container table td,
html.gs-dark-theme .report-container table th,
html.gs-dark-theme .profit-loss-report table td,
html.gs-dark-theme .profit-loss-report table th,
html.gs-dark-theme .summary-wrapper table td,
html.gs-dark-theme .summary-wrapper table th {
  background: transparent !important;
  color: #e5eaf0 !important;
  border-color: #394352 !important;
}

/* Generic headings that remained too dim on dark backgrounds */
html.gs-dark-theme #content h1,
html.gs-dark-theme #content h2,
html.gs-dark-theme #content h3,
html.gs-dark-theme #content h4,
html.gs-dark-theme #content h5,
html.gs-dark-theme #content h6 {
  color: #eef2f7 !important;
}

/* Breadcrumb and secondary top-row contrast */
html.gs-dark-theme .breadcrumb > li,
html.gs-dark-theme .breadcrumb > li > a,
html.gs-dark-theme .page-header,
html.gs-dark-theme .page-title {
  color: #d7dee8 !important;
}

/* Mobile charts / quick links stay contained */
@media (max-width: 767px) {
  html.gs-dark-theme .highcharts-container,
  html.gs-dark-theme .highcharts-root {
    max-width: 100% !important;
  }
  html.gs-dark-theme .quick-button {
    background: #202731 !important;
  }
}


/* =========================================================
   GS Dark Mode — comprehensive report/modal compatibility
   Screen only. Keeps print output unchanged.
   ========================================================= */
@media screen {

  /* Profit/Loss custom report (.plr-*) */
  html.gs-dark-theme .plr-page {
    --ink: #eef2f7 !important;
    --muted: #aeb7c4 !important;
    --line: #394352 !important;
    --soft: #202833 !important;
    color: #eef2f7 !important;
  }

  html.gs-dark-theme .plr-shell,
  html.gs-dark-theme .plr-report {
    background: #171d26 !important;
    color: #eef2f7 !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme .plr-toolbar {
    background: #202731 !important;
    color: #eef2f7 !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme .plr-toolbar h2,
  html.gs-dark-theme .plr-heading h1,
  html.gs-dark-theme .plr-section-title,
  html.gs-dark-theme .plr-kpi-value,
  html.gs-dark-theme .plr-warehouse-value,
  html.gs-dark-theme .plr-meta-value,
  html.gs-dark-theme .plr-label,
  html.gs-dark-theme .plr-amount,
  html.gs-dark-theme .plr-period-value {
    color: #eef2f7 !important;
  }

  html.gs-dark-theme .plr-heading p,
  html.gs-dark-theme .plr-kpi-label,
  html.gs-dark-theme .plr-kpi-note,
  html.gs-dark-theme .plr-detail,
  html.gs-dark-theme .plr-num,
  html.gs-dark-theme .plr-period-label,
  html.gs-dark-theme .plr-warehouse-name,
  html.gs-dark-theme .plr-meta-label {
    color: #aeb7c4 !important;
  }

  html.gs-dark-theme .plr-date .form-control,
  html.gs-dark-theme .plr-date .input-group-addon,
  html.gs-dark-theme .plr-btn {
    background: #171d26 !important;
    color: #e8edf4 !important;
    border-color: #44505f !important;
  }

  html.gs-dark-theme .plr-btn:hover,
  html.gs-dark-theme .plr-btn:focus {
    background: #29323e !important;
    color: #fff !important;
    border-color: #e5252a !important;
  }

  html.gs-dark-theme .plr-period,
  html.gs-dark-theme .plr-meta {
    background: #202833 !important;
    color: #eef2f7 !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme .plr-meta-item {
    border-color: #394352 !important;
  }

  html.gs-dark-theme .plr-kpi,
  html.gs-dark-theme .plr-warehouse {
    background: #1f2731 !important;
    color: #eef2f7 !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme .plr-kpi-icon {
    background: #29323e !important;
    color: #dce3ec !important;
  }

  html.gs-dark-theme .plr-kpi.purchases .plr-kpi-icon,
  html.gs-dark-theme .plr-kpi.expenses .plr-kpi-icon {
    background: #442529 !important;
    color: #ff6266 !important;
  }

  html.gs-dark-theme .plr-kpi.profit .plr-kpi-icon {
    background: #203b31 !important;
    color: #65d39b !important;
  }

  html.gs-dark-theme .plr-table-wrap {
    background: #1a2029 !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme .plr-table {
    background: #1a2029 !important;
    color: #e8edf4 !important;
  }

  html.gs-dark-theme .plr-table th,
  html.gs-dark-theme .plr-table td {
    color: #e5eaf0 !important;
    border-color: #394352 !important;
    background: transparent !important;
  }

  html.gs-dark-theme .plr-table thead th {
    background: #232b36 !important;
    color: #dce3ec !important;
  }

  html.gs-dark-theme .plr-table tbody tr:hover {
    background: #29323e !important;
  }

  html.gs-dark-theme .plr-total-row {
    background: #202833 !important;
  }

  html.gs-dark-theme .plr-result-row {
    background: #20372e !important;
  }

  html.gs-dark-theme .plr-result-row .plr-label,
  html.gs-dark-theme .plr-result-row .plr-amount {
    color: #72dda7 !important;
  }

  /* Generic report boxes and rows that still carry literal white backgrounds */
  html.gs-dark-theme #content .box,
  html.gs-dark-theme #content .box-content,
  html.gs-dark-theme #content .panel,
  html.gs-dark-theme #content .panel-body {
    background-color: #171d26 !important;
    color: #e8edf4 !important;
    border-color: #394352 !important;
  }

  /* Daily / monthly report calendar cells */
  html.gs-dark-theme .day_num,
  html.gs-dark-theme td.day_num,
  html.gs-dark-theme .table td.day_num,
  html.gs-dark-theme .table th.day_num {
    background: #202833 !important;
    color: #e8edf4 !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme .day_num:hover,
  html.gs-dark-theme td.day_num:hover {
    background: #2b3542 !important;
    color: #fff !important;
  }

  /* Ajax report modal (daily profit etc.) */
  html.gs-dark-theme #myModal .modal-content,
  html.gs-dark-theme #myModal .modal-header,
  html.gs-dark-theme #myModal .modal-body,
  html.gs-dark-theme #myModal .modal-footer {
    background: #1a2029 !important;
    color: #eef2f7 !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme #myModal .modal-title,
  html.gs-dark-theme #myModal h1,
  html.gs-dark-theme #myModal h2,
  html.gs-dark-theme #myModal h3,
  html.gs-dark-theme #myModal h4,
  html.gs-dark-theme #myModal strong,
  html.gs-dark-theme #myModal span:not(.select2-arrow):not(.select2-chosen) {
    color: #eef2f7 !important;
  }

  html.gs-dark-theme #myModal .close,
  html.gs-dark-theme #myModal .close i {
    color: #dce3ec !important;
    opacity: 1 !important;
  }

  html.gs-dark-theme #myModal .stable,
  html.gs-dark-theme #myModal .stable tbody,
  html.gs-dark-theme #myModal .stable tr,
  html.gs-dark-theme #myModal .stable td,
  html.gs-dark-theme #myModal .stable th {
    background: #1d242e !important;
    color: #eef2f7 !important;
    border-color: #46515f !important;
  }

  html.gs-dark-theme #myModal .stable tr:nth-child(odd) td {
    background: #202833 !important;
  }

  html.gs-dark-theme #myModal .stable h4,
  html.gs-dark-theme #myModal .stable h4 span,
  html.gs-dark-theme #myModal .stable h4 strong {
    color: #eef2f7 !important;
  }

  html.gs-dark-theme #myModal .form-control,
  html.gs-dark-theme #myModal .select2-container .select2-choice {
    background: #121821 !important;
    color: #f3f4f6 !important;
    border-color: #44505f !important;
  }

  /* Select2 arrow section should not remain white */
  html.gs-dark-theme .select2-container .select2-choice .select2-arrow,
  html.gs-dark-theme .select2-container .select2-choice div {
    background: #202833 !important;
    border-color: #44505f !important;
  }

  /* Highcharts SVG: force dark canvas regardless of inline defaults */
  html.gs-dark-theme svg.highcharts-root,
  html.gs-dark-theme .highcharts-container svg {
    background: #1a2029 !important;
  }

  html.gs-dark-theme .highcharts-background,
  html.gs-dark-theme rect.highcharts-background {
    fill: #1a2029 !important;
  }

  html.gs-dark-theme .highcharts-plot-background {
    fill: #1a2029 !important;
  }

  html.gs-dark-theme .highcharts-grid-line {
    stroke: #3b4654 !important;
  }

  html.gs-dark-theme .highcharts-axis-line,
  html.gs-dark-theme .highcharts-tick {
    stroke: #667384 !important;
  }

  html.gs-dark-theme .highcharts-axis-labels text,
  html.gs-dark-theme .highcharts-data-label text,
  html.gs-dark-theme .highcharts-legend-item text,
  html.gs-dark-theme .highcharts-title,
  html.gs-dark-theme .highcharts-subtitle {
    fill: #dce3ec !important;
    color: #dce3ec !important;
    text-shadow: none !important;
  }

  /* Dashboard quick links */
  html.gs-dark-theme .box-content a.quick-button.small,
  html.gs-dark-theme .box-content .quick-button,
  html.gs-dark-theme a.quick-button.small,
  html.gs-dark-theme a.quick-button {
    background: #202731 !important;
    color: #e8edf4 !important;
    border-color: #3d4856 !important;
  }

  html.gs-dark-theme .quick-button p,
  html.gs-dark-theme a.quick-button p {
    color: #dce3ec !important;
  }

  /* Prevent faint report labels on dark backgrounds */
  html.gs-dark-theme #content .text-muted,
  html.gs-dark-theme #content .muted,
  html.gs-dark-theme #content small {
    color: #aeb7c4 !important;
  }
}

/* Print safety: dark mode must never darken printed reports */
@media print {
  html.gs-dark-theme .plr-shell,
  html.gs-dark-theme .plr-report,
  html.gs-dark-theme .plr-kpi,
  html.gs-dark-theme .plr-table,
  html.gs-dark-theme .plr-table th,
  html.gs-dark-theme .plr-table td,
  html.gs-dark-theme .plr-period,
  html.gs-dark-theme .plr-meta,
  html.gs-dark-theme .plr-warehouse,
  html.gs-dark-theme #myModal .modal-content,
  html.gs-dark-theme #myModal .modal-body,
  html.gs-dark-theme #myModal .stable,
  html.gs-dark-theme #myModal .stable td {
    background: #fff !important;
    color: #111 !important;
  }
}


/* =========================================================
   GS Dark Mode — high-specificity compatibility layer
   Fixes legacy #content + !important light rules.
   Dark mode only; appended last intentionally.
   ========================================================= */
@media screen {

  /* Root content and settings containers */
  html.gs-dark-theme body #content,
  html.gs-dark-theme body #content .content-con,
  html.gs-dark-theme body #content fieldset,
  html.gs-dark-theme body #content .box,
  html.gs-dark-theme body #content .box-content,
  html.gs-dark-theme body #content .panel,
  html.gs-dark-theme body #content .panel-body,
  html.gs-dark-theme body #content .well {
    background: #171d26 !important;
    background-color: #171d26 !important;
    color: #e8edf4 !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme body #content fieldset > legend {
    background: #202833 !important;
    color: #e8edf4 !important;
    border-color: #44505f !important;
  }

  /* Labels / muted copy */
  html.gs-dark-theme body #content label,
  html.gs-dark-theme body #content .control-label,
  html.gs-dark-theme body #content .help-block,
  html.gs-dark-theme body #content .text-muted,
  html.gs-dark-theme body #content .muted {
    color: #c7d0dc !important;
  }

  /* Native controls in content */
  html.gs-dark-theme body #content input:not([type="checkbox"]):not([type="radio"]),
  html.gs-dark-theme body #content textarea,
  html.gs-dark-theme body #content select,
  html.gs-dark-theme body #content .form-control {
    background: #121821 !important;
    background-color: #121821 !important;
    color: #f3f4f6 !important;
    border-color: #44505f !important;
  }

  html.gs-dark-theme body #content input::placeholder,
  html.gs-dark-theme body #content textarea::placeholder {
    color: #8f9aa8 !important;
  }

  html.gs-dark-theme body #content input[readonly],
  html.gs-dark-theme body #content input[disabled],
  html.gs-dark-theme body #content textarea[readonly],
  html.gs-dark-theme body #content textarea[disabled],
  html.gs-dark-theme body #content select[disabled],
  html.gs-dark-theme body #content .form-control[readonly],
  html.gs-dark-theme body #content .form-control[disabled] {
    background: #202731 !important;
    color: #cfd7e2 !important;
    opacity: 1 !important;
  }

  /* Select2 v3 — exact legacy selectors with higher specificity */
  html.gs-dark-theme body #content .select2-container,
  html.gs-dark-theme body #content div.select2-container,
  html.gs-dark-theme body #content span.select2-container,
  html.gs-dark-theme body #content .select2-container.form-control {
    background: transparent !important;
    border-color: transparent !important;
  }

  html.gs-dark-theme body #content .select2-container .select2-choice,
  html.gs-dark-theme body #content .select2-container-active .select2-choice,
  html.gs-dark-theme body #content .select2-dropdown-open .select2-choice {
    background: #121821 !important;
    background-image: none !important;
    color: #f3f4f6 !important;
    border-color: #44505f !important;
    box-shadow: none !important;
  }

  html.gs-dark-theme body #content .select2-container .select2-choice > .select2-chosen,
  html.gs-dark-theme body #content .select2-container .select2-choice .select2-chosen {
    color: #f3f4f6 !important;
  }

  html.gs-dark-theme body #content .select2-container .select2-choice .select2-arrow,
  html.gs-dark-theme body #content .select2-container .select2-choice > .select2-arrow,
  html.gs-dark-theme body #content .select2-container .select2-choice div {
    background: #202833 !important;
    background-image: none !important;
    border-color: #44505f !important;
  }

  html.gs-dark-theme body #content .select2-container .select2-choice .select2-arrow b {
    filter: brightness(1.8) !important;
  }

  /* Select2 v4 */
  html.gs-dark-theme body #content .select2-container--default .select2-selection--single,
  html.gs-dark-theme body #content .select2-container--default .select2-selection--multiple {
    background: #121821 !important;
    color: #f3f4f6 !important;
    border-color: #44505f !important;
  }

  html.gs-dark-theme body #content .select2-container--default .select2-selection--single .select2-selection__rendered,
  html.gs-dark-theme body #content .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    color: #f3f4f6 !important;
  }

  html.gs-dark-theme body #content .select2-container--default .select2-selection--single .select2-selection__arrow {
    background: #202833 !important;
  }

  /* Select2 dropdown is appended to body, so scope it via dark html */
  html.gs-dark-theme body .select2-drop,
  html.gs-dark-theme body .select2-dropdown,
  html.gs-dark-theme body .select2-results,
  html.gs-dark-theme body .select2-results__options,
  html.gs-dark-theme body .select2-search,
  html.gs-dark-theme body .select2-search input,
  html.gs-dark-theme body .select2-search__field {
    background: #171d26 !important;
    color: #f3f4f6 !important;
    border-color: #44505f !important;
  }

  html.gs-dark-theme body .select2-results .select2-highlighted,
  html.gs-dark-theme body .select2-results__option--highlighted[aria-selected] {
    background: #2b3542 !important;
    color: #fff !important;
  }

  /* DataTables top/bottom controls including "Show 10" */
  html.gs-dark-theme body #content .dataTables_wrapper,
  html.gs-dark-theme body #content .dataTables_wrapper .row,
  html.gs-dark-theme body #content .dataTables_wrapper .row:first-child,
  html.gs-dark-theme body #content .dataTables_wrapper .row:last-child {
    background: #171d26 !important;
    color: #e8edf4 !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme body #content .dataTables_wrapper label,
  html.gs-dark-theme body #content .dataTables_length,
  html.gs-dark-theme body #content .dataTables_filter,
  html.gs-dark-theme body #content .dataTables_info {
    color: #cbd3de !important;
  }

  html.gs-dark-theme body #content .dataTables_wrapper input,
  html.gs-dark-theme body #content .dataTables_wrapper select,
  html.gs-dark-theme body #content .dataTables_wrapper .form-control,
  html.gs-dark-theme body #content .dataTables_length select,
  html.gs-dark-theme body #content .dataTables_filter input {
    background: #121821 !important;
    color: #f3f4f6 !important;
    border-color: #44505f !important;
  }

  /* Explicit DataTables Select2 length selector */
  html.gs-dark-theme body #content .dataTables_length .select2-container .select2-choice,
  html.gs-dark-theme body #content .dataTables_wrapper .select2-container .select2-choice {
    background: #121821 !important;
    background-image: none !important;
    color: #f3f4f6 !important;
    border-color: #44505f !important;
  }

  html.gs-dark-theme body #content .dataTables_length .select2-container .select2-choice .select2-chosen,
  html.gs-dark-theme body #content .dataTables_wrapper .select2-container .select2-choice .select2-chosen {
    color: #f3f4f6 !important;
  }

  html.gs-dark-theme body #content .dataTables_length .select2-container .select2-choice .select2-arrow,
  html.gs-dark-theme body #content .dataTables_wrapper .select2-container .select2-choice .select2-arrow {
    background: #202833 !important;
    border-color: #44505f !important;
  }

  /* Tables */
  html.gs-dark-theme body #content table.table,
  html.gs-dark-theme body #content table.dataTable {
    background: #1a2029 !important;
    color: #e8edf4 !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme body #content table.table > thead > tr > th,
  html.gs-dark-theme body #content table.dataTable > thead > tr > th,
  html.gs-dark-theme body #content table.dataTable thead th {
    background: #232b36 !important;
    background-image: none !important;
    color: #f2f5f8 !important;
    border-color: #44505f !important;
  }

  html.gs-dark-theme body #content table.table > tbody > tr > td,
  html.gs-dark-theme body #content table.dataTable tbody td {
    background: #1d242e !important;
    color: #e5eaf0 !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme body #content table.table-striped > tbody > tr:nth-of-type(odd) > td,
  html.gs-dark-theme body #content table.dataTable tbody tr.odd > td {
    background: #202833 !important;
  }

  html.gs-dark-theme body #content table.table > tfoot > tr > td,
  html.gs-dark-theme body #content table.table > tfoot > tr > th,
  html.gs-dark-theme body #content table.dataTable tfoot td,
  html.gs-dark-theme body #content table.dataTable tfoot th {
    background: #1f2731 !important;
    color: #dce3ec !important;
    border-color: #394352 !important;
  }

  /* Pagination */
  html.gs-dark-theme body #content .pagination > li > a,
  html.gs-dark-theme body #content .pagination > li > span {
    background: #1a2029 !important;
    color: #dce3ec !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme body #content .pagination > .active > a,
  html.gs-dark-theme body #content .pagination > .active > span {
    background: #e5252a !important;
    color: #fff !important;
    border-color: #e5252a !important;
  }

  /* Modal: generic, not only #myModal */
  html.gs-dark-theme body .modal .modal-content,
  html.gs-dark-theme body .modal .modal-header,
  html.gs-dark-theme body .modal .modal-body,
  html.gs-dark-theme body .modal .modal-footer {
    background: #1a2029 !important;
    color: #eef2f7 !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme body .modal .modal-body label,
  html.gs-dark-theme body .modal .modal-body p,
  html.gs-dark-theme body .modal .modal-body h1,
  html.gs-dark-theme body .modal .modal-body h2,
  html.gs-dark-theme body .modal .modal-body h3,
  html.gs-dark-theme body .modal .modal-body h4 {
    color: #eef2f7 !important;
  }

  html.gs-dark-theme body .modal .modal-body .form-control,
  html.gs-dark-theme body .modal .modal-body .select2-container .select2-choice {
    background: #121821 !important;
    color: #f3f4f6 !important;
    border-color: #44505f !important;
  }

  /* Tabs */
  html.gs-dark-theme body #content .nav-tabs > li > a {
    background: #202731 !important;
    color: #aeb7c4 !important;
    border-color: #394352 !important;
  }

  html.gs-dark-theme body #content .nav-tabs > li.active > a,
  html.gs-dark-theme body #content .nav-tabs > li.active > a:hover,
  html.gs-dark-theme body #content .nav-tabs > li.active > a:focus {
    background: #171d26 !important;
    color: #fff !important;
    border-color: #394352 #394352 #171d26 !important;
  }

  /* Date controls */
  html.gs-dark-theme body .daterangepicker,
  html.gs-dark-theme body .datepicker,
  html.gs-dark-theme body .datetimepicker {
    background: #171d26 !important;
    color: #eef2f7 !important;
    border-color: #44505f !important;
  }

  /* Alerts retain semantic meaning with dark-friendly tones */
  html.gs-dark-theme body #content .alert-success {
    background: #173329 !important;
    color: #8fe0b5 !important;
  }
  html.gs-dark-theme body #content .alert-danger {
    background: #3b2023 !important;
    color: #ff9ca0 !important;
  }
  html.gs-dark-theme body #content .alert-warning {
    background: #3a321c !important;
    color: #ffd978 !important;
  }
  html.gs-dark-theme body #content .alert-info {
    background: #182d42 !important;
    color: #91c8ff !important;
  }

  /* Keep semantic badges/buttons readable */
  html.gs-dark-theme body #content .label,
  html.gs-dark-theme body #content .badge,
  html.gs-dark-theme body #content .btn-success,
  html.gs-dark-theme body #content .btn-danger,
  html.gs-dark-theme body #content .btn-warning,
  html.gs-dark-theme body #content .btn-primary,
  html.gs-dark-theme body #content .btn-info {
    color: #fff !important;
  }
}


/* =========================================================
   GS Dark Mode — Highcharts tooltip final compatibility
   Covers old SVG path tooltips and HTML tooltips.
   ========================================================= */
@media screen {
  html.gs-dark-theme body .highcharts-tooltip .highcharts-label-box,
  html.gs-dark-theme body .highcharts-tooltip path.highcharts-label-box,
  html.gs-dark-theme body .highcharts-tooltip > path,
  html.gs-dark-theme body path.highcharts-tooltip-box {
    fill: #202731 !important;
    stroke: #566273 !important;
    filter: none !important;
  }

  html.gs-dark-theme body .highcharts-tooltip text,
  html.gs-dark-theme body .highcharts-tooltip tspan {
    fill: #f3f4f6 !important;
    color: #f3f4f6 !important;
    text-shadow: none !important;
  }

  /* Highcharts useHTML tooltip */
  html.gs-dark-theme body .highcharts-tooltip > span,
  html.gs-dark-theme body .highcharts-tooltip span,
  html.gs-dark-theme body .highcharts-tooltip div {
    background: #202731 !important;
    background-color: #202731 !important;
    color: #f3f4f6 !important;
    border-color: #566273 !important;
    text-shadow: none !important;
  }

  html.gs-dark-theme body .highcharts-tooltip span *,
  html.gs-dark-theme body .highcharts-tooltip div * {
    color: #f3f4f6 !important;
  }
}

/* User Options — GS modern Select2 dropdown (scoped)
   Keeps browser-blue selection out of profile User Options only. */
.gs-user-options-select2-dropdown.select2-drop,
.gs-user-options-select2-dropdown .select2-results {
  border-color: var(--gs-border) !important;
  background: #fff !important;
  color: var(--gs-text) !important;
}
.gs-user-options-select2-dropdown.select2-drop {
  border-radius: 10px !important;
  box-shadow: var(--gs-shadow-lg) !important;
  overflow: hidden;
}
.gs-user-options-select2-dropdown .select2-results {
  padding: 6px !important;
  margin: 0 !important;
}
.gs-user-options-select2-dropdown .select2-results li {
  margin: 2px 0 !important;
}
.gs-user-options-select2-dropdown .select2-results .select2-result-label {
  padding: 8px 10px !important;
  border-radius: 7px !important;
  color: #344054 !important;
}
.gs-user-options-select2-dropdown .select2-results .select2-highlighted,
.gs-user-options-select2-dropdown .select2-results .select2-highlighted .select2-result-label {
  background: var(--gs-primary-soft) !important;
  color: var(--gs-primary) !important;
}
html.gs-dark-theme .gs-user-options-select2-dropdown.select2-drop,
html.gs-dark-theme .gs-user-options-select2-dropdown .select2-results {
  background: #18212c !important;
  border-color: #344252 !important;
  color: #e6edf5 !important;
}
html.gs-dark-theme .gs-user-options-select2-dropdown .select2-results .select2-result-label {
  color: #e6edf5 !important;
}
html.gs-dark-theme .gs-user-options-select2-dropdown .select2-results .select2-highlighted,
html.gs-dark-theme .gs-user-options-select2-dropdown .select2-results .select2-highlighted .select2-result-label {
  background: rgba(229,37,42,.16) !important;
  color: #ff7377 !important;
}

/* GS / all business activities: cosmetic SVG and glass finish for sidebar only.
   Keep original activity palettes, menu markup, click behavior, and permissions. */
#sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li > a {
  isolation: isolate;
  overflow: hidden;
}
#sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li > a::before {
  content: "";
  pointer-events: none;
  position: absolute;
  inset: 1px;
  z-index: 0;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,.07) 36%, transparent 70%);
  opacity: .57;
  transition: opacity .18s ease;
}
#sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li > a > i.fa {
  z-index: 1;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2028%2028%22%3E%3Crect%20x%3D%221%22%20y%3D%221%22%20width%3D%2226%22%20height%3D%2226%22%20rx%3D%228%22%20fill%3D%22%23ffffff%22%20fill-opacity%3D%22.07%22%20stroke%3D%22%23ffffff%22%20stroke-opacity%3D%22.31%22%2F%3E%3Cpath%20d%3D%22M5%2013V9a4%204%200%200%201%204-4h6%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-opacity%3D%22.65%22%20stroke-width%3D%221.3%22%20stroke-linecap%3D%22round%22%2F%3E%3Ccircle%20cx%3D%2222%22%20cy%3D%226%22%20r%3D%221.1%22%20fill%3D%22%23d9c29b%22%20fill-opacity%3D%22.78%22%2F%3E%3C%2Fsvg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 22px 27px;
  transition: color .18s ease, filter .18s ease;
}
#sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li > a > .text,
#sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li > a > .chevron {
  position: relative;
  z-index: 1;
}
#sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li > a:focus-visible {
  outline: 2px solid rgba(183,146,59,.87);
  outline-offset: 1px;
}
#sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li.active > a::before,
#sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li.current > a::before,
#sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li.open > a::before,
#sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li.mb-current > a::before,
#sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li > a:focus-visible::before {
  opacity: .78;
}
@media (hover: hover) and (pointer: fine) {
  #sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li > a:hover::before { opacity: .95; }
  #sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li > a:hover > i.fa { filter: drop-shadow(0 0 3px rgba(255,255,255,.23)); }
}
@media (prefers-reduced-motion: reduce) {
  #sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li > a::before,
  #sidebar-left:not(.minified) #sidebar_menu .nav.main-menu li > a > i.fa { transition: none !important; }
}