/* /Components/Plataforma/AgendaAoVivo.razor.rz.scp.css */
/*
 * Loop de 14s. Estado base = agenda cheia (o que aparece com movimento reduzido / sem suporte).
 * Cada card i entra em (8, 24, 40, 55, 71)% do ciclo; todos somem juntos em 96% e o ciclo recomeça.
 * Os avisos usam um único keyframe com delay (cada um aparece uma vez por ciclo de 14s).
 */

.ag[b-mvp7edfesm] {
    position: relative;
    width: 100%;
    max-width: 540px;
    margin-inline: auto;
}

/* ---------- Endereço digitando ---------- */

.ag__endereco[b-mvp7edfesm] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    width: fit-content;
    margin: 0 0 1rem;
    padding: 0.55rem 1rem;
    border: 1px solid var(--cf-line-strong);
    border-radius: 999px;
    background: rgba(10, 16, 36, 0.6);
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--cf-fg);
}

.ag__cadeado[b-mvp7edfesm] {
    width: 0.7rem;
    height: 0.7rem;
    border-radius: 50%;
    background: var(--cf-ok);
    box-shadow: 0 0 0 4px rgba(61, 220, 151, 0.18);
    animation: ag-respira-b-mvp7edfesm 2.4s ease-in-out infinite;
}

/* Três nomes empilhados na mesma célula; cada um ocupa uma fatia de 4,6s do ciclo de 14s:
   digita, fica à mostra e some para o próximo entrar. Sem animação, só o primeiro aparece. */
.ag__url[b-mvp7edfesm] {
    display: grid;
}

.ag__site[b-mvp7edfesm] {
    grid-area: 1 / 1;
    display: inline-flex;
    opacity: 0;
    animation: ag-site-b-mvp7edfesm 14s linear infinite;
    animation-delay: calc(var(--s) * 4.6s);
}

.ag__site:first-child[b-mvp7edfesm] {
    opacity: 1;
}

.ag__digita[b-mvp7edfesm] {
    display: inline-block;
    clip-path: inset(0 0 0 0);
    animation: ag-digita-b-mvp7edfesm 14s steps(13, end) infinite;
    animation-delay: calc(var(--s) * 4.6s);
}

.ag__dominio[b-mvp7edfesm] {
    color: var(--cf-fg-muted);
}

.ag__legenda[b-mvp7edfesm] {
    margin: -0.4rem 0 1rem 1rem;
    font-size: 0.8125rem;
    color: var(--cf-fg-muted);
}

@keyframes ag-site-b-mvp7edfesm {
    0%, 28% { opacity: 1; }
    32%, 100% { opacity: 0; }
}

@keyframes ag-digita-b-mvp7edfesm {
    0% { clip-path: inset(0 100% 0 0); }
    9%, 100% { clip-path: inset(0 0 0 0); }
}

@keyframes ag-respira-b-mvp7edfesm {
    50% { box-shadow: 0 0 0 8px rgba(61, 220, 151, 0); }
}

/* ---------- Painel ---------- */

.ag__painel[b-mvp7edfesm] {
    position: relative;
    padding: 1.25rem;
    border-radius: var(--cf-radius-l);
    box-shadow: 0 40px 90px -40px rgba(61, 107, 255, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.03) inset;
}

.ag__topo[b-mvp7edfesm] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 1rem;
    margin-bottom: 0.75rem;
    border-bottom: 1px solid var(--cf-line);
}

.ag__dia[b-mvp7edfesm] {
    margin: 0;
    font-family: var(--cf-font-display);
    font-size: 2rem;
    font-weight: 800;
    line-height: 0.95;
}

.ag__sub[b-mvp7edfesm] {
    margin: 0.25rem 0 0;
    font-size: 0.875rem;
    color: var(--cf-fg-muted);
}

.ag__total[b-mvp7edfesm] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    margin: 0;
    text-align: right;
}

.ag__total-rotulo[b-mvp7edfesm] {
    font-size: 0.8125rem;
    color: var(--cf-fg-muted);
}

.ag__valor[b-mvp7edfesm] {
    font-family: var(--cf-font-display);
    font-size: 2.1rem;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    --cf-n: 220;
    animation: ag-conta-b-mvp7edfesm 14s linear infinite;
}

.ag__valor[b-mvp7edfesm]::before {
    content: 'R$ ';
    font-size: 0.6em;
    color: var(--cf-fg-muted);
}

.ag__valor[b-mvp7edfesm]::after {
    counter-reset: ag-n var(--cf-n);
    content: counter(ag-n) ',00';
}

@keyframes ag-conta-b-mvp7edfesm {
    0%, 8% { --cf-n: 0; }
    11%, 24% { --cf-n: 45; }
    27%, 40% { --cf-n: 115; }
    43%, 55% { --cf-n: 150; }
    58%, 71% { --cf-n: 200; }
    74%, 96% { --cf-n: 220; }
    97%, 100% { --cf-n: 0; }
}

/* ---------- Linha do dia ---------- */

.ag__dia-lista[b-mvp7edfesm] {
    position: relative;
    display: grid;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ag__slot[b-mvp7edfesm] {
    display: grid;
    grid-template-columns: 3.25rem 1fr;
    align-items: center;
    min-height: 3.75rem;
}

.ag__hora[b-mvp7edfesm] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--cf-fg-muted);
    font-variant-numeric: tabular-nums;
}

.ag__card[b-mvp7edfesm] {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.85rem;
    height: 100%;
    min-height: 3.5rem;
    padding: 0.5rem 0.9rem 0.5rem 0.75rem;
    border: 1px solid var(--cf-line-strong);
    border-radius: 14px;
    background: linear-gradient(90deg, rgba(61, 107, 255, 0.28), rgba(61, 107, 255, 0.1)), var(--cf-ink-2);
    overflow: hidden;
}

/* Vaga vazia atrás do card: o traço tracejado que "recebe" o cliente. */
.ag__slot[b-mvp7edfesm]::after {
    content: '';
    grid-column: 2;
    grid-row: 1;
    align-self: stretch;
    border: 1px dashed var(--cf-line);
    border-radius: 14px;
    z-index: 0;
}

.ag__card[b-mvp7edfesm] {
    grid-column: 2;
    grid-row: 1;
    z-index: 1;
}

.ag__fita[b-mvp7edfesm] {
    align-self: stretch;
    width: 5px;
    border-radius: 999px;
    background-image: repeating-linear-gradient(135deg, var(--cf-red) 0 14px, var(--cf-foam) 14px 28px, var(--cf-blue) 28px 42px, var(--cf-foam) 42px 56px);
    background-size: 100% var(--cf-pole-h);
    animation: cf-pole-y 2.4s linear infinite;
}

.ag__info[b-mvp7edfesm] {
    flex: 1;
    min-width: 0;
}

.ag__nome[b-mvp7edfesm],
.ag__servico[b-mvp7edfesm],
.ag__preco[b-mvp7edfesm] {
    margin: 0;
}

.ag__nome[b-mvp7edfesm] {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.2;
}

.ag__servico[b-mvp7edfesm] {
    font-size: 0.8125rem;
    color: var(--cf-fg-muted);
    line-height: 1.3;
}

.ag__preco[b-mvp7edfesm] {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.ag__slot:nth-child(1) .ag__card[b-mvp7edfesm] { animation: ag-c0-b-mvp7edfesm 14s var(--cf-ease) infinite; }
.ag__slot:nth-child(2) .ag__card[b-mvp7edfesm] { animation: ag-c1-b-mvp7edfesm 14s var(--cf-ease) infinite; }
.ag__slot:nth-child(3) .ag__card[b-mvp7edfesm] { animation: ag-c2-b-mvp7edfesm 14s var(--cf-ease) infinite; }
.ag__slot:nth-child(4) .ag__card[b-mvp7edfesm] { animation: ag-c3-b-mvp7edfesm 14s var(--cf-ease) infinite; }
.ag__slot:nth-child(5) .ag__card[b-mvp7edfesm] { animation: ag-c4-b-mvp7edfesm 14s var(--cf-ease) infinite; }

@keyframes ag-c0-b-mvp7edfesm {
    0%, 7% { opacity: 0; transform: translateX(-18px) scale(0.96); box-shadow: 0 0 0 0 rgba(138, 165, 255, 0); }
    10% { opacity: 1; transform: none; box-shadow: 0 0 0 6px rgba(138, 165, 255, 0.35); }
    16% { box-shadow: 0 0 0 0 rgba(138, 165, 255, 0); }
    90% { opacity: 1; }
    96%, 100% { opacity: 0; transform: translateY(6px); }
}

@keyframes ag-c1-b-mvp7edfesm {
    0%, 23% { opacity: 0; transform: translateX(-18px) scale(0.96); box-shadow: 0 0 0 0 rgba(138, 165, 255, 0); }
    26% { opacity: 1; transform: none; box-shadow: 0 0 0 6px rgba(138, 165, 255, 0.35); }
    32% { box-shadow: 0 0 0 0 rgba(138, 165, 255, 0); }
    90% { opacity: 1; }
    96%, 100% { opacity: 0; transform: translateY(6px); }
}

@keyframes ag-c2-b-mvp7edfesm {
    0%, 39% { opacity: 0; transform: translateX(-18px) scale(0.96); box-shadow: 0 0 0 0 rgba(138, 165, 255, 0); }
    42% { opacity: 1; transform: none; box-shadow: 0 0 0 6px rgba(138, 165, 255, 0.35); }
    48% { box-shadow: 0 0 0 0 rgba(138, 165, 255, 0); }
    90% { opacity: 1; }
    96%, 100% { opacity: 0; transform: translateY(6px); }
}

@keyframes ag-c3-b-mvp7edfesm {
    0%, 54% { opacity: 0; transform: translateX(-18px) scale(0.96); box-shadow: 0 0 0 0 rgba(138, 165, 255, 0); }
    57% { opacity: 1; transform: none; box-shadow: 0 0 0 6px rgba(138, 165, 255, 0.35); }
    63% { box-shadow: 0 0 0 0 rgba(138, 165, 255, 0); }
    90% { opacity: 1; }
    96%, 100% { opacity: 0; transform: translateY(6px); }
}

@keyframes ag-c4-b-mvp7edfesm {
    0%, 70% { opacity: 0; transform: translateX(-18px) scale(0.96); box-shadow: 0 0 0 0 rgba(138, 165, 255, 0); }
    73% { opacity: 1; transform: none; box-shadow: 0 0 0 6px rgba(138, 165, 255, 0.35); }
    79% { box-shadow: 0 0 0 0 rgba(138, 165, 255, 0); }
    90% { opacity: 1; }
    96%, 100% { opacity: 0; transform: translateY(6px); }
}

/* Linha do "agora" descendo o dia */
.ag__agora[b-mvp7edfesm] {
    position: absolute;
    left: 3.25rem;
    right: 0;
    top: 0;
    height: 2px;
    pointer-events: none;
    background: linear-gradient(90deg, var(--cf-red), transparent);
    box-shadow: 0 0 12px var(--cf-red);
    animation: ag-agora-b-mvp7edfesm 14s linear infinite;
}

@keyframes ag-agora-b-mvp7edfesm {
    0% { top: 0; opacity: 0; }
    6% { opacity: 1; }
    92% { top: 100%; opacity: 1; }
    96%, 100% { top: 100%; opacity: 0; }
}

/* ---------- Avisos ("Diego marcou 09:45 pelo link") ---------- */

.ag__avisos[b-mvp7edfesm] {
    position: absolute;
    left: 1rem;
    bottom: -1.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.ag__aviso[b-mvp7edfesm] {
    position: absolute;
    left: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.6rem 1rem;
    border: 1px solid var(--cf-line-strong);
    border-radius: 999px;
    background: var(--cf-ink-3);
    box-shadow: 0 16px 36px -14px rgba(0, 0, 0, 0.7);
    font-size: 0.875rem;
    font-weight: 600;
    white-space: nowrap;
    opacity: 0;
    animation: ag-aviso-b-mvp7edfesm 14s var(--cf-ease) infinite backwards;
    animation-delay: calc(1.1s + var(--i) * 2.2s);
}

.ag__ponto[b-mvp7edfesm] {
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 50%;
    background: var(--cf-ok);
}

@keyframes ag-aviso-b-mvp7edfesm {
    0% { opacity: 0; transform: translateY(14px) scale(0.94); }
    3% { opacity: 1; transform: none; }
    13% { opacity: 1; transform: none; }
    16%, 100% { opacity: 0; transform: translateY(-8px); }
}

@media (max-width: 480px) {
    .ag__aviso[b-mvp7edfesm] {
        font-size: 0.8125rem;
        padding: 0.5rem 0.85rem;
    }

    .ag__dia[b-mvp7edfesm] {
        font-size: 1.6rem;
    }

    .ag__valor[b-mvp7edfesm] {
        font-size: 1.75rem;
    }
}
/* /Components/Plataforma/CelularMock.razor.rz.scp.css */
.cel[b-716rcx7mi9] {
    position: relative;
    width: min(100%, 300px);
    aspect-ratio: 300 / 610;
    margin-inline: auto;
    padding: 10px;
    border-radius: 46px;
    background: linear-gradient(160deg, #26325f, #0b1230 55%, #1a2652);
    box-shadow:
        0 0 0 1.5px rgba(154, 166, 204, 0.4) inset,
        0 50px 100px -30px rgba(61, 107, 255, 0.6),
        0 30px 60px -30px rgba(0, 0, 0, 0.8);
}

.cel__tela[b-716rcx7mi9] {
    position: relative;
    height: 100%;
    overflow: hidden;
    border-radius: 37px;
    background: #f6f8fd;
    color: #0a1024;
}

.cel__ilha[b-716rcx7mi9] {
    position: absolute;
    top: 10px;
    left: 50%;
    z-index: 5;
    width: 86px;
    height: 24px;
    border-radius: 999px;
    background: #0a1024;
    transform: translateX(-50%);
}

.cel__botao[b-716rcx7mi9] {
    position: absolute;
    right: -3px;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: #3a4a80;
}

.cel__botao--a[b-716rcx7mi9] {
    top: 120px;
    height: 56px;
}

.cel__botao--b[b-716rcx7mi9] {
    top: 196px;
    height: 56px;
}
/* /Components/Plataforma/Cena.razor.rz.scp.css */
.cena[b-tvh51388bl] {
    display: grid;
    overflow: hidden;
    isolation: isolate;
}

.cena__conteudo[b-tvh51388bl] {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 100%;
    max-width: 1080px;
    min-height: 100vh;
    min-height: 100dvh;
    margin-inline: auto;
    padding: clamp(1.25rem, 5vw, 3rem) var(--cf-gutter);
}

.cena__conteudo--topo[b-tvh51388bl] {
    place-items: start center;
    padding-top: clamp(1.5rem, 6vw, 4rem);
}

/* Poste na lateral direita, sangrando para fora da tela. */
.cena__poste[b-tvh51388bl] {
    position: absolute;
    z-index: 1;
    top: -40px;
    bottom: -40px;
    right: clamp(14px, 5vw, 84px);
    width: clamp(14px, 2.4vw, 30px);
    border-radius: 999px;
    border: 2px solid rgba(241, 244, 251, 0.55);
    overflow: hidden;
    box-shadow: 0 0 60px rgba(61, 107, 255, 0.45);
    opacity: 0.85;
    pointer-events: none;
}

.cena__poste .cf-pole[b-tvh51388bl] {
    height: 100%;
}

@media (max-width: 639px) {
    .cena__poste[b-tvh51388bl] {
        right: 8px;
        opacity: 0.55;
    }
}
/* /Components/Plataforma/DemoAgendamento.razor.rz.scp.css */
/*
 * Ciclo de 12s: passo/tela i ativa em [3i, 3i+3)s. Delays positivos + fill-mode `backwards`:
 * antes do delay vale o 0% do keyframe; depois cada iteração recomeça em sincronia.
 * Estado base (sem animação): todos os passos legíveis e a tela final (confirmação) à mostra.
 */

/*
 * Mesmo arranjo do desktop em qualquer largura: passos à esquerda, celular à direita. No mobile o celular
 * encolhe (zoom) em vez de cair para baixo dos passos, e os passos perdem a descrição para caber ao lado.
 */
.demo[b-3xnewzrytf] {
    display: grid;
    grid-template-columns: 1fr 158px;
    gap: 0.75rem;
    align-items: center;
}

.demo__celular[b-3xnewzrytf] {
    zoom: 0.52;
}

@media (min-width: 600px) {
    .demo[b-3xnewzrytf] {
        grid-template-columns: 1fr 230px;
        gap: 1.5rem;
    }

    .demo__celular[b-3xnewzrytf] {
        zoom: 0.77;
    }
}

@media (min-width: 900px) {
    .demo[b-3xnewzrytf] {
        grid-template-columns: 1fr minmax(280px, 340px);
        gap: clamp(2rem, 6vw, 5rem);
    }

    .demo__celular[b-3xnewzrytf] {
        zoom: 1;
    }
}

/* ---------- Passos ---------- */

.demo__passos[b-3xnewzrytf] {
    display: grid;
    gap: 0.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.demo__passo[b-3xnewzrytf] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1.25rem;
    align-items: start;
    padding: 1.1rem 1.25rem;
    border-radius: var(--cf-radius-m);
    border: 1px solid transparent;
    animation: demo-passo-b-3xnewzrytf 12s var(--cf-ease) infinite backwards;
    animation-delay: calc(var(--i) * 3s);
}

.demo__num[b-3xnewzrytf] {
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    border: 1px solid var(--cf-line-strong);
    font-family: var(--cf-font-display);
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1;
}

.demo__titulo[b-3xnewzrytf] {
    margin: 0.1rem 0 0.25rem;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.25;
}

.demo__descricao[b-3xnewzrytf] {
    display: none;
    margin: 0;
    max-width: 44ch;
    color: var(--cf-fg-muted);
}

@media (max-width: 599px) {
    .demo__passo[b-3xnewzrytf] {
        gap: 0.6rem;
        padding: 0.6rem 0.5rem;
    }

    .demo__num[b-3xnewzrytf] {
        width: 1.85rem;
        height: 1.85rem;
        font-size: 1.05rem;
    }

    .demo__titulo[b-3xnewzrytf] {
        margin: 0.2rem 0 0;
        font-size: 1rem;
    }

    .demo__barra[b-3xnewzrytf] {
        margin-top: 0.5rem;
    }
}

@media (min-width: 600px) {
    .demo__descricao[b-3xnewzrytf] {
        display: block;
    }
}

.demo__barra[b-3xnewzrytf] {
    display: block;
    height: 3px;
    margin-top: 0.85rem;
    border-radius: 999px;
    transform-origin: left;
    background-image: repeating-linear-gradient(135deg, var(--cf-red) 0 14px, var(--cf-foam) 14px 28px, var(--cf-blue) 28px 42px, var(--cf-foam) 42px 56px);
    background-size: var(--cf-pole-h) 100%;
    animation: demo-barra-b-3xnewzrytf 12s linear infinite backwards, cf-pole-x 1.2s linear infinite;
    animation-delay: calc(var(--i) * 3s), 0s;
}

@keyframes demo-passo-b-3xnewzrytf {
    0% { opacity: 0.4; background: transparent; border-color: transparent; }
    2%, 23% { opacity: 1; background: var(--cf-surface-strong); border-color: var(--cf-line); }
    26%, 100% { opacity: 0.4; background: transparent; border-color: transparent; }
}

@keyframes demo-barra-b-3xnewzrytf {
    0% { transform: scaleX(0); }
    24%, 100% { transform: scaleX(1); }
}

/* ---------- Telas do celular ---------- */

.tela[b-3xnewzrytf] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 52px 18px 20px;
    font-size: 0.8125rem;
    opacity: 0;
    animation: demo-tela-b-3xnewzrytf 12s var(--cf-ease) infinite backwards;
    animation-delay: calc(var(--i) * 3s);
}

/* Base: a tela final aparece quando não há animação. */
.tela--4[b-3xnewzrytf] {
    opacity: 1;
}

@keyframes demo-tela-b-3xnewzrytf {
    0% { opacity: 0; transform: translateY(14px); }
    3%, 22% { opacity: 1; transform: none; }
    26%, 100% { opacity: 0; transform: translateY(-14px); }
}

.tela__loja[b-3xnewzrytf] {
    margin: 0;
    color: #6b7280;
    font-weight: 600;
}

.tela__titulo[b-3xnewzrytf] {
    margin: 0 0 0.25rem;
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -0.01em;
}

.tela ul[b-3xnewzrytf],
.tela dl[b-3xnewzrytf] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.tela__lista[b-3xnewzrytf] {
    display: grid;
    gap: 0.5rem;
}

.linha[b-3xnewzrytf] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.75rem 0.9rem;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #fff;
}

.linha span[b-3xnewzrytf] {
    display: grid;
}

.linha b[b-3xnewzrytf] {
    font-size: 0.9375rem;
}

.linha small[b-3xnewzrytf] {
    color: #6b7280;
}

.linha em[b-3xnewzrytf] {
    font-style: normal;
    font-weight: 700;
}

.linha--sel[b-3xnewzrytf] {
    animation: demo-sel-linha-b-3xnewzrytf 12s var(--cf-ease) infinite backwards;
    animation-delay: calc(var(--i) * 3s);
}

.tela__botao[b-3xnewzrytf] {
    display: grid;
    place-items: center;
    margin-top: auto;
    min-height: 44px;
    border-radius: 12px;
    background: #2563eb;
    color: #fff;
    font-weight: 700;
    font-size: 0.9375rem;
}

.tela__barbeiros[b-3xnewzrytf] {
    display: grid;
    gap: 0.5rem;
}

.barbeiro[b-3xnewzrytf] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #fff;
}

.barbeiro b[b-3xnewzrytf] {
    font-size: 0.9375rem;
}

.barbeiro__foto[b-3xnewzrytf] {
    display: grid;
    place-items: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: linear-gradient(135deg, #3d6bff, #8aa5ff);
    color: #fff;
    font-weight: 800;
}

.barbeiro__foto--vazio[b-3xnewzrytf] {
    background: #e5e7eb;
    color: #6b7280;
}

.barbeiro--sel[b-3xnewzrytf] {
    animation: demo-sel-linha-b-3xnewzrytf 12s var(--cf-ease) infinite backwards;
    animation-delay: calc(var(--i) * 3s);
}

.tela__dias[b-3xnewzrytf] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0.35rem;
}

.dia[b-3xnewzrytf] {
    display: grid;
    justify-items: center;
    padding: 0.5rem 0;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #fff;
}

