:root {
    --cv-ui-ease: 200ms cubic-bezier(.22, 1, .36, 1);
    --cv-ui-ease-fast: 140ms cubic-bezier(.22, 1, .36, 1);
    --cv-ui-lift: -2px;
    --cv-ui-shadow-soft: 0 10px 22px rgba(15, 23, 42, 0.10);
    --cv-ui-shadow-lift: 0 14px 28px rgba(15, 23, 42, 0.14);
    --cv-ui-glow-green: 0 12px 26px rgba(16, 168, 74, 0.28);
    --cv-ui-focus: 2px solid rgba(33, 196, 90, 0.45);
}

body {
    transition: opacity 140ms ease, filter 140ms ease;
}

body.cv-page-loading {
    opacity: 0.88;
    filter: saturate(0.96);
    cursor: progress;
}

/* Controles clicáveis do app */
:where(
    button,
    .btn,
    .btn-enter,
    .btn-secondary-access,
    .password-toggle,
    .icon-btn,
    .hero-button,
    .hero-button-secondary,
    .hero-action,
    .hero-card,
    .quick-item,
    .action-button,
    .location-refresh,
    .location-retry-btn,
    .history-more,
    .detail-btn,
    .detail-link,
    .detail-close,
    .period-btn,
    .filter-submit,
    .filter-chip,
    .photo-button,
    .photo-action-btn,
    .photo-add-btn,
    .obs-toggle,
    .client-option,
    .top-icon-btn,
    .finish-button,
    .rota-inside-btn,
    .rota-btn,
    .rota-context-card,
    .rota-context-cta,
    .rota-vistoria-callout a,
    .offline-sync-btn,
    .avulsas-banner,
    .task-row-nav-btn,
    .mode-option span,
    .choice-card,
    .pwa-install-btn,
    a.finish-button,
    a.icon-btn,
    a.rota-inside-btn,
    a.rota-btn,
    a.detail-link,
    a.hero-card
) {
    transition:
        transform var(--cv-ui-ease),
        box-shadow var(--cv-ui-ease),
        filter var(--cv-ui-ease),
        background-color var(--cv-ui-ease),
        background var(--cv-ui-ease),
        color var(--cv-ui-ease),
        border-color var(--cv-ui-ease),
        opacity var(--cv-ui-ease-fast);
}

:where(
    .card,
    .quick-block,
    .login-card,
    .setup-card,
    .auth-card,
    .summary-card,
    .status-card,
    .module-card,
    .resume-card,
    .history-item,
    .report-item,
    .rota-card,
    .task-row-card
) {
    transition:
        transform var(--cv-ui-ease),
        box-shadow var(--cv-ui-ease),
        background-color var(--cv-ui-ease),
        border-color var(--cv-ui-ease);
}

:where(
    button,
    .btn,
    .btn-enter,
    .btn-secondary-access,
    .password-toggle,
    .icon-btn,
    .hero-button,
    .hero-button-secondary,
    .quick-item,
    .action-button,
    .location-refresh,
    .location-retry-btn,
    .history-more,
    .detail-btn,
    .detail-link,
    .detail-close,
    .period-btn,
    .filter-submit,
    .filter-chip,
    .photo-button,
    .photo-action-btn,
    .photo-add-btn,
    .obs-toggle,
    .client-option,
    .top-icon-btn,
    .finish-button,
    .rota-inside-btn,
    .rota-btn,
    .offline-sync-btn,
    .task-row-nav-btn,
    a[href]
):focus-visible {
    outline: var(--cv-ui-focus);
    outline-offset: 2px;
}

