:root{
  --bg:#f4f1e8;
  --ink:#10223d;
  --muted:#5f6c80;
  --card:#ffffff;
  --line:#e2dccf;
  --brand:#1f4b99;
  --brand-soft:#e9f0ff;
  --shadow:0 18px 50px rgba(16,34,61,.08);
}

*{
  box-sizing:border-box;
}

html,body{
  margin:0;
  min-height:100%;
}

body{
  font-family:Inter,Segoe UI,Arial,sans-serif;
  background:linear-gradient(180deg,#faf7ef 0%,var(--bg) 100%);
  color:var(--ink);
}

a{
  color:inherit;
}

.auth-body{
  background:var(--bg);
}

.auth-wrap{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:24px;
}

.auth-card{
  width:min(640px,100%);
  background:var(--card);
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  border-radius:28px;
  padding:34px 30px;
}

.auth-header{
  margin-bottom:2rem;
  align-items:center;
}

.auth-logo-box{
  background:#0b0b0b;
  width:220px;
  height:70px;
  padding:10px 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  flex-shrink:0;
}

.auth-logo{
  display:block;
  max-height:48px;
  width:auto;
  max-width:100%;
  object-fit:contain;
}

.auth-title{
  font-size:2rem;
  font-weight:800;
  color:var(--brand) !important;
  line-height:1;
}

.form-control,
.form-select{
  border-radius:16px;
  border-color:#d7dfeb;
  padding:12px 14px;
  background:#fff;
}

.form-control:focus,
.form-select:focus{
  border-color:rgba(31,75,153,.55);
  box-shadow:0 0 0 .25rem rgba(31,75,153,.12);
}

.btn-primary-med{
  background:var(--ink);
  border:0;
  color:#fff;
  padding:13px 22px;
  border-radius:14px;
  font-weight:800;
}

.btn-primary-med:hover{
  background:#15397a;
  color:#fff;
}

.alert{
  border-radius:18px;
}

.text-muted{
  color:var(--muted) !important;
}

@media (max-width: 768px){
  .auth-card{
    padding:24px 20px;
    border-radius:24px;
  }

  .auth-header{
    gap:16px;
    flex-wrap:wrap;
    justify-content:center !important;
  }

  .auth-logo-box{
    width:200px;
    height:62px;
    padding:8px 12px;
  }

  .auth-logo{
    max-height:42px;
  }

  .auth-title{
    font-size:1.75rem;
    text-align:center;
  }
  .auth-body,
.auth-body *,
.auth-body h1,
.auth-body h2,
.auth-body h3,
.auth-body h4,
.auth-body h5,
.auth-body h6,
.auth-body p,
.auth-body label,
.auth-body input,
.auth-body button,
.auth-body a,
.auth-body span,
.auth-body div {
  font-family: Arial, Helvetica, sans-serif !important;
}

.auth-title {
  font-family: Arial, Helvetica, sans-serif !important;
}
}