/* ==========================================================================
   CAS Maramureș — Harta site-ului (se încarcă doar pe pagina cu șablonul „sitemap”)
   Folosește exclusiv variabilele de design ale site-ului: tema întunecată și
   modurile de accesibilitate se aplică automat.
   ========================================================================== */

.sm { padding: clamp(1.75rem, 1.2rem + 2vw, 3rem) 0 clamp(3rem, 2rem + 3vw, 5rem); }
.sm .icon { width: 1.1em; height: 1.1em; }

/* ---------- bara de instrumente: căutare, filtre, contor ---------- */
.sm-bar {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .75rem 1rem; align-items: center;
  background: var(--surface-card); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm); padding: .75rem;
}
.no-js .sm-bar { display: none; }
.sm-search { position: relative; display: flex; align-items: center; margin: 0; }
.sm-search > .icon { position: absolute; left: 1rem; color: var(--text-muted); pointer-events: none; }
.sm-search input {
  width: 100%; min-height: 48px; padding: .65rem 3rem .65rem 2.85rem; font: inherit; font-size: 1rem;
  color: var(--text-strong); background: var(--surface-sunken, var(--bg-section-alt)); border: 1px solid var(--border-default);
  border-radius: var(--radius-md); transition: border-color var(--dur-fast), box-shadow var(--dur-fast), background var(--dur-fast);
}
.sm-search input::placeholder { color: var(--text-muted); opacity: 1; }
.sm-search input:focus { outline: none; border-color: var(--navy-500); box-shadow: var(--shadow-focus); background: var(--surface-card); }
.sm-search input::-webkit-search-cancel-button { cursor: pointer; }
.sm-search kbd {
  position: absolute; right: .85rem; min-width: 1.6rem; padding: .05rem .4rem; text-align: center;
  font: 600 .8rem/1.4 var(--font-sans); color: var(--text-muted); border: 1px solid var(--border-default);
  border-bottom-width: 2px; border-radius: var(--radius-xs); pointer-events: none; transition: opacity var(--dur-fast);
}
.sm-search:focus-within kbd, .sm-search:has(input:not(:placeholder-shown)) kbd { opacity: 0; }
@media (hover: none) { .sm-search kbd { display: none; } }

.sm-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.sm-btn {
  display: inline-flex; align-items: center; gap: .45rem; min-height: 44px; padding: .5rem .95rem;
  font: inherit; font-size: .9rem; font-weight: 600; color: var(--text-strong); background: transparent;
  border: 1px solid var(--border-default); border-radius: var(--radius-pill); cursor: pointer;
  transition: background var(--dur-fast), border-color var(--dur-fast), color var(--dur-fast);
}
.sm-btn:hover { background: var(--bg-section-alt); border-color: var(--navy-500); }
.sm-btn[aria-pressed="true"] { background: var(--navy-500); border-color: var(--navy-500); color: #fff; }
.sm-btn .icon { color: currentColor; }
.sm-count { grid-column: 1 / -1; margin: 0 .25rem; font-size: var(--fs-small); color: var(--text-muted); font-variant-numeric: tabular-nums; }

/* ---------- salt rapid la secțiuni ---------- */
.sm-jump {
  display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.1rem 0 0; padding: .15rem 0;
}
.sm-jump a {
  flex: 0 0 auto; scroll-snap-align: start; display: inline-flex; align-items: center; gap: .4rem;
  min-height: 40px; padding: .4rem .85rem; border-radius: var(--radius-pill); font-size: .875rem; font-weight: 600;
  color: var(--text-strong); background: var(--bg-section-alt); border: 1px solid transparent; text-decoration: none;
  transition: border-color var(--dur-fast), background var(--dur-fast), opacity var(--dur-base);
}
.sm-jump a:hover { border-color: var(--navy-500); background: var(--surface-card); }
.sm-jump a .icon { color: var(--navy-500); }
:root[data-theme="dark"] .sm-jump a .icon { color: var(--navy-300); }
.sm-jump a.is-dim { opacity: .4; }

/* ---------- grila de secțiuni ---------- */
.sm-grid {
  display: grid; gap: clamp(1rem, .6rem + 1.2vw, 1.5rem); margin-top: clamp(1.25rem, 1rem + 1vw, 2rem);
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); align-items: start;
}
.sm-card {
  container: sm-card / inline-size;
  position: relative; background: var(--surface-card); border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); padding: 1.25rem 1.1rem 1rem;
  scroll-margin-top: calc(var(--header-height) + 1.25rem);
  content-visibility: auto; contain-intrinsic-size: auto 420px;
  transition: box-shadow var(--dur-base) var(--ease-standard), border-color var(--dur-base);
}
/* rigla roșie a site-ului, în colțul de sus */
.sm-card::before {
  content: ""; position: absolute; top: -1px; left: 1.1rem; width: 2.75rem; height: var(--rule-red, 3px);
  background: var(--red-500); border-radius: 0 0 2px 2px;
}
.sm-card:hover { box-shadow: var(--shadow-md); }
.sm-card:target { border-color: var(--navy-300); box-shadow: 0 0 0 3px color-mix(in srgb, var(--navy-500) 22%, transparent), var(--shadow-md); }
.sm-card[hidden] { display: none; }