/* Hover só em ponteiro fino (mouse) — não “gruda” no toque */
@media (hover: hover) and (pointer: fine) {
    :where(
        button,
        .btn,
        .btn-enter,
        .btn-secondary-access,
        .password-toggle,
        .icon-btn,
        .hero-button,
        .hero-button-secondary,
        .quick-item,
        .action-button,
        .location-refresh,
        .location-retry-btn,
        .history-more,
        .detail-btn,
        .detail-link,
        .detail-close,
        .period-btn,
        .filter-submit,
        .filter-chip,
        .photo-button,
        .photo-action-btn,
        .photo-add-btn,
        .obs-toggle,
        .client-option,
        .top-icon-btn,
        .finish-button,
        .rota-inside-btn,
        .rota-btn,
        .offline-sync-btn,
        .task-row-nav-btn,
        .pwa-install-btn,
        a.finish-button,
        a.icon-btn,
        a.rota-inside-btn,
        a.rota-btn,
        a.detail-link
    ):not(:disabled):not(.disabled):not([aria-disabled="true"]):not(.is-loading):hover {
        transform: translateY(var(--cv-ui-lift));
        box-shadow: var(--cv-ui-shadow-lift);
        filter: brightness(1.03) saturate(1.04);
    }

    /* Primários verdes: brilho premium */
    :where(
        .btn-enter,
        .finish-button,
        .hero-button,
        .action-button,
        .rota-btn.is-active,
        .rota-inside-btn:not(.ghost):not(.ghost-danger),
        .offline-sync-btn,
        .pwa-install-btn
    ):not(:disabled):not(.disabled):not(.is-loading):hover {
        box-shadow: var(--cv-ui-glow-green);
        filter: brightness(1.05) saturate(1.06);
    }

    :where(
        .icon-btn-danger
    ):not(:disabled):not(.disabled):hover {
        box-shadow: 0 12px 24px rgba(239, 45, 45, 0.28);
        filter: brightness(1.04);
    }

    :where(
        .rota-inside-btn.ghost-danger,
        .detail-link.secondary
    ):not(:disabled):not(.disabled):hover {
        box-shadow: 0 10px 20px rgba(185, 28, 28, 0.12);
        filter: brightness(1.02);
    }

    /* Cards / atalhos clicáveis */
    :where(
        .hero-card,
        .rota-context-card,
        .avulsas-banner,
        a.hero-card,
        a.rota-context-card
    ):hover {
        transform: translateY(-2px);
        box-shadow: var(--cv-ui-shadow-lift);
        filter: brightness(1.015);
    }

    :where(
        .card,
        .quick-block,
        .login-card,
        .setup-card,
        .auth-card,
        .summary-card,
        .status-card,
        .module-card,
        .resume-card,
        .history-item,
        .report-item,
        .rota-card,
        .task-row-card
    ):hover {
        transform: translateY(-1px);
        box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08);
    }

    /* Wizard veículo/rota */
    .choice-grid label:hover .choice-card {
        transform: translateY(-2px);
        box-shadow: var(--cv-ui-shadow-lift);
        border-color: rgba(16, 168, 74, 0.35);
        filter: brightness(1.02);
    }

    .choice-grid label:has(.choice-input:checked):hover .choice-card {
        box-shadow: var(--cv-ui-glow-green);
    }

    .mode-option:hover span {
        transform: translateY(-1px);
        border-color: rgba(16, 168, 74, 0.35);
        box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
    }
}

/* Press feedback (mouse e toque) */
:where(
    button,
    .btn,
    .btn-enter,
    .btn-secondary-access,
    .password-toggle,
    .icon-btn,
    .hero-button,
    .hero-button-secondary,
    .quick-item,
    .action-button,
    .location-refresh,
    .location-retry-btn,
    .history-more,
    .detail-btn,
    .detail-link,
    .detail-close,
    .period-btn,
    .filter-submit,
    .filter-chip,
    .photo-button,
    .photo-action-btn,
    .photo-add-btn,
    .obs-toggle,
    .client-option,
    .top-icon-btn,
    .finish-button,
    .rota-inside-btn,
    .rota-btn,
    .offline-sync-btn,
    .task-row-nav-btn,
    .pwa-install-btn,
    a.finish-button,
    a.icon-btn,
    a.rota-inside-btn,
    a.rota-btn,
    a.detail-link
):not(:disabled):not(.disabled):not([aria-disabled="true"]):not(.is-loading):active {
    transform: translateY(0) scale(0.985);
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.08);
    filter: brightness(0.98);
}

.choice-grid label:active .choice-card {
    transform: translateY(0) scale(0.985);
}

@media (prefers-reduced-motion: reduce) {
    :where(*, *::before, *::after) {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}