/*
 * login-theme-overrides.css
 * Sobrescreve as variáveis do login (login-modern.css) conforme o tema do sistema.
 * A tela de login usa data-login-theme no body quando um tema está configurado em settings.
 */

/*
 * Botão ENTRAR: forçar gradiente e sombra do tema (garante visibilidade em todos os temas)
 */
body[data-login-theme] .login-button {
    background: linear-gradient(135deg, var(--sigo-primary), var(--sigo-primary-dark)) !important;
    box-shadow: var(--shadow-portal);
    color: #fff !important;
}

/*
 * Logo na cor do tema: usa a imagem como máscara e preenche com a cor primária do tema.
 * O wrapper mostra a forma da logo pintada com a cor do tema; a img fica oculta mas mantém acessibilidade.
 */
body[data-login-theme] .logo-image-wrapper {
    position: relative;
    display: inline-block;
    width: 12rem;
    height: 3.75rem;
}
body[data-login-theme] .logo-image-wrapper::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: var(--sigo-primary);
    -webkit-mask-image: url('../img/logo.png');
    mask-image: url('../img/logo.png');
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}
body[data-login-theme] .logo-image-wrapper .logo-image {
    opacity: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
@media (max-width: 640px) {
    body[data-login-theme] .logo-image-wrapper { width: 10rem; height: 3.125rem; }
}
@media (max-width: 480px) {
    body[data-login-theme] .logo-image-wrapper { width: 8rem; height: 2.5rem; }
}

/* night */
body[data-login-theme="night"] {
    --sigo-primary: #464646;
    --sigo-primary-dark: #333333;
    --sigo-primary-light: #6b6b6b;
    --sigo-snowflake-color: #888888;
    --shadow-portal: 0 20px 50px -10px rgba(51, 51, 51, 0.3);
    --shadow-card: 0 10px 30px -5px rgba(51, 51, 51, 0.15);
}

/* amethyst */
body[data-login-theme="amethyst"] {
    --sigo-primary: #af64cc;
    --sigo-primary-dark: #583a63;
    --sigo-primary-light: #c66aeb;
    --sigo-snowflake-color: #d4a3e8;
    --shadow-portal: 0 20px 50px -10px rgba(175, 100, 204, 0.35);
    --shadow-card: 0 10px 30px -5px rgba(175, 100, 204, 0.15);
}

/* modern */
body[data-login-theme="modern"] {
    --sigo-primary: #46b7bf;
    --sigo-primary-dark: #3b3f40;
    --sigo-primary-light: #6bc9d0;
    --sigo-snowflake-color: #7dd4db;
    --shadow-portal: 0 20px 50px -10px rgba(70, 183, 191, 0.35);
    --shadow-card: 0 10px 30px -5px rgba(70, 183, 191, 0.15);
}

/* autumn */
body[data-login-theme="autumn"] {
    --sigo-primary: #e67e22;
    --sigo-primary-dark: #4a392b;
    --sigo-primary-light: #eb9952;
    --sigo-snowflake-color: #f0b880;
    --shadow-portal: 0 20px 50px -10px rgba(230, 126, 34, 0.35);
    --shadow-card: 0 10px 30px -5px rgba(230, 126, 34, 0.15);
}

/* flatie */
body[data-login-theme="flatie"] {
    --sigo-primary: #1ec1b8;
    --sigo-primary-dark: #32323a;
    --sigo-primary-light: #4dd4cc;
    --sigo-snowflake-color: #6bdfd8;
    --shadow-portal: 0 20px 50px -10px rgba(30, 193, 184, 0.35);
    --shadow-card: 0 10px 30px -5px rgba(30, 193, 184, 0.15);
}

/* spring */
body[data-login-theme="spring"] {
    --sigo-primary: #27ae60;
    --sigo-primary-dark: #344a3d;
    --sigo-primary-light: #3ed178;
    --sigo-snowflake-color: #6dd99a;
    --shadow-portal: 0 20px 50px -10px rgba(39, 174, 96, 0.35);
    --shadow-card: 0 10px 30px -5px rgba(39, 174, 96, 0.15);
}

/* fancy */
body[data-login-theme="fancy"] {
    --sigo-primary: #d9416c;
    --sigo-primary-dark: #352b4e;
    --sigo-primary-light: #eb6a8e;
    --sigo-snowflake-color: #e89ab0;
    --shadow-portal: 0 20px 50px -10px rgba(217, 65, 108, 0.35);
    --shadow-card: 0 10px 30px -5px rgba(217, 65, 108, 0.15);
}

/* fire */
body[data-login-theme="fire"] {
    --sigo-primary: #e74c3c;
    --sigo-primary-dark: #4a2e2b;
    --sigo-primary-light: #ec6b5d;
    --sigo-snowflake-color: #f0988e;
    --shadow-portal: 0 20px 50px -10px rgba(231, 76, 60, 0.35);
    --shadow-card: 0 10px 30px -5px rgba(231, 76, 60, 0.15);
}

/* coral */
body[data-login-theme="coral"] {
    --sigo-primary: #ff6b6b;
    --sigo-primary-dark: #3c3e4f;
    --sigo-primary-light: #ff8a8a;
    --sigo-snowflake-color: #ffb3b3;
    --shadow-portal: 0 20px 50px -10px rgba(255, 107, 107, 0.35);
    --shadow-card: 0 10px 30px -5px rgba(255, 107, 107, 0.15);
}

/* lake */
body[data-login-theme="lake"] {
    --sigo-primary: #1c5060;
    --sigo-primary-dark: #043e50;
    --sigo-primary-light: #2d7a8f;
    --sigo-snowflake-color: #5a9fb0;
    --shadow-portal: 0 20px 50px -10px rgba(28, 80, 96, 0.35);
    --shadow-card: 0 10px 30px -5px rgba(28, 80, 96, 0.15);
}

/* forest */
body[data-login-theme="forest"] {
    --sigo-primary: #0ead87;
    --sigo-primary-dark: #3b322c;
    --sigo-primary-light: #2fc9a8;
    --sigo-snowflake-color: #6dd4b8;
    --shadow-portal: 0 20px 50px -10px rgba(14, 173, 135, 0.35);
    --shadow-card: 0 10px 30px -5px rgba(14, 173, 135, 0.15);
}

/* waterlily */
body[data-login-theme="waterlily"] {
    --sigo-primary: #4ca5a9;
    --sigo-primary-dark: #4f243e;
    --sigo-primary-light: #6bb9bd;
    --sigo-snowflake-color: #8fcbce;
    --shadow-portal: 0 20px 50px -10px rgba(76, 165, 169, 0.35);
    --shadow-card: 0 10px 30px -5px rgba(76, 165, 169, 0.15);
}

/* emerald */
body[data-login-theme="emerald"] {
    --sigo-primary: #69b899;
    --sigo-primary-dark: #07313a;
    --sigo-primary-light: #8bc9ad;
    --sigo-snowflake-color: #a8d4c4;
    --shadow-portal: 0 20px 50px -10px rgba(105, 184, 153, 0.35);
    --shadow-card: 0 10px 30px -5px rgba(105, 184, 153, 0.15);
}

/* blackberry */
body[data-login-theme="blackberry"] {
    --sigo-primary: #148e81;
    --sigo-primary-dark: #352738;
    --sigo-primary-light: #2aa89d;
    --sigo-snowflake-color: #5eb5ab;
    --shadow-portal: 0 20px 50px -10px rgba(20, 142, 129, 0.35);
    --shadow-card: 0 10px 30px -5px rgba(20, 142, 129, 0.15);
}