/* ==========================================================================
   GHK – Sötét mód
   A style.css után töltődik be. A világos megjelenést nem módosítja: minden
   szabály a <html data-theme="dark"> attribútumhoz kötött, amit a <head>-ben
   futó inline szkript állít be (inc/theme-mode.php), még a kirajzolás előtt.

   Felülírási minta: a szelektorok elé :where(:root[data-theme="dark"]) kerül.
   A :where() specificitása 0, így a felülírás pontosan az eredeti szabály
   specificitásával egyezik, és csak a későbbi betöltés miatt nyer – nem
   írja felül véletlenül a specifikusabb (pl. fehér szövegű) szabályokat.
   Ahol az eredeti !important, ott a felülírás is az.
   ========================================================================== */

/* 1. Téma-váltó gomb (mindkét módban) */
.ghk-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid var(--ghk-border);
  border-radius: 50%;
  background: transparent;
  color: var(--ghk-text-light);
  font-size: 16px;
  cursor: pointer;
  transition: color var(--ghk-transition), background-color var(--ghk-transition), border-color var(--ghk-transition);
}
.ghk-theme-toggle:hover {
  color: var(--ghk-sidebar-bg);
  background: var(--ghk-bg-light);
}
.ghk-theme-toggle:focus-visible {
  outline: 2px solid var(--ghk-accent-ink);
  outline-offset: 2px;
}
.ghk-theme-toggle .fa-solid { display: none; }
:root:not([data-theme-pref]) .ghk-theme-toggle__icon--auto,
:root[data-theme-pref="auto"] .ghk-theme-toggle__icon--auto,
:root[data-theme-pref="light"] .ghk-theme-toggle__icon--light,
:root[data-theme-pref="dark"] .ghk-theme-toggle__icon--dark { display: inline-block; }

/* 2. Sötét tokenek
   A márkaszínek (akcent, oldalsáv-kék, lábléc) maradnak – a Customizer
   értékeit sem írjuk felül. Csak a semleges felületek, a szövegek és a
   sötét háttéren gyenge kontrasztú kék kap új értéket. A kontrasztok a
   --ghk-bg-white felületen mérve WCAG AA felett vannak. */
