/* ═══════════════════════════════════════════════════════════════════════
   Kinfold / EstateOS — auth.css (owner: the Sign-in and public forms agent)
   30 October 2026.

   The standalone pages that do not extend base.html: login, the email code
   and Authenticator screens, forgot/reset password, unlock, invitation
   claim, the public /join/ form and its thank-you page. They load
   kwetu.css, then estate/base.css (tokens, fields, buttons, alerts), then
   this file. /insurance/ loads none of them; it carries the same values in
   its own <style> (ADR-021).

   EstateOS's own sign-in (nomad-estate templates/base_bare.html): paper
   canvas, a centred white panel, a 3px gradient edge across the top, the
   logo above, the credit under. Screen only; every rule starts
   html.theme-apple.theme-estate.
   ═══════════════════════════════════════════════════════════════════════ */
@media screen {
  html.theme-apple.theme-estate body { min-height: 100vh; }

  /* ── The sign-in panel ──────────────────────────────────────────────── */
  html.theme-apple.theme-estate .login-card:not([data-report-page] *) {
    position: relative;
    max-width: 440px;
    margin: 64px auto 0;
    background: var(--surface);
    border: 1px solid var(--line) !important;
    border-radius: 16px;
    box-shadow: var(--shadow-panel) !important;
    overflow: hidden;
  }
  /* EstateOS's sign-in detail: the oxblood gradient edge. */
  html.theme-apple.theme-estate .login-card::before,
  html.theme-apple.theme-estate .join-header::before,
  html.theme-apple.theme-estate .success-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 3px;
    background: linear-gradient(90deg, #5a1409, #8f2e1c);
  }
  html.theme-apple.theme-estate .login-header {
    padding: 36px 32px 0;
    background: var(--surface);
    border: 0;
    border-radius: 0;
    color: var(--ink);
  }
  html.theme-apple.theme-estate .login-header-lockup { padding-bottom: 4px; }
  html.theme-apple.theme-estate .login-header .kf-lockup-logo { height: 44px; }
  html.theme-apple.theme-estate .login-header h4 {
    margin: 22px 0 0;
    color: var(--ink);
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -.02em;
    line-height: 1.2;
  }
  html.theme-apple.theme-estate .login-header p {
    margin-top: 6px;
    color: var(--muted);
    font-size: 14px;
    opacity: 1 !important;
  }
  html.theme-apple.theme-estate .login-card .card-body:not([data-report-page] *) {
    padding: 24px 32px 32px !important;
  }

  /* Labels, addons, fields. */
  html.theme-apple.theme-estate .login-card .form-label,
  html.theme-apple.theme-estate .login-card .form-label.fw-semibold {
    color: var(--ink);
    font-size: 14px;
    font-weight: 600 !important;
  }
  html.theme-apple.theme-estate .login-card .form-text {
    color: var(--muted);
    font-size: 13px;
  }
  html.theme-apple.theme-estate .login-card .input-group {
    flex-wrap: nowrap;
    border-radius: var(--radius-sm);
    transition: box-shadow 120ms;
  }
  html.theme-apple.theme-estate .login-card .input-group-text {
    background: var(--surface);
    border: 1px solid var(--line-strong);
    border-right: 0;
    border-radius: var(--radius-sm) 0 0 var(--radius-sm);
    color: var(--muted);
    padding: 0 4px 0 14px;
  }
  html.theme-apple.theme-estate .login-card .input-group > .form-control {
    border-left: 0;
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    padding-left: 10px;
  }
  /* The ring goes round the whole group, icon and field together. */
  html.theme-apple.theme-estate .login-card .input-group:focus-within {
    box-shadow: var(--ring);
  }
  html.theme-apple.theme-estate .login-card .input-group:focus-within .input-group-text,
  html.theme-apple.theme-estate .login-card .input-group:focus-within > .form-control {
    border-color: var(--oxblood);
  }
  html.theme-apple.theme-estate .login-card .input-group > .form-control:focus { box-shadow: none; }
  /* The show/hide button on the password screens sits inside the group. */
  html.theme-apple.theme-estate .login-card .input-group > .btn {
    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    border-color: var(--line-strong);
    border-left: 0;
    color: var(--muted);
    min-height: 48px;
  }
  html.theme-apple.theme-estate .login-card .input-group > .form-control:has(+ .btn) { border-radius: 0; }

  /* The one-time-code field: large, centred, tabular. */
  html.theme-apple.theme-estate .login-card .form-control-lg {
    font-size: 24px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    min-height: 56px;
  }

  /* Buttons: oxblood primary, quiet secondary, 48px full width. */
  html.theme-apple.theme-estate .login-card .btn.w-100 {
    min-height: 48px;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
  }
  html.theme-apple.theme-estate .login-card .btn-link {
    color: var(--oxblood);
    font-size: 14px;
  }
  html.theme-apple.theme-estate .login-card a:not(.btn) {
    color: var(--oxblood) !important;
    font-weight: 500;
  }
  html.theme-apple.theme-estate .login-card a.text-muted:not(.btn) { color: var(--muted) !important; }
  html.theme-apple.theme-estate .login-card a:not(.btn):hover { text-decoration: underline; }
  html.theme-apple.theme-estate .login-card .alert { font-size: 14px; }
  /* The invitation screen's "who you are signing in as" notice. */
  html.theme-apple.theme-estate .login-card .alert-light {
    background: var(--paper);
    border: 1px solid var(--line) !important;
    border-left: 3px solid var(--oxblood) !important;
    color: var(--ink);
  }

  /* ── The credit under the card ──────────────────────────────────────── */
  html.theme-apple.theme-estate .built-by {
    color: var(--muted) !important;
    margin: 24px 0 40px !important;
  }

  /* ── Public registration: /join/ and its thank-you ──────────────────── */
  html.theme-apple.theme-estate .join-wrap { max-width: 760px; margin: 40px auto 0; }
  html.theme-apple.theme-estate .join-header {
    position: relative;
    background: var(--surface);
    border: 1px solid var(--line);
    border-bottom: 0;
    border-radius: 16px 16px 0 0;
    padding: 32px 32px 8px;
    overflow: hidden;
  }
  html.theme-apple.theme-estate .join-body {
    background: var(--surface);
    border: 1px solid var(--line);
    border-top: 0;
    border-radius: 0 0 16px 16px;
    box-shadow: var(--shadow-panel);
    padding: 16px 32px 36px;
  }
  html.theme-apple.theme-estate .join-body > p.text-muted { color: var(--muted) !important; font-size: 15px; }
  html.theme-apple.theme-estate .join-body .section-title {
    margin: 32px 0 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line);
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
  }
  html.theme-apple.theme-estate .join-body label.form-label {
    margin-bottom: 6px;
    color: var(--ink);
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
  }
  html.theme-apple.theme-estate .required-star { color: var(--danger); }
  html.theme-apple.theme-estate .join-body form input[type=text],
  html.theme-apple.theme-estate .join-body form input[type=email],
  html.theme-apple.theme-estate .join-body form input[type=tel],
  html.theme-apple.theme-estate .join-body form input[type=date],
  html.theme-apple.theme-estate .join-body form input[type=number],
  html.theme-apple.theme-estate .join-body form select,
  html.theme-apple.theme-estate .join-body form textarea {
    min-height: 48px;
    padding: 10px 14px;
    background-color: var(--surface);
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    color: var(--ink);
    font-size: 16px;
  }
  html.theme-apple.theme-estate .join-body form textarea { min-height: 112px; }
  html.theme-apple.theme-estate .join-body form input:focus,
  html.theme-apple.theme-estate .join-body form select:focus,
  html.theme-apple.theme-estate .join-body form textarea:focus {
    border-color: var(--oxblood);
    box-shadow: var(--ring);
    outline: none;
  }
  /* The dialling code and the number stay one control. */
  html.theme-apple.theme-estate .join-body form .phone-control select {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
  html.theme-apple.theme-estate .join-body form .phone-control input[type=text] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
  html.theme-apple.theme-estate .join-body form input[type=checkbox],
  html.theme-apple.theme-estate .consent-row input[type=checkbox] {
    min-height: 0;
    padding: 0;
    accent-color: var(--oxblood);
  }
  html.theme-apple.theme-estate .consent-row label { color: var(--ink); font-size: 14px; font-weight: 500; }
  html.theme-apple.theme-estate .join-body .form-text,
  html.theme-apple.theme-estate .join-body .text-muted { color: var(--muted) !important; font-size: 13px; }
  html.theme-apple.theme-estate .btn-join {
    min-height: 48px;
    padding: 0 28px;
    background: var(--oxblood);
    border-radius: var(--radius-sm);
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
  }
  html.theme-apple.theme-estate .btn-join:hover,
  html.theme-apple.theme-estate .btn-join:focus { background: var(--oxblood-deep); color: #ffffff; }
  html.theme-apple.theme-estate .join-body .alert { font-size: 14px; }

  /* The thank-you card. */
  html.theme-apple.theme-estate body:has(.success-card) {
    display: block;
    padding: 40px 16px 0;
  }
  html.theme-apple.theme-estate .success-card {
    position: relative;
    max-width: 520px;
    margin: 0 auto;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 16px;
    box-shadow: var(--shadow-panel);
    overflow: hidden;
  }
  html.theme-apple.theme-estate .success-header { background: var(--surface); padding: 32px 32px 0; }
  html.theme-apple.theme-estate .success-body { background: var(--surface); color: var(--ink); padding: 8px 32px 36px; }
  html.theme-apple.theme-estate .success-body h5 {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -.02em;
  }
  html.theme-apple.theme-estate .success-body .text-muted { color: var(--muted) !important; }
  html.theme-apple.theme-estate .success-body a { color: var(--oxblood); font-weight: 500; }
  html.theme-apple.theme-estate .check-circle { background: var(--ok-tint); color: var(--ok); }

  /* ── Phones ─────────────────────────────────────────────────────────── */
  @media (max-width: 575.98px) {
    html.theme-apple.theme-estate .login-card:not([data-report-page] *) { margin: 24px 16px 0; }
    html.theme-apple.theme-estate .login-header { padding: 28px 20px 0; }
    html.theme-apple.theme-estate .login-card .card-body:not([data-report-page] *) { padding: 20px 20px 28px !important; }
    html.theme-apple.theme-estate .join-wrap { margin: 16px auto 0; padding: 0 12px 2rem; }
    html.theme-apple.theme-estate .join-header { padding: 28px 20px 4px; }
    html.theme-apple.theme-estate .join-body { padding: 12px 20px 28px; }
    html.theme-apple.theme-estate .success-header { padding: 28px 20px 0; }
    html.theme-apple.theme-estate .success-body { padding: 8px 20px 28px; }
  }
}