:root {
  --ink: #11202d;
  --ink-soft: #385064;
  --navy: #0c1b28;
  --gold: #d9a514;
  --gold-dark: #b88400;
  --cream: #f7f1e6;
  --paper: #fffdf8;
  --line: #e7ded0;
  --red: #8f2f27;
  --green: #486b4b;
  --shadow: 0 18px 50px rgba(17, 32, 45, 0.14);
  --theme-icon-pentecost: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23fff5d1' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 54c17 0 31-14 47-32-3 18 2 34 16 47-19-5-34-2-49 11 2-14-3-23-14-26Z'/%3E%3Cpath d='M43 44c-7-9-18-15-32-18 6 11 16 21 32 28'/%3E%3Cpath d='M64 22c-1 11-6 20-16 27'/%3E%3Cpath d='M74 36l8-2'/%3E%3C/g%3E%3C/svg%3E");
  --theme-icon-christmas-day: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96'%3E%3Cpath fill='none' stroke='%23fff5d1' stroke-width='5' stroke-linecap='round' stroke-linejoin='round' d='M48 10l8 25 26-1-22 15 9 25-21-16-21 16 9-25-22-15 26 1 8-25Z'/%3E%3Cpath fill='none' stroke='%23fff5d1' stroke-width='4' stroke-linecap='round' d='M48 4v10M48 82v10M4 48h10M82 48h10'/%3E%3C/svg%3E");
  --theme-icon-easter-day: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23fff5d1' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M48 16v48M34 31h28'/%3E%3Cpath d='M18 75c12-14 48-14 60 0'/%3E%3Cpath d='M20 52l-10-6M76 52l10-6M30 26l-7-9M66 26l7-9'/%3E%3C/g%3E%3C/svg%3E");
  --theme-icon-all-saints-day: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23fff5d1' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='48' cy='28' r='14'/%3E%3Cpath d='M22 84c5-22 20-34 26-34s21 12 26 34'/%3E%3Cpath d='M24 31c8-13 40-13 48 0'/%3E%3Cpath d='M31 70h34'/%3E%3C/g%3E%3C/svg%3E");
  --theme-icon-immaculate-conception: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23fff5d1' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M48 83V37'/%3E%3Cpath d='M48 39c-18-18-30-10-33 8 14 2 25-1 33-8Z'/%3E%3Cpath d='M48 39c18-18 30-10 33 8-14 2-25-1-33-8Z'/%3E%3Cpath d='M48 39c-5-20 4-29 17-30 1 13-4 23-17 30Z'/%3E%3Cpath d='M31 72c12 8 22 8 34 0'/%3E%3C/g%3E%3C/svg%3E");
  --theme-icon-assumption: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23fff5d1' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 64l7-32 19 20 19-20 7 32H22Z'/%3E%3Cpath d='M22 73h52'/%3E%3Cpath d='M48 14v10M30 19l6 8M66 19l-6 8'/%3E%3Cpath d='M18 84c12-8 48-8 60 0'/%3E%3C/g%3E%3C/svg%3E");
}

body.theme-advent {
  --navy: #18213f;
  --gold: #c2b7ff;
  --gold-dark: #6d65d8;
  --cream: #eef0fb;
  --paper: #fbfcff;
  --line: #d9def3;
  --red: #6f3c64;
  --green: #3f675d;
}

body.theme-advent .eyebrow {
  border-color: rgba(217, 165, 20, 0.58);
  color: #d8d0ff;
  background: rgba(24, 33, 63, 0.96);
}

body.theme-christmas {
  --navy: #1f4f43;
  --gold: #e0bd55;
  --gold-dark: #8f6a12;
  --cream: #eef7ed;
  --paper: #fbfff9;
  --line: #d7ead1;
  --red: #9f3740;
  --green: #6fa46f;
}

body.theme-christmas .eyebrow {
  border-color: rgba(224, 189, 85, 0.72);
  color: #fff6cf;
  background: rgba(31, 79, 67, 0.94);
}

body.theme-lent {
  --navy: #241a22;
  --gold: #b38f6a;
  --gold-dark: #6b4a37;
  --cream: #eee6dd;
  --paper: #fbf7f1;
  --line: #dfd1c3;
  --red: #6b2f3a;
  --green: #5c614f;
}

body.theme-holy-week {
  --navy: #191820;
  --gold: #d5b16a;
  --gold-dark: #8b6d3b;
  --cream: #f0ebe3;
  --paper: #fbf8f3;
  --line: #ded5ca;
  --red: #71434f;
  --green: #596452;
}

body.theme-holy-week .eyebrow {
  border-color: rgba(213, 177, 106, 0.62);
  color: #ead8aa;
  background: rgba(25, 24, 32, 0.96);
}

body.theme-easter {
  --navy: #102235;
  --gold: #f0c84b;
  --gold-dark: #a97600;
  --cream: #fff3c4;
  --paper: #fffef7;
  --line: #efe2bd;
  --red: #a74d38;
  --green: #426b55;
}

body.theme-easter .eyebrow {
  border-color: rgba(240, 200, 75, 0.7);
  color: #fff3c4;
  background: rgba(16, 34, 53, 0.96);
}

body.theme-pentecost {
  --navy: #2b090d;
  --gold: #ffca57;
  --gold-dark: #c33a22;
  --cream: #fff0e2;
  --paper: #fff8f1;
  --line: #f0c8b6;
  --red: #c33a22;
  --green: #516a47;
  --special-hero-bg: linear-gradient(135deg, #23070a 0%, #421016 50%, #7d2117 100%);
  --special-pattern: repeating-linear-gradient(112deg, rgba(255, 202, 87, 0.18) 0 2px, transparent 2px 82px), linear-gradient(90deg, transparent 0%, rgba(255, 202, 87, 0.13) 100%);
  --special-feature-bg: linear-gradient(145deg, #491018 0%, #9d2b18 52%, #f7ad29 100%);
  --special-panel-bg: rgba(255, 216, 128, 0.09);
  --special-panel-border: rgba(255, 202, 87, 0.38);
  --special-icon: var(--theme-icon-pentecost);
}

body.theme-pentecost .eyebrow {
  border-color: rgba(255, 184, 77, 0.74);
  color: #ffe0a6;
  background: rgba(42, 17, 22, 0.96);
}

body.theme-christmas-day {
  --navy: #0e3b31;
  --gold: #f6d46a;
  --gold-dark: #be3d3d;
  --cream: #f1f8ec;
  --paper: #fffdf5;
  --line: #d5e6cb;
  --red: #be3d3d;
  --green: #4d985c;
  --special-hero-bg: linear-gradient(135deg, #0e3b31 0%, #155d4b 55%, #8f202c 125%);
  --special-pattern: repeating-linear-gradient(90deg, rgba(246, 212, 106, 0.14) 0 1px, transparent 1px 70px), linear-gradient(180deg, rgba(255, 255, 255, 0.1), transparent 48%);
  --special-feature-bg: linear-gradient(145deg, #0f4d3f 0%, #2b7a4b 56%, #c14242 100%);
  --special-panel-bg: rgba(246, 212, 106, 0.1);
  --special-panel-border: rgba(246, 212, 106, 0.4);
  --special-icon: var(--theme-icon-christmas-day);
}

body.theme-christmas-day .eyebrow {
  border-color: rgba(242, 201, 95, 0.76);
  color: #fff4c8;
  background: rgba(23, 79, 66, 0.96);
}

body.theme-easter-day {
  --navy: #123661;
  --gold: #ffdd70;
  --gold-dark: #bd8700;
  --cream: #fff8d7;
  --paper: #fffffb;
  --line: #efe3bb;
  --red: #b35a3a;
  --green: #46745f;
  --special-hero-bg: linear-gradient(135deg, #0f2d54 0%, #164d82 56%, #d59a18 135%);
  --special-pattern: repeating-linear-gradient(118deg, rgba(255, 221, 112, 0.16) 0 2px, transparent 2px 76px), linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 55%);
  --special-feature-bg: linear-gradient(145deg, #113661 0%, #2870a9 58%, #ffdd70 100%);
  --special-panel-bg: rgba(255, 221, 112, 0.1);
  --special-panel-border: rgba(255, 221, 112, 0.42);
  --special-icon: var(--theme-icon-easter-day);
}

body.theme-easter-day .eyebrow {
  border-color: rgba(255, 216, 107, 0.78);
  color: #fff6cf;
  background: rgba(17, 52, 90, 0.96);
}

body.theme-all-saints-day {
  --navy: #111a2e;
  --gold: #ead077;
  --gold-dark: #917127;
  --cream: #f7f3e6;
  --paper: #fffefa;
  --line: #e8dfc8;
  --red: #6f4b63;
  --green: #5d6f5b;
  --special-hero-bg: linear-gradient(135deg, #111a2e 0%, #263b64 58%, #bfa45d 130%);
  --special-pattern: repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.08) 0 1px, transparent 1px 54px), repeating-linear-gradient(0deg, rgba(234, 208, 119, 0.1) 0 1px, transparent 1px 92px);
  --special-feature-bg: linear-gradient(145deg, #111a2e 0%, #394d79 60%, #ead077 100%);
  --special-panel-bg: rgba(234, 208, 119, 0.1);
  --special-panel-border: rgba(234, 208, 119, 0.4);
  --special-icon: var(--theme-icon-all-saints-day);
}

body.theme-all-saints-day .eyebrow {
  border-color: rgba(231, 200, 106, 0.72);
  color: #f7e8ae;
  background: rgba(23, 36, 59, 0.96);
}

body.theme-immaculate-conception {
  --navy: #103c68;
  --gold: #dfc271;
  --gold-dark: #2f70b1;
  --cream: #edf7ff;
  --paper: #fbfdff;
  --line: #d7e7f4;
  --red: #77546b;
  --green: #53756f;
  --special-hero-bg: linear-gradient(135deg, #103c68 0%, #2f76b2 62%, #d9efff 150%);
  --special-pattern: repeating-linear-gradient(120deg, rgba(255, 255, 255, 0.14) 0 2px, transparent 2px 72px), linear-gradient(90deg, rgba(223, 194, 113, 0.12), transparent 38%);
  --special-feature-bg: linear-gradient(145deg, #103c68 0%, #4c9ad3 56%, #edf7ff 100%);
  --special-panel-bg: rgba(237, 247, 255, 0.12);
  --special-panel-border: rgba(223, 194, 113, 0.38);
  --special-icon: var(--theme-icon-immaculate-conception);
}

body.theme-immaculate-conception .eyebrow {
  border-color: rgba(217, 184, 100, 0.72);
  color: #eff8ff;
  background: rgba(21, 58, 99, 0.96);
}

body.theme-assumption {
  --navy: #15365f;
  --gold: #f1c66d;
  --gold-dark: #9f5a73;
  --cream: #f1f7ff;
  --paper: #fffdfb;
  --line: #d9e5f2;
  --red: #9f5a73;
  --green: #557760;
  --special-hero-bg: linear-gradient(135deg, #15365f 0%, #3d7cad 58%, #b85f7c 135%);
  --special-pattern: repeating-linear-gradient(150deg, rgba(255, 255, 255, 0.13) 0 2px, transparent 2px 76px), linear-gradient(90deg, rgba(241, 198, 109, 0.12), transparent 45%);
  --special-feature-bg: linear-gradient(145deg, #15365f 0%, #6aa8d1 56%, #b85f7c 100%);
  --special-panel-bg: rgba(241, 247, 255, 0.12);
  --special-panel-border: rgba(241, 198, 109, 0.42);
  --special-icon: var(--theme-icon-assumption);
}

body.theme-assumption .eyebrow {
  border-color: rgba(240, 195, 106, 0.76);
  color: #fff0c9;
  background: rgba(23, 48, 82, 0.96);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "Segoe UI", Arial, sans-serif;
}

a {
  color: inherit;
  text-decoration: none;
}

a:hover {
  color: var(--gold-dark);
}

.site-header {
  background: var(--navy);
  position: sticky;
  top: 0;
  z-index: 20;
  box-shadow: 0 10px 28px rgba(12, 27, 40, 0.18);
}

/* This Font Awesome build is missing the cross glyph, so .fa-cross renders blank
   (e.g. the Faith Formation / "Advanced Faith" program card). Draw a cross from a
   system symbol font instead. */
.fa-cross::before {
  content: "\271D";
  font-family: "Segoe UI Symbol", "Noto Sans Symbols", "DejaVu Sans", system-ui, serif;
}

.parish-nav {
  min-height: 76px;
  padding: 0;
}

.nav-shell {
  padding: 0 32px;
}

.parish-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  margin-right: 28px;
}

.parish-brand:hover {
  color: #fff;
}

.brand-logo {
  display: block;
  width: 62px;
  height: 54px;
  object-fit: contain;
}

.brand-name,
.brand-subtitle {
  display: block;
  line-height: 1.1;
}

.brand-name {
  font-size: 18px;
  font-weight: 800;
}

.brand-subtitle {
  color: #c9d3dc;
  font-size: 12px;
  font-weight: 600;
  margin-top: 3px;
}

.navbar-toggler {
  border-color: rgba(255, 255, 255, 0.28);
}

.navbar-toggler-icon {
  filter: invert(1);
}

.navbar-nav {
  gap: 8px;
}

.parish-nav .nav-link {
  border-radius: 8px;
  color: #d8e0e7;
  font-size: 15px;
  font-weight: 700;
  padding: 12px 16px;
  white-space: nowrap; /* keep the icon + label on one line — never stack */
}

.parish-nav .nav-link .fa,
.nav-give-btn .fa,
.language-switch .fa {
  margin-right: 6px;
}

.parish-nav .nav-link:hover,
.parish-nav .nav-link:focus,
.parish-nav .nav-link.show,
.parish-nav .nav-link.active,
.parish-nav .nav-link.is-preview-active {
  color: var(--gold);
  background: rgba(255, 255, 255, 0.08);
}

.parish-nav .navbar-nav.nav-dropdown-previewing .nav-link.active:not(.is-preview-active):not(:hover):not(:focus) {
  color: #d8e0e7;
  background: transparent;
}

.parish-nav .dropdown-menu {
  margin-top: 10px;
  min-width: 230px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  padding: 8px;
  background: #102b40;
  box-shadow: 0 18px 40px rgba(3, 13, 22, 0.28);
}

.parish-nav .dropdown-item {
  border-radius: 6px;
  color: #d8e0e7;
  font-size: 14px;
  font-weight: 700;
  padding: 10px 12px;
}

.parish-nav .dropdown-item:hover,
.parish-nav .dropdown-item:focus {
  color: var(--gold);
  background: rgba(255, 255, 255, 0.08);
}

.breadcrumb-shell {
  border-top: 1px solid rgba(255, 255, 255, 0.035);
  border-bottom: 1px solid rgba(255, 255, 255, 0.045);
  background: var(--navy);
}

.admin-breadcrumb-shell {
  border-top: 0;
  border-bottom: 1px solid var(--line);
  background: #fffaf1;
}

.breadcrumb-list {
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 1720px;
  margin: 0 auto;
  padding: 11px clamp(18px, 3vw, 48px);
  overflow-x: auto;
  list-style: none;
  color: rgba(255, 255, 255, 0.68);
  font-size: 13px;
  font-weight: 700;
  scrollbar-width: thin;
}

.admin-breadcrumb-shell .breadcrumb-list {
  color: var(--ink-soft);
}

.site-breadcrumb-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}

.site-breadcrumb-item + .site-breadcrumb-item::before {
  content: "»";
  color: rgba(217, 165, 20, 0.78);
  font-weight: 900;
}

.site-breadcrumb-item a {
  color: rgba(255, 255, 255, 0.72);
}

.site-breadcrumb-item a:hover,
.site-breadcrumb-item a:focus {
  color: var(--gold);
}

.site-breadcrumb-item.active span {
  color: var(--gold);
}

.admin-breadcrumb-shell .site-breadcrumb-item + .site-breadcrumb-item::before {
  color: var(--gold-dark);
}

.admin-breadcrumb-shell .site-breadcrumb-item a {
  color: var(--ink-soft);
}

.admin-breadcrumb-shell .site-breadcrumb-item a:hover,
.admin-breadcrumb-shell .site-breadcrumb-item a:focus,
.admin-breadcrumb-shell .site-breadcrumb-item.active span {
  color: var(--gold-dark);
}

.nav-give-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-radius: 8px;
  background: var(--gold);
  color: var(--navy);
  font-weight: 800;
  padding: 12px 22px;
}

.nav-give-btn .fa {
  margin: 0;
}

.nav-give-btn-arrow {
  transition: transform 0.2s ease;
}

.nav-give-btn:hover {
  background: #f0bd2d;
  color: var(--navy);
}

.nav-give-btn:hover .nav-give-btn-arrow {
  transform: translateX(4px);
}

.admin-top-nav {
  background: #081621;
}

.admin-brand .brand-subtitle {
  color: var(--gold);
}

.admin-nav-links {
  gap: 4px;
}

.admin-mobile-only {
  display: none;
}

.admin-view-site-btn {
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 8px;
  color: #fff;
  font-weight: 800;
  display: inline-grid;
  width: 44px;
  height: 44px;
  place-items: center;
  padding: 0;
}

.admin-view-site-btn:hover {
  border-color: var(--gold);
  color: var(--navy);
  background: var(--gold);
}

.admin-user-badge {
  background: #ffc107;
  color: #1f1f1f;
  font-weight: 700;
  font-size: 0.85rem;
  width: 44px;
  height: 44px;
  padding: 0;
  border-radius: 8px;
  display: inline-grid;
  place-items: center;
}

.admin-user-badge .fa {
  color: #1f1f1f;
}

.nav-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.hero-section {
  display: grid;
  position: relative;
  isolation: isolate;
  grid-template-columns: minmax(0, 1.2fr) minmax(420px, 0.8fr);
  min-height: 560px;
  background: var(--navy);
  overflow: hidden;
}

body.theme-pentecost .site-header,
body.theme-christmas-day .site-header,
body.theme-easter-day .site-header,
body.theme-all-saints-day .site-header,
body.theme-immaculate-conception .site-header,
body.theme-assumption .site-header {
  box-shadow: 0 12px 34px rgba(3, 13, 22, 0.28), inset 0 -3px 0 var(--gold);
}

body.theme-pentecost .hero-section,
body.theme-christmas-day .hero-section,
body.theme-easter-day .hero-section,
body.theme-all-saints-day .hero-section,
body.theme-immaculate-conception .hero-section,
body.theme-assumption .hero-section {
  background: var(--special-hero-bg);
}

body.theme-pentecost .hero-section::before,
body.theme-christmas-day .hero-section::before,
body.theme-easter-day .hero-section::before,
body.theme-all-saints-day .hero-section::before,
body.theme-immaculate-conception .hero-section::before,
body.theme-assumption .hero-section::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--special-pattern);
  opacity: 0.95;
  pointer-events: none;
}

body.theme-pentecost .hero-section::after,
body.theme-christmas-day .hero-section::after,
body.theme-easter-day .hero-section::after,
body.theme-all-saints-day .hero-section::after,
body.theme-immaculate-conception .hero-section::after,
body.theme-assumption .hero-section::after {
  content: "";
  position: absolute;
  top: clamp(104px, 12vw, 180px);
  right: clamp(28px, 7vw, 128px);
  z-index: 0;
  width: min(28vw, 320px);
  min-width: 180px;
  aspect-ratio: 1;
  background: var(--special-icon) center / contain no-repeat;
  opacity: 0.16;
  filter: drop-shadow(0 22px 40px rgba(0, 0, 0, 0.18));
  pointer-events: none;
}

body.theme-pentecost .hero-copy,
body.theme-christmas-day .hero-copy,
body.theme-easter-day .hero-copy,
body.theme-all-saints-day .hero-copy,
body.theme-immaculate-conception .hero-copy,
body.theme-assumption .hero-copy,
body.theme-pentecost .hero-media,
body.theme-christmas-day .hero-media,
body.theme-easter-day .hero-media,
body.theme-all-saints-day .hero-media,
body.theme-immaculate-conception .hero-media,
body.theme-assumption .hero-media {
  position: relative;
  z-index: 1;
}

body.theme-pentecost .eyebrow,
body.theme-christmas-day .eyebrow,
body.theme-easter-day .eyebrow,
body.theme-all-saints-day .eyebrow,
body.theme-immaculate-conception .eyebrow,
body.theme-assumption .eyebrow {
  border-color: var(--special-panel-border);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08), 0 10px 26px rgba(0, 0, 0, 0.14);
}

body.theme-pentecost .hero-section .eyebrow,
body.theme-christmas-day .hero-section .eyebrow,
body.theme-easter-day .hero-section .eyebrow,
body.theme-all-saints-day .hero-section .eyebrow,
body.theme-immaculate-conception .hero-section .eyebrow,
body.theme-assumption .hero-section .eyebrow,
body.theme-pentecost .content-hero .eyebrow,
body.theme-christmas-day .content-hero .eyebrow,
body.theme-easter-day .content-hero .eyebrow,
body.theme-all-saints-day .content-hero .eyebrow,
body.theme-immaculate-conception .content-hero .eyebrow,
body.theme-assumption .content-hero .eyebrow,
body.theme-pentecost .section-heading .eyebrow,
body.theme-christmas-day .section-heading .eyebrow,
body.theme-easter-day .section-heading .eyebrow,
body.theme-all-saints-day .section-heading .eyebrow,
body.theme-immaculate-conception .section-heading .eyebrow,
body.theme-assumption .section-heading .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

body.theme-pentecost .hero-section .eyebrow::before,
body.theme-christmas-day .hero-section .eyebrow::before,
body.theme-easter-day .hero-section .eyebrow::before,
body.theme-all-saints-day .hero-section .eyebrow::before,
body.theme-immaculate-conception .hero-section .eyebrow::before,
body.theme-assumption .hero-section .eyebrow::before,
body.theme-pentecost .content-hero .eyebrow::before,
body.theme-christmas-day .content-hero .eyebrow::before,
body.theme-easter-day .content-hero .eyebrow::before,
body.theme-all-saints-day .content-hero .eyebrow::before,
body.theme-immaculate-conception .content-hero .eyebrow::before,
body.theme-assumption .content-hero .eyebrow::before,
body.theme-pentecost .section-heading .eyebrow::before,
body.theme-christmas-day .section-heading .eyebrow::before,
body.theme-easter-day .section-heading .eyebrow::before,
body.theme-all-saints-day .section-heading .eyebrow::before,
body.theme-immaculate-conception .section-heading .eyebrow::before,
body.theme-assumption .section-heading .eyebrow::before {
  content: "";
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  background: var(--special-icon) center / contain no-repeat;
}

.hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: clamp(44px, 6vw, 92px) clamp(36px, 5vw, 80px) clamp(44px, 6vw, 92px) clamp(48px, 7vw, 108px);
  color: #fff;
}

.eyebrow {
  width: fit-content;
  margin: 0 0 18px;
  border: 1px solid rgba(217, 165, 20, 0.55);
  border-radius: 999px;
  padding: 8px 18px;
  color: var(--gold);
  background: rgba(217, 165, 20, 0.12);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.hero-copy h1 {
  max-width: 980px;
  margin: 0;
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(44px, 6vw, 78px);
  line-height: 1.02;
  letter-spacing: 0;
}

.language-switch {
  display: inline-flex;
  width: fit-content;
  gap: 4px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 8px;
  padding: 4px;
  background: rgba(255, 255, 255, 0.08);
}

.language-switch a {
  border-radius: 6px;
  padding: 8px 12px;
  color: #d4dde5;
  font-size: 13px;
  font-weight: 800;
}

.language-switch a.active,
.language-switch a:hover {
  color: var(--navy);
  background: var(--gold);
}

tr[data-href] {
  cursor: pointer;
}

/* Hero carousel on the public home page. Each slide uses a background
   image set inline; the overlay keeps text readable over photos. */
.home-hero-slide {
  min-height: 460px;
  background-size: cover;
  background-position: center;
  background-color: var(--navy);
  position: relative;
}
.home-hero-slide-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  background: linear-gradient(180deg, rgba(12, 27, 40, 0.05) 0%, rgba(12, 27, 40, 0.7) 100%);
  color: #fff;
}
.home-hero-title {
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(32px, 4vw, 56px);
  margin: 0 0 12px;
  text-shadow: 0 2px 24px rgba(0, 0, 0, 0.45);
}
.home-hero-subtitle {
  font-size: clamp(16px, 1.8vw, 22px);
  max-width: 720px;
  margin: 0 0 18px;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.55);
}

/* Public Programs grid card: optional image header (CMS-uploaded) over a
   text body. Falls back to a cream tile with the program's FontAwesome
   icon when no image is uploaded. */
.program-card {
  display: flex;
  flex-direction: column;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(17, 32, 45, 0.08);
}
.program-card-image {
  width: 100%;
  height: 275px;
  background-size: cover;
  background-position: center;
  background-color: var(--cream);
}
.program-card-image-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gold-dark);
  font-size: 56px;
}
.program-card-body { padding: 18px 22px 22px; }
.program-card-title { font-size: 20px; font-weight: 800; margin-bottom: 6px; color: var(--navy); }