.dia small[b-3xnewzrytf] {
    color: #6b7280;
}

.dia b[b-3xnewzrytf] {
    font-size: 1.0625rem;
}

.dia--off[b-3xnewzrytf] {
    opacity: 0.35;
    text-decoration: line-through;
}

.dia--sel[b-3xnewzrytf] {
    animation: demo-sel-dia-b-3xnewzrytf 12s var(--cf-ease) infinite backwards;
    animation-delay: calc(var(--i) * 3s);
}

.tela__horas[b-3xnewzrytf] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.4rem;
}

.hora[b-3xnewzrytf] {
    display: grid;
    place-items: center;
    min-height: 38px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #fff;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.hora--off[b-3xnewzrytf] {
    opacity: 0.35;
    text-decoration: line-through;
}

.hora--sel[b-3xnewzrytf] {
    animation: demo-sel-bloco-b-3xnewzrytf 12s var(--cf-ease) infinite backwards;
    animation-delay: calc(var(--i) * 3s);
}

@keyframes demo-sel-linha-b-3xnewzrytf {
    0%, 12% { border-color: #e5e7eb; background: #fff; box-shadow: none; }
    16%, 100% { border-color: #2563eb; background: #eff6ff; box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.18); }
}

@keyframes demo-sel-dia-b-3xnewzrytf {
    0%, 5% { border-color: #e5e7eb; background: #fff; color: inherit; }
    8%, 100% { border-color: #2563eb; background: #2563eb; color: #fff; }
}

@keyframes demo-sel-bloco-b-3xnewzrytf {
    0%, 12% { border-color: #e5e7eb; background: #fff; color: inherit; }
    16%, 100% { border-color: #2563eb; background: #2563eb; color: #fff; }
}

/* Confirmação */

.tela__resumo[b-3xnewzrytf] {
    display: grid;
    gap: 0;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #fff;
}

.tela__resumo div[b-3xnewzrytf] {
    display: flex;
    justify-content: space-between;
    padding: 0.65rem 0.9rem;
}

.tela__resumo div + div[b-3xnewzrytf] {
    border-top: 1px solid #eef0f4;
}

.tela__resumo dt[b-3xnewzrytf] {
    color: #6b7280;
}

.tela__resumo dd[b-3xnewzrytf] {
    margin: 0;
    font-weight: 700;
}

.tela__botao--confirma[b-3xnewzrytf] {
    animation: demo-toque-b-3xnewzrytf 12s var(--cf-ease) infinite backwards;
    animation-delay: calc(var(--i) * 3s);
}

@keyframes demo-toque-b-3xnewzrytf {
    0%, 14% { transform: none; }
    17% { transform: scale(0.96); }
    20%, 100% { transform: none; }
}

.tela__ok[b-3xnewzrytf] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    background: rgba(246, 248, 253, 0.97);
    text-align: center;
    animation: demo-ok-b-3xnewzrytf 12s var(--cf-ease) infinite backwards;
    animation-delay: calc(var(--i) * 3s);
}

.tela__ok b[b-3xnewzrytf] {
    font-size: 1.25rem;
    font-weight: 800;
}

.tela__ok small[b-3xnewzrytf] {
    color: #6b7280;
    font-size: 0.875rem;
}

@keyframes demo-ok-b-3xnewzrytf {
    0%, 55% { opacity: 0; }
    64%, 100% { opacity: 1; }
}

.tela__check[b-3xnewzrytf] {
    width: 4.25rem;
    height: 4.25rem;
    fill: none;
    stroke: #16a34a;
    stroke-width: 3.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tela__check-anel[b-3xnewzrytf] {
    stroke-dasharray: 145;
    animation: demo-traco-b-3xnewzrytf 12s ease-out infinite backwards;
    animation-delay: calc(var(--i) * 3s);
}

.tela__check-tique[b-3xnewzrytf] {
    stroke-dasharray: 40;
    animation: demo-traco-tique-b-3xnewzrytf 12s ease-out infinite backwards;
    animation-delay: calc(var(--i) * 3s);
}

@keyframes demo-traco-b-3xnewzrytf {
    0%, 58% { stroke-dashoffset: 145; }
    72%, 100% { stroke-dashoffset: 0; }
}

@keyframes demo-traco-tique-b-3xnewzrytf {
    0%, 70% { stroke-dashoffset: 40; }
    80%, 100% { stroke-dashoffset: 0; }
}

/* Tela 4 usa um `.tela__ok` posicionado dentro dela: precisa de contexto de posicionamento. */
.tela--4[b-3xnewzrytf] {
    overflow: hidden;
}
/* /Components/Plataforma/FaixaServicos.razor.rz.scp.css */
.faixa[b-c59rvny69z] {
    position: relative;
    overflow: hidden;
    padding-block: 1.75rem;
    background: var(--cf-ink-2);
}

.faixa__fita[b-c59rvny69z] {
    position: absolute;
    left: 0;
    right: 0;
    height: 5px;
}

.faixa__fita--topo[b-c59rvny69z] {
    top: 0;
}

.faixa__fita--base[b-c59rvny69z] {
    bottom: 0;
    animation-direction: reverse;
}

.faixa__trilho[b-c59rvny69z] {
    display: flex;
    width: max-content;
    animation: faixa-corre-b-c59rvny69z 55s linear infinite;
}

.faixa:hover .faixa__trilho[b-c59rvny69z] {
    animation-play-state: paused;
}

.faixa__grupo[b-c59rvny69z] {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: 2.25rem;
    margin: 0;
    padding: 0 2.25rem 0 0;
    list-style: none;
}

.faixa__item[b-c59rvny69z] {
    font-family: var(--cf-font-display);
    font-size: clamp(2.5rem, 6vw, 4.25rem);
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

/* Alterna cheio e vazado para dar ritmo sem trocar de cor. */
.faixa__grupo .faixa__item:nth-of-type(even)[b-c59rvny69z] {
    color: transparent;
    -webkit-text-stroke: 1.5px var(--cf-foam);
}

/* Separador: losango de barbeiro (navalha aberta), alternando vermelho e azul. */
.faixa__sep[b-c59rvny69z] {
    width: 0.9rem;
    height: 0.9rem;
    flex-shrink: 0;
    border-radius: 3px;
    background: var(--cf-red);
    transform: rotate(45deg);
}

.faixa__grupo .faixa__sep:nth-of-type(even)[b-c59rvny69z] {
    background: var(--cf-blue);
}

@keyframes faixa-corre-b-c59rvny69z {
    to { transform: translateX(-50%); }
}
/* /Components/Plataforma/Marca.razor.rz.scp.css */
.marca[b-7nuohf98y1] {
    --marca-tamanho: 1.6rem;
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    font-size: var(--marca-tamanho);
    line-height: 1;
    color: var(--cf-fg, #f1f4fb);
}

.marca__poste[b-7nuohf98y1] {
    position: relative;
    display: block;
    width: 0.46em;
    height: 1.1em;
    border-radius: 999px;
    border: 0.06em solid rgba(241, 244, 251, 0.9);
    background-image: repeating-linear-gradient(
        135deg,
        var(--cf-red, #e5383b) 0 14px,
        var(--cf-foam, #f1f4fb) 14px 28px,
        var(--cf-blue, #3d6bff) 28px 42px,
        var(--cf-foam, #f1f4fb) 42px 56px
    );
    background-size: 100% 79.2px;
    animation: marca-gira-b-7nuohf98y1 2.8s linear infinite;
    box-shadow: 0 0 0.6em rgba(138, 165, 255, 0.35);
}

/* Brilho do vidro do poste */
.marca__poste[b-7nuohf98y1]::after {
    content: '';
    position: absolute;
    top: 8%;
    bottom: 8%;
    left: 22%;
    width: 16%;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.55);
}

.marca__nome[b-7nuohf98y1] {
    font-family: var(--cf-font-display, 'Big Shoulders Display', sans-serif);
    font-size: 1.28em;
    font-weight: 800;
    letter-spacing: 0.01em;
    line-height: 0.9;
    padding-bottom: 0.06em;
}

@keyframes marca-gira-b-7nuohf98y1 {
    to { background-position-y: -79.2px; }
}
/* /Components/Plataforma/MenuConta.razor.rz.scp.css */
.conta[b-c5lrk6p5fl] {
    position: relative;
}

.conta__botao[b-c5lrk6p5fl] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    min-height: 44px;
    padding: 0.25rem 0.75rem 0.25rem 0.3rem;
    border: 1px solid var(--cf-line);
    border-radius: 999px;
    color: var(--cf-fg);
    font-size: 0.9375rem;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
}

.conta__botao[b-c5lrk6p5fl]::-webkit-details-marker {
    display: none;
}

.conta__inicial[b-c5lrk6p5fl] {
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: var(--cf-blue-soft);
    color: var(--cf-ink-2);
    font-weight: 700;
}

.conta__nome-curto[b-c5lrk6p5fl] {
    max-width: 9rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 520px) {
    .conta__nome-curto[b-c5lrk6p5fl] {
        display: none;
    }

    .conta__botao[b-c5lrk6p5fl] {
        padding-right: 0.3rem;
    }
}

.conta__painel[b-c5lrk6p5fl] {
    position: absolute;
    right: 0;
    top: calc(100% + 0.5rem);
    z-index: 50;
    display: grid;
    gap: 0.15rem;
    min-width: 14rem;
    padding: 0.75rem;
    border: 1px solid var(--cf-line);
    border-radius: 14px;
    background: var(--cf-ink-2);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
}

.conta__nome[b-c5lrk6p5fl],
.conta__email[b-c5lrk6p5fl] {
    margin: 0;
    overflow-wrap: anywhere;
}

.conta__nome[b-c5lrk6p5fl] {
    color: var(--cf-fg);
    font-weight: 700;
}

.conta__email[b-c5lrk6p5fl] {
    padding-bottom: 0.5rem;
    margin-bottom: 0.25rem;
    border-bottom: 1px solid var(--cf-line);
    color: var(--cf-fg-muted);
    font-size: 0.875rem;
}

.conta__item[b-c5lrk6p5fl] {
    display: block;
    width: 100%;
    padding: 0.6rem 0.5rem;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--cf-fg);
    font: inherit;
    font-weight: 600;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.conta__item:hover[b-c5lrk6p5fl] {
    background: rgba(154, 166, 204, 0.12);
}
/* /Components/Plataforma/Passos.razor.rz.scp.css */
.passos[b-zm802pjt1r] {
    position: relative;
    display: grid;
    gap: clamp(2rem, 5vw, 3rem);
    margin: 0;
    padding: 0;
    list-style: none;
}

@media (min-width: 860px) {
    .passos[b-zm802pjt1r] {
        grid-template-columns: repeat(3, 1fr);
        gap: clamp(1.5rem, 4vw, 3.5rem);
    }

    /* Trilho de poste ligando os números; se desenha conforme a seção passa pela tela. */
    .passos[b-zm802pjt1r]::before {
        content: '';
        position: absolute;
        top: 2.75rem;
        left: 2.75rem;
        right: 2.75rem;
        height: 6px;
        border-radius: 999px;
        background-image: repeating-linear-gradient(135deg, var(--cf-red) 0 14px, var(--cf-foam) 14px 28px, var(--cf-blue) 28px 42px, var(--cf-foam) 42px 56px);
        background-size: var(--cf-pole-h) 100%;
        transform-origin: left;
        animation: cf-pole-x 2.4s linear infinite;
    }

    @supports (animation-timeline: view()) {
        .passos[b-zm802pjt1r]::before {
            animation: passos-trilho-b-zm802pjt1r linear both, cf-pole-x 2.4s linear infinite;
            animation-timeline: view(), auto;
            animation-range: entry 10% cover 55%, normal;
        }
    }
}

@keyframes passos-trilho-b-zm802pjt1r {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}

.passo[b-zm802pjt1r] {
    position: relative;
    display: grid;
    gap: 0.6rem;
    align-content: start;
}

.passo__num[b-zm802pjt1r] {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 5.5rem;
    height: 5.5rem;
    margin-bottom: 0.75rem;
    border-radius: 50%;
    background: var(--cf-ink);
    border: 2px solid var(--cf-foam);
    font-family: var(--cf-font-display);
    font-size: 3.25rem;
    font-weight: 800;
    line-height: 1;
    box-shadow: 0 0 0 8px var(--cf-bg, var(--cf-ink));
}

.passo__titulo[b-zm802pjt1r] {
    margin: 0;
    font-family: var(--cf-font-display);
    font-size: clamp(1.9rem, 3vw, 2.4rem);
    font-weight: 800;
    line-height: 1;
}

.passo__texto[b-zm802pjt1r] {
    margin: 0;
    max-width: 36ch;
    color: var(--cf-fg-muted);
}
/* /Components/Plataforma/PerguntasFrequentes.razor.rz.scp.css */
.faq[b-7px7npqiex] {
    display: grid;
    border-top: 1px solid var(--cf-line);
}

.faq__item[b-7px7npqiex] {
    border-bottom: 1px solid var(--cf-line);
}

.faq__pergunta[b-7px7npqiex] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    min-height: 68px;
    padding-block: 1rem;
    font-size: clamp(1.125rem, 2vw, 1.375rem);
    font-weight: 700;
    line-height: 1.3;
    cursor: pointer;
    list-style: none;
    transition: color 0.2s;
}

.faq__pergunta[b-7px7npqiex]::-webkit-details-marker {
    display: none;
}

.faq__pergunta:hover[b-7px7npqiex] {
    color: var(--cf-blue-soft);
}

/* Mais que vira menos: duas barras, a vertical gira e some. */
.faq__mais[b-7px7npqiex] {
    position: relative;
    flex-shrink: 0;
    width: 2.25rem;
    height: 2.25rem;
    border: 1px solid var(--cf-line-strong);
    border-radius: 50%;
    transition: background-color 0.25s, border-color 0.25s, transform 0.4s var(--cf-ease);
}

.faq__mais[b-7px7npqiex]::before,
.faq__mais[b-7px7npqiex]::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0.85rem;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    transform: translate(-50%, -50%);
    transition: transform 0.4s var(--cf-ease);
}

.faq__mais[b-7px7npqiex]::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.faq__item[open] .faq__mais[b-7px7npqiex] {
    background: var(--cf-foam);
    border-color: var(--cf-foam);
    color: var(--cf-ink);
    transform: rotate(180deg);
}

.faq__item[open] .faq__mais[b-7px7npqiex]::after {
    transform: translate(-50%, -50%) rotate(0deg);
}

.faq__resposta[b-7px7npqiex] {
    padding-bottom: 1.5rem;
}

.faq__resposta p[b-7px7npqiex] {
    margin: 0;
    max-width: 64ch;
    color: var(--cf-fg-muted);
}

/* Abertura suave onde o navegador anima o conteúdo do <details>. */
@supports selector(::details-content) {
    .faq__item[b-7px7npqiex]::details-content {
        block-size: 0;
        overflow: hidden;
        transition: block-size 0.4s var(--cf-ease), content-visibility 0.4s allow-discrete;
    }

    .faq__item[open][b-7px7npqiex]::details-content {
        block-size: auto;
    }
}
/* /Components/Plataforma/PlanoCard.razor.rz.scp.css */
/* Borda com o poste girando em volta (conic-gradient). Sem suporte a @property, a borda fica estática. */
.plano[b-o6s8e2nt2t] {
    position: relative;
    width: 100%;
    max-width: 480px;
    padding: 3px;
    border-radius: 34px;
    background: conic-gradient(from var(--cf-angulo), var(--cf-red), var(--cf-foam), var(--cf-blue), var(--cf-foam), var(--cf-red));
    animation: plano-gira-b-o6s8e2nt2t 7s linear infinite;
    box-shadow: 0 50px 120px -50px rgba(61, 107, 255, 0.75);
}

@keyframes plano-gira-b-o6s8e2nt2t {
    to { --cf-angulo: 360deg; }
}

.plano__corpo[b-o6s8e2nt2t] {
    position: relative;
    display: grid;
    gap: 1.25rem;
    padding: clamp(1.5rem, 4vw, 2.5rem);
    border-radius: 31px;
    background: var(--cf-ink-2);
    overflow: hidden;
}

.plano__nome[b-o6s8e2nt2t] {
    margin: 0;
    font-weight: 700;
    color: var(--cf-blue-soft);
}

.plano__preco[b-o6s8e2nt2t] {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin: 0;
    line-height: 0.9;
}

.plano__moeda[b-o6s8e2nt2t] {
    font-family: var(--cf-font-display);
    font-size: 2.25rem;
    font-weight: 800;
    color: var(--cf-fg-muted);
}

.plano__valor[b-o6s8e2nt2t] {
    font-family: var(--cf-font-display);
    font-size: clamp(5.5rem, 16vw, 8rem);
    font-weight: 800;
    letter-spacing: -0.01em;
}

.plano__ciclo[b-o6s8e2nt2t] {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--cf-fg-muted);
}

.plano__nota[b-o6s8e2nt2t] {
    margin: -0.25rem 0 0;
    color: var(--cf-fg-muted);
}

.plano__itens[b-o6s8e2nt2t] {
    display: grid;
    gap: 0.7rem;
    margin: 0.25rem 0 0.5rem;
    padding: 1.25rem 0 0;
    border-top: 1px solid var(--cf-line);
    list-style: none;
}

.plano__item[b-o6s8e2nt2t] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.75rem;
    align-items: start;
    line-height: 1.4;
}

.plano__check[b-o6s8e2nt2t] {
    width: 1.35rem;
    height: 1.35rem;
    padding: 0.2rem;
    border-radius: 50%;
    background: rgba(61, 220, 151, 0.16);
    stroke: var(--cf-ok);
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 20;
}

/* O tique se desenha quando o cartão entra na tela; sem JS o tique já está desenhado. */
.plano[data-in] .plano__check path[b-o6s8e2nt2t] {
    stroke-dasharray: 20;
    animation: plano-tique-b-o6s8e2nt2t 0.7s ease-out backwards;
}

.plano[data-in] .plano__item:nth-child(1) .plano__check path[b-o6s8e2nt2t] { animation-delay: 0.3s; }
.plano[data-in] .plano__item:nth-child(2) .plano__check path[b-o6s8e2nt2t] { animation-delay: 0.4s; }
.plano[data-in] .plano__item:nth-child(3) .plano__check path[b-o6s8e2nt2t] { animation-delay: 0.5s; }
.plano[data-in] .plano__item:nth-child(4) .plano__check path[b-o6s8e2nt2t] { animation-delay: 0.6s; }
.plano[data-in] .plano__item:nth-child(5) .plano__check path[b-o6s8e2nt2t] { animation-delay: 0.7s; }
.plano[data-in] .plano__item:nth-child(6) .plano__check path[b-o6s8e2nt2t] { animation-delay: 0.8s; }
.plano[data-in] .plano__item:nth-child(7) .plano__check path[b-o6s8e2nt2t] { animation-delay: 0.9s; }
.plano[data-in] .plano__item:nth-child(8) .plano__check path[b-o6s8e2nt2t] { animation-delay: 1s; }

@keyframes plano-tique-b-o6s8e2nt2t {
    from { stroke-dashoffset: 20; }
}

.plano__garantia[b-o6s8e2nt2t] {
    margin: 0;
    font-size: 0.9375rem;
    text-align: center;
    color: var(--cf-fg-muted);
}
/* /Components/Plataforma/PlataformaNav.razor.rz.scp.css */
.nav[b-jx7cfta1xu] {
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 40;
    background: rgba(10, 16, 36, 0.55);
    -webkit-backdrop-filter: blur(16px) saturate(1.3);
    backdrop-filter: blur(16px) saturate(1.3);
    border-bottom: 1px solid var(--cf-line);
}

/* Onde há animação ligada ao scroll, o vidro nasce transparente e engrossa nos primeiros 120px. */
@supports (animation-timeline: scroll()) {
    .nav[b-jx7cfta1xu] {
        background: transparent;
        border-bottom-color: transparent;
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        animation: nav-vidro-b-jx7cfta1xu linear both;
        animation-timeline: scroll(root);
        animation-range: 0 140px;
    }

    .nav__fita[b-jx7cfta1xu] {
        transform-origin: left center;
        animation: nav-progresso-b-jx7cfta1xu linear both, cf-pole-x 2.4s linear infinite;
        animation-timeline: scroll(root), auto;
    }
}

@keyframes nav-vidro-b-jx7cfta1xu {
    to {
        background: rgba(10, 16, 36, 0.72);
        border-bottom-color: rgba(154, 166, 204, 0.18);
        -webkit-backdrop-filter: blur(16px) saturate(1.3);
        backdrop-filter: blur(16px) saturate(1.3);
    }
}

@keyframes nav-progresso-b-jx7cfta1xu {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}

.nav__fita[b-jx7cfta1xu] {
    height: 3px;
}

.nav__barra[b-jx7cfta1xu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 68px;
}

.nav__marca[b-jx7cfta1xu] {
    display: inline-flex;
    text-decoration: none;
    --marca-tamanho: 1.7rem;
}

.nav__links[b-jx7cfta1xu] {
    display: none;
    gap: clamp(1rem, 2.4vw, 2.25rem);
}

.nav__links a[b-jx7cfta1xu] {
    position: relative;
    padding-block: 0.5rem;
    color: var(--cf-fg-muted);
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    transition: color 0.2s;
}

.nav__links a[b-jx7cfta1xu]::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: var(--cf-foam);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s var(--cf-ease);
}

.nav__links a:hover[b-jx7cfta1xu],
.nav__links a:focus-visible[b-jx7cfta1xu] {
    color: var(--cf-fg);
}

.nav__links a:hover[b-jx7cfta1xu]::after,
.nav__links a:focus-visible[b-jx7cfta1xu]::after {
    transform: scaleX(1);
}

.nav__acoes[b-jx7cfta1xu] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.nav__rotulo-curto[b-jx7cfta1xu] {
    display: inline;
}

.nav__rotulo-longo[b-jx7cfta1xu] {
    display: none;
}

@media (min-width: 640px) {
    .nav__rotulo-curto[b-jx7cfta1xu] {
        display: none;
    }

    .nav__rotulo-longo[b-jx7cfta1xu] {
        display: inline;
    }
}

@media (min-width: 960px) {
    .nav__links[b-jx7cfta1xu] {
        display: flex;
    }
}
/* /Components/Plataforma/PrevisaoBarbearia.razor.rz.scp.css */
.prev[b-6hgrmaok37] {
    width: 100%;
    max-width: 520px;
    border-radius: 18px;
    border: 1px solid var(--cf-line-strong);
    background: var(--cf-ink-2);
    box-shadow: 0 40px 80px -40px rgba(61, 107, 255, 0.55);
    overflow: hidden;
}

.prev__barra[b-6hgrmaok37] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 0.7rem 0.9rem;
    border-bottom: 1px solid var(--cf-line);
    background: var(--cf-ink-3);
}

.prev__pontos[b-6hgrmaok37] {
    display: inline-flex;
    gap: 0.35rem;
}

.prev__pontos i[b-6hgrmaok37] {
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 50%;
    background: var(--cf-line-strong);
}

.prev__pontos i:first-child[b-6hgrmaok37] {
    background: var(--cf-red);
}

.prev__endereco[b-6hgrmaok37] {
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 0;
    margin: 0;
    padding: 0.4rem 0.75rem;
    border-radius: 999px;
    background: var(--cf-ink);
    font-size: 0.875rem;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.prev__cadeado[b-6hgrmaok37] {
    flex-shrink: 0;
    width: 0.9rem;
    height: 0.9rem;
    margin-right: 0.4rem;
    stroke: var(--cf-ok);
    stroke-width: 1.4;
}

.prev__https[b-6hgrmaok37],
.prev__dominio[b-6hgrmaok37] {
    color: var(--cf-fg-muted);
}

.prev__slug[b-6hgrmaok37] {
    font-weight: 700;
    animation: prev-tique-b-6hgrmaok37 0.45s var(--cf-ease);
}

.prev__endereco--vazio .prev__slug[b-6hgrmaok37] {
    color: var(--cf-fg-muted);
    font-weight: 500;
}

.prev__tela[b-6hgrmaok37] {
    position: relative;
    display: grid;
    justify-items: center;
    gap: 0.6rem;
    padding: clamp(2rem, 6vw, 3.25rem) 1.5rem clamp(1.75rem, 5vw, 2.5rem);
    text-align: center;
    background:
        radial-gradient(ellipse at 50% 0%, rgba(61, 107, 255, 0.28), transparent 70%),
        var(--cf-ink);
}

.prev__poste[b-6hgrmaok37] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
}

.prev__nome[b-6hgrmaok37] {
    margin: 0;
    max-width: 14ch;
    font-family: var(--cf-font-display);
    font-size: clamp(2.5rem, 8vw, 3.75rem);
    font-weight: 800;
    line-height: 0.92;
    overflow-wrap: anywhere;
    text-wrap: balance;
    animation: prev-tique-b-6hgrmaok37 0.45s var(--cf-ease);
}

.prev__nome--vazio[b-6hgrmaok37] {
    color: var(--cf-fg-muted);
}

.prev__boas[b-6hgrmaok37] {
    margin: 0;
    color: var(--cf-fg-muted);
}

.prev__botoes[b-6hgrmaok37] {
    display: grid;
    gap: 0.5rem;
    width: min(100%, 220px);
    margin-top: 0.75rem;
}

.prev__botao[b-6hgrmaok37] {
    display: grid;
    place-items: center;
    min-height: 42px;
    border: 1px solid var(--cf-line-strong);
    border-radius: 10px;
    font-size: 0.9375rem;
    font-weight: 600;
}

.prev__botao--p[b-6hgrmaok37] {
    background: var(--cf-foam);
    border-color: var(--cf-foam);
    color: var(--cf-ink);
}

@keyframes prev-tique-b-6hgrmaok37 {
    from { opacity: 0.2; transform: translateY(6px); }
    to { opacity: 1; transform: none; }
}
/* /Components/Plataforma/Problemas.razor.rz.scp.css */
.prob[b-geno88y53a] {
    display: grid;
    gap: clamp(2rem, 5vw, 4rem);
}

@media (min-width: 860px) {
    .prob[b-geno88y53a] {
        grid-template-columns: repeat(3, 1fr);
        align-items: start;
    }

    /* Alturas escalonadas: o olho anda em zigue-zague em vez de ler três colunas iguais. */
    .prob__item:nth-child(2)[b-geno88y53a] {
        margin-top: 3.5rem;
    }

    .prob__item:nth-child(3)[b-geno88y53a] {
        margin-top: 1.25rem;
    }
}

.prob__arte[b-geno88y53a] {
    display: block;
    width: 100%;
    max-width: 260px;
    margin-bottom: 1.5rem;
    padding: 1.1rem;
    border-radius: var(--cf-radius-l);
    background: var(--cf-surface);
    border: 1px solid var(--cf-line);
    color: var(--cf-foam);
    overflow: visible;
}

.prob__alt[b-geno88y53a] {
    stroke: var(--cf-blue-soft);
}

.prob__titulo[b-geno88y53a] {
    margin: 0 0 0.5rem;
    font-family: var(--cf-font-display);
    font-size: 2rem;
    font-weight: 800;
    line-height: 1;
}

.prob__texto[b-geno88y53a] {
    margin: 0;
    max-width: 34ch;
    color: var(--cf-fg-muted);
}

/* zap: o balão novo chega e o contador pulsa */
.prob__balao[b-geno88y53a] {
    animation: prob-chega-b-geno88y53a 4.5s var(--cf-ease) infinite;
}

.prob__aviso[b-geno88y53a] {
    transform-box: fill-box;
    transform-origin: center;
    animation: prob-pulsa-b-geno88y53a 4.5s ease-in-out infinite;
}

@keyframes prob-chega-b-geno88y53a {
    0%, 18% { opacity: 0; transform: translateY(12px); }
    28%, 100% { opacity: 1; transform: none; }
}

@keyframes prob-pulsa-b-geno88y53a {
    0%, 26% { transform: scale(1); }
    32% { transform: scale(1.3); }
    40%, 100% { transform: scale(1); }
}

/* choque de horário: o segundo card desliza até cobrir o primeiro e o alerta acende */
.prob__card-dois[b-geno88y53a] {
    animation: prob-desliza-b-geno88y53a 4.5s var(--cf-ease) infinite;
}

.prob__alerta[b-geno88y53a] {
    transform-box: fill-box;
    transform-origin: center;
    animation: prob-alerta-b-geno88y53a 4.5s ease-in-out infinite;
}

@keyframes prob-desliza-b-geno88y53a {
    0%, 15% { transform: translate(34px, 20px); opacity: 0; }
    35%, 100% { transform: none; opacity: 1; }
}

@keyframes prob-alerta-b-geno88y53a {
    0%, 36% { opacity: 0; transform: scale(0.4); }
    46%, 100% { opacity: 1; transform: scale(1); }
}

/* conta do mês: risca as linhas e a dúvida balança */
.prob__risco[b-geno88y53a] {
    stroke: var(--cf-red);
    stroke-dasharray: 180;
    animation: prob-risca-b-geno88y53a 4.5s ease-in-out infinite;
}

.prob__interroga[b-geno88y53a] {
    transform-box: fill-box;
    transform-origin: center;
    animation: prob-balanca-b-geno88y53a 4.5s ease-in-out infinite;
}

@keyframes prob-risca-b-geno88y53a {
    0%, 20% { stroke-dashoffset: 180; }
    55%, 100% { stroke-dashoffset: 0; }
}

@keyframes prob-balanca-b-geno88y53a {
    0%, 55% { transform: rotate(0); }
    62% { transform: rotate(-7deg); }
    70% { transform: rotate(6deg); }
    78%, 100% { transform: rotate(0); }
}
/* /Components/Plataforma/RecursosBento.razor.rz.scp.css */
.bento[b-8dq7xpnejf] {
    display: grid;
    gap: 1rem;
}

@media (min-width: 900px) {
    .bento[b-8dq7xpnejf] {
        grid-template-columns: repeat(12, 1fr);
        grid-auto-rows: minmax(150px, auto);
        gap: 1.25rem;
    }

    .cel--agenda[b-8dq7xpnejf] { grid-column: span 7; grid-row: span 2; }
    .cel--endereco[b-8dq7xpnejf] { grid-column: span 5; }
    .cel--barbeiros[b-8dq7xpnejf] { grid-column: span 5; }
    .cel--painel[b-8dq7xpnejf] { grid-column: span 7; }
    .cel--fecha[b-8dq7xpnejf] { grid-column: span 5; }
    .cel--cadastro[b-8dq7xpnejf] { grid-column: span 12; }
}

/* ---------- Célula: raios e tons diferentes por hierarquia, sem sombra padrão ---------- */

.cel[b-8dq7xpnejf] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: clamp(1.25rem, 3vw, 2rem);
    border-radius: var(--cf-radius-m);
    background: var(--cf-surface);
    border: 1px solid var(--cf-line);
    color: var(--cf-fg);
    overflow: hidden;
}

.cel--agenda[b-8dq7xpnejf],
.cel--painel[b-8dq7xpnejf] {
    border-radius: var(--cf-radius-l);
}

.cel--cadastro[b-8dq7xpnejf] {
    border-radius: var(--cf-radius-xl) var(--cf-radius-m) var(--cf-radius-xl) var(--cf-radius-m);
}

.cel__titulo[b-8dq7xpnejf] {
    margin: 0;
    font-family: var(--cf-font-display);
    font-size: clamp(1.9rem, 3.2vw, 2.6rem);
    font-weight: 800;
    line-height: 0.98;
    text-wrap: balance;
}

.cel__copy[b-8dq7xpnejf] {
    margin: 0;
    max-width: 46ch;
    font-size: 1rem;
    line-height: 1.55;
    color: var(--cf-fg-muted);
}

.cel__texto[b-8dq7xpnejf] {
    display: grid;
    gap: 0.75rem;
}

.tom-tinta[b-8dq7xpnejf] {
    background: var(--cf-ink);
    border-color: transparent;
    --cf-fg: var(--cf-foam);
    --cf-fg-muted: var(--cf-mist);
    --cf-line: rgba(154, 166, 204, 0.18);
    --cf-line-strong: rgba(154, 166, 204, 0.36);
}

.tom-tinta[b-8dq7xpnejf]::after {
    content: '';
    position: absolute;
    inset: auto -20% -60% 30%;
    height: 90%;
    background: radial-gradient(closest-side, rgba(61, 107, 255, 0.45), transparent);
    pointer-events: none;
}

.tom-claro[b-8dq7xpnejf] {
    background: #fff;
}

.cel--endereco[b-8dq7xpnejf] {
    background: var(--cf-blue);
    border-color: transparent;
    color: #fff;
    --cf-fg-muted: rgba(255, 255, 255, 0.82);
}

.cel--cadastro[b-8dq7xpnejf] {
    background: linear-gradient(120deg, var(--cf-ink-3), var(--cf-ink-2));
    border-color: transparent;
    --cf-fg: var(--cf-foam);
    --cf-fg-muted: var(--cf-mist);
    --cf-line: rgba(154, 166, 204, 0.18);
    color: var(--cf-foam);
}

@media (min-width: 720px) {
    .cel--cadastro[b-8dq7xpnejf] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 3rem;
    }
}

/* ---------- A: mini semana ---------- */

.semana[b-8dq7xpnejf] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0.6rem;
    flex: 1;
    min-height: 240px;
}

.semana__col[b-8dq7xpnejf] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.semana__dia[b-8dq7xpnejf] {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--cf-fg-muted);
    text-align: center;
}

