/* New page components reuse the original app.css palette and layout.
   Navbar, footer, containers, hero and page typography are owned by app.css. */
body.public-site {
    --public-surface: #ffffff;
    --public-panel: #ffffff;
    --public-soft: var(--lightgold);
    --public-text: #333333;
    --public-muted: var(--gray);
    --public-line: #dee2e6;
    --public-accent: var(--blue);
}
.public-site .public-page-heading { margin-bottom: 30px; }
.public-site :is(a, button, input, textarea, select):focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
.public-site .public-skip { position: fixed; top: .75rem; left: 1rem; transform: translateY(-180%); padding: .65rem 1rem; color: var(--blue); background: white; z-index: 10000; border-radius: 15px; }
.public-site .public-skip:focus { transform: translateY(0); }
.public-site #page-content .public-empty { background: var(--lightgold); padding: 30px; border-radius: 15px; }
.public-site #page-content .public-empty p:last-child { margin-bottom: 0; }
.public-site #page-content .btn { border-radius: 100px; }
.public-site #page-content .btn-primary { background: var(--blue); border-color: var(--blue); color: white; }
.public-site #page-content .btn-outline-primary { color: var(--blue); border-color: var(--blue); }
.public-site #page-content .btn-outline-primary:hover { color: white; background: var(--blue); }

/* Document categories use the site's blue headings and neutral section panels. */
.transparency-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: 30px; align-items: start; }
.transparency-minutes { background: var(--lightgold); border-radius: 15px; padding: 30px; }
.transparency-icon { display: inline-block; color: var(--blue); font-size: 2rem; margin-bottom: 15px; }
.transparency-minutes ul { list-style: none; padding: 0; margin: 25px 0; }
.transparency-minutes li + li { margin-top: 15px; }
.transparency-minutes li a { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 15px 20px; background: white; border-radius: 15px; color: var(--blue); font-weight: 500; }
.transparency-minutes a:hover { text-decoration: underline; }
.transparency-all { color: var(--blue); text-decoration: underline; text-underline-offset: .2em; }
.transparency-directory { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; }
.transparency-category { padding-bottom: 25px; border-bottom: 1px solid var(--public-line); }
.transparency-category:last-child { grid-column: 1 / -1; }
.transparency-category h2 a { display: flex; align-items: center; justify-content: space-between; gap: 15px; color: var(--blue); }
.transparency-category h2 a:hover { text-decoration: underline; text-underline-offset: .15em; }
.transparency-category h2 i { font-size: 1rem; flex-shrink: 0; }
.transparency-category p { margin: 0; }
.transparency-help { margin: 40px 0 0; }
.transparency-help a { color: var(--blue); text-decoration: underline; }
@media (max-width: 991.98px) {
    .transparency-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767.98px) {
    .transparency-directory { grid-template-columns: minmax(0, 1fr); }
    .transparency-minutes, .public-site #page-content .public-empty { padding: 25px; }
}
@media (prefers-reduced-motion: reduce) {
    html:has(body.public-site) { scroll-behavior: auto; }
    .public-site *, .public-site *::before, .public-site *::after { animation: none !important; transition: none !important; }
}
@media print {
    .public-site > .navbar, .public-site footer, .public-site #cookie-consent, .public-site #chat-container { display: none !important; }
    .public-site #inner-hero { display: none; }
}