/* Wider banner used at the top of each card on the standalone Programs page. */
.program-detail-image {
  width: 100%;
  height: 260px;
  background-size: cover;
  background-position: center;
  background-color: var(--cream);
  border-radius: 10px;
}

/* Leadership-team grid: circular photos with a neutral placeholder when
   no image has been uploaded. */
.team-photo {
  width: 140px;
  height: 140px;
  border-radius: 50%;
  object-fit: cover;
  /* Bias the crop toward the top so faces stay centered in the circle
     instead of getting cut off when a photo is framed wider. */
  object-position: center top;
  display: inline-block;
  border: 3px solid var(--gold);
  box-shadow: 0 8px 22px rgba(12, 27, 40, 0.18);
}
.team-photo-placeholder {
  background: var(--cream);
  color: var(--ink-soft);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 56px;
}

/* Leadership hierarchy: the head of the team (first by CMS sort order, e.g.
   the Pastor) is featured large and centered above the rest of the grid, with
   a short connector line to read as the top of an org chart. */
.team-head {
  text-align: center;
  margin-bottom: 8px;
}
.team-photo-lead {
  width: 190px;
  height: 190px;
  border: 4px solid var(--gold);
  box-shadow: 0 12px 30px rgba(12, 27, 40, 0.22);
}
.team-head-name {
  margin-top: 14px;
  font-size: 22px;
  font-weight: 800;
  color: var(--navy);
}
.team-head-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--gold-dark);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.team-deputy {
  text-align: center;
  margin-bottom: 8px;
}
.team-photo-deputy {
  width: 165px;
  height: 165px;
  border: 4px solid var(--gold);
  box-shadow: 0 10px 26px rgba(12, 27, 40, 0.2);
}
.team-deputy-name {
  margin-top: 12px;
  font-size: 20px;
  font-weight: 800;
  color: var(--navy);
}
.team-deputy-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--gold-dark);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.team-leaders-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  max-width: 980px;
  margin: 0 auto;
  align-items: start;
}
.team-leader-card {
  min-width: 0;
}
/* Vertical connector between the head and the rest of the leadership grid. */
.team-branch {
  width: 2px;
  height: 36px;
  margin: 8px auto 20px;
  background: var(--line);
}

@media (max-width: 767.98px) {
  .team-leaders-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 479.98px) {
  .team-leaders-grid {
    grid-template-columns: 1fr;
  }
}

/* --- Public home: full-bleed section bands -------------------------------- */
/* Home-page sections render edge-to-edge with an inner .container. Alternating
   paper / cream backgrounds (assigned by a counter in the view) give the long
   single-page scroll visual rhythm instead of one flat surface. */
.home-band {
  padding: 64px 0;
}
.home-band--alt {
  background: var(--cream);
}
.home-band-title {
  text-align: center;
  margin-bottom: 32px;
  font-size: clamp(26px, 3vw, 36px);
  color: var(--navy);
}

/* Script/cursive treatment for the parish tagline. Uses a system handwriting
   stack (no web-font dependency, stays offline-deployable) and falls back to
   the generic cursive family. */
.tagline-cursive {
  font-family: "Segoe Script", "Brush Script MT", "Lucida Handwriting",
    "Apple Chancery", "Snell Roundhand", cursive;
  font-weight: 400;
}

/* Home-page tagline band: the cursive tagline in the gold accent on a soft
   cream band, framed by a quote mark and a short gold rule. Matches the
   About-page tagline treatment. */
.home-tagline-band {
  padding: 64px 0;
  background: var(--cream);
  text-align: center;
}
.home-tagline-band .tagline-quote {
  display: block;
  font-size: 26px;
  color: var(--gold-dark);
  opacity: 0.5;
  margin-bottom: 8px;
}
.home-tagline-band .home-tagline {
  font-size: clamp(28px, 4.4vw, 48px);
  line-height: 1.25;
  color: var(--gold-dark);
}
.home-tagline-band .tagline-rule {
  width: 72px;
  height: 3px;
  margin: 20px auto 0;
  border-radius: 2px;
  background: var(--gold);
  opacity: 0.85;
}

/* About-page tagline: same cursive, in the page's gold accent. */
.about-tagline {
  font-size: clamp(24px, 3.4vw, 36px);
  color: var(--gold-dark);
}
.about-intro-shell {
  max-width: 860px;
}
.about-logo {
  max-height: 96px;
  width: auto;
}
.about-intro-text {
  font-size: 17px;
  line-height: 1.75;
  color: var(--ink);
}

/* Serif display headings on public pages only (the back office keeps the
   system sans). Matches the hero/footer treatment already in use. */
.page-shell h1,
.page-shell h2,
.page-shell h3 {
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  letter-spacing: 0.2px;
}

/* Card hover lift — a little life on the public content cards. */
.program-card,
.dashboard-card,
.news-card,
.team-photo {
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.program-card:hover,
.dashboard-card:hover,
.news-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow);
}
.team-photo:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(12, 27, 40, 0.26);
}

/* Latest-news strip cards on the home page. */
.news-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: 100%;
  padding: 20px 22px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 4px solid var(--gold);
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(17, 32, 45, 0.08);
  color: var(--ink);
}
.news-card:hover {
  color: var(--ink);
}
.news-card-date {
  font-size: 13px;
  color: var(--ink-soft);
}
.news-card-title {
  font-weight: 700;
  font-size: 18px;
  color: var(--navy);
  line-height: 1.35;
}
.news-card-more {
  margin-top: auto;
  font-size: 13px;
  font-weight: 700;
  color: var(--gold-dark);
}
.news-card-more .fa {
  transition: transform 0.18s ease;
}
.news-card:hover .news-card-more .fa {
  transform: translateX(3px);
}

/* Public contact form panel. */
.contact-form-card {
  max-width: 720px;
  padding: 28px 30px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 6px 18px rgba(17, 32, 45, 0.08);
}
.contact-form-card .form-label {
  font-weight: 600;
  font-size: 14px;
  color: var(--ink-soft);
}

/* Tuition total shown on the parent registration form. */
.fee-summary {
  padding: 16px 20px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--gold);
  border-radius: 12px;
  background: var(--cream);
}
.fee-summary-label {
  font-weight: 700;
  color: var(--navy);
}
.fee-summary-amount {
  font-size: 24px;
  font-weight: 800;
  color: var(--gold-dark);
}

/* Public photo gallery — a large featured "stage" with a caption + counter,
   and a strip of selectable thumbnails below (modeled on the parish site's
   Parish Images section). Clicking a thumbnail swaps the stage image. */
.photo-gallery {
  display: grid;
  gap: 14px;
}
.photo-stage {
  position: relative;
  overflow: hidden;
  margin: 0;
  border-radius: 12px;
  background: var(--navy);
  box-shadow: var(--shadow);
}
.photo-stage::after {
  position: absolute;
  inset: auto 0 0;
  height: 42%;
  background: linear-gradient(180deg, transparent, rgba(8, 22, 33, 0.82));
  content: "";
  pointer-events: none;
}
.photo-stage img {
  display: block;
  width: 100%;
  height: min(62vw, 560px);
  min-height: 320px;
  object-fit: cover;
  transition: opacity 240ms ease, transform 6200ms ease-out;
}
.photo-stage.is-changing img {
  opacity: 0.22;
  transform: scale(1.015);
}
.photo-stage figcaption {
  position: absolute;
  right: 26px;
  bottom: 24px;
  left: 26px;
  z-index: 1;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  color: #fff;
}
.photo-stage figcaption span {
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 999px;
  padding: 6px 12px;
  background: rgba(8, 22, 33, 0.5);
  color: var(--gold);
  font-size: 13px;
  font-weight: 800;
}
.photo-stage figcaption strong {
  display: block;
  max-width: min(680px, 70%);
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(22px, 4vw, 42px);
  line-height: 1.1;
  font-weight: 800;
  text-align: right;
}
.photo-thumbs {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  padding: 4px 2px 10px;
}
.photo-thumb {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 70px;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px;
  background: var(--paper);
  color: var(--ink);
  text-align: left;
  cursor: pointer;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}
.photo-thumb:hover,
.photo-thumb:focus-visible,
.photo-thumb.active {
  border-color: var(--gold);
  box-shadow: 0 10px 24px rgba(8, 22, 33, 0.12);
}
.photo-thumb.active {
  background: #fff8e5;
}
.photo-thumb img {
  width: 58px;
  height: 52px;
  border-radius: 6px;
  object-fit: cover;
}
.photo-thumb span {
  overflow: hidden;
  color: var(--ink);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 720px) {
  .photo-stage figcaption {
    right: 16px;
    bottom: 16px;
    left: 16px;
    display: grid;
  }
  .photo-stage figcaption strong {
    max-width: none;
    text-align: left;
  }
  .photo-thumbs {
    grid-auto-flow: column;
    grid-auto-columns: minmax(220px, 78vw);
    grid-template-columns: none;
    overflow-x: auto;
  }
}
@media (prefers-reduced-motion: reduce) {
  .photo-stage img { transition: opacity 240ms ease; }
}

/* Student Code of Conduct: a gold icon badge beside a titled rule, on a
   lifted paper card. Replaces the back-office .detail-card reuse so the
   public band reads as marketing content, not an admin panel. */
.conduct-grid,
.contact-grid {
  max-width: 980px;
  margin: 0 auto;
}
.conduct-card {
  display: flex;
  gap: 16px;
  height: 100%;
  padding: 22px 24px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 6px 18px rgba(17, 32, 45, 0.08);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.conduct-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow);
}
.conduct-card-icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: var(--cream);
  color: var(--gold-dark);
  font-size: 22px;
}
.conduct-card-title {
  font-size: 18px;
  font-weight: 800;
  color: var(--navy);
  margin-bottom: 6px;
}
.conduct-card-body {
  color: var(--ink);
  line-height: 1.55;
}

/* Contact band: centered tile per channel with a circular navy icon, an
   uppercase label, and a prominent value. */
.contact-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  height: 100%;
  padding: 28px 22px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 6px 18px rgba(17, 32, 45, 0.08);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.contact-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow);
}
.contact-card-icon {
  width: 60px;
  height: 60px;
  margin-bottom: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--navy);
  color: var(--gold);
  font-size: 26px;
}
.contact-card-label {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: var(--ink-soft);
}
.contact-card-value {
  font-size: 17px;
  font-weight: 600;
  color: var(--navy);
  line-height: 1.4;
}
.contact-card-value a {
  color: var(--navy);
  text-decoration: none;
}
.contact-card-value a:hover {
  color: var(--gold-dark);
  text-decoration: underline;
}

