/* ================================================================
   DARKMODE.CSS — Gyroscope Management
   Implementare completă și corectă
   ================================================================ */

/* ================================================================
   BUTON DARK MODE
   ================================================================ */

#darkmode-btn {
  position: fixed;
  right: 30px;
  bottom: 30px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  z-index: 10001;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0a0c00;
  box-shadow:
    inset 0 0 0 2px rgba(227, 255, 4, 0.25),
    0 4px 20px rgba(0, 0, 0, 0.3);
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease,
    background 0.35s ease,
    bottom 0.3s ease;
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

#darkmode-btn.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  bottom: 92px;
}

#darkmode-btn:hover {
  transform: translateY(-3px) scale(1.08);
  box-shadow:
    inset 0 0 0 2px rgba(227, 255, 4, 0.7),
    0 8px 28px rgba(0, 0, 0, 0.35);
}

#darkmode-btn svg {
  width: 20px;
  height: 20px;
  position: absolute;
  transition:
    opacity 0.3s ease,
    transform 0.4s ease;
}

#darkmode-btn .icon-moon {
  color: #e3ff04;
  opacity: 0;
  transform: rotate(90deg) scale(0.6);
}

#darkmode-btn .icon-sun {
  color: #e3ff04;
  opacity: 1;
  transform: rotate(0deg) scale(1);
}

@media (max-width: 575px) {
  #darkmode-btn {
    right: 15px;
    bottom: 0px;
    width: 40px;
    height: 40px;
  }
  #darkmode-btn.show {
    bottom: 48px;
  }
  #darkmode-btn svg {
    width: 17px;
    height: 17px;
  }
}

/* ================================================================
   STAREA BUTONULUI — DARK MODE ACTIV
   ================================================================ */

body.dark-mode #darkmode-btn {
  background: #1e2116;
  box-shadow:
    inset 0 0 0 2px rgba(227, 255, 4, 0.4),
    0 4px 20px rgba(0, 0, 0, 0.5);
}

body.dark-mode #darkmode-btn .icon-moon {
  opacity: 1;
  transform: rotate(0deg) scale(1);
}

body.dark-mode #darkmode-btn .icon-sun {
  opacity: 0;
  transform: rotate(-90deg) scale(0.6);
}

/* ================================================================
   BODY ȘI FUNDAL GLOBAL
   ================================================================ */

body.dark-mode {
  background-color: #13150e !important;
  color: #b0b4a6 !important;
}

/* ================================================================
   VARIABILE SUPRASCRISE ÎN DARK MODE
   ================================================================ */

body.dark-mode {
  --title-color: #e2e5d8;
  --body-color: #b0b4a6;
  --smoke-color: #1e2116;
  --smoke-color2: #1b1e13;
  --smoke-color3: #1d2015;
  --smoke-color4: #1c1f14;
  --smoke-color5: #1f2217;
  --white-color: #13150e;
  --border-color: #2c3020;
  --light-color: #5a5e52;
  --black-color: #1a1d12;
}

/* ================================================================
   TIPOGRAFIE GENERALĂ
   ================================================================ */

body.dark-mode p {
  color: #b0b4a6;
}

body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6 {
  color: #e2e5d8;
}

body.dark-mode .sec-title {
  color: #e2e5d8 !important;
}
body.dark-mode .sec-text {
  color: #b0b4a6 !important;
}

/* ================================================================
   PRELOADER
   ================================================================ */

body.dark-mode .preloader {
  background-color: #13150e;
}

body.dark-mode .preloader-inner span {
  background-color: #e3ff04;
}

/* ================================================================
   NAVBAR (custom-nav-pill)
   ================================================================ */

