/* ============================================================
   notices.css — Aktuális hirdetmények / Current notices
   Subpage of hirdetményfigyelés, sibling of cpv-kereso. Rows are
   rendered by js/notices.js from a committed JSON, so nothing here
   appears in any *.html at build time.

   DELIBERATELY A SEPARATE STYLESHEET. PurgeCSS runs over
   editorial.src.css against a `**/*.html` content glob. Every class
   below is applied by JS to elements that do not exist in the built
   markup, so putting them in editorial.src.css would delete the rules
   on the next full build unless each one were hand-added to the
   safelist. A dedicated file is not purged at all.
   ============================================================ */

/* editorial.css converts section H2s to the serif display face through an
   explicit allow-list of section classes (.services, .cpv-search-section,
   .threshold-checker-section and so on). A class that is not on that list
   falls back to the body sans and picks up main.css `h2{color:#1e40af}`, so
   it renders as blue Inter instead of ink Source Serif.
   editorial.src.css is the place this really belongs, but it is mid-edit in
   another workstream, so the cpv-search-section treatment is mirrored here
   verbatim. Fold these selectors into that allow-list when the file is free
   and delete this block. */
.notices-section,
.notices-coverage {
  color: var(--color-ink);
}

.notices-section .section-header,
.notices-coverage .section-header {
  text-align: center;
  margin-bottom: 2rem;
}

.notices-section .section-header h2,
.notices-coverage .section-header h2 {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.015em;
  font-size: clamp(1.85rem, 3.5vw, 2.6rem);
  line-height: 1.1;
  color: var(--color-ink);
  margin-bottom: 1rem;
}

.notices-section .section-header p,
.notices-coverage .section-header p {
  font-size: 1.02rem;
  line-height: 1.6;
  color: rgba(15, 23, 42, 0.72);
  max-width: 62ch;
  margin: 0 auto;
}

/* Matches .cpv-search-section. The 72px top is what separates the first H2
   from the hero. */
.notices-section {
  background: var(--color-cream);
  padding: 72px 0 80px;
}

.notices-card {
  max-width: 760px;
  margin: 0 auto;
  padding: 1.75rem;
  background: #fff;
  border: 1px solid var(--color-rule);
  border-radius: 4px;
}

.notices-input {
  width: 100%;
}

/* Sizes, spacing and muted-ink values below mirror the .cpv-search-* and
   .cpv-result-* families in editorial.src.css. The two tools sit one click
   apart under the same parent and are read as a pair. */
.notices-status {
  margin: 0.7rem 0 0;
  font-family: var(--font-mono);
  font-size: 0.74rem;
  letter-spacing: 0.06em;
  color: rgba(15, 23, 42, 0.6);
}

.notices-note {
  margin: 0.8rem 0 0;
  font-size: 0.92rem;
  line-height: 1.55;
  color: rgba(15, 23, 42, 0.72);
}

.notices-meta {
  max-width: 760px;
  margin: 1.25rem auto 0;
  font-size: 0.82rem;
  color: var(--color-text-light);
}

/* ---------- Result rows ---------- */

.notices-results {
  list-style: none;
  margin: 1.25rem 0 0;
  padding: 0;
  border-top: 1px solid var(--color-rule);
}

.notice-row {
  display: grid;
  grid-template-columns: 8.5rem 1fr;
  gap: 0 1.25rem;
  padding: 0.8rem 0;
  border-bottom: 1px solid var(--color-rule);
}

/* A <p>, so main.css `p{margin-bottom:1rem}` would otherwise add a full line
   of dead space inside the grid cell. */
.notice-when {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  margin: 0;
}

.notice-deadline {
  font-family: var(--font-mono);
  font-size: 0.86rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--color-cobalt);
}

.notice-days {
  font-size: 0.75rem;
  line-height: 1.45;
  color: rgba(15, 23, 42, 0.55);
}

/* Inside the weekly refresh window, so this notice may expire before the
   data is regenerated. Flagged, never hidden. */
.notice-row--urgent {
  border-left: 2px solid #b45309;
  padding-left: 0.9rem;
}

.notice-row--urgent .notice-days {
  color: #b45309;
  font-weight: 500;
}

/* min-width:0 because a grid item defaults to min-content width, and the
   buyer-authored titles carry long unbroken reference tokens
   ("...2026-2027_II") that otherwise force the column wider than its track. */
.notice-body {
  min-width: 0;
  overflow-wrap: anywhere;
}

.notice-label {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(15, 23, 42, 0.5);
  margin: 0 0 0.25rem;
}

/* An <h3>, so main.css `h3{color:#1e40af}` and `h3{font-size:1.875rem}` both
   apply unless restated. Colour especially: without it every row title renders
   in the primary blue, which reads as a link. */
.notice-title {
  font-family: var(--font-body);
  font-size: 0.98rem;
  font-weight: 600;
  line-height: 1.45;
  color: var(--color-ink);
  margin: 0 0 0.25rem;
}

.notice-buyer {
  font-size: 0.8rem;
  line-height: 1.45;
  color: rgba(15, 23, 42, 0.55);
  margin: 0 0 0.4rem;
}

.notice-link {
  font-size: 0.82rem;
  color: var(--color-cobalt);
}

/* ---------- Coverage ---------- */

/* White against the cream filter section, matching how .cpv-divisions-section
   alternates against .cpv-search-section. */
.notices-coverage {
  background: #ffffff;
  padding: 72px 0 80px;
}

.notices-coverage-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem;
  max-width: 860px;
  margin: 0 auto;
}

/* Also an <h3>, so the same main.css colour and size rules apply. */
.notices-coverage-label {
  font-family: var(--font-body);
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.45;
  color: var(--color-ink);
  margin: 0 0 0.6rem;
}

.notices-coverage-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.notices-coverage-list li {
  position: relative;
  padding-left: 1.1rem;
  margin-bottom: 0.4rem;
  font-size: 0.92rem;
  color: var(--color-text-medium);
}

.notices-coverage-list li::before {
  position: absolute;
  left: 0;
  font-family: var(--font-mono);
}

.notices-coverage-col--yes .notices-coverage-list li::before {
  content: "+";
  color: var(--color-cobalt);
}

.notices-coverage-col--no .notices-coverage-list li::before {
  content: "\2013";
  color: var(--color-text-light);
}

.notices-coverage-note {
  max-width: 860px;
  margin: 1.75rem auto 0;
  padding-top: 1.25rem;
  border-top: 1px solid var(--color-rule);
  font-size: 0.92rem;
  color: var(--color-text-medium);
}

/* ---------- Closing CTA ---------- */

/* The closing block uses the site-wide .cta shell, so main.css already styles
   the heading, the paragraphs and both buttons. Only the supporting checklist
   needs rules, and it has to opt out of the section's centring: four clauses
   this long are unreadable centred. */
.cta .cta-checklist {
  max-width: 600px;
  margin: 0 auto 2rem;
  padding-left: 1.3rem;
  list-style: disc;
  text-align: left;
}

.cta .cta-checklist li {
  margin-bottom: 0.4rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.9);
}

@media (max-width: 640px) {
  .notice-row {
    grid-template-columns: 1fr;
    gap: 0.5rem;
  }

  .notice-when {
    flex-direction: row;
    align-items: baseline;
    gap: 0.6rem;
  }

  .notices-coverage-grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}