/*
 * Anexo Jurídico — ajustes exclusivos do tema escuro.
 * Não altera o tema claro (html.light-style / data-style="light").
 */

html.dark-style,
html[data-style="dark"] {
  --anexo-dark-surface: #2f3349;
  --anexo-dark-surface-alt: #373b54;
  --anexo-dark-surface-rose: rgba(111, 66, 193, 0.12);
  --anexo-dark-surface-rose-strong: rgba(111, 66, 193, 0.2);
  --anexo-dark-text: #e7e9fc;
  --anexo-dark-text-muted: #b4b8d6;
  --anexo-dark-heading: #f0f1ff;
  --anexo-dark-link: #c9b8ff;
}

/* —— Tipografia legível —— */
html.dark-style,
html.dark-style body,
html[data-style="dark"],
html[data-style="dark"] body {
  color: var(--anexo-dark-text);
}

html.dark-style .text-heading,
html.dark-style h1,
html.dark-style h2,
html.dark-style h3,
html.dark-style h4,
html.dark-style h5,
html.dark-style h6,
html.dark-style .h1,
html.dark-style .h2,
html.dark-style .h3,
html.dark-style .h4,
html.dark-style .h5,
html.dark-style .h6,
html[data-style="dark"] .text-heading,
html[data-style="dark"] h1,
html[data-style="dark"] h2,
html[data-style="dark"] h3,
html[data-style="dark"] h4,
html[data-style="dark"] h5,
html[data-style="dark"] h6 {
  color: var(--anexo-dark-heading) !important;
}

html.dark-style .text-body,
html.dark-style .text-body-secondary,
html.dark-style p,
html.dark-style li,
html.dark-style label,
html.dark-style .form-label,
html.dark-style .accordion-body,
html.dark-style .card-body,
html.dark-style .modal-body,
html.dark-style .hero-sub-title,
html.dark-style .features-icon-description,
html.dark-style .footer-text,
html[data-style="dark"] .text-body,
html[data-style="dark"] .text-body-secondary,
html[data-style="dark"] p,
html[data-style="dark"] li,
html[data-style="dark"] label,
html[data-style="dark"] .form-label,
html[data-style="dark"] .accordion-body,
html[data-style="dark"] .card-body,
html[data-style="dark"] .modal-body,
html[data-style="dark"] .hero-sub-title,
html[data-style="dark"] .features-icon-description,
html[data-style="dark"] .footer-text {
  color: var(--anexo-dark-text) !important;
}

html.dark-style .text-muted,
html.dark-style .text-black-50,
html.dark-style small.text-muted,
html[data-style="dark"] .text-muted,
html[data-style="dark"] .text-black-50,
html[data-style="dark"] small.text-muted {
  color: var(--anexo-dark-text-muted) !important;
}

html.dark-style .text-dark,
html[data-style="dark"] .text-dark {
  color: var(--anexo-dark-text) !important;
}

html.dark-style a:not(.btn):not(.dropdown-item),
html[data-style="dark"] a:not(.btn):not(.dropdown-item) {
  color: var(--anexo-dark-link);
}

html.dark-style a:not(.btn):hover,
html[data-style="dark"] a:not(.btn):hover {
  color: #e0d4ff;
}

html.dark-style .default-color,
html[data-style="dark"] .default-color {
  color: #c9b8ff !important;
}

/* —— Fundos claros → superfícies escuras (com faixa roxa alternada) —— */
html.dark-style .bg-white,
html[data-style="dark"] .bg-white {
  background-color: var(--anexo-dark-surface) !important;
  color: var(--anexo-dark-text);
}

html.dark-style .bg-light,
html[data-style="dark"] .bg-light {
  background-color: var(--anexo-dark-surface-alt) !important;
}

html.dark-style .bg-body-secondary,
html.dark-style .bg-body-secondary.bg-opacity-10,
html.dark-style .bg-body-secondary.bg-opacity-25,
html.dark-style .bg-body-secondary.bg-opacity-50,
html[data-style="dark"] .bg-body-secondary,
html[data-style="dark"] .bg-body-secondary.bg-opacity-10,
html[data-style="dark"] .bg-body-secondary.bg-opacity-25,
html[data-style="dark"] .bg-body-secondary.bg-opacity-50 {
  background-color: var(--anexo-dark-surface-rose) !important;
  color: var(--anexo-dark-text);
}

