/* History of Bulgaria — overrides loaded after core/css/style.css: the
   inline SVG logo, the "Bulgaria Through Time" map layers
   (js/bulgaria-map.js), the prime ministers in "Who Was in Power", ten At a
   Glance ages in one row, and two rulers-tab icons. */

/* Inline SVG logo (partials/logo.php, site.php logo_partial) — sized like
   the image logo of the other sites. */
#app-logo.app-logo-svg { height:auto; overflow:visible; }

/* ════════════════════════════════════════
   Rulers page — Thrace & Rome (temple) and Khans & Tsars (domed church) tab
   icons; site.php gives those tabs icon 'none', so they are drawn here in
   the tab's text colour.
════════════════════════════════════════ */
.rp-tab[data-tab="ancient"]::before,
.rp-tab[data-tab="medieval"]::before {
  content:''; flex-shrink:0; width:14px; height:14px;
  background-color:currentColor;
  -webkit-mask:var(--bg-tab-icon) center / contain no-repeat;
  mask:var(--bg-tab-icon) center / contain no-repeat;
}
.rp-tab[data-tab="ancient"] {
  --bg-tab-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M1.8 5.4L8 2l6.2 3.4zM2.5 14h11M2 12.2h12M4 7.4v4.8M6.7 7.4v4.8M9.3 7.4v4.8M12 7.4v4.8' fill='none' stroke='%23000' stroke-width='1.3' stroke-linejoin='round' stroke-linecap='round'/%3E%3C/svg%3E");
}
.rp-tab[data-tab="medieval"] {
  --bg-tab-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 1v2.6M6.8 2.2h2.4M4.2 8a3.8 3.8 0 0 1 7.6 0M2.5 14V8h11v6M1.5 14h13M7 14v-2.6a1 1 0 0 1 2 0V14' fill='none' stroke='%23000' stroke-width='1.3' stroke-linejoin='round' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* ════════════════════════════════════════
   At a Glance — ten ages: one column per age, all in a single row (core
   lays out eight); bibliography in four columns.
════════════════════════════════════════ */
@media (min-width:901px) {
  .ag-era-list { grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:minmax(0, 1fr); }
}
.bib-groups { grid-template-columns:repeat(4, minmax(0, 1fr)); }

/* ════════════════════════════════════════
   "Who Was in Power" — ruler and prime minister side by side (event modal
   and map panel); the columns stack once each would drop below ~200px.
════════════════════════════════════════ */
.em-power {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 200px), 1fr));
  gap:12px 20px;
  align-items:start;
}
.em-power > .em-power-heading { grid-column:1 / -1; margin-bottom:1px; }
a.em-power-card--pm { color:inherit; text-decoration:none; }
.em-power-party {
  display:flex; align-items:center; gap:6px;
  font-family:var(--f-ui); font-size:13px; line-height:1.3; color:var(--white-dim);
}
.em-power-party i { width:9px; height:9px; border-radius:50%; flex:none; }

/* ════════════════════════════════════════
   MAP — "Bulgaria Through Time" (js/bulgaria-map.js). Reuses core's .cm-*
   page, controls, panel and legend; these rules style the map layers (sea,
   land, one fading path per region, modern borders and outline, places and
   sea labels) and the panel parts shared with the other country maps.
════════════════════════════════════════ */
.cm-year-note {
  margin-top:4px;
  font-family:var(--f-ui); font-size:13px; color:var(--white-dim);
}
.cm-year-note:empty { display:none; }
.cm-tip-dates { margin-top:3px; font-variant-numeric:tabular-nums; color:var(--white-dim); }

/* Chapter events: dates can be long ("13–20 Jul 2026"), so a wider,
   right-aligned year column with the day/month on a smaller line below. */
.cm-events .ag-event { grid-template-columns:78px 9px minmax(0, 1fr); column-gap:16px; }
.cm-events .ag-event::before { left:98px; }
.cm-events .ag-event-year { overflow-wrap:break-word; text-align:right; }
.cm-event-day {
  display:block; margin-top:2px;
  font-family:var(--f-ui); font-size:12px; line-height:1.3; letter-spacing:0.2px;
  color:rgba(255,255,255,0.45);
}
.cm-events-heading { margin:30px 0 6px; }

/* Highlighted powers of the chapter (gold = Bulgarian, green = Thracian
   state or ruling power). */
.cm-chips { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.cm-chips[hidden] { display:none; }
.cm-chip {
  display:inline-flex; align-items:center; gap:7px;
  padding:3px 10px;
  border:1px solid rgba(255,255,255,0.14); border-radius:999px;
  background:rgba(255,255,255,0.03);
  font-family:var(--f-ui); font-size:13px; line-height:1.35; color:var(--white);
}

/* "Who Was in Power" in the year shown: the event modal's .em-power cards,
   compacted for the panel. */
.em-power.cm-power { display:block; margin-top:4px; } /* beats .em-power's grid; the cards grid below */
.em-power.cm-power[hidden] { display:none; }
.em-power.cm-power > .em-power-heading { margin:26px 0 10px; }
.cm-power-cards {
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 190px), 1fr));
  gap:10px 16px;
}
.cm-power .em-power-card { padding:6px 8px 6px 6px; border:1px solid rgba(255,255,255,0.1); border-radius:4px; gap:12px; }
.cm-power .em-power-portrait { width:42px; height:48px; }
.cm-power .em-power-name { font-size:16px; }
.cm-power .em-power-title,
.cm-power .em-power-reign { margin-top:2px; }
.cm-power .cm-power-static { cursor:default; }
.cm-power .cm-power-static:hover { border-color:rgba(255,255,255,0.1); background:none; }

