:root {
  --observablehq-max-width: 1720px;
  --observablehq-sidebar-max-width: 200px;
  --observablehq-inset-left: calc(272px + 1rem);
}

#observablehq-sidebar-toggle:checked ~ #observablehq-center,
#observablehq-sidebar-toggle:indeterminate ~ #observablehq-center {
  --observablehq-inset-right: 1rem;
  padding-left: var(--observablehq-sidebar-max-width);
  padding-right: 1rem;
}
@media (min-width: calc(912px + 6rem)) {
  #observablehq-sidebar-toggle:checked ~ #observablehq-center,
  #observablehq-sidebar-toggle:indeterminate ~ #observablehq-center {
    --observablehq-inset-right: 1rem;
    padding-left: var(--observablehq-sidebar-max-width);
    padding-right: 1rem;
  }
}

body,
label,
#observablehq-sidebar,
#observablehq-title,
#observablehq-content,
#observablehq-toc,
#observablehq-main {
  font-family: "Roboto", Arial, sans-serif;
}
#observablehq-main {
  width: 100% !important;
}

#observablehq-footer {
  display: none;
}

#observablehq-block,
form,
table,
tr,
td,
th {
  font-family: "Roboto", Arial, sans-serif;
}

#observablehq-sidebar {
  width: var(--observablehq-sidebar-max-width) !important;
  --observablehq-sidebar-padding-left: 0px !important;
}

input[type="text"],
input[type="date"],
input[type="number"],
select {
  max-width: 150px;
  min-width: 150px;
  border-radius: 3px;
  border-color: rgb(150, 150, 150);
  border-width: 1px;
  border-style: solid;
  padding: 0.2rem 0.5rem;
}

input[type="text"]:focus,
input[type="date"]:focus,
input[type="number"]:focus,
select:focus {
  border-color: #007bff;
  box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.15);
  outline: none;
}
input[type="text"]:hover,
input[type="date"]:hover,
input[type="number"]:hover,
select:hover {
  border-color: #007bff;
}

input[type="file"] {
  border-style: none;
  color: transparent;
}

.search-input {
  display: block !important;
}

.search-input input {
  max-width: 160px;
}

table {
  margin-top: 50px;
  overflow-x: scroll;
  max-height: 300px;
}

table thead {
  font-weight: bold !important;
}

td form {
  max-width: 95px;
  min-width: 95px;
  align-items: center;
  text-align: center;
}

table td {
  min-width: 95px;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  align-items: center !important;
  text-align: center !important;
  max-width: 200px !important;
  overflow-wrap: break-word;
}

table form {
  margin: auto;
  min-width: 100%;
}

table input {
  margin: auto;
  width: 80%;
  text-align: center;
}

thead th {
  align-items: center !important;
  text-align: center !important;
  min-width: 95px;
  top: 0;
  z-index: 1;
  background-color: var(--theme-background-alt) !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}

td input {
  min-width: 80px !important;
}

.deca .deca-table-results {
  overflow-x: auto;
  max-height: 400px;
}

.table-input {
  display: block;
  width: 80px !important;
}

.table-input input {
  margin: auto;
  width: inherit !important;
}

td.sticky {
  position: sticky !important;
  left: 0;
  background: var(--theme-background-alt) !important;
  border-right: light-dark(rgb(212, 212, 212), rgb(59, 56, 56)) 1px solid;
}

th.sticky {
  z-index: 10 !important;
  position: sticky;
  left: 0;
  background: var(--theme-background-alt) !important;
  border-right: light-dark(rgb(212, 212, 212), rgb(59, 56, 56)) 1px solid;
}

.btn button,
.btn input::file-selector-button,
.file-btn label {
  border-radius: 5px;
  border: none;
  cursor: pointer;
  margin: 2px;
  min-height: 25px;
}

.btn {
  width: var(--button-width) !important;
}

.btn:hover {
  opacity: 0.8;
}

.blue-btn button,
.deca .blue-btn input::file-selector-button,
.file-btn.blue-btn label {
  background-color: #007bff;
  color: #fefefe !important;
}

.green-btn.button,
.green-btn button,
.deca .green-btn input::file-selector-button,
.file-btn.green-btn label {
  background-color: #28a745;
  color: #fefefe;
}

.red-btn button,
.deca .red-btn input::file-selector-button,
.file-btn.red-btn label {
  background-color: rgb(239, 76, 82);
  color: #fefefe;
}

.file-btn {
  display: flex;
  flex-direction: column;
  width: var(--label-width) !important;
  gap: 2px;
}

.file-btn label {
  max-height: 30px !important;
  display: block;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-weight: normal;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 25px;
  padding: 5px;
  font-size: small;
  font-weight: normal;
}

.file-btn input[type="file"]::file-selector-button {
  display: none;
}

