/* Widget — alto contraste, banner de cookies e VLibras (abaixo da dobra / interação) */

/* =============================================
   MODO ESCURO + ALTO CONTRASTE
   ============================================= */

body.a11y-high-contrast,
html.a11y-high-contrast {
    --a11y-bg: #000000;
    --a11y-surface: #111111;
    --a11y-elevated: #1a1a1a;
    --a11y-text: #ffffff;
    --a11y-text-muted: #d1d5db;
    --a11y-accent: #facc15;
    --a11y-accent-hover: #fde047;
    --a11y-border: #ffffff;
    --a11y-on-accent: #000000;

    --color-background: var(--a11y-bg);
    --color-surface: var(--a11y-surface);
    --color-primary: var(--a11y-accent);
    --color-primary-light: var(--a11y-accent-hover);
    --color-dark: var(--a11y-text);
    --color-border: var(--a11y-border);
    --color-bg-alt: var(--a11y-elevated);
    --color-text-dim: var(--a11y-text-muted);

    background-color: var(--a11y-bg);
    color: var(--a11y-text);
}

body.a11y-high-contrast h1,
body.a11y-high-contrast h2,
body.a11y-high-contrast h3,
body.a11y-high-contrast p,
body.a11y-high-contrast li,
body.a11y-high-contrast span:not(.section-label) {
    color: inherit;
}

body.a11y-high-contrast .section-label {
    color: var(--a11y-accent-hover);
}

body.a11y-high-contrast .headline span,
body.a11y-high-contrast .section-headline span,
body.a11y-high-contrast .card-text,
body.a11y-high-contrast .video-description,
body.a11y-high-contrast .case-brief,
body.a11y-high-contrast .case-meta,
body.a11y-high-contrast .price-label {
    color: var(--a11y-text-muted);
}

body.a11y-high-contrast .header {
    background: var(--a11y-bg) !important;
    border-bottom-color: var(--a11y-border) !important;
}

body.a11y-high-contrast .header-menu-btn,
body.a11y-high-contrast .header-dropdown {
    background: var(--a11y-surface) !important;
    border-color: var(--a11y-border) !important;
}

body.a11y-high-contrast .header-menu-dots span {
    background: var(--a11y-text);
}

body.a11y-high-contrast .header-menu-btn:hover .header-menu-dots span,
body.a11y-high-contrast .header-menu.is-open .header-menu-dots span {
    background: var(--a11y-accent);
}

body.a11y-high-contrast .header-dropdown-link,
body.a11y-high-contrast .header-dropdown-label {
    color: var(--a11y-text-muted);
}

body.a11y-high-contrast .header-dropdown-link:hover,
body.a11y-high-contrast .header-dropdown-link.is-active {
    color: var(--a11y-accent) !important;
    background: var(--a11y-elevated) !important;
}

body.a11y-high-contrast .btn-primary {
    background-color: var(--a11y-text) !important;
    color: var(--a11y-on-accent) !important;
    border-color: var(--a11y-text) !important;
}

body.a11y-high-contrast .btn-secondary {
    background-color: var(--a11y-accent) !important;
    color: var(--a11y-on-accent) !important;
    border-color: var(--a11y-accent) !important;
}

body.a11y-high-contrast .btn-checkout {
    background: var(--a11y-accent) !important;
    color: var(--a11y-on-accent) !important;
}

body.a11y-high-contrast .hero,
body.a11y-high-contrast .video-section,
body.a11y-high-contrast .cases-section,
body.a11y-high-contrast .services-section,
body.a11y-high-contrast .footer,
body.a11y-high-contrast .config-section,
body.a11y-high-contrast .hero-app-config {
    background: var(--a11y-bg);
}

body.a11y-high-contrast .service-card-premium,
body.a11y-high-contrast .case-item,
body.a11y-high-contrast .config-card,
body.a11y-high-contrast .cart-drawer {
    background: var(--a11y-surface) !important;
    border-color: var(--a11y-border) !important;
    color: var(--a11y-text) !important;
}

body.a11y-high-contrast .service-card-premium.featured {
    background: var(--a11y-elevated) !important;
    border: 2px solid var(--a11y-accent) !important;
    color: var(--a11y-text) !important;
}

body.a11y-high-contrast .service-card-premium.featured .card-title,
body.a11y-high-contrast .service-card-premium.featured .card-text,
body.a11y-high-contrast .service-card-premium.featured .price-value {
    color: var(--a11y-text) !important;
}

body.a11y-high-contrast .case-highlights li {
    background: var(--a11y-accent) !important;
    color: var(--a11y-on-accent) !important;
}