:root[data-theme="dark"] {
  color-scheme: dark;

  --ghk-bg-light: #12171e;   /* oldal háttér (mély pala, nem fekete) */
  --ghk-bg-white: #1a2029;   /* kártyák, fejléc, fő tartalom */
  --ghk-surface-alt: #212934; /* #f8f9fa megfelelője: lenyíló menü, hover */
  --ghk-surface-muted: #262f3b; /* #f1f1f1 megfelelője */
  --ghk-border: #2f3946;
  --ghk-border-strong: #3c4755;

  --ghk-text: #e2e7ee;       /* 13:1 */
  --ghk-text-strong: #f2f5f9;
  --ghk-text-muted: #b7c0cc; /* #555 megfelelője, 8.6:1 */
  --ghk-text-soft: #a6b0bd;  /* #666 megfelelője, 7.2:1 */
  --ghk-text-light: #98a3b1; /* 6.3:1 */

  /* Szövegként/linkként használt kék: a #0077bb sötét háttéren csak 3.4:1,
     ezért világosabb árnyalat. Gombháttérnek a márkakék marad (solid). */
  --ghk-primary: #5cb3ea;    /* 7:1 */
  --ghk-primary-dark: #8fcbf2;
  --ghk-primary-solid: #0077bb; /* fehér szöveggel 4.8:1 */

  /* Címsorok: az oldalsáv-kék (Customizer) világosított változata */
  --ghk-heading: color-mix(in srgb, var(--ghk-sidebar-bg) 40%, #fff);

  --ghk-danger: #f07a7a;
  --ghk-success: #72cf7d;

  --ghk-shadow: 0 2px 8px rgba(0,0,0,0.45);
  --ghk-shadow-hover: 0 4px 16px rgba(0,0,0,0.6);
}

/* Az oldalsáv-kék sötét fejlécen gyenge, ezért a hover semleges felületet kap */
:where(:root[data-theme="dark"]) .ghk-theme-toggle:hover {
  color: var(--ghk-text);
  background: var(--ghk-surface-alt);
}

/* 3. Alap tipográfia és űrlapelemek */
:where(:root[data-theme="dark"]) :is(h1, h2, h3, h4, h5, h6),
:where(:root[data-theme="dark"]) .ghk-main__title {
  color: var(--ghk-heading);
}
:where(:root[data-theme="dark"]) :where(input, textarea, select) {
  color: var(--ghk-text);
}

/* 4. Fejléc és menü */
:where(:root[data-theme="dark"]) .ghk-header {
  background: var(--ghk-bg-white);
  box-shadow: 0 2px 6px rgba(0,0,0,0.4);
}
:where(:root[data-theme="dark"]) .ghk-header.is-scrolled {
  box-shadow: 0 4px 15px rgba(0,0,0,0.55);
}
/* Monokróm (fekete) logó → fehér; a beépített fehér SVG is fehér marad */
:where(:root[data-theme="dark"]) .ghk-header__logo img {
  filter: brightness(0) invert(1) !important;
}
:where(:root[data-theme="dark"]) .ghk-nav-toggle {
  color: var(--ghk-heading);
}
:where(:root[data-theme="dark"]) .ghk-mega-dropdown {
  background: var(--ghk-surface-alt) !important;
  box-shadow: 0 10px 25px rgba(0,0,0,0.5) !important;
}
:where(:root[data-theme="dark"]) .ghk-mega-list a {
  color: var(--ghk-text) !important;
}
:where(:root[data-theme="dark"]) .ghk-mega-column-title {
  background-color: var(--area-color, var(--ghk-primary-solid)) !important;
}
:where(:root[data-theme="dark"]) .ghk-mega-news-item {
  border-bottom-color: var(--ghk-border-strong) !important;
}
:where(:root[data-theme="dark"]) .ghk-mega-dropdown .ghk-mega-news-date {
  color: var(--ghk-text-soft) !important;
}
:where(:root[data-theme="dark"]) .ghk-mega-dropdown .ghk-mega-news-title a {
  color: var(--ghk-text-strong) !important;
}

/* 5. Területszínek
   A területszínek (pl. #0a0a0a, #cc0100, #ffcc00) háttérként fehér
   szöveggel mindkét módban működnek. Szövegként viszont a sötét
   árnyalatok eltűnnének, ezért sötét módban fehérrel keverjük őket –
   a színárnyalat felismerhető marad, a kontraszt AA fölé kerül. */
:where(:root[data-theme="dark"]) .ghk-mega-list a:hover,
:where(:root[data-theme="dark"]) .ghk-mega-dropdown a:hover {
  color: color-mix(in srgb, var(--area-color, var(--ghk-primary)) 45%, #fff) !important;
}
:where(:root[data-theme="dark"]) .ghk-main__title[style*="--area-color"] {
  color: color-mix(in srgb, var(--area-color) 45%, #fff) !important;
}
/* Nagyon sötét területszín-címkék ne olvadjanak a sötét kártyába */
:where(:root[data-theme="dark"]) .ghk-card__badge,
:where(:root[data-theme="dark"]) .ghk-rep-badge,
:where(:root[data-theme="dark"]) .wp-block-post-terms a,
:where(:root[data-theme="dark"]) .ghk-mega-dropdown .ghk-mega-news-badge {
  box-shadow: 0 0 0 1px rgba(255,255,255,0.18);
}
:where(:root[data-theme="dark"]) .ghk-nav-primary .ghk-menu > li[style*="--area-color"].current-menu-item > a,
:where(:root[data-theme="dark"]) .ghk-nav-primary .ghk-menu > li[style*="--area-color"].current-menu-ancestor > a {
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.18), 0 4px 10px rgba(0,0,0,0.3);
}

/* 6. Oldalsávok, kereső, naptár */
:where(:root[data-theme="dark"]) .ghk-sidebar-section {
  background: var(--ghk-bg-white);
  box-shadow: 0 2px 5px rgba(0,0,0,0.35);
}
:where(:root[data-theme="dark"]) .ghk-search-input:focus,
:where(:root[data-theme="dark"]) .ghk-search-dropdown {
  background: var(--ghk-bg-white);
}
:where(:root[data-theme="dark"]) .ghk-calendar__day--event:hover,
:where(:root[data-theme="dark"]) .ghk-calendar__day--event:focus-visible {
  background: var(--ghk-surface-muted);
}
:where(:root[data-theme="dark"]) .ghk-calendar__day--selected,
:where(:root[data-theme="dark"]) .ghk-calendar__day--selected:hover {
  background: var(--ghk-primary-solid);
}

/* 7. Kártyák, bejegyzéslisták, lapozó */
:where(:root[data-theme="dark"]) .ghk-card-clickable:hover {
  box-shadow: var(--ghk-shadow-hover);
}
:where(:root[data-theme="dark"]) .wp-block-post {
  background: var(--ghk-bg-white) !important;
  border-color: var(--ghk-border) !important;
  box-shadow: var(--ghk-shadow) !important;
}
:where(:root[data-theme="dark"]) .wp-block-post:hover {
  box-shadow: var(--ghk-shadow-hover) !important;
}
:where(:root[data-theme="dark"]) .wp-block-post-date {
  color: var(--ghk-text-soft) !important;
}
:where(:root[data-theme="dark"]) .wp-block-post-excerpt,
:where(:root[data-theme="dark"]) .wp-block-post-content,
:where(:root[data-theme="dark"]) .ghk-card-preview-content {
  color: var(--ghk-text-muted) !important;
}
/* Elhalványuló szövegvég: a kártya felületszínébe fusson ki */
:where(:root[data-theme="dark"]) .wp-block-post-excerpt::after,
:where(:root[data-theme="dark"]) .wp-block-post-content::after,
:where(:root[data-theme="dark"]) .ghk-card-preview-content::after {
  background: linear-gradient(transparent, var(--ghk-bg-white)) !important;
}
:where(:root[data-theme="dark"]) .wp-block-post:hover .wp-block-post-excerpt::after,
:where(:root[data-theme="dark"]) .wp-block-post:hover .wp-block-post-content::after,
:where(:root[data-theme="dark"]) .ghk-card-clickable:hover .ghk-card-preview-content::after {
  background: linear-gradient(transparent, var(--ghk-bg-white)) !important;
}
:where(:root[data-theme="dark"]) .ghk-pagination .page-numbers {
  background: var(--ghk-bg-white);
}

/* 8. Képviselők */
:where(:root[data-theme="dark"]) .ghk-rep-profile {
  background: var(--ghk-bg-white);
  box-shadow: var(--ghk-shadow);
}
:where(:root[data-theme="dark"]) .ghk-report-card {
  background: var(--ghk-surface-alt);
}
:where(:root[data-theme="dark"]) .ghk-report-card i {
  color: var(--ghk-danger);
}
:where(:root[data-theme="dark"]) .ghk-report-card:hover {
  background: var(--ghk-primary-solid);
  border-color: var(--ghk-primary-solid);
}
:where(:root[data-theme="dark"]) .ghk-report-card:hover i {
  color: #fff;
}

/* 9. Bejegyzés oldal */
:where(:root[data-theme="dark"]) .ghk-single-meta {
  color: var(--ghk-text-soft);
}
:where(:root[data-theme="dark"]) .ghk-single-deadline-box {
  background: var(--ghk-surface-alt);
}
:where(:root[data-theme="dark"]) .ghk-single__deadline--past { border-left-color: var(--ghk-danger); }
:where(:root[data-theme="dark"]) .ghk-single__deadline--upcoming { border-left-color: var(--ghk-success); }
:where(:root[data-theme="dark"]) .ghk-deadline-icon--past,
:where(:root[data-theme="dark"]) .ghk-deadline-status--past,
:where(:root[data-theme="dark"]) .ghk-attachment-icon { color: var(--ghk-danger); }
:where(:root[data-theme="dark"]) .ghk-deadline-icon--upcoming,
:where(:root[data-theme="dark"]) .ghk-deadline-status--upcoming { color: var(--ghk-success); }
:where(:root[data-theme="dark"]) .ghk-single__content {
  color: var(--ghk-text);
}
:where(:root[data-theme="dark"]) .ghk-single__content h2 {
  border-bottom-color: var(--ghk-border);
}
:where(:root[data-theme="dark"]) .ghk-single__content blockquote {
  color: var(--ghk-text-muted);
}
:where(:root[data-theme="dark"]) .ghk-attachments {
  border-top-color: var(--ghk-border);
}
:where(:root[data-theme="dark"]) .ghk-attachment-link {
  background: var(--ghk-surface-muted);
  color: var(--ghk-text);
}

/* 10. Gutenberg gombok: márkakék háttér, fehér szöveg (CLAUDE.md 4. pont).
   A hover (akcentszín) az eredeti, specifikusabb :hover szabályból jön. */
:where(:root[data-theme="dark"]) .wp-element-button,
:where(:root[data-theme="dark"]) body .wp-element-button,
:where(:root[data-theme="dark"]) body .wp-block-file__button,
:where(:root[data-theme="dark"]) body .wp-block-button__link,
:where(:root[data-theme="dark"]) .ghk-single__content .wp-element-button,
:where(:root[data-theme="dark"]) .ghk-single__content .wp-block-button__link {
  background-color: var(--ghk-primary-solid) !important;
}
:where(:root[data-theme="dark"]) .ghk-footer-social-btn:hover {
  background-color: var(--ghk-primary-solid) !important;
}
/* Fájl blokkok alapértelmezett gombszíne (inline var(--ghk-primary)) */
:where(:root[data-theme="dark"]) a.ghk-btn[style*="var(--ghk-primary)"] {
  background-color: var(--ghk-primary-solid) !important;
}

/* Akcent háttérként, fehér szöveggel/ikonnal. Ha a Customizer akcentszíne
   világos (pl. fehér), a --ghk-accent-ink a kékre esik vissza – ami sötét
   módban világos szövegkék. Ilyenkor a functions.php --ghk-accent-solid-ot ad
   (márkakék); különben maga az akcentszín marad. */
:where(:root[data-theme="dark"]) .ghk-search-btn:hover,
:where(:root[data-theme="dark"]) .ghk-calendar__nav--prev:hover,
:where(:root[data-theme="dark"]) .ghk-calendar__nav--next:hover,
:where(:root[data-theme="dark"]) .ghk-social-bar a:hover,
:where(:root[data-theme="dark"]) .ghk-rep-profile__positions .ghk-rep-badge {
  background: var(--ghk-accent-solid, var(--ghk-accent));
}
:where(:root[data-theme="dark"]) .ghk-pagination .page-numbers.current {
  background: var(--ghk-accent-solid, var(--ghk-accent));
  border-color: var(--ghk-accent-solid, var(--ghk-accent));
}

/* 11. Szerkesztőben beállított Gutenberg színek, amik sötéten eltűnnének */
:where(:root[data-theme="dark"]) .ghk-main .has-black-color { color: var(--ghk-text) !important; }
:where(:root[data-theme="dark"]) .ghk-main .has-white-background-color { background-color: var(--ghk-bg-white) !important; }
:where(:root[data-theme="dark"]) .ghk-main .is-style-stripes tbody tr:nth-child(odd) { background-color: var(--ghk-surface-alt); }

/* 12. Képek
   A tartalmi fotókat kissé tompítjuk (hover-re visszaáll), a támogatói
   logók – amik jellemzően sötét feliratúak, átlátszó háttérrel – fehér
   alátétet kapnak, hogy olvashatók maradjanak. */
:where(:root[data-theme="dark"]) :is(.ghk-single__content, .ghk-card, .wp-block-post) img {
  filter: brightness(0.9);
  transition: filter var(--ghk-transition);
}
:where(:root[data-theme="dark"]) :is(.ghk-single__content, .ghk-card, .wp-block-post) img:hover {
  filter: none;
}
/* Sötét, monokróm ikonkép (Kontúr): invertálás, a színárnyalat megtartásával */
:where(:root[data-theme="dark"]) .ghk-social-img {
  filter: invert(1) hue-rotate(180deg) !important;
}
:where(:root[data-theme="dark"]) .ghk-sponsor-list-image img {
  background: #fff;
  padding: 12px;
  border-radius: var(--ghk-radius);
}