.semana__trilho[b-8dq7xpnejf] {
    position: relative;
    flex: 1;
    min-height: 200px;
    border-radius: 14px;
    border: 1px dashed var(--cf-line);
    background: repeating-linear-gradient(180deg, transparent 0 39px, var(--cf-line) 39px 40px);
}

.semana__bloco[b-8dq7xpnejf] {
    position: absolute;
    left: 6%;
    right: 6%;
    top: var(--t);
    height: var(--h);
    border-radius: 10px;
    background: linear-gradient(160deg, var(--cf-blue), #2a48c9);
    box-shadow: 0 8px 20px -10px rgba(61, 107, 255, 0.8);
    animation: bento-bloco-b-8dq7xpnejf 7s ease-in-out infinite;
    animation-delay: var(--d);
}

.semana__col:nth-child(even) .semana__bloco[b-8dq7xpnejf] {
    background: linear-gradient(160deg, #e5383b, #a5262a);
    box-shadow: 0 8px 20px -10px rgba(229, 56, 59, 0.7);
}

@keyframes bento-bloco-b-8dq7xpnejf {
    0%, 100% { transform: scaleY(1); filter: brightness(1); }
    50% { transform: scaleY(0.94); filter: brightness(1.25); }
}

/* ---------- B: endereço ---------- */

.endereco[b-8dq7xpnejf] {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    font-family: var(--cf-font-display);
    font-size: clamp(2.1rem, 4.4vw, 3.2rem);
    font-weight: 800;
    line-height: 1;
    overflow-wrap: anywhere;
}

.endereco__nome[b-8dq7xpnejf] {
    display: inline-block;
    position: relative;
    padding-right: 0.08em;
    clip-path: inset(0 0 0 0);
    animation: bento-digita-b-8dq7xpnejf 6s steps(12, end) infinite;
}

.endereco__nome[b-8dq7xpnejf]::after {
    content: '';
    position: absolute;
    right: 0;
    top: 12%;
    bottom: 8%;
    width: 0.07em;
    background: #fff;
    animation: bento-cursor-b-8dq7xpnejf 0.9s steps(1) infinite;
}

.endereco__dominio[b-8dq7xpnejf] {
    opacity: 0.72;
}

@keyframes bento-digita-b-8dq7xpnejf {
    0% { clip-path: inset(0 100% 0 0); }
    45%, 88% { clip-path: inset(0 0 0 0); }
    100% { clip-path: inset(0 100% 0 0); }
}

@keyframes bento-cursor-b-8dq7xpnejf {
    50% { opacity: 0; }
}

/* ---------- C: pilha de barbeiros ---------- */

.pilha[b-8dq7xpnejf] {
    display: flex;
    margin: 0;
    padding: 0.25rem 0.5rem;
    list-style: none;
}

.pilha__foto[b-8dq7xpnejf] {
    display: grid;
    place-items: center;
    width: 3.5rem;
    height: 3.5rem;
    margin-left: -0.75rem;
    border: 3px solid #fff;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--cf-blue), var(--cf-blue-soft));
    color: #fff;
    font-family: var(--cf-font-display);
    font-size: 1.5rem;
    font-weight: 800;
    animation: bento-pula-b-8dq7xpnejf 5s var(--cf-ease) infinite;
    animation-delay: calc(var(--n) * 0.18s);
}

.pilha__foto:first-child[b-8dq7xpnejf] {
    margin-left: 0;
}

.pilha__foto:nth-child(2n)[b-8dq7xpnejf] {
    background: linear-gradient(135deg, var(--cf-red), #ff8c8e);
}

.pilha__foto:last-child[b-8dq7xpnejf] {
    background: var(--cf-ink);
}

@keyframes bento-pula-b-8dq7xpnejf {
    0%, 30%, 100% { transform: translateY(0); }
    12% { transform: translateY(-10px); }
}

/* ---------- D: painel ---------- */

.painel[b-8dq7xpnejf] {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 1.25rem;
}

.painel__kpis[b-8dq7xpnejf] {
    display: grid;
    grid-template-columns: repeat(3, auto);
    justify-content: start;
    gap: clamp(1rem, 4vw, 2.5rem);
    margin: 0;
}

.kpi[b-8dq7xpnejf] {
    display: grid;
    gap: 0.15rem;
    margin: 0;
}

.kpi__rotulo[b-8dq7xpnejf] {
    font-size: 0.8125rem;
    color: var(--cf-fg-muted);
}

.kpi__n[b-8dq7xpnejf],
.kpi__fixo[b-8dq7xpnejf] {
    font-family: var(--cf-font-display);
    font-size: clamp(1.9rem, 4vw, 2.75rem);
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.kpi__n--atend[b-8dq7xpnejf]::after {
    counter-reset: bento-atend var(--cf-n);
    content: counter(bento-atend);
    --cf-n: 128;
}

.kpi__n--ticket[b-8dq7xpnejf]::before {
    content: 'R$ ';
    font-size: 0.55em;
    color: var(--cf-fg-muted);
}

.kpi__n--ticket[b-8dq7xpnejf]::after {
    counter-reset: bento-ticket var(--cf-n);
    content: counter(bento-ticket);
    --cf-n: 53;
}

/* Contagem só quando a célula entra na tela (data-in vem do JS; sem JS o valor final já está visível). */
.cel--painel[data-in] .kpi__n--atend[b-8dq7xpnejf]::after {
    animation: bento-conta-atend-b-8dq7xpnejf 1.6s cubic-bezier(0.22, 1, 0.36, 1) backwards;
}

.cel--painel[data-in] .kpi__n--ticket[b-8dq7xpnejf]::after {
    animation: bento-conta-ticket-b-8dq7xpnejf 1.6s cubic-bezier(0.22, 1, 0.36, 1) backwards;
}

@keyframes bento-conta-atend-b-8dq7xpnejf {
    from { --cf-n: 0; }
    to { --cf-n: 128; }
}

@keyframes bento-conta-ticket-b-8dq7xpnejf {
    from { --cf-n: 0; }
    to { --cf-n: 53; }
}

.painel__barras[b-8dq7xpnejf] {
    display: flex;
    align-items: flex-end;
    gap: 0.6rem;
    height: 120px;
}

.painel__barra[b-8dq7xpnejf] {
    flex: 1;
    height: var(--h);
    border-radius: 8px 8px 3px 3px;
    background: linear-gradient(180deg, var(--cf-blue-soft), var(--cf-blue));
    transform-origin: bottom;
}

.painel__barra:nth-child(6)[b-8dq7xpnejf] {
    background: linear-gradient(180deg, #ff8c8e, var(--cf-red));
}

.cel--painel[data-in] .painel__barra[b-8dq7xpnejf] {
    animation: bento-barra-b-8dq7xpnejf 1.1s var(--cf-ease) backwards;
    animation-delay: calc(var(--n) * 90ms + 200ms);
}

@keyframes bento-barra-b-8dq7xpnejf {
    from { transform: scaleY(0); }
}

/* ---------- E: calendário que fecha ---------- */

.mes[b-8dq7xpnejf] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0.4rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.mes__dia[b-8dq7xpnejf] {
    position: relative;
    display: grid;
    place-items: center;
    aspect-ratio: 1;
    border-radius: 10px;
    border: 1px solid var(--cf-line);
    font-size: 0.875rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.mes__dia--fechado[b-8dq7xpnejf],
.mes__dia--fecha[b-8dq7xpnejf] {
    color: #4a5678;
    background: repeating-linear-gradient(135deg, rgba(229, 56, 59, 0.16) 0 6px, transparent 6px 12px);
    border-color: rgba(229, 56, 59, 0.5);
}

.mes__dia--fecha[b-8dq7xpnejf] {
    animation: bento-fecha-b-8dq7xpnejf 5s var(--cf-ease) infinite;
}

@keyframes bento-fecha-b-8dq7xpnejf {
    0%, 30% {
        background: transparent;
        border-color: var(--cf-line);
        color: inherit;
        transform: none;
    }
    38% { transform: scale(1.18); }
    46%, 88% {
        background: repeating-linear-gradient(135deg, rgba(229, 56, 59, 0.16) 0 6px, transparent 6px 12px);
        border-color: rgba(229, 56, 59, 0.5);
        color: #4a5678;
        transform: none;
    }
    100% {
        background: transparent;
        border-color: var(--cf-line);
        color: inherit;
    }
}

/* ---------- F: cadastro ---------- */

.acesso[b-8dq7xpnejf] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 1.25rem 2.5rem;
    flex-shrink: 0;
}

/* Um bloco por forma de cadastro: controle em cima, nome e regra embaixo. */
.acesso__modo[b-8dq7xpnejf] {
    display: grid;
    justify-items: start;
    gap: 0.35rem;
    max-width: 15rem;
}

.acesso__nome[b-8dq7xpnejf] {
    margin: 0.35rem 0 0;
    font-weight: 700;
}

.acesso__desc[b-8dq7xpnejf] {
    margin: 0;
    font-size: 0.875rem;
    color: var(--cf-fg-muted);
}

.chave[b-8dq7xpnejf] {
    position: relative;
    width: 4.25rem;
    height: 2.4rem;
    border-radius: 999px;
    background: var(--cf-blue);
    animation: bento-chave-b-8dq7xpnejf 6s ease-in-out infinite;
}

.chave__bola[b-8dq7xpnejf] {
    position: absolute;
    top: 0.3rem;
    left: 0.3rem;
    width: 1.8rem;
    height: 1.8rem;
    border-radius: 50%;
    background: #fff;
    animation: bento-bola-b-8dq7xpnejf 6s var(--cf-ease) infinite;
}

@keyframes bento-bola-b-8dq7xpnejf {
    0%, 40% { transform: translateX(1.85rem); }
    55%, 90% { transform: translateX(0); }
    100% { transform: translateX(1.85rem); }
}

@keyframes bento-chave-b-8dq7xpnejf {
    0%, 40% { background: var(--cf-blue); }
    55%, 90% { background: #56628f; }
    100% { background: var(--cf-blue); }
}

.ficha[b-8dq7xpnejf] {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    padding: 0.85rem 1.1rem;
    border: 1.5px dashed var(--cf-line-strong);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.05);
    color: var(--cf-foam);
    font: inherit;
    cursor: pointer;
    transition: border-color 0.2s, background-color 0.2s;
}

.ficha:hover[b-8dq7xpnejf] {
    border-color: var(--cf-blue-soft);
    background: rgba(255, 255, 255, 0.09);
}

.ficha__codigo[b-8dq7xpnejf] {
    font-family: ui-monospace, 'Cascadia Code', Menlo, Consolas, monospace;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: 0.08em;
}

.ficha__acao[b-8dq7xpnejf]::before {
    content: 'copiar';
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--cf-blue-soft);
}

.ficha[data-copied] .ficha__acao[b-8dq7xpnejf]::before {
    content: 'copiado!';
    color: var(--cf-ok);
}
/* /Components/Plataforma/RodapePlataforma.razor.rz.scp.css */
.rodape[b-erjh5svt30] {
    position: relative;
    padding-block: 3rem 2.5rem;
    background: var(--cf-ink-2);
}

.rodape__fita[b-erjh5svt30] {
    position: absolute;
    inset: 0 0 auto 0;
    height: 5px;
}

.rodape__grade[b-erjh5svt30] {
    display: grid;
    gap: 1.5rem;
    align-items: center;
}

@media (min-width: 720px) {
    .rodape__grade[b-erjh5svt30] {
        grid-template-columns: 1fr auto auto auto;
        gap: 3rem;
    }
}

.rodape__marca[b-erjh5svt30] {
    display: grid;
    gap: 0.6rem;
    --marca-tamanho: 1.9rem;
}

.rodape__frase[b-erjh5svt30],
.rodape__direitos[b-erjh5svt30] {
    margin: 0;
    color: var(--cf-fg-muted);
    font-size: 0.9375rem;
}

.rodape__links[b-erjh5svt30] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1.5rem;
}

.rodape__links a[b-erjh5svt30] {
    padding-block: 0.5rem;
    color: var(--cf-fg);
    font-weight: 600;
    font-size: 0.9375rem;
    text-underline-offset: 4px;
}

.rodape__links a:hover[b-erjh5svt30] {
    color: var(--cf-blue-soft);
}

.rodape__suporte[b-erjh5svt30] {
    display: grid;
    gap: 0.25rem;
}

.rodape__suporte-titulo[b-erjh5svt30],
.rodape__suporte-canais[b-erjh5svt30] {
    margin: 0;
    font-size: 0.9375rem;
}

.rodape__suporte-titulo[b-erjh5svt30] {
    color: var(--cf-fg-muted);
}

.rodape__suporte-canais[b-erjh5svt30] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.6rem;
    color: var(--cf-fg-muted);
}

.rodape__suporte-canais a[b-erjh5svt30] {
    color: var(--cf-fg);
    font-weight: 600;
    text-underline-offset: 4px;
}

.rodape__suporte-canais a:hover[b-erjh5svt30] {
    color: var(--cf-blue-soft);
}
/* /Components/Plataforma/TelaEstado.razor.rz.scp.css */
.tela-estado[b-ytsae2atpo] {
    display: grid;
    gap: 1.25rem;
    justify-items: start;
    width: min(100%, 560px);
    --marca-tamanho: 1.9rem;
}

.tela-estado__poste[b-ytsae2atpo] {
    width: min(100%, 220px);
    height: 8px;
    border-radius: 999px;
}

.tela-estado__titulo[b-ytsae2atpo] {
    max-width: 12ch;
    font-size: clamp(2.75rem, 9vw, 4.5rem);
}

.tela-estado__texto[b-ytsae2atpo] {
    max-width: 40ch;
}

.tela-estado[b-ytsae2atpo]  a {
    color: var(--cf-blue-soft);
    font-weight: 700;
    text-underline-offset: 4px;
}
/* /Components/Shared/Calendario/Calendario.razor.rz.scp.css */
/*
 * Calendário / seletor de data — ver docs/knowledge-base/componentes-compartilhados/spec.md,
 * seções 1.2 (estados visuais), 1.5 (responsividade) e 1.6 (acessibilidade).
 *
 * CSS isolation do Blazor (escopo automático por atributo), consistente com a decisão de tooling
 * CSS pura tomada na issue #4 (ver docs/knowledge-base/design-system/spec.md, seção 5).
 */

.calendario[b-0inbmsaj0h] {
    width: 100%;
    max-width: 360px;
    font-family: var(--font-family-base);
    position: relative;
}

/* Mobile (< 640px, ver breakpoints.css): calendário ocupa 100% do container disponível. */
@media (max-width: 639px) {
    .calendario[b-0inbmsaj0h] {
        max-width: none;
    }
}

.calendario__cabecalho[b-0inbmsaj0h] {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    margin-bottom: var(--space-8);
}

.calendario__nav[b-0inbmsaj0h],
.calendario__hoje[b-0inbmsaj0h],
.calendario__titulo[b-0inbmsaj0h] {
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text);
    cursor: pointer;
    font-family: inherit;
}

.calendario__nav[b-0inbmsaj0h],
.calendario__hoje[b-0inbmsaj0h] {
    min-width: 44px;
    min-height: 44px;
}

.calendario__nav:hover[b-0inbmsaj0h],
.calendario__hoje:hover[b-0inbmsaj0h],
.calendario__titulo:hover[b-0inbmsaj0h] {
    border-color: var(--primary);
}

.calendario__titulo[b-0inbmsaj0h] {
    flex: 1 1 auto;
    min-height: 44px;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    text-align: center;
    text-transform: capitalize;
}

.calendario__seletor-rapido[b-0inbmsaj0h] {
    position: absolute;
    z-index: 10;
    inset-inline: 0;
    top: 48px;
    background: var(--bg);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: var(--space-16);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.calendario__seletor-rapido-cabecalho[b-0inbmsaj0h] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-16);
    margin-bottom: var(--space-12);
}

