@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700;800;900&display=swap');
:root{--primary:#2478ed;--primary-soft:#eaf3ff;--accent:#19b6c7;--bg:#f3f6fb;--surface:#fff;--surface2:#f8faff;--text:#16223a;--muted:#748199;--line:#e2e8f1;--success:#138d68;--danger:#ca4b62;--shadow:0 25px 75px rgba(21,43,85,.14);--side1:#101d36;--side2:#172744;color-scheme:light}
body[data-theme="royal"]{--primary:#6558e8;--primary-soft:#f0edff;--accent:#a350e4;--bg:#f5f4fb;--side1:#171633;--side2:#292050}body[data-theme="emerald"]{--primary:#0e9478;--primary-soft:#e8f8f4;--accent:#38b66d;--bg:#f2f8f6;--side1:#0f2b2a;--side2:#174039}body[data-theme="sunset"]{--primary:#e8694e;--primary-soft:#fff0ec;--accent:#f2a536;--bg:#faf5f2;--side1:#35201d;--side2:#533027}body[data-theme="graphite"]{--primary:#46536d;--primary-soft:#edf0f5;--accent:#71819d;--bg:#f2f4f7;--side1:#171c27;--side2:#252e3e}body[data-theme="dark"]{--primary:#7ca9ff;--primary-soft:#21304c;--accent:#5bd2d6;--bg:#0d1423;--surface:#141f33;--surface2:#18253c;--text:#edf3ff;--muted:#9ba9c1;--line:#293852;--success:#50d3a6;--danger:#ff7f94;--shadow:0 25px 75px rgba(0,0,0,.35);--side1:#090f1c;--side2:#111b2d;color-scheme:dark}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:"Vazirmatn",Tahoma,"Segoe UI",Arial,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}a{color:var(--primary);text-decoration:none}button,input,select{font:inherit}.identity-preferences{position:fixed;top:16px;inset-inline-end:16px;z-index:100}.preferences-toggle{width:40px;height:40px;border-radius:13px;border:1px solid rgba(255,255,255,.2);background:color-mix(in srgb,var(--surface) 88%,transparent);color:var(--text);box-shadow:0 10px 30px rgba(18,37,72,.12);backdrop-filter:blur(18px)}.preferences-popover{position:absolute;top:48px;inset-inline-end:0;width:220px;padding:13px;background:var(--surface);border:1px solid var(--line);border-radius:17px;box-shadow:var(--shadow);opacity:0;transform:translateY(-8px);pointer-events:none;transition:.18s}.identity-preferences.open .preferences-popover{opacity:1;transform:none;pointer-events:auto}.preferences-popover label{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;font-weight:800;padding:5px}.preferences-popover select{width:118px;border:1px solid var(--line);border-radius:10px;background:var(--surface2);color:var(--text);padding:7px;font-size:10px}.auth-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(440px,.92fr)}.auth-hero{position:relative;overflow:hidden;padding:42px clamp(38px,6vw,92px);color:#fff;background:radial-gradient(circle at 16% 10%,rgba(92,190,255,.5),transparent 32%),radial-gradient(circle at 84% 83%,rgba(113,76,255,.43),transparent 36%),linear-gradient(145deg,#0b1d3d,#174a91 50%,#4632a0);display:flex;flex-direction:column}.auth-hero::before,.auth-hero::after{content:"";position:absolute;border:1px solid rgba(255,255,255,.10);border-radius:50%;width:560px;height:560px;inset-inline-start:-300px;top:20%}.auth-hero::after{width:760px;height:760px;inset-inline-start:auto;inset-inline-end:-500px;top:-310px}.brand{display:flex;align-items:center;gap:12px;position:relative;z-index:2}.brand-mark{width:45px;height:45px;border-radius:16px;background:linear-gradient(135deg,var(--primary),var(--accent));display:grid;place-items:center;color:#fff;font-weight:900;font-size:17px;box-shadow:0 10px 28px rgba(34,107,226,.36)}.brand div{display:flex;flex-direction:column}.brand strong{font-size:15px}.brand small{font-size:9px;opacity:.7;letter-spacing:.5px}.hero-copy{margin:auto 0;max-width:720px;position:relative;z-index:2}.eyebrow,.pill{display:inline-flex;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.15);font-size:9px;font-weight:800;letter-spacing:.7px}.hero-copy h1{font-size:clamp(42px,5vw,64px);line-height:1.25;margin:21px 0 14px}.hero-copy>p{font-size:15px;line-height:2.1;opacity:.78}.feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:32px}.feature-grid div{padding:17px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.075);backdrop-filter:blur(12px);border-radius:18px;display:flex;flex-direction:column}.feature-grid b{font-size:12px}.feature-grid span{opacity:.68;font-size:9px;margin-top:5px}.hero-footer{opacity:.52;font-size:9px;position:relative;z-index:2}.auth-panel{display:grid;place-items:center;padding:42px}.login-card{width:min(535px,100%);background:var(--surface);padding:36px;border:1px solid var(--line);border-radius:30px;box-shadow:var(--shadow)}.login-card header h2{font-size:29px;margin:13px 0 4px}.login-card header p{color:var(--muted);font-size:11px;margin:0 0 22px}.pill{color:var(--primary);background:var(--primary-soft);border-color:color-mix(in srgb,var(--primary) 15%,var(--line))}.login-card label{display:block;font-size:11px;font-weight:800;margin:14px 0 7px}.login-card input,.inline-form input{width:100%;min-height:46px;border:1px solid var(--line);border-radius:13px;padding:11px 13px;font:inherit;color:var(--text);outline:none;transition:.18s;background:var(--surface2)}.login-card input:focus,.inline-form input:focus{border-color:var(--primary);box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 12%,transparent);background:var(--surface)}.form-row{display:flex;justify-content:space-between;align-items:center;margin:10px 0 20px;font-size:10px}.form-row .check{display:flex;align-items:center;gap:7px;margin:0;font-weight:400;color:var(--muted)}.form-row .check input{width:auto;min-height:auto}.password-help{color:var(--muted);font-size:9px}.primary,.outline{border:0;border-radius:13px;min-height:42px;padding:10px 17px;font:inherit;font-size:11px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.primary{background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;box-shadow:0 10px 24px color-mix(in srgb,var(--primary) 25%,transparent)}.login-card form>.primary{width:100%;min-height:47px}.outline{border:1px solid var(--line);background:var(--surface);color:var(--text)}.divider{display:flex;align-items:center;gap:11px;color:var(--muted);font-size:9px;margin:23px 0 14px}.divider:before,.divider:after{content:"";height:1px;background:var(--line);flex:1}.hint{text-align:center;color:var(--muted);font-size:8px;margin-bottom:0}.alert,.success{padding:11px 13px;border-radius:12px;margin:11px 0;font-size:10px}.alert{background:color-mix(in srgb,var(--danger) 11%,var(--surface));color:var(--danger)}.success{background:color-mix(in srgb,var(--success) 11%,var(--surface));color:var(--success)}.simple-page{min-height:100vh;display:grid;place-items:center;padding:20px}.simple-card{background:var(--surface);padding:48px;border:1px solid var(--line);border-radius:25px;box-shadow:var(--shadow);text-align:center}.admin-shell{min-height:100vh;display:grid;grid-template-columns:270px minmax(0,1fr)}.admin-shell aside{position:sticky;top:0;height:100vh;background:linear-gradient(180deg,var(--side1),var(--side2));color:#fff;padding:25px 18px}.admin-shell aside .brand{margin-bottom:37px;padding-inline:5px}.admin-shell nav{display:flex;flex-direction:column;gap:6px}.admin-shell nav a{color:#b0bdd2;padding:11px 13px;border-radius:12px;font-size:11px;transition:.17s}.admin-shell nav a:hover,.admin-shell nav a.active{background:rgba(255,255,255,.08);color:#fff}.admin-shell main{padding:34px 40px;overflow:auto;max-width:1600px;width:100%;margin:0 auto}.admin-shell main>header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px}.admin-shell header span{font-size:9px;color:var(--primary);font-weight:900;letter-spacing:.5px}.admin-shell h1{margin:4px 0;font-size:27px}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:19px}.stats div,.admin-card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:0 8px 28px rgba(34,58,105,.05)}.stats span{color:var(--muted);font-size:10px}.stats b{display:block;font-size:28px;margin-top:7px}.admin-card{margin-bottom:18px}.admin-card h2{margin-top:0;font-size:16px}.admin-card p{font-size:10px;line-height:2;color:var(--muted)}.architecture{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:22px}.architecture span{padding:9px 13px;border-radius:10px;background:var(--primary-soft);color:var(--primary);font-size:9px}.architecture i{color:var(--muted)}.admin-card{overflow:auto}table{width:100%;border-collapse:collapse;font-size:10px;min-width:620px}th,td{text-align:start;padding:12px;border-bottom:1px solid var(--line)}th{color:var(--muted);font-weight:700;background:var(--surface2)}.status{padding:5px 8px;border-radius:999px;font-size:8px}.status.ok{background:color-mix(in srgb,var(--success) 11%,var(--surface));color:var(--success)}.inline-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:9px}.inline-form .primary{white-space:nowrap}.subtle{color:var(--muted);margin:5px 0 0;font-size:10px}.section-head{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:16px}.section-head h2{margin:2px 0}.section-head small{color:var(--muted);font-size:9px}.permission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.permission-item{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--line);border-radius:13px;padding:12px;background:var(--surface2);cursor:pointer}.permission-item:hover{border-color:color-mix(in srgb,var(--primary) 38%,var(--line));background:var(--primary-soft)}.permission-item input{margin-top:4px;accent-color:var(--primary)}.permission-item span{display:flex;flex-direction:column;min-width:0}.permission-item b{font-size:10px}.permission-item small{font-size:8px;color:var(--muted);overflow-wrap:anywhere;margin-top:3px}.mini{min-height:34px;padding:7px 10px;font-size:8px}.sticky-actions{position:sticky;bottom:14px;display:flex;justify-content:flex-end;padding:12px;background:color-mix(in srgb,var(--surface) 90%,transparent);border:1px solid var(--line);border-radius:15px;box-shadow:0 13px 34px rgba(34,58,105,.12);backdrop-filter:blur(12px);z-index:3}.form-actions{display:flex;justify-content:flex-end;margin-top:17px}.action-link{display:inline-flex;padding:7px 9px;border-radius:9px;background:var(--primary-soft);color:var(--primary);font-weight:700;white-space:nowrap}.permission-module{padding-bottom:22px}
@media(max-width:980px){.auth-shell{grid-template-columns:1fr}.auth-hero{display:none}.auth-panel{min-height:100vh;background:radial-gradient(circle at 15% 8%,color-mix(in srgb,var(--primary) 15%,transparent),transparent 35%),var(--bg)}.admin-shell{grid-template-columns:1fr}.admin-shell aside{position:sticky;height:auto;z-index:20;padding:12px 14px;display:flex;align-items:center;gap:15px;overflow:auto}.admin-shell aside .brand{margin:0;flex:0 0 auto}.admin-shell aside nav{flex-direction:row;white-space:nowrap}.admin-shell nav a{padding:9px 11px}.admin-shell main{padding:22px}.stats{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.identity-preferences{top:auto;bottom:max(12px,env(safe-area-inset-bottom));inset-inline-end:12px}.preferences-popover{top:auto;bottom:48px}.auth-panel{padding:14px;align-items:end}.login-card{padding:23px 17px 19px;border-radius:26px;max-height:calc(100dvh - 28px);overflow:auto}.login-card header h2{font-size:24px}.admin-shell aside{top:0}.admin-shell aside .brand div{display:none}.admin-shell aside .brand-mark{width:38px;height:38px}.admin-shell main{padding:16px 13px 84px}.admin-shell main>header{align-items:flex-start}.admin-shell h1{font-size:21px}.stats{gap:9px}.stats div{padding:15px}.stats b{font-size:24px}.admin-card{padding:15px;border-radius:16px}.inline-form{grid-template-columns:1fr}.permission-grid{grid-template-columns:1fr}.section-head{align-items:flex-start}.sticky-actions{bottom:70px}.architecture{flex-direction:column;align-items:stretch;text-align:center}.architecture i{transform:rotate(90deg)}}
@media(max-width:420px){.login-card{border-radius:23px}.stats{grid-template-columns:1fr 1fr}.stats span{font-size:8px}.stats b{font-size:22px}}

/* Identity administration rendered inside the Angular Shell. */
html.identity-embedded,
html.identity-embedded body {
  min-height: 100%;
  background: var(--bg);
}

html.identity-embedded .identity-preferences {
  display: none !important;
}

html.identity-embedded .admin-shell {
  min-height: 100%;
  grid-template-columns: minmax(0, 1fr);
}

html.identity-embedded .admin-shell > aside {
  position: sticky;
  top: 0;
  z-index: 25;
  height: auto;
  min-width: 0;
  padding: 10px 16px;
  display: flex;
  align-items: center;
  gap: 18px;
  overflow-x: auto;
  overflow-y: hidden;
  box-shadow: 0 10px 28px rgba(9, 21, 45, .14);
}

html.identity-embedded .admin-shell > aside .brand {
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
}

html.identity-embedded .admin-shell > aside .brand-mark {
  width: 38px;
  height: 38px;
  border-radius: 12px;
}

html.identity-embedded .admin-shell > aside nav {
  min-width: max-content;
  flex: 1 0 auto;
  flex-direction: row;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}

html.identity-embedded .admin-shell > aside nav a {
  padding: 9px 12px;
}

html.identity-embedded .admin-shell > main {
  width: 100%;
  max-width: none;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 24px 28px 40px;
  overflow: visible;
}

html.identity-embedded .admin-shell main > header .outline[href="/account/logout"] {
  display: none;
}

@media (max-width: 720px) {
  html.identity-embedded .admin-shell > aside {
    padding: 9px 11px;
    gap: 9px;
  }

  html.identity-embedded .admin-shell > aside .brand div {
    display: none;
  }

  html.identity-embedded .admin-shell > main {
    padding: 16px 13px 28px;
  }
}


/* Final identity experience: development access cards, focus states and polished surfaces. */
.demo-users{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.demo-users button{position:relative;display:flex;align-items:center;gap:10px;min-width:0;padding:11px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(145deg,var(--surface2),var(--surface));color:var(--text);text-align:start;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease}
.demo-users button:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--primary) 34%,var(--line));box-shadow:0 10px 28px color-mix(in srgb,var(--primary) 10%,transparent)}
.demo-users button.selected{border-color:var(--primary);background:color-mix(in srgb,var(--primary-soft) 74%,var(--surface));box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 10%,transparent)}
.demo-users i{width:36px;height:36px;flex:0 0 36px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,var(--primary-soft),color-mix(in srgb,var(--accent) 12%,var(--surface)));color:var(--primary);font-size:9px;font-style:normal;font-weight:900}
.demo-users span{display:flex;flex-direction:column;min-width:0}.demo-users b{font-size:10px}.demo-users small{margin-top:3px;color:var(--muted);font-size:7.5px;line-height:1.65;white-space:normal}
.preferences-toggle,.primary,.outline,.demo-users button,.login-card input,.preferences-popover select{transition:all .18s ease}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid color-mix(in srgb,var(--primary) 25%,transparent);outline-offset:2px}
.auth-panel{background:radial-gradient(circle at 12% 14%,color-mix(in srgb,var(--primary) 9%,transparent),transparent 30%),radial-gradient(circle at 88% 82%,color-mix(in srgb,var(--accent) 8%,transparent),transparent 28%),var(--bg)}
.login-card{position:relative;overflow:hidden}.login-card::before{content:"";position:absolute;inset-inline:0;top:0;height:4px;background:linear-gradient(90deg,var(--primary),var(--accent))}
.preferences-popover{width:238px;padding:15px;box-shadow:0 22px 70px rgba(19,39,78,.17)}
@media(max-width:650px){.demo-users{grid-template-columns:1fr}.demo-users button{padding:10px}.login-card{max-height:none}.auth-panel{align-items:center}}

