/* ==========================================================================
   FlightSim Dashwall — design layer
   Layout: Dashwall by Alexander Agnarson (GPL). Styling: FlightSim.asia.
   Titles: Unbounded · Headings & body: Archivo (variable) · Palette: Tailwind slate / yellow
   Loaded after style.css, responsive.css and dark.css.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Fonts (self-hosted, SIL OFL 1.1 — see fonts/flightsim/)
   -------------------------------------------------------------------------- */
@font-face { font-family: 'Unbounded'; font-style: normal; font-display: swap; font-weight: 200 900; src: url(fonts/flightsim/unbounded-latin-wght-normal.woff2) format('woff2-variations'), url(fonts/flightsim/unbounded-latin-wght-normal.woff2) format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Unbounded'; font-style: normal; font-display: swap; font-weight: 200 900; src: url(fonts/flightsim/unbounded-latin-ext-wght-normal.woff2) format('woff2-variations'), url(fonts/flightsim/unbounded-latin-ext-wght-normal.woff2) format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Unbounded'; font-style: normal; font-display: swap; font-weight: 200 900; src: url(fonts/flightsim/unbounded-vietnamese-wght-normal.woff2) format('woff2-variations'), url(fonts/flightsim/unbounded-vietnamese-wght-normal.woff2) format('woff2'); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; }
@font-face { font-family: 'Unbounded'; font-style: normal; font-display: swap; font-weight: 200 900; src: url(fonts/flightsim/unbounded-cyrillic-wght-normal.woff2) format('woff2-variations'), url(fonts/flightsim/unbounded-cyrillic-wght-normal.woff2) format('woff2'); unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116; }
@font-face { font-family: 'Unbounded'; font-style: normal; font-display: swap; font-weight: 200 900; src: url(fonts/flightsim/unbounded-cyrillic-ext-wght-normal.woff2) format('woff2-variations'), url(fonts/flightsim/unbounded-cyrillic-ext-wght-normal.woff2) format('woff2'); unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F; }

