html, body {
  display: flex;
  flex:    1 0 auto;
}

body {
  -khtml-user-select:  unset;
  -moz-user-select:    unset;
  -ms-user-select:     unset;
  -webkit-user-select: unset;
  user-select:         unset;
}

a:hover {
  text-decoration: none !important;
}

div:has(input:-internal-autofill-selected) .invalid-feedback,
div:has(input:-internal-autofill-selected) .valid-feedback {
  position: relative;
}

div:has(input:-internal-autofill-selected) .invalid-feedback::after {
  background:      url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23F85778' viewBox='-2 -2 7 7'%3e%3cpath stroke='%23F85778' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E") 0 0 no-repeat;
  background-size: 19px;
  content:         '';
  height:          19px;
  position:        absolute;
  right:           9px;
  top:             -33px;
  width:           19px;
}

div:has(input:-internal-autofill-selected) .valid-feedback::after {
  background:      url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%231FC96E' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") 0 0 no-repeat;
  background-size: 19px;
  content:         '';
  height:          19px;
  position:        absolute;
  right:           9px;
  top:             -33px;
  width:           19px;
}

form *.disabled, a.disabled {
  cursor:         default;
  opacity:        .5;
  pointer-events: none;
}

form button[type="submit"] {
  min-width: 105px;
}

form .search-extras {
  min-height: 23px;
}

form .btn.clear, form .btn.find {
  height:      36px;
  line-height: 40.5px;
  min-width:   36px;
  width:       36px;
}

form .buttons:has(.btn.find) {
  margin-bottom: 1px;
  margin-right:  1px;
}

form .search-icon {
  cursor:        pointer;
  height:        38px;
  line-height:   50px;
  margin-bottom: 0;
  margin-left:   -2px;
  min-width:     24px;
  width:         24px;
}

input.form-control {
  --default-form-control-ph: .75rem;
  --default-form-control-pv: .375rem;
  padding:                   calc(var(--default-form-control-pv) / 4) calc(var(--default-form-control-ph) / 4);
  /* prevent anything that tries to change this from ever getting there */
  transition:
    background-color calc(infinity * 1s) step-end,
    color            calc(infinity * 1s) step-end;
}

div.cell-accent, div.cell-accent-2, div.cell-accent-3 {
  align-items:      center;
  background-color: #FFB12A20;
  border-radius:    4px;
  display:          flex;
  gap:              6px;
  min-height:       38px;
  padding:          0 6px;
}

