/*
 * Styles applicatifs. Les couleurs, rayons et polices sont définis dans
 * theme.css — ne pas coder de couleurs en dur ici, utiliser les variables
 * --bs-* ou --joussour-* pour que le thème reste changeable en un seul endroit.
 */
body {
    background-color: var(--bs-body-bg);
    display: flex;
    min-height: 100vh;
    flex-direction: column;
}

main {
    flex: 1 0 auto;
}

.navbar {
    background-color: var(--joussour-header-bg);
    border-bottom: 1px solid var(--joussour-header-border);
}

.card {
    background-color: var(--joussour-surface-bg);
    box-shadow: var(--joussour-shadow-sm);
}

/* Accessibilité : lien d'évitement visible uniquement au focus clavier */
.skip-link {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1080;
    padding: 0.5rem 1rem;
    background-color: var(--bs-primary);
    color: #fff;
}

/* Accessibilité : indicateur de focus visible et cohérent (WCAG 2.1 AA) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.btn:focus-visible {
    outline: 2px solid var(--bs-primary);
    outline-offset: 2px;
}