@font-face { font-family: IRANSansX; src: url('../fonts/IRANSansX-Regular.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: IRANSansX; src: url('../fonts/IRANSansX-Bold.woff2') format('woff2'); font-weight: 700 900; font-display: swap; }
* { box-sizing: border-box; }
body { margin: 0; font-family: IRANSansX, Tahoma, Arial, sans-serif; background: #f4f7fb; color: #182230; }
.page { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.card { width: min(100%, 430px); background: white; border: 1px solid #e5eaf0; border-radius: 18px; padding: 32px; box-shadow: 0 18px 50px rgba(28, 42, 60, .09); }
h1 { margin: 6px 0 12px; font-size: 25px; }
.muted { color: #687386; margin-bottom: 24px; }
label { display: block; margin: 16px 0 7px; font-weight: 700; }
input { width: 100%; border: 1px solid #ccd5df; border-radius: 10px; padding: 12px; font-size: 16px; }
input:focus { outline: 3px solid #d9e8ff; border-color: #2878e5; }
button { width: 100%; margin-top: 22px; border: 0; border-radius: 10px; padding: 12px; font-size: 16px; font-weight: 700; color: white; background: #1769d2; cursor: pointer; }
button:hover { background: #0e57b5; }
.secondary { background: #eef2f7; color: #344054; }
.secondary:hover { background: #e1e7ef; }
.error { color: #9f1c1c; background: #fff0f0; border-radius: 9px; padding: 11px; }
.success { color: #086b44; background: #eafaf3; padding: 14px; border-radius: 10px; }
.status { float: left; color: #087a4d; background: #e8f8f0; border-radius: 999px; padding: 5px 10px; font-size: 13px; }
.eyebrow { color: #1769d2; font-weight: 700; margin: 0; }
.sms-box, .history { border-top: 1px solid #e5eaf0; margin-top: 24px; padding-top: 18px; }
h2 { font-size: 18px; margin: 0 0 10px; }
.notice { padding: 11px; border-radius: 9px; margin: 12px 0; }
.notice.success { color: #086b44; background: #eafaf3; }
.notice.error, .field-error { color: #9f1c1c; background: #fff0f0; }
.field-error { margin-top: 6px; padding: 8px; border-radius: 7px; font-size: 13px; }
.log { display: flex; justify-content: space-between; padding: 9px 0; border-bottom: 1px solid #edf0f4; color: #526071; }