/* NAM Gallery Status — inherits the footer's font and color.
   Override the custom properties in the theme if needed. */
:root {
  --nam-gs-ok: #3c9a5f;
  --nam-gs-alert: #e08a2c;
  --nam-gs-banner-bg: #1d1d1b;
  --nam-gs-banner-fg: #ffffff;
}

.nam-gs { margin-top: .75em; line-height: 1.45; }
.nam-gs[hidden] { display: none; }
.nam-gs--page { margin: 1.5em 0; }

.nam-gs-line { display: flex; align-items: center; gap: .5em; margin: 0; }
.nam-gs-dot {
  flex: none; width: .55em; height: .55em; border-radius: 50%;
  background: var(--nam-gs-ok);
}
.nam-gs-line--alert .nam-gs-dot,
.nam-gs-banner .nam-gs-dot { background: var(--nam-gs-alert); }

.nam-gs-details summary { cursor: pointer; list-style: none; }
.nam-gs-details summary::-webkit-details-marker { display: none; }
.nam-gs-details summary::after {
  content: ""; width: .4em; height: .4em; margin-left: .1em;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: translateY(-.15em) rotate(45deg); transition: transform .15s ease; opacity: .7;
}
.nam-gs-details[open] summary::after { transform: translateY(.1em) rotate(-135deg); }
.nam-gs-details summary:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

.nam-gs-list { list-style: none; margin: .5em 0 0; padding: 0 0 0 1.05em; }
.nam-gs-item { margin: 0 0 .5em; }
.nam-gs-when, .nam-gs-note { display: block; font-size: .9em; opacity: .8; }
.nam-gs-note { font-style: italic; }
.nam-gs-heading {
  margin: .75em 0 0 1.05em; font-size: .75em; letter-spacing: .08em;
  text-transform: uppercase; opacity: .65;
}

/* Top banner (optional) */
.nam-gs-banner { background: var(--nam-gs-banner-bg); color: var(--nam-gs-banner-fg); font-size: .9rem; }
.nam-gs-banner-inner {
  display: flex; align-items: center; gap: .6em;
  max-width: 1200px; margin: 0 auto; padding: .55em 16px;
}
.nam-gs-banner-text { margin: 0; flex: 1; }
.nam-gs-banner-link { color: inherit; text-decoration: underline; }
.nam-gs-banner-close {
  flex: none; background: none; border: 0; color: inherit; cursor: pointer;
  font-size: 1.3em; line-height: 1; padding: .1em .3em; opacity: .8;
}
.nam-gs-banner-close:hover, .nam-gs-banner-close:focus-visible { opacity: 1; }