html.dark-style .card.bg-body,
html.dark-style .card.border-0.bg-body,
html.dark-style .card.border-0.shadow-sm.bg-body,
html[data-style="dark"] .card.bg-body,
html[data-style="dark"] .card.border-0.bg-body,
html[data-style="dark"] .card.border-0.shadow-sm.bg-body {
  background-color: var(--anexo-dark-surface) !important;
}

html.dark-style .card:not(.bg-primary):not(.bg-danger):not(.bg-success):not(.bg-warning):not(.bg-info),
html[data-style="dark"] .card:not(.bg-primary):not(.bg-danger):not(.bg-success):not(.bg-warning):not(.bg-info) {
  background-color: var(--anexo-dark-surface);
  border-color: rgba(255, 255, 255, 0.08);
  color: var(--anexo-dark-text);
}

html.dark-style .card-header,
html[data-style="dark"] .card-header {
  color: var(--anexo-dark-heading);
}

html.dark-style .alert-light,
html[data-style="dark"] .alert-light {
  background-color: var(--anexo-dark-surface-rose-strong) !important;
  border-color: rgba(111, 66, 193, 0.45) !important;
  color: var(--anexo-dark-text) !important;
}

html.dark-style .border.rounded-3,
html.dark-style .rounded-3.border,
html[data-style="dark"] .border.rounded-3,
html[data-style="dark"] .rounded-3.border {
  border-color: rgba(255, 255, 255, 0.12) !important;
  background-color: var(--anexo-dark-surface-rose) !important;
}

html.dark-style code.bg-body-secondary,
html[data-style="dark"] code.bg-body-secondary {
  background-color: var(--anexo-dark-surface-alt) !important;
  color: #e2d9ff !important;
}

/* Landing: seções com faixa roxa intercalada */
html.dark-style section.bg-body.landing-pricing,
html.dark-style section.bg-body.landing-reviews,
html.dark-style .landing-footer.bg-body,
html[data-style="dark"] section.bg-body.landing-pricing,
html[data-style="dark"] section.bg-body.landing-reviews,
html[data-style="dark"] .landing-footer.bg-body {
  background-color: var(--anexo-dark-surface-rose) !important;
}

