/*
 * Pilot 1.0.21 R2: authoritative app-wide foldable-menu layer.
 * It is intentionally loaded last so the earlier legacy green polish cannot
 * reappear on a particular page or in a particular colour mode.
 */

:root {
    --yara-pilot-surface: #15171a;
    --yara-pilot-surface-raised: #202124;
    --yara-pilot-red: #f05252;
    --yara-pilot-text: #ffffff;
}

/* Every interactive <details> element is a menu, not a green status panel. */
html:not(.dark-mode) details,
html.dark-mode details {
    background: var(--yara-pilot-surface) !important;
    border: 2px solid var(--yara-pilot-red) !important;
    border-radius: 14px !important;
    color: var(--yara-pilot-text) !important;
    box-shadow: none !important;
}

html:not(.dark-mode) details[open],
html.dark-mode details[open] {
    background: var(--yara-pilot-surface) !important;
    border-color: var(--yara-pilot-red) !important;
    box-shadow: 0 0 0 1px rgba(240, 82, 82, 0.14) !important;
}

/* This covers section, report, animal and small nested menu summaries alike. */
html:not(.dark-mode) details > summary,
html.dark-mode details > summary,
html:not(.dark-mode) .section-summary,
html.dark-mode .section-summary,
html:not(.dark-mode) .report-month-summary,
html.dark-mode .report-month-summary,
html:not(.dark-mode) .report-type-summary,
html.dark-mode .report-type-summary,
html:not(.dark-mode) .weather-fold-summary,
html.dark-mode .weather-fold-summary {
    background: var(--yara-pilot-surface) !important;
    border: 1px solid var(--yara-pilot-red) !important;
    border-radius: 10px !important;
    color: var(--yara-pilot-text) !important;
    -webkit-text-fill-color: var(--yara-pilot-text) !important;
}

html:not(.dark-mode) details > summary :is(h1, h2, h3, h4, p, span, strong, small),
html.dark-mode details > summary :is(h1, h2, h3, h4, p, span, strong, small),
html:not(.dark-mode) .section-summary :is(h1, h2, h3, h4, p, span, strong, small),
html.dark-mode .section-summary :is(h1, h2, h3, h4, p, span, strong, small),
html:not(.dark-mode) .report-month-summary :is(h1, h2, h3, h4, p, span, strong, small),
html.dark-mode .report-month-summary :is(h1, h2, h3, h4, p, span, strong, small),
html:not(.dark-mode) .report-type-summary :is(h1, h2, h3, h4, p, span, strong, small),
html.dark-mode .report-type-summary :is(h1, h2, h3, h4, p, span, strong, small),
html:not(.dark-mode) .weather-fold-summary :is(h1, h2, h3, h4, p, span, strong, small),
html.dark-mode .weather-fold-summary :is(h1, h2, h3, h4, p, span, strong, small) {
    color: var(--yara-pilot-text) !important;
    -webkit-text-fill-color: var(--yara-pilot-text) !important;
}

/* The generated Open/Close pills must not revert to green or grey. */
html:not(.dark-mode) details > summary::after,
html.dark-mode details > summary::after,
html:not(.dark-mode) .report-month-summary::after,
html.dark-mode .report-month-summary::after,
html:not(.dark-mode) .report-type-summary::after,
html.dark-mode .report-type-summary::after {
    background: var(--yara-pilot-surface-raised) !important;
    border: 1px solid var(--yara-pilot-red) !important;
    color: var(--yara-pilot-text) !important;
    -webkit-text-fill-color: var(--yara-pilot-text) !important;
}

html:not(.dark-mode) details[open] > summary::after,
html.dark-mode details[open] > summary::after {
    background: var(--yara-pilot-surface-raised) !important;
    border-color: var(--yara-pilot-red) !important;
    color: var(--yara-pilot-text) !important;
}

/* Menu actions follow the same non-destructive pilot treatment. */
html:not(.dark-mode) :is(.manage-button, .save-button-always, .pdf-button, .owner-report-button,
    .report-open-button, .report-download-button, .planned-walk-complete-button),
html.dark-mode :is(.manage-button, .save-button-always, .pdf-button, .owner-report-button,
    .report-open-button, .report-download-button, .planned-walk-complete-button) {
    background: var(--yara-pilot-surface) !important;
    border: 2px solid var(--yara-pilot-red) !important;
    color: var(--yara-pilot-text) !important;
    -webkit-text-fill-color: var(--yara-pilot-text) !important;
}

/* Red fill remains reserved for genuinely destructive actions. */
html:not(.dark-mode) :is(.danger-button, .report-delete-link),
html.dark-mode :is(.danger-button, .report-delete-link) {
    background: #b91c1c !important;
    border-color: #f05252 !important;
    color: var(--yara-pilot-text) !important;
    -webkit-text-fill-color: var(--yara-pilot-text) !important;
}