.sm-card__head { display: flex; gap: .85rem; align-items: flex-start; }
.sm-card__icon {
  flex: 0 0 auto; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: var(--radius-md);
  background: var(--icon-tile, var(--navy-050)); color: var(--icon-tile-fg, var(--navy-600));
}
.sm-card__icon .icon { width: 1.35rem; height: 1.35rem; }
.sm-card__titles { min-width: 0; flex: 1; }
.sm-card__title { margin: 0; font-size: 1.15rem; line-height: var(--lh-snug, 1.3); text-wrap: balance; }
.sm-card__title a, .sm-card__title span { color: var(--text-strong); text-decoration: none; }
.sm-card__title a:hover { color: var(--text-link); text-decoration: underline; text-underline-offset: 3px; }
.sm-card__meta { display: flex; gap: .5rem; align-items: baseline; margin: .2rem 0 0; font-size: .8125rem; color: var(--text-muted); }
.sm-card__lead {
  margin: .8rem 0 0; font-size: .9rem; line-height: 1.5; color: var(--text-body); text-wrap: pretty;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* ---------- arborele de pagini ---------- */
.sm-tree { list-style: none; margin: 0; padding: 0; }
.sm-tree--root { margin-top: .85rem; padding-top: .6rem; border-top: 1px solid var(--border-subtle); }
.sm-node { position: relative; margin: 0; padding: 0; }
.sm-node[hidden] { display: none; }

.sm-row {
  display: grid; grid-template-columns: 1.75rem minmax(0, 1fr) auto auto auto; align-items: center; column-gap: .35rem;
  min-height: 2.5rem; padding: .1rem .4rem .1rem .1rem; border-radius: var(--radius-sm);
  transition: background var(--dur-fast);
}
.sm-row:hover, .sm-row:focus-within { background: var(--bg-section-alt); }
.sm-row > .sm-toggle, .sm-row > .sm-dot { grid-column: 1; }
.sm-row > .sm-link { grid-column: 2; }
.sm-row > .sm-new { grid-column: 3; }
.sm-row > .sm-n { grid-column: 4; }

.sm-toggle {
  display: grid; place-items: center; width: 1.75rem; height: 1.75rem; padding: 0; margin: 0;
  background: none; border: 0; border-radius: var(--radius-xs); color: var(--text-muted); cursor: pointer;
}
.sm-toggle:hover { color: var(--text-strong); background: var(--surface-card); }
.sm-toggle .icon { width: 1rem; height: 1rem; transition: transform var(--dur-base) var(--ease-standard); }
.sm-node[data-open] > .sm-row .sm-toggle .icon { transform: rotate(90deg); }
.no-js .sm-toggle { visibility: hidden; }
.sm-dot { justify-self: center; width: .4rem; height: .4rem; border-radius: 50%; background: var(--navy-200); }
:root[data-theme="dark"] .sm-dot { background: var(--navy-400); }

.sm-link {
  min-width: 0; padding: .35rem 0; color: var(--text-strong); font-size: .9375rem; line-height: 1.35;
  text-decoration: none; overflow-wrap: anywhere;
}
.sm-link:hover { color: var(--text-link); text-decoration: underline; text-underline-offset: 3px; }
.sm-node:has(> .sm-kids) > .sm-row .sm-link { font-weight: 600; }
.sm-ext { width: .8rem !important; height: .8rem !important; margin-left: .25rem; color: var(--text-muted); vertical-align: 0; }

/* indicator: pagină actualizată în ultimele 30 de zile — doar cu filtrul „Actualizate recent” activ */
.sm-new { display: none; }
.sm[data-recent-on] .sm-new { display: block; width: .45rem; height: .45rem; border-radius: 50%; background: var(--status-success, #1a7f4b); box-shadow: 0 0 0 3px color-mix(in srgb, var(--status-success, #1a7f4b) 18%, transparent); }
.sm-n {
  min-width: 1.5rem; padding: 0 .4rem; font-size: .75rem; font-weight: 700; line-height: 1.5rem; text-align: center;
  color: var(--text-muted); background: var(--bg-section-alt); border-radius: var(--radius-pill); font-variant-numeric: tabular-nums;
}
.sm-row:hover .sm-n { background: var(--surface-card); }

/* data actualizării: ocupă mereu locul ei (fără salturi), devine vizibilă la trecerea peste rând */
.sm-date { font-size: .75rem; color: var(--text-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.sm-row .sm-date { grid-column: 5; opacity: 0; transition: opacity var(--dur-base) var(--ease-standard); }
.sm-row:hover .sm-date, .sm-row:focus-within .sm-date, .sm[data-recent-on] .sm-node[data-recent] > .sm-row .sm-date { opacity: 1; }
@media (hover: none) { .sm-row .sm-date { opacity: .75; } }
@container sm-card (max-width: 24rem) { .sm-row .sm-date { display: none; } }

/* subpagini: deschidere animată (grid 0fr → 1fr), cu linie de legătură */
.sm-kids {
  display: grid; grid-template-rows: 0fr; visibility: hidden;
  transition: grid-template-rows var(--dur-base) var(--ease-standard), visibility 0s linear var(--dur-base);
}
.sm-node[data-open] > .sm-kids { grid-template-rows: 1fr; visibility: visible; transition-delay: 0s; }
.no-js .sm-kids { grid-template-rows: 1fr; visibility: visible; }
.sm-kids > .sm-tree { min-height: 0; overflow: hidden; margin-left: .85rem; padding-left: .55rem; border-left: 1px solid var(--border-subtle); }
.sm-node[data-open] > .sm-kids > .sm-tree { padding-bottom: .25rem; }

/* rezultatul căutării */
.sm-node.is-hit > .sm-row .sm-link { color: var(--text-link); }
::highlight(sm-hit) { background-color: color-mix(in srgb, var(--status-warning, #f2b705) 45%, transparent); color: inherit; }

.sm-empty {
  display: flex; gap: 1rem; align-items: flex-start; margin-top: 1.5rem; padding: 1.25rem 1.4rem;
  border: 1px dashed var(--border-default); border-radius: var(--radius-lg); color: var(--text-body);
}
.sm-empty > .icon { width: 1.5rem; height: 1.5rem; color: var(--text-muted); flex: 0 0 auto; margin-top: .1rem; }
.sm-empty p { margin: 0; }
.sm-empty[hidden] { display: none; }

.sm-foot a { color: var(--text-link); }
.sm-hero-meta { display: inline-flex; gap: .45rem; align-items: center; }

@media (max-width: 760px) {
  .sm-bar { grid-template-columns: 1fr; }
  .sm-jump {
    flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x proximity; overscroll-behavior-x: contain;
    scrollbar-width: none; margin-inline: -1.5rem; padding-inline: 1.5rem;
    mask-image: linear-gradient(90deg, transparent, #000 1.25rem, #000 calc(100% - 2rem), transparent);
  }
  .sm-jump::-webkit-scrollbar { display: none; }
  .sm-actions .sm-btn { flex: 1 1 auto; justify-content: center; }
  .sm-card { padding: 1.1rem .85rem .85rem; }
}

@media (prefers-reduced-motion: reduce) {
  .sm-kids, .sm-toggle .icon, .sm-row .sm-date, .sm-card { transition: none; }
}

/* contrast ridicat (modul de accesibilitate al site-ului) */
html.a11y-contrast .sm-card, html.a11y-contrast .sm-bar { border-color: currentColor; }
html.a11y-contrast .sm-row .sm-date { opacity: 1; }

/* tipărire: tot arborele deschis, fără instrumente */
@media print {
  .sm-bar, .sm-jump, .sm-empty, .sm-toggle, .sm-foot button { display: none !important; }
  .sm-grid { display: block; }
  .sm-card { break-inside: avoid; box-shadow: none; border: 1px solid #999; margin-bottom: 1rem; content-visibility: visible; }
  .sm-kids { grid-template-rows: 1fr !important; visibility: visible !important; }
  .sm-node[hidden], .sm-card[hidden] { display: block !important; }
  .sm-row .sm-date { opacity: 1 !important; display: inline !important; }
}