/* ===== zia-dark-mode v1 (Soft Charcoal) — dark/light toggle · added 2026-06-13 ===== */
/* Toggle button: aligned to the site content width, under the search icon (desktop); beside the hamburger (mobile) */
#wrap-nav-header .container-inner{position:relative}
.zia-theme-toggle{position:absolute;z-index:5;left:24px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;background:none;border:0;border-radius:6px;cursor:pointer;color:#777;opacity:.9;transition:color .2s,background-color .2s,opacity .2s}
.zia-theme-toggle:hover{opacity:1;color:#dd9933}
.zia-theme-toggle svg{width:20px;height:20px;fill:currentColor;display:block}
.zia-theme-toggle .zia-sun{display:none}
@media(max-width:768px){.zia-theme-toggle{left:auto;right:84px}}
html[data-theme="dark"] .zia-theme-toggle{color:#9aa3ad}
html[data-theme="dark"] .zia-theme-toggle:hover{color:#dd9933;background-color:rgba(255,255,255,.06)}
html[data-theme="dark"] .zia-theme-toggle .zia-moon{display:none}
html[data-theme="dark"] .zia-theme-toggle .zia-sun{display:inline}

/* ---- Dark palette (Soft Charcoal) — accent matches the site's light-theme orange ---- */
html[data-theme="dark"]{--bg:#14161a;--surface:#1e2228;--surface2:#262b32;--text:#d4dae0;--title:#ffffff;--muted:#9aa3ad;--border:#2e343d;--accent:#dd9933}
html[data-theme="dark"] body,html[data-theme="dark"] #wrapper,html[data-theme="dark"] #page,html[data-theme="dark"] .boxed #page,html[data-theme="dark"] #main{background-color:var(--bg)!important;background-image:none!important}
html[data-theme="dark"] body{color:var(--text)!important}
html[data-theme="dark"] #header,html[data-theme="dark"] #header-content,html[data-theme="dark"] #header-sticky,html[data-theme="dark"] #wrap-nav-header,html[data-theme="dark"] #footer,html[data-theme="dark"] .flex-item,html[data-theme="dark"] .entry .wp-caption,html[data-theme="dark"] .alx-tabs-container,html[data-theme="dark"] .widget,html[data-theme="dark"] #sidebar .widget,html[data-theme="dark"] .comment-body,html[data-theme="dark"] .menu-toggle{background-color:var(--surface)!important}
html[data-theme="dark"] #header-ads,html[data-theme="dark"] .entry pre,html[data-theme="dark"] .entry code,html[data-theme="dark"] .entry table tr.alt,html[data-theme="dark"] input,html[data-theme="dark"] textarea{background-color:var(--surface2)!important}
html[data-theme="dark"] #wrap-nav-header,html[data-theme="dark"] .flex-item,html[data-theme="dark"] .entry .wp-caption,html[data-theme="dark"] #footer-bottom,html[data-theme="dark"] .entry pre,html[data-theme="dark"] hr,html[data-theme="dark"] input,html[data-theme="dark"] textarea,html[data-theme="dark"] .post-meta,html[data-theme="dark"] .menu-toggle{border-color:var(--border)!important}
html[data-theme="dark"] #header-content{border-top-color:#de9533!important;border-bottom-color:var(--border)!important}
html[data-theme="dark"] .entry,html[data-theme="dark"] .entry p,html[data-theme="dark"] .post,html[data-theme="dark"] p,html[data-theme="dark"] li,html[data-theme="dark"] .flex-item,html[data-theme="dark"] td,html[data-theme="dark"] .excerpt{color:var(--text)!important}
html[data-theme="dark"] .site-title a,html[data-theme="dark"] .post-title,html[data-theme="dark"] .post-title a,html[data-theme="dark"] .post-header .post-title,html[data-theme="dark"] .entry-title a,html[data-theme="dark"] .page-title h2,html[data-theme="dark"] .page .page-title h2,html[data-theme="dark"] .entry h1,html[data-theme="dark"] .entry h2,html[data-theme="dark"] .entry h3,html[data-theme="dark"] .entry h4{color:var(--title)!important;-webkit-text-fill-color:var(--title)!important;font-weight:600!important}
html[data-theme="dark"] .site-description,html[data-theme="dark"] .post-meta,html[data-theme="dark"] .post-meta a,html[data-theme="dark"] .post-meta li,html[data-theme="dark"] .entry .wp-caption-text,html[data-theme="dark"] #footer,html[data-theme="dark"] #footer a,html[data-theme="dark"] #footer-bottom,html[data-theme="dark"] #credit{color:var(--muted)!important}
html[data-theme="dark"] #nav a,html[data-theme="dark"] #access a,html[data-theme="dark"] .nav-menu a,html[data-theme="dark"] .main-navigation a,html[data-theme="dark"] .menu-toggle{color:var(--text)!important}
/* active menu item + menu hover → accent orange (same as light); cover span children + the painted -webkit fill */
html[data-theme="dark"] .main-navigation a[aria-current],html[data-theme="dark"] #nav a[aria-current],html[data-theme="dark"] .main-navigation a:hover,html[data-theme="dark"] #nav a:hover{color:#dd9933!important;-webkit-text-fill-color:#dd9933!important}
/* dropdown submenus → dark surface + light links (a theme override had forced them white) */
html[data-theme="dark"] #wrap-nav-header .nav-menu:not(.mobile) .menu ul,html[data-theme="dark"] .main-navigation .sub-menu,html[data-theme="dark"] .main-navigation .menu ul ul{background-color:var(--surface)!important;border-color:var(--border)!important}
html[data-theme="dark"] #wrap-nav-header .nav-menu:not(.mobile) .menu ul li,html[data-theme="dark"] .main-navigation .sub-menu li{border-color:var(--border)!important}
html[data-theme="dark"] #wrap-nav-header .nav-menu:not(.mobile) .menu ul a,html[data-theme="dark"] .main-navigation .sub-menu a{color:var(--text)!important;-webkit-text-fill-color:var(--text)!important}
html[data-theme="dark"] #wrap-nav-header .nav-menu:not(.mobile) .menu ul a:hover,html[data-theme="dark"] .main-navigation .sub-menu a:hover{color:var(--accent)!important;-webkit-text-fill-color:var(--accent)!important}
html[data-theme="dark"] .entry a,html[data-theme="dark"] .widget a{color:var(--accent)!important;-webkit-text-fill-color:var(--accent)!important}
html[data-theme="dark"] .post-title a:hover,html[data-theme="dark"] .entry-title a:hover,html[data-theme="dark"] .flex-item:hover .post-title a{color:var(--accent)!important;-webkit-text-fill-color:var(--accent)!important}
/* Sidebar "آخرین مطالب" (alx tabs) widget. Heading → light; category orange / title white; */
/* each link hovers INDEPENDENTLY (per-link a:hover, not whole-item): title->orange, category->white */
html[data-theme="dark"] .widget_alx_tabs h3,html[data-theme="dark"] .widget_alx_tabs h3 span,html[data-theme="dark"] .widget_alx_tabs h3 a,html[data-theme="dark"] .alx-tabs-nav,html[data-theme="dark"] .alx-tabs-nav a,html[data-theme="dark"] .alx-tabs-nav span{color:#ffffff!important;-webkit-text-fill-color:#ffffff!important}
html[data-theme="dark"] .alx-tab .tab-item-category a,html[data-theme="dark"] .alx-posts .post-item-category a{color:#dd9933!important;-webkit-text-fill-color:#dd9933!important}
html[data-theme="dark"] .alx-tab .tab-item-title a,html[data-theme="dark"] .alx-posts .post-item-title a{color:#ffffff!important;-webkit-text-fill-color:#ffffff!important}
html[data-theme="dark"] .alx-tab .tab-item-title a:hover,html[data-theme="dark"] .alx-posts .post-item-title a:hover{color:#dd9933!important;-webkit-text-fill-color:#dd9933!important}
html[data-theme="dark"] .alx-tab .tab-item-category a:hover,html[data-theme="dark"] .alx-posts .post-item-category a:hover{color:#ffffff!important;-webkit-text-fill-color:#ffffff!important}
html[data-theme="dark"] #footer-bottom #back-to-top{background-color:var(--surface2)!important;color:var(--text)!important}
html[data-theme="dark"] .toggle-search,html[data-theme="dark"] .toggle-search svg,html[data-theme="dark"] #nav .fa,html[data-theme="dark"] .post-meta i,html[data-theme="dark"] .menu-toggle-icon{color:var(--muted)!important;fill:var(--muted)!important}
html[data-theme="dark"] .toggle-search{border-color:var(--border)!important}
/* archive/excerpt "read more" fade: blend into the dark card (--surface 30,34,40) instead of white */
html[data-theme="dark"] .entry.excerpt::after{background:linear-gradient(to bottom,rgba(30,34,40,0) 0%,rgba(30,34,40,1) 100%)!important}
/* expanded search box: dark panel (was a white frame) + visible light input text (was #777); placeholder muted */
html[data-theme="dark"] .search-expand,html[data-theme="dark"] .search-expand-inner{background-color:var(--surface)!important;border-color:var(--border)!important}
html[data-theme="dark"] input,html[data-theme="dark"] textarea,html[data-theme="dark"] .search-expand input{color:var(--text)!important;-webkit-text-fill-color:var(--text)!important}
html[data-theme="dark"] input::placeholder,html[data-theme="dark"] textarea::placeholder{color:var(--muted)!important;-webkit-text-fill-color:var(--muted)!important;opacity:1}
/* form field labels (Contact Form 7 etc.) → light (were #222, invisible on dark); required marker keeps its accent */
html[data-theme="dark"] label,html[data-theme="dark"] .themeform label,html[data-theme="dark"] .wpcf7 label{color:var(--text)!important;-webkit-text-fill-color:var(--text)!important}
/* search-results page: the title is an <h1> (was black); the search form sits in a light .notebox panel */
html[data-theme="dark"] .page-title h1,html[data-theme="dark"] .page-title h3{color:var(--title)!important;-webkit-text-fill-color:var(--title)!important;font-weight:600!important}
html[data-theme="dark"] .notebox{background-color:var(--surface)!important;border-color:var(--border)!important;color:var(--text)!important}
/* parent-menu dropdown arrow (an svg-icon polygon, filled faint black) → light/visible */
html[data-theme="dark"] .has-arrow svg,html[data-theme="dark"] .has-arrow svg polygon,html[data-theme="dark"] .menu-item-wrapper button svg,html[data-theme="dark"] .menu-item-wrapper button svg polygon{fill:var(--text)!important}
/* FooGallery fullscreen lightbox (the .fg-panel) — was a white #eee panel → dark backdrop + light caption/thumbs/buttons */
html[data-theme="dark"] .fg-panel,html[data-theme="dark"] .fg-panel-content,html[data-theme="dark"] .fg-panel-area,html[data-theme="dark"] .fg-panel-area-inner,html[data-theme="dark"] .fg-media{background-color:var(--bg)!important}
html[data-theme="dark"] .fg-panel-info,html[data-theme="dark"] .fg-panel-info-inner,html[data-theme="dark"] .fg-panel-thumbs,html[data-theme="dark"] .fg-panel-thumb-inner,html[data-theme="dark"] .fg-panel-side,html[data-theme="dark"] .fg-panel-bottom,html[data-theme="dark"] .fg-panel-top{background-color:var(--surface)!important;border-color:var(--border)!important}
html[data-theme="dark"] .fg-panel-info,html[data-theme="dark"] .fg-panel-info *,html[data-theme="dark"] .fg-panel-caption,html[data-theme="dark"] .fg-panel-caption *,html[data-theme="dark"] .fg-media-caption,html[data-theme="dark"] .fg-media-caption *{color:var(--text)!important;-webkit-text-fill-color:var(--text)!important}
html[data-theme="dark"] .fg-panel-button,html[data-theme="dark"] .fg-panel-button svg,html[data-theme="dark"] .fg-panel-button svg *,html[data-theme="dark"] .fg-panel button svg,html[data-theme="dark"] .fg-panel svg{fill:var(--text)!important;color:var(--text)!important}
html[data-theme="dark"] .fg-panel-button,html[data-theme="dark"] .fg-panel-thumb,html[data-theme="dark"] .fg-panel-thumb-media{background-color:var(--surface)!important;border-color:var(--border)!important}
/* ===== end zia-dark-mode ===== */