/* Homepage Honor Roll teaser: a featured card per top-tier honoree. */
.honor-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 4px;
  height: 100%;
  padding: 26px 22px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-top: 4px solid var(--gold);
  border-radius: 14px;
  box-shadow: 0 6px 18px rgba(17, 32, 45, 0.08);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.honor-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow);
}
.honor-card-medal {
  width: 58px;
  height: 58px;
  margin-bottom: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--gold);
  color: var(--navy);
  font-size: 26px;
}
.honor-card-name {
  font-size: 19px;
  font-weight: 800;
  color: var(--navy);
}
.honor-card-award {
  font-size: 14px;
  font-weight: 700;
  color: var(--gold-dark);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.honor-card-class {
  font-size: 13px;
  color: var(--ink-soft);
}
/* Honor cards use the per-program emblem (cross / dragon) instead of a generic
   trophy medal, so drop the gold disc and let the emblem's own badge show. */
.honor-card-medal {
  background: transparent;
  box-shadow: none;
}
.honor-card-medal .program-emblem {
  width: 100%;
  height: 100%;
}

/* Honor Roll teaser carousel — paginates many class honorees on the homepage.
   Controls/indicators are restyled so they read on the light section band
   (Bootstrap's defaults are tuned for dark hero imagery). */
.honor-carousel {
  position: relative;
  padding: 0 44px;
}
.honor-carousel .carousel-control-prev,
.honor-carousel .carousel-control-next {
  width: 40px;
  height: 40px;
  top: 50%;
  transform: translateY(-50%);
  background: var(--navy);
  border-radius: 50%;
  opacity: 0.9;
}
.honor-carousel .carousel-control-prev { left: 0; }
.honor-carousel .carousel-control-next { right: 0; }
.honor-carousel .carousel-control-prev:hover,
.honor-carousel .carousel-control-next:hover { opacity: 1; }
.honor-carousel .carousel-control-prev-icon,
.honor-carousel .carousel-control-next-icon {
  width: 18px;
  height: 18px;
}
.honor-carousel .carousel-indicators {
  position: static;
  margin: 18px 0 0;
}
.honor-carousel .carousel-indicators [data-bs-target] {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: 0;
  background-color: var(--gold-dark);
  opacity: 0.4;
}
.honor-carousel .carousel-indicators .active {
  opacity: 1;
}
@media (max-width: 575.98px) {
  .honor-carousel { padding: 0 28px; }
}

/* Full Honor Roll page: one card per class listing its three winners. */
/* Award icons: the per-program emblem marks the TopHonor named prize
   (Con Rồng Cháu Tiên / Nhân Chứng Đức Tin); ranked medals mark 1st / 2nd.
   Default badge size; the list/slot contexts below shrink it inline. */
.program-emblem,
.rank-medal {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  line-height: 0;
  vertical-align: middle;
}
.program-emblem { width: 56px; height: 56px; }
.program-emblem svg,
.program-emblem img,
.rank-medal svg { display: block; width: 100%; height: 100%; }
.program-emblem img { object-fit: contain; }
/* Con Rồng Cháu Tiên: the gold Đông Sơn drum frames the dragon-bird logo
   centered on top (clipped to a circle so its white backing doesn't cover
   the drum's corners). */
.program-emblem-layered {
  background-image: url('/img/dong-son-drum.png');
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.program-emblem-layered .emblem-fg {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.honor-class-tier .rank-medal,
.honor-prize-label .rank-medal {
  width: 22px;
  height: 22px;
  margin-right: 6px;
}
/* The named-prize emblem is larger than the 1st/2nd medals so the layered
   drum + logo stays legible in the compact list rows. */
.honor-class-tier .program-emblem,
.honor-prize-label .program-emblem {
  width: 34px;
  height: 34px;
  margin-right: 8px;
}
/* Small emblem beside the suggested name in the editor's ranking-assist cell. */
.honor-suggest-line .program-emblem {
  width: 20px;
  height: 20px;
  margin-right: 4px;
}

.honor-class-card {
  height: 100%;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 6px 18px rgba(17, 32, 45, 0.08);
  overflow: hidden;
}
.honor-class-card-head {
  padding: 14px 20px;
  background: var(--navy);
  color: #fff;
  font-weight: 800;
  font-size: 18px;
}
.honor-class-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.honor-class-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 12px 20px;
  border-bottom: 1px solid var(--line);
}
.honor-class-row:last-child {
  border-bottom: 0;
}
.honor-class-tier {
  font-weight: 700;
  color: var(--gold-dark);
  white-space: nowrap;
}
.honor-class-student {
  font-weight: 600;
  color: var(--navy);
  text-align: right;
}

/* Downloadable-form cards: gold-accented tile with a file-type icon badge, a
   title/description/meta block, and a navy circular download button. */
.form-card {
  display: flex;
  align-items: center;
  gap: 16px;
  height: 100%;
  padding: 18px 20px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-left: 4px solid var(--gold);
  border-radius: 14px;
  box-shadow: 0 6px 18px rgba(17, 32, 45, 0.08);
  color: var(--ink);
  text-decoration: none;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.form-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow);
  color: var(--ink);
}
.form-card-icon {
  flex: 0 0 auto;
  width: 52px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: var(--cream);
  color: var(--gold-dark);
  font-size: 26px;
}
.form-card-body {
  flex: 1 1 auto;
  min-width: 0;
}
.form-card-title {
  font-size: 17px;
  font-weight: 800;
  color: var(--navy);
  line-height: 1.25;
}
.form-card-desc {
  font-size: 14px;
  color: var(--ink-soft);
  margin-top: 2px;
}
.form-card-meta {
  font-size: 12px;
  color: var(--ink-soft);
  margin-top: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.form-card-download {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--navy);
  color: var(--gold);
  font-size: 16px;
  transition: transform 0.18s ease;
}
.form-card:hover .form-card-download {
  transform: translateY(2px);
}

/* Respect reduced-motion: drop the hover transforms. */
@media (prefers-reduced-motion: reduce) {
  .program-card,
  .dashboard-card,
  .news-card,
  .team-photo,
  .conduct-card,
  .contact-card,
  .honor-card,
  .form-card,
  .form-card-download {
    transition: none;
  }
  .program-card:hover,
  .dashboard-card:hover,
  .news-card:hover,
  .team-photo:hover,
  .conduct-card:hover,
  .contact-card:hover,
  .honor-card:hover,
  .form-card:hover {
    transform: none;
  }
}

/* Reserves the single-line of vertical space a `.form-text` would take so
   toggling its `.invisible` class doesn't reflow neighbouring form columns. */
.form-text-slot {
  min-height: 1.5em;
}

/* ============================================================
   Site Admin (CMS) layout
   ------------------------------------------------------------
   A focused, narrower experience than the school-operations
   Management area. Top brand bar + horizontal section tabs +
   centered content shell so the CMS feels like a settings
   surface, not a roster app.
   ============================================================ */

.cms-body {
  background: var(--cream);
  color: var(--ink);
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  /* No font-size or font-family override on purpose: the shared `body`
     rule in this file already gives both admin areas the same Segoe UI
     family, and Bootstrap supplies the 16px default the management area
     uses. Touching either of those here desyncs the two surfaces. */
}

.cms-shell {
  max-width: 1080px;
  margin: 0 auto;
  width: 100%;
  padding: 0 24px;
}

.cms-header {
  background: var(--navy);
  color: #fff;
  box-shadow: 0 6px 20px rgba(12, 27, 40, 0.12);
}
.cms-header .cms-shell {
  min-height: 64px;
  padding-top: 12px;
  padding-bottom: 12px;
}

.cms-brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  text-decoration: none;
  font-weight: 700;
}
.cms-brand:hover { color: var(--gold); }
.cms-brand .fa { font-size: 22px; }

.cms-brand-name {
  display: block;
  /* Matches .brand-name in the school-management nav. */
  font-size: 18px;
  line-height: 1.1;
}
.cms-brand-sub {
  display: block;
  font-size: 12px;
  color: #c9d3dc;
  font-weight: 500;
  margin-top: 2px;
}

.cms-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.cms-header-link {
  color: #d4dde5;
  /* Matches .parish-nav .nav-link in the school-management top nav. */
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  padding: 8px 12px;
  border-radius: 6px;
  border: 1px solid transparent;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.cms-header-link:hover,
.cms-header-link:focus {
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.16);
}
.cms-header-button {
  background: transparent;
  cursor: pointer;
}
.cms-logout {
  margin: 0;
  display: inline-flex;
}

.cms-subnav {
  background: #fff;
  border-bottom: 1px solid var(--line);
}
.cms-tabs {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
}
.cms-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  color: var(--ink-soft);
  /* Matches .parish-nav .nav-link in the school-management top nav. */
  font-size: 15px;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 3px solid transparent;
}
.cms-tab:hover {
  color: var(--ink);
  background: rgba(0, 0, 0, 0.02);
}
.cms-tab.active {
  color: var(--navy);
  border-bottom-color: var(--gold);
}
.cms-tab .fa { color: var(--gold-dark); }

.cms-breadcrumb {
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}
.cms-breadcrumb-list {
  list-style: none;
  margin: 0;
  padding: 10px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.cms-breadcrumb-list li + li::before {
  content: "›";
  margin-right: 6px;
  color: var(--ink-soft);
}
.cms-breadcrumb-list a {
  color: var(--ink-soft);
  text-decoration: none;
}
.cms-breadcrumb-list a:hover { color: var(--navy); }
.cms-breadcrumb-list li.active span {
  color: var(--ink);
  font-weight: 700;
}

.cms-main {
  padding: 28px 0 48px;
  flex: 1;
}

/* Slightly tighter card spacing inside the narrower CMS shell. */
.cms-body .detail-card { margin-bottom: 16px; }

@media (max-width: 720px) {
  .cms-header .cms-shell { flex-direction: column; align-items: stretch; gap: 8px; }
  .cms-header-actions { justify-content: flex-end; flex-wrap: wrap; }
  .cms-tabs { overflow-x: auto; flex-wrap: nowrap; }
  .cms-tab { white-space: nowrap; }
}

.admin-global-search {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: #d4dde5;
}

.admin-global-search .fa {
  font-size: 13px;
  opacity: 0.8;
}

.admin-global-search input {
  background: transparent;
  border: 0;
  outline: none;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  width: 180px;
  padding: 0;
}

.admin-global-search input::placeholder {
  color: #9aa6b1;
  font-weight: 500;
}

.admin-global-search:focus-within {
  border-color: var(--gold);
}

.text-size-toggle {
  display: inline-flex;
  align-items: stretch;
  gap: 2px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 8px;
  padding: 4px;
  background: rgba(255, 255, 255, 0.08);
}

.text-size-toggle .ts-btn {
  border: 0;
  background: transparent;
  color: #d4dde5;
  font-weight: 800;
  font-size: 13px;
  padding: 6px 10px;
  border-radius: 6px;
  line-height: 1;
  cursor: pointer;
  min-width: 36px;
}

.text-size-toggle .ts-btn:hover,
.text-size-toggle .ts-btn:focus {
  color: var(--navy);
  background: var(--gold);
  outline: none;
}

.text-size-toggle .ts-reset {
  font-size: 12px;
  min-width: 48px;
  border-left: 1px solid rgba(255, 255, 255, 0.12);
  border-right: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 0;
}

.hero-text {
  max-width: 840px;
  color: #d4dde5;
  font-size: 20px;
  line-height: 1.7;
  margin: 26px 0 0;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 34px;
}

.btn-primary-custom,
.btn-outline-custom {
  border-radius: 8px;
  font-weight: 800;
  padding: 14px 24px;
}

.btn-primary-custom {
  background: var(--gold);
  border: 1px solid var(--gold);
  color: var(--navy);
}

.btn-primary-custom:hover {
  background: #f0bd2d;
  border-color: #f0bd2d;
  color: var(--navy);
}

body.theme-pentecost .btn-primary-custom,
body.theme-christmas-day .btn-primary-custom,
body.theme-easter-day .btn-primary-custom,
body.theme-all-saints-day .btn-primary-custom,
body.theme-immaculate-conception .btn-primary-custom,
body.theme-assumption .btn-primary-custom {
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.2);
}

.btn-outline-custom {
  border: 1px solid rgba(255, 255, 255, 0.45);
  color: #fff;
}

.btn-outline-custom:hover {
  border-color: var(--gold);
  color: var(--gold);
}

.weekly-verse {
  max-width: 940px;
  margin-top: 44px;
  border-top: 1px solid rgba(255, 255, 255, 0.16);
  border-left: 4px solid var(--gold);
  padding-top: 26px;
  padding-left: 22px;
}

body.theme-pentecost .weekly-verse,
body.theme-christmas-day .weekly-verse,
body.theme-easter-day .weekly-verse,
body.theme-all-saints-day .weekly-verse,
body.theme-immaculate-conception .weekly-verse,
body.theme-assumption .weekly-verse {
  position: relative;
  border: 1px solid var(--special-panel-border);
  border-left: 5px solid var(--gold);
  border-radius: 8px;
  background: var(--special-panel-bg);
  padding: 24px 86px 24px 26px;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.16);
}

body.theme-pentecost .weekly-verse::after,
body.theme-christmas-day .weekly-verse::after,
body.theme-easter-day .weekly-verse::after,
body.theme-all-saints-day .weekly-verse::after,
body.theme-immaculate-conception .weekly-verse::after,
body.theme-assumption .weekly-verse::after {
  content: "";
  position: absolute;
  top: 24px;
  right: 24px;
  width: 46px;
  height: 46px;
  background: var(--special-icon) center / contain no-repeat;
  opacity: 0.72;
  pointer-events: none;
}

.weekly-verse span,
.weekly-verse blockquote,
.weekly-verse cite {
  display: block;
}

.weekly-verse span {
  color: var(--gold);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.weekly-verse blockquote {
  color: #fff;
  margin: 12px 0 10px;
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(23px, 2.4vw, 34px);
  line-height: 1.28;
}

.weekly-verse cite {
  color: #b8c5cf;
  font-size: 16px;
  font-style: normal;
  font-weight: 800;
}

.hero-slide-link {
  display: inline-flex;
  width: fit-content;
  margin-top: 14px;
  color: var(--gold);
  font-weight: 900;
  text-decoration: none;
}

.hero-slide-link:hover,
.hero-slide-link:focus {
  color: #fff;
}

.weekly-verse-carousel .carousel-item {
  display: none;
  min-height: 0;
  background: var(--navy);
  opacity: 0;
  transition: none;
}

.weekly-verse-carousel .carousel-inner {
  isolation: isolate;
  min-height: 260px;
  background: var(--navy);
}

.weekly-verse-carousel .carousel-item.active {
  display: block;
  opacity: 1;
  animation: weekly-verse-fade-in 260ms ease-out both;
}

.weekly-verse-carousel.carousel-fade .carousel-item-next,
.weekly-verse-carousel.carousel-fade .carousel-item-prev,
.weekly-verse-carousel.carousel-fade .carousel-item.active.carousel-item-start,
.weekly-verse-carousel.carousel-fade .carousel-item.active.carousel-item-end {
  display: none;
  opacity: 0;
}

@keyframes weekly-verse-fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.daily-reflection-scripture {
  margin: 10px 0 12px;
  color: #fff;
  font-size: 18px;
  line-height: 1.55;
}

.daily-reflection-body {
  padding-right: 8px;
  color: #d8e3ea;
  font-size: 16px;
  line-height: 1.6;
}

.prayer-intention-body {
  margin: 10px 0 12px;
  color: #d8e3ea;
  font-size: clamp(18px, 1.7vw, 24px);
  line-height: 1.55;
}

.saint-feast-summary {
  margin: 10px 0 12px;
  color: #d8e3ea;
  font-size: 16px;
  line-height: 1.55;
}

.hero-slide-eyebrow-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  margin-bottom: 6px;
}