.calendario__seletor-rapido-cabecalho button[b-0inbmsaj0h] {
    min-width: 44px;
    min-height: 44px;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text);
    cursor: pointer;
}

.calendario__seletor-rapido-meses[b-0inbmsaj0h] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-8);
}

.calendario__mes-rapido[b-0inbmsaj0h] {
    min-height: 44px;
    background: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text);
    cursor: pointer;
    font-size: var(--font-size-sm);
}

.calendario__mes-rapido:hover[b-0inbmsaj0h] {
    border-color: var(--primary);
}

.calendario__mes-rapido--atual[b-0inbmsaj0h] {
    background: var(--primary);
    border-color: var(--primary);
    color: #FFFFFF;
}

.calendario__seletor-rapido-fechar[b-0inbmsaj0h] {
    width: 100%;
    margin-top: var(--space-12);
    min-height: 44px;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--text-muted);
    cursor: pointer;
}

/* Região aria-live: presente no DOM (leitores de tela precisam do texto), invisível visualmente. */
.calendario__anuncio[b-0inbmsaj0h] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.calendario__legenda[b-0inbmsaj0h] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    color: var(--text-muted);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    margin-bottom: var(--space-4);
}

.calendario__grade[b-0inbmsaj0h] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.calendario__linha[b-0inbmsaj0h] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: var(--space-4);
}

.calendario__dia[b-0inbmsaj0h] {
    position: relative;
    aspect-ratio: 1 / 1;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
    cursor: pointer;
    padding: 0;
}

/* Telas muito pequenas (< 360px): reduz a fonte do número, nunca a área de toque (seção 1.5). */
@media (max-width: 359px) {
    .calendario__dia[b-0inbmsaj0h] {
        font-size: var(--font-size-xs);
    }
}

.calendario__dia:hover:not(:disabled)[b-0inbmsaj0h] {
    background: var(--bg-subtle);
}

.calendario__dia:focus-visible[b-0inbmsaj0h] {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}

.calendario__numero[b-0inbmsaj0h] {
    pointer-events: none;
}

/* Fora do mês: preenchimento de grade, sem destaque de interação. */
.calendario__dia--fora-do-mes[b-0inbmsaj0h] {
    color: var(--text-muted);
}

/* Hoje: borda fina --primary ao redor do número. */
.calendario__dia--hoje[b-0inbmsaj0h] {
    border-color: var(--primary);
}

/* Passado: sem interação, texto apagado. */
.calendario__dia--passado[b-0inbmsaj0h] {
    color: var(--text-muted);
    cursor: default;
}

/* Fechado/indisponível: riscado, sem hover. */
.calendario__dia--fechado[b-0inbmsaj0h] {
    color: var(--text-muted);
    text-decoration: line-through;
    cursor: default;
}

/* Desabilitado genérico: sem cursor de clique, sem hover. */
.calendario__dia--desabilitado[b-0inbmsaj0h] {
    color: var(--text-muted);
    cursor: default;
}

.calendario__dia:disabled[b-0inbmsaj0h] {
    cursor: default;
}

.calendario__dia:disabled:hover[b-0inbmsaj0h] {
    background: transparent;
}

/* Lotado: ponto pequeno --warning abaixo do número (permanece clicável). */
.calendario__marcador-lotado[b-0inbmsaj0h] {
    position: absolute;
    bottom: 4px;
    left: 50%;
    transform: translateX(-50%);
    width: 5px;
    height: 5px;
    border-radius: 999px;
    background: var(--warning);
}

/* Selecionado: fundo --primary, texto branco — precisa vencer os estados acima (regra mais
   específica no final da cascata, mesma especificidade de classe única). */
.calendario__dia--selecionado[b-0inbmsaj0h] {
    background: var(--primary);
    border-color: var(--primary);
    color: #FFFFFF;
    text-decoration: none;
}

/* Intervalo (modo Intervalo, seção 1.4): destaque sutil --primary-subtle no intervalo inteiro
   (início, meio e fim) — token explicitamente diferente do "Selecionado" sólido de dia único. */
.calendario__dia--no-intervalo[b-0inbmsaj0h] {
    background: var(--primary-subtle);
    border-color: var(--primary-subtle);
    color: var(--text);
}
/* /Components/Shared/FechamentoAgenda/FechamentoAgenda.razor.rz.scp.css */
/*
 * Fechamento de Agenda — ver docs/knowledge-base/componentes-compartilhados/spec.md, seção 3.
 * CSS isolation do Blazor, mesmo padrão de Calendario.razor.css / SeletorHorario.razor.css.
 */

.fechamento-agenda[b-qdhdfafbty] {
    width: 100%;
    font-family: var(--font-family-base);
}

.fechamento-agenda__botao-abrir[b-qdhdfafbty],
.fechamento-agenda__botao-primario[b-qdhdfafbty],
.fechamento-agenda__botao-secundario[b-qdhdfafbty],
.fechamento-agenda__botao-perigo[b-qdhdfafbty],
.fechamento-agenda__botao-remover[b-qdhdfafbty] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border-radius: 8px;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
}

.fechamento-agenda__botao-abrir[b-qdhdfafbty],
.fechamento-agenda__botao-primario[b-qdhdfafbty] {
    background: var(--primary);
    color: #FFFFFF;
    border: 1px solid var(--primary);
}

.fechamento-agenda__botao-primario:disabled[b-qdhdfafbty],
.fechamento-agenda__botao-abrir:disabled[b-qdhdfafbty] {
    opacity: 0.4;
    cursor: default;
}

.fechamento-agenda__botao-secundario[b-qdhdfafbty] {
    background: transparent;
    color: var(--text);
    border: 1px solid var(--border);
}

.fechamento-agenda__botao-perigo[b-qdhdfafbty] {
    background: var(--danger);
    color: #FFFFFF;
    border: 1px solid var(--danger);
}

.fechamento-agenda__botao-remover[b-qdhdfafbty] {
    background: transparent;
    color: var(--danger);
    border: 1px solid var(--border);
}

.fechamento-agenda__link[b-qdhdfafbty] {
    background: none;
    border: none;
    color: var(--primary);
    text-decoration: underline;
    cursor: pointer;
    font-family: inherit;
    font-size: inherit;
    padding: 0;
}

/* Chips (variante simplificada, seção 3.5). */
.fechamento-agenda__chips[b-qdhdfafbty] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-8);
}

.fechamento-agenda__chip[b-qdhdfafbty] {
    min-height: 44px;
    padding-inline: var(--space-12);
    border-radius: 999px;
    background: var(--bg-subtle);
    border: 1px solid var(--border);
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
    cursor: pointer;
}

/* Overlay + modal (mobile: bottom sheet; desktop: modal centralizado — design system, seção 5.4). */
.fechamento-agenda__overlay[b-qdhdfafbty] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 40;
}

.fechamento-agenda__modal[b-qdhdfafbty] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 90vh;
    overflow-y: auto;
    background: var(--bg);
    border-radius: 16px 16px 0 0;
    padding: var(--space-16);
    z-index: 41;
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
}

@media (min-width: 1024px) {
    .fechamento-agenda__modal[b-qdhdfafbty] {
        left: 50%;
        right: auto;
        bottom: auto;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        max-width: 480px;
        max-height: 85vh;
        border-radius: 16px;
    }
}

.fechamento-agenda__cabecalho[b-qdhdfafbty] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.fechamento-agenda__titulo[b-qdhdfafbty] {
    font-size: var(--font-size-lg);
    font-weight: 600;
    margin: 0;
}

.fechamento-agenda__fechar[b-qdhdfafbty] {
    background: none;
    border: none;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    color: var(--text-muted);
    min-width: 44px;
    min-height: 44px;
}

.fechamento-agenda__campo[b-qdhdfafbty] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    border: none;
    padding: 0;
    margin: 0;
}

.fechamento-agenda__campo legend[b-qdhdfafbty] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    padding: 0;
}

/* Segmented control (Passo 1) — radios nativos escondidos, label estilizado como segmento
   (mantém navegação por seta nativa do navegador entre radios do mesmo `name`, seção 3.7). */
.fechamento-agenda__segmentado[b-qdhdfafbty] {
    display: flex;
    gap: var(--space-8);
    flex-wrap: wrap;
}

.fechamento-agenda__segmento[b-qdhdfafbty] {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    padding: var(--space-8) var(--space-12);
    border: 1px solid var(--border);
    border-radius: 8px;
    font-size: var(--font-size-sm);
    cursor: pointer;
    min-height: 44px;
}

.fechamento-agenda__segmento:has(input:checked)[b-qdhdfafbty] {
    border-color: var(--primary);
    background: var(--primary-subtle);
}

.fechamento-agenda__horas[b-qdhdfafbty] {
    flex-direction: row;
    gap: var(--space-16);
}

.fechamento-agenda__horas label[b-qdhdfafbty] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    font-size: var(--font-size-sm);
}

.fechamento-agenda__opcao-escopo[b-qdhdfafbty] {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    min-height: 44px;
    font-size: var(--font-size-sm);
}

.fechamento-agenda__motivo[b-qdhdfafbty] {
    min-height: 44px;
    padding-inline: var(--space-12);
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg);
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-base);
}

.fechamento-agenda__rodape[b-qdhdfafbty] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-8);
}

.fechamento-agenda__erro[b-qdhdfafbty] {
    color: var(--danger);
    font-size: var(--font-size-sm);
    margin: 0;
}

/* Aviso de colisão (seção 3.3) — aria-live="assertive" está no markup, não aqui. */
.fechamento-agenda__aviso-colisao[b-qdhdfafbty] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    padding: var(--space-12);
    background: var(--bg-subtle);
    border: 1px solid var(--warning);
    border-radius: 8px;
    font-size: var(--font-size-sm);
}

.fechamento-agenda__lista-conflitos[b-qdhdfafbty] {
    margin: 0;
    padding-left: var(--space-16);
}

.fechamento-agenda__checkbox[b-qdhdfafbty] {
    display: flex;
    align-items: flex-start;
    gap: var(--space-8);
}

/* Lista de bloqueios futuros (seção 3.4). */
.fechamento-agenda__lista[b-qdhdfafbty] {
    margin-top: var(--space-24);
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.fechamento-agenda__lista-titulo[b-qdhdfafbty] {
    font-size: var(--font-size-md);
    font-weight: 600;
    margin: 0;
}

.fechamento-agenda__vazio[b-qdhdfafbty] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.fechamento-agenda__item[b-qdhdfafbty] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-16);
    padding: var(--space-16);
    background: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 12px;
    flex-wrap: wrap;
}

.fechamento-agenda__item-info[b-qdhdfafbty] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: var(--font-size-sm);
}

.fechamento-agenda__item-periodo[b-qdhdfafbty] {
    font-weight: 500;
}

.fechamento-agenda__item-barbeiro[b-qdhdfafbty],
.fechamento-agenda__item-motivo[b-qdhdfafbty] {
    color: var(--text-muted);
}

.fechamento-agenda__confirmacao[b-qdhdfafbty] {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    font-size: var(--font-size-sm);
}

/* Skeleton (design system, seção 5.7). */
.fechamento-agenda__skeleton[b-qdhdfafbty] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.fechamento-agenda__skeleton-item[b-qdhdfafbty] {
    height: 64px;
    border-radius: 12px;
    background: var(--bg-subtle);
    animation: fechamento-agenda-pulso-b-qdhdfafbty 1.2s ease-in-out infinite;
}

@keyframes fechamento-agenda-pulso-b-qdhdfafbty {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}
/* /Components/Shared/NovoAgendamentoAdmin.razor.rz.scp.css */
/*
 * Novo Agendamento (Admin/Owner) — botão "+ Agendamento" da Agenda (issue #21), ver
 * docs/knowledge-base/telas-admin/spec.md, seção 6.1. Overlay + modal com o mesmo padrão de
 * FechamentoAgenda.razor.css (mobile: bottom sheet; desktop: modal centralizado).
 */

.novo-agendamento-admin__overlay[b-7so7l8470a] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 40;
}

.novo-agendamento-admin__modal[b-7so7l8470a] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 90vh;
    overflow-y: auto;
    background: var(--bg);
    border-radius: 16px 16px 0 0;
    padding: var(--space-16);
    z-index: 41;
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    font-family: var(--font-family-base);
}

@media (min-width: 1024px) {
    .novo-agendamento-admin__modal[b-7so7l8470a] {
        left: 50%;
        right: auto;
        bottom: auto;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        max-width: 560px;
        max-height: 85vh;
        border-radius: 16px;
    }
}

.novo-agendamento-admin__cabecalho[b-7so7l8470a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.novo-agendamento-admin__titulo[b-7so7l8470a] {
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

.novo-agendamento-admin__fechar[b-7so7l8470a] {
    background: none;
    border: none;
    font-size: var(--font-size-xl);
    cursor: pointer;
    color: var(--text-muted);
    min-width: 44px;
    min-height: 44px;
}

.novo-agendamento-admin__corpo[b-7so7l8470a] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
}

.novo-agendamento-admin__passo[b-7so7l8470a] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.novo-agendamento-admin__passo-titulo[b-7so7l8470a] {
    margin: 0;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--text-muted);
}

.novo-agendamento-admin__estado[b-7so7l8470a] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.novo-agendamento-admin__chips[b-7so7l8470a] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-8);
}

.novo-agendamento-admin__chip[b-7so7l8470a] {
    min-height: 44px;
    padding-inline: var(--space-12);
    border-radius: 999px;
    background: var(--bg-subtle);
    border: 1px solid var(--border);
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
    cursor: pointer;
}

.novo-agendamento-admin__chip--selecionado[b-7so7l8470a] {
    background: var(--primary);
    border-color: var(--primary);
    color: #FFFFFF;
}

.novo-agendamento-admin__resumo[b-7so7l8470a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-8) var(--space-12);
    background: var(--bg-subtle);
    border-radius: 8px;
}

.novo-agendamento-admin__trocar[b-7so7l8470a] {
    background: none;
    border: none;
    color: var(--primary);
    text-decoration: underline;
    cursor: pointer;
    font-family: inherit;
    font-size: var(--font-size-sm);
}

.novo-agendamento-admin__input[b-7so7l8470a] {
    min-height: 44px;
    padding-inline: var(--space-12);
    border-radius: 8px;
    border: 1px solid var(--border);
    background: var(--bg);
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
    width: 100%;
}

.novo-agendamento-admin__resultados[b-7so7l8470a] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    max-height: 200px;
    overflow-y: auto;
}

.novo-agendamento-admin__resultado[b-7so7l8470a] {
    width: 100%;
    text-align: left;
    min-height: 44px;
    padding-inline: var(--space-12);
    border-radius: 8px;
    background: var(--bg-subtle);
    border: 1px solid var(--border);
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
    cursor: pointer;
}

.novo-agendamento-admin__data-horario[b-7so7l8470a] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
}

@media (min-width: 1024px) {
    .novo-agendamento-admin__data-horario[b-7so7l8470a] {
        flex-direction: row;
    }

    .novo-agendamento-admin__data-horario > *[b-7so7l8470a] {
        flex: 1;
    }
}

.novo-agendamento-admin__erro[b-7so7l8470a] {
    color: var(--danger);
    font-size: var(--font-size-sm);
}

.novo-agendamento-admin__rodape[b-7so7l8470a] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-8);
}

.novo-agendamento-admin__botao-primario[b-7so7l8470a],
.novo-agendamento-admin__botao-secundario[b-7so7l8470a] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border-radius: 8px;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
}

.novo-agendamento-admin__botao-primario[b-7so7l8470a] {
    background: var(--primary);
    color: #FFFFFF;
    border: 1px solid var(--primary);
}

.novo-agendamento-admin__botao-primario:disabled[b-7so7l8470a] {
    opacity: 0.4;
    cursor: default;
}

.novo-agendamento-admin__botao-secundario[b-7so7l8470a] {
    background: transparent;
    color: var(--text);
    border: 1px solid var(--border);
}
/* /Components/Shared/SeletorHorario/SeletorHorario.razor.rz.scp.css */
/*
 * Seletor de Horário — ver docs/knowledge-base/componentes-compartilhados/spec.md, seções 2.2
 * (estrutura/semântica), 2.3 (estados visuais), 2.5 (responsividade) e 2.6 (acessibilidade).
 *
 * CSS isolation do Blazor, mesmo padrão de Calendario.razor.css (issue #6).
 */

.seletor-horario[b-gvmx08crxn] {
    width: 100%;
    font-family: var(--font-family-base);
}

/* Região aria-live: presente no DOM, invisível visualmente (leitor de tela lê o texto). */
.seletor-horario__anuncio[b-gvmx08crxn] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Mobile (padrão, < 640px): 3 colunas. */
.seletor-horario__grade[b-gvmx08crxn] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-8);
}

