/* Liturgia Diária no desenho da paróquia (no lugar do style.css do plugin, que o tema substitui; o cartão da página inicial é desenhado no CSS do tema).
   A cor litúrgica do dia (--lit, escrita pelo templates/page.php) pinta as abas e a etiqueta; o vermelho dos livros litúrgicos (--rubric, 6,5:1 sobre branco)
   fica com os títulos, as passagens e os números dos versículos. Usa as cores, as fontes e as medidas do CSS do tema (--blue, --navy, --line, --card, --font-display…). */

.pbld {
  --lit: #2e7d4f;
  --lit-ink: #fff;
  --lit-swatch: #2e7d4f;
  --rubric: #b3261e;
  --fs: 1.125rem;
  --num: 3.2rem; /* coluna dos números dos versículos: cabe "13a" e "7,2b" */
  min-height: 70svh;
  padding-block: calc(var(--header-h) + clamp(2rem, 5vw, 3.5rem)) clamp(4rem, 9vw, 6rem);
  color: var(--ink);
}
.pbld[data-size="-1"] { --fs: 1rem; }
.pbld[data-size="1"] { --fs: 1.25rem; }
.pbld[data-size="2"] { --fs: 1.4rem; }
.pbld[data-size="3"] { --fs: 1.55rem; }
.pbld-wrap { width: min(60rem, 100% - 2 * clamp(20px, 4vw, 48px)); margin-inline: auto; } /* ~960px: a coluna de leitura da liturgia */
.pbld-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.pbld :focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }

/* ---------- barra: o dia à esquerda, as ferramentas à direita ---------- */
.pbld-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1rem; margin-bottom: 1.75rem; }
.pbld-cal { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; }
.pbld-step, .pbld-round {
  display: inline-grid; place-items: center; width: 2.75rem; height: 2.75rem; padding: 0;
  border: 1.5px solid var(--line); border-radius: 50%; background: var(--card); color: var(--navy);
  font: 700 .8rem/1 var(--font-body); text-decoration: none; cursor: pointer;
}
.pbld-step:hover, .pbld-round:hover { border-color: var(--blue); color: var(--blue); }
.pbld-step .ico, .pbld-round .ico { width: 1.15rem; height: 1.15rem; }
.pbld-pick { display: inline-flex; align-items: center; gap: .35rem; }
.js .pbld-pick { display: none; } /* com JavaScript o dia é o botão abaixo (e o calendário); sem, fica o campo de data do navegador */
.pbld-datebtn, .pbld-popover { display: none; }
.js .pbld-datebtn {
  display: inline-flex; align-items: center; gap: .6rem; min-height: 2.75rem; padding: .3rem 1rem .3rem .8rem;
  border: 1.5px solid var(--blue); border-radius: 999px; background: var(--card); color: var(--navy); cursor: pointer;
}
.pbld-datebtn:hover, .pbld-datebtn[aria-expanded="true"] { background: var(--blue); color: #fff; }
.pbld-calicon .ico { width: 1.15rem; height: 1.15rem; }
.pbld-dnum { font: 600 1.7rem/1 var(--font-display); font-variant-numeric: lining-nums; } /* algarismos de altura das maiúsculas: no estilo antigo o "12" ficava mais baixo que o resto */
.pbld-dmy { display: grid; gap: .1rem; line-height: 1; text-align: left; }
.pbld-dmy b { font: 700 .75rem/1 var(--font-body); letter-spacing: .12em; }
.pbld-dmy i { font: 500 .75rem/1 var(--font-body); font-style: normal; letter-spacing: .06em; opacity: .85; }
.pbld-pick input {
  min-height: 2.75rem; padding: .3rem 1rem; border: 1.5px solid var(--blue); border-radius: 999px; background: var(--card); color: var(--navy);
  font: 600 .9rem/1.2 var(--font-body);
}
.pbld-go {
  min-height: 2.75rem; padding: .3rem 1.1rem; border: 1.5px solid var(--line); border-radius: 999px; background: var(--card); color: var(--navy);
  font: 700 .85rem/1 var(--font-body); cursor: pointer;
}
.pbld-go:hover { border-color: var(--blue); color: var(--blue); }
.pbld-today {
  display: inline-flex; align-items: center; gap: .5rem; min-height: 2.75rem; padding: .3rem 1.1rem .3rem .95rem; margin-left: .25rem;
  border: 1.5px solid var(--gold); border-radius: 999px; background: var(--gold-soft); color: var(--navy);
  font: 700 .875rem/1 var(--font-body); letter-spacing: .02em; text-decoration: none; transition: background-color .2s, border-color .2s, color .2s;
}
.pbld-today::before { content: ""; width: .5rem; height: .5rem; border-radius: 50%; background: var(--gold-deep); flex: none; } /* o mesmo ponto dourado do cartão da próxima missa */
.pbld-today:hover { background: var(--blue); border-color: var(--blue); color: #fff; }
.pbld-today:hover::before { background: var(--gold); }
.pbld-tools { display: flex; gap: .4rem; }

/* o calendário: um mês completo, como o da Canção Nova */
.js .pbld-popover:not([hidden]) {
  display: block; position: absolute; top: calc(100% + .5rem); left: 0; z-index: 20; width: min(20.5rem, calc(100vw - 40px));
  padding: 1rem; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow);
}
.pbld-calhead { display: flex; align-items: center; justify-content: space-between; margin-bottom: .6rem; }
.pbld-calhead strong { font: 600 1.35rem/1 var(--font-display); text-transform: capitalize; }
.pbld-month { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border: 0; border-radius: 50%; background: none; color: var(--navy); cursor: pointer; }
.pbld-month .ico { width: 1.15rem; height: 1.15rem; }
.pbld-month:hover:not(:disabled) { background: var(--tint); }
.pbld-month:disabled { opacity: .3; cursor: default; }
.pbld-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.pbld-wd { padding-block: .35rem; text-align: center; font: 600 .7rem/1 var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); }
.pbld-day {
  display: grid; place-items: center; aspect-ratio: 1; min-width: 0; padding: 0; border: 0; border-radius: 50%; background: none;
  color: var(--navy); font: 500 .9rem/1 var(--font-body); cursor: pointer;
}
.pbld-day:hover:not(:disabled) { background: var(--tint); }
.pbld-day.is-today { box-shadow: inset 0 0 0 1.5px var(--gold); }
.pbld-day.is-selected { background: var(--lit); color: var(--lit-ink); font-weight: 700; }
.pbld-day:disabled { opacity: .3; cursor: default; }