html.dark-style section.bg-body.landing-faq,
html.dark-style section.bg-body.landing-contact,
html[data-style="dark"] section.bg-body.landing-faq,
html[data-style="dark"] section.bg-body.landing-contact {
  background-color: var(--bs-body-bg, #25293c) !important;
}

/* —— Badges e botões label —— */
html.dark-style .bg-label-primary,
html[data-style="dark"] .bg-label-primary {
  background-color: rgba(111, 66, 193, 0.28) !important;
  color: #e8deff !important;
}

html.dark-style .bg-label-secondary,
html[data-style="dark"] .bg-label-secondary {
  background-color: rgba(168, 170, 174, 0.22) !important;
  color: #e2e4f0 !important;
}

html.dark-style .bg-label-success,
html[data-style="dark"] .bg-label-success {
  color: #b8f0d0 !important;
}

html.dark-style .btn-label-primary,
html[data-style="dark"] .btn-label-primary {
  background-color: rgba(111, 66, 193, 0.22) !important;
  color: #e0d4ff !important;
  border-color: transparent;
}

html.dark-style .btn-label-primary:hover,
html[data-style="dark"] .btn-label-primary:hover {
  background-color: rgba(111, 66, 193, 0.35) !important;
  color: #fff !important;
}

/* —— Navbar, modal, formulários —— */
html.dark-style .layout-navbar,
html.dark-style .layout-navbar.landing-navbar,
html[data-style="dark"] .layout-navbar,
html[data-style="dark"] .layout-navbar.landing-navbar {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.dark-style .layout-navbar .nav-link,
html.dark-style .layout-navbar .navbar-brand,
html[data-style="dark"] .layout-navbar .nav-link,
html[data-style="dark"] .layout-navbar .navbar-brand {
  color: var(--anexo-dark-text) !important;
}

html.dark-style .modal-content,
html[data-style="dark"] .modal-content {
  background-color: var(--anexo-dark-surface);
  color: var(--anexo-dark-text);
  border-color: rgba(255, 255, 255, 0.1);
}

html.dark-style .modal-header .btn-close,
html[data-style="dark"] .modal-header .btn-close {
  filter: invert(1) grayscale(100%);
}

html.dark-style .form-control,
html.dark-style .form-select,
html[data-style="dark"] .form-control,
html[data-style="dark"] .form-select {
  background-color: #2b2f42;
  color: var(--anexo-dark-text);
  border-color: rgba(255, 255, 255, 0.14);
}

html.dark-style .form-control::placeholder,
html[data-style="dark"] .form-control::placeholder {
  color: rgba(231, 233, 252, 0.45);
}

html.dark-style .input-group-text,
html[data-style="dark"] .input-group-text {
  background-color: var(--anexo-dark-surface-alt);
  color: var(--anexo-dark-text-muted);
  border-color: rgba(255, 255, 255, 0.14);
}

html.dark-style .accordion-button,
html[data-style="dark"] .accordion-button {
  color: var(--anexo-dark-heading);
  background-color: var(--anexo-dark-surface);
}

html.dark-style .accordion-button:not(.collapsed),
html[data-style="dark"] .accordion-button:not(.collapsed) {
  color: var(--anexo-dark-heading);
  background-color: var(--anexo-dark-surface-rose-strong);
}

/* Auth / login — cores fixas (não usar --bs-body-bg: no core claro ela fica branca) */
html.dark-style .authentication-wrapper .authentication-bg,
html[data-style="dark"] .authentication-wrapper .authentication-bg {
  background-color: #2f3349 !important;
  color: var(--anexo-dark-text) !important;
}

html.dark-style .authentication-wrapper .authentication-bg h2,
html.dark-style .authentication-wrapper .authentication-bg h4,
html.dark-style .authentication-wrapper .authentication-bg p,
html.dark-style .authentication-wrapper .authentication-bg label,
html.dark-style .authentication-wrapper .authentication-bg .form-label,
html[data-style="dark"] .authentication-wrapper .authentication-bg h2,
html[data-style="dark"] .authentication-wrapper .authentication-bg h4,
html[data-style="dark"] .authentication-wrapper .authentication-bg p,
html[data-style="dark"] .authentication-wrapper .authentication-bg label,
html[data-style="dark"] .authentication-wrapper .authentication-bg .form-label {
  color: var(--anexo-dark-heading) !important;
}

html.dark-style .authentication-wrapper .authentication-bg .text-primary,
html[data-style="dark"] .authentication-wrapper .authentication-bg .text-primary {
  color: #c9b8ff !important;
}

html.dark-style .authentication-wrapper .authentication-bg .text-muted,
html.dark-style .authentication-wrapper .authentication-bg small.text-muted,
html[data-style="dark"] .authentication-wrapper .authentication-bg .text-muted,
html[data-style="dark"] .authentication-wrapper .authentication-bg small.text-muted {
  color: var(--anexo-dark-text-muted) !important;
}

html.dark-style .authentication-wrapper .authentication-bg a:not(.btn),
html[data-style="dark"] .authentication-wrapper .authentication-bg a:not(.btn) {
  color: var(--anexo-dark-link) !important;
}

html.dark-style .authentication-wrapper .authentication-bg .form-control,
html.dark-style .authentication-wrapper .authentication-bg .form-select,
html[data-style="dark"] .authentication-wrapper .authentication-bg .form-control,
html[data-style="dark"] .authentication-wrapper .authentication-bg .form-select {
  background-color: var(--anexo-dark-surface-alt) !important;
  color: var(--anexo-dark-text) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

html.dark-style .authentication-wrapper .authentication-bg .form-control::placeholder,
html[data-style="dark"] .authentication-wrapper .authentication-bg .form-control::placeholder {
  color: var(--anexo-dark-text-muted) !important;
}

html.dark-style .auth-cover-bg-color,
html[data-style="dark"] .auth-cover-bg-color {
  background-color: #25293c !important;
}

/* Hero e CTA */
html.dark-style .hero-btn-item,
html[data-style="dark"] .hero-btn-item {
  color: var(--anexo-dark-text) !important;
}

html.dark-style .landing-cta .text-body,
html[data-style="dark"] .landing-cta .text-body {
  color: var(--anexo-dark-text-muted) !important;
}

/* Admin: ícones e texto no menu superior */
html.dark-style .layout-navbar .text-heading,
html.dark-style .navbar-nav .text-heading,
html[data-style="dark"] .layout-navbar .text-heading,
html[data-style="dark"] .navbar-nav .text-heading {
  color: var(--anexo-dark-heading) !important;
}

html.dark-style .schema_name,
html[data-style="dark"] .schema_name {
  color: #c9b8ff;
}

/* —— Landing: FAQ, Portal de Vagas, Correspondente (fundos inline claros) —— */
html.dark-style #landingFAQ,
html[data-style="dark"] #landingFAQ {
  background-color: #25293c !important;
}

html.dark-style #landingFAQ h4,
html.dark-style #landingFAQ h4 span,
html.dark-style #landingFAQ > .container > p.text-center,
html[data-style="dark"] #landingFAQ h4,
html[data-style="dark"] #landingFAQ h4 span,
html[data-style="dark"] #landingFAQ > .container > p.text-center {
  color: var(--anexo-dark-heading) !important;
}

html.dark-style #landingFAQ > .container > p.text-center.pb-md-4,
html[data-style="dark"] #landingFAQ > .container > p.text-center.pb-md-4 {
  color: var(--anexo-dark-text-muted) !important;
}

