/* Reuses --navy / --accent / fonts from contact.css :root */

.auth-page{
  min-height:100vh;
  background:
    radial-gradient(circle at top left, rgba(251,91,59,.12), transparent 28%),
    radial-gradient(circle at bottom right, rgba(21,34,74,.08), transparent 32%),
    linear-gradient(180deg, #fff7f4 0%, #f4f6fa 100%);
}

.auth-section{
  min-height:100vh;
  padding:4rem 1.5rem;
  display:flex;
  align-items:center;
  justify-content:center;
}

.auth-card{
  width:100%;
  max-width:480px;
  background:#fff;
  border:1px solid rgba(21,34,74,.08);
  border-radius:26px;
  box-shadow:0 28px 60px -28px rgba(21,34,74,.25);
  padding:2.3rem 2rem 2rem;
  position:relative;
  overflow:hidden;
}

.auth-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:5px;
  background:linear-gradient(90deg, var(--accent), var(--navy));
}

.auth-back-link{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  color:var(--accent);
  font-weight:700;
  text-decoration:none;
  margin-bottom:1.2rem;
}
.auth-back-link:hover{ text-decoration:underline; }

.auth-card h2{
  font-family:var(--font-head);
  font-size:2.1rem;
  color:var(--navy);
  margin-bottom:.5rem;
  line-height:1.1;
}

.auth-card > p{
  color:var(--navy-soft);
  margin-bottom:1.7rem;
  font-size:.95rem;
  line-height:1.6;
}

.auth-card form{ display:flex; flex-direction:column; }

.auth-card .form-field{ margin-bottom:1rem; }

.auth-card label{
  display:block;
  margin-bottom:.5rem;
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--navy-soft);
}

.auth-card input{
  width:100%;
  border:1px solid var(--border);
  background:#f9fafc;
  border-radius:12px;
  padding:0.9rem 1rem;
  font:inherit;
  color:var(--navy);
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.auth-card input:focus{
  outline:none;
  border-color:rgba(251,91,59,.7);
  box-shadow:0 0 0 4px rgba(251,91,59,.12);
  background:#fff;
}

.auth-card .btn{
  width:100%;
  justify-content:center;
  margin-top:.5rem;
  border:none;
  cursor:pointer;
}

.auth-alert{
  padding:.85rem 1rem;
  border-radius:12px;
  font-size:.88rem;
  margin-bottom:1.2rem;
  line-height:1.5;
}
.auth-alert.error{ background:#FEEDEB; color:#B3311A; border:1px solid #F6C7C0; }
.auth-alert.success{ background:#E9F8EF; color:#1C7A3E; border:1px solid #BFE9CE; }

.auth-switch{
  margin-top:1.5rem;
  text-align:center;
  font-size:.9rem;
  color:var(--navy-soft);
}
.auth-switch a{ color:var(--accent); font-weight:700; text-decoration:none; }
.auth-switch a:hover{ text-decoration:underline; }

.oauth-buttons{ display:flex; flex-direction:column; gap:.7rem; margin-bottom:1.4rem; }
.oauth-btn{
  display:flex; align-items:center; justify-content:center; gap:.6rem;
  width:100%; padding:.75rem 1rem; border-radius:10px;
  font-weight:600; font-size:.9rem; text-decoration:none;
  border:1px solid var(--border); transition:.15s;
}
.oauth-google{ background:#fff; color:var(--navy); }
.oauth-google:hover{ background:#f7f7f9; }
.oauth-facebook{ background:#1877F2; color:#fff; border-color:#1877F2; }
.oauth-facebook:hover{ background:#166fe0; }
.oauth-divider{
  display:flex; align-items:center; gap:.8rem;
  color:var(--navy-soft); font-size:.8rem; margin-bottom:1.3rem;
}
.oauth-divider::before, .oauth-divider::after{ content:""; flex:1; height:1px; background:var(--border); }

.premium-badge{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  background:linear-gradient(135deg,#FB5B3B,#E2492E);
  color:#fff;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.03em;
  padding:.3rem .7rem;
  border-radius:999px;
  text-transform:uppercase;
}
.free-badge{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  background:var(--bg-soft-2);
  color:var(--navy-soft);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.03em;
  padding:.3rem .7rem;
  border-radius:999px;
  text-transform:uppercase;
}

/* Dashboard */
.dash-section{ padding:5rem 1.5rem; background:var(--bg-soft); min-height:70vh; }
.dash-inner{ max-width:1000px; margin:0 auto; }
.dash-head{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; margin-bottom:2.5rem; }
.dash-head h1{ font-family:var(--font-head); color:var(--navy); font-size:2rem; }
.dash-cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1.5rem; }
.dash-card{
  background:#fff; border-radius:18px; padding:2rem;
  border:1px solid var(--border); box-shadow:0 20px 40px -24px rgba(21,34,74,.15);
}
.dash-card h3{ font-family:var(--font-head); color:var(--navy); font-size:1.3rem; margin-bottom:.6rem; }
.dash-card p{ color:var(--navy-soft); font-size:.92rem; margin-bottom:1.4rem; line-height:1.6; }
.dash-card .btn{ width:100%; justify-content:center; }
.dash-card ul{ list-style:none; padding:0; margin:0 0 1.4rem; }
.dash-card ul li{ font-size:.88rem; color:var(--navy-soft); padding:.35rem 0; display:flex; gap:.5rem; align-items:flex-start; }
.dash-card ul li svg{ color:var(--accent); flex-shrink:0; margin-top:.15rem; }

.history-table{ width:100%; border-collapse:collapse; margin-top:1rem; font-size:.88rem; }
.history-table th, .history-table td{ text-align:left; padding:.7rem .9rem; border-bottom:1px solid var(--border); }
.history-table th{ color:var(--navy-soft); font-weight:600; text-transform:uppercase; font-size:.72rem; letter-spacing:.04em; }