/* Blagovist «Сьогодні» — design tokens + components. Mobile first (360–414 px), one column up to 720 px.
   Tokens are the base for the rest of the site: change them here, not in components. */
.bvt {
	--bvt-red: #c0312b;
	--bvt-red-ink: #fff;
	--bvt-ink: #1e1e1e;
	--bvt-text: #2b2724;
	--bvt-muted: #6e6862;
	--bvt-faint: #8a847e;
	--bvt-line: #eeeae6;
	--bvt-tint: #fbf6f4;
	--bvt-tint-line: #eee3df;
	--bvt-green: #2f6b2a;
	--bvt-bg: #fff;
	--bvt-serif: "Playfair Display", Georgia, serif;
	--bvt-sans: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--bvt-cs: "triodion", "TriIEUcs", "Open Sans", serif;
	--bvt-s1: 4px; --bvt-s2: 8px; --bvt-s3: 12px; --bvt-s4: 16px; --bvt-s5: 24px; --bvt-s6: 32px;
	--bvt-r: 10px;

	max-width: 720px;
	margin: 0 auto;
	color: var(--bvt-ink);
	font-family: var(--bvt-sans);
	font-size: 16px;
	line-height: 1.6;
	text-align: left;
}
body.ashe-dark-mode .bvt, html[data-theme="dark"] .bvt, body[data-theme="dark"] .bvt { /* theme's moon switch */
	--bvt-red: #ef7a72;
	--bvt-red-ink: #1b1716;
	--bvt-ink: #ece6e1;
	--bvt-text: #ddd6d0;
	--bvt-muted: #b2aaa3;
	--bvt-faint: #9a928b;
	--bvt-line: #3a3431;
	--bvt-tint: #2a2422;
	--bvt-tint-line: #463c39;
	--bvt-green: #8fcf86;
	--bvt-bg: #1b1716;
}
.bvt *, .bvt *::before, .bvt *::after { box-sizing: border-box; }
/* .page-content a (theme, inline CSS) paints every link red: beat it on specificity, not with !important */
.page-content .bvt a, .bvt a { color: inherit; text-decoration: none; }
.page-content .bvt a:hover, .bvt a:hover { color: var(--bvt-red); }
.bvt p { margin: 0; }
.bvt-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.bvt-center { text-align: center; }

/* date */
.bvt-head { display: flex; align-items: center; justify-content: space-between; gap: var(--bvt-s2); padding-top: var(--bvt-s2); }
.bvt-date { text-align: center; }
.bvt .bvt-h1 { margin: 0; font-family: var(--bvt-serif); font-size: 26px; line-height: 1.25; font-weight: 600; color: var(--bvt-ink); }
.bvt--feast .bvt-h1 { color: var(--bvt-red); }
.bvt-sub { font-size: 14px; color: var(--bvt-muted); }
.bvt-step { flex: none; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; border-radius: 22px; color: var(--bvt-red) !important; }
.bvt-step:hover { background: var(--bvt-tint); }
.bvt-pick { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: var(--bvt-s2); margin-top: var(--bvt-s4); }
/* «Обрати дату» looks like a button; the native date input lies on top of it, invisible, so a tap opens the system picker */
.bvt .bvt-pill, .page-content .bvt a.bvt-pill { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: var(--bvt-s2); height: 40px; padding: 0 var(--bvt-s4); border: 1px solid var(--bvt-red); border-radius: 20px; background: var(--bvt-bg); color: var(--bvt-red); font: 600 14px/1 var(--bvt-sans); cursor: pointer; white-space: nowrap; }
.bvt .bvt-pill svg { width: 18px; height: 18px; }
.bvt .bvt-pill:hover, .page-content .bvt a.bvt-pill:hover { background: var(--bvt-tint); color: var(--bvt-red); }
.page-content .bvt a.bvt-pill--solid, .bvt a.bvt-pill--solid, .bvt a.bvt-pill--solid:hover { background: var(--bvt-red); color: var(--bvt-red-ink); }
.bvt-pill input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; opacity: 0; cursor: pointer; -webkit-appearance: none; appearance: none; }
.bvt-pill input::-webkit-calendar-picker-indicator { position: absolute; inset: 0; width: auto; height: auto; cursor: pointer; }
.bvt-pill:focus-within { outline: 2px solid var(--bvt-red); outline-offset: 2px; }
.bvt-js .bvt-go { display: none !important; }

