@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400&family=Inter+Tight:wght@400;500;600;700&display=swap');
/* ===========================================================
   Parish Mass Times — front-end
   Aligned to dev7: Fraunces + Inter Tight, navy #161e34,
   warm cream surfaces, gold #d4ab68 accent, sharp corners.
   Fully tokenised: reskin by overriding the vars on .pmt.
   =========================================================== */
.pmt {
	--pmt-ink: #161e34;
	--pmt-soft-ink: #4e5670;
	--pmt-accent: #161e34;        /* headings / weekend / active tab */
	--pmt-accent-2: #6e7690;      /* weekday */
	--pmt-gold: #b4893f;          /* confession / small accents */
	--pmt-gold-soft: #d4ab68;     /* dev7 scripture gold */
	--pmt-bg: #ffffff;
	--pmt-surface: #fbf7ee;       /* dev7 cream */
	--pmt-line: #e1e1e1;
	--pmt-radius: 0px;
	--pmt-cols: 3;

	font-family: 'Inter Tight', -apple-system, Helvetica, Arial, sans-serif;
	color: var(--pmt-soft-ink);
	box-sizing: border-box;
}
.pmt *, .pmt *::before, .pmt *::after { box-sizing: border-box; }

.pmt-title {
	font-family: 'Inter Tight', sans-serif;
	font-weight: 700; font-size: clamp(28px, 4vw, 40px);
	color: var(--pmt-ink); margin: 0 0 18px; letter-spacing: .2px;
}

