/* Fezma material identity: the approved business-card slate surface. */
.app-shell .sidebar,
html[data-theme=dark] .app-shell .sidebar{
  --surface-2:#1d2223;
  --line:#343a3b;
  --text:#f3f6f6;
  --muted:#aeb8ba;
  background-color:#111617;
  background-image:
    linear-gradient(180deg,rgba(2,8,10,.30),rgba(1,6,8,.50)),
    url('/static/brand/fezma-slate-texture.webp?v=20260912-slate2');
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  border-right:1px solid #343a3b;
  box-shadow:inset -1px 0 #ffffff0a,4px 0 24px #00000024;
}
.app-shell .sidebar .organization-chip{
  background:#111719bf;
  border-color:#4b555659;
  color:#f4f7f7;
  box-shadow:inset 0 1px #ffffff0a;
  -webkit-backdrop-filter:blur(3px);
  backdrop-filter:blur(3px);
}
.app-shell .sidebar .organization-chip span,
.app-shell .sidebar .nav-group>summary,
.app-shell .sidebar .sidebar-footer small{color:#aab5b7}
.app-shell .sidebar .nav-link{color:#d3dadb}
.app-shell .sidebar .nav-link:hover{
  background:#ffffff0b;
  color:#fff;
}
.app-shell .sidebar .nav-link.active{
  background:linear-gradient(90deg,#20c5cc26,#20c5cc0b 72%,transparent);
  color:#fff;
  box-shadow:none;
}
.app-shell .sidebar .nav-link.active::before{
  background:#56e8ec;
  box-shadow:0 0 14px #27d8df8c;
}
.app-shell .sidebar .nav-icon{color:#c9d2d3}
.app-shell .sidebar .nav-link.active .nav-icon{color:#67edf0}
.app-shell .sidebar .sidebar-footer{border-color:#42494a}
.app-shell .sidebar .sidebar-collapse{
  background:#1b2324;
  color:#9fecef;
  border-color:#4e6264;
  box-shadow:0 5px 15px #0008;
}
.app-shell .sidebar .sidebar-collapse:hover{background:#263132;color:#d9ffff}
.app-shell .sidebar .theme-switch,
.app-shell .sidebar .admin-switch,
.app-shell .sidebar .user-card,
.app-shell .sidebar .text-button{color:#e3e9ea}

/* Fezma On Cloud color and material system. */
:root{
  --fezma-petrol:#08747c;
  --fezma-turquoise:#13b8c0;
  --fezma-turquoise-bright:#4ce8ed;
  --premium-purple:#0d98a1;
  --premium-purple-hover:#087981;
  --premium-purple-soft:#e1f7f8;
  --premium-purple-subtle:#f0fbfb;
}
html:not([data-theme=dark]){
  --accent:#0d8e96;
  --accent-soft:#e1f7f8;
  --hover:#edfafa;
  --focus:#0daeb7;
}
html[data-theme=dark]{
  --accent:#39dce2;
  --accent-soft:#12b8c022;
  --hover:#12b8c016;
  --focus:#55e7eb;
}
.app-shell{--brand:#075a62;--accent:#0fa4ad}
.app-shell .section-label,
.app-shell .eyebrow,
.platform-shell .section-label{color:var(--accent)}
.app-shell .button.primary,
.login-panel .button.primary,
.platform-shell .button.primary{
  border-color:#0d98a1;
  background:linear-gradient(135deg,#08747c,#12b8c0);
  color:#fff;
  box-shadow:0 6px 18px #0d98a126;
}
.app-shell .button.primary:hover,
.login-panel .button.primary:hover,
.platform-shell .button.primary:hover{
  border-color:#087981;
  background:linear-gradient(135deg,#07646b,#0da6ae);
}
.app-shell :is(a,button,input,select,textarea,summary):focus-visible,
.login-panel :is(input,button):focus-visible,
.platform-shell :is(input,select,button,a):focus-visible{
  outline-color:#31d6dc;
}
.app-shell :is(.hero-card,.shared-hero,.sales-hero,.module-hero),
.app-shell .sales-start{
  background:linear-gradient(125deg,#06383e,#08747c 56%,#0faeb7);
}
.login-copy{
  background-color:#111617;
  background-image:
    linear-gradient(145deg,rgba(1,8,10,.40),rgba(2,20,23,.70)),
    url('/static/brand/fezma-slate-texture.webp?v=20260912-slate3');
  background-position:center;
  background-size:cover;
  color:#fff;
}
.login-copy .feature-pills span{border-color:#6ee8ec47;background:#0e9ba32b}
.login-panel :is(input,textarea,select):focus{border-color:#16bfc7;box-shadow:0 0 0 3px #13b8c026}
.login-recovery{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.login-recovery>summary{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  width:100%;
  min-height:40px;
  padding:8px 12px;
  border:1px solid #0d98a140;
  border-radius:10px;
  background:#0d98a10d;
  color:#087981;
  cursor:pointer;
  font-size:.86rem;
  font-weight:750;
  list-style:none;
  transition:background .16s,border-color .16s,color .16s;
}
.login-recovery>summary::-webkit-details-marker{display:none}
.login-recovery>summary:hover{border-color:#0d98a178;background:#0d98a118;color:#065f66}
.login-recovery>summary span:last-child{font-size:1.25rem;line-height:1;transition:transform .16s}
.login-recovery[open]>summary{margin-bottom:14px;background:#0d98a118}
.login-recovery[open]>summary span:last-child{transform:rotate(90deg)}
.login-recovery-help{margin:0 0 14px;padding:13px 14px;border-radius:10px;background:var(--surface-2)}
.login-recovery-help strong{display:block;font-size:.78rem;color:var(--text)}
.login-recovery-help p{margin:4px 0 12px;color:var(--muted);font-size:.78rem;line-height:1.5}
.login-recovery-help p:last-child{margin-bottom:0}
html[data-theme=dark] .login-recovery>summary{border-color:#39dce24d;background:#12b8c012;color:#65e9ed}
html[data-theme=dark] .login-recovery>summary:hover{border-color:#55e7eb80;background:#12b8c020;color:#b6f8fa}

/* Fezma On Cloud login: natural slate, metal wordmark and restrained turquoise light. */
.login-body{
  position:relative;
  isolation:isolate;
  min-height:100svh;
  padding:46px;
  overflow-x:hidden;
  background-color:#0b0f10;
  background-image:
    radial-gradient(circle at 18% 20%,rgba(38,210,218,.10),transparent 27%),
    radial-gradient(circle at 82% 82%,rgba(0,0,0,.58),transparent 42%),
    linear-gradient(125deg,rgba(2,7,8,.30),rgba(1,5,6,.76)),
    url('/static/brand/fezma-slate-texture.webp?v=20260912-slate3');
  background-position:center;
  background-size:cover;
  background-attachment:fixed;
}
.login-body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(115deg,#0003,transparent 42%,#0004),radial-gradient(ellipse at center,transparent 42%,#0009 110%);
}
.login-shell{
  position:relative;
  z-index:1;
  width:min(1180px,calc(100vw - 92px));
  min-height:680px;
  grid-template-columns:minmax(0,1.12fr) minmax(390px,.88fr);
  overflow:hidden;
  border:1px solid #87909142;
  border-radius:28px;
  background:#101617e6;
  box-shadow:0 34px 100px #000b,0 0 0 1px #0008,inset 0 1px #ffffff0a;
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
}
.login-copy{
  position:relative;
  isolation:isolate;
  justify-content:space-between;
  padding:58px 62px 52px;
  border-right:1px solid #77828436;
  background:
    linear-gradient(150deg,rgba(1,8,10,.18),rgba(2,19,21,.54)),
    url('/static/brand/fezma-slate-texture.webp?v=20260912-slate3') center/cover no-repeat;
}
.login-copy::before{
  content:"";
  position:absolute;
  inset:auto -12% 9% 9%;
  z-index:-1;
  width:auto;
  height:46%;
  border:0;
  border-radius:50%;
  background:radial-gradient(ellipse,#10cbd329 0%,#10cbd30b 36%,transparent 70%);
  transform:none;
  filter:blur(12px);
}
.login-copy::after{content:none}
.login-hero-brand{display:flex;align-items:center;justify-content:space-between;gap:24px}
.login-hero-brand>img{display:block;width:min(365px,72%);height:auto;filter:drop-shadow(0 8px 18px #0008)}
.login-cloud-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
  padding:8px 11px;
  border:1px solid #4edee35c;
  border-radius:999px;
  background:#0c858d1c;
  color:#b8f8fa;
  font-size:9px;
  font-weight:800;
  letter-spacing:.14em;
}
.login-cloud-badge i,.login-access-label i{width:6px;height:6px;border-radius:50%;background:#48e4e9;box-shadow:0 0 12px #25d8df;display:inline-block}
.login-copy-content{margin:auto 0;max-width:500px;padding:60px 0 44px}
.login-copy .eyebrow{color:#83e9ec;font-size:10px;letter-spacing:.18em}
.login-copy h1{margin:19px 0 18px;color:#f4f7f7;font-size:clamp(43px,4vw,59px);font-weight:570;line-height:.99;letter-spacing:-.055em}
.login-copy h1 span{color:#c9d1d2;font-weight:390}
.login-copy p{max-width:450px;margin:0;color:#bdc7c8;font-size:15px;line-height:1.7}
.login-copy .feature-pills{gap:9px;margin-top:0;flex-wrap:wrap}
.login-copy .feature-pills span{
  position:relative;
  padding:8px 12px 8px 25px;
  border-color:#8ea0a238;
  background:#080d0e4d;
  color:#d9e0e1;
  font-size:9px;
  letter-spacing:.045em;
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px);
}
.login-copy .feature-pills span::before{content:"";position:absolute;left:11px;top:50%;width:5px;height:5px;border-radius:50%;background:#38d9df;transform:translateY(-50%);box-shadow:0 0 8px #38d9df80}
.login-panel{
  position:relative;
  justify-content:center;
  padding:58px 56px 48px;
  background:#f7f9f8f5;
  color:#172123;
  box-shadow:inset 1px 0 #fff8;
}
.login-panel::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,transparent,#36dce2 50%,transparent);opacity:.75}
.login-panel .login-fezma-lockup{display:none}
.login-panel .login-access-label{display:flex;align-items:center;gap:8px;color:#087981;font-size:9px;letter-spacing:.16em}
.login-panel h2{margin:10px 0 8px;color:#172123;font-size:32px;font-weight:650;letter-spacing:-.04em}
.login-panel>p{margin:0 0 24px;color:#687679;font-size:12px;line-height:1.55}
.login-panel .form-stack{gap:16px}
.login-panel label{color:#344447;font-size:10px;font-weight:780;letter-spacing:.035em}
.login-panel input{
  min-height:48px;
  margin-top:7px;
  padding:12px 14px;
  border:1px solid #bcc7c8;
  border-radius:10px;
  background:#fff;
  color:#142022;
  font-size:14px;
  box-shadow:inset 0 1px 2px #0c272a0a;
}
.login-panel input:hover{border-color:#92a5a7}
.login-panel .button.primary{min-height:49px;margin-top:3px;border-radius:10px;font-size:11px;letter-spacing:.045em;box-shadow:0 10px 24px #0879812e}
.login-panel .alert{margin:0 0 18px;border-radius:10px}
.login-recovery{margin-top:17px;padding-top:15px;border-color:#c9d1d2}
.login-recovery>summary{border-color:#0d98a138;background:#0d98a109;color:#08757c}
.login-recovery-help{border:1px solid #d6dddd;background:#edf2f1}
.login-recovery-help p{color:#687679}
.login-panel .login-recovery .button.secondary{min-height:45px;border-color:#aab8ba;background:#fff;color:#284144}
.login-panel .local-hint{
  display:flex;
  align-items:center;
  gap:11px;
  margin-top:20px;
  padding:15px 0 0;
  border-color:#c9d1d2;
}
.local-hint-icon{display:grid!important;place-items:center;width:28px;height:28px;flex:0 0 auto;border:1px solid #18a6ae42;border-radius:50%;background:#0fa4ad10;color:#07818a!important;font-size:12px!important;font-weight:900}
.login-panel .local-hint strong{color:#435154;font-size:8px}
.login-panel .local-hint span{color:#788587;font-size:9px}
.login-theme-switch{
  left:auto;
  right:22px;
  bottom:18px;
  border-color:#6d78794d;
  background:#0b1112cc;
  color:#dce4e5;
  box-shadow:0 8px 24px #0006;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}
html[data-theme=dark] .login-shell{border-color:#71808240;background:#0c1112eb;box-shadow:0 34px 100px #000c,0 0 0 1px #0009}
html[data-theme=dark] .login-panel{background:#111718f2;color:#eef3f3;box-shadow:inset 1px 0 #ffffff08}
html[data-theme=dark] .login-panel :is(h1,h2,h3,label,strong){color:#eef3f3}
html[data-theme=dark] .login-panel>p{color:#9da9ab}
html[data-theme=dark] .login-panel .login-access-label{color:#5de1e5}
html[data-theme=dark] .login-panel input{border-color:#3b4749;background:#0b1011;color:#f2f6f6;color-scheme:dark;box-shadow:inset 0 1px 3px #0007}
html[data-theme=dark] .login-panel input:hover{border-color:#526164}
html[data-theme=dark] .login-recovery{border-color:#303a3c}
html[data-theme=dark] .login-recovery-help{border-color:#334043;background:#0d1314}
html[data-theme=dark] .login-recovery-help p{color:#9da9ab}
html[data-theme=dark] .login-panel .login-recovery .button.secondary{border-color:#425052;background:#171f20;color:#e6eeee}
html[data-theme=dark] .login-panel .local-hint{border-color:#303a3c}
html[data-theme=dark] .login-panel .local-hint strong{color:#c6d0d1}
html[data-theme=dark] .login-panel .local-hint span{color:#899698}
@media(max-width:980px){
  .login-body{padding:28px}
  .login-shell{width:min(980px,calc(100vw - 56px));grid-template-columns:minmax(0,.9fr) minmax(380px,1.1fr)}
  .login-copy{padding:46px 38px 42px}
  .login-hero-brand{align-items:flex-start;flex-direction:column}
  .login-hero-brand>img{width:min(330px,86%)}
  .login-copy h1{font-size:44px}
  .login-panel{padding:52px 42px 44px}
}
@media(max-width:760px){
  .login-body{display:block;padding:18px 16px 76px}
  .login-shell{width:100%;min-height:0;margin:0 auto;grid-template-columns:1fr;border-radius:22px}
  .login-copy{display:none}
  .login-panel{min-height:calc(100svh - 112px);padding:42px 27px 32px;border-top:0}
  .login-panel .login-fezma-lockup{display:block;width:min(270px,82%);margin:0 auto 38px}
  .login-panel h2{font-size:29px}
  .login-theme-switch{right:50%;bottom:15px;transform:translateX(50%)}
}
.platform-shell .platform-bar{
  border-bottom-color:#394243;
  background-color:#111617;
  background-image:
    linear-gradient(90deg,rgba(1,8,10,.30),rgba(1,8,10,.58)),
    url('/static/brand/fezma-slate-texture.webp?v=20260912-slate3');
  background-position:center;
  background-size:cover;
  box-shadow:0 5px 22px #0003;
}
.platform-shell .platform-brand-wordmark.light{display:none}
.platform-shell .platform-brand-wordmark.dark{display:block}
.platform-shell .platform-brand span{color:#b9c5c6}
.platform-shell .platform-actions .button.secondary,
.platform-shell .platform-actions .theme-switch{border-color:#536061;background:#12191acc;color:#eef4f4}