/* ---------- Couleurs ---------- */

:root {
    --answer-yes: #2e7d32;
    --answer-no: #c62828;
    --answer-maybe: #ef6c00;
    --muted: #6b7280;
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --answer-yes: #66bb6a;
        --answer-no: #ef5350;
        --answer-maybe: #ffa726;
        --muted: #9ca3af;
    }
}

/* ---------- Mise en page générale ---------- */

.site-header nav { flex-wrap: wrap; }
.site-header nav ul { flex-wrap: wrap; }
.flash { padding: .75rem 1rem; border-left: 4px solid var(--pico-primary); background: var(--pico-card-background-color); }
.link-button { background: none; border: none; padding: 0; color: var(--pico-primary); text-decoration: underline; width: auto; margin: 0; }
.logout-form { margin: 0; }
.link-request { max-width: 32rem; margin-inline: auto; }
.table-scroll { overflow-x: auto; }
.filters { display: flex; flex-wrap: wrap; gap: .5rem; align-items: end; }
.filters select, .filters button { width: auto; margin-bottom: 0; }
.filter-check { display: inline-flex; gap: .25rem; align-items: center; margin-bottom: 0; }
.field-error { display: block; color: var(--answer-no); }
.delete-button { width: auto; margin-bottom: 0; color: var(--answer-no); border-color: var(--answer-no); }
.usage-note { color: var(--muted); }
.member-note { color: var(--muted); font-style: italic; }
tr[data-status="cancelled"] td { color: var(--muted); text-decoration: line-through; }
.lock-badge { margin-left: .5rem; font-size: .8em; color: var(--muted); }
.attention-badge { display: inline-block; margin-left: .5rem; padding: 0 .4rem; border-radius: .25rem; font-size: .8rem; background: var(--answer-maybe); color: #fff; }

/* ---------- Membres : mes dates, cartes ---------- */

.pending-banner { padding: .75rem 1rem; border-left: 4px solid var(--answer-maybe); background: var(--pico-card-background-color); font-weight: 600; }
.priority-banner { padding: .75rem 1rem; margin-bottom: 1rem; border-left: 4px solid var(--answer-maybe); background: var(--pico-card-background-color); }
.priority-banner ul { margin: .5rem 0 0; }
.month h2 { font-size: 1.1rem; margin-top: 2rem; }
.event-card header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem; }
.event-card[data-type="concert"] { border-left: 4px solid var(--pico-primary); }
.event-card[data-attention="1"] { border: 2px solid var(--answer-maybe); }
.event-card .attention { margin: .25rem 0; font-weight: 600; color: var(--answer-maybe); }
.event-ensembles { color: var(--muted); font-size: .9em; }
.event-when { margin-bottom: .75rem; }
.note-row { margin-bottom: .5rem; }
.note-row input { margin-bottom: 0; }
.note-row button { flex: 0 0 auto; width: auto; }
.answer-buttons { margin-bottom: .5rem; }
.answer-buttons button { font-size: 1.1rem; padding-block: .75rem; }
.answer-buttons button[aria-pressed="false"] { background: var(--pico-card-background-color); border: 2px solid currentColor; font-weight: 600; }
.answer-buttons .answer-yes[aria-pressed="false"] { color: var(--answer-yes); }
.answer-buttons .answer-no[aria-pressed="false"] { color: var(--answer-no); }
.answer-buttons .answer-maybe[aria-pressed="false"] { color: var(--answer-maybe); }
.answer-buttons .answer-yes[aria-pressed="true"] { background: var(--answer-yes); border-color: var(--answer-yes); }
.answer-buttons .answer-no[aria-pressed="true"] { background: var(--answer-no); border-color: var(--answer-no); }
.answer-buttons .answer-maybe[aria-pressed="true"] { background: var(--answer-maybe); border-color: var(--answer-maybe); }
.answer-locked { color: var(--muted); font-style: italic; }
.section-counts ul { margin-bottom: 0; }
.tour-concerts ul, ul.tour-concerts { margin: .25rem 0 .5rem; }
.profile-facts { display: grid; grid-template-columns: max-content 1fr; gap: .25rem 1rem; }
.membership-status { padding: .5rem 1rem; border-left: 4px solid var(--answer-yes); }
.membership-status[data-paid="0"] { border-left-color: var(--answer-maybe); }

