/* =========================================================
   DAM Smart Dark Mode (OceanWP + Elementor)
   FIXED:
   - Chaty: restore red tooltip text
   - Remove white separator line between topbar and header
   - H1/H2 always RED in dark mode (strong specificity + placed last)
   - Complianz dark popup fixed
   - Keep other site text white
   ========================================================= */

:root {
  --dam-accent: #d32f2f;
  --dam-accent-hover: #b71c1c;

  --dam-dark-bg: #0b0f14;
  --dam-dark-surface: #121a24;
  --dam-dark-surface-2: #0f1720;

  --dam-dark-text: #ffffff;
  --dam-dark-muted: rgba(255,255,255,0.85);
  --dam-dark-border: rgba(255,255,255,0.12);

  --dam-dark-link: #ff4d4d;
  --dam-dark-link-hover: #ff1f1f;

  --dam-menu-bg: #2a3442;
  --dam-menu-hover: rgba(255,255,255,0.10);
  --dam-menu-text: #ffffff;

  --dam-mobile-menu-bg-darkmode: #2a3442;
  --dam-mobile-menu-hover-darkmode: rgba(255,255,255,0.10);

  --dam-field-bg: #2a3a52;
  --dam-field-border: rgba(255,255,255,0.22);

  --dam-nav-bg: #111a24;
  --dam-topbar-bg: #0b1f2e; /* כהה יותר */
}

html[data-dam-mode="dark"] { color-scheme: dark; }

/* =========================================================
   BASE
   ========================================================= */
html[data-dam-mode="dark"] body {
  background: var(--dam-dark-bg) !important;
  color: var(--dam-dark-text) !important;
}

/* ✅ טקסט בסיס לבן (בלי לצבוע כל DIV/SPAN בעולם) */
html[data-dam-mode="dark"] p,
html[data-dam-mode="dark"] li,
html[data-dam-mode="dark"] td,
html[data-dam-mode="dark"] th,
html[data-dam-mode="dark"] label,
html[data-dam-mode="dark"] small {
  color: var(--dam-dark-text) !important;
}

/* links */
html[data-dam-mode="dark"] a { color: var(--dam-dark-link) !important; }
html[data-dam-mode="dark"] a:hover { color: var(--dam-dark-link-hover) !important; }

/* =========================================================
   wrappers background reset
   ========================================================= */
html[data-dam-mode="dark"] #wrap,
html[data-dam-mode="dark"] #outer-wrap,
html[data-dam-mode="dark"] #main,
html[data-dam-mode="dark"] #content,
html[data-dam-mode="dark"] .site,
html[data-dam-mode="dark"] .content-area,
html[data-dam-mode="dark"] .container,
html[data-dam-mode="dark"] .site-content,
html[data-dam-mode="dark"] .page-content,
html[data-dam-mode="dark"] .entry-content,
html[data-dam-mode="dark"] .elementor,
html[data-dam-mode="dark"] .elementor-section-wrap {
  background: transparent !important;
}

/* =========================================================
   SECTIONS
   ========================================================= */
html[data-dam-mode="dark"] .elementor-section {
  background-color: var(--dam-dark-surface) !important;
}
html[data-dam-mode="dark"] .elementor-section:nth-of-type(even) {
  background-color: var(--dam-dark-surface-2) !important;
}

/* =========================================================
   NAV + TOP BAR
   ========================================================= */
html[data-dam-mode="dark"] #site-header,
html[data-dam-mode="dark"] #site-header-inner,
html[data-dam-mode="dark"] #site-navigation-wrap,
html[data-dam-mode="dark"] #site-navigation {
  background: var(--dam-nav-bg) !important;
  border-color: var(--dam-dark-border) !important;
  box-shadow: none !important;
}

/* ✅ TOP BAR darker + remove separator line */
html[data-dam-mode="dark"] #top-bar-wrap,
html[data-dam-mode="dark"] .top-bar-wrap {
  background: var(--dam-topbar-bg) !important;
  border: none !important;
  box-shadow: none !important;
}

/* ✅ Remove white line between topbar & header */
html[data-dam-mode="dark"] #top-bar-wrap:after,
html[data-dam-mode="dark"] #site-header:before,
html[data-dam-mode="dark"] #site-header:after,
html[data-dam-mode="dark"] #site-header-inner:before,
html[data-dam-mode="dark"] #site-header-inner:after {
  content: none !important;
  display: none !important;
}