body.a11y-high-contrast .case-link,
body.a11y-high-contrast .footer-link,
body.a11y-high-contrast .back-link {
    color: var(--a11y-accent) !important;
}

body.a11y-high-contrast .footer-link:hover,
body.a11y-high-contrast .case-link:hover {
    color: var(--a11y-accent-hover) !important;
}

body.a11y-high-contrast .footer-seal-title,
body.a11y-high-contrast .footer-seal-desc,
body.a11y-high-contrast .footer-nav-label,
body.a11y-high-contrast .footer-copy,
body.a11y-high-contrast .footer-cnpj,
body.a11y-high-contrast .footer-proposition {
    color: var(--a11y-text-muted);
}

body.a11y-high-contrast .logo-brand,
body.a11y-high-contrast .logo-footer {
    filter: brightness(0) invert(1);
}

body.a11y-high-contrast .mini-logo {
    filter: brightness(0) invert(1);
}

body.a11y-high-contrast .case-mockup {
    filter: grayscale(0) opacity(1);
}

body.a11y-high-contrast .bg-mark,
body.a11y-high-contrast .section-bg-icon {
    opacity: 0.08;
    filter: brightness(0) invert(1);
}

body.a11y-high-contrast .hero-logo-visual {
    opacity: 0.2;
}

body.a11y-high-contrast .divider {
    background: var(--a11y-border);
    opacity: 0.35;
}

body.a11y-high-contrast .summary-sidebar,
body.a11y-high-contrast .mobile-mini-cart {
    background: var(--a11y-surface) !important;
    border-color: var(--a11y-accent) !important;
    color: var(--a11y-text) !important;
}

body.a11y-high-contrast .summary-sidebar .order-item-title,
body.a11y-high-contrast .summary-sidebar .total-value,
body.a11y-high-contrast .order-item-title,
body.a11y-high-contrast .total-value {
    color: var(--a11y-text) !important;
}

body.a11y-high-contrast .order-item-price {
    color: var(--a11y-accent) !important;
}

body.a11y-high-contrast .price-tag-value {
    color: var(--a11y-text) !important;
}

body.a11y-high-contrast .inline-select,
body.a11y-high-contrast .qty-control {
    background: var(--a11y-elevated);
    border-color: var(--a11y-border);
    color: var(--a11y-text);
}

body.a11y-high-contrast .a11y-widget-btn {
    background: var(--a11y-surface);
    border-color: var(--a11y-border);
    color: var(--a11y-text);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45);
}

body.a11y-high-contrast .a11y-widget-btn img {
    filter: brightness(0) invert(1);
}

body.a11y-high-contrast .a11y-widget-trigger {
    background: var(--a11y-text);
    border-color: var(--a11y-text);
}

body.a11y-high-contrast .a11y-widget-trigger img {
    filter: brightness(0);
}

body.a11y-high-contrast .a11y-widget.is-open .a11y-widget-trigger {
    background: var(--a11y-accent);
    border-color: var(--a11y-accent);
}

body.a11y-high-contrast .a11y-widget.is-open .a11y-widget-trigger img {
    filter: brightness(0);
}

body.a11y-high-contrast .a11y-widget-btn[aria-pressed="true"] {
    background: var(--a11y-accent);
    border-color: var(--a11y-accent);
}

body.a11y-high-contrast .a11y-widget-btn[aria-pressed="true"] img {
    filter: brightness(0);
}

body.a11y-high-contrast .footer-seal {
    opacity: 1;
    filter: brightness(0) invert(1);
}

body.a11y-high-contrast .cookie-banner {
    background: var(--a11y-bg);
    border-top-color: var(--a11y-border);
}

body.a11y-high-contrast .cookie-banner-dpo.is-highlight {
    border-color: var(--a11y-accent);
    background: rgba(250, 204, 21, 0.12);
}

body.a11y-high-contrast .cookie-banner-dpo a {
    color: var(--a11y-accent);
}

/* Banner de cookies */
.cookie-banner {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1300;
    padding: 1rem;
    padding-bottom: calc(1rem + env(safe-area-inset-bottom));
    background: rgba(26, 31, 38, 0.92);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    transform: translateY(100%);
    transition: transform 0.35s ease;
}

.cookie-banner.is-visible {
    transform: translateY(0);
}

.cookie-banner[hidden] {
    display: block;
    visibility: hidden;
    pointer-events: none;
}

.cookie-banner.is-visible[hidden] {
    visibility: visible;
    pointer-events: auto;
}