/* ---------- Sondages ---------- */

.poll { margin-bottom: 2.5rem; }
.poll-description { white-space: pre-line; }

/* ---------- État de réponse (✓ ✗ ? !) ---------- */

.answer-mark::before { display: inline-block; width: 1.1em; font-weight: 700; text-align: center; }
[data-answer="yes"] .answer-mark::before { content: '✓'; color: var(--answer-yes); }
[data-answer="no"] .answer-mark::before { content: '✗'; color: var(--answer-no); }
[data-answer="maybe"] .answer-mark::before { content: '?'; color: var(--answer-maybe); }
[data-answer="todo"] .answer-mark::before { content: '!'; color: var(--answer-maybe); }

/* ---------- Agenda : liste ---------- */

.view-switch { display: flex; justify-content: flex-start; gap: 1.5rem; margin-bottom: 1rem; }
.view-switch a[aria-current="page"] { font-weight: 700; text-decoration: none; border-bottom: 2px solid var(--pico-primary); }
.agenda-list { list-style: none; padding: 0; }
.agenda-list li { display: flex; flex-wrap: wrap; gap: .25rem .75rem; padding: .5rem 0; border-bottom: 1px solid var(--pico-muted-border-color); }
.agenda-list li[data-status="cancelled"] { color: var(--muted); text-decoration: line-through; }
.agenda-list li[data-answer="todo"] { font-weight: 700; }
.agenda-list .member-note { flex-basis: 100%; }
.agenda-date { min-width: 12rem; }

/* ---------- Agenda : calendrier ---------- */

.calendar-nav { display: flex; justify-content: space-between; margin-bottom: .5rem; }
.calendar-nav a[rel="next"] { margin-left: auto; }
.calendar { table-layout: fixed; width: 100%; font-size: .8rem; }
.calendar caption { font-size: 1.2rem; font-weight: 700; text-align: left; padding-bottom: .5rem; }
.calendar th { text-align: center; padding: .25rem; }
.calendar td { vertical-align: top; height: 5rem; padding: .25rem; border: 1px solid var(--pico-muted-border-color); overflow: hidden; }
.calendar td.outside { opacity: .4; }
.calendar td.today { outline: 2px solid var(--pico-primary); outline-offset: -2px; }
.calendar td[data-holiday] { background: var(--pico-card-sectioning-background-color); }
.calendar td.has-events { position: relative; cursor: pointer; }
.calendar td.has-events:hover { background: var(--pico-primary-focus); }
.calendar .day-number { font-weight: 700; }
.calendar a.day-number { text-decoration: none; }
.calendar a.day-number::after { content: ''; position: absolute; inset: 0; }
.calendar a.day-number:focus-visible::after, .calendar a.poll-link:focus-visible { outline: 3px solid var(--pico-primary); outline-offset: -3px; }
.calendar .public-holiday { display: block; color: var(--answer-maybe); font-weight: 600; }
.calendar ul { list-style: none; margin: .25rem 0 0; padding: 0; }
.calendar li { margin: 0 0 .2rem; padding: .1rem .25rem; border-radius: .2rem; background: var(--pico-primary-background); color: var(--pico-primary-inverse); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; list-style: none; }
.calendar li[data-type="concert"] { font-weight: 700; box-shadow: inset 0 0 0 2px var(--pico-contrast); }
.calendar li[data-status="cancelled"] { opacity: .5; text-decoration: line-through; }
.calendar li .answer-mark::before { color: inherit; }
.calendar li[data-answer="yes"] { background: var(--answer-yes); }
.calendar li[data-answer="no"] { background: var(--answer-no); }
.calendar li[data-answer="maybe"] { background: var(--answer-maybe); }
.calendar li[data-answer="todo"] { background: transparent; color: var(--answer-maybe); border: 2px dashed var(--answer-maybe); font-weight: 700; }
.calendar li[data-answer="other"], .calendar li[data-answer="closed"] { background: var(--pico-muted-border-color); color: var(--pico-muted-color); }
.calendar li[data-status="proposed"] { border-style: dashed; }
.calendar a.poll-link { position: relative; z-index: 1; display: block; color: inherit; text-decoration: none; overflow: hidden; text-overflow: ellipsis; }
.calendar small.member-note { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.2; color: inherit; font-weight: 400; opacity: .9; }
.calendar-legend { display: flex; flex-wrap: wrap; gap: .5rem 1rem; list-style: none; padding: 0; margin-top: .75rem; font-size: .85rem; }
.calendar-legend li { list-style: none; display: flex; align-items: center; gap: .25rem; }
.calendar-legend li::before { content: ''; display: inline-block; width: 1rem; height: .8rem; border-radius: .2rem; }
.calendar-legend li[data-answer="yes"]::before { background: var(--answer-yes); }
.calendar-legend li[data-answer="no"]::before { background: var(--answer-no); }
.calendar-legend li[data-answer="maybe"]::before { background: var(--answer-maybe); }
.calendar-legend li[data-answer="todo"]::before { border: 2px dashed var(--answer-maybe); }
.calendar-legend li[data-answer="other"]::before { background: var(--pico-muted-border-color); }
.calendar-legend .answer-mark { display: none; }