/* dropdown desktop */
html[data-dam-mode="dark"] #site-navigation-wrap .dropdown-menu,
html[data-dam-mode="dark"] #site-navigation-wrap .dropdown-menu ul,
html[data-dam-mode="dark"] #site-navigation-wrap .dropdown-menu li ul {
  background: var(--dam-menu-bg) !important;
  border-color: var(--dam-dark-border) !important;
}
html[data-dam-mode="dark"] #site-navigation-wrap .dropdown-menu a,
html[data-dam-mode="dark"] #site-navigation-wrap .dropdown-menu li a {
  color: var(--dam-menu-text) !important;
}
html[data-dam-mode="dark"] #site-navigation-wrap .dropdown-menu a:hover,
html[data-dam-mode="dark"] #site-navigation-wrap .dropdown-menu li a:hover {
  background: var(--dam-menu-hover) !important;
  color: #ffffff !important;
}

/* special menu item red */
html[data-dam-mode="dark"] #site-navigation-wrap .menu-item-heichan-letrum-dam > a,
html[data-dam-mode="dark"] #site-navigation-wrap .menu-item-heichan-letrum-dam .dropdown-menu a,
html[data-dam-mode="dark"] #site-navigation-wrap a[title*="היכן לתרום דם"] {
  color: var(--dam-accent) !important;
}

/* =========================================================
   MOBILE MENU (SIDR)
   ========================================================= */
html[data-dam-mode="dark"] #sidr,
html[data-dam-mode="dark"] .sidr,
html[data-dam-mode="dark"] #mobile-dropdown,
html[data-dam-mode="dark"] #mobile-fullscreen,
html[data-dam-mode="dark"] .oceanwp-mobile-menu {
  background: var(--dam-mobile-menu-bg-darkmode) !important;
  border-color: var(--dam-dark-border) !important;
}

html[data-dam-mode="dark"] #sidr a,
html[data-dam-mode="dark"] .sidr a,
html[data-dam-mode="dark"] #mobile-dropdown a,
html[data-dam-mode="dark"] #mobile-fullscreen a {
  color: #ffffff !important;
}

html[data-dam-mode="dark"] #sidr .dropdown-toggle,
html[data-dam-mode="dark"] #sidr .dropdown-toggle:before,
html[data-dam-mode="dark"] .sidr .dropdown-toggle,
html[data-dam-mode="dark"] .sidr .dropdown-toggle:before {
  color: #ffffff !important;
}

html[data-dam-mode="dark"] #sidr .menu-item-heichan-letrum-dam > a,
html[data-dam-mode="dark"] #sidr .menu-item-heichan-letrum-dam a,
html[data-dam-mode="dark"] #mobile-dropdown .menu-item-heichan-letrum-dam > a,
html[data-dam-mode="dark"] #mobile-dropdown .menu-item-heichan-letrum-dam a {
  color: var(--dam-accent) !important;
}

/* =========================================================
   FORMS
   ========================================================= */
html[data-dam-mode="dark"] input,
html[data-dam-mode="dark"] textarea,
html[data-dam-mode="dark"] select {
  background: var(--dam-field-bg) !important;
  color: #ffffff !important;
  border-color: var(--dam-field-border) !important;
}
html[data-dam-mode="dark"] input::placeholder,
html[data-dam-mode="dark"] textarea::placeholder {
  color: rgba(255,255,255,0.70) !important;
}

/* =========================================================
   SIDEBAR / WIDGETS
   ========================================================= */
html[data-dam-mode="dark"] #secondary,
html[data-dam-mode="dark"] .widget-area,
html[data-dam-mode="dark"] .sidebar-box,
html[data-dam-mode="dark"] .widget-area .widget,
html[data-dam-mode="dark"] #secondary .widget {
  background: #101824 !important;
  border-color: var(--dam-dark-border) !important;
  box-shadow: none !important;
}

/* =========================================================
   CAPTIONS
   ========================================================= */
html[data-dam-mode="dark"] .wp-caption-text,
html[data-dam-mode="dark"] .gallery-caption,
html[data-dam-mode="dark"] figcaption {
  background: #1f2a38 !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.12) !important;
  padding: 6px 10px;
  border-radius: 4px;
}

/* =========================================================
   ✅ CHATY FIX
   - restore tooltip / strip red text
   ========================================================= */
html[data-dam-mode="dark"] .chaty-tooltip,
html[data-dam-mode="dark"] .chaty-tooltip *,
html[data-dam-mode="dark"] .chaty-channel .on-hover-text,
html[data-dam-mode="dark"] .chaty-channel .on-hover-text * {
  color: var(--dam-accent) !important;
}

/* אם הטקסט בתוך אלמנט ספציפי */
html[data-dam-mode="dark"] .chaty-cta-main .on-hover-text {
  color: var(--dam-accent) !important;
}

/* =========================================================
   ✅ COMPLIANZ (Cookie popup) - FULL DARK
   ========================================================= */
html[data-dam-mode="dark"] #cmplz-cookiebanner,
html[data-dam-mode="dark"] .cmplz-cookiebanner,
html[data-dam-mode="dark"] .cmplz-modal,
html[data-dam-mode="dark"] .cmplz-popup,
html[data-dam-mode="dark"] .cmplz-consent-modal {
  background: #111a24 !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.65) !important;
}