/* Toolbar -------------------------------------------------- */
.pmt-toolbar {
	display: flex; flex-wrap: wrap; gap: 14px; align-items: center;
	justify-content: space-between; margin-bottom: 22px;
}
.pmt-tabs { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.pmt-tab {
	font-family: inherit; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
	color: var(--pmt-soft-ink); background: var(--pmt-bg);
	border: 1px solid var(--pmt-line); border-radius: 0;
	padding: 10px 18px; cursor: pointer; transition: .18s ease; white-space: nowrap;
}
.pmt-tab:hover { color: var(--pmt-ink); border-color: var(--pmt-accent); }
.pmt-tab.is-active { background: var(--pmt-accent); color: #fff; border-color: var(--pmt-accent); }

.pmt-search {
	display: inline-flex; align-items: center; gap: 8px;
	background: var(--pmt-bg); border: 1px solid var(--pmt-line);
	border-radius: 0; padding: 8px 16px; color: var(--pmt-soft-ink);
}
.pmt-search:focus-within { border-color: var(--pmt-accent); }
.pmt-search-input { border: 0; outline: 0; background: transparent; font: inherit; font-size: 14px; color: var(--pmt-ink); min-width: 180px; }

/* Grid + cards -------------------------------------------- */
.pmt-grid {
	display: grid; gap: 22px;
	grid-template-columns: repeat(var(--pmt-cols), minmax(0, 1fr));
}
.pmt-card {
	display: flex; flex-direction: column;
	background: var(--pmt-bg); border: 1px solid var(--pmt-line);
	border-radius: var(--pmt-radius); overflow: hidden;
	box-shadow: 0 1px 2px rgba(20, 20, 30, .04);
	transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.pmt-card:hover { box-shadow: 0 16px 40px rgba(30, 20, 25, .12); transform: translateY(-3px); border-color: #d8cfc0; }

.pmt-card-head {
	padding: 20px 22px 16px; background: var(--pmt-surface);
	border-bottom: 1px solid var(--pmt-line);
}
.pmt-card-name {
	font-family: 'Inter Tight', sans-serif;
	font-weight: 700; font-size: 23px; line-height: 1.15; margin: 0;
	color: var(--pmt-ink); letter-spacing: .2px;
}
.pmt-card-addr {
	display: inline-flex; align-items: flex-start; gap: 6px; margin-top: 8px;
	font-size: 13px; line-height: 1.4; color: var(--pmt-soft-ink); text-decoration: none;
}
a.pmt-card-addr:hover { color: var(--pmt-accent); }
.pmt-card-addr svg { flex: none; margin-top: 2px; color: var(--pmt-gold); }

.pmt-card-body { padding: 8px 22px 20px; display: flex; flex-direction: column; }

/* Service sections ---------------------------------------- */
.pmt-sec { padding: 14px 0; border-bottom: 1px dashed var(--pmt-line); }
.pmt-sec:last-child { border-bottom: 0; }
.pmt-sec-title {
	display: flex; align-items: center; gap: 8px; margin: 0 0 8px;
	font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
}
.pmt-sec-title::before {
	content: ""; width: 4px; height: 15px; border-radius: 2px; background: currentColor;
}
.pmt-t-weekend { color: var(--pmt-accent); }
.pmt-t-weekday { color: var(--pmt-accent-2); }
.pmt-t-adoration { color: var(--pmt-gold-soft); }
.pmt-t-confession { color: var(--pmt-gold); }

.pmt-table { width: 100%; border-collapse: collapse; }
.pmt-table th, .pmt-table td { text-align: left; padding: 5px 0; vertical-align: baseline; font-size: 14.5px; }
.pmt-table th {
	font-weight: 600; color: var(--pmt-ink); white-space: nowrap; padding-right: 14px; width: 45%;
}
.pmt-table td { color: var(--pmt-soft-ink); }
.pmt-time { color: var(--pmt-ink); font-weight: 500; }
.pmt-note {
	display: inline-block; margin-left: 6px; font-size: 10.5px; font-weight: 700;
	letter-spacing: .06em; text-transform: uppercase; color: var(--pmt-gold);
	background: rgba(212, 171, 104, .16); border-radius: 0; padding: 2px 8px; vertical-align: middle;
}

.pmt-card-foot { margin: 12px 0 0; font-size: 12.5px; color: var(--pmt-soft-ink); font-style: italic; }

.pmt-empty, .pmt-noresults {
	padding: 34px; text-align: center; color: var(--pmt-soft-ink);
	background: var(--pmt-surface); border: 1px solid var(--pmt-line); border-radius: var(--pmt-radius);
}
.pmt-noresults { margin-top: 18px; }

/* Pagination (mass_times_paged) --------------------------- */
.pmt-pager { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; margin-top: 28px; }
.pmt-page-btn {
	min-width: 42px; height: 42px; padding: 0 13px;
	font-family: inherit; font-size: 13px; font-weight: 600;
	color: var(--pmt-soft-ink); background: var(--pmt-bg);
	border: 1px solid var(--pmt-line); border-radius: 0; cursor: pointer;
	transition: .16s ease;
}
.pmt-page-btn:hover:not(:disabled) { color: var(--pmt-ink); border-color: var(--pmt-accent); }
.pmt-page-btn.is-active { background: var(--pmt-accent); color: #fff; border-color: var(--pmt-accent); }
.pmt-page-btn:disabled { opacity: .4; cursor: default; }

/* When a single service type is active, hide the other sections.
   (Cards without that type are hidden via JS on the card itself.) */
.pmt[data-active-type="weekend"]    .pmt-sec:not([data-type="weekend"]),
.pmt[data-active-type="weekday"]    .pmt-sec:not([data-type="weekday"]),
.pmt[data-active-type="confession"] .pmt-sec:not([data-type="confession"]) { display: none; }

/* Responsive ---------------------------------------------- */
@media (max-width: 1000px) { .pmt-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) {
	.pmt-grid { grid-template-columns: 1fr; }
	.pmt-toolbar { flex-direction: column; align-items: stretch; }
	.pmt-tabs { justify-content: center; }
	.pmt-search { justify-content: flex-start; }
	.pmt-search-input { flex: 1; }
}

/* Ensure JS-hidden cards/pager actually hide: the [hidden] attribute's default
   display:none is otherwise overridden by .pmt-card{display:flex}. */
.pmt-card[hidden]{ display:none !important; }
.pmt-pager[hidden]{ display:none !important; }

/* ============================================================
   [confession_times] — Confession schedule grouped by day
   (mirrors the parish's printed by-day layout)
   ============================================================ */
.pmt-confessions{ max-width:760px; }
.pmt-conf-day{ margin-bottom:26px; }
.pmt-conf-day:last-of-type{ margin-bottom:0; }
.pmt-conf-dayname{
	font-family:'Inter Tight', sans-serif; font-weight:700; text-transform:uppercase;
	letter-spacing:.09em; font-size:15px; color:var(--pmt-gold); margin:0 0 8px;
}
.pmt-conf-list{ list-style:none; margin:0; padding:0; }
.pmt-conf-list li{
	display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px;
	padding:11px 0; border-bottom:1px solid var(--pmt-line);
	font-size:17px; color:var(--pmt-ink);
}
.pmt-conf-list li:last-child{ border-bottom:none; }
.pmt-conf-time{ font-weight:700; min-width:118px; }
.pmt-conf-dash{ color:var(--pmt-gold-soft); }
.pmt-conf-church{ font-weight:500; }
.pmt-conf-note{ font-size:13px; font-style:italic; color:var(--pmt-soft-ink); }
.pmt-conf-foot{ margin:22px 0 0; font-size:14px; line-height:1.6; color:var(--pmt-soft-ink); }
@media (max-width:520px){ .pmt-conf-time{ min-width:96px; } }