/* icons: one swipe row on phones, centred when they fit */
.bvt-icons { display: flex; gap: var(--bvt-s3); margin: var(--bvt-s5) calc(-1 * var(--bvt-s4)) 0; padding: 2px var(--bvt-s4) var(--bvt-s2); overflow-x: auto; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
.bvt-icons::after { content: ""; flex: 0 0 1px; }
.bvt-icon { flex: none; scroll-snap-align: center; }
.bvt-icon:first-child { margin-left: auto; }
.bvt-icon:last-of-type { margin-right: auto; }
.bvt-icon img { display: block; height: 180px; width: auto; border-radius: 6px; box-shadow: 0 1px 3px rgba(0, 0, 0, .18); }

/* day */
.bvt-day { margin-top: var(--bvt-s5); }
.bvt-meta { text-align: center; font-size: 15px; color: var(--bvt-muted); }
.bvt-fast { font-weight: 600; color: var(--bvt-red); }
.bvt-fast--none { color: var(--bvt-green); }
.bvt-saints { margin-top: var(--bvt-s3) !important; line-height: 1.7; color: var(--bvt-text); }
.bvt-saints strong, .bvt-saints b { color: var(--bvt-ink); }

/* sections */
.bvt-sec { margin-top: var(--bvt-s6); padding-top: 28px; border-top: 1px solid var(--bvt-line); }
.bvt .bvt-h2 { margin: 0 0 var(--bvt-s4); text-align: center; font-family: var(--bvt-serif); font-size: 22px; line-height: 1.3; font-weight: 400; color: var(--bvt-ink); }
.bvt .bvt-cap { margin: var(--bvt-s4) 0 var(--bvt-s1); font-family: var(--bvt-sans); font-size: 12px; line-height: 1.4; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--bvt-faint); }
.bvt-rgroup .bvt-cap { margin-top: 0; }
.bvt-kind { margin-top: var(--bvt-s2) !important; font-size: 13px; font-weight: 600; color: var(--bvt-muted); }
.bvt-rgroup + .bvt-rgroup { margin-top: var(--bvt-s5); }
.bvt-for-group + .bvt-for-group { margin-top: var(--bvt-s3); }
.bvt-for { margin-bottom: 2px !important; font-size: 14px; font-weight: 700; color: var(--bvt-ink); }
.bvt-for small { font-size: 12px; font-weight: 400; color: var(--bvt-faint); }
.bvt-row { display: flex; align-items: baseline; gap: var(--bvt-s3); padding: 4px 0; font-size: 15px; line-height: 1.5; border-bottom: 1px solid var(--bvt-line); }
.bvt-for-group .bvt-row:last-child { border-bottom: 0; }
.bvt-what { flex: 0 0 76px; font-size: 13px; color: var(--bvt-muted); }
.bvt-tag { display: inline-block; min-width: 3.2em; font-size: 13px; color: var(--bvt-muted); }
.bvt-rubric { margin-top: var(--bvt-s2) !important; font-size: 14px; line-height: 1.55; font-style: italic; color: var(--bvt-muted); }
.bvt-ref { flex: 1; min-width: 0; color: var(--bvt-faint); }
.bvt .bvt-ref a { color: var(--bvt-red); font-weight: 600; }
.bvt-more > summary { display: inline-flex; align-items: center; min-height: 40px; color: var(--bvt-red); font-weight: 600; font-size: 14px; cursor: pointer; list-style: none; }
.bvt-more > summary::-webkit-details-marker { display: none; }
.bvt-more[open] > summary { display: none; }
.bvt-text p + p { margin-top: var(--bvt-s3); }
.bvt-text { color: var(--bvt-text); line-height: 1.7; }
.bvt .bvt-text a { color: var(--bvt-red); }
.bvt-text > p:first-child em:first-child a { font-style: normal; }

