/* ===========================
   GeneratePress Slideout – Compact Style
   Scope: #generate-slideout-menu only
   =========================== */
#generate-slideout-menu {
  --so-bg: #fff;
  --so-text: #111;
  --so-muted: #6b7280;
  --so-accent: #0073e6;
  --so-border: #e5e7eb;

  --so-base: 0.92rem;         /* base font size */
  --so-tight: 1.25;           /* compact line-height */
  --so-px: .75rem;            /* link horizontal padding */
  --so-py: .45rem;            /* link vertical padding */
  --so-radius: .4rem;
  --so-width: 320px;          /* panel width */
}

#generate-slideout-menu.slideout-navigation {
  color: var(--so-text);
  background: var(--so-bg);
  width: var(--so-width);
  max-width: 88vw;
  box-shadow: 0 10px 30px rgba(0,0,0,.15);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  font-size: var(--so-base);
  line-height: var(--so-tight);
}

/* Inside container padding trimmed */
#generate-slideout-menu .inside-navigation {
  padding: .5rem .75rem 1rem;
}

/* Close (X) button — smaller, tidy hit area */
#generate-slideout-menu .slideout-exit {
  position: sticky;
  top: .25rem;
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: .5rem;
  color: var(--so-muted);
  background: transparent;
  transition: background .15s ease, color .15s ease;
}
#generate-slideout-menu .slideout-exit:hover { background: #f3f4f6; color: var(--so-text); }
#generate-slideout-menu .slideout-exit svg { width: 16px; height: 16px; }

/* Generic link styling (applies to top-level and inner links) */
#generate-slideout-menu a {
  display: block;
  padding: var(--so-py) var(--so-px);
  color: var(--so-text);
  text-decoration: none;
  border-radius: var(--so-radius);
  outline: none;
}
#generate-slideout-menu a:hover { background: #f6f8fb; color: var(--so-accent); }
#generate-slideout-menu a:focus-visible {
  box-shadow: 0 0 0 2px var(--so-accent);
}

/* Remove excess margins from GB containers/headlines in the slideout */
#generate-slideout-menu .gb-container,
#generate-slideout-menu .gb-headline { margin: 0; }
#generate-slideout-menu .gb-headline a { padding: .35rem .5rem; }

/* Section separators between accordion items */
#generate-slideout-menu .gb-accordion__item {
  padding-block: .15rem;
  border-top: 1px solid var(--so-border);
}
#generate-slideout-menu .gb-accordion__item:first-child { border-top: 0; }

/* Accordion toggles (parents) — compact, clear affordance */
#generate-slideout-menu .gb-accordion__toggle {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: .5rem;
  padding: .5rem var(--so-px);
  font-weight: 600;
}
#generate-slideout-menu .gb-accordion__toggle .gb-button-text a {
  padding: 0; /* avoid double padding from generic link rule */
}

/* Caret/icon sizing (both closed/open variants exist in markup) */
#generate-slideout-menu .gb-accordion__icon,
#generate-slideout-menu .gb-accordion__icon-open {
  width: 14px; height: 14px;
  opacity: .7;
}
#generate-slideout-menu .gb-accordion__toggle:hover .gb-accordion__icon,
#generate-slideout-menu .gb-accordion__toggle:hover .gb-accordion__icon-open { opacity: 1; }

/* Accordion content — compact padding and subtle left guide */
#generate-slideout-menu .gb-accordion__content {
  padding: .1rem 0 .4rem .4rem;
  margin-left: .25rem;
  border-left: 2px solid var(--so-border);
}

/* Child links inside accordion content */
#generate-slideout-menu .gb-accordion__content a {
  font-size: .9rem;
  padding: .3rem .5rem;
  border-radius: .35rem;
}

/* Query loop / “Current Issue” block compacting */
#generate-slideout-menu .gb-query-loop-wrapper { gap: .5rem; }
#generate-slideout-menu figure.gb-block-image { margin: .25rem 0; }
#generate-slideout-menu figcaption.gb-headline { font-size: .85rem; color: var(--so-muted); }

/* Social buttons row trim */
#generate-slideout-menu .gb-button { padding: .35rem; border-radius: .5rem; }
#generate-slideout-menu .gb-button .gb-icon svg { width: 16px; height: 16px; }

/* Reduce overall type scale for headings inside the panel */
#generate-slideout-menu h5.gb-headline { font-size: .95rem; }

/* Touch target sanity (compact but still usable) */
#generate-slideout-menu a,
#generate-slideout-menu .gb-accordion__toggle {
  min-height: 36px; /* compact but >34px for usability */
}

/* Optional: dim long lists slightly, brighten on hover */
#generate-slideout-menu .gb-accordion__content a { color: #1f2937; }
#generate-slideout-menu .gb-accordion__content a:hover { color: var(--so-accent); background: #f6f8fb; }

/* Optional dark mode */
@media (prefers-color-scheme: dark){
  #generate-slideout-menu {
    --so-bg: #0f1115;
    --so-text: #e5e7eb;
    --so-muted: #9aa0a6;
    --so-border: #1f2937;
    --so-accent: #66b6ff;
  }
  #generate-slideout-menu.slideout-navigation { box-shadow: 0 10px 30px rgba(0,0,0,.6); }
  #generate-slideout-menu a:hover { background: #141821; }
  #generate-slideout-menu .slideout-exit:hover { background: #141821; }
}