/* Semantik ERP — auth screens (sign in, register, password, verify).
   Builds on semantik-landing.css + semantik-pages.css. */

.auth-page { background: var(--paper); }
.auth { min-height: calc(100vh - 72px); min-height: calc(100dvh - 72px); }
.auth__aside .h2 { font-size: clamp(2rem, 1.6rem + 1.6vw, 2.875rem); max-width: 13ch; }
[dir="rtl"] .auth__aside .h2 { max-width: 16ch; }
.auth__aside .list-check { margin-top: 32px; }
.auth__aside .list-check li { font-weight: 300; }

.auth__main { align-items: flex-start; padding-top: clamp(40px, 8vh, 96px); }
.auth__card { display: flex; flex-direction: column; }
.auth__card .h2 { margin: 0; }
.auth__lede { margin: 10px 0 0; color: var(--ink-2); font-weight: 300; }

.auth__form .field label { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.auth__form .field label .textlink { font-size: .875rem; font-weight: 500; }
.auth__label-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.auth__label-row .textlink { font-size: .875rem; font-weight: 500; }
.field__error { display: block; }
.auth__captcha { min-height: 78px; }
.auth__captcha > div { max-width: 100%; }

.auth__actions { display: grid; gap: 12px; margin-top: 4px; }
.auth__actions--row { grid-template-columns: 1fr 1fr; }
@media (max-width: 420px) { .auth__actions--row { grid-template-columns: 1fr; } }

.auth__help { margin: 18px 0 0; font-size: .9375rem; color: var(--ink-2); text-align: center; }

.auth__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--line); }
.auth__copy { margin: 0; font-size: .8125rem; color: var(--muted); }
.auth__lang { display: inline-flex; align-items: center; gap: 10px; font-size: .8125rem; color: var(--muted); }
.auth__lang select {
  min-height: 36px; padding: 0 34px 0 12px; border-radius: var(--r-pill);
  border: 1px solid var(--line); background-color: #fff; color: var(--ink); font-size: .8125rem; font-weight: 500;
  appearance: none; -webkit-appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5l5 5 5-5' stroke='%235B6678' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-size: 14px; background-position: right 12px center;
}
[dir="rtl"] .auth__lang select { padding: 0 12px 0 34px; background-position: left 12px center; }
.auth__lang select:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }

.auth__inline-forms { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.auth__inline-forms form { margin: 0; }

.btn--quiet { --bg: transparent; --fg: var(--ink-2); --bd: var(--line); }
.btn--quiet:hover { --bg: #fff; --fg: var(--ink); --bd: #B6C3D3; box-shadow: none; }

/* Mobile: no aside, so carry a slim brand line above the card. */
@media (max-width: 960px) {
  .auth__main { padding-top: 32px; }
}

/* ---------- Compatibility for legacy views on this layout
   (projects/copylink_password, subscription/expired) ---------- */

.auth__card .form-group { display: grid; gap: 8px; margin-bottom: 16px; }
.auth__card .form-label, .auth__card .form-control-label { font-size: .875rem; font-weight: 500; color: var(--ink); }
.auth__card .form-control {
  width: 100%; min-height: 50px; padding: 12px 16px; border-radius: 12px;
  border: 1px solid var(--line); background: var(--paper); color: var(--ink);
  transition: border-color .2s, background-color .2s, box-shadow .2s;
}
.auth__card .form-control:focus { outline: none; border-color: var(--blue); background: #fff; box-shadow: 0 0 0 4px rgba(30, 136, 229, .14); }
.auth__card .form-control.is-invalid { border-color: var(--peach-ink); }
.auth__card .invalid-feedback { font-size: .8125rem; color: var(--peach-ink); }
.auth__card .input-group { display: grid; gap: 8px; }
.auth__card h2.h3, .auth__card h2.mb-3 { margin: 0 0 12px; font-size: clamp(1.75rem, 1.5rem + 1vw, 2.25rem); line-height: 1.15; font-weight: 700; color: var(--ink); letter-spacing: -0.02em; }
.auth__card h6 { margin: 0 0 20px; font-size: 1rem; font-weight: 300; color: var(--ink-2); }
.auth__card .text-muted { color: var(--ink-2); }
.auth__card .f-w-600 { font-weight: 600; }
.auth__card .d-grid { display: grid; }
.auth__card .d-flex { display: flex; }
.auth__card .justify-content-between { justify-content: space-between; }
.auth__card .align-items-center { align-items: center; }
.auth__card .border.rounded { border: 1px solid var(--line); border-radius: var(--r-panel); background: #fff; }
.auth__card .p-3 { padding: 16px; }
.auth__card .mb-2 { margin-bottom: 8px; }
.auth__card .mt-2 { margin-top: 8px; }
.auth__card .mt-3 { margin-top: 16px; }
.auth__card .btn-primary { --bg: var(--navy-2); --fg: #fff; }
.auth__card .btn-primary:hover { --bg: var(--navy); }
.auth__card .btn-light { --bg: transparent; --fg: var(--ink-2); --bd: var(--line); }
.auth__card .btn-light:hover { --bg: #fff; --fg: var(--ink); box-shadow: none; }
.auth__card .btn-sm { min-height: 40px; padding: 0 16px; font-size: .875rem; }
.auth__card .btn-block { width: 100%; }
.auth__card .badge { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: var(--r-pill); font-size: .75rem; font-weight: 600; }
.auth__card .bg-info { background: var(--ice); color: var(--blue-dd); }
.auth__card .alert:not(.alert--success):not(.alert--error):not(.alert--info) { display: block; }
.auth__card .alert-success { background: var(--mint-bg); border-color: var(--mint-line); color: var(--ink); }
.auth__card .alert-danger { background: var(--peach-bg); border-color: var(--peach-line); color: var(--ink); }