div.cell-accent-2 { background-color: #CCEEFF20; }
div.cell-accent-3 { background-color: #CAFF2A20; }

input.form-control.cell-accent   { background: linear-gradient(#FFB12A20, #FFB12A20) !important; }
input.form-control.cell-accent-2 { background: linear-gradient(#CCEEFF20, #CCEEFF20) !important; }
input.form-control.cell-accent-3 { background: linear-gradient(#CAFF2A20, #CAFF2A20) !important; }

label {
  --default-label-mb: .5rem;
  margin-bottom:      calc(var(--default-label-mb) / 4);
}

.btn {
  --default-btn-ph: .75rem;
  --default-btn-pv: .375rem;
  padding:          calc(var(--default-btn-pv) / 4) calc(var(--default-btn-ph) / 4);
}

.btn.h5 {
  margin-bottom: 0;
  padding:       2px 7px;
}

.card .card-header {
  --default-card-header-ph: 15px;
  --default-card-header-pv: 10px;
  padding:                  calc(var(--default-card-header-pv) / 4) calc(var(--default-card-header-ph) / 4);
}

.card .card-body {
  --default-card-body-p: .75rem;
  padding:               calc(var(--default-card-body-p) / 4);
}

.gap-2 {
  --default-gap-2: .5rem;
  gap:              calc(var(--default-gap-2) / 4) !important;
}

.gold {
  color: #B36B00;
}

.light-gold {
  color: #E6B800;
}

.m-1 {
  --default-m-1: .25rem;
  margin:        calc(var(--default-m-1) / 4) !important;
}

.m-2 {
  --default-m-2: .5rem;
  margin:        calc(var(--default-m-2) / 4) !important;
}

.m-3 {
  --default-m-3: 1rem;
  margin:        calc(var(--default-m-3) / 4) !important;
}

.m-4 {
  --default-m-4: 1.5rem;
  margin:        calc(var(--default-m-4) / 4) !important;
}

.m-5 {
  --default-m-5: 2rem;
  margin:        calc(var(--default-m-5) / 4) !important;
}

.mb-1 {
  --default-mb-1: .25rem;
  margin-bottom:  calc(var(--default-mb-1) / 4) !important;
}

.mb-2 {
  --default-mb-2: .5rem;
  margin-bottom:  calc(var(--default-mb-2) / 4) !important;
}

.mb-3 {
  --default-mb-3: 1rem;
  margin-bottom:  calc(var(--default-mb-3) / 4) !important;
}

.mb-4 {
  --default-mb-4: 1.5rem;
  margin-bottom:  calc(var(--default-mb-4) / 4) !important;
}

.mb-5 {
  --default-mb-5: 2rem;
  margin-bottom:  calc(var(--default-mb-5) / 4) !important;
}

.ml-sm-4, .mx-sm-4 {
  --default-ml-sm-4: 1.5rem;
  margin-left:       calc(var(--default-ml-sm-4) / 4) !important;
}

.ml-1, .ms-1 {
  --default-ml-1: .25rem;
  margin-left:    calc(var(--default-ml-1) / 4) !important;
}

.ml-2, .ms-2 {
  --default-ml-2: .5rem;
  margin-left:    calc(var(--default-ml-2) / 4) !important;
}

.ml-3, .ms-3 {
  --default-ml-3: 1rem;
  margin-left:    calc(var(--default-ml-3) / 4) !important;
}

.ml-4, .ms-4 {
  --default-ml-4: 1.5rem;
  margin-left:    calc(var(--default-ml-4) / 4) !important;
}

.ml-5, .ms-5 {
  --default-ml-5: 2rem;
  margin-left:    calc(var(--default-ml-5) / 4) !important;
}

.mr-1, .me-1 {
  --default-mr-1: .25rem;
  margin-right:   calc(var(--default-mr-1) / 4) !important;
}

.mr-2, .me-2 {
  --default-mr-2: .5rem;
  margin-right:   calc(var(--default-mr-2) / 4) !important;
}

.mr-3, .me-3 {
  --default-mr-3: 1rem;
  margin-right:   calc(var(--default-mr-3) / 4) !important;
}

.mr-4, .me-4 {
  --default-mr-4: 1.5rem;
  margin-right:   calc(var(--default-mr-4) / 4) !important;
}

.mr-5, .me-5 {
  --default-mr-5: 2rem;
  margin-right:   calc(var(--default-mr-5) / 4) !important;
}

.mx-1 {
  --default-mx-1: .25rem;
  margin-left:    calc(var(--default-mx-1) / 4) !important;
  margin-right:   calc(var(--default-mx-1) / 4) !important;
}

.nav-pills .nav-link {
  --default-nav-link-p: .5rem;
  padding:             calc(var(--default-nav-link-p) / 4);
}

.p-2 {
  --default-p-2: .5rem;
  padding:        calc(var(--default-p-2) / 4) !important;
}

.px-1 {
  --default-px-1: .25rem;
  padding-left:   calc(var(--default-px-1) / 4) !important;
  padding-right:  calc(var(--default-px-1) / 4) !important;
}

.px-2 {
  --default-px-2: .5rem;
  padding-left:   calc(var(--default-px-2) / 4) !important;
  padding-right:  calc(var(--default-px-2) / 4) !important;
}

.dropdown.select-flag .dropdown-toggle {
  padding-bottom: 4px;
  padding-top:    6px;
}

.dropdown-menu {
  min-width: 44px;
}

.dropdown-menu-right {
  left: auto !important;
}

.dropdown-menu .dropdown-item {
  padding: 8px 11px !important;
}

.dropdown-menu[labelledby="language-dropdown"] > *:first-child {
  margin-top: -8px;
}

.dropdown-menu[labelledby="language-dropdown"] > *:first-child * {
  border-top-left-radius:  .25rem;
  border-top-right-radius: .25rem;
}

.dropdown-menu[labelledby="language-dropdown"] > *:last-child {
  margin-bottom: -8px;
}

.dropdown-menu[labelledby="language-dropdown"] > *:last-child * {
  border-bottom-left-radius:  .25rem;
  border-bottom-right-radius: .25rem;
}

.form-row > .col, .form-row > [class*="col-"] {
  --default-form-col-pl: 5px;
  --default-form-col-pr: 5px;
  padding-left:          calc(var(--default-form-col-pl) / 4);
  padding-right:         calc(var(--default-form-col-pr) / 4);
}

.gap-2-5 {
  --default-gap-2-5: .75rem;
  gap:               calc(var(--default-gap-2-5) / 4);
}

.modal-body .swiper-wrapper,
.modal-body .swiper-wrapper .swiper-slide { height: 100%; }

.qty {
  max-width: 64px;
}

.nav-pills {
  flex-wrap: nowrap;
  gap: 1px;
}

.nav-pills .nav-item {
  white-space: nowrap;
}

.nav-pills .nav-link {
  border-bottom-left-radius:  0;
  border-bottom-right-radius: 0;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%);
}

.nav-pills .nav-link:not(.active) {
  background-color: #5B92FF20;
}

.select2-container .select2-selection--single {
  height: 28px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  --default-select2-selection-rendered-pl: 8px;
  font-size:                               15px;
  line-height:                             26px;
  margin-top:                              -1px;
  padding-left:                            calc(var(--default-select2-selection-rendered-pl) / 3);
}

.select2-container--default .select2-selection--single .select2-selection__rendered br {
  display: none;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 26px;
}

.select2-dropdown {
  -moz-box-shadow:    0 .5rem 1rem #0000001A;
  -ms-box-shadow:     0 .5rem 1rem #0000001A;
  -webkit-box-shadow: 0 .5rem 1rem #0000001A;
  border:             1px solid #FFFFFF;
  box-shadow:         0 .5rem 1rem #0000001A;
  opacity:            0;
  transition:         opacity ease-in-out .3s;
}

.select2-dropdown.shown {
  opacity: 1;
}

.select2-container--default.select2-container--open.select2-container--below .select2-selection--single {
  border-bottom-left-radius:  4px;
  border-bottom-right-radius: 4px;
}

.select2-container--default.select2-container--open.select2-container--above .select2-selection--single {
  border-top-left-radius:  4px;
  border-top-right-radius: 4px;
}

.select2-results__option.select2-results__message,
.select2-results__option.select2-results__option--selectable:not(.select2-results__option--highlighted) {
  color: #212529;
}

.select2-container--open .select2-dropdown--below {
  border-top-left-radius:  4px;
  border-top-right-radius: 4px;
  margin-top:              8px;
}

.select2-container--open .select2-dropdown--below:before {
  border-radius: 4px;
  content:       '';
  height:        6px;
  left:          50%;
  margin-left:   -3px;
  position:      absolute;
  top:           -12px;
  width:         6px;
}

.select2-container--open .select2-dropdown--above {
  border-bottom-left-radius:  4px;
  border-bottom-right-radius: 4px;
  margin-top:                 -18px;
}

.select2-container--open .select2-dropdown--above:before {
  border-radius: 4px;
  bottom:        -12px;
  content:       '';
  height:        6px;
  left:          50%;
  margin-left:   -3px;
  position:      absolute;
  width:         6px;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
  --default-p-2: .5rem;
  border:        1px solid #AAAAAA;
  border-radius: 2px;
  padding:       calc(var(--default-p-2) / 3) !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus-visible {
  outline: none;
}

.select2-results__option {
  --default-p-2: .5rem;
  font-size:     15px;
  line-height:   17px;
  padding:       calc(var(--default-p-2) / 3) !important;
}

.select2-container--default .select2-results__group {
  --default-p-2: .5rem;
  background:    #DDDDDD;
  padding:       calc(var(--default-p-2) / 3) !important;
}

.selectpicker + .dropdown-toggle + .dropdown-menu {
  -moz-transition:    all ease .5s;
  -ms-transition:     all ease .5s;
  -webkit-transition: all ease .5s;
  margin:             50px 0 0 0 !important;
  min-height:         0 !important;
  top:                100% !important;
  transition:         all ease .5s;
  will-change:        transform;
}

.selectpicker + .dropdown-toggle + .dropdown-menu.show {
  margin: 20px 0 0 0 !important;
  top:    0 !important;
}

.sidebar {
  --default-sidebar-p: 4px;
  padding:             calc(var(--default-sidebar-p) / 4);
}

.sidebar .logo {
  --default-logo-mb: 10px;
  --default-logo-ph: 8px;
  --default-logo-pv: 5px;
  margin:            0 0 calc(var(--default-logo-mb) / 4) 0;
  padding:           calc(var(--default-logo-pv) / 4) calc(var(--default-logo-ph) / 4);
}

.sidebar .subtitle {
  --default-subtitle-mb: 5px;
  --default-subtitle-mt: 10px;
  --default-subtitle-ph: 8px;
  --default-subtitle-pv: 5px;
  margin:                calc(var(--default-subtitle-mt) / 4) 0 calc(var(--default-subtitle-mb) / 4) 0;
  padding:               calc(var(--default-subtitle-pv) / 4) calc(var(--default-subtitle-ph) / 4);
}

.sidebar-compact .sidebar:hover .subtitle,
.sidebar-icon .sidebar .subtitle {
  margin:  calc(var(--default-subtitle-mt) / 4) 0 calc(var(--default-subtitle-mb) / 4) 0 !important;
  padding: calc(var(--default-subtitle-pv) / 4) calc(var(--default-subtitle-ph) / 4) !important;
}

.sidebar .nav .nav-item {
  --default-nav-item-ph: 5px;
  padding:               0 calc(var(--default-nav-item-ph) / 4);
}

.sidebar-compact .sidebar:hover .nav .nav-item,
.sidebar-icon .sidebar:hover .nav .nav-item {
  padding: 0 calc(var(--default-nav-item-ph) / 4) !important;
}

.sidebar .nav .nav-item .nav-link {
  --default-nav-link-mb: 5px;
  --default-nav-link-p:  8px;
  display:               flex;
  margin-bottom:         calc(var(--default-nav-link-mb) / 4) !important;
  padding:               calc(var(--default-nav-link-p) / 4);
}

.sidebar-compact .sidebar:hover .nav .nav-item .nav-link,
.sidebar-icon .sidebar:hover .nav .nav-item .nav-link {
  margin-bottom: calc(var(--default-nav-link-mb) / 4) !important;
  padding:       calc(var(--default-nav-link-p) / 4) !important;
}

.sidebar-compact .sidebar .nav .nav-item > .nav-link,
.sidebar-icon .sidebar .nav .nav-item > .nav-link {
  align-items:   center;
  margin-bottom: 1px !important;
  padding:       1px !important;
}

.sidebar-compact .sidebar .nav .nav-item > .nav-link span,
.sidebar-icon .sidebar .nav .nav-item > .nav-link span {
  -webkit-line-clamp: 1;
  display:            -webkit-box;
  line-clamp:         1;
  overflow:           hidden;
  text-overflow:      ellipsis;
}

.sidebar-compact .sidebar .nav .nav-item > .nav-link span:first-child,
.sidebar-icon .sidebar .nav .nav-item > .nav-link span:first-child {
  margin:     0 2px;
  min-height: 20px;
}

.sidebar-compact .sidebar .nav .nav-item > .nav-link span:first-child:not(.material-icons),
.sidebar-icon .sidebar .nav .nav-item > .nav-link span:first-child:not(.material-icons) {
  line-height: 24px;
}

.sidebar .nav .nav-item .nav-link .icon {
  --default-nav-link-icon-mr: 10px;
  margin-bottom:              0 !important;
  margin-left:                0 !important;
  margin-right:               calc(var(--default-nav-link-icon-mr) / 4) !important;
  min-width:                  24px;
}

.sidebar-compact .sidebar:not(:hover) .nav .nav-item > .nav-link .icon,
.sidebar-icon .sidebar:not(:hover) .nav .nav-item > .nav-link .icon {
  margin-right: 3px !important;
}

.sidebar-icon .sidebar:not(:hover) .nav .nav-item > .nav-link .icon {
  height:       24px;
  margin-right: 0 !important;
  padding:      2px 0;
  width:        100%;
}

.sidebar-icon .sidebar:not(:hover) .nav .nav-item > .nav-link .icon + span {
  display: none !important;
}

.sidebar-icon .sidebar:not(:hover) .nav .nav-item > .nav-link .icon > span {
  display:   inline-block;
  height:    26px;
  min-width: 18px;
  overflow:  auto;
}

.sidebar .nav .nav-item .nav-link .arrow {
  --default-nav-link-arrow-right: 0px;
  right:                          calc(var(--default-nav-link-arrow-right) / 4);
}

.sidebar .nav .nav-item > .nav {
  --default-nav-subnav-pl: 26px;
  padding-left:            calc(var(--default-nav-subnav-pl) / 4) !important;
}

.sidebar-compact .sidebar:not(:hover) .nav .nav-item > .nav,
.sidebar-icon .sidebar:not(:hover) .nav .nav-item > .nav {
  margin-bottom: 2px;
}

.sidebar .nav .nav-item > .nav .nav-item {
  --default-nav-subitem-ph: 10px;
  padding:                  0 calc(var(--default-nav-subitem-ph) / 4);
}

.tab-bar .tab a:hover {
  text-decoration: none;
}

.tab-bar .tab.active a {
  color:  unset;
  cursor: default;
}

.tab-bar .tab .close-tab {
  height:  20px;
  padding: 0;
  width:   20px;
}

.tab-bar .tab .close-tab .material-icons {
  font-size: 24px;
  margin:    -3px 0 0 -3px;
}

.table tbody tr td,
.table thead tr th {
  --default-td-ph: .5rem;
  --default-td-pv: .75rem;
  padding:         calc(var(--default-td-pv) / 4) calc(var(--default-td-ph) / 4);
}

body > .wrapper {
  --default-wrapper-p: 8px;
  height:              unset;
  padding:             calc(var(--default-wrapper-p) / 4);
}

body > .wrapper > .content {
  background-attachment: unset;
}

img.disabled { filter: grayscale(100%); }

.avatar img {
  height:     100%;
  object-fit: cover;
  width:      100%;
}

.container#header-container,
.container-fluid.header-container,
.container-fluid#header-container {
  --default-header-container-ph: 8px;
  padding-left:                  calc(var(--default-header-container-ph) / 4);
  padding-right:                 calc(var(--default-header-container-ph) / 4);
}

.dragging-ghost {
  background: #C8EBFB;
  opacity:    .5;
}

.navbar {
  --default-navbar-ph: 1.125rem;
  --default-navbar-pv: .5rem;
  padding:             calc((var(--default-navbar-pv) / 1.5) - 2px) var(--default-navbar-ph) calc(var(--default-navbar-pv) / 1.5) var(--default-navbar-ph);
}

.navbar-expand .navbar-nav .nav-link[data-target="#themepicker"] > i {
  margin-top: -4px;
}

.header .navbar {
  --default-navbar-ph: 1.125rem;
  padding-left:        calc(var(--default-navbar-ph) / .8);
  padding-right:       calc(var(--default-navbar-ph) / .8);
}

.header .navbar .nav-link,.header .navbar .btn {
  --default-header-nav-btn-ph: .3rem;
  padding-left:                calc(var(--default-header-nav-btn-p) / 4);
  padding-right:               calc(var(--default-header-nav-btn-p) / 4);
}

.closePersonalize {
  padding-top: 7px;
  z-index:     2;
}

#page-content {
  overflow-x: auto;
}

.fit-content {
  white-space: nowrap;
  width:       1%;
}

details:not([open]) summary.plus-minus::marker {
  content: '+ ';
}

details[open] summary.plus-minus::marker {
  content: '– ';
}

figure.uploading {
  cursor:         default !important;
  opacity:        .5;
  pointer-events: none;
}

h5 {
  --default-h5-mb: .5rem;
  margin-bottom:   calc(var(--default-h5-mb) / 4);
}

table {
  --default-table-mb: .75rem;
  margin-bottom:      calc(var(--default-table-mb) / 4) !important;
}

table thead tr.sticky-top > * {
  backdrop-filter: blur(4px) brightness(1.15);
}

table td .btn:not([type='submit']) {
  height:  24px;
  padding: 2px !important;
  width:   24px;
}

table td .btn.cancel,
table td .btn.delete {
  padding: 1px !important;
}

table td .btn .material-icons {
  font-size: calc(100% + 4px);
}

div.dragging, figure.dragging, table tr.dragging {
  background: #00000026;
  opacity:    .5;
}

table.align-top td {
  vertical-align: top !important;
}

head:has(meta[name="theme"][content="black-dark"]) +
body .btn.btn-primary-template {
  background: #999999;
  border:     none;
  color:      #FFFFFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="black-dark"]) +
body .btn.btn-primary-template:hover {
  background: #999999CC;
  border:     none;
}

head:has(meta[name="theme"][content="black-dark"]) +
body .btn.btn-primary-template:active {
  background: #99999999;
  border:     none;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body .btn.btn-primary-template {
  background: #5B92FF;
  border:     none;
  color:      #FFFFFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body .btn.btn-primary-template:hover {
  background: #5B92FFCC;
  border:     none;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body .btn.btn-primary-template:active {
  background: #5B92FF99;
  border:     none;
}

head:has(meta[name="theme"][content="purple-dark"]) +
body .btn.btn-primary-template {
  background: #A68FF2;
  border:     none;
  color:      #FFFFFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="purple-dark"]) +
body .btn.btn-primary-template:hover {
  background: #A68FF2CC;
  border:     none;
}

head:has(meta[name="theme"][content="purple-dark"]) +
body .btn.btn-primary-template:active {
  background: #A68FF299;
  border:     none;
}

head:has(meta[name="theme"][content="blue-dark"]) +
body .btn.btn-primary-template {
  background: #A5C4FF;
  border:     none;
  color:      #FFFFFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="blue-dark"]) +
body .btn.btn-primary-template:hover {
  background: #A5C4FFCC;
  border:     none;
}

head:has(meta[name="theme"][content="blue-dark"]) +
body .btn.btn-primary-template:active {
  background: #A5C4FF99;
  border:     none;
}

head:has(meta[name="theme"][content="green-dark"]) +
body .btn.btn-primary-template {
  background: #74D09D;
  border:     none;
  color:      #FFFFFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="green-dark"]) +
body .btn.btn-primary-template:hover {
  background: #74D09DCC;
  border:     none;
}

head:has(meta[name="theme"][content="green-dark"]) +
body .btn.btn-primary-template:active {
  background: #74D09D99;
  border:     none;
}

head:has(meta[name="theme"][content="pista-dark"]) +
body .btn.btn-primary-template {
  background: #DBF7BF;
  border:     none;
  color:      #366500;
  transition: background-color .3s, color .3s;
}

head:has(meta[name="theme"][content="pista-dark"]) +
body .btn.btn-primary-template:hover {
  background: #DBF7BFCC;
  border:     none;
}

head:has(meta[name="theme"][content="pista-dark"]) +
body .btn.btn-primary-template:active {
  background: #DBF7BF99;
  border:     none;
  color:      #FFFFFF;
}

head:has(meta[name="theme"][content="orange-dark"]) +
body .btn.btn-primary-template {
  background: #FFD4AF;
  border:     none;
  color:      #D95300;
  transition: background-color .3s, color .3s;
}

head:has(meta[name="theme"][content="orange-dark"]) +
body .btn.btn-primary-template:hover {
  background: #FFD4AFCC;
  border:     none;
}

head:has(meta[name="theme"][content="orange-dark"]) +
body .btn.btn-primary-template:active {
  background: #FFD4AF99;
  border:     none;
  color:      #FFFFFF;
}

head:has(meta[name="theme"][content="tomato-dark"]) +
body .btn.btn-primary-template {
  background: #FFC2CB;
  border:     none;
  color:      #E22440;
  transition: background-color .3s, color .3s;
}

head:has(meta[name="theme"][content="tomato-dark"]) +
body .btn.btn-primary-template:hover {
  background: #FFC2CBCC;
  border:     none;
}

head:has(meta[name="theme"][content="tomato-dark"]) +
body .btn.btn-primary-template:active {
  background: #FFC2CB99;
  border:     none;
  color:      #FFFFFF;
}

head:has(meta[name="theme"][content="black-light"]) +
body .btn.btn-primary-template {
  background: #222222;
  border:     none;
  color:      #FFFFFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="black-light"]) +
body .btn.btn-primary-template:hover {
  background: #222222CC;
  border:     none;
}

head:has(meta[name="theme"][content="black-light"]) +
body .btn.btn-primary-template:active {
  background: #22222299;
  border:     none;
}

head:has(meta[name="theme"][content="darkblue-light"]) +
body .btn.btn-primary-template {
  background: #161E43;
  border:     none;
  color:      #FFFFFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="darkblue-light"]) +
body .btn.btn-primary-template:hover {
  background: #161E43CC;
  border:     none;
}

head:has(meta[name="theme"][content="darkblue-light"]) +
body .btn.btn-primary-template:active {
  background: #161E4399;
  border:     none;
}

head:has(meta[name="theme"][content="purple-light"]) +
body .btn.btn-primary-template {
  background: #673AB7;
  border:     none;
  color:      #FFFFFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="purple-light"]) +
body .btn.btn-primary-template:hover {
  background: #673AB7CC;
  border:     none;
}

head:has(meta[name="theme"][content="purple-light"]) +
body .btn.btn-primary-template:active {
  background: #673AB799;
  border:     none;
}

head:has(meta[name="theme"][content="blue-light"]) +
body .btn.btn-primary-template {
  background: #4F7DFF;
  border:     none;
  color:      #FFFFFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="blue-light"]) +
body .btn.btn-primary-template:hover {
  background: #4F7DFFCC;
  border:     none;
}

head:has(meta[name="theme"][content="blue-light"]) +
body .btn.btn-primary-template:active {
  background: #4F7DFF99;
  border:     none;
}

head:has(meta[name="theme"][content="green-light"]) +
body .btn.btn-primary-template {
  background: #4CAF78;
  border:     none;
  color:      #FFFFFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="green-light"]) +
body .btn.btn-primary-template:hover {
  background: #4CAF78CC;
  border:     none;
}

head:has(meta[name="theme"][content="green-light"]) +
body .btn.btn-primary-template:active {
  background: #4CAF7899;
  border:     none;
}

head:has(meta[name="theme"][content="pista-light"]) +
body .btn.btn-primary-template {
  background: #5FAA15;
  border:     none;
  color:      #FFFFFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="pista-light"]) +
body .btn.btn-primary-template:hover {
  background: #5FAA15CC;
  border:     none;
}

head:has(meta[name="theme"][content="pista-light"]) +
body .btn.btn-primary-template:active {
  background: #5FAA1599;
  border:     none;
}

head:has(meta[name="theme"][content="orange-light"]) +
body .btn.btn-primary-template {
  background: #FF6A0D;
  border:     none;
  color:      #FFFFFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="orange-light"]) +
body .btn.btn-primary-template:hover {
  background: #FF6A0DCC;
  border:     none;
}

head:has(meta[name="theme"][content="orange-light"]) +
body .btn.btn-primary-template:active {
  background: #FF6A0D99;
  border:     none;
}

head:has(meta[name="theme"][content="tomato-light"]) +
body .btn.btn-primary-template {
  background: #F36B7F;
  border:     none;
  color:      #FFFFFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="tomato-light"]) +
body .btn.btn-primary-template:hover {
  background: #F36B7FCC;
  border:     none;
}

head:has(meta[name="theme"][content="tomato-light"]) +
body .btn.btn-primary-template:active {
  background: #F36B7F99;
  border:     none;
}

head:has(meta[name="theme"][content="black-dark"]) +
body table > tbody > tr:not(.even-group):nth-of-type(odd) > *,
head:has(meta[name="theme"][content="black-dark"]) +
body table > tbody > tr.odd-group > * {
  --bs-table-striped-bg: #00000040;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body table > tbody > tr:not(.even-group):nth-of-type(odd) > *,
head:has(meta[name="theme"][content="darkblue-dark"]) +
body table > tbody > tr.odd-group > *,
head:has(meta[name="theme"][content="purple-dark"]) +
body table > tbody > tr:not(.even-group):nth-of-type(odd) > *,
head:has(meta[name="theme"][content="purple-dark"]) +
body table > tbody > tr.odd-group > * {
  --bs-table-striped-bg: #00000026;
}

head:has(meta[name="theme"][content="purple-light"]) +
body table > tbody > tr:not(.even-group):nth-of-type(odd) > *,
head:has(meta[name="theme"][content="purple-light"]) +
body table > tbody > tr.odd-group > * {
  --bs-table-striped-bg: #0000000F;
}

head:has(meta[name="theme"][content="blue-light"]) +
body table > tbody > tr:not(.even-group):nth-of-type(odd) > *,
head:has(meta[name="theme"][content="blue-light"]) +
body table > tbody > tr.odd-group > *,
head:has(meta[name="theme"][content="green-light"]) +
body table > tbody > tr:not(.even-group):nth-of-type(odd) > *,
head:has(meta[name="theme"][content="green-light"]) +
body table > tbody > tr.odd-group > *,
head:has(meta[name="theme"][content="orange-light"]) +
body table > tbody > tr:not(.even-group):nth-of-type(odd) > *,
head:has(meta[name="theme"][content="orange-light"]) +
body table > tbody > tr.odd-group > *,
head:has(meta[name="theme"][content="tomato-light"]) +
body table > tbody > tr:not(.even-group):nth-of-type(odd) > *,
head:has(meta[name="theme"][content="tomato-light"]) +
body table > tbody > tr.odd-group > * {
  --bs-table-striped-bg: #0000000A;
}

head:has(meta[name="theme"][content="pista-light"]) +
body table > tbody > tr:not(.even-group):nth-of-type(odd) > *,
head:has(meta[name="theme"][content="pista-light"]) +
body table > tbody > tr.odd-group > * {
  --bs-table-striped-bg: #00000008;
}

table > tbody > tr:not(.even-group):nth-of-type(odd) > *,
table > tbody > tr.odd-group > * {
  --bs-table-striped-bg: #00000019;
  --bs-table-accent-bg:  var(--bs-table-striped-bg);
}

table tr.tr-accent > *, table tr > .cell-accent {
  backdrop-filter:  brightness(1.3);
  background-color: inherit;
  background-image: linear-gradient(#FFB12A40, #FFB12A40);
}

table tr.tr-accent-2 > *, table tr > .cell-accent-2 {
  background-color: inherit;
  background-image: linear-gradient(#CCEEFF50, #CCEEFF50);
}

table tr.tr-accent-3 > *, table tr > .cell-accent-3 {
  background-color: inherit;
  background-image: linear-gradient(#CAFF2A20, #CAFF2A20);
}

head:has(meta[name="theme"][content="black-dark"]) +
body .tab-bar-container {
  border-bottom: 1px solid #99999926;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body .tab-bar-container {
  border-bottom: 1px solid #5B92FF26;
}

head:has(meta[name="theme"][content="purple-dark"]) +
body .tab-bar-container {
  border-bottom: 1px solid #A68FF226;
}

head:has(meta[name="theme"][content="blue-dark"]) +
body .tab-bar-container {
  border-bottom: 1px solid #A5C4FF26;
}

head:has(meta[name="theme"][content="green-dark"]) +
body .tab-bar-container {
  border-bottom: 1px solid #74D09D26;
}

head:has(meta[name="theme"][content="pista-dark"]) +
body .tab-bar-container {
  border-bottom: 1px solid #DBF7BF26;
}

head:has(meta[name="theme"][content="orange-dark"]) +
body .tab-bar-container {
  border-bottom: 1px solid #FFD4AF26;
}

head:has(meta[name="theme"][content="tomato-dark"]) +
body .tab-bar-container {
  border-bottom: 1px solid #FFC2CB26;
}

head:has(meta[name="theme"][content="black-light"]) +
body .tab-bar-container {
  border-bottom: 1px solid #22222226;
}

head:has(meta[name="theme"][content="darkblue-light"]) +
body .tab-bar-container {
  border-bottom: 1px solid #161E4326;
}

head:has(meta[name="theme"][content="purple-light"]) +
body .tab-bar-container {
  border-bottom: 1px solid #673AB726;
}

head:has(meta[name="theme"][content="blue-light"]) +
body .tab-bar-container {
  border-bottom: 1px solid #4F7DFF26;
}

head:has(meta[name="theme"][content="green-light"]) +
body .tab-bar-container {
  border-bottom: 1px solid #4CAF7826;
}

head:has(meta[name="theme"][content="orange-light"]) +
body .tab-bar-container {
  border-bottom: 1px solid #FF6A0D26;
}

head:has(meta[name="theme"][content="tomato-light"]) +
body .tab-bar-container {
  border-bottom: 1px solid #F36B7F26;
}

head:has(meta[name="theme"][content="pista-light"]) +
body .tab-bar-container {
  border-bottom: 1px solid #5FAA1526;
}

.tab-bar-container .tab-bar-buttons > .btn, .tab-bar-container > .btn {
  height:  30px;
  padding: 2px 0;
  width:   30px;
}

head:has(meta[name="theme"][content="black-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #99999933;
  border-right: none;
}

head:has(meta[name="theme"][content="black-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #00000040;
  color:      #999999;
  transition: color .3s;
}

head:has(meta[name="theme"][content="black-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #99999980;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="black-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #99999933;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #5B92FF33;
  border-right: none;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #00000026;
  color:      #5B92FF;
  transition: color .3s;
}

head:has(meta[name="theme"][content="black-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.disabled) > a:hover,
head:has(meta[name="theme"][content="darkblue-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.disabled) > a:hover,
head:has(meta[name="theme"][content="purple-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.disabled) > a:hover,
head:has(meta[name="theme"][content="blue-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.disabled) > a:hover,
head:has(meta[name="theme"][content="green-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.disabled) > a:hover,
head:has(meta[name="theme"][content="pista-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.disabled) > a:hover,
head:has(meta[name="theme"][content="orange-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.disabled) > a:hover,
head:has(meta[name="theme"][content="tomato-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.disabled) > a:hover {
  color: #FFFFFF;
}

head:has(meta[name="theme"][content="black-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="darkblue-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="purple-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="blue-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="green-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="pista-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="orange-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="tomato-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="black-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="darkblue-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="purple-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="blue-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="green-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="pista-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="orange-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active,
head:has(meta[name="theme"][content="tomato-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active {
  border: none;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #5B92FF80;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #5B92FF33;
}

head:has(meta[name="theme"][content="purple-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #A68FF233;
  border-right: none;
}

head:has(meta[name="theme"][content="purple-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #00000026;
  color:      #A68FF2;
  transition: color .3s;
}

head:has(meta[name="theme"][content="purple-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #A68FF280;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="purple-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #A68FF233;
}

head:has(meta[name="theme"][content="blue-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #A5C4FF33;
  border-right: none;
}

head:has(meta[name="theme"][content="blue-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #00000019;
  color:      #A5C4FF;
  transition: color .3s;
}

head:has(meta[name="theme"][content="blue-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #A5C4FF80;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="blue-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #A5C4FF33;
}

head:has(meta[name="theme"][content="green-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #74D09D33;
  border-right: none;
}

head:has(meta[name="theme"][content="green-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #00000019;
  color:      #74D09D;
  transition: color .3s;
}

head:has(meta[name="theme"][content="green-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #74D09D80;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="green-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #74D09D33;
}

head:has(meta[name="theme"][content="pista-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #DBF7BF33;
  border-right: none;
}

head:has(meta[name="theme"][content="pista-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #00000019;
  color:      #DBF7BF;
  transition: color .3s;
}

head:has(meta[name="theme"][content="pista-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #DBF7BF80;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="pista-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #DBF7BF33;
}

head:has(meta[name="theme"][content="orange-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #FFD4AF33;
  border-right: none;
}

head:has(meta[name="theme"][content="orange-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #00000019;
  color:      #FFD4AF;
  transition: color .3s;
}

head:has(meta[name="theme"][content="orange-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #FFD4AF80;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="orange-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #FFD4AF33;
}

head:has(meta[name="theme"][content="tomato-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #FFC2CB33;
  border-right: none;
}

head:has(meta[name="theme"][content="tomato-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #00000019;
  color:      #FFC2CB;
  transition: color .3s;
}

head:has(meta[name="theme"][content="tomato-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #FFC2CB80;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="tomato-dark"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #FFC2CB33;
}

head:has(meta[name="theme"][content="black-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #22222233;
  border-right: none;
}

head:has(meta[name="theme"][content="black-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #00000019;
  color:      #222222;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="black-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.active):not(.disabled) > a:hover {
  background: #22222233;
}

head:has(meta[name="theme"][content="black-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #222222CC;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="black-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #22222233;
}

head:has(meta[name="theme"][content="darkblue-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #161E4333;
  border-right: none;
}

head:has(meta[name="theme"][content="darkblue-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #00000019;
  color:      #161E43;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="darkblue-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.active):not(.disabled) > a:hover {
  background: #161E4333;
}

head:has(meta[name="theme"][content="darkblue-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #161E43CC;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="darkblue-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #161E4333;
}

head:has(meta[name="theme"][content="purple-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #673AB733;
  border-right: none;
}

head:has(meta[name="theme"][content="purple-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #0000000F;
  color:      #673AB7;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="purple-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.active):not(.disabled) > a:hover {
  background: #673AB733;
}

head:has(meta[name="theme"][content="purple-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #673AB7CC;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="purple-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #673AB733;
}

head:has(meta[name="theme"][content="blue-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #4F7DFF33;
  border-right: none;
}

head:has(meta[name="theme"][content="blue-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #0000000A;
  color:      #4F7DFF;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="blue-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.active):not(.disabled) > a:hover {
  background: #4F7DFF33;
}

head:has(meta[name="theme"][content="blue-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #4F7DFFCC;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="blue-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #4F7DFF33;
}

head:has(meta[name="theme"][content="green-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #4CAF7833;
  border-right: none;
}

head:has(meta[name="theme"][content="green-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #0000000A;
  color:      #4CAF78;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="green-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.active):not(.disabled) > a:hover {
  background: #4CAF7833;
}

head:has(meta[name="theme"][content="green-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #4CAF78CC;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="green-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #4CAF7833;
}

head:has(meta[name="theme"][content="pista-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #5FAA1533;
  border-right: none;
}

head:has(meta[name="theme"][content="pista-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #00000008;
  color:      #5FAA15;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="pista-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.active):not(.disabled) > a:hover {
  background: #5FAA1533;
}

head:has(meta[name="theme"][content="pista-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #5FAA15CC;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="pista-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #5FAA1533;
}

head:has(meta[name="theme"][content="orange-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #FF6A0D33;
  border-right: none;
}

head:has(meta[name="theme"][content="orange-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #0000000A;
  color:      #FF6A0DCC;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="orange-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.active):not(.disabled) > a:hover {
  background: #FF6A0D33;
}

head:has(meta[name="theme"][content="orange-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #FF6A0DCC;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="orange-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #FF6A0D33;
}

head:has(meta[name="theme"][content="tomato-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li {
  border:       1px solid #F36B7F33;
  border-right: none;
}

head:has(meta[name="theme"][content="tomato-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li > a {
  background: #0000000A;
  color:      #F36B7FCC;
  transition: background-color .3s;
}

head:has(meta[name="theme"][content="tomato-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:not(.active):not(.disabled) > a:hover {
  background: #F36B7F33;
}

head:has(meta[name="theme"][content="tomato-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li.active > a {
  background:  #F36B7FCC;
  color:       #FFFFFF;
  font-weight: bold;
}

head:has(meta[name="theme"][content="tomato-light"]) +
body .pagination-wrapper .paginationjs .paginationjs-pages li:last-child {
  border-right: 1px solid #F36B7F33;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body .select2-container--default .select2-selection--single {
  background: #161E4380;
  border:     1px solid #0000000D;
  color:      #FFFFFF;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #FFFFFF;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: #FFFFFF transparent transparent transparent;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent #FFFFFF transparent;
}

head:has(meta[name="theme"][content="darkblue-dark"]) +
body .select2-container--open .select2-dropdown--below:before,
head:has(meta[name="theme"][content="darkblue-dark"]) +
body .select2-container--open .select2-dropdown--above:before {
  background: #5B92FFB3;
}

.panes {
  height: calc(100vh - 54px);
}

.panes > *:not(.resizer) {
  height:   100%;
  overflow: auto;
}

.panes > .resizer {
  background: #80808080;
  cursor:     col-resize;
  height:     100%;
  width:      5px;
}

.panes > .resizer .to-left,
.panes > .resizer .to-right {
  height:  32px;
  opacity: .33;
}

.panes > .resizer .to-left:hover,
.panes > .resizer .to-right:hover { opacity: 1; }

.panes > .resizer .to-left  { right: 5px; }
.panes > .resizer .to-right { left:  5px; }

.sw-main {
  border: none;
}

.sw-theme-arrows > ul.step-anchor > li {
  min-height: 30px;
}

/* Use clip-path with a px offset derived from element height so the angle stays constant.
   Approach:
     --step-height : высота шага в px (по умолчанию 40px; лучше переопределить в теме или у элемента)
     --arrow-tan   : тангенс желаемого угла (например для 20deg ≈ 0.36397)
     --arrow-offset: вычисляемое смещение в px = height * tan(angle)

   clip-path использует calc(100% - var(--arrow-offset)) — это даёт постоянный угол при условии,
   что --step-height соответствует реальной высоте элемента (можно задать явно или переопределить).
*/
/* Базовые переменные и минимальные стили для всех ссылок-элементов шагов */
.sw-theme-arrows > ul.step-anchor > li > a {
  --arrow-angle:   12deg;
  --arrow-tan:     .21256; /* tan(12deg) */
  --step-height:   40px; /* по умолчанию — переопределите в теме при необходимости */
  --arrow-offset:  calc(var(--step-height) * var(--arrow-tan));
  display:         flex;
  flex-direction:  column;
  justify-content: center;
  line-height:     1;
  padding:         0 12px;
  /* по умолчанию позиционируем, чтобы z-index работал корректно */
  position: relative;
  z-index:  1;
}

/* Последний элемент — стрелка вправо, но перекрывать следующий не нужно */
.sw-theme-arrows > ul.step-anchor > li:last-child > a {
  -webkit-clip-path: polygon(0 0, calc(100% - var(--arrow-offset)) 0, 100% 50%, calc(100% - var(--arrow-offset)) 100%, 0 100%);
  clip-path:         polygon(0 0, calc(100% - var(--arrow-offset)) 0, 100% 50%, calc(100% - var(--arrow-offset)) 100%, 0 100%);
/*height:            var(--step-height);*/
  overflow:          hidden;
  padding-right:     calc(var(--arrow-offset) + 12px);
}

/* Активные и выполненные шаги — их скошенная часть должна накладываться на следующий элемент */
.sw-theme-arrows > ul.step-anchor > li.active > a,
.sw-theme-arrows > ul.step-anchor > li.done > a {
  -webkit-clip-path: polygon(0 0, calc(100% - var(--arrow-offset)) 0, 100% 50%, calc(100% - var(--arrow-offset)) 100%, 0 100%);
  clip-path:         polygon(0 0, calc(100% - var(--arrow-offset)) 0, 100% 50%, calc(100% - var(--arrow-offset)) 100%, 0 100%);
/*height:            var(--step-height);*/
  /* отрицательный margin-right сдвигает элемент вправо и позволяет треугольнику
     перекрывать следующий элемент */
  margin-right:  calc(var(--arrow-offset) * -1);
  overflow:      visible; /* нужно, чтобы треугольник мог выходить за пределы и быть видимым */
  padding-right: calc(var(--arrow-offset) + 12px);
  z-index:       2; /* выше, чем у соседних ссылок */
}

/* Если .done непосредственно перед .active, пусть .done накладывается поверх active */
.sw-theme-arrows > ul.step-anchor > li.done:has(+ li.active) > a {
  /* такие же параметры перекрытия, но выше по z-index, чтобы закрывать active */
  overflow:     visible;
  margin-right: calc(var(--arrow-offset) * -1);
  z-index:      3;
}

/* It's supposed to look like a tree diagram */
.tree, .tree ul, .tree li {
  list-style: none;
  margin:     0;
  padding:    0;
  position:   relative;
}

.tree {
  margin:     0 0 1em;
  text-align: center;
}

.tree .select2-selection__rendered {
  text-align: start;
}

.tree, .tree ul {
  display: table;
}

.tree ul {
  width: 100%;
}

.tree li {
  display:        table-cell;
  padding:        .5em 0;
  vertical-align: top;
}
/* _________ */
.tree li:before {
  outline:  solid 1px #666;
  content:  "";
  left:     0;
  position: absolute;
  right:    0;
  top:      0;
}

.tree li:first-child:before { left:  50%; }
.tree li:last-child:before  { right: 50%; }

.tree code, .tree span:not(.select2):not(.selection):not(.select2-selection):not(.select2-selection__rendered):not(.select2-selection__arrow):not(.dropdown-wrapper) {
  border:        solid .1em #666;
  border-radius: .2em;
  display:       inline-block;
  margin:        0 .2em .5em;
  padding:       .2em .5em;
  position:      relative;
}
/* If the tree represents DOM structure */
.tree code {
  font-family: monaco, Consolas, 'Lucida Console', monospace;
}
/* | */
.tree ul:before,
.tree code:before,
.tree span:not(.select2):not(.selection):not(.select2-selection):not(.select2-selection__rendered):not(.select2-selection__arrow):not(.dropdown-wrapper):before {
  outline:  solid 1px #666;
  content:  "";
  height:   .5em;
  left:     50%;
  position: absolute;
}

.tree ul:before {
  top: -.5em;
}
.tree code:before,
.tree span:not(.select2):not(.selection):not(.select2-selection):not(.select2-selection__rendered):not(.select2-selection__arrow):not(.dropdown-wrapper):before {
  top: -.55em;
}

/* The root node doesn't connect upwards */
.tree > li {margin-top: 0;}
.tree > li:before,
.tree > li:after,
.tree > li > code:before,
.tree > li > span:before {
  outline: none;
}

@media (min-width: 992px) {

  #themepicker .modal-lg {
    max-width: 840px;
  }

}