/* ---------- cabeçalho do dia ---------- */
.pbld-tags { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.pbld-tag {
  display: inline-flex; align-items: center; gap: .55rem; padding: .45rem .9rem; border: 1px solid var(--line); border-radius: 999px;
  background: var(--card); color: var(--ink-2); font: 600 .75rem/1.2 var(--font-body); letter-spacing: .12em; text-transform: uppercase;
}
.pbld-tag strong { color: var(--navy); font-weight: 700; }
.pbld-swatch { width: .9rem; height: .9rem; flex: none; border-radius: 50%; background: var(--lit-swatch); box-shadow: inset 0 0 0 1px rgba(16, 33, 79, .3); }
.pbld-head h1 { font-size: clamp(2rem, 5.6vw, 3.1rem); line-height: 1.06; }
.pbld-date { margin-top: .6rem; color: var(--ink-2); }
.pbld-date::first-letter { text-transform: uppercase; }
.pbld-intro { margin-top: .9rem; color: var(--ink-2); }
.pbld-notice, .pbld-empty { margin-top: 1.25rem; padding: .85rem 1rem; border-radius: 12px; background: var(--gold-soft); color: var(--navy); font-size: .9375rem; }
.pbld-empty { font-size: 1rem; }
.pbld-notice a, .pbld-empty a { font-weight: 700; }
.pbld-celebrations { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.25rem; }
.pbld-celebrations a { padding: .5rem .9rem; border: 1.5px solid var(--line); border-radius: 12px; background: var(--card); text-decoration: none; font-weight: 600; font-size: .9rem; }
.pbld-celebrations a[aria-current] { border-color: var(--blue); background: var(--tint); }
.pbld-celebrations small { font-weight: 500; color: var(--ink-2); }

/* ---------- abas (uma leitura de cada vez, como no site; sem JavaScript todas aparecem) ---------- */
.pbld-tabs { display: grid; grid-template-columns: repeat(var(--tabs, 4), minmax(0, 1fr)); gap: .4rem; margin-top: 1.75rem; }
.pbld-tab {
  display: grid; place-items: center; min-height: 2.75rem; padding: .5rem .4rem; border: 1.5px solid var(--lit); border-radius: 999px; background: var(--card); color: var(--navy);
  font: 600 .875rem/1.15 var(--font-body); text-align: center; text-decoration: none; cursor: pointer;
}
.pbld-tab:hover { background: var(--tint); }
.pbld-tab[aria-selected="true"], .js .pbld-tabs:not([role]) .pbld-tab:first-child { background: var(--lit); color: var(--lit-ink); } /* antes do JavaScript a primeira já aparece escolhida */
@media (max-width: 430px) { .pbld-tab { padding-inline: .2rem; font-size: .78rem; } }
@media (max-width: 359px) { .pbld-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); } } /* 320px: duas por linha, sem cortar "Evangelho" */
/* as passagens ficam embaixo da aba de cada leitura; no celular viram uma lista (rótulo à esquerda, passagem à direita) */
.pbld-passages { display: grid; grid-template-columns: repeat(var(--tabs, 4), minmax(0, 1fr)); gap: .4rem; margin: .75rem 0 0; }
.pbld-passages div { display: grid; align-content: start; gap: .15rem; padding: .25rem .35rem; text-align: center; }
.pbld-passages dt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } /* a aba logo acima já diz qual é */
.pbld-passages dd { margin: 0; color: var(--rubric); font-size: .9rem; font-style: italic; font-weight: 500; line-height: 1.4; }
.pbld-or { color: var(--ink-2); font-style: normal; font-size: .8em; }
@media (max-width: 640px) {
  .pbld-passages { grid-template-columns: 1fr; gap: 0; margin-top: 1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--card); }
  .pbld-passages div { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: .6rem .9rem; text-align: right; }
  .pbld-passages div + div { border-top: 1px solid var(--line); }
  .pbld-passages dt { position: static; width: auto; height: auto; overflow: visible; clip-path: none; flex: none; color: var(--ink-2); font: 600 .72rem/1.3 var(--font-body); letter-spacing: .1em; text-transform: uppercase; }
  .pbld-passages .pbld-nb { white-space: normal; } /* aqui há espaço de sobra: a passagem pode quebrar se o aparelho for estreito */
}