/* troparia */
.bvt-card { border: 1px solid var(--bvt-line); border-radius: var(--bvt-r); padding: 0 var(--bvt-s4); }
.bvt-card + .bvt-card { margin-top: var(--bvt-s2); }
.bvt-card > summary { display: flex; align-items: center; justify-content: space-between; gap: var(--bvt-s3); min-height: 52px; padding: var(--bvt-s2) 0; font-weight: 700; font-size: 15px; line-height: 1.4; cursor: pointer; list-style: none; }
.bvt-card > summary::-webkit-details-marker { display: none; }
.bvt-card > summary::after { content: ""; flex: none; width: 8px; height: 8px; border-right: 2px solid var(--bvt-faint); border-bottom: 2px solid var(--bvt-faint); transform: rotate(45deg); margin: -4px 4px 0 0; }
.bvt-card[open] > summary::after { transform: rotate(-135deg); margin-top: 4px; }
.bvt-glas { margin-left: auto; font-weight: 400; font-size: 13px; color: var(--bvt-muted); white-space: nowrap; }
.bvt-cs { padding-bottom: var(--bvt-s4); font-size: 17px; line-height: 1.65; color: var(--bvt-text); }
.bvt-cs .bvt-kind:first-child { margin-top: 0 !important; }
.bvt-cs p + p { margin-top: var(--bvt-s1); }

/* prayers */
.bvt-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--bvt-s2); }
.bvt .bvt-tile { display: flex; flex-direction: column; justify-content: space-between; gap: 6px; min-height: 92px; padding: var(--bvt-s3); border: 1px solid var(--bvt-tint-line); border-radius: var(--bvt-r); background: var(--bvt-tint); }
.bvt-tile-kind { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--bvt-red); }
.bvt-tile-kind svg { width: 14px; height: 14px; }
.bvt-tile-name { font-size: 14px; font-weight: 600; line-height: 1.35; color: var(--bvt-ink); }
.bvt .bvt-tile:hover { border-color: var(--bvt-red); }
.bvt-cta { display: flex; align-items: center; gap: var(--bvt-s3); min-height: 56px; margin-top: var(--bvt-s3); padding: 0 var(--bvt-s4); border-radius: var(--bvt-r); background: var(--bvt-red); color: var(--bvt-red-ink) !important; }
.bvt-cta span { flex: 1; display: flex; flex-direction: column; line-height: 1.3; }
.bvt-cta strong { font-size: 15px; }
.bvt-cta small { font-size: 12px; opacity: .85; }
.bvt-cta:hover { filter: brightness(1.08); }
.bvt-pascha { display: flex; flex-wrap: wrap; align-items: center; gap: var(--bvt-s2) var(--bvt-s4); margin-bottom: var(--bvt-s3); padding: var(--bvt-s3) var(--bvt-s4); border: 1px solid var(--bvt-tint-line); border-radius: var(--bvt-r); }
.bvt-pascha .bvt-kind { width: 100%; margin: 0 !important; color: var(--bvt-red); }
.bvt .bvt-pascha a { color: var(--bvt-red); font-weight: 600; }

/* video */
.bvt-video { position: relative; display: block; margin-top: var(--bvt-s5); border-radius: var(--bvt-r); overflow: hidden; background: #000; aspect-ratio: 16 / 9; }
.bvt-video img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bvt-play { position: absolute; inset: 0; margin: auto; width: 64px; height: 44px; border-radius: 12px; background: rgba(0, 0, 0, .72); color: #fff; display: flex; align-items: center; justify-content: center; }
.bvt-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.bvt-hint { margin-top: var(--bvt-s6) !important; text-align: center; font-size: 13px; color: var(--bvt-faint); }

@media (min-width: 600px) {
	.bvt .bvt-h1 { font-size: 30px; }
	.bvt-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.bvt-what { flex-basis: 96px; }
	.bvt-icon img { height: 200px; }
}

/* icon zoom: tap → full icon over the page, tap again → back */
.bvt-zoom { position: fixed; inset: 0; z-index: 100000; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 16px; background: rgba(20, 16, 14, .97); cursor: zoom-out; }
.bvt-zoom img { max-width: 100%; max-height: calc(100vh - 120px); max-height: calc(100dvh - 120px); width: auto; height: auto; border-radius: 6px; box-shadow: 0 8px 32px rgba(0, 0, 0, .5); }
.bvt-zoom p { margin: 0; max-width: 560px; text-align: center; color: #eee; font-size: 14px; line-height: 1.4; }
.bvt-zoom a { color: #fff !important; font-size: 14px; font-weight: 600; text-decoration: underline !important; text-underline-offset: 3px; padding: 8px; }
.bvt-icon { cursor: zoom-in; }
