/* The login page on the new Scoutbook's address (D-153): Warta's band as in the app's top bar (D-151) and the app's
   type and controls (scoutbook/static/css/app.css), over the first Scoutbook's look (D-124: the pitch, the card),
   which this file imports first. Caddy serves this file under the address of Authelia's only stylesheet and the rest
   of this folder under /authelia/static/nowy/ (deploy/server/scoutbook-nowy.caddy); the first Scoutbook's address
   (:8443) keeps its own page. Authelia keeps its rules in layers (@layer), so rules here, outside them, win without
   !important. */
@import url("/authelia/static/nowy/wyglad.css");

/* the app's font, from this folder */
@font-face {
  font-family: 'Geist'; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url('/authelia/static/nowy/geist-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
                 U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Geist'; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url('/authelia/static/nowy/geist-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329,
                 U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* every screen of the portal is the same card: the login and its stages (the first Scoutbook's look gives those theirs
   by their "-stage" id) and also the sign-out screen, which has no id; the same box Authelia gives all of them */
.min-h-\[90vh\] > div {
  background: #FFFFFF;
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .38), 0 2px 8px rgba(0, 0, 0, .18);
  padding: 28px 32px 20px;
  width: calc(100% - 32px);
  color: #18181B;
}

/* the club's band at the top of the card, as the app's bar: the crest on a white disc, "Warta Poznań", under it
   "Dział skautingu" (the texts are this file's; Authelia's logo holder is the only element there is) */
.min-h-\[90vh\] div:has(> img[alt="Logo"]) {
  display: grid;
  grid-template-columns: auto auto;
  grid-template-areas: "crest name" "crest sub";
  justify-content: center;
  align-items: center;
  column-gap: 12px;
  margin: 0 0 18px;
  padding: 14px 18px;
  border-radius: 12px;
  background: #0F3D2E;
}
/* the crest is drawn from this folder; Authelia's own logo (the first Scoutbook's, which browsers keep in their cache)
   is moved out of its box */
.min-h-\[90vh\] img[alt="Logo"] {
  grid-area: crest;
  width: 44px;
  height: 44px;
  max-width: none;
  margin: 0;
  border-radius: 50%;
  background: #FFFFFF url("/authelia/static/nowy/herb.png") center / 38px 38px no-repeat;
  object-position: -9999px 0;
}
.min-h-\[90vh\] div:has(> img[alt="Logo"])::before {
  content: "Warta Poznań";
  grid-area: name;
  align-self: end;
  justify-self: start;
  color: #FFFFFF;
  font-size: 19px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -.01em;
}
.min-h-\[90vh\] div:has(> img[alt="Logo"])::after {
  content: "Dział skautingu";
  grid-area: sub;
  align-self: start;
  justify-self: start;
  color: rgba(255, 255, 255, .6);
  font-size: 13px;
  line-height: 1.3;
}

/* a password the browser filled in by itself, before any click: the page does not know it yet and keeps the label
   in the middle, over the dots; the label goes up as when it is typed (Authelia's "top-1 text-xs") */
[data-slot="floating-input"]:-webkit-autofill + label {
  top: .25rem;
  transform: none;
  font-size: .75rem;
  line-height: 1rem;
}
[data-slot="floating-input"]:autofill + label {
  top: .25rem;
  transform: none;
  font-size: .75rem;
  line-height: 1rem;
}

/* the app's type and controls: the page title, the fields and the button as in the app (.page-title, .inp, .btn) */
.min-h-\[90vh\], .min-h-\[90vh\] input, .min-h-\[90vh\] button {
  font-family: 'Geist', ui-sans-serif, system-ui, sans-serif;
  font-feature-settings: "cv11" 1;
  -webkit-font-smoothing: antialiased;
}
.min-h-\[90vh\] h5 { font-size: 20px; font-weight: 600; letter-spacing: -.01em; }
[data-slot="floating-input"] {
  border-color: #E6E6E2;
  border-radius: 8px;
  color: #18181B;
  font-size: 15px;
}
[data-slot="floating-input"] + label { color: #71717A; font-weight: 500; }
.min-h-\[90vh\] button[type="submit"] {
  border-radius: 8px;
  font-size: 14.5px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}
.min-h-\[90vh\] button[type="submit"]:hover { background: #166A34; }
