/* auth.css for auth | (c) Flo Info 38 | https://www.floinfo38.fr */
@font-face{font-family:'MiSans';font-display:swap;src:url(../fonte/MiSansLatin-Demibold.woff2)format("woff2")}
:root{--font-main:"MiSans",Arial,sans-serif;--color-primary:#e4e6eb;--color-secondary:#f5f5f5;--bg-color:#242526;--button-bg:#376df9;--button-hover:#2a5bd9;--form-bg:#45494c;--color-link:#7ea2ff;scrollbar-color:var(--color-secondary) #333;scrollbar-width:thin}

/* Base */
html{background-color:var(--bg-color)}
body{box-sizing:border-box;color:var(--color-primary);font-family:var(--font-main);margin:0}
a{color:var(--color-link);text-decoration:none}

/* User info */
#user-info{color:var(--color-secondary);margin:10px 20px 0;text-align:center}
#user-info a{color:var(--color-link)}

/* Auth page */
.auth-page{align-items:center;display:flex;flex-direction:column;justify-content:center;margin:0;min-height:100vh;padding:20px}
.auth-page #user-info{margin-bottom:30px}
.auth-page form{background:var(--form-bg);border-radius:12px;box-shadow:0px 8px 16px 0px rgba(0,0,0,1);margin:0 auto;max-width:400px;padding:30px;width:100%}
@media (max-width: 768px){.auth-page form{margin:20px;padding:20px}}
@media (max-width: 480px){.auth-page form{padding:15px}}
.auth-page h2{align-items:center;color:var(--color-secondary);display:flex;font-size:1.5rem;font-weight:400;gap:10px;justify-content:center;margin-bottom:30px;text-align:center}
.auth-page label{align-items:center;color:var(--color-secondary);display:flex;gap:8px;margin-bottom:8px}
.auth-page input{background:var(--bg-color);border:1px solid var(--form-bg);border-radius:8px;box-sizing:border-box;color:var(--color-secondary);font-family:inherit;font-size:1rem;margin-bottom:25px;outline:none;padding:15px 18px;width:100%}
.auth-page .password-container{position:relative}
.auth-page .toggle-password{cursor:pointer;height:20px;position:absolute;right:15px;top:43%;user-select:none;width:20px}
.auth-page button{align-items:center;background:var(--button-bg);border:none;border-radius:8px;color:var(--color-secondary);cursor:pointer;display:flex;font-family:inherit;font-size:1.1rem;gap:10px;justify-content:center;outline:none;padding:18px 24px;user-select:none;width:100%}
.auth-page button:hover{background:var(--button-hover)}
.auth-page p{font-size:85%;margin:30px 0 0;text-align:center}

/* Loading spinner */
.btn-loading::after,.spinner{animation:spin 0.8s linear infinite;border:2px solid rgba(255, 255, 255, 0.3);border-top-color:var(--color-primary);border-radius:50%;display:inline-block;height:16px;margin-left:8px;vertical-align:middle;width:16px}
.loading{cursor:wait;opacity:0.7;pointer-events:none}
@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}