.hero-slide-eyebrow-row > span:first-child {
  display: inline-block;
  color: var(--gold);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.hero-feast-date {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border: 1px solid rgba(255, 207, 92, 0.45);
  border-radius: 999px;
  background: rgba(255, 207, 92, 0.14);
  color: #ffd97a;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.hero-feast-date i {
  color: var(--gold);
  font-size: 13px;
}

.hero-feast-date strong {
  color: #fff;
  font-weight: 900;
}

.carousel-indicators.hero-carousel-indicators {
  position: static;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-start;
  margin: 18px 0 0;
  padding: 0;
}

.carousel-indicators.hero-carousel-indicators [data-bs-target] {
  width: 10px;
  height: 10px;
  min-width: 10px;
  border: 1px solid rgba(255, 207, 92, 0.55);
  border-top: 1px solid rgba(255, 207, 92, 0.55);
  border-bottom: 1px solid rgba(255, 207, 92, 0.55);
  border-radius: 50%;
  background: transparent;
  background-color: transparent;
  text-indent: -9999px;
  opacity: 1 !important;
  transition: width 180ms ease, background-color 180ms ease, border-color 180ms ease;
}

.carousel-indicators.hero-carousel-indicators [data-bs-target]:hover,
.carousel-indicators.hero-carousel-indicators [data-bs-target]:focus-visible {
  background: rgba(255, 207, 92, 0.45);
  background-color: rgba(255, 207, 92, 0.45);
  border-color: var(--gold);
}

.carousel-indicators.hero-carousel-indicators [data-bs-target].active {
  width: 28px;
  background: var(--gold);
  background-color: var(--gold);
  border-color: var(--gold);
  border-radius: 6px;
}

.daily-reflection-scripture p,
.daily-reflection-body p,
.prayer-intention-body p,
.saint-feast-summary p {
  margin-bottom: 8px;
}

.hero-media {
  position: relative;
  min-height: 520px;
  overflow: hidden;
}

.weekly-feature {
  background: linear-gradient(135deg, #0e3f45, #101f2b 58%, #4f271c);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  height: 100%;
  padding: 32px 24px;
  color: #fff;
}

body.theme-pentecost .weekly-feature,
body.theme-christmas-day .weekly-feature,
body.theme-easter-day .weekly-feature,
body.theme-all-saints-day .weekly-feature,
body.theme-immaculate-conception .weekly-feature,
body.theme-assumption .weekly-feature {
  background: var(--special-feature-bg);
}

.weekly-feature img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  border-radius: 6px;
  filter: drop-shadow(0 22px 34px rgba(0, 0, 0, 0.25));
}

.floating-note {
  position: absolute;
  right: 46px;
  bottom: 46px;
  max-width: 260px;
  border-radius: 8px;
  padding: 20px 22px;
  background: rgba(255, 253, 248, 0.95);
  box-shadow: var(--shadow);
}

.floating-note strong,
.floating-note span {
  display: block;
}

.floating-note strong {
  color: var(--red);
  font-size: 22px;
}

.floating-note span {
  color: var(--ink-soft);
  margin-top: 4px;
}

.announcement-ticker {
  overflow: hidden;
  border-top: 1px solid rgba(12, 27, 40, 0.14);
  border-bottom: 1px solid rgba(12, 27, 40, 0.14);
  background: var(--gold);
  color: var(--navy);
}

.ticker-track {
  display: flex;
  width: max-content;
  min-width: 100%;
  animation: ticker-scroll 110s linear infinite;
}

.announcement-ticker:hover .ticker-track {
  animation-play-state: paused;
}

.ticker-track span {
  position: relative;
  flex: 0 0 auto;
  padding: 17px 30px;
  font-size: 15px;
  font-weight: 900;
  text-transform: uppercase;
  white-space: nowrap;
}

.ticker-track span p {
  display: inline;
  margin: 0;
}

.ticker-track span strong,
.ticker-track span b {
  font-weight: 900;
}

.ticker-track span em,
.ticker-track span i:not(.fa) {
  font-style: italic;
}

.ticker-track span a {
  color: var(--navy);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.ticker-track span a:hover {
  color: var(--red);
}

.ticker-track span ul,
.ticker-track span ol {
  display: inline;
  margin: 0;
  padding: 0;
}

.ticker-track span li {
  display: inline;
  list-style: none;
}

@keyframes ticker-scroll {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

.section-shell {
  width: min(1160px, calc(100% - 40px));
  margin: 0 auto;
  padding: 84px 0;
}

.section-heading {
  max-width: 760px;
  margin-bottom: 34px;
}

.section-heading h2,
.news-layout h2 {
  margin: 0;
  color: var(--ink);
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(34px, 4vw, 52px);
  line-height: 1.08;
}

.section-copy {
  color: var(--ink-soft);
  font-size: 18px;
  line-height: 1.7;
  margin: 22px 0 0;
}

.link-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.feature-card {
  position: relative;
  min-height: 245px;
  border-radius: 8px;
  overflow: hidden;
  color: #fff;
  box-shadow: var(--shadow);
}

.feature-card.large-card {
  grid-column: span 2;
}

.feature-card img {
  width: 100%;
  height: 100%;
  min-height: 245px;
  object-fit: cover;
  transition: transform 350ms ease;
}

.feature-card::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, rgba(12, 27, 40, 0.08), rgba(12, 27, 40, 0.82));
}

.feature-card strong {
  position: absolute;
  left: 22px;
  z-index: 1;
}

.feature-card strong {
  right: 22px;
  bottom: 24px;
  font-size: 24px;
  line-height: 1.05;
}

.feature-card:hover img {
  transform: scale(1.04);
}

.section-band {
  background: var(--cream);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.news-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 48px;
  align-items: start;
}

.pastor-card {
  display: flex;
  gap: 18px;
  align-items: center;
  margin-top: 30px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(17, 32, 45, 0.08);
}

.pastor-card img {
  width: 78px;
  height: 78px;
  border-radius: 8px;
  object-fit: cover;
}

.pastor-card span,
.pastor-card strong,
.pastor-card a {
  display: block;
}

.pastor-card span {
  color: var(--red);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.pastor-card strong {
  margin: 4px 0 8px;
  font-size: 20px;
}

.pastor-card a {
  color: var(--gold-dark);
  font-weight: 800;
}

.news-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.news-cards-wrap {
  display: contents;
}

.news-cards article,
.news-card-link {
  display: block;
  min-height: 210px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 26px;
  background: #fff;
  color: inherit;
  text-decoration: none;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.news-card-button {
  width: 100%;
  border: 1px solid var(--line);
  text-align: left;
  cursor: pointer;
}

.news-card-link:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(17, 32, 45, 0.1);
}

.home-news-card-image {
  display: block;
  width: calc(100% + 52px);
  height: 200px;
  margin: -26px -26px 18px;
  border-radius: 8px 8px 0 0;
  object-fit: cover;
  background: var(--cream);
}

.news-card-image {
  width: calc(100% + 52px);
  height: 190px;
  margin: -26px -26px 18px;
  border-radius: 8px 8px 0 0;
  object-fit: cover;
  background: var(--cream);
}

.news-page-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.compact-heading {
  margin-bottom: 24px;
}

.catholic-rss-heading {
  margin-top: 52px;
}

.parish-news-carousel {
  position: relative;
  overflow: hidden;
  border-radius: 8px;
}

.parish-news-indicators {
  position: static;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-start;
  margin-bottom: 14px;
  margin-left: 0;
  margin-right: 0;
}

.carousel-indicators.parish-news-indicators [data-bs-target] {
  display: grid;
  min-width: 38px;
  height: 38px;
  width: 38px;
  place-items: center;
  border: 1px solid var(--line);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  border-radius: 50%;
  background: #fff;
  color: var(--navy);
  background-color: #fff;
  font-weight: 900;
  font-size: 14px;
  text-indent: 0 !important;
  opacity: 1 !important;
  line-height: 1;
  box-shadow: 0 6px 14px rgba(17, 32, 45, 0.08);
}

.carousel-indicators.parish-news-indicators [data-bs-target]:hover,
.carousel-indicators.parish-news-indicators [data-bs-target].active {
  border-color: var(--gold);
  background: var(--gold);
  background-color: var(--gold);
  color: var(--navy);
  box-shadow: 0 8px 18px rgba(224, 169, 0, 0.22);
}

.parish-news-carousel .carousel-inner {
  min-height: 190px;
  overflow: hidden;
}

.parish-news-carousel .carousel-item {
  transition: opacity 700ms ease-in-out;
}

.parish-news-card {
  position: relative;
  min-height: 150px;
  border: 1px solid var(--line);
  border-left: 5px solid var(--gold);
  border-radius: 8px;
  padding: 24px 28px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 32, 45, 0.08);
}

.parish-news-controls {
  position: absolute;
  right: 16px;
  bottom: 16px;
  display: flex;
  gap: 8px;
}

.parish-news-controls button {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: #fff;
  color: var(--gold-dark);
  box-shadow: 0 8px 18px rgba(17, 32, 45, 0.12);
}

.parish-news-controls button:hover {
  border-color: var(--gold);
  background: var(--gold);
  color: var(--navy);
}

.parish-news-card-head {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 14px;
}

.parish-news-title-wrap {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.parish-news-title-wrap .fa {
  display: grid;
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 50%;
  background: rgba(224, 169, 0, 0.16);
  color: var(--gold-dark);
  font-size: 16px;
}

.parish-news-card span {
  color: var(--gold-dark);
  font-size: clamp(21px, 2.4vw, 28px);
  font-weight: 900;
  text-transform: uppercase;
  line-height: 1.12;
}

.parish-news-card h3 {
  margin: 10px 0 14px;
  color: var(--ink);
  font-size: 28px;
}

.news-cards span {
  color: var(--gold-dark);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.news-cards h3 {
  margin: 10px 0 12px;
  font-size: 25px;
}

.news-cards p {
  color: var(--ink-soft);
  line-height: 1.65;
  margin: 0;
}

.home-parish-news-panel {
  grid-column: 1 / -1;
  margin-top: 20px;
  border: 1px solid rgba(224, 169, 0, 0.32);
  border-radius: 8px;
  padding: 20px;
  background: linear-gradient(180deg, #fffdf7 0%, #fff8e8 100%);
  box-shadow: 0 14px 32px rgba(17, 32, 45, 0.08);
}

.news-layout > div:first-child .home-parish-news-panel {
  grid-column: auto;
  margin-top: 28px;
  background: linear-gradient(180deg, #fff 0%, #fff8e8 100%);
}

.news-cards-wrap > .home-parish-news-panel {
  display: none;
}

.home-parish-news-heading {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.home-parish-news-heading .eyebrow {
  margin: 0;
}

.home-parish-news-heading a {
  color: var(--gold-dark);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
  text-decoration: none;
}

.home-parish-news-heading a:hover {
  color: var(--red);
}

.home-parish-news-panel .parish-news-card {
  min-height: 130px;
  border-color: rgba(224, 169, 0, 0.28);
  background: #fff;
  box-shadow: none;
}

.home-parish-news-panel .parish-news-card span {
  font-size: clamp(19px, 2vw, 24px);
}

.prayer-modal .modal-content {
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  box-shadow: var(--shadow);
}

.about-pastors-modal .modal-body .rich-content {
  column-count: 2;
  column-gap: 32px;
  column-rule: 1px solid var(--line);
}

.about-pastors-modal .modal-body .rich-content > * {
  break-inside: avoid;
  page-break-inside: avoid;
}

.about-pastors-modal .modal-body .rich-content > :first-child {
  margin-top: 0;
}

.about-pastors-modal .modal-body .rich-content img,
.about-pastors-modal .modal-body .rich-content figure,
.about-pastors-modal .modal-body .rich-content h1,
.about-pastors-modal .modal-body .rich-content h2,
.about-pastors-modal .modal-body .rich-content h3 {
  break-after: avoid;
}

@media (max-width: 768px) {
  .about-pastors-modal .modal-body .rich-content {
    column-count: 1;
    column-rule: none;
  }
}

.prayer-modal .modal-header {
  align-items: flex-start;
  border-bottom: 1px solid var(--line);
  padding: 28px 32px;
  gap: 18px;
  background:
    radial-gradient(circle at top left, rgba(224, 169, 0, 0.18), transparent 34%),
    var(--cream);
}

.prayer-modal-icon {
  display: grid;
  flex: 0 0 auto;
  width: 58px;
  height: 58px;
  place-items: center;
  border: 1px solid rgba(224, 169, 0, 0.36);
  border-radius: 50%;
  background: #fff;
  color: var(--gold-dark);
  font-size: 24px;
  box-shadow: 0 12px 24px rgba(17, 32, 45, 0.1);
}

.prayer-modal .modal-title {
  margin: 0;
  color: var(--ink);
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(30px, 4vw, 44px);
  line-height: 1.08;
}

.prayer-modal .modal-body {
  padding: 30px 32px 34px;
  color: var(--ink-soft);
  font-size: 18px;
  line-height: 1.7;
}

.rich-content {
  font-size: 1.125rem;
  line-height: 1.7;
}

.rich-content > :first-child {
  margin-top: 0;
}

.rich-content > :last-child {
  margin-bottom: 0;
}

.parish-carousel-section {
  padding-bottom: 48px;
}

.parish-photo-gallery {
  display: grid;
  gap: 14px;
}

.lcl_fade_oc.lcl_pre_show #lcl_overlay,
.lcl_fade_oc.lcl_pre_show #lcl_window,
.lcl_fade_oc.lcl_is_closing #lcl_overlay,
.lcl_fade_oc.lcl_is_closing #lcl_window {
  opacity: 0 !important;
}

.lcl_fade_oc.lcl_is_closing #lcl_overlay {
  transition-delay: 0.15s !important;
}

.parish-photo-stage {
  position: relative;
  overflow: hidden;
  margin: 0;
  border-radius: 8px;
  background: var(--navy);
  box-shadow: var(--shadow);
}

.parish-photo-stage::after {
  position: absolute;
  inset: auto 0 0;
  height: 42%;
  background: linear-gradient(180deg, transparent, rgba(8, 22, 33, 0.82));
  content: "";
  pointer-events: none;
}

.parish-photo-stage img {
  width: 100%;
  height: min(62vw, 560px);
  min-height: 340px;
  object-fit: cover;
  transition: opacity 240ms ease, transform 6200ms ease-out;
}

.parish-photo-stage.is-changing img {
  opacity: 0.22;
  transform: scale(1.015);
}

.parish-photo-stage figcaption {
  position: absolute;
  right: 26px;
  bottom: 24px;
  left: 26px;
  z-index: 1;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  color: #fff;
}

.parish-photo-stage figcaption span {
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 999px;
  padding: 6px 12px;
  background: rgba(8, 22, 33, 0.5);
  color: var(--gold-light);
  font-size: 13px;
  font-weight: 900;
}

.parish-photo-stage figcaption strong {
  display: block;
  max-width: min(680px, 70%);
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(24px, 4vw, 44px);
  line-height: 1.05;
  font-weight: 900;
  text-align: right;
}

.parish-photo-thumbs {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  padding: 4px 2px 10px;
  scrollbar-color: var(--gold) rgba(8, 22, 33, 0.12);
}

.parish-photo-thumb {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 70px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
  background: #fff;
  color: var(--ink);
  text-align: left;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.parish-photo-thumb:hover,
.parish-photo-thumb:focus-visible,
.parish-photo-thumb.active {
  border-color: var(--gold);
  box-shadow: 0 10px 24px rgba(8, 22, 33, 0.12);
}

.parish-photo-thumb.active {
  background: #fff8e5;
}

.parish-photo-thumb img {
  width: 58px;
  height: 52px;
  border-radius: 6px;
  object-fit: cover;
}

.parish-photo-thumb span {
  overflow: hidden;
  color: var(--ink);
  font-size: 14px;
  font-weight: 900;
  line-height: 1.2;
  text-overflow: ellipsis;
}

@media (max-width: 720px) {
  .parish-photo-stage img {
    height: 72vw;
    min-height: 260px;
  }

  .parish-photo-stage figcaption {
    right: 16px;
    bottom: 16px;
    left: 16px;
    display: grid;
  }

  .parish-photo-stage figcaption strong {
    max-width: none;
    text-align: left;
  }

  .parish-photo-thumbs {
    grid-auto-flow: column;
    grid-auto-columns: minmax(220px, 78vw);
    grid-template-columns: none;
    overflow-x: auto;
  }
}

.parish-gallery-modal .modal-content {
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  background: #081621;
  color: #fff;
}

.parish-gallery-modal .modal-header {
  align-items: flex-start;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  padding: 20px 24px;
}

.parish-gallery-modal .modal-title {
  margin: 0;
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(28px, 4vw, 42px);
}

.parish-gallery-actions {
  display: flex;
  gap: 10px;
  align-items: center;
}

.parish-gallery-actions .btn-close {
  filter: invert(1);
  opacity: 0.9;
}

.parish-gallery-actions .icon-action {
  border-color: rgba(255, 255, 255, 0.22);
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
}

.parish-gallery-modal .modal-body {
  padding: 0;
}

.parish-gallery-carousel .carousel-item {
  height: min(72vh, 720px);
  background: #050d14;
}

.parish-gallery-carousel img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.parish-gallery-caption {
  position: absolute;
  right: 24px;
  bottom: 24px;
  left: 24px;
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: space-between;
  border-radius: 8px;
  padding: 12px 16px;
  background: rgba(8, 22, 33, 0.76);
}

.parish-gallery-caption span {
  color: var(--gold);
  font-weight: 900;
}

.parish-gallery-caption strong {
  text-align: right;
}

.parish-gallery-thumbs {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding: 14px;
  background: #0c1b28;
}

.parish-gallery-thumbs button {
  flex: 0 0 auto;
  width: 86px;
  height: 62px;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: 8px;
  padding: 0;
  background: transparent;
  opacity: 0.62;
}

.parish-gallery-thumbs button.active,
.parish-gallery-thumbs button:hover {
  border-color: var(--gold);
  opacity: 1;
}

.parish-gallery-thumbs img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.media-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.media-grid a {
  display: block;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  box-shadow: var(--shadow);
}

.media-grid img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.media-grid span {
  display: block;
  min-height: 68px;
  padding: 16px;
  color: var(--ink);
  font-weight: 800;
}

.content-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 0.72fr);
  gap: 42px;
  align-items: center;
  padding: clamp(34px, 5vw, 64px) clamp(24px, 7vw, 96px);
  color: #fff;
  background: var(--navy);
}

.compact-content-hero {
  grid-template-columns: minmax(0, 820px);
  padding-block: 70px;
}

.content-hero-copy h1,
.content-hero-copy h2 {
  margin: 12px 0 0;
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(40px, 5.4vw, 66px);
  font-weight: 700;
  line-height: 1.05;
}

.content-hero-copy .eyebrow {
  margin: 0;
  color: var(--gold);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.content-hero-copy p:not(.eyebrow) {
  max-width: 720px;
  margin: 18px 0 0;
  color: #d4dde5;
  font-size: 18px;
  line-height: 1.7;
}

.content-hero-copy .content-hero-meta {
  display: inline-flex;
  width: fit-content;
  margin-top: 20px;
  border-left: 4px solid var(--gold);
  padding: 6px 0 6px 14px;
  color: #fff;
  font-weight: 900;
}

.content-hero img {
  width: 100%;
  min-height: 240px;
  max-height: 320px;
  border-radius: 8px;
  object-fit: cover;
  box-shadow: var(--shadow);
}

.downloads-section {
  padding-top: 72px;
}

.downloads-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.download-card {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 18px;
  align-items: flex-start;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  box-shadow: 0 18px 44px rgba(9, 30, 45, 0.08);
}

.download-card-icon {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 8px;
  background: rgba(225, 170, 0, 0.14);
  color: var(--gold-dark);
  font-size: 25px;
}

.download-card h2 {
  margin: 4px 0 10px;
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(1.45rem, 2.5vw, 2rem);
}

.download-card .rich-content {
  margin-bottom: 18px;
  color: var(--ink-soft);
}

.contact-section {
  padding-top: 72px;
}

.contact-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 0.92fr);
  gap: 32px;
  align-items: start;
}

.contact-panel {
  border-top: 1px solid var(--line);
  padding-top: 18px;
}

.contact-panel-heading {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
  color: var(--red);
}

.contact-panel-heading .fa {
  color: var(--red);
  font-size: 23px;
}

.contact-panel-heading h2 {
  margin: 0;
  color: var(--red);
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: 24px;
  text-transform: uppercase;
}

.contact-form {
  display: grid;
  gap: 18px;
}

.contact-form label {
  display: grid;
  gap: 8px;
  align-items: start;
  color: var(--red);
  font-weight: 800;
  text-transform: uppercase;
}

.contact-field-row {
  display: grid;
  gap: 18px;
}

.contact-field-row.two-columns {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.contact-form input,
.contact-form textarea {
  margin-top: 0;
}

.contact-message-field textarea {
  min-height: 158px;
}

.contact-form .text-danger {
  text-transform: none;
}

.contact-form-alert {
  display: block;
  margin: -2px 0 2px;
  padding: 12px 14px;
  border-left: 4px solid var(--red);
  border-radius: 6px;
  color: var(--red);
  background: rgba(174, 37, 25, 0.08);
}

.contact-form-alert:empty {
  display: none;
}

.contact-form-actions {
  display: flex;
  justify-content: flex-end;
}

.contact-form .btn {
  min-width: 126px;
  min-height: 48px;
  margin-top: 0;
}

.contact-address {
  margin-bottom: 16px;
}

.contact-address strong {
  color: var(--ink);
  font-size: 18px;
}

.contact-address p {
  margin: 6px 0 0;
  color: var(--ink-soft);
}

.contact-map {
  width: 100%;
  min-height: 330px;
  border: 0;
}

.schedule-section {
  padding-top: 72px;
}

.schedule-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.schedule-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 28px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 32, 45, 0.08);
}

.schedule-card span {
  color: var(--gold-dark);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.schedule-card h2 {
  margin: 10px 0 18px;
  font-size: 28px;
}

.schedule-card p {
  margin: 0 0 8px;
  color: var(--ink-soft);
  font-size: 17px;
  line-height: 1.55;
}

.online-mass-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: center;
  margin: 28px 0px;
  border-radius: 8px;
  padding: 30px;
  color: #fff;
  background: var(--navy);
  scroll-margin-top: 96px;
}

.online-mass-panel h2 {
  margin: 0;
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(32px, 4vw, 48px);
}

.online-mass-panel p:not(.eyebrow) {
  margin: 16px 0 0;
  color: #d4dde5;
  font-size: 18px;
  line-height: 1.65;
}

.online-mass-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-end;
}

.online-mass-links a {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border-radius: 8px;
  padding: 14px 18px;
  color: var(--navy);
  background: var(--gold);
  font-weight: 900;
}

.online-mass-links a:hover {
  color: var(--navy);
  background: #f0bd2d;
}

.bulletin-section {
  padding-top: 72px;
}

.about-page-section {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 32px;
  align-items: start;
  padding-top: 72px;
}

.about-page-nav {
  position: sticky;
  top: 104px;
  display: grid;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #fff;
  box-shadow: var(--shadow);
}

.about-page-nav a,
.about-page-nav button {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  border-radius: 6px;
  border: 0;
  padding: 11px 12px;
  background: transparent;
  color: var(--ink);
  font-weight: 800;
  text-align: left;
}

.about-page-nav a:hover,
.about-page-nav a.active,
.about-page-nav button:hover,
.about-page-nav button.active {
  color: var(--navy);
  background: var(--cream);
}

.about-page-nav .fa {
  color: var(--gold-dark);
}

.about-page-content {
  min-height: 360px;
  border-left: 5px solid var(--gold);
  padding: 8px 0 8px 28px;
  font-size: 1.125rem;
  line-height: 1.7;
}

.about-page-content h2 {
  margin-top: 28px;
  color: var(--red);
  font-family: var(--font-body);
  font-size: 28px;
  font-weight: 900;
}

.about-page-content li {
  margin-bottom: 8px;
}

.about-page-content p {
  margin-bottom: 16px;
}

.ministries-hero {
  position: relative;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.35fr);
  overflow: hidden;
}


.ministries-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0 auto;
  width: min(48vw, 620px);
  height: min(48vw, 620px);
  border: 1px solid rgba(217, 165, 20, 0.18);
  border-radius: 50%;
  transform: translate(26%, 36%);
}

.ministries-hero-mark {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: min(30vw, 260px);
  aspect-ratio: 1;
  justify-self: end;
  border: 1px solid rgba(217, 165, 20, 0.35);
  border-radius: 50%;
  color: var(--gold);
  background: rgba(255, 255, 255, 0.06);
  font-size: clamp(64px, 9vw, 118px);
}

.ministries-home-section {
  padding-top: 72px;
}

.ministries-home-intro {
  width: 100%;
  max-width: none;
  margin-bottom: 30px;
}

.ministries-kicker {
  color: var(--gold-dark);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ministries-home-intro h2 {
  margin: 10px 0 12px;
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(34px, 5vw, 56px);
  line-height: 1.05;
}

.ministries-home-intro p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 18px;
  line-height: 1.65;
}

.ministries-home-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 28px;
  align-items: start;
}

.ministries-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.ministry-card {
  display: flex;
  flex-direction: column;
  min-height: 290px;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  color: var(--ink);
  box-shadow: 0 12px 30px rgba(17, 32, 45, 0.08);
}

.ministry-card:hover {
  color: var(--ink);
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}

