/* Sorted DM branding for the SFTPGo upload portal
   Brand colours taken from the Sorted logo:
   charcoal #231F20 · blue #426888 · red #A41221 · orange #C07D0A · lime #CCE533 */

/* Light theme: buttons, links and highlights in Sorted blue */
:root,
[data-bs-theme="light"] {
  --bs-primary: #426888;
  --bs-primary-rgb: 66, 104, 136;
  --bs-primary-active: #34536D;
  --bs-primary-light: #E8EEF3;
  --bs-primary-inverse: #FFFFFF;
  --bs-primary-clarity: rgba(66, 104, 136, 0.2);
  --bs-text-primary: #426888;
  --bs-link-color: #426888;
  --bs-link-color-rgb: 66, 104, 136;
  --bs-link-hover-color: #34536D;
  --bs-link-hover-color-rgb: 52, 83, 109;
  --bs-component-active-bg: #426888;
  --bs-component-hover-color: #426888;
  --bs-focus-ring-color: rgba(66, 104, 136, 0.25);
  --bs-danger: #A41221;
  --bs-danger-rgb: 164, 18, 33;
  --bs-danger-active: #85101B;
}

/* Dark theme: a lighter blue so text stays readable on dark backgrounds */
[data-bs-theme="dark"] {
  --bs-primary: #426888;
  --bs-primary-rgb: 66, 104, 136;
  --bs-primary-active: #5381A8;
  --bs-primary-light: #1F2A35;
  --bs-primary-inverse: #FFFFFF;
  --bs-text-primary: #8FB0CC;
  --bs-link-color: #8FB0CC;
  --bs-link-color-rgb: 143, 176, 204;
  --bs-link-hover-color: #B3CBDF;
  --bs-link-hover-color-rgb: 179, 203, 223;
  --bs-component-active-bg: #426888;
  --bs-component-hover-color: #8FB0CC;
}

/* Primary buttons */
.btn.btn-primary {
  background-color: #426888 !important;
  border-color: #426888 !important;
  color: #FFFFFF !important;
}
.btn.btn-primary:hover,
.btn.btn-primary:focus,
.btn.btn-primary:active {
  background-color: #34536D !important;
  border-color: #34536D !important;
}

/* Form fields: brand-blue focus outline */
.form-control:focus,
.form-select:focus {
  border-color: #426888 !important;
  box-shadow: 0 0 0 0.2rem rgba(66, 104, 136, 0.2) !important;
}

/* Login card: thin stripe in the four logo colours along the top edge */
.app-blank .shadow-sm.rounded {
  position: relative;
  overflow: hidden;
}
.app-blank .shadow-sm.rounded::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 5px;
  background: linear-gradient(to right,
    #A41221 0 25%, #C07D0A 25% 50%, #426888 50% 75%, #CCE533 75% 100%);
}

/* Dark theme: the logo's black lettering would vanish, so sit it on white */
[data-bs-theme="dark"] img[alt="Logo"] {
  background: #FFFFFF;
  border-radius: 8px;
  padding: 6px 10px;
}

/* ---- Login page tweaks ---- */

/* White page background (light theme) */
[data-bs-theme="light"] body.app-blank,
[data-bs-theme="light"] .app-blank #app_root,
[data-bs-theme="light"] .app-blank #app_root > div {
  background: #FFFFFF !important;
  background-image: none !important;
}

/* Keep the login box visible on the white page */
[data-bs-theme="light"] .app-blank .shadow-sm.rounded {
  border: 1px solid #E3E3E3;
  box-shadow: 0 4px 18px rgba(35, 31, 32, 0.08) !important;
}

/* Hide the short name beside the logo and centre the logo above the form */
#sign_in_form .container .row > .col-7 {
  display: none;
}
#sign_in_form .container .row > .col-5 {
  flex: 0 0 100%;
  max-width: 100%;
  text-align: center;
}
#sign_in_form .container .row > .col-5 img[alt="Logo"] {
  display: inline-block;
  max-width: 100%;
}