/* Authelia sisselogimislehe viimistlus.
 *
 * Authelia ise kohandatud CSS-i ei toeta (asset_path votab ainult favicon.ico,
 * logo.png ja tolked), nii et nginx lisab selle faili lehe paisesse.
 * Siin on ainult kujundus - ukski reegel ei puutu vormi toimimist.
 *
 * Probleem, mida see lahendab: valjad on 56px korged, sildile jaab ulal 4px
 * ja sisestatud tekstile alla 6px. Silt on peaaegu vastu aart ja vaartus on
 * surutud pohja - kaks rida uhte kasti kokku pressitud.
 */

/* Rohkem korgust, nii et silt ja vaartus ei ole teineteise kaelas */
input[data-slot="floating-input"] {
  height: 64px !important;
  padding-top: 27px !important;
  padding-bottom: 11px !important;
}

/* Kahanenud silt: vaiksem ja aarest kaugemal, et see oleks selgelt silt
   ja mitte teine sisestusrida */
label[for$="-textfield"] {
  line-height: 1.2 !important;
}
label[for$="-textfield"].top-1,
/* NB: paroolihaldur taidab valja ilma input-sundmuseta, nii et Authelia
   React-olek jaab "tuhjaks" ja silt jaab suurde tsentreeritud asendisse -
   otse sisestatud teksti peale. Placeholder on labipaistev, nii et
   :not(:placeholder-shown) utleb meile toe: valjal ON vaartus. */
input[data-slot="floating-input"]:not(:placeholder-shown) + label,
input[data-slot="floating-input"]:-webkit-autofill + label {
  top: 11px !important;
  font-size: 11px !important;
  letter-spacing: .05em;
  text-transform: uppercase;
  opacity: .72;
  transform: none !important;   /* -translate-y-1/2 maha */
}

/* Chrome varvib automaatselt taidetud valja heledaks - tumedal teemal
   paistab see plekina. Pikk uleminek hoiab algse tausta ja varvi. */
input[data-slot="floating-input"]:-webkit-autofill,
input[data-slot="floating-input"]:-webkit-autofill:hover,
input[data-slot="floating-input"]:-webkit-autofill:focus {
  -webkit-text-fill-color: currentColor;
  transition: background-color 9999s ease-in-out 0s;
}

/* Parooli silmanupp jargib uut korgust */
button[aria-label*="password" i],
input[data-slot="floating-input"] ~ button {
  top: 50% !important;
  transform: translateY(-50%) !important;
}

/* Tunnusmark veidi vaiksem - praegu vottab pool ekraani */
#UserSvg { width: 3rem !important; }

/* "Reset password?" rippus paremas servas. Vanem on flex justify-end,
   nii et automaatsed kuljemarginaalid toovad nupu keskele. */
#reset-password-button {
  margin-left: auto !important;
  margin-right: auto !important;
  font-size: 14px !important;
}

/* Telefonis servadele veidi rohkem ohku */
@media (max-width: 420px) {
  #first-factor-stage > div { padding-left: 1.25rem; padding-right: 1.25rem; }
}