@font-face { font-family: 'Archivo'; font-style: normal; font-display: swap; font-weight: 100 900; src: url(fonts/flightsim/archivo-latin-wght-normal.woff2) format('woff2-variations'), url(fonts/flightsim/archivo-latin-wght-normal.woff2) format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Archivo'; font-style: normal; font-display: swap; font-weight: 100 900; src: url(fonts/flightsim/archivo-latin-ext-wght-normal.woff2) format('woff2-variations'), url(fonts/flightsim/archivo-latin-ext-wght-normal.woff2) format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Archivo'; font-style: normal; font-display: swap; font-weight: 100 900; src: url(fonts/flightsim/archivo-vietnamese-wght-normal.woff2) format('woff2-variations'), url(fonts/flightsim/archivo-vietnamese-wght-normal.woff2) format('woff2'); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; }
@font-face { font-family: 'Archivo'; font-style: italic; font-display: swap; font-weight: 100 900; src: url(fonts/flightsim/archivo-latin-wght-italic.woff2) format('woff2-variations'), url(fonts/flightsim/archivo-latin-wght-italic.woff2) format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: 'Archivo'; font-style: italic; font-display: swap; font-weight: 100 900; src: url(fonts/flightsim/archivo-latin-ext-wght-italic.woff2) format('woff2-variations'), url(fonts/flightsim/archivo-latin-ext-wght-italic.woff2) format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Archivo'; font-style: italic; font-display: swap; font-weight: 100 900; src: url(fonts/flightsim/archivo-vietnamese-wght-italic.woff2) format('woff2-variations'), url(fonts/flightsim/archivo-vietnamese-wght-italic.woff2) format('woff2'); unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB; }

/* --------------------------------------------------------------------------
   Tokens — light (default)  /  dark (body.dark)
   -------------------------------------------------------------------------- */
body {
	--fs-font-title: 'Unbounded', 'Archivo', system-ui, sans-serif;
	--fs-font-body: 'Archivo', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;

	--fs-bg: #f8fafc;            /* slate-50  */
	--fs-canvas: #f1f5f9;        /* slate-100 */
	--fs-surface: #ffffff;
	--fs-surface-2: #f1f5f9;     /* slate-100 */
	--fs-surface-3: #e2e8f0;     /* slate-200 */
	--fs-border: #e2e8f0;        /* slate-200 */
	--fs-border-strong: #cbd5e1; /* slate-300 */
	--fs-heading: #0f172a;       /* slate-900 */
	--fs-text: #334155;          /* slate-700 */
	--fs-muted: #64748b;         /* slate-500 */
	--fs-faint: #94a3b8;         /* slate-400 */

	--fs-accent: #eab308;        /* yellow-500 */
	--fs-accent-hover: #ca8a04;  /* yellow-600 */
	--fs-accent-soft: rgba(234,179,8,0.14);
	--fs-accent-ink: #a16207;    /* yellow-700: accent used as text on light bg (legible) */
	--fs-on-accent: #0f172a;     /* slate-900 */

	--fs-inverse: #0f172a;       /* slate-900: "Highlights" / post-nav panels */
	--fs-inverse-2: #1e293b;     /* slate-800 */
	--fs-on-inverse: #f8fafc;
	--fs-on-inverse-muted: #94a3b8;

	--fs-shadow: 0 1px 2px rgba(15,23,42,0.04), 0 4px 12px -2px rgba(15,23,42,0.06), 0 16px 32px -12px rgba(15,23,42,0.08);
	--fs-radius: 24px;

	background: var(--fs-bg);
	color: var(--fs-muted);
	font-family: var(--fs-font-body);
	font-optical-sizing: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}
body.dark {
	--fs-bg: #0f172a;            /* slate-900 */
	--fs-canvas: #0f172a;        /* slate-900 */
	--fs-surface: #1e293b;       /* slate-800 */
	--fs-surface-2: #334155;     /* slate-700 */
	--fs-surface-3: #475569;     /* slate-600 */
	--fs-border: rgba(148,163,184,0.14);
	--fs-border-strong: rgba(148,163,184,0.28);
	--fs-heading: #f8fafc;       /* slate-50  */
	--fs-text: #cbd5e1;          /* slate-300 */
	--fs-muted: #94a3b8;         /* slate-400 */
	--fs-faint: #64748b;         /* slate-500 */

	--fs-accent: #facc15;        /* yellow-400 */
	--fs-accent-hover: #fde047;  /* yellow-300 */
	--fs-accent-soft: rgba(250,204,21,0.12);
	--fs-accent-ink: #facc15;
	--fs-on-accent: #0f172a;

	--fs-inverse: #020617;       /* slate-950 */
	--fs-inverse-2: #1e293b;
	--fs-on-inverse: #f8fafc;
	--fs-on-inverse-muted: #94a3b8;

	--fs-shadow: 0 0 0 1px rgba(148,163,184,0.10), 0 8px 24px -8px rgba(2,6,23,0.6);
}

body,
body:where(.dark) { background: var(--fs-bg); color: var(--fs-muted); }

::selection { background: var(--fs-accent); color: var(--fs-on-accent); }
:focus-visible { outline: 2px solid var(--fs-accent); outline-offset: 2px; }

/* --------------------------------------------------------------------------
   Typography
   -------------------------------------------------------------------------- */
body input, body textarea, body button, body select, body label { font-family: var(--fs-font-body); }

/* Titles → Unbounded */
body .site-title,
body .page-header-title,
body .page-inner-title,
body .featured-large-title,
body .header-single-title,
body .blog-card-title,
body .highlights-card-title,
body .profile-card-title,
body .entry-header .entry-title,
body .entry-title,
body .page-title-box h1,
body .page-title-box h2,
body .notebox h2,
body .notebox h1 { font-family: var(--fs-font-title); font-weight: 600; letter-spacing: -0.01em; }

body .site-title { font-size: 22px; font-weight: 700; letter-spacing: -0.01em; }
body .featured-large-title { font-weight: 600; letter-spacing: -0.02em; line-height: 1.15; }
body .header-single-title { font-weight: 600; letter-spacing: -0.02em; line-height: 1.15; }
body .blog-card-title { font-size: 20px; line-height: 1.3; letter-spacing: -0.005em; }
body .highlights-card-title { font-size: 15px; line-height: 1.35; font-weight: 500; letter-spacing: 0; }
body .profile-card-title { font-size: 20px; }
body .page-inner-title { font-weight: 600; }

/* Other headings → Archivo */
body h1, body h2, body h3, body h4, body h5, body h6,
body .heading,
body .comment-reply-title,
body .stickywrap .stickywrap-heading,
body .widget > h3,
body .widget .wp-block-heading,
body .author-bio .bio-name { font-family: var(--fs-font-body); color: var(--fs-heading); }

body .entry h1, body .entry h2, body .entry h3,
body .entry h4, body .entry h5, body .entry h6 { font-family: var(--fs-font-body); font-weight: 700; letter-spacing: -0.015em; color: var(--fs-heading); }
body .entry h6 { letter-spacing: 0.08em; }

/* Section labels: small caps, tracked — FlightSim style */
body .stickywrap .stickywrap-heading,
body .widget > h3,
body .widget .wp-block-heading { font-size: 13px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fs-heading); }
body .stickywrap .stickywrap-heading i { color: var(--fs-accent-ink); }

/* Meta: dates, categories */
body .blog-card-date,
body .highlights-card-date,
body .featured-card-meta,
body .header-single-meta,
body .alx-tab .tab-item-date,
body .alx-posts .post-item-date,
body .widget_rss ul li span.rss-date { font-weight: 600; letter-spacing: 0.08em; }
body .blog-card-date { color: var(--fs-faint); }

body .blog-card-category a,
body .alx-tab .tab-item-category a,
body .alx-posts .post-item-category a { color: var(--fs-accent-ink); font-weight: 600; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; }
body .blog-card-category a:hover { color: var(--fs-heading); }

body .featured-card-category a,
body .header-single-category a { display: inline-block; background: var(--fs-accent); color: var(--fs-on-accent); font-size: 11px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; text-shadow: none; }
body .featured-card-category,
body .header-single-category { color: transparent; font-size: 0; }
body .featured-card-category a,
body .header-single-category a { margin-right: 4px; }
body .featured-card-category a:hover,
body .header-single-category a:hover { background: var(--fs-accent-hover); color: var(--fs-on-accent); }

/* --------------------------------------------------------------------------
   Links
   -------------------------------------------------------------------------- */
body a,
body:where(.dark) a { color: var(--fs-heading); }
body a:hover,
body:where(.dark) a:hover { color: var(--fs-accent-ink); }

