/*
 * Van-Tagem UI 4.0 — pacote consolidado do painel
 * Gerado a partir dos estilos globais e dos antigos módulos específicos.
 * As seções legadas permanecem escopadas por página para preservar o layout.
 */
/* ==========================================================================
   Módulo consolidado: registration-invite.css
   ========================================================================== */
/* ========================================================================== */
/* Modal de convite de responsável: integração com o design system do painel  */
/* ========================================================================== */
body.panel-app.panel-design-system .registration-invite-modal form {
    gap: 18px;
}

body.panel-app.panel-design-system .registration-invite-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 16px;
}

body.panel-app.panel-design-system .registration-invite-grid .ui-field {
    min-width: 0;
    margin: 0 !important;
    gap: 7px !important;
}

body.panel-app.panel-design-system .registration-invite-grid .ui-field.wide {
    grid-column: 1 / -1;
}

/*
 * Neutraliza os seletores antigos do modal, que atingiam qualquer span dentro
 * do label e acabavam deformando o wrapper do campo.
 */
body.panel-app.panel-design-system .registration-invite-grid .ui-field>.ui-label {
    display: block !important;
    margin: 0 !important;
    color: var(--ui-text-soft, #9eb0c4) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
}

body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0;
    min-height: var(--ui-control-height, 48px) !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    background: rgba(2, 12, 25, 0.68) !important;
    border: 1px solid var(--ui-border, rgba(145, 176, 208, 0.18)) !important;
    border-radius: var(--ui-radius-sm, 12px) !important;
    box-shadow: none !important;
    transition:
        border-color var(--ui-transition, 180ms ease),
        box-shadow var(--ui-transition, 180ms ease),
        background-color var(--ui-transition, 180ms ease) !important;
}

body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap:focus-within {
    background: rgba(2, 12, 25, 0.88) !important;
    border-color: rgba(255, 176, 0, 0.52) !important;
    box-shadow: var(--ui-focus, 0 0 0 3px rgba(255, 176, 0, 0.10)) !important;
}

body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap>i:first-child {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 16px !important;
    width: 16px !important;
    margin: 0 0 0 14px !important;
    color: #6f86a3 !important;
    font-size: 12px !important;
    line-height: 1 !important;
    transform: none !important;
    pointer-events: none !important;
}

body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap>i:last-child:not(:first-child) {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 12px !important;
    width: 12px !important;
    margin: 0 14px 0 0 !important;
    color: #6f86a3 !important;
    font-size: 10px !important;
    line-height: 1 !important;
    transform: none !important;
    pointer-events: none !important;
}

body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap>.ui-control {
    display: block !important;
    flex: 1 1 auto;
    width: 100% !important;
    min-width: 0;
    min-height: calc(var(--ui-control-height, 48px) - 2px) !important;
    height: auto !important;
    margin: 0 !important;
    padding: 12px 13px !important;
    color: var(--ui-text, #f4f7fb) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    font: inherit;
    font-size: 12px !important;
    line-height: 1.45 !important;
}

body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap>.ui-control:focus {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.panel-app.panel-design-system .registration-invite-grid .ui-control::placeholder {
    color: #607690 !important;
    opacity: 1;
}

body.panel-app.panel-design-system .registration-invite-grid select.ui-control {
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
}

body.panel-app.panel-design-system .registration-invite-grid select.ui-control option {
    color: #edf5ff;
    background: #071a2b;
}

body.panel-app.panel-design-system .registration-invite-grid input[type="date"].ui-control {
    color-scheme: dark;
}

body.panel-app.panel-design-system .registration-invite-address .registration-invite-grid {
    padding: 4px 16px 17px;
}

body.panel-app.panel-design-system .registration-invite-actions.ui-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-top: 0 !important;
}

body.panel-app.panel-design-system .registration-invite-actions .ui-button {
    width: auto !important;
    min-width: 0;
}

body.panel-app.panel-design-system .registration-invite-actions .ui-button.loading i {
    animation: registrationInviteSpin 800ms linear infinite;
}

@keyframes registrationInviteSpin {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 660px) {
    body.panel-app.panel-design-system .registration-invite-grid {
        grid-template-columns: 1fr;
    }

    body.panel-app.panel-design-system .registration-invite-grid .ui-field.wide {
        grid-column: auto;
    }

    body.panel-app.panel-design-system .registration-invite-actions.ui-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
    }

    body.panel-app.panel-design-system .registration-invite-actions .ui-button {
        width: 100% !important;
    }

    body.panel-app.panel-design-system .registration-invite-actions .ui-button--primary {
        grid-row: 1;
    }

    body.panel-app.panel-design-system .registration-invite-actions .ui-button--secondary {
        grid-row: 2;
    }
}

/* ==========================================================================
   Módulo consolidado: dashboard-driver-status.css
   ========================================================================== */
/*
 * Van-Tagem
 * Correção isolada do cartão de situação na tela inicial do motorista.
 * Mantém o restante do painel intacto.
 */
body.panel-role-driver .driver-dashboard-insight {
    align-items: center;
}

body.panel-role-driver .driver-dashboard-insight-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: center;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    line-height: 1;
    text-align: center;
}

body.panel-role-driver .driver-dashboard-insight-icon>i {
    position: static !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    font-size: 15px !important;
    line-height: 1 !important;
    opacity: 1 !important;
    transform: none !important;
}

body.panel-role-driver .driver-dashboard-insight.is-healthy .driver-dashboard-insight-icon {
    color: var(--green, #35d091);
    background: rgba(53, 208, 145, 0.11);
    border-color: rgba(53, 208, 145, 0.2);
}

body.panel-role-driver .driver-dashboard-insight.is-attention .driver-dashboard-insight-icon {
    color: var(--primary-yellow, #ffb000);
    background: rgba(255, 176, 0, 0.09);
    border-color: rgba(255, 176, 0, 0.16);
}

body.panel-role-driver .driver-dashboard-insight-copy {
    display: flex;
    align-self: stretch;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    min-width: 0;
    min-height: 44px;
    margin: 0;
    padding: 0;
}

body.panel-role-driver .driver-dashboard-insight-copy>span,
body.panel-role-driver .driver-dashboard-insight-copy>h3,
body.panel-role-driver .driver-dashboard-insight-copy>p {
    display: block;
    margin: 0 !important;
    padding: 0;
}

body.panel-role-driver .driver-dashboard-insight-copy>span {
    line-height: 1.2;
}

body.panel-role-driver .driver-dashboard-insight-copy>h3 {
    line-height: 1.35;
}

body.panel-role-driver .driver-dashboard-insight-copy>p {
    line-height: 1.45;
}

body.panel-role-driver .driver-dashboard-insight>.ui-button {
    align-self: center;
}

@media (max-width: 720px) {
    body.panel-role-driver .driver-dashboard-insight-icon {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
    }

    body.panel-role-driver .driver-dashboard-insight-copy {
        min-height: 40px;
    }
}

/* ==========================================================================
   Módulo consolidado: data-deletion-admin.css
   ========================================================================== */
/* ========================================================================== 
   ADMINISTRAÇÃO • EXCLUSÃO DE DADOS
   Estilo isolado para a central LGPD
   ========================================================================== */
body.panel-app.panel-design-system .admin-data-deletion-page {
    display: flex;
    flex-direction: column;
    gap: 18px;
    width: 100%;
    min-width: 0;
}

body.panel-app.panel-design-system .admin-deletion-enter {
    animation: adminDeletionEnter .52s cubic-bezier(.22, .75, .2, 1) both;
}

body.panel-app.panel-design-system .admin-deletion-stats {
    animation-delay: .06s;
}

body.panel-app.panel-design-system .admin-deletion-workspace {
    animation-delay: .12s;
}

@keyframes adminDeletionEnter {
    from {
        opacity: 0;
        transform: translateY(13px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

body.panel-app.panel-design-system .admin-deletion-hero {
    position: relative;
    min-height: 150px;
    overflow: hidden;
}

body.panel-app.panel-design-system .admin-deletion-hero::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 21px;
    width: 128px;
    height: 128px;
    border: 22px solid rgba(255, 176, 0, .045);
    border-radius: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

body.panel-app.panel-design-system .admin-deletion-hero>div,
body.panel-app.panel-design-system .admin-deletion-hero__icon {
    position: relative;
    z-index: 1;
}

body.panel-app.panel-design-system .admin-deletion-hero__icon {
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    font-size: 20px;
}

body.panel-app.panel-design-system .admin-deletion-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.panel-app.panel-design-system .admin-deletion-workspace {
    min-width: 0;
    padding: 24px;
}

body.panel-app.panel-design-system .admin-deletion-section-header {
    align-items: flex-end;
    margin-bottom: 18px;
}

body.panel-app.panel-design-system .admin-deletion-section-header h3 {
    margin: 4px 0 0;
}

body.panel-app.panel-design-system .admin-deletion-section-header p {
    max-width: 720px;
    margin: 6px 0 0;
    color: #8398af;
    font-size: 11px;
    line-height: 1.55;
}

body.panel-app.panel-design-system .admin-deletion-result-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 12px;
    color: #9db0c4;
    background: rgba(5, 21, 36, .66);
    border: 1px solid rgba(128, 164, 197, .14);
    border-radius: 10px;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

body.panel-app.panel-design-system .admin-deletion-filter {
    display: grid;
    grid-template-columns: minmax(260px, 1.35fr) minmax(230px, .78fr) auto auto;
    gap: 10px;
    margin-bottom: 18px;
    padding: 12px;
    background: rgba(255, 255, 255, .022);
    border: 1px solid rgba(128, 164, 197, .12);
    border-radius: 15px;
}

body.panel-app.panel-design-system .admin-deletion-filter .ui-control-wrap {
    min-height: 46px;
}

body.panel-app.panel-design-system .admin-deletion-filter .ui-button {
    min-height: 46px;
    white-space: nowrap;
}

body.panel-app.panel-design-system .admin-deletion-list {
    display: grid;
    gap: 14px;
}

body.panel-app.panel-design-system .admin-deletion-card {
    display: grid;
    gap: 15px;
    min-width: 0;
    padding: 20px;
    background: linear-gradient(145deg, rgba(19, 46, 71, .72), rgba(10, 30, 49, .82));
    border: 1px solid rgba(128, 164, 197, .14);
    border-radius: 17px;
    box-shadow: inset 0 1px rgba(255, 255, 255, .015);
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

body.panel-app.panel-design-system .admin-deletion-card:hover {
    border-color: rgba(255, 184, 22, .22);
    box-shadow: 0 14px 34px rgba(0, 7, 15, .16);
    transform: translateY(-1px);
}

body.panel-app.panel-design-system .admin-deletion-card__header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
}

body.panel-app.panel-design-system .admin-deletion-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    color: #ffb815;
    background: rgba(255, 184, 21, .09);
    border: 1px solid rgba(255, 184, 21, .2);
    border-radius: 14px;
}

body.panel-app.panel-design-system .admin-deletion-card__identity {
    min-width: 0;
}

body.panel-app.panel-design-system .admin-deletion-card__identity small {
    display: block;
    color: #8ca3bb;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

body.panel-app.panel-design-system .admin-deletion-card__identity h4 {
    margin: 4px 0 2px;
    overflow: hidden;
    color: #f7f9fc;
    font-size: 16px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .admin-deletion-card__identity p {
    margin: 0;
    overflow: hidden;
    color: #859ab0;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .admin-deletion-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 0 10px;
    color: #aebdcb;
    background: rgba(255, 255, 255, .025);
    border: 1px solid rgba(131, 170, 205, .18);
    border-radius: 999px;
    font-size: 8px;
    font-weight: 900;
    white-space: nowrap;
}

body.panel-app.panel-design-system .admin-deletion-status.is-received {
    color: #9bc6f1;
    background: rgba(87, 159, 226, .07);
    border-color: rgba(87, 159, 226, .22);
}

body.panel-app.panel-design-system .admin-deletion-status.is-completed {
    color: #64dfad;
    background: rgba(100, 223, 173, .07);
    border-color: rgba(100, 223, 173, .28);
}

body.panel-app.panel-design-system .admin-deletion-status.is-processing,
body.panel-app.panel-design-system .admin-deletion-status.is-verified {
    color: #f9c85c;
    background: rgba(249, 200, 92, .06);
    border-color: rgba(249, 200, 92, .25);
}

body.panel-app.panel-design-system .admin-deletion-status.is-rejected {
    color: #ff8d9b;
    background: rgba(255, 141, 155, .06);
    border-color: rgba(255, 141, 155, .25);
}

body.panel-app.panel-design-system .admin-deletion-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

body.panel-app.panel-design-system .admin-deletion-meta span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 30px;
    padding: 0 10px;
    color: #91a5ba;
    background: rgba(3, 17, 30, .42);
    border: 1px solid rgba(128, 164, 197, .08);
    border-radius: 9px;
    font-size: 9px;
}

body.panel-app.panel-design-system .admin-deletion-meta i {
    color: #f9b51d;
}

body.panel-app.panel-design-system .admin-deletion-information-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

body.panel-app.panel-design-system .admin-deletion-reason {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    min-width: 0;
    padding: 13px 14px;
    background: rgba(3, 17, 30, .42);
    border: 1px solid rgba(128, 164, 197, .09);
    border-radius: 12px;
}

body.panel-app.panel-design-system .admin-deletion-reason__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    color: #f9b51d;
    background: rgba(249, 181, 29, .08);
    border-radius: 9px;
}

body.panel-app.panel-design-system .admin-deletion-reason>div {
    min-width: 0;
}

body.panel-app.panel-design-system .admin-deletion-reason strong {
    color: #e9eef4;
    font-size: 10px;
}

body.panel-app.panel-design-system .admin-deletion-reason p {
    margin: 4px 0 0;
    color: #91a4b8;
    font-size: 10px;
    line-height: 1.55;
    overflow-wrap: anywhere;
}

body.panel-app.panel-design-system .admin-deletion-form {
    display: grid;
    gap: 14px;
    padding-top: 16px;
    border-top: 1px solid rgba(128, 164, 197, .11);
}

body.panel-app.panel-design-system .admin-deletion-form .ui-form-grid-two {
    display: grid;
    grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr);
    gap: 14px;
}

body.panel-app.panel-design-system .admin-deletion-form .ui-field {
    min-width: 0;
}

body.panel-app.panel-design-system .admin-deletion-form .ui-control-wrap {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 48px;
    overflow: hidden;
    background: rgba(3, 17, 30, .72);
    border: 1px solid rgba(131, 170, 205, .16);
    border-radius: 13px;
    transition: border-color .2s ease, box-shadow .2s ease;
}

body.panel-app.panel-design-system .admin-deletion-form .ui-control-wrap:focus-within {
    border-color: rgba(255, 184, 21, .52);
    box-shadow: 0 0 0 3px rgba(255, 184, 21, .065);
}

body.panel-app.panel-design-system .admin-deletion-form .ui-control-wrap>i:first-child {
    flex: 0 0 44px;
    width: 44px;
    color: #f9b51d;
    text-align: center;
}

body.panel-app.panel-design-system .admin-deletion-form .ui-control-wrap>i:last-child:not(:first-child) {
    position: absolute;
    top: 50%;
    right: 14px;
    color: #70869d;
    font-size: 10px;
    transform: translateY(-50%);
    pointer-events: none;
}

body.panel-app.panel-design-system .admin-deletion-form .ui-control-wrap :is(select, textarea) {
    width: 100%;
    min-width: 0;
    padding: 13px 42px 13px 0;
    color: #f4f7fb;
    background: transparent;
    border: 0;
    outline: 0;
    font: inherit;
    font-size: 11px;
}

body.panel-app.panel-design-system .admin-deletion-form .ui-control-wrap select {
    min-height: 46px;
    appearance: none;
}

body.panel-app.panel-design-system .admin-deletion-form .ui-control-wrap textarea {
    min-height: 92px;
    resize: vertical;
    line-height: 1.55;
}

body.panel-app.panel-design-system .admin-deletion-form .ui-control-wrap--textarea {
    align-items: flex-start;
}

body.panel-app.panel-design-system .admin-deletion-form .ui-control-wrap--textarea>i:first-child {
    padding-top: 16px;
}

body.panel-app.panel-design-system .admin-deletion-form__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

body.panel-app.panel-design-system .admin-deletion-switch {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 11px;
    min-width: 0;
    padding: 11px 13px;
    cursor: pointer;
    background: rgba(255, 255, 255, .025);
    border: 1px solid rgba(128, 164, 197, .11);
    border-radius: 12px;
    transition: border-color .2s ease, background .2s ease;
}

body.panel-app.panel-design-system .admin-deletion-switch:hover {
    background: rgba(255, 255, 255, .035);
    border-color: rgba(255, 184, 21, .2);
}

body.panel-app.panel-design-system .admin-deletion-switch>input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

body.panel-app.panel-design-system .admin-deletion-switch__check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    color: transparent;
    background: rgba(255, 255, 255, .04);
    border: 1px solid rgba(128, 164, 197, .24);
    border-radius: 4px;
    font-size: 10px;
    transition: .2s ease;
}

body.panel-app.panel-design-system .admin-deletion-switch>input:checked+.admin-deletion-switch__check {
    color: #071522;
    background: #ffb815;
    border-color: #ffb815;
}

body.panel-app.panel-design-system .admin-deletion-switch>input:focus-visible+.admin-deletion-switch__check {
    box-shadow: 0 0 0 3px rgba(255, 184, 21, .18);
}

body.panel-app.panel-design-system .admin-deletion-switch__copy {
    display: grid;
    min-width: 0;
    gap: 2px;
}

body.panel-app.panel-design-system .admin-deletion-switch__copy strong {
    color: #e9eef4;
    font-size: 10px;
}

body.panel-app.panel-design-system .admin-deletion-switch__copy small {
    color: #7f94aa;
    font-size: 8px;
    line-height: 1.45;
}

body.panel-app.panel-design-system .admin-deletion-form__footer>.ui-button {
    flex: 0 0 auto;
}

body.panel-app.panel-design-system .admin-deletion-empty {
    min-height: 210px;
    padding: 34px 20px;
    border: 1px dashed rgba(128, 164, 197, .18);
    border-radius: 15px;
}

body.panel-app.panel-design-system .admin-deletion-empty__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    margin-bottom: 4px;
    color: #ffb815;
    background: rgba(255, 184, 21, .08);
    border: 1px solid rgba(255, 184, 21, .18);
    border-radius: 13px;
}

body.panel-app.panel-design-system .admin-deletion-empty .ui-button {
    margin-top: 12px;
}

body.panel-app.panel-design-system .admin-deletion-pagination {
    margin-top: 18px;
}

@media (max-width: 1080px) {
    body.panel-app.panel-design-system .admin-deletion-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.panel-app.panel-design-system .admin-deletion-filter {
        grid-template-columns: minmax(0, 1fr) minmax(220px, .7fr) auto;
    }

    body.panel-app.panel-design-system .admin-deletion-filter .ui-button--secondary {
        grid-column: 1 / -1;
        justify-self: end;
    }
}

@media (max-width: 760px) {
    body.panel-app.panel-design-system .admin-deletion-workspace {
        padding: 18px;
    }

    body.panel-app.panel-design-system .admin-deletion-section-header {
        align-items: flex-start;
        flex-direction: column;
    }

    body.panel-app.panel-design-system .admin-deletion-filter,
    body.panel-app.panel-design-system .admin-deletion-form .ui-form-grid-two,
    body.panel-app.panel-design-system .admin-deletion-information-grid {
        grid-template-columns: 1fr;
    }

    body.panel-app.panel-design-system .admin-deletion-filter .ui-button,
    body.panel-app.panel-design-system .admin-deletion-filter .ui-button--secondary {
        grid-column: auto;
        width: 100%;
        justify-self: stretch;
        justify-content: center;
    }

    body.panel-app.panel-design-system .admin-deletion-card__header {
        grid-template-columns: auto minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .admin-deletion-status {
        grid-column: 1 / -1;
        justify-self: start;
    }

    body.panel-app.panel-design-system .admin-deletion-form__footer {
        align-items: stretch;
        flex-direction: column;
    }

    body.panel-app.panel-design-system .admin-deletion-form__footer>.ui-button {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 540px) {
    body.panel-app.panel-design-system .admin-deletion-stats {
        grid-template-columns: 1fr;
    }

    body.panel-app.panel-design-system .admin-deletion-card {
        padding: 16px;
    }

    body.panel-app.panel-design-system .admin-deletion-card__identity h4 {
        font-size: 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.panel-app.panel-design-system .admin-deletion-enter {
        animation: none;
    }

    body.panel-app.panel-design-system .admin-deletion-card,
    body.panel-app.panel-design-system .admin-deletion-switch {
        transition: none;
    }
}

/* ==========================================================================
   Módulo consolidado: efi-pages.css
   ========================================================================== */
/* Van-Tagem | Páginas Efí no padrão visual canônico do painel */
body.panel-app.panel-design-system .efi-standard-page {
    gap: 18px;
}

body.panel-app.panel-design-system .efi-standard-hero {
    margin: 0 !important;
}

body.panel-app.panel-design-system .efi-standard-hero__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

body.panel-app.panel-design-system .efi-standard-hero__icon,
body.panel-app.panel-design-system .efi-standard-section-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    color: var(--ui-primary);
    background: rgba(255, 176, 0, 0.09);
    border: 1px solid rgba(255, 176, 0, 0.18);
    border-radius: 14px;
}

body.panel-app.panel-design-system .efi-standard-hero__icon {
    font-size: 17px;
}

body.panel-app.panel-design-system .efi-standard-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 29px;
    margin-top: 15px;
    padding: 0 10px;
    color: var(--ui-text-soft);
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid var(--ui-border);
    border-radius: 999px;
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

body.panel-app.panel-design-system .efi-standard-status.is-active,
body.panel-app.panel-design-system .efi-standard-status.is-paid {
    color: #68e1b1;
    background: rgba(53, 208, 145, 0.09);
    border-color: rgba(53, 208, 145, 0.24);
}

body.panel-app.panel-design-system .efi-standard-status.is-pending,
body.panel-app.panel-design-system .efi-standard-status.is-created {
    color: #ffd16a;
    background: rgba(255, 176, 0, 0.09);
    border-color: rgba(255, 176, 0, 0.24);
}

body.panel-app.panel-design-system .efi-standard-status.is-error,
body.panel-app.panel-design-system .efi-standard-status.is-failed,
body.panel-app.panel-design-system .efi-standard-status.is-expired,
body.panel-app.panel-design-system .efi-standard-status.is-cancelled,
body.panel-app.panel-design-system .efi-standard-status.is-disabled {
    color: #ff9ca5;
    background: rgba(255, 107, 117, 0.09);
    border-color: rgba(255, 107, 117, 0.24);
}

body.panel-app.panel-design-system .efi-standard-summary-grid--admin {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

body.panel-app.panel-design-system .efi-standard-summary-grid--driver {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body.panel-app.panel-design-system .efi-standard-summary-grid .ui-stat-card {
    min-height: 108px !important;
    text-decoration: none;
}

body.panel-app.panel-design-system .efi-standard-content-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.75fr);
    align-items: start;
    gap: 16px;
    min-width: 0;
}

body.panel-app.panel-design-system .efi-standard-content-grid--admin {
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.72fr);
}

body.panel-app.panel-design-system .efi-standard-card {
    min-width: 0;
    padding: 22px !important;
}

body.panel-app.panel-design-system .efi-standard-card__header {
    margin-bottom: 20px;
}

body.panel-app.panel-design-system .efi-standard-section-title {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

body.panel-app.panel-design-system .efi-standard-section-title>div {
    min-width: 0;
}

body.panel-app.panel-design-system .efi-standard-section-title h3 {
    margin: 3px 0 0 !important;
    color: var(--ui-text) !important;
    font-size: 16px !important;
    font-weight: 800 !important;
}

body.panel-app.panel-design-system .efi-standard-form {
    display: grid;
    gap: 17px;
}

body.panel-app.panel-design-system .efi-standard-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}

body.panel-app.panel-design-system .efi-standard-form-grid__wide {
    grid-column: 1 / -1;
}

body.panel-app.panel-design-system .efi-standard-form .ui-field,
body.panel-app.panel-design-system .efi-standard-form .ui-control-wrap,
body.panel-app.panel-design-system .efi-standard-form .ui-control {
    min-width: 0;
    width: 100%;
}

body.panel-app.panel-design-system .efi-standard-form .ui-control-wrap {
    margin: 0;
}

body.panel-app.panel-design-system .efi-standard-form .ui-label {
    display: block;
    margin: 0 0 7px;
}

body.panel-app.panel-design-system .efi-standard-form__field {
    max-width: 420px;
}

body.panel-app.panel-design-system .efi-standard-help {
    display: block;
    margin-top: 6px;
    color: var(--ui-text-muted);
    font-size: 9px;
    line-height: 1.5;
}

body.panel-app.panel-design-system .efi-standard-form__actions {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    margin-top: 1px;
}

body.panel-app.panel-design-system .efi-standard-switch {
    display: flex;
    align-items: center;
    gap: 12px;
    width: fit-content;
    max-width: 100%;
    margin: 0;
    cursor: pointer;
}

body.panel-app.panel-design-system .efi-standard-switch>input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

body.panel-app.panel-design-system .efi-standard-switch__track,
body.panel-app.panel-design-system .efi-standard-switch>span:not(.efi-standard-switch__copy) {
    position: relative;
    flex: 0 0 46px;
    width: 46px;
    height: 25px;
    background: #31475c;
    border: 1px solid rgba(145, 174, 207, 0.18);
    border-radius: 999px;
    transition: background-color var(--ui-transition), border-color var(--ui-transition), box-shadow var(--ui-transition);
}

body.panel-app.panel-design-system .efi-standard-switch__track::after,
body.panel-app.panel-design-system .efi-standard-switch>span:not(.efi-standard-switch__copy)::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 17px;
    height: 17px;
    background: #91a4b8;
    border-radius: 50%;
    transition: transform var(--ui-transition), background-color var(--ui-transition);
}

body.panel-app.panel-design-system .efi-standard-switch>input:checked+.efi-standard-switch__track,
body.panel-app.panel-design-system .efi-standard-switch>input:checked+span:not(.efi-standard-switch__copy) {
    background: #2db98b;
    border-color: rgba(53, 208, 145, 0.38);
}

body.panel-app.panel-design-system .efi-standard-switch>input:checked+.efi-standard-switch__track::after,
body.panel-app.panel-design-system .efi-standard-switch>input:checked+span:not(.efi-standard-switch__copy)::after {
    background: #fff;
    transform: translateX(21px);
}

body.panel-app.panel-design-system .efi-standard-switch>input:focus-visible+.efi-standard-switch__track,
body.panel-app.panel-design-system .efi-standard-switch>input:focus-visible+span:not(.efi-standard-switch__copy) {
    box-shadow: var(--ui-focus);
}

body.panel-app.panel-design-system .efi-standard-switch__copy,
body.panel-app.panel-design-system .efi-standard-switch>div {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

body.panel-app.panel-design-system .efi-standard-switch__copy strong,
body.panel-app.panel-design-system .efi-standard-switch>div strong {
    color: var(--ui-text);
    font-size: 11px;
}

body.panel-app.panel-design-system .efi-standard-switch__copy small,
body.panel-app.panel-design-system .efi-standard-switch>div small {
    color: var(--ui-text-muted);
    font-size: 9px;
    line-height: 1.45;
}

body.panel-app.panel-design-system .efi-standard-consent {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0;
    cursor: pointer;
}

body.panel-app.panel-design-system .efi-standard-consent>input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

body.panel-app.panel-design-system .efi-standard-consent__box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    color: transparent;
    background: rgba(255, 255, 255, 0.025);
    border: 1px solid var(--ui-border-strong);
    border-radius: 7px;
    transition: background-color var(--ui-transition), border-color var(--ui-transition), color var(--ui-transition), box-shadow var(--ui-transition);
}

body.panel-app.panel-design-system .efi-standard-consent>input:checked+.efi-standard-consent__box {
    color: var(--ui-primary-ink);
    background: var(--ui-primary);
    border-color: var(--ui-primary);
}

body.panel-app.panel-design-system .efi-standard-consent>input:focus-visible+.efi-standard-consent__box {
    box-shadow: var(--ui-focus);
}

body.panel-app.panel-design-system .efi-standard-consent__text {
    padding-top: 2px;
    color: var(--ui-text-soft);
    font-size: 10px;
    line-height: 1.55;
}

body.panel-app.panel-design-system .efi-standard-inline-alert {
    margin-top: 17px;
    grid-template-columns: auto minmax(0, 1fr) !important;
}

body.panel-app.panel-design-system .efi-standard-check-list,
body.panel-app.panel-design-system .efi-standard-flow-list {
    display: grid;
    gap: 10px;
    margin-top: 11px;
}

body.panel-app.panel-design-system .efi-standard-check-item,
body.panel-app.panel-design-system .efi-standard-flow-list>div {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
    padding: 11px;
    background: rgba(255, 255, 255, 0.025);
    border: 1px solid rgba(145, 174, 207, 0.1);
    border-radius: 12px;
}

body.panel-app.panel-design-system .efi-standard-check-item>span,
body.panel-app.panel-design-system .efi-standard-flow-list b {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 31px;
    width: 31px;
    height: 31px;
    color: var(--ui-primary-ink);
    background: var(--ui-primary);
    border-radius: 9px;
    font-size: 11px;
    font-weight: 800;
}

body.panel-app.panel-design-system .efi-standard-check-item.is-invalid>span {
    color: #fff;
    background: var(--ui-danger);
}

body.panel-app.panel-design-system .efi-standard-check-item p,
body.panel-app.panel-design-system .efi-standard-flow-list p {
    min-width: 0;
    margin: 0;
    color: var(--ui-text-soft);
    font-size: 10px;
    line-height: 1.5;
}

body.panel-app.panel-design-system .efi-standard-notice {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 12px;
    padding: 12px;
    color: #ffd178;
    background: rgba(255, 176, 0, 0.06);
    border: 1px solid rgba(255, 176, 0, 0.17);
    border-radius: 12px;
}

body.panel-app.panel-design-system .efi-standard-notice p {
    margin: 0;
    color: #cfba82;
    font-size: 9px;
    line-height: 1.55;
}

body.panel-app.panel-design-system .efi-standard-list-panel {
    min-width: 0;
    padding: 20px !important;
}

body.panel-app.panel-design-system .efi-standard-list-heading {
    margin-bottom: 16px;
}

body.panel-app.panel-design-system .efi-standard-filter-bar {
    justify-content: flex-end;
    margin-bottom: 16px;
}

body.panel-app.panel-design-system .efi-standard-filter-bar>.ui-control-wrap {
    flex: 1 1 300px !important;
    max-width: 440px;
}

body.panel-app.panel-design-system .efi-standard-filter-bar>.ui-button {
    flex: 0 0 auto !important;
}

body.panel-app.panel-design-system .efi-standard-account-row {
    display: grid;
    grid-template-columns: auto minmax(190px, 1.4fr) minmax(110px, 0.6fr) minmax(100px, 0.5fr) auto auto;
    align-items: center;
    gap: 13px;
    min-width: 0;
    min-height: 72px;
    padding: 13px 0;
    border-top: 1px solid rgba(145, 174, 207, 0.09);
}

body.panel-app.panel-design-system .efi-standard-account-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    color: var(--ui-primary-ink);
    background: linear-gradient(135deg, var(--ui-primary), var(--ui-primary-hover));
    border-radius: 12px;
    font-size: 12px;
    font-weight: 800;
}

