@import '_content/BlazorColorPicker/BlazorColorPicker.19a8bqc7m0.bundle.scp.css';

/* _content/Freeder.App/Pages/Authenticate/Login.razor.rz.scp.css */
/*
   Estilo da tela de login em layout "cover". Fica em CSS isolado (entra no bundle
   Freeder.App.styles.css) em vez de no SCSS do template: é estilo de uma tela só, e
   assim não há risco de mexer em assets/css/styles.css, que é versionado compilado.

   Os valores vêm dos tokens do site (https://freeder.tech, /css/freeder.css) — os
   mesmos usados em freeder/login-cover.svg, para a capa e a arte não divergirem:
   verde #26A65B, fundo #0B1117, superfície #121A23, texto #E7EDF3, apagado #94A3B8.
*/

/* ---------- proporção 60/40 ---------- */

/* A grade do Bootstrap não tem 70%: col-8 dá 66,7% e col-9 dá 75%. Daí a largura vir
   daqui. O breakpoint 1200px é o xl, o mesmo do d-none/d-xl-block que esconde a capa
   abaixo dele — os dois precisam virar juntos, senão sobra uma coluna vazia no tablet.

   Em 70/30 a coluna do formulário nunca fica menor que 360px (30% do próprio xl), que
   comporta os campos sem aperto — por isso não há piso em min-width aqui. */
@media (min-width: 1200px) {
    .freeder-cover-col[b-f2vxhhige2] {
        width: 70%;
    }

    .freeder-form-col[b-f2vxhhige2] {
        width: 30%;
    }
}

/* ---------- capa (esquerda) ---------- */

.freeder-cover[b-f2vxhhige2] {
    position: relative;
    min-height: 100vh;
    background-color: #0b1117;
    /* A imagem gerada; center/cover mantém o núcleo do diagrama sempre visível.
       O caminho é relativo à RAIZ do app, não a este arquivo: o CSS isolado é
       concatenado em /Freeder.App.styles.css, e url() resolve contra a URL do
       bundle. Um "../../" aqui daria 404. */
    background-image: url("freeder/login-cover.svg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.freeder-cover-content[b-f2vxhhige2] {
    position: relative;
    z-index: 1;
    min-height: 100vh;
    padding: 3rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 2rem;
}

.freeder-cover-logo[b-f2vxhhige2] {
    height: 2.25rem;
    width: auto;
    align-self: flex-start;
}

.freeder-cover-eyebrow[b-f2vxhhige2] {
    margin-bottom: 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #26a65b;
}

.freeder-cover-title[b-f2vxhhige2] {
    margin-bottom: 0.875rem;
    /* balance distribui as duas linhas; sem isso, em 1920 sobrava só "real" na
       segunda linha, porque o corpo cresce com vw mas a largura não. */
    max-width: 20ch;
    text-wrap: balance;
    font-size: clamp(1.75rem, 1rem + 1.6vw, 2.5rem);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.02em;
    color: #f8fafc;
}

.freeder-cover-mark[b-f2vxhhige2] {
    color: #26a65b;
}

.freeder-cover-sub[b-f2vxhhige2] {
    margin-bottom: 1.75rem;
    max-width: 42ch;
    font-size: 1rem;
    line-height: 1.6;
    color: #94a3b8;
}

/* Os chips do hero do site: pílula de vidro com borda fina. */
.freeder-chips[b-f2vxhhige2] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.freeder-chips li[b-f2vxhhige2] {
    padding: 0.375rem 0.875rem;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.22);
    background-color: rgba(231, 237, 243, 0.05);
    font-size: 0.8125rem;
    font-weight: 600;
    color: #e7edf3;
    white-space: nowrap;
}

.freeder-cover-foot[b-f2vxhhige2] {
    margin-bottom: 0;
    font-size: 0.8125rem;
    color: #6b7278;
}

/* ---------- formulário (direita) ---------- */

/*
   O painel do formulário é BRANCO sempre, independente do tema.

   Desde que o _Layout.cshtml passou a carimbar `data-theme-mode="light"` no login, os
   tokens abaixo repetem o que a página já entrega — são redundantes, não errados. Ficam
   como trava: se algum dia esta tela voltar a ser carimbada como dark (era assim até
   então), sem eles os campos, rótulos e títulos herdariam as cores do escuro e o
   resultado seria texto claro sobre branco. Como são custom properties, tudo que está
   dentro da coluna herda os valores, sem sobrescrever `.form-control`, `.form-label`,
   `h5` e companhia um a um.

   Os valores são exatamente os do bloco `:root` de assets/scss/_variables.scss. Se o
   tema claro do template mudar, estes precisam acompanhar.
*/
.freeder-form-col[b-f2vxhhige2] {
    background-color: #fff;

    --custom-white: #fff;
    --custom-black: #000;
    --default-text-color: #333335;
    --default-border: #f3f3f3;
    --default-background: #f7f8f9;
    --bootstrap-card-border: #f3f3f3;
    --text-muted: #8c9097;
    --input-border: #e9edf6;
    --form-control-bg: #ffffff;
    --light-rgb: 243, 246, 248;

    /* .form-control e .text-muted caem nestes dois do Bootstrap, não nos do template */
    --bs-body-color: #212529;
    --bs-body-bg: #fff;
    --bs-secondary-color: rgba(33, 37, 41, 0.75);

    color: #333335;
}

