/* Site map (/sitemap): every page and its tabs, on the site's Metronic tokens (--tw-*) so it reads the same in
   the light and the dark theme. */
.smap { --smap-new-fg: #0f7a37; --smap-new-bg: #e5f7ec; --smap-hid-fg: #8a5300; --smap-hid-bg: #fff4d6; --smap-hid-line: #e7b54a;
        display: flex; flex-direction: column; gap: 22px; padding-bottom: 34px; min-width: 0; }
[data-theme-mode="dark"] .smap { --smap-new-fg: #5fd68b; --smap-new-bg: rgba(34, 197, 94, .14); --smap-hid-fg: #f3c35b; --smap-hid-bg: rgba(245, 180, 40, .13); --smap-hid-line: #a87a1d; }

/* ---- head: title, counts, search and the two arrangements */
.smap-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 14px 24px; }
.smap-head-text { flex: 1 1 420px; min-width: 0; }
.smap-head h1 { display: flex; align-items: center; gap: 10px; font-size: 22px; font-weight: 600; color: var(--tw-gray-900); margin-bottom: 8px; }
.smap-head h1 i { font-size: 22px; color: var(--tw-primary); }
.smap-head p { font-size: 13px; line-height: 1.6; margin: 0; max-width: 780px; color: var(--tw-gray-700); }
.smap-head p strong { font-weight: 600; color: var(--tw-gray-900); font-variant-numeric: tabular-nums; }
.smap-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.smap-search { width: 300px; max-width: 100%; }
.smap-search input { min-width: 0; }
.smap-search input::-webkit-search-cancel-button { cursor: pointer; }
.smap-kbd { font: 500 11px/1 ui-monospace, SFMono-Regular, Menlo, monospace; padding: 3px 6px; border-radius: 4px;
            border: 1px solid var(--tw-gray-300); color: var(--tw-gray-600); background: var(--tw-gray-100); }
.smap-search:focus-within .smap-kbd { display: none; }

.smap-views { display: inline-flex; padding: 3px; gap: 2px; border-radius: 8px; background: var(--tw-gray-100); border: 1px solid var(--tw-gray-200); }
.smap-view { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 6px; font-size: 12.5px; font-weight: 500;
             color: var(--tw-gray-700); text-decoration: none; white-space: nowrap; transition: color .15s, background .15s; }