body .entry { color: var(--fs-text); }
body .entry a { color: var(--fs-heading); text-decoration: underline; text-decoration-color: var(--fs-accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }
body .entry a:hover { color: var(--fs-accent-ink); }

/* --------------------------------------------------------------------------
   Page frame: header, canvas, sidebar rail
   -------------------------------------------------------------------------- */
body .page-header,
body .canvas-top,
body .canvas-bottom,
body:where(.dark) .page-header,
body:where(.dark) .canvas-bottom { background: var(--fs-bg); }

body .canvas-inner,
body:where(.dark) .canvas-inner { background: var(--fs-canvas); border: 1px solid var(--fs-border); }
body .canvas-inner:after { background: linear-gradient(0deg, transparent 0%, rgba(15,23,42,0.035) 100%); }
body.dark .canvas-inner:after { background: linear-gradient(0deg, transparent 0%, rgba(2,6,23,0.35) 100%); }

body .site-title a,
body:where(.dark) .site-title a { color: var(--fs-heading); }
body .site-title a:hover { color: var(--fs-heading); }
body .site-description,
body:where(.dark) .site-description { color: var(--fs-muted); font-weight: 400; }

body .page-sidebar,
body:where(.dark) .page-sidebar { box-shadow: inset -1px 0 0 var(--fs-border); }

body .page-sidebar .social-links .social-tooltip,
body:where(.dark) .page-sidebar .social-links .social-tooltip,
body .sharrre-header .sharrre .box,
body:where(.dark) .sharrre-header .sharrre .box { background: var(--fs-surface); color: var(--fs-heading); box-shadow: 0 0 0 1px var(--fs-border); transition: background .2s ease, color .2s ease; }
body .page-sidebar .social-links .social-tooltip:hover,
body:where(.dark) .page-sidebar .social-links .social-tooltip:hover { background: var(--fs-accent); color: var(--fs-on-accent); }

/* Tooltips */
body .social-links .social-tooltip:hover:after,
body .page-sidebar .social-links .social-tooltip:hover:after,
body:where(.dark) .page-sidebar .social-links .social-tooltip:hover:after,
body:where(.dark) .social-links .social-tooltip:hover:after { background: var(--fs-heading); color: var(--fs-bg); font-family: var(--fs-font-body); font-weight: 600; }
body .page-sidebar .social-links .social-tooltip:hover:before,
body:where(.dark) .page-sidebar .social-links .social-tooltip:hover:before { border-color: transparent var(--fs-heading); }
body .social-links .social-tooltip:hover:before,
body:where(.dark) .social-links .social-tooltip:hover:before { border-color: var(--fs-heading) transparent; }
body .page-sidebar .social-links .social-tooltip:hover:before { border-color: transparent var(--fs-heading); }

/* Theme toggle */
body #theme-toggle { background: var(--fs-surface); box-shadow: 0 0 0 1px var(--fs-border); }
body #theme-toggle-btn { background: var(--fs-surface-3); box-shadow: inset 0 1px 0 rgba(15,23,42,0.06); }
body #theme-toggle-btn:before { background: var(--fs-accent); }
body #theme-toggle i { color: var(--fs-on-accent); }
body.dark #theme-toggle-btn { background: var(--fs-surface-2); }
body.dark #theme-toggle-btn:before { background: var(--fs-accent); }
body.dark #theme-toggle i { color: var(--fs-on-accent); }

/* --------------------------------------------------------------------------
   Navigation
   -------------------------------------------------------------------------- */
body .nav-menu:not(.mobile) { font-size: 14px; font-weight: 500; }
body .nav-menu:not(.mobile) a,
body:where(.dark) .nav-menu:not(.mobile) a { color: var(--fs-muted); font-weight: 500; }
body .nav-menu:not(.mobile) .menu > li > span > a { position: relative; }
body .nav-menu:not(.mobile) .menu > li > span > a:after { content: ""; position: absolute; left: 0; right: 100%; bottom: -6px; height: 2px; border-radius: 2px; background: var(--fs-accent); transition: right .2s ease; }
body .nav-menu:not(.mobile) .menu > li > span > a:hover:after,
body .nav-menu:not(.mobile) .menu > li.current-menu-item > span > a:after,
body .nav-menu:not(.mobile) .menu > li.current_page_item > span > a:after { right: 0; }
body .nav-menu:not(.mobile) a:hover,
body:where(.dark) .nav-menu:not(.mobile) a:hover,
body .nav-menu:not(.mobile) li.current_page_item > span > a,
body .nav-menu:not(.mobile) li.current-menu-item > span > a,
body .nav-menu:not(.mobile) li.current-menu-ancestor > span > a,
body .nav-menu:not(.mobile) li.current-post-parent > span > a,
body:where(.dark) .nav-menu:not(.mobile) li.current_page_item > span > a,
body:where(.dark) .nav-menu:not(.mobile) li.current-menu-item > span > a,
body:where(.dark) .nav-menu:not(.mobile) li.current-menu-ancestor > span > a,
body:where(.dark) .nav-menu:not(.mobile) li.current-post-parent > span > a { color: var(--fs-heading); }

/* dropdowns */
body .nav-menu:not(.mobile) .menu ul,
body:where(.dark) .nav-menu:not(.mobile) .menu ul { background: var(--fs-inverse); color: var(--fs-on-inverse); border-radius: 14px; box-shadow: 0 0 0 1px var(--fs-border), 0 16px 32px -12px rgba(2,6,23,0.4); }
body .nav-menu:not(.mobile) .menu ul:after,
body:where(.dark) .nav-menu:not(.mobile) .menu ul:after { border-bottom-color: var(--fs-inverse); }
body .nav-menu:not(.mobile) .menu ul ul:after,
body:where(.dark) .nav-menu:not(.mobile) .menu ul ul:after { border-bottom-color: transparent; border-right-color: var(--fs-inverse); }
body .nav-menu-dropdown-left .nav-menu:not(.mobile) .menu ul ul:after,
body:where(.dark) .nav-menu-dropdown-left .nav-menu:not(.mobile) .menu ul ul:after { border-right-color: transparent; border-left-color: var(--fs-inverse); }
body .nav-menu:not(.mobile) ul ul a,
body:where(.dark) .nav-menu:not(.mobile) ul ul a { color: var(--fs-on-inverse-muted); }
body .nav-menu:not(.mobile) ul ul a:hover,
body:where(.dark) .nav-menu:not(.mobile) ul ul a:hover { color: var(--fs-accent); }
body .nav-menu:not(.mobile) ul ul span,
body:where(.dark) .nav-menu:not(.mobile) ul ul span { border-bottom: 1px solid rgba(148,163,184,0.12); }
body .nav-menu:not(.mobile) ul ul > li:hover > span,
body:where(.dark) .nav-menu:not(.mobile) ul ul > li:hover > span { background: rgba(148,163,184,0.08); }
body .nav-menu:not(.mobile) ul ul li.current-menu-item > span > a,
body:where(.dark) .nav-menu:not(.mobile) ul ul li.current-menu-item > span > a { color: var(--fs-accent); }
body .nav-menu:not(.mobile) button .svg-icon,
body:where(.dark) .nav-menu:not(.mobile) button .svg-icon { fill: var(--fs-faint); }
body .nav-menu:not(.mobile) ul ul button .svg-icon,
body:where(.dark) .nav-menu:not(.mobile) ul ul button .svg-icon { fill: var(--fs-on-inverse-muted); }

/* mobile menu */
body .menu-toggle-icon span,
body:where(.dark) .menu-toggle-icon span { background: var(--fs-heading); }
body .nav-menu.mobile ul li a,
body:where(.dark) .nav-menu.mobile ul li a { color: var(--fs-heading); font-weight: 600; }
body .nav-menu.mobile ul ul,
body:where(.dark) .nav-menu.mobile ul ul { background: var(--fs-surface-2); }
body .nav-menu .svg-icon,
body:where(.dark) .nav-menu .svg-icon { fill: var(--fs-heading); }
body .nav-menu.mobile,
body .nav-menu.mobile > div > ul,
body .nav-menu.mobile ul li .menu-item-wrapper,
body .nav-menu.mobile ul ul li .menu-item-wrapper,
body:where(.dark) .nav-menu.mobile,
body:where(.dark) .nav-menu.mobile > div > ul,
body:where(.dark) .nav-menu.mobile ul li .menu-item-wrapper,
body:where(.dark) .nav-menu.mobile ul ul li .menu-item-wrapper { border-color: var(--fs-border); }
body .nav-menu.mobile ul button,
body .nav-menu.mobile ul ul button,
body:where(.dark) .nav-menu.mobile ul button,
body:where(.dark) .nav-menu.mobile ul ul button { border-left-color: var(--fs-border); }
body .nav-menu.mobile > .menu-toggle,
body:where(.dark) .nav-menu.mobile > .menu-toggle { box-shadow: 0 0 0 1px var(--fs-border); }
body .nav-menu.mobile button:focus,
body .menu-toggle:focus,
body:where(.dark) .nav-menu.mobile button:focus,
body:where(.dark) .menu-toggle:focus { background: var(--fs-accent-soft); }

/* --------------------------------------------------------------------------
   Cards
   -------------------------------------------------------------------------- */
body .page-card,
body .widget,
body:where(.dark) .page-card,
body:where(.dark) .widget { background: var(--fs-surface); box-shadow: var(--fs-shadow); }
body .page-card:after,
body .widget:after,
body:where(.dark) .page-card:after,
body:where(.dark) .widget:after { background: var(--fs-surface-3); opacity: .7; }
body.dark .page-card:after,
body.dark .widget:after { background: var(--fs-surface); opacity: .55; }

body .blog-card-thumb,
body .featured-card-thumb,
body .header-single-thumb,
body:where(.dark) .blog-card-thumb,
body:where(.dark) .featured-card-thumb,
body:where(.dark) .header-single-thumb { background-color: var(--fs-surface-2); }
body .blog-card-thumb-empty,
body .blog-card-thumb-empty:hover,
body:where(.dark) .blog-card-thumb i { color: var(--fs-faint); }
body .blog-card-excerpt { color: var(--fs-muted); }
body .blog-card-title a { color: var(--fs-heading); }
body .blog-card-title a:hover { color: var(--fs-accent-ink); }

/* Glass panels over images: keep text white regardless of mode */
body .featured-card-content,
body .header-single-content { background: rgba(15,23,42,0.35); }
body .featured-large-title a,
body .featured-large-title a:hover { color: #fff; }
body .featured-card-meta a,
body .header-single-meta a { color: #fff; }
body .featured-card-meta a:hover,
body .header-single-meta a:hover { color: #facc15; }

/* Comment bubbles */
body .comments-bubble i,
body:where(.dark) .comments-bubble i { color: var(--fs-accent); }
body .comments-bubble span,
body:where(.dark) .comments-bubble span { color: var(--fs-on-accent); }

/* "Read more" pill */
body .more-link-custom,
body .more-link-custom:hover { background: var(--fs-accent)!important; color: var(--fs-on-accent); box-shadow: 0 4px 12px -4px rgba(234,179,8,0.6); }
body .more-link-custom:hover { background: var(--fs-accent-hover)!important; }

/* Slider controls */
body .slick-posts-nav .slick-prev:hover,
body .slick-posts-nav .slick-next:hover,
body .slick-posts-nav .slick-prev:focus,
body .slick-posts-nav .slick-next:focus { background: var(--fs-accent); }
body .slick-posts-nav .slick-prev:hover:before,
body .slick-posts-nav .slick-next:hover:before,
body .slick-posts-nav .slick-prev:focus:before,
body .slick-posts-nav .slick-next:focus:before { color: #0f172a; }
body .slick-featured .slick-dots .slick-active button { background: #facc15; width: 18px; border-radius: 999px; }
body .slick-featured .slick-dots li button { transition: width .2s ease; }

/* --------------------------------------------------------------------------
   Inverse panels: Highlights, Post-nav
   -------------------------------------------------------------------------- */
body .page-card-highlights,
body .page-card-post-nav,
body:where(.dark) .page-card-highlights,
body:where(.dark) .page-card-post-nav { background: var(--fs-inverse); }
body.dark .page-card-highlights,
body.dark .page-card-post-nav { box-shadow: 0 0 0 1px var(--fs-border), 0 8px 24px -8px rgba(2,6,23,0.6); }
body .page-card-highlights .stickywrap-heading,
body .page-card-post-nav .stickywrap-heading,
body:where(.dark) .page-card-highlights .stickywrap-heading,
body:where(.dark) .page-card-post-nav .stickywrap-heading { color: var(--fs-on-inverse); }
body .page-card-highlights .stickywrap-heading i,
body .page-card-post-nav .stickywrap-heading i { color: var(--fs-accent); }

body .highlights-card,
body:where(.dark) .highlights-card { color: var(--fs-on-inverse-muted); border-top: 1px solid rgba(148,163,184,0.12); }
body .highlights-card:hover,
body:where(.dark) .highlights-card:hover { background: rgba(148,163,184,0.08); color: var(--fs-on-inverse-muted); }
body .highlights-card-title,
body:where(.dark) .highlights-card-title { color: var(--fs-on-inverse); }
body .highlights-card:hover .highlights-card-title { color: var(--fs-accent); }
body .highlights-card-thumb,
body:where(.dark) .highlights-card-thumb { background: rgba(148,163,184,0.1); }

body .post-nav li a,
body:where(.dark) .post-nav li a { background: rgba(148,163,184,0.08); color: var(--fs-on-inverse); border-top-color: rgba(148,163,184,0.08); }
body .post-nav li a:hover,
body:where(.dark) .post-nav li a:hover { background: rgba(148,163,184,0.14); color: var(--fs-on-inverse); }
body .post-nav li a strong,
body:where(.dark) .post-nav li a strong { color: var(--fs-on-inverse-muted); letter-spacing: 0.1em; }
body .post-nav li i { background: var(--fs-accent)!important; color: var(--fs-on-accent); }

/* --------------------------------------------------------------------------
   Accent panels: Comments, Profile, Search (were teal gradient)
   -------------------------------------------------------------------------- */
body .page-card-comments,
body .page-card-profile,
body .page-card-search { background: var(--fs-accent)!important; color: var(--fs-on-accent); }
body .page-card-comments .stickywrap-heading,
body .page-card-profile .stickywrap-heading,
body .page-card-search .stickywrap-heading,
body:where(.dark) .page-card-comments .stickywrap-heading,
body:where(.dark) .page-card-profile .stickywrap-heading,
body:where(.dark) .page-card-search .stickywrap-heading { color: #0f172a; }
body .page-card-comments .stickywrap-heading i,
body .page-card-profile .stickywrap-heading i,
body .page-card-search .stickywrap-heading i { color: #0f172a; }
body .page-card-comments:after,
body .page-card-profile:after,
body .page-card-search:after { background: var(--fs-accent-hover); opacity: .5; }

body .comments-card { color: rgba(15,23,42,0.72); border-top: 1px solid rgba(15,23,42,0.12); }
body .comments-card:hover { background: rgba(15,23,42,0.08); color: #0f172a; }
body .comments-card-author { color: #0f172a; font-weight: 700; font-size: 16px; }
body .comments-card-thumb { background: rgba(15,23,42,0.12); }

body .profile-card-title { color: #0f172a; }
body .profile-card-desc { color: rgba(15,23,42,0.75); }
body .profile-card-desc a,
body .profile-card-desc a:hover { color: #0f172a; text-decoration: underline; }

body .page-card-highlights .stickywrap-inner,
body .page-card-comments .stickywrap-inner,
body .page-card-profile .stickywrap-inner,
body .page-card-post-nav .stickywrap-inner,
body .page-card-search .stickywrap-inner { border-top-color: rgba(15,23,42,0.12); box-shadow: 0 -1px 0 rgba(255,255,255,0.06); background: linear-gradient(180deg, rgba(15,23,42,0.06) 0%, rgba(15,23,42,0) 100%); }

/* --------------------------------------------------------------------------
   Forms & search
   -------------------------------------------------------------------------- */
body .themeform input:not([type="submit"]):not([type="checkbox"]),
body .themeform textarea,
body:where(.dark) .themeform input:not([type="submit"]):not([type="checkbox"]),
body:where(.dark) .themeform textarea { background: var(--fs-surface); color: var(--fs-text); outline: 1px solid var(--fs-border-strong); box-shadow: none; }
body .themeform textarea:focus,
body .themeform input:not([type="submit"]):focus,
body:where(.dark) .themeform textarea:focus,
body:where(.dark) .themeform input:not([type="submit"]):focus { outline: 2px solid var(--fs-accent); color: var(--fs-heading); }

body .themeform.searchform div input:not([type="submit"]):not([type="checkbox"]),
body:where(.dark) .themeform.searchform div input:not([type="submit"]):not([type="checkbox"]) { background: var(--fs-surface-2); color: var(--fs-text); outline: 1px solid transparent; }
body .themeform.searchform div input:not([type="submit"]):focus,
body:where(.dark) .themeform.searchform div input:not([type="submit"]):focus { outline: 2px solid var(--fs-accent); background: var(--fs-surface); color: var(--fs-heading); }
body .themeform.searchform div:after,
body:where(.dark) .themeform.searchform div:after { color: var(--fs-faint); }
body .themeform.searchform div input::placeholder { color: var(--fs-faint); }
body .page-card-search .themeform.searchform div input:not([type="submit"]):not([type="checkbox"]) { background: rgba(255,255,255,0.9); color: #0f172a; }
body .page-card-search .themeform.searchform div:after { color: #64748b; }
body .page-card-search .themeform.searchform div input:not([type="submit"]):focus { outline: 2px solid #0f172a; }

/* Buttons: yellow pill */
body .themeform input[type="submit"],
body:where(.dark) .themeform input[type="submit"],
body .entry .wp-block-button a,
body:where(.dark) .entry .wp-block-button a,
body .wp-block-button__link,
body .wp-block-search__button,
body .wp-block-file a.wp-block-file__button,
body .entry .wp-block-file a.wp-block-file__button,
body button.wp-block-search__button { background: var(--fs-accent); color: var(--fs-on-accent); font-family: var(--fs-font-body); font-weight: 700; letter-spacing: 0.02em; border: 0; border-radius: 999px; text-decoration: none; transition: background .2s ease, transform .2s ease; }
body .themeform input[type="submit"]:hover,
body .entry .wp-block-button a:hover,
body .wp-block-button__link:hover,
body .wp-block-search__button:hover,
body .entry .wp-block-file a.wp-block-file__button:hover { background: var(--fs-accent-hover); color: var(--fs-on-accent); }
body .themeform input[type="submit"] { padding: 12px 22px; }
body .entry .wp-block-button.is-style-outline a,
body .entry .wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: var(--fs-heading); box-shadow: inset 0 0 0 2px var(--fs-accent); }
body .entry .wp-block-button.is-style-outline a:hover { background: var(--fs-accent-soft); }

body .wp-block-search__input { background: var(--fs-surface-2); color: var(--fs-text); border: 1px solid var(--fs-border-strong); border-radius: 999px; padding: 8px 14px; }
body .wp-block-search__label { color: var(--fs-muted); font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
body .widget select,
body:where(.dark) .widget select { background: var(--fs-surface-2); color: var(--fs-text); border: 1px solid var(--fs-border-strong); border-radius: 10px; }

/* --------------------------------------------------------------------------
   Entry content
   -------------------------------------------------------------------------- */
body .entry hr,
body:where(.dark) .entry hr,
body .entry .wp-block-separator,
body:where(.dark) .entry .wp-block-separator { background: var(--fs-border-strong); }
body .entry .wp-block-separator { border: 0; height: 2px; }
body .entry dt,
body:where(.dark) .entry dt { color: var(--fs-heading); }
body .entry blockquote { color: var(--fs-heading); border-left: 3px solid var(--fs-accent); padding-left: 24px; }
body .entry blockquote:before { display: none; }
body .entry blockquote p { font-size: 1.1em; font-weight: 500; }
body .entry .wp-block-pullquote { border-color: var(--fs-accent); }
body .entry .wp-block-pullquote blockquote { border-left: 0; }
body .entry code,
body:where(.dark) .entry code { background: var(--fs-surface-2); color: var(--fs-heading); padding: 2px 6px; border-radius: 6px; font-size: 0.85em; }
body .entry pre,
body:where(.dark) .entry pre { background: var(--fs-inverse); color: #e2e8f0; border: 1px solid var(--fs-border); border-radius: 14px; font-size: 13px; }
body .entry pre code { background: none; color: inherit; padding: 0; }
body .entry ins,
body:where(.dark) .entry ins { background: var(--fs-accent-soft); }
body .entry mark { background: var(--fs-accent); color: #0f172a; padding: 0 3px; border-radius: 3px; }
body .entry ul li::marker { color: var(--fs-accent); }
body .entry ol li::marker { color: var(--fs-accent-ink); font-weight: 700; }
body .entry table td,
body .entry table th,
body:where(.dark) .entry table td,
body:where(.dark) .entry table th { border-color: var(--fs-border-strong); }
body .entry table th { background: var(--fs-surface-2); color: var(--fs-heading); font-weight: 700; }
body .entry .wp-block-table.is-style-stripes tbody tr:nth-child(2n+1) { background: var(--fs-surface-2); }
body .entry .wp-caption,
body:where(.dark) .entry .wp-caption { background: transparent; }
body .entry .wp-caption-text,
body .entry figcaption { color: var(--fs-muted); }
body .entry .wp-block-calendar caption,
body:where(.dark) .entry .wp-block-calendar caption { background: var(--fs-surface-2); color: var(--fs-heading); }
body .entry .wp-block-calendar th,
body:where(.dark) .entry .wp-block-calendar th { background: var(--fs-surface-3); color: var(--fs-heading); }
body .entry .wp-block-calendar td,
body:where(.dark) .entry .wp-block-calendar td { color: var(--fs-muted); }

/* Post tags */
body .post-tags span { color: var(--fs-muted); font-weight: 600; }
body .post-tags a,
body:where(.dark) .post-tags a { background: var(--fs-surface-2); color: var(--fs-text); box-shadow: none; border-radius: 999px; padding: 3px 12px; font-size: 13px; font-weight: 600; }
body .post-tags a:hover,
body:where(.dark) .post-tags a:hover { background: var(--fs-accent); color: var(--fs-on-accent); }

/* Author bio */
body .author-bio,
body:where(.dark) .author-bio { background: var(--fs-surface-2); box-shadow: none; border-radius: 20px; }
body .author-bio .bio-name,
body:where(.dark) .author-bio .bio-name { color: var(--fs-heading); }
body .author-bio .bio-avatar:after,
body:where(.dark) .author-bio .bio-avatar:after { background: var(--fs-accent); color: var(--fs-on-accent); }

/* Single header fallback background */
body .header-single:before,
body:where(.dark) .header-single:before { background: var(--fs-inverse); }

/* Share buttons (Alx Extensions) */
body .sharrre-footer .sharrre .box { border-radius: 999px; }

/* --------------------------------------------------------------------------
   Widgets
   -------------------------------------------------------------------------- */
body .widget { color: var(--fs-muted); }
body .widget > h3 a,
body .widget > h3 a:hover,
body:where(.dark) .widget > h3 a,
body:where(.dark) .widget > h3 a:hover { color: var(--fs-heading); }
body .widget > ul li:before,
body .widget > ul li a:before,
body .widget > div > ul li a:before,
body .widget_calendar caption:before,
body:where(.dark) .widget > ul li:before,
body:where(.dark) .widget > ul li a:before,
body:where(.dark) .widget > div > ul li a:before,
body:where(.dark) .widget_calendar caption:before { background: var(--fs-surface-2); color: var(--fs-faint); }
body .widget > ul li a:hover:before,
body .widget_nav_menu > div > ul li a:hover:before,
body:where(.dark) .widget > ul li a:hover:before { background: var(--fs-accent); color: var(--fs-on-accent); }
body .widget_archive ul li,
body .widget_categories ul li,
body .widget_links ul li,
body:where(.dark) .widget_archive ul li,
body:where(.dark) .widget_categories ul li,
body:where(.dark) .widget_links ul li { color: var(--fs-faint); }
body .widget_recent_comments ul li,
body .widget_recent_entries ul li,
body:where(.dark) .widget_recent_comments ul li,
body:where(.dark) .widget_recent_entries ul li { color: var(--fs-muted); }
body .wp-block-latest-comments__comment-meta,
body .wp-block-latest-posts__post-date { color: var(--fs-muted); }
body .widget_rss ul li a,
body:where(.dark) .widget_rss ul li a { color: var(--fs-heading); }
body .widget_rss ul li span.rss-date,
body .widget_rss ul li cite,
body:where(.dark) .widget_rss ul li span.rss-date,
body:where(.dark) .widget_rss ul li cite { color: var(--fs-muted); }
body .widget_calendar a,
body:where(.dark) .widget_calendar a { color: var(--fs-accent-ink); }
body .widget_calendar caption,
body .widget_calendar thead,
body:where(.dark) .widget_calendar caption,
body:where(.dark) .widget_calendar thead { background: var(--fs-surface-2); color: var(--fs-heading); box-shadow: none; }
body .widget_calendar th,
body .widget_calendar td,
body:where(.dark) .widget_calendar th,
body:where(.dark) .widget_calendar td { border-color: var(--fs-border); }
body .wp-block-tag-cloud a,
body .tagcloud a { display: inline-block; background: var(--fs-surface-2); color: var(--fs-text); font-size: 13px!important; font-weight: 600; padding: 3px 12px; margin: 0 4px 6px 0; border-radius: 999px; }
body .wp-block-tag-cloud a:hover,
body .tagcloud a:hover { background: var(--fs-accent); color: var(--fs-on-accent); }

/* Alx tabs */
body .alx-tabs-nav,
body:where(.dark) .alx-tabs-nav { background: var(--fs-surface-2); box-shadow: none; }
body .alx-tabs-nav li a,
body:where(.dark) .alx-tabs-nav li a { color: var(--fs-muted); }
body .alx-tabs-nav li a:hover,
body:where(.dark) .alx-tabs-nav li a:hover { color: var(--fs-heading); }
body .alx-tabs-nav li.active a { background: var(--fs-accent)!important; color: var(--fs-on-accent)!important; }
body .alx-tab .tab-item-category,
body .alx-posts .post-item-category { color: var(--fs-muted); }

/* --------------------------------------------------------------------------
   Pagination
   -------------------------------------------------------------------------- */
body .pagination ul li a,
body:where(.dark) .pagination ul li a { background: var(--fs-surface); color: var(--fs-heading); box-shadow: var(--fs-shadow); }
body .pagination ul li a:hover { background: var(--fs-accent); color: var(--fs-on-accent); }
body .wp-pagenavi a,
body:where(.dark) .wp-pagenavi a { background: var(--fs-surface); color: var(--fs-heading); box-shadow: var(--fs-shadow); border-radius: 999px; }
body .wp-pagenavi a:hover,
body .wp-pagenavi span.current,
body:where(.dark) .wp-pagenavi a:hover,
body:where(.dark) .wp-pagenavi span.current { background: var(--fs-accent); color: var(--fs-on-accent); border-radius: 999px; }
body .wp-pagenavi a,
body .wp-pagenavi span,
body:where(.dark) .wp-pagenavi span { color: var(--fs-muted); }

/* --------------------------------------------------------------------------
   Comments
   -------------------------------------------------------------------------- */
body .commentlist .fn,
body:where(.dark) .commentlist .fn { color: var(--fs-heading); }
body .commentlist .comment-metadata a,
body .commentlist .comment-metadata:before,
body:where(.dark) .commentlist .comment-metadata a,
body:where(.dark) .commentlist .comment-metadata:before { color: var(--fs-faint); }
body .comment-awaiting-moderation,
body:where(.dark) .comment-awaiting-moderation { color: var(--fs-heading); }
body .commentlist li.bypostauthor > .comment-body:after,
body .commentlist li.comment-author-admin > .comment-body:after,
body:where(.dark) .commentlist li.bypostauthor > .comment-body:after,
body:where(.dark) .commentlist li.comment-author-admin > .comment-body:after { background: var(--fs-accent); color: var(--fs-on-accent); }
body .commentlist .comment-body { color: var(--fs-text); }
body .commentlist .reply a { color: var(--fs-accent-ink); font-weight: 600; }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
body #footer-bottom #copyright,
body #footer-bottom #credit { color: var(--fs-muted); font-weight: 400; }
body #footer-bottom #credit a { color: var(--fs-heading); font-weight: 600; }
body #footer-bottom .social-links li a { color: var(--fs-muted); }
body #footer-bottom .social-links li a:hover { color: var(--fs-accent-ink); }

body #back-to-top { background: var(--fs-accent)!important; color: var(--fs-on-accent); box-shadow: 0 -4px 16px -6px rgba(234,179,8,0.6); }
body #back-to-top:hover { background: var(--fs-accent-hover)!important; color: var(--fs-on-accent); }

/* --------------------------------------------------------------------------
   Page title box / notebox
   -------------------------------------------------------------------------- */
body .page-title-box,
body .notebox { color: var(--fs-muted); }

/* --------------------------------------------------------------------------
   Dark logo inversion only when a logo is dark-on-transparent (opt-in via Customizer)
   -------------------------------------------------------------------------- */

/* --------------------------------------------------------------------------
   Responsive tweaks
   -------------------------------------------------------------------------- */
@media only screen and (max-width: 1340px) {
	body:where(.dark) .header-single-title,
	body .header-single-title { color: var(--fs-heading); text-shadow: none; }
	body .header-single-content,
	body:where(.dark) .header-single-content { color: var(--fs-muted); background: none; }
	body .header-single-meta a,
	body:where(.dark) .header-single-meta a { color: var(--fs-muted); }
	body .header-single-meta a:hover { color: var(--fs-accent-ink); }
	body .header-single:before,
	body:where(.dark) .header-single:before { background: transparent; }
}
@media only screen and (max-width: 719px) {
	body .site-title { font-size: 18px; }
	body .page-sidebar,
	body:where(.dark) .page-sidebar { border-bottom: 1px solid var(--fs-border); background: var(--fs-bg); }
	body .featured-large-title { font-size: 26px; }
	body .header-single-title { font-size: 26px; }
	body .entry-header .entry-title { font-size: 26px; }
}

@media (prefers-reduced-motion: reduce) {
	body *, body *:before, body *:after { transition: none!important; animation: none!important; }
}

/* --------------------------------------------------------------------------
   Archive / search title card
   -------------------------------------------------------------------------- */
body .page-title .stickywrap-heading { font-family: var(--fs-font-title); font-size: 22px; font-weight: 600; letter-spacing: -0.01em; text-transform: none; }
body .page-title .stickywrap-heading i { font-size: 18px; margin-right: 8px; }

/* Block editor palette on the front end */
.has-fs-yellow-400-color { color: #facc15; } .has-fs-yellow-400-background-color { background-color: #facc15; }
.has-fs-yellow-500-color { color: #eab308; } .has-fs-yellow-500-background-color { background-color: #eab308; }
.has-fs-slate-950-color { color: #020617; } .has-fs-slate-950-background-color { background-color: #020617; }
.has-fs-slate-900-color { color: #0f172a; } .has-fs-slate-900-background-color { background-color: #0f172a; }
.has-fs-slate-800-color { color: #1e293b; } .has-fs-slate-800-background-color { background-color: #1e293b; }
.has-fs-slate-500-color { color: #64748b; } .has-fs-slate-500-background-color { background-color: #64748b; }
.has-fs-slate-200-color { color: #e2e8f0; } .has-fs-slate-200-background-color { background-color: #e2e8f0; }
.has-fs-slate-50-color { color: #f8fafc; } .has-fs-slate-50-background-color { background-color: #f8fafc; }
.has-white-color { color: #fff; } .has-white-background-color { background-color: #fff; }
