/* Mukova Church — component styles. Uses theme custom properties with fallbacks
   so the plugin still looks fine under any theme. */
:root {
	--mk-blue: var(--wp--preset--color--primary, #005c84);
	--mk-blue-soft: var(--wp--preset--color--primary-soft, #e6f1f6);
	--mk-gold: var(--wp--preset--color--accent, #d4a72c);
	--mk-ink: var(--wp--preset--color--contrast, #1f2430);
	--mk-muted: var(--wp--preset--color--muted, #6b7280);
	--mk-line: var(--wp--preset--color--line, #e5e7eb);
	--mk-surface: var(--wp--preset--color--surface, #ffffff);
	--mk-radius: 14px;
	--mk-shadow: 0 1px 2px rgba(0, 92, 132, .06), 0 8px 24px -12px rgba(0, 92, 132, .18);
}
.mukova-block { box-sizing: border-box; }
.mukova-block *, .mukova-block *::before, .mukova-block *::after { box-sizing: inherit; }
.mukova-muted { color: var(--mk-muted); font-size: .92em; }
.mukova-eyebrow { display: block; color: var(--mk-gold); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: .76rem; margin-bottom: .35rem; }
.mukova-tag { display: inline-block; background: var(--mk-blue-soft); color: var(--mk-blue); font-size: .72rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; padding: .2em .6em; border-radius: 999px; margin-bottom: .4rem; }
.mukova-card { background: var(--mk-surface); border: 1px solid var(--mk-line); border-radius: var(--mk-radius); padding: clamp(1rem, 3vw, 1.6rem); box-shadow: var(--mk-shadow); }
.mukova-button { display: inline-block; background: var(--mk-blue); color: #fff !important; text-decoration: none; font-weight: 600; padding: .75em 1.4em; border-radius: 999px; border: 0; cursor: pointer; line-height: 1.2; transition: transform .15s ease, box-shadow .15s ease; }
.mukova-button:hover, .mukova-button:focus-visible { transform: translateY(-1px); box-shadow: 0 6px 18px -8px var(--mk-blue); }
.mukova-button.is-secondary { background: var(--mk-blue-soft); color: var(--mk-blue) !important; }
.mukova-button.is-small { padding: .55em 1.1em; font-size: .9em; }
.mukova-button.is-whatsapp { background: #25d366; }
.mukova-link-arrow { font-weight: 600; text-decoration: none; color: var(--mk-blue); }
.mukova-link-arrow::after { content: " \2192"; }
.mukova-more { margin-top: 1rem; }
.mukova-section-title { margin: 2rem 0 1rem; }
.mukova-notice { padding: .9rem 1.1rem; border-radius: 10px; background: var(--mk-blue-soft); margin: 0 0 1.2rem; }
.mukova-notice-ok { background: #e6f4ea; color: #14532d; }
.mukova-notice-error { background: #fdecec; color: #7f1d1d; }

/* Programme */
.mukova-programme { background: var(--mk-surface); border: 1px solid var(--mk-line); border-radius: var(--mk-radius); box-shadow: var(--mk-shadow); overflow: hidden; }
.mukova-programme__head { padding: 1.25rem 1.4rem .6rem; }
.mukova-programme__date { margin: 0; font-size: clamp(1.25rem, 2.6vw, 1.6rem); }
.mukova-programme__note { margin: .5rem 0 0; color: var(--mk-muted); }
.mukova-programme__list { list-style: none; margin: 0; padding: .4rem 0 .6rem; }
.mukova-programme__slot { display: grid; grid-template-columns: 4.2rem 1fr; gap: .1rem .8rem; padding: .7rem 1.4rem; border-top: 1px solid var(--mk-line); align-items: baseline; }
.mukova-programme__time { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--mk-blue); }
.mukova-programme__name { font-weight: 600; }
.mukova-programme__person { grid-column: 2; color: var(--mk-ink); }
.mukova-programme__person small { color: var(--mk-muted); text-transform: uppercase; letter-spacing: .05em; font-size: .7rem; margin-right: .3rem; }
.mukova-programme__sub { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--mk-muted); margin: .2rem 1.4rem .3rem; }
.mukova-programme__midweek { list-style: none; margin: 0; padding: 0 1.4rem 1.2rem; }
.mukova-programme__midweek li { display: flex; flex-wrap: wrap; gap: .2rem .6rem; padding: .35rem 0; font-size: .95rem; }
.mukova-programme__midweek em { color: var(--mk-muted); font-style: normal; flex-basis: 100%; font-size: .85rem; }
.mukova-programme.is-compact .mukova-programme__slot { padding: .5rem 1.2rem; }
/* Special service: a gold foot on the card and the guest's line picked out. */
.mukova-programme.is-special { border-top: 4px solid var(--mk-gold); }
.mukova-programme__slot.is-guest .mukova-programme__person { color: var(--mk-blue); font-weight: 700; }
.mukova-programme__guest { display: inline-block; font-style: normal; font-size: .66rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--mk-blue); background: var(--mk-blue-soft); border-radius: 999px; padding: .15em .55em; margin-left: .35rem; vertical-align: middle; }

/* Sabbath School lesson (PDF) download */
.mukova-lesson { padding: .2rem 0; }
.mukova-programme .mukova-lesson { margin: .2rem 1.4rem 1.2rem; }
.mukova-lesson__row { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem .9rem; background: var(--mk-blue-soft); border-radius: 12px; padding: .8rem 1rem; }
.mukova-lesson__icon { font-size: 1.5rem; line-height: 1; }
.mukova-lesson__body { display: grid; gap: .1rem; flex: 1 1 200px; min-width: 0; }
.mukova-lesson__title { color: var(--mk-ink); font-weight: 600; line-height: 1.3; overflow-wrap: anywhere; }
.mukova-lesson__meta { color: var(--mk-muted); font-size: .82rem; }
.mukova-lesson__button { display: inline-block; background: var(--mk-blue); color: #fff !important; text-decoration: none; font-weight: 600; font-size: .92rem; padding: .6em 1.2em; border-radius: 999px; line-height: 1.2; white-space: nowrap; transition: transform .15s ease, box-shadow .15s ease; }
.mukova-lesson__button::before { content: "\2193  "; }
.mukova-lesson__button:hover, .mukova-lesson__button:focus-visible { transform: translateY(-1px); box-shadow: 0 6px 18px -8px var(--mk-blue); }
.mukova-block-lesson .mukova-lesson__row { border: 1px solid var(--mk-line); }

/* Events */
.mukova-events { display: grid; gap: 1rem; }
.mukova-event { display: grid; grid-template-columns: 3.6rem 1fr; gap: 1rem; align-items: start; background: var(--mk-surface); border: 1px solid var(--mk-line); border-radius: var(--mk-radius); padding: 1rem; box-shadow: var(--mk-shadow); }
.mukova-event.is-compact { box-shadow: none; padding: .7rem .9rem; }
.mukova-event__date { display: flex; flex-direction: column; align-items: center; justify-content: center; background: var(--mk-blue); color: #fff; border-radius: 10px; padding: .45rem .2rem; text-decoration: none; line-height: 1; }
.mukova-event__day { font-size: 1.4rem; font-weight: 700; }
.mukova-event__month { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; margin-top: .25rem; }
.mukova-event__title { margin: 0 0 .25rem; font-size: 1.1rem; }
.mukova-event__title a { text-decoration: none; color: inherit; }
.mukova-event__title a:hover { text-decoration: underline; }
.mukova-event__meta { margin: 0; color: var(--mk-muted); font-size: .9rem; }
.mukova-event__excerpt { margin: .5rem 0 0; }
.mukova-event__thumb { grid-column: 1 / -1; }
.mukova-event__thumb img { width: 100%; height: auto; border-radius: 10px; display: block; }
@media (min-width: 700px) {
	.mukova-event:not(.is-compact) { grid-template-columns: 3.6rem 1fr 160px; }
	.mukova-event__thumb { grid-column: auto; }
	.mukova-event__thumb img { aspect-ratio: 4/3; object-fit: cover; }
}
.mukova-month { font-size: .85rem; text-transform: uppercase; letter-spacing: .08em; color: var(--mk-muted); margin: 1rem 0 0; }
.mukova-filters, .mukova-pagination { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 1rem; }
.mukova-chip { display: inline-flex; align-items: center; gap: .3em; padding: .4em .9em; border-radius: 999px; border: 1px solid var(--mk-line); background: var(--mk-surface); color: var(--mk-ink); text-decoration: none; font-size: .9rem; cursor: pointer; }
.mukova-chip.is-active, .mukova-chip:has(input:checked) { background: var(--mk-blue); color: #fff; border-color: var(--mk-blue); }
.mukova-chip input { position: absolute; opacity: 0; width: 0; height: 0; }
.mukova-details { display: grid; gap: .5rem; margin: 1rem 0; padding: 0; }
.mukova-details > div { display: grid; grid-template-columns: 7rem 1fr; gap: .5rem; }
.mukova-details dt { color: var(--mk-muted); font-size: .85rem; text-transform: uppercase; letter-spacing: .05em; padding-top: .15em; }
.mukova-details dd { margin: 0; }

/* Sermons + player */
.mukova-sermons { display: grid; gap: 1rem; }
.mukova-sermon { background: var(--mk-surface); border: 1px solid var(--mk-line); border-radius: var(--mk-radius); padding: 1rem 1.1rem; box-shadow: var(--mk-shadow); }
.mukova-sermon__title { margin: 0 0 .2rem; font-size: 1.1rem; }
.mukova-sermon__title a { color: inherit; text-decoration: none; }
.mukova-sermon__title a:hover { text-decoration: underline; }
.mukova-sermon__meta { margin: 0 0 .7rem; color: var(--mk-muted); font-size: .9rem; }
.mukova-player { display: grid; grid-template-columns: auto 1fr auto; gap: .75rem; align-items: center; background: var(--mk-blue-soft); border-radius: 12px; padding: .6rem .75rem; }
.mukova-player audio { display: none; }
.mukova-player__play { width: 44px; height: 44px; border-radius: 50%; border: 0; background: var(--mk-blue); color: #fff; cursor: pointer; display: grid; place-items: center; flex-shrink: 0; }
.mukova-player__play:focus-visible, .mukova-player__download:focus-visible, .mukova-player__seek input:focus-visible { outline: 3px solid var(--mk-gold); outline-offset: 2px; }
.mukova-player__icon { width: 0; height: 0; border-style: solid; border-width: 8px 0 8px 14px; border-color: transparent transparent transparent #fff; margin-left: 3px; }
.mukova-player.is-playing .mukova-player__icon { width: 14px; height: 16px; border: 0; margin: 0; background: linear-gradient(90deg, #fff 0 5px, transparent 5px 9px, #fff 9px 14px); }
.mukova-player.is-loading .mukova-player__icon { width: 16px; height: 16px; border: 3px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; margin: 0; animation: mk-spin .8s linear infinite; }
@keyframes mk-spin { to { transform: rotate(360deg); } }
.mukova-player__main { min-width: 0; }
.mukova-player__title { display: block; font-weight: 600; margin-bottom: .2rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mukova-player__seek input { width: 100%; margin: 0; accent-color: var(--mk-blue); }
.mukova-player__times { display: flex; justify-content: space-between; font-size: .75rem; color: var(--mk-muted); font-variant-numeric: tabular-nums; }
.mukova-player__download { display: inline-flex; flex-direction: column; align-items: center; gap: .15rem; color: var(--mk-blue); text-decoration: none; font-size: .7rem; }
.mukova-player__dl-icon { width: 18px; height: 18px; border: 2px solid currentColor; border-top: 0; border-radius: 0 0 4px 4px; position: relative; margin-top: 8px; }
.mukova-player__dl-icon::before { content: ""; position: absolute; left: 50%; top: -9px; width: 2px; height: 12px; background: currentColor; transform: translateX(-50%); }
.mukova-player__dl-icon::after { content: ""; position: absolute; left: 50%; top: -2px; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateX(-50%) rotate(45deg); }
.mukova-filterbar { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: end; margin: 0 0 1rem; padding: 1rem; background: var(--mk-blue-soft); border-radius: 12px; }
.mukova-filterbar label { display: grid; gap: .25rem; font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: var(--mk-muted); }
.mukova-filterbar select { font: inherit; padding: .5em .7em; border-radius: 8px; border: 1px solid var(--mk-line); background: #fff; color: var(--mk-ink); min-width: 10rem; }
.mukova-count { margin: 0 0 .6rem; }

/* Gallery */
.mukova-albums { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; }
.mukova-album { display: block; text-decoration: none; color: inherit; border-radius: var(--mk-radius); overflow: hidden; background: var(--mk-surface); border: 1px solid var(--mk-line); box-shadow: var(--mk-shadow); }
.mukova-album__cover { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; background: var(--mk-blue-soft); }
.mukova-album__body { display: block; padding: .8rem 1rem 1rem; }
.mukova-album__title { display: block; font-weight: 600; }
.mukova-album__meta { display: block; color: var(--mk-muted); font-size: .85rem; margin-top: .2rem; }
.mukova-gallery { columns: 2; column-gap: .6rem; }
@media (min-width: 700px) { .mukova-gallery { columns: 3; } }
.mukova-gallery__item { break-inside: avoid; margin: 0 0 .6rem; }
.mukova-gallery__item img { width: 100%; height: auto; display: block; border-radius: 10px; }
.mukova-gallery__item figcaption { font-size: .85rem; color: var(--mk-muted); padding: .3rem .2rem; }
.mukova-lightbox[hidden] { display: none; }
.mukova-lightbox { position: fixed; inset: 0; background: rgba(10, 14, 30, .92); display: grid; place-items: center; z-index: 9999; padding: 1rem; }
.mukova-lightbox img { max-width: 100%; max-height: 85vh; border-radius: 8px; }
.mukova-lightbox figcaption { color: #fff; text-align: center; margin-top: .6rem; }
.mukova-lightbox button { position: absolute; top: 1rem; right: 1rem; background: rgba(255,255,255,.15); color: #fff; border: 0; width: 44px; height: 44px; border-radius: 50%; font-size: 1.4rem; cursor: pointer; }
.mukova-lightbox .mukova-lightbox__nav { top: 50%; transform: translateY(-50%); }
.mukova-lightbox .is-prev { left: 1rem; right: auto; }

/* Timeline & progress */
.mukova-timeline { list-style: none; margin: 0; padding: 0 0 0 1.4rem; position: relative; }
.mukova-timeline::before { content: ""; position: absolute; left: .45rem; top: .5rem; bottom: .5rem; width: 2px; background: var(--mk-line); }
.mukova-timeline__item { position: relative; padding: 0 0 1.8rem; }
.mukova-timeline__marker { position: absolute; left: -1.4rem; top: .35rem; width: 1rem; height: 1rem; border-radius: 50%; background: var(--mk-gold); border: 3px solid #fff; box-shadow: 0 0 0 2px var(--mk-gold); }
.mukova-timeline__date { color: var(--mk-muted); font-size: .85rem; text-transform: uppercase; letter-spacing: .05em; margin-right: .5rem; }
.mukova-timeline__title { margin: .2rem 0 .4rem; font-size: 1.15rem; }
.mukova-timeline__text p { margin: 0 0 .5rem; }
.mukova-timeline__photo img { width: 100%; max-width: 520px; height: auto; border-radius: 10px; display: block; margin-top: .5rem; }
.mukova-progress__bar { height: 14px; background: var(--mk-blue-soft); border-radius: 999px; overflow: hidden; margin: .6rem 0 .3rem; }
.mukova-progress__bar span { display: block; height: 100%; background: linear-gradient(90deg, var(--mk-blue), var(--mk-gold)); border-radius: 999px; transition: width .6s ease; }
.mukova-progress__pct { font-size: .85rem; color: var(--mk-muted); margin-bottom: .6rem; }
.mukova-progress__cta { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: center; margin-top: 1rem; }
.mukova-needs { columns: 2; column-gap: 2rem; padding-left: 1.2rem; }
@media (max-width: 600px) { .mukova-needs { columns: 1; } }

/* Donate */
.mukova-donate__grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); align-items: start; }
.mukova-donate h3 { margin-top: 0; }
.mukova-copy { font: inherit; font-size: .75rem; margin-left: .4rem; padding: .15em .6em; border-radius: 999px; border: 1px solid var(--mk-line); background: #fff; cursor: pointer; }
.mukova-amounts { display: flex; flex-wrap: wrap; gap: .5rem; margin: .5rem 0; }
.mukova-amount-other { display: grid; gap: .3rem; margin: .6rem 0 1rem; font-size: .9rem; }
.mukova-amount-other input { font: inherit; padding: .6em .8em; border: 1px solid var(--mk-line); border-radius: 8px; max-width: 12rem; }
.mukova-qr { max-width: 220px; height: auto; display: block; }

/* Forms */
.mukova-form { display: grid; gap: .35rem; }
.mukova-form label { font-weight: 600; margin-top: .6rem; font-size: .95rem; }
.mukova-form input:not([type=radio]):not([type=checkbox]), .mukova-form select, .mukova-form textarea { font: inherit; width: 100%; padding: .7em .85em; border: 1px solid var(--mk-line); border-radius: 10px; background: #fff; color: var(--mk-ink); }
.mukova-form input:focus-visible, .mukova-form select:focus-visible, .mukova-form textarea:focus-visible { outline: 3px solid var(--mk-gold); outline-offset: 1px; border-color: var(--mk-blue); }
.mukova-form-grid { display: grid; gap: .5rem 1rem; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.mukova-form .mukova-button { justify-self: start; margin-top: .8rem; }
.mukova-form progress { width: 100%; height: 10px; margin-top: .6rem; }
.mukova-hp { position: absolute; left: -9999px; }
.mukova-my-uploads { padding-left: 1.2rem; }
.mukova-status-pending { color: #92400e; }
.mukova-status-publish { color: #14532d; }

/* Contact */
.mukova-contact__address { font-style: normal; line-height: 1.5; margin-bottom: .8rem; }
.mukova-contact__links { list-style: none; padding: 0; margin: 0 0 1rem; display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; align-items: center; }
.mukova-map iframe { width: 100%; border: 0; border-radius: var(--mk-radius); min-height: 280px; }
.mukova-times { list-style: none; padding: 0; margin: 0; }
.mukova-times li { display: grid; gap: .1rem; padding: .35rem 0; }
.mukova-times span { color: var(--mk-muted); font-size: .9rem; }
.mukova-contact.is-compact .mukova-contact__links { flex-direction: column; align-items: flex-start; gap: .4rem; }

@media (prefers-reduced-motion: reduce) { .mukova-block * { transition: none !important; animation: none !important; } }

/* Leaders */
.mukova-leaders { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.mukova-leader { display: flex; gap: .9rem; align-items: flex-start; background: var(--mk-surface); border: 1px solid var(--mk-line); border-radius: var(--mk-radius); padding: 1rem 1.1rem; box-shadow: var(--mk-shadow); }
.mukova-leader__avatar { flex-shrink: 0; width: 48px; height: 48px; border-radius: 50%; background: var(--mk-blue); color: #fff; display: grid; place-items: center; font-weight: 700; letter-spacing: .04em; }
.mukova-leader__body { display: grid; gap: .15rem; min-width: 0; }
.mukova-leader__role { color: var(--mk-gold); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.mukova-leader__name { font-size: 1.05rem; }
.mukova-leader__note { color: var(--mk-muted); font-size: .9rem; }
.mukova-leader__actions { display: flex; flex-wrap: wrap; gap: .4rem .9rem; margin-top: .35rem; font-size: .95rem; }
.mukova-leader__actions a { text-decoration: none; font-weight: 600; }
.mukova-leader__wa { color: #128c7e !important; }
.mukova-leaders.is-compact .mukova-leader { box-shadow: none; padding: .7rem .8rem; }
.mukova-leaders__note { margin-top: .8rem; }