/* CleanONE · identidade CleanTI sobre o visual Fluent (estilo portal Azure).
   Paleta da marca: azul profundo #0f5c9c · azul #1f8fd0 · ciano #45b3e0 · grafite #2e2f2f. Fonte de marca: Bebas Neue. */
@font-face { font-family: "Bebas Neue"; font-weight: 700; font-display: swap; src: url(../fonts/BebasNeue-Bold.ttf) format("truetype"); }
:root {
  --primary: 206 75% 37%; --primary-glow: 203 74% 47%;
  --top: 207 82% 33%; --nav-active: 205 80% 95%; --info: 197 72% 40%;
  --brand-deep: #0f5c9c; --brand: #1f8fd0; --brand-cyan: #45b3e0; --brand-ink: #2e2f2f;
}
.dark { --primary: 200 75% 62%; --primary-glow: 197 72% 58%; --nav-active: 207 40% 22%; }
.az-top { background: linear-gradient(90deg, #0f5c9c 0%, #1769a4 55%, #1f8fd0 100%); }
.dark .az-top { background: linear-gradient(90deg, #0b2f4d 0%, #0f3b60 100%); }
.az-logo { height: 30px !important; width: auto; }

/* login */
.login-az { background: radial-gradient(1200px 600px at 10% 0%, rgba(69, 179, 224, .22), transparent 60%), linear-gradient(160deg, #eaf4fb 0%, #f7fafc 60%); }
.dark .login-az { background: radial-gradient(1200px 600px at 10% 0%, rgba(69, 179, 224, .14), transparent 60%), linear-gradient(160deg, #0d1b28 0%, #0a1118 100%); }
.login-brand img { height: 34px; width: auto; display: block; }
.dark .login-brand img.lb-light { display: none; } .login-brand img.lb-dark { display: none; } .dark .login-brand img.lb-dark { display: block; }
.dark .login-brand img.lb-dark { background: #0f5c9c; padding: 6px 10px; }
.login-demo { margin-top: 18px; padding: 14px; border: 1px solid rgba(31, 143, 208, .35); background: rgba(69, 179, 224, .08); font-size: 13px; line-height: 1.5; }
.login-demo b { display: block; font-family: "Bebas Neue", var(--font); font-size: 20px; letter-spacing: .04em; color: var(--brand-deep); font-weight: 700; }
.dark .login-demo b { color: #9ad8f5; }
.login-demo .btn { margin-top: 10px; width: 100%; justify-content: center; }
.login-tag { font-family: "Bebas Neue", var(--font); letter-spacing: .06em; font-size: 15px; color: hsl(var(--muted-fg)); }

/* faixa do modo demonstração */
.demo-band { position: fixed; left: 50%; bottom: 12px; transform: translateX(-50%); z-index: 40; display: flex; align-items: center; gap: 10px; padding: 6px 14px; font-size: 12.5px; color: #0b3a5e; box-shadow: 0 4px 14px rgba(15, 92, 156, .18); max-width: calc(100vw - 24px);
  background: repeating-linear-gradient(135deg, #e3f3fb 0 14px, #d6eef9 14px 28px); border-bottom: 1px solid #b5ddf1; }
.demo-band b { font-family: "Bebas Neue", var(--font); font-size: 16px; letter-spacing: .06em; color: #0f5c9c; }
.demo-band svg { width: 15px; height: 15px; color: #1f8fd0; }
.dark .demo-band { color: #cfe9f7; background: repeating-linear-gradient(135deg, #0f2a40 0 14px, #12324c 14px 28px); border-color: #1d4a6c; }
.dark .demo-band b { color: #9ad8f5; }
.demo-band .sp { opacity: .75; }
.demo-band button { border: 0; background: none; color: inherit; cursor: pointer; padding: 0 0 0 6px; opacity: .6; } .demo-band button:hover { opacity: 1; }
@media (max-width: 640px) { .demo-band .sp { display: none; } }
.login-or { display: flex; align-items: center; gap: 10px; margin: 16px 0 10px; color: hsl(var(--muted-fg)); font-size: 12px; }
.login-or::before, .login-or::after { content: ""; flex: 1; height: 1px; background: hsl(var(--border)); }
.login-ms { width: 100%; justify-content: center; gap: 10px; display: flex !important; align-items: center; text-decoration: none; }