.cookie-banner-inner {
    max-width: 1440px;
    margin: 0 auto;
}

.cookie-banner-panel {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.cookie-banner-panel[hidden] {
    display: none;
}

.cookie-banner-title {
    font-size: 0.85rem;
    color: #ffffff;
    margin-bottom: 0.35rem;
}

.cookie-banner-desc {
    font-size: 0.72rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.78);
    margin: 0;
}

.cookie-banner-desc a {
    color: #FFFFFF;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.cookie-banner-dpo {
    margin-top: 0.75rem;
    padding: 0.85rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 4px;
    font-size: 0.68rem;
    color: rgba(255, 255, 255, 0.85);
}

.cookie-banner-dpo strong {
    display: block;
    font-size: 0.6rem;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    margin-bottom: 0.35rem;
}

.cookie-banner-dpo p {
    margin: 0 0 0.35rem;
}

.cookie-banner-dpo a {
    color: #FFFFFF;
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.cookie-banner-dpo.is-highlight {
    border-color: var(--color-primary-light);
    background: rgba(37, 99, 235, 0.15);
}

.cookie-banner-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.cookie-banner-actions .btn {
    padding: 0.85rem 1.25rem;
    font-size: 0.65rem;
    flex: 1 1 auto;
    min-height: 44px;
    justify-content: center;
}

.cookie-banner .btn-secondary {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.55);
    color: #FFFFFF;
}

.cookie-banner .btn-secondary:hover {
    background: rgba(255, 255, 255, 0.18);
    border-color: #FFFFFF;
    opacity: 1;
}

.cookie-banner .btn-primary {
    background: #FFFFFF;
    color: var(--color-dark);
    border-color: #FFFFFF;
}

.cookie-banner .btn-primary:hover {
    background: #F3F4F6;
    opacity: 1;
}

.cookie-categories {
    list-style: none;
    margin: 0.85rem 0 0;
    padding: 0;
    display: grid;
    gap: 0.65rem;
}

.cookie-category {
    padding: 0.75rem 0.85rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.03);
}

.cookie-category--locked {
    opacity: 0.92;
}

.cookie-category-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.35rem;
}

.cookie-category-name {
    font-size: 0.72rem;
    font-weight: 800;
    color: #fff;
    margin: 0;
}

.cookie-category-badge {
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.65);
    white-space: nowrap;
}

.cookie-category-desc {
    margin: 0;
    font-size: 0.68rem;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.72);
}

.cookie-toggle {
    position: relative;
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    cursor: pointer;
}

.cookie-toggle input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
}

.cookie-toggle-ui {
    width: 2.5rem;
    height: 1.35rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.22);
    border: 1px solid rgba(255, 255, 255, 0.18);
    transition: background 0.2s ease;
    position: relative;
}

.cookie-toggle-ui::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    background: #fff;
    transition: transform 0.2s ease;
}

.cookie-toggle input:checked + .cookie-toggle-ui {
    background: var(--color-primary);
    border-color: var(--color-primary);
}

.cookie-toggle input:checked + .cookie-toggle-ui::after {
    transform: translateX(1.1rem);
}

.cookie-toggle input:focus-visible + .cookie-toggle-ui {
    outline: 2px solid var(--color-primary-light);
    outline-offset: 2px;
}

.cookie-banner-legal-links {
    margin: 0.75rem 0 0;
    font-size: 0.68rem;
}

.cookie-banner-legal-links a {
    color: #FFFFFF;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
}

@media (min-width: 768px) {
    .cookie-banner-panel {
        flex-direction: row;
        align-items: flex-start;
        justify-content: space-between;
        gap: 2rem;
    }

    .cookie-banner-content {
        flex: 1;
    }

    .cookie-banner-actions {
        flex: 0 0 auto;
        flex-direction: column;
        min-width: 11rem;
    }

    .cookie-banner-actions .btn {
        flex: 0 0 auto;
        width: 100%;
    }
}

/* VLibras: oculto até clicar no botão do widget */
body:not(.a11y-vlibras-open) div[vw],
body:not(.a11y-vlibras-open) [vp-click-blocker],
body:not(.a11y-vlibras-open) [vp-translator-screen],
body:not(.a11y-vlibras-open) [vw-plugin-wrapper].active {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

body.a11y-vlibras-open div[vw] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 1400 !important;
}

body.a11y-vlibras-open [vw-access-button].active {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

body.a11y-vlibras-open [vw-plugin-wrapper].active,
body.a11y-vlibras-open [vp-translator-screen],
body.a11y-vlibras-open [vp-controls] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    z-index: 1400 !important;
}