.freeder-login-form[b-f2vxhhige2] {
    padding: 3rem 0;
    /* A coluna é percentual, então em telas largas o campo esticaria demais. Trava a
       medida e centraliza dentro da coluna. */
    max-width: 24rem;
    margin-inline: auto;
}

/* Sempre visível (antes era só no mobile) e centralizado com o título e o subtítulo. */
.freeder-form-logo[b-f2vxhhige2] {
    display: block;
    height: 2.5rem;
    width: auto;
    margin: 0 auto 1.75rem;
}

/* Menor que o btn-lg de antes, e sem esticar na largura da coluna. Os valores são um
   passo abaixo do .btn do template (0.5rem/0.85rem, fonte 0.85rem) — não uso btn-sm
   porque ele cai para 0.25rem de padding, pequeno demais ao lado dos form-control-lg. */
.freeder-login-submit[b-f2vxhhige2] {
    padding: 0.4rem 1.25rem;
    font-size: 0.8rem;
}

/* "Recuperar senha" e "Voltar ao login": link de verdade, não botão pintado. */
.freeder-link[b-f2vxhhige2] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--primary-color);
    text-decoration: none;
    vertical-align: baseline;
}

.freeder-link:hover[b-f2vxhhige2] {
    text-decoration: underline;
}

/* O botão de mostrar/ocultar senha vive em Shared/PasswordInput.razor.css — o CSS é
   isolado por componente, então o estilo tem de morar junto do markup dele. */

/* O código é numérico e curto: monoespaçado e espaçado, para conferir dígito a dígito. */
.freeder-code-input[b-f2vxhhige2] {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 1.25rem;
    letter-spacing: 0.5em;
    text-align: center;
}

/* O contêiner do formulário não é um .card, então o rótulo não herda o peso que o
   template dá dentro de um card. */
.freeder-login-form[b-f2vxhhige2]  .form-label {
    font-weight: 500;
}

.freeder-login-form[b-f2vxhhige2]  .validation-message {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.75rem;
    color: rgb(var(--danger-rgb));
}
/* _content/Freeder.App/Shared/ColumnFilterPanel.razor.rz.scp.css */
/*
   As setinhas de incremento que o navegador desenha no canto de um <input type="number">.
   O tema as mantém visíveis (`::-webkit-inner-spin-button { height: auto }` em
   assets/css/styles.css), e num campo estreito de filtro elas ficam colando no texto.

   Some com elas em vez de trocar por um "$": o prefixo de moeda exigiria um input-group, e
   este mesmo painel filtra também colunas que não são dinheiro (Atraso em dias, Nufin) — um
   "$" ali seria pior que nada. O type=number continua sendo number: o teclado numérico do
   celular e a validação do navegador permanecem.
*/
input[type="number"][b-55xpprfj8i]::-webkit-outer-spin-button,
input[type="number"][b-55xpprfj8i]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
}

input[type="number"][b-55xpprfj8i] {
    -moz-appearance: textfield;
    appearance: textfield;
}
/* _content/Freeder.App/Shared/MainLayout.razor.rz.scp.css */
/* _content/Freeder.App/Shared/NavMenu.razor.rz.scp.css */
/* _content/Freeder.App/Shared/OwnerLogo.razor.rz.scp.css */
/*
   Nenhuma medida fixa aqui. Largura e altura do ícone vêm por style inline do componente,
   a partir do parâmetro Size — é isso que permite o mesmo logo servir a uma grade densa e
   a uma notificação sem virar dois assets.
*/

.owner-logo[b-dpaz8d6wxr] {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
}

.owner-logo-inline[b-dpaz8d6wxr] {
    gap: 0.5rem;
}

/* contain, e não cover: logo de marca não pode ser cortado para preencher o quadrado. */
.owner-logo-img[b-dpaz8d6wxr] {
    object-fit: contain;
    flex: 0 0 auto;
    border-radius: 0.25rem;
}

/* Selo de iniciais para empresa ainda sem logo. Ocupa exatamente o mesmo espaço da
   imagem, então a coluna não muda de largura conforme a linha. */
.owner-logo-fallback[b-dpaz8d6wxr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border-radius: 0.25rem;
    background-color: var(--primary01);
    color: var(--primary-color);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
    user-select: none;
}

.owner-logo-label[b-dpaz8d6wxr] {
    white-space: nowrap;
}
/* _content/Freeder.App/Shared/PasswordInput.razor.rz.scp.css */
/*
   Botão de mostrar/ocultar senha. Colado no campo: mesma borda, mesmo fundo e sem
   borda à esquerda (o input entra com .border-end-0), para os dois lerem como um
   controle só em vez de campo + botão.

   As cores saem das custom properties do tema, que são herdadas pelo DOM — na tela
   de login quem as redefine é .freeder-form-col, que carimba o tema CLARO no painel
   branco mesmo com a página em dark. Por isso nada aqui é cor literal.
*/
.freeder-password-toggle[b-4dbtandvr5] {
    border: 1px solid var(--input-border);
    border-left: 0;
    background-color: var(--form-control-bg);
    color: var(--text-muted);
    padding-inline: 0.85rem;
}

/* Quando o botão de copiar acompanha o olho, os dois precisam de um traço entre si:
   sem isto viram um bloco único e não dá para saber onde um termina. */
.freeder-password-toggle + .freeder-password-toggle[b-4dbtandvr5] {
    border-left: 1px solid var(--input-border);
}

.freeder-password-toggle:hover[b-4dbtandvr5],
.freeder-password-toggle:focus[b-4dbtandvr5] {
    background-color: var(--form-control-bg);
    color: var(--default-text-color);
}