.file-btn input[type="file"] {
  margin-left: 8px;
}

.process-buttons-section {
  margin-top: 35px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.remove-selected-button form {
  display: inline-block !important;
  width: auto !important;
}

.green-bg {
  background-color: rgb(169, 240, 185);
}

.green-input-bg input {
  background-color: light-dark(rgb(169, 240, 185), rgb(75, 124, 85));
}

.red-input-bg input {
  background-color: light-dark(rgb(243, 182, 166), rgb(159, 47, 19));
}

.red-bg {
  background-color: light-dark(rgb(243, 182, 166), rgb(159, 47, 19));
}

.yellow-bg {
  background-color: light-dark(rgb(255, 253, 146), rgb(167, 138, 49));
}

.yellow-input-bg input {
  background-color: light-dark(rgb(255, 253, 146), rgb(167, 138, 49));
}

.allow-override-checkbox {
  margin-top: 15px;
}

table td form {
  align-items: center;
  text-align: center;
  margin: auto;
}

/*collapse */

.deca-collapse-header {
  padding-top: 10px;
  border-radius: 8px 8px 0 0;
  background-color: light-dark(rgb(212, 212, 212), rgb(59, 56, 56));
  color: light-dark(rgb(0, 0, 0), rgb(255, 255, 255));
  font-size: smaller;
  height: 35px;
  cursor: pointer;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
}

.deca-collapse-header span {
  padding: 15px;
}

.deca-collapse-body {
  padding: 0 18px;
  display: none;
  overflow: hidden;
  border-style: solid;
  border-width: 0 1px 1px 1px;
  border-color: light-dark(rgb(212, 212, 212), rgb(59, 56, 56));
}

.collapse-active,
.deca-collapse-header:hover {
  background-color: light-dark(rgb(170, 169, 169), rgb(88, 88, 88));
}

/* Tabs CSS */
.tab {
  overflow: hidden;
  margin-top: 20px;
  background-color: light-dark(rgb(212, 212, 212), rgb(59, 56, 56));
  border-radius: 5px 5px 0 0;
}

.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
}

.tab button:hover {
  background-color: light-dark(rgb(170, 169, 169), rgb(88, 88, 88));
}

.tab button.active {
  background-color: light-dark(rgb(133, 133, 133), rgb(88, 88, 88));
  color: light-dark(rgb(255, 255, 255), rgb(255, 255, 255));
}

.tabcontent {
  display: none;
  padding: 6px 12px;
  border-top: none;
}

.tabcontent-active {
  display: block;
}

.deca .results-section {
  border-style: solid;
  border-width: 0 1px 1px 1px;
  border-color: light-dark(rgb(212, 212, 212), rgb(59, 56, 56));
  padding: 0 18px;
}

::-webkit-scrollbar {
  width: 5px;
  height: 7px;
}

::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px;
  background: light-dark(rgb(183, 183, 183), rgb(226, 226, 226));
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background: light-dark(rgb(69, 69, 69), rgb(90, 89, 89));
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: light-dark(rgb(90, 90, 90), rgb(138, 134, 134));
}

.spinner {
  border: 16px solid #f3f3f3;
  border-top: 16px solid #007bff;
  border-radius: 50%;
  width: 120px;
  height: 120px;
  animation: spin 2s linear infinite;
  position: fixed;
}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
  z-index: 9999; /* Ensure it is on top of other elements */
  display: flex;
  justify-content: center;
  align-items: center;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.inputs-3a86ea {
  font-family: "Roboto", sans-serif !important;
  font-size: small !important;
}

table.dataTable tbody tr > .dtfc-fixed-start,
table.dataTable tbody tr > .dtfc-fixed-end {
  z-index: 1;
  background-color: var(--theme-background-alt) !important;
}

table.dataTable thead tr > .dtfc-fixed-start,
table.dataTable thead tr > .dtfc-fixed-end,
table.dataTable tfoot tr > .dtfc-fixed-start,
table.dataTable tfoot tr > .dtfc-fixed-end {
  z-index: 1;
  background-color: var(--theme-background-alt) !important;
}

table.dataTable th.dt-type-numeric div.dt-column-header,
table.dataTable th.dt-type-numeric div.dt-column-footer,
table.dataTable th.dt-type-date div.dt-column-header,
table.dataTable th.dt-type-date div.dt-column-footer,
table.dataTable td.dt-type-numeric div.dt-column-header,
table.dataTable td.dt-type-numeric div.dt-column-footer,
table.dataTable td.dt-type-date div.dt-column-header,
table.dataTable td.dt-type-date div.dt-column-footer {
  flex-direction: row !important;
}

.dt-column-title {
  min-width: 95px;
}

.warning-text {
  color: #0d8504;
}
