/* Sign-in and restore pages (no side menu). Colours come from the brand variables,
   so the page follows the colour chosen in Settings → Appearance. */
body.is-anonymous {
    background: linear-gradient(135deg, var(--brand-deeper, #062820) 0%, var(--brand-deep, #093E31) 55%, var(--brand-strong, #008160) 100%);
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 20px;
}

.auth-card {
    background: var(--surface, #fff);
    border-radius: 24px;
    box-shadow: 0 18px 45px rgba(6, 40, 32, .28);
    width: 100%;
    max-width: 460px;
    padding: 36px 32px;
}
.auth-card.auth-card-wide { max-width: 760px; }

.auth-brand { text-align: center; margin-bottom: 24px; }
.auth-brand h1 { font-size: 1.9rem; margin: 0 0 4px; font-weight: 700; color: var(--brand-deep, #093E31); }
.auth-brand p { color: var(--ink-soft, #55665F); margin: 0; font-size: 1.02rem; }

.auth-message { margin: 0 0 14px; color: #b42318; font-weight: 600; font-size: .98rem; }
.auth-message.is-ok { color: var(--brand-strong, #008160); }

.auth-note { margin: 18px 0 0; font-size: .86rem; color: var(--ink-soft, #55665F); text-align: center; }
.auth-links { margin-top: 14px; text-align: center; font-size: .95rem; }
.auth-links a { color: var(--brand-strong, #008160); font-weight: 600; text-decoration: none; }
.auth-links a:hover { text-decoration: underline; }

.is-anonymous .input-group-text { background: var(--brand-tint, #EFF9F5); border-color: var(--line, #DDE7E2); color: var(--brand-strong, #008160); }


/* Sign-in header (owner, 1.1.6): "ALMODEER — المدير" on one line, the establishment below, tighter spacing. */
.auth-brand { margin-bottom: 14px; }
.auth-brand .auth-logo { margin-bottom: 4px; }
.auth-brand h1.auth-title { font-size: 1.45rem; margin: 0; line-height: 1.3; white-space: nowrap; display: flex;
  justify-content: center; align-items: baseline; gap: 8px; }
.auth-brand .auth-dash { color: var(--ink-soft, #55665F); font-weight: 400; }
.auth-brand .auth-establishment { font-size: 1.7rem; font-weight: 800; color: var(--brand, #0b6b4f); margin: 6px 0 0; line-height: 1.35; }

/* 1.1.7 — user-name suggestions drawn by the program (owner 2026-10-28): match the card, not the browser */
.user-suggest-host { position: relative; }
.user-suggest {
  position: absolute; top: calc(100% + 4px); inset-inline: 0; z-index: 30;
  list-style: none; margin: 0; padding: 6px; background: #fff;
  border: 1px solid #d7e6df; border-radius: 12px; box-shadow: 0 10px 28px rgba(6, 60, 44, .16);
  font-family: inherit; text-align: start;
}
.user-suggest[hidden] { display: none; }
.user-suggest-item {
  display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 9px;
  cursor: pointer; color: #13322a; font-size: .95rem;
}
.user-suggest-item:hover, .user-suggest-item.on { background: #e6f6ef; color: #0b5a41; }
.user-suggest .us-icon {
  flex: 0 0 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  background: var(--brand-strong, #008160); color: #fff; font-weight: 700; font-size: .85rem;
}
.user-suggest .us-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: start; }
.user-suggest .us-del {
  border: 0; background: transparent; color: #8a9a94; font-size: 1.2rem; line-height: 1; padding: 0 4px; border-radius: 6px;
}
.user-suggest .us-del:hover { color: #c62828; background: #fdecec; }