.ministry-card img,
.ministry-card-icon {
  width: 100%;
  height: 150px;
  object-fit: cover;
}

.ministries-hub-section .ministry-card img {
  height: 220px;
  object-fit: contain;
  background: #f7f2e8;
}

.ministry-card-icon {
  display: grid;
  place-items: center;
  color: var(--gold);
  background: var(--navy);
  font-size: 54px;
}

.ministry-card span:not(.ministry-card-icon) {
  margin: 18px 20px 8px;
  color: var(--gold-dark);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ministry-card strong {
  margin: 0 20px;
  font-size: 22px;
  line-height: 1.2;
}

.ministry-card p {
  margin: 12px 20px 22px;
  color: var(--ink-soft);
  line-height: 1.55;
}

.ministry-detail-hero img {
  max-height: 380px;
}

.ministry-hero-image {
  overflow: hidden;
  border-radius: 8px;
}

.ministry-hero-image img,
.ministry-inline-gallery .parish-photo-stage img {
  transition: opacity 240ms ease, transform 520ms ease;
}

.ministry-hero-image:hover img,
.ministry-hero-image:focus-within img,
.ministry-inline-gallery .parish-photo-stage:hover img,
.ministry-inline-gallery .parish-photo-stage:focus-within img {
  transform: scale(1.05);
}

.ministry-hero-mission {
  position: relative;
  margin: 28px 0 0;
  max-width: 720px;
  border-left: 5px solid var(--gold);
  padding: 18px 0 18px 34px;
  color: #fff;
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(24px, 3vw, 38px);
  font-style: italic;
  font-weight: 600;
  line-height: 1.22;
}

.ministry-hero-mission::before {
  position: absolute;
  top: -6px;
  left: 8px;
  z-index: 0;
  color: rgba(226, 168, 13, 0.22);
  content: "\201C";
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: 62px;
  line-height: 1;
  pointer-events: none;
}

.ministry-hero-mission > * {
  position: relative;
  z-index: 1;
}

.ministry-template-section {
  padding-top: 72px;
}

.ministry-template-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.55fr);
  gap: 28px;
  align-items: start;
}

.ministry-template-grid.single-column {
  grid-template-columns: minmax(0, 1fr);
}

.ministry-template-grid.single-column .ministry-introduction {
  max-width: 980px;
}

.ministry-introduction,
.ministry-announcement-panel,
.ministry-info-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 28px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 32, 45, 0.08);
}

.ministry-introduction {
  border-left: 5px solid var(--gold);
}

.ministry-mission-line {
  margin: 14px 0 24px;
  color: var(--ink);
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.25;
}

.ministry-introduction h2 {
  color: var(--red);
  font-family: var(--font-body);
  font-size: 26px;
  font-weight: 900;
}

.ministry-info-panel {
  display: grid;
  gap: 16px;
}

.ministry-info-card {
  position: relative;
  padding-left: 76px;
  background: #fffaf0;
}

.ministry-info-card > .fa {
  position: absolute;
  top: 28px;
  left: 28px;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 50%;
  color: var(--navy);
  background: var(--gold);
}

.ministry-info-card p {
  margin: 10px 0 0;
  color: var(--ink-soft);
  line-height: 1.6;
}

.ministry-info-card a {
  color: var(--gold-dark);
  font-weight: 900;
}

.ministry-announcement-rail-card {
  padding-left: 28px;
}

.ministry-announcement-rail-card > .fa {
  position: static;
  margin-bottom: 12px;
}

.ministry-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.ministry-section-heading strong {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  color: var(--navy);
  background: var(--gold);
  font-weight: 900;
}

.ministry-news-indicators {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}

.ministry-news-indicators button {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--ink);
  background: #fff;
  font-weight: 900;
}

.ministry-news-indicators button.active {
  border-color: var(--gold);
  color: var(--navy);
  background: var(--gold);
}

.ministry-announcement-carousel .carousel-item {
  transition: opacity 360ms ease;
}

.ministry-announcement-carousel .carousel-inner {
  min-height: 190px;
  overflow: hidden;
}

.ministry-announcement-card h2 {
  margin: 0 0 12px;
  color: var(--gold-dark);
  font-family: var(--font-body);
  font-size: 23px;
  font-weight: 900;
}

.ministry-empty-text {
  color: var(--ink-soft);
  font-size: 18px;
}

.ministry-images-section {
  padding-top: 28px;
}

.ministry-photo-grid {
  margin-top: 18px;
}

.ministry-photo-carousel {
  margin-top: 18px;
}

.ministry-photo-carousel .carousel-item {
  height: auto;
  min-height: 0;
}

.ministry-photo-slide {
  display: block;
  position: relative;
  height: min(62vw, 560px);
  min-height: 340px;
  overflow: hidden;
  border-radius: 8px;
  background: var(--navy);
}

.ministry-photo-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ministry-photo-slide span {
  position: absolute;
  right: 24px;
  bottom: 28px;
  left: 24px;
  z-index: 2;
  border-left: 4px solid var(--gold);
  padding: 14px 16px;
  color: #fff;
  background: rgba(7, 30, 45, 0.82);
  font-weight: 900;
}

.ministries-home-content {
  border: 1px solid var(--line);
  border-left: 5px solid var(--gold);
  border-radius: 8px;
  padding: 28px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 32, 45, 0.08);
}

.ministries-home-content h2 {
  color: var(--red);
  font-family: var(--font-body);
  font-size: 26px;
  font-weight: 900;
}

.ministries-home-content li {
  margin-bottom: 8px;
}

.ministries-next-panel {
  position: sticky;
  top: 104px;
  border: 1px solid rgba(217, 165, 20, 0.35);
  border-radius: 8px;
  padding: 24px;
  background: #fffaf0;
}

.ministries-next-panel .fa {
  color: var(--gold-dark);
  font-size: 30px;
}

.ministries-next-panel h3 {
  margin: 14px 0 10px;
  font-size: 22px;
}

.ministries-next-panel p {
  margin: 0;
  color: var(--ink-soft);
  line-height: 1.6;
}

.admin-thumb {
  width: 82px;
  height: 62px;
  border-radius: 6px;
  object-fit: cover;
  background: var(--navy);
}

.bulletin-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 28px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 32, 45, 0.08);
}

.bulletin-panel h2 {
  margin: 0;
  font-size: clamp(30px, 4vw, 46px);
}

.bulletin-panel p:not(.eyebrow) {
  max-width: 720px;
  margin: 14px 0 0;
  color: var(--ink-soft);
  font-size: 18px;
  line-height: 1.65;
}

.pastor-message-title-badge {
  max-width: 100%;
  border-radius: 8px;
  padding: 14px 18px;
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(28px, 4vw, 44px);
  font-weight: 700;
  white-space: normal;
  line-height: 1.12;
  text-transform: none;
}

.pastor-message-panel {
  background: linear-gradient(180deg, #fff 0%, #fffaf0 100%);
}

.pastor-message-panel .pastor-message-body p,
.pastor-message-panel .pastor-message-body ul,
.pastor-message-panel .pastor-message-body ol,
.pastor-message-panel .pastor-message-body blockquote {
  max-width: none;
}

.pastor-message-body img,
.rich-content img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

.pastor-message-body figure,
.rich-content figure {
  margin: 22px 0;
}

.pastor-message-body figure img,
.rich-content figure img {
  display: block;
}

.pastor-message-body figure.rich-figure,
.rich-content figure.rich-figure,
.rich-text-editor figure.rich-figure {
  max-width: 100%;
}

.pastor-message-body figure.rich-figure img,
.rich-content figure.rich-figure img,
.rich-text-editor figure.rich-figure img {
  width: 100%;
  height: auto;
  border-radius: 8px;
}

.pastor-message-body figure.rich-align-center,
.rich-content figure.rich-align-center,
.rich-text-editor figure.rich-align-center {
  margin-left: auto;
  margin-right: auto;
}

.pastor-message-body figure.rich-align-left,
.rich-content figure.rich-align-left,
.rich-text-editor figure.rich-align-left {
  float: left;
  clear: left;
  margin: 8px 22px 18px 0;
}

.pastor-message-body figure.rich-align-right,
.rich-content figure.rich-align-right,
.rich-text-editor figure.rich-align-right {
  float: right;
  clear: right;
  margin: 8px 0 18px 22px;
}

.pastor-message-body figure.rich-align-left + figure,
.pastor-message-body figure.rich-align-right + figure,
.rich-content figure.rich-align-left + figure,
.rich-content figure.rich-align-right + figure,
.rich-text-editor figure.rich-align-left + figure,
.rich-text-editor figure.rich-align-right + figure {
  margin-top: 24px;
}

.pastor-message-body figure.rich-align-left + *,
.pastor-message-body figure.rich-align-right + *,
.rich-content figure.rich-align-left + *,
.rich-content figure.rich-align-right + * {
  clear: none;
}

.rich-text-editor figure.is-image-selected {
  outline: 2px solid var(--gold-dark);
  outline-offset: 4px;
  border-radius: 4px;
}

.rich-text-editor figure.rich-figure img {
  cursor: pointer;
}

.pastor-message-title-badge {
  display: inline-flex;
  align-items: center;
  gap: 14px;
}

.pastor-message-title-badge i {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  border-radius: 50%;
  color: #fff;
  background: var(--gold-dark);
  font-size: 20px;
}

.saints-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 18px;
}

.saint-card {
  display: grid;
  gap: 8px;
  min-height: 170px;
  align-content: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 32, 45, 0.08);
  padding: 24px;
  text-decoration: none;
}

.saint-card span {
  color: var(--gold-dark);
  font-weight: 800;
  text-transform: uppercase;
  font-size: 0.78rem;
}

.saint-card strong {
  color: var(--navy);
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.12;
}

.saint-card small {
  color: var(--ink-soft);
}

.saint-feast-badge {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  border: 1px solid rgba(217, 162, 0, 0.36);
  border-radius: 999px;
  background: rgba(217, 162, 0, 0.1);
  padding: 8px 12px;
  color: var(--navy);
  font-size: 0.88rem;
  font-weight: 800;
}

.saint-feast-badge i {
  color: var(--gold-dark);
}

.saint-feast-badge span {
  color: var(--ink-soft);
  font-size: inherit;
  letter-spacing: 0;
  text-transform: none;
}

.saint-feast-badge b {
  color: var(--navy);
}

.saint-card-summary {
  color: var(--ink-soft);
  font-size: 0.95rem;
  line-height: 1.5;
}

.landing-pages-section {
  padding-top: 46px;
}

.landing-pages-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 20px;
}

.landing-page-card {
  display: grid;
  overflow: hidden;
  min-height: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 32, 45, 0.08);
  color: var(--ink);
  text-decoration: none;
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.landing-page-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 42px rgba(17, 32, 45, 0.14);
}

.landing-page-card img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: var(--cream);
}

.landing-page-card > div {
  display: grid;
  gap: 10px;
  align-content: start;
  padding: 22px;
}

.landing-page-card span {
  color: var(--gold-dark);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.landing-page-card strong {
  color: var(--navy);
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(24px, 2.4vw, 32px);
  line-height: 1.12;
}

.landing-page-card-preview {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  color: var(--ink-soft);
  font-size: 0.95rem;
  line-height: 1.55;
}

.landing-page-card-preview * {
  display: inline;
  margin: 0;
}

.saint-card-summary p {
  margin: 0 0 6px;
}

.saint-card:hover,
.saint-card:focus {
  border-color: rgba(217, 162, 0, 0.55);
  transform: translateY(-2px);
}

.content-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  color: var(--ink-soft);
  font-weight: 700;
}

.content-breadcrumb a {
  color: var(--gold-dark);
  text-decoration: none;
}

.content-breadcrumb a:hover,
.content-breadcrumb a:focus {
  text-decoration: underline;
}

.content-breadcrumb span::before {
  content: "/";
  margin-right: 8px;
  color: rgba(17, 32, 45, 0.35);
}

.saints-detail-content {
  width: 100%;
  max-width: none;
  font-size: 1.125rem;
  line-height: 1.7;
}

.content-hero-copy .saint-detail-feast {
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(217, 162, 0, 0.38);
  border-left: 4px solid var(--gold);
  border-radius: 999px;
  background: rgba(217, 162, 0, 0.12);
  padding: 10px 16px;
}

.saint-detail-feast i {
  color: var(--gold);
}

.saint-detail-feast b {
  color: #fff;
}

.bulletin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}

.bulletin-frame {
  width: 100%;
  min-height: 78vh;
  margin-top: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8f8f8;
}

.bulletin-archive {
  margin-top: 38px;
}

.bulletin-archive > h2 {
  margin: 0 0 18px;
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(30px, 4vw, 46px);
}

.bulletin-archive section {
  margin-top: 24px;
}

.bulletin-archive h3 {
  margin: 0 0 12px;
  color: var(--ink);
}

.bulletin-archive-list {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 24px;
}

.bulletin-archive-list a {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  color: #006bd6;
  font-weight: 700;
}

.bulletin-archive-list .fa {
  color: var(--red);
}

.bulletin-archive-list span {
  font-weight: 900;
}

.site-footer {
  color: #d8e0e7;
  background: var(--navy);
  padding: 56px 0 24px;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 0.8fr 1.1fr 0.9fr;
  gap: 36px;
}

.site-footer h2,
.site-footer h3 {
  color: #fff;
  margin: 0 0 12px;
}

.site-footer h2 {
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: 30px;
}

.site-footer h3 {
  font-size: 16px;
  text-transform: uppercase;
}

.site-footer p {
  color: #c3ced7;
  margin: 0;
  line-height: 1.65;
}

.footer-diocese {
  margin-top: 8px;
  color: var(--gold);
  font-weight: 800;
}

.footer-contact-line {
  margin-top: 8px !important;
}

.footer-blurb {
  margin-top: 12px !important;
}

.site-footer .footer-grid i {
  width: 18px;
  text-align: center;
  color: var(--gold);
}

.site-footer a {
  display: block;
  color: #c3ced7;
  margin-top: 8px;
}

.site-footer a:hover {
  color: var(--gold);
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  margin-top: 42px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  padding-top: 22px;
  color: #9fb0be;
  font-size: 14px;
}

.admin-page {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
  padding: 56px 0 84px;
}

.admin-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  margin-bottom: 28px;
}

.admin-header h1 {
  margin: 0;
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(36px, 4vw, 56px);
}

.admin-header p:not(.eyebrow) {
  margin: 10px 0 0;
  color: var(--ink-soft);
  font-size: 17px;
}

.admin-header-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 12px;
}

.admin-alert {
  border-radius: 8px;
  margin-bottom: 22px;
  padding: 14px 16px;
  color: #14351a;
  background: #dff3df;
  font-weight: 800;
}

.admin-empty-state {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 28px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 32, 45, 0.08);
}

.admin-empty-state h2 {
  margin: 0 0 8px;
}

.admin-empty-state p {
  margin: 0;
  color: var(--ink-soft);
}

.admin-section {
  margin-top: 28px;
  scroll-margin-top: 96px;
}

.admin-section h2 {
  margin: 0 0 12px;
  color: var(--ink);
  font-size: 24px;
  text-transform: capitalize;
}

.admin-section-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 12px;
}

.admin-section-heading h2 {
  margin-bottom: 0;
}

.admin-section h2 .fa {
  width: 24px;
  color: var(--gold-dark);
}

.admin-subsection {
  margin-top: 18px;
  scroll-margin-top: 96px;
}

.admin-subsection h3 {
  margin: 0 0 10px;
  color: var(--ink);
  font-size: 18px;
}

.admin-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 32, 45, 0.08);
}

.admin-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 860px;
}

.admin-table th,
.admin-table td {
  border-bottom: 1px solid var(--line);
  padding: 14px 16px;
  text-align: left;
  vertical-align: top;
}

.admin-table th {
  color: var(--ink-soft);
  background: #faf6ef;
  font-size: 13px;
  text-transform: uppercase;
}

.admin-cell-rich {
  font-size: 0.95rem;
  line-height: 1.5;
}

.admin-cell-rich p {
  margin: 0 0 6px;
}

.admin-cell-rich p:last-child {
  margin-bottom: 0;
}

.admin-table td {
  color: var(--ink);
}

.admin-table td span {
  display: block;
  color: var(--ink-soft);
  font-size: 12px;
  margin-top: 4px;
}

/* Family expand/collapse control: keep the chevron arrow and the child-count
   badge on one aligned line. Scoped under `.admin-table td` so it outranks the
   generic `td span { display:block }` rule above (which would otherwise stack
   them and stretch the badge full-width). */
.admin-table td .kidnav {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  vertical-align: middle;
  margin-top: 0;
}
.admin-table td .kidnav .kid-count {
  display: inline-flex;
  align-items: center;
  margin-top: 0;
  font-size: .68rem;
  padding: 1px 6px;
  line-height: 1;
}
.kidnav-arrow {
  border: 0;
  background: none;
  padding: 0;
  margin: 0;
  line-height: 1;
  color: var(--gold-dark);
  cursor: pointer;
  font-size: .9rem;
}
.kidnav-arrow:hover { color: var(--navy); }

.admin-table tr:last-child td {
  border-bottom: 0;
}

.admin-table a {
  color: var(--gold-dark);
}

.parish-news-admin-table {
  table-layout: fixed;
}

.parish-news-admin-table th:nth-child(1),
.parish-news-admin-table td:nth-child(1) {
  width: 150px;
}

.parish-news-admin-table th:nth-child(2),
.parish-news-admin-table td:nth-child(2) {
  width: 30%;
}

.parish-news-admin-table th:nth-child(3),
.parish-news-admin-table td:nth-child(3) {
  width: 30%;
}

.parish-news-admin-table th:nth-child(4),
.parish-news-admin-table td:nth-child(4) {
  width: 120px;
}

.parish-news-admin-table th:nth-child(5),
.parish-news-admin-table td:nth-child(5) {
  width: 110px;
}

.announcement-popup-admin-table {
  min-width: 0;
}

.admin-rich-preview {
  max-height: 220px;
  overflow: auto;
  color: var(--ink);
  line-height: 1.55;
}

.admin-rich-preview p {
  margin: 0 0 8px;
}

.admin-rich-preview figure {
  margin: 8px 0;
}

.admin-rich-preview img {
  max-width: 180px;
  max-height: 130px;
  object-fit: cover;
}

.navigation-admin-map {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: 12px;
}

.navigation-admin-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}

.navigation-admin-card-heading {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  background: #faf6ef;
}

.navigation-admin-card-heading h3 {
  margin: 0;
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 900;
}

.navigation-admin-card-heading p {
  margin: 2px 0 0;
  color: var(--ink-soft);
  font-size: 12px;
}

.navigation-admin-items {
  display: grid;
}

.navigation-admin-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
}

.navigation-admin-item:last-child {
  border-bottom: 0;
}

.navigation-admin-item span,
.navigation-admin-item small {
  display: block;
  color: var(--ink-soft);
  font-size: 11px;
}

.navigation-admin-item strong {
  display: block;
  margin: 1px 0;
  color: var(--ink);
  font-size: 14px;
}

.navigation-menu-tree .navigation-admin-items {
  gap: 0;
}

.navigation-admin-parent {
  border-bottom: 1px solid var(--line);
}

.navigation-admin-parent:last-child {
  border-bottom: 0;
}

