/* Accent, tokens, transitions */
:root { --yy-accent: #111111; --yy-radius: 16px; --yy-shadow: 0 8px 24px rgba(2,6,23,.06); }
[data-theme='dark'] { --yy-accent: #f5f5f5; }

/* Buttons */
.btn, button, a.btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; padding: .6rem 1rem; font-weight: 500; text-decoration: none; border: 1px solid rgba(0,0,0,.18); border-radius: var(--yy-radius); transition: color .16s cubic-bezier(.2,.8,.2,1), background-color .16s cubic-bezier(.2,.8,.2,1), box-shadow .16s cubic-bezier(.2,.8,.2,1), transform .12s ease; background: transparent; }
.btn, a.btn { color: var(--global-text-color); text-decoration: none; background: transparent; }
.btn--primary, .btn--secondary { backdrop-filter: blur(8px) saturate(140%); -webkit-backdrop-filter: blur(8px) saturate(140%); }
.btn--primary { color: #111111 !important; background: transparent; border-color: rgba(0,0,0,.18); }
.btn--primary:hover { background: rgba(0,0,0,.04); border-color: rgba(0,0,0,.28); }
.btn { color: var(--global-text-color); border-radius: var(--yy-radius); }
[data-theme='dark'] .btn--primary { background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.10)); border-color: rgba(255,255,255,.26); color: #f1f1f1 !important; }
[data-theme='dark'] .btn--primary:hover { background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.12)); border-color: rgba(255,255,255,.26); }

/* Secondary button style (outline) */
.btn--secondary { background: transparent; border-color: rgba(0,0,0,.18); color: var(--global-text-color); }
.btn--secondary:hover { background: rgba(0,0,0,.04); }
[data-theme='dark'] .btn--secondary { background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.06)); border-color: rgba(255,255,255,.16); color: #e5e5e5; }
[data-theme='dark'] .btn--secondary:hover { background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.10)); }

/* Normalize legacy dark buttons to neutral outline */
.btn--inverse, .btn--dark, .btn--info, .btn--danger, .btn--success {
  background: transparent !important;
  color: var(--global-text-color) !important;
  border-color: var(--global-border-color) !important;
}
.btn--primary:focus-visible, .btn--secondary:focus-visible { outline: 2px solid rgba(0,0,0,.35); outline-offset: 2px; }
.btn--primary:hover { filter: brightness(1.05); box-shadow: 0 6px 18px rgba(0,0,0,.15); transform: translateY(-1px); }

/* List rows (no cards) */
.archive__item { padding: .9rem 0; border: 0; border-bottom: 1px solid var(--global-border-color); background: transparent; box-shadow: none; transition: color .16s ease; }
[data-theme='dark'] .archive__item { background: transparent; }
.archive__item:hover { transform: none; }
.archive__item .archive__item-title a { text-decoration: none; border-bottom: 1px solid transparent; }
.archive__item:hover .archive__item-title a { border-bottom-color: currentColor; }
.archive__item .page__meta { opacity: .75; font-size: .9rem; }

/* Layout helpers */
.home-section { margin: 2rem 0; }
.home-intro .btn { margin-right: .5rem; margin-bottom: .5rem; }

/* Masthead */
.masthead { position: sticky; top: 0; z-index: 1000; backdrop-filter: saturate(120%) blur(6px); background-color: rgba(255,255,255,.85); transition: background-color .16s cubic-bezier(.2,.8,.2,1), box-shadow .16s cubic-bezier(.2,.8,.2,1); }
[data-theme='dark'] .masthead { background-color: rgba(15,15,15,.7); }
.masthead.is-scrolled { box-shadow: 0 6px 18px rgba(0,0,0,.08); }

/* Theme toggle */
#theme-toggle { 
  position: absolute;
  right: 60px; /* Position to the left of the dropdown toggle button */
  top: 50%;
  transform: translateY(-50%);
  height: 2.5rem;
  border: 1px solid rgba(0,0,0,.1); 
  background: transparent; 
  border-radius: 8px; 
  padding: 6px 10px; 
  cursor: pointer;
  z-index: 101; /* Higher than dropdown button */
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
[data-theme='dark'] #theme-toggle { border-color: rgba(255,255,255,.15); }

/* Mobile responsive adjustments for theme toggle */
@media (max-width: 768px) {
  #theme-toggle {
    right: 50px; /* Adjust for smaller dropdown button on mobile */
    height: 2.2rem;
    padding: 4px 8px;
  }
}

/* Fix dropdown menu for dark mode */
.greedy-nav .hidden-links {
  background: var(--global-bg-color) !important;
  border-color: var(--global-border-color) !important;
  display: none; /* Initially hidden */
}
[data-theme='dark'] .greedy-nav .hidden-links {
  background: var(--global-card-bg) !important;
  border-color: var(--global-border-color) !important;
}

