:root {
  --bs-body-color:#20354d;
  --bs-body-bg:#eef2f7;
  --bs-border-color:#d6e0eb;
  --bs-link-color:#215587;
  --bs-link-hover-color:#16395b;
}
body {
  background:#eef2f7;
  font-family:system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:1rem;
}
.main-container {
  width:100%!important;
  max-width:1120px;
  padding:24px 20px 36px!important;
}
.main-container > header {
  background:#152f50;
  border:0!important;
  border-bottom:3px solid #f39150!important;
  border-radius:8px;
  padding:20px 24px!important;
  margin-bottom:20px!important;
  gap:24px;
  justify-content:space-between;
}
header > .col-8 {
  flex:1 1 auto;
  min-width:0;
  width:auto;
}
header > .col-4 {
  flex:0 1 290px;
  min-width:0;
  width:auto;
}
.hc-brand {
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:20px;
}
.hc-brand img {
  width:110px!important;
  max-width:100%!important;
  height:auto!important;
  box-sizing:content-box;
  background:#fff;
  padding:9px 12px;
  border-radius:5px;
}
.hc-subtitle {
  color:#e1eaf5;
  font-size:.875rem;
  font-weight:650;
  line-height:1.6;
  letter-spacing:.06em;
  max-width:175px;
}
header .form-select,
header .form-select:disabled {
  background-color:#203f63;
  color:#f2f6fb;
  border-color:#607a96;
  font-size:.875rem;
  opacity:1;
}
header .form-select:disabled {
  background-image:none;
  padding-right:.75rem;
}
main > .row {
  margin:0 0 18px!important;
  padding-bottom:0!important;
}
main > .row > .card {
  padding:0;
  border:1px solid #d6e0eb;
  border-radius:7px;
  box-shadow:none!important;
  background:#fff;
}
main > .row > .card > .card-body {
  padding:20px 22px!important;
}
.card-title {
  font-size:1.125rem!important;
  font-weight:750;
  color:#183b60;
  padding-bottom:12px;
  margin-bottom:16px!important;
  border-bottom:1px solid #e3eaf2;
}
.text-muted { color:#52667d!important; }
label.text-muted { font-size:.875rem; font-weight:600; }
.form-control,.form-select,.input-group-text,.btn {
  min-height:42px;
  border-radius:5px;
}
.form-control,.form-select {
  color:#233c55;
  border-color:#bdcbda;
}
.form-control[readonly] { background:#f6f8fb; }
.form-control::placeholder { color:#60738a; }
.input-group-text {
  background:#edf2f7;
  color:#36516d;
  border-color:#bdcbda;
}
.form-control:focus,.form-select:focus {
  border-color:#3977ad;
  box-shadow:0 0 0 3px #3977ad26;
}
.btn { font-weight:650; }
.btn-outline-secondary {
  --bs-btn-color:#315775;
  --bs-btn-border-color:#bdcbda;
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg:#244e76;
  --bs-btn-hover-border-color:#244e76;
  --bs-btn-active-bg:#173b5d;
  --bs-btn-active-color:#fff;
}
#executeButton,.btn-primary {
  --bs-btn-bg:#f39150;
  --bs-btn-border-color:#f39150;
  --bs-btn-color:#192d44;
  --bs-btn-hover-bg:#ffa568;
  --bs-btn-hover-border-color:#ffa568;
  --bs-btn-hover-color:#192d44;
  --bs-btn-active-bg:#e8823e;
  --bs-btn-active-border-color:#e8823e;
  --bs-btn-active-color:#192d44;
  --bs-btn-disabled-bg:#f7b68b;
  --bs-btn-disabled-border-color:#f7b68b;
  --bs-btn-disabled-color:#192d44;
  min-width:130px;
  padding:.55rem 1.2rem;
}
.form-check-input:checked {
  background-color:#244e76;
  border-color:#244e76;
}
a:focus-visible,button:focus-visible,input:focus-visible {
  outline:3px solid #3977ad;
  outline-offset:3px;
}
#outputCard {
  background:#0d1d30!important;
  color:#deebf9!important;
  border:1px solid #294661;
  border-left:3px solid #f39150;
  box-shadow:none!important;
  padding:18px!important;
  border-radius:5px;
  min-width:0;
}
#outputContent {
  font-family:ui-monospace,Consolas,"Liberation Mono",monospace;
  font-size:.875rem;
  line-height:1.7;
  overflow-x:auto;
  max-width:100%;
}
main > .row:first-child .col-md-5:has(
  input[readonly][value=""]
) { display:none; }
@media(min-width:768px) {
  main > .row:first-child .row:has(
    > .col-md-5 input[readonly][value=""]
  ) > .col-md-3,
  main > .row:first-child .row:has(
    > .col-md-5 input[readonly][value=""]
  ) > .col-md-4 { width:50%; }
}
@media(max-width:767px) {
  .main-container { padding:12px!important; }
  .main-container > header {
    flex-direction:column;
    align-items:stretch!important;
    gap:18px;
    padding:18px!important;
  }
  header > .col-8,header > .col-4 { width:100%; flex:none; }
  main > .row > .card > .card-body { padding:16px!important; }
  main > .row:first-child .row > div { margin-bottom:12px; }
  .hc-brand { flex-wrap:wrap; gap:14px; }
  .hc-brand img { width:90px!important; }
}