/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PCFORMATECH — Sistema de Tema Claro / Escuro
   Versão centralizada: TODAS as adaptações de dark mode
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */


/* ═══════════════════════════════════════════════════════
   1. TOKENS DE TEMA  (light = padrão, dark via atributo)
   ═══════════════════════════════════════════════════════ */

:root {
    /* Camadas de superfície */
    --theme-bg:             #f4f7fb;
    --theme-text:           #12263a;
    --theme-surface:        #ffffff;
    --theme-surface-2:      #eef3f8;
    --theme-surface-3:      #e2ecf5;

    /* Bordas */
    --theme-border:         #d0dcea;
    --theme-border-2:       #b8cce0;

    /* Sombras */
    --theme-shadow:         0 8px 24px rgba(15, 23, 42, .12);
    --theme-shadow-lg:      0 16px 40px rgba(15, 23, 42, .16);

    /* Tipografia auxiliar */
    --theme-muted:          #5f6c7b;
    --theme-faint:          #8fa0b3;

    /* Acento */
    --theme-accent:         #40998F;
    --theme-accent-2:       #2D7A7A;
    --theme-accent-glow:    rgba(64, 153, 143, .25);
}

html[data-theme='dark'] {
    /* Camadas de superfície (sistema de elevação) */
    --theme-bg:             #090f1b;
    --theme-text:           #dce8f5;
    --theme-surface:        #111c2e;   /* base: cards */
    --theme-surface-2:      #172437;   /* elevado: inputs, zebra */
    --theme-surface-3:      #1f2f47;   /* mais elevado: hover/focus */

    /* Bordas */
    --theme-border:         #263d58;
    --theme-border-2:       #344f6e;

    /* Sombras */
    --theme-shadow:         0 10px 32px rgba(0, 0, 0, .55);
    --theme-shadow-lg:      0 20px 56px rgba(0, 0, 0, .65);

    /* Tipografia auxiliar */
    --theme-muted:          #8fadc8;
    --theme-faint:          #5d7896;

    /* Acento */
    --theme-accent:         #5fc9be;
    --theme-accent-2:       #41a89d;
    --theme-accent-glow:    rgba(95, 201, 190, .2);

    color-scheme: dark;

    /* ── Remapeia variáveis de styles.css / styles2.css ── */
    --primary-color:     #dce8f5;
    --secondary-color:   #5fc9be;
    --accent-color:      #5fc9be;
    --success-color:     #5fc9be;
    --warning-color:     #87d9d3;
    --text-color:        #c8daf0;
    --text-light:        #8fadc8;
    --light-bg:          #1f2f47;
    --white:             #111c2e;
    --gradient:          linear-gradient(135deg, #0f1c2d 0%, #172437 100%);
    --gradient-accent:   linear-gradient(135deg, #41a89d 0%, #5fc9be 100%);
    --gradient-subtle:   linear-gradient(135deg, #172437 0%, #1f2f47 100%);
    --shadow-sm:         0 2px 8px  rgba(0, 0, 0, .35);
    --shadow-md:         0 6px 16px rgba(0, 0, 0, .40);
    --shadow-lg:         0 10px 26px rgba(0, 0, 0, .50);
    --shadow-xl:         0 18px 48px rgba(0, 0, 0, .60);

    /* ── Remapeia variáveis pcft do tema dinâmico ── */
    --pcft-page-background:       radial-gradient(ellipse at 20% 0%, #13243a 0%, #090f1b 55%, #060c14 100%);
    --pcft-card-background:       #111c2e;
    --pcft-card-border:           rgba(38, 61, 88, .8);
    --pcft-text-color:            #dce8f5;
    --pcft-muted-color:           #8fadc8;
    --pcft-heading-color:         #dce8f5;
    --pcft-section-background:    linear-gradient(180deg, #0e1929 0%, #0b1520 100%);
    --pcft-section-alt-background:linear-gradient(180deg, #0b1520 0%, #091421 100%);
    --pcft-header-background:     linear-gradient(135deg, #0d1e30 0%, #091629 100%);
    --pcft-footer-background:     linear-gradient(135deg, #0d1e30 0%, #07111e 100%);
    --pcft-badge-background:      rgba(95, 201, 190, .12);
    --pcft-badge-text:            #5fc9be;
    --pcft-chip-background:       rgba(23, 36, 55, .9);
    --pcft-chip-text:             #dce8f5;
    /* Remove decorative circles que aparecem no fundo escuro */
    --pcft-decoration-top:        none;
    --pcft-decoration-bottom:     none;
}


/* ═══════════════════════════════════════════════════════
   2. TRANSIÇÃO BASE
   ═══════════════════════════════════════════════════════ */

body {
    background: var(--theme-bg);
    color: var(--theme-text);
    transition: background-color .25s ease, color .25s ease;
}

/* Superfícies que transitam suavemente */
.header, .footer,
.hero-overlay,
.services, .testimonials, .faq, .scheduling, .about, .contact,
.services-summary,
.service-card, .feature-card,
.testimonial-card, .testimonial-bubble, .client-info,
.faq-item, .booking-btn, .info-card, .stat-item,
.schedule-form, .quick-booking,
.form-group input, .form-group select, .form-group textarea,
.services-checkbox-group, .service-checkbox,
.modal, .modal-content,
.login-container, .admin-header, .admin-tabs,
.stat-card, .chart-container, .rt-kpi, .rt-card,
.clients-container,
.whatsapp-chat, .whatsapp-body, .whatsapp-footer, .whatsapp-message,
.announcement-content,
.anydesk-download, .remote-service-highlight,
.total-price-display, .form-page-header,
.alert, .close-modal,
.search-box input {
    transition:
        background-color .25s ease,
        background      .25s ease,
        color           .25s ease,
        border-color    .25s ease,
        box-shadow      .25s ease;
}


/* ═══════════════════════════════════════════════════════
   3. DARK MODE — REGRAS POR COMPONENTE
   ═══════════════════════════════════════════════════════ */

/* ── 3.1  Body / fundo global ── */
html[data-theme='dark'] body {
    background: radial-gradient(
        ellipse at 20% 0%,
        #13243a 0%,
        #090f1b 55%,
        #060c14 100%
    );
}

/* ── 3.2  Header ── */
html[data-theme='dark'] .header {
    background: linear-gradient(135deg, #0d1e30 0%, #091629 100%);
    box-shadow: 0 2px 20px rgba(0, 0, 0, .5);
    border-bottom: none;
}

html[data-theme='dark'] .nav-links a,
html[data-theme='dark'] .brand-name,
html[data-theme='dark'] .tagline {
    color: inherit;
}

/* ── 3.3  Hero / Carrossel ── */
html[data-theme='dark'] .hero-overlay {
    background: linear-gradient(
        135deg,
        rgba(0, 0, 0, .68) 0%,
        rgba(5, 15, 30, .58) 50%,
        rgba(0, 0, 0, .68) 100%
    );
}

/* ── 3.4  Seções de fundo alternado ── */
html[data-theme='dark'] .services,
html[data-theme='dark'] .faq,
html[data-theme='dark'] .scheduling,
html[data-theme='dark'] .social-proof,
html[data-theme='dark'] .about,
html[data-theme='dark'] .contact {
    background: linear-gradient(180deg, #0e1929 0%, #0b1520 100%);
}

html[data-theme='dark'] .testimonials {
    background: linear-gradient(135deg, #0d1e30 0%, #0a1826 100%);
}

/* ── 3.5  Footer ── */
html[data-theme='dark'] .footer {
    background: linear-gradient(135deg, #0d1e30 0%, #07111e 100%);
    border-top: 1px solid var(--theme-border);
    color: var(--theme-text);
}

html[data-theme='dark'] .footer * {
    color: inherit;
}

html[data-theme='dark'] .footer-links ul li a:hover {
    color: var(--theme-accent);
}

html[data-theme='dark'] .payment-highlight {
    background: rgba(95, 201, 190, .07);
    border-color: rgba(95, 201, 190, .2);
}

html[data-theme='dark'] .contact-item {
    background: rgba(255, 255, 255, .04);
    border-color: var(--theme-border);
}

html[data-theme='dark'] .contact-item:hover {
    background: rgba(95, 201, 190, .08);
    border-color: var(--theme-accent);
}

html[data-theme='dark'] .footer h3,
html[data-theme='dark'] .footer h4,
html[data-theme='dark'] .footer-links ul li a,
html[data-theme='dark'] .contact-info p,
html[data-theme='dark'] .payment-item,
html[data-theme='dark'] .payment-item span,
html[data-theme='dark'] .payment-methods-icons,
html[data-theme='dark'] .payment-methods-icons i {
    color: var(--theme-text);
}

html[data-theme='dark'] .slogan,
html[data-theme='dark'] .footer-description,
html[data-theme='dark'] .contact-info small,
html[data-theme='dark'] .footer-info-bottom p,
html[data-theme='dark'] .location-info small,
html[data-theme='dark'] .social-link small {
    color: var(--theme-muted);
}

html[data-theme='dark'] .social-proof-header p,
html[data-theme='dark'] .social-links-card p,
html[data-theme='dark'] .social-proof-media figcaption {
    color: var(--theme-muted);
}

html[data-theme='dark'] .social-proof-kicker,
html[data-theme='dark'] .social-proof-chip {
    background: rgba(95, 201, 190, .12);
    color: #b9f5ee;
}

html[data-theme='dark'] .social-proof-featured,
html[data-theme='dark'] .social-links-card,
html[data-theme='dark'] .location-info,
html[data-theme='dark'] .social-link {
    background: var(--theme-surface);
    border-color: var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .social-proof-featured::before {
    background: radial-gradient(circle, rgba(95, 201, 190, .18) 0%, rgba(95, 201, 190, 0) 72%);
}

html[data-theme='dark'] .social-proof-copy h3,
html[data-theme='dark'] .social-links-card h3,
html[data-theme='dark'] .social-proof-point span,
html[data-theme='dark'] .location-info strong,
html[data-theme='dark'] .social-link strong {
    color: var(--theme-text);
}

html[data-theme='dark'] .social-proof-point {
    background: rgba(95, 201, 190, .08);
    border-color: rgba(95, 201, 190, .16);
}

html[data-theme='dark'] .social-proof-badge {
    background: rgba(2, 6, 23, .72);
    color: #ecfffd;
}

html[data-theme='dark'] .social-proof-media img {
    background: linear-gradient(135deg, #13243a 0%, #0c1726 100%);
    box-shadow: 0 20px 40px rgba(0, 0, 0, .35);
}

html[data-theme='dark'] .payment-item {
    background: rgba(255, 255, 255, .05);
    border-color: var(--theme-border);
}

html[data-theme='dark'] .payment-item:hover {
    background: rgba(95, 201, 190, .10);
    border-color: var(--theme-accent);
}

html[data-theme='dark'] .payment-item i,
html[data-theme='dark'] .contact-item i,
html[data-theme='dark'] .footer h3 i,
html[data-theme='dark'] .footer h4 i {
    color: var(--theme-accent);
}

/* ── 3.6  Cards de serviço ── */
html[data-theme='dark'] .service-card {
    background: var(--theme-surface);
    border-color: var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .service-card:hover,
html[data-theme='dark'] .feature-card:hover,
html[data-theme='dark'] .slide-card:hover {
    border-color: var(--theme-accent);
    box-shadow: var(--theme-shadow-lg), 0 0 0 1px var(--theme-accent-glow);
}

html[data-theme='dark'] .service-card:has(.service-checkbox:checked) {
    background: linear-gradient(
        135deg,
        rgba(95, 201, 190, .06) 0%,
        rgba(65, 168, 157, .09) 100%
    );
    border-color: var(--theme-accent);
}

html[data-theme='dark'] .service-card .service-check-mark {
    background: var(--theme-surface-2);
    border-color: var(--theme-border);
}

html[data-theme='dark'] .service-card h3 {
    color: var(--theme-text);
}

html[data-theme='dark'] .service-card p {
    color: var(--theme-muted);
}

html[data-theme='dark'] .price-tag {
    background: linear-gradient(135deg, #1a4a3a 0%, #163d32 100%);
    box-shadow: 0 4px 12px rgba(0, 0, 0, .45);
}

html[data-theme='dark'] .service-badge {
    box-shadow: 0 4px 15px rgba(0, 0, 0, .5);
}

/* ── 3.7  Barra flutuante de resumo ── */
html[data-theme='dark'] .services-summary {
    background: linear-gradient(135deg, #0f2237 0%, #0b1a2b 100%);
    border-top: 1px solid var(--theme-border);
    box-shadow: 0 -6px 24px rgba(0, 0, 0, .5);
}

html[data-theme='dark'] .services-subtitle {
    color: var(--theme-muted);
}

/* ── 3.8  Modal ── */
html[data-theme='dark'] .modal {
    background-color: rgba(2, 6, 16, .85);
}

html[data-theme='dark'] .modal-content {
    /* !important necessário: uma regra sem tema mais abaixo neste arquivo
       força ".modal-content { background: #ffffff !important; }" sem nenhuma
       condição de tema. Sem vencer essa regra aqui, os modais de serviço
       (Formatação, Programas etc.) ficavam brancos com texto claro por cima
       no tema escuro — quase ilegível. */
    background: var(--theme-surface) !important;
    border: 1px solid var(--theme-border);
    box-shadow: 0 24px 64px rgba(0, 0, 0, .7);
    color: var(--theme-text);
}

html[data-theme='dark'] .modal-content h3 {
    color: var(--theme-text);
    background: none;
    border-image: none;
    border-bottom: 2px solid var(--theme-border);
}

html[data-theme='dark'] .modal-header {
    border-bottom-color: var(--theme-border);
}

html[data-theme='dark'] .modal-header h2 {
    color: var(--theme-text);
}

html[data-theme='dark'] .close-modal {
    background: var(--theme-surface-2);
    color: var(--theme-muted);
}

html[data-theme='dark'] .close-modal:hover {
    background: var(--theme-surface-3);
    color: var(--theme-text);
}

html[data-theme='dark'] .close,
html[data-theme='dark'] .close:hover {
    color: var(--theme-text);
}

html[data-theme='dark'] .price-details {
    border-top-color: var(--theme-border);
}

html[data-theme='dark'] .anydesk-download {
    background: var(--theme-surface-2);
    border: 1px solid var(--theme-border);
}

html[data-theme='dark'] .anydesk-download h4,
html[data-theme='dark'] .anydesk-download ol li {
    color: var(--theme-text);
}

html[data-theme='dark'] .remote-service-highlight {
    background: linear-gradient(
        135deg,
        rgba(95, 201, 190, .07),
        rgba(65, 168, 157, .04)
    );
    border: 1px solid var(--theme-border);
}

html[data-theme='dark'] .service-features li {
    color: var(--theme-text);
}

/* ── 3.9  Depoimentos (estilo WhatsApp) ── */
html[data-theme='dark'] .testimonial-card,
html[data-theme='dark'] .testimonial-card.whatsapp-style {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow);
}

/* Seletores de alta especificidade para garantir override sobre styles2.css */
html[data-theme='dark'] .testimonials-grid .testimonial-card.whatsapp-style,
html[data-theme='dark'] .testimonials .testimonial-card {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
}

html[data-theme='dark'] .testimonial-bubble {
    background: var(--theme-surface-2);
}

html[data-theme='dark'] .testimonial-card.whatsapp-style .testimonial-bubble {
    background: var(--theme-surface-2);
    border-radius: 12px 12px 0 0;
}

html[data-theme='dark'] .testimonial-bubble p,
html[data-theme='dark'] .testimonial-content p {
    color: var(--theme-text);
}

html[data-theme='dark'] .client-info,
html[data-theme='dark'] .testimonial-card.whatsapp-style .client-info {
    background: var(--theme-surface);
    border-top-color: var(--theme-border);
}

html[data-theme='dark'] .client-details h3,
html[data-theme='dark'] .client-details h4,
html[data-theme='dark'] .testimonial-card.whatsapp-style .client-details h3,
html[data-theme='dark'] .testimonial-card.whatsapp-style .client-details h4 {
    color: var(--theme-text);
}

html[data-theme='dark'] .testimonial-time {
    color: var(--theme-faint);
}

html[data-theme='dark'] .testimonials .section-title {
    color: var(--theme-text);
}

/* ── 3.10  FAQ ── */
html[data-theme='dark'] .faq-item {
    background: var(--theme-surface);
    border-color: var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .faq-item:hover {
    border-color: var(--theme-accent);
    box-shadow: 0 14px 32px rgba(0, 0, 0, .5);
}

html[data-theme='dark'] .question-icon {
    background: var(--theme-surface-3);
    border: 1px solid var(--theme-border);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .3);
}

html[data-theme='dark'] .faq-item h3,
html[data-theme='dark'] .faq-answer p {
    color: var(--theme-text);
}

/* ── 3.11  Agendamento / Formulário ── */
html[data-theme='dark'] .schedule-form,
html[data-theme='dark'] .quick-booking {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .form-group label {
    color: var(--theme-text);
}

html[data-theme='dark'] .form-group input,
html[data-theme='dark'] .form-group select,
html[data-theme='dark'] .form-group textarea,
html[data-theme='dark'] input,
html[data-theme='dark'] select,
html[data-theme='dark'] textarea,
html[data-theme='dark'] .search-box input,
html[data-theme='dark'] .slide-info input {
    background: var(--theme-surface-2);
    color: var(--theme-text);
    border-color: var(--theme-border);
}

html[data-theme='dark'] .form-group input:focus,
html[data-theme='dark'] .form-group select:focus,
html[data-theme='dark'] .form-group textarea:focus {
    border-color: var(--theme-accent);
    box-shadow: 0 0 0 3px var(--theme-accent-glow);
    background: var(--theme-surface-3);
}

html[data-theme='dark'] input::placeholder,
html[data-theme='dark'] textarea::placeholder {
    color: var(--theme-faint);
    opacity: 1;
}

html[data-theme='dark'] .services-checkbox-group {
    background: var(--theme-surface-2);
    border-color: var(--theme-border);
}

html[data-theme='dark'] .service-checkbox {
    background: var(--theme-surface);
    border-color: var(--theme-border);
}

html[data-theme='dark'] .service-checkbox:hover {
    background: var(--theme-surface-3);
    border-color: var(--theme-accent);
}

html[data-theme='dark'] .service-checkbox span {
    color: var(--theme-text);
}

html[data-theme='dark'] .schedule-info {
    color: var(--theme-muted);
}

/* ── 3.12  Booking buttons / Info cards ── */
html[data-theme='dark'] .booking-btn,
html[data-theme='dark'] .info-card {
    background: var(--theme-surface);
    border-color: var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .booking-btn:hover,
html[data-theme='dark'] .info-card:hover {
    background: var(--theme-surface-2);
    border-color: var(--theme-accent);
    box-shadow: 0 14px 32px rgba(0, 0, 0, .5);
}

html[data-theme='dark'] .booking-btn span {
    color: var(--theme-text);
}

html[data-theme='dark'] .booking-btn small {
    background: var(--theme-surface-3);
    color: var(--theme-muted);
}

html[data-theme='dark'] .info-card h4,
html[data-theme='dark'] .info-card p,
html[data-theme='dark'] .info-card strong {
    color: var(--theme-text);
}

html[data-theme='dark'] .info-card small {
    color: var(--theme-faint);
}

html[data-theme='dark'] .info-card i {
    color: var(--theme-accent);
}

/* ── 3.13  Stats sociais ── */
html[data-theme='dark'] .stat-item {
    background: var(--theme-surface);
    border-color: var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .stat-item:hover {
    background: var(--theme-surface-2);
    border-color: var(--theme-accent);
}

html[data-theme='dark'] .stat-number {
    color: var(--theme-accent);
}

html[data-theme='dark'] .stat-item i {
    color: var(--theme-accent);
}

html[data-theme='dark'] .stat-label {
    color: var(--theme-muted);
}

/* ── 3.14  WhatsApp widget ── */
html[data-theme='dark'] .whatsapp-chat {
    background: var(--theme-surface);
    border-color: var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .whatsapp-body {
    background: #0e1b2c;
}

html[data-theme='dark'] .whatsapp-message {
    background: var(--theme-surface-2);
    color: var(--theme-text);
}

html[data-theme='dark'] .whatsapp-footer {
    background: var(--theme-surface);
    border-top: 1px solid var(--theme-border);
}

html[data-theme='dark'] .whatsapp-header,
html[data-theme='dark'] .whatsapp-toggle {
    filter: brightness(.9) saturate(.85);
}

/* ── 3.15  Admin — header, tabs ── */
html[data-theme='dark'] .admin-header {
    background: linear-gradient(135deg, #0d1e30 0%, #091629 100%);
}

html[data-theme='dark'] .admin-tabs {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .tab-button {
    background: transparent;
    color: var(--theme-muted);
    border-bottom-color: transparent;
}

html[data-theme='dark'] .tab-button:hover {
    background: var(--theme-surface-2);
    color: var(--theme-text);
}

html[data-theme='dark'] .tab-button.active {
    color: var(--theme-accent);
    background: var(--theme-surface-2);
    border-bottom-color: var(--theme-accent);
}

html[data-theme='dark'] .admin-tabs .tab-button,
html[data-theme='dark'] .admin-tabs .tab-button i {
    color: var(--theme-muted);
}

html[data-theme='dark'] .stat-card {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .chart-container {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
}

html[data-theme='dark'] .clients-container {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
}

html[data-theme='dark'] .clients-table th {
    background: var(--theme-surface-2);
    color: var(--theme-text);
    border-bottom-color: var(--theme-border);
}

html[data-theme='dark'] .clients-table td {
    color: var(--theme-text);
    border-bottom-color: var(--theme-border);
}

html[data-theme='dark'] .clients-table tr:hover,
html[data-theme='dark'] .rt-list li:hover {
    background: var(--theme-surface-2);
}

html[data-theme='dark'] .service-item {
    background: var(--theme-surface-2);
    border-color: var(--theme-border);
}

html[data-theme='dark'] .slides-grid .slide-card,
html[data-theme='dark'] .slide-card {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .slide-preview {
    background: #0a1626;
}

html[data-theme='dark'] .slide-info {
    background: var(--theme-surface);
}

html[data-theme='dark'] .slide-info p,
html[data-theme='dark'] .slide-info span,
html[data-theme='dark'] .slide-order span {
    color: var(--theme-text);
}

html[data-theme='dark'] .discount-section {
    background: var(--theme-surface-2);
    border: 1px solid var(--theme-border);
}

html[data-theme='dark'] .discount-section h4,
html[data-theme='dark'] .discount-section label {
    color: var(--theme-text);
}

html[data-theme='dark'] .discount-section input {
    background: var(--theme-surface);
    color: var(--theme-text);
    border-color: var(--theme-border);
}

html[data-theme='dark'] .parcelas-section,
html[data-theme='dark'] .parcela-preview,
html[data-theme='dark'] .parc-summary-card,
html[data-theme='dark'] .parc-servico-preview,
html[data-theme='dark'] #notif-permission-bar,
html[data-theme='dark'] #parcelarServicoInfo {
    background: var(--theme-surface-2);
    color: var(--theme-text);
    border-color: var(--theme-border);
}

html[data-theme='dark'] .parcelas-table th {
    background: var(--theme-surface-3);
    color: var(--theme-text);
}

html[data-theme='dark'] .parcelas-table td {
    color: var(--theme-text);
    border-bottom-color: var(--theme-border);
}

html[data-theme='dark'] .parcelas-table tr:hover td,
html[data-theme='dark'] .parcelas-table .pago-sim td {
    background: var(--theme-surface-3);
}

html[data-theme='dark'] .parcela-badge-pago,
html[data-theme='dark'] .parcela-badge-pendente,
html[data-theme='dark'] .parcela-badge-vencida,
html[data-theme='dark'] .parcela-badge-entrada {
    border: 1px solid var(--theme-border);
}

html[data-theme='dark'] .parcela-badge-pago {
    background: rgba(76, 175, 80, .18);
    color: #8fe4a1;
}

html[data-theme='dark'] .parcela-badge-pendente {
    background: rgba(255, 193, 7, .16);
    color: #ffd978;
}

html[data-theme='dark'] .parcela-badge-vencida {
    background: rgba(244, 67, 54, .18);
    color: #ff9a92;
}

html[data-theme='dark'] .parcela-badge-entrada {
    background: rgba(33, 150, 243, .18);
    color: #9ccdfc;
}

html[data-theme='dark'] .parc-group-title,
html[data-theme='dark'] .parc-inline-info,
html[data-theme='dark'] #notif-status-text {
    color: var(--theme-text);
}

html[data-theme='dark'] .parc-summary-card .ps-val {
    color: var(--theme-accent);
}

html[data-theme='dark'] .parc-summary-card .ps-label {
    color: var(--theme-muted);
}

html[data-theme='dark'] #notif-permission-bar,
html[data-theme='dark'] #notif-permission-bar * {
    color: var(--theme-text);
}

html[data-theme='dark'] .parc-filter-bar select,
html[data-theme='dark'] .parc-filter-bar input,
html[data-theme='dark'] #parcelarServicoModal select,
html[data-theme='dark'] #parcelarServicoModal input {
    background: var(--theme-surface);
    color: var(--theme-text);
    border-color: var(--theme-border);
}

html[data-theme='dark'] .btn-ativar-notif,
html[data-theme='dark'] .btn-testar-notif,
html[data-theme='dark'] .btn-fechar-bar,
html[data-theme='dark'] .btn-pagar-parcela,
html[data-theme='dark'] .btn-estornar-parcela,
html[data-theme='dark'] .btn-parcelar-servico {
    color: #effcff;
}

/* ── 3.16  Admin — overrides de estilos inline ── */
html[data-theme='dark'] #adminPanel [style*='background: white'],
html[data-theme='dark'] #adminPanel [style*='background:white'],
html[data-theme='dark'] #adminPanel [style*='background-color: white'],
html[data-theme='dark'] #adminPanel [style*='background-color:white'],
html[data-theme='dark'] #adminPanel [style*='background: #f8f9fa'],
html[data-theme='dark'] #adminPanel [style*='background:#f8f9fa'],
html[data-theme='dark'] #adminPanel [style*='background: #f0f0f0'],
html[data-theme='dark'] #adminPanel [style*='background:#f0f0f0'] {
    background: var(--theme-surface);
    border-color: var(--theme-border);
}

html[data-theme='dark'] #adminPanel [style*='color: #0B3D3D'],
html[data-theme='dark'] #adminPanel [style*='color:#0B3D3D'],
html[data-theme='dark'] #adminPanel [style*='color: #666'],
html[data-theme='dark'] #adminPanel [style*='color:#666'],
html[data-theme='dark'] #adminPanel [style*='color: #888'],
html[data-theme='dark'] #adminPanel [style*='color:#888'],
html[data-theme='dark'] #adminPanel [style*='color: #999'],
html[data-theme='dark'] #adminPanel [style*='color:#999'] {
    color: var(--theme-text);
}

html[data-theme='dark'] #adminPanel hr,
html[data-theme='dark'] #adminPanel [style*='border-top:1px solid #f0f0f0'],
html[data-theme='dark'] #adminPanel [style*='border-bottom: 2px solid #e0e0e0'],
html[data-theme='dark'] #adminPanel [style*='border-bottom:2px solid #e0e0e0'] {
    border-color: var(--theme-border);
}

html[data-theme='dark'] #adminPanel .tab-btn,
html[data-theme='dark'] #adminPanel .tab-btn.active {
    color: var(--theme-text);
    background: transparent;
    border-bottom-color: var(--theme-accent);
}

/* ── 3.17  Real-time cards (rt-*) ── */
html[data-theme='dark'] .rt-kpi {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
}

html[data-theme='dark'] .rt-kpi::before {
    background: var(--theme-accent-2);
}

html[data-theme='dark'] .rt-kpi-icon {
    background: var(--theme-surface-2);
    border: 1px solid var(--theme-border);
    color: var(--theme-accent-2);
}

html[data-theme='dark'] .rt-kpi-icon i,
html[data-theme='dark'] .rt-section-title i,
html[data-theme='dark'] .rt-card h4 i,
html[data-theme='dark'] .rt-online-device-icon {
    color: var(--theme-accent-2);
}

html[data-theme='dark'] .rt-kpi-icon > span {
    border-color: var(--theme-surface);
}

html[data-theme='dark'] .rt-card {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
}

html[data-theme='dark'] .rt-kpi-value,
html[data-theme='dark'] .rt-kpi-label,
html[data-theme='dark'] .rt-section-title,
html[data-theme='dark'] .rt-funnel-label,
html[data-theme='dark'] .rt-alert-time,
html[data-theme='dark'] .rt-last-update {
    color: var(--theme-text);
}

html[data-theme='dark'] .rt-fat-item .rt-fat-val,
html[data-theme='dark'] #rt-ticket-medio {
    color: #b9f5ee;
}

html[data-theme='dark'] .rt-list .rt-val,
html[data-theme='dark'] .rt-list .rt-rank {
    color: #b9f5ee;
}

html[data-theme='dark'] .rt-list .rt-rank {
    background: rgba(95, 201, 190, .18);
    border: 1px solid var(--theme-border);
}

html[data-theme='dark'] .rt-funnel-bar-fill {
    color: #ecfffd;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .45);
}

html[data-theme='dark'] .rt-fat-item .rt-fat-label {
    color: var(--theme-muted);
}

html[data-theme='dark'] .rt-alert {
    background: var(--theme-surface-2);
}

html[data-theme='dark'] .rt-online-row {
    border-bottom-color: var(--theme-border);
}

html[data-theme='dark'] .rt-online-name {
    color: var(--theme-text);
}

html[data-theme='dark'] .rt-online-page,
html[data-theme='dark'] .rt-online-meta,
html[data-theme='dark'] .rt-online-duration,
html[data-theme='dark'] .rt-online-device-text {
    color: var(--theme-muted);
}

html[data-theme='dark'] .rt-online-dot {
    box-shadow: 0 0 0 3px rgba(76, 175, 80, .28);
}

html[data-theme='dark'] .rt-kpi-badge.up {
    background: rgba(67, 160, 71, .22);
    color: #9ef0b1;
}

html[data-theme='dark'] .rt-kpi-badge.down {
    background: rgba(229, 57, 53, .22);
    color: #ff9d9d;
}

html[data-theme='dark'] .rt-kpi-badge.neutral {
    background: rgba(64, 153, 143, .24);
    color: #a4e7df;
}

html[data-theme='dark'] .rt-badge.pendente {
    background: rgba(255, 167, 38, .2);
    color: #ffd399;
}

html[data-theme='dark'] .rt-badge.andamento {
    background: rgba(66, 165, 245, .2);
    color: #abd8ff;
}

html[data-theme='dark'] .rt-badge.concluido {
    background: rgba(102, 187, 106, .2);
    color: #b8f1bc;
}

html[data-theme='dark'] .rt-badge.cancelado {
    background: rgba(239, 83, 80, .2);
    color: #ffb3b1;
}

html[data-theme='dark'] .rt-funnel-bar-bg,
html[data-theme='dark'] .rt-bar-bg {
    background: var(--theme-surface-2);
}

html[data-theme='dark'] .rt-empty {
    color: var(--theme-muted);
}

/* ── 3.18  Alertas / Status ── */
html[data-theme='dark'] .alert,
html[data-theme='dark'] .alert-info,
html[data-theme='dark'] .alert-warning,
html[data-theme='dark'] .alert-success {
    background: var(--theme-surface-2);
    border-left-color: var(--theme-accent);
    color: var(--theme-text);
}

html[data-theme='dark'] .status-pendente,
html[data-theme='dark'] .status-andamento,
html[data-theme='dark'] .status-concluido,
html[data-theme='dark'] .status-cancelado {
    background: var(--theme-surface-2);
}

/* ── 3.19  Login ── */
html[data-theme='dark'] .login-container {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow);
}

/* ── 3.20  Announcement banner ── */
html[data-theme='dark'] .announcement-content {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .announcement-header h3,
html[data-theme='dark'] .announcement-text {
    color: var(--theme-text);
}

/* ── 3.21  Form-page-header ── */
html[data-theme='dark'] .form-page-header {
    background: var(--theme-surface);
    border-bottom: 1px solid var(--theme-border);
}

html[data-theme='dark'] .form-page-header p {
    color: var(--theme-muted);
}

/* ── 3.22  Hierarquia tipográfica ── */
html[data-theme='dark'] h1,
html[data-theme='dark'] h2,
html[data-theme='dark'] h3,
html[data-theme='dark'] h4,
html[data-theme='dark'] h5,
html[data-theme='dark'] h6 {
    color: var(--theme-text);
}

html[data-theme='dark'] p,
html[data-theme='dark'] span,
html[data-theme='dark'] li,
html[data-theme='dark'] label {
    color: var(--theme-text);
}

/* Zonas com fundo escuro próprio — mantêm herança de cor */
html[data-theme='dark'] .header *,
html[data-theme='dark'] .hero *,
html[data-theme='dark'] .services-summary *,
html[data-theme='dark'] .footer * {
    color: inherit;
}

html[data-theme='dark'] .wati-badge,
html[data-theme='dark'] .services-subtitle {
    color: var(--theme-muted);
}

/* ── 3.23  Títulos de seção ── */
html[data-theme='dark'] .section-title {
    color: var(--theme-text);
}

html[data-theme='dark'] .section-title i {
    color: var(--theme-accent);
}

html[data-theme='dark'] .section-title::after {
    background: var(--gradient-accent);
}

html[data-theme='dark'] .scheduling h2,
html[data-theme='dark'] .faq h2,
html[data-theme='dark'] .social-proof h2 {
    background: var(--gradient-accent);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

html[data-theme='dark'] .services h2 {
    color: var(--theme-text);
}

html[data-theme='dark'] .services h2::after {
    background: var(--gradient-accent);
}

/* ═══════════════════════════════════════════════════════
   4. TEMA DINAMICO GLOBAL
   ═══════════════════════════════════════════════════════ */

:root {
    --pcft-meta-color: #0B3D3D;
    --pcft-page-background: radial-gradient(circle at top left, rgba(64, 153, 143, .14) 0%, #f4f7fb 46%, #ecf3fb 100%);
    --pcft-header-background: linear-gradient(135deg, #0B3D3D 0%, #1A5C5C 100%);
    --pcft-footer-background: linear-gradient(135deg, #e8f5f5 0%, #ddeeed 100%);
    --pcft-section-background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    --pcft-section-alt-background: linear-gradient(180deg, #f4f7fb 0%, #eef3f8 100%);
    --pcft-card-background: rgba(255, 255, 255, .92);
    --pcft-card-border: rgba(64, 153, 143, .12);
    --pcft-hero-overlay: linear-gradient(135deg, rgba(11, 61, 61, .52) 0%, rgba(26, 92, 92, .34) 100%);
    --pcft-hero-frame: rgba(255, 255, 255, .22);
    --pcft-button-background: linear-gradient(135deg, #40998F 0%, #2D7A7A 100%);
    --pcft-button-text: #ffffff;
    --pcft-button-shadow: 0 14px 36px rgba(64, 153, 143, .22);
    --pcft-decoration-top: none;
    --pcft-decoration-bottom: none;
    --pcft-badge-background: rgba(64, 153, 143, .12);
    --pcft-badge-text: #2D7A7A;
    --pcft-indicator: rgba(64, 153, 143, .22);
    --pcft-indicator-active: #40998F;
    --pcft-chip-background: rgba(255, 255, 255, .72);
    --pcft-chip-text: #12263a;
    --pcft-font-heading: 'Sora', 'Segoe UI', system-ui, sans-serif;
    --pcft-font-body: 'Manrope', 'Segoe UI', system-ui, sans-serif;
    --pcft-font-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Consolas, monospace;
    --pcft-text-color: #12263a;
    --pcft-muted-color: #5f6c7b;
    --pcft-heading-color: #12263a;
    --pcft-preview-cover: linear-gradient(135deg, #0B3D3D 0%, #1A5C5C 100%);
    /* Cor do texto no header e footer — calculada em JS por luminosidade */
    --pcft-header-text: rgba(255, 255, 255, 0.95);
    --pcft-footer-text: #12263a;
    --pcft-footer-icon: #2D7A7A;
}

html {
    background: var(--pcft-page-background);
}

body {
    position: relative;
    overflow-x: hidden;
    background: var(--pcft-page-background) !important;
    color: var(--pcft-text-color) !important;
    font-family: var(--pcft-font-body);
    isolation: isolate;
}

body::before,
body::after {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

body::before {
    background: var(--pcft-decoration-top);
    opacity: .9;
}

body::after {
    background: var(--pcft-decoration-bottom);
    opacity: .88;
}

header,
main,
section,
footer,
.hero,
.whatsapp-widget,
.admin-panel,
.login-container,
.success-message {
    position: relative;
    z-index: 1;
}

h1,
h2,
h3,
h4,
h5,
h6,
.section-title,
.brand-name {
    font-family: var(--pcft-font-heading);
    color: var(--pcft-heading-color);
}

p,
span,
li,
small,
label,
.section-subtitle,
.services-subtitle,
.footer-description,
.slogan {
    color: var(--pcft-text-color);
}

.header {
    background: var(--pcft-header-background) !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

.header *,
.footer *,
.form-header * {
    color: inherit;
}

/* O banner do formulário de formatação tem gradiente teal escuro próprio. Sem
   isto, a regra global de cor de títulos pintava o h2 e o subtítulo com a cor
   de superfície clara, deixando os dois em ~1,2:1 de contraste. */
.form-header {
    color: rgba(255, 255, 255, 0.95);
}

/* Header: cor calculada por JS para contrastar com qualquer fundo */
.header .brand-name,
.header .tagline,
.nav-links a,
.menu-toggle,
.menu-toggle i {
    color: var(--pcft-header-text) !important;
}

/* Footer: cor calculada por JS para contrastar com qualquer fundo */
.footer,
.footer h3,
.footer h4,
.footer p,
.footer a,
.footer span,
.footer li,
.footer small {
    color: var(--pcft-footer-text) !important;
}

/* Hero: texto sempre claro pois hero tem overlay escuro */
.hero-content h1,
.hero-content p {
    color: rgba(233, 244, 255, 0.96) !important;
}

.hero-overlay {
    background: var(--pcft-hero-overlay) !important;
}

.hero-slider,
.hero-slide,
.hero-slide img {
    border-radius: 22px;
}

.hero-slider {
    top: -2px;
    height: calc(100% + 2px);
    border: none !important;
    box-shadow: var(--theme-shadow-lg);
    overflow: hidden;
}

.indicator {
    background: var(--pcft-indicator) !important;
}

.indicator.active {
    background: var(--pcft-indicator-active) !important;
}

.services,
.faq,
.scheduling,
.social-proof,
.about,
.contact {
    background: var(--pcft-section-background) !important;
}

.testimonials,
.services-summary {
    background: var(--pcft-section-alt-background) !important;
}

.footer {
    background: var(--pcft-footer-background) !important;
    border-top: 1px solid var(--theme-border) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

/* Elementos do footer com cores hardcoded em styles2.css → adaptam ao tema */
.footer .footer-description,
.footer .contact-info p,
.footer .contact-info small,
.footer .footer-links ul li a,
.footer .footer-info-bottom p {
    color: var(--pcft-footer-text) !important;
    opacity: 0.88;
}

.footer .contact-item,
.footer .payment-item {
    background: rgba(127, 127, 127, 0.08) !important;
    border-color: rgba(127, 127, 127, 0.18) !important;
}

.footer .payment-item {
    color: var(--pcft-footer-text) !important;
}

.service-card,
.feature-card,
.testimonial-card,
.testimonial-bubble,
.faq-item,
.schedule-form,
.quick-booking,
.stat-item,
.info-card,
.service-item,
.announcement-content,
.login-container,
.admin-header,
.admin-tabs,
.stat-card,
.chart-container,
.rt-kpi,
.rt-card,
.clients-container,
.slide-card,
.modal-content,
.whatsapp-chat,
.whatsapp-body,
.whatsapp-footer,
.whatsapp-message,
.search-box input,
.search-box textarea,
.search-box select {
    background: var(--pcft-card-background) !important;
    border-color: var(--pcft-card-border) !important;
    color: var(--pcft-text-color) !important;
    box-shadow: var(--theme-shadow) !important;
}

.modal-content {
    background: #ffffff !important;
}

.service-card:hover,
.feature-card:hover,
.slide-card:hover,
.faq-item:hover,
.stat-item:hover,
.info-card:hover,
.rt-card:hover,
.theme-card:hover {
    border-color: var(--theme-accent) !important;
    box-shadow: var(--theme-shadow-lg) !important;
}

.form-group input,
.form-group select,
.form-group textarea,
.input-group input,
.input-group select,
.input-group textarea,
.search-box input,
.parcelas-table,
.parc-filter-bar input,
.parc-filter-bar select,
.clients-table,
.services-checkbox-group,
.service-checkbox {
    background: var(--theme-surface) !important;
    color: var(--pcft-text-color) !important;
    border-color: var(--theme-border) !important;
}

.clients-table th,
.parcelas-table th,
.slides-grid .slide-info,
.slide-order span {
    background: var(--theme-surface-2) !important;
    color: var(--pcft-text-color) !important;
}

.clients-table td,
.parcelas-table td,
.slide-info p,
.slide-info span,
.services-summary p,
.faq-answer,
.rt-online-page,
.rt-online-meta,
.rt-online-duration {
    color: var(--pcft-text-color) !important;
}

.clients-table tr:hover,
.parcelas-table tr:hover td,
.rt-list li:hover,
.rt-online-row:hover {
    background: var(--theme-surface-2) !important;
}

.section-title i,
.stat-number,
.service-card i,
.feature-card i,
.faq-question i,
.info-card i {
    color: var(--theme-accent) !important;
}

/* Ícones no footer usam a cor calculada para contrastar com o fundo */
.footer h3 i,
.footer h4 i,
.footer .payment-item i,
.footer .contact-item i {
    color: var(--pcft-footer-icon) !important;
}

.section-title::after,
.services h2::after {
    background: var(--pcft-button-background) !important;
}

.btn-login,
.btn-save,
.booking-btn,
.service-details-btn,
.whatsapp-button,
.btn-back-to-site,
.btn-update,
.btn-pagar-parcela,
.btn-estornar-parcela,
.btn-parcelar-servico,
.btn-ativar-notif,
.btn-testar-notif {
    background: var(--pcft-button-background) !important;
    color: var(--pcft-button-text) !important;
    box-shadow: var(--pcft-button-shadow) !important;
    border: none !important;
}

.btn-login:hover,
.btn-save:hover,
.booking-btn:hover,
.service-details-btn:hover,
.whatsapp-button:hover,
.btn-back-to-site:hover,
.btn-update:hover,
.btn-pagar-parcela:hover,
.btn-estornar-parcela:hover,
.btn-parcelar-servico:hover,
.btn-ativar-notif:hover,
.btn-testar-notif:hover {
    filter: brightness(1.04) saturate(1.05);
}

body.pcft-effect-button-glow .btn-login,
body.pcft-effect-button-glow .btn-save,
body.pcft-effect-button-glow .booking-btn,
body.pcft-effect-button-glow .whatsapp-button,
body.pcft-effect-button-glow .btn-back-to-site,
body.pcft-effect-button-glow .btn-update {
    position: relative;
    overflow: hidden;
}

body.pcft-effect-button-glow .btn-login::after,
body.pcft-effect-button-glow .btn-save::after,
body.pcft-effect-button-glow .booking-btn::after,
body.pcft-effect-button-glow .whatsapp-button::after,
body.pcft-effect-button-glow .btn-back-to-site::after,
body.pcft-effect-button-glow .btn-update::after {
    content: '';
    position: absolute;
    inset: -120% auto auto -25%;
    width: 42%;
    height: 300%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .42), transparent);
    transform: rotate(24deg);
    animation: pcftButtonGlow 5.6s linear infinite;
}

body.pcft-effect-snow::after {
    background-image:
        var(--pcft-decoration-bottom),
        radial-gradient(circle, rgba(255, 255, 255, .78) 0 1.8px, transparent 2px),
        radial-gradient(circle, rgba(255, 255, 255, .56) 0 2.4px, transparent 2.6px),
        radial-gradient(circle, rgba(255, 255, 255, .42) 0 1.6px, transparent 1.8px);
    background-size: auto, 180px 180px, 240px 240px, 320px 320px;
    animation: pcftSnow 16s linear infinite;
    opacity: .62;
}

body.pcft-effect-lights::before {
    background-image:
        var(--pcft-decoration-top),
        radial-gradient(circle at 12% 10%, rgba(255, 214, 10, .48) 0 6px, transparent 7px),
        radial-gradient(circle at 28% 13%, rgba(248, 113, 113, .42) 0 6px, transparent 7px),
        radial-gradient(circle at 44% 11%, rgba(34, 197, 94, .42) 0 6px, transparent 7px),
        radial-gradient(circle at 60% 14%, rgba(255, 214, 10, .42) 0 6px, transparent 7px),
        radial-gradient(circle at 76% 10%, rgba(59, 130, 246, .42) 0 6px, transparent 7px);
    animation: pcftSparkle 4.5s ease-in-out infinite;
}

body.pcft-effect-fireworks::after {
    background-image:
        var(--pcft-decoration-bottom),
        radial-gradient(circle at 18% 16%, rgba(255, 255, 255, .22) 0 2px, transparent 3px),
        radial-gradient(circle at 82% 18%, rgba(243, 217, 141, .32) 0 2px, transparent 3px),
        radial-gradient(circle at 72% 10%, rgba(255, 255, 255, .2) 0 2px, transparent 3px);
    animation: pcftFireworks 7s ease-in-out infinite;
}

body.pcft-effect-soft-bloom::before {
    filter: blur(0px);
    opacity: .82;
}

body.pcft-effect-grid-lines::before,
body.pcft-effect-circuit::before {
    background-image:
        var(--pcft-decoration-top),
        linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px),
        linear-gradient(180deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
    background-size: auto, 52px 52px, 52px 52px;
    opacity: .42;
}

body.pcft-effect-rgb-wave::after {
    background-image:
        var(--pcft-decoration-bottom),
        linear-gradient(120deg, rgba(0, 229, 255, .18), transparent 36%),
        linear-gradient(300deg, rgba(255, 43, 214, .18), transparent 42%);
    filter: blur(12px);
    animation: pcftRgbWave 8s ease-in-out infinite;
}

body.pcft-effect-sparkle::before {
    animation: pcftSparkle 5.2s ease-in-out infinite;
}

.theme-manager-shell {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(320px, 1fr);
    gap: 24px;
}

.theme-toolbar,
.theme-preview-panel {
    background: var(--pcft-card-background);
    border: 1px solid var(--pcft-card-border);
    border-radius: 20px;
    box-shadow: var(--theme-shadow);
    padding: 22px;
}

.theme-toolbar {
    margin-bottom: 20px;
}

.theme-toolbar h3,
.theme-preview-panel h3 {
    margin-bottom: 10px;
}

.theme-toolbar p,
.theme-preview-panel p,
.theme-card__meta,
.theme-card__description,
.theme-current-status small {
    color: var(--pcft-muted-color) !important;
}

.theme-toolbar__row {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.theme-toggle-option {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
    border-radius: 999px;
    padding: 12px 16px;
    font-weight: 600;
}

.theme-toggle-option input {
    accent-color: var(--theme-accent);
}

.theme-fallback-select {
    min-width: 240px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid var(--theme-border);
    background: var(--theme-surface);
    color: var(--pcft-text-color);
}

.theme-catalog-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 18px;
}

.theme-card {
    background: var(--pcft-card-background);
    border: 1px solid var(--pcft-card-border);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--theme-shadow);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.theme-card.is-active {
    border-color: var(--theme-accent);
    box-shadow: var(--theme-shadow-lg);
}

.theme-card.is-previewing {
    outline: 2px solid var(--theme-accent);
    outline-offset: 2px;
}

.theme-card__cover {
    min-height: 128px;
    padding: 16px;
    display: flex;
    align-items: flex-end;
    background: var(--pcft-preview-cover);
    color: #ffffff;
}

.theme-card__cover-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .18);
    backdrop-filter: blur(10px);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.theme-card__body {
    padding: 18px;
}

.theme-card__title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.theme-card__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--pcft-badge-background);
    color: var(--pcft-badge-text);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.theme-card__palette {
    display: flex;
    gap: 8px;
    margin: 14px 0 16px;
}

.theme-card__swatch {
    width: 100%;
    height: 12px;
    border-radius: 999px;
}

.theme-card__actions {
    display: flex;
    gap: 10px;
}

.theme-card__actions button {
    flex: 1;
    min-height: 44px;
    border-radius: 14px;
    font-weight: 700;
}

.theme-card__ghost {
    background: transparent;
    color: var(--pcft-text-color);
    border: 1px solid var(--theme-border);
}

.theme-preview-banner {
    position: relative;
    overflow: hidden;
    border-radius: 24px;
    border: 1px solid var(--pcft-hero-frame);
    background: var(--pcft-preview-cover);
    box-shadow: var(--theme-shadow-lg);
}

.theme-preview-banner img {
    display: block;
    width: 100%;
    height: auto;
}

.theme-preview-banner__chip {
    position: absolute;
    top: 16px;
    left: 16px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-radius: 999px;
    background: var(--pcft-chip-background);
    color: var(--pcft-chip-text);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.theme-preview-banner__caption {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 18px;
    padding: 16px 18px;
    border-radius: 18px;
    background: rgba(6, 10, 20, .46);
    color: #f8fafc;
    backdrop-filter: blur(12px);
}

.theme-preview-banner__caption h4,
.theme-preview-banner__caption p {
    color: inherit !important;
    margin: 0;
}

.theme-preview-banner__caption p {
    margin-top: 6px;
    font-size: 14px;
}

.theme-preview-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 18px;
}

.theme-preview-metric {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
    border-radius: 16px;
    padding: 14px;
}

.theme-preview-metric strong {
    display: block;
    margin-bottom: 6px;
}

.theme-current-status {
    margin-top: 18px;
    padding: 16px 18px;
    border-radius: 16px;
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
}

.theme-preview-actions {
    display: flex;
    gap: 12px;
    margin-top: 18px;
}

.theme-preview-actions button {
    flex: 1;
    min-height: 46px;
    border-radius: 14px;
    font-weight: 700;
}

.theme-preview-actions .theme-secondary {
    background: transparent;
    color: var(--pcft-text-color);
    border: 1px solid var(--theme-border);
}

@keyframes pcftButtonGlow {
    0% {
        transform: translateX(-120%) rotate(24deg);
    }
    100% {
        transform: translateX(360%) rotate(24deg);
    }
}

@keyframes pcftSnow {
    0% {
        background-position: 0 0, 0 0, 0 0, 0 0;
    }
    100% {
        background-position: 0 0, 0 180px, 0 240px, 0 320px;
    }
}

@keyframes pcftSparkle {
    0%,
    100% {
        opacity: .68;
    }
    50% {
        opacity: 1;
    }
}

@keyframes pcftFireworks {
    0%,
    100% {
        opacity: .46;
        transform: scale(1);
    }
    50% {
        opacity: .9;
        transform: scale(1.04);
    }
}

@keyframes pcftRgbWave {
    0%,
    100% {
        opacity: .34;
        transform: translate3d(0, 0, 0);
    }
    50% {
        opacity: .54;
        transform: translate3d(0, 10px, 0);
    }
}

@media (max-width: 1080px) {
    .theme-manager-shell {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .theme-toolbar__row,
    .theme-card__actions,
    .theme-preview-actions {
        flex-direction: column;
    }

    .theme-preview-metrics {
        grid-template-columns: 1fr;
    }

    .theme-catalog-grid {
        grid-template-columns: 1fr;
    }
}

/* ── 3.24  Botões de ação ── */
html[data-theme='dark'] .btn-login,
html[data-theme='dark'] .btn-save,
html[data-theme='dark'] .btn-back-to-site,
html[data-theme='dark'] .btn-update,
html[data-theme='dark'] .submit-schedule-btn,
html[data-theme='dark'] .summary-btn,
html[data-theme='dark'] .whatsapp-button {
    background: var(--gradient-accent);
}

/* ── 3.25  Links sociais (seção contato) ── */
html[data-theme='dark'] .social-link {
    background: var(--theme-surface);
    border-color: var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .social-link:hover {
    background: var(--theme-surface-2);
    border-color: var(--theme-accent);
}

html[data-theme='dark'] .social-link strong {
    color: var(--theme-text);
}

html[data-theme='dark'] .social-link small {
    color: var(--theme-muted);
}

/* ── 3.26  Localização ── */
html[data-theme='dark'] .location-info {
    background: var(--theme-surface);
    border-color: var(--theme-border);
    color: var(--theme-text);
}

html[data-theme='dark'] .location-info * {
    color: var(--theme-text);
}

/* ── 3.27  Formulário de cliente (client-form-container) ── */
html[data-theme='dark'] .client-form-container {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow);
}

/* ── 3.28  Slide de estatísticas ── */
html[data-theme='dark'] .stat-slide {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .stat-slide h3,
html[data-theme='dark'] .stat-slide p {
    color: var(--theme-text);
}

/* ── 3.29  Service checkbox hover ── */
html[data-theme='dark'] .service-checkbox:hover {
    background: var(--theme-surface-3);
    border-color: var(--theme-accent);
}

/* ── 3.30  Salvaguardas globais anti-branco ── */
html[data-theme='dark'] .whatsapp-message::before {
    border-color: transparent var(--theme-surface-2) transparent transparent;
}

html[data-theme='dark'] .testimonial-card::before {
    border-color: transparent var(--theme-surface) transparent transparent;
}

html[data-theme='dark'] .whatsapp-avatar,
html[data-theme='dark'] .cta-btn:not(.secondary),
html[data-theme='dark'] .back-to-home,
html[data-theme='dark'] .example-content,
html[data-theme='dark'] .check-item,
html[data-theme='dark'] .steps,
html[data-theme='dark'] .result,
html[data-theme='dark'] .container,
html[data-theme='dark'] .card,
html[data-theme='dark'] .comparison-card,
html[data-theme='dark'] .feature,
html[data-theme='dark'] .feature-card {
    background: var(--theme-surface);
    border-color: var(--theme-border);
    color: var(--theme-text);
}

html[data-theme='dark'] [style*='background: white' i],
html[data-theme='dark'] [style*='background:white' i],
html[data-theme='dark'] [style*='background: #fff' i],
html[data-theme='dark'] [style*='background:#fff' i],
html[data-theme='dark'] [style*='background-color: white' i],
html[data-theme='dark'] [style*='background-color:white' i],
html[data-theme='dark'] [style*='background-color: #fff' i],
html[data-theme='dark'] [style*='background-color:#fff' i],
html[data-theme='dark'] [style*='background: #ffffff' i],
html[data-theme='dark'] [style*='background:#ffffff' i],
html[data-theme='dark'] [style*='background-color: #ffffff' i],
html[data-theme='dark'] [style*='background-color:#ffffff' i],
html[data-theme='dark'] [style*='background: #f8f9fa' i],
html[data-theme='dark'] [style*='background:#f8f9fa' i],
html[data-theme='dark'] [style*='background: #f5f5f5' i],
html[data-theme='dark'] [style*='background:#f5f5f5' i],
html[data-theme='dark'] [style*='background: #f8fffc' i],
html[data-theme='dark'] [style*='background:#f8fffc' i],
html[data-theme='dark'] [style*='background: #f0f0f0' i],
html[data-theme='dark'] [style*='background:#f0f0f0' i],
html[data-theme='dark'] [style*='background: #fff3cd' i],
html[data-theme='dark'] [style*='background:#fff3cd' i],
html[data-theme='dark'] [style*='background: #fff5f5' i],
html[data-theme='dark'] [style*='background:#fff5f5' i],
html[data-theme='dark'] [style*='background: #ffe8e8' i],
html[data-theme='dark'] [style*='background:#ffe8e8' i],
html[data-theme='dark'] [style*='background: #fff9db' i],
html[data-theme='dark'] [style*='background:#fff9db' i],
html[data-theme='dark'] [style*='background: #fff3bf' i],
html[data-theme='dark'] [style*='background:#fff3bf' i] {
    background: var(--theme-surface);
    border-color: var(--theme-border);
}

html[data-theme='dark'] [style*='#fff5f5' i],
html[data-theme='dark'] [style*='#ffe8e8' i],
html[data-theme='dark'] [style*='#fff9db' i],
html[data-theme='dark'] [style*='#fff3bf' i],
html[data-theme='dark'] [style*='#fff3cd' i],
html[data-theme='dark'] [style*='#fce4ec' i],
html[data-theme='dark'] [style*='#e3f2fd' i],
html[data-theme='dark'] [style*='#f1fff6' i],
html[data-theme='dark'] [style*='#f0fff8' i],
html[data-theme='dark'] [style*='#e8f5f3' i],
html[data-theme='dark'] [style*='#e8f5e9' i],
html[data-theme='dark'] [style*='#b2dfdb' i],
html[data-theme='dark'] [style*='linear-gradient(135deg, #fff5f5' i],
html[data-theme='dark'] [style*='linear-gradient(135deg, #fff9db' i] {
    background: var(--theme-surface-2) !important;
    border-color: var(--theme-border) !important;
}

html[data-theme='dark'] [style*='color: #0B3D3D' i],
html[data-theme='dark'] [style*='color:#0B3D3D' i],
html[data-theme='dark'] [style*='color: #666' i],
html[data-theme='dark'] [style*='color:#666' i],
html[data-theme='dark'] [style*='color: #444' i],
html[data-theme='dark'] [style*='color:#444' i],
html[data-theme='dark'] [style*='color: #555' i],
html[data-theme='dark'] [style*='color:#555' i],
html[data-theme='dark'] [style*='color: #333' i],
html[data-theme='dark'] [style*='color:#333' i],
html[data-theme='dark'] [style*='color: #777' i],
html[data-theme='dark'] [style*='color:#777' i],
html[data-theme='dark'] [style*='color: #888' i],
html[data-theme='dark'] [style*='color:#888' i],
html[data-theme='dark'] [style*='color: #212529' i],
html[data-theme='dark'] [style*='color:#212529' i] {
    color: var(--theme-text);
}

html[data-theme='dark'] .parc-inline-row {
    border-bottom-color: var(--theme-border);
}

/* ── 3.31  Admin — body background e painéis inline ── */
html[data-theme='dark'] body {
    background: radial-gradient(ellipse at 20% 0%, #13243a 0%, #090f1b 55%, #060c14 100%);
}

html[data-theme='dark'] .admin-header h1,
html[data-theme='dark'] .admin-header h1 * {
    color: var(--theme-text);
}

html[data-theme='dark'] .input-group label,
html[data-theme='dark'] .form-group label {
    color: var(--theme-text);
}

html[data-theme='dark'] .service-card {
    background: var(--theme-surface);
    border: 1px solid var(--theme-border);
    box-shadow: var(--theme-shadow);
}

html[data-theme='dark'] .service-card h3 {
    color: var(--theme-text);
    border-bottom-color: var(--theme-accent);
}

html[data-theme='dark'] .input-group input,
html[data-theme='dark'] .input-group select,
html[data-theme='dark'] .input-group textarea {
    background: var(--theme-surface-2);
    color: var(--theme-text);
    border-color: var(--theme-border);
}

html[data-theme='dark'] #adminDarkToggle:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(95, 201, 190, 0.4);
}


/* ═══════════════════════════════════════════════════════
   4. BOTÃO DE ALTERNÂNCIA DE TEMA
   ═══════════════════════════════════════════════════════ */

#themeToggleBtn {
    position: fixed;
    left: 16px;
    bottom: 16px;
    z-index: 5000;
    width: 48px;
    height: 48px;
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    line-height: 1;
    color: #ffffff;
    background: linear-gradient(135deg, #2D7A7A, #40998F);
    box-shadow:
        0 4px 14px rgba(45, 122, 122, .45),
        0 2px 6px  rgba(0, 0, 0, .25);
    transition:
        transform  .22s cubic-bezier(.34, 1.56, .64, 1),
        box-shadow .22s ease,
        background .25s ease;
    outline: none;
    user-select: none;
}

#themeToggleBtn:hover {
    transform: translateY(-3px) scale(1.09);
    box-shadow:
        0 8px 22px rgba(45, 122, 122, .55),
        0 4px 10px rgba(0, 0, 0, .30);
}

#themeToggleBtn:active {
    transform: translateY(0) scale(.94);
    box-shadow:
        0 2px 8px rgba(45, 122, 122, .35),
        0 1px 4px rgba(0, 0, 0, .20);
}

#themeToggleBtn:focus-visible {
    outline: 3px solid rgba(95, 201, 190, .7);
    outline-offset: 3px;
}

html[data-theme='dark'] #themeToggleBtn {
    background: linear-gradient(135deg, #1f3d52, #263f58);
    box-shadow:
        0 4px 14px rgba(0, 0, 0, .50),
        0 0 0 1px var(--theme-border),
        inset 0 1px 0 rgba(255, 255, 255, .07);
}

html[data-theme='dark'] #themeToggleBtn:hover {
    background: linear-gradient(135deg, #26485e, #2d4d6e);
    box-shadow:
        0 8px 24px rgba(0, 0, 0, .60),
        0 0 0 1px var(--theme-accent),
        inset 0 1px 0 rgba(255, 255, 255, .10);
}


/* ═══════════════════════════════════════════════════════
   5. SCROLLBAR PERSONALIZADA (dark)
   ═══════════════════════════════════════════════════════ */

html[data-theme='dark'] ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

html[data-theme='dark'] ::-webkit-scrollbar-track {
    background: #07101c;
}

html[data-theme='dark'] ::-webkit-scrollbar-thumb {
    background: var(--theme-border);
    border-radius: 999px;
    border: 2px solid #07101c;
}

html[data-theme='dark'] ::-webkit-scrollbar-thumb:hover {
    background: var(--theme-accent-2);
}


/* ═══════════════════════════════════════════════════════
   6. RESPONSIVIDADE DO TOGGLE
   ═══════════════════════════════════════════════════════ */

@media (max-width: 768px) {
    #themeToggleBtn {
        width: 44px;
        height: 44px;
        font-size: 18px;
        left: 12px;
        bottom: 12px;
    }
}


/* ═══════════════════════════════════════════════════════
   7. OVERRIDE GLOBAL DE TEXTO — dark mode
   Garante que TODO texto seja claro, independente de
   seletores hard-coded nos outros arquivos CSS.
   ═══════════════════════════════════════════════════════ */

html[data-theme='dark'],
html[data-theme='dark'] body {
    color: #dce8f5;
}

html[data-theme='dark'] h1,
html[data-theme='dark'] h2,
html[data-theme='dark'] h3,
html[data-theme='dark'] h4,
html[data-theme='dark'] h5,
html[data-theme='dark'] h6 {
    color: #dce8f5;
}

html[data-theme='dark'] p,
html[data-theme='dark'] span:not(.badge):not(.tag):not(.status-):not([class*='badge']):not([class*='btn']),
html[data-theme='dark'] li,
html[data-theme='dark'] label,
html[data-theme='dark'] small,
html[data-theme='dark'] strong,
html[data-theme='dark'] em,
html[data-theme='dark'] td,
html[data-theme='dark'] th,
html[data-theme='dark'] dt,
html[data-theme='dark'] dd,
html[data-theme='dark'] caption,
html[data-theme='dark'] figcaption,
html[data-theme='dark'] blockquote,
html[data-theme='dark'] .section-title,
html[data-theme='dark'] .section-subtitle,
html[data-theme='dark'] .brand-name,
html[data-theme='dark'] .tagline,
html[data-theme='dark'] .nav-links a,
html[data-theme='dark'] .footer *,
html[data-theme='dark'] .service-card *,
html[data-theme='dark'] .feature-card *,
html[data-theme='dark'] .info-card *,
html[data-theme='dark'] .testimonial-card *,
html[data-theme='dark'] .faq-item *,
html[data-theme='dark'] .stat-card *,
html[data-theme='dark'] .rt-card *,
html[data-theme='dark'] .clients-container *,
html[data-theme='dark'] .client-form-container *,
html[data-theme='dark'] .admin-header h1,
html[data-theme='dark'] .input-group label,
html[data-theme='dark'] .form-group label,
html[data-theme='dark'] .login-container *:not(button):not(input),
html[data-theme='dark'] .schedule-form *:not(button):not(input):not(select):not(textarea),
html[data-theme='dark'] .parc-group-title,
html[data-theme='dark'] .parc-inline-info,
html[data-theme='dark'] .slide-info *,
html[data-theme='dark'] .announcement-content *:not(button),
html[data-theme='dark'] .contact-item *,
html[data-theme='dark'] .stat-item *,
html[data-theme='dark'] .about *,
html[data-theme='dark'] .services *:not(button):not(a),
html[data-theme='dark'] .testimonials *,
html[data-theme='dark'] .faq *,
html[data-theme='dark'] .contact *:not(button):not(a) {
    color: #dce8f5;
}

/* Textos secundários / muteds permanecem mais suaves */
html[data-theme='dark'] .text-muted,
html[data-theme='dark'] .tagline,
html[data-theme='dark'] small,
html[data-theme='dark'] .section-subtitle,
html[data-theme='dark'] .footer-description,
html[data-theme='dark'] .services-subtitle {
    color: #8fadc8;
}

/* Links */
html[data-theme='dark'] a:not(.btn):not([class*='btn']):not(.booking-btn):not(.hero-cta-primary):not(.hero-cta-secondary):not(.diagnostic-whatsapp):not(.about-personal-cta):not(.urgency-cta) {
    color: #5fc9be;
}

html[data-theme='dark'] a:not(.btn):not([class*='btn']):not(.hero-cta-primary):not(.hero-cta-secondary):not(.diagnostic-whatsapp):not(.about-personal-cta):not(.urgency-cta):hover {
    color: #87d9d3;
}
/* CTAs em <a> que funcionam como botao devem preservar contraste, nao herdar cor global de link */
html[data-theme='dark'] .diagnostic-whatsapp,
html[data-theme='dark'] .about-personal-cta,
html[data-theme='dark'] .urgency-band a,
html[data-theme='dark'] .hero-cta-primary,
html[data-theme='dark'] .hero-cta-secondary {
    color: var(--pcft-button-text);
}

html[data-theme='dark'] .diagnostic-whatsapp:hover,
html[data-theme='dark'] .about-personal-cta:hover,
html[data-theme='dark'] .urgency-band a:hover,
html[data-theme='dark'] .hero-cta-primary:hover,
html[data-theme='dark'] .hero-cta-secondary:hover {
    color: var(--pcft-button-text);
}

/* Inputs e selects */
html[data-theme='dark'] input,
html[data-theme='dark'] select,
html[data-theme='dark'] textarea {
    color: #dce8f5;
    background: #172437;
    border-color: #263d58;
}

html[data-theme='dark'] input::placeholder,
html[data-theme='dark'] textarea::placeholder {
    color: #5d7896;
}


/* ═══════════════════════════════════════════════════════
   8. DASHBOARD/REALTIME NO TEMA CLARO
   Mantem a mesma base visual clara usada na aba Produtos.
   ═══════════════════════════════════════════════════════ */

html:not([data-theme='dark']) .rt-card,
html:not([data-theme='dark']) .rt-kpi,
html:not([data-theme='dark']) .chart-container,
html:not([data-theme='dark']) .stat-card {
    background: var(--brand-surface-white) !important;
    border: 1px solid var(--brand-border) !important;
    box-shadow: var(--brand-shadow-sm) !important;
}

html:not([data-theme='dark']) .rt-section-title,
html:not([data-theme='dark']) .rt-kpi-value,
html:not([data-theme='dark']) .rt-card h4,
html:not([data-theme='dark']) .rt-list .rt-val,
html:not([data-theme='dark']) .rt-fat-item .rt-fat-val,
html:not([data-theme='dark']) .chart-container h2,
html:not([data-theme='dark']) .stat-card h3 {
    color: var(--brand-text-heading) !important;
}

html:not([data-theme='dark']) .rt-kpi-label,
html:not([data-theme='dark']) .rt-funnel-label,
html:not([data-theme='dark']) .rt-list li,
html:not([data-theme='dark']) .rt-fat-item .rt-fat-label,
html:not([data-theme='dark']) .rt-empty,
html:not([data-theme='dark']) .rt-alert,
html:not([data-theme='dark']) .rt-alert-time,
html:not([data-theme='dark']) .rt-online-name,
html:not([data-theme='dark']) .rt-online-page,
html:not([data-theme='dark']) .rt-online-meta,
html:not([data-theme='dark']) .rt-online-duration,
html:not([data-theme='dark']) .stat-card p {
    color: var(--brand-text-muted) !important;
}

html:not([data-theme='dark']) .rt-list li,
html:not([data-theme='dark']) .rt-online-row,
html:not([data-theme='dark']) .rt-card [style*='border-top:1px solid'] {
    border-color: var(--brand-border) !important;
}

html:not([data-theme='dark']) .rt-funnel-bar-bg,
html:not([data-theme='dark']) .rt-bar-bg {
    background: #f0f4f8 !important;
}


/* ═══════════════════════════════════════════════════════
   9. LEGIBILIDADE DE CARDS E SOMA DE VALORES
   ═══════════════════════════════════════════════════════ */

/* Card de servico (modo claro) com contraste alto */
html:not([data-theme='dark']) .service-card h3 {
    color: #103043 !important;
}

html:not([data-theme='dark']) .service-card p {
    color: #2d4a5c !important;
}

/* Price tag deve permanecer clara e legivel */
.price-tag,
.price-tag span,
html[data-theme='dark'] .price-tag,
html[data-theme='dark'] .price-tag span,
html:not([data-theme='dark']) .price-tag,
html:not([data-theme='dark']) .price-tag span {
    color: #f5fbff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}

/* Barra de soma de valores sempre legivel */
.services-summary,
html:not([data-theme='dark']) .services-summary,
html[data-theme='dark'] .services-summary {
    background: linear-gradient(135deg, #103043 0%, #0b2536 100%) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.14) !important;
}

.services-summary,
.services-summary *,
.summary-info,
.summary-left,
.summary-right,
.summary-count,
.summary-total,
.summary-discount,
.summary-btn,
.summary-btn i {
    color: #f0f8ff !important;
}

.summary-total strong {
    color: #90e0d8 !important;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   DECORAÇÕES SAZONAIS ANIMADAS
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

#pcft-decorations {
    position: fixed;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: 1;
}

.pcft-deco-icon {
    position: absolute;
    display: block;
    line-height: 1;
    font-style: normal;
    user-select: none;
    -webkit-user-select: none;
    will-change: transform, opacity;
}

/* Ícone cai do topo ao fundo com leve rotação */
@keyframes pcft-fall {
    0%   { transform: translateY(0)      rotate(0deg)   scale(0.85); opacity: 0; }
    6%   {                                                             opacity: 1; }
    90%  {                                                             opacity: 0.85; }
    100% { transform: translateY(110vh)  rotate(300deg) scale(1.05); opacity: 0; }
}

/* Ícone sobe do fundo ao topo */
@keyframes pcft-float-up {
    0%   { transform: translateY(0)      scale(0.90); opacity: 0; }
    8%   {                                             opacity: 1; }
    90%  {                                             opacity: 0.75; }
    100% { transform: translateY(-110vh) scale(1.10); opacity: 0; }
}

/* Ícone balança suavemente de um lado para o outro */
@keyframes pcft-sway {
    0%   { transform: translateX(0)     rotate(-10deg); opacity: 0.50; }
    25%  { transform: translateX(18px)  rotate(  8deg); opacity: 0.90; }
    50%  { transform: translateX(0)     rotate( -6deg); opacity: 0.60; }
    75%  { transform: translateX(-18px) rotate(  9deg); opacity: 0.90; }
    100% { transform: translateX(0)     rotate(-10deg); opacity: 0.50; }
}

/* Ícone pisca como uma estrela */
@keyframes pcft-twinkle {
    0%, 100% { transform: scale(0.80); opacity: 0.20; }
    50%       { transform: scale(1.35); opacity: 1.00; }
}

/* Ícone pula no lugar */
@keyframes pcft-bounce {
    0%, 100% { transform: translateY(0)     scale(1.00); }
    35%       { transform: translateY(-20px) scale(1.12); }
    55%       { transform: translateY(-12px) scale(1.06); }
    70%       { transform: translateY(-18px) scale(1.09); }
}



/* ════════════════════════════════════════════════════════════════════════
   Formulário de formatação (formulario-formatacao.html) — tema escuro

   As classes desta página (.checkbox-label, .radio-label, .critical-section,
   .alert-warning*, .alert-info, .authorization-checkbox, .btn-reset) nunca
   tiveram versão escura: o fundo ficava claro enquanto as regras gerais
   deste arquivo pintavam o texto de claro por cima — texto quase invisível.
   ════════════════════════════════════════════════════════════════════════ */

html[data-theme='dark'] .checkbox-label,
html[data-theme='dark'] .radio-label {
    background-color: var(--theme-surface-2);
    border-color: var(--theme-border);
}

html[data-theme='dark'] .checkbox-label:hover,
html[data-theme='dark'] .radio-label:hover {
    background-color: var(--theme-surface-3, var(--theme-surface-2));
    border-color: var(--theme-accent);
}

html[data-theme='dark'] .checkbox-label:has(input:checked),
html[data-theme='dark'] .radio-label:has(input:checked) {
    border-color: var(--theme-accent);
    background-color: color-mix(in srgb, var(--theme-accent) 12%, var(--theme-surface-2));
}

html[data-theme='dark'] .critical-section {
    background-color: color-mix(in srgb, #ff6b6b 6%, var(--theme-surface));
    border-color: color-mix(in srgb, #ff6b6b 35%, transparent);
}

html[data-theme='dark'] .critical-section h3 {
    color: #ff8a80;
}

html[data-theme='dark'] .authorization-checkbox {
    background-color: color-mix(in srgb, #4caf50 12%, var(--theme-surface-2)) !important;
    border-color: #4caf50 !important;
}

html[data-theme='dark'] .authorization-checkbox small,
html[data-theme='dark'] .help-text {
    color: var(--theme-muted);
}

html[data-theme='dark'] .btn-reset {
    background-color: var(--theme-surface-2);
    color: var(--theme-text);
    border: 1px solid var(--theme-border);
}

html[data-theme='dark'] .btn-reset:hover {
    background-color: var(--theme-surface-3, var(--theme-surface-2));
}

/* Alerta "Campo Crítico" */
html[data-theme='dark'] .alert-warning {
    background: color-mix(in srgb, #ff6b6b 10%, var(--theme-surface-2));
    color: var(--theme-text);
}

html[data-theme='dark'] .alert-warning-title,
html[data-theme='dark'] .alert-warning-danger-text {
    color: #ff8a80 !important;
}

html[data-theme='dark'] .alert-warning-danger-box {
    background: var(--theme-surface);
    border-color: color-mix(in srgb, #ff8787 60%, transparent);
}

html[data-theme='dark'] .alert-warning-danger-box p {
    color: var(--theme-text);
}

html[data-theme='dark'] .alert-warning-tip-box {
    background: color-mix(in srgb, #ffd43b 10%, var(--theme-surface));
}

html[data-theme='dark'] .alert-warning-tip-title,
html[data-theme='dark'] .alert-warning-tip-text strong {
    color: #e599f7 !important;
}

html[data-theme='dark'] .alert-warning-tip-text {
    color: var(--theme-text);
}

html[data-theme='dark'] .alert-warning-note-box {
    background: color-mix(in srgb, #339af0 12%, var(--theme-surface));
}

html[data-theme='dark'] .alert-warning-note-box i,
html[data-theme='dark'] .alert-warning-note-text {
    color: #74c0fc;
}

html[data-theme='dark'] .alert-info {
    background: color-mix(in srgb, #17a2b8 12%, var(--theme-surface-2));
    color: var(--theme-text);
}