/* Two-factor authentication keeps the same polished identity surface. */
.security-step{display:flex;align-items:center;gap:11px;margin:5px 0 18px;padding:12px;border:1px solid color-mix(in srgb,var(--primary) 24%,var(--line));border-radius:15px;background:color-mix(in srgb,var(--primary-soft) 42%,var(--surface))}.security-step>i{width:38px;height:38px;flex:0 0 38px;border-radius:12px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,var(--primary),var(--accent));font-style:normal;font-weight:900}.security-step>span{display:grid;gap:2px}.security-step b{font-size:11px}.security-step small{color:var(--muted);font-size:8px;line-height:1.7}.two-factor-form input[dir="ltr"]{text-align:center;letter-spacing:.25em;font-size:16px;font-weight:850}.login-restart{display:block;margin-top:13px;text-align:center;font-size:9px;font-weight:750}

/* Final readability pass: preserve the compact enterprise layout without micro-text. */
.preferences-popover label{font-size:12px}.preferences-popover select{font-size:11.5px}.brand small{font-size:10.5px}.eyebrow,.pill{font-size:10px}.feature-grid b{font-size:13px}.feature-grid span{font-size:10.5px}.hero-footer{font-size:10px}.login-card header p{font-size:12.5px}.login-card label{font-size:12px}.form-row{font-size:11px}.password-help{font-size:10px}.primary,.outline{font-size:12px}.divider{font-size:10.5px}.hint{font-size:9.5px;line-height:1.8}.alert,.success{font-size:11px}.demo-users b{font-size:11.5px}.demo-users small{font-size:9px;line-height:1.7}.security-step b{font-size:12px}.security-step small{font-size:9.5px}.login-restart{font-size:10px}

/* Development demo account picker: grouped by business capability. */
.demo-category-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px}.demo-category-tabs button{border:1px solid var(--line);background:var(--surface2);color:var(--muted);border-radius:999px;padding:7px 10px;font-size:8px;font-weight:850;cursor:pointer}.demo-category-tabs button:hover,.demo-category-tabs button.selected{border-color:var(--primary);background:var(--primary-soft);color:var(--primary)}.demo-users button[hidden]{display:none!important}.demo-users em{display:block;margin-top:3px;color:var(--primary);font-size:7px;font-style:normal;direction:ltr;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.login-card{max-height:calc(100vh - 70px);overflow:auto;scrollbar-width:thin}
@media(max-width:650px){.demo-category-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.demo-category-tabs button{width:100%}.login-card{max-height:none;overflow:visible}}