.navigation-admin-parent summary {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  cursor: pointer;
  list-style: none;
}

.navigation-admin-parent summary::-webkit-details-marker {
  display: none;
}

.navigation-admin-label span,
.navigation-admin-label small {
  display: block;
  color: var(--ink-soft);
  font-size: 11px;
}

.navigation-admin-label strong {
  display: block;
  margin: 1px 0;
  color: var(--ink);
  font-size: 14px;
}

.navigation-admin-caret::before {
  content: "\f105";
  color: var(--gold-dark);
  font-family: FontAwesome;
  font-size: 14px;
}

.navigation-admin-parent[open] .navigation-admin-caret::before {
  content: "\f107";
}

.navigation-submenu-note {
  margin: -2px 10px 8px 34px;
  color: var(--ink-soft);
  font-size: 12px;
  font-style: italic;
}

.navigation-admin-children {
  margin: 0 10px 8px 34px;
  border: 1px solid var(--line);
  border-radius: 6px;
  overflow: hidden;
  background: #fafafa;
}

.navigation-admin-child {
  padding: 7px 9px;
}

.admin-row-actions {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 8px;
}

.navigation-summary-actions {
  display: inline-flex;
  justify-content: flex-end;
}

.admin-row-actions form {
  margin: 0;
}

.icon-action {
  display: inline-grid;
  place-items: center;
  width: 32px;
  min-width: 32px;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--gold-dark);
  background: #fff;
  font-weight: 800;
}

.icon-action:hover,
.icon-action:focus {
  color: var(--navy);
  background: var(--cream);
}

.icon-action.danger {
  color: var(--red);
}

.icon-action.danger:hover,
.icon-action.danger:focus {
  color: #fff;
  background: var(--red);
}

.admin-row-actions .fa {
  margin-right: 0;
}

.inline-order-input {
  width: 86px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  font-weight: 800;
}

.compact-actions {
  margin-top: 16px;
}

.popular-edits {
  margin-top: 0;
}

.popular-edit-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.popular-edit-card {
  display: flex;
  flex-direction: column;
  min-height: 290px;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  color: var(--ink);
  box-shadow: 0 12px 30px rgba(17, 32, 45, 0.08);
}

.popular-edit-card-wrap {
  display: grid;
  gap: 10px;
}

.popular-edit-card:hover {
  border-color: rgba(217, 165, 20, 0.7);
  color: var(--ink);
  transform: translateY(-2px);
  box-shadow: var(--shadow);
}

.popular-edit-card img,
.popular-edit-icon {
  width: 100%;
  height: 150px;
  object-fit: cover;
  background: var(--navy);
}

.popular-edit-icon {
  display: grid;
  place-items: center;
  color: var(--gold);
  font-size: 54px;
}

.popular-edit-card span,
.popular-edit-card strong,
.popular-edit-card small {
  display: block;
}

.popular-edit-card span:not(.popular-edit-icon) {
  margin: 18px 20px 8px;
  color: var(--gold-dark);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.popular-edit-card strong {
  margin: 0 20px;
  color: var(--ink);
  font-size: 22px;
  line-height: 1.2;
}

.popular-edit-card small {
  margin: 12px 20px 22px;
  color: var(--ink-soft);
  line-height: 1.45;
}

.ministry-admin-layout {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.ministry-admin-main {
  min-width: 0;
}

.ministry-admin-menu {
  position: sticky;
  top: 104px;
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fffdf8;
  box-shadow: 0 18px 44px rgba(9, 30, 45, 0.08);
}

.ministry-admin-menu-heading,
.ministry-admin-menu a {
  display: flex;
  align-items: center;
  gap: 10px;
  border-radius: 6px;
}

.ministry-admin-menu-heading {
  padding: 10px 12px;
  color: var(--ink);
  font-weight: 900;
  text-transform: uppercase;
  font-size: 12px;
}

.ministry-admin-menu a {
  padding: 10px 12px;
  color: var(--ink);
  font-weight: 800;
}

.ministry-admin-menu a:hover,
.ministry-admin-menu a.active {
  color: var(--navy);
  background: rgba(225, 170, 0, 0.2);
}

.ministry-admin-menu .fa {
  width: 16px;
  color: var(--gold-dark);
  text-align: center;
}

.ministry-admin-cards {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 24px;
}

.ministry-admin-cards .popular-edit-card {
  grid-template-columns: 76px minmax(0, 1fr);
  min-height: 0;
  padding: 14px;
}

.ministry-admin-cards .popular-edit-card img {
  grid-row: span 3;
  width: 76px;
  height: 76px;
}

.ministry-admin-cards .popular-edit-card span,
.ministry-admin-cards .popular-edit-card strong,
.ministry-admin-cards .popular-edit-card small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ministry-admin-cards .popular-edit-card strong {
  font-size: 18px;
}

.popular-test-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.popular-test-actions form {
  margin: 0;
}

.admin-test-panel {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  margin-top: 18px;
}

.admin-test-panel h2 {
  margin: 0;
  font-size: 22px;
}

.admin-test-panel p {
  margin: 6px 0 0;
  color: var(--ink-soft);
}

.admin-shell {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}

.admin-menu-checkbox {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.admin-sidebar {
  position: sticky;
  top: 96px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(17, 32, 45, 0.08);
}

.admin-sidebar-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--line);
  padding: 14px 14px 12px;
}

.admin-sidebar-heading strong {
  color: var(--ink);
  font-size: 14px;
  text-transform: uppercase;
}

.admin-sidebar-heading label {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: 8px;
  cursor: pointer;
}

.admin-sidebar-heading label span {
  display: block;
  width: 16px;
  height: 2px;
  margin: 2px 0;
  background: var(--ink);
}

.admin-sidebar nav {
  display: grid;
  gap: 8px;
  padding: 10px;
}

.admin-section-tree details {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fffdf8;
}

.admin-section-tree summary {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  color: var(--ink);
  font-weight: 900;
  cursor: pointer;
  list-style: none;
}

.admin-section-tree summary::-webkit-details-marker {
  display: none;
}

.admin-section-tree summary::after {
  content: "\f105";
  margin-left: auto;
  color: var(--gold-dark);
  font-family: FontAwesome;
  font-weight: normal;
}

.admin-section-tree details[open] summary {
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.admin-section-tree details[open] summary::after {
  content: "\f107";
}

.admin-section-tree summary .fa,
.admin-sidebar nav a {
  display: flex;
  align-items: center;
}

.admin-section-tree summary .fa {
  justify-content: center;
  width: 18px;
  color: var(--gold-dark);
}

.admin-section-tree details > div {
  display: grid;
  gap: 2px;
  padding: 8px;
}

.admin-sidebar nav a {
  gap: 10px;
  border-radius: 8px;
  padding: 9px 10px 9px 30px;
  color: var(--ink-soft);
  font-weight: 800;
  text-transform: capitalize;
  line-height: 1.25;
}

.admin-sidebar nav a .fa {
  width: 18px;
  color: var(--gold-dark);
  text-align: center;
}

.admin-sidebar nav a:hover,
.admin-sidebar nav a:focus {
  color: var(--navy);
  background: var(--cream);
}

.admin-menu-checkbox:checked ~ .admin-sidebar {
  width: 64px;
}

.admin-menu-checkbox:checked ~ .admin-sidebar .admin-sidebar-heading {
  justify-content: center;
  padding-inline: 10px;
}

.admin-menu-checkbox:checked ~ .admin-sidebar .admin-sidebar-heading strong,
.admin-menu-checkbox:checked ~ .admin-sidebar nav a span,
.admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree summary span,
.admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree summary::after,
.admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree details > div {
  display: none;
}

.admin-menu-checkbox:checked ~ .admin-sidebar nav {
  display: grid;
  justify-items: center;
  padding: 10px 8px;
}

.admin-menu-checkbox:checked ~ .admin-sidebar nav a {
  justify-content: center;
  width: 42px;
  height: 42px;
  padding: 0;
}

.admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree details {
  border: 0;
  background: transparent;
}

.admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree details[open] summary {
  border-bottom: 0;
  background: transparent;
}

.admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree summary {
  justify-content: center;
  width: 42px;
  height: 42px;
  padding: 0;
  border-radius: 8px;
}

.admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree summary:hover,
.admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree summary:focus {
  background: var(--cream);
}

.admin-menu-checkbox:checked ~ .admin-content-panel {
  margin-left: -156px;
}

.admin-form {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 24px;
  background: #fff;
  box-shadow: var(--shadow);
}

.admin-collapsible {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow);
  margin-bottom: 24px;
}

.admin-collapsible > summary {
  list-style: none;
  cursor: pointer;
  padding: 16px 56px 16px 24px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  position: relative;
}

.admin-collapsible > summary::-webkit-details-marker {
  display: none;
}

.admin-collapsible > summary::after {
  content: "\f107";
  font-family: FontAwesome;
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
  transition: transform 0.15s ease;
  color: var(--navy);
}

.admin-collapsible[open] > summary::after {
  transform: translateY(-50%) rotate(180deg);
}

.admin-collapsible-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--navy);
}

.admin-collapsible-hint {
  font-size: 0.85rem;
  color: #555;
}

.admin-collapsible[open] > summary {
  border-bottom: 1px solid var(--line);
}

.admin-collapsible-body {
  border: none;
  border-radius: 0 0 8px 8px;
  box-shadow: none;
}

.bulletin-archive {
  margin-top: 16px;
}

.bulletin-archive-controls {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  margin-bottom: 16px;
  box-shadow: var(--shadow);
}

.bulletin-nav-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--navy);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.bulletin-nav-btn:hover:not(:disabled) {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--navy);
}

.bulletin-nav-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.bulletin-current-month {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--navy);
  min-width: 160px;
  text-align: center;
}

.bulletin-archive-counter {
  margin-left: auto;
  font-size: 0.85rem;
  color: #555;
}

.image-picker-section {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 18px 20px;
  margin-top: 16px;
  box-shadow: var(--shadow);
}

.image-picker-section h2 {
  margin: 0 0 6px;
  font-size: 1.1rem;
}

.image-picker-section > p {
  margin: 0 0 14px;
  color: #555;
  font-size: 0.9rem;
}

.image-picker-current {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  margin: 0 0 14px;
}

.image-picker-current > span {
  font-size: 0.85rem;
  font-weight: 600;
  color: #444;
}

.image-picker-current img {
  display: block;
  max-width: 100%;
  max-height: 240px;
  width: auto;
  height: auto;
  object-fit: contain;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.image-picker-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 12px;
  max-height: 480px;
  overflow-y: auto;
  padding: 6px;
  background: #f8f9fa;
  border-radius: 6px;
}

.image-picker-item {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 6px;
  border: 2px solid transparent;
  border-radius: 6px;
  cursor: pointer;
  background: #fff;
  transition: border-color 0.15s ease, transform 0.1s ease;
}

.image-picker-item:hover {
  border-color: var(--gold);
}

.image-picker-item.selected {
  border-color: var(--navy);
  background: rgba(217, 165, 20, 0.08);
}

.image-picker-item input[type="radio"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.image-picker-thumb {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 4px;
  background: #eee;
}

.image-picker-thumb-none {
  display: grid;
  place-items: center;
  color: #888;
  font-size: 1.4rem;
}

.image-picker-thumb-none small {
  display: block;
  font-size: 0.75rem;
  margin-top: 4px;
  color: #555;
}

.image-picker-item small {
  font-size: 0.78rem;
  color: #444;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.image-picker-upload {
  margin-top: 14px;
  padding: 10px 12px;
  border: 1px dashed var(--line);
  border-radius: 6px;
}

.image-picker-upload > summary {
  cursor: pointer;
  font-weight: 600;
  color: var(--navy);
}

.image-picker-upload > label {
  display: block;
  margin-top: 12px;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 22px;
}

.form-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.form-grid.single {
  grid-template-columns: 1fr;
  gap: 20px;
}

.weekly-reflection-paste,
.weekly-reflection-paste label,
.weekly-reflection-paste textarea {
  width: 100%;
}

.admin-form-topline {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) auto;
  align-items: start;
  gap: 18px;
  margin-bottom: 22px;
}

.admin-form-topline .admin-actions-top {
  justify-content: flex-end;
  margin-bottom: 0;
  padding-top: 26px;
}

.admin-form label {
  color: var(--ink);
  font-weight: 800;
}

.admin-form input,
.admin-form textarea {
  margin-top: 8px;
}

.admin-form small,
.admin-form .field-guidance {
  display: block;
  margin-top: 6px;
  color: var(--ink-soft);
  font-size: 13px;
  font-style: italic;
  font-weight: 400;
  line-height: 1.4;
}

.checkbox-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 32px;
}

.checkbox-row input {
  margin-top: 0;
  width: 18px;
  height: 18px;
}

.admin-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.admin-actions-top {
  margin-bottom: 28px;
}

.admin-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

.admin-form-message {
  margin: -8px 0 18px;
  font-weight: 800;
}

.rich-text-wrapper {
  margin-top: 8px;
  border: 1px solid #ced4da;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}

.rich-text-wrapper:focus-within {
  border-color: var(--gold-dark);
  box-shadow: 0 0 0 0.2rem rgba(217, 165, 20, 0.18);
}

.media-gallery-section {
  padding-top: 72px;
}

.media-gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.media-gallery-item {
  position: relative;
  display: block;
  min-height: 260px;
  overflow: hidden;
  border-radius: 8px;
  background: var(--navy);
  color: #fff;
}

.media-gallery-item img {
  width: 100%;
  height: 100%;
  min-height: 260px;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform 700ms ease, opacity 700ms ease;
}

.media-gallery-item:hover img,
.media-gallery-item:focus-visible img {
  transform: scale(1.05);
  opacity: 0.82;
}

.media-gallery-item span {
  position: absolute;
  right: 18px;
  bottom: 18px;
  left: 18px;
  padding: 12px 14px;
  border-left: 4px solid var(--gold);
  background: rgba(7, 30, 45, 0.82);
  color: #fff;
  font-weight: 900;
}

.rich-text-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  border-bottom: 1px solid var(--line);
  padding: 8px;
  background: #faf6ef;
}

.rich-text-toolbar-group {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding-right: 8px;
  margin-right: 4px;
  border-right: 1px solid rgba(0, 0, 0, 0.12);
}

.rich-text-toolbar-group:last-of-type {
  /* keep divider — utility buttons (link/image/eraser/format/source) follow */
}

.rich-text-button {
  display: inline-grid;
  place-items: center;
  min-width: 34px;
  height: 32px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  background: #fff;
  font-weight: 900;
}

.rich-text-button:hover,
.rich-text-button:focus,
.rich-text-button.is-active {
  color: var(--navy);
  background: var(--cream);
}

.rich-text-editor {
  min-height: 150px;
  padding: 12px;
  color: var(--ink);
  background: #fff;
  caret-color: var(--navy);
  font-weight: 400;
  outline: none;
  line-height: 1.55;
}

.rich-text-editor:focus {
  box-shadow: inset 0 0 0 2px rgba(217, 165, 20, 0.22);
}

.rich-text-editor ul,
.rich-text-editor ol {
  margin: 0 0 0 22px;
}

.rich-text-editor li {
  list-style: inherit;
}

.visually-hidden-editor-source {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.rich-text-wrapper.is-source-mode .rich-text-editor {
  display: none;
}

.rich-text-wrapper.is-source-mode .visually-hidden-editor-source {
  position: static;
  display: block;
  width: 100%;
  min-height: 220px;
  height: auto;
  border: 0;
  border-radius: 0;
  padding: 12px;
  opacity: 1;
  pointer-events: auto;
  color: var(--ink);
  background: #fff;
  caret-color: var(--navy);
  font-family: Consolas, "Courier New", monospace;
  font-size: 0.95rem;
  line-height: 1.55;
  resize: vertical;
  outline: none;
}

.rich-text-wrapper.is-source-mode .visually-hidden-editor-source:focus {
  box-shadow: inset 0 0 0 2px rgba(217, 165, 20, 0.22);
}

.image-picker-overlay {
  position: fixed;
  inset: 0;
  z-index: 1080;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(7, 30, 45, 0.55);
}

.image-picker-overlay.is-open {
  display: flex;
}

body.image-picker-open {
  overflow: hidden;
}

.image-picker-dialog {
  display: flex;
  flex-direction: column;
  width: min(1080px, 100%);
  max-height: calc(100vh - 48px);
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 24px 48px rgba(7, 30, 45, 0.32);
  outline: none;
  overflow: hidden;
}

.image-picker-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--line);
  background: #faf6ef;
}

.image-picker-header h2 {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--navy);
}

.image-picker-close {
  width: 36px;
  height: 36px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  font-size: 1.6rem;
  line-height: 1;
  color: var(--ink);
  cursor: pointer;
}

.image-picker-close:hover,
.image-picker-close:focus {
  border-color: var(--line);
  background: #fff;
}

.image-picker-tabs {
  display: flex;
  gap: 4px;
  padding: 8px 16px 0;
  border-bottom: 1px solid var(--line);
  background: #faf6ef;
}

.image-picker-tab {
  padding: 8px 14px;
  border: 1px solid transparent;
  border-bottom: none;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  background: transparent;
  color: var(--ink);
  font-weight: 700;
  cursor: pointer;
}

.image-picker-tab.is-active {
  background: #fff;
  border-color: var(--line);
  color: var(--navy);
}

.image-picker-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.image-picker-panel {
  display: none;
  flex: 1;
  min-height: 0;
  flex-direction: column;
}

.image-picker-panel.is-active {
  display: flex;
}

.image-picker-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  padding: 14px 20px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.image-picker-search {
  flex: 1 1 240px;
  min-width: 220px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 0.95rem;
}

.image-picker-search:focus {
  outline: none;
  border-color: var(--gold-dark);
  box-shadow: 0 0 0 0.15rem rgba(217, 165, 20, 0.18);
}

.image-picker-toolbar-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.image-picker-content {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  overflow: hidden;
}

.image-picker-grid {
  overflow-y: auto;
  padding: 16px 20px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 12px;
  align-content: start;
}

.image-picker-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.image-picker-card:hover,
.image-picker-card:focus {
  border-color: var(--gold-dark);
  box-shadow: 0 6px 16px rgba(7, 30, 45, 0.08);
}

.image-picker-card.is-active {
  border-color: var(--gold-dark);
  box-shadow: 0 0 0 2px rgba(217, 165, 20, 0.35);
}

.image-picker-card-thumb {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 8px;
  overflow: hidden;
  background: #f3ece0;
}

.image-picker-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.image-picker-card-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.image-picker-card-meta strong {
  font-size: 0.92rem;
  color: var(--navy);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.image-picker-card-meta small {
  font-size: 0.76rem;
  color: #6b6356;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: Consolas, "Courier New", monospace;
}

.image-picker-empty {
  grid-column: 1 / -1;
  padding: 24px;
  text-align: center;
  color: #6b6356;
  font-style: italic;
}

.image-picker-detail {
  border-left: 1px solid var(--line);
  padding: 16px 20px;
  background: #faf6ef;
  overflow-y: auto;
}

.image-picker-detail-empty {
  color: #6b6356;
  font-style: italic;
}

.image-picker-detail-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.image-picker-detail-thumb {
  width: 100%;
  aspect-ratio: 4 / 3;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--line);
}