/* CTA - flat */
.cta-bar { padding: .9rem 0; border-radius: 0; background: transparent; border-bottom: 1px solid var(--global-border-color); margin: 1rem 0 1.5rem; }
[data-theme='dark'] .cta-bar { background: transparent; border-color: #262626; }
.cta-bar .btn { margin-right: .5rem; margin-bottom: .25rem; }

/* Progressive enhancement: hide non-critical motion for reduced motion */
@media (prefers-reduced-motion: reduce) { .archive__item:hover { transform: none; box-shadow: 0 2px 6px rgba(0,0,0,.05); } }

/* Ensure reveal elements are visible on load to avoid transparency issues */
.will-reveal { opacity: 1 !important; transform: none !important; }

/* Cards and separators — soften visibility across OS, especially Windows */
/* Flatten primary containers to avoid nested card feel */
.page, .page__content, .archive, .sidebar, .page__hero, .site-footer, .card {
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* Archive items: lighten separators further */
.archive__item { border-bottom: 1px solid rgba(0,0,0,.06) !important; }
[data-theme='dark'] .archive__item { border-bottom-color: rgba(255,255,255,.09) !important; }
.archive__subtitle { border-bottom: 1px solid rgba(0,0,0,.06) !important; }
[data-theme='dark'] .archive__subtitle { border-bottom-color: rgba(255,255,255,.09) !important; }

/* Remove image hover shadows that exaggerate depth */
.archive__item:hover .archive__item-teaser,
.page__content a:hover img { box-shadow: none !important; }

/* Page heading underline: make subtle */
.page__content h2 { border-bottom: 1px solid rgba(0,0,0,.08) !important; }
[data-theme='dark'] .page__content h2 { border-bottom-color: rgba(255,255,255,.12) !important; }

/* Horizontal rule: hairline */
hr { border-top: 1px solid rgba(0,0,0,.08) !important; }
[data-theme='dark'] hr { border-top-color: rgba(255,255,255,.12) !important; }

/* Tables: soften row dividers */
th, td { border-bottom: 1px solid rgba(0,0,0,.06) !important; }
[data-theme='dark'] th, [data-theme='dark'] td { border-bottom-color: rgba(255,255,255,.09) !important; }

/* Code blocks: remove heavy border/shadow if any */
.highlight, pre, code { box-shadow: none !important; }

/* Masthead: remove harsh border and heavy shadow */
.masthead { border-bottom: 1px solid transparent !important; box-shadow: none; }
.masthead.is-scrolled { box-shadow: 0 4px 10px rgba(0,0,0,.04); }
[data-theme='dark'] .masthead.is-scrolled { box-shadow: 0 4px 10px rgba(0,0,0,.10); }

/* Inputs/buttons: keep borders but lighten to reduce chrome heaviness */
button, .btn, input[type="submit"], input[type="button"], .button,
input, textarea, select { border-color: rgba(0,0,0,.12) !important; }
[data-theme='dark'] button, [data-theme='dark'] .btn, [data-theme='dark'] input[type="submit"],
[data-theme='dark'] input[type="button"], [data-theme='dark'] .button,
[data-theme='dark'] input, [data-theme='dark'] textarea, [data-theme='dark'] select { border-color: rgba(255,255,255,.18) !important; }

/* Optional: reduce any remaining generic shadows */
*:where(.shadow, .box-shadow) { box-shadow: none !important; }

/* Home intro: ensure no visual divider under heading */
.home-intro h2 { border-bottom: 0 !important; }

/* Author profile: remove card feel */
.author__avatar img { box-shadow: none !important; border: 0 !important; background: transparent !important; }
.author__content, .author__urls-wrapper, .author__urls { background: transparent !important; box-shadow: none !important; border: 0 !important; }
.author__urls { padding-left: 0; }

/* Sidebar/TOC: flatten and lighten */
.sidebar, .sidebar__right, .toc { background: transparent !important; box-shadow: none !important; border: 0 !important; }
.toc .nav__title { border-bottom: 1px solid rgba(0,0,0,.06) !important; }
[data-theme='dark'] .toc .nav__title { border-bottom-color: rgba(255,255,255,.09) !important; }

/* Share/related sections: no block borders */
.page__share, .page__related { background: transparent !important; box-shadow: none !important; border: 0 !important; }
.page__related { border-top: 1px solid rgba(0,0,0,.06) !important; }
[data-theme='dark'] .page__related { border-top-color: rgba(255,255,255,.09) !important; }

/* Footer custom area: subtle only */
.page__footer-custom { background: transparent !important; box-shadow: none !important; border-top: 1px solid rgba(0,0,0,.06) !important; }
[data-theme='dark'] .page__footer-custom { border-top-color: rgba(255,255,255,.09) !important; }

/* Spacing rhythm: consistent section spacing */
.stack > * + * { margin-top: 0.75rem; }
.home-section { margin: 2rem 0; }
.page__content h2 { margin-top: 2rem; }
.page__content h3 { margin-top: 1.25rem; }