/* Tablet (640-1023px) e Desktop (>= 1024px): 4-5 colunas (seção 2.5). */
@media (min-width: 640px) and (max-width: 1023px) {
    .seletor-horario__grade[b-gvmx08crxn] {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media (min-width: 1024px) {
    .seletor-horario__grade[b-gvmx08crxn] {
        grid-template-columns: repeat(5, 1fr);
    }
}

.seletor-horario__slot[b-gvmx08crxn] {
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-subtle);
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
    cursor: pointer;
    padding: var(--space-8);
}

.seletor-horario__slot:hover:not(:disabled)[b-gvmx08crxn] {
    border-color: var(--primary);
}

.seletor-horario__slot:focus-visible[b-gvmx08crxn] {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}

/* Selecionado: fundo --primary, texto branco (seção 2.3). */
.seletor-horario__slot--selecionado[b-gvmx08crxn] {
    background: var(--primary);
    border-color: var(--primary);
    color: #FFFFFF;
}

/* Indisponível (ocupado/bloqueado): riscado, não-interativo, sem hover — deliberadamente sem
   diferenciar "ocupado" de "bloqueado" (nota de UX da seção 2.3). */
.seletor-horario__slot--indisponivel[b-gvmx08crxn],
.seletor-horario__slot:disabled[b-gvmx08crxn] {
    background: transparent;
    color: var(--text-muted);
    text-decoration: line-through;
    cursor: default;
}

.seletor-horario__slot:disabled:hover[b-gvmx08crxn] {
    border-color: transparent;
}

/* Skeleton (design system, seção 5.7) — mesmo grid da grade real, blocos pulsantes no lugar dos
   horários, pra nunca deixar a tela em branco nem um slot antigo visível ao trocar dia/barbeiro. */
.seletor-horario__grade--skeleton[b-gvmx08crxn] {
    pointer-events: none;
}

.seletor-horario__skeleton-bloco[b-gvmx08crxn] {
    min-height: 44px;
    border-radius: 8px;
    background: var(--bg-subtle);
    animation: seletor-horario-pulso-b-gvmx08crxn 1.2s ease-in-out infinite;
}

@keyframes seletor-horario-pulso-b-gvmx08crxn {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* Estado vazio (design system, seção 5.8) e estado de erro. */
.seletor-horario__estado[b-gvmx08crxn] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-8);
    padding: var(--space-16);
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.seletor-horario__botao-secundario[b-gvmx08crxn] {
    min-height: 44px;
    padding-inline: var(--space-16);
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 8px;
    color: var(--primary);
    cursor: pointer;
    font-family: inherit;
    font-size: var(--font-size-sm);
}

.seletor-horario__botao-secundario:hover:not(:disabled)[b-gvmx08crxn] {
    border-color: var(--primary);
}

.seletor-horario__botao-secundario:disabled[b-gvmx08crxn] {
    cursor: default;
    color: var(--text-muted);
}
/* /Components/Shared/Toast/ToastContainer.razor.rz.scp.css */
/*
 * Toast / notificação inline — design system, seção 5.5.
 * Mobile: topo, largura quase total. Desktop: canto superior direito, largura fixa confortável.
 */

.toast-container[b-p3j9xd4jxp] {
    position: fixed;
    top: var(--space-16);
    left: var(--space-16);
    right: var(--space-16);
    z-index: 1000;
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    pointer-events: none;
}

@media (min-width: 1024px) {
    .toast-container[b-p3j9xd4jxp] {
        left: auto;
        right: var(--space-24);
        top: var(--space-24);
        width: 360px;
    }
}

.toast-container__toast[b-p3j9xd4jxp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-12);
    padding: var(--space-12) var(--space-16);
    border-radius: 8px;
    border: 1px solid var(--border);
    background-color: var(--bg-subtle);
    color: var(--text);
    font-size: var(--font-size-sm);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    pointer-events: auto;
}

.toast-container__toast--sucesso[b-p3j9xd4jxp] {
    border-color: var(--success);
    color: var(--success);
}

.toast-container__toast--erro[b-p3j9xd4jxp] {
    border-color: var(--danger);
    color: var(--danger);
}

.toast-container__fechar[b-p3j9xd4jxp] {
    min-height: 44px;
    min-width: 44px;
    border: none;
    background: transparent;
    color: inherit;
    font-size: var(--font-size-lg);
    line-height: 1;
    cursor: pointer;
}
/* /Pages/Admin/Agenda.razor.rz.scp.css */
/*
 * Agenda (Admin/Owner, issue #21) — ver docs/knowledge-base/telas-admin/spec.md, seção 6.
 * Mobile: visão Dia é a aba padrão, toggle/filtro compactos no topo (seção 6.8).
 * Desktop: toggle e filtro sempre visíveis lado a lado, mais espaço para a grade.
 */

.visually-hidden[b-dyfcz78gn7] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.agenda[b-dyfcz78gn7] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    padding-block: var(--space-16);
    width: 100%;
}

.agenda__titulo[b-dyfcz78gn7] {
    margin: 0;
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
}

.agenda__cabecalho[b-dyfcz78gn7] {
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
}

.agenda__controles[b-dyfcz78gn7] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-8);
}

.agenda__toggle[b-dyfcz78gn7] {
    display: flex;
    gap: var(--space-4);
    background: var(--bg-subtle);
    border-radius: 8px;
    padding: var(--space-4);
}

.agenda__segmento[b-dyfcz78gn7] {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4) var(--space-8);
    font-size: var(--font-size-sm);
    cursor: pointer;
    border-radius: 6px;
}

.agenda__select[b-dyfcz78gn7] {
    min-height: 44px;
    padding-inline: var(--space-8);
    border-radius: 8px;
    border: 1px solid var(--border);
    background: var(--bg);
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
}

.agenda__botao-primario[b-dyfcz78gn7],
.agenda__botao-secundario[b-dyfcz78gn7],
.agenda__botao-perigo[b-dyfcz78gn7] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border-radius: 8px;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
}

.agenda__botao-primario[b-dyfcz78gn7] {
    background: var(--primary);
    color: #FFFFFF;
    border: 1px solid var(--primary);
}

.agenda__botao-secundario[b-dyfcz78gn7] {
    background: transparent;
    color: var(--text);
    border: 1px solid var(--border);
}

.agenda__botao-perigo[b-dyfcz78gn7] {
    background: var(--danger);
    color: #FFFFFF;
    border: 1px solid var(--danger);
}

.agenda__link[b-dyfcz78gn7] {
    background: none;
    border: none;
    color: var(--primary);
    text-decoration: underline;
    cursor: pointer;
    font-family: inherit;
    font-size: var(--font-size-sm);
    padding: 0;
}

.agenda__estado[b-dyfcz78gn7] {
    color: var(--text-muted);
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    align-items: flex-start;
}

.agenda__calendario[b-dyfcz78gn7] {
    max-width: 100%;
}

@media (min-width: 1024px) {
    .agenda__controles[b-dyfcz78gn7] {
        flex-wrap: nowrap;
    }

    .agenda__calendario[b-dyfcz78gn7] {
        max-width: 480px;
    }
}

.agenda__skeleton[b-dyfcz78gn7] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.agenda__skeleton-linha[b-dyfcz78gn7] {
    height: 44px;
    border-radius: 8px;
    background: var(--bg-subtle);
}

.agenda__vazio[b-dyfcz78gn7] {
    color: var(--text-muted);
    padding-block: var(--space-16);
}

/* ---------- Visão Dia (seção 6.2) ---------- */

.agenda__dia-grade[b-dyfcz78gn7] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1px;
    background: var(--border);
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
}

.agenda__dia-cabecalho-linha[b-dyfcz78gn7],
.agenda__dia-linha[b-dyfcz78gn7] {
    display: grid;
    grid-template-columns: subgrid;
    grid-column: 1 / -1;
}

.agenda__dia-cabecalho-linha[b-dyfcz78gn7] {
    background: var(--bg-subtle);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-sm);
}

.agenda__dia-cabecalho-coluna[b-dyfcz78gn7],
.agenda__dia-hora[b-dyfcz78gn7] {
    padding: var(--space-8);
    background: var(--bg-subtle);
}

.agenda__dia-hora[b-dyfcz78gn7] {
    font-size: var(--font-size-sm);
    color: var(--text-muted);
    white-space: nowrap;
}

.agenda__dia-celula[b-dyfcz78gn7] {
    background: var(--bg);
    min-height: 44px;
    padding: var(--space-4);
}

.agenda__bloco-agendamento[b-dyfcz78gn7] {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    text-align: left;
    border: none;
    border-radius: 6px;
    padding: var(--space-4) var(--space-8);
    font-family: inherit;
    font-size: var(--font-size-sm);
    cursor: pointer;
}

.agenda__bloco-agendamento--agendado[b-dyfcz78gn7] {
    background: var(--primary-subtle);
    color: var(--primary);
}

.agenda__bloco-agendamento--concluido[b-dyfcz78gn7] {
    background: var(--success);
    color: #FFFFFF;
}

.agenda__bloco-agendamento--cancelado[b-dyfcz78gn7] {
    background: var(--danger);
    color: #FFFFFF;
    opacity: 0.7;
}

.agenda__bloco-barbeiro[b-dyfcz78gn7] {
    font-size: 11px;
    opacity: 0.8;
}

.agenda__bloco-bloqueio[b-dyfcz78gn7] {
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(45deg, var(--bg-subtle), var(--bg-subtle) 6px, var(--border) 6px, var(--border) 12px);
    color: var(--text-muted);
    font-size: var(--font-size-sm);
    padding: var(--space-4) var(--space-8);
    border-radius: 6px;
}

/* Colunas por barbeiro (desktop) — mobile mantém sempre 1 coluna de dado (linha do tempo única com
   nome do barbeiro dentro do bloco, agenda__bloco-barbeiro). */
.agenda__bloco-barbeiro[b-dyfcz78gn7] {
    display: inline;
}

@media (min-width: 1024px) {
    .agenda__dia-grade--colunas-2[b-dyfcz78gn7] { grid-template-columns: auto repeat(2, 1fr); }
    .agenda__dia-grade--colunas-3[b-dyfcz78gn7] { grid-template-columns: auto repeat(3, 1fr); }
    .agenda__dia-grade--colunas-4[b-dyfcz78gn7] { grid-template-columns: auto repeat(4, 1fr); }
    .agenda__dia-grade--colunas-5[b-dyfcz78gn7] { grid-template-columns: auto repeat(5, 1fr); }
    .agenda__dia-grade--colunas-6[b-dyfcz78gn7] { grid-template-columns: auto repeat(6, 1fr); }
    .agenda__dia-grade--colunas-7[b-dyfcz78gn7] { grid-template-columns: auto repeat(7, 1fr); }
    .agenda__dia-grade--colunas-8[b-dyfcz78gn7] { grid-template-columns: auto repeat(8, 1fr); }

    /* Com colunas por barbeiro visíveis (cabeçalho com o nome), o nome dentro do bloco é
       redundante — some no desktop (seção 6.2: "colunas... (desktop) ou nome dentro do bloco
       (mobile)"). */
    .agenda__dia-grade--colunas-2 .agenda__bloco-barbeiro[b-dyfcz78gn7],
    .agenda__dia-grade--colunas-3 .agenda__bloco-barbeiro[b-dyfcz78gn7],
    .agenda__dia-grade--colunas-4 .agenda__bloco-barbeiro[b-dyfcz78gn7],
    .agenda__dia-grade--colunas-5 .agenda__bloco-barbeiro[b-dyfcz78gn7],
    .agenda__dia-grade--colunas-6 .agenda__bloco-barbeiro[b-dyfcz78gn7],
    .agenda__dia-grade--colunas-7 .agenda__bloco-barbeiro[b-dyfcz78gn7],
    .agenda__dia-grade--colunas-8 .agenda__bloco-barbeiro[b-dyfcz78gn7] {
        display: none;
    }
}

/* ---------- Visão Semana (seção 6.3) ---------- */

.agenda__semana-grade[b-dyfcz78gn7] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

@media (min-width: 1024px) {
    .agenda__semana-grade[b-dyfcz78gn7] {
        display: grid;
        grid-template-columns: repeat(7, 1fr);
        gap: var(--space-8);
        align-items: start;
    }
}

.agenda__semana-dia[b-dyfcz78gn7] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    text-align: left;
    background: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: var(--space-12);
    font-family: inherit;
    cursor: pointer;
    min-height: 44px;
}

.agenda__semana-dia-cabecalho[b-dyfcz78gn7] {
    display: flex;
    align-items: baseline;
    gap: var(--space-4);
    font-weight: var(--font-weight-semibold);
}

.agenda__semana-dia-nome[b-dyfcz78gn7] {
    text-transform: capitalize;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.agenda__semana-dia-contagem[b-dyfcz78gn7] {
    font-size: var(--font-size-sm);
    color: var(--text-muted);
}

.agenda__semana-dia-lista[b-dyfcz78gn7] {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: var(--font-size-sm);
    display: none;
}

@media (min-width: 1024px) {
    .agenda__semana-dia-lista[b-dyfcz78gn7] {
        display: flex;
        flex-direction: column;
        gap: var(--space-4);
    }
}

/* ---------- Detalhe do agendamento (seção 6.2/6.5/6.6) ---------- */

.agenda__overlay[b-dyfcz78gn7] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 40;
}

.agenda__modal[b-dyfcz78gn7] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 90vh;
    overflow-y: auto;
    background: var(--bg);
    border-radius: 16px 16px 0 0;
    padding: var(--space-16);
    z-index: 41;
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
    font-family: var(--font-family-base);
}

@media (min-width: 1024px) {
    .agenda__modal[b-dyfcz78gn7] {
        left: 50%;
        right: auto;
        bottom: auto;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        max-width: 480px;
        max-height: 85vh;
        border-radius: 16px;
    }
}

.agenda__modal-cabecalho[b-dyfcz78gn7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.agenda__modal-titulo[b-dyfcz78gn7] {
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

.agenda__fechar[b-dyfcz78gn7] {
    background: none;
    border: none;
    font-size: var(--font-size-xl);
    cursor: pointer;
    color: var(--text-muted);
    min-width: 44px;
    min-height: 44px;
}

.agenda__detalhe-lista[b-dyfcz78gn7] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--space-4) var(--space-12);
    margin: 0;
}

.agenda__detalhe-lista dt[b-dyfcz78gn7] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.agenda__detalhe-lista dd[b-dyfcz78gn7] {
    margin: 0;
}

.agenda__badge[b-dyfcz78gn7] {
    display: inline-block;
    padding: 2px var(--space-8);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 500;
}

.agenda__badge--agendado[b-dyfcz78gn7] {
    background: var(--primary-subtle);
    color: var(--primary);
}

.agenda__badge--concluido[b-dyfcz78gn7] {
    background: var(--success);
    color: #FFFFFF;
}

.agenda__badge--cancelado[b-dyfcz78gn7] {
    background: var(--danger);
    color: #FFFFFF;
}

.agenda__valor[b-dyfcz78gn7] {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    flex-wrap: wrap;
}

.agenda__valor-editado[b-dyfcz78gn7] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.agenda__valor-formulario[b-dyfcz78gn7] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.agenda__input[b-dyfcz78gn7] {
    min-height: 44px;
    padding-inline: var(--space-12);
    border-radius: 8px;
    border: 1px solid var(--border);
    background: var(--bg);
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
    width: 100%;
}

.agenda__erro[b-dyfcz78gn7] {
    color: var(--danger);
    font-size: var(--font-size-sm);
}

.agenda__valor-acoes[b-dyfcz78gn7] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-8);
}

.agenda__confirmacao-cancelamento[b-dyfcz78gn7] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    padding: var(--space-12);
    background: var(--bg-subtle);
    border-radius: 8px;
}

.agenda__modal-rodape[b-dyfcz78gn7] {
    display: flex;
    justify-content: flex-end;
}
/* /Pages/Admin/Barbeiros.razor.rz.scp.css */
/*
 * Barbeiros (Admin/Owner, issue #18) — ver docs/knowledge-base/telas-admin/spec.md, seção 3.
 * CSS isolation do Blazor, mesmo padrão de Servicos.razor.css / Agendamentos.razor.css.
 *
 * Responsividade (seção 3.6): mesma lista de linhas em mobile e desktop, sem diferença estrutural —
 * tela de gestão pontual, não de uso frequente durante o expediente.
 */

.barbeiros[b-ocuwj33u5f] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    padding-block: var(--space-24);
    width: 100%;
}

@media (min-width: 1024px) {
    .barbeiros[b-ocuwj33u5f] {
        max-width: 720px;
        margin-inline: auto;
    }
}

.barbeiros__cabecalho[b-ocuwj33u5f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-16);
    flex-wrap: wrap;
}

.barbeiros__titulo[b-ocuwj33u5f] {
    margin: 0;
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
}

@media (min-width: 1024px) {
    .barbeiros__titulo[b-ocuwj33u5f] {
        font-size: var(--font-size-2xl);
    }
}

.barbeiros__botao-primario[b-ocuwj33u5f],
.barbeiros__botao-secundario[b-ocuwj33u5f],
.barbeiros__botao-perigo[b-ocuwj33u5f] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border-radius: 8px;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

.barbeiros__botao-primario[b-ocuwj33u5f] {
    background: var(--primary);
    color: #FFFFFF;
    border: 1px solid var(--primary);
}

.barbeiros__botao-primario:disabled[b-ocuwj33u5f] {
    opacity: 0.4;
    cursor: default;
}

.barbeiros__botao-secundario[b-ocuwj33u5f] {
    background: transparent;
    color: var(--text);
    border: 1px solid var(--border);
}

.barbeiros__botao-perigo[b-ocuwj33u5f] {
    background: var(--danger);
    color: #FFFFFF;
    border: 1px solid var(--danger);
}

.barbeiros__botao-perigo:disabled[b-ocuwj33u5f] {
    opacity: 0.4;
    cursor: default;
}

/* ---------- Aviso "único barbeiro" (seção 3.5) ---------- */

.barbeiros__aviso-vazio[b-ocuwj33u5f] {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

/* ---------- Estado de erro ---------- */

.barbeiros__estado[b-ocuwj33u5f] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-12);
    color: var(--text-muted);
    padding-block: var(--space-24);
}

/* ---------- Skeleton (design system, seção 5.7) ---------- */

.barbeiros__skeleton[b-ocuwj33u5f] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.barbeiros__skeleton-item[b-ocuwj33u5f] {
    height: 56px;
    border-radius: 12px;
    background-color: var(--border);
    animation: barbeiros-skeleton-pulse-b-ocuwj33u5f 1.2s ease-in-out infinite;
}

@keyframes barbeiros-skeleton-pulse-b-ocuwj33u5f {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* ---------- Lista (seção 3.1: nome/e-mail + badge + botão) ---------- */

.barbeiros__lista[b-ocuwj33u5f] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    margin: 0;
    padding: 0;
    list-style: none;
}

.barbeiros__item[b-ocuwj33u5f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-16);
    background-color: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: var(--space-16);
    flex-wrap: wrap;
}

.barbeiros__item-info[b-ocuwj33u5f] {
    display: flex;
    align-items: center;
    gap: var(--space-12);
    flex: 1;
    min-width: 200px;
}

.barbeiros__item-nome[b-ocuwj33u5f] {
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-medium);
}

.barbeiros__botao-remover[b-ocuwj33u5f] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--border);
    border-radius: 8px;
    background: transparent;
    color: var(--danger);
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* ---------- Badge de status (design system 5.6) ---------- */

.barbeiros__badge[b-ocuwj33u5f] {
    display: inline-flex;
    align-items: center;
    padding: var(--space-4) var(--space-12);
    border-radius: 999px;
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
}

.barbeiros__badge--ativo[b-ocuwj33u5f] {
    background-color: var(--primary-subtle);
    color: var(--success);
}

.barbeiros__badge--pendente[b-ocuwj33u5f] {
    background-color: var(--primary-subtle);
    color: var(--warning);
}

/* ---------- Modal (adicionar / confirmar remoção, design system 5.4) ---------- */

.barbeiros__overlay[b-ocuwj33u5f] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 40;
}

.barbeiros__modal[b-ocuwj33u5f] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 90vh;
    overflow-y: auto;
    background: var(--bg);
    border-radius: 16px 16px 0 0;
    padding: var(--space-16);
    z-index: 41;
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
}

@media (min-width: 1024px) {
    .barbeiros__modal[b-ocuwj33u5f] {
        left: 50%;
        right: auto;
        bottom: auto;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        max-width: 480px;
        max-height: 85vh;
        border-radius: 16px;
    }
}

.barbeiros__modal-cabecalho[b-ocuwj33u5f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.barbeiros__modal-titulo[b-ocuwj33u5f] {
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

.barbeiros__modal-fechar[b-ocuwj33u5f] {
    min-width: 44px;
    min-height: 44px;
    border: none;
    background: none;
    font-size: 20px;
    line-height: 1;
    color: var(--text-muted);
    cursor: pointer;
}

.barbeiros__modal-resumo[b-ocuwj33u5f] {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.barbeiros__modal-rodape[b-ocuwj33u5f] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-8);
}

.barbeiros__campo[b-ocuwj33u5f] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.barbeiros__input[b-ocuwj33u5f] {
    min-height: 44px;
    padding-inline: var(--space-12);
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg);
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-base);
}

.barbeiros__erro[b-ocuwj33u5f] {
    margin: 0;
    color: var(--danger);
    font-size: var(--font-size-sm);
}
/* /Pages/Admin/Configuracoes.razor.rz.scp.css */
/*
 * Configurações (Admin/Owner, issue #20) — ver docs/knowledge-base/telas-admin/spec.md, seção 5.
 * CSS isolation do Blazor, mesmo padrão de Barbeiros.razor.css / Servicos.razor.css / Perfil.razor.css.
 *
 * Responsividade (seção 5.7): mobile empilha os cards com espaçamento generoso; desktop mantém as
 * mesmas seções empilhadas (não em colunas), só com largura máxima confortável (~640px) — diferente
 * de Barbeiros/Servicos (720px), a spec pede explicitamente "sem aproveitar o espaço extra para
 * colunas" aqui.
 */

.configuracoes[b-lj4av6ftc5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    padding-block: var(--space-24);
    width: 100%;
}

@media (min-width: 1024px) {
    .configuracoes[b-lj4av6ftc5] {
        max-width: 640px;
        margin-inline: auto;
    }
}

.configuracoes__titulo[b-lj4av6ftc5] {
    margin: 0;
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
}

@media (min-width: 1024px) {
    .configuracoes__titulo[b-lj4av6ftc5] {
        font-size: var(--font-size-2xl);
    }
}

/* ---------- Card por seção (design system 5.3) ---------- */

.configuracoes__card[b-lj4av6ftc5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    background-color: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: var(--space-16);
}

.configuracoes__card-titulo[b-lj4av6ftc5] {
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

/* ---------- Campos (design system 5.2) ---------- */

.configuracoes__campo[b-lj4av6ftc5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.configuracoes__campo label[b-lj4av6ftc5] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
}

.configuracoes__input[b-lj4av6ftc5] {
    min-height: 44px;
    padding-inline: var(--space-12);
    border: 1px solid var(--border);
    border-radius: 8px;
    background-color: var(--bg);
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-base);
}

.configuracoes__input:focus[b-lj4av6ftc5] {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 2px var(--primary-subtle);
}

.configuracoes__input:disabled[b-lj4av6ftc5] {
    color: var(--text-muted);
    background-color: var(--bg-subtle);
    cursor: not-allowed;
}

.configuracoes__input--erro[b-lj4av6ftc5] {
    border-color: var(--danger);
}

.configuracoes__campo-erro[b-lj4av6ftc5],
.configuracoes__erro[b-lj4av6ftc5] {
    margin: 0;
    color: var(--danger);
    font-size: var(--font-size-xs);
}

.configuracoes__aviso[b-lj4av6ftc5] {
    margin: 0;
    padding: var(--space-8) var(--space-12);
    background-color: var(--bg);
    border: 1px solid var(--warning);
    border-radius: 8px;
    color: var(--warning);
    font-size: var(--font-size-sm);
}

