/* Horaires des messes : /horaires-messes/ et pages ville (af/messes/af_messes.php), à l'image des fiches paroisses. */
.af_m_page {
  --af-m-accent: #3bbfb6;
  --af-m-link: #34aaa2;
  --af-m-text: #2f3338;
  --af-m-muted: #6b7178;
  --af-m-line: #dedede;
  --af-m-soft: #f2f2f4;
  --af-m-tint: #e9f7f6;
  display: block;
  padding: 60px 20px 80px;
  background: #f7f7f7;
  color: var(--af-m-text);
  font: 400 16px/1.8 "Open Sans", sans-serif;
}
.af_m_page a { color: var(--af-m-link); text-decoration: none; }
.af_m_page a:is(:hover, :focus-visible) { color: var(--af-m-text); }
.af_m_page h1,
.af_m_page h2,
.af_m_page h3 { margin: 0; color: var(--af-m-text); font-family: "Montserrat", sans-serif; font-weight: 700; }
.af_m_page h1 { font-size: 32px; line-height: 1.4; }
.af_m_page h2 { margin-bottom: 20px; font-size: 20px; line-height: 1.4; }
.af_m_page h3 { font-size: 16px; }
.af_m_page p { margin: 0; }
.af_m_page ul { margin: 0; padding: 0; list-style: none; }
.af_m_page li { margin: 0; }

