/* PPE — lisibilité renforcée, notamment pour les personnes âgées et sur téléphone */
:root {
    color-scheme: light;
    --ppe-text: #202938;
    --ppe-muted: #526174;
    --ppe-border: #cbd5e1;
    --ppe-focus: #075fc7;
}

*, *::before, *::after { box-sizing: border-box; }
html { font-size: 18px; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
    color: var(--ppe-text);
    font-size: 18px !important;
    line-height: 1.55;
    overflow-wrap: anywhere;
}
h1 { font-size: clamp(28px, 3.5vw, 36px) !important; line-height: 1.2; }
h2 { font-size: clamp(23px, 3vw, 29px) !important; line-height: 1.25; }
h3 { font-size: clamp(20px, 2.4vw, 24px) !important; line-height: 1.3; }
p, li, td, th, label, summary { line-height: 1.55; }
button, input, select, textarea, .btn, a.button, .back, .logout a {
    font-family: inherit;
    font-size: 18px !important;
    line-height: 1.35;
}
button, .btn, a.button, .back, .logout a {
    min-height: 48px;
    padding: 12px 18px;
    border-radius: 10px;
    font-weight: 700;
}
input:not([type="checkbox"]):not([type="radio"]), select, textarea {
    min-height: 50px;
    padding: 12px 14px;
    border: 1px solid var(--ppe-border);
    border-radius: 10px;
    color: var(--ppe-text);
    background: #fff;
}
input[type="checkbox"], input[type="radio"] {
    width: 23px;
    height: 23px;
    flex: 0 0 auto;
    accent-color: #1769aa;
}
label { font-weight: 700; }
a { text-underline-offset: 3px; }
:focus-visible {
    outline: 3px solid var(--ppe-focus) !important;
    outline-offset: 3px;
}
table { border-collapse: collapse; }
th, td { padding: 12px 14px; font-size: 17px !important; vertical-align: top; }
th { font-weight: 800; }
.table-scroll, .table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.table-scroll table, .table-wrap table { min-width: 520px; }
.controls { gap: 12px; }
.controls a { display: inline-flex; align-items: center; justify-content: center; }
.controls a button { margin: 0; }
.error, .empty, .hint, .subtitle, .section-subtitle, .footer-note { line-height: 1.6; }
.hint, .subtitle, .section-subtitle, .footer-note, .count, .metric .label, .tile p { font-size: 16px !important; }

@media (max-width: 700px) {
    body { padding: 14px !important; font-size: 18px !important; }
    h1 { font-size: 28px !important; margin-bottom: 18px; }
    h2 { font-size: 24px !important; }
    h3 { font-size: 21px !important; }
    .container, .stats-container, form#taskForm, .success {
        width: 100% !important;
        max-width: 100% !important;
        padding: 20px !important;
        border-radius: 14px;
    }
    .tiles { width: 100% !important; gap: 14px !important; }
    .tile {
        flex: 1 1 100% !important;
        min-width: 0 !important;
        width: 100%;
        min-height: 130px;
        padding: 24px 18px !important;
        gap: 12px !important;
    }
    .tile h2 { font-size: 21px !important; }
    .tile p { font-size: 17px !important; line-height: 1.5; }
    .tile i { font-size: 32px !important; }
    .controls {
        display: flex !important;
        align-items: stretch !important;
        flex-direction: column !important;
        width: 100%;
        gap: 12px !important;
    }
    .controls form, .controls a, .controls button, .controls select,
    .controls input, .controls .field, .controls > * {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
    }
    .controls a button { width: 100% !important; }
    .panel { padding: 18px !important; border-radius: 14px !important; }
    .metrics { grid-template-columns: 1fr !important; gap: 10px !important; }
    .metric { padding: 15px !important; }
    .metric .number { font-size: 28px !important; }
    .metric .label { font-size: 16px !important; }
    .person-name { font-size: 21px !important; }
    .task-list li { padding: 12px 14px !important; font-size: 18px !important; }
    .checkbox-group label { min-height: 48px; padding: 7px 0; font-size: 18px; }
    .checkbox-group label input[type="checkbox"] { margin-right: 5px; }
    .table-scroll { border: 1px solid #d8e0e9; border-radius: 10px; }
    .table-scroll table { min-width: 680px; }
    .table-wrap table { min-width: 520px; }
    .pagination button { min-width: 48px; margin: 4px !important; }
    .global-summary { display: block !important; width: 100%; font-size: 18px !important; }
    .logout { width: 100%; }
    .logout a { display: block !important; width: 100%; text-align: center; }
    .month-head { align-items: flex-start !important; }
    .month-body { padding: 16px !important; }
    details summary { padding: 10px 0; font-size: 18px; cursor: pointer; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}
.person-tag, .ok, summary { font-size: 16px !important; }