/* ---------- Botões (design system 5.1) ---------- */

.configuracoes__botao-primario[b-lj4av6ftc5],
.configuracoes__botao-secundario[b-lj4av6ftc5] {
    align-self: flex-start;
    min-height: 44px;
    padding-inline: var(--space-16);
    border-radius: 8px;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
}

.configuracoes__botao-primario[b-lj4av6ftc5] {
    background-color: var(--primary);
    color: #FFFFFF;
    border: 1px solid var(--primary);
}

.configuracoes__botao-primario:disabled[b-lj4av6ftc5] {
    opacity: 0.4;
    cursor: default;
}

.configuracoes__botao-secundario[b-lj4av6ftc5] {
    background-color: transparent;
    color: var(--text);
    border: 1px solid var(--border);
}

.configuracoes__botao-secundario:disabled[b-lj4av6ftc5] {
    opacity: 0.4;
    cursor: default;
}

/* ---------- Horário de funcionamento (seção 5.2) ---------- */

.configuracoes__dias[b-lj4av6ftc5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    margin: 0;
    padding: 0;
    list-style: none;
}

.configuracoes__dia[b-lj4av6ftc5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    background-color: var(--bg);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: var(--space-12);
}

.configuracoes__dia-cabecalho[b-lj4av6ftc5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
}

.configuracoes__dia-nome[b-lj4av6ftc5] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
}

.configuracoes__toggle[b-lj4av6ftc5] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-8);
    font-size: var(--font-size-sm);
    color: var(--text);
    min-height: 44px;
    cursor: pointer;
}

.configuracoes__dia-horarios[b-lj4av6ftc5] {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    flex-wrap: wrap;
}

.configuracoes__dia-horarios .configuracoes__input[b-lj4av6ftc5] {
    width: auto;
    min-width: 110px;
}

/* ---------- Modo de cadastro (seção 5.3) ---------- */

.configuracoes__radios[b-lj4av6ftc5] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    margin: 0;
    padding: 0;
    border: none;
}

.configuracoes__radio-opcao[b-lj4av6ftc5] {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    min-height: 44px;
    font-size: var(--font-size-sm);
    cursor: pointer;
}

/* ---------- Domínio (seção 5.4) ---------- */

.configuracoes__dominio-atual[b-lj4av6ftc5] {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}
/* /Pages/Admin/Dashboard.razor.rz.scp.css */
/*
 * Dashboard do Owner (issue #16) — ver docs/knowledge-base/telas-admin/spec.md, seção 1.
 * CSS isolation do Blazor, mesmo padrão de Catalogo.razor.css.
 */

.dashboard[b-lxthm2htyu] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    padding-block: var(--space-24);
    width: 100%;
}

.dashboard__titulo[b-lxthm2htyu] {
    margin: 0;
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
}

@media (min-width: 1024px) {
    .dashboard[b-lxthm2htyu] {
        max-width: 1200px;
        margin-inline: auto;
    }

    .dashboard__titulo[b-lxthm2htyu] {
        font-size: var(--font-size-2xl);
    }
}

/* ---------- Filtro de período segmentado (seção 1.1, sempre no topo) ---------- */

.dashboard__filtro[b-lxthm2htyu] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-8);
}

.dashboard__segmento[b-lxthm2htyu] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--border);
    border-radius: 999px;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--text);
    cursor: pointer;
    user-select: none;
}

.dashboard__segmento input[type='radio'][b-lxthm2htyu] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.dashboard__segmento:has(input:checked)[b-lxthm2htyu] {
    background-color: var(--primary);
    border-color: var(--primary);
    color: #FFFFFF;
}

.dashboard__calendario-personalizado[b-lxthm2htyu] {
    max-width: 400px;
}

/* ---------- KPIs (seção 1.2: 2 colunas mobile, 4 colunas desktop) ---------- */

.dashboard__kpis[b-lxthm2htyu] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-16);
}

@media (min-width: 1024px) {
    .dashboard__kpis[b-lxthm2htyu] {
        grid-template-columns: repeat(4, 1fr);
    }
}

.dashboard__kpi[b-lxthm2htyu] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    background-color: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: var(--space-16);
}

.dashboard__kpi-numero[b-lxthm2htyu] {
    font-size: var(--font-size-2xl);
    font-weight: 700;
}

.dashboard__kpi-legenda[b-lxthm2htyu] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.dashboard__skeleton-kpi[b-lxthm2htyu] {
    height: 84px;
    border-radius: 12px;
    background-color: var(--border);
    animation: dashboard-skeleton-pulse-b-lxthm2htyu 1.2s ease-in-out infinite;
}

/* ---------- Estado vazio (seção 1.6) e erro ---------- */

.dashboard__vazio[b-lxthm2htyu] {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.dashboard__estado[b-lxthm2htyu] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-12);
    color: var(--text-muted);
    padding-block: var(--space-24);
}

.dashboard__botao-secundario[b-lxthm2htyu] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--border);
    border-radius: 8px;
    background-color: transparent;
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* ---------- Seções de lista (1.3 por barbeiro, 1.4 serviços) ---------- */

.dashboard__secoes[b-lxthm2htyu] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
}

.dashboard__secao[b-lxthm2htyu] {
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
    background-color: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: var(--space-16);
}

.dashboard__secao-titulo[b-lxthm2htyu] {
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

.dashboard__lista[b-lxthm2htyu] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    margin: 0;
    padding: 0;
    list-style: none;
}

.dashboard__lista-item[b-lxthm2htyu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
    padding-block: var(--space-8);
    border-bottom: 1px solid var(--border);
}

.dashboard__lista-item:last-child[b-lxthm2htyu] {
    border-bottom: none;
}

.dashboard__lista-nome[b-lxthm2htyu] {
    flex: 1;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
}

.dashboard__lista-contagem[b-lxthm2htyu] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

.dashboard__lista-valor[b-lxthm2htyu] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
}

.dashboard__lista-vazia[b-lxthm2htyu] {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

/* Desktop (spec de tela, seção 1.8): listas lado a lado em 2-3 colunas conforme espaço — 2 colunas
   cobre bem o caso comum de até 3 seções (por barbeiro pode não aparecer, seção 1.3). */
@media (min-width: 1024px) {
    .dashboard__secoes[b-lxthm2htyu] {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: var(--space-16);
    }
}

/* ---------- Horários de pico (seção 1.5): barra horizontal simples ---------- */

.dashboard__grafico-horarios[b-lxthm2htyu] {
    display: flex;
    align-items: flex-end;
    gap: var(--space-8);
    height: 120px;
}

.dashboard__barra-coluna[b-lxthm2htyu] {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-4);
    height: 100%;
}

.dashboard__barra[b-lxthm2htyu] {
    width: 100%;
    min-height: 2px;
    background-color: var(--primary);
    border-radius: 4px 4px 0 0;
}

.dashboard__barra-legenda[b-lxthm2htyu] {
    font-size: var(--font-size-xs);
    color: var(--text-muted);
}

/* ---------- Skeleton de lista (seção 1.7, design system 5.7) ---------- */

.dashboard__skeleton-lista[b-lxthm2htyu] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.dashboard__skeleton-item[b-lxthm2htyu] {
    height: 32px;
    border-radius: 8px;
    background-color: var(--border);
    animation: dashboard-skeleton-pulse-b-lxthm2htyu 1.2s ease-in-out infinite;
}

@keyframes dashboard-skeleton-pulse-b-lxthm2htyu {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}
/* /Pages/Admin/Servicos.razor.rz.scp.css */
/*
 * Serviços (Admin/Owner, issue #17) — ver docs/knowledge-base/telas-admin/spec.md, seção 2.
 * CSS isolation do Blazor, mesmo padrão de Dashboard.razor.css / FechamentoAgenda.razor.css.
 */

.servicos[b-mse9bqut0h] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    padding-block: var(--space-24);
    width: 100%;
}

@media (min-width: 1024px) {
    .servicos[b-mse9bqut0h] {
        max-width: 1200px;
        margin-inline: auto;
    }
}

.servicos__cabecalho[b-mse9bqut0h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-16);
    flex-wrap: wrap;
}

.servicos__titulo[b-mse9bqut0h] {
    margin: 0;
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
}

@media (min-width: 1024px) {
    .servicos__titulo[b-mse9bqut0h] {
        font-size: var(--font-size-2xl);
    }
}

.servicos__botao-primario[b-mse9bqut0h],
.servicos__botao-secundario[b-mse9bqut0h] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border-radius: 8px;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: 500;
    cursor: pointer;
}

.servicos__botao-primario[b-mse9bqut0h] {
    background: var(--primary);
    color: #FFFFFF;
    border: 1px solid var(--primary);
}

.servicos__botao-primario:disabled[b-mse9bqut0h] {
    opacity: 0.4;
    cursor: default;
}

.servicos__botao-secundario[b-mse9bqut0h] {
    background: transparent;
    color: var(--text);
    border: 1px solid var(--border);
}

/* ---------- Estado vazio (seção 2.4) e erro ---------- */

.servicos__vazio[b-mse9bqut0h],
.servicos__estado[b-mse9bqut0h] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-12);
    color: var(--text-muted);
    padding-block: var(--space-24);
}

/* ---------- Skeleton (design system, seção 5.7) ---------- */

.servicos__skeleton[b-mse9bqut0h] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.servicos__skeleton-item[b-mse9bqut0h] {
    height: 64px;
    border-radius: 12px;
    background-color: var(--border);
    animation: servicos-skeleton-pulse-b-mse9bqut0h 1.2s ease-in-out infinite;
}

@keyframes servicos-skeleton-pulse-b-mse9bqut0h {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* ---------- Lista (seção 2.1: card com nome, preço · duração, toggle, editar) ---------- */

.servicos__lista[b-mse9bqut0h] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    margin: 0;
    padding: 0;
    list-style: none;
}

.servicos__item[b-mse9bqut0h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-16);
    background-color: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: var(--space-16);
    flex-wrap: wrap;
}

.servicos__item-info[b-mse9bqut0h] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    /* Desktop (seção 2.5): mais largura disponível para não truncar a descrição/nome. */
    flex: 1;
    min-width: 200px;
}

.servicos__item-nome[b-mse9bqut0h] {
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-medium);
}

.servicos__item-detalhe[b-mse9bqut0h] {
    font-size: var(--font-size-sm);
    color: var(--text-muted);
}

.servicos__item-acoes[b-mse9bqut0h] {
    display: flex;
    align-items: center;
    gap: var(--space-12);
}

.servicos__toggle[b-mse9bqut0h] {
    display: inline-flex;
    align-items: center;
    gap: var(--space-8);
    font-size: var(--font-size-sm);
    color: var(--text);
    min-height: 44px;
    cursor: pointer;
}

.servicos__botao-editar[b-mse9bqut0h] {
    min-width: 44px;
    min-height: 44px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: transparent;
    color: var(--text);
    cursor: pointer;
    font-size: var(--font-size-md);
}

/* ---------- Modal/bottom sheet de criar/editar (seção 2.2, design system 5.4) ---------- */

.servicos__overlay[b-mse9bqut0h] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 40;
}

.servicos__modal[b-mse9bqut0h] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 90vh;
    overflow-y: auto;
    background: var(--bg);
    border-radius: 16px 16px 0 0;
    padding: var(--space-16);
    z-index: 41;
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
}

@media (min-width: 1024px) {
    .servicos__modal[b-mse9bqut0h] {
        left: 50%;
        right: auto;
        bottom: auto;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        max-width: 480px;
        max-height: 85vh;
        border-radius: 16px;
    }
}

.servicos__modal-cabecalho[b-mse9bqut0h] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.servicos__modal-titulo[b-mse9bqut0h] {
    font-size: var(--font-size-lg);
    font-weight: 600;
    margin: 0;
}

.servicos__fechar[b-mse9bqut0h] {
    background: none;
    border: none;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    color: var(--text-muted);
    min-width: 44px;
    min-height: 44px;
}

.servicos__campo[b-mse9bqut0h] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    border: none;
    padding: 0;
    margin: 0;
}

.servicos__campo legend[b-mse9bqut0h] {
    font-size: var(--font-size-sm);
    font-weight: 500;
    padding: 0;
}

.servicos__campo-linha[b-mse9bqut0h] {
    display: flex;
    gap: var(--space-16);
}

.servicos__campo-linha .servicos__campo[b-mse9bqut0h] {
    flex: 1;
}

.servicos__input[b-mse9bqut0h],
.servicos__textarea[b-mse9bqut0h] {
    min-height: 44px;
    padding-inline: var(--space-12);
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--bg);
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-base);
}

.servicos__textarea[b-mse9bqut0h] {
    min-height: 80px;
    padding-block: var(--space-8);
    resize: vertical;
}

.servicos__opcao-barbeiro[b-mse9bqut0h] {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    min-height: 44px;
    font-size: var(--font-size-sm);
}

.servicos__erro[b-mse9bqut0h] {
    color: var(--danger);
    font-size: var(--font-size-sm);
    margin: 0;
}

.servicos__rodape[b-mse9bqut0h] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-8);
}
/* /Pages/Admin/Tokens.razor.rz.scp.css */
/*
 * Tokens de Convite (Admin/Owner, issue #19) — ver docs/knowledge-base/telas-admin/spec.md, seção 4.
 * CSS isolation do Blazor, mesmo padrão de Barbeiros.razor.css/Servicos.razor.css.
 *
 * Responsividade (seção 4.6): o bottom sheet de compartilhamento (.tokens__modal--compartilhar) é o
 * elemento mais usado da tela — ocupa quase a tela inteira no mobile, com o código em destaque grande.
 */

.tokens[b-iwulwlztll] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    padding-block: var(--space-24);
    width: 100%;
}

@media (min-width: 1024px) {
    .tokens[b-iwulwlztll] {
        max-width: 720px;
        margin-inline: auto;
    }
}

.tokens__cabecalho[b-iwulwlztll] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-16);
    flex-wrap: wrap;
}

.tokens__titulo[b-iwulwlztll] {
    margin: 0;
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
}

@media (min-width: 1024px) {
    .tokens__titulo[b-iwulwlztll] {
        font-size: var(--font-size-2xl);
    }
}

.tokens__botao-primario[b-iwulwlztll],
.tokens__botao-secundario[b-iwulwlztll],
.tokens__botao-perigo[b-iwulwlztll] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border-radius: 8px;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

.tokens__botao-primario[b-iwulwlztll] {
    background: var(--primary);
    color: #FFFFFF;
    border: 1px solid var(--primary);
}

.tokens__botao-primario:disabled[b-iwulwlztll] {
    opacity: 0.4;
    cursor: default;
}

.tokens__botao-secundario[b-iwulwlztll] {
    background: transparent;
    color: var(--text);
    border: 1px solid var(--border);
}

.tokens__botao-perigo[b-iwulwlztll] {
    background: var(--danger);
    color: #FFFFFF;
    border: 1px solid var(--danger);
}

.tokens__botao-perigo:disabled[b-iwulwlztll] {
    opacity: 0.4;
    cursor: default;
}

/* ---------- Seletor de papel (seção 4.1, issue #56) ---------- */

.tokens__filtro-papel[b-iwulwlztll] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-8);
}

.tokens__segmento[b-iwulwlztll] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--border);
    border-radius: 999px;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--text);
    cursor: pointer;
    user-select: none;
}

.tokens__segmento input[type='radio'][b-iwulwlztll] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.tokens__segmento:has(input:checked)[b-iwulwlztll] {
    background-color: var(--primary);
    border-color: var(--primary);
    color: #FFFFFF;
}

/* ---------- Estado vazio (seção 4.5) ---------- */

.tokens__estado-vazio[b-iwulwlztll] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-16);
    color: var(--text-muted);
    padding-block: var(--space-24);
}

/* ---------- Estado de erro ---------- */

.tokens__estado[b-iwulwlztll] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-12);
    color: var(--text-muted);
    padding-block: var(--space-24);
}

/* ---------- Skeleton (design system, seção 5.7) ---------- */

.tokens__skeleton[b-iwulwlztll] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

.tokens__skeleton-item[b-iwulwlztll] {
    height: 56px;
    border-radius: 12px;
    background-color: var(--border);
    animation: tokens-skeleton-pulse-b-iwulwlztll 1.2s ease-in-out infinite;
}

@keyframes tokens-skeleton-pulse-b-iwulwlztll {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* ---------- Lista (seção 4.3: código + estado + Revogar só em Ativo) ---------- */

.tokens__lista[b-iwulwlztll] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    margin: 0;
    padding: 0;
    list-style: none;
}

.tokens__item[b-iwulwlztll] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-16);
    background-color: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: var(--space-16);
    flex-wrap: wrap;
}

.tokens__item-info[b-iwulwlztll] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    flex: 1;
    min-width: 200px;
}

.tokens__item-linha-topo[b-iwulwlztll] {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    flex-wrap: wrap;
}

.tokens__item-codigo[b-iwulwlztll] {
    font-size: var(--font-size-md, var(--font-size-base));
    font-weight: var(--font-weight-semibold);
    letter-spacing: 0.05em;
}

/* Badge de papel (seção 4.3, issue #56) */
.tokens__item-papel[b-iwulwlztll] {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
    color: var(--text-muted);
    background-color: var(--bg);
    border: 1px solid var(--border);
    border-radius: 999px;
    padding-inline: var(--space-8);
    line-height: 1.6;
}

.tokens__item-detalhe[b-iwulwlztll] {
    font-size: var(--font-size-sm);
}

.tokens__item-detalhe--ativo[b-iwulwlztll] {
    color: var(--success);
}

.tokens__item-detalhe--usado[b-iwulwlztll] {
    color: var(--text-muted);
}

.tokens__item-detalhe--expirado[b-iwulwlztll] {
    color: var(--text-muted);
}

.tokens__botao-revogar[b-iwulwlztll] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--border);
    border-radius: 8px;
    background: transparent;
    color: var(--danger);
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* ---------- Modal (confirmar revogação, design system 5.4) ---------- */

.tokens__overlay[b-iwulwlztll] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 40;
}

.tokens__modal[b-iwulwlztll] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 90vh;
    overflow-y: auto;
    background: var(--bg);
    border-radius: 16px 16px 0 0;
    padding: var(--space-16);
    z-index: 41;
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
}

@media (min-width: 1024px) {
    .tokens__modal[b-iwulwlztll] {
        left: 50%;
        right: auto;
        bottom: auto;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        max-width: 480px;
        max-height: 85vh;
        border-radius: 16px;
    }
}

/* Compartilhamento (seção 4.2/4.6) — mais alto que o modal de confirmação padrão no mobile,
   priorizando aparecer quase em tela cheia com o código em destaque. */
.tokens__modal--compartilhar[b-iwulwlztll] {
    min-height: 60vh;
    justify-content: center;
    align-items: center;
    text-align: center;
}

@media (min-width: 1024px) {
    .tokens__modal--compartilhar[b-iwulwlztll] {
        min-height: auto;
    }
}

.tokens__modal-cabecalho[b-iwulwlztll] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.tokens__modal-titulo[b-iwulwlztll] {
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

.tokens__modal-fechar[b-iwulwlztll] {
    min-width: 44px;
    min-height: 44px;
    border: none;
    background: none;
    font-size: 20px;
    line-height: 1;
    color: var(--text-muted);
    cursor: pointer;
}

.tokens__modal-resumo[b-iwulwlztll] {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.tokens__modal-rodape[b-iwulwlztll] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-8);
}

.tokens__erro[b-iwulwlztll] {
    margin: 0;
    color: var(--danger);
    font-size: var(--font-size-sm);
}

/* ---------- Código em destaque (seção 4.2) ---------- */

.tokens__codigo-destaque[b-iwulwlztll] {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-bold);
    letter-spacing: 0.08em;
    color: var(--primary);
}

.tokens__codigo-legenda[b-iwulwlztll] {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.tokens__modal-acoes[b-iwulwlztll] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    width: 100%;
}

.tokens__botao-whatsapp[b-iwulwlztll] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding-inline: var(--space-16);
    border-radius: 8px;
    background: var(--success);
    color: #FFFFFF;
    text-decoration: none;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
}
/* /Pages/AssinaturaSuspensa.razor.rz.scp.css */
.assinatura-suspensa[b-d3shiblsqs] {
    display: grid;
    gap: 1.25rem;
    justify-items: start;
    width: min(100%, 560px);
    --marca-tamanho: 1.9rem;
}

.assinatura-suspensa__titulo[b-d3shiblsqs] {
    max-width: 10ch;
    font-size: clamp(3rem, 10vw, 5rem);
}

.assinatura-suspensa__nota[b-d3shiblsqs] {
    margin: 0;
    padding: 0.85rem 1rem;
    border: 1px solid rgba(255, 194, 75, 0.5);
    border-radius: 12px;
    background: rgba(255, 194, 75, 0.09);
    color: var(--cf-warn);
    font-weight: 600;
}

.assinatura-suspensa__acao[b-d3shiblsqs] {
    margin-top: 0.5rem;
}
/* /Pages/Cliente/Agendamentos.razor.rz.scp.css */
/*
 * Meus Agendamentos (issue #14) — ver docs/knowledge-base/telas-cliente/spec.md, seção 4.
 * CSS isolation do Blazor, mesmo padrão de Catalogo.razor.css / FechamentoAgenda.razor.css.
 *
 * Responsividade (seção 4.5): mesma lista vertical de cards em mobile e desktop — desktop só ganha
 * mais respiro horizontal (largura máxima ~600px), não vira grade (é cronológica, não um catálogo).
 */

.agendamentos[b-0ipr5isolv] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    padding-block: var(--space-24);
    width: 100%;
}

.agendamentos__titulo[b-0ipr5isolv] {
    margin: 0;
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
}

@media (min-width: 1024px) {
    .agendamentos[b-0ipr5isolv] {
        max-width: 600px;
        margin-inline: auto;
    }

    .agendamentos__titulo[b-0ipr5isolv] {
        font-size: var(--font-size-2xl);
    }
}

/* ---------- Abas (seção 4.1) ---------- */

.agendamentos__abas[b-0ipr5isolv] {
    display: flex;
    gap: var(--space-8);
    border-bottom: 1px solid var(--border);
}

.agendamentos__aba[b-0ipr5isolv] {
    min-height: 44px;
    padding-inline: var(--space-12);
    border: none;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: var(--text-muted);
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

.agendamentos__aba--ativa[b-0ipr5isolv] {
    color: var(--primary);
    border-bottom-color: var(--primary);
}

/* ---------- Lista / card (design system 5.3) ---------- */

.agendamentos__lista[b-0ipr5isolv] {
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
}

.agendamentos__card[b-0ipr5isolv] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-8);
    background-color: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: var(--space-16);
}