@media (max-width: 576px) {
    .calendar { font-size: .65rem; }
    .calendar td { height: 3.5rem; padding: .1rem; }
    .calendar .event-label { display: none; }
    .calendar li { text-overflow: clip; text-align: center; padding: .1rem 0; }
}

/* ---------- Agenda : modale d'un jour ---------- */

#agenda-day-dialog > article { width: 100%; max-width: 40rem; }
#agenda-day-dialog > article > header { display: flex; justify-content: flex-end; padding-block: .5rem; }
#agenda-day h2 { margin-top: 0; }
.other-events li[data-status="cancelled"] { text-decoration: line-through; color: var(--muted); }

/* ---------- Admin : membres ---------- */

.instrument-choice .section-name { margin: .5rem 0 .25rem; font-weight: 600; }
.instrument-choice label { display: inline-flex; gap: .25rem; margin-right: 1rem; }
.member-link-actions { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.member-link-actions h2 { width: 100%; }
.magic-link-cell { display: flex; gap: .5rem; align-items: center; min-width: 18rem; }
.magic-link-cell input, .magic-link-cell button { margin: 0; padding: .25rem .5rem; font-size: .85rem; }
.magic-link-cell button { width: auto; }
.membership { margin-block: 2rem; }

/* ---------- Admin : pupitres et saisons ---------- */

.ensemble { margin-bottom: 3rem; }
.inline-add { display: flex; gap: .5rem; }
.inline-add input { margin-bottom: 0; }
.inline-add button { width: auto; margin-bottom: 0; }
.structure-row { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-bottom: .5rem; }
.structure-row form { margin-bottom: 0; }
.instrument-list { list-style: none; padding: 0; }
.position-input { max-width: 6rem; }

/* ---------- Admin : événements, présences, relances ---------- */

.today-events li { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.section-answers dl { display: grid; grid-template-columns: max-content 1fr; gap: .25rem 1rem; }
.section-answers dd { margin: 0; }
.member-answers-list { list-style: none; padding: 0; margin: 0; }
.member-answer { list-style: none; display: grid; grid-template-columns: minmax(10rem, 14rem) 1fr; gap: .5rem 1rem; align-items: center;
                 padding: .4rem 0; border-bottom: 1px solid var(--pico-muted-border-color); }
.member-answer-name { font-weight: 600; border-left: 4px solid var(--pico-muted-border-color); padding-left: .5rem; }
.member-answer[data-answer="yes"] .member-answer-name { border-left-color: var(--answer-yes); }
.member-answer[data-answer="no"] .member-answer-name { border-left-color: var(--answer-no); }
.member-answer[data-answer="maybe"] .member-answer-name { border-left-color: var(--answer-maybe); }
.member-answer-form { margin: 0; display: grid; grid-template-columns: 8rem 1fr; gap: .5rem; align-items: center; }
.member-answer-form select, .member-answer-form .note-row, .member-answer-form .note-row input { margin: 0; }
.member-answer-form select, .member-answer-form input { padding-block: .35rem; height: auto; }
@media (max-width: 576px) {
    .member-answer { grid-template-columns: 1fr; }
}
.roll-call-row { display: flex; align-items: center; gap: .75rem; padding: .6rem 0; border-bottom: 1px solid var(--pico-muted-border-color); font-size: 1.1rem; }
#roll-call-status { color: var(--muted); min-height: 1.5rem; margin: .5rem 0; }
.whatsapp-share, .reminders a[data-channel="whatsapp"] { color: #128c4b; font-weight: 600; }
.reminders ul { list-style: none; padding: 0; }
.reminders li { list-style: none; display: flex; justify-content: space-between; gap: 1rem; padding: .4rem 0; border-bottom: 1px solid var(--pico-muted-border-color); }
.reminder-form { margin: 0; }

/* ---------- Admin : tournées ---------- */

.tour-concert { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .5rem; padding: .75rem; }
.tour-concert > form:first-child { flex: 1 1 100%; margin: 0; }
.tour-concert[data-status="cancelled"] { opacity: .6; }
.tour-concert-actions { display: flex; align-items: center; gap: 1rem; }
.tour-concert-actions button { width: auto; margin: 0; }

/* ---------- Admin : prochaines dates et bilan ---------- */

.upcoming-event { margin-bottom: 2rem; }
.upcoming-table .section-row th { background: var(--pico-muted-border-color); font-weight: bold; }
.upcoming-table td[data-answer="yes"] { font-weight: bold; text-align: center; }
.upcoming-table .no-answer { color: var(--muted); }
.attendance-matrix td, .attendance-matrix th { text-align: center; white-space: nowrap; font-size: .85rem; padding: .25rem .4rem; }
.attendance-matrix td:first-child, .attendance-matrix th:first-child { text-align: left; }
.attendance-matrix td[data-concerned="0"] { background: var(--pico-muted-border-color); }
.attendance-matrix td[data-answer="yes"][data-present="0"] { color: var(--answer-no); font-weight: 700; }

@media (max-width: 768px) {
    .matrix-title, .matrix-wrapper { display: none; }
}

/* ---------- Admin : envois de mails ---------- */

.mail-logs tr[data-status="failed"] td { color: var(--answer-no); }

/* ---------- Accessibilité ---------- */

.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.poll-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.poll-actions form { margin: 0; }
.poll-actions button { width: auto; margin: 0; }
.admin-link { font-weight: 700; }
.priority-banner .maybe-mention { color: var(--answer-maybe); font-weight: 600; }
.open-polls { padding: .75rem 1rem; margin-bottom: 1rem; border-left: 4px solid var(--pico-primary); background: var(--pico-card-background-color); }
.open-polls ul { margin: .5rem 0 0; }
.open-polls .poll-pending { color: var(--answer-maybe); font-weight: 600; }
.delete-blocked { color: var(--muted); font-style: italic; margin-top: 1rem; }
.inline-check { display: inline-flex; gap: .25rem; margin-right: 1rem; }
.reminders .maybe-mention { color: var(--answer-maybe); margin-left: .25rem; }

/* ---------- Admin : tableau des présences ---------- */

.presence-grid { font-size: .8rem; }
.presence-grid caption { font-size: 1.2rem; font-weight: 700; text-align: left; padding-bottom: .5rem; }
.presence-grid th, .presence-grid td { vertical-align: top; padding: .3rem .4rem; border: 1px solid var(--pico-muted-border-color); }
.presence-grid thead th { white-space: nowrap; }
.presence-grid thead th small { display: block; color: var(--muted); font-weight: 400; }
.presence-grid thead th[data-status="cancelled"] { text-decoration: line-through; opacity: .6; }
.presence-grid tbody th { position: sticky; left: 0; background: var(--pico-background-color); white-space: nowrap; }
.presence-grid td.not-concerned { color: var(--muted); text-align: center; background: var(--pico-card-sectioning-background-color); }
.presence-grid ul, .presence-legend { list-style: none; margin: 0; padding: 0; }
.presence-grid li, .presence-legend li { list-style: none; white-space: nowrap; }
.presence-legend { display: flex; flex-wrap: wrap; gap: .5rem 1rem; margin-top: .75rem; font-size: .85rem; }
[data-state="yes"], [data-state="present"] { color: var(--answer-yes); font-weight: 600; }
[data-state="maybe"] { color: var(--answer-maybe); font-weight: 600; }
[data-state="no"], [data-state="absent"] { color: var(--answer-no); text-decoration: line-through; }
[data-state="none"] { color: var(--muted); }
.note-row { align-items: stretch; }
.note-row .note-save { flex: 0 0 3rem; width: 3rem; height: auto; padding: 0; line-height: 1; font-size: 1.1rem; font-weight: 700;
                       background: var(--answer-yes); border-color: var(--answer-yes); color: #fff; }
.personal-link { margin-bottom: 2rem; }
.date-row { align-items: end; }
.date-row .remove-row { width: auto; margin-bottom: calc(var(--pico-spacing) * 1.375); padding-inline: 1rem; }
@media (min-width: 768px) {
    .date-row { grid-template-columns: repeat(3, 1fr) auto; }
}

/* ---------- Admin : résultats d'un sondage ---------- */

.poll-results { font-size: .9rem; }
.poll-results th, .poll-results td { text-align: center; white-space: nowrap; border: 1px solid var(--pico-muted-border-color); padding: .4rem .6rem; }
.poll-results tbody th, .poll-results thead th:first-child { text-align: left; }
.poll-results thead th small { display: block; color: var(--muted); font-weight: 400; }
.poll-results thead th .chosen { color: var(--answer-yes); font-weight: 700; }
.poll-results [data-status="confirmed"] { background: color-mix(in srgb, var(--answer-yes) 12%, transparent); }
.poll-results [data-status="cancelled"] { opacity: .5; }
.poll-results td span[data-answer] { display: inline-block; min-width: 1.6rem; margin: 0 .1rem; padding: 0 .3rem; border-radius: .25rem; font-weight: 700; }
.poll-results td span[data-answer="yes"], .poll-legend [data-answer="yes"] { color: var(--answer-yes); }
.poll-results td span[data-answer="maybe"], .poll-legend [data-answer="maybe"] { color: var(--answer-maybe); }
.poll-results td span[data-answer="no"], .poll-legend [data-answer="no"] { color: var(--answer-no); }
.poll-results td span[data-answer="none"], .poll-legend [data-answer="none"] { color: var(--muted); font-weight: 400; }
.poll-results .poll-total th, .poll-results .poll-total td { border-top: 2px solid var(--pico-contrast); font-weight: 700; }
.poll-results tfoot form { margin: 0; }
.poll-results tfoot button { width: auto; margin: 0; padding: .35rem .7rem; font-size: .85rem; }
.poll-legend { font-size: .85rem; color: var(--muted); }
.poll-results td span[data-answer]::before, .poll-legend [data-answer]::before { margin-right: .15rem; }
.poll-results td span[data-answer="yes"]::before, .poll-legend [data-answer="yes"]::before { content: '✓'; }
.poll-results td span[data-answer="maybe"]::before, .poll-legend [data-answer="maybe"]::before { content: '?'; }
.poll-results td span[data-answer="no"]::before, .poll-legend [data-answer="no"]::before { content: '✗'; }
.poll-results td span[data-answer="none"]::before, .poll-legend [data-answer="none"]::before { content: '–'; }
