@import url("/assets/fonts/estedad/v8.5/estedad.css");

input, button, textarea, select {
    font-family: inherit;
}

:root {
  color-scheme: dark;
  --bg: #090e19;
  --panel: #111a2a;
  --line: #2a3548;
  --text: #f1f5fb;
  --muted: #a5b0c2;
  --accent: #83d6d1;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  background: radial-gradient(ellipse at 80% 15%, #162c3d, transparent 45%), var(--bg);
  color: var(--text);
  font-family: "Estedad", Tahoma, Arial, sans-serif;
  line-height: 1.8;
}

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

.layout {
  width: min(1160px, calc(100% - 44px));
  min-height: 100vh;
  margin: auto;
  display: flex;
  flex-direction: column;
}

.topbar, footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.topbar { padding: 28px 0; }
.top-caption, footer { color: var(--muted); font-size: 13px; }

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: white;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: 2px;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid var(--accent);
  border-radius: 11px;
  color: var(--accent);
}

.content {
  flex: 1;
  display: grid;
  grid-template-columns: minmax(320px, 480px) 1fr;
  gap: clamp(35px, 7vw, 110px);
  align-items: center;
  padding: 35px 0 65px;
}

.auth-card {
  padding: clamp(24px, 4vw, 42px);
  border: 1px solid var(--line);
  border-radius: 24px;
  background: rgba(17, 26, 42, .95);
  box-shadow: 0 25px 70px #0005;
}

.eyebrow, .intro-tag {
  color: var(--accent);
  direction: ltr;
  text-align: right;
  font-size: 11px;
  letter-spacing: 2px;
  font-weight: bold;
}

h1 { font-size: clamp(24px, 3vw, 31px); margin: 15px 0 5px; }
.subtitle { color: var(--muted); margin: 0 0 24px; font-size: 14px; }

.preview-notice {
  padding: 10px 13px;
  border: 1px solid #48526a;
  border-radius: 10px;
  color: #d9dfed;
  font-size: 12px;
  margin-bottom: 22px;
}

.field { margin-bottom: 17px; }
.field label { display: block; margin-bottom: 7px; font-size: 13px; }

.field input {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #3b4860;
  border-radius: 10px;
  background: #0b1322;
  color: white;
  font: inherit;
  outline: none;
}

.field input:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px #83d6d120;
}

.field input[dir=ltr] { text-align: left; }
.field-hint { margin: 5px 0 0; font-size: 12px; color: var(--muted); }

.checkline {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  font-size: 12px;
  margin: 18px 0;
}

.checkline input { margin-top: 8px; accent-color: var(--accent); }

.primary {
  width: 100%;
  padding: 13px;
  margin-top: 9px;
  border: 0;
  border-radius: 10px;
  background: var(--accent);
  color: #081622;
  font: inherit;
  font-weight: bold;
}

.primary:disabled { opacity: .52; cursor: not-allowed; }

.auth-links {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  margin-top: 22px;
  font-size: 13px;
}

.intro { max-width: 500px; }
.intro-line { width: 58px; height: 3px; background: var(--accent); margin-bottom: 24px; }
.intro h2 { font-size: clamp(33px, 4.5vw, 57px); line-height: 1.5; margin: 20px 0; }
.intro p { color: var(--muted); max-width: 410px; }
.feature { display: flex; align-items: center; gap: 12px; margin-top: 38px; font-size: 13px; }
.feature-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--accent); }
footer { padding: 20px 0 25px; border-top: 1px solid var(--line); }

@media (max-width: 800px) {
  .layout { width: min(480px, calc(100% - 28px)); }
  .content { display: block; padding: 25px 0 55px; }
  .intro { display: none; }
  .topbar { padding: 18px 0; }
  .auth-card { border-radius: 18px; }
}

.form-error {
  color: #ffb6b6;
  border: 1px solid #6c4147;
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 13px;
}


/* VEYRO: global Persian typography standard v1 */
html[lang="fa"] {
  direction: rtl;
}

html[lang="fa"] body {
  direction: rtl;
  text-align: right;
}

html[lang="fa"] p {
  direction: rtl;
  text-align: justify;
  text-align-last: right;
  word-break: normal;
  overflow-wrap: break-word;
}

html[lang="fa"] h1,
html[lang="fa"] h2,
html[lang="fa"] h3,
html[lang="fa"] label {
  direction: rtl;
  text-align: right;
}

html[lang="fa"] input[type="email"],
html[lang="fa"] input[type="url"] {
  direction: ltr;
  text-align: left;
}

/* VEYRO legal consent links v1 */
.checkline .legal-consent-text {
    display: block;
    min-width: 0;
    direction: rtl;
    text-align: justify;
    text-align-last: right;
    line-height: 2.1;
    overflow-wrap: break-word;
}

.checkline .legal-consent-text a {
    color: #65d5db;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.checkline .legal-consent-text a:focus-visible {
    outline: 2px solid #65d5db;
    outline-offset: 3px;
}

/* Universal, accessible clickable affordances; never force pointer for disabled buttons. */
html[lang="fa"] a[href],html[lang="fa"] button:not(:disabled),
html[lang="fa"] [role="button"],html[lang="fa"] summary,
html[lang="fa"] label[for],html[lang="fa"] input[type="checkbox"],
html[lang="fa"] input[type="radio"]{cursor:pointer}
html[lang="fa"] button:disabled{cursor:not-allowed}
html[lang="fa"] a:focus-visible,html[lang="fa"] button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* Verification input and eye toggle; RTL label, LTR code and password. */
.veyro-secret-field{position:relative}
.field .veyro-secret-field input{padding-right:54px}
.veyro-reveal{position:absolute;right:8px;left:auto;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:42px;height:39px;border:1px solid #3b5368;background:#1a3042;color:#d0f1f2;border-radius:9px;font-size:22px;line-height:1;cursor:pointer}
.veyro-reveal:hover,.veyro-reveal.is-visible{background:#285068;color:white;border-color:var(--accent)}
.veyro-resend-link{display:block;margin:0 auto;padding:8px 10px;background:transparent;border:0;color:var(--accent);text-decoration:underline;text-underline-offset:4px;font:inherit;font-size:13px;cursor:pointer}
.veyro-resend-link:disabled{opacity:.5}
.verification-target{padding:12px 14px;border-radius:10px;background:#122c3c;border:1px solid #31546a;color:#d4e9f0;font-size:12px;overflow-wrap:anywhere}

.veyro-eye-closed{display:none}.veyro-reveal.is-visible .veyro-eye-open{display:none}.veyro-reveal.is-visible .veyro-eye-closed{display:block}