.agendamentos__card-servico[b-0ipr5isolv] {
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

.agendamentos__card-detalhe[b-0ipr5isolv] {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.agendamentos__botao-cancelar[b-0ipr5isolv] {
    min-height: 44px;
    margin-top: var(--space-8);
    padding-inline: var(--space-16);
    border: 1px solid var(--border);
    border-radius: 8px;
    background-color: transparent;
    color: var(--danger);
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* ---------- Badge de status (design system 5.6) ---------- */

.agendamentos__badge[b-0ipr5isolv] {
    display: inline-flex;
    align-items: center;
    padding: var(--space-4) var(--space-12);
    border-radius: 999px;
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
}

.agendamentos__badge--agendado[b-0ipr5isolv] {
    background-color: var(--primary-subtle);
    color: var(--primary);
}

.agendamentos__badge--concluido[b-0ipr5isolv] {
    background-color: var(--primary-subtle);
    color: var(--success);
}

.agendamentos__badge--cancelado[b-0ipr5isolv] {
    background-color: var(--primary-subtle);
    color: var(--danger);
}

/* ---------- Estado vazio / erro (seção 4.3, design system 5.8) ---------- */

.agendamentos__estado[b-0ipr5isolv] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-12);
    color: var(--text-muted);
    padding-block: var(--space-24);
}

.agendamentos__botao-primario[b-0ipr5isolv] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--primary);
    border-radius: 8px;
    background-color: var(--primary);
    color: #FFFFFF;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

.agendamentos__botao-secundario[b-0ipr5isolv] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--border);
    border-radius: 8px;
    background-color: transparent;
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

.agendamentos__botao-perigo[b-0ipr5isolv] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--danger);
    border-radius: 8px;
    background-color: var(--danger);
    color: #FFFFFF;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

.agendamentos__botao-perigo:disabled[b-0ipr5isolv] {
    opacity: 0.4;
    cursor: default;
}

/* ---------- Skeleton (seção 4.4, design system 5.7) — 3 cards ---------- */

.agendamentos__skeleton-card[b-0ipr5isolv] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    background-color: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: var(--space-16);
}

.agendamentos__skeleton-bloco[b-0ipr5isolv] {
    background-color: var(--border);
    border-radius: 8px;
    animation: agendamentos-skeleton-pulse-b-0ipr5isolv 1.2s ease-in-out infinite;
}

.agendamentos__skeleton-bloco--badge[b-0ipr5isolv] {
    width: 80px;
    height: 20px;
    border-radius: 999px;
}

.agendamentos__skeleton-bloco--titulo[b-0ipr5isolv] {
    width: 60%;
    height: 20px;
}

.agendamentos__skeleton-bloco--texto[b-0ipr5isolv] {
    width: 80%;
    height: 14px;
}

@keyframes agendamentos-skeleton-pulse-b-0ipr5isolv {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* ---------- Modal de confirmação de cancelamento (seção 4.2, design system 5.4) ---------- */

.agendamentos__overlay[b-0ipr5isolv] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    z-index: 40;
}

.agendamentos__modal[b-0ipr5isolv] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 90vh;
    overflow-y: auto;
    background: var(--bg);
    border-radius: 16px 16px 0 0;
    padding: var(--space-16);
    z-index: 41;
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
}

@media (min-width: 1024px) {
    .agendamentos__modal[b-0ipr5isolv] {
        left: 50%;
        right: auto;
        bottom: auto;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        max-width: 480px;
        max-height: 85vh;
        border-radius: 16px;
    }
}

.agendamentos__modal-cabecalho[b-0ipr5isolv] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.agendamentos__modal-titulo[b-0ipr5isolv] {
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

.agendamentos__modal-fechar[b-0ipr5isolv] {
    min-width: 44px;
    min-height: 44px;
    border: none;
    background: none;
    font-size: 20px;
    line-height: 1;
    color: var(--text-muted);
    cursor: pointer;
}

.agendamentos__modal-resumo[b-0ipr5isolv] {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.agendamentos__modal-rodape[b-0ipr5isolv] {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-8);
}

.agendamentos__erro[b-0ipr5isolv] {
    margin: 0;
    color: var(--danger);
    font-size: var(--font-size-sm);
}
/* /Pages/Cliente/Catalogo.razor.rz.scp.css */
/*
 * Catálogo (issue #12) — ver docs/knowledge-base/telas-cliente/spec.md, seção 2.
 * CSS isolation do Blazor, mesmo padrão de Inicio.razor.css.
 *
 * Grade de cards (seção 2.1, explícito na spec de tela — difere do grid genérico "3-4 colunas
 * desktop" de design-system/spec.md seção 3, que é o default para outras telas de card, ex.
 * dashboard KPI): 1 coluna mobile, 2 colunas tablet/desktop.
 */

.catalogo[b-mpkkaginbm] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    padding-block: var(--space-24);
    width: 100%;
}

.catalogo__titulo[b-mpkkaginbm] {
    margin: 0;
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
}

@media (min-width: 1024px) {
    .catalogo[b-mpkkaginbm] {
        max-width: 1200px;
        margin-inline: auto;
    }

    .catalogo__titulo[b-mpkkaginbm] {
        font-size: var(--font-size-2xl);
    }
}

/* ---------- Grade (seção 2.1: 1 coluna mobile, 2 colunas tablet/desktop) ---------- */

.catalogo__grade[b-mpkkaginbm] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-16);
}

@media (min-width: 640px) {
    .catalogo__grade[b-mpkkaginbm] {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ---------- Card (design system 5.3) ---------- */

.catalogo__card[b-mpkkaginbm] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-8);
    background-color: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: var(--space-16);
}

.catalogo__card-titulo[b-mpkkaginbm] {
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

.catalogo__card-descricao[b-mpkkaginbm] {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.catalogo__card-preco[b-mpkkaginbm] {
    margin: 0;
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-medium);
}

/* Legenda de restrição de barbeiro (seção 2.2, "Só com [Nome]"). */
.catalogo__card-legenda[b-mpkkaginbm] {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-size-xs);
}

.catalogo__card-botao[b-mpkkaginbm] {
    min-height: 44px;
    min-width: 44px;
    width: 100%;
    margin-top: var(--space-8);
    padding-inline: var(--space-16);
    border: 1px solid var(--primary);
    border-radius: 8px;
    background-color: var(--primary);
    color: #FFFFFF;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* ---------- Estado vazio / erro (seção 2.3, design system 5.8) ---------- */

.catalogo__estado[b-mpkkaginbm] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-12);
    color: var(--text-muted);
    padding-block: var(--space-24);
}

.catalogo__botao-secundario[b-mpkkaginbm] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--border);
    border-radius: 8px;
    background-color: transparent;
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* ---------- Skeleton (seção 2.4, design system 5.7) — 4 cards, mesma grade do conteúdo real ---------- */

.catalogo__skeleton-card[b-mpkkaginbm] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    background-color: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: var(--space-16);
}

.catalogo__skeleton-bloco[b-mpkkaginbm] {
    background-color: var(--border);
    border-radius: 8px;
    animation: catalogo-skeleton-pulse-b-mpkkaginbm 1.2s ease-in-out infinite;
}

.catalogo__skeleton-bloco--titulo[b-mpkkaginbm] {
    width: 60%;
    height: 20px;
}

.catalogo__skeleton-bloco--texto[b-mpkkaginbm] {
    width: 100%;
    height: 14px;
}

.catalogo__skeleton-bloco--texto-curto[b-mpkkaginbm] {
    width: 40%;
    height: 14px;
}

.catalogo__skeleton-bloco--botao[b-mpkkaginbm] {
    width: 100%;
    height: 44px;
    margin-top: var(--space-8);
}

@keyframes catalogo-skeleton-pulse-b-mpkkaginbm {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}
/* /Pages/Cliente/Inicio.razor.rz.scp.css */
/*
 * Home do Cliente (issue #11) — ver docs/knowledge-base/telas-cliente/spec.md, seção 1.
 * CSS isolation do Blazor, mesmo padrão de Splash.razor.css / Calendario.razor.css.
 *
 * Responsividade (seção 1.4):
 *   Mobile (< 640px, breakpoint de design-system/breakpoints.css): tudo empilhado, botão primário
 *   fixo perto do rodapé (acima da nav inferior fixa do shell, issue #9 — .shell__content já reserva
 *   56px + var(--space-16) de padding-bottom para ela).
 *   Desktop (>= 1024px): hero centralizado, largura máxima ~600px, botão primário no fluxo normal
 *   (a nav inferior não existe em desktop, ver shell.css).
 */

.home[b-j92c00n6y6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-24);
    padding-block: var(--space-24);
    width: 100%;
}

@media (min-width: 1024px) {
    .home[b-j92c00n6y6] {
        max-width: 600px;
        margin-inline: auto;
        text-align: center;
    }
}

/* ---------- Hero (seção 1.1) ---------- */

.home__hero[b-j92c00n6y6] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-8);
}

@media (min-width: 1024px) {
    .home__hero[b-j92c00n6y6] {
        align-items: center;
    }
}

.home__nome[b-j92c00n6y6] {
    margin: 0;
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
}

@media (min-width: 1024px) {
    .home__nome[b-j92c00n6y6] {
        font-size: var(--font-size-2xl);
    }
}

/* Badge de status dinâmico (seção 1.2, design system 5.6): pílula, sem cor de alarme quando fechado —
   fechado não é um erro. */
.home__badge[b-j92c00n6y6] {
    display: inline-flex;
    align-items: center;
    padding: var(--space-4) var(--space-12);
    border: 1px solid var(--border);
    border-radius: 999px;
    background-color: var(--bg-subtle);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-medium);
}

.home__badge--aberto[b-j92c00n6y6] {
    color: var(--success);
}

.home__badge--fechado[b-j92c00n6y6] {
    color: var(--text-muted);
}

.home__horario-hoje[b-j92c00n6y6] {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

/* ---------- Contato (seção 1.1) ---------- */

.home__contato[b-j92c00n6y6] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    align-items: flex-start;
}

@media (min-width: 1024px) {
    .home__contato[b-j92c00n6y6] {
        align-items: center;
    }
}

.home__contato-item[b-j92c00n6y6] {
    color: var(--primary);
    font-size: var(--font-size-sm);
    text-decoration: none;
}

.home__contato-item:hover[b-j92c00n6y6] {
    text-decoration: underline;
}

/* ---------- Ação primária (design system, princípio 1: uma ação óbvia por tela) ---------- */

.home__acoes[b-j92c00n6y6] {
    margin-top: auto;
}

.home__botao-primario[b-j92c00n6y6] {
    display: block;
    width: 100%;
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--primary);
    border-radius: 8px;
    background-color: var(--primary);
    color: #FFFFFF;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* mobile: fixo perto do rodapé, acima da nav inferior (56px + espaçamento, ver shell.css). */
@media (max-width: 639px) {
    .home__acoes[b-j92c00n6y6] {
        position: sticky;
        bottom: calc(56px + var(--space-16));
        padding-top: var(--space-8);
    }
}

@media (min-width: 1024px) {
    .home__acoes[b-j92c00n6y6] {
        max-width: 320px;
        margin-inline: auto;
    }
}

/* ---------- Skeleton (seção 1.3, design system 5.7) ---------- */

.home-skeleton[b-j92c00n6y6] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-12);
    padding-block: var(--space-24);
}

@media (min-width: 1024px) {
    .home-skeleton[b-j92c00n6y6] {
        max-width: 600px;
        margin-inline: auto;
        align-items: center;
    }
}

.home-skeleton__block[b-j92c00n6y6] {
    background-color: var(--bg-subtle);
    border-radius: 8px;
    animation: home-skeleton-pulse-b-j92c00n6y6 1.2s ease-in-out infinite;
}

.home-skeleton__block--title[b-j92c00n6y6] {
    width: 220px;
    height: 28px;
}

.home-skeleton__block--badge[b-j92c00n6y6] {
    width: 120px;
    height: 22px;
    border-radius: 999px;
}

.home-skeleton__block--subtitle[b-j92c00n6y6] {
    width: 160px;
    height: 16px;
}

.home-skeleton__block--button[b-j92c00n6y6] {
    width: 100%;
    max-width: 320px;
    height: 44px;
    border-radius: 8px;
    margin-top: var(--space-12);
}

@keyframes home-skeleton-pulse-b-j92c00n6y6 {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}
/* /Pages/Cliente/NovoAgendamento.razor.rz.scp.css */
/*
 * Novo Agendamento (issue #13) — ver docs/knowledge-base/telas-cliente/spec.md, seção 3.5.
 * Mobile: passos empilhados, cada um ocupando a largura toda. Desktop: Data + Horário lado a lado.
 */

.novo-agendamento[b-7grsxnis0z] {
    display: flex;
    flex-direction: column;
    gap: var(--space-24);
    padding-block: var(--space-24);
    width: 100%;
}

.novo-agendamento__titulo[b-7grsxnis0z] {
    margin: 0;
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
}

.novo-agendamento__carregando[b-7grsxnis0z] {
    color: var(--text-muted);
    padding-block: var(--space-24);
}

@media (min-width: 1024px) {
    .novo-agendamento[b-7grsxnis0z] {
        max-width: 1200px;
        margin-inline: auto;
    }

    .novo-agendamento__titulo[b-7grsxnis0z] {
        font-size: var(--font-size-2xl);
    }
}

.novo-agendamento__passo[b-7grsxnis0z] {
    display: flex;
    flex-direction: column;
    gap: var(--space-12);
    padding: var(--space-16);
    background-color: var(--bg-subtle);
    border: 1px solid var(--border);
    border-radius: 12px;
}

.novo-agendamento__passo-titulo[b-7grsxnis0z] {
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

/* ---------- Resumo de passo concluído + link "Trocar" (seção 3.2) ---------- */

.novo-agendamento__resumo[b-7grsxnis0z] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-12);
    font-weight: var(--font-weight-medium);
}

.novo-agendamento__trocar[b-7grsxnis0z] {
    min-height: 44px;
    padding-inline: var(--space-8);
    border: none;
    background: transparent;
    color: var(--primary);
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* ---------- Chips (Serviço/Barbeiro) ---------- */

.novo-agendamento__chips[b-7grsxnis0z] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-8);
}

.novo-agendamento__chip[b-7grsxnis0z] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--border);
    border-radius: 999px;
    background-color: var(--bg);
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

.novo-agendamento__chip:hover[b-7grsxnis0z] {
    border-color: var(--primary);
}

.novo-agendamento__chip-skeleton[b-7grsxnis0z] {
    width: 120px;
    height: 44px;
    border-radius: 999px;
    background-color: var(--border);
    animation: novo-agendamento-skeleton-pulse-b-7grsxnis0z 1.2s ease-in-out infinite;
}

@keyframes novo-agendamento-skeleton-pulse-b-7grsxnis0z {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* ---------- Estado vazio/erro (design system 5.7/5.8) ---------- */

.novo-agendamento__estado[b-7grsxnis0z] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-8);
    color: var(--text-muted);
}

.novo-agendamento__botao-secundario[b-7grsxnis0z] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--border);
    border-radius: 8px;
    background-color: transparent;
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

.novo-agendamento__erro-concorrencia[b-7grsxnis0z] {
    margin: 0;
    padding: var(--space-12);
    border-radius: 8px;
    background-color: var(--danger);
    color: #FFFFFF;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
}

/* ---------- Data + Horário lado a lado no desktop (seção 3.5) ---------- */

.novo-agendamento__data-horario[b-7grsxnis0z] {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-16);
}

@media (min-width: 1024px) {
    .novo-agendamento__data-horario[b-7grsxnis0z] {
        grid-template-columns: 1fr 1fr;
        align-items: start;
    }
}

.novo-agendamento__painel[b-7grsxnis0z] {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}

/* ---------- Confirmação (resumo em lista de definição) ---------- */

.novo-agendamento__resumo-lista[b-7grsxnis0z] {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--space-4) var(--space-16);
    margin: 0;
}

.novo-agendamento__resumo-lista dt[b-7grsxnis0z] {
    color: var(--text-muted);
    font-size: var(--font-size-sm);
}

.novo-agendamento__resumo-lista dd[b-7grsxnis0z] {
    margin: 0;
    font-weight: var(--font-weight-medium);
}

.novo-agendamento__botao-primario[b-7grsxnis0z] {
    min-height: 44px;
    min-width: 44px;
    align-self: stretch;
    margin-top: var(--space-8);
    padding-inline: var(--space-16);
    border: 1px solid var(--primary);
    border-radius: 8px;
    background-color: var(--primary);
    color: #FFFFFF;
    font-family: inherit;
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

.novo-agendamento__botao-primario:disabled[b-7grsxnis0z] {
    opacity: 0.4;
    cursor: default;
}

@media (min-width: 640px) {
    .novo-agendamento__botao-primario[b-7grsxnis0z] {
        align-self: flex-start;
        min-width: 220px;
    }
}
/* /Pages/Cliente/Perfil.razor.rz.scp.css */
/*
 * Perfil (issue #15) — ver docs/knowledge-base/telas-cliente/spec.md, seção 5.
 * CSS isolation do Blazor, mesmo padrão de Agendamentos.razor.css / Catalogo.razor.css.
 */

.perfil[b-s2okvujc14] {
    display: flex;
    flex-direction: column;
    gap: var(--space-24);
    padding-block: var(--space-24);
    width: 100%;
}

.perfil__titulo[b-s2okvujc14] {
    margin: 0;
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-semibold);
}

@media (min-width: 1024px) {
    .perfil[b-s2okvujc14] {
        max-width: 480px;
        margin-inline: auto;
    }

    .perfil__titulo[b-s2okvujc14] {
        font-size: var(--font-size-2xl);
    }
}

/* ---------- Formulário (seção 5.1, design system 5.2) ---------- */

.perfil__form[b-s2okvujc14] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
}

.perfil__campo[b-s2okvujc14] {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.perfil__campo label[b-s2okvujc14] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
}

.perfil__input[b-s2okvujc14] {
    min-height: 44px;
    padding-inline: var(--space-12);
    border: 1px solid var(--border);
    border-radius: 8px;
    background-color: var(--bg);
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-base);
}

.perfil__input:focus[b-s2okvujc14] {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 2px var(--primary-subtle);
}

.perfil__input:disabled[b-s2okvujc14] {
    color: var(--text-muted);
    background-color: var(--bg-subtle);
    cursor: not-allowed;
}

.perfil__input--erro[b-s2okvujc14] {
    border-color: var(--danger);
}

.perfil__campo-erro[b-s2okvujc14] {
    margin: 0;
    color: var(--danger);
    font-size: var(--font-size-xs);
}

/* ---------- Botões (design system 5.1) ---------- */

.perfil__botao-primario[b-s2okvujc14] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--primary);
    border-radius: 8px;
    background-color: var(--primary);
    color: #FFFFFF;
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

.perfil__botao-primario:disabled[b-s2okvujc14] {
    opacity: 0.4;
    cursor: default;
}

.perfil__botao-secundario[b-s2okvujc14] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--border);
    border-radius: 8px;
    background-color: transparent;
    color: var(--text);
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

.perfil__botao-secundario:disabled[b-s2okvujc14] {
    opacity: 0.4;
    cursor: default;
}

.perfil__botao-perigo[b-s2okvujc14] {
    min-height: 44px;
    padding-inline: var(--space-16);
    border: 1px solid var(--danger);
    border-radius: 8px;
    background-color: transparent;
    color: var(--danger);
    font-family: inherit;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
}

/* ---------- Ações (seção 5.1/5.2/5.3) ---------- */

.perfil__acoes[b-s2okvujc14] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
    padding-top: var(--space-16);
    border-top: 1px solid var(--border);
}

.perfil__acoes-titulo[b-s2okvujc14] {
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
}

.perfil__acao[b-s2okvujc14] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-8);
}

.perfil__acao-rotulo[b-s2okvujc14] {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
}

.perfil__acao-nota[b-s2okvujc14] {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-size-xs);
}

/* ---------- Skeleton (design system 5.7) ---------- */

.perfil__skeleton[b-s2okvujc14] {
    display: flex;
    flex-direction: column;
    gap: var(--space-16);
}

.perfil__skeleton-bloco[b-s2okvujc14] {
    height: 44px;
    background-color: var(--border);
    border-radius: 8px;
    animation: perfil-skeleton-pulse-b-s2okvujc14 1.2s ease-in-out infinite;
}

@keyframes perfil-skeleton-pulse-b-s2okvujc14 {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* ---------- Estado de erro (design system 5.8) ---------- */

.perfil__estado[b-s2okvujc14] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-12);
    color: var(--text-muted);
    padding-block: var(--space-24);
}
/* /Pages/NotFound.razor.rz.scp.css */
.nao-encontrado[b-9do3s0lh7f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-8);
    padding: var(--space-48) var(--container-padding);
    text-align: center;
}

.nao-encontrado__poste[b-9do3s0lh7f] {
    width: 72px;
    height: auto;
    margin-bottom: var(--space-8);
}

.nao-encontrado__vidro[b-9do3s0lh7f] {
    fill: var(--bg-subtle);
    stroke: var(--border);
    stroke-width: 2;
}

.nao-encontrado__listra[b-9do3s0lh7f] {
    fill: none;
    stroke: var(--primary);
    stroke-width: 7;
    stroke-linecap: round;
}

.nao-encontrado__tampa[b-9do3s0lh7f] {
    fill: var(--text-muted);
}

.nao-encontrado__texto[b-9do3s0lh7f] {
    margin: 0;
    color: var(--text-muted);
}

.nao-encontrado__voltar[b-9do3s0lh7f] {
    margin-top: var(--space-12);
    padding: var(--space-12) var(--space-24);
    border-radius: 8px;
    background-color: var(--primary);
    color: #FFFFFF;
    font-weight: var(--font-weight-medium);
    text-decoration: none;
}
/* /Pages/Plataforma/Landing.razor.rz.scp.css */
/*
 * Landing da plataforma. Tokens e primitivas (botões, poste, aurora) vêm de wwwroot/css/plataforma.css;
 * cada seção-componente tem o próprio CSS em Components/Plataforma. Aqui: composição da página e formulário.
 * As classes .landing__* do formulário são as mesmas de antes (os testes dependem delas).
 */

.pagina[b-gob0c1jb20] {
    overflow-x: clip;
}