/* ---------- o texto, na ordem do Lecionário ---------- */
.pbld-panel { margin-top: 1.5rem; padding: clamp(1.25rem, 3.4vw, 2.75rem); border: 1px solid var(--line); border-radius: var(--radius); background: var(--card); font-size: var(--fs); line-height: 1.75; scroll-margin-top: calc(var(--header-h) + 1rem); }
/* com JavaScript só uma leitura aparece (a primeira, até o script escolher a do endereço: sem salto na tela; .is-open é a escolhida); no papel, todas */
.js .pbld-panel:not(:first-of-type) { display: none; }
.js .pbld-panel.is-open { display: block; }
.pbld-h { margin: 0 0 1.25rem; color: var(--rubric); font: 700 1.05em/1.2 var(--font-body); letter-spacing: .09em; text-align: center; text-transform: uppercase; }
.pbld-opt { margin: 1.75rem 0 .5rem; color: var(--rubric); font: 700 .8em/1.2 var(--font-body); letter-spacing: .08em; text-transform: uppercase; }
.pbld-option + .pbld-option { margin-top: 1.5rem; padding-top: .25rem; border-top: 1px solid var(--line); }
.pbld-ref { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: .1rem 1rem; margin-bottom: 1.1rem; color: var(--rubric); font-style: italic; }
.pbld-reading-title { color: var(--rubric); }
.pbld-passage { font-weight: 500; }
.pbld-nb { white-space: nowrap; } /* "Jo 2, 1-11" nunca quebra no hífen: a passagem só quebra entre os trechos (depois do ";") */
.pbld-ref-gospel { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .8rem; align-items: start; color: var(--navy); font-style: normal; font-weight: 700; font-size: 1.05em; }
.pbld-ref-gospel .pbld-reading-title { color: inherit; }
.pbld-ref-gospel .pbld-passage { color: var(--rubric); font-weight: 700; margin-left: 0; }
/* evangelho: a passagem é empurrada para a direita, na linha do título; no celular ela desce para a linha de baixo (à esquerda, sob o título) */
@media (min-width: 641px) {
  .pbld-ref-gospel .pbld-ref-text { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: .1rem 1rem; }
  .pbld-ref-gospel .pbld-passage { margin-left: auto; white-space: nowrap; }
}
@media (max-width: 640px) { .pbld-ref-gospel .pbld-passage { display: block; } }
.pbld-cross { width: 2.1rem; height: 2.1rem; margin-top: -.1rem; fill: var(--rubric); }

