/* ============================================================
   Account bar — floating capsule, sitewide (rendered via wp_body_open)
   Self-contained tokens so it looks right even on pages that don't load
   landing.css (e.g. the plugin's own archive/single pages under GP).
   ============================================================ */

.fgo-account-bar {
  --fgo-bar-bg: #ffffff;
  --fgo-bar-ink: #16231a;
  --fgo-bar-ink-dim: #5c6b60;
  --fgo-bar-line: #dbe6dc;
  --fgo-bar-accent: #177a31;
  --fgo-bar-danger: #c0392b;

  position: fixed;
  top: 14px;
  right: 14px;
  z-index: 9999;
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--fgo-bar-bg);
  border: 1px solid var(--fgo-bar-line);
  border-radius: 999px;
  padding: 5px;
  box-shadow: 0 2px 10px rgba(22, 35, 26, .12);
  font-family: 'Courier New', Courier, monospace;
}

html[data-fgo-theme="dark"] .fgo-account-bar {
  --fgo-bar-bg: #141d17;
  --fgo-bar-ink: #eef2ea;
  --fgo-bar-ink-dim: #93a498;
  --fgo-bar-line: #223026;
  --fgo-bar-accent: #35c26a;
  box-shadow: 0 2px 10px rgba(0, 0, 0, .4);
}

.fgo-bar-item { position: relative; display: flex; }

.fgo-bar-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: none;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  text-decoration: none;
  padding: 0;
  transition: background .15s ease;
}
.fgo-bar-btn:hover { background: var(--fgo-bar-line); }

/*
 * The icon itself. Fill/stroke are set here in CSS, with !important,
 * rather than trusting inline SVG attributes (fill="none" stroke=
 * "currentColor") to survive whatever other CSS is loaded on the page —
 * SVG presentation attributes lose to ANY author CSS rule targeting the
 * same property, from any stylesheet, in any order, so a single
 * conflicting rule elsewhere (a reset, a security/optimizer plugin, GP
 * itself) is enough to make an icon render with no visible stroke at
 * all while the button around it still works fine, which matches
 * "hover highlights but nothing is visible" exactly. !important here is
 * deliberate: this is the one place on the icon itself we need to win
 * unconditionally, not a stylistic default to fight later.
 */
.fgo-bar-svg {
  display: block !important;
  width: 19px !important;
  height: 19px !important;
  fill: none !important;
  stroke: var(--fgo-bar-ink) !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  pointer-events: none;
}
.fgo-bar-btn:hover .fgo-bar-svg { stroke: var(--fgo-bar-accent) !important; }
a.fgo-bar-btn .fgo-bar-svg { stroke: var(--fgo-bar-ink) !important; }

.fgo-bar-badge {
  position: absolute;
  top: 3px;
  right: 3px;
  min-width: 15px;
  height: 15px;
  padding: 0 3px;
  border-radius: 999px;
  background: var(--fgo-bar-danger);
  color: #fff;
  font-size: 9.5px;
  font-weight: 700;
  line-height: 15px;
  text-align: center;
}

/* Dark-mode toggle: show sun in dark mode (click to go light), moon in light mode (click to go dark) */
.fgo-bar-icon-moon { display: block !important; }
.fgo-bar-icon-sun { display: none !important; }
html[data-fgo-theme="dark"] .fgo-bar-icon-moon { display: none !important; }
html[data-fgo-theme="dark"] .fgo-bar-icon-sun { display: block !important; }

.fgo-bar-panel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 240px;
  max-width: 300px;
  background: var(--fgo-bar-bg);
  border: 1px solid var(--fgo-bar-line);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(22, 35, 26, .16);
  padding: 6px;
  font-size: 13px;
}

.fgo-bar-panel-head {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--fgo-bar-ink-dim);
  padding: 8px 10px 6px;
}

.fgo-bar-menu-list, .fgo-bar-notif-list { list-style: none; margin: 0; padding: 0; }
.fgo-bar-menu-list li { margin: 0; }
.fgo-bar-menu-list a {
  display: block;
  padding: 9px 10px;
  border-radius: 6px;
  color: var(--fgo-bar-ink);
  text-decoration: none;
  font-size: 13.5px;
}
.fgo-bar-menu-list a:hover { background: var(--fgo-bar-line); }
.fgo-bar-menu-admin a { color: var(--fgo-bar-accent); }
.fgo-bar-menu-divider { height: 1px; background: var(--fgo-bar-line); margin: 6px 4px; }

.fgo-bar-notif-list li {
  padding: 8px 10px;
  border-radius: 6px;
}
.fgo-bar-notif-list li.is-unread { background: rgba(23, 122, 49, .06); }
.fgo-bar-notif-list a, .fgo-bar-notif-list span { display: block; color: var(--fgo-bar-ink); text-decoration: none; font-size: 13px; line-height: 1.4; }
.fgo-bar-notif-list a:hover { color: var(--fgo-bar-accent); }
.fgo-bar-notif-list time { display: block; font-size: 11px; color: var(--fgo-bar-ink-dim); margin-top: 2px; }

.fgo-bar-empty { padding: 10px; color: var(--fgo-bar-ink-dim); margin: 0; }

@media (max-width: 600px) {
  .fgo-account-bar { top: 8px; right: 8px; }
  .fgo-bar-btn { width: 32px; height: 32px; }
}