.secao__titulo[b-gob0c1jb20] {
    max-width: 16ch;
    margin-bottom: clamp(2rem, 5vw, 4rem);
}

/* ---------- Hero ---------- */

.hero[b-gob0c1jb20] {
    position: relative;
    padding-top: clamp(112px, 14vw, 168px);
    padding-bottom: clamp(56px, 8vw, 112px);
    overflow: hidden;
}

.hero__grade[b-gob0c1jb20] {
    position: relative;
    z-index: 1;
    display: grid;
    gap: clamp(2.5rem, 6vw, 4rem);
    align-items: center;
}

@media (min-width: 1000px) {
    .hero__grade[b-gob0c1jb20] {
        grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    }
}

.hero__texto[b-gob0c1jb20] {
    display: grid;
    gap: clamp(1.25rem, 3vw, 1.75rem);
    justify-items: start;
}

/* Uma única sequência de entrada: as duas linhas do título sobem de uma máscara, o resto acompanha. */
.hero__titulo[b-gob0c1jb20] {
    display: grid;
    /* Menor que o display padrão: título, subtítulo e CTA precisam caber juntos acima da dobra. */
    font-size: clamp(3rem, 7vw, 6rem);
}

.hero__linha[b-gob0c1jb20] {
    display: block;
    overflow: hidden;
    padding-bottom: 0.08em;
}

.hero__linha > span[b-gob0c1jb20] {
    display: block;
    animation: hero-sobe-b-gob0c1jb20 1.1s var(--cf-ease) backwards;
}

.hero__linha:nth-child(2) > span[b-gob0c1jb20] {
    animation-delay: 0.14s;
}

.hero__lead[b-gob0c1jb20],
.hero__acoes[b-gob0c1jb20],
.hero__garantias[b-gob0c1jb20] {
    animation: hero-entra-b-gob0c1jb20 0.9s var(--cf-ease) backwards;
}

.hero__lead[b-gob0c1jb20] { animation-delay: 0.45s; }
.hero__acoes[b-gob0c1jb20] { animation-delay: 0.6s; }
.hero__garantias[b-gob0c1jb20] { animation-delay: 0.75s; }

.hero__cena[b-gob0c1jb20] {
    animation: hero-cena-b-gob0c1jb20 1.3s var(--cf-ease) 0.35s backwards;
}

@keyframes hero-sobe-b-gob0c1jb20 {
    from { transform: translateY(105%); }
}

@keyframes hero-entra-b-gob0c1jb20 {
    from { opacity: 0; transform: translateY(16px); }
}

@keyframes hero-cena-b-gob0c1jb20 {
    from { opacity: 0; transform: translateY(40px) scale(0.96); }
}

.hero__acoes[b-gob0c1jb20] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

/* No celular os dois botões ocupam a linha toda: alvo grande, na zona do polegar. */
@media (max-width: 519px) {
    .hero__acoes[b-gob0c1jb20] {
        width: 100%;
    }

    .hero__acoes .cf-btn[b-gob0c1jb20] {
        flex: 1 1 100%;
    }
}

.hero__garantias[b-gob0c1jb20] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
    color: var(--cf-fg-muted);
    font-size: 0.9375rem;
    font-weight: 600;
}

.hero__garantias li[b-gob0c1jb20] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.hero__garantias li[b-gob0c1jb20]::before {
    content: '';
    width: 1.05rem;
    height: 1.05rem;
    background: var(--cf-ok);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='10'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 0a10 10 0 100 20 10 10 0 000-20zm4.6 7.4l-5.5 6a1 1 0 01-1.5.05L5.3 11a1 1 0 011.4-1.4l1.6 1.6 4.8-5.2a1 1 0 011.5 1.4z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ---------- Demonstração ---------- */

.demo-secao[b-gob0c1jb20] {
    position: relative;
    background: var(--cf-ink-2);
    overflow: hidden;
}

.demo-secao__miolo[b-gob0c1jb20] {
    position: relative;
    z-index: 1;
}

.demo-secao__brilho[b-gob0c1jb20] {
    opacity: 0.7;
}

/* ---------- Preço ---------- */

.preco__grade[b-gob0c1jb20] {
    display: grid;
    gap: clamp(2.5rem, 6vw, 4rem);
    align-items: center;
    justify-items: center;
}

.preco__texto[b-gob0c1jb20] {
    display: grid;
    gap: 1.25rem;
    justify-items: start;
    width: 100%;
}

@media (min-width: 960px) {
    .preco__grade[b-gob0c1jb20] {
        grid-template-columns: 1fr minmax(380px, 480px);
    }
}

/* ---------- Contratar ---------- */

.contratar[b-gob0c1jb20] {
    position: relative;
    overflow: hidden;
    background: var(--cf-ink-2);
}

.contratar__brilho[b-gob0c1jb20] {
    opacity: 0.55;
}

.contratar__grade[b-gob0c1jb20] {
    position: relative;
    z-index: 1;
    display: grid;
    gap: clamp(2.5rem, 6vw, 4.5rem);
    align-items: start;
}

@media (min-width: 1000px) {
    .contratar__grade[b-gob0c1jb20] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 540px);
    }

    .contratar__lado[b-gob0c1jb20] {
        position: sticky;
        top: 108px;
    }
}

.contratar__lado[b-gob0c1jb20] {
    display: grid;
    gap: 1.5rem;
    justify-items: start;
}

/* ---------- Perguntas ---------- */

.perguntas__grade[b-gob0c1jb20] {
    display: grid;
    gap: clamp(2rem, 5vw, 3.5rem);
}

@media (min-width: 960px) {
    .perguntas__grade[b-gob0c1jb20] {
        grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
        align-items: start;
    }

    .perguntas__grade > h2[b-gob0c1jb20] {
        position: sticky;
        top: 108px;
    }
}

/* ---------- Chamada final ---------- */

.final[b-gob0c1jb20] {
    position: relative;
    padding-block: clamp(72px, 11vw, 140px);
    background: var(--cf-blue);
    color: #fff;
    overflow: hidden;
}

.final__fita[b-gob0c1jb20] {
    position: absolute;
    inset: 0 0 auto 0;
    height: 8px;
}

.final__miolo[b-gob0c1jb20] {
    display: grid;
    gap: 1.75rem;
    justify-items: start;
}

.final__miolo[b-gob0c1jb20] {
    position: relative;
    z-index: 1;
}

.final__miolo h2[b-gob0c1jb20] {
    max-width: 18ch;
    font-size: clamp(3rem, 8vw, 6.5rem);
}

/* Poste de barbeiro sangrando pela lateral — o mesmo motivo das telas de entrada. */
.final__poste[b-gob0c1jb20] {
    position: absolute;
    top: -40px;
    bottom: -40px;
    right: clamp(16px, 9vw, 160px);
    width: clamp(28px, 5vw, 64px);
    border-radius: 999px;
    border: 3px solid rgba(255, 255, 255, 0.85);
    overflow: hidden;
    box-shadow: 0 0 80px rgba(10, 16, 36, 0.45);
    pointer-events: none;
}

.final__poste .cf-pole[b-gob0c1jb20] {
    height: 100%;
}

@media (max-width: 639px) {
    .final__poste[b-gob0c1jb20] {
        opacity: 0.35;
    }
}

.final__nota[b-gob0c1jb20] {
    margin: 0;
    font-weight: 600;
    opacity: 0.9;
}
/* /Pages/Plataforma/MinhaAssinatura.razor.rz.scp.css */
/*
 * Portal "Minha Assinatura". Botões vêm do design system da plataforma (.cf-btn); as classes .portal__*
 * são as mesmas de antes (hooks de teste e semântica). Cada barbearia é uma "comanda": faixa lateral
 * com o poste na cor do estado da assinatura (verde = ativa, âmbar = atraso, vermelho = bloqueada).
 */

.portal[b-vbqygwz5zg] {
    width: 100%;
    align-self: start;
}

.portal__conteudo[b-vbqygwz5zg] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    width: 100%;
    max-width: 760px;
    margin-inline: auto;
}

.portal__topo[b-vbqygwz5zg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.portal__marca[b-vbqygwz5zg] {
    display: inline-flex;
    text-decoration: none;
    --marca-tamanho: 1.7rem;
}

.portal__titulo[b-vbqygwz5zg] {
    max-width: 12ch;
    margin-bottom: 0.5rem;
}

.portal__texto[b-vbqygwz5zg] {
    margin: 0;
    color: var(--cf-fg-muted);
}

.portal__erro[b-vbqygwz5zg] {
    margin: 0;
    color: var(--cf-bad);
    font-weight: 600;
}

.portal__aviso[b-vbqygwz5zg] {
    margin: 0;
    padding: 0.85rem 1rem;
    border: 1px solid rgba(255, 194, 75, 0.5);
    border-radius: 12px;
    background: rgba(255, 194, 75, 0.09);
    color: var(--cf-warn);
    font-weight: 600;
}

.portal__card[b-vbqygwz5zg] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    padding: clamp(1.25rem, 4vw, 1.75rem) clamp(1.25rem, 4vw, 1.75rem) clamp(1.25rem, 4vw, 1.75rem) clamp(1.6rem, 5vw, 2.25rem);
    border: 1px solid var(--cf-line);
    border-radius: var(--cf-radius-l);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.03));
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    overflow: hidden;
}

/* Faixa lateral: cor do estado. */
.portal__card[b-vbqygwz5zg]::before {
    content: '';
    position: absolute;
    inset: 0 auto 0 0;
    width: 8px;
    background: var(--cf-line-strong);
}

.portal__card:has([data-billing-status].portal__status--ok)[b-vbqygwz5zg]::before {
    background: repeating-linear-gradient(135deg, var(--cf-ok) 0 8px, rgba(61, 220, 151, 0.35) 8px 16px);
    background-size: 100% var(--cf-pole-h);
    animation: cf-pole-y 3s linear infinite;
}

.portal__card:has([data-billing-status].portal__status--alerta)[b-vbqygwz5zg]::before {
    background: var(--cf-warn);
}

.portal__card:has([data-billing-status].portal__status--erro)[b-vbqygwz5zg]::before {
    background: var(--cf-bad);
}

.portal__card-cabecalho[b-vbqygwz5zg] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.75rem 1rem;
    flex-wrap: wrap;
}

.portal__card-titulo[b-vbqygwz5zg] {
    margin: 0;
    font-family: var(--cf-font-display);
    font-size: 2.1rem;
    font-weight: 800;
    line-height: 1;
}

.portal__status[b-vbqygwz5zg] {
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    border: 1px solid var(--cf-line-strong);
    font-size: 0.8125rem;
    font-weight: 700;
    white-space: nowrap;
}

.portal__status--ok[b-vbqygwz5zg] {
    color: var(--cf-ok);
    border-color: rgba(61, 220, 151, 0.55);
    background: rgba(61, 220, 151, 0.1);
}

.portal__status--alerta[b-vbqygwz5zg] {
    color: var(--cf-warn);
    border-color: rgba(255, 194, 75, 0.55);
    background: rgba(255, 194, 75, 0.1);
}

.portal__status--erro[b-vbqygwz5zg] {
    color: var(--cf-bad);
    border-color: rgba(255, 122, 122, 0.55);
    background: rgba(255, 122, 122, 0.1);
}

.portal__acoes[b-vbqygwz5zg] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.portal__confirmacao[b-vbqygwz5zg] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(255, 122, 122, 0.55);
    border-radius: 14px;
    background: rgba(255, 122, 122, 0.08);
    animation: portal-abre-b-vbqygwz5zg 0.35s var(--cf-ease);
}

.portal__confirmacao p[b-vbqygwz5zg] {
    margin: 0;
}

@keyframes portal-abre-b-vbqygwz5zg {
    from { opacity: 0; transform: translateY(-8px); }
}

/* Cancelar (ação destrutiva): contorno vermelho; só o botão de confirmar é preenchido (.cf-btn--danger). */
.portal__botao--perigo.cf-btn--ghost[b-vbqygwz5zg] {
    color: var(--cf-bad);
    border-color: rgba(255, 122, 122, 0.5);
}

.portal__botao--perigo.cf-btn--ghost:hover:not(:disabled)[b-vbqygwz5zg] {
    background: rgba(255, 122, 122, 0.12);
}

.portal__nova[b-vbqygwz5zg] {
    align-self: flex-start;
}
/* /Pages/Plataforma/NovaBarbearia.razor.rz.scp.css */
/*
 * "Criar nova barbearia". Campos, slug, botões e estados de erro vêm de wwwroot/css/plataforma.css
 * (compartilhado com a landing pelas classes .nova__*); aqui só a composição da tela.
 */

.nova[b-ukhzm7f9ja] {
    display: grid;
    gap: clamp(1rem, 3vw, 1.75rem);
    width: 100%;
    align-content: start;
}

.nova__topo[b-ukhzm7f9ja] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1.5rem;
}

.nova__marca[b-ukhzm7f9ja] {
    display: inline-flex;
    text-decoration: none;
    --marca-tamanho: 1.7rem;
}

.nova__voltar[b-ukhzm7f9ja] {
    padding-block: 0.6rem;
    color: var(--cf-blue-soft);
    font-weight: 700;
    text-underline-offset: 4px;
}

.nova__titulo[b-ukhzm7f9ja] {
    max-width: 14ch;
}

.nova__intro[b-ukhzm7f9ja] {
    max-width: 60ch;
}

.nova__entrar[b-ukhzm7f9ja] {
    display: grid;
    gap: 1.25rem;
    justify-items: start;
    padding: clamp(1.5rem, 4vw, 2.5rem);
    border: 1px solid var(--cf-line);
    border-radius: var(--cf-radius-l);
    background: var(--cf-surface);
}

.nova__grade[b-ukhzm7f9ja] {
    display: grid;
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: start;
}

@media (min-width: 960px) {
    .nova__grade[b-ukhzm7f9ja] {
        grid-template-columns: minmax(0, 1fr) minmax(0, 520px);
    }

    .nova__previa[b-ukhzm7f9ja] {
        position: sticky;
        top: 2rem;
    }
}
/* /Pages/Plataforma/PosCheckout.razor.rz.scp.css */
.plataforma[b-4mgjaga5e1] {
    display: grid;
    width: 100%;
    justify-items: center;
}

.plataforma__card[b-4mgjaga5e1] {
    display: grid;
    gap: 1.25rem;
    justify-items: start;
    width: min(100%, 620px);
    padding: clamp(1.5rem, 5vw, 3rem);
    border-radius: var(--cf-radius-l);
    box-shadow: 0 50px 120px -50px rgba(61, 107, 255, 0.6);
    --marca-tamanho: 1.8rem;
}

.plataforma__titulo[b-4mgjaga5e1] {
    max-width: 12ch;
    font-size: clamp(2.75rem, 8vw, 4.25rem);
}

.plataforma__texto[b-4mgjaga5e1] {
    max-width: 44ch;
}

/* Trilho vertical: uma faixa de poste percorre as etapas sem marcar nenhuma como concluída. */
.plataforma__etapas[b-4mgjaga5e1] {
    position: relative;
    display: grid;
    gap: 0.25rem;
    width: 100%;
    margin: 0.25rem 0;
    padding: 0.25rem 0 0.25rem 1.75rem;
    list-style: none;
    border-left: 3px solid var(--cf-line);
}

.plataforma__etapas[b-4mgjaga5e1]::before {
    content: '';
    position: absolute;
    left: -3px;
    top: 0;
    width: 3px;
    height: 25%;
    border-radius: 999px;
    background: linear-gradient(180deg, var(--cf-red), var(--cf-foam), var(--cf-blue));
    animation: plataforma-percorre-b-4mgjaga5e1 4.8s var(--cf-ease) infinite;
}

@keyframes plataforma-percorre-b-4mgjaga5e1 {
    0% { transform: translateY(0); }
    100% { transform: translateY(300%); }
}

.plataforma__etapa[b-4mgjaga5e1] {
    padding-block: 0.6rem;
    font-weight: 600;
    animation: plataforma-etapa-b-4mgjaga5e1 4.8s ease-in-out infinite;
    animation-delay: calc(var(--i) * 1.2s - 0.6s);
}

@keyframes plataforma-etapa-b-4mgjaga5e1 {
    0%, 30%, 100% { color: var(--cf-fg-muted); }
    12% { color: var(--cf-foam); }
}

.plataforma__notas[b-4mgjaga5e1] {
    display: grid;
    gap: 0.6rem;
    color: var(--cf-fg-muted);
    font-size: 0.9375rem;
}

.plataforma__notas p[b-4mgjaga5e1] {
    margin: 0;
    max-width: 52ch;
}
/* /Pages/Registrar.razor.rz.scp.css */
/*
 * Registro — variantes "Convite" (issue #50) e "Aberto" (issue #52), ver
 * docs/knowledge-base/telas-autenticacao/spec.md, seção 3. Visual do design system da plataforma
 * (palco <Cena>): o conteúdo é um cartão de vidro; campos com rótulo sempre visível.
 */

.registrar__conteudo[b-q8lydlykpc] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    width: min(100%, 460px);
    padding: clamp(1.5rem, 5vw, 2.5rem);
    border: 1px solid var(--cf-line);
    border-radius: var(--cf-radius-l);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.03));
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
    box-shadow: 0 50px 120px -50px rgba(61, 107, 255, 0.6);
    animation: registrar-entra-b-q8lydlykpc 0.9s var(--cf-ease) backwards;
}

@keyframes registrar-entra-b-q8lydlykpc {
    from { opacity: 0; transform: translateY(24px) scale(0.98); }
}

.registrar__titulo[b-q8lydlykpc] {
    margin: 0;
    font-size: clamp(2.5rem, 8vw, 3.5rem);
}

.registrar__subtitulo[b-q8lydlykpc] {
    margin: 0;
    color: var(--cf-fg-muted);
}

.registrar__form[b-q8lydlykpc] {
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
}

.registrar__campo[b-q8lydlykpc] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.registrar__campo label[b-q8lydlykpc] {
    font-size: 0.9375rem;
    font-weight: 700;
}

.registrar__input[b-q8lydlykpc] {
    width: 100%;
    min-height: 52px;
    padding: 0 1rem;
    border: 1px solid var(--cf-line-strong);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.05);
    color: var(--cf-fg);
    font: 500 1rem/1.2 var(--cf-font-body);
    transition: border-color 0.2s, box-shadow 0.2s, background-color 0.2s;
}

.registrar__input:hover:not(:disabled)[b-q8lydlykpc] {
    border-color: var(--cf-blue-soft);
}

.registrar__input:focus[b-q8lydlykpc] {
    outline: none;
    border-color: var(--cf-blue-soft);
    background: rgba(255, 255, 255, 0.08);
    box-shadow: 0 0 0 4px rgba(138, 165, 255, 0.22);
}

.registrar__input:disabled[b-q8lydlykpc] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Código de convite: maiúsculas automáticas (seção 3.1, passo 1) — só neste campo, nunca Nome/Telefone.
   Espaçado e monoespaçado para dar para conferir o código letra a letra. */
.registrar__input--codigo[b-q8lydlykpc] {
    text-transform: uppercase;
    font-family: ui-monospace, 'Cascadia Code', Menlo, Consolas, monospace;
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: 0.14em;
}

.registrar__input--erro[b-q8lydlykpc] {
    border-color: var(--cf-bad);
}

.registrar__input--erro:focus[b-q8lydlykpc] {
    border-color: var(--cf-bad);
    box-shadow: 0 0 0 4px rgba(255, 122, 122, 0.22);
}

.registrar__campo-erro[b-q8lydlykpc] {
    margin: 0;
    color: var(--cf-bad);
    font-size: 0.875rem;
    font-weight: 600;
}
/* /Pages/Splash.razor.rz.scp.css */
/*
 * Splash / Primeiro Acesso — ver docs/knowledge-base/telas-autenticacao/spec.md, seção 1.
 * Visual do design system da plataforma (palco <Cena>). Composição: o nome da barbearia é a
 * tela — enorme, alinhado à esquerda — e as ações ficam embaixo, na zona do polegar.
 */

.splash__conteudo[b-s90etr4dpf] {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    gap: 1.25rem;
    justify-self: start;
    width: 100%;
    max-width: 560px;
    min-height: min(100dvh - 6rem, 760px);
    text-align: left;
    /* Reserva o lado do poste (Cena) para o título não passar por baixo dele. */
    padding-right: clamp(1.5rem, 8vw, 3rem);
}

.splash__nome-barbearia[b-s90etr4dpf] {
    margin: 0;
    font-family: var(--cf-font-display);
    font-size: clamp(3.6rem, 15vw, 8.5rem);
    font-weight: 800;
    line-height: 0.88;
    letter-spacing: -0.005em;
    overflow-wrap: anywhere;
    text-wrap: balance;
    animation: splash-sobe-b-s90etr4dpf 1.1s var(--cf-ease) backwards;
}

.splash__boas-vindas[b-s90etr4dpf] {
    margin: 0;
    color: var(--cf-fg-muted);
    font-size: 1.25rem;
    animation: splash-entra-b-s90etr4dpf 0.9s var(--cf-ease) 0.3s backwards;
}

.splash__continuar-como[b-s90etr4dpf] {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0.25rem 0 0;
    padding: 0.5rem 1rem 0.5rem 0.5rem;
    border: 1px solid var(--cf-line-strong);
    border-radius: 999px;
    background: var(--cf-surface);
    font-size: 0.9375rem;
    animation: splash-entra-b-s90etr4dpf 0.9s var(--cf-ease) 0.4s backwards;
}

.splash__avatar[b-s90etr4dpf] {
    display: grid;
    place-items: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--cf-blue), var(--cf-blue-soft));
    color: #fff;
    font-family: var(--cf-font-display);
    font-size: 1.25rem;
    font-weight: 800;
}

.splash__acoes[b-s90etr4dpf] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    width: 100%;
    margin-top: 0.5rem;
    animation: splash-entra-b-s90etr4dpf 0.9s var(--cf-ease) 0.5s backwards;
}

@media (min-width: 640px) {
    .splash__acoes[b-s90etr4dpf] {
        width: min(100%, 360px);
    }
}

.splash__assinatura[b-s90etr4dpf] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0.75rem 0 0;
    color: var(--cf-fg-muted);
    font-size: 0.875rem;
    --marca-tamanho: 1.15rem;
    animation: splash-entra-b-s90etr4dpf 0.9s var(--cf-ease) 0.7s backwards;
}

@keyframes splash-sobe-b-s90etr4dpf {
    from { opacity: 0; transform: translateY(48px); }
}

@keyframes splash-entra-b-s90etr4dpf {
    from { opacity: 0; transform: translateY(14px); }
}