body {
    background-color: var(--cor-superficie);
    color: var(--cor-texto);
    font-family: var(--fonte-corpo);
    font-variant-numeric: tabular-nums;
}

.navbar-brand,
h1, h2, h3, h4, h5, h6,
.btn {
    font-family: var(--fonte-marca);
}

.btn-primary {
    background-color: var(--cor-primaria);
    border-color: var(--cor-primaria);
    font-weight: 600;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--cor-primaria-escura);
    border-color: var(--cor-primaria-escura);
}

a {
    color: var(--cor-primaria);
}

.badge-status {
    display: inline-block;
    padding: 0.45rem 0.9rem;
    border-radius: 999px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #fff;
}

.badge-status--reservado { background-color: var(--status-reservado); }
.badge-status--atencao   { background-color: var(--status-atencao); }
.badge-status--transito  { background-color: var(--status-transito); }
.badge-status--ok        { background-color: var(--status-ok); }
.badge-status--troca     { background-color: var(--status-troca); }
.badge-status--cancelado { background-color: var(--status-cancelado); }
.badge-status--pintura   { background-color: var(--status-pintura); color: #000; }

.badge-basculho {
    border: 0;
    cursor: pointer;
}

.pagina-login {
    background-color: var(--cor-primaria);
    border-radius: 16px;
    min-height: calc(100vh - 6rem);
    padding-top: 3rem;
}

.logo-login {
    max-width: 220px;
    width: 100%;
}

.login-split {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 6rem);
    margin-top: 3rem;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--sombra-card);
}

.login-split__marca {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: var(--cor-primaria);
    color: #fff;
    padding: var(--espaco-xl) var(--espaco-lg);
    text-align: center;
}

.login-split__icone {
    width: 64px;
    height: 64px;
}

.login-split__nome {
    font-family: var(--fonte-marca);
    font-size: var(--texto-xl);
    font-weight: 700;
    letter-spacing: 0.05em;
    margin-top: var(--espaco-md);
}

.login-split__frase {
    display: none;
    font-family: var(--fonte-corpo);
    font-size: var(--texto-md);
    margin-top: var(--espaco-sm);
    max-width: 320px;
    opacity: 0.9;
}

.login-split__formulario {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    padding: var(--espaco-xl) var(--espaco-lg);
}

.login-split__form-conteudo {
    width: 100%;
    max-width: 360px;
}

@media (min-width: 768px) {
    .login-split {
        flex-direction: row;
    }

    .login-split__marca {
        flex: 0 0 45%;
    }

    .login-split__icone {
        width: 96px;
        height: 96px;
    }

    .login-split__formulario {
        flex: 1;
    }

    .login-split__frase {
        display: block;
    }
}

/* Cabeçalho compartilhado dos documentos impressos (OS, Manifesto, Comprovante, Relatório Diário, Espelho) */

.doc-logo-espaco {
    width: 64px;
    height: 64px;
    flex-shrink: 0;
    border: 1px dashed #c7ceda;
    border-radius: var(--radius-md);
}

.doc-logo-espaco__img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.logo-preview {
    width: 64px;
    height: 64px;
    flex-shrink: 0;
    object-fit: contain;
    border: 1px dashed #c7ceda;
    border-radius: var(--radius-md);
}

.doc-marca {
    font-family: var(--fonte-marca);
    color: var(--cor-primaria);
    font-weight: 700;
    font-size: var(--texto-lg);
}

.doc-info-linha {
    font-size: var(--texto-sm);
    color: #6b7280;
}

.doc-cabecalho--estreito {
    display: flex;
    flex-direction: column;
}

.doc-cabecalho--estreito .doc-cabecalho__empresa {
    display: flex;
    gap: var(--espaco-md);
    align-items: flex-start;
    margin-bottom: var(--espaco-lg);
}

.doc-cabecalho--estreito .doc-cabecalho__info {
    flex-grow: 1;
    text-align: center;
}

.doc-cabecalho--estreito .doc-cabecalho__titulo-bloco {
    text-align: center;
    border-top: 1px dashed #dee2e6;
    padding-top: var(--espaco-md);
}

.doc-cabecalho--estreito .doc-cabecalho__rotulo {
    text-transform: uppercase;
    font-size: var(--texto-sm);
    color: #6b7280;
}

.doc-cabecalho--estreito .doc-cabecalho__numero {
    font-size: var(--texto-xl);
    font-weight: 700;
}

.doc-cabecalho--largo {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: var(--espaco-md);
    margin-bottom: var(--espaco-lg);
}

.doc-cabecalho--largo .doc-cabecalho__empresa {
    display: flex;
    gap: var(--espaco-sm);
    align-items: center;
}

.doc-cabecalho--largo .doc-logo-espaco {
    width: 48px;
    height: 48px;
}

.doc-cabecalho--largo .doc-cabecalho__acao {
    text-align: right;
}

.doc-cabecalho--largo .doc-cabecalho__titulo {
    font-family: var(--fonte-marca);
    font-weight: 700;
    font-size: var(--texto-lg);
}

/* Data do documento: 50% maior que o .small do Bootstrap (0.875em) e em negrito */
.doc-cabecalho__data {
    font-size: 1.3125em;
    font-weight: 700;
}

:root {
    --rodape-acoes-altura: 76px;
}

.rodape-acoes-fixo-spacer {
    height: var(--rodape-acoes-altura);
}

.rodape-acoes-fixo {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    display: flex;
    gap: var(--espaco-sm);
    align-items: center;
    padding: var(--espaco-md) var(--espaco-xl);
    background-color: #fff;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
}

/* .sidebar-cacambou só aparece a partir do breakpoint lg (d-none d-lg-flex,
   layouts/partials/sidebar.blade.php) — a barra acompanha a mesma régua. */
@media (min-width: 992px) {
    .rodape-acoes-fixo {
        left: 88px;
    }
}