body.dark-mode .custom-nav-pill {
  background: rgba(19, 21, 14, 0.95) !important;
  border: 1px solid rgba(227, 255, 4, 0.12) !important;
  backdrop-filter: blur(24px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(160%) !important;
}

body.dark-mode .nav-menu li a {
  color: #c5c9bc !important;
}

body.dark-mode .nav-menu li a:hover,
body.dark-mode .nav-menu li a.active {
  color: #e3ff04 !important;
  background: rgba(227, 255, 4, 0.08) !important;
}

body.dark-mode .nav-menu .icon-small {
  color: #c5c9bc !important;
}

body.dark-mode .dropdown-menu-custom {
  background: #1a1d12 !important;
  border: 1px solid #2c3020 !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.7) !important;
}

body.dark-mode .dropdown-menu-custom li a {
  color: #c5c9bc !important;
}

body.dark-mode .dropdown-menu-custom li a:hover {
  color: #e3ff04 !important;
  background: rgba(227, 255, 4, 0.08) !important;
}

body.dark-mode .nav-btn {
  color: #e3ff04 !important;
}

/* ================================================================
   GYRO-GAP-FILLER — RĂMÂNE NEGRU (se întărește puțin)
   ================================================================ */

body.dark-mode .gyro-gap-filler {
  background: #080900 !important;
}

/* ================================================================
   FUNDAL SECȚIUNI: bg-white / bg-smoke → DARK
   ================================================================ */

body.dark-mode .bg-white {
  background-color: #13150e !important;
}
body.dark-mode .bg-smoke {
  background-color: #1a1d12 !important;
}
body.dark-mode .bg-smoke2 {
  background-color: #171a10 !important;
}
body.dark-mode .bg-smoke3 {
  background-color: #191c11 !important;
}
body.dark-mode .bg-smoke4 {
  background-color: #181b10 !important;
}
body.dark-mode .bg-smoke5 {
  background-color: #1b1e13 !important;
}

/* Secțiuni fără clasă de bg explicită */
body.dark-mode .about-area-16,
body.dark-mode .faq-area-1,
body.dark-mode
  section:not(.bg-title):not(.bg-theme):not(.orbital-section):not(
    .kinetic-tech-wrap
  ):not(.automation-matrix-wrap):not(.cta-area-1) {
  background-color: #13150e;
}

/* ================================================================
   bg-theme (GALBEN) — NESCHIMBAT în dark mode
   Secțiunile cu bg galben au text negru — rămâne corect
   ================================================================ */

/* Singura ajustare: textele implicite care ar putea moșteni dark */
body.dark-mode .bg-theme .sec-title,
body.dark-mode .bg-theme h1,
body.dark-mode .bg-theme h2,
body.dark-mode .bg-theme h3,
body.dark-mode .bg-theme h4,
body.dark-mode .bg-theme h5,
body.dark-mode .bg-theme h6 {
  color: #0a0c00 !important;
}

body.dark-mode .bg-theme p,
body.dark-mode .bg-theme .sec-text {
  color: #0a0c00 !important;
}

/* ================================================================
   bg-title (NEGRU #0a0c00) — RĂMÂNE NEGRU + texte albe
   ================================================================ */

body.dark-mode .bg-title {
  background-color: #080900 !important;
}

body.dark-mode .bg-title h1,
body.dark-mode .bg-title h2,
body.dark-mode .bg-title h3,
body.dark-mode .bg-title h4,
body.dark-mode .bg-title h5,
body.dark-mode .bg-title h6,
body.dark-mode .bg-title .sec-title {
  color: #ffffff !important;
}

body.dark-mode .bg-title p,
body.dark-mode .bg-title .sec-text {
  color: rgba(255, 255, 255, 0.7) !important;
}

body.dark-mode .bg-title .text-white {
  color: #ffffff !important;
}
body.dark-mode .bg-title .sub-title {
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
}

/* Feature-card bg-white pe fundal bg-title: devine dark */
body.dark-mode .bg-title .feature-card.bg-white {
  background: #1a1d12 !important;
}

body.dark-mode .bg-title .feature-card.bg-white .feature-card-title,
body.dark-mode .bg-title .feature-card.bg-white h4 {
  color: #e2e5d8 !important;
}

body.dark-mode .bg-title .feature-card.bg-white .feature-card-text,
body.dark-mode .bg-title .feature-card.bg-white p {
  color: #b0b4a6 !important;
}

/* Offer-card pe bg-title — RĂMÂNE (are border rgba alb, text alb) */

/* ================================================================
   ORBITAL SECTION — RĂMÂNE NEAGRĂ (protejat)
   ================================================================ */

body.dark-mode .orbital-section {
  background: #050600 !important;
}

body.dark-mode .orbital-core {
  background: radial-gradient(circle, #0f1000 0%, #050600 100%) !important;
}

/* core-title e deja alb pe negru */
body.dark-mode .core-title {
  color: #ffffff !important;
}

body.dark-mode .satellite-box {
  background: rgba(255, 255, 255, 0.03) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .satellite-box h4 {
  color: #ffffff !important;
}

body.dark-mode .satellite-box p {
  color: rgba(255, 255, 255, 0.45) !important;
}

/* ================================================================
   KINETIC-TECH-WRAP (tech-stack hero section) — ÎNTUNECAT
   ================================================================ */

body.dark-mode .kinetic-tech-wrap {
  background-color: #0a0c05 !important;
}

body.dark-mode .kinetic-tech-wrap h2,
body.dark-mode .kinetic-tech-wrap .tech-glitch-text {
  color: #e2e5d8 !important;
}

body.dark-mode .kinetic-tech-wrap .kinetic-subtext {
  color: #b0b4a6 !important;
}

/* Blocul glass pe kinetic — rămâne transparent întunecat */

/* ================================================================
   AUTOMATION-MATRIX-WRAP (tech-stack) — ÎNTUNECAT
   ================================================================ */

body.dark-mode .automation-matrix-wrap {
  background-color: #0d0f07 !important;
}

body.dark-mode .automation-matrix-wrap h2,
body.dark-mode .automation-matrix-wrap h3,
body.dark-mode .automation-matrix-wrap .editorial-hero-title {
  color: #e2e5d8 !important;
}

body.dark-mode .automation-matrix-wrap .text-title {
  color: #e2e5d8 !important;
}

body.dark-mode .automation-matrix-wrap .sec-text {
  color: #b0b4a6 !important;
}

/* ================================================================
   AUTO-CARD-MODERN (carduri în automation-matrix-wrap)
   ================================================================ */

body.dark-mode .auto-card-modern {
  background: #1a1d12 !important;
  border: 1px solid #2c3020 !important;
}

body.dark-mode .auto-card-modern h4,
body.dark-mode .auto-card-modern .h5 {
  color: #e2e5d8 !important;
}

body.dark-mode .auto-card-modern p {
  color: rgba(176, 180, 166, 0.8) !important;
}

body.dark-mode .auto-card-modern:hover {
  background: #222518 !important;
  border-color: #e3ff04 !important;
}

body.dark-mode .auto-card-tag {
  background: #0a0c00;
  color: #e3ff04;
}

/* ================================================================
   SERVICE-CARD2 (our-values, borduri orizontale)
   ================================================================ */

body.dark-mode .service-card2 {
  border-top-color: #2c3020 !important;
}

body.dark-mode .service-card2:last-child {
  border-bottom-color: #2c3020 !important;
}

body.dark-mode .service-card2 .box-title {
  color: #e2e5d8 !important;
}

body.dark-mode .service-card2 .box-text {
  color: #b0b4a6 !important;
}

/* ================================================================
   FAQ ACCORDION (index.html)
   ================================================================ */

body.dark-mode .accordion-card {
  border-color: #2c3020 !important;
  background-color: transparent !important;
}

body.dark-mode .accordion-card .accordion-button {
  background-color: transparent !important;
  color: #e2e5d8 !important;
  box-shadow: none !important;
}

body.dark-mode .accordion-card .accordion-button:not(.collapsed) {
  color: #e3ff04 !important;
}

body.dark-mode .accordion-body {
  background-color: transparent !important;
}

body.dark-mode .faq-text,
body.dark-mode .accordion-body p {
  color: #b0b4a6 !important;
}

/* ================================================================
   MARQUEE / TICKER
   ================================================================ */

body.dark-mode .slider__marquee .m-item,
body.dark-mode .slider__marquee .m-item a {
  color: #e2e5d8 !important;
}

body.dark-mode .slider__marquee .m-item a:hover {
  color: #e3ff04 !important;
}

/* ================================================================
   FOOTER (footer-layout-ultra, bg-white → DARK)
   ================================================================ */

body.dark-mode .footer-wrapper {
  background-color: #0d0f07 !important;
  border-top: 1px solid #1e2116 !important;
}

body.dark-mode .footer-slogan {
  color: #e2e5d8 !important;
}

body.dark-mode .nav-title,
body.dark-mode .footer-nav-widget .nav-title {
  color: #e2e5d8 !important;
}

body.dark-mode .footer-nav-list li a {
  color: #6a6e62 !important;
}

body.dark-mode .footer-nav-list li a:hover {
  color: #e3ff04 !important;
}

body.dark-mode .office-info {
  color: #6a6e62 !important;
}

body.dark-mode .footer-divider {
  background-color: #1e2116 !important;
  border-color: #1e2116 !important;
}

body.dark-mode .copyright-minimal {
  color: #4a4e44 !important;
}

body.dark-mode .legal-minimal-list a {
  color: #4a4e44 !important;
}

body.dark-mode .legal-minimal-list a:hover {
  color: #e3ff04 !important;
}

/* ================================================================
   SCROLL-TO-TOP
   ================================================================ */

body.dark-mode .scroll-top:after {
  color: #e3ff04 !important;
  box-shadow: inset 0 0 0 2px rgba(227, 255, 4, 0.25) !important;
}

body.dark-mode .scroll-top svg {
  color: #e3ff04 !important;
}

body.dark-mode .scroll-top .progress-circle path {
  stroke: #e3ff04 !important;
}

/* ================================================================
   LINK-BTN
   ================================================================ */

body.dark-mode .link-btn {
  color: #e2e5d8 !important;
}

body.dark-mode .link-btn:before,
body.dark-mode .link-btn:after {
  background-color: #e2e5d8 !important;
}

body.dark-mode .link-btn:hover {
  color: #e3ff04 !important;
}

/* link-btn.style4 pe bg-title — e deja alb */
body.dark-mode .bg-title .link-btn {
  color: #ffffff !important;
}

body.dark-mode .bg-title .link-btn:before,
body.dark-mode .bg-title .link-btn:after {
  background-color: #ffffff !important;
}

/* ================================================================
   SUB-TITLE (etichete mici)
   ================================================================ */

body.dark-mode .sub-title {
  color: #e3ff04 !important;
  border-color: rgba(227, 255, 4, 0.3) !important;
}

/* Pe bg-theme (galben) sub-title rămâne cu culoarea originală neagră */
body.dark-mode .bg-theme .sub-title {
  color: #0a0c00 !important;
  border-color: #0a0c00 !important;
}

/* Pe bg-title sub-title e deja setat mai sus la alb */

/* ================================================================
   BREADCRUMB
   ================================================================ */

/* Hero/breadcrumb principal: forțăm fundalul dark indiferent de var(--title-color) */
/* Folosim background-color (nu shorthand) ca să nu stricăm paginile cu data-bg-src */
body.dark-mode .breadcumb-wrapper {
  background-color: #0a0c00 !important;
}

body.dark-mode .breadcumb-wrapper .breadcumb-title {
  color: #ffffff !important;
}

/* Pill-ul gyroscope din hero: aspect glass pe fundal dark */
body.dark-mode .breadcumb-wrapper .gyro-glass-pill-v2 {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

body.dark-mode .breadcumb-wrapper.style2 {
  background-color: #1a1d12 !important;
}

body.dark-mode .breadcumb-menu li,
body.dark-mode .breadcumb-menu a,
body.dark-mode .breadcumb-menu span {
  color: rgba(226, 229, 216, 0.6) !important;
}

body.dark-mode .breadcumb-menu li:after {
  color: rgba(226, 229, 216, 0.35) !important;
}

/* ================================================================
   GET-IN-TOUCH (formular contact)
   ================================================================ */

body.dark-mode .contact-area {
  background-color: #1a1d12 !important;
}

body.dark-mode .contact-card .box-title {
  color: #e2e5d8 !important;
}

body.dark-mode .contact-card .box-text,
body.dark-mode .contact-card a.text-body {
  color: #b0b4a6 !important;
}

body.dark-mode .social-btn.style3 a {
  color: #b0b4a6 !important;
}

body.dark-mode .social-btn.style3 a:hover {
  color: #e3ff04 !important;
}

body.dark-mode .contact-form-wrap {
  background-color: #1a1d12 !important;
  border-color: #2c3020 !important;
}

body.dark-mode .contact-form-wrap h3 {
  color: #e2e5d8 !important;
}

body.dark-mode .form-control.style-border,
body.dark-mode .contact-form-wrap input,
body.dark-mode .contact-form-wrap textarea {
  background-color: #222518 !important;
  color: #e2e5d8 !important;
  border-color: #2c3020 !important;
}

body.dark-mode .contact-form-wrap input::placeholder,
body.dark-mode .contact-form-wrap textarea::placeholder,
body.dark-mode .form-control.style-border::placeholder {
  color: rgba(176, 180, 166, 0.4) !important;
}

body.dark-mode .slidercaptcha.card {
  background: #222518 !important;
  border-color: #2c3020 !important;
  color: #e2e5d8 !important;
}

body.dark-mode .slidercaptcha .card-header {
  background: #1a1d12 !important;
  border-color: #2c3020 !important;
  color: #e2e5d8 !important;
}

/* ================================================================
   COUNTERS (tech-stack)
   ================================================================ */

body.dark-mode .counter-card_number {
  color: #e2e5d8 !important;
}
body.dark-mode .counter-card_title {
  color: #e2e5d8 !important;
}
body.dark-mode .counter-card_text {
  color: #b0b4a6 !important;
}
body.dark-mode .counter-divider:after {
  border-color: rgba(226, 229, 216, 0.12) !important;
}

/* ================================================================
   CHECKLIST
   ================================================================ */

body.dark-mode .checklist li {
  color: #b0b4a6 !important;
}

body.dark-mode .checklist.style2 ul li {
  background-color: #1e2116 !important;
  color: #e2e5d8 !important;
}

/* ================================================================
   SKILL-FEATURE (progress bars)
   ================================================================ */

body.dark-mode .skill-feature_title {
  color: #e2e5d8 !important;
}

body.dark-mode .progress {
  background: rgba(255, 255, 255, 0.08) !important;
}

body.dark-mode .progress-bar.bg-title {
  background-color: #e3ff04 !important;
}

/* ================================================================
   SCROLL-TEXT-ANI (gradient text animat)
   ================================================================ */

body.dark-mode .scroll-text-ani {
  background-image: linear-gradient(
    to right,
    #e2e5d8 0%,
    rgba(226, 229, 216, 0.55) 0%
  ) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}

/* ================================================================
   EDITORIAL HERO TITLE
   ================================================================ */

body.dark-mode .editorial-hero-title {
  color: #e2e5d8 !important;
}

body.dark-mode .editorial-hero-title.scroll-text-ani {
  background-image: linear-gradient(
    to right,
    #e2e5d8 50%,
    rgba(226, 229, 216, 0.55) 50%
  ) !important;
}

/* ================================================================
   EXPERIENCE CONTENT BOX (our-values)
   ================================================================ */

body.dark-mode .experience-content-box h3,
body.dark-mode .experience-content-box .h4 {
  color: #e2e5d8 !important;
}

body.dark-mode .experience-content-box p {
  color: #b0b4a6 !important;
}

/* ================================================================
   QUALITY DETAILS (our-values - Detail-Oriented)
   ================================================================ */

body.dark-mode .quality-details-wrap p {
  color: #b0b4a6 !important;
}

body.dark-mode .quality-details-wrap .sec-text.text-title.fw-semibold {
  color: #e2e5d8 !important;
}

/* Linia de separare din quality-details */
body.dark-mode .quality-details-wrap > div[style*="border-bottom"] {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

/* ================================================================
   TABELE
   ================================================================ */

body.dark-mode table {
  border-color: #2c3020 !important;
}
body.dark-mode th,
body.dark-mode td {
  border-color: #2c3020 !important;
  color: #b0b4a6 !important;
}
body.dark-mode th {
  color: #e2e5d8 !important;
}

body.dark-mode hr {
  border-color: #2c3020 !important;
}

/* ================================================================
   FORMULARE GENERICE
   ================================================================ */

body.dark-mode input:not([type="submit"]):not([type="button"]),
body.dark-mode textarea,
body.dark-mode select,
body.dark-mode .form-control,
body.dark-mode .form-select {
  background-color: #1e2116 !important;
  color: #e2e5d8 !important;
  border-color: #2c3020 !important;
}

body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
  color: rgba(176, 180, 166, 0.4) !important;
}

/* ================================================================
   SOCIAL BTN GENERAL
   ================================================================ */

body.dark-mode .social-btn a {
  background: #1e2116 !important;
  border-color: #2c3020 !important;
  color: #e2e5d8 !important;
}

body.dark-mode .social-btn a:hover {
  background: #e3ff04 !important;
  color: #0a0c00 !important;
  border-color: #e3ff04 !important;
}

/* ================================================================
   MOBILE MENU OVERLAY — RĂMÂNE NEGRU (neschimbat)
   ================================================================ */

/* Nu modificăm nimic — are propriul fundal negru complet */

/* ================================================================
   COOKIE POPUP
   ================================================================ */

body.dark-mode [class*="cookie-popup"],
body.dark-mode .cookie-popup {
  background-color: #1a1d12 !important;
  border-color: #2c3020 !important;
  color: #b0b4a6 !important;
}

body.dark-mode [class*="cookie-popup"] h3,
body.dark-mode [class*="cookie-popup"] h4,
body.dark-mode [class*="cookie-popup"] strong,
body.dark-mode .cookie-popup h3,
body.dark-mode .cookie-popup h4 {
  color: #e2e5d8 !important;
}

/* ================================================================
   PAGINATION
   ================================================================ */

body.dark-mode .pagination-wrap .pagination .page-link {
  background: #1e2116 !important;
  color: #e2e5d8 !important;
}

body.dark-mode .pagination-wrap .pagination .page-link:hover,
body.dark-mode .pagination-wrap .pagination .page-item.active .page-link {
  background-color: #e3ff04 !important;
  color: #0a0c00 !important;
}

/* ================================================================
   STICKY HEADER
   ================================================================ */

body.dark-mode .sticky-wrapper.header-sticky {
  background-color: rgba(19, 21, 14, 0.97) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important;
}

/* ================================================================
   ELEMENTE CU STYLE INLINE — bg alb / smoke → dark
   ================================================================ */

body.dark-mode [style*="background: #ffffff"],
body.dark-mode [style*="background:#ffffff"],
body.dark-mode [style*="background-color: #ffffff"],
body.dark-mode [style*="background-color:#ffffff"],
body.dark-mode [style*="background: white"],
body.dark-mode [style*="background-color: white"] {
  background: #1e2116 !important;
  background-color: #1e2116 !important;
}

body.dark-mode [style*="background: #f6f5f3"],
body.dark-mode [style*="background-color: #f6f5f3"],
body.dark-mode [style*="background: rgb(247, 244, 239)"],
body.dark-mode [style*="background-color: rgb(247, 244, 239)"] {
  background: #1e2116 !important;
  background-color: #1e2116 !important;
}

/* Borduri inline negre pe fundal alb → devin subtile */
body.dark-mode [style*="border: 1px solid var(--border-color)"] {
  border-color: #2c3020 !important;
}

body.dark-mode [style*="border-bottom: 1px solid rgba(0, 0, 0, 0.1)"],
body.dark-mode [style*="border-bottom:1px solid rgba(0,0,0,0.1)"] {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

/* Background rgba negru translucid pe fundal alb → devin subtil deschis */
body.dark-mode [style*="background: rgba(0, 0, 0, 0.05)"],
body.dark-mode [style*="background:rgba(0,0,0,0.05)"] {
  background: rgba(255, 255, 255, 0.04) !important;
}

/* Textele cu color: var(--title-color) din carduri inline pe bg-theme
   (forward-thinking section) — rămân negre deoarece sunt pe galben */

/* ================================================================
   TRANZIȚIE FLUIDĂ (aplicată selectiv pentru performanță)
   ================================================================ */

body.dark-mode,
body.dark-mode .custom-nav-pill,
body.dark-mode .nav-menu li a,
body.dark-mode .dropdown-menu-custom,
body.dark-mode .footer-wrapper,
body.dark-mode .accordion-card,
body.dark-mode .accordion-button,
body.dark-mode .auto-card-modern,
body.dark-mode .service-card2,
body.dark-mode .contact-form-wrap,
body.dark-mode input,
body.dark-mode textarea,
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6,
body.dark-mode p,
body.dark-mode .sec-title,
body.dark-mode .sec-text {
  transition:
    background-color 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease !important;
}
/*  */
/* #91A701 about-area-1 space bg-theme shape-mockup-wrap  */
body.dark-mode .bg-theme {
  background: #91a701 !important;
}

body.dark-mode .sec-text {
}
body.dark-mode .text-white,
body.dark-mode .feature-card-text,
body.dark-mode .feature-card-title {
  color: #b0b4a6 !important;
}
body.dark-mode .text-theme {
  background: transparent !important;
}
/* ================================================================
   FIX SPECIFIC PENTRU TECH STACK (Cardurile Negre)
   ================================================================ */

/* Targetăm cardurile de tip counter și feature care au fundal închis */
body.dark-mode .counter-card.style3 .counter-card_number,
body.dark-mode .counter-card.style3 .counter-card_title,
body.dark-mode .feature-card .feature-card-title,
body.dark-mode .feature-card .feature-card-text,
body.dark-mode .feature-card h4 {
  color: #e2e5d8 !important; /* Culoarea deschisă definită în variabilele tale */
}

/* Fix pentru descrierile mici din cardurile Tech Stack (Custom Dashboards, ERP, etc.) */
body.dark-mode .feature-card p,
body.dark-mode .feature-card .feature-card-text {
  color: #b0b4a6 !important; /* Griul definit pentru body text */
}

/* Dacă iconițele sunt de tip font (FontAwesome), asigură-te că sunt vizibile */
body.dark-mode .feature-card-icon i,
body.dark-mode .feature-card-icon {
  color: #e3ff04 !important; /* Galbenul brandului pentru contrast */
}

/* Fix pentru fundalul cardurilor care sunt "Custom Dashboards", "ERP Integration" */
/* Acestea au clasa .bg-white sau sunt carduri simple pe fundal verde în light mode */
body.dark-mode .feature-card.bg-white,
body.dark-mode .feature-card {
  background-color: #1a1d12 !important; /* Fundalul dark pentru carduri */
  border: 1px solid #2c3020 !important;
}

/* Excepție: Cardul care este deja negru (ERP Integration în mijloc) */
body.dark-mode .feature-card.bg-title {
  background-color: #080900 !important; /* Rămâne negru intens */
}
/* ================================================================
   FIX PENTRU RADAR CARDS (Vendor Performance Management)
   ================================================================ */

body.dark-mode .radar-card-inner {
  /* Schimbăm fundalul albicios într-un negru profund sau gri foarte închis */
  background-color: #0d0f07 !important;

  /* Adăugăm o bordură discretă pentru a defini forma pe fundal negru */
  border: 1px solid rgba(227, 255, 4, 0.1) !important;
}

/* Forțăm textele din interiorul acestor carduri să fie deschise la culoare */
body.dark-mode .radar-card-inner h4 {
  color: #e2e5d8 !important;
}

/* Dacă vrei ca la hover fundalul să devină puțin mai deschis (interactivitate) */
body.dark-mode .radar-card:hover .radar-card-inner {
  background-color: #1a1d12 !important;
  border-color: rgba(227, 255, 4, 0.3) !important;
}

/* Efect opțional: Ajustăm opacitatea spinner-ului de sub card pentru a nu fi prea strident */
body.dark-mode .radar-card-spinner {
  opacity: 0.6;
}
/* ================================================================
   FIX PENTRU 3D FLIP CARDS (Comprehensive Performance Frameworks)
   ================================================================ */

/* Fața cardului (unde este iconița și titlul inițial) */
body.dark-mode .flip-card-front {
  background-color: #1a1d12 !important; /* Gri închis oliv */
  border: 1px solid rgba(227, 255, 4, 0.1) !important;
}

/* Spatele cardului (cel care se vede în screenshot-ul tău la hover) */
body.dark-mode .flip-card-back {
  /* Folosim un negru mult mai intens sau culoarea de brand pentru contrast */
  background-color: #080900 !important;
  border: 2px solid var(--theme-color) !important; /* Adăugăm o bordură galbenă subțire */
}

/* Textul de pe spatele cardului (cel care devine invizibil pe alb în dark mode) */
body.dark-mode .flip-card-back h4,
body.dark-mode .flip-card-back p {
  color: #ffffff !important;
}

/* Iconițele de pe fața cardului */
body.dark-mode .flip-card-front i {
  color: var(--theme-color) !important;
  filter: drop-shadow(0 0 5px rgba(227, 255, 4, 0.2));
}

/* Textul "Hover to reveal" să fie mai discret în dark mode */
body.dark-mode .flip-card-front p {
  color: rgba(176, 180, 166, 0.5) !important;
}

/* Efect de adâncime (Shadow) la hover pentru modul Dark */
body.dark-mode .flip-card-container:hover .flip-card-inner {
  box-shadow: 0 15px 45px rgba(0, 0, 0, 0.6);
}
/* ================================================================
   FIX PENTRU SCHEMATIC GRID (Technology-Enabled Performance)
   ================================================================ */

/* 1. Panoul mare de text (cel crem din stânga) */
body.dark-mode .schematic-text-panel {
  background-color: #080900 !important; /* Negru intens pentru contrast cu restul grilei */
  border-right: 1px solid #2c3020 !important;
}

/* Titlul mare din interiorul panoului */
body.dark-mode .schematic-text-panel h3 {
  color: #ffffff !important;
}

/* Paragrafele explicative */
body.dark-mode .schematic-text-panel p {
  color: #b0b4a6 !important;
}

/* Status bar-ul (SYSTEM.ONLINE) */
body.dark-mode .system-status {
  background: rgba(227, 255, 4, 0.05) !important;
  border: 1px solid rgba(227, 255, 4, 0.1) !important;
  color: #e3ff04 !important;
}

/* 2. Grila de celule mici (cele din dreapta și de jos) */
body.dark-mode .schematic-grid {
  border-color: #2c3020 !important;
  background-color: #13150e !important;
}

body.dark-mode .schematic-cell {
  border-color: #2c3020 !important;
}

/* Celulele individuale cu iconițe */
body.dark-mode .schematic-feature-panel {
  background-color: #1a1d12 !important;
}

/* Titlurile din celulele mici */
body.dark-mode .schematic-title {
  color: #e2e5d8 !important;
}

/* Iconițele din celule */
body.dark-mode .schematic-icon {
  color: #e3ff04 !important;
}

/* 3. No hover interaction on schematic panels in dark mode */
body.dark-mode .schematic-feature-panel {
  cursor: default !important;
}

body.dark-mode .schematic-feature-panel:hover {
  background-color: #1a1d12 !important;
  border-color: #2c3020 !important;
}

body.dark-mode .schematic-feature-panel:hover .schematic-title {
  color: #e2e5d8 !important;
}

body.dark-mode .schematic-feature-panel:hover .schematic-icon {
  transform: none !important;
}

/* Fix pentru liniile de demarcație ale grid-ului */
body.dark-mode .schematic-grid {
  border-top: 1px solid #2c3020 !important;
  border-left: 1px solid #2c3020 !important;
}
/* ================================================================
   FIX PENTRU MOSAIC GRID (Integrated Procurement Solutions)
   ================================================================ */

/* 1. Resetăm fundalurile pentru piesele care devin albe/gri în Dark Mode */
body.dark-mode .mosaic-tile.tile-1,
body.dark-mode .mosaic-tile.tile-5 {
  background-color: #080900 !important; /* Negru intens, similar cu restul secțiunilor dark */
  border: 1px solid rgba(227, 255, 4, 0.1) !important;
}

body.dark-mode .mosaic-tile.tile-2,
body.dark-mode .mosaic-tile.tile-4 {
  background-color: #1a1d12 !important; /* Gri-oliv închis pentru contrast mediu */
  border: 1px solid #2c3020 !important;
}

/* 2. Piesa 3 (cea galbenă - accent) o lăsăm galbenă, dar ne asigurăm că textul e negru pentru lizibilitate */
body.dark-mode .mosaic-tile.tile-3 {
  background-color: var(--theme-color) !important;
}

body.dark-mode .mosaic-tile.tile-3 h4 {
  color: #0a0c00 !important; /* Text negru pe fundal galben */
}

/* 3. Corecții pentru textele și iconițele din piesele întunecate */
body.dark-mode .mosaic-tile h4 {
  color: #ffffff !important;
}

body.dark-mode .mosaic-tile.tile-2 h4,
body.dark-mode .mosaic-tile.tile-4 h4 {
  color: #e2e5d8 !important;
}

/* Ajustăm vizibilitatea iconițelor de fundal (watermark) */
body.dark-mode .mosaic-icon {
  opacity: 0.1 !important;
  color: var(--theme-color) !important;
}

/* 4. Efectul de hover pe Dark Mode */
body.dark-mode .mosaic-tile:hover {
  transform: scale(0.98);
  border-color: var(--theme-color) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}

body.dark-mode .mosaic-tile:hover .mosaic-icon {
  opacity: 0.4 !important;
}
/* ================================================================
   FIX PENTRU SUSTAINABILITY CARDS (Sustainability and Compliance)
   ================================================================ */

/* Targetăm ambele tipuri de carduri din această secțiune */
body.dark-mode .sustain-card,
body.dark-mode .sustain-card-wide {
  background-color: #1a1d12 !important; /* Gri-oliv închis */
  border: 1px solid #2c3020 !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2) !important;
}

/* Modificăm culoarea titlurilor din carduri */
body.dark-mode .sustain-card h4,
body.dark-mode .sustain-card-wide h4 {
  color: #ffffff !important;
}

/* Modificăm culoarea textului descriptiv */
body.dark-mode .sustain-card p,
body.dark-mode .sustain-card-wide p {
  color: #b0b4a6 !important;
}

/* Iconițele rămân galbene, dar le adăugăm un mic efect de iluminare */
body.dark-mode .sustain-icon i {
  color: #e3ff04 !important;
  filter: drop-shadow(0 0 5px rgba(227, 255, 4, 0.2));
}

/* Efectul de Hover: Cardul devine puțin mai luminos */
body.dark-mode .sustain-card:hover,
body.dark-mode .sustain-card-wide:hover {
  background-color: #222518 !important;
  border-color: #e3ff04 !important;
  transform: translateY(-10px);
}

/* Excepție pentru cardul marcat ca "highlight" (Global Compliance) */
body.dark-mode .sustain-card.highlight {
  background-color: #080900 !important; /* Negru intens pentru a ieși în evidență */
  border: 1px solid var(--theme-color) !important;
}

/* Ajustăm pseudo-elementul pentru gradientul de fundal de la hover */
body.dark-mode .sustain-card::after {
  background: radial-gradient(
    circle,
    rgba(227, 255, 4, 0.05) 0%,
    transparent 70%
  ) !important;
}
/* ================================================================
   FIX PENTRU INNOVATION PANELS (Interactive Expanding Panels)
   ================================================================ */

/* 1. Starea implicită a panourilor (cele restrânse) */
body.dark-mode .innovation-panel {
  background-color: #12140b !important; /* Un negru-oliv foarte închis */
  border: 1px solid #2c3020 !important;
}

/* 2. Panoul ACTIV sau la HOVER (cel care se extinde și era crem) */
body.dark-mode .innovation-panel.active,
body.dark-mode .innovation-panel:hover {
  background-color: #1a1d12 !important; /* Gri-oliv închis corelat cu restul cardurilor */
  border-color: var(
    --theme-color
  ) !important; /* Bordură galbenă pentru focus */
}

/* 3. Corecții text în interiorul panourilor */
body.dark-mode .innovation-panel .panel-title {
  color: #ffffff !important; /* Titlul alb pur */
}

body.dark-mode .innovation-panel .panel-text {
  color: #b0b4a6 !important; /* Textul descriptiv gri deschis */
}

/* 4. Stil pentru tag-urile din subsolul panoului (Workshops, Co-creation etc.) */
body.dark-mode .panel-tags span {
  background: rgba(
    227,
    255,
    4,
    0.05
  ) !important; /* Fundal galben foarte discret */
  color: #e3ff04 !important; /* Text galben de brand */
  border: 1px solid rgba(227, 255, 4, 0.2) !important;
}

/* 5. Iconița mare din fundal (Watermark-ul panoului) */
body.dark-mode .panel-bg-icon {
  color: rgba(
    255,
    255,
    255,
    0.03
  ) !important; /* Foarte subtilă pe fundal negru */
}

body.dark-mode .innovation-panel:hover .panel-bg-icon,
body.dark-mode .innovation-panel.active .panel-bg-icon {
  color: rgba(
    227,
    255,
    4,
    0.05
  ) !important; /* Devine ușor galbenă la activare */
}

/* 6. Numărul panoului (dacă există clasa .panel-number) */
body.dark-mode .panel-number {
  color: var(--theme-color) !important;
}
/* Transformă logo-ul în alb pur în Dark Mode */
body.dark-mode .nav-logo img {
  filter: brightness(0) invert(1) !important;
}

/* ================================================================
   DARKMODE PATCH — All reviewed fixes
   ================================================================ */

/* ── 1. Logo: full white in dark mode ───────────────────────────── */
body.dark-mode .nav-logo img,
body.dark-mode .footer-logo img {
  filter: brightness(0) invert(1) !important;
}

/* ── 2. Marquee: keep green bg + dark text ──────────────────────── */
body.dark-mode .marquee-wrap {
  background: #78ba8a !important;
}
body.dark-mode .marquee-wrap .marquee__group .m-item a,
body.dark-mode .marquee-wrap .marquee__group .m-item a i {
  color: #0a0c00 !important;
}

/* ── 3. kinetic-tech-wrap: restore dark bg in dark mode ─────────── */
body.dark-mode .kinetic-tech-wrap {
  background: #0a0c05 !important;
}
body.dark-mode .kinetic-tech-wrap .tech-glitch-text,
body.dark-mode .kinetic-tech-wrap .tech-glitch-text .text-theme {
  color: #e2e5d8 !important;
  -webkit-text-fill-color: #e2e5d8 !important;
}
body.dark-mode .kinetic-tech-wrap .kinetic-subtext {
  color: rgba(176, 180, 166, 0.6) !important;
}
body.dark-mode .kinetic-tech-wrap .tech-statement-box {
  border-left-color: var(--theme-color) !important;
}
body.dark-mode .kinetic-tech-wrap .tech-moving-bar {
  background: var(--theme-color) !important;
}
body.dark-mode .kinetic-tech-wrap .text-white {
  color: rgba(255, 255, 255, 0.8) !important;
}
body.dark-mode .kinetic-tech-wrap .text-theme.fw-bold,
body.dark-mode .kinetic-tech-wrap .text-theme {
  color: var(--theme-color) !important;
}
body.dark-mode .kinetic-grid-bg {
  background-image: radial-gradient(
    circle at 2px 2px,
    rgba(227, 255, 4, 0.05) 1px,
    transparent 0
  ) !important;
}

/* ── 4. Analytical Thinkers section: icons visible in dark mode ─── */
/* Light-mode fix changes bg to green. In dark mode restore dark bg. */
body.dark-mode section.space.bg-title.overflow-hidden:has(.feature-static-wrap),
body.dark-mode section.space-extra.bg-title.overflow-hidden:has(.offer-card) {
  background-color: #080900 !important;
}
body.dark-mode
  section.space.bg-title.overflow-hidden:has(.feature-static-wrap)
  .text-white,
body.dark-mode
  section.space.bg-title.overflow-hidden:has(.feature-static-wrap)
  .sec-title,
body.dark-mode
  section.space-extra.bg-title.overflow-hidden:has(.offer-card)
  .text-white {
  color: #e2e5d8 !important;
}
/* feature-card bg-white → dark card in dark mode */
body.dark-mode
  section.space.bg-title.overflow-hidden:has(.feature-static-wrap)
  .feature-card.bg-white {
  background: #1e2116 !important;
}
body.dark-mode
  section.space.bg-title.overflow-hidden:has(.feature-static-wrap)
  .feature-card.bg-white
  h4,
body.dark-mode
  section.space.bg-title.overflow-hidden:has(.feature-static-wrap)
  .feature-card.bg-white
  p {
  color: #b0b4a6 !important;
}
/* SVG icons: white on dark card */
body.dark-mode
  section.space.bg-title.overflow-hidden:has(.feature-static-wrap)
  .feature-card-icon
  img {
  filter: brightness(0) invert(1) !important;
}

/* ── 5. Strong Communicators: service-card2 icons in dark mode ───── */
body.dark-mode .service-card2 .box-icon img {
  filter: brightness(0) invert(1) !important;
}

/* ── 6. Automation section: auto-card-modern dark bg ───────────── */
body.dark-mode .automation-matrix-wrap {
  background-color: #0d0f07 !important;
}
body.dark-mode .auto-card-modern {
  background: #1a1d12 !important;
  border-color: #2c3020 !important;
}
body.dark-mode .auto-card-modern h4,
body.dark-mode .auto-card-modern .h5 {
  color: #e2e5d8 !important;
}
body.dark-mode .auto-card-modern p {
  color: #b0b4a6 !important;
}
body.dark-mode .auto-card-tag {
  background: #0a0c00 !important;
  color: var(--theme-color) !important;
}

/* ── 7. feature-card-icon img: invert globally in dark mode ─────── */
body.dark-mode .feature-card-icon img {
  filter: brightness(0) invert(1) !important;
}

/* ── 8. bg-theme sections: text stays dark (green bg unchanged) ─── */
body.dark-mode .bg-theme .sec-title,
body.dark-mode .bg-theme h1,
body.dark-mode .bg-theme h2,
body.dark-mode .bg-theme h3,
body.dark-mode .bg-theme h4 {
  color: #0a0c00 !important;
}
body.dark-mode .bg-theme p,
body.dark-mode .bg-theme .sec-text {
  color: rgba(10, 12, 0, 0.8) !important;
}

/* ── 9. Sub-title in dark mode stays legible ────────────────────── */
body.dark-mode .sub-title:not(.text-white) {
  color: #000 !important;
}
body.dark-mode .sub-title:not(.text-white)::after {
  background: var(--theme-color) !important;
}

/* ── 10. Legal pages dark ───────────────────────────────────────── */
body.dark-mode #terms-content,
body.dark-mode #privacy-content,
body.dark-mode #cookie-content {
  background-color: #13150e !important;
}
body.dark-mode .terms-text-wrap h4,
body.dark-mode .terms-text-wrap .h5 {
  color: #e2e5d8 !important;
  border-color: #2c3020 !important;
}
body.dark-mode .terms-text-wrap p,
body.dark-mode .terms-text-wrap li {
  color: #b0b4a6 !important;
}
body.dark-mode .widget_nav_menu .widget_title {
  color: #e2e5d8 !important;
}
body.dark-mode .widget_nav_menu .menu li a {
  color: #b0b4a6 !important;
}
body.dark-mode .widget_nav_menu .menu li a:hover {
  color: var(--theme-color) !important;
}
body.dark-mode .terms-text-wrap .feature-card.bg-smoke {
  background: #1a1d12 !important;
  border-color: var(--theme-color) !important;
}

/* ── 11. Contact form dark mode ─────────────────────────────────── */
body.dark-mode .contact-form-wrap.bg-white {
  background: #1a1d12 !important;
  border-color: #2c3020 !important;
}
body.dark-mode .contact-card {
  border-color: #2c3020 !important;
}
body.dark-mode .contact-card .box-title {
  color: #e2e5d8 !important;
}
body.dark-mode .contact-card .box-text,
body.dark-mode .contact-card a {
  color: #b0b4a6 !important;
}
body.dark-mode .form-control.style-border {
  background: #1e2116 !important;
  border-color: #2c3020 !important;
  color: #e2e5d8 !important;
}
body.dark-mode .form-control.style-border::placeholder {
  color: rgba(176, 180, 166, 0.5) !important;
}
body.dark-mode #math-question {
  background: #1a1d12 !important;
  border-color: #2c3020 !important;
  color: var(--theme-color) !important;
}

/* ================================================================
   DARK MODE RESTORE: section.bg-gray și div.bg-title în bg-smoke
   (secțiunile convertite la alb în light mode, revenite la dark)
   ================================================================ */

/* bg-gray: restaurare fundal dark */
body.dark-mode section.bg-gray {
  background-color: #131312 !important;
}

body.dark-mode section.bg-gray .text-white,
body.dark-mode section.bg-gray h2,
body.dark-mode section.bg-gray h4,
body.dark-mode section.bg-gray .sec-title {
  color: #e2e5d8 !important;
}

body.dark-mode section.bg-gray p,
body.dark-mode section.bg-gray .sec-text,
body.dark-mode section.bg-gray .text-smoke {
  color: rgba(226, 229, 216, 0.7) !important;
}

body.dark-mode section.bg-gray .opacity-75,
body.dark-mode section.bg-gray .opacity-50 {
  opacity: 0.75 !important;
}

body.dark-mode section.bg-gray .sub-title {
  color: var(--theme-color) !important;
  border-color: rgba(227, 255, 4, 0.3) !important;
}

body.dark-mode section.bg-gray .feature-card.style2 {
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode section.bg-gray .feature-card.style2 h4,
body.dark-mode section.bg-gray .feature-card.style2 .feature-card-title,
body.dark-mode section.bg-gray .feature-card.style2 .text-white {
  color: #e2e5d8 !important;
}

body.dark-mode section.bg-gray .feature-card-icon {
  filter: brightness(99) grayscale(99) !important;
}

/* bg-smoke .bg-title dark card: restaurare în dark mode */
body.dark-mode section.bg-smoke .bg-title {
  background-color: #080900 !important;
}

body.dark-mode section.bg-smoke .bg-title .text-white,
body.dark-mode section.bg-smoke .bg-title h2,
body.dark-mode section.bg-smoke .bg-title h4 {
  color: #ffffff !important;
}

body.dark-mode section.bg-smoke .bg-title p,
body.dark-mode section.bg-smoke .bg-title .sec-text {
  color: rgba(255, 255, 255, 0.7) !important;
}

body.dark-mode section.bg-smoke .bg-title .opacity-75 {
  opacity: 0.75 !important;
}

body.dark-mode section.bg-smoke .bg-title .border-start {
  border-left-color: rgba(255, 255, 255, 0.1) !important;
}

/* Quote icon: alb în dark mode (pe bg-title) */
body.dark-mode .bg-title .quote-icon img {
  filter: brightness(0) invert(1) !important;
}

/* ================================================================
   TRANZIȚIE FLUIDĂ ÎNTRE MODURI
   Activ DOAR în timpul toggle-ului (clasa adăugată temporar de JS)
   ================================================================ */
body.theme-transitioning,
body.theme-transitioning *,
body.theme-transitioning *::before,
body.theme-transitioning *::after {
  transition:
    background-color 0.35s ease,
    background 0.35s ease,
    color 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease,
    fill 0.35s ease,
    stroke 0.35s ease,
    filter 0.35s ease !important;
}
/* ================================================================
   FIX PENTRU RISK MANAGEMENT TIMELINE (DARK MODE)
   ================================================================ */

/* 1. Schimbăm fundalul cardurilor albe într-un gri-oliv închis */
body.dark-mode .risk-timeline-item {
  background: #1a1d12 !important; /* Culoarea închisă a temei tale */
  border: 1px solid rgba(227, 255, 4, 0.1) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
}

/* 2. Forțăm textul din interior să fie vizibil (alb/gri deschis) */
body.dark-mode .risk-timeline-item h4 {
  color: #e2e5d8 !important; /* Variabila ta --title-color din dark mode */
}

/* 3. Ajustăm linia verticală a timeline-ului să fie vizibilă pe negru */
body.dark-mode .risk-timeline-line {
  background-color: rgba(255, 255, 255, 0.1) !important;
}

/* 4. Stil pentru nodurile (punctele) de pe timeline */
body.dark-mode .risk-node {
  background: #0a0c00 !important;
  border-color: rgba(227, 255, 4, 0.4) !important;
}

/* 5. Efect de Hover: cardul se luminează ușor și nodul devine verde/galben */
body.dark-mode .risk-timeline-item:hover {
  background: #222518 !important;
  border-color: var(--theme-color) !important;
}

body.dark-mode .risk-timeline-item:hover .risk-node {
  background: var(--theme-color) !important;
  box-shadow: 0 0 15px var(--theme-color) !important;
}
/* ================================================================
   FIX PENTRU FORTRESS PANELS (RISK & RESILIENCE) ÎN DARK MODE
   ================================================================ */

/* 1. Transformăm cardurile deschise în carduri întunecate */
body.dark-mode .fortress-panel {
  background: #1a1d12 !important; /* Gri-oliv închis conform temei */
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
  border-top: 4px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4) !important;
}

/* 2. Forțăm titlul să fie alb/gri deschis pentru contrast */
body.dark-mode .fortress-title {
  color: #e2e5d8 !important; /* Variabila --title-color din Dark Mode */
}

/* 3. Iconițele rămân verzi/galbene dar le dăm un mic efect de strălucire */
body.dark-mode .fortress-icon {
  color: var(--theme-color) !important;
  opacity: 1 !important;
  filter: drop-shadow(0 0 5px rgba(120, 186, 138, 0.2)) !important;
}

/* 4. Efectul de Hover în Dark Mode */
body.dark-mode .fortress-panel:hover {
  background: #222518 !important; /* Puțin mai deschis la atingere */
  border-top-color: var(--theme-color) !important;
  transform: translateY(-20px);
}
/* ================================================================
   OPTIMIZARE FORMULAR CONTACT PENTRU CONTRAST MAXIM (DARK MODE)
   ================================================================ */

/* 1. Containerul formularului - îi dăm o bordură subtilă pentru a-l separa de restul paginii */
body.dark-mode .contact-form-wrap {
  background-color: #1a1d12 !important; /* Gri-oliv închis */
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
  padding: 40px !important;
}

/* 2. Câmpurile de Input și Textarea - le facem vizibile prin contrast de nuanță */
body.dark-mode .contact-form-wrap .form-control,
body.dark-mode .contact-form-wrap input,
body.dark-mode .contact-form-wrap textarea {
  background-color: #222518 !important; /* O nuanță mai deschisă decât fundalul secțiunii */
  color: #e2e5d8 !important; /* Text alb-gri deschis */
  border: 1px solid #2c3020 !important; /* Bordură definită, nu doar jos */
  border-radius: 8px !important; /* Colțuri rotunjite pentru aspect modern */
  padding: 15px 20px !important;
  transition: all 0.3s ease !important;
}

/* 3. Efectul de FOCUS - când utilizatorul selectează câmpul */
body.dark-mode .contact-form-wrap .form-control:focus,
body.dark-mode .contact-form-wrap input:focus,
body.dark-mode .contact-form-wrap textarea:focus {
  border-color: var(
    --theme-color
  ) !important; /* Bordura devine verde-salvie la click */
  background-color: #282b1d !important; /* Se luminează ușor fundalul */
  box-shadow: 0 0 10px rgba(120, 186, 138, 0.1) !important;
  outline: none !important;
}

/* 4. Placeholder - textul care dispare când scrii */
body.dark-mode .contact-form-wrap input::placeholder,
body.dark-mode .contact-form-wrap textarea::placeholder {
  color: rgba(
    176,
    180,
    166,
    0.5
  ) !important; /* Text de sugestie semi-transparent */
}
/* ================================================================
   FORCE OVERRIDE: ICONIȚE ALBE ÎN DARK MODE (FIX FINAL)
   ================================================================ */

/* Folosim selectorul ultra-specific identificat în inspectorul browserului */
body.dark-mode
  section.space.bg-title.overflow-hidden:has(.feature-static-wrap)
  .feature-card.bg-white
  .feature-card-icon
  img {
  filter: brightness(0) invert(1) !important;
  -webkit-filter: brightness(0) invert(1) !important; /* Pentru suport Safari */
}

/* Aplicăm aceeași logică și pentru cardurile cu clasa .bg-theme dacă este cazul */
body.dark-mode
  section.space.bg-title.overflow-hidden:has(.feature-static-wrap)
  .feature-card.bg-theme
  .feature-card-icon
  img {
  filter: brightness(0) invert(1) !important;
}
/* ================================================================
   FIX CORECTAT: Subtitluri albe în Dark Mode (Specificitate ridicată)
   ================================================================ */

/* Folosim exact același selector din darkmode.css pentru a-l suprascrie cu succes */
body.dark-mode .sub-title,
body.dark-mode .sub-title:not(.text-white) {
  color: white !important;
}

/* Păstrăm linia decorativă în culoarea de accent (verde) */
body.dark-mode .sub-title::after,
body.dark-mode .sub-title:not(.text-white)::after {
  background: white !important;
}
/* ================================================================
   FIX DARK MODE: Cookie Popup Visibility
   ================================================================ */

/* Fundalul principal al popup-ului în Dark Mode */
body.dark-mode .cookie-popup {
  background-color: #1a1d12 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* Titlurile mari și textul principal */
body.dark-mode .cookie-popup b,
body.dark-mode .cookie-popup .class-title,
body.dark-mode .cookie-popup .cookie-cat-name,
body.dark-mode .cookie-popup .sub-title {
  color: #e2e5d8 !important; /* Alb-crem din tema ta */
}

/* Paragrafele și descrierile cookie-urilor */
body.dark-mode .cookie-popup p,
body.dark-mode .cookie-popup .cat-describe {
  color: #b0b4a6 !important; /* Gri deschis */
}

/* Casetele individuale pentru categorii (ex: Necessary, Statistics) */
body.dark-mode .cookie-cookies-display .cookie-category,
body.dark-mode .cookie-consent .cookie-category {
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Stil pentru Tab-uri (Cookie List / About Cookies) */
body.dark-mode .cookie-popup-container .tab-wrap {
  background: #0a0c00 !important; /* Fundalul cel mai închis */
}

body.dark-mode .cookie-popup-container .tab + label {
  color: #b0b4a6 !important;
}

body.dark-mode .cookie-popup-container .tab:checked + label {
  background-color: #1e2116 !important;
  color: #e3ff04 !important; /* Accentul galben/verde pe tab-ul activ */
}

/* Butonul de închidere/detalii (Gear icon) */
body.dark-mode .cookie-decide ul li.customize {
  color: #e2e5d8 !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
}

/* Divider-ul de deasupra butoanelor */
body.dark-mode .cookie-decide {
  border-top-color: rgba(255, 255, 255, 0.1) !important;
}
/* ================================================================
   FIX: Vizibilitate text buton "HIDE DETAILS" în Dark Mode
   ================================================================ */

/* Forțăm toate elementele de text din butonul customize să fie deschise la culoare */
body.dark-mode .cookie-popup .cookie-decide ul li.customize,
body.dark-mode .cookie-popup .cookie-decide ul li.customize span,
body.dark-mode .cookie-popup .cookie-decide ul li.customize i {
  color: #e2e5d8 !important; /* Culoarea crem deschis din tema ta */
}

/* Asigurăm vizibilitatea iconiței (gear icon) */
body.dark-mode .cookie-decide ul li.customize i {
  opacity: 0.8;
}

/* Opțional: Schimbăm culoarea la hover pentru un feedback vizual mai bun */
body.dark-mode .cookie-decide ul li.customize:hover {
  border-color: var(--theme-color) !important;
  color: var(--theme-color) !important;
}

body.dark-mode .cookie-decide ul li.customize:hover span,
body.dark-mode .cookie-decide ul li.customize:hover i {
  color: var(--theme-color) !important;
}
/* ================================================================
   FIX: Vizibilitate iconiță Supplier Onboarding (Dark Mode)
   ================================================================ */

/* Targetăm iconița din cardul de accent (piesa 3) în modul întunecat */
body.dark-mode #integrated-procurement .mosaic-tile.tile-3 .mosaic-icon {
  color: #0a0c00 !important; /* Forțăm culoarea neagră originală pentru contrast */
  opacity: 1 !important; /* Ne asigurăm că nu este transparentă */
  filter: none !important; /* Eliminăm orice filtru de inversare a culorii */
}

/* Dacă textul de sub iconiță are probleme de contrast, îl stabilizăm și pe el */
body.dark-mode #integrated-procurement .mosaic-tile.tile-3 h4 {
  color: #0a0c00 !important;
}
/* ================================================================
   FIX FINAL: Cookie Popup Clean-up (Dark Mode)
   ================================================================ */

/* 1. Eliminăm cercurile verzi și elementele grafice parazite de la Tab-uri */
body.dark-mode .cookie-popup-container .tab-wrap::before,
body.dark-mode .cookie-popup-container .tab-wrap::after,
body.dark-mode .cookie-popup-container .tab + label::before,
body.dark-mode .cookie-popup-container .tab + label::after {
  display: none !important;
}

/* 2. Reparăm butonul ALLOW ALL pentru contrast maxim */
body.dark-mode .cookie-decide ul li.allow {
  background-color: var(
    --theme-color
  ) !important; /* Galbenul brandului ca fundal */
  color: #0a0c00 !important; /* Text negru pe fundal galben */
  border: none !important;
}

/* 3. Reparăm butonul HIDE DETAILS (îi dăm text alb clar) */
body.dark-mode .cookie-decide ul li.customize {
  background-color: transparent !important;
  border: 2px solid rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
}

/* 4. Curățăm fundalul etichetelor Cookie List / About Cookies */
body.dark-mode .cookie-popup-container .tab-wrap {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

body.dark-mode .cookie-popup-container .tab:checked + label {
  background-color: var(--theme-color) !important;
  color: #000 !important;
}

/* 5. Eliminăm pictograma X roșie care apare peste text */
body.dark-mode .cookie-popup-container .tab-wrap .fa-xmark,
body.dark-mode .cookie-popup-container .tab-wrap .fa-times {
  display: none !important;
}

/* ================================================================
   CAPTCHA BOX — DARK MODE
   ================================================================ */

body.dark-mode .match-captcha-wrapper {
  background-color: #1e2116 !important;
  border-color: #3a3f2e !important;
}

body.dark-mode #resetBtn {
  border-color: #5a6040 !important;
  color: #c5c9bc !important;
  background: transparent !important;
}

body.dark-mode #resetBtn:hover {
  border-color: #e3ff04 !important;
  color: #e3ff04 !important;
}

/* ================================================================
   HERO BANNER — DARK MODE DISTINCTION
   Light mode: rgba(0,0,0,0.4) overlay (video shows through more)
   Dark mode:  darker overlay with a deep dark-green cast
   ================================================================ */

body.dark-mode .hero-video-overlay {
  background: linear-gradient(
    135deg,
    rgba(4, 18, 6, 0.78) 0%,
    rgba(0, 0, 0, 0.72) 100%
  ) !important;
}

/* Hero wrapper dark fallback */
body.dark-mode .hero-wrapper.hero-1 {
  background: #050a05 !important;
}

/* Orb / data-core: stronger glow in dark mode */
body.dark-mode .core-node {
  box-shadow: 0 0 30px rgba(227, 255, 4, 0.3), 0 0 60px rgba(227, 255, 4, 0.12) !important;
}

body.dark-mode .node-pulse {
  background: rgba(227, 255, 4, 0.25) !important;
}