.image-picker-detail-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.image-picker-detail-title {
  font-size: 1rem;
  color: var(--navy);
  word-break: break-word;
}

.image-picker-detail-path {
  display: block;
  padding: 6px 8px;
  border-radius: 6px;
  background: #fff;
  border: 1px solid var(--line);
  font-family: Consolas, "Courier New", monospace;
  font-size: 0.82rem;
  color: var(--ink);
  word-break: break-all;
}

.image-picker-detail-alt,
.image-picker-url-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-weight: 700;
  color: var(--navy);
}

.image-picker-detail-alt input,
.image-picker-url-field input {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font: inherit;
  font-weight: 400;
  color: var(--ink);
  background: #fff;
}

.image-picker-detail-alt input:focus,
.image-picker-url-field input:focus {
  outline: none;
  border-color: var(--gold-dark);
  box-shadow: 0 0 0 0.15rem rgba(217, 165, 20, 0.18);
}

.image-picker-panel-url {
  padding: 20px;
  gap: 16px;
}

.image-picker-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 20px;
  border-top: 1px solid var(--line);
  background: #faf6ef;
}

.image-picker-status {
  color: #6b6356;
  font-size: 0.88rem;
}

.image-picker-footer-actions {
  display: flex;
  gap: 8px;
}

@media (max-width: 768px) {
  .image-picker-content {
    grid-template-columns: 1fr;
  }

  .image-picker-detail {
    border-left: none;
    border-top: 1px solid var(--line);
  }
}

.rich-sizing-controls {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.rich-sizing-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.rich-sizing-label {
  min-width: 48px;
  font-size: 0.78rem;
  font-weight: 800;
  color: var(--navy);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.rich-sizing-buttons {
  display: inline-flex;
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}

.rich-size-button,
.rich-align-button {
  padding: 6px 10px;
  border: 0;
  border-right: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  font-weight: 700;
  font-size: 0.85rem;
  cursor: pointer;
  min-width: 44px;
}

.rich-sizing-buttons > button:last-child {
  border-right: 0;
}

.rich-size-button:hover,
.rich-align-button:hover,
.rich-size-button:focus,
.rich-align-button:focus {
  background: var(--cream);
  color: var(--navy);
}

.rich-size-button.is-active,
.rich-align-button.is-active {
  background: var(--gold-dark);
  color: #fff;
}

.rich-sizing-custom {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.85rem;
  color: var(--ink);
}

.rich-sizing-custom input {
  width: 64px;
  padding: 4px 6px;
  border: 1px solid var(--line);
  border-radius: 6px;
  font: inherit;
  text-align: right;
}

.rich-sizing-custom input:focus {
  outline: none;
  border-color: var(--gold-dark);
  box-shadow: 0 0 0 0.12rem rgba(217, 165, 20, 0.18);
}

.rich-image-toolbar {
  position: fixed;
  top: -9999px;
  left: -9999px;
  z-index: 1090;
  display: none;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  box-shadow: 0 12px 30px rgba(7, 30, 45, 0.18);
  font-size: 0.85rem;
}

.rich-image-toolbar.is-open {
  display: inline-flex;
  flex-wrap: wrap;
  max-width: calc(100vw - 16px);
}

.rich-image-toolbar .rich-sizing-controls {
  border: 0;
  padding: 0;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 6px 12px;
}

.rich-image-toolbar .rich-sizing-label {
  min-width: 0;
}

.rich-image-toolbar-alt {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--navy);
}

.rich-image-toolbar-alt input {
  width: 200px;
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  font: inherit;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  color: var(--ink);
}

.rich-image-toolbar-alt input:focus {
  outline: none;
  border-color: var(--gold-dark);
  box-shadow: 0 0 0 0.12rem rgba(217, 165, 20, 0.18);
}

.rich-image-toolbar-remove {
  padding: 6px 10px;
  border: 1px solid #d8b6b6;
  border-radius: 8px;
  background: #fff5f5;
  color: #a13030;
  font-weight: 700;
  cursor: pointer;
}

.rich-image-toolbar-remove:hover,
.rich-image-toolbar-remove:focus {
  background: #fde8e8;
  border-color: #a13030;
}

.image-upload-panel {
  display: grid;
  grid-template-columns: 1fr 180px 1.2fr;
  gap: 18px;
  align-items: center;
  margin: 6px 0 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  background: #faf6ef;
}

.hero-weekly-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  align-items: stretch;
  margin: 6px 0 24px;
}

.hero-weekly-pair > .image-upload-panel {
  margin: 0;
  grid-template-columns: 1fr 140px 1fr;
}

@media (max-width: 900px) {
  .hero-weekly-pair {
    grid-template-columns: 1fr;
  }
}

.parish-photo-progress {
  margin: 0 0 24px;
  padding: 14px 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #faf6ef;
}

.parish-photo-progress-status {
  font-weight: 600;
  margin-bottom: 10px;
}

.parish-photo-progress-bar {
  width: 100%;
  height: 8px;
  background: rgba(0, 0, 0, 0.08);
  border-radius: 4px;
  overflow: hidden;
}

.parish-photo-progress-fill {
  height: 100%;
  width: 0%;
  background: var(--gold, #d9a514);
  transition: width 200ms ease;
}

.parish-photo-progress-list {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  max-height: 200px;
  overflow-y: auto;
  font-size: 0.9rem;
}

.parish-photo-progress-list li {
  padding: 4px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.parish-photo-progress-list li.is-ok {
  color: #2e7a32;
}

.parish-photo-progress-list li.is-error {
  color: #b3261e;
}

.image-upload-panel span,
.image-upload-panel code,
.image-upload-panel small {
  display: block;
}

.image-upload-panel span {
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.image-upload-panel code {
  margin-top: 6px;
  white-space: normal;
}

.image-upload-panel img {
  width: 100%;
  max-height: 160px;
  border-radius: 8px;
  object-fit: contain;
  background: var(--navy);
}

.image-upload-panel small {
  margin-top: 8px;
  color: var(--ink-soft);
  font-style: italic;
  font-weight: 400;
}

.image-preview-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 120px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  color: var(--ink-soft);
  background: #f7f1e6;
  font-weight: 800;
}

.file-preview-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 120px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  color: var(--red);
  background: #fff7f2;
  font-weight: 800;
  text-align: center;
}

.file-preview-placeholder:hover {
  color: var(--red);
  border-color: var(--red);
}

.file-preview-placeholder .fa {
  font-size: 28px;
}

/* Tablet / small-laptop widths: keep the public top-nav inline and compact so
   the busy header doesn't squeeze each link into a clumsy icon-over-text stack. */
@media (min-width: 992px) and (max-width: 1399.98px) {
  .parish-nav .navbar-nav .nav-link { padding: 8px 10px; font-size: 13.5px; }
  .parish-nav .nav-link .fa { margin-right: 5px; }
  .parish-nav .navbar-nav { gap: 2px; }
}

@media (max-width: 991px) {
  .nav-shell {
    padding: 12px 20px;
  }

  .navbar-collapse {
    padding-top: 14px;
  }

  .nav-give-btn {
    margin-top: 10px;
  }

  .nav-actions {
    align-items: flex-start;
    flex-direction: column;
  }

  .hero-section {
    grid-template-columns: 1fr;
  }

  .hero-media {
    min-height: 520px;
  }

  .link-grid,
  .media-grid,
  .media-gallery-grid,
  .contact-grid,
  .downloads-grid,
  .schedule-grid,
  .news-layout,
  .admin-shell,
  .footer-grid,
  .form-grid,
  .form-grid.two {
    grid-template-columns: 1fr 1fr;
  }

  .news-layout > div:first-child,
  .feature-card.large-card {
    grid-column: 1 / -1;
  }

  .content-hero {
    grid-template-columns: 1fr;
  }

  .compact-content-hero {
    padding-block: 52px;
  }

  .about-page-section {
    grid-template-columns: 1fr;
  }

  .ministries-hero,
  .ministries-home-layout,
  .ministries-grid,
  .ministry-admin-layout,
  .ministry-template-grid {
    grid-template-columns: 1fr;
  }

  .ministry-admin-menu {
    position: static;
    grid-auto-flow: column;
    grid-auto-columns: minmax(180px, max-content);
    overflow-x: auto;
    scroll-snap-type: x proximity;
  }

  .ministry-admin-menu-heading,
  .ministry-admin-menu a {
    scroll-snap-align: start;
    white-space: nowrap;
  }

  .ministry-admin-cards {
    grid-template-columns: 1fr;
  }

  .ministries-hero-mark {
    justify-self: start;
    width: 180px;
  }

  .ministries-next-panel {
    position: static;
  }

  .about-page-nav {
    position: static;
  }

  .online-mass-panel {
    grid-template-columns: 1fr;
  }

  .online-mass-links {
    justify-content: flex-start;
  }
}

@media (max-width: 640px) {
  .contact-field-row.two-columns,
  .contact-form label {
    grid-template-columns: 1fr;
  }

  .downloads-grid,
  .download-card {
    grid-template-columns: 1fr;
  }

  .download-card-icon {
    width: 52px;
    height: 52px;
  }

  body.theme-pentecost .weekly-verse,
  body.theme-christmas-day .weekly-verse,
  body.theme-easter-day .weekly-verse,
  body.theme-all-saints-day .weekly-verse,
  body.theme-immaculate-conception .weekly-verse,
  body.theme-assumption .weekly-verse {
    padding-right: 26px;
  }

  body.theme-pentecost .weekly-verse::after,
  body.theme-christmas-day .weekly-verse::after,
  body.theme-easter-day .weekly-verse::after,
  body.theme-all-saints-day .weekly-verse::after,
  body.theme-immaculate-conception .weekly-verse::after,
  body.theme-assumption .weekly-verse::after {
    display: none;
  }

  body.theme-pentecost .hero-section::after,
  body.theme-christmas-day .hero-section::after,
  body.theme-easter-day .hero-section::after,
  body.theme-all-saints-day .hero-section::after,
  body.theme-immaculate-conception .hero-section::after,
  body.theme-assumption .hero-section::after {
    top: 88px;
    right: 18px;
    width: 140px;
    min-width: 0;
    opacity: 0.1;
  }

  body.admin-body {
    overflow-x: hidden;
  }

  .admin-body .site-header {
    position: sticky;
  }

  .admin-body .nav-shell {
    padding: 10px 14px;
  }

  .admin-body .brand-logo {
    width: 48px;
    height: 44px;
  }

  .admin-body .brand-name {
    font-size: 16px;
  }

  .admin-body .brand-subtitle {
    font-size: 12px;
  }

  .admin-page {
    width: min(100% - 28px, 1180px);
    padding: 28px 0 52px;
  }

  .admin-header {
    gap: 14px;
    margin-bottom: 20px;
  }

  .admin-header h1 {
    font-size: clamp(30px, 10vw, 42px);
    line-height: 1.05;
  }

  .admin-header p:not(.eyebrow) {
    font-size: 16px;
    line-height: 1.5;
  }

  .admin-shell {
    display: block;
  }

  .admin-sidebar {
    position: static;
    margin-bottom: 18px;
    overflow: hidden;
  }

  .admin-sidebar-heading {
    padding: 12px;
  }

  .admin-sidebar nav {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 10px 12px 14px;
    scroll-snap-type: x proximity;
  }

  .admin-section-tree details {
    flex: 0 0 220px;
    scroll-snap-align: start;
  }

  .admin-section-tree details > div {
    max-height: 220px;
    overflow-y: auto;
  }

  .admin-sidebar nav a {
    min-width: 0;
    border: 0;
    background: transparent;
    line-height: 1.25;
  }

  .admin-menu-checkbox:checked ~ .admin-sidebar {
    width: auto;
  }

  .admin-menu-checkbox:checked ~ .admin-sidebar .admin-sidebar-heading {
    justify-content: space-between;
    padding-inline: 12px;
  }

  .admin-menu-checkbox:checked ~ .admin-sidebar .admin-sidebar-heading strong,
  .admin-menu-checkbox:checked ~ .admin-sidebar nav a span,
  .admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree summary span {
    display: inline;
  }

  .admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree summary::after {
    display: inline;
  }

  .admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree details > div {
    display: grid;
  }

  .admin-menu-checkbox:checked ~ .admin-sidebar nav {
    display: flex;
    justify-items: initial;
    padding: 10px 12px 14px;
  }

  .admin-menu-checkbox:checked ~ .admin-sidebar nav a {
    justify-content: flex-start;
    width: auto;
    height: auto;
    padding: 9px 10px 9px 30px;
  }

  .admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree details {
    border: 1px solid var(--line);
    background: #fffdf8;
  }

  .admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree details[open] summary {
    border-bottom: 1px solid var(--line);
    background: #fff;
  }

  .admin-menu-checkbox:checked ~ .admin-sidebar .admin-section-tree summary {
    justify-content: flex-start;
    width: auto;
    height: auto;
    padding: 11px 12px;
  }

  .admin-menu-checkbox:checked ~ .admin-content-panel {
    margin-left: 0;
  }

  .admin-content-panel {
    min-width: 0;
  }

  .admin-section {
    margin-top: 22px;
    scroll-margin-top: 86px;
  }

  .admin-section h2 {
    font-size: 22px;
    line-height: 1.2;
  }

  .admin-table-wrap {
    box-shadow: 0 8px 22px rgba(17, 32, 45, 0.08);
  }

  .admin-table {
    min-width: 680px;
  }

  .admin-table th,
  .admin-table td {
    padding: 12px;
  }

  .navigation-admin-map {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .navigation-admin-card-heading {
    padding: 12px;
  }

  .navigation-admin-card-heading h3 {
    font-size: 16px;
  }

  .navigation-admin-item,
  .navigation-admin-parent summary {
    padding: 10px 12px;
  }

  .navigation-admin-parent summary,
  .navigation-admin-item {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .navigation-admin-caret {
    display: none;
  }

  .navigation-submenu-note {
    margin: -2px 12px 8px;
  }

  .navigation-admin-children {
    margin: 0 12px 10px;
  }

  .popular-edit-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .popular-edit-card strong {
    font-size: 19px;
    line-height: 1.2;
  }

  .admin-form {
    padding: 18px;
  }

  .image-upload-panel {
    gap: 14px;
    padding: 14px;
  }

  .parish-brand {
    max-width: 250px;
  }

  .brand-name {
    font-size: 16px;
  }

  .brand-logo {
    width: 54px;
    height: 48px;
  }

  .hero-copy {
    padding: 44px 24px;
  }

  .hero-actions {
    flex-wrap: nowrap;
    gap: 10px;
    margin-top: 28px;
  }

  .hero-actions .btn {
    flex: 1 1 0;
    min-width: 0;
    padding-inline: 12px;
    white-space: nowrap;
  }

  .weekly-verse,
  .link-grid,
  .media-grid,
  .media-gallery-grid,
  .schedule-grid,
  .news-layout,
  .news-page-list,
  .footer-grid {
    grid-template-columns: 1fr;
  }

  .news-cards {
    display: block;
  }

  .about-page-content {
    border-left: 0;
    padding-left: 0;
  }

  .news-cards article,
  .news-card-link {
    width: 100%;
    min-height: 0;
  }

  .news-cards article + article,
  .news-cards article + .news-card-link,
  .news-card-link + article,
  .news-card-link + .news-card-link {
    margin-top: 16px;
  }

  .hero-media {
    min-height: 340px;
  }

  .weekly-feature {
    justify-content: center;
  }

  .floating-note {
    right: 20px;
    bottom: 20px;
    left: 20px;
    max-width: none;
  }

  .section-shell {
    width: min(100% - 28px, 1160px);
    padding: 60px 0;
  }

  .ticker-track {
    animation-duration: 125s;
  }

  .ticker-track span {
    padding: 15px 22px;
    font-size: 13px;
  }

  .pastor-card,
  .admin-header,
  .footer-bottom {
    align-items: flex-start;
    flex-direction: column;
  }

  .admin-header-actions {
    justify-content: flex-start;
  }

  .admin-section-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .admin-test-panel {
    align-items: flex-start;
    flex-direction: column;
  }

  .form-grid,
  .form-grid.two,
  .admin-form-topline,
  .image-upload-panel,
  .popular-edit-grid {
    grid-template-columns: 1fr;
  }

  .admin-form-topline .admin-actions-top {
    justify-content: flex-start;
    padding-top: 0;
  }

  .admin-sidebar {
    position: static;
  }

  .admin-menu-checkbox:checked ~ .admin-sidebar {
    width: auto;
  }

  .admin-menu-checkbox:checked ~ .admin-content-panel {
    margin-left: 0;
  }
}

@media (max-width: 640px) {
  .admin-body .admin-mobile-only {
    display: list-item;
  }

  .admin-body .navbar-collapse {
    max-height: calc(100vh - 78px);
    overflow-y: auto;
    padding-top: 12px;
  }

  .admin-body .admin-nav-links {
    gap: 6px;
  }

  .admin-body .admin-nav-links .nav-link {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 11px 12px;
  }

  .admin-body .nav-actions {
    margin-top: 10px;
  }

  .admin-body .admin-sidebar,
  .admin-body .admin-menu-checkbox:checked ~ .admin-sidebar {
    display: none;
  }

  .admin-body .admin-menu-checkbox:checked ~ .admin-content-panel {
    margin-left: 0;
  }
}

@media (max-width: 991.98px) {
  /* Admin top-bar actions: lay the icon buttons out in a wrapping row instead
     of one-per-line (which wasted vertical space). The search box keeps its
     own full-width line; everything after it flows side by side. */
  .admin-body .nav-actions {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
  }

  .admin-body .nav-actions .admin-global-search {
    flex: 1 1 100%;
  }
}

.admin-login-page {
  min-height: calc(100vh - 120px);
  display: grid;
  place-items: center;
}

.admin-login-card,
.assignment-panel,
.admin-empty-state {
  background: #fff;
  border: 1px solid rgba(176, 132, 18, 0.22);
  border-radius: 8px;
  box-shadow: 0 20px 45px rgba(3, 23, 36, 0.08);
  padding: 28px;
}

.admin-login-card {
  width: min(560px, 100%);
}

.admin-login-form {
  border: 0;
  box-shadow: none;
  padding: 0;
}

.admin-login-brand {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 22px;
}

.admin-login-brand img {
  width: 54px;
  height: 54px;
  object-fit: contain;
}

.admin-login-form label {
  display: block;
}

.admin-login-form input {
  width: 100%;
  min-height: 52px;
  border: 1px solid rgba(3, 23, 36, 0.18);
  border-radius: 8px;
  padding: 12px 14px;
  background: #fbfaf7;
  font-size: 1rem;
}

.admin-login-form input:focus {
  border-color: #d9a200;
  box-shadow: 0 0 0 4px rgba(217, 162, 0, 0.14);
  outline: 0;
}

.admin-logout-form {
  display: inline-flex;
  margin: 0;
}

.admin-assignment-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
  gap: 18px;
  margin-top: 22px;
}

.super-admin-note {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(217, 162, 0, 0.28);
  border-radius: 8px;
  background: rgba(217, 162, 0, 0.08);
  color: #4b3600;
  padding: 12px 14px;
  font-weight: 700;
}

.super-admin-note .fa {
  color: #b8860b;
}

.assignment-panel h2 {
  font-size: 1.25rem;
  margin-bottom: 6px;
}

.assignment-panel p {
  color: #51606a;
  margin-bottom: 18px;
}

.assignment-group {
  border-top: 1px solid rgba(176, 132, 18, 0.18);
  padding: 14px 0;
}

.assignment-group > strong {
  display: block;
  color: #9b6d00;
  margin-bottom: 8px;
  text-transform: uppercase;
  font-size: 0.78rem;
  letter-spacing: 0.04em;
}

.admin-check-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 8px 0;
  font-weight: 700;
}

.admin-check-row input {
  width: 18px;
  height: 18px;
  accent-color: #d9a200;
}

.all-access-row {
  border: 1px solid rgba(217, 162, 0, 0.32);
  border-radius: 8px;
  background: rgba(217, 162, 0, 0.08);
  padding: 12px;
}

.form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 34px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}