.smap-view i { font-size: 14px; color: var(--tw-gray-500); }
.smap-view:hover { color: var(--tw-primary); }
.smap-view.is-active { background: var(--tw-card-background-color, #fff); color: var(--tw-gray-900); box-shadow: 0 1px 2px rgba(15, 23, 42, .08); }
.smap-view.is-active i { color: var(--tw-primary); }
[data-theme-mode="dark"] .smap-view.is-active { background: var(--tw-gray-200); box-shadow: none; }

.smap-count { display: inline-block; min-width: 20px; padding: 1px 6px; border-radius: 999px; font-size: 11px; font-weight: 600; line-height: 16px;
              text-align: center; font-variant-numeric: tabular-nums; color: var(--tw-gray-700); background: var(--tw-gray-200); }
.smap-count.is-new { color: var(--smap-new-fg); background: var(--smap-new-bg); }

/* ---- jump to a section */
.smap-jump { display: flex; flex-wrap: wrap; gap: 8px; }
.smap-jump a { display: inline-flex; align-items: center; gap: 7px; padding: 5px 7px 5px 11px; border-radius: 999px; font-size: 12.5px; font-weight: 500;
               color: var(--tw-gray-800); text-decoration: none; border: 1px solid var(--tw-gray-200); background: var(--tw-card-background-color, #fff);
               transition: border-color .15s, color .15s; }
.smap-jump a i { font-size: 14px; color: var(--tw-gray-500); }
.smap-jump a:hover { border-color: var(--tw-primary); color: var(--tw-primary); }
.smap-jump a:hover i { color: var(--tw-primary); }
.smap-jump a[aria-disabled="true"] { opacity: .45; pointer-events: none; }

/* ---- sections and their cards */
.smap-section { display: flex; flex-direction: column; gap: 10px; min-width: 0; scroll-margin-top: 82px; }
.smap-section-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.smap-section-head h2 { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; color: var(--tw-gray-900); }
.smap-section-head h2 i { font-size: 17px; color: var(--tw-primary); }
.smap-section-head p { font-size: 12px; margin: 0; color: var(--tw-gray-600); }
.smap-card { overflow: hidden; }

.smap-row { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 10px 28px; padding: 15px 20px; min-width: 0;
            border-top: 1px solid var(--tw-gray-200); transition: background .15s; }
.smap-card > :first-child, .smap-card > .is-first { border-top: 0; }
.smap-sub { padding: 8px 20px 7px; border-top: 1px solid var(--tw-gray-200); background: var(--tw-gray-100);
            font-size: 11px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--tw-gray-600); }
.smap-row:hover { background: color-mix(in srgb, var(--tw-gray-100) 70%, transparent); }
.smap-row.is-hidden { box-shadow: inset 3px 0 0 var(--smap-hid-line); }
.smap-row:not(:has(.smap-tabs)) { grid-template-columns: minmax(0, 1fr); }

.smap-page { min-width: 0; }
.smap-title-line { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.smap-title { font-size: 14px; font-weight: 600; line-height: 1.45; color: var(--tw-gray-900); text-decoration: none; overflow-wrap: anywhere; }
.smap-title:hover { color: var(--tw-primary); text-decoration: underline; text-underline-offset: 3px; }
.smap-desc { margin: 4px 0 0; font-size: 12.5px; line-height: 1.55; color: var(--tw-gray-700); max-width: 72ch; }
.smap-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 7px; margin-top: 6px; font-size: 11.5px; color: var(--tw-gray-600); font-variant-numeric: tabular-nums; }
.smap-path { font: 11.5px/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--tw-gray-600); overflow-wrap: anywhere; }
.smap-dot { color: var(--tw-gray-400); }

.smap-badge, .smap-inline-badge { display: inline-flex; align-items: center; padding: 1px 7px; border-radius: 999px; font-size: 10.5px; font-weight: 600;
                                  line-height: 16px; white-space: nowrap; letter-spacing: .01em; }
.smap-badge.is-new { color: var(--smap-new-fg); background: var(--smap-new-bg); }
.smap-badge.is-hidden, .smap-inline-badge.is-hidden { color: var(--smap-hid-fg); background: var(--smap-hid-bg); cursor: help; }
.smap-inline-badge.is-hidden { cursor: default; font-size: 11.5px; }
.smap-badge.is-kind { color: var(--tw-gray-600); background: var(--tw-gray-100); border: 1px solid var(--tw-gray-200); font-weight: 500; }

/* ---- a page's tabs, grouped: tabs, modes, symbols, years, sections of the page */
.smap-tabs { display: flex; flex-direction: column; gap: 8px; min-width: 0; padding-top: 1px; }
.smap-tab-group { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 8px; align-items: baseline; }
.smap-tab-label { font-size: 10.5px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--tw-gray-500); padding-top: 5px; }
.smap-tab-list { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.smap-tab { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; padding: 3px 9px; border-radius: 6px; font-size: 12px; line-height: 1.45;
            color: var(--tw-gray-800); text-decoration: none; border: 1px solid var(--tw-gray-200); background: var(--tw-gray-100);
            transition: border-color .15s, color .15s, background .15s; }
.smap-tab:hover, .smap-tab:focus-visible { border-color: var(--tw-primary); color: var(--tw-primary); background: var(--tw-primary-light); }
.smap-tab.is-hidden { border-style: dashed; border-color: var(--smap-hid-line); }
.smap-tab-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--smap-new-fg); flex: none; }
.smap.is-searching .smap-tab.is-match { border-color: var(--tw-primary); color: #fff; background: var(--tw-primary); }
.smap.is-searching .smap-tab.is-match .smap-tab-dot { background: #fff; }

/* ---- by date added */
.smap-lead { margin: -8px 0 0; font-size: 12.5px; color: var(--tw-gray-600); }
.smap-row.smap-when { grid-template-columns: 58px minmax(0, 1fr); gap: 4px 16px; }
.smap-date { font-size: 12.5px; font-weight: 600; color: var(--tw-gray-700); font-variant-numeric: tabular-nums; padding-top: 2px; white-space: nowrap; }
.smap-section-chip { display: inline-flex; align-items: center; gap: 5px; padding: 0 7px 0 5px; border-radius: 5px; font-size: 11px; line-height: 18px;
                     color: var(--tw-gray-700); background: var(--tw-gray-100); border: 1px solid var(--tw-gray-200); }
.smap-section-chip i { font-size: 12px; color: var(--tw-gray-500); }
.smap-when-tabs { margin-top: 7px; }
.smap-section-head h2 .smap-count { margin-left: 2px; }

/* ---- nothing found */
.smap-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 36px 16px; border-radius: .75rem;
              border: 1px dashed var(--tw-gray-300); color: var(--tw-gray-600); text-align: center; font-size: 13px; }
.smap-empty i { font-size: 26px; color: var(--tw-gray-400); }
.smap-empty p { margin: 0; }
.smap-empty[hidden], .smap-row[hidden], .smap-sub[hidden], .smap-section[hidden] { display: none; }

@media (max-width: 1100px) {
  .smap-row { grid-template-columns: minmax(0, 1fr); }
  .smap-tabs { padding-top: 2px; }
}
@media (min-width: 1024px) and (max-width: 1300px) { body:not(.sidebar-collapse) .smap-row { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) {
  .smap { gap: 18px; }
  .smap-head h1 { font-size: 20px; }
  .smap-tools, .smap-search { width: 100%; }
  .smap-views { width: 100%; }
  .smap-view { flex: 1 1 0; justify-content: center; padding: 6px 8px; }
  .smap-kbd { display: none; }
  .smap-jump { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px; padding: 0 16px 2px; scrollbar-width: none; }
  .smap-jump::-webkit-scrollbar { display: none; }
  .smap-jump a { flex: none; }
  .smap-row { padding: 13px 14px; }
  .smap-sub { padding: 8px 14px 7px; }
  .smap-tab-group { grid-template-columns: minmax(0, 1fr); gap: 5px; }
  .smap-tab-label { padding-top: 0; }
  .smap-row.smap-when { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .smap-section { scroll-margin-top: 72px; }
}
