/* Dootline login custom component styles; Tailwind utilities are loaded from tailwind-local.css */
/* Dootline login design components - compiled locally, no CDN */
:root{color-scheme:light;--brand:#0081ff;--ink:#172033;--mist:#f5f8fc;}
html{direction:rtl;text-size-adjust:100%;-webkit-text-size-adjust:100%;}
body{font-family:DootlineFont,Arial,sans-serif;color:var(--ink);background:var(--mist);-webkit-tap-highlight-color:transparent;}
.auth-card{width:100%;max-width:390px;border-radius:1.5rem;border:1px solid #edf1f6;background:#fff;padding:2rem 1.5rem;box-shadow:0 8px 30px rgba(20,45,80,.06)}
.fld-input{height:52px;width:100%;border:1px solid #e3eaf3;border-radius:.75rem;background:#f5f8fc;padding:15px .875rem 0;font-size:14px;color:#172033;outline:none;transition:all .15s}
.fld-input:focus{border-color:#0081ff;background:#fff;box-shadow:0 0 0 4px rgba(0,129,255,.1)}
.fld-input[aria-invalid=true],.otp-box[aria-invalid=true]{border-color:#ef4444}
.err{margin-top:.375rem;padding:0 .25rem;font-size:11.5px;line-height:1.75rem;color:#ef4444}.err:empty{display:none}
.form-err{border-radius:.75rem;background:#fef2f2;padding:.625rem .75rem;text-align:center;font-size:12px;line-height:1.5rem;color:#dc2626}.form-err:empty{display:none}
.hint-box{border-radius:.75rem;background:#eaf4ff;padding:.75rem;text-align:center;font-size:12px;line-height:1.5rem;color:#2f4a6b}
.btn-primary{display:flex;height:44px;width:100%;align-items:center;justify-content:center;gap:.5rem;border:0;border-radius:.75rem;background:#0081ff;color:#fff;font-size:14px;font-weight:800;box-shadow:0 8px 18px rgba(0,129,255,.25);transition:all .15s;cursor:pointer}.btn-primary:hover{background:#006fe0}.btn-primary:disabled{cursor:not-allowed;opacity:.5;box-shadow:none}
.otp-box{height:52px;min-width:0;max-width:48px;flex:1;border:1px solid #e3eaf3;border-radius:.75rem;background:#f5f8fc;text-align:center;font-size:1.25rem;font-weight:800;color:#172033;outline:none}.otp-box:focus{border-color:#0081ff;background:#fff;box-shadow:0 0 0 4px rgba(0,129,255,.1)}
.link-blue{font-weight:700;color:#0081ff}.link-blue:hover{color:#006fe0}
.fld-label{position:absolute;inset-inline-start:14px;top:50%;transform:translateY(-50%);font-size:13.5px;color:#7a8798;pointer-events:none;transition:all .15s ease}.fld-input:focus~.fld-label,.fld-input:not(:placeholder-shown)~.fld-label,.fld-input:-webkit-autofill~.fld-label{top:9px;transform:none;font-size:10.5px}
.squircle{border-radius:30%/37%}.ring-grad{background:linear-gradient(115deg,#8bd8ff 0%,#319dff 42%,#1764e8 72%,#123fae 100%)}.ring-seen{background:#d7e4f4}
@keyframes shake{10%,90%{transform:translateX(-2px)}20%,80%{transform:translateX(4px)}30%,50%,70%{transform:translateX(-6px)}40%,60%{transform:translateX(6px)}}.shake{animation:shake .45s ease}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}.float-a{animation:floaty 5s ease-in-out infinite}.float-b{animation:floaty 6s ease-in-out -2s infinite}
@keyframes viewIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.view-in{animation:viewIn .28s ease both}
@keyframes pop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}.pop{animation:pop .5s ease both}
@media(min-width:640px){.auth-card{padding:2.5rem 2.25rem}}
@media(prefers-reduced-motion:reduce){.float-a,.float-b,.view-in,.pop,.shake{animation:none!important}}

/* Responsive utility omitted by the local CSS build; required to match login(2).html */
@media (min-width: 1024px) {
  .lg\:block { display: block; }
}

/* Local Arabic font files keep the login page independent from Google Fonts. */
@font-face {
	font-family: DootlineFont;
	font-style: normal;
	font-weight: normal;
	src: url('/font/IRANSansX-Regular.woff') format('woff'),   
	url('/font/IRANSansX-Regular.woff2') format('woff2');	
}
body{font-family:DootlineFont,Tahoma,Arial,sans-serif}