body.panel-app.panel-design-system .efi-standard-account-main,
body.panel-app.panel-design-system .efi-standard-account-data,
body.panel-app.panel-design-system .efi-standard-payment-row>div {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

body.panel-app.panel-design-system .efi-standard-account-main strong,
body.panel-app.panel-design-system .efi-standard-account-data strong,
body.panel-app.panel-design-system .efi-standard-payment-row strong {
    overflow: hidden;
    color: var(--ui-text);
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .efi-standard-account-main small,
body.panel-app.panel-design-system .efi-standard-account-data small,
body.panel-app.panel-design-system .efi-standard-payment-row small {
    overflow: hidden;
    color: var(--ui-text-muted);
    font-size: 9px;
    line-height: 1.5;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .efi-standard-account-row>.efi-standard-status,
body.panel-app.panel-design-system .efi-standard-payment-row>.efi-standard-status {
    margin-top: 0;
}

body.panel-app.panel-design-system .efi-standard-payment-list {
    display: grid;
}

body.panel-app.panel-design-system .efi-standard-payment-row {
    display: grid;
    grid-template-columns: auto minmax(210px, 1fr) auto auto;
    align-items: center;
    gap: 14px;
    min-width: 0;
    padding: 13px 0;
    border-top: 1px solid rgba(145, 174, 207, 0.09);
}

body.panel-app.panel-design-system .efi-standard-empty {
    min-height: 220px;
    border-top: 1px solid rgba(145, 174, 207, 0.09);
}

body.panel-app.panel-design-system .efi-standard-empty--compact {
    min-height: 180px;
}

body.panel-app.panel-design-system .efi-standard-disconnect {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 17px 20px;
    background: rgba(255, 107, 117, 0.035);
    border: 1px solid rgba(255, 107, 117, 0.16);
    border-radius: var(--ui-radius-md);
}

body.panel-app.panel-design-system .efi-standard-disconnect>div {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

body.panel-app.panel-design-system .efi-standard-disconnect strong {
    color: var(--ui-text);
    font-size: 12px;
}

body.panel-app.panel-design-system .efi-standard-disconnect span {
    color: var(--ui-text-muted);
    font-size: 9px;
    line-height: 1.5;
}

@media (max-width: 1120px) {
    body.panel-app.panel-design-system .efi-standard-summary-grid--admin {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.panel-app.panel-design-system .efi-standard-content-grid,
    body.panel-app.panel-design-system .efi-standard-content-grid--admin {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .efi-standard-account-row {
        grid-template-columns: auto minmax(0, 1fr) auto auto;
    }

    body.panel-app.panel-design-system .efi-standard-account-data {
        display: none;
    }
}

@media (max-width: 760px) {

    body.panel-app.panel-design-system .efi-standard-summary-grid--admin,
    body.panel-app.panel-design-system .efi-standard-summary-grid--driver {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    body.panel-app.panel-design-system .efi-standard-form-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .efi-standard-form-grid__wide {
        grid-column: auto;
    }

    body.panel-app.panel-design-system .efi-standard-form__field {
        max-width: none;
    }

    body.panel-app.panel-design-system .efi-standard-payment-row {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    body.panel-app.panel-design-system .efi-standard-payment-row>.efi-standard-status,
    body.panel-app.panel-design-system .efi-standard-payment-row>small {
        display: none;
    }
}

@media (max-width: 620px) {
    body.panel-app.panel-design-system .efi-standard-hero {
        align-items: flex-start !important;
        flex-direction: column !important;
        min-height: 0 !important;
        padding: 22px 18px !important;
    }

    body.panel-app.panel-design-system .efi-standard-hero__icon {
        position: absolute;
        top: 18px;
        right: 18px;
        width: 42px;
        height: 42px;
        flex-basis: 42px;
    }

    body.panel-app.panel-design-system .efi-standard-hero__content {
        padding-right: 48px;
    }

    body.panel-app.panel-design-system .efi-standard-card,
    body.panel-app.panel-design-system .efi-standard-list-panel {
        padding: 17px 14px !important;
    }

    body.panel-app.panel-design-system .efi-standard-filter-bar>* {
        flex: 1 1 100% !important;
        width: 100%;
        max-width: none !important;
    }

    body.panel-app.panel-design-system .efi-standard-form__actions,
    body.panel-app.panel-design-system .efi-standard-form__actions>.ui-button {
        width: 100%;
    }

    body.panel-app.panel-design-system .efi-standard-account-row {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    body.panel-app.panel-design-system .efi-standard-account-row>.efi-standard-status {
        display: none;
    }

    body.panel-app.panel-design-system .efi-standard-disconnect {
        align-items: stretch;
        flex-direction: column;
    }

    body.panel-app.panel-design-system .efi-standard-disconnect .ui-button {
        width: 100%;
    }
}

/* Tarifas e demonstrativos por cobrança */
body.panel-app.panel-design-system .efi-fee-settings-grid {
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
}

body.panel-app.panel-design-system .efi-fee-form-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.panel-app.panel-design-system .efi-fee-preview-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

body.panel-app.panel-design-system .efi-fee-preview-grid article {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 12px;
    background: rgba(3, 17, 30, .48);
    border: 1px solid rgba(131, 170, 205, .11);
    border-radius: 12px;
}

body.panel-app.panel-design-system .efi-fee-preview-grid article>span {
    display: grid;
    place-items: center;
    flex: 0 0 37px;
    width: 37px;
    height: 37px;
    color: #f9b51d;
    background: rgba(249, 181, 29, .08);
    border-radius: 11px;
}

body.panel-app.panel-design-system .efi-fee-preview-grid article div {
    display: grid;
    gap: 2px;
}

body.panel-app.panel-design-system .efi-fee-preview-grid small {
    color: #7e93a8;
    font-size: 9px;
    text-transform: uppercase;
}

body.panel-app.panel-design-system .efi-fee-preview-grid strong {
    color: #f0f5f9;
    font-size: 12px;
}

body.panel-app.panel-design-system .efi-fee-preview-grid em {
    color: #91a5b8;
    font-size: 9px;
    font-style: normal;
}

body.panel-app.panel-design-system .efi-fee-formula {
    display: grid;
    gap: 1px;
    overflow: hidden;
    background: rgba(131, 170, 205, .09);
    border: 1px solid rgba(131, 170, 205, .11);
    border-radius: 13px;
}

body.panel-app.panel-design-system .efi-fee-formula>div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 13px;
    background: #091b2b;
}

body.panel-app.panel-design-system .efi-fee-formula span {
    color: #879caf;
    font-size: 10px;
}

body.panel-app.panel-design-system .efi-fee-formula strong {
    color: #e6eef4;
    font-size: 11px;
    white-space: nowrap;
}

body.panel-app.panel-design-system .efi-fee-formula .is-total {
    background: rgba(60, 210, 152, .075);
}

body.panel-app.panel-design-system .efi-fee-formula .is-total span,
body.panel-app.panel-design-system .efi-fee-formula .is-total strong {
    color: #70ddb1;
    font-weight: 900;
}

body.panel-app.panel-design-system .efi-payment-breakdown-list {
    display: grid;
    gap: 10px;
    margin-top: 16px;
}

body.panel-app.panel-design-system .efi-payment-breakdown-row {
    display: grid;
    grid-template-columns: minmax(220px, .75fr) minmax(450px, 1.25fr);
    align-items: center;
    gap: 18px;
    padding: 14px;
    background: rgba(3, 17, 30, .45);
    border: 1px solid rgba(131, 170, 205, .1);
    border-radius: 13px;
}

body.panel-app.panel-design-system .efi-payment-breakdown-main {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

/* Na auditoria de cobranças, o badge pertence à linha do pagamento.
   Remove o deslocamento vertical do status genérico e diferencia
   "Aguardando" de pagamentos efetivamente pagos. */
body.panel-app.panel-design-system .efi-payment-breakdown-main > .efi-standard-status {
    flex: 0 0 auto;
    align-self: center;
    margin-top: 0;
}

body.panel-app.panel-design-system .efi-payment-breakdown-main > .efi-standard-status.is-active {
    color: #ffd16a;
    background: rgba(255, 176, 0, 0.09);
    border-color: rgba(255, 176, 0, 0.24);
}

body.panel-app.panel-design-system .efi-payment-breakdown-main>div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

body.panel-app.panel-design-system .efi-payment-breakdown-main strong {
    overflow: hidden;
    color: #edf3f7;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .efi-payment-breakdown-main small {
    overflow: hidden;
    color: #7d92a7;
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .efi-payment-breakdown-values {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
    margin: 0;
}

body.panel-app.panel-design-system .efi-payment-breakdown-values>div {
    padding: 9px 10px;
    background: rgba(8, 28, 45, .72);
    border-radius: 9px;
}

body.panel-app.panel-design-system .efi-payment-breakdown-values dt {
    margin-bottom: 3px;
    color: #748ba1;
    font-size: 8px;
}

body.panel-app.panel-design-system .efi-payment-breakdown-values dd {
    margin: 0;
    color: #dce7ee;
    font-size: 10px;
    font-weight: 900;
    white-space: nowrap;
}

body.panel-app.panel-design-system .efi-payment-breakdown-values .is-net {
    background: rgba(60, 210, 152, .07);
}

body.panel-app.panel-design-system .efi-payment-breakdown-values .is-net dt,
body.panel-app.panel-design-system .efi-payment-breakdown-values .is-net dd {
    color: #68dcae;
}

@media (max-width: 1150px) {
    body.panel-app.panel-design-system .efi-fee-settings-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .efi-payment-breakdown-row {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 800px) {

    body.panel-app.panel-design-system .efi-fee-form-grid,
    body.panel-app.panel-design-system .efi-payment-breakdown-values {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {

    body.panel-app.panel-design-system .efi-fee-form-grid,
    body.panel-app.panel-design-system .efi-fee-preview-grid,
    body.panel-app.panel-design-system .efi-payment-breakdown-values {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .efi-payment-breakdown-main {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* ==========================================================================
   Módulo consolidado: guardian-family-dashboard.css
   ========================================================================== */
/* ========================================================================== 
   PAINEL DA FAMÍLIA V2
   Navegação por aluno + visão exclusiva da rota ativa
   ========================================================================== */
body.panel-role-guardian .guardian-v2-page {
    display: grid;
    gap: 18px;
    min-width: 0;
}

body.panel-role-guardian .guardian-v2-page *,
body.panel-role-guardian .guardian-v2-page *::before,
body.panel-role-guardian .guardian-v2-page *::after {
    box-sizing: border-box;
}

body.panel-role-guardian .guardian-v2-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-width: 0;
    padding: 28px 30px;
    overflow: hidden;
}

body.panel-role-guardian .guardian-v2-hero>div {
    min-width: 0;
}

body.panel-role-guardian .guardian-v2-hero h2 {
    margin: 6px 0 7px;
    color: #fff;
    font-size: clamp(23px, 2.3vw, 34px);
    line-height: 1.12;
}

body.panel-role-guardian .guardian-v2-hero p {
    max-width: 760px;
    margin: 0;
    color: #9caec1;
    font-size: 13px;
    line-height: 1.65;
}

body.panel-role-guardian .guardian-v2-selector,
body.panel-role-guardian .guardian-v2-route-overview,
body.panel-role-guardian .guardian-v2-route-family,
body.panel-role-guardian .guardian-v2-panel,
body.panel-role-guardian .guardian-v2-notice {
    min-width: 0;
    border: 1px solid rgba(149, 174, 201, .13);
    border-radius: 18px;
    background: linear-gradient(145deg, rgba(18, 39, 60, .98), rgba(10, 26, 43, .98));
    box-shadow: 0 18px 40px rgba(0, 0, 0, .12);
}

body.panel-role-guardian .guardian-v2-selector {
    padding: 18px;
}

body.panel-role-guardian .guardian-v2-selector-heading {
    margin-bottom: 13px;
}

body.panel-role-guardian .guardian-v2-selector-heading h3,
body.panel-role-guardian .guardian-v2-route-overview-heading h3,
body.panel-role-guardian .guardian-v2-panel h3,
body.panel-role-guardian .guardian-v2-route-family h3 {
    margin: 4px 0 0;
    color: #fff;
    font-size: 16px;
    line-height: 1.3;
}

body.panel-role-guardian .guardian-v2-family-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 34px;
    padding: 0 11px;
    color: #b9c7d7;
    background: rgba(149, 174, 201, .07);
    border: 1px solid rgba(149, 174, 201, .14);
    line-height: 1;
}

body.panel-role-guardian .guardian-v2-breadcrumbs {
    display: flex;
    align-items: stretch;
    gap: 10px;
    width: 100%;
    min-width: 0;
    overflow-x: auto;
    padding: 2px 2px 8px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 176, 0, .32) transparent;
}

body.panel-role-guardian .guardian-v2-family-tab {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(145px, 1fr) auto;
    align-items: center;
    gap: 10px;
    flex: 0 0 clamp(230px, 25vw, 320px);
    min-width: 0;
    min-height: 74px;
    padding: 11px 12px;
    color: inherit;
    text-decoration: none;
    border: 1px solid rgba(149, 174, 201, .12);
    border-radius: 14px;
    background: rgba(4, 18, 32, .48);
    transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

body.panel-role-guardian .guardian-v2-family-tab:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 176, 0, .25);
    background: rgba(255, 176, 0, .045);
}

body.panel-role-guardian .guardian-v2-family-tab.is-active {
    border-color: rgba(255, 176, 0, .55);
    background: linear-gradient(145deg, rgba(255, 176, 0, .11), rgba(255, 176, 0, .035));
    box-shadow: 0 10px 25px rgba(0, 0, 0, .13), inset 3px 0 0 #ffb000;
}

body.panel-role-guardian .guardian-v2-family-tab-avatar,
body.panel-role-guardian .guardian-v2-family-tab-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 12px;
    color: #07111d;
    background: linear-gradient(135deg, #ffb000, #ffc94c);
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
}

body.panel-role-guardian .guardian-v2-family-tab--route .guardian-v2-family-tab-icon {
    color: #55e0b5;
    background: rgba(55, 211, 160, .11);
    border: 1px solid rgba(55, 211, 160, .2);
}

body.panel-role-guardian .guardian-v2-family-tab-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
}

body.panel-role-guardian .guardian-v2-family-tab-copy small {
    color: #7e91a7;
    font-size: 8px;
    font-weight: 850;
    letter-spacing: .08em;
    line-height: 1.2;
    text-transform: uppercase;
}

body.panel-role-guardian .guardian-v2-family-tab-copy strong {
    min-width: 0;
    overflow: hidden;
    color: #fff;
    font-size: 12px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-role-guardian .guardian-v2-family-tab-copy>span {
    min-width: 0;
    overflow: hidden;
    color: #8798ab;
    font-size: 9px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-role-guardian .guardian-v2-family-tab .guardian-family-student-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    max-width: 92px;
    min-height: 28px;
    padding: 0 8px;
    color: #93a4b7;
    background: rgba(149, 174, 201, .07);
    border: 1px solid rgba(149, 174, 201, .12);
    border-radius: 999px;
    font-size: 7px;
    font-weight: 850;
    line-height: 1.15;
    text-align: center;
}

body.panel-role-guardian .guardian-v2-family-tab .guardian-family-student-status.active,
body.panel-role-guardian .guardian-v2-family-tab .guardian-family-student-status.completed {
    color: #67dfb7;
    background: rgba(55, 211, 160, .08);
    border-color: rgba(55, 211, 160, .18);
}

body.panel-role-guardian .guardian-v2-live-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #42d9a9;
    box-shadow: 0 0 0 0 rgba(66, 217, 169, .45);
    animation: guardian-v2-pulse 1.8s infinite;
}

@keyframes guardian-v2-pulse {
    70% {
        box-shadow: 0 0 0 8px rgba(66, 217, 169, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(66, 217, 169, 0);
    }
}

body.panel-role-guardian .guardian-v2-student-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 14px;
    min-width: 0;
    padding: 17px 18px;
    border-color: rgba(255, 176, 0, .18);
}

body.panel-role-guardian .guardian-v2-student-identity {
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
}

body.panel-role-guardian .guardian-v2-student-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    color: #07111d;
    background: linear-gradient(135deg, #ffb000, #ffc94c);
    border-radius: 14px;
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 10px 22px rgba(255, 176, 0, .15);
}

body.panel-role-guardian .guardian-v2-student-identity>div {
    min-width: 0;
}

body.panel-role-guardian .guardian-v2-student-identity h2 {
    margin: 3px 0;
    overflow: hidden;
    color: #fff;
    font-size: 18px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-role-guardian .guardian-v2-student-identity p {
    margin: 0;
    overflow: hidden;
    color: #8496aa;
    font-size: 10px;
    line-height: 1.4;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-role-guardian .guardian-v2-student-actions {
    flex-wrap: nowrap;
}

body.panel-role-guardian .guardian-v2-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

body.panel-role-guardian .guardian-v2-summary .ui-stat-card {
    min-height: 104px;
}

body.panel-role-guardian .guardian-v2-summary .ui-stat-card>div {
    min-width: 0;
}

body.panel-role-guardian .guardian-v2-summary strong,
body.panel-role-guardian .guardian-v2-summary span,
body.panel-role-guardian .guardian-v2-summary small {
    display: block;
}

body.panel-role-guardian .guardian-v2-summary strong {
    margin: 3px 0;
    overflow-wrap: anywhere;
}

body.panel-role-guardian .guardian-v2-route-overview {
    padding: 18px;
}

body.panel-role-guardian .guardian-v2-route-overview-heading {
    align-items: flex-start;
    margin-bottom: 14px;
}

body.panel-role-guardian .guardian-v2-route-overview-heading p {
    margin: 5px 0 0;
    color: #8798ab;
    font-size: 10px;
}

body.panel-role-guardian .guardian-v2-route-switcher {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 7px;
}

body.panel-role-guardian .guardian-v2-route-switcher a {
    padding: 8px 10px;
    color: #9caec1;
    text-decoration: none;
    border: 1px solid rgba(149, 174, 201, .13);
    border-radius: 9px;
    background: rgba(4, 18, 32, .42);
    font-size: 9px;
    font-weight: 800;
}

body.panel-role-guardian .guardian-v2-route-switcher a.is-active {
    color: #07111d;
    border-color: #ffb000;
    background: #ffb000;
}

body.panel-role-guardian .guardian-v2-route-students {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 9px;
}

body.panel-role-guardian .guardian-v2-route-students a {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 10px;
    color: inherit;
    text-decoration: none;
    border: 1px solid rgba(149, 174, 201, .11);
    border-radius: 12px;
    background: rgba(4, 18, 32, .36);
}

body.panel-role-guardian .guardian-v2-route-students a>span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    color: #07111d;
    background: #ffb000;
    font-size: 10px;
    font-weight: 900;
}

body.panel-role-guardian .guardian-v2-route-students a>div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

body.panel-role-guardian .guardian-v2-route-students strong,
body.panel-role-guardian .guardian-v2-route-students small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-role-guardian .guardian-v2-route-students strong {
    color: #fff;
    font-size: 10px;
}

body.panel-role-guardian .guardian-v2-route-students small {
    color: #8293a8;
    font-size: 8px;
}

body.panel-role-guardian .guardian-v2-route-students i {
    color: #708399;
    font-size: 9px;
}

body.panel-role-guardian .guardian-v2-tracking-card {
    min-width: 0;
    overflow: hidden;
}

body.panel-role-guardian .guardian-v2-tracking-heading {
    padding: 18px 20px;
    border-bottom: 1px solid rgba(149, 174, 201, .1);
}

body.panel-role-guardian .guardian-v2-tracking-card .guardian-tracking-stage {
    min-width: 0;
}

body.panel-role-guardian .guardian-v2-tracking-card .guardian-live-map,
body.panel-role-guardian .guardian-v2-tracking-card .guardian-tracking-placeholder {
    width: 100%;
    max-width: 100%;
}

body.panel-role-guardian .guardian-v2-empty {
    display: grid;
    justify-items: center;
    align-content: center;
    gap: 7px;
    min-height: 205px;
    padding: 30px 20px;
    color: #7f91a6;
    text-align: center;
}

body.panel-role-guardian .guardian-v2-empty--compact {
    min-height: 160px;
}

body.panel-role-guardian .guardian-v2-empty-page {
    min-height: 480px;
    border: 1px dashed rgba(149, 174, 201, .17);
    border-radius: 20px;
}

body.panel-role-guardian .guardian-v2-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    color: #7d8ea2;
    background: rgba(149, 174, 201, .07);
    border: 1px solid rgba(149, 174, 201, .11);
    border-radius: 15px;
    font-size: 20px;
}

body.panel-role-guardian .guardian-v2-empty strong,
body.panel-role-guardian .guardian-v2-empty h2 {
    margin: 0;
    color: #d7e0ea;
    font-size: 14px;
}

body.panel-role-guardian .guardian-v2-empty p {
    max-width: 520px;
    margin: 0;
    color: #7f91a6;
    font-size: 10px;
    line-height: 1.55;
}

body.panel-role-guardian .guardian-v2-notice {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 13px;
    padding: 15px 16px;
}

body.panel-role-guardian .guardian-v2-notice>span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: #ffbd2e;
    background: rgba(255, 176, 0, .09);
    border: 1px solid rgba(255, 176, 0, .16);
    border-radius: 11px;
}

body.panel-role-guardian .guardian-v2-notice>div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

body.panel-role-guardian .guardian-v2-notice small {
    color: #8293a8;
    font-size: 8px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

body.panel-role-guardian .guardian-v2-notice strong {
    color: #fff;
    font-size: 12px;
}

body.panel-role-guardian .guardian-v2-notice p {
    margin: 0;
    color: #8da0b4;
    font-size: 9px;
    line-height: 1.45;
}

body.panel-role-guardian .guardian-v2-lower-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(330px, .85fr);
    align-items: start;
    gap: 14px;
}

body.panel-role-guardian .guardian-v2-panel {
    padding: 18px;
}

body.panel-role-guardian .guardian-v2-fees-list {
    display: grid;
    gap: 7px;
    margin-top: 13px;
}

body.panel-role-guardian .guardian-v2-fee-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 10px;
    color: inherit;
    text-decoration: none;
    border: 1px solid rgba(149, 174, 201, .1);
    border-radius: 11px;
    background: rgba(4, 18, 32, .38);
}

body.panel-role-guardian .guardian-v2-fee-row>span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    color: #ffb000;
    background: rgba(255, 176, 0, .08);
    border-radius: 9px;
}

body.panel-role-guardian .guardian-v2-fee-row>div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

body.panel-role-guardian .guardian-v2-fee-row strong {
    color: #fff;
    font-size: 10px;
}

body.panel-role-guardian .guardian-v2-fee-row small {
    color: #8293a8;
    font-size: 8px;
}

body.panel-role-guardian .guardian-v2-fee-row b {
    color: #fff;
    font-size: 10px;
    white-space: nowrap;
}

body.panel-role-guardian .guardian-v2-fee-row em {
    font-style: normal;
}

body.panel-role-guardian .guardian-v2-driver-profile {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 15px 0 13px;
    padding: 12px;
    border: 1px solid rgba(149, 174, 201, .1);
    border-radius: 12px;
    background: rgba(4, 18, 32, .36);
}

body.panel-role-guardian .guardian-v2-driver-profile>div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

body.panel-role-guardian .guardian-v2-driver-profile strong {
    overflow: hidden;
    color: #fff;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-role-guardian .guardian-v2-driver-profile>div>span {
    color: #8293a8;
    font-size: 9px;
}

body.panel-role-guardian .guardian-v2-driver-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

body.panel-role-guardian .guardian-v2-driver-grid>div {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 10px;
    border: 1px solid rgba(149, 174, 201, .1);
    border-radius: 10px;
    background: rgba(255, 255, 255, .02);
}

body.panel-role-guardian .guardian-v2-driver-grid span {
    color: #8293a8;
    font-size: 8px;
}

body.panel-role-guardian .guardian-v2-driver-grid span i {
    width: 15px;
    color: #ffb000;
    text-align: center;
}

body.panel-role-guardian .guardian-v2-driver-grid strong {
    min-width: 0;
    overflow-wrap: anywhere;
    color: #fff;
    font-size: 10px;
    line-height: 1.35;
}

body.panel-role-guardian .guardian-v2-driver-contact {
    width: 100%;
    margin-top: 12px;
}

body.panel-role-guardian .guardian-v2-route-family {
    padding: 18px;
}

body.panel-role-guardian .guardian-v2-route-family-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 10px;
    margin-top: 13px;
}

body.panel-role-guardian .guardian-v2-route-family-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 12px;
}

body.panel-role-guardian .guardian-v2-route-family-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: #ffb000;
    background: rgba(255, 176, 0, .08);
    border-radius: 11px;
}

body.panel-role-guardian .guardian-v2-route-family-card>div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

body.panel-role-guardian .guardian-v2-route-family-card>div strong,
body.panel-role-guardian .guardian-v2-route-family-card>div span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-role-guardian .guardian-v2-route-family-card>div strong {
    color: #fff;
    font-size: 10px;
}

body.panel-role-guardian .guardian-v2-route-family-card>div span {
    color: #8293a8;
    font-size: 8px;
}

body.panel-role-guardian .guardian-v2-route-family-card .ui-button {
    grid-column: 2 / -1;
    justify-self: start;
}

@media (max-width: 1120px) {
    body.panel-role-guardian .guardian-v2-student-hero {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    body.panel-role-guardian .guardian-v2-student-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    body.panel-role-guardian .guardian-v2-lower-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 820px) {
    body.panel-role-guardian .guardian-v2-page {
        gap: 13px;
    }

    body.panel-role-guardian .guardian-v2-hero {
        align-items: flex-start;
        padding: 20px;
    }

    body.panel-role-guardian .guardian-v2-summary {
        grid-template-columns: 1fr;
    }

    body.panel-role-guardian .guardian-v2-summary .ui-stat-card {
        min-height: 88px;
    }

    body.panel-role-guardian .guardian-v2-route-overview-heading {
        display: grid;
        gap: 12px;
    }

    body.panel-role-guardian .guardian-v2-route-switcher {
        justify-content: flex-start;
    }

    body.panel-role-guardian .guardian-v2-notice {
        grid-template-columns: auto minmax(0, 1fr);
    }

    body.panel-role-guardian .guardian-v2-notice .ui-button {
        grid-column: 1 / -1;
        width: 100%;
    }
}

@media (max-width: 620px) {
    body.panel-role-guardian .guardian-v2-hero {
        display: grid;
        gap: 15px;
        padding: 17px;
    }

    body.panel-role-guardian .guardian-v2-hero .ui-button {
        width: 100%;
    }

    body.panel-role-guardian .guardian-v2-selector,
    body.panel-role-guardian .guardian-v2-route-overview,
    body.panel-role-guardian .guardian-v2-route-family,
    body.panel-role-guardian .guardian-v2-panel {
        padding: 14px;
        border-radius: 15px;
    }

    body.panel-role-guardian .guardian-v2-selector-heading {
        align-items: flex-start;
    }

    body.panel-role-guardian .guardian-v2-family-tab {
        flex-basis: min(84vw, 300px);
        grid-template-columns: auto minmax(0, 1fr);
    }

    body.panel-role-guardian .guardian-v2-family-tab .guardian-family-student-status,
    body.panel-role-guardian .guardian-v2-family-tab .guardian-v2-live-dot {
        grid-column: 2;
        justify-self: start;
    }

    body.panel-role-guardian .guardian-v2-student-hero {
        grid-template-columns: 1fr;
        align-items: flex-start;
        padding: 14px;
    }

    body.panel-role-guardian .guardian-v2-student-hero>.guardian-transport-status {
        justify-self: start;
    }

    body.panel-role-guardian .guardian-v2-student-actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

    body.panel-role-guardian .guardian-v2-student-actions .ui-button {
        width: 100%;
    }

    body.panel-role-guardian .guardian-v2-tracking-heading {
        align-items: flex-start;
        padding: 14px;
    }

    body.panel-role-guardian .guardian-v2-tracking-card .guardian-tracking-status {
        grid-template-columns: auto minmax(0, 1fr);
    }

    body.panel-role-guardian .guardian-v2-tracking-card .guardian-refresh-button {
        grid-column: 1 / -1;
        width: 100%;
    }

    body.panel-role-guardian .guardian-v2-fee-row {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    body.panel-role-guardian .guardian-v2-fee-row em {
        grid-column: 2 / -1;
        justify-self: start;
    }

    body.panel-role-guardian .guardian-v2-driver-grid {
        grid-template-columns: 1fr;
    }

    body.panel-role-guardian .guardian-v2-route-family-card {
        grid-template-columns: auto minmax(0, 1fr);
    }

    body.panel-role-guardian .guardian-v2-route-family-card>.ui-badge {
        grid-column: 2;
        justify-self: start;
    }
}

@media (max-width: 380px) {
    body.panel-role-guardian .guardian-v2-family-tab {
        flex-basis: 88vw;
    }

    body.panel-role-guardian .guardian-v2-family-tab-copy strong {
        font-size: 11px;
    }

    body.panel-role-guardian .guardian-v2-route-details {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================================
   Módulo consolidado: guardian-monthly-fees-alignment.css
   ========================================================================== */
/* ========================================================================== 
   MENSALIDADES DO RESPONSÁVEL | alinhamento da referência
   ========================================================================== */
body.panel-role-guardian .guardian-reference-current {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 11px !important;
    line-height: 1 !important;
    vertical-align: middle !important;
}

body.panel-role-guardian .guardian-reference-current>i,
body.panel-role-guardian .guardian-reference-current>span {
    display: inline-flex !important;
    align-items: center !important;
    height: 100% !important;
    margin: 0 !important;
    line-height: 1 !important;
}

body.panel-role-guardian .guardian-reference-filter {
    display: grid !important;
    gap: 6px !important;
    min-width: 0 !important;
}

body.panel-role-guardian .guardian-reference-filter-label {
    position: static !important;
    display: block !important;
    margin: 0 !important;
    color: var(--text-muted, #8290a5) !important;
    font-size: 9px !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
    letter-spacing: .07em !important;
    text-transform: uppercase !important;
    pointer-events: auto !important;
}

body.panel-role-guardian .guardian-reference-filter-control {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
}

body.panel-role-guardian .guardian-reference-filter-control>i:first-child {
    position: absolute !important;
    left: 13px !important;
    top: 50% !important;
    z-index: 2 !important;
    color: var(--primary-yellow, #ffb000) !important;
    font-size: 12px !important;
    transform: translateY(-50%) !important;
    pointer-events: none !important;
}

body.panel-role-guardian .guardian-reference-filter-control select {
    display: block !important;
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 0 40px 0 42px !important;
    color: var(--white, #fff) !important;
    background: rgba(5, 18, 33, .82) !important;
    border: 1px solid rgba(149, 174, 201, .12) !important;
    border-radius: 11px !important;
    outline: 0 !important;
    font: inherit !important;
    font-size: 12px !important;
    font-weight: 750 !important;
    line-height: 48px !important;
    text-indent: 0 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    cursor: pointer !important;
}

body.panel-role-guardian .guardian-reference-filter-control select:focus {
    background: rgba(5, 18, 33, .94) !important;
    border-color: rgba(255, 176, 0, .42) !important;
    box-shadow: 0 0 0 3px rgba(255, 176, 0, .08) !important;
}

body.panel-role-guardian .guardian-reference-filter-chevron {
    position: absolute !important;
    right: 14px !important;
    top: 50% !important;
    color: #74869b !important;
    font-size: 10px !important;
    transform: translateY(-50%) !important;
    pointer-events: none !important;
}

@media (max-width: 760px) {
    body.panel-role-guardian .guardian-reference-current {
        height: 36px !important;
        min-height: 36px !important;
        font-size: 11px !important;
    }

    body.panel-role-guardian .guardian-reference-filter-control select {
        height: 50px !important;
        min-height: 50px !important;
        line-height: 50px !important;
        font-size: 13px !important;
    }
}

/* ==========================================================================
   Módulo consolidado: guardian-monthly-fees-reference.css
   ========================================================================== */
/*
 * Mensalidades do responsável: alinhamento do badge de referência e do
 * seletor de competência. Arquivo isolado para não alterar outros formulários.
 */
body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-fees-section-tools {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    min-height: 38px;
}

body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-fees-toolbar-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    min-width: 0;
    height: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    color: var(--ui-text-soft, #9eb0c4) !important;
    background: rgba(255, 255, 255, .045) !important;
    border: 1px solid var(--ui-border, rgba(149, 174, 201, .14)) !important;
    border-radius: 11px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: .02em !important;
    text-transform: none !important;
    white-space: nowrap;
    box-sizing: border-box;
}

body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-fees-toolbar-badge--reference {
    color: #ffd46a !important;
    background: rgba(255, 176, 0, .08) !important;
    border-color: rgba(255, 176, 0, .22) !important;
}

body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-fees-toolbar-badge>i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 13px;
    height: 13px;
    margin: 0 !important;
    font-size: 11px !important;
    line-height: 1 !important;
}

body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-fees-toolbar-badge>span {
    display: block;
    margin: 0;
    line-height: 1 !important;
}

/* A barra usa flex no design system. Estas bases preservam a proporção correta. */
body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-monthly-fees-filter--reference>.students-search-field {
    flex: 1 1 360px !important;
}

body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-monthly-fees-filter--reference>.guardian-reference-filter {
    flex: 0 1 310px !important;
}

body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-reference-filter {
    position: relative !important;
    display: block !important;
    width: 100%;
    min-width: 240px;
    height: 50px !important;
    min-height: 50px !important;
    margin: 0 !important;
    overflow: hidden !important;
    color: var(--ui-text-soft, #9eb0c4);
    background: rgba(2, 12, 25, .68) !important;
    border: 1px solid var(--ui-border, rgba(149, 174, 201, .14)) !important;
    border-radius: 11px !important;
    box-sizing: border-box;
    transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-reference-filter:focus-within {
    background: rgba(2, 12, 25, .88) !important;
    border-color: rgba(255, 176, 0, .52) !important;
    box-shadow: 0 0 0 3px rgba(255, 176, 0, .09) !important;
}

body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-reference-filter__icon,
body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-reference-filter__chevron {
    position: absolute !important;
    z-index: 3 !important;
    top: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    line-height: 1 !important;
    transform: translateY(-50%) !important;
    pointer-events: none !important;
}

body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-reference-filter__icon {
    left: 14px !important;
    width: 15px !important;
    height: 15px !important;
    color: var(--ui-primary, #ffb000) !important;
    font-size: 12px !important;
}

body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-reference-filter__chevron {
    right: 14px !important;
    width: 12px !important;
    height: 12px !important;
    color: #6f86a3 !important;
    font-size: 9px !important;
}

body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-reference-filter__label {
    position: absolute !important;
    z-index: 2 !important;
    top: 7px !important;
    left: 42px !important;
    right: 38px;
    display: block !important;
    margin: 0 !important;
    overflow: hidden;
    color: var(--ui-text-muted, #8290a5) !important;
    font-size: 8px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: .08em !important;
    text-overflow: ellipsis;
    text-transform: uppercase !important;
    white-space: nowrap;
    pointer-events: none !important;
}

body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-reference-filter__select {
    position: absolute !important;
    z-index: 1 !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 17px 39px 2px 42px !important;
    overflow: hidden;
    color: var(--ui-text, #f5f7fa) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 750 !important;
    line-height: 30px !important;
    text-overflow: ellipsis;
    white-space: nowrap;
    appearance: none !important;
    cursor: pointer;
    box-sizing: border-box;
}

body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-reference-filter__select option {
    color: #f5f7fa !important;
    background: #071526 !important;
}

@media (max-width: 1060px) {
    body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-monthly-fees-filter--reference>.guardian-reference-filter {
        flex: 1 1 250px !important;
    }
}

@media (max-width: 760px) {
    body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-fees-section-tools {
        width: 100%;
        justify-content: flex-start !important;
    }

    body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-fees-toolbar-badge {
        flex: 0 0 auto;
    }

    body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-monthly-fees-filter--reference>.students-search-field,
    body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-monthly-fees-filter--reference>.guardian-reference-filter,
    body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-monthly-fees-filter--reference>.student-filter-button,
    body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-monthly-fees-filter--reference>.student-clear-filter {
        flex: 1 1 100% !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    body.panel-role-guardian.panel-route-panel-guardian-monthly-fees-index .guardian-reference-filter__select {
        font-size: 13px !important;
    }
}

/* ==========================================================================
   Módulo consolidado: marketplace-enrollment-confirmation.css
   ========================================================================== */
/* ==========================================================================
   MODAL DE APROVAÇÃO FINAL DO CADASTRO NO MARKETPLACE
   Arquivo com quebras de linha reais e seletores independentes da rota.
   ========================================================================== */
html body.panel-app.panel-design-system>.marketplace-enrollment-confirm-modal.ui-modal--viewport-root[data-ui-viewport-modal]>.marketplace-enrollment-confirm-modal__backdrop {
    border: 0 !important;
    cursor: default;
}

html body.panel-app.panel-design-system>.marketplace-enrollment-confirm-modal.ui-modal--viewport-root[data-ui-viewport-modal]>.marketplace-enrollment-confirm-modal__dialog {
    width: min(100%, 580px) !important;
    max-width: 580px !important;
    padding: 30px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__close {
    position: absolute !important;
    top: 15px !important;
    right: 15px !important;
    z-index: 10 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #9eb0c4 !important;
    background: rgba(255, 255, 255, 0.035) !important;
    border: 1px solid rgba(149, 174, 201, 0.14) !important;
    border-radius: 11px !important;
    box-shadow: none !important;
    font-size: 13px !important;
    line-height: 1 !important;
    cursor: pointer;
    transition:
        color 180ms ease,
        background 180ms ease,
        border-color 180ms ease,
        transform 180ms ease !important;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__close:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.075) !important;
    border-color: rgba(149, 174, 201, 0.24) !important;
    transform: translateY(-1px) !important;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__icon {
    margin-bottom: 11px !important;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__kicker {
    display: block !important;
    width: 100%;
    margin: 0 0 8px !important;
    color: var(--ui-primary, #ffb000) !important;
    font-size: 8px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    text-align: center !important;
    text-transform: uppercase;
    letter-spacing: 0.75px;
}

html body.panel-app.panel-design-system>.marketplace-enrollment-confirm-modal.ui-modal--viewport-root[data-ui-viewport-modal] .marketplace-enrollment-confirm-modal__dialog>h3 {
    max-width: 455px !important;
    margin: 0 auto 9px !important;
    font-size: 23px !important;
    line-height: 1.22 !important;
    text-align: center !important;
}

html body.panel-app.panel-design-system>.marketplace-enrollment-confirm-modal.ui-modal--viewport-root[data-ui-viewport-modal] .marketplace-enrollment-confirm-modal__dialog>p {
    max-width: 485px !important;
    margin: 0 auto !important;
    text-align: center !important;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__summary {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    gap: 10px !important;
    margin: 21px 0 0 !important;
    padding: 0 !important;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__summary>div {
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) !important;
    align-items: center !important;
    min-width: 0 !important;
    min-height: 64px !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 11px !important;
    text-align: left !important;
    background: rgba(2, 15, 29, 0.46) !important;
    border: 1px solid rgba(149, 174, 201, 0.11) !important;
    border-radius: 12px !important;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__summary>div>span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;
    color: var(--ui-primary, #ffb000) !important;
    background: rgba(255, 176, 0, 0.09) !important;
    border: 1px solid rgba(255, 176, 0, 0.16) !important;
    border-radius: 10px !important;
    font-size: 12px !important;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__summary>div>div {
    min-width: 0 !important;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__summary small,
html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__summary strong {
    display: block !important;
    width: 100%;
    margin-right: 0 !important;
    margin-left: 0 !important;
    text-align: left !important;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__summary small {
    color: #71869d !important;
    font-size: 7px !important;
    font-weight: 850 !important;
    text-transform: uppercase;
    letter-spacing: 0.45px;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__summary strong {
    margin-top: 4px !important;
    overflow: hidden;
    color: #ffffff !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__notice {
    display: grid !important;
    grid-template-columns: 36px minmax(0, 1fr) !important;
    align-items: center !important;
    width: 100% !important;
    gap: 10px !important;
    margin: 11px 0 0 !important;
    padding: 11px 12px !important;
    text-align: left !important;
    background: rgba(53, 208, 145, 0.055) !important;
    border: 1px solid rgba(53, 208, 145, 0.16) !important;
    border-radius: 12px !important;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__notice>i {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    color: #45d9a0 !important;
    background: rgba(53, 208, 145, 0.10) !important;
    border-radius: 10px !important;
}

html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__notice>p {
    max-width: none !important;
    margin: 0 !important;
    color: #91a8bd !important;
    font-size: 8px !important;
    line-height: 1.5 !important;
    text-align: left !important;
}

html body.panel-app.panel-design-system>.marketplace-enrollment-confirm-modal.ui-modal--viewport-root[data-ui-viewport-modal] .marketplace-enrollment-confirm-modal__actions {
    display: grid !important;
    grid-template-columns:
        minmax(0, 0.86fr) minmax(0, 1.14fr) !important;
    align-items: stretch !important;
    width: 100% !important;
    gap: 10px !important;
    margin: 19px 0 0 !important;
    padding: 0 !important;
}

html body.panel-app.panel-design-system>.marketplace-enrollment-confirm-modal.ui-modal--viewport-root[data-ui-viewport-modal] .marketplace-enrollment-confirm-modal__actions>form {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

html body.panel-app.panel-design-system>.marketplace-enrollment-confirm-modal.ui-modal--viewport-root[data-ui-viewport-modal] .marketplace-enrollment-confirm-modal__actions>.ui-button,
html body.panel-app.panel-design-system>.marketplace-enrollment-confirm-modal.ui-modal--viewport-root[data-ui-viewport-modal] .marketplace-enrollment-confirm-modal__actions>form>.ui-button {
    width: 100% !important;
    min-height: 46px !important;
    margin: 0 !important;
}

@media (max-width: 620px) {
    html body.panel-app.panel-design-system>.marketplace-enrollment-confirm-modal.ui-modal--viewport-root[data-ui-viewport-modal]>.marketplace-enrollment-confirm-modal__dialog {
        padding: 25px 17px 18px !important;
    }

    html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__summary {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body.panel-app.panel-design-system>.marketplace-enrollment-confirm-modal.ui-modal--viewport-root[data-ui-viewport-modal] .marketplace-enrollment-confirm-modal__actions {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__close {
        top: 11px !important;
        right: 11px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body.panel-app.panel-design-system .marketplace-enrollment-confirm-modal__close {
        transition: none !important;
    }
}

/* ==========================================================================
   Módulo consolidado: pix-payment-responsive.css
   ========================================================================== */
/* ========================================================================== 
   PAGAMENTO PIX | refinamento responsivo
   Carregado depois de panel.css para corrigir telas estreitas sem alterar
   o restante do painel.
   ========================================================================== */
body.panel-uses-pix,
body.panel-uses-pix .dashboard-layout,
body.panel-uses-pix .dashboard-main,
body.panel-uses-pix .dashboard-content {
    max-width: 100%;
    overflow-x: hidden;
    overflow-x: clip;
}

body.panel-uses-pix .pix-payment-page,
body.panel-uses-pix .pix-payment-page *,
body.panel-uses-pix .pix-payment-page *::before,
body.panel-uses-pix .pix-payment-page *::after {
    box-sizing: border-box;
}

body.panel-uses-pix .pix-payment-page,
body.panel-uses-pix .pix-payment-hero,
body.panel-uses-pix .pix-payment-indicators,
body.panel-uses-pix .pix-payment-panel,
body.panel-uses-pix .pix-payment-content-grid,
body.panel-uses-pix .pix-payment-qr-section,
body.panel-uses-pix .pix-payment-details-section {
    min-width: 0;
    max-width: 100%;
}

/* Indicadores: textos longos podem quebrar sem estourar o card. */
body.panel-uses-pix .pix-indicator-card>div {
    width: 100%;
    min-width: 0;
}

body.panel-uses-pix .pix-indicator-card strong,
body.panel-uses-pix .pix-indicator-status {
    max-width: 100%;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
}

body.panel-uses-pix .pix-indicator-status {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    width: fit-content;
    min-height: 30px;
    padding: 6px 10px;
    border: 1px solid rgba(255, 199, 85, .22);
    border-radius: 999px;
    background: rgba(255, 176, 0, .08);
    font-size: clamp(12px, 1.1vw, 15px);
    line-height: 1.25;
}

body.panel-uses-pix .pix-indicator-status.paid {
    border-color: rgba(67, 209, 158, .22);
    background: rgba(67, 209, 158, .08);
}

body.panel-uses-pix .pix-indicator-status.overdue {
    border-color: rgba(255, 129, 137, .22);
    background: rgba(255, 129, 137, .07);
}

body.panel-uses-pix .pix-indicator-status.cancelled {
    border-color: rgba(146, 163, 181, .18);
    background: rgba(146, 163, 181, .06);
}

/* Seções internas nunca podem extrapolar a coluna. */
body.panel-uses-pix .pix-payment-section-heading,
body.panel-uses-pix .pix-payment-section-heading>div,
body.panel-uses-pix .pix-payment-main-amount,
body.panel-uses-pix .pix-payment-details-list,
body.panel-uses-pix .pix-payment-copy-area,
body.panel-uses-pix .pix-payment-security-box,
body.panel-uses-pix .pix-payment-warning {
    min-width: 0;
    max-width: 100%;
}

body.panel-uses-pix .pix-payment-section-heading h4,
body.panel-uses-pix .pix-payment-details-list dd,
body.panel-uses-pix .pix-payment-security-box strong,
body.panel-uses-pix .pix-payment-security-box p,
body.panel-uses-pix .pix-payment-warning p {
    overflow-wrap: anywhere;
    word-break: normal;
}

body.panel-uses-pix .pix-payment-section-heading h4 {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
}

/* QR Code fluido. O canvas continua quadrado e centralizado. */
body.panel-uses-pix .pix-payment-qr-wrapper {
    width: min(100%, 330px);
    max-width: 100%;
    margin-inline: auto;
    padding: clamp(10px, 3vw, 18px);
    aspect-ratio: 1 / 1;
}

body.panel-uses-pix .pix-payment-qr-code {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
}

body.panel-uses-pix .pix-payment-qr-code img,
body.panel-uses-pix .pix-payment-qr-code canvas {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1;
    object-fit: contain;
}

body.panel-uses-pix .pix-payment-copy-area textarea {
    max-width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-all;
}

/* Tablets: duas colunas de indicadores, conteúdo principal em uma coluna. */
@media (max-width: 1180px) {
    body.panel-uses-pix .pix-payment-content-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

@media (max-width: 760px) {
    body.panel-uses-pix .dashboard-content {
        padding: 16px 12px 30px;
    }

    body.panel-uses-pix .pix-payment-page {
        gap: 12px;
    }

    body.panel-uses-pix .pix-payment-hero {
        gap: 16px;
        padding: 19px 17px;
        border-radius: 18px;
    }

    body.panel-uses-pix .pix-payment-hero h2 {
        font-size: clamp(21px, 6vw, 25px);
    }

    body.panel-uses-pix .pix-payment-hero p {
        margin-top: 8px;
        font-size: 12px;
        line-height: 1.55;
    }

    body.panel-uses-pix .pix-payment-back-button {
        min-height: 44px;
    }

    body.panel-uses-pix .pix-payment-indicators {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    body.panel-uses-pix .pix-indicator-card {
        align-items: flex-start;
        min-height: 100px;
        padding: 14px;
        gap: 11px;
    }

    body.panel-uses-pix .pix-indicator-icon {
        flex-basis: 39px;
        width: 39px;
        height: 39px;
        border-radius: 11px;
    }

    body.panel-uses-pix .pix-indicator-card div>span {
        font-size: 10px;
    }

    body.panel-uses-pix .pix-indicator-card strong {
        font-size: 15px;
        line-height: 1.25;
    }

    body.panel-uses-pix .pix-indicator-card small {
        font-size: 9px;
    }

    body.panel-uses-pix .pix-payment-panel {
        padding: 14px;
        border-radius: 18px;
    }

    body.panel-uses-pix .pix-payment-panel-header {
        gap: 10px;
        margin-bottom: 13px;
    }

    body.panel-uses-pix .pix-payment-panel-header h3 {
        font-size: 17px;
    }

    body.panel-uses-pix .pix-payment-result-badge {
        min-height: 28px;
        white-space: normal;
        text-align: center;
    }

    body.panel-uses-pix .pix-payment-content-grid {
        gap: 12px;
    }

    body.panel-uses-pix .pix-payment-qr-section,
    body.panel-uses-pix .pix-payment-details-section {
        width: 100%;
        padding: 16px;
        border-radius: 16px;
    }

    body.panel-uses-pix .pix-payment-section-heading {
        gap: 11px;
    }

    body.panel-uses-pix .pix-payment-section-heading>span {
        flex-basis: 39px;
        width: 39px;
        height: 39px;
    }

    body.panel-uses-pix .pix-payment-section-heading h4 {
        font-size: 15px;
        line-height: 1.3;
    }

    body.panel-uses-pix .pix-payment-main-amount {
        margin-top: 17px;
    }

    body.panel-uses-pix .pix-payment-main-amount strong {
        font-size: clamp(27px, 9vw, 36px);
    }

    body.panel-uses-pix .pix-payment-steps {
        gap: 8px;
        margin-top: 16px;
    }

    body.panel-uses-pix .pix-payment-steps>div {
        min-height: 47px;
        padding: 9px 10px;
    }

    body.panel-uses-pix .pix-payment-steps p {
        font-size: 10px;
    }

    body.panel-uses-pix .pix-payment-details-list {
        margin-top: 15px;
    }

    body.panel-uses-pix .pix-payment-details-list>div {
        grid-template-columns: minmax(88px, .75fr) minmax(0, 1.25fr);
        gap: 10px;
        min-height: 43px;
        padding: 9px 0;
    }

    body.panel-uses-pix .pix-payment-details-list dt {
        font-size: 10px;
    }

    body.panel-uses-pix .pix-payment-details-list dd {
        font-size: 11px;
    }
}

/* Celulares comuns. */
@media (max-width: 480px) {
    body.panel-uses-pix .dashboard-header {
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 7px !important;
        min-height: 72px;
        padding: 10px 9px !important;
    }

    body.panel-uses-pix .dashboard-header-left {
        gap: 8px !important;
        min-width: 0;
    }

    body.panel-uses-pix .dashboard-heading {
        min-width: 0;
    }

    body.panel-uses-pix .dashboard-heading h1 {
        max-width: none !important;
        margin: 0;
        font-size: 15px !important;
        line-height: 1.14 !important;
        white-space: normal;
        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none;
    }

    body.panel-uses-pix .dashboard-eyebrow {
        display: block !important;
        margin-bottom: 2px;
        font-size: 7px;
        line-height: 1.15;
    }

    body.panel-uses-pix .dashboard-header-actions {
        gap: 4px !important;
    }

    /* A busca não é essencial durante o pagamento e libera espaço no cabeçalho. */
    body.panel-uses-pix #panelSearchButton {
        display: none !important;
    }

    body.panel-uses-pix .mobile-menu-button,
    body.panel-uses-pix .header-action-button,
    body.panel-uses-pix .header-profile {
        flex: 0 0 38px !important;
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
    }

    body.panel-uses-pix .header-profile {
        padding: 4px !important;
    }

    body.panel-uses-pix .header-profile-avatar {
        flex-basis: 29px !important;
        width: 29px !important;
        height: 29px !important;
    }

    body.panel-uses-pix .dashboard-content {
        padding: 12px 9px 26px;
    }

    body.panel-uses-pix .pix-payment-hero {
        padding: 16px 14px;
    }

    body.panel-uses-pix .pix-payment-hero-kicker {
        font-size: 9px;
    }

    body.panel-uses-pix .pix-payment-hero h2 {
        font-size: 20px;
    }

    body.panel-uses-pix .pix-payment-hero p {
        font-size: 11px;
    }

    body.panel-uses-pix .pix-payment-indicators {
        grid-template-columns: 1fr;
    }

    body.panel-uses-pix .pix-indicator-card {
        display: grid;
        grid-template-columns: 42px minmax(0, 1fr);
        align-items: center;
        min-height: 82px;
        padding: 12px 13px;
    }

    body.panel-uses-pix .pix-indicator-card>div {
        gap: 3px;
    }

    body.panel-uses-pix .pix-indicator-card strong {
        font-size: 16px;
    }

    body.panel-uses-pix .pix-indicator-status {
        width: auto;
        max-width: 100%;
        min-height: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent !important;
        font-size: 15px;
        line-height: 1.28;
    }

    body.panel-uses-pix .pix-payment-panel {
        padding: 11px;
    }

    body.panel-uses-pix .pix-payment-panel-header {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-uses-pix .pix-payment-result-badge {
        width: fit-content;
        max-width: 100%;
    }

    body.panel-uses-pix .pix-payment-qr-section,
    body.panel-uses-pix .pix-payment-details-section {
        padding: 14px 12px;
    }

    body.panel-uses-pix .pix-payment-section-heading {
        align-items: flex-start;
    }

    body.panel-uses-pix .pix-payment-section-heading small {
        font-size: 8px;
        line-height: 1.25;
    }

    body.panel-uses-pix .pix-payment-section-heading h4 {
        font-size: 14px;
    }

    body.panel-uses-pix .pix-payment-qr-wrapper {
        width: min(100%, 295px);
        padding: 10px;
    }

    body.panel-uses-pix .pix-payment-steps {
        grid-template-columns: 1fr;
    }

    body.panel-uses-pix .pix-payment-details-list>div {
        grid-template-columns: minmax(78px, .72fr) minmax(0, 1.28fr);
    }

    body.panel-uses-pix .pix-payment-copy-area textarea {
        min-height: 78px;
        font-size: 9px;
    }

    body.panel-uses-pix .pix-payment-security-box,
    body.panel-uses-pix .pix-payment-warning {
        padding: 11px;
    }
}

/* Aparelhos muito estreitos: o cabeçalho e os dados viram uma coluna segura. */
@media (max-width: 360px) {
    body.panel-uses-pix .dashboard-header {
        padding-inline: 7px !important;
    }

    body.panel-uses-pix .dashboard-header-left {
        gap: 6px !important;
    }

    body.panel-uses-pix .dashboard-heading h1 {
        font-size: 13px !important;
        line-height: 1.12 !important;
    }

    body.panel-uses-pix .dashboard-eyebrow {
        font-size: 6.5px;
    }

    /* Em largura extrema, mantém apenas menu, título e avatar. */
    body.panel-uses-pix #panelNotificationButton,
    body.panel-uses-pix .panel-header-popover-wrap {
        display: none !important;
    }

    body.panel-uses-pix .mobile-menu-button,
    body.panel-uses-pix .header-profile {
        flex-basis: 36px !important;
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
    }

    body.panel-uses-pix .dashboard-content {
        padding-inline: 7px;
    }

    body.panel-uses-pix .pix-payment-hero,
    body.panel-uses-pix .pix-payment-panel {
        border-radius: 15px;
    }

    body.panel-uses-pix .pix-payment-hero {
        padding: 14px 12px;
    }

    body.panel-uses-pix .pix-payment-hero h2 {
        font-size: 18px;
    }

    body.panel-uses-pix .pix-payment-hero p {
        font-size: 10px;
    }

    body.panel-uses-pix .pix-indicator-card {
        grid-template-columns: 38px minmax(0, 1fr);
        padding: 11px;
    }

    body.panel-uses-pix .pix-indicator-icon {
        width: 36px;
        height: 36px;
        flex-basis: 36px;
    }

    body.panel-uses-pix .pix-payment-qr-section,
    body.panel-uses-pix .pix-payment-details-section {
        padding: 12px 10px;
        border-radius: 14px;
    }

    body.panel-uses-pix .pix-payment-section-heading>span {
        flex-basis: 36px;
        width: 36px;
        height: 36px;
    }

    body.panel-uses-pix .pix-payment-section-heading h4 {
        font-size: 13px;
    }

    body.panel-uses-pix .pix-payment-main-amount strong {
        font-size: 28px;
    }

    body.panel-uses-pix .pix-payment-details-list>div {
        grid-template-columns: minmax(0, 1fr);
        gap: 4px;
        padding-block: 8px;
    }

    body.panel-uses-pix .pix-payment-details-list dd {
        text-align: left;
    }

    body.panel-uses-pix .pix-payment-total-row dt,
    body.panel-uses-pix .pix-payment-total-row dd {
        font-size: 14px;
    }
}

/* ========================================================================== 
   AJUSTE FINAL | botão de retorno e status compacto
   ========================================================================== */
/* O retorno usa o mesmo botão primário amarelo do restante do painel. */
body.panel-app.panel-design-system.panel-uses-pix .pix-payment-back-button {
    position: relative;
    isolation: isolate;
    min-width: 190px;
    overflow: hidden;
    box-shadow: 0 12px 28px rgba(255, 176, 0, .22) !important;
}

body.panel-app.panel-design-system.panel-uses-pix .pix-payment-back-button::after {
    content: '';
    position: absolute;
    z-index: -1;
    top: -65%;
    left: -45%;
    width: 34%;
    height: 230%;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .38), transparent);
    transform: translateX(-240%) rotate(18deg);
    transition: transform .58s ease;
}

body.panel-app.panel-design-system.panel-uses-pix .pix-payment-back-button:hover::after,
body.panel-app.panel-design-system.panel-uses-pix .pix-payment-back-button:focus-visible::after {
    transform: translateX(520%) rotate(18deg);
}

body.panel-app.panel-design-system.panel-uses-pix .pix-payment-back-button i {
    transition: transform .2s ease;
}

body.panel-app.panel-design-system.panel-uses-pix .pix-payment-back-button:hover i {
    transform: translateX(-3px);
}

/* Evita que o texto de situação herde o título gigante dos cards estatísticos. */
body.panel-app.panel-design-system.panel-uses-pix .pix-indicator-card--status>div>strong.pix-indicator-status {
    display: block !important;
    width: auto !important;
    max-width: 100% !important;
    min-height: 0 !important;
    margin: 4px 0 3px !important;
    padding: 0 !important;
    overflow: hidden !important;
    color: #ffc457 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-size: clamp(14px, 1.08vw, 17px) !important;
    font-weight: 800 !important;
    line-height: 1.08 !important;
    letter-spacing: -.15px !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

body.panel-app.panel-design-system.panel-uses-pix .pix-indicator-card--status>div>strong.pix-indicator-status.paid {
    color: #54dcae !important;
}

body.panel-app.panel-design-system.panel-uses-pix .pix-indicator-card--status>div>strong.pix-indicator-status.overdue {
    color: #ff929b !important;
}

body.panel-app.panel-design-system.panel-uses-pix .pix-indicator-card--status>div>strong.pix-indicator-status.cancelled {
    color: #aab8ca !important;
}

body.panel-app.panel-design-system.panel-uses-pix .pix-indicator-card--status {
    gap: 13px !important;
}

@media (max-width: 760px) {
    body.panel-app.panel-design-system.panel-uses-pix .pix-payment-back-button {
        width: 100%;
        min-width: 0;
    }

    body.panel-app.panel-design-system.panel-uses-pix .pix-indicator-card--status>div>strong.pix-indicator-status {
        font-size: 14px !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
}

@media (max-width: 420px) {
    body.panel-app.panel-design-system.panel-uses-pix .pix-indicator-card--status>div>strong.pix-indicator-status {
        font-size: 13px !important;
        line-height: 1.16 !important;
    }
}

/* ==========================================================================
   Módulo consolidado: support-driver-show.css
   ========================================================================== */
/*
 * Detalhes do motorista no painel administrativo/suporte.
 * CSS isolado para não alterar as demais telas do projeto.
 */
.panel-app.panel-design-system .support-driver-show {
    display: grid;
    gap: 18px;
}

.panel-app.panel-design-system .support-driver-hero {
    min-height: 156px;
}

.panel-app.panel-design-system .support-driver-hero__content {
    position: relative;
    z-index: 2;
    max-width: 780px;
}

.panel-app.panel-design-system .support-driver-hero__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 9px;
    margin-top: 18px;
}

.panel-app.panel-design-system .support-driver-hero__meta>span:not(.support-driver-state) {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 31px;
    padding: 0 11px;
    color: var(--text-secondary);
    background: rgba(255, 255, 255, .035);
    border: 1px solid rgba(149, 174, 201, .11);
    border-radius: 999px;
    font-size: 8px;
    font-weight: 800;
}

.panel-app.panel-design-system .support-driver-hero__meta>span>i {
    color: var(--primary-yellow);
}

.panel-app.panel-design-system .support-driver-hero__icon {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    color: var(--primary-yellow);
    background: rgba(255, 176, 0, .09);
    border: 1px solid rgba(255, 176, 0, .23);
    border-radius: 16px;
    font-size: 20px;
    box-shadow: 0 14px 30px rgba(0, 0, 0, .16);
    animation: supportDriverHeroFloat 4.4s ease-in-out infinite;
}

@keyframes supportDriverHeroFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-5px);
    }
}

.panel-app.panel-design-system .support-driver-toolbar {
    justify-content: space-between;
    gap: 12px;
}

.panel-app.panel-design-system .support-driver-whatsapp-button,
.panel-app.panel-design-system .support-driver-success-button {
    color: #061a12;
    background: var(--green);
    border-color: transparent;
    box-shadow: 0 12px 25px rgba(53, 208, 145, .14);
}

.panel-app.panel-design-system .support-driver-whatsapp-button:hover:not(:disabled),
.panel-app.panel-design-system .support-driver-success-button:hover:not(:disabled) {
    color: #061a12;
    filter: brightness(1.05);
    transform: translateY(-2px);
}

.panel-app.panel-design-system .support-driver-primary-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.72fr) minmax(330px, .82fr);
    gap: 16px;
    align-items: stretch;
}

.panel-app.panel-design-system .support-driver-profile-card,
.panel-app.panel-design-system .support-driver-access-card,
.panel-app.panel-design-system .support-driver-list-panel,
.panel-app.panel-design-system .support-driver-schools-panel,
.panel-app.panel-design-system .support-driver-financial-panel {
    min-width: 0;
    overflow: hidden;
}

.panel-app.panel-design-system .support-driver-profile-card {
    padding: 22px;
}

.panel-app.panel-design-system .support-driver-profile-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 15px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(149, 174, 201, .10);
}

.panel-app.panel-design-system .support-driver-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 64px;
    width: 64px;
    height: 64px;
    color: #07111e;
    background: linear-gradient(145deg, #ffc233, var(--primary-yellow));
    border: 1px solid rgba(255, 206, 91, .62);
    border-radius: 19px;
    font-size: 19px;
    font-weight: 900;
    letter-spacing: -.5px;
    box-shadow: 0 14px 28px rgba(255, 176, 0, .13);
}

.panel-app.panel-design-system .support-driver-profile-title {
    min-width: 0;
}

.panel-app.panel-design-system .support-driver-profile-title h3 {
    margin-top: 4px;
    overflow: hidden;
    color: var(--white);
    font-size: clamp(17px, 2vw, 22px);
    font-weight: 850;
    letter-spacing: -.45px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.panel-app.panel-design-system .support-driver-profile-title p {
    margin-top: 6px;
    color: var(--text-secondary);
    font-size: 9px;
}

.panel-app.panel-design-system .support-driver-state {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 30px;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .2px;
    white-space: nowrap;
}

.panel-app.panel-design-system .support-driver-state--released {
    color: var(--green);
    background: var(--green-background);
    border-color: rgba(53, 208, 145, .22);
}

.panel-app.panel-design-system .support-driver-state--expiring {
    color: var(--orange);
    background: var(--orange-background);
    border-color: rgba(255, 159, 67, .24);
}

.panel-app.panel-design-system .support-driver-state--expired,
.panel-app.panel-design-system .support-driver-state--blocked {
    color: var(--red);
    background: var(--red-background);
    border-color: rgba(255, 107, 117, .24);
}

.panel-app.panel-design-system .support-driver-information-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding-top: 18px;
}

.panel-app.panel-design-system .support-driver-information-item {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
    min-height: 70px;
    padding: 13px;
    background: rgba(255, 255, 255, .024);
    border: 1px solid rgba(149, 174, 201, .085);
    border-radius: 14px;
    transition: border-color .22s ease, background .22s ease, transform .22s ease;
}

.panel-app.panel-design-system .support-driver-information-item:hover {
    background: rgba(255, 255, 255, .035);
    border-color: rgba(255, 176, 0, .16);
    transform: translateY(-2px);
}

.panel-app.panel-design-system .support-driver-information-item--wide {
    grid-column: span 2;
}

.panel-app.panel-design-system .support-driver-information-icon,
.panel-app.panel-design-system .support-driver-section-icon,
.panel-app.panel-design-system .support-driver-list-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    color: var(--primary-yellow);
    background: rgba(255, 176, 0, .085);
    border: 1px solid rgba(255, 176, 0, .12);
    border-radius: 11px;
}

.panel-app.panel-design-system .support-driver-information-item>div {
    min-width: 0;
}

.panel-app.panel-design-system .support-driver-information-item small,
.panel-app.panel-design-system .support-driver-information-item strong {
    display: block;
}

.panel-app.panel-design-system .support-driver-information-item small {
    color: var(--text-muted);
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .45px;
    text-transform: uppercase;
}

.panel-app.panel-design-system .support-driver-information-item strong {
    margin-top: 5px;
    overflow-wrap: anywhere;
    color: var(--text-primary);
    font-size: 9px;
    font-variant-numeric: tabular-nums;
    line-height: 1.45;
}

.panel-app.panel-design-system .support-driver-access-card {
    display: flex;
    flex-direction: column;
    padding: 21px;
}

.panel-app.panel-design-system .support-driver-section-header {
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    padding: 0;
    border: 0;
}

.panel-app.panel-design-system .support-driver-section-header>div {
    min-width: 0;
}

.panel-app.panel-design-system .support-driver-section-header h3 {
    margin-top: 3px;
}

.panel-app.panel-design-system .support-driver-section-header p {
    margin-top: 5px;
    color: var(--text-secondary);
    font-size: 8px;
    line-height: 1.55;
}

.panel-app.panel-design-system .support-driver-validity {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 18px 0;
    padding: 16px;
    background: rgba(255, 255, 255, .027);
    border: 1px solid rgba(149, 174, 201, .11);
    border-radius: 15px;
}

.panel-app.panel-design-system .support-driver-validity--released {
    border-color: rgba(53, 208, 145, .24);
}

.panel-app.panel-design-system .support-driver-validity--expiring {
    border-color: rgba(255, 159, 67, .26);
}

.panel-app.panel-design-system .support-driver-validity--expired,
.panel-app.panel-design-system .support-driver-validity--blocked {
    border-color: rgba(255, 107, 117, .26);
}

.panel-app.panel-design-system .support-driver-validity small,
.panel-app.panel-design-system .support-driver-validity strong {
    display: block;
}

.panel-app.panel-design-system .support-driver-validity small {
    color: var(--text-muted);
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .4px;
    text-transform: uppercase;
}

.panel-app.panel-design-system .support-driver-validity strong {
    margin-top: 6px;
    color: var(--white);
    font-size: 20px;
    font-variant-numeric: tabular-nums;
}

.panel-app.panel-design-system .support-driver-validity>span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--text-secondary);
    font-size: 7px;
    font-weight: 850;
    white-space: nowrap;
}

.panel-app.panel-design-system .support-driver-access-form {
    gap: 13px;
}

.panel-app.panel-design-system .support-driver-switch {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 61px;
    padding: 12px;
    color: var(--text-primary);
    background: rgba(255, 255, 255, .028);
    border: 1px solid rgba(149, 174, 201, .10);
    border-radius: 13px;
    cursor: pointer;
    transition: border-color .22s ease, background .22s ease, transform .22s ease;
}

.panel-app.panel-design-system .support-driver-switch:hover {
    background: rgba(255, 255, 255, .038);
    border-color: rgba(255, 176, 0, .17);
    transform: translateY(-1px);
}

.panel-app.panel-design-system .support-driver-switch input:not([type="hidden"]) {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.panel-app.panel-design-system .support-driver-switch__check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 19px;
    width: 19px;
    height: 19px;
    color: transparent;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(149, 174, 201, .16);
    border-radius: 4px;
    font-size: 10px;
    transition: .2s ease;
}

.panel-app.panel-design-system .support-driver-switch input:checked+.support-driver-switch__check {
    color: #07111e;
    background: var(--primary-yellow);
    border-color: var(--primary-yellow);
    box-shadow: 0 0 0 3px rgba(255, 176, 0, .09);
}

.panel-app.panel-design-system .support-driver-switch strong,
.panel-app.panel-design-system .support-driver-switch small {
    display: block;
}

.panel-app.panel-design-system .support-driver-switch strong {
    color: var(--text-primary);
    font-size: 8px;
}

.panel-app.panel-design-system .support-driver-switch small {
    margin-top: 4px;
    color: var(--text-muted);
    font-size: 7px;
}

.panel-app.panel-design-system .support-driver-full-button {
    width: 100%;
}

.panel-app.panel-design-system .support-driver-access-divider {
    height: 1px;
    margin: 16px 0;
    background: rgba(149, 174, 201, .10);
}

.panel-app.panel-design-system .support-driver-access-note,
.panel-app.panel-design-system .support-driver-readonly-note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 13px 0 0;
    padding: 11px 12px;
    color: var(--text-secondary);
    background: rgba(255, 176, 0, .045);
    border: 1px solid rgba(255, 176, 0, .11);
    border-radius: 12px;
    font-size: 7px;
    line-height: 1.55;
}

.panel-app.panel-design-system .support-driver-access-note i,
.panel-app.panel-design-system .support-driver-readonly-note i {
    margin-top: 2px;
    color: var(--primary-yellow);
}

.panel-app.panel-design-system .support-driver-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.panel-app.panel-design-system .support-driver-content-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.panel-app.panel-design-system .support-driver-list-panel,
.panel-app.panel-design-system .support-driver-schools-panel,
.panel-app.panel-design-system .support-driver-financial-panel {
    display: flex;
    flex-direction: column;
    min-height: 310px;
    padding: 21px;
}

.panel-app.panel-design-system .support-driver-list {
    display: grid;
    gap: 8px;
    margin-top: 17px;
}

.panel-app.panel-design-system .support-driver-list-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 61px;
    padding: 10px;
    background: rgba(255, 255, 255, .024);
    border: 1px solid rgba(149, 174, 201, .08);
    border-radius: 13px;
    transition: border-color .2s ease, background .2s ease, transform .2s ease;
}

.panel-app.panel-design-system .support-driver-list-row:hover {
    background: rgba(255, 255, 255, .034);
    border-color: rgba(255, 176, 0, .14);
    transform: translateX(2px);
}

.panel-app.panel-design-system .support-driver-list-row>div {
    min-width: 0;
}

.panel-app.panel-design-system .support-driver-list-row strong,
.panel-app.panel-design-system .support-driver-list-row small {
    display: block;
}

.panel-app.panel-design-system .support-driver-list-row strong {
    overflow: hidden;
    color: var(--white);
    font-size: 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.panel-app.panel-design-system .support-driver-list-row small {
    margin-top: 4px;
    overflow: hidden;
    color: var(--text-secondary);
    font-size: 7px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.panel-app.panel-design-system .support-driver-mini-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 25px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 6px;
    font-weight: 900;
    text-transform: uppercase;
}

.panel-app.panel-design-system .support-driver-mini-status--active {
    color: var(--green);
    background: var(--green-background);
    border: 1px solid rgba(53, 208, 145, .18);
}

.panel-app.panel-design-system .support-driver-mini-status--inactive {
    color: var(--red);
    background: var(--red-background);
    border: 1px solid rgba(255, 107, 117, .18);
}

.panel-app.panel-design-system .support-driver-empty-state {
    flex: 1;
    min-height: 205px;
    margin-top: 16px;
    padding: 24px;
    background: rgba(3, 15, 27, .18);
    border: 1px dashed rgba(149, 174, 201, .16);
    border-radius: 16px;
}

.panel-app.panel-design-system .support-driver-empty-state--compact {
    min-height: 175px;
}

.panel-app.panel-design-system .support-driver-empty-state>span:first-child {
    margin-bottom: 12px;
}

.panel-app.panel-design-system .support-driver-empty-state h3 {
    font-size: 10px;
}

.panel-app.panel-design-system .support-driver-empty-state p {
    max-width: 330px;
    margin-top: 7px;
    font-size: 8px;
}

.panel-app.panel-design-system .support-driver-school-list {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: 9px;
    margin-top: 18px;
}

.panel-app.panel-design-system .support-driver-school-list>span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 37px;
    padding: 0 12px;
    color: var(--text-secondary);
    background: rgba(255, 255, 255, .028);
    border: 1px solid rgba(149, 174, 201, .09);
    border-radius: 11px;
    font-size: 8px;
}

.panel-app.panel-design-system .support-driver-school-list>span i {
    color: var(--primary-yellow);
}

.panel-app.panel-design-system .support-driver-financial-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.panel-app.panel-design-system .support-driver-financial-grid article {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    min-height: 76px;
    padding: 12px;
    background: rgba(255, 255, 255, .027);
    border: 1px solid rgba(149, 174, 201, .09);
    border-radius: 13px;
}

.panel-app.panel-design-system .support-driver-financial-grid article>span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    color: var(--primary-yellow);
    background: rgba(255, 176, 0, .08);
    border-radius: 9px;
}

.panel-app.panel-design-system .support-driver-financial-grid article>div {
    min-width: 0;
}

.panel-app.panel-design-system .support-driver-financial-grid small,
.panel-app.panel-design-system .support-driver-financial-grid strong {
    display: block;
}

.panel-app.panel-design-system .support-driver-financial-grid small {
    color: var(--text-muted);
    font-size: 7px;
}

.panel-app.panel-design-system .support-driver-financial-grid strong {
    margin-top: 6px;
    overflow-wrap: anywhere;
    color: var(--white);
    font-size: 12px;
    font-variant-numeric: tabular-nums;
}

.panel-app.panel-design-system .support-driver-readonly-note {
    margin-top: auto;
}

@media (max-width: 1180px) {
    .panel-app.panel-design-system .support-driver-primary-grid {
        grid-template-columns: minmax(0, 1.45fr) minmax(310px, .9fr);
    }

    .panel-app.panel-design-system .support-driver-information-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .panel-app.panel-design-system .support-driver-information-item--wide {
        grid-column: span 2;
    }
}

@media (max-width: 980px) {

    .panel-app.panel-design-system .support-driver-primary-grid,
    .panel-app.panel-design-system .support-driver-content-grid {
        grid-template-columns: 1fr;
    }

    .panel-app.panel-design-system .support-driver-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .panel-app.panel-design-system .support-driver-show {
        gap: 14px;
    }

    .panel-app.panel-design-system .support-driver-hero {
        min-height: 0;
    }

    .panel-app.panel-design-system .support-driver-hero__icon {
        display: none;
    }

    .panel-app.panel-design-system .support-driver-toolbar {
        display: grid;
        grid-template-columns: 1fr;
    }

    .panel-app.panel-design-system .support-driver-toolbar .ui-button {
        width: 100%;
    }

    .panel-app.panel-design-system .support-driver-profile-card,
    .panel-app.panel-design-system .support-driver-access-card,
    .panel-app.panel-design-system .support-driver-list-panel,
    .panel-app.panel-design-system .support-driver-schools-panel,
    .panel-app.panel-design-system .support-driver-financial-panel {
        padding: 16px;
    }

    .panel-app.panel-design-system .support-driver-profile-head {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .panel-app.panel-design-system .support-driver-profile-head>.support-driver-state {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .panel-app.panel-design-system .support-driver-avatar {
        width: 54px;
        height: 54px;
        flex-basis: 54px;
        border-radius: 16px;
        font-size: 16px;
    }

    .panel-app.panel-design-system .support-driver-information-grid,
    .panel-app.panel-design-system .support-driver-stats,
    .panel-app.panel-design-system .support-driver-financial-grid {
        grid-template-columns: 1fr;
    }

    .panel-app.panel-design-system .support-driver-information-item--wide {
        grid-column: auto;
    }

    .panel-app.panel-design-system .support-driver-validity {
        align-items: flex-start;
        flex-direction: column;
    }

    .panel-app.panel-design-system .support-driver-list-row {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .panel-app.panel-design-system .support-driver-list-row>.support-driver-mini-status {
        grid-column: 2;
        justify-self: start;
    }
}

@media (prefers-reduced-motion: reduce) {
    .panel-app.panel-design-system .support-driver-hero__icon {
        animation: none;
    }
}

/*
 * Ajuste fino dos cabeçalhos internos e estados vazios.
 * Mantém o mesmo ritmo visual usado nas telas de formulários e tickets.
 */
.panel-app.panel-design-system .support-driver-section-header {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 11px !important;
    width: 100%;
    min-height: 42px;
    padding: 0 !important;
    text-align: left !important;
}

.panel-app.panel-design-system .support-driver-section-header>.support-driver-section-icon {
    flex: 0 0 36px !important;
    width: 36px !important;
    height: 36px !important;
    margin: 0 !important;
}

.panel-app.panel-design-system .support-driver-section-header>div {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0 !important;
    text-align: left !important;
}

.panel-app.panel-design-system .support-driver-section-header .ui-kicker {
    display: block;
    margin: 0 0 3px !important;
    color: #91acd0 !important;
    font-size: 7px !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
    letter-spacing: .55px !important;
    text-align: left !important;
}

.panel-app.panel-design-system .support-driver-section-header h3 {
    margin: 0 !important;
    color: var(--ui-text, #f5f8fc) !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    line-height: 1.22 !important;
    letter-spacing: -.15px !important;
    text-align: left !important;
}

.panel-app.panel-design-system .support-driver-section-header p {
    margin: 4px 0 0 !important;
    color: var(--ui-text-muted, #71839a) !important;
    font-size: 8px !important;
    line-height: 1.45 !important;
    text-align: left !important;
}

.panel-app.panel-design-system .support-driver-empty-state {
    min-height: 250px !important;
    margin-top: 16px !important;
    padding: 30px 24px !important;
    color: var(--ui-text-soft, #91a4bc) !important;
    background: rgba(2, 12, 25, .28) !important;
    border: 1px dashed rgba(145, 174, 207, .20) !important;
    border-radius: var(--ui-radius-md, 16px) !important;
}

.panel-app.panel-design-system .support-driver-empty-state--compact {
    min-height: 250px !important;
}

.panel-app.panel-design-system .support-driver-empty-state>span:first-child {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: auto !important;
    margin: 0 0 11px !important;
    padding: 0 !important;
    color: var(--ui-text-soft, #91a4bc) !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    font-size: 13px !important;
    line-height: 1 !important;
    box-shadow: none !important;
}

.panel-app.panel-design-system .support-driver-empty-state h3 {
    margin: 0 0 7px !important;
    color: var(--ui-text-soft, #91a4bc) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
}

.panel-app.panel-design-system .support-driver-empty-state p {
    max-width: 430px !important;
    margin: 0 !important;
    color: var(--ui-text-muted, #71839a) !important;
    font-size: 10px !important;
    line-height: 1.55 !important;
}

@media (max-width: 680px) {
    .panel-app.panel-design-system .support-driver-section-header {
        gap: 10px !important;
    }

    .panel-app.panel-design-system .support-driver-section-header h3 {
        font-size: 12px !important;
    }

    .panel-app.panel-design-system .support-driver-section-header p {
        font-size: 7.5px !important;
    }

    .panel-app.panel-design-system .support-driver-empty-state,
    .panel-app.panel-design-system .support-driver-empty-state--compact {
        min-height: 220px !important;
        padding: 26px 18px !important;
    }
}

/* ==========================================================================
   Módulo consolidado: panel-hero-corner-icons.css
   ========================================================================== */
/*
 * Van-Tagem | Ícones responsivos nos cabeçalhos
 * Desktop, tablet e celular: centralizado verticalmente no lado direito.
 */
body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon {
    position: relative !important;
    display: block !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-items: initial !important;
    justify-content: initial !important;
    min-width: 0 !important;
}

body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon> :not(.ui-page-hero-corner-icon) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    padding-right: 76px !important;
}

body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon>.ui-page-hero-corner-icon {
    position: absolute !important;
    top: 50% !important;
    right: 28px !important;
    bottom: auto !important;
    left: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    place-items: center !important;
    flex: 0 0 48px !important;
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--ui-primary, var(--primary-yellow, #ffb000)) !important;
    background: rgba(255, 176, 0, 0.09) !important;
    border: 1px solid rgba(255, 176, 0, 0.22) !important;
    border-radius: 14px !important;
    box-shadow: 0 12px 28px rgba(255, 176, 0, 0.08) !important;
    font-size: 17px !important;
    line-height: 1 !important;
    transform: translateY(-50%) !important;
    animation: none !important;
    z-index: 3 !important;
    overflow: hidden !important;
}

body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon>.ui-page-hero-corner-icon>i,
body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon>.ui-page-hero-corner-icon>svg {
    display: block !important;
    margin: 0 !important;
    color: inherit !important;
    font-size: inherit !important;
    line-height: 1 !important;
    transform: none !important;
}

/*
 * O indicador documental continua acessível pelo aria-label,
 * mas visualmente segue o mesmo bloco de ícone dos demais cabeçalhos.
 */
body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon>.marketplace-verification-progress {
    background: rgba(255, 176, 0, 0.09) !important;
}

body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon>.marketplace-verification-progress.is-verified {
    color: #63dda9 !important;
    background: rgba(53, 208, 145, 0.09) !important;
    border-color: rgba(53, 208, 145, 0.24) !important;
}

body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon>.marketplace-verification-progress>div {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
}

body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon>.marketplace-verification-progress>div>strong,
body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon>.marketplace-verification-progress>div>span {
    display: none !important;
}

body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon>.marketplace-verification-progress>div>i {
    margin: 0 !important;
    font-size: 17px !important;
}

@media (max-width: 620px) {
    body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon {
        display: block !important;
        min-height: 0 !important;
        padding: 18px !important;
    }

    body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon> :not(.ui-page-hero-corner-icon) {
        padding-right: 56px !important;
    }

    body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon>.ui-page-hero-corner-icon {
        top: 50% !important;
        right: 18px !important;
        transform: translateY(-50%) !important;
        flex-basis: 42px !important;
        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        max-height: 42px !important;
        border-radius: 13px !important;
        font-size: 16px !important;
    }

    body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon h1,
    body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon h2 {
        max-width: 100% !important;
    }
}

@media (max-width: 370px) {
    body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon> :not(.ui-page-hero-corner-icon) {
        padding-right: 50px !important;
    }

    body.panel-app.panel-design-system .ui-page-hero.ui-page-hero--corner-icon>.ui-page-hero-corner-icon {
        top: 50% !important;
        right: 16px !important;
        transform: translateY(-50%) !important;
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        max-height: 40px !important;
    }
}

/* ==========================================================================
   API canônica Van-Tagem UI
   ========================================================================== */
/*
 * Van-Tagem UI 4.0
 * Camada global de componentes e compatibilidade visual.
 *
 * Esta folha deve ser carregada por último no painel. Ela transforma as
 * classes ui-* no "bootstrap" interno da Van-Tagem e mantém compatibilidade
 * com nomes antigos usados por páginas específicas.
 */
body.panel-app.panel-design-system {
    --vt-primary: var(--ui-primary, var(--primary-yellow, #ffb000));
    --vt-primary-strong: #ffc83d;
    --vt-bg: var(--ui-bg, #04111f);
    --vt-surface: var(--ui-surface, #10263d);
    --vt-surface-soft: rgba(16, 38, 61, 0.72);
    --vt-border: var(--ui-border, rgba(140, 171, 207, 0.18));
    --vt-text: var(--ui-text, #f7f9fc);
    --vt-text-soft: var(--ui-text-soft, #92a8c1);
    --vt-kicker: #9bb8dc;
    --vt-radius-sm: 12px;
    --vt-radius-md: 18px;
    --vt-radius-lg: 24px;
    --vt-shadow: 0 16px 42px rgba(0, 0, 0, 0.18);
    --vt-control-height: 48px;
    --vt-space-1: 6px;
    --vt-space-2: 10px;
    --vt-space-3: 14px;
    --vt-space-4: 18px;
    --vt-space-5: 24px;
    --vt-transition: 180ms ease;
}

/* ========================================================================== 
   Estrutura de página
   ========================================================================== */
body.panel-app.panel-design-system .ui-page,
body.panel-app.panel-design-system .vt-page {
    width: 100%;
    min-width: 0;
}

body.panel-app.panel-design-system .ui-surface,
body.panel-app.panel-design-system .vt-surface {
    min-width: 0;
}

/* ========================================================================== 
   Títulos internos de seção
   Padrão: kicker pequeno + título forte, igual em todas as áreas e perfis.
   ========================================================================== */
body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading) {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
}

body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading)>div:not(.ui-section-header__actions):not(.vt-section-heading__actions),
body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading)>.vt-section-heading__copy {
    display: block !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading)>div:not(.ui-section-header__actions):not(.vt-section-heading__actions)> :is(span:first-child, .ui-kicker, .vt-section-heading__kicker),
body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading)> :is(.ui-kicker, .vt-section-heading__kicker) {
    display: block !important;
    margin: 0 0 5px !important;
    padding: 0 !important;
    color: var(--vt-kicker) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.78px !important;
}

body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading) :is(h2, h3, h4, .vt-section-heading__title) {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--vt-text) !important;
    font-size: clamp(20px, 1.65vw, 27px) !important;
    font-weight: 800 !important;
    line-height: 1.12 !important;
    letter-spacing: -0.5px !important;
    overflow-wrap: anywhere;
}

body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading) :is(p, .vt-section-heading__description) {
    max-width: 760px !important;
    margin: 7px 0 0 !important;
    color: var(--vt-text-soft) !important;
    font-size: 12.5px !important;
    line-height: 1.58 !important;
}

body.panel-app.panel-design-system :is(.ui-section-header__actions, .vt-section-heading__actions) {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex: 0 0 auto !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    min-width: 0 !important;
}

body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading)> :is(.ui-section-icon, .vt-section-heading__icon) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 46px !important;
    width: 46px !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--vt-primary) !important;
    background: rgba(255, 176, 0, 0.09) !important;
    border: 1px solid rgba(255, 176, 0, 0.23) !important;
    border-radius: 14px !important;
}

/* As classes legadas abaixo passam a obedecer exatamente ao mesmo título. */
body.panel-app.panel-design-system :is(.students-list-heading,
    .schools-list-heading,
    .routes-list-heading,
    .monthly-fees-list-heading,
    .guardian-students-list-heading,
    .support-list-heading,
    .notification-list-heading,
    .admin-list-heading,
    .marketplace-list-heading) {
    margin-bottom: 18px !important;
}

/* ========================================================================== 
   Barra de filtros e campos
   ========================================================================== */
body.panel-app.panel-design-system :is(.ui-filter-bar, .vt-filter-bar) {
    min-width: 0 !important;
}

body.panel-app.panel-design-system :is(.ui-control-wrap, .vt-control) {
    min-width: 0 !important;
}

body.panel-app.panel-design-system .ui-control-wrap> :is(input, select, textarea),
body.panel-app.panel-design-system :is(.ui-input, .ui-select, .ui-textarea) {
    min-width: 0 !important;
}

/* ========================================================================== 
   Botões
   ========================================================================== */
body.panel-app.panel-design-system .ui-button {
    isolation: isolate;
}

body.panel-app.panel-design-system .ui-button--primary {
    position: relative;
    overflow: hidden;
}

body.panel-app.panel-design-system .ui-button--primary::after {
    content: "";
    position: absolute;
    top: -70%;
    left: -38%;
    width: 28%;
    height: 240%;
    pointer-events: none;
    background: rgba(255, 255, 255, 0.24);
    transform: rotate(20deg) translateX(-260%);
    transition: transform 420ms ease;
    z-index: -1;
}

body.panel-app.panel-design-system .ui-button--primary:hover::after {
    transform: rotate(20deg) translateX(650%);
}

/* ========================================================================== 
   Estados vazios
   ========================================================================== */
body.panel-app.panel-design-system :is(.ui-empty-state, .vt-empty-state) {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 210px;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 30px 22px !important;
    color: var(--vt-text-soft) !important;
    text-align: center !important;
    background: rgba(4, 18, 33, 0.36) !important;
    border: 1px dashed rgba(140, 171, 207, 0.22) !important;
    border-radius: var(--vt-radius-md) !important;
}

body.panel-app.panel-design-system :is(.ui-empty-state, .vt-empty-state)>i {
    margin: 0 0 5px !important;
    color: #8298b3 !important;
    font-size: 18px !important;
}

body.panel-app.panel-design-system :is(.ui-empty-state, .vt-empty-state)>strong {
    color: #bdc9d7 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
}

body.panel-app.panel-design-system :is(.ui-empty-state, .vt-empty-state)>span {
    max-width: 520px;
    color: #7e93ad !important;
    font-size: 12px !important;
    line-height: 1.55 !important;
}

/* ========================================================================== 
   Utilitários públicos do design system
   ========================================================================== */
.vt-stack {
    display: grid !important;
    gap: var(--vt-space-4) !important;
}

.vt-stack--sm {
    gap: var(--vt-space-2) !important;
}

.vt-stack--lg {
    gap: var(--vt-space-5) !important;
}

.vt-cluster {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: var(--vt-space-2) !important;
}

.vt-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)) !important;
    gap: var(--vt-space-3) !important;
}

.vt-text-muted {
    color: var(--vt-text-soft) !important;
}

.vt-w-full {
    width: 100% !important;
}

.vt-min-w-0 {
    min-width: 0 !important;
}

.vt-hidden {
    display: none !important;
}

/* ========================================================================== 
   Responsividade
   ========================================================================== */
@media (max-width: 760px) {
    body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading) {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 12px !important;
        margin-bottom: 15px !important;
    }

    body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading) :is(h2, h3, h4, .vt-section-heading__title) {
        font-size: clamp(19px, 6vw, 23px) !important;
        line-height: 1.16 !important;
    }

    body.panel-app.panel-design-system :is(.ui-section-header__actions, .vt-section-heading__actions) {
        width: 100% !important;
        justify-content: flex-start !important;
    }
}

@media (max-width: 480px) {
    body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading)>div:not(.ui-section-header__actions):not(.vt-section-heading__actions)> :is(span:first-child, .ui-kicker, .vt-section-heading__kicker) {
        font-size: 10px !important;
    }

    body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading) :is(h2, h3, h4, .vt-section-heading__title) {
        font-size: 19px !important;
    }
}

@media (prefers-reduced-motion: reduce) {

    body.panel-app.panel-design-system *,
    body.panel-app.panel-design-system *::before,
    body.panel-app.panel-design-system *::after {
        scroll-behavior: auto !important;
    }

    body.panel-app.panel-design-system .ui-button--primary::after {
        display: none !important;
    }
}

body.panel-app.panel-design-system .vt-section-heading--full {
    grid-column: 1 / -1 !important;
}

/* Componente de hero para novas páginas. Mantém o hero atual como contrato visual. */
body.panel-app.panel-design-system .vt-page-hero__copy {
    min-width: 0;
}

body.panel-app.panel-design-system .vt-page-hero__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

@media (max-width: 760px) {
    body.panel-app.panel-design-system .vt-page-hero__actions {
        width: 100%;
        justify-content: flex-start;
    }
}

/* Compatibilidade para páginas antigas que ainda usam ui-summary-*. */
body.panel-app.panel-design-system :is(.ui-stats-grid, .ui-summary-grid) {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)) !important;
    gap: 14px !important;
}

body.panel-app.panel-design-system :is(.ui-stat-card, .ui-summary-card) {
    position: relative;
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    min-width: 0;
    min-height: 108px !important;
    padding: 20px !important;
    overflow: hidden;
    color: var(--vt-text);
    background: var(--vt-surface) !important;
    border: 1px solid var(--vt-border) !important;
    border-radius: var(--vt-radius-md) !important;
    box-shadow: var(--vt-shadow);
}

body.panel-app.panel-design-system :is(.ui-stat-card--accent, .ui-summary-card--accent) {
    background:
        linear-gradient(105deg, rgba(255, 176, 0, 0.17), rgba(255, 176, 0, 0.025) 62%),
        var(--vt-surface) !important;
    border-color: rgba(255, 176, 0, 0.42) !important;
}

body.panel-app.panel-design-system :is(.ui-stat-card__icon, .ui-summary-card__icon) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 44px !important;
    color: var(--vt-primary) !important;
    background: rgba(255, 176, 0, 0.10) !important;
    border: 1px solid rgba(255, 176, 0, 0.14) !important;
    border-radius: 13px !important;
}

@media (max-width: 760px) {

    /*
     * Cabeçalhos com ícone permanecem em linha no mobile, mas o ícone fica
     * centralizado verticalmente em relação ao conjunto kicker + título +
     * descrição. Este é o padrão visual dos cards Vantagem-UI.
     */
    body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading):is(:has(> span:first-child > :is(i, svg)), :has(> :is(i, svg))) {
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
    }

    body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading):is(:has(> span:first-child > :is(i, svg)), :has(> :is(i, svg)))> :is(.ui-section-icon, .vt-section-heading__icon, span:first-child:has(> :is(i, svg))) {
        align-self: center !important;
    }

    body.panel-app.panel-design-system :is(.ui-section-header, .ui-section-heading, .vt-section-heading):is(:has(> span:first-child > :is(i, svg)), :has(> :is(i, svg)))>div:not(.ui-section-header__actions):not(.vt-section-heading__actions) {
        flex: 1 1 auto !important;
        min-width: 0 !important;
    }
}

/* ========================================================================== 
   WhatsApp via Wafly
   ========================================================================== */
body.panel-app.panel-design-system .wafly-admin-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
    gap: 16px;
    align-items: start;
}

body.panel-app.panel-design-system .wafly-admin-config-card,
body.panel-app.panel-design-system .whatsapp-admin-test-card {
    min-width: 0;
}

body.panel-app.panel-design-system .wafly-webhook-list {
    display: grid;
    gap: 8px;
    margin-top: 16px;
}

body.panel-app.panel-design-system .wafly-webhook-list>div {
    display: grid;
    grid-template-columns: minmax(140px, 190px) minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    min-width: 0;
    padding: 11px 12px;
    background: rgba(2, 17, 31, 0.46);
    border: 1px solid rgba(144, 175, 205, 0.12);
    border-radius: 12px;
}

body.panel-app.panel-design-system .wafly-webhook-list span {
    color: var(--ui-text, #f4f7fb);
    font-size: 12px;
    font-weight: 800;
}

body.panel-app.panel-design-system .wafly-webhook-list code {
    display: block;
    min-width: 0;
    overflow: hidden;
    color: var(--ui-muted, #8fa5bb);
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .wafly-admin-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

body.panel-app.panel-design-system .wafly-provider-state {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 16px;
}

body.panel-app.panel-design-system .wafly-provider-state>div {
    min-width: 0;
    padding: 12px;
    background: rgba(18, 45, 70, 0.58);
    border: 1px solid rgba(144, 175, 205, 0.12);
    border-radius: 12px;
}

body.panel-app.panel-design-system .wafly-provider-state small,
body.panel-app.panel-design-system .wafly-provider-state strong {
    display: block;
}

body.panel-app.panel-design-system .wafly-provider-state small {
    margin-bottom: 5px;
    color: var(--ui-muted, #8fa5bb);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.35;
}

body.panel-app.panel-design-system .wafly-provider-state strong {
    overflow: hidden;
    color: var(--ui-text, #f4f7fb);
    font-size: 12px;
    line-height: 1.4;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .wafly-admin-page .whatsapp-admin-metrics {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

@media (max-width: 1180px) {
    body.panel-app.panel-design-system .wafly-admin-main-grid {
        grid-template-columns: 1fr;
    }

    body.panel-app.panel-design-system .wafly-admin-page .whatsapp-admin-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    body.panel-app.panel-design-system .wafly-webhook-list>div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    body.panel-app.panel-design-system .wafly-webhook-list code {
        white-space: normal;
        overflow-wrap: anywhere;
    }

    body.panel-app.panel-design-system .wafly-provider-state,
    body.panel-app.panel-design-system .wafly-admin-page .whatsapp-admin-metrics {
        grid-template-columns: 1fr;
    }

    body.panel-app.panel-design-system .wafly-admin-actions,
    body.panel-app.panel-design-system .wafly-admin-actions form,
    body.panel-app.panel-design-system .wafly-admin-actions .ui-button {
        width: 100%;
    }
}

body.panel-app.panel-design-system .wafly-admin-page :is(.wafly-admin-config-card,
    .whatsapp-admin-test-card,
    .whatsapp-admin-history) {
    padding: clamp(16px, 2vw, 22px);
}

body.panel-app.panel-design-system .wafly-admin-page .whatsapp-admin-security-note {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-top: 14px;
    padding: 12px;
    color: var(--ui-muted, #8fa5bb);
    background: rgba(18, 45, 70, 0.52);
    border: 1px solid rgba(144, 175, 205, 0.12);
    border-radius: 12px;
}

body.panel-app.panel-design-system .wafly-admin-page .whatsapp-admin-security-note i {
    margin-top: 2px;
    color: var(--ui-primary, #ffb000);
}

body.panel-app.panel-design-system .wafly-admin-page .whatsapp-admin-security-note p {
    margin: 0;
    font-size: 11px;
    line-height: 1.55;
}

/* ========================================================================== */
/* Van-Tagem UI 4.0 | Escolhas, checkboxes e switches canônicos               */
/* ========================================================================== */
body.panel-app.panel-design-system .admin-subscription-switch {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-width: 0;
    min-height: 64px;
    margin: 0;
    padding: 13px 14px;
    color: var(--text-primary, #f8fafc);
    background: rgba(255, 255, 255, .027);
    border: 1px solid rgba(149, 174, 201, .12);
    border-radius: 14px;
    cursor: pointer;
    overflow: hidden;
    transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

body.panel-app.panel-design-system .admin-subscription-switch--with-icon {
    grid-template-columns: auto auto minmax(0, 1fr) auto;
}

body.panel-app.panel-design-system .admin-subscription-switch:hover {
    background: rgba(255, 255, 255, .04);
    border-color: rgba(255, 176, 0, .27);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .12);
    transform: translateY(-1px);
}

body.panel-app.panel-design-system .admin-subscription-switch>input[type="checkbox"] {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

body.panel-app.panel-design-system .admin-subscription-switch__box {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    margin: 0 !important;
    color: transparent;
    background: rgba(255, 255, 255, .045);
    border: 1px solid rgba(149, 174, 201, .24);
    border-radius: 5px;
    font-size: 10px;
    line-height: 1;
    transition: color .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

body.panel-app.panel-design-system .admin-subscription-switch__box>i {
    display: block;
    margin: 0;
    color: inherit;
    font-size: inherit;
    line-height: 1;
}

body.panel-app.panel-design-system .admin-subscription-switch>input[type="checkbox"]:checked~.admin-subscription-switch__box {
    color: #07111e;
    background: var(--ui-primary, var(--primary-yellow, #ffb000));
    border-color: var(--ui-primary, var(--primary-yellow, #ffb000));
    box-shadow: 0 0 0 4px rgba(255, 176, 0, .10), 0 8px 20px rgba(255, 176, 0, .16);
    transform: scale(1.03);
}

body.panel-app.panel-design-system .admin-subscription-switch:has(> input[type="checkbox"]:checked) {
    background: linear-gradient(135deg, rgba(255, 176, 0, .075), rgba(255, 255, 255, .024));
    border-color: rgba(255, 176, 0, .28);
}

body.panel-app.panel-design-system .admin-subscription-switch>input[type="checkbox"]:focus-visible~.admin-subscription-switch__box {
    outline: 3px solid rgba(255, 176, 0, .22);
    outline-offset: 3px;
}

body.panel-app.panel-design-system .admin-subscription-switch__icon {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    margin: 0 !important;
    color: var(--ui-primary, var(--primary-yellow, #ffb000));
    background: rgba(255, 176, 0, .08);
    border: 1px solid rgba(255, 176, 0, .15);
    border-radius: 11px;
    font-size: 14px;
}

body.panel-app.panel-design-system .admin-subscription-switch__icon>i {
    margin: 0;
    color: inherit;
}

body.panel-app.panel-design-system .admin-subscription-switch__copy {
    display: grid !important;
    gap: 4px;
    min-width: 0;
    margin: 0 !important;
}

body.panel-app.panel-design-system .admin-subscription-switch__copy strong,
body.panel-app.panel-design-system .admin-subscription-switch__copy small {
    display: block;
    margin: 0;
}

body.panel-app.panel-design-system .admin-subscription-switch__copy strong {
    color: var(--text-primary, #fff);
    font-size: 11px;
    font-weight: 850;
    line-height: 1.28;
}

body.panel-app.panel-design-system .admin-subscription-switch__copy small {
    color: var(--text-muted, #71839a);
    font-size: 8px;
    line-height: 1.5;
}

body.panel-app.panel-design-system .admin-subscription-switch__badge {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    margin: 0 !important;
    padding: 0 9px;
    color: var(--ui-primary, #ffb000);
    background: rgba(255, 176, 0, .08);
    border: 1px solid rgba(255, 176, 0, .17);
    border-radius: 999px;
    font-size: 7px;
    font-weight: 900;
    white-space: nowrap;
}

body.panel-app.panel-design-system .admin-subscription-switch--compact {
    grid-template-columns: auto minmax(0, 1fr) auto;
    min-height: 54px;
    padding: 10px 11px;
}

body.panel-app.panel-design-system .admin-subscription-switch--compact .admin-subscription-switch__icon {
    flex-basis: 30px;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    font-size: 12px;
}

body.panel-app.panel-design-system .admin-subscription-switch--compact .admin-subscription-switch__copy strong {
    font-size: 9px;
}

body.panel-app.panel-design-system .vt-choice-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
}

body.panel-app.panel-design-system .vt-choice-grid--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Seletores especializados de rota preservam sua composição, mas usam a
   mesma linguagem visual do checkbox canônico. */
body.panel-app.panel-design-system .route-weekday-option input:checked+.route-weekday-box,
body.panel-app.panel-design-system .route-student-option.is-selected {
    border-color: rgba(255, 176, 0, .48) !important;
    box-shadow: 0 0 0 3px rgba(255, 176, 0, .08), 0 12px 26px rgba(0, 0, 0, .12) !important;
}

body.panel-app.panel-design-system .route-weekday-option input:checked+.route-weekday-box i,
body.panel-app.panel-design-system .route-student-option.is-selected .route-student-check {
    color: #07111e !important;
    background: var(--ui-primary, #ffb000) !important;
    border-color: var(--ui-primary, #ffb000) !important;
}

@media (max-width: 760px) {

    body.panel-app.panel-design-system .vt-choice-grid,
    body.panel-app.panel-design-system .vt-choice-grid--two {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .admin-subscription-switch {
        grid-template-columns: auto minmax(0, 1fr) auto;
        gap: 10px;
        min-height: 64px;
        padding: 12px;
    }

    body.panel-app.panel-design-system .admin-subscription-switch--with-icon {
        grid-template-columns: auto auto minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .admin-subscription-switch__badge {
        grid-column: 3;
        justify-self: start;
    }

    body.panel-app.panel-design-system .admin-subscription-switch--with-icon .admin-subscription-switch__badge {
        grid-column: 3;
        margin-left: 46px !important;
    }
}

/* ========================================================================== */
/* Cabeçalho móvel | iniciais sempre centralizadas                            */
/* ========================================================================== */
body.panel-app .header-profile-avatar {
    position: relative !important;
    display: grid !important;
    place-items: center !important;
    padding: 0 !important;
    line-height: 1 !important;
    isolation: isolate;
}

body.panel-app .header-profile-avatar>span {
    position: absolute !important;
    inset: 0 !important;
    display: grid !important;
    place-items: center !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #07111e !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: -.02em !important;
    text-align: center !important;
    text-indent: 0 !important;
    white-space: nowrap !important;
    writing-mode: horizontal-tb !important;
    transform: none !important;
}

@media (max-width: 760px) {
    body.panel-app .header-profile {
        overflow: hidden;
    }

    body.panel-app .header-profile-avatar>span {
        font-size: 9px !important;
    }
}

/* ========================================================================== */
/* Avaliação do motorista | estrelas interativas                              */
/* ========================================================================== */
body.panel-app.panel-design-system .guardian-review-page {
    display: grid;
    gap: 16px;
}

body.panel-app.panel-design-system .guardian-review-hero {
    background:
        radial-gradient(circle at 90% 20%, rgba(255, 176, 0, .13), transparent 31%),
        linear-gradient(135deg, rgba(255, 176, 0, .07), rgba(10, 31, 53, .82));
}

body.panel-app.panel-design-system .guardian-review-surface {
    display: grid;
    gap: 15px;
}

body.panel-app.panel-design-system .guardian-review-guide {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

body.panel-app.panel-design-system .guardian-review-guide>span {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 9px 11px;
    color: var(--text-secondary, #aeb9cc);
    background: rgba(255, 255, 255, .025);
    border: 1px solid rgba(149, 174, 201, .09);
    border-radius: 11px;
    font-size: 8px;
}

body.panel-app.panel-design-system .guardian-review-guide b {
    display: inline-grid;
    place-items: center;
    flex: 0 0 25px;
    width: 25px;
    height: 25px;
    color: #07111e;
    background: var(--ui-primary, #ffb000);
    border-radius: 8px;
    font-size: 9px;
}

body.panel-app.panel-design-system .guardian-review-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 620px), 1fr));
    gap: 14px;
}

body.panel-app.panel-design-system .guardian-review-card {
    min-width: 0;
    padding: 18px;
    background: linear-gradient(145deg, rgba(17, 42, 68, .96), rgba(9, 28, 47, .98));
    border: 1px solid rgba(149, 174, 201, .13);
    border-radius: 18px;
}

body.panel-app.panel-design-system .guardian-review-card__header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    margin-bottom: 15px;
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(149, 174, 201, .09);
}

body.panel-app.panel-design-system .guardian-review-driver-avatar {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    color: #07111e;
    background: linear-gradient(135deg, #ffb000, #ffd25a);
    border-radius: 13px;
    font-size: 12px;
    font-weight: 900;
    box-shadow: 0 10px 24px rgba(255, 176, 0, .14);
}

body.panel-app.panel-design-system .guardian-review-card__header h3,
body.panel-app.panel-design-system .guardian-review-card__header p {
    margin: 0;
}

body.panel-app.panel-design-system .guardian-review-card__header h3 {
    margin-top: 3px;
    color: #fff;
    font-size: 15px;
}

body.panel-app.panel-design-system .guardian-review-card__header p {
    margin-top: 4px;
    color: var(--text-muted, #71839a);
    font-size: 8px;
}

body.panel-app.panel-design-system .guardian-review-form {
    display: grid;
    gap: 15px;
}

body.panel-app.panel-design-system .guardian-review-criteria {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

body.panel-app.panel-design-system .vt-rating-criterion {
    min-width: 0;
    margin: 0;
    padding: 12px;
    background: rgba(4, 19, 34, .54);
    border: 1px solid rgba(149, 174, 201, .1);
    border-radius: 13px;
}

body.panel-app.panel-design-system .vt-rating-criterion.is-featured {
    grid-column: 1 / -1;
    background: linear-gradient(135deg, rgba(255, 176, 0, .08), rgba(4, 19, 34, .58));
    border-color: rgba(255, 176, 0, .19);
}

body.panel-app.panel-design-system .vt-rating-criterion legend {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    margin: 0 0 10px;
    padding: 0;
}

body.panel-app.panel-design-system .vt-rating-criterion legend>span:last-child {
    display: grid;
    gap: 3px;
    min-width: 0;
}

body.panel-app.panel-design-system .vt-rating-criterion legend strong,
body.panel-app.panel-design-system .vt-rating-criterion legend small {
    display: block;
    margin: 0;
}

body.panel-app.panel-design-system .vt-rating-criterion legend strong {
    color: #fff;
    font-size: 10px;
}

body.panel-app.panel-design-system .vt-rating-criterion legend small {
    color: var(--text-muted, #71839a);
    font-size: 7px;
    line-height: 1.45;
}

body.panel-app.panel-design-system .vt-rating-criterion__icon {
    display: grid;
    place-items: center;
    flex: 0 0 31px;
    width: 31px;
    height: 31px;
    color: var(--ui-primary, #ffb000);
    background: rgba(255, 176, 0, .08);
    border: 1px solid rgba(255, 176, 0, .14);
    border-radius: 9px;
    font-size: 11px;
}

body.panel-app.panel-design-system .vt-star-rating {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
}

body.panel-app.panel-design-system .vt-star-rating__option {
    position: relative;
    display: block;
    margin: 0;
    cursor: pointer;
}

body.panel-app.panel-design-system .vt-star-rating__option input {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

body.panel-app.panel-design-system .vt-star-rating__option>span:first-of-type {
    display: grid;
    place-items: center;
    width: 35px;
    height: 35px;
    color: #9aacbf;
    background: linear-gradient(180deg, rgba(149, 174, 201, .12), rgba(149, 174, 201, .065));
    border: 1px solid rgba(149, 174, 201, .22);
    border-radius: 10px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
    font-size: 14px;
    transition: color .16s ease, background .16s ease, border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

body.panel-app.panel-design-system .vt-star-rating__option:hover>span:first-of-type,
body.panel-app.panel-design-system .vt-star-rating__option.is-active>span:first-of-type,
body.panel-app.panel-design-system .vt-star-rating__option.is-preview>span:first-of-type {
    color: #07111e;
    background: linear-gradient(135deg, #ffb000, #ffd25a);
    border-color: #ffd25a;
    box-shadow: 0 8px 18px rgba(255, 176, 0, .18);
    transform: translateY(-1px);
}

/* Durante a prévia, somente as estrelas até a posição apontada ficam amarelas. */
body.panel-app.panel-design-system .vt-star-rating.is-previewing .vt-star-rating__option.is-active:not(.is-preview)>span:first-of-type {
    color: #9aacbf;
    background: linear-gradient(180deg, rgba(149, 174, 201, .12), rgba(149, 174, 201, .065));
    border-color: rgba(149, 174, 201, .22);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
    transform: none;
}

body.panel-app.panel-design-system .vt-star-rating__option input:focus-visible+span {
    outline: 3px solid rgba(255, 176, 0, .24);
    outline-offset: 2px;
}

body.panel-app.panel-design-system .vt-star-rating__value {
    margin-left: auto;
    color: var(--ui-primary, #ffb000);
    font-size: 9px;
    font-weight: 900;
    white-space: nowrap;
}

body.panel-app.panel-design-system .guardian-review-comment {
    display: grid;
    gap: 6px;
}

body.panel-app.panel-design-system .guardian-review-comment>small {
    color: var(--text-muted, #71839a);
    font-size: 7px;
}

body.panel-app.panel-design-system .guardian-review-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-top: 14px;
    border-top: 1px solid rgba(149, 174, 201, .09);
}

body.panel-app.panel-design-system .guardian-review-card__footer>span {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    max-width: 62%;
    color: var(--text-muted, #71839a);
    font-size: 7px;
    line-height: 1.5;
}

body.panel-app.panel-design-system .guardian-review-card__footer>span i {
    margin-top: 2px;
    color: var(--ui-primary, #ffb000);
}

@media (max-width: 760px) {

    body.panel-app.panel-design-system .guardian-review-guide,
    body.panel-app.panel-design-system .guardian-review-criteria {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .vt-rating-criterion.is-featured {
        grid-column: auto;
    }

    body.panel-app.panel-design-system .guardian-review-card__header {
        grid-template-columns: auto minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .guardian-review-card__header .ui-badge {
        grid-column: 2;
        justify-self: start;
    }

    body.panel-app.panel-design-system .guardian-review-card__footer {
        align-items: stretch;
        flex-direction: column;
    }

    body.panel-app.panel-design-system .guardian-review-card__footer>span {
        max-width: none;
    }

    body.panel-app.panel-design-system .guardian-review-card__footer .ui-button {
        width: 100%;
    }
}

@media (max-width: 420px) {
    body.panel-app.panel-design-system .guardian-review-card {
        padding: 14px;
    }

    body.panel-app.panel-design-system .vt-star-rating {
        gap: 4px;
    }

    body.panel-app.panel-design-system .vt-star-rating__option>span:first-of-type {
        width: 31px;
        height: 31px;
        font-size: 12px;
    }
}

/* ========================================================================== */
/* Perfil | central de consentimento do WhatsApp                              */
/* ========================================================================== */
body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-consent {
    display: grid;
    gap: 12px;
    margin-top: 4px;
    padding: 16px;
    background: linear-gradient(145deg, rgba(8, 33, 51, .94), rgba(12, 42, 64, .82));
    border: 1px solid rgba(53, 208, 145, .17);
    border-radius: 17px;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-heading {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-heading__icon {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    color: #63dda9;
    background: rgba(53, 208, 145, .09);
    border: 1px solid rgba(53, 208, 145, .18);
    border-radius: 12px;
    font-size: 18px;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-heading h4,
body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-heading p {
    margin: 0;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-heading h4 {
    margin-top: 3px;
    color: #fff;
    font-size: 13px;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-heading p {
    margin-top: 4px;
    color: var(--text-muted, #71839a);
    font-size: 8px;
    line-height: 1.45;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-consent-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    padding: 0 9px;
    border-radius: 999px;
    font-size: 7px;
    font-weight: 900;
    white-space: nowrap;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-consent-status.is-enabled {
    color: #63dda9;
    background: rgba(53, 208, 145, .09);
    border: 1px solid rgba(53, 208, 145, .2);
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-consent-status.is-pending {
    color: #ffc15a;
    background: rgba(255, 176, 0, .09);
    border: 1px solid rgba(255, 176, 0, .2);
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-consent-status.is-disabled {
    color: #91a2b8;
    background: rgba(149, 174, 201, .07);
    border: 1px solid rgba(149, 174, 201, .13);
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-consent-card {
    background: rgba(255, 255, 255, .025) !important;
    border-color: rgba(149, 174, 201, .11) !important;
    border-radius: 14px !important;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-consent-card .admin-subscription-switch__icon {
    color: #63dda9;
    background: rgba(53, 208, 145, .08);
    border-color: rgba(53, 208, 145, .16);
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-premium-note {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    padding: 12px;
    border-radius: 13px;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-premium-note>span {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 10px;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-premium-note.is-available {
    background: rgba(255, 176, 0, .06);
    border: 1px solid rgba(255, 176, 0, .14);
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-premium-note.is-available>span {
    color: var(--ui-primary, #ffb000);
    background: rgba(255, 176, 0, .09);
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-premium-note.is-waiting {
    background: rgba(149, 174, 201, .04);
    border: 1px solid rgba(149, 174, 201, .10);
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-premium-note.is-waiting>span {
    color: #91a2b8;
    background: rgba(149, 174, 201, .08);
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-premium-note strong,
body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-premium-note p {
    display: block;
    margin: 0;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-premium-note strong {
    color: #fff;
    font-size: 9px;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-premium-note p {
    margin-top: 4px;
    color: var(--text-muted, #71839a);
    font-size: 7px;
    line-height: 1.5;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-consent-help {
    display: grid;
    gap: 10px;
    margin: 0;
    color: var(--text-secondary, #aeb9cc);
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-steps>span {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 44px;
    padding: 9px;
    color: var(--text-secondary, #aeb9cc);
    background: rgba(255, 255, 255, .024);
    border: 1px solid rgba(149, 174, 201, .09);
    border-radius: 10px;
    font-size: 7px;
    line-height: 1.4;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-steps b {
    display: grid;
    place-items: center;
    flex: 0 0 23px;
    width: 23px;
    height: 23px;
    color: #07111e;
    background: #63dda9;
    border-radius: 7px;
    font-size: 8px;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-activation-link {
    justify-self: start;
    min-height: 42px;
    color: #07111e !important;
    border-color: transparent !important;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-activation-link span {
    color: rgba(7, 17, 30, .65) !important;
    font-size: 7px;
    font-weight: 800;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-confirmed {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    color: #63dda9;
    background: rgba(53, 208, 145, .07);
    border: 1px solid rgba(53, 208, 145, .15);
    border-radius: 12px;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-confirmed div {
    min-width: 0;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-confirmed strong,
body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-confirmed p {
    display: block;
    margin: 0;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-confirmed strong {
    color: #fff;
    font-size: 9px;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-confirmed p {
    margin-top: 3px;
    color: var(--text-muted, #71839a);
    font-size: 7px;
}

body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-number-warning {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 10px 11px;
    color: #ffc15a;
    background: rgba(255, 176, 0, .06);
    border: 1px solid rgba(255, 176, 0, .14);
    border-radius: 11px;
    font-size: 7px;
}

@media (max-width: 760px) {
    body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-heading {
        grid-template-columns: auto minmax(0, 1fr);
    }

    body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-consent-status {
        grid-column: 2;
        justify-self: start;
    }

    body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-steps {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system.panel-uses-profile .profile-whatsapp-activation-link {
        justify-self: stretch;
        width: 100%;
    }
}

/* ========================================================================== */
/* Parceiro Premium | comparação, checkout e status                           */
/* ========================================================================== */
body.panel-app.panel-design-system .marketplace-partner-page {
    display: grid;
    gap: 16px;
}

body.panel-app.panel-design-system .partner-premium-summary-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(210px, .72fr);
    align-items: stretch;
    gap: 10px;
}

body.panel-app.panel-design-system .partner-premium-price-card,
body.panel-app.panel-design-system .partner-premium-total-card {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 11px;
    min-width: 0;
    padding: 15px;
    background: linear-gradient(145deg, rgba(17, 42, 68, .96), rgba(9, 28, 47, .96));
    border: 1px solid rgba(149, 174, 201, .12);
    border-radius: 16px;
}

body.panel-app.panel-design-system .partner-premium-price-card.is-premium {
    background: linear-gradient(145deg, rgba(255, 176, 0, .095), rgba(9, 28, 47, .97));
    border-color: rgba(255, 176, 0, .25);
}

body.panel-app.panel-design-system .partner-premium-price-card__icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    color: var(--ui-primary, #ffb000);
    background: rgba(255, 176, 0, .08);
    border: 1px solid rgba(255, 176, 0, .16);
    border-radius: 12px;
    font-size: 15px;
}

body.panel-app.panel-design-system .partner-premium-price-card h3,
body.panel-app.panel-design-system .partner-premium-price-card p,
body.panel-app.panel-design-system .partner-premium-price-card strong {
    margin: 0;
}

body.panel-app.panel-design-system .partner-premium-price-card h3 {
    margin-top: 3px;
    color: #fff;
    font-size: 13px;
}

body.panel-app.panel-design-system .partner-premium-price-card strong {
    display: block;
    margin-top: 6px;
    color: var(--ui-primary, #ffb000);
    font-size: 19px;
    line-height: 1;
}

body.panel-app.panel-design-system .partner-premium-price-card strong small {
    margin-left: 3px;
    color: var(--text-muted, #71839a);
    font-size: 7px;
}

body.panel-app.panel-design-system .partner-premium-price-card p {
    margin-top: 7px;
    color: var(--text-muted, #71839a);
    font-size: 7px;
    line-height: 1.45;
}

body.panel-app.panel-design-system .partner-premium-price-card>.ui-badge {
    position: absolute;
    top: 10px;
    right: 10px;
}

body.panel-app.panel-design-system .partner-premium-plus,
body.panel-app.panel-design-system .partner-premium-equals {
    display: grid;
    place-items: center;
    align-self: center;
    width: 28px;
    height: 28px;
    color: var(--ui-primary, #ffb000);
    background: rgba(255, 176, 0, .07);
    border: 1px solid rgba(255, 176, 0, .14);
    border-radius: 9px;
    font-size: 9px;
}

body.panel-app.panel-design-system .partner-premium-total-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 4px;
    background: linear-gradient(135deg, #ffb000, #ffc83d);
    border-color: #ffd66c;
    color: #07111e;
}

body.panel-app.panel-design-system .partner-premium-total-card span,
body.panel-app.panel-design-system .partner-premium-total-card small {
    font-size: 7px;
    font-weight: 800;
}

body.panel-app.panel-design-system .partner-premium-total-card strong {
    font-size: 22px;
    line-height: 1;
}

body.panel-app.panel-design-system .partner-comparison-section {
    display: grid;
    gap: 14px;
}

body.panel-app.panel-design-system .partner-comparison-table {
    overflow: hidden;
    border: 1px solid rgba(149, 174, 201, .11);
    border-radius: 15px;
}

body.panel-app.panel-design-system .partner-comparison-row {
    display: grid;
    grid-template-columns: minmax(280px, 1.45fr) minmax(130px, .55fr) minmax(130px, .55fr);
    align-items: center;
    min-width: 0;
    border-bottom: 1px solid rgba(149, 174, 201, .08);
}

body.panel-app.panel-design-system .partner-comparison-row:last-child {
    border-bottom: 0;
}

body.panel-app.panel-design-system .partner-comparison-row>* {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    min-height: 45px;
    padding: 10px 12px;
    color: var(--text-secondary, #aeb9cc);
    border-right: 1px solid rgba(149, 174, 201, .08);
    font-size: 8px;
}

body.panel-app.panel-design-system .partner-comparison-row>*:last-child {
    border-right: 0;
}

body.panel-app.panel-design-system .partner-comparison-row>span:first-child i {
    flex: 0 0 18px;
    color: var(--ui-primary, #ffb000);
    text-align: center;
}

body.panel-app.panel-design-system .partner-comparison-row--header {
    background: rgba(255, 255, 255, .035);
}

body.panel-app.panel-design-system .partner-comparison-row--header>* {
    color: #fff;
    font-size: 8px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .35px;
}

body.panel-app.panel-design-system .partner-comparison-row .is-yes {
    color: #63dda9;
}

body.panel-app.panel-design-system .partner-comparison-row .is-no {
    color: #71839a;
}

body.panel-app.panel-design-system .partner-comparison-row .is-value {
    color: #fff;
}

body.panel-app.panel-design-system .partner-comparison-row .is-premium {
    background: rgba(255, 176, 0, .035);
}

body.panel-app.panel-design-system .partner-whatsapp-benefit {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 14px;
    background: linear-gradient(135deg, rgba(53, 208, 145, .075), rgba(9, 28, 47, .62));
    border: 1px solid rgba(53, 208, 145, .17);
    border-radius: 14px;
}

body.panel-app.panel-design-system .partner-whatsapp-benefit>span:first-child {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    color: #63dda9;
    background: rgba(53, 208, 145, .09);
    border: 1px solid rgba(53, 208, 145, .18);
    border-radius: 12px;
    font-size: 18px;
}

body.panel-app.panel-design-system .partner-whatsapp-benefit strong,
body.panel-app.panel-design-system .partner-whatsapp-benefit p,
body.panel-app.panel-design-system .partner-whatsapp-benefit small {
    display: block;
    margin: 0;
}

body.panel-app.panel-design-system .partner-whatsapp-benefit strong {
    color: #fff;
    font-size: 10px;
}

body.panel-app.panel-design-system .partner-whatsapp-benefit p {
    margin-top: 5px;
    color: var(--text-secondary, #aeb9cc);
    font-size: 8px;
    line-height: 1.5;
}

body.panel-app.panel-design-system .partner-whatsapp-benefit small {
    margin-top: 7px;
    color: #63dda9;
    font-size: 7px;
}

body.panel-app.panel-design-system .partner-checkout-layout {
    align-items: start;
}

body.panel-app.panel-design-system .partner-premium-plan-grid {
    margin-top: 4px;
}

body.panel-app.panel-design-system .partner-premium-plan-card {
    position: relative;
    min-height: 280px;
    overflow: hidden;
}

body.panel-app.panel-design-system .partner-premium-plan-card.is-featured {
    background: linear-gradient(145deg, rgba(255, 176, 0, .105), rgba(5, 18, 33, .72));
    border-color: rgba(255, 176, 0, .34);
    box-shadow: 0 16px 36px rgba(255, 176, 0, .08);
}

body.panel-app.panel-design-system .partner-plan-popular {
    position: absolute;
    top: 12px;
    right: 12px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 7px;
    color: #07111e;
    background: var(--ui-primary, #ffb000);
    border-radius: 999px;
    font-size: 6px;
    font-weight: 900;
}

body.panel-app.panel-design-system .partner-premium-plan-card ul {
    display: grid;
    gap: 7px;
    margin: 0 0 16px;
    padding: 0;
    list-style: none;
}

body.panel-app.panel-design-system .partner-premium-plan-card li {
    display: flex;
    align-items: center;
    gap: 7px;
    color: var(--text-secondary, #aeb9cc);
    font-size: 7px;
}

body.panel-app.panel-design-system .partner-premium-plan-card li i {
    color: #63dda9;
}

body.panel-app.panel-design-system .partner-current-status {
    display: grid;
    gap: 13px;
}

body.panel-app.panel-design-system .partner-current-status__headline {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 12px;
    border-radius: 13px;
}

body.panel-app.panel-design-system .partner-current-status__headline.is-active {
    background: rgba(53, 208, 145, .07);
    border: 1px solid rgba(53, 208, 145, .16);
}

body.panel-app.panel-design-system .partner-current-status__headline.is-inactive {
    background: rgba(149, 174, 201, .04);
    border: 1px solid rgba(149, 174, 201, .1);
}

body.panel-app.panel-design-system .partner-current-status__headline>span {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    color: var(--ui-primary, #ffb000);
    background: rgba(255, 176, 0, .08);
    border-radius: 11px;
}

body.panel-app.panel-design-system .partner-current-status__headline h3,
body.panel-app.panel-design-system .partner-current-status__headline p {
    margin: 0;
}

body.panel-app.panel-design-system .partner-current-status__headline h3 {
    color: #fff;
    font-size: 14px;
}

body.panel-app.panel-design-system .partner-current-status__headline p {
    margin-top: 4px;
    color: var(--text-muted, #71839a);
    font-size: 8px;
}

body.panel-app.panel-design-system .partner-current-benefits {
    display: grid;
    gap: 7px;
}

body.panel-app.panel-design-system .partner-current-benefits span {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    padding: 8px 10px;
    color: var(--text-secondary, #aeb9cc);
    background: rgba(255, 255, 255, .025);
    border: 1px solid rgba(149, 174, 201, .08);
    border-radius: 10px;
    font-size: 7px;
}

body.panel-app.panel-design-system .partner-current-benefits i {
    color: var(--ui-primary, #ffb000);
}

body.panel-app.panel-design-system .partner-order-list {
    display: grid;
    gap: 7px;
}

body.panel-app.panel-design-system .partner-order-list .marketplace-order-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px;
    background: rgba(255, 255, 255, .025);
    border: 1px solid rgba(149, 174, 201, .08);
    border-radius: 10px;
}

body.panel-app.panel-design-system .partner-order-list .marketplace-order-row span {
    display: grid;
    gap: 3px;
}

body.panel-app.panel-design-system .partner-order-list .marketplace-order-row b,
body.panel-app.panel-design-system .partner-order-list .marketplace-order-row strong {
    color: #fff;
    font-size: 8px;
}

body.panel-app.panel-design-system .partner-order-list .marketplace-order-row small {
    color: var(--text-muted, #71839a);
    font-size: 6px;
}

body.panel-app.panel-design-system .partner-orders-empty {
    min-height: 150px;
}

@media (max-width: 1180px) {
    body.panel-app.panel-design-system .partner-premium-summary-grid {
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .partner-premium-equals {
        display: none;
    }

    body.panel-app.panel-design-system .partner-premium-total-card {
        grid-column: 1 / -1;
    }
}

@media (max-width: 860px) {
    body.panel-app.panel-design-system .partner-premium-summary-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .partner-premium-plus,
    body.panel-app.panel-design-system .partner-premium-equals {
        display: none;
    }

    body.panel-app.panel-design-system .partner-comparison-table {
        overflow-x: auto;
    }

    body.panel-app.panel-design-system .partner-comparison-row {
        min-width: 680px;
    }

    body.panel-app.panel-design-system .partner-whatsapp-benefit {
        grid-template-columns: auto minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .partner-whatsapp-benefit>.ui-badge {
        grid-column: 2;
        justify-self: start;
    }
}

@media (max-width: 560px) {
    body.panel-app.panel-design-system .partner-premium-price-card {
        grid-template-columns: auto minmax(0, 1fr);
        padding-top: 42px;
    }

    body.panel-app.panel-design-system .partner-premium-plan-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* =========================================================
   VAN-TAGEM UI 4.0
   Correção do avatar da barra superior no mobile
   Estrutura: .header-profile > .header-profile-avatar
   ========================================================= */
@media (max-width: 768px) {
    body.panel-app.panel-design-system .header-profile {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 auto !important;
        width: 50px !important;
        min-width: 50px !important;
        max-width: 50px !important;
        height: 50px !important;
        min-height: 50px !important;
        max-height: 50px !important;
        padding: 5px !important;
        margin: 0 !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    body.panel-app.panel-design-system .header-profile-avatar {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 36px !important;
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        max-height: 36px !important;
        margin: 0 !important;
        padding: 0 !important;
        border-radius: 11px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        line-height: 1 !important;
        letter-spacing: -0.02em !important;
        text-align: center !important;
        white-space: nowrap !important;
        writing-mode: horizontal-tb !important;
        text-orientation: mixed !important;
        transform: none !important;
    }

    body.panel-app.panel-design-system .header-profile-avatar>span,
    body.panel-app.panel-design-system .header-profile-avatar>strong {
        position: absolute !important;
        inset: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: inherit !important;
        font-weight: inherit !important;
        line-height: 1 !important;
        letter-spacing: inherit !important;
        text-align: center !important;
        white-space: nowrap !important;
        writing-mode: horizontal-tb !important;
        text-orientation: mixed !important;
        transform: none !important;
    }

    body.panel-app.panel-design-system .header-profile-info {
        display: none !important;
    }
}

/* =========================================================
   VAN-TAGEM UI 4.0
   Botão de WhatsApp ocupando toda a largura no mobile
   ========================================================= */
@media (max-width: 620px) {
    body.panel-app.panel-design-system .support-driver-card-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        width: 100% !important;
    }

    body.panel-app.panel-design-system .support-driver-card-actions>.support-button,
    body.panel-app.panel-design-system .support-driver-card-actions>.support-icon-button {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        flex: 1 1 100% !important;
    }

    body.panel-app.panel-design-system .support-driver-card-actions>.support-icon-button {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-height: 46px !important;
        border-radius: var(--ui-radius-md, 12px) !important;
    }

    body.panel-app.panel-design-system .support-driver-card-actions>.support-icon-button::after {
        content: "Abrir WhatsApp";
        margin-left: 8px;
        font-size: 13px;
        font-weight: 800;
        line-height: 1;
    }
}

/*
|--------------------------------------------------------------------------
| PAINEL FINANCEIRO - VANTAGEM UI 4.0
|--------------------------------------------------------------------------
*/

body.panel-app.panel-design-system .finance-page {
    --finance-bg: #0d2134;
    --finance-bg-deep: #081827;
    --finance-border: rgba(125, 160, 194, 0.18);
    --finance-border-strong: rgba(125, 160, 194, 0.28);
    --finance-text: #f5f8fc;
    --finance-muted: #8fa5bb;
    --finance-yellow: #ffbd27;
    --finance-yellow-dark: #e7a20b;
    --finance-green: #42d49d;
    --finance-red: #ff6b75;
    --finance-blue: #5aa8ff;

    display: grid;
    gap: 20px;
    width: 100%;
    min-width: 0;
}

body.panel-app.panel-design-system .finance-page *,
body.panel-app.panel-design-system .finance-page *::before,
body.panel-app.panel-design-system .finance-page *::after {
    box-sizing: border-box;
}

body.panel-app.panel-design-system .finance-hero,
body.panel-app.panel-design-system .finance-panel,
body.panel-app.panel-design-system .finance-summary-card {
    border: 1px solid var(--finance-border);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.018),
        0 18px 42px rgba(0, 0, 0, 0.12);
}

body.panel-app.panel-design-system .finance-hero {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    min-height: 168px;
    padding: 28px 30px;
    overflow: hidden;
    background:
        radial-gradient(circle at 90% 18%, rgba(255, 189, 39, 0.11), transparent 25%),
        linear-gradient(135deg, rgba(28, 40, 38, 0.98), rgba(11, 31, 48, 0.98) 58%);
    border-radius: 22px;
}

body.panel-app.panel-design-system .finance-hero::after {
    content: "";
    position: absolute;
    right: -80px;
    bottom: -160px;
    width: 290px;
    height: 290px;
    border: 30px solid rgba(255, 189, 39, 0.035);
    border-radius: 50%;
    pointer-events: none;
}

body.panel-app.panel-design-system .finance-hero-copy,
body.panel-app.panel-design-system .finance-hero-actions {
    position: relative;
    z-index: 2;
}

body.panel-app.panel-design-system .finance-hero-copy {
    max-width: 750px;
}

body.panel-app.panel-design-system .finance-kicker {
    display: block;
    margin-bottom: 7px;
    color: #9ebce0;
    font-size: 11px;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.panel-app.panel-design-system .finance-hero h2,
body.panel-app.panel-design-system .finance-panel h3 {
    margin: 0;
    color: var(--finance-text);
    font-weight: 900;
    letter-spacing: -0.035em;
}

body.panel-app.panel-design-system .finance-hero h2 {
    font-size: clamp(25px, 2.4vw, 38px);
    line-height: 1.08;
}

body.panel-app.panel-design-system .finance-hero p,
body.panel-app.panel-design-system .finance-panel-header p {
    margin: 9px 0 0;
    color: var(--finance-muted);
    font-size: 14px;
    line-height: 1.6;
}

body.panel-app.panel-design-system .finance-hero-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

body.panel-app.panel-design-system .finance-button,
body.panel-app.panel-design-system .finance-icon-button,
body.panel-app.panel-design-system .finance-reminder-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 42px;
    margin: 0;
    padding: 0 16px;
    border: 1px solid transparent;
    border-radius: 12px;
    font: inherit;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        background-color 160ms ease,
        box-shadow 160ms ease;
}

body.panel-app.panel-design-system .finance-button:hover,
body.panel-app.panel-design-system .finance-icon-button:hover,
body.panel-app.panel-design-system .finance-reminder-button:hover {
    transform: translateY(-2px);
}

body.panel-app.panel-design-system .finance-button-secondary {
    color: #f1f6fb;
    background: rgba(12, 31, 48, 0.66);
    border-color: rgba(136, 166, 194, 0.22);
}

body.panel-app.panel-design-system .finance-button-secondary:hover {
    border-color: rgba(255, 189, 39, 0.38);
    background: rgba(18, 42, 63, 0.94);
}

body.panel-app.panel-design-system .finance-button-primary,
body.panel-app.panel-design-system .finance-reminder-button {
    color: #101821;
    background: linear-gradient(135deg, #ffc73e, #ffb516);
    border-color: rgba(255, 205, 84, 0.76);
    box-shadow: 0 10px 24px rgba(255, 181, 22, 0.16);
}

body.panel-app.panel-design-system .finance-button-primary:hover,
body.panel-app.panel-design-system .finance-reminder-button:hover {
    box-shadow: 0 14px 30px rgba(255, 181, 22, 0.24);
}

body.panel-app.panel-design-system .finance-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

body.panel-app.panel-design-system .finance-summary-card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 15px;
    min-width: 0;
    min-height: 116px;
    padding: 20px;
    overflow: hidden;
    background:
        linear-gradient(145deg, rgba(18, 42, 64, 0.98), rgba(13, 33, 52, 0.98));
    border-radius: 18px;
}

body.panel-app.panel-design-system .finance-summary-card::after {
    content: "";
    position: absolute;
    right: -40px;
    bottom: -65px;
    width: 125px;
    height: 125px;
    border: 20px solid rgba(255, 255, 255, 0.012);
    border-radius: 50%;
}

body.panel-app.panel-design-system .finance-summary-icon {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    color: var(--finance-blue);
    background: rgba(90, 168, 255, 0.1);
    border: 1px solid rgba(90, 168, 255, 0.14);
    border-radius: 14px;
    font-size: 16px;
}

body.panel-app.panel-design-system .finance-summary-card.is-received .finance-summary-icon {
    color: var(--finance-green);
    background: rgba(66, 212, 157, 0.1);
    border-color: rgba(66, 212, 157, 0.15);
}

body.panel-app.panel-design-system .finance-summary-card.is-overdue .finance-summary-icon {
    color: var(--finance-red);
    background: rgba(255, 107, 117, 0.1);
    border-color: rgba(255, 107, 117, 0.16);
}

body.panel-app.panel-design-system .finance-summary-card.is-count .finance-summary-icon {
    color: var(--finance-yellow);
    background: rgba(255, 189, 39, 0.1);
    border-color: rgba(255, 189, 39, 0.15);
}

body.panel-app.panel-design-system .finance-summary-content {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 5px;
    min-width: 0;
}

body.panel-app.panel-design-system .finance-summary-content > span {
    color: #a7b8ca;
    font-size: 12px;
    font-weight: 700;
}

body.panel-app.panel-design-system .finance-summary-content strong {
    overflow: hidden;
    color: var(--finance-text);
    font-size: clamp(21px, 1.8vw, 29px);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -0.035em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .finance-summary-content small {
    overflow: hidden;
    color: #718aa2;
    font-size: 10px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .finance-summary-accent {
    position: absolute;
    right: 0;
    top: 22px;
    bottom: 22px;
    width: 3px;
    background: var(--finance-blue);
    border-radius: 4px 0 0 4px;
    opacity: 0.76;
}

body.panel-app.panel-design-system .finance-summary-card.is-received .finance-summary-accent {
    background: var(--finance-green);
}

body.panel-app.panel-design-system .finance-summary-card.is-overdue .finance-summary-accent {
    background: var(--finance-red);
}

body.panel-app.panel-design-system .finance-summary-card.is-count .finance-summary-accent {
    background: var(--finance-yellow);
}

body.panel-app.panel-design-system .finance-analytics-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(340px, 0.9fr);
    gap: 16px;
    align-items: stretch;
}

body.panel-app.panel-design-system .finance-panel {
    min-width: 0;
    padding: 22px;
    background:
        linear-gradient(145deg, rgba(18, 42, 64, 0.98), rgba(13, 33, 52, 0.98));
    border-radius: 20px;
}

body.panel-app.panel-design-system .finance-panel-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

body.panel-app.panel-design-system .finance-panel-header > div:first-child {
    min-width: 0;
}

body.panel-app.panel-design-system .finance-panel h3 {
    font-size: clamp(21px, 1.8vw, 28px);
    line-height: 1.12;
}

body.panel-app.panel-design-system .finance-panel-total {
    display: grid;
    flex: 0 0 auto;
    gap: 3px;
    text-align: right;
}

body.panel-app.panel-design-system .finance-panel-total small,
body.panel-app.panel-design-system .finance-aging-total span,
body.panel-app.panel-design-system .finance-chart-insights span {
    color: #7f96ad;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

body.panel-app.panel-design-system .finance-panel-total strong {
    color: var(--finance-text);
    font-size: 21px;
    font-weight: 900;
}

body.panel-app.panel-design-system .finance-chart-insights {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 10px;
}

body.panel-app.panel-design-system .finance-chart-insights > div {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: end;
    gap: 3px 10px;
    padding: 11px 13px;
    background: rgba(7, 25, 41, 0.5);
    border: 1px solid rgba(125, 160, 194, 0.12);
    border-radius: 12px;
}

body.panel-app.panel-design-system .finance-chart-insights span {
    grid-column: 1 / -1;
}

body.panel-app.panel-design-system .finance-chart-insights strong {
    color: #edf5fc;
    font-size: 14px;
    font-weight: 900;
}

body.panel-app.panel-design-system .finance-chart-insights small {
    justify-self: end;
    color: #8da2b6;
    font-size: 10px;
}

body.panel-app.panel-design-system .finance-line-chart {
    position: relative;
    min-height: 305px;
    padding: 8px 6px 0;
    overflow: hidden;
}

body.panel-app.panel-design-system .finance-line-chart svg {
    display: block;
    width: 100%;
    height: 260px;
    overflow: visible;
}

body.panel-app.panel-design-system .finance-chart-grid-line {
    stroke: rgba(139, 169, 198, 0.1);
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

body.panel-app.panel-design-system .finance-chart-line {
    fill: none;
    stroke: var(--finance-yellow);
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

body.panel-app.panel-design-system .finance-chart-point-halo {
    fill: rgba(255, 189, 39, 0.13);
    vector-effect: non-scaling-stroke;
}

body.panel-app.panel-design-system .finance-chart-point {
    fill: var(--finance-yellow);
    stroke: #11283c;
    stroke-width: 3;
    vector-effect: non-scaling-stroke;
}

body.panel-app.panel-design-system .finance-chart-labels {
    display: grid;
    grid-template-columns: repeat(var(--finance-month-count), minmax(42px, 1fr));
    align-items: start;
    gap: 0;
    margin-top: -4px;
}

body.panel-app.panel-design-system .finance-chart-labels span {
    color: #7890a7;
    font-size: 9px;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
}

body.panel-app.panel-design-system .finance-health-badge,
body.panel-app.panel-design-system .finance-list-count,
body.panel-app.panel-design-system .finance-days-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 30px;
    padding: 0 11px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 900;
    white-space: nowrap;
}

body.panel-app.panel-design-system .finance-health-badge.is-healthy {
    color: #78e3ba;
    background: rgba(66, 212, 157, 0.09);
    border: 1px solid rgba(66, 212, 157, 0.17);
}

body.panel-app.panel-design-system .finance-health-badge.is-warning {
    color: #ffcf66;
    background: rgba(255, 189, 39, 0.09);
    border: 1px solid rgba(255, 189, 39, 0.17);
}

body.panel-app.panel-design-system .finance-aging-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 17px;
    margin-bottom: 15px;
    background:
        radial-gradient(circle at 100% 0, rgba(255, 189, 39, 0.1), transparent 40%),
        rgba(7, 25, 41, 0.56);
    border: 1px solid rgba(125, 160, 194, 0.13);
    border-radius: 16px;
}

body.panel-app.panel-design-system .finance-aging-total > div:first-child {
    display: grid;
    gap: 6px;
}

body.panel-app.panel-design-system .finance-aging-total > div:first-child strong {
    color: var(--finance-text);
    font-size: 28px;
    font-weight: 900;
    letter-spacing: -0.04em;
}

body.panel-app.panel-design-system .finance-aging-ring {
    --ring-angle: calc(var(--aging-progress) * 3.6deg);

    display: grid;
    place-items: center;
    align-content: center;
    flex: 0 0 88px;
    width: 88px;
    height: 88px;
    background:
        radial-gradient(circle, #102a41 57%, transparent 58%),
        conic-gradient(var(--finance-yellow) var(--ring-angle), rgba(113, 144, 174, 0.13) 0);
    border-radius: 50%;
}

body.panel-app.panel-design-system .finance-aging-ring strong {
    color: #fff4d3;
    font-size: 18px;
    font-weight: 900;
    line-height: 1;
}

body.panel-app.panel-design-system .finance-aging-ring small {
    margin-top: 4px;
    color: #8198ad;
    font-size: 8px;
    font-weight: 800;
    text-transform: uppercase;
}

body.panel-app.panel-design-system .finance-aging-list {
    display: grid;
    gap: 10px;
}

body.panel-app.panel-design-system .finance-aging-item {
    display: grid;
    gap: 9px;
    padding: 12px 13px;
    background: rgba(7, 25, 41, 0.38);
    border: 1px solid rgba(125, 160, 194, 0.1);
    border-radius: 12px;
}

body.panel-app.panel-design-system .finance-aging-item-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

body.panel-app.panel-design-system .finance-aging-item-heading > div {
    display: flex;
    align-items: baseline;
    gap: 9px;
    min-width: 0;
}

body.panel-app.panel-design-system .finance-aging-item-heading span {
    color: #9cb0c3;
    font-size: 11px;
    font-weight: 700;
}

body.panel-app.panel-design-system .finance-aging-item-heading strong {
    color: #f4f8fc;
    font-size: 13px;
    font-weight: 900;
}

body.panel-app.panel-design-system .finance-aging-item-heading small {
    color: #718aa2;
    font-size: 10px;
    font-weight: 800;
}

body.panel-app.panel-design-system .finance-aging-progress {
    display: block;
    height: 5px;
    overflow: hidden;
    background: rgba(125, 160, 194, 0.11);
    border-radius: 999px;
}

body.panel-app.panel-design-system .finance-aging-progress i {
    display: block;
    min-width: 0;
    height: 100%;
    background: linear-gradient(90deg, var(--finance-yellow-dark), var(--finance-yellow));
    border-radius: inherit;
}

body.panel-app.panel-design-system .finance-overdue-panel {
    padding-bottom: 22px;
}

body.panel-app.panel-design-system .finance-overdue-header {
    align-items: center;
}

body.panel-app.panel-design-system .finance-list-count {
    color: #dce8f3;
    background: rgba(9, 27, 43, 0.56);
    border: 1px solid rgba(125, 160, 194, 0.17);
}

body.panel-app.panel-design-system .finance-overdue-table {
    overflow: hidden;
    border: 1px solid rgba(125, 160, 194, 0.13);
    border-radius: 15px;
}

body.panel-app.panel-design-system .finance-overdue-table-head,
body.panel-app.panel-design-system .finance-overdue-row {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.55fr)
        minmax(105px, 0.78fr)
        minmax(105px, 0.78fr)
        minmax(90px, 0.6fr)
        minmax(105px, 0.72fr)
        minmax(180px, auto);
    align-items: center;
    gap: 15px;
}

body.panel-app.panel-design-system .finance-overdue-table-head {
    min-height: 43px;
    padding: 0 16px;
    color: #718aa2;
    background: rgba(6, 22, 36, 0.52);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

body.panel-app.panel-design-system .finance-table-actions-label {
    text-align: right;
}

body.panel-app.panel-design-system .finance-overdue-row {
    min-height: 76px;
    padding: 11px 16px;
    background: rgba(12, 33, 51, 0.56);
    border-top: 1px solid rgba(125, 160, 194, 0.1);
    transition: background-color 160ms ease;
}

body.panel-app.panel-design-system .finance-overdue-row:hover {
    background: rgba(17, 42, 63, 0.8);
}

body.panel-app.panel-design-system .finance-student-cell {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

body.panel-app.panel-design-system .finance-student-avatar {
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    color: #111a21;
    background: linear-gradient(135deg, #ffc83f, #ffb310);
    border-radius: 11px;
    font-size: 13px;
    font-weight: 950;
    box-shadow: 0 8px 18px rgba(255, 181, 16, 0.13);
}

body.panel-app.panel-design-system .finance-student-cell > div,
body.panel-app.panel-design-system .finance-mobile-field {
    min-width: 0;
}

body.panel-app.panel-design-system .finance-student-cell strong,
body.panel-app.panel-design-system .finance-mobile-field strong {
    display: block;
    overflow: hidden;
    color: #edf5fc;
    font-size: 12px;
    font-weight: 900;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .finance-student-cell small,
body.panel-app.panel-design-system .finance-mobile-field small {
    display: block;
    margin-bottom: 3px;
    overflow: hidden;
    color: #71899f;
    font-size: 9px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .finance-student-cell small {
    margin-top: 3px;
    margin-bottom: 0;
}

body.panel-app.panel-design-system .finance-days-badge {
    min-height: 27px;
    padding: 0 9px;
    color: #ffd982;
    background: rgba(255, 189, 39, 0.09);
    border: 1px solid rgba(255, 189, 39, 0.14);
}

body.panel-app.panel-design-system .finance-amount-cell strong {
    color: #ffd576;
    font-size: 13px;
}

body.panel-app.panel-design-system .finance-row-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

body.panel-app.panel-design-system .finance-row-actions form {
    margin: 0;
}

body.panel-app.panel-design-system .finance-icon-button {
    width: 39px;
    min-width: 39px;
    height: 39px;
    min-height: 39px;
    padding: 0;
    color: #b9c9d8;
    background: rgba(8, 26, 42, 0.62);
    border-color: rgba(125, 160, 194, 0.16);
}

body.panel-app.panel-design-system .finance-icon-button:hover {
    color: #fff;
    border-color: rgba(255, 189, 39, 0.28);
}

body.panel-app.panel-design-system .finance-reminder-button {
    min-height: 39px;
    padding: 0 13px;
    font-size: 10px;
}

body.panel-app.panel-design-system .finance-empty-state {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 22px;
    background:
        linear-gradient(135deg, rgba(66, 212, 157, 0.06), rgba(7, 25, 41, 0.3));
    border: 1px dashed rgba(66, 212, 157, 0.2);
    border-radius: 15px;
}

body.panel-app.panel-design-system .finance-empty-state > span {
    display: grid;
    place-items: center;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    color: var(--finance-green);
    background: rgba(66, 212, 157, 0.09);
    border: 1px solid rgba(66, 212, 157, 0.15);
    border-radius: 14px;
    font-size: 17px;
}

body.panel-app.panel-design-system .finance-empty-state > div {
    flex: 1 1 auto;
    min-width: 0;
}

body.panel-app.panel-design-system .finance-empty-state strong {
    display: block;
    color: #edf7f2;
    font-size: 14px;
    font-weight: 900;
}

body.panel-app.panel-design-system .finance-empty-state p {
    margin: 4px 0 0;
    color: #8299ae;
    font-size: 11px;
    line-height: 1.55;
}

@media (max-width: 1260px) {
    body.panel-app.panel-design-system .finance-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.panel-app.panel-design-system .finance-analytics-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .finance-overdue-table-head,
    body.panel-app.panel-design-system .finance-overdue-row {
        grid-template-columns:
            minmax(200px, 1.4fr)
            minmax(100px, 0.8fr)
            minmax(100px, 0.8fr)
            minmax(85px, 0.65fr)
            minmax(100px, 0.75fr)
            minmax(150px, auto);
        gap: 11px;
    }
}

@media (max-width: 900px) {
    body.panel-app.panel-design-system .finance-hero {
        align-items: flex-start;
        flex-direction: column;
        min-height: 0;
        padding: 24px;
    }

    body.panel-app.panel-design-system .finance-hero-actions {
        justify-content: flex-start;
        width: 100%;
    }

    body.panel-app.panel-design-system .finance-overdue-table-head {
        display: none;
    }

    body.panel-app.panel-design-system .finance-overdue-table {
        display: grid;
        gap: 10px;
        overflow: visible;
        border: 0;
        border-radius: 0;
    }

    body.panel-app.panel-design-system .finance-overdue-table-body {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    body.panel-app.panel-design-system .finance-overdue-row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        min-height: 0;
        padding: 15px;
        border: 1px solid rgba(125, 160, 194, 0.13);
        border-radius: 14px;
    }

    body.panel-app.panel-design-system .finance-student-cell,
    body.panel-app.panel-design-system .finance-row-actions {
        grid-column: 1 / -1;
    }

    body.panel-app.panel-design-system .finance-row-actions {
        justify-content: stretch;
        padding-top: 3px;
    }

    body.panel-app.panel-design-system .finance-row-actions form {
        flex: 1 1 auto;
    }

    body.panel-app.panel-design-system .finance-reminder-button {
        width: 100%;
    }
}

@media (max-width: 660px) {
    body.panel-app.panel-design-system .finance-page {
        gap: 14px;
    }

    body.panel-app.panel-design-system .finance-hero,
    body.panel-app.panel-design-system .finance-panel {
        padding: 18px;
        border-radius: 17px;
    }

    body.panel-app.panel-design-system .finance-hero-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.panel-app.panel-design-system .finance-hero-actions .finance-button:last-child {
        grid-column: 1 / -1;
    }

    body.panel-app.panel-design-system .finance-button {
        width: 100%;
        padding: 0 11px;
    }

    body.panel-app.panel-design-system .finance-summary-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    body.panel-app.panel-design-system .finance-summary-card {
        min-height: 101px;
        padding: 16px;
    }

    body.panel-app.panel-design-system .finance-panel-header,
    body.panel-app.panel-design-system .finance-overdue-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    body.panel-app.panel-design-system .finance-panel-total {
        text-align: left;
    }

    body.panel-app.panel-design-system .finance-chart-insights {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .finance-line-chart {
        min-height: 280px;
        overflow-x: auto;
    }

    body.panel-app.panel-design-system .finance-line-chart svg,
    body.panel-app.panel-design-system .finance-chart-labels {
        min-width: 660px;
    }

    body.panel-app.panel-design-system .finance-aging-total {
        padding: 14px;
    }

    body.panel-app.panel-design-system .finance-aging-total > div:first-child strong {
        font-size: 23px;
    }

    body.panel-app.panel-design-system .finance-aging-ring {
        flex-basis: 76px;
        width: 76px;
        height: 76px;
    }

    body.panel-app.panel-design-system .finance-overdue-table-body {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .finance-empty-state {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    body.panel-app.panel-design-system .finance-empty-state .finance-button {
        flex: 1 0 100%;
    }
}

@media print {
    body.panel-app.panel-design-system .finance-hero-actions,
    body.panel-app.panel-design-system .finance-row-actions,
    body.panel-app.panel-design-system .sidebar,
    body.panel-app.panel-design-system .dashboard-sidebar,
    body.panel-app.panel-design-system .dashboard-header-actions {
        display: none !important;
    }

    body.panel-app.panel-design-system .finance-page {
        color: #111;
    }

    body.panel-app.panel-design-system .finance-hero,
    body.panel-app.panel-design-system .finance-panel,
    body.panel-app.panel-design-system .finance-summary-card {
        break-inside: avoid;
        box-shadow: none;
    }
}

/*
|--------------------------------------------------------------------------
| PAINEL FINANCEIRO - VANTAGEM UI 4.0
|--------------------------------------------------------------------------
*/

body.panel-app.panel-design-system .finance-page {
    --finance-bg: #0d2134;
    --finance-bg-deep: #081827;
    --finance-border: rgba(125, 160, 194, 0.18);
    --finance-border-strong: rgba(125, 160, 194, 0.28);
    --finance-text: #f5f8fc;
    --finance-muted: #8fa5bb;
    --finance-yellow: #ffbd27;
    --finance-yellow-dark: #e7a20b;
    --finance-green: #42d49d;
    --finance-red: #ff6b75;
    --finance-blue: #5aa8ff;

    display: grid;
    gap: 20px;
    width: 100%;
    min-width: 0;
}

body.panel-app.panel-design-system .finance-page *,
body.panel-app.panel-design-system .finance-page *::before,
body.panel-app.panel-design-system .finance-page *::after {
    box-sizing: border-box;
}

body.panel-app.panel-design-system .finance-hero,
body.panel-app.panel-design-system .finance-panel,
body.panel-app.panel-design-system .finance-summary-card {
    border: 1px solid var(--finance-border);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.018),
        0 18px 42px rgba(0, 0, 0, 0.12);
}

body.panel-app.panel-design-system .finance-hero {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    min-height: 168px;
    padding: 28px 30px;
    overflow: hidden;
    background:
        radial-gradient(circle at 90% 18%, rgba(255, 189, 39, 0.11), transparent 25%),
        linear-gradient(135deg, rgba(28, 40, 38, 0.98), rgba(11, 31, 48, 0.98) 58%);
    border-radius: 22px;
}

body.panel-app.panel-design-system .finance-hero::after {
    content: "";
    position: absolute;
    right: -80px;
    bottom: -160px;
    width: 290px;
    height: 290px;
    border: 30px solid rgba(255, 189, 39, 0.035);
    border-radius: 50%;
    pointer-events: none;
}

body.panel-app.panel-design-system .finance-hero-copy,
body.panel-app.panel-design-system .finance-hero-actions {
    position: relative;
    z-index: 2;
}

body.panel-app.panel-design-system .finance-hero-copy {
    max-width: 750px;
}

body.panel-app.panel-design-system .finance-kicker {
    display: block;
    margin-bottom: 7px;
    color: #9ebce0;
    font-size: 11px;
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.panel-app.panel-design-system .finance-hero h2,
body.panel-app.panel-design-system .finance-panel h3 {
    margin: 0;
    color: var(--finance-text);
    font-weight: 900;
    letter-spacing: -0.035em;
}

body.panel-app.panel-design-system .finance-hero h2 {
    font-size: clamp(25px, 2.4vw, 38px);
    line-height: 1.08;
}

body.panel-app.panel-design-system .finance-hero p,
body.panel-app.panel-design-system .finance-panel-header p {
    margin: 9px 0 0;
    color: var(--finance-muted);
    font-size: 14px;
    line-height: 1.6;
}

body.panel-app.panel-design-system .finance-hero-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

body.panel-app.panel-design-system .finance-button,
body.panel-app.panel-design-system .finance-icon-button,
body.panel-app.panel-design-system .finance-reminder-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 42px;
    margin: 0;
    padding: 0 16px;
    border: 1px solid transparent;
    border-radius: 12px;
    font: inherit;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        background-color 160ms ease,
        box-shadow 160ms ease;
}

body.panel-app.panel-design-system .finance-button:hover,
body.panel-app.panel-design-system .finance-icon-button:hover,
body.panel-app.panel-design-system .finance-reminder-button:hover {
    transform: translateY(-2px);
}

body.panel-app.panel-design-system .finance-button-secondary {
    color: #f1f6fb;
    background: rgba(12, 31, 48, 0.66);
    border-color: rgba(136, 166, 194, 0.22);
}

body.panel-app.panel-design-system .finance-button-secondary:hover {
    border-color: rgba(255, 189, 39, 0.38);
    background: rgba(18, 42, 63, 0.94);
}

body.panel-app.panel-design-system .finance-button-primary,
body.panel-app.panel-design-system .finance-reminder-button {
    color: #101821;
    background: linear-gradient(135deg, #ffc73e, #ffb516);
    border-color: rgba(255, 205, 84, 0.76);
    box-shadow: 0 10px 24px rgba(255, 181, 22, 0.16);
}

body.panel-app.panel-design-system .finance-button-primary:hover,
body.panel-app.panel-design-system .finance-reminder-button:hover {
    box-shadow: 0 14px 30px rgba(255, 181, 22, 0.24);
}

body.panel-app.panel-design-system .finance-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

body.panel-app.panel-design-system .finance-summary-card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 15px;
    min-width: 0;
    min-height: 116px;
    padding: 20px;
    overflow: hidden;
    background:
        linear-gradient(145deg, rgba(18, 42, 64, 0.98), rgba(13, 33, 52, 0.98));
    border-radius: 18px;
}

body.panel-app.panel-design-system .finance-summary-card::after {
    content: "";
    position: absolute;
    right: -40px;
    bottom: -65px;
    width: 125px;
    height: 125px;
    border: 20px solid rgba(255, 255, 255, 0.012);
    border-radius: 50%;
}

body.panel-app.panel-design-system .finance-summary-icon {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    color: var(--finance-blue);
    background: rgba(90, 168, 255, 0.1);
    border: 1px solid rgba(90, 168, 255, 0.14);
    border-radius: 14px;
    font-size: 16px;
}

body.panel-app.panel-design-system .finance-summary-card.is-received .finance-summary-icon {
    color: var(--finance-green);
    background: rgba(66, 212, 157, 0.1);
    border-color: rgba(66, 212, 157, 0.15);
}

body.panel-app.panel-design-system .finance-summary-card.is-overdue .finance-summary-icon {
    color: var(--finance-red);
    background: rgba(255, 107, 117, 0.1);
    border-color: rgba(255, 107, 117, 0.16);
}

body.panel-app.panel-design-system .finance-summary-card.is-count .finance-summary-icon {
    color: var(--finance-yellow);
    background: rgba(255, 189, 39, 0.1);
    border-color: rgba(255, 189, 39, 0.15);
}

body.panel-app.panel-design-system .finance-summary-content {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 5px;
    min-width: 0;
}

body.panel-app.panel-design-system .finance-summary-content > span {
    color: #a7b8ca;
    font-size: 12px;
    font-weight: 700;
}

body.panel-app.panel-design-system .finance-summary-content strong {
    overflow: hidden;
    color: var(--finance-text);
    font-size: clamp(21px, 1.8vw, 29px);
    font-weight: 900;
    line-height: 1.05;
    letter-spacing: -0.035em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .finance-summary-content small {
    overflow: hidden;
    color: #718aa2;
    font-size: 10px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .finance-summary-accent {
    position: absolute;
    right: 0;
    top: 22px;
    bottom: 22px;
    width: 3px;
    background: var(--finance-blue);
    border-radius: 4px 0 0 4px;
    opacity: 0.76;
}

body.panel-app.panel-design-system .finance-summary-card.is-received .finance-summary-accent {
    background: var(--finance-green);
}

body.panel-app.panel-design-system .finance-summary-card.is-overdue .finance-summary-accent {
    background: var(--finance-red);
}

body.panel-app.panel-design-system .finance-summary-card.is-count .finance-summary-accent {
    background: var(--finance-yellow);
}

body.panel-app.panel-design-system .finance-analytics-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(340px, 0.9fr);
    gap: 16px;
    align-items: stretch;
}

body.panel-app.panel-design-system .finance-panel {
    min-width: 0;
    padding: 22px;
    background:
        linear-gradient(145deg, rgba(18, 42, 64, 0.98), rgba(13, 33, 52, 0.98));
    border-radius: 20px;
}

body.panel-app.panel-design-system .finance-panel-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

body.panel-app.panel-design-system .finance-panel-header > div:first-child {
    min-width: 0;
}

body.panel-app.panel-design-system .finance-panel h3 {
    font-size: clamp(21px, 1.8vw, 28px);
    line-height: 1.12;
}

body.panel-app.panel-design-system .finance-panel-total {
    display: grid;
    flex: 0 0 auto;
    gap: 3px;
    text-align: right;
}

body.panel-app.panel-design-system .finance-panel-total small,
body.panel-app.panel-design-system .finance-aging-total span,
body.panel-app.panel-design-system .finance-chart-insights span {
    color: #7f96ad;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

body.panel-app.panel-design-system .finance-panel-total strong {
    color: var(--finance-text);
    font-size: 21px;
    font-weight: 900;
}

body.panel-app.panel-design-system .finance-chart-insights {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 10px;
}

body.panel-app.panel-design-system .finance-chart-insights > div {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: end;
    gap: 3px 10px;
    padding: 11px 13px;
    background: rgba(7, 25, 41, 0.5);
    border: 1px solid rgba(125, 160, 194, 0.12);
    border-radius: 12px;
}

body.panel-app.panel-design-system .finance-chart-insights span {
    grid-column: 1 / -1;
}

body.panel-app.panel-design-system .finance-chart-insights strong {
    color: #edf5fc;
    font-size: 14px;
    font-weight: 900;
}

body.panel-app.panel-design-system .finance-chart-insights small {
    justify-self: end;
    color: #8da2b6;
    font-size: 10px;
}

body.panel-app.panel-design-system .finance-line-chart {
    position: relative;
    min-height: 305px;
    padding: 8px 6px 0;
    overflow: hidden;
}

body.panel-app.panel-design-system .finance-line-chart svg {
    display: block;
    width: 100%;
    height: 260px;
    overflow: visible;
}

body.panel-app.panel-design-system .finance-chart-grid-line {
    stroke: rgba(139, 169, 198, 0.1);
    stroke-width: 1;
    vector-effect: non-scaling-stroke;
}

body.panel-app.panel-design-system .finance-chart-line {
    fill: none;
    stroke: var(--finance-yellow);
    stroke-width: 4;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

body.panel-app.panel-design-system .finance-chart-point-halo {
    fill: rgba(255, 189, 39, 0.13);
    vector-effect: non-scaling-stroke;
}

body.panel-app.panel-design-system .finance-chart-point {
    fill: var(--finance-yellow);
    stroke: #11283c;
    stroke-width: 3;
    vector-effect: non-scaling-stroke;
}

body.panel-app.panel-design-system .finance-chart-labels {
    display: grid;
    grid-template-columns: repeat(var(--finance-month-count), minmax(42px, 1fr));
    align-items: start;
    gap: 0;
    margin-top: -4px;
}

body.panel-app.panel-design-system .finance-chart-labels span {
    color: #7890a7;
    font-size: 9px;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
}

body.panel-app.panel-design-system .finance-health-badge,
body.panel-app.panel-design-system .finance-list-count,
body.panel-app.panel-design-system .finance-days-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 30px;
    padding: 0 11px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 900;
    white-space: nowrap;
}

body.panel-app.panel-design-system .finance-health-badge.is-healthy {
    color: #78e3ba;
    background: rgba(66, 212, 157, 0.09);
    border: 1px solid rgba(66, 212, 157, 0.17);
}

body.panel-app.panel-design-system .finance-health-badge.is-warning {
    color: #ffcf66;
    background: rgba(255, 189, 39, 0.09);
    border: 1px solid rgba(255, 189, 39, 0.17);
}

body.panel-app.panel-design-system .finance-aging-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 17px;
    margin-bottom: 15px;
    background:
        radial-gradient(circle at 100% 0, rgba(255, 189, 39, 0.1), transparent 40%),
        rgba(7, 25, 41, 0.56);
    border: 1px solid rgba(125, 160, 194, 0.13);
    border-radius: 16px;
}

body.panel-app.panel-design-system .finance-aging-total > div:first-child {
    display: grid;
    gap: 6px;
}

body.panel-app.panel-design-system .finance-aging-total > div:first-child strong {
    color: var(--finance-text);
    font-size: 28px;
    font-weight: 900;
    letter-spacing: -0.04em;
}

body.panel-app.panel-design-system .finance-aging-ring {
    --ring-angle: calc(var(--aging-progress) * 3.6deg);

    display: grid;
    place-items: center;
    align-content: center;
    flex: 0 0 88px;
    width: 88px;
    height: 88px;
    background:
        radial-gradient(circle, #102a41 57%, transparent 58%),
        conic-gradient(var(--finance-yellow) var(--ring-angle), rgba(113, 144, 174, 0.13) 0);
    border-radius: 50%;
}

body.panel-app.panel-design-system .finance-aging-ring strong {
    color: #fff4d3;
    font-size: 18px;
    font-weight: 900;
    line-height: 1;
}

body.panel-app.panel-design-system .finance-aging-ring small {
    margin-top: 4px;
    color: #8198ad;
    font-size: 8px;
    font-weight: 800;
    text-transform: uppercase;
}

body.panel-app.panel-design-system .finance-aging-list {
    display: grid;
    gap: 10px;
}

body.panel-app.panel-design-system .finance-aging-item {
    display: grid;
    gap: 9px;
    padding: 12px 13px;
    background: rgba(7, 25, 41, 0.38);
    border: 1px solid rgba(125, 160, 194, 0.1);
    border-radius: 12px;
}

body.panel-app.panel-design-system .finance-aging-item-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

body.panel-app.panel-design-system .finance-aging-item-heading > div {
    display: flex;
    align-items: baseline;
    gap: 9px;
    min-width: 0;
}

body.panel-app.panel-design-system .finance-aging-item-heading span {
    color: #9cb0c3;
    font-size: 11px;
    font-weight: 700;
}

body.panel-app.panel-design-system .finance-aging-item-heading strong {
    color: #f4f8fc;
    font-size: 13px;
    font-weight: 900;
}

body.panel-app.panel-design-system .finance-aging-item-heading small {
    color: #718aa2;
    font-size: 10px;
    font-weight: 800;
}

body.panel-app.panel-design-system .finance-aging-progress {
    display: block;
    height: 5px;
    overflow: hidden;
    background: rgba(125, 160, 194, 0.11);
    border-radius: 999px;
}

body.panel-app.panel-design-system .finance-aging-progress i {
    display: block;
    min-width: 0;
    height: 100%;
    background: linear-gradient(90deg, var(--finance-yellow-dark), var(--finance-yellow));
    border-radius: inherit;
}

body.panel-app.panel-design-system .finance-overdue-panel {
    padding-bottom: 22px;
}

body.panel-app.panel-design-system .finance-overdue-header {
    align-items: center;
}

body.panel-app.panel-design-system .finance-list-count {
    color: #dce8f3;
    background: rgba(9, 27, 43, 0.56);
    border: 1px solid rgba(125, 160, 194, 0.17);
}

body.panel-app.panel-design-system .finance-overdue-table {
    overflow: hidden;
    border: 1px solid rgba(125, 160, 194, 0.13);
    border-radius: 15px;
}

body.panel-app.panel-design-system .finance-overdue-table-head,
body.panel-app.panel-design-system .finance-overdue-row {
    display: grid;
    grid-template-columns:
        minmax(220px, 1.55fr)
        minmax(105px, 0.78fr)
        minmax(105px, 0.78fr)
        minmax(90px, 0.6fr)
        minmax(105px, 0.72fr)
        minmax(180px, auto);
    align-items: center;
    gap: 15px;
}

body.panel-app.panel-design-system .finance-overdue-table-head {
    min-height: 43px;
    padding: 0 16px;
    color: #718aa2;
    background: rgba(6, 22, 36, 0.52);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

body.panel-app.panel-design-system .finance-table-actions-label {
    text-align: right;
}

body.panel-app.panel-design-system .finance-overdue-row {
    min-height: 76px;
    padding: 11px 16px;
    background: rgba(12, 33, 51, 0.56);
    border-top: 1px solid rgba(125, 160, 194, 0.1);
    transition: background-color 160ms ease;
}

body.panel-app.panel-design-system .finance-overdue-row:hover {
    background: rgba(17, 42, 63, 0.8);
}

body.panel-app.panel-design-system .finance-student-cell {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

body.panel-app.panel-design-system .finance-student-avatar {
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    color: #111a21;
    background: linear-gradient(135deg, #ffc83f, #ffb310);
    border-radius: 11px;
    font-size: 13px;
    font-weight: 950;
    box-shadow: 0 8px 18px rgba(255, 181, 16, 0.13);
}

body.panel-app.panel-design-system .finance-student-cell > div,
body.panel-app.panel-design-system .finance-mobile-field {
    min-width: 0;
}

body.panel-app.panel-design-system .finance-student-cell strong,
body.panel-app.panel-design-system .finance-mobile-field strong {
    display: block;
    overflow: hidden;
    color: #edf5fc;
    font-size: 12px;
    font-weight: 900;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .finance-student-cell small,
body.panel-app.panel-design-system .finance-mobile-field small {
    display: block;
    margin-bottom: 3px;
    overflow: hidden;
    color: #71899f;
    font-size: 9px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.panel-app.panel-design-system .finance-student-cell small {
    margin-top: 3px;
    margin-bottom: 0;
}

body.panel-app.panel-design-system .finance-days-badge {
    min-height: 27px;
    padding: 0 9px;
    color: #ffd982;
    background: rgba(255, 189, 39, 0.09);
    border: 1px solid rgba(255, 189, 39, 0.14);
}

body.panel-app.panel-design-system .finance-amount-cell strong {
    color: #ffd576;
    font-size: 13px;
}

body.panel-app.panel-design-system .finance-row-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

body.panel-app.panel-design-system .finance-row-actions form {
    margin: 0;
}

body.panel-app.panel-design-system .finance-icon-button {
    width: 39px;
    min-width: 39px;
    height: 39px;
    min-height: 39px;
    padding: 0;
    color: #b9c9d8;
    background: rgba(8, 26, 42, 0.62);
    border-color: rgba(125, 160, 194, 0.16);
}

body.panel-app.panel-design-system .finance-icon-button:hover {
    color: #fff;
    border-color: rgba(255, 189, 39, 0.28);
}

body.panel-app.panel-design-system .finance-reminder-button {
    min-height: 39px;
    padding: 0 13px;
    font-size: 10px;
}

body.panel-app.panel-design-system .finance-empty-state {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 22px;
    background:
        linear-gradient(135deg, rgba(66, 212, 157, 0.06), rgba(7, 25, 41, 0.3));
    border: 1px dashed rgba(66, 212, 157, 0.2);
    border-radius: 15px;
}

body.panel-app.panel-design-system .finance-empty-state > span {
    display: grid;
    place-items: center;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    color: var(--finance-green);
    background: rgba(66, 212, 157, 0.09);
    border: 1px solid rgba(66, 212, 157, 0.15);
    border-radius: 14px;
    font-size: 17px;
}

body.panel-app.panel-design-system .finance-empty-state > div {
    flex: 1 1 auto;
    min-width: 0;
}

body.panel-app.panel-design-system .finance-empty-state strong {
    display: block;
    color: #edf7f2;
    font-size: 14px;
    font-weight: 900;
}

body.panel-app.panel-design-system .finance-empty-state p {
    margin: 4px 0 0;
    color: #8299ae;
    font-size: 11px;
    line-height: 1.55;
}

@media (max-width: 1260px) {
    body.panel-app.panel-design-system .finance-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.panel-app.panel-design-system .finance-analytics-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .finance-overdue-table-head,
    body.panel-app.panel-design-system .finance-overdue-row {
        grid-template-columns:
            minmax(200px, 1.4fr)
            minmax(100px, 0.8fr)
            minmax(100px, 0.8fr)
            minmax(85px, 0.65fr)
            minmax(100px, 0.75fr)
            minmax(150px, auto);
        gap: 11px;
    }
}

@media (max-width: 900px) {
    body.panel-app.panel-design-system .finance-hero {
        align-items: flex-start;
        flex-direction: column;
        min-height: 0;
        padding: 24px;
    }

    body.panel-app.panel-design-system .finance-hero-actions {
        justify-content: flex-start;
        width: 100%;
    }

    body.panel-app.panel-design-system .finance-overdue-table-head {
        display: none;
    }

    body.panel-app.panel-design-system .finance-overdue-table {
        display: grid;
        gap: 10px;
        overflow: visible;
        border: 0;
        border-radius: 0;
    }

    body.panel-app.panel-design-system .finance-overdue-table-body {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    body.panel-app.panel-design-system .finance-overdue-row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        min-height: 0;
        padding: 15px;
        border: 1px solid rgba(125, 160, 194, 0.13);
        border-radius: 14px;
    }

    body.panel-app.panel-design-system .finance-student-cell,
    body.panel-app.panel-design-system .finance-row-actions {
        grid-column: 1 / -1;
    }

    body.panel-app.panel-design-system .finance-row-actions {
        justify-content: stretch;
        padding-top: 3px;
    }

    body.panel-app.panel-design-system .finance-row-actions form {
        flex: 1 1 auto;
    }

    body.panel-app.panel-design-system .finance-reminder-button {
        width: 100%;
    }
}

@media (max-width: 660px) {
    body.panel-app.panel-design-system .finance-page {
        gap: 14px;
    }

    body.panel-app.panel-design-system .finance-hero,
    body.panel-app.panel-design-system .finance-panel {
        padding: 18px;
        border-radius: 17px;
    }

    body.panel-app.panel-design-system .finance-hero-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.panel-app.panel-design-system .finance-hero-actions .finance-button:last-child {
        grid-column: 1 / -1;
    }

    body.panel-app.panel-design-system .finance-button {
        width: 100%;
        padding: 0 11px;
    }

    body.panel-app.panel-design-system .finance-summary-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    body.panel-app.panel-design-system .finance-summary-card {
        min-height: 101px;
        padding: 16px;
    }

    body.panel-app.panel-design-system .finance-panel-header,
    body.panel-app.panel-design-system .finance-overdue-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    body.panel-app.panel-design-system .finance-panel-total {
        text-align: left;
    }

    body.panel-app.panel-design-system .finance-chart-insights {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .finance-line-chart {
        min-height: 280px;
        overflow-x: auto;
    }

    body.panel-app.panel-design-system .finance-line-chart svg,
    body.panel-app.panel-design-system .finance-chart-labels {
        min-width: 660px;
    }

    body.panel-app.panel-design-system .finance-aging-total {
        padding: 14px;
    }

    body.panel-app.panel-design-system .finance-aging-total > div:first-child strong {
        font-size: 23px;
    }

    body.panel-app.panel-design-system .finance-aging-ring {
        flex-basis: 76px;
        width: 76px;
        height: 76px;
    }

    body.panel-app.panel-design-system .finance-overdue-table-body {
        grid-template-columns: minmax(0, 1fr);
    }

    body.panel-app.panel-design-system .finance-empty-state {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    body.panel-app.panel-design-system .finance-empty-state .finance-button {
        flex: 1 0 100%;
    }
}


/*
|--------------------------------------------------------------------------
| RELATÓRIO DE IMPRESSÃO
|--------------------------------------------------------------------------
*/
body.panel-app.panel-design-system .finance-print-report {
    display: none;
}

@page {
    size: A4 portrait;
    margin: 11mm 10mm 12mm;
}

@media print {
    html,
    body.panel-app.panel-design-system {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #182431 !important;
        background: #ffffff !important;
        font-family: "Montserrat", Arial, sans-serif !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    body.panel-app.panel-design-system .dashboard-sidebar,
    body.panel-app.panel-design-system .sidebar-overlay,
    body.panel-app.panel-design-system .dashboard-header,
    body.panel-app.panel-design-system .finance-page,
    body.panel-app.panel-design-system .panel-search-layer,
    body.panel-app.panel-design-system .notification-permission-layer,
    body.panel-app.panel-design-system .registration-invite-layer {
        display: none !important;
    }

    body.panel-app.panel-design-system .dashboard-layout,
    body.panel-app.panel-design-system .dashboard-main,
    body.panel-app.panel-design-system .dashboard-content {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        background: #ffffff !important;
    }

    body.panel-app.panel-design-system .finance-print-report {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        color: #182431 !important;
        background: #ffffff !important;
        font-size: 9.4pt;
        line-height: 1.45;
    }

    body.panel-app.panel-design-system .finance-print-report *,
    body.panel-app.panel-design-system .finance-print-report *::before,
    body.panel-app.panel-design-system .finance-print-report *::after {
        box-sizing: border-box !important;
    }

    body.panel-app.panel-design-system .finance-print-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        padding: 0 0 7mm;
        border-bottom: 1.5px solid #d7e0e8;
    }

    body.panel-app.panel-design-system .finance-print-brand {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    body.panel-app.panel-design-system .finance-print-brand img {
        display: block;
        width: 34mm;
        max-height: 15mm;
        object-fit: contain;
        object-position: left center;
    }

    body.panel-app.panel-design-system .finance-print-brand > div {
        display: grid;
        gap: 1px;
        padding-left: 10px;
        border-left: 1px solid #d7e0e8;
    }

    body.panel-app.panel-design-system .finance-print-brand span,
    body.panel-app.panel-design-system .finance-print-document-meta span,
    body.panel-app.panel-design-system .finance-print-kicker,
    body.panel-app.panel-design-system .finance-print-section-heading span {
        color: #63788d !important;
        font-size: 7.5pt;
        font-weight: 800;
        letter-spacing: 0.08em;
        text-transform: uppercase;
    }

    body.panel-app.panel-design-system .finance-print-brand strong {
        color: #243546 !important;
        font-size: 8.5pt;
        font-weight: 700;
    }

    body.panel-app.panel-design-system .finance-print-document-meta {
        display: grid;
        gap: 3px;
        text-align: right;
    }

    body.panel-app.panel-design-system .finance-print-document-meta strong {
        color: #0d2134 !important;
        font-size: 10pt;
        font-weight: 900;
    }

    body.panel-app.panel-design-system .finance-print-title-block {
        display: grid;
        grid-template-columns: minmax(0, 1.35fr) minmax(65mm, 0.65fr);
        gap: 12mm;
        align-items: end;
        padding: 8mm 0 6mm;
    }

    body.panel-app.panel-design-system .finance-print-title-block h1 {
        margin: 2mm 0 2mm;
        color: #0d2134 !important;
        font-size: 23pt;
        font-weight: 900;
        line-height: 1.05;
        letter-spacing: -0.04em;
    }

    body.panel-app.panel-design-system .finance-print-title-block p {
        max-width: 112mm;
        margin: 0;
        color: #62778a !important;
        font-size: 8.8pt;
        line-height: 1.55;
    }

    body.panel-app.panel-design-system .finance-print-meta-grid {
        display: grid;
        gap: 0;
        margin: 0;
        overflow: hidden;
        background: #f5f8fb !important;
        border: 1px solid #dce5ec;
        border-radius: 10px;
    }

    body.panel-app.panel-design-system .finance-print-meta-grid > div {
        display: grid;
        grid-template-columns: 34mm minmax(0, 1fr);
        gap: 5mm;
        padding: 2.4mm 3.2mm;
        border-top: 1px solid #e2e9ef;
    }

    body.panel-app.panel-design-system .finance-print-meta-grid > div:first-child {
        border-top: 0;
    }

    body.panel-app.panel-design-system .finance-print-meta-grid dt,
    body.panel-app.panel-design-system .finance-print-meta-grid dd {
        margin: 0;
    }

    body.panel-app.panel-design-system .finance-print-meta-grid dt {
        color: #718396 !important;
        font-size: 7.2pt;
        font-weight: 700;
    }

    body.panel-app.panel-design-system .finance-print-meta-grid dd {
        overflow: hidden;
        color: #203244 !important;
        font-size: 7.5pt;
        font-weight: 800;
        text-align: right;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.panel-app.panel-design-system .finance-print-summary {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 3mm;
        margin-bottom: 6mm;
    }

    body.panel-app.panel-design-system .finance-print-summary article {
        position: relative;
        display: grid;
        gap: 1.2mm;
        min-height: 25mm;
        padding: 4mm 3.8mm 3.5mm;
        overflow: hidden;
        background: #f7f9fb !important;
        border: 1px solid #dce4eb;
        border-top: 3px solid #5aa8ff;
        border-radius: 9px;
        break-inside: avoid;
    }

    body.panel-app.panel-design-system .finance-print-summary article.is-green {
        border-top-color: #2bb889;
    }

    body.panel-app.panel-design-system .finance-print-summary article.is-red {
        border-top-color: #e45862;
    }

    body.panel-app.panel-design-system .finance-print-summary article.is-yellow {
        border-top-color: #e9a500;
    }

    body.panel-app.panel-design-system .finance-print-summary article > span {
        color: #667b8e !important;
        font-size: 7.2pt;
        font-weight: 700;
    }

    body.panel-app.panel-design-system .finance-print-summary article > strong {
        color: #12283a !important;
        font-size: 15pt;
        font-weight: 900;
        line-height: 1.05;
        letter-spacing: -0.035em;
    }

    body.panel-app.panel-design-system .finance-print-summary article > small {
        color: #8191a0 !important;
        font-size: 6.4pt;
        line-height: 1.3;
    }

    body.panel-app.panel-design-system .finance-print-section {
        margin-top: 5mm;
        padding-top: 4mm;
        border-top: 1px solid #d9e2e9;
    }

    body.panel-app.panel-design-system .finance-print-section-heading {
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 10mm;
        margin-bottom: 3.5mm;
    }

    body.panel-app.panel-design-system .finance-print-section-heading h2 {
        margin: 1mm 0 0;
        color: #10273a !important;
        font-size: 13pt;
        font-weight: 900;
        line-height: 1.15;
        letter-spacing: -0.025em;
    }

    body.panel-app.panel-design-system .finance-print-section-heading > strong {
        color: #354c60 !important;
        font-size: 8pt;
        font-weight: 800;
        text-align: right;
    }

    body.panel-app.panel-design-system .finance-print-health {
        display: inline-flex;
        align-items: center;
        min-height: 7mm;
        padding: 0 3mm;
        color: #176848 !important;
        background: #e9f7f1 !important;
        border: 1px solid #bfe5d4;
        border-radius: 99px;
        font-size: 7pt !important;
    }

    body.panel-app.panel-design-system .finance-print-health.is-warning {
        color: #9a4b22 !important;
        background: #fff2e9 !important;
        border-color: #f3c7ad;
    }

    body.panel-app.panel-design-system .finance-print-overview-grid {
        display: grid;
        grid-template-columns: minmax(0, 1.35fr) minmax(58mm, 0.65fr);
        gap: 4mm;
    }

    body.panel-app.panel-design-system .finance-print-key-table,
    body.panel-app.panel-design-system .finance-print-table {
        width: 100%;
        border-collapse: collapse;
        table-layout: fixed;
    }

    body.panel-app.panel-design-system .finance-print-key-table {
        overflow: hidden;
        border: 1px solid #dce4eb;
        border-radius: 8px;
    }

    body.panel-app.panel-design-system .finance-print-key-table th,
    body.panel-app.panel-design-system .finance-print-key-table td {
        padding: 2.4mm 3mm;
        border-top: 1px solid #e3e9ee;
        font-size: 7.5pt;
    }

    body.panel-app.panel-design-system .finance-print-key-table tr:first-child th,
    body.panel-app.panel-design-system .finance-print-key-table tr:first-child td {
        border-top: 0;
    }

    body.panel-app.panel-design-system .finance-print-key-table th {
        width: 62%;
        color: #64798b !important;
        background: #f7f9fb !important;
        font-weight: 700;
        text-align: left;
    }

    body.panel-app.panel-design-system .finance-print-key-table td {
        color: #172d40 !important;
        font-weight: 900;
        text-align: right;
    }

    body.panel-app.panel-design-system .finance-print-rate-card {
        display: flex;
        align-items: center;
        gap: 4mm;
        padding: 4mm;
        background: #f6f9fb !important;
        border: 1px solid #dce4eb;
        border-radius: 9px;
        break-inside: avoid;
    }

    body.panel-app.panel-design-system .finance-print-rate-ring {
        display: grid;
        place-items: center;
        flex: 0 0 24mm;
        width: 24mm;
        height: 24mm;
        background:
            radial-gradient(circle at center, #ffffff 57%, transparent 58%),
            conic-gradient(#e45862 calc(var(--print-rate) * 1%), #e5ebf0 0) !important;
        border-radius: 50%;
    }

    body.panel-app.panel-design-system .finance-print-rate-ring strong {
        color: #b63c45 !important;
        font-size: 11pt;
        font-weight: 900;
    }

    body.panel-app.panel-design-system .finance-print-rate-card > div:last-child {
        display: grid;
        gap: 1mm;
        min-width: 0;
    }

    body.panel-app.panel-design-system .finance-print-rate-card span,
    body.panel-app.panel-design-system .finance-print-rate-card small {
        color: #748698 !important;
        font-size: 7pt;
    }

    body.panel-app.panel-design-system .finance-print-rate-card > div:last-child > strong {
        color: #1a2e40 !important;
        font-size: 11pt;
        font-weight: 900;
    }

    body.panel-app.panel-design-system .finance-print-month-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 2.4mm 5mm;
    }

    body.panel-app.panel-design-system .finance-print-month-item {
        display: grid;
        grid-template-columns: 33mm minmax(0, 1fr);
        align-items: center;
        gap: 3mm;
        min-height: 8mm;
        break-inside: avoid;
    }

    body.panel-app.panel-design-system .finance-print-month-item > div {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 2mm;
    }

    body.panel-app.panel-design-system .finance-print-month-item > div span {
        color: #667b8d !important;
        font-size: 7pt;
        font-weight: 800;
    }

    body.panel-app.panel-design-system .finance-print-month-item > div strong {
        color: #1b3042 !important;
        font-size: 7.4pt;
        font-weight: 900;
    }

    body.panel-app.panel-design-system .finance-print-month-bar,
    body.panel-app.panel-design-system .finance-print-table-progress > span {
        display: block;
        height: 2.4mm;
        overflow: hidden;
        background: #e7edf2 !important;
        border-radius: 99px;
    }

    body.panel-app.panel-design-system .finance-print-month-bar i,
    body.panel-app.panel-design-system .finance-print-table-progress > span i {
        display: block;
        height: 100%;
        min-width: 1px;
        background: linear-gradient(90deg, #f4b51e, #ffd567) !important;
        border-radius: inherit;
    }

    body.panel-app.panel-design-system .finance-print-table {
        border: 1px solid #d8e1e8;
    }

    body.panel-app.panel-design-system .finance-print-table thead {
        display: table-header-group;
    }

    body.panel-app.panel-design-system .finance-print-table tr {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    body.panel-app.panel-design-system .finance-print-table th,
    body.panel-app.panel-design-system .finance-print-table td {
        padding: 2.2mm 2.5mm;
        border-right: 1px solid #e0e7ed;
        border-bottom: 1px solid #e0e7ed;
        vertical-align: middle;
    }

    body.panel-app.panel-design-system .finance-print-table th:last-child,
    body.panel-app.panel-design-system .finance-print-table td:last-child {
        border-right: 0;
    }

    body.panel-app.panel-design-system .finance-print-table tbody tr:last-child td {
        border-bottom: 0;
    }

    body.panel-app.panel-design-system .finance-print-table th {
        color: #4d6477 !important;
        background: #eef3f7 !important;
        font-size: 6.8pt;
        font-weight: 900;
        letter-spacing: 0.04em;
        text-align: left;
        text-transform: uppercase;
    }

    body.panel-app.panel-design-system .finance-print-table td {
        color: #213749 !important;
        font-size: 7.2pt;
    }

    body.panel-app.panel-design-system .finance-print-table td > strong {
        display: block;
        color: #172d40 !important;
        font-weight: 900;
    }

    body.panel-app.panel-design-system .finance-print-table td > small {
        display: block;
        margin-top: 0.6mm;
        color: #718497 !important;
        font-size: 6.3pt;
    }

    body.panel-app.panel-design-system .finance-print-table .is-numeric {
        text-align: right;
    }

    body.panel-app.panel-design-system .finance-print-table .is-centered {
        text-align: center;
    }

    body.panel-app.panel-design-system .finance-print-aging-table th:nth-child(1) {
        width: 29%;
    }

    body.panel-app.panel-design-system .finance-print-aging-table th:nth-child(2) {
        width: 49%;
    }

    body.panel-app.panel-design-system .finance-print-aging-table th:nth-child(3) {
        width: 22%;
    }

    body.panel-app.panel-design-system .finance-print-table-progress {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 9mm;
        align-items: center;
        gap: 2mm;
    }

    body.panel-app.panel-design-system .finance-print-table-progress strong {
        color: #526a7d !important;
        font-size: 6.6pt;
        text-align: right;
    }

    body.panel-app.panel-design-system .finance-print-overdue-section {
        break-before: auto;
    }

    body.panel-app.panel-design-system .finance-print-overdue-table-report th:nth-child(1) {
        width: 6%;
    }

    body.panel-app.panel-design-system .finance-print-overdue-table-report th:nth-child(2) {
        width: 34%;
    }

    body.panel-app.panel-design-system .finance-print-overdue-table-report th:nth-child(3) {
        width: 14%;
    }

    body.panel-app.panel-design-system .finance-print-overdue-table-report th:nth-child(4) {
        width: 15%;
    }

    body.panel-app.panel-design-system .finance-print-overdue-table-report th:nth-child(5) {
        width: 13%;
    }

    body.panel-app.panel-design-system .finance-print-overdue-table-report th:nth-child(6) {
        width: 18%;
    }

    body.panel-app.panel-design-system .finance-print-empty {
        padding: 7mm;
        color: #176848 !important;
        background: #eef9f4 !important;
        border: 1px solid #c9e9dc;
        border-radius: 9px;
        text-align: center;
    }

    body.panel-app.panel-design-system .finance-print-empty strong {
        display: block;
        font-size: 11pt;
        font-weight: 900;
    }

    body.panel-app.panel-design-system .finance-print-empty p {
        margin: 1.5mm 0 0;
        color: #55786a !important;
        font-size: 7.5pt;
    }

    body.panel-app.panel-design-system .finance-print-note {
        display: grid;
        grid-template-columns: 24mm minmax(0, 1fr);
        gap: 4mm;
        margin-top: 5mm;
        padding: 3.5mm 4mm;
        color: #5f7182 !important;
        background: #f7f9fb !important;
        border: 1px solid #dce4eb;
        border-left: 3px solid #e9a500;
        border-radius: 7px;
        break-inside: avoid;
    }

    body.panel-app.panel-design-system .finance-print-note strong {
        color: #2d4355 !important;
        font-size: 7.5pt;
        font-weight: 900;
    }

    body.panel-app.panel-design-system .finance-print-note p {
        margin: 0;
        font-size: 6.8pt;
        line-height: 1.5;
    }

    body.panel-app.panel-design-system .finance-print-footer {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10mm;
        margin-top: 7mm;
        padding-top: 3mm;
        color: #758696 !important;
        border-top: 1px solid #d7e0e7;
        font-size: 6.5pt;
    }

    body.panel-app.panel-design-system a,
    body.panel-app.panel-design-system button {
        text-decoration: none !important;
    }
}

/*
|--------------------------------------------------------------------------
| CORREÇÃO DA IMPRESSÃO DO RELATÓRIO FINANCEIRO
|--------------------------------------------------------------------------
| Cole este bloco no FINAL do arquivo que contém os estilos financeiros.
| Ele também funciona no final do vantagem-ui.css.
*/

@media print {
    @page {
        size: A4 portrait;
        margin: 11mm 10mm 12mm;
    }

    html,
    body {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #182431 !important;
        background: #ffffff !important;
        overflow: visible !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    body * {
        visibility: hidden !important;
    }

    body .dashboard-layout,
    body .dashboard-main,
    body .dashboard-content,
    body .finance-print-report,
    body .finance-print-report * {
        visibility: visible !important;
        opacity: 1 !important;
    }

    body .dashboard-sidebar,
    body .sidebar-overlay,
    body .dashboard-header,
    body .finance-page,
    body .panel-search-layer,
    body .notification-permission-layer,
    body .registration-invite-layer {
        display: none !important;
    }

    body .dashboard-layout,
    body .dashboard-main,
    body .dashboard-content {
        position: static !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        background: #ffffff !important;
        transform: none !important;
        filter: none !important;
    }

    body .finance-print-report {
        position: static !important;
        z-index: auto !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        color: #182431 !important;
        background: #ffffff !important;
        transform: none !important;
        filter: none !important;
    }

    body .finance-print-report *,
    body .finance-print-report *::before,
    body .finance-print-report *::after {
        visibility: visible !important;
        opacity: 1 !important;
        box-sizing: border-box !important;
    }
}
/* ========================================================================== 
   Correção definitiva: mapa do acompanhamento da família
   Mantém altura estável e protege os tiles do reset global de imagens.
   ========================================================================== */
body.panel-role-guardian .guardian-v2-tracking-card .guardian-tracking-stage {
    position: relative;
    width: 100%;
    height: 400px;
    min-height: 400px;
    max-height: 400px;
    overflow: hidden;
    contain: layout paint;
    isolation: isolate;
    border-radius: 17px;
    background: #071a2b;
}

body.panel-role-guardian .guardian-v2-tracking-card .guardian-live-map,
body.panel-role-guardian .guardian-v2-tracking-card .guardian-tracking-placeholder {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
}

body.panel-role-guardian .guardian-v2-tracking-card .guardian-live-map {
    z-index: 1;
    flex: none !important;
    transform: none !important;
}

body.panel-role-guardian .guardian-v2-tracking-card .guardian-live-map.leaflet-container {
    font-size: 12px;
    background: #071a2b;
    touch-action: pan-x pan-y;
}

/* O reset geral do painel usa img { max-width: 100% }. Sem esta proteção,
   os tiles de 256px do Leaflet encolhem e aparecem como quadrados soltos. */
body.panel-role-guardian .guardian-live-map.leaflet-container img,
body.panel-role-guardian .guardian-live-map .leaflet-tile {
    max-width: none !important;
    max-height: none !important;
}

body.panel-role-guardian .guardian-live-map .leaflet-tile {
    width: 256px !important;
    height: 256px !important;
}

body.panel-role-guardian .guardian-live-map .leaflet-map-pane,
body.panel-role-guardian .guardian-live-map .leaflet-tile-pane,
body.panel-role-guardian .guardian-live-map .leaflet-overlay-pane,
body.panel-role-guardian .guardian-live-map .leaflet-marker-pane,
body.panel-role-guardian .guardian-live-map .leaflet-shadow-pane,
body.panel-role-guardian .guardian-live-map .leaflet-tooltip-pane,
body.panel-role-guardian .guardian-live-map .leaflet-popup-pane {
    position: absolute;
    inset: 0 auto auto 0;
}

body.panel-role-guardian .guardian-v2-tracking-card .guardian-tracking-placeholder {
    z-index: 2;
    overflow: auto;
}

body.panel-role-guardian .guardian-v2-tracking-card .guardian-map-legend {
    z-index: 500;
}

@media (max-width: 820px) {
    body.panel-role-guardian .guardian-v2-tracking-card .guardian-tracking-stage {
        height: 340px;
        min-height: 340px;
        max-height: 340px;
    }
}

@media (max-width: 520px) {
    body.panel-role-guardian .guardian-v2-tracking-card .guardian-tracking-stage {
        height: 280px;
        min-height: 280px;
        max-height: 280px;
        border-radius: 14px;
    }

    body.panel-role-guardian .guardian-v2-tracking-card .guardian-map-legend {
        max-width: calc(100% - 24px);
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
    }
}

@media (max-width: 380px) {
    body.panel-role-guardian .guardian-v2-tracking-card .guardian-tracking-stage {
        height: 250px;
        min-height: 250px;
        max-height: 250px;
    }
}

/* ========================================================================== 
   Mapa da família v2
   Visual alinhado ao mapa operacional do motorista, carregamento estável e
   controles leves para desktop e celular.
   ========================================================================== */
body.panel-role-guardian .guardian-v2-tracking-card .guardian-tracking-stage {
    position: relative;
    height: 400px;
    min-height: 400px;
    max-height: 400px;
    overflow: hidden;
    contain: none;
    isolation: isolate;
    background: #050d16;
    border: 1px solid rgba(149, 174, 201, .12);
    border-radius: 17px;
}

body.panel-role-guardian .guardian-v2-tracking-card .guardian-live-map.leaflet-container {
    background: #050d16;
    outline: 0;
    touch-action: pan-x pan-y;
}

body.panel-role-guardian .guardian-live-map .leaflet-map-pane,
body.panel-role-guardian .guardian-live-map .leaflet-tile-pane,
body.panel-role-guardian .guardian-live-map .leaflet-overlay-pane,
body.panel-role-guardian .guardian-live-map .leaflet-marker-pane,
body.panel-role-guardian .guardian-live-map .leaflet-shadow-pane,
body.panel-role-guardian .guardian-live-map .leaflet-tooltip-pane,
body.panel-role-guardian .guardian-live-map .leaflet-popup-pane {
    top: 0 !important;
    right: auto !important;
    bottom: auto !important;
    left: 0 !important;
}

body.panel-role-guardian .guardian-live-map .leaflet-tile {
    width: 256px !important;
    height: 256px !important;
    max-width: none !important;
    max-height: none !important;
    image-rendering: auto;
}

body.panel-role-guardian .guardian-live-map .leaflet-control-zoom {
    overflow: hidden;
    margin-right: 13px;
    margin-bottom: 70px;
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .24);
}

body.panel-role-guardian .guardian-live-map .leaflet-control-zoom a {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    color: #eff4f9;
    background: rgba(6, 17, 31, .92);
    border-color: rgba(255, 255, 255, .08);
    font-size: 17px;
}

body.panel-role-guardian .guardian-live-map .leaflet-control-zoom a:hover {
    background: #12263a;
}

body.panel-role-guardian .guardian-live-map .leaflet-control-attribution {
    color: #73869a;
    background: rgba(4, 13, 22, .78);
    font-size: 8px;
}

body.panel-role-guardian .guardian-map-fit-button {
    position: absolute;
    top: 13px;
    right: 13px;
    z-index: 650;
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    padding: 0;
    color: #eff4f9;
    background: rgba(6, 17, 31, .92);
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .24);
    cursor: pointer;
    transition: transform .2s ease, background .2s ease, border-color .2s ease;
}

body.panel-role-guardian .guardian-map-fit-button:hover {
    background: #12263a;
    border-color: rgba(240, 184, 75, .3);
    transform: translateY(-1px);
}

body.panel-role-guardian .guardian-map-fit-button.is-hidden {
    display: none !important;
}

body.panel-role-guardian .guardian-v2-tracking-card .guardian-map-legend {
    right: auto;
    bottom: auto;
    top: 13px;
    left: 13px;
    z-index: 640;
    min-height: 40px;
    padding: 4px 6px;
    background: rgba(6, 17, 31, .9);
    border: 1px solid rgba(255, 255, 255, .09);
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .2);
    backdrop-filter: blur(12px);
}

body.panel-role-guardian .guardian-v2-tracking-card .guardian-map-legend span {
    min-height: 30px;
    padding: 0 8px;
    color: #c7d3df;
    background: transparent;
    font-size: 9px;
}

body.panel-role-guardian .guardian-route-map-marker-wrap {
    background: transparent;
    border: 0;
}

body.panel-role-guardian .guardian-route-map-pin {
    position: relative;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    color: #111923;
    background: #edf2f7;
    border: 1px solid #edf2f7;
    filter: drop-shadow(0 10px 13px rgba(0, 0, 0, .3));
}

body.panel-role-guardian .guardian-route-map-pin::after {
    content: "";
    position: absolute;
    bottom: -5px;
    left: 50%;
    width: 13px;
    height: 13px;
    background: inherit;
    border-right: inherit;
    border-bottom: inherit;
    transform: translateX(-50%) rotate(45deg);
}

body.panel-role-guardian .guardian-route-map-pin > span {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 14px;
}

body.panel-role-guardian .guardian-route-map-pin > b {
    position: absolute;
    top: -7px;
    right: -7px;
    z-index: 4;
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    color: #0d1723;
    background: #f7f9fc;
    border: 2px solid #0a1725;
    border-radius: 50%;
    font-size: 8px;
    font-weight: 900;
}

body.panel-role-guardian .guardian-route-map-pin.is-home {
    color: #101923;
    background: #edf2f7;
    border-color: #edf2f7;
}

body.panel-role-guardian .guardian-route-map-pin.is-school {
    color: #121820;
    background: #f0b84b;
    border-color: #f0b84b;
}

body.panel-role-guardian .guardian-route-map-pin.is-stop,
body.panel-role-guardian .guardian-route-map-pin.is-current {
    color: #071a13;
    background: #4bd2a0;
    border-color: #4bd2a0;
}

body.panel-role-guardian .guardian-route-map-pin.is-current {
    animation: guardian-route-pin-float 1.8s ease-in-out infinite;
}

body.panel-role-guardian .guardian-route-map-pin.is-current::before {
    content: "";
    position: absolute;
    inset: -9px;
    z-index: -1;
    border: 2px solid rgba(75, 210, 160, .45);
    border-radius: 18px;
    animation: guardian-route-pin-pulse 1.8s ease-out infinite;
}

body.panel-role-guardian .guardian-route-map-driver-pin {
    position: relative;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    color: #111923;
    background: #f5f7fa;
    border: 4px solid rgba(6, 17, 31, .92);
    border-radius: 50%;
    box-shadow:
        0 0 0 5px rgba(240, 184, 75, .28),
        0 12px 25px rgba(0, 0, 0, .32);
    animation: guardian-driver-float 2s ease-in-out infinite;
}

body.panel-role-guardian .guardian-route-map-driver-pin::after {
    content: "";
    position: absolute;
    inset: -9px;
    z-index: -1;
    border: 2px solid rgba(240, 184, 75, .34);
    border-radius: 50%;
    animation: guardian-route-pin-pulse 2s ease-out infinite;
}

body.panel-role-guardian .guardian-live-map .leaflet-popup-content-wrapper {
    color: #111a25;
    background: #f7f9fc;
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .3);
}

body.panel-role-guardian .guardian-live-map .leaflet-popup-content {
    margin: 12px;
}

body.panel-role-guardian .guardian-live-map .leaflet-popup-tip {
    background: #f7f9fc;
}

body.panel-role-guardian .guardian-route-map-popup {
    min-width: 185px;
    padding: 3px;
}

body.panel-role-guardian .guardian-route-map-popup > span {
    display: block;
    color: #a47722;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .55px;
    text-transform: uppercase;
}

body.panel-role-guardian .guardian-route-map-popup strong {
    display: block;
    margin-top: 4px;
    color: #111a25;
    font-size: 12px;
    line-height: 1.25;
}

body.panel-role-guardian .guardian-route-map-popup > small {
    display: block;
    margin-top: 4px;
    color: #596779;
    font-size: 9px;
    line-height: 1.35;
}

body.panel-role-guardian .guardian-route-map-popup p {
    margin: 8px 0 0;
    color: #6c7888;
    font-size: 9px;
    line-height: 1.45;
}

body.panel-role-guardian .guardian-route-map-popup > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 9px;
    padding-top: 8px;
    border-top: 1px solid rgba(17, 26, 37, .08);
}

body.panel-role-guardian .guardian-route-map-popup > div b {
    color: #1b8664;
    font-size: 8px;
}

body.panel-role-guardian .guardian-tracking-status.warning {
    background: rgba(255, 176, 0, .07);
    border-color: rgba(255, 176, 0, .22);
}

body.panel-role-guardian .guardian-route-badge.warning {
    color: #ffcf68;
    background: rgba(255, 176, 0, .09);
    border-color: rgba(255, 176, 0, .2);
}

@keyframes guardian-route-pin-pulse {
    0% {
        opacity: .75;
        transform: scale(.82);
    }

    100% {
        opacity: 0;
        transform: scale(1.45);
    }
}

@keyframes guardian-route-pin-float {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-3px);
    }
}

@keyframes guardian-driver-float {
    0%, 100% {
        transform: translateY(0) rotate(0);
    }

    50% {
        transform: translateY(-2px) rotate(-2deg);
    }
}

@media (max-width: 820px) {
    body.panel-role-guardian .guardian-v2-tracking-card .guardian-tracking-stage {
        height: 340px;
        min-height: 340px;
        max-height: 340px;
    }
}

@media (max-width: 520px) {
    body.panel-role-guardian .guardian-v2-tracking-card .guardian-tracking-stage {
        height: 290px;
        min-height: 290px;
        max-height: 290px;
        border-radius: 14px;
    }

    body.panel-role-guardian .guardian-v2-tracking-card .guardian-map-legend {
        top: 10px;
        left: 10px;
        max-width: calc(100% - 64px);
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
    }

    body.panel-role-guardian .guardian-map-fit-button {
        top: 10px;
        right: 10px;
        width: 38px;
        height: 38px;
    }

    body.panel-role-guardian .guardian-live-map .leaflet-control-zoom {
        margin-right: 10px;
        margin-bottom: 10px;
    }
}

@media (max-width: 380px) {
    body.panel-role-guardian .guardian-v2-tracking-card .guardian-tracking-stage {
        height: 260px;
        min-height: 260px;
        max-height: 260px;
    }
}

body.panel-role-guardian .guardian-live-map .guardian-route-map-tooltip {
    padding: 6px 9px;
    color: #edf4fb;
    background: rgba(6, 17, 31, .94);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 9px;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .24);
    font-size: 9px;
    font-weight: 800;
    white-space: nowrap;
}

body.panel-role-guardian .guardian-live-map .guardian-route-map-tooltip::before {
    border-top-color: rgba(6, 17, 31, .94);
}

body.panel-role-guardian .guardian-live-map .guardian-route-map-tooltip.is-current {
    color: #06150f;
    background: rgba(75, 210, 160, .96);
    border-color: rgba(75, 210, 160, .4);
}

body.panel-role-guardian .guardian-live-map .guardian-route-map-tooltip.is-current::before {
    border-top-color: rgba(75, 210, 160, .96);
}

@media (max-width: 520px) {
    body.panel-role-guardian .guardian-live-map .guardian-route-map-tooltip {
        max-width: 150px;
        overflow: hidden;
        font-size: 8px;
        text-overflow: ellipsis;
    }
}

body.panel-role-guardian .guardian-tracking-status p {
    margin-bottom: 0px !important;
}
/* ========================================================================== */
/* VANTAGEM-UI | MAPAS LEAFLET CANÔNICOS                                      */
/* ========================================================================== */
body.panel-app .leaflet-container {
    font-family: "Montserrat", sans-serif;
    background: #eef2ed;
}

body.panel-app .leaflet-control-zoom {
    display: grid;
    gap: 7px;
    overflow: visible;
    margin: 14px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.panel-app .leaflet-control-zoom a {
    display: grid !important;
    place-items: center;
    width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    color: #edf4fb !important;
    background: rgba(8, 28, 47, .96) !important;
    border: 1px solid rgba(132, 164, 196, .25) !important;
    border-radius: 11px !important;
    box-shadow: 0 10px 24px rgba(5, 18, 31, .22) !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    transition: color 160ms ease, background 160ms ease, border-color 160ms ease, transform 160ms ease !important;
}

body.panel-app .leaflet-control-zoom a:hover,
body.panel-app .leaflet-control-zoom a:focus-visible {
    color: #071522 !important;
    background: #ffb800 !important;
    border-color: #ffb800 !important;
    transform: translateY(-1px);
}

body.panel-app .leaflet-control-zoom a.leaflet-disabled {
    color: #60768d !important;
    background: rgba(8, 28, 47, .78) !important;
    border-color: rgba(132, 164, 196, .12) !important;
    opacity: .72;
    transform: none;
}

body.panel-app .leaflet-control-attribution {
    max-width: calc(100% - 18px);
    padding: 2px 5px !important;
    color: #6f7d89 !important;
    background: rgba(248, 250, 246, .88) !important;
    border-radius: 7px 0 0 0;
    font-size: 7px !important;
    line-height: 1.3 !important;
    backdrop-filter: blur(8px);
}

body.panel-app .leaflet-control-attribution a {
    color: #687682 !important;
}

body.panel-app .route-map-marker-wrapper,
body.panel-app .route-map-marker-wrap {
    background: transparent !important;
    border: 0 !important;
}

body.panel-app .route-map-marker {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: #071524;
    background: #ffb800;
    border: 3px solid #f7fbff;
    border-radius: 14px 14px 14px 3px;
    box-shadow: 0 10px 22px rgba(0, 0, 0, .30);
    transform: rotate(-45deg);
    transform-origin: center;
}

body.panel-app .route-map-marker > i {
    position: relative;
    z-index: 2;
    font-size: 13px;
    transform: rotate(45deg);
}

body.panel-app .route-map-marker > b {
    position: absolute;
    top: -8px;
    right: -9px;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 5px;
    color: #fff;
    background: #10263d;
    border: 2px solid #fff;
    border-radius: 999px;
    box-shadow: 0 5px 12px rgba(0, 0, 0, .2);
    font-size: 8px;
    font-weight: 900;
    line-height: 1;
    transform: rotate(45deg);
}

body.panel-app .route-map-marker--student {
    color: #05241b;
    background: #38d9a9;
}

body.panel-app .route-map-marker--school {
    color: #fff;
    background: #315cda;
}

body.panel-app .route-map-marker--start,
body.panel-app .route-map-marker--end {
    color: #071524;
    background: #ffb800;
}

body.panel-app .route-map-marker.is-completed {
    opacity: .62;
    filter: grayscale(.18) saturate(.78);
}

body.panel-app .route-map-marker.is-current {
    z-index: 4;
    box-shadow:
        0 0 0 7px rgba(255, 184, 0, .16),
        0 12px 28px rgba(0, 0, 0, .34);
    animation: route-map-marker-float 1.8s ease-in-out infinite;
}

body.panel-app .route-map-marker--student.is-current {
    box-shadow:
        0 0 0 7px rgba(56, 217, 169, .2),
        0 12px 28px rgba(0, 0, 0, .34);
}

body.panel-app .route-map-marker--school.is-current {
    box-shadow:
        0 0 0 7px rgba(49, 92, 218, .18),
        0 12px 28px rgba(0, 0, 0, .34);
}

@keyframes route-map-marker-float {
    0%, 100% {
        transform: translateY(0) rotate(-45deg);
    }

    50% {
        transform: translateY(-3px) rotate(-45deg);
    }
}

body.panel-app .leaflet-popup-content-wrapper,
body.panel-app .leaflet-popup-tip {
    color: #eaf2fb;
    background: #0d2944;
}

body.panel-app .leaflet-popup-content-wrapper {
    border: 1px solid rgba(132, 164, 196, .18);
    border-radius: 14px;
    box-shadow: 0 18px 42px rgba(3, 16, 28, .28);
}

body.panel-app .leaflet-popup-content {
    margin: 12px 14px;
    font-family: "Montserrat", sans-serif;
}

body.panel-app .route-map-popup strong,
body.panel-app .route-map-popup p,
body.panel-app .route-map-popup small,
body.panel-app .route-map-popup span,
body.panel-app .route-map-popup b,
body.panel-app .route-map-popup em {
    color: inherit;
}

body.panel-app .route-map-popup > span {
    color: #ffbd29;
}

body.panel-app .route-map-popup > small,
body.panel-app .route-map-popup p,
body.panel-app .route-map-popup em {
    color: #9cb0c4;
}

body.panel-app .route-map-popup > div b {
    color: #63e6bb;
}

@media (max-width: 720px) {
    body.panel-app .route-planner__actions,
    body.panel-app .panel-location-picker__actions,
    body.panel-app .route-planner__comparison-actions {
        gap: 9px !important;
    }

    body.panel-app .route-planner__actions .ui-button,
    body.panel-app .panel-location-picker__actions .ui-button,
    body.panel-app .route-planner__comparison-actions .ui-button {
        margin: 0 !important;
    }

    body.panel-app .leaflet-control-zoom {
        gap: 6px;
        margin: 10px !important;
    }

    body.panel-app .leaflet-control-zoom a {
        width: 36px !important;
        height: 36px !important;
    }
}

body.panel-app .leaflet-container img,
body.panel-app .leaflet-container .leaflet-tile {
    max-width: none !important;
    max-height: none !important;
}

/* ADMIN | grade da listagem de usuários com os três canais separados. */
body.panel-app.panel-design-system.panel-role-administrator .admin-user-row {
    grid-template-columns: auto minmax(180px, 1fr) 82px 88px 96px 106px 96px auto auto !important;
    gap: 10px !important;
}

body.panel-app.panel-design-system.panel-role-administrator .admin-user-channel-status {
    min-width: 0 !important;
    width: 100% !important;
}

body.panel-app.panel-design-system.panel-role-administrator .admin-user-channel-status .ui-badge {
    max-width: 100% !important;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 1180px) and (min-width: 701px) {
    body.panel-app.panel-design-system.panel-role-administrator .admin-user-row {
        grid-template-columns: auto minmax(170px, 1fr) 94px 100px 94px auto auto !important;
    }

    body.panel-app.panel-design-system.panel-role-administrator .admin-user-row > .admin-user-meta {
        display: none !important;
    }
}

@media (max-width: 700px) {
    body.panel-app.panel-design-system.panel-role-administrator .admin-user-row {
        grid-template-columns: auto minmax(0, 1fr) auto !important;
    }
}

/* ========================================================================== 
   VANTAGEM-UI 4.0 | Mapas consistentes + ajustes administrativos responsivos
   ========================================================================== */
body.panel-app .vt-map-shell {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border-radius: 17px;
}

body.panel-app .vt-map-shell > .leaflet-container,
body.panel-app .vt-map-shell > [data-route-map],
body.panel-app .vt-map-shell > [data-location-picker-map],
body.panel-app .vt-map-shell > .marketplace-demand-map {
    border-radius: inherit;
}

body.panel-app .vt-map-toolbar {
    position: absolute;
    top: 12px;
    right: 12px;
    left: 12px;
    z-index: 650;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    pointer-events: none;
}

body.panel-app .vt-map-legend,
body.panel-app .vt-map-tools {
    pointer-events: auto;
}

body.panel-app .vt-map-legend {
    display: inline-flex;
    min-height: 38px;
    padding: 6px 9px;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 10px;
    color: #f4f7fb;
    border: 1px solid rgba(151, 177, 203, .16);
    border-radius: 12px;
    background: rgba(7, 24, 41, .92);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .20);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

body.panel-app .vt-map-legend > span {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    gap: 6px;
    color: #dce7f2;
    font-size: 9px;
    font-weight: 800;
    white-space: nowrap;
}

body.panel-app .vt-map-legend-dot {
    display: inline-block;
    width: 9px;
    height: 9px;
    flex: 0 0 9px;
    border: 2px solid rgba(255, 255, 255, .82);
    border-radius: 50%;
    background: #ffb800;
    box-shadow: 0 0 0 2px rgba(255, 184, 0, .13);
}

body.panel-app .vt-map-legend-dot.is-student,
body.panel-app .vt-map-legend-dot.is-location,
body.panel-app .vt-map-legend-dot.is-demand {
    background: #38d9a9;
    box-shadow: 0 0 0 2px rgba(56, 217, 169, .12);
}

body.panel-app .vt-map-legend-dot.is-school {
    background: #315cda;
    box-shadow: 0 0 0 2px rgba(49, 92, 218, .14);
}

body.panel-app .vt-map-legend-line {
    display: inline-block;
    width: 18px;
    height: 4px;
    flex: 0 0 18px;
    border-radius: 999px;
    background: #ffb800;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .12);
}

body.panel-app .vt-map-tool-button {
    display: grid;
    width: 42px;
    height: 42px;
    padding: 0;
    place-items: center;
    color: #f7fbff;
    border: 1px solid rgba(151, 177, 203, .17);
    border-radius: 12px;
    background: rgba(7, 24, 41, .94);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .22);
    cursor: pointer;
    transition: color 150ms ease, background 150ms ease, transform 150ms ease;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

body.panel-app .vt-map-tool-button:hover,
body.panel-app .vt-map-tool-button:focus-visible {
    color: #071729;
    background: #ffb800;
    transform: translateY(-1px);
}

/* Popup do planejador no mesmo padrão claro das paradas da rota em andamento. */
body.panel-app .route-planner .leaflet-popup-content-wrapper,
body.panel-app .route-planner .leaflet-popup-tip {
    color: #172230;
    background: #f7f9fc;
}

body.panel-app .route-planner .leaflet-popup-content-wrapper {
    border: 1px solid rgba(18, 35, 52, .08);
    border-radius: 15px;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .25);
}

body.panel-app .route-planner .leaflet-popup-content {
    margin: 14px 15px;
}

body.panel-app .route-planner .route-map-popup {
    min-width: min(245px, 56vw);
    padding: 2px;
}

body.panel-app .route-planner .route-map-popup > span {
    display: block;
    margin: 0;
    color: #b17a08 !important;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .045em;
    text-transform: uppercase;
}

body.panel-app .route-planner .route-map-popup strong {
    display: block;
    margin-top: 5px;
    color: #172230 !important;
    font-size: 13px;
    line-height: 1.3;
}

body.panel-app .route-planner .route-map-popup p {
    margin-top: 8px;
    color: #718197 !important;
    font-size: 10px;
    line-height: 1.5;
}

body.panel-app .route-planner .leaflet-popup-close-button {
    top: 4px;
    right: 4px;
    color: #5f6e80;
}

/* Administração: três canais com espaço real para os badges, sem colisões. */
body.panel-app.panel-design-system.panel-role-administrator .admin-user-row {
    grid-template-columns: auto minmax(230px, 1.6fr) minmax(76px, .55fr) minmax(84px, .62fr) repeat(3, minmax(112px, .82fr)) minmax(76px, auto) auto !important;
    gap: 12px !important;
}

body.panel-app.panel-design-system.panel-role-administrator .admin-user-row > * {
    min-width: 0;
}

body.panel-app.panel-design-system.panel-role-administrator .admin-user-channel-status {
    min-width: 0 !important;
    overflow: hidden;
}

body.panel-app.panel-design-system.panel-role-administrator .admin-user-channel-status .ui-badge {
    box-sizing: border-box;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-inline: 7px !important;
    justify-content: center;
    overflow: hidden;
    font-size: 8px !important;
    white-space: nowrap;
    text-overflow: ellipsis;
}

body.panel-app.panel-design-system.panel-role-administrator .admin-user-communication-actions-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 14px;
}

body.panel-app.panel-design-system.panel-role-administrator .admin-user-communication-actions-group {
    min-width: 0;
    align-content: start;
}

body.panel-app.panel-design-system.panel-role-administrator .admin-user-push-hint {
    min-height: 0 !important;
    margin: 0;
    padding: 10px 12px !important;
    align-items: flex-start;
    gap: 9px;
    border-radius: 12px;
}

body.panel-app.panel-design-system.panel-role-administrator .admin-user-push-hint > i {
    margin-top: 2px;
    font-size: 12px;
}

body.panel-app.panel-design-system.panel-role-administrator .admin-user-push-hint > div {
    display: grid;
    min-width: 0;
    gap: 3px;
}

body.panel-app.panel-design-system.panel-role-administrator .admin-user-push-hint strong {
    font-size: 10px;
    line-height: 1.3;
}

body.panel-app.panel-design-system.panel-role-administrator .admin-user-push-hint span {
    font-size: 9px;
    line-height: 1.45;
}

@media (max-width: 1180px) and (min-width: 701px) {
    body.panel-app.panel-design-system.panel-role-administrator .admin-user-row {
        grid-template-columns: auto minmax(180px, 1fr) repeat(3, minmax(105px, .8fr)) minmax(74px, auto) auto !important;
    }

    body.panel-app.panel-design-system.panel-role-administrator .admin-user-row > .admin-user-meta {
        display: none !important;
    }
}

@media (max-width: 980px) {
    body.panel-app.panel-design-system.panel-role-administrator .admin-user-communication-actions-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    body.panel-app .route-planner__actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100% !important;
        gap: 12px !important;
    }

    body.panel-app .route-planner__actions .ui-button {
        width: 100% !important;
        min-height: 46px;
        margin: 0 !important;
        justify-content: center;
    }

    body.panel-app .vt-map-toolbar {
        top: 9px;
        right: 9px;
        left: 9px;
        gap: 7px;
    }

    body.panel-app .vt-map-legend {
        min-height: 35px;
        max-width: calc(100% - 48px);
        padding: 5px 7px;
        gap: 3px 8px;
        border-radius: 11px;
    }

    body.panel-app .vt-map-legend > span {
        min-height: 22px;
        font-size: 8px;
    }

    body.panel-app .vt-map-tool-button {
        width: 39px;
        height: 39px;
        border-radius: 11px;
    }

    body.panel-app.panel-design-system.panel-role-administrator .admin-user-push-actions,
    body.panel-app.panel-design-system.panel-role-administrator .admin-user-email-actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
        gap: 9px !important;
    }

    body.panel-app.panel-design-system.panel-role-administrator .admin-user-push-actions > *,
    body.panel-app.panel-design-system.panel-role-administrator .admin-user-email-actions > * {
        width: 100% !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
    }

    body.panel-app.panel-design-system.panel-role-administrator .admin-user-push-actions .ui-button,
    body.panel-app.panel-design-system.panel-role-administrator .admin-user-email-actions .ui-button {
        width: 100% !important;
        min-height: 44px !important;
        height: auto !important;
        padding-block: 10px !important;
        justify-content: center !important;
    }
}

@media (max-width: 700px) {
    body.panel-app.panel-design-system.panel-role-administrator .admin-user-row {
        grid-template-columns: auto minmax(0, 1fr) auto !important;
    }
}

/* ========================================================================== 
   Vantagem-UI · ações do planejador de rotas
   Mantém o grupo encostado à direita no desktop e empilha os botões no mobile.
   ========================================================================== */
body.panel-app.panel-design-system.panel-uses-routes
    .route-planner__heading > .route-planner__title.vt-section-heading__copy {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
}

body.panel-app.panel-design-system.panel-uses-routes
    .route-planner__heading > .route-planner__actions.vt-section-heading__actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex: 0 0 auto !important;
    flex-wrap: nowrap !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
    gap: 10px !important;
}

body.panel-app.panel-design-system.panel-uses-routes
    .route-planner__heading > .route-planner__actions.vt-section-heading__actions > .ui-button {
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 !important;
}

@media (max-width: 760px) {
    body.panel-app.panel-design-system.panel-uses-routes
        .route-planner__heading > .route-planner__actions.vt-section-heading__actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        width: 100% !important;
        margin: 0 !important;
        gap: 12px !important;
    }

    body.panel-app.panel-design-system.panel-uses-routes
        .route-planner__heading > .route-planner__actions.vt-section-heading__actions > .ui-button {
        display: inline-flex !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 !important;
        justify-self: stretch !important;
    }
}


/* ========================================================================== 
   Splash de entrada do Van-Tagem
   Usa somente a camada canônica Van-Tagem UI e seletores por data-attribute.
   ========================================================================== */
html[data-panel-splash-mode="show"] {
    overflow: hidden;
    background: #020c19;
    color-scheme: dark;
    overscroll-behavior: none;
}

[data-panel-splash] {
    display: none;
}

html[data-panel-splash-mode="show"] [data-panel-splash] {
    position: fixed;
    z-index: 100000;
    inset: 0;
    display: grid;
    width: 100%;
    min-width: 0;
    min-height: 100vh;
    min-height: 100dvh;
    overflow: hidden;
    color: var(--vt-text, #f7f9fc);
    background:
        radial-gradient(circle at 50% 28%, rgba(255, 176, 0, 0.105), transparent 24%),
        radial-gradient(circle at -8% 82%, rgba(33, 92, 140, 0.10), transparent 24%),
        linear-gradient(180deg, #020c19 0%, #031421 48%, #020c19 100%);
    isolation: isolate;
    font-family: 'Montserrat', sans-serif;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    animation: vtPanelSplashFailsafe 1ms linear 7s forwards;
}

html[data-panel-splash-mode="show"] [data-panel-splash]::before,
html[data-panel-splash-mode="show"] [data-panel-splash]::after {
    content: "";
    position: absolute;
    z-index: -1;
    border: 1px solid rgba(150, 183, 219, 0.075);
    border-radius: 50%;
    pointer-events: none;
}

html[data-panel-splash-mode="show"] [data-panel-splash]::before {
    top: -30vh;
    right: -26vw;
    width: min(82vw, 780px);
    aspect-ratio: 1;
}

html[data-panel-splash-mode="show"] [data-panel-splash]::after {
    bottom: -30vh;
    left: -32vw;
    width: min(78vw, 720px);
    aspect-ratio: 1;
    border-color: rgba(255, 176, 0, 0.045);
}

[data-panel-splash-content] {
    display: flex;
    align-items: center;
    flex-direction: column;
    width: min(88vw, 640px);
    min-width: 0;
    min-height: 100vh;
    min-height: 100dvh;
    margin: 0 auto;
    padding:
        max(34px, env(safe-area-inset-top))
        0
        max(30px, env(safe-area-inset-bottom));
    text-align: center;
}

[data-panel-splash-main] {
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    margin-top: clamp(42px, 10vh, 112px);
}

[data-panel-splash-logo].ui-surface {
    position: relative;
    display: grid !important;
    place-items: center;
    flex: 0 0 auto;
    width: clamp(142px, 30vw, 214px) !important;
    height: auto !important;
    aspect-ratio: 1;
    min-width: 0 !important;
    margin: 0 !important;
    padding: clamp(20px, 4vw, 34px) !important;
    overflow: visible !important;
    background:
        linear-gradient(145deg, rgba(20, 48, 76, 0.98), rgba(10, 31, 50, 0.98)) !important;
    border: 1px solid rgba(255, 176, 0, 0.42) !important;
    border-radius: clamp(30px, 6vw, 44px) !important;
    box-shadow:
        0 24px 64px rgba(0, 0, 0, 0.30),
        0 0 0 1px rgba(255, 255, 255, 0.035) inset,
        0 0 42px rgba(255, 176, 0, 0.17) !important;
    animation: vtPanelSplashLogoFloat 2.8s ease-in-out infinite;
}

[data-panel-splash-logo].ui-surface::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -24%;
    background: radial-gradient(circle, rgba(255, 176, 0, 0.13), transparent 68%);
    border-radius: 50%;
    filter: blur(10px);
    pointer-events: none;
}

[data-panel-splash-logo] img {
    display: block;
    width: 100%;
    max-width: 150px;
    height: auto;
    margin: 0;
    object-fit: contain;
    filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.24));
}

[data-panel-splash-copy] {
    width: 100%;
    min-width: 0;
    margin-top: clamp(32px, 5.5vh, 54px);
}

[data-panel-splash-copy] .ui-kicker {
    display: block !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    color: var(--vt-primary, #ffb000) !important;
    font-size: clamp(10px, 1.5vw, 13px) !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    text-transform: uppercase !important;
    letter-spacing: clamp(1.7px, 0.28vw, 3px) !important;
}

[data-panel-splash-copy] h1 {
    max-width: 620px;
    margin: 0 auto !important;
    padding: 0 !important;
    color: var(--vt-text, #f7f9fc) !important;
    font-size: clamp(30px, 5.2vw, 50px) !important;
    font-weight: 800 !important;
    line-height: 1.07 !important;
    letter-spacing: -1.35px !important;
    text-wrap: balance;
}

[data-panel-splash-copy] p {
    max-width: 570px;
    margin: clamp(18px, 2.8vh, 26px) auto 0 !important;
    padding: 0 !important;
    color: var(--vt-text-soft, #92a8c1) !important;
    font-size: clamp(13px, 2vw, 17px) !important;
    font-weight: 500 !important;
    line-height: 1.7 !important;
    text-wrap: balance;
}

[data-panel-splash-footer] {
    width: min(100%, 520px);
    margin-top: auto;
    padding-top: clamp(36px, 8vh, 88px);
}

[data-panel-splash-progress] {
    position: relative;
    width: 100%;
    height: 5px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.10);
    border: 1px solid rgba(255, 255, 255, 0.035);
    border-radius: 999px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08) inset;
}

[data-panel-splash-progress-bar] {
    position: absolute;
    inset: -1px auto -1px -1px;
    display: block;
    width: 8%;
    min-width: 28px;
    overflow: hidden;
    background: linear-gradient(90deg, var(--vt-primary, #ffb000), #ffd466);
    border-radius: inherit;
    box-shadow: 0 0 16px rgba(255, 176, 0, 0.34);
    transition: width 230ms cubic-bezier(.22, .75, .2, 1);
}

[data-panel-splash-progress-bar]::after {
    content: "";
    position: absolute;
    top: -3px;
    bottom: -3px;
    left: -34%;
    width: 28%;
    background: rgba(255, 255, 255, 0.68);
    filter: blur(2px);
    transform: skewX(-18deg);
    animation: vtPanelSplashShimmer 1.15s ease-in-out infinite;
}

[data-panel-splash-status] {
    display: block;
    min-height: 20px;
    margin-top: 15px;
    color: #c7d4e3;
    font-size: clamp(11px, 1.6vw, 13px);
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: -0.12px;
}

html[data-panel-splash-mode="show"] [data-panel-splash][data-panel-splash-state="leaving"] {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 360ms ease, visibility 360ms ease;
}

html[data-panel-splash-mode="show"] [data-panel-splash][data-panel-splash-state="leaving"] [data-panel-splash-main],
html[data-panel-splash-mode="show"] [data-panel-splash][data-panel-splash-state="leaving"] [data-panel-splash-footer] {
    transform: translateY(-8px) scale(0.992);
    opacity: 0;
    transition: transform 360ms ease, opacity 280ms ease;
}

@keyframes vtPanelSplashLogoFloat {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-6px);
    }
}

@keyframes vtPanelSplashShimmer {
    0% {
        left: -36%;
        opacity: 0;
    }

    20% {
        opacity: 0.7;
    }

    75%, 100% {
        left: 122%;
        opacity: 0;
    }
}

@keyframes vtPanelSplashFailsafe {
    to {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }
}

@media (max-width: 620px) {
    [data-panel-splash-content] {
        width: min(88vw, 480px);
    }

    [data-panel-splash-main] {
        margin-top: clamp(30px, 7.5vh, 66px);
    }

    [data-panel-splash-logo].ui-surface {
        width: clamp(132px, 39vw, 178px) !important;
        padding: clamp(18px, 5.8vw, 28px) !important;
        border-radius: clamp(28px, 8vw, 38px) !important;
    }

    [data-panel-splash-copy] {
        margin-top: clamp(30px, 5.5vh, 44px);
    }

    [data-panel-splash-copy] h1 {
        font-size: clamp(29px, 8.3vw, 38px) !important;
        letter-spacing: -1.05px !important;
    }

    [data-panel-splash-copy] p {
        max-width: 390px;
        font-size: clamp(13px, 3.55vw, 15px) !important;
        line-height: 1.65 !important;
    }

    [data-panel-splash-footer] {
        width: min(100%, 380px);
        padding-top: 34px;
    }
}

@media (max-height: 700px) and (orientation: portrait) {
    [data-panel-splash-main] {
        margin-top: 18px;
    }

    [data-panel-splash-logo].ui-surface {
        width: 116px !important;
        padding: 18px !important;
        border-radius: 27px !important;
    }

    [data-panel-splash-copy] {
        margin-top: 22px;
    }

    [data-panel-splash-copy] .ui-kicker {
        margin-bottom: 10px !important;
    }

    [data-panel-splash-copy] h1 {
        font-size: clamp(25px, 7vw, 31px) !important;
    }

    [data-panel-splash-copy] p {
        margin-top: 13px !important;
        font-size: 12.5px !important;
        line-height: 1.5 !important;
    }

    [data-panel-splash-footer] {
        padding-top: 22px;
    }
}

@media (orientation: landscape) and (max-height: 620px) {
    [data-panel-splash-content] {
        width: min(90vw, 860px);
        flex-direction: row;
        justify-content: center;
        gap: clamp(28px, 5vw, 66px);
        padding-left: max(28px, env(safe-area-inset-left));
        padding-right: max(28px, env(safe-area-inset-right));
        text-align: left;
    }

    [data-panel-splash-main] {
        align-items: flex-start;
        flex: 1 1 auto;
        margin: 0;
    }

    [data-panel-splash-logo].ui-surface {
        width: 118px !important;
        padding: 18px !important;
        border-radius: 28px !important;
    }

    [data-panel-splash-copy] {
        margin-top: 22px;
    }

    [data-panel-splash-copy] h1,
    [data-panel-splash-copy] p {
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: left;
    }

    [data-panel-splash-copy] h1 {
        font-size: clamp(27px, 4vw, 38px) !important;
    }

    [data-panel-splash-footer] {
        align-self: flex-end;
        flex: 0 0 min(40vw, 360px);
        margin: 0 0 6vh;
        padding: 0;
        text-align: left;
    }
}

@media (prefers-reduced-motion: reduce) {
    [data-panel-splash-logo].ui-surface,
    [data-panel-splash-progress-bar]::after {
        animation: none !important;
    }

    [data-panel-splash-progress-bar] {
        transition-duration: 80ms;
    }
}

/* ==========================================================================
   Saúde do sistema | alinhamento dos checks
   Usa somente os elementos existentes do Vantagem-UI.
   Ícone, textos e badge permanecem na mesma linha estrutural; o texto
   ocupa a coluna flexível e o badge fica ancorado à direita.
   ========================================================================== */
body.panel-app.panel-design-system.panel-route-panel-admin-system-health-index
.vt-grid .ui-surface > .vt-cluster {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: var(--vt-space-2) !important;
    width: 100% !important;
}

body.panel-app.panel-design-system.panel-route-panel-admin-system-health-index
.vt-grid .ui-surface > .vt-cluster > .vt-min-w-0 {
    display: grid !important;
    align-content: center !important;
    gap: 2px !important;
}

body.panel-app.panel-design-system.panel-route-panel-admin-system-health-index
.vt-grid .ui-surface > .vt-cluster > .vt-min-w-0 > :is(.ui-kicker, strong, small) {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
}

body.panel-app.panel-design-system.panel-route-panel-admin-system-health-index
.vt-grid .ui-surface > .vt-cluster > .ui-badge {
    align-self: center !important;
    justify-self: end !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

/* ========================================================================== 
   VANTAGEM-UI | MOVIMENTO CANÔNICO DE MODAIS
   Padroniza abertura e fechamento sem alterar a estrutura dos componentes.
   Os modais operacionais do route-run já possuem ciclo próprio is-mounted.
   ========================================================================== */
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal) {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition:
        opacity 220ms ease,
        visibility 0s linear 260ms !important;
}

html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal).is-open,
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal).open,
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal).active,
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal).show,
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal).visible,
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal).is-visible,
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal)[aria-hidden="false"] {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transition-delay: 0s !important;
}

html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal) > .ui-modal__backdrop {
    /* O fundo/blur canônico está no próprio root do Vantagem-UI. */
    opacity: 0 !important;
}

html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal) > .ui-modal__dialog {
    opacity: 0 !important;
    transform: translateY(20px) scale(0.97) !important;
    transform-origin: center center !important;
    transition:
        opacity 190ms ease,
        transform 250ms cubic-bezier(0.22, 1, 0.36, 1) !important;
    will-change: opacity, transform;
}

html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal).is-open > .ui-modal__dialog,
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal).open > .ui-modal__dialog,
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal).active > .ui-modal__dialog,
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal).show > .ui-modal__dialog,
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal).visible > .ui-modal__dialog,
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal).is-visible > .ui-modal__dialog,
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal]:not(.route-confirm-modal):not(.route-bulk-board-modal)[aria-hidden="false"] > .ui-modal__dialog {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
}

/* Permissão de notificações: mesmo ciclo visual do restante do painel. */
body.panel-app.panel-design-system .guardian-push-layer:not([hidden]) {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition:
        opacity 220ms ease,
        visibility 0s linear 260ms !important;
}

body.panel-app.panel-design-system .guardian-push-layer.is-open {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transition-delay: 0s !important;
}

body.panel-app.panel-design-system .guardian-push-layer.is-closing {
    pointer-events: none !important;
}

body.panel-app.panel-design-system .guardian-push-backdrop {
    opacity: 0 !important;
    animation: none !important;
    transition: opacity 220ms ease !important;
}

body.panel-app.panel-design-system .guardian-push-layer.is-open .guardian-push-backdrop {
    opacity: 1 !important;
}

body.panel-app.panel-design-system .guardian-push-dialog {
    opacity: 0 !important;
    animation: none !important;
    transform: translateY(20px) scale(0.97) !important;
    transition:
        opacity 190ms ease,
        transform 250ms cubic-bezier(0.22, 1, 0.36, 1) !important;
    will-change: opacity, transform;
}

body.panel-app.panel-design-system .guardian-push-layer.is-open .guardian-push-dialog {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
}

/* Convite de cadastro: deixa de aparecer/desaparecer de forma seca. */
body.panel-app.panel-design-system .registration-invite-layer:not([hidden]) {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition:
        opacity 220ms ease,
        visibility 0s linear 260ms !important;
}

body.panel-app.panel-design-system .registration-invite-layer.is-open {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transition-delay: 0s !important;
}

body.panel-app.panel-design-system .registration-invite-layer.is-closing {
    pointer-events: none !important;
}

body.panel-app.panel-design-system .registration-invite-modal {
    opacity: 0 !important;
    transform: translateY(20px) scale(0.97) !important;
    transition:
        opacity 190ms ease,
        transform 250ms cubic-bezier(0.22, 1, 0.36, 1) !important;
    will-change: opacity, transform;
}

body.panel-app.panel-design-system .registration-invite-layer.is-open .registration-invite-modal {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
}

/* Pesquisa global: largura confortável no desktop sem alterar o modal mobile. */
@media (min-width: 761px) {
    body.panel-app.panel-design-system .panel-search-dialog {
        width: min(860px, calc(100vw - 96px)) !important;
        max-width: 860px !important;
    }
}

/* Pesquisa global também é um diálogo modal e segue a mesma linguagem. */
body.panel-app.panel-design-system .panel-search-layer:not([hidden]) {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition:
        opacity 200ms ease,
        visibility 0s linear 240ms !important;
}

body.panel-app.panel-design-system .panel-search-layer.is-open {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transition-delay: 0s !important;
}

body.panel-app.panel-design-system .panel-search-layer.is-closing {
    pointer-events: none !important;
}

body.panel-app.panel-design-system .panel-search-backdrop {
    opacity: 0 !important;
    transition: opacity 200ms ease !important;
}

body.panel-app.panel-design-system .panel-search-layer.is-open .panel-search-backdrop {
    opacity: 1 !important;
}

body.panel-app.panel-design-system .panel-search-dialog {
    opacity: 0 !important;
    transform: translateY(18px) scale(0.98) !important;
    transition:
        opacity 180ms ease,
        transform 240ms cubic-bezier(0.22, 1, 0.36, 1) !important;
    will-change: opacity, transform;
}

body.panel-app.panel-design-system .panel-search-layer.is-open .panel-search-dialog {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
}

@media (max-width: 640px) {
    body.panel-app.panel-design-system .guardian-push-dialog {
        transform: translateY(34px) scale(0.99) !important;
    }

    body.panel-app.panel-design-system .guardian-push-layer.is-open .guardian-push-dialog {
        transform: translateY(0) scale(1) !important;
    }

    body.panel-app.panel-design-system .registration-invite-modal,
    body.panel-app.panel-design-system .panel-search-dialog {
        transform: translateY(28px) scale(0.985) !important;
    }

    body.panel-app.panel-design-system .registration-invite-layer.is-open .registration-invite-modal,
    body.panel-app.panel-design-system .panel-search-layer.is-open .panel-search-dialog {
        transform: translateY(0) scale(1) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal],
    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal] > .ui-modal__backdrop,
    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal] > .ui-modal__dialog,
    body.panel-app.panel-design-system .guardian-push-layer,
    body.panel-app.panel-design-system .guardian-push-backdrop,
    body.panel-app.panel-design-system .guardian-push-dialog,
    body.panel-app.panel-design-system .registration-invite-layer,
    body.panel-app.panel-design-system .registration-invite-modal,
    body.panel-app.panel-design-system .panel-search-layer,
    body.panel-app.panel-design-system .panel-search-backdrop,
    body.panel-app.panel-design-system .panel-search-dialog {
        transition-duration: 1ms !important;
        transition-delay: 0s !important;
    }
}

/* Mantém o tema Van-Tagem também quando o navegador preenche campos automaticamente. */
body.panel-app.panel-design-system :is(input, textarea, select):-webkit-autofill,
body.panel-app.panel-design-system :is(input, textarea, select):-webkit-autofill:hover,
body.panel-app.panel-design-system :is(input, textarea, select):-webkit-autofill:focus,
body.panel-app.panel-design-system :is(input, textarea, select):-webkit-autofill:active {
    -webkit-text-fill-color: var(--vt-text, #f7f9fc) !important;
    caret-color: var(--vt-text, #f7f9fc) !important;
    -webkit-box-shadow: 0 0 0 1000px #071a2b inset !important;
    box-shadow: 0 0 0 1000px #071a2b inset !important;
    border-color: transparent !important;
    transition: background-color 99999s ease-out 0s, color 99999s ease-out 0s !important;
}

body.panel-app.panel-design-system :is(input, textarea, select):autofill {
    color: var(--vt-text, #f7f9fc) !important;
    background: #071a2b !important;
    caret-color: var(--vt-text, #f7f9fc) !important;
}

body.panel-app.panel-design-system .ui-control-wrap:has(> :is(input, textarea, select):-webkit-autofill) {
    background: rgba(2, 12, 25, .88) !important;
    border-color: rgba(255, 176, 0, .24) !important;
}

/* Van-Tagem | iOS Safari/Chrome: evita zoom automatico ao focar campos.
   O iOS amplia controles cuja fonte computada e menor que 16px.
   Mantemos o pinch-to-zoom do usuario intacto por acessibilidade. */
@supports (-webkit-touch-callout: none) {
    @media (hover: none) and (pointer: coarse) {
        input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="button"]):not([type="submit"]):not([type="reset"]),
        select,
        textarea,
        [contenteditable="true"] {
            font-size: 16px !important;
            -webkit-text-size-adjust: 100%;
            touch-action: manipulation;
        }
    }
}

/* ========================================================================== */
/* 10.8 — modal de convite: espaçamento idêntico aos controles do painel       */
/* ========================================================================== */
body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap {
    position: relative !important;
}
body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap > i:first-child {
    position: absolute !important;
    top: 50% !important;
    left: 14px !important;
    z-index: 3 !important;
    width: 16px !important;
    height: 16px !important;
    margin: 0 !important;
    transform: translateY(-50%) !important;
}
body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap > .ui-control {
    padding: 12px 13px 12px 42px !important;
    text-align: left !important;
}
body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap > .vt-smart-select > .vt-smart-trigger {
    padding-left: 42px !important;
    padding-right: 14px !important;
    text-align: left !important;
}
body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap.vt-directory-neighborhood-host > .vt-smart-select > .vt-smart-trigger {
    padding-left: 42px !important;
}
body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap.vt-directory-neighborhood-host.vt-directory-neighborhood-is-other > .vt-directory-neighborhood-other {
    padding-left: 8px !important;
}

/* 10.8.1 — convite: mesma régua horizontal usada nos formulários do painel. */
body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap > i:first-child {
    display: grid !important;
    place-items: center !important;
    line-height: 1 !important;
}
body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap > .ui-control,
body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap > .vt-smart-select > .vt-smart-trigger {
    padding-left: 40px !important;
}
body.panel-app.panel-design-system .registration-invite-grid .ui-control-wrap > .ui-control::placeholder {
    text-align: left !important;
}

/* ========================================================================== */
/* VANTAGEM-UI | PASSO DE LEGIBILIDADE GLOBAL                                 */
/* Mantém hierarquia e densidade, mas elimina microtextos difíceis de ler.     */
/* ========================================================================== */
body.panel-app.panel-design-system .dashboard-content :is(.ui-kicker, .vt-section-heading__kicker),
body.panel-app.panel-design-system .dashboard-content [class*="__kicker"],
body.panel-app.panel-design-system .dashboard-content [class*="-kicker"] {
    font-size: 11px !important;
    line-height: 1.35 !important;
}

body.panel-app.panel-design-system .dashboard-content :is(.ui-label, label),
body.panel-app.panel-design-system .ui-modal__dialog :is(.ui-label, label) {
    font-size: 12px !important;
    line-height: 1.4 !important;
}

body.panel-app.panel-design-system .dashboard-content :is(.ui-field-help, .form-text),
body.panel-app.panel-design-system .dashboard-content [class*="__hint"],
body.panel-app.panel-design-system .dashboard-content [class*="-hint"],
body.panel-app.panel-design-system .dashboard-content [class*="__note"],
body.panel-app.panel-design-system .dashboard-content [class*="-note"] {
    font-size: 11px !important;
    line-height: 1.55 !important;
}

body.panel-app.panel-design-system .dashboard-content :is(.ui-badge, .ui-status) {
    font-size: 10.5px !important;
    line-height: 1.25 !important;
}

body.panel-app.panel-design-system .dashboard-content :is(.ui-control, input, textarea, select),
body.panel-app.panel-design-system .ui-modal__dialog :is(.ui-control, input, textarea, select) {
    font-size: 13px !important;
    font-weight: 400 !important;
}

body.panel-app.panel-design-system .dashboard-content :is(
    .ui-section-header p,
    .ui-section-heading p,
    .vt-section-heading p,
    .ui-page-hero p,
    .ui-empty-state p
) {
    font-size: 12.5px !important;
    line-height: 1.6 !important;
}

body.panel-app.panel-design-system .ui-modal__dialog > p {
    font-size: 13px !important;
    line-height: 1.6 !important;
}

body.panel-app.panel-design-system .ui-modal__dialog small,
body.panel-app.panel-design-system .driver-trial-modal__dialog small,
body.panel-app.panel-design-system .guardian-push-dialog small,
body.panel-app.panel-design-system .registration-invite-modal small,
body.panel-app.panel-design-system .guardian-whatsapp-invitation__dialog small {
    font-size: 11px !important;
    line-height: 1.5 !important;
}

@media (max-width: 680px) {
    body.panel-app.panel-design-system .dashboard-content :is(.ui-label, label),
    body.panel-app.panel-design-system .ui-modal__dialog :is(.ui-label, label) {
        font-size: 12.5px !important;
    }

    body.panel-app.panel-design-system .dashboard-content :is(.ui-control, input, textarea, select),
    body.panel-app.panel-design-system .ui-modal__dialog :is(.ui-control, input, textarea, select) {
        font-size: 13.5px !important;
    }

    body.panel-app.panel-design-system .dashboard-content :is(.ui-field-help, .form-text),
    body.panel-app.panel-design-system .dashboard-content [class*="__hint"],
    body.panel-app.panel-design-system .dashboard-content [class*="-hint"],
    body.panel-app.panel-design-system .dashboard-content [class*="__note"],
    body.panel-app.panel-design-system .dashboard-content [class*="-note"] {
        font-size: 11.5px !important;
    }
}

/* ========================================================================== */
/* VANTAGEM-UI | MODAIS MOBILE CENTRALIZADOS E LEVES                          */
/* No Android o blur de viewport era o maior custo de composição.             */
/* Mantém animação com opacity + transform, que fica na GPU sem engasgar.      */
/* ========================================================================== */
@keyframes vtModalLiteIn {
    from { opacity: 0; transform: translate3d(0, 16px, 0) scale(.985); }
    to   { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes vtModalBackdropLiteIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@media (max-width: 760px) {
    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal] {
        display: grid !important;
        place-items: center !important;
        align-items: center !important;
        justify-content: center !important;
        padding:
            max(12px, env(safe-area-inset-top))
            max(12px, env(safe-area-inset-right))
            max(12px, env(safe-area-inset-bottom))
            max(12px, env(safe-area-inset-left)) !important;
        overflow: hidden !important;
        background: rgba(1, 9, 19, .86) !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }

    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal] > .ui-modal__backdrop {
        position: fixed !important;
        inset: 0 !important;
        background: rgba(1, 9, 19, .18) !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
        filter: none !important;
        transition: opacity 180ms ease !important;
    }

    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal] > .ui-modal__dialog {
        align-self: center !important;
        justify-self: center !important;
        width: min(100%, 520px) !important;
        max-width: 520px !important;
        max-height: calc(100vh - 24px) !important;
        margin: auto !important;
        border-radius: 20px !important;
        box-shadow: 0 20px 58px rgba(0, 0, 0, .42) !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
        filter: none !important;
        backface-visibility: hidden;
        transform: translate3d(0, 14px, 0) scale(.985) !important;
        transition: opacity 170ms ease, transform 210ms cubic-bezier(.22, 1, .36, 1) !important;
        will-change: opacity, transform;
    }

    @supports (height: 100dvh) {
        html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal] > .ui-modal__dialog {
            max-height: calc(100dvh - 24px) !important;
        }
    }

    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal].is-open > .ui-modal__dialog,
    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal].open > .ui-modal__dialog,
    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal].active > .ui-modal__dialog,
    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal].show > .ui-modal__dialog,
    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal].visible > .ui-modal__dialog,
    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal].is-visible > .ui-modal__dialog,
    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal][aria-hidden="false"] > .ui-modal__dialog {
        transform: translate3d(0, 0, 0) scale(1) !important;
    }

    /* Modais que historicamente viravam bottom-sheet/top-sheet no celular. */
    body.panel-app.panel-design-system .route-bulk-board-modal.ui-modal,
    body.panel-app.panel-design-system .route-confirm-modal.ui-modal {
        align-items: center !important;
        justify-content: center !important;
    }

    body.panel-app.panel-design-system .route-bulk-board-modal.ui-modal > .route-bulk-board-modal-dialog,
    body.panel-app.panel-design-system .route-confirm-modal.ui-modal > .route-confirm-modal-dialog {
        border-radius: 20px !important;
        margin: auto !important;
    }

    body.panel-app.panel-design-system .guardian-push-layer:not([hidden]),
    body.panel-app.panel-design-system .registration-invite-layer:not([hidden]),
    body.panel-app.panel-design-system .panel-search-layer:not([hidden]),
    body.panel-app.panel-design-system .guardian-whatsapp-invitation:not([hidden]),
    body.panel-app.panel-design-system .driver-trial-modal {
        display: grid !important;
        place-items: center !important;
        align-items: center !important;
        justify-content: center !important;
        padding:
            max(12px, env(safe-area-inset-top))
            max(12px, env(safe-area-inset-right))
            max(12px, env(safe-area-inset-bottom))
            max(12px, env(safe-area-inset-left)) !important;
        overflow: hidden !important;
    }

    body.panel-app.panel-design-system :is(
        .guardian-push-backdrop,
        .registration-invite-backdrop,
        .panel-search-backdrop,
        .guardian-whatsapp-invitation__backdrop,
        .driver-trial-modal__backdrop
    ) {
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
        filter: none !important;
    }

    body.panel-app.panel-design-system .panel-search-layer:not([hidden]) {
        padding:
            max(12px, env(safe-area-inset-top))
            max(12px, env(safe-area-inset-right))
            max(12px, env(safe-area-inset-bottom))
            max(12px, env(safe-area-inset-left)) !important;
    }

    body.panel-app.panel-design-system :is(
        .guardian-push-dialog,
        .registration-invite-modal,
        .panel-search-dialog,
        .guardian-whatsapp-invitation__dialog,
        .driver-trial-modal__dialog
    ) {
        align-self: center !important;
        justify-self: center !important;
        margin: auto !important;
        max-height: calc(100dvh - 24px) !important;
        border-radius: 20px !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
        filter: none !important;
        backface-visibility: hidden;
    }

    body.panel-app.panel-design-system .driver-trial-modal__backdrop {
        animation: vtModalBackdropLiteIn 170ms ease both !important;
    }

    body.panel-app.panel-design-system .driver-trial-modal__dialog {
        animation: vtModalLiteIn 220ms cubic-bezier(.22, 1, .36, 1) both !important;
    }

    body.panel-app.panel-design-system .driver-trial-modal.is-closing .driver-trial-modal__backdrop,
    body.panel-app.panel-design-system .driver-trial-modal.is-closing .driver-trial-modal__dialog {
        animation-direction: reverse !important;
        animation-duration: 150ms !important;
    }

    body.panel-app.panel-design-system .guardian-whatsapp-invitation__backdrop,
    body.panel-app.panel-design-system .registration-invite-layer,
    body.panel-app.panel-design-system .guardian-push-layer,
    body.panel-app.panel-design-system .panel-search-backdrop {
        background-color: rgba(1, 9, 19, .84) !important;
    }
}


/* ========================================================================== 
   VANTAGEM-UI | NATIVE STATUS NO PADRAO DO SISTEMA
   As telas informativas do app reutilizam a mesma gramatica visual das demais
   paginas: hero canonico, kicker, titulo, descricao, badge e surface.
   ========================================================================== */
body.panel-app.panel-design-system .native-status-page {
    display: grid !important;
    gap: 14px !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

body.panel-app.panel-design-system .native-status-flash {
    margin: 0 !important;
}

body.panel-app.panel-design-system .native-status-hero__kicker {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    width: auto !important;
}

body.panel-app.panel-design-system .native-status-dot {
    display: inline-block !important;
    flex: 0 0 8px !important;
    width: 8px !important;
    height: 8px !important;
    border-radius: 999px !important;
    background: var(--ui-primary, #ffb000) !important;
    box-shadow: 0 0 0 4px rgba(255, 176, 0, .10) !important;
}

body.panel-app.panel-design-system .native-status-dot.is-on {
    background: #55e1a8 !important;
    box-shadow: 0 0 0 4px rgba(85, 225, 168, .10) !important;
}

body.panel-app.panel-design-system .native-status-card.ui-surface {
    display: grid !important;
    gap: 16px !important;
    padding: 22px !important;
}

body.panel-app.panel-design-system .native-status-section-heading.ui-section-header {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 16px !important;
    margin: 0 !important;
    padding: 0 0 17px !important;
    border-bottom: 1px solid rgba(145, 174, 207, .10) !important;
}

body.panel-app.panel-design-system .native-status-section-heading > div {
    min-width: 0 !important;
}

body.panel-app.panel-design-system .native-status-section-heading .ui-kicker {
    margin: 0 0 3px !important;
}

body.panel-app.panel-design-system .native-status-section-heading h3 {
    margin: 0 !important;
    color: var(--ui-text, #f5f7fa) !important;
    font-size: 18px !important;
    line-height: 1.22 !important;
}

body.panel-app.panel-design-system .native-status-section-heading p {
    max-width: 720px !important;
    margin: 5px 0 0 !important;
    color: var(--ui-text-soft, #9eb0c4) !important;
    font-size: 11.5px !important;
    line-height: 1.55 !important;
}

body.panel-app.panel-design-system .native-status-pill {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: center !important;
    gap: 7px !important;
    min-height: 32px !important;
    padding: 7px 11px !important;
    color: #ffc43d !important;
    background: rgba(255, 176, 0, .08) !important;
    border: 1px solid rgba(255, 176, 0, .20) !important;
    border-radius: 999px !important;
    font-size: 9px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

body.panel-app.panel-design-system .native-status-pill.is-success {
    color: #6be4b2 !important;
    background: rgba(53, 208, 145, .08) !important;
    border-color: rgba(53, 208, 145, .22) !important;
}

body.panel-app.panel-design-system .native-status-metrics {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

body.panel-app.panel-design-system .native-status-metric {
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) !important;
    align-items: center !important;
    min-width: 0 !important;
    min-height: 70px !important;
    gap: 11px !important;
    padding: 12px !important;
    background: rgba(3, 16, 30, .42) !important;
    border: 1px solid rgba(145, 174, 207, .10) !important;
    border-radius: 14px !important;
}

body.panel-app.panel-design-system .native-status-metric__icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    color: #91acd0 !important;
    background: rgba(145, 172, 208, .08) !important;
    border: 1px solid rgba(145, 174, 207, .09) !important;
    border-radius: 11px !important;
    font-size: 13px !important;
}

body.panel-app.panel-design-system .native-status-metric > div {
    min-width: 0 !important;
}

body.panel-app.panel-design-system .native-status-metric small,
body.panel-app.panel-design-system .native-status-metric strong {
    display: block !important;
    min-width: 0 !important;
}

body.panel-app.panel-design-system .native-status-metric small {
    color: #71869d !important;
    font-size: 8px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
}

body.panel-app.panel-design-system .native-status-metric strong {
    margin-top: 4px !important;
    overflow: hidden !important;
    color: #f3f7fb !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

body.panel-app.panel-design-system .native-status-highlight,
body.panel-app.panel-design-system .native-status-info {
    display: grid !important;
    grid-template-columns: 40px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 14px !important;
    border-radius: 14px !important;
}

body.panel-app.panel-design-system .native-status-highlight {
    background: rgba(255, 176, 0, .055) !important;
    border: 1px solid rgba(255, 176, 0, .15) !important;
}

body.panel-app.panel-design-system .native-status-highlight.is-success {
    background: rgba(53, 208, 145, .055) !important;
    border-color: rgba(53, 208, 145, .16) !important;
}

body.panel-app.panel-design-system .native-status-highlight__icon,
body.panel-app.panel-design-system .native-status-info__icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 12px !important;
}

body.panel-app.panel-design-system .native-status-highlight__icon {
    color: #ffc43d !important;
    background: rgba(255, 176, 0, .09) !important;
}

body.panel-app.panel-design-system .native-status-highlight.is-success .native-status-highlight__icon {
    color: #66e3af !important;
    background: rgba(53, 208, 145, .10) !important;
}

body.panel-app.panel-design-system .native-status-highlight strong,
body.panel-app.panel-design-system .native-status-info strong {
    display: block !important;
    color: #f1f6fb !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
}

body.panel-app.panel-design-system .native-status-highlight p,
body.panel-app.panel-design-system .native-status-info p {
    margin: 4px 0 0 !important;
    color: #8fa6bd !important;
    font-size: 10px !important;
    line-height: 1.5 !important;
}

body.panel-app.panel-design-system .native-status-info {
    background: rgba(3, 16, 30, .32) !important;
    border: 1px dashed rgba(145, 174, 207, .16) !important;
}

body.panel-app.panel-design-system .native-status-info__icon {
    color: #8ca8c4 !important;
    background: rgba(145, 174, 207, .07) !important;
}

body.panel-app.panel-design-system .native-status-info__label {
    display: block !important;
    margin: 0 0 3px !important;
    color: #71869d !important;
    font-size: 7.5px !important;
    font-weight: 850 !important;
    letter-spacing: .55px !important;
    text-transform: uppercase !important;
}

body.panel-app.panel-design-system .native-status-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 14px !important;
    margin: 0 !important;
    padding: 17px 0 0 !important;
    border-top: 1px solid rgba(145, 174, 207, .10) !important;
}

body.panel-app.panel-design-system .native-status-actions__copy strong,
body.panel-app.panel-design-system .native-status-actions__copy span {
    display: block !important;
}

body.panel-app.panel-design-system .native-status-actions__copy strong {
    color: #eaf1f8 !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
}

body.panel-app.panel-design-system .native-status-actions__copy span {
    margin-top: 3px !important;
    color: #74899f !important;
    font-size: 9px !important;
    line-height: 1.45 !important;
}

body.panel-app.panel-design-system .native-status-actions__buttons {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
}

/* Cabeçalho das telas informativas do app: mesma proporcao das demais telas. */
@media (max-width: 760px) {
    body.panel-app.panel-design-system.panel-native-status .dashboard-header {
        min-height: 0 !important;
        padding: 11px 12px !important;
        gap: 8px !important;
    }

    body.panel-app.panel-design-system.panel-native-status .dashboard-header-left {
        gap: 9px !important;
    }

    body.panel-app.panel-design-system.panel-native-status .dashboard-heading h1 {
        max-width: none !important;
        font-size: 15px !important;
        line-height: 1.12 !important;
        letter-spacing: -.2px !important;
    }

    body.panel-app.panel-design-system.panel-native-status .dashboard-eyebrow {
        margin-bottom: 2px !important;
        font-size: 7.5px !important;
    }

    body.panel-app.panel-design-system.panel-native-status .dashboard-header-actions {
        gap: 5px !important;
    }

    body.panel-app.panel-design-system.panel-native-status :is(
        .mobile-menu-button,
        .header-action-button,
        .header-profile
    ) {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        flex-basis: 40px !important;
    }

    body.panel-app.panel-design-system.panel-native-status .header-profile-avatar {
        width: 30px !important;
        min-width: 30px !important;
        height: 30px !important;
        flex-basis: 30px !important;
    }

    body.panel-app.panel-design-system .native-status-card.ui-surface {
        gap: 13px !important;
        padding: 17px !important;
    }

    body.panel-app.panel-design-system .native-status-section-heading.ui-section-header {
        gap: 10px !important;
        padding-bottom: 14px !important;
    }

    body.panel-app.panel-design-system .native-status-section-heading h3 {
        font-size: 16px !important;
    }

    body.panel-app.panel-design-system .native-status-section-heading p {
        font-size: 10.5px !important;
    }

    body.panel-app.panel-design-system .native-status-metrics {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    body.panel-app.panel-design-system .native-status-metric {
        min-height: 62px !important;
        padding: 10px !important;
    }

    body.panel-app.panel-design-system .native-status-actions {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 11px !important;
    }

    body.panel-app.panel-design-system .native-status-actions__buttons {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100% !important;
    }

    body.panel-app.panel-design-system .native-status-actions__buttons .ui-button {
        width: 100% !important;
        justify-content: center !important;
    }
}

@media (max-width: 430px) {
    body.panel-app.panel-design-system .native-status-section-heading.ui-section-header {
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: start !important;
    }

    body.panel-app.panel-design-system .native-status-pill {
        margin-top: 1px !important;
        padding-inline: 9px !important;
        font-size: 8px !important;
    }

    body.panel-app.panel-design-system .native-status-highlight,
    body.panel-app.panel-design-system .native-status-info {
        grid-template-columns: 36px minmax(0, 1fr) !important;
        gap: 10px !important;
        padding: 12px !important;
    }

    body.panel-app.panel-design-system .native-status-highlight__icon,
    body.panel-app.panel-design-system .native-status-info__icon {
        width: 36px !important;
        height: 36px !important;
    }
}

/* ========================================================================== 
   VANTAGEM-UI | TODO MODAL CENTRALIZADO
   Regra final da camada canônica. Nenhum modal do painel vira bottom-sheet.
   ========================================================================== */
html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal],
body.panel-app.panel-design-system .ui-modal,
body.panel-app.panel-design-system .student-modal,
body.panel-app.panel-design-system .school-modal,
body.panel-app.panel-design-system .route-modal,
body.panel-app.panel-design-system .monthly-fee-modal,
body.panel-app.panel-design-system .route-confirm-modal,
body.panel-app.panel-design-system .route-bulk-board-modal,
body.panel-app.panel-design-system .guardian-push-layer:not([hidden]),
body.panel-app.panel-design-system .registration-invite-layer:not([hidden]),
body.panel-app.panel-design-system .panel-search-layer:not([hidden]),
body.panel-app.panel-design-system .guardian-whatsapp-invitation:not([hidden]),
body.panel-app.panel-design-system .driver-trial-modal,
body.panel-app.panel-design-system .vt-pwa-install-layer:not([hidden]),
body.panel-app.panel-design-system .vt-picker-backdrop {
    align-items: center !important;
    justify-content: center !important;
    place-items: center !important;
}

body.panel-app.panel-design-system :is(
    .ui-modal__dialog,
    .student-modal-dialog,
    .school-modal-dialog,
    .route-modal-dialog,
    .monthly-fee-modal-dialog,
    .route-confirm-modal-dialog,
    .route-bulk-board-modal-dialog,
    .guardian-push-dialog,
    .registration-invite-modal,
    .panel-search-dialog,
    .guardian-whatsapp-invitation__dialog,
    .driver-trial-modal__dialog,
    .vt-pwa-install-dialog,
    .vt-picker
) {
    align-self: center !important;
    justify-self: center !important;
    margin-top: auto !important;
    margin-bottom: auto !important;
}

body.panel-app.panel-design-system .guardian-push-dialog {
    border: 1px solid rgba(159, 184, 211, .17) !important;
}

@media (max-width: 760px) {
    html body.panel-app.panel-design-system > .ui-modal.ui-modal--viewport-root[data-ui-viewport-modal],
    body.panel-app.panel-design-system .ui-modal,
    body.panel-app.panel-design-system .student-modal,
    body.panel-app.panel-design-system .school-modal,
    body.panel-app.panel-design-system .route-modal,
    body.panel-app.panel-design-system .monthly-fee-modal,
    body.panel-app.panel-design-system .route-confirm-modal,
    body.panel-app.panel-design-system .route-bulk-board-modal,
    body.panel-app.panel-design-system .guardian-push-layer:not([hidden]),
    body.panel-app.panel-design-system .registration-invite-layer:not([hidden]),
    body.panel-app.panel-design-system .panel-search-layer:not([hidden]),
    body.panel-app.panel-design-system .guardian-whatsapp-invitation:not([hidden]),
    body.panel-app.panel-design-system .driver-trial-modal,
    body.panel-app.panel-design-system .vt-pwa-install-layer:not([hidden]),
    body.panel-app.panel-design-system .vt-picker-backdrop {
        padding:
            max(12px, env(safe-area-inset-top))
            max(12px, env(safe-area-inset-right))
            max(12px, env(safe-area-inset-bottom))
            max(12px, env(safe-area-inset-left)) !important;
    }

    body.panel-app.panel-design-system :is(
        .ui-modal__dialog,
        .student-modal-dialog,
        .school-modal-dialog,
        .route-modal-dialog,
        .monthly-fee-modal-dialog,
        .route-confirm-modal-dialog,
        .route-bulk-board-modal-dialog,
        .guardian-push-dialog,
        .registration-invite-modal,
        .panel-search-dialog,
        .guardian-whatsapp-invitation__dialog,
        .driver-trial-modal__dialog,
        .vt-pwa-install-dialog,
        .vt-picker
    ) {
        width: min(100%, 520px) !important;
        max-height: calc(100dvh - 24px) !important;
        border-radius: 20px !important;
    }
}