.hm-sea { fill:#0a0f1a; }
.hm-land { fill:#1b1f2a; }
/* Each region path is shown (display) by bulgaria-map.js, then faded in with
   .is-on; a fading-out path no longer takes the pointer. */
.hm-regions path {
  stroke:#08060f; stroke-width:0.7; stroke-linejoin:round;
  vector-effect:non-scaling-stroke; cursor:pointer;
  opacity:0; pointer-events:none;
  transition:opacity 0.45s ease, fill 0.6s ease, filter 0.15s ease;
}
.hm-regions path.is-on { opacity:1; pointer-events:auto; }
.hm-regions.is-instant path { transition:none; }
.hm-regions path:hover { filter:brightness(1.25); stroke:var(--gold); stroke-width:1.4; }
.hm-focus { fill:#c9a844; }
.hm-related { fill:#6f8f80; }
.hm-neighbor { fill:#3a3646; fill-opacity:0.92; }
.hm-ref {
  fill:none; stroke:#f1e6cf; stroke-width:1.4; stroke-dasharray:5 4;
  vector-effect:non-scaling-stroke; opacity:0.8; pointer-events:none;
}
/* Today's national borders, shown with the map's "Modern borders" button. */
.hm-modern {
  fill:none; stroke:#a9b8c6; stroke-width:0.8; stroke-dasharray:3 3;
  vector-effect:non-scaling-stroke; opacity:0; pointer-events:none;
  transition:opacity 0.4s ease;
}
.hm-modern.is-on { opacity:0.55; }
#cm-zborders[aria-pressed="true"] { color:var(--gold); border-color:var(--gold); }
/* Seas and the Danube; font size is set in map units by bulgaria-map.js. */
.hm-labels { pointer-events:none; }
.hm-label { font-family:var(--f-heading); text-anchor:middle; letter-spacing:0.12em; }
.hm-label--sea { fill:#5d7a92; font-style:italic; }
.hm-label--river { fill:#6f8fae; font-style:italic; letter-spacing:0.06em; }
/* Places: radius, star size, font size and halo are set in map units by
   bulgaria-map.js so they read at a constant screen size at every zoom. */
.hm-cities { pointer-events:none; }
.hm-city { opacity:0; visibility:hidden; transition:opacity 0.4s ease, visibility 0s linear 0.4s; }
.hm-city.is-on { opacity:1; visibility:visible; transition:opacity 0.4s ease; }
.hm-city circle { fill:#f4ecd6; stroke:#08060f; stroke-width:1.2; vector-effect:non-scaling-stroke; }
.hm-city path { fill:var(--gold); stroke:#08060f; stroke-width:1; vector-effect:non-scaling-stroke; }
.hm-city text {
  font-family:var(--f-heading); font-weight:600; fill:var(--white);
  paint-order:stroke; stroke:#08060f; stroke-linejoin:round;
}
.hm-city--site text { font-weight:500; fill:rgba(255,255,255,0.82); }
@media (prefers-reduced-motion: reduce) {
  .hm-regions path, .hm-city, .hm-modern { transition:none; }
}

/* Legend and tooltip swatches */
.hm-sw { display:inline-block; width:11px; height:11px; flex:none; }
.hm-sw--focus { background:#c9a844; }
.hm-sw--related { background:#6f8f80; }
.hm-sw--neighbor { background:#3a3646; box-shadow:inset 0 0 0 1px rgba(255,255,255,0.18); }
.cm-lg i.hm-sw--ref { width:18px; height:0; background:none; }
.hm-sw--ref { border-top:2px dashed #f1e6cf; }
.cm-lg i.hm-sw--capital {
  width:12px; height:12px; background:var(--gold);
  clip-path:polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}
.cm-lg i.hm-sw--site { width:7px; height:7px; margin:0 2px; border-radius:50%; background:#f4ecd6; }

/* 42 keyframes on a stretched scale: bulgaria-map.js marks the labels that
   would collide at the track's width (the current one always shows). */
.cm-tick-labels button.hm-minor:not(.cur) { display:none; }
/* Keep the first and last keyframe years inside the track. */
.cm-tick-labels button:first-child { transform:none; }
.cm-tick-labels button:last-child { transform:translateX(-100%); }
@media (max-width:900px) {
  /* The era count is set inline by bulgaria-map.js; wrap to rows here. */
  .cm-eras { grid-template-columns:repeat(3, minmax(0, 1fr)) !important; }
}

/* Event modal / timeline map cards: the borders of the year. */
.em-map-thumb .hm-thumb-land { fill:#2a2633; }
.em-map-thumb .hm-thumb-focus { fill:var(--gold); filter:drop-shadow(0 0 6px rgba(201,168,68,0.6)); }
.em-map-thumb .hm-thumb-related { fill:#8a7a4a; }
.em-map-thumb .hm-thumb-ref {
  fill:none; stroke:#f1e6cf; stroke-width:1.2; stroke-dasharray:3 3;
  vector-effect:non-scaling-stroke; opacity:0.6;
}
