/* ===== PDFBEAR auth pages (login / register) - Smallpdf-style ===== */
.auth-split {
  display: grid;
  grid-template-columns: 1.18fr 372px;
  max-width: 1080px;
  margin: 30px auto;
  min-height: 560px;
  background: #fff;
  border: 1px solid #e9edf3;
  border-radius: 20px;
  box-shadow: 0 18px 55px rgba(40, 60, 100, .10);
  overflow: hidden;
}

/* ---- Left: form ---- */
.auth-main {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 64px 24px 48px;
  background: #fff;
}
.auth-logo {
  position: absolute;
  top: 26px; left: 34px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-weight: 800;
  font-size: 1.3rem;
  letter-spacing: .3px;
  color: #1f2733;
  text-decoration: none;
}
.auth-logo i { color: #4d73c0; }

.auth-inner { width: 100%; max-width: 410px; margin: 0 auto; }
.auth-h {
  text-align: center;
  font-size: 2rem;
  font-weight: 800;
  color: #20262f;
  margin: 0 0 8px;
}
.auth-sub {
  text-align: center;
  color: #6b7480;
  font-size: .96rem;
  margin: 0 0 26px;
}
.auth-sub a { color: #4d73c0; font-weight: 700; text-decoration: none; }
.auth-sub a:hover { text-decoration: underline; }

.btn-social {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  width: 100%;
  border-radius: 11px;
  padding: 13px 16px;
  font-weight: 700;
  font-size: .98rem;
  text-decoration: none;
  border: 1px solid #dadce0;
  background: #fff;
  color: #3c4043;
  transition: background .15s, border-color .15s, box-shadow .15s;
}
.btn-social:hover { background: #f7f9fc; border-color: #c7cad0; box-shadow: 0 1px 5px rgba(0,0,0,.07); color: #3c4043; }
.btn-social svg { width: 20px; height: 20px; flex: 0 0 20px; }

.auth-divider {
  display: flex;
  align-items: center;
  gap: 14px;
  color: #9aa1ad;
  font-size: .82rem;
  margin: 20px 0;
}
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: #e7eaf0; }

.auth-field { margin-bottom: 14px; }
.auth-field > label { display: block; font-size: .85rem; font-weight: 600; color: #46505d; margin-bottom: 6px; }
.auth-input { position: relative; }
.auth-input > .ico {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  color: #9aa1ad; font-size: .95rem; pointer-events: none;
}
.auth-input input {
  width: 100%;
  border: 1px solid #dde1e8;
  border-radius: 11px;
  padding: 13px 44px 13px 42px;
  font-size: .97rem;
  color: #1f2733;
  background: #fff;
  transition: border-color .15s, box-shadow .15s;
}
.auth-input input::placeholder { color: #aab1bc; }
.auth-input input:focus { outline: none; border-color: #4d73c0; box-shadow: 0 0 0 3px rgba(77,115,192,.15); }
.auth-input .toggle-pw {
  position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
  background: none; border: none; color: #9aa1ad; padding: 6px 8px; cursor: pointer; font-size: .95rem;
}
.auth-input .toggle-pw:hover { color: #4d73c0; }

.auth-submit {
  width: 100%;
  background: #4d73c0;
  border: none;
  color: #fff;
  font-weight: 700;
  font-size: 1rem;
  border-radius: 11px;
  padding: 14px;
  margin-top: 8px;
  transition: background .15s, box-shadow .15s, transform .05s;
}
.auth-submit:hover { background: #3f63aa; box-shadow: 0 10px 22px rgba(77,115,192,.28); }
.auth-submit:active { transform: translateY(1px); }

.auth-foot { text-align: center; margin-top: 18px; }
.auth-foot a { color: #4d73c0; font-weight: 600; font-size: .9rem; text-decoration: none; }
.auth-foot a:hover { text-decoration: underline; }

.auth-terms { font-size: .78rem; color: #9aa1ad; text-align: center; margin-top: 16px; line-height: 1.55; }
.auth-terms a { color: #6b7686; text-decoration: underline; }

/* ---- Right: value / trust panel ---- */
.auth-aside {
  background: linear-gradient(165deg, #21457f 0%, #173460 55%, #0f2547 100%);
  color: #eaf0fb;
  padding: 64px 52px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  position: relative;
  overflow: hidden;
}
.auth-aside > * { position: relative; z-index: 1; max-width: 360px; }
.auth-aside::after {
  content: ""; position: absolute; right: -60px; bottom: -60px;
  width: 220px; height: 220px; border-radius: 32px; transform: rotate(25deg);
  background: rgba(255,255,255,.04);
}
.auth-badge {
  align-self: flex-start;
  background: #ffce53; color: #4a3500;
  font-weight: 800; font-size: .72rem; letter-spacing: .03em;
  padding: 5px 11px; border-radius: 999px; margin-bottom: 22px;
  display: inline-flex; align-items: center; gap: 6px;
}
.auth-aside h3 { font-size: 1.32rem; font-weight: 800; color: #fff; margin: 0 0 20px; }
.auth-perks { list-style: none; padding: 0; margin: 0 0 26px; display: flex; flex-direction: column; gap: 13px; }
.auth-perks li { display: flex; align-items: flex-start; gap: 11px; font-size: .97rem; color: #e7eefa; line-height: 1.35; }
.auth-perks .ck { flex: 0 0 20px; width: 20px; height: 20px; margin-top: 1px; color: #51d88a; font-size: 1.05rem; }

.auth-trust { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 4px; }
.auth-trust span {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
  color: #dbe6f7; font-size: .76rem; font-weight: 600;
  padding: 6px 11px; border-radius: 8px;
}

@media (max-width: 900px) {
  .auth-split { grid-template-columns: 1fr; min-height: auto; max-width: 460px; margin: 22px 14px; width: auto; }
  .auth-aside { display: none; }
  .auth-main { padding: 40px 26px 48px; }
}