.af_m { max-width: 1000px; margin: 0 auto; }
.af_m_grid { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 30px; align-items: start; }
.af_m_main,
.af_m_aside { display: flex; flex-direction: column; gap: 30px; min-width: 0; }
.af_m_aside { position: sticky; top: 30px; }
.af_m_card { padding: 40px 50px; border-radius: 15px; background: #fff; box-shadow: 0 0 30px rgba(0, 0, 0, 0.08); }
.af_m_side { padding: 30px; }

/* En-tête */
.af_m_crumb { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; color: var(--af-m-muted); font-size: 13px; line-height: 1.5; }
.af_m_crumb a { color: var(--af-m-muted); }
.af_m_hero h1 { margin-bottom: 12px; }
.af_m_hero p { color: var(--af-m-muted); }

/* Formulaire */
.af_m_form { display: grid; grid-template-columns: 160px 1fr 1fr; gap: 10px; }
.af_m_form label { margin: 0; }
.af_m_form :is(input, select) { width: 100%; height: 45px; padding: 0 12px; border: 1px solid var(--af-m-line); border-radius: 8px; background: #fff; color: var(--af-m-text); font: 400 15px "Open Sans", sans-serif; }
.af_m_form :is(input, select):focus { border-color: var(--af-m-accent); outline: none; box-shadow: 0 0 0 3px var(--af-m-tint); }
.af_m_btn,
.af_m_page .af_m_btn { grid-column: 1 / -1; justify-self: start; padding: 12px 24px; border: 0; border-radius: 50px; background: var(--af-m-accent); color: #fff; font: 700 13px/1.2 "Montserrat", sans-serif; text-transform: uppercase; cursor: pointer; }
.af_m_btn:is(:hover, :focus-visible) { background: var(--af-m-link); }
.af_m_chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 0; }
.af_m_chips button { padding: 6px 16px; border: 1px solid var(--af-m-line); border-radius: 50px; background: #fff; color: var(--af-m-text); font: 600 13px/1.4 "Open Sans", sans-serif; cursor: pointer; }
.af_m_chips button:is(:hover, :focus-visible) { border-color: var(--af-m-accent); }
.af_m_chips button[aria-pressed="true"] { border-color: var(--af-m-accent); background: var(--af-m-accent); color: #fff; }
.af_m_results { margin: 24px 0 0; }
.af_m_results:not(:has(.af_m_item, .af_m_status:not(:empty))) { display: none; }
.af_m_date { padding-bottom: 6px; }
.af_m_status { color: var(--af-m-muted); }
.af_m_status.is-error { color: #a12a2a; }

/* Messes */
.af_m_item { display: flex; gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--af-m-soft); }
.af_m_item:last-child { border-bottom: 0; }
.af_m_hour { flex: 0 0 auto; min-width: 62px; height: 32px; padding: 0 10px; border-radius: 50px; background: var(--af-m-tint); color: var(--af-m-link); font: 700 14px/32px "Montserrat", sans-serif; text-align: center; }
.af_m_body { min-width: 0; line-height: 1.6; }
.af_m_name { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.af_m_name strong { font-family: "Montserrat", sans-serif; font-size: 15px; }
.af_m_type { color: var(--af-m-muted); font-size: 13px; }
.af_m_place,
.af_m_note { margin-top: 2px; color: var(--af-m-muted); font-size: 14px; }
.af_m_place i { margin-right: 6px; color: var(--af-m-accent); font-size: 12px; }
.af_m_note { font-style: italic; }
.af_m_links { display: flex; flex-wrap: wrap; gap: 4px 18px; margin-top: 4px; font-size: 14px; font-weight: 600; }
.af_m_pager { display: flex; flex-wrap: wrap; gap: 6px; margin: 16px 0 0; }
.af_m_pager button { min-width: 36px; height: 36px; border: 1px solid var(--af-m-line); border-radius: 50px; background: #fff; color: var(--af-m-text); cursor: pointer; }
.af_m_pager button[aria-current="page"] { border-color: var(--af-m-accent); background: var(--af-m-accent); color: #fff; }

/* Jours de la semaine */
.af_m_tabs { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; margin: 0 0 10px; }
.af_m_tabs button { display: flex; flex-direction: column; align-items: center; padding: 8px 0; border: 1px solid var(--af-m-line); border-radius: 12px; background: #fff; color: var(--af-m-text); line-height: 1.3; cursor: pointer; }
.af_m_tabs button span { color: var(--af-m-muted); font-size: 12px; text-transform: capitalize; }
.af_m_tabs button strong { font: 700 18px "Montserrat", sans-serif; }
.af_m_tabs button:is(:hover, :focus-visible) { border-color: var(--af-m-accent); }
.af_m_tabs button[aria-selected="true"] { border-color: var(--af-m-accent); background: var(--af-m-accent); color: #fff; }
.af_m_tabs button[aria-selected="true"] span { color: #fff; }
.af_m_panel h3 { padding: 14px 0 4px; }

/* Colonne latérale */
.af_m_side h2 { margin-bottom: 16px; }
.af_m_churches li { padding: 10px 0; border-bottom: 1px solid var(--af-m-soft); line-height: 1.5; }
.af_m_churches li:last-child { border-bottom: 0; }
.af_m_churches a { font-weight: 600; }
.af_m_churches span { display: block; color: var(--af-m-muted); font-size: 13px; }
.af_m_filter { display: block; margin: 0 0 12px; }
.af_m_filter input { width: 100%; height: 45px; padding: 0 12px; border: 1px solid var(--af-m-line); border-radius: 8px; font-size: 14px; }
.af_m_cities ul { max-height: 320px; overflow-y: auto; }
.af_m_cities li { line-height: 2; }
.af_m_cities a { color: var(--af-m-text); }
.af_m_cities a:is(:hover, :focus-visible),
.af_m_cities a[aria-current="page"] { color: var(--af-m-link); }
.af_m_cities a[aria-current="page"] { font-weight: 700; }
.af_m_source { color: var(--af-m-muted); font-size: 13px; text-align: center; }

@media (max-width: 992px) {
  .af_m_grid { grid-template-columns: 1fr; }
  .af_m_aside { position: static; }
}
@media (max-width: 768px) {
  .af_m_page { padding: 30px 16px 50px; }
  .af_m_card { padding: 26px 22px; }
  .af_m_page h1 { font-size: 26px; }
  .af_m_form { grid-template-columns: 1fr; }
  .af_m_tabs { display: flex; overflow-x: auto; }
  .af_m_tabs button { flex: 0 0 56px; }
  .af_m_item { gap: 12px; }
}