html.dark-style #landingFAQ .accordion-item,
html[data-style="dark"] #landingFAQ .accordion-item {
  background-color: var(--anexo-dark-surface) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

html.dark-style #portalVagas,
html[data-style="dark"] #portalVagas {
  background-color: #25293c !important;
}

html.dark-style #portalVagas .rounded-4,
html[data-style="dark"] #portalVagas .rounded-4 {
  background-color: var(--anexo-dark-surface) !important;
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.3) !important;
}

html.dark-style #portalVagas h3[style],
html.dark-style #ctaCorrespondente h5[style],
html[data-style="dark"] #portalVagas h3[style],
html[data-style="dark"] #ctaCorrespondente h5[style] {
  color: #f0a8c8 !important;
}

html.dark-style #portalVagas h4,
html.dark-style #portalVagas h5,
html.dark-style #portalVagas p,
html.dark-style #portalVagas li,
html.dark-style #portalVagas .text-body,
html.dark-style #ctaCorrespondente h3,
html.dark-style #ctaCorrespondente .cta-title,
html.dark-style #ctaCorrespondente h5,
html.dark-style #ctaCorrespondente p,
html.dark-style #ctaCorrespondente .text-body,
html[data-style="dark"] #portalVagas h4,
html[data-style="dark"] #portalVagas h5,
html[data-style="dark"] #portalVagas p,
html[data-style="dark"] #portalVagas li,
html[data-style="dark"] #portalVagas .text-body,
html[data-style="dark"] #ctaCorrespondente h3,
html[data-style="dark"] #ctaCorrespondente .cta-title,
html[data-style="dark"] #ctaCorrespondente h5,
html[data-style="dark"] #ctaCorrespondente p,
html[data-style="dark"] #ctaCorrespondente .text-body {
  color: var(--anexo-dark-text) !important;
}

html.dark-style #portalVagas .text-muted,
html.dark-style #ctaCorrespondente .text-muted,
html[data-style="dark"] #portalVagas .text-muted,
html[data-style="dark"] #ctaCorrespondente .text-muted {
  color: var(--anexo-dark-text-muted) !important;
}

html.dark-style #ctaCorrespondente,
html[data-style="dark"] #ctaCorrespondente {
  background-color: rgba(111, 66, 193, 0.16) !important;
}