/* SFI theme: what the WordPress output needs beyond main.css.
   Header, footer, loader and backdrop keep the prototype markup, so this file is small. */

/* WordPress core class for text only screen readers hear. */
.screen-reader-text {
  border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
  height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0;
  position: absolute !important; word-wrap: normal !important;
}
.screen-reader-text:focus {
  clip: auto !important; clip-path: none; height: auto; width: auto; margin: 0;
  left: 1rem; top: 1rem; z-index: 200; padding: 0.8rem 1.2rem;
  background: #fff; color: #05090f; font-weight: 700;
}

/* A logo from the Customizer may not be square: keep it whole inside the crest box. */
.brand img, .foot-grid img, .loader__plate img { object-fit: contain; }

/* Keep the fixed header below the WordPress admin bar for logged in users. */
body.admin-bar .site-head { top: 32px; }
@media (max-width: 782px) {
  body.admin-bar .site-head { top: 46px; }
}

/* Background photo panel, printed at the end of the page for editors only. */
.sfi-bg-editor {
  position: relative; z-index: 1;
  padding: 2.5rem 0 3rem;
  background: #0b1424;
  border-top: 2px solid var(--flame, #e2661b);
  color: var(--text, #eef2f8);
}
.sfi-bg-editor__title {
  font-size: 1.15rem; font-weight: 800; letter-spacing: 0; line-height: 1.3;
  color: #fff; margin: 0 0 0.4rem;
}
.sfi-bg-editor__hint { font-size: 0.92rem; color: var(--text-2, #c7d2e3); margin: 0 0 1.4rem; max-width: 70ch; }
.sfi-bg-editor__list {
  display: flex; flex-wrap: nowrap; gap: 1rem;
  overflow-x: auto; padding-bottom: 0.6rem;
}
.sfi-bg-editor__item {
  flex: 0 0 200px; margin: 0;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 10px; overflow: hidden;
}
.sfi-bg-editor__item img,
.sfi-bg-editor__empty {
  display: block; width: 100%; aspect-ratio: 16 / 10; height: auto;
}
.sfi-bg-editor__empty {
  display: flex; align-items: center; justify-content: center;
  font-size: 0.85rem; color: var(--muted, #93a2bb); background: rgba(255, 255, 255, 0.04);
}
.sfi-bg-editor__item figcaption { padding: 0.6rem 0.75rem 0.7rem; font-size: 0.85rem; line-height: 1.35; }
.sfi-bg-editor__item figcaption b { color: #fff; font-weight: 800; }
.sfi-bg-editor__item figcaption span { color: var(--text-2, #c7d2e3); }
.sfi-bg-editor__item figcaption small { display: block; margin-top: 0.2rem; color: var(--muted, #93a2bb); font-size: 0.78rem; }

/* Editor-only boxes appear only while Digital Hammerr's edit mode is on. */
html:not(.sfi-edit) .sfi-bg-editor,
html:not(.sfi-edit) .sfi-edit-note,
html:not(.sfi-edit) .sfi-reg-note { display: none !important; }