html[data-dam-mode="dark"] #cmplz-cookiebanner *,
html[data-dam-mode="dark"] .cmplz-cookiebanner *,
html[data-dam-mode="dark"] .cmplz-modal *,
html[data-dam-mode="dark"] .cmplz-popup * {
  color: #ffffff !important;
}

/* Buttons */
html[data-dam-mode="dark"] .cmplz-btn {
  background: #243246 !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
}
html[data-dam-mode="dark"] .cmplz-btn.cmplz-accept,
html[data-dam-mode="dark"] .cmplz-btn.cmplz-accept-all,
html[data-dam-mode="dark"] .cmplz-btn.cmplz-save-preferences {
  background: var(--dam-accent) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}

/* =========================================================
   TOGGLE BUTTON
   ========================================================= */
#dam-sdm-toggle {
  position: fixed;
  right: 10px;
  bottom: 10px;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.20);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 99999 !important;
}
#dam-sdm-toggle svg {
  width: 16px;
  height: 16px;
  fill: #1f2937;
}
html[data-dam-mode="dark"] #dam-sdm-toggle {
  background: rgba(255, 255, 255, 0.96) !important;
  border-color: rgba(0, 0, 0, 0.28) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.55);
}
html[data-dam-mode="dark"] #dam-sdm-toggle svg {
  fill: #0b0f14 !important;
}

/* ReCaptcha badge must stay hidden */
.grecaptcha-badge {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* =========================================================
   ✅ H1/H2 RED - MUST BE LAST (wins everything)
   ========================================================= */
html[data-dam-mode="dark"] h1,
html[data-dam-mode="dark"] h2,
html[data-dam-mode="dark"] h1 *,
html[data-dam-mode="dark"] h2 *,
html[data-dam-mode="dark"] .elementor-widget-heading .elementor-heading-title,
html[data-dam-mode="dark"] .elementor-widget-heading .elementor-heading-title * ,
html[data-dam-mode="dark"] .entry-title,
html[data-dam-mode="dark"] .page-header-title {
  color: var(--dam-accent) !important;
}
/* ✅ ONLY: make Elementor button text white in DARK mode */
html[data-dam-mode="dark"] a.elementor-button .elementor-button-text,
html[data-dam-mode="dark"] .elementor-button .elementor-button-text {
  color: #ffffff !important;
}
/* =========================================================
   ✅ wpDataTables (roles page) - DARK MODE FIX ONLY
   - make table dark + text white
   - keep borders subtle
   ========================================================= */
html[data-dam-mode="dark"] .wpDataTablesWrapper,
html[data-dam-mode="dark"] table.wpDataTable,
html[data-dam-mode="dark"] table.wpDataTable thead,
html[data-dam-mode="dark"] table.wpDataTable tbody,
html[data-dam-mode="dark"] table.wpDataTable tr,
html[data-dam-mode="dark"] table.wpDataTable td,
html[data-dam-mode="dark"] table.wpDataTable th {
  background: #111a24 !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.15) !important;
}

/* Header row slightly darker */
html[data-dam-mode="dark"] table.wpDataTable thead th {
  background: #0b1f2e !important;
  color: #ffffff !important;
}

/* Zebra rows - subtle alternation */
html[data-dam-mode="dark"] table.wpDataTable tbody tr:nth-child(even) td {
  background: #0f1720 !important;
}

/* Links inside table */
html[data-dam-mode="dark"] table.wpDataTable a {
  color: var(--dam-dark-link) !important;
}
html[data-dam-mode="dark"] table.wpDataTable a:hover {
  color: var(--dam-dark-link-hover) !important;
}

/* Search / length dropdown / filter area */
html[data-dam-mode="dark"] .wpDataTablesWrapper .dataTables_filter input,
html[data-dam-mode="dark"] .wpDataTablesWrapper .dataTables_length select {
  background: #2a3a52 !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.25) !important;
}

/* Pagination buttons */
html[data-dam-mode="dark"] .wpDataTablesWrapper .paginate_button,
html[data-dam-mode="dark"] .wpDataTablesWrapper .paginate_button a {
  background: #1a2636 !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
}
html[data-dam-mode="dark"] .wpDataTablesWrapper .paginate_button.current {
  background: var(--dam-accent) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}

/* =========================================================
   TOGGLE ICON SWITCH
   - Light mode: show MOON only
   - Dark mode: show SUN only
   (Prevents both icons showing together)
   ========================================================= */
#dam-sdm-toggle .dam-icon-sun { display: none !important; }
#dam-sdm-toggle .dam-icon-moon { display: inline-block !important; }

html[data-dam-mode="dark"] #dam-sdm-toggle .dam-icon-moon { display: none !important; }
html[data-dam-mode="dark"] #dam-sdm-toggle .dam-icon-sun  { display: inline-block !important; }
