/* Authentication surfaces aligned with the Chinar Medicos public design system. */
:root {
  --auth-primary: #9a742f !important;
  --auth-primary-2: #d6b35c !important;
  --auth-accent: #ebd78e !important;
  --auth-bg: #f7f2e8 !important;
  --auth-text: #211b14 !important;
  --auth-muted: #6b6154 !important;
  --auth-border: rgba(190, 162, 109, .28) !important;
}

body.form {
  color: var(--auth-text);
  background:
    radial-gradient(900px 540px at 95% -10%, rgba(214, 179, 92, .18), transparent 60%),
    radial-gradient(900px 600px at -10% 30%, rgba(190, 162, 109, .14), transparent 62%),
    var(--auth-bg) !important;
}

.skip-link {
  position: fixed; top: 12px; left: 12px; z-index: 1000; padding: 11px 16px;
  color: #211b14; background: #ebd78e; border-radius: 10px; font-weight: 800;
  transform: translateY(-180%);
}
.skip-link:focus { transform: translateY(0); }
body.form :where(a, button, input):focus-visible {
  outline: 3px solid #d6b35c !important; outline-offset: 3px !important;
}

.auth-frame { max-width: 1040px !important; align-items: stretch; }
.auth-brand-panel {
  min-height: 440px;
  color: #f8f1e0 !important;
  background: linear-gradient(145deg, #211d18 0%, #342b1d 58%, #6c5226 100%) !important;
  border: 1px solid rgba(214, 179, 92, .28);
  box-shadow: 0 28px 64px rgba(49, 36, 14, .2);
}
.auth-brand-panel::before, .auth-brand-panel::after { background: rgba(214, 179, 92, .12) !important; }
.auth-brand-panel :where(h2, h3, p) { color: #f8f1e0 !important; }
.auth-brand-panel p { opacity: .84 !important; }
.auth-brand img { border: 1px solid rgba(214, 179, 92, .3); }
.auth-stat, .auth-step {
  color: #f8f1e0;
  background: rgba(255, 255, 255, .09) !important;
  border: 1px solid rgba(214, 179, 92, .18);
}
.auth-step span { color: #5b4217 !important; background: #ebd78e !important; }

.auth-card {
  color: var(--auth-text);
  background: linear-gradient(180deg, #fff 0%, #fcf8ef 100%) !important;
  border-color: var(--auth-border) !important;
  box-shadow: 0 28px 64px rgba(57, 42, 13, .12) !important;
}
.auth-card h1 { color: var(--auth-text); font-weight: 800; letter-spacing: -.035em; }
.field-wrapper label { color: #655a4c !important; font-weight: 700; }
.input-wrap svg { color: #957035 !important; opacity: .85 !important; }
.form-control {
  min-height: 50px;
  color: var(--auth-text);
  background: #fffdf8 !important;
  border-color: var(--auth-border) !important;
}
.form-control:focus {
  border-color: #b68c3d !important;
  box-shadow: 0 0 0 3px rgba(201, 162, 74, .16) !important;
}
.forgot-pass-link, .signup-link a { color: #79581f !important; }
.btn-primary {
  min-height: 48px;
  color: #211b14;
  background: linear-gradient(135deg, #c9a24a, #ebd78e) !important;
  box-shadow: 0 14px 28px rgba(154, 116, 47, .2) !important;
}
.btn-primary:hover { color: #15110c; filter: brightness(.97); }
.auth-home-link {
  display: inline-flex; align-items: center; min-height: 44px; margin-top: 16px;
  color: #72531f; font-weight: 700;
}

@media (max-width: 991px) {
  body.form { align-items: flex-start !important; padding: 18px !important; }
  .auth-frame { gap: 14px !important; }
  .auth-brand-panel { min-height: 0 !important; padding: 24px !important; }
  .auth-brand-panel > div:last-child { margin-top: 30px; }
  .auth-card { padding: 26px 24px !important; }
}

@media (max-width: 575px) {
  .auth-brand-panel { border-radius: 22px !important; }
  .auth-card { border-radius: 22px !important; }
  .auth-brand img { width: 46px !important; height: 46px !important; }
  .auth-brand h2 { font-size: 1.35rem !important; }
  .auth-brand-panel h3 { margin-top: 0 !important; }
  .auth-stats { grid-template-columns: 1fr 1fr; gap: 8px !important; }
  .auth-stat { padding: 12px !important; }
  .auth-stat strong { font-size: .95rem !important; }
  .auth-form { gap: 16px !important; }
  .btn-primary { width: 100%; }
}