.admin-password-form {
  max-width: 720px;
}

.admin-password-target {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 22px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 16px;
}

.admin-password-target .fa {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: rgba(217, 162, 0, 0.14);
  color: var(--gold-dark);
  font-size: 22px;
}

.admin-password-target strong,
.admin-password-target span {
  display: block;
}

.admin-password-target span {
  color: var(--ink-soft);
  font-size: 0.92rem;
}

.liturgical-theme-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin-bottom: 22px;
}

.liturgical-theme-section {
  margin-bottom: 28px;
}

.liturgical-theme-section-heading {
  margin-bottom: 14px;
}

.liturgical-theme-section-heading h2 {
  margin: 0 0 4px;
  color: var(--navy);
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(1.45rem, 2vw, 2rem);
}

.liturgical-theme-section-heading p {
  margin: 0;
  color: var(--ink-soft);
}

.liturgical-theme-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 12px;
  align-items: start;
  min-height: 160px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 16px;
  cursor: pointer;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.liturgical-theme-card:hover,
.liturgical-theme-card.active {
  border-color: var(--gold);
  box-shadow: 0 14px 34px rgba(17, 32, 45, 0.12);
  transform: translateY(-2px);
}

.liturgical-theme-card input {
  margin-top: 4px;
  accent-color: var(--gold-dark);
}

.liturgical-theme-card strong,
.liturgical-theme-card small {
  grid-column: 2;
}

.liturgical-theme-card strong {
  color: var(--navy);
  font-size: 1.05rem;
}

.liturgical-theme-card small {
  color: var(--ink-soft);
  line-height: 1.45;
}

.liturgical-theme-swatch {
  grid-column: 1 / -1;
  display: block;
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 48px;
  border-radius: 7px;
  background: linear-gradient(135deg, #0c1b28 0 60%, #d9a514 60%);
}

.liturgical-theme-card.theme-pentecost .liturgical-theme-swatch::after,
.liturgical-theme-card.theme-christmas-day .liturgical-theme-swatch::after,
.liturgical-theme-card.theme-easter-day .liturgical-theme-swatch::after,
.liturgical-theme-card.theme-all-saints-day .liturgical-theme-swatch::after,
.liturgical-theme-card.theme-immaculate-conception .liturgical-theme-swatch::after,
.liturgical-theme-card.theme-assumption .liturgical-theme-swatch::after {
  content: "";
  position: absolute;
  right: 12px;
  top: 50%;
  width: 34px;
  height: 34px;
  background: var(--theme-swatch-icon) center / contain no-repeat;
  opacity: 0.72;
  transform: translateY(-50%);
}

.liturgical-theme-card.theme-advent .liturgical-theme-swatch {
  background: linear-gradient(135deg, #18213f 0 46%, #6d65d8 46% 72%, #c2b7ff 72%);
}

.liturgical-theme-card.theme-christmas .liturgical-theme-swatch {
  background: linear-gradient(135deg, #1f4f43 0 44%, #6fa46f 44% 70%, #e0bd55 70%);
}

.liturgical-theme-card.theme-lent .liturgical-theme-swatch {
  background: linear-gradient(135deg, #241a22 0 48%, #6b4a37 48% 72%, #b38f6a 72%);
}

.liturgical-theme-card.theme-holy-week .liturgical-theme-swatch {
  background: linear-gradient(135deg, #191820 0 48%, #71434f 48% 70%, #d5b16a 70%);
}

.liturgical-theme-card.theme-easter .liturgical-theme-swatch {
  background: linear-gradient(135deg, #102235 0 42%, #fff3c4 42% 68%, #f0c84b 68%);
}

.liturgical-theme-card.theme-pentecost .liturgical-theme-swatch {
  --theme-swatch-icon: var(--theme-icon-pentecost);
  background: repeating-linear-gradient(112deg, rgba(255, 202, 87, 0.32) 0 2px, transparent 2px 34px), linear-gradient(135deg, #23070a 0 42%, #c33a22 42% 68%, #ffca57 68%);
}

.liturgical-theme-card.theme-christmas-day .liturgical-theme-swatch {
  --theme-swatch-icon: var(--theme-icon-christmas-day);
  background: repeating-linear-gradient(90deg, rgba(246, 212, 106, 0.34) 0 2px, transparent 2px 34px), linear-gradient(135deg, #0e3b31 0 42%, #4d985c 42% 68%, #be3d3d 68%);
}

.liturgical-theme-card.theme-easter-day .liturgical-theme-swatch {
  --theme-swatch-icon: var(--theme-icon-easter-day);
  background: repeating-linear-gradient(118deg, rgba(255, 255, 255, 0.46) 0 2px, transparent 2px 36px), linear-gradient(135deg, #123661 0 42%, #2870a9 42% 68%, #ffdd70 68%);
}

.liturgical-theme-card.theme-all-saints-day .liturgical-theme-swatch {
  --theme-swatch-icon: var(--theme-icon-all-saints-day);
  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.35) 0 1px, transparent 1px 28px), linear-gradient(135deg, #111a2e 0 42%, #fffefa 42% 68%, #ead077 68%);
}

.liturgical-theme-card.theme-immaculate-conception .liturgical-theme-swatch {
  --theme-swatch-icon: var(--theme-icon-immaculate-conception);
  background: repeating-linear-gradient(120deg, rgba(255, 255, 255, 0.42) 0 2px, transparent 2px 34px), linear-gradient(135deg, #103c68 0 42%, #edf7ff 42% 68%, #dfc271 68%);
}

.liturgical-theme-card.theme-assumption .liturgical-theme-swatch {
  --theme-swatch-icon: var(--theme-icon-assumption);
  background: repeating-linear-gradient(150deg, rgba(255, 255, 255, 0.36) 0 2px, transparent 2px 36px), linear-gradient(135deg, #15365f 0 42%, #6aa8d1 42% 68%, #9f5a73 68%);
}

.liturgical-reminder-card,
.liturgical-dashboard-reminder {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 22px;
}

.liturgical-reminder-card {
  border: 1px solid var(--line);
  border-left: 5px solid var(--gold);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow);
  padding: 18px 20px;
}

.liturgical-reminder-card.needs-action {
  border-left-color: var(--red);
}

.liturgical-reminder-card h2 {
  margin: 4px 0 8px;
  color: var(--navy);
  font-family: Georgia, "Cambria", "Times New Roman", serif;
  font-size: clamp(28px, 4vw, 44px);
}

.liturgical-reminder-card p {
  margin: 4px 0;
}

.liturgical-reminder-label,
.liturgical-reminder-pill {
  color: var(--gold-dark);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.liturgical-reminder-pill {
  display: inline-flex;
  margin-left: 8px;
  border-radius: 999px;
  background: rgba(217, 162, 0, 0.14);
  padding: 4px 10px;
}

.liturgical-reminder-action {
  display: inline-flex;
  align-items: center;
  max-width: 360px;
  gap: 10px;
  color: var(--red);
  font-weight: 800;
}

.liturgical-reminder-action.ok {
  color: var(--green);
}

.liturgical-reminder-action .fa {
  font-size: 22px;
}

.admin-empty-state {
  text-align: center;
  max-width: 560px;
  margin: 56px auto;
}

.admin-empty-state .fa {
  color: #b8860b;
  font-size: 2.4rem;
  margin-bottom: 14px;
}

.admin-table .table-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}

.admin-table .table-actions form {
  display: inline-flex;
  margin: 0;
}

.admin-log-action {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  background: rgba(217, 162, 0, 0.12);
  color: #7a5700;
  font-weight: 800;
  padding: 5px 10px;
}

.admin-log-filter {
  display: flex;
  flex-direction: column;
  gap: 12px;
  border: 1px solid rgba(176, 132, 18, 0.22);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 16px 36px rgba(3, 23, 36, 0.07);
  padding: 16px;
  margin-bottom: 16px;
}

.admin-log-filter-row {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 12px;
  align-items: end;
}

.admin-log-filter-row + .admin-log-filter-row {
  grid-template-columns: 1fr 1fr 1fr auto;
}

.admin-log-filter label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.85rem;
  color: var(--ink-soft);
}

.admin-log-filter input,
.admin-log-filter select {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  font: inherit;
  color: var(--ink);
}

.admin-log-filter-actions {
  display: flex;
  gap: 8px;
  align-items: end;
  justify-content: flex-end;
}

.admin-log-summary {
  margin-bottom: 16px;
  color: var(--ink-soft);
  font-size: 0.9rem;
}

.admin-log-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 24px;
}

.admin-log-page-link {
  display: inline-grid;
  place-items: center;
  min-width: 36px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--ink);
  text-decoration: none;
  background: #fff;
}

.admin-log-page-link:hover,
.admin-log-page-link:focus {
  border-color: var(--gold);
  background: var(--cream);
}

.admin-log-page-link.active {
  border-color: var(--navy);
  background: var(--navy);
  color: #fff;
  font-weight: 700;
}

.admin-log-page-ellipsis {
  padding: 0 4px;
  color: var(--ink-soft);
}

.admin-log-pagination .btn.disabled {
  opacity: 0.4;
  pointer-events: none;
}

@media (max-width: 900px) {
  .admin-log-filter-row,
  .admin-log-filter-row + .admin-log-filter-row {
    grid-template-columns: 1fr 1fr;
  }
}

.admin-log-controls {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}

.admin-log-control-card {
  border: 1px solid rgba(176, 132, 18, 0.22);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 16px 36px rgba(3, 23, 36, 0.07);
  padding: 18px;
}

.admin-log-control-card h2 {
  font-size: 1.2rem;
  margin-bottom: 8px;
}

.admin-log-control-card p {
  color: #51606a;
}

.admin-log-control-card label {
  display: block;
  font-weight: 800;
  margin-bottom: 14px;
}

.admin-log-control-card input {
  width: 100%;
  margin-top: 8px;
}

.admin-log-control-card.danger {
  border-color: rgba(170, 28, 28, 0.24);
}

.admin-inline-upload-form {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(180px, 1fr) minmax(220px, 1.2fr) auto;
  gap: 14px;
  align-items: end;
  border: 1px solid rgba(176, 132, 18, 0.22);
  border-radius: 8px;
  background: #fff;
  padding: 18px;
  margin-bottom: 20px;
}

.admin-inline-upload-form label {
  display: block;
  font-weight: 800;
}

.admin-inline-upload-form input {
  width: 100%;
  margin-top: 8px;
}

.admin-image-library-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 16px;
}

.admin-image-library-card {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid rgba(176, 132, 18, 0.22);
  border-radius: 8px;
  background: #fff;
  padding: 12px;
}

.admin-image-library-card img {
  width: 84px;
  height: 72px;
  object-fit: cover;
  border-radius: 6px;
  background: #f7f1e7;
}

.admin-image-library-card strong,
.admin-image-library-card code,
.admin-image-library-card small {
  display: block;
}

.admin-image-library-card code {
  overflow-wrap: anywhere;
  color: #c00058;
  font-size: 0.78rem;
  margin-top: 4px;
}

.admin-image-library-grid-wide {
  grid-template-columns: 1fr;
}

.admin-library-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0 0 14px;
  color: var(--ink-soft);
}

.admin-library-toolbar p {
  margin: 0;
  font-weight: 800;
}

.admin-library-toolbar label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 900;
}

.admin-library-toolbar select {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 28px 8px 10px;
  background: #fff;
}

.admin-image-library-compact-grid {
  grid-template-columns: repeat(auto-fill, minmax(min(190px, 100%), 1fr));
  gap: 12px;
}

.admin-image-library-card-wide {
  grid-template-columns: 112px minmax(180px, 1fr) minmax(180px, 0.9fr) auto;
}

.admin-image-library-card-wide img {
  width: 112px;
  height: 86px;
}

.admin-image-library-card-compact {
  position: relative;
  grid-template-columns: 1fr;
  align-items: start;
  gap: 8px;
  padding: 8px;
}

.admin-image-library-card-compact img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  border-radius: 6px;
  object-fit: contain;
  background: #f7f1e7;
}

.admin-image-library-card-compact strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 0.95rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-image-library-card-compact small {
  overflow: hidden;
  color: var(--ink-soft);
  font-size: 0.76rem;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-image-library-card-compact .admin-image-usage {
  display: grid;
  align-items: start;
  gap: 6px;
  min-height: 30px;
  max-width: 100%;
}

.admin-image-library-card-compact .admin-image-usage details {
  margin-top: 0;
  max-width: 100%;
}

.admin-image-library-card-compact .admin-image-usage summary {
  display: inline-flex;
  max-width: 100%;
  color: var(--gold-dark);
  font-size: 0.8rem;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.admin-image-library-card-compact .admin-image-usage ul {
  max-height: 120px;
  overflow: auto;
}

.admin-image-library-card-compact form {
  position: absolute;
  top: 12px;
  right: 12px;
}

.admin-image-library-card-compact .usage-pill {
  width: fit-content;
  max-width: 100%;
  line-height: 1.2;
}

.admin-image-usage {
  font-size: 0.9rem;
}

.usage-pill {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  font-weight: 800;
  padding: 5px 10px;
}

.usage-pill.used {
  background: rgba(37, 125, 66, 0.12);
  color: #1f6f3b;
}

.usage-pill.unused {
  background: rgba(170, 28, 28, 0.1);
  color: #9c1c1c;
}

.admin-image-usage details {
  margin-top: 8px;
}

.admin-image-usage summary {
  color: #9b6d00;
  cursor: pointer;
  font-weight: 800;
}

.admin-image-usage ul {
  margin: 8px 0 0;
  padding-left: 18px;
}

.admin-pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 24px 0 0;
}

.admin-pagination a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 12px;
  background: #fff;
  color: var(--ink);
  font-weight: 900;
  text-decoration: none;
}

.admin-pagination a:hover,
.admin-pagination a:focus-visible,
.admin-pagination a.active {
  border-color: var(--gold);
  background: var(--gold);
  color: var(--navy);
}

.admin-pagination a.disabled {
  pointer-events: none;
  opacity: 0.45;
}

.admin-log-details summary {
  color: #b8860b;
  cursor: pointer;
  font-weight: 800;
}

.admin-log-details pre {
  max-width: 520px;
  max-height: 220px;
  overflow: auto;
  margin-top: 8px;
  border: 1px solid rgba(176, 132, 18, 0.22);
  border-radius: 8px;
  background: #fbfaf7;
  color: #123;
  padding: 12px;
  white-space: pre-wrap;
}

@media (max-width: 820px) {
  .admin-assignment-grid {
    grid-template-columns: 1fr;
  }

  .admin-log-controls {
    grid-template-columns: 1fr;
  }

  .admin-inline-upload-form {
    grid-template-columns: 1fr;
  }

  .admin-image-library-card-wide {
    grid-template-columns: 92px minmax(0, 1fr);
  }

  .admin-image-library-card-wide .admin-image-usage,
  .admin-image-library-card-wide form {
    grid-column: 1 / -1;
  }

  .admin-library-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .admin-image-library-compact-grid {
    grid-template-columns: repeat(auto-fill, minmax(min(150px, 100%), 1fr));
  }

  .admin-image-library-card-compact img {
    aspect-ratio: 1 / 1;
  }
}

@media (max-width: 460px) {
  .admin-image-library-compact-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .admin-image-library-card-compact {
    padding: 7px;
  }

  .admin-image-library-card-compact strong {
    font-size: 0.86rem;
  }

  .admin-image-library-card-compact .usage-pill {
    padding: 4px 7px;
    font-size: 0.72rem;
  }
}


/* ===== Autosave status chip =====
   Used by the inline "Saved" / "Saving�" indicator on Edit pages, the
   Attendance Take view, and the report-card details modal. Bigger icon
   than the surrounding text, a soft chip background, and tone-coloured
   foreground so the operator can spot save activity at a glance. */
.autosave-status {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.25rem 0.6rem;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.04);
    font-weight: 600;
    line-height: 1.2;
    transition: background-color 0.2s ease;
}
.autosave-status .fa { font-size: 1.05rem; }
.autosave-status.text-primary { background: rgba(13, 110, 253, 0.10); }
.autosave-status.text-success { background: rgba(25, 135, 84, 0.12); }
.autosave-status.text-danger  { background: rgba(220, 53, 69, 0.12); }

/* ---- Dropped-lowest highlight (Grade Book + Grade Curve) ----
   A grade/term flagged as the lowest is only SKIPPED from the formula,
   never deleted, so it's tinted amber rather than struck through. */
.gradebook-dropped {
  background: #ffe69c !important;
  box-shadow: inset 0 0 0 2px #e0a800;
}
/* Tint the score input itself so the highlight is obvious even though the
   white input covers most of the cell. */
.gradebook-dropped .gradebook-score-input {
  background: #fff3cd;
  border-color: #e0a800;
  font-weight: 600;
  color: #7a5d00;
}
.gradebook-drop-tag {
  display: inline-block;
  margin-left: 4px;
  font-size: .62rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #946c00;
  background: #ffe9a8;
  padding: 0 4px;
  border-radius: 6px;
  vertical-align: middle;
}
.gradebook-dropped-swatch {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 3px;
  background: #fff3cd;
  border: 1px solid #ffe08a;
  vertical-align: -1px;
  margin-right: 2px;
}

/* ---- Grade Curve nested per-student detail ---- */
.curve-table .curve-toggle-cell { width: 32px; text-align: center; }
.curve-table .curve-srow > td { vertical-align: middle; }
.curve-table .curve-detail-row > td { background: #f8f9fb; }
.curve-detail-body { padding: 8px 4px; }
.curve-term, .curve-tn {
  margin-bottom: 8px;
  padding: 6px 10px;
  border-left: 3px solid var(--gold-dark);
  background: #fffdf7;
  border-radius: 4px;
}
.curve-tn { border-left-color: var(--navy); background: #f5f8fc; }
.curve-term-head { margin-bottom: 4px; }
.curve-cat { margin: 2px 0 6px; }
.curve-cat-name { font-weight: 600; }
.curve-assigns, .curve-terms {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 2px;
}
.curve-assign, .curve-term-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 1px 8px;
  border: 1px solid #dee2e6;
  border-radius: 12px;
  font-size: .78rem;
  background: #fff;
}
.curve-assign.curve-dropped, .curve-term-pill.curve-dropped {
  background: #fff3cd;
  border-color: #ffe08a;
  color: #7a5d00;
}
.curve-skip-tag {
  font-size: .62rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #946c00;
  background: #ffe9a8;
  padding: 0 4px;
  border-radius: 6px;
}