.pbld-v { display: grid; grid-template-columns: var(--num) minmax(0, 1fr); gap: 0 .5rem; margin: 0 0 .15rem; }
.pbld-n { padding-top: .38em; color: var(--rubric); font-size: .74em; font-weight: 600; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pbld-t { overflow-wrap: anywhere; }
.pbld-refrain { margin: 0 0 1rem; font-weight: 700; }
.pbld-r { color: var(--rubric); font-weight: 700; }
.pbld-stanza { margin: 0 0 .15rem; padding-left: calc(var(--num) + .5rem); }
.pbld-again { margin: 0 0 1rem; padding-left: calc(var(--num) + .5rem); }
.pbld-close { margin: 1.25rem 0 0; padding-left: calc(var(--num) + .5rem); font-weight: 600; }
.pbld-answer { margin: 0; padding-left: calc(var(--num) + .5rem); }
/* só as passagens: o convite para ler a leitura no site da CNBB */
.pbld-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1.5rem; margin-top: 1.5rem; padding: 1rem 1.25rem; border-radius: 14px; background: var(--tint); color: var(--ink-2); font-size: .9375rem; line-height: 1.5; }
.pbld-cta p { margin: 0; }
.pbld-ref + .pbld-cta, .pbld-option + .pbld-cta { margin-top: 1.25rem; }
.pbld-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 2.75rem; padding: .5rem 1.25rem; border: 1.5px solid var(--blue); border-radius: 999px;
  background: transparent; color: var(--blue); font: 600 .9375rem/1.2 var(--font-body); text-decoration: none;
}
.pbld-btn:hover { background: rgba(42, 82, 190, .08); }
@media (max-width: 520px) { .pbld-cta .pbld-btn { width: 100%; } }
.pbld-foot a { color: inherit; text-decoration: none; }
.pbld-foot a:hover { text-decoration: underline; } /* discreto, como o link da Arquidiocese no rodapé do site */
.pbld-foot { margin-top: 2rem; padding-top: 1rem; border-top: 1px solid var(--line); color: var(--ink-2); font-size: .8125rem; }

@media (max-width: 520px) {
  .pbld { --num: 2.6rem; }
  .pbld-v { gap: 0 .35rem; }
  .pbld-stanza, .pbld-again, .pbld-close, .pbld-answer { padding-left: calc(var(--num) + .35rem); }
  /* sem JavaScript, no celular: anterior, o campo de data e seguinte numa linha só ("Hoje", quando aparece, vai para a de baixo) */
  html:not(.js) .pbld-cal { width: 100%; }
  html:not(.js) .pbld-step[rel="prev"] { order: 1; }
  html:not(.js) .pbld-pick { flex: 1 1 0; order: 2; min-width: 0; }
  html:not(.js) .pbld-pick input { flex: 1 1 0; min-width: 0; padding-inline: .75rem; }
  html:not(.js) .pbld-step[rel="next"] { order: 3; }
  html:not(.js) .pbld-today { order: 4; margin-left: 0; }
}

/* ---------- papel: só o texto das leituras, todas, uma depois da outra ---------- */
@page { margin: 1.5cm; }
@media print {
  .site-header, .site-footer, .skip, .progress, .wa-float, .pbld-bar, .pbld-tabs, .pbld-passages, .pbld-celebrations, .pbld-notice, .pbld-tags, #pb-admin-bar, .pb-admin-bar { display: none !important; }
  .pbld { padding: 0; min-height: 0; }
  .pbld-wrap { width: 100%; }
  .pbld-panel, .js .pbld-panel[hidden], .js .pbld-panel:not(:first-of-type) { display: block !important; }
  .pbld-panel { border: 0; padding: 0; break-inside: avoid-page; }
  .pbld-cross { fill: #b3261e; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
