/*
   Design system du site public.
   Les composants conservent leurs règles de structure locales, tandis que cette
   feuille centralise les choix visuels communs consommés par tous les thèmes.
*/

.site-shell {
    --theme-secondary: var(--theme-secondary-custom, #1f2937);

    --site-font-body: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --site-font-heading: var(--site-font-body);
    --site-page-background: #f7f8fa;
    --site-surface: #ffffff;
    --site-surface-soft: #f8fafc;
    --site-heading: #172033;
    --site-text: #25324a;
    --site-muted: #64748b;
    --site-border: #dbe2ea;
    --site-border-soft: #edf1f5;
    --site-border-strong: #cbd5e1;
    --site-card-radius: var(--site-radius, 0.5rem);
    --site-control-radius: 0.58rem;
    --site-control-min-height: 3.15rem;
    --site-control-padding: 0.78rem 0.9rem;
    --site-form-label-size: 0.9rem;
    --site-form-hint-size: 0.75rem;
    --site-page-heading-margin: clamp(1.5rem, 3vw, 2.3rem);
    --site-page-eyebrow-size: 0.78rem;
    --site-page-eyebrow-letter-spacing: 0.12em;
    --site-page-title-size: clamp(2rem, 4vw, 3.15rem);
    --site-page-description-size: 1rem;
    --site-page-description-max-width: 58rem;
    --site-card-padding: 1.25rem;
    --site-danger: #b42318;
    --site-danger-soft: #fff4f3;
    --site-danger-border: #efb2ad;
    --site-success: #166534;
    --site-success-soft: #effaf4;
    --site-success-border: #a9ddbf;
    --site-info-soft: #f0f7ff;
    --site-info-border: #bcd8f5;
    --site-warning-soft: #fff8e8;
    --site-warning-border: #f0d3a2;
    --site-card-shadow: 0 0.4rem 1.35rem rgba(15, 23, 42, 0.055);
    --site-card-shadow-hover: 0 0.75rem 1.8rem rgba(15, 23, 42, 0.1);
    --site-card-hover-transform: translateY(-2px);
    --site-heading-weight: 760;
    --site-heading-letter-spacing: -0.018em;
    --site-module-icon-radius: 0.82rem;
    --site-button-radius: 0.55rem;
    --site-hero-radius: 0.8rem;
    --site-content-leading: 1.7;

    font-family: var(--site-font-body);
    background: var(--site-page-background);
    color: var(--site-text);
}

.site-shell .site-main:not(.site-main--accueil):not(.site-main--presentation) {
    background: var(--site-page-background);
}

.site-shell :where(
    .module-header__copy h2,
    .page-public__heading h1,
    .presentation-public__heading h1,
    .presentation-public__html--simple h1,
    .presentation-public__html--simple h2,
    .presentation-public__html--simple h3,
    .presentation-public__html--simple h4,
    .page-public__html h1,
    .page-public__html h2,
    .page-public__html h3,
    .page-public__html h4,
    .agenda-public__heading h1,
    .publications-public__heading h1,
    .publications-public__year-group > h2,
    .publication-public-card h3,
    .public-article__header h1,
    .public-article__content h2,
    .public-article__content h3,
    .public-article__content h4,
    .conseil-seance-card h2,
    .document-public-card h3,
    .contact-public__card-heading h2,
    .contact-public__form-heading h2,
    .association-card__name,
    .numero-utile-card h3,
    .agenda-card__content h2,
    .site-search-page__heading h1,
    .site-search-result h2,
    .home-article-card h3,
    .home-agenda-datecard h3,
    .home-agenda-poster h3
) {
    color: var(--site-heading);
    font-family: var(--site-font-heading);
    letter-spacing: var(--site-heading-letter-spacing);
}

.site-shell :where(
    .page-public__heading p,
    .publications-public__heading p,
    .publications-public__state,
    .publication-public-card__meta,
    .public-article__header time,
    .association-card__identity small,
    .agenda-card__location,
    .agenda-card__contact,
    .contact-public__form-heading p,
    .site-search-page__heading p,
    .site-search-result__body p
) {
    color: var(--site-muted);
}

.site-shell :where(
    .page-public__html,
    .presentation-public__html--simple,
    .public-article__content,
    .association-card__section p,
    .association-card__richtext,
    .association-card__contact-row,
    .numero-utile-card__description,
    .agenda-card__description
) {
    color: var(--site-text);
}

.site-shell :where(
    .home-article-card,
    .home-agenda-datecard,
    .home-agenda-poster,
    .agenda-card,
    .numero-utile-card,
    .association-card,
    .conseil-seance-card,
    .document-public-card,
    .publication-public-card,
    .site-search-result,
    .contact-public__coordinates,
    .contact-public__form-card,
    .contact-public__state,
    .public-article,
    .public-article-state,
    .publications-public__filters,
    .publications-public__empty-card,
    .publications-public__empty-filter,
    .agenda-calendar-shell,
    .agenda-month-nav__side a,
    .agenda-month-nav__side button,
    .agenda-month-nav__current
) {
    border-color: var(--site-border);
    border-radius: var(--site-card-radius);
    background: var(--site-surface);
    box-shadow: var(--site-card-shadow);
}

.site-shell :where(
    .home-article-card,
    .home-agenda-datecard,
    .home-agenda-poster,
    .numero-utile-card,
    .association-card,
    .document-public-card,
    .publication-public-card,
    .site-search-result,
    .agenda-month-nav__side a
):hover {
    border-color: color-mix(in srgb, var(--theme-primary) 42%, var(--site-border));
    box-shadow: var(--site-card-shadow-hover);
    transform: var(--site-card-hover-transform);
}

.site-shell :where(
    .module-header__icon,
    .numero-utile-card__icon,
    .association-card__logo,
    .document-public-card__icon,
    .site-search-result__icon,
    .conseil-seance-card__date
) {
    border-color: color-mix(in srgb, var(--theme-primary) 18%, var(--site-border));
    border-radius: var(--site-module-icon-radius);
    background: color-mix(in srgb, var(--theme-primary) 7%, var(--site-surface));
    color: var(--theme-primary);
}

.site-shell .module-header__copy h2 {
    color: color-mix(in srgb, var(--theme-primary) 88%, var(--site-heading));
    font-weight: var(--site-heading-weight);
}

.site-shell .module-header__copy p {
    color: var(--site-muted);
}

.site-shell .module-header__accent {
    background: var(--site-border);
}

.site-shell .module-header__accent::before {
    background: var(--theme-primary);
}

.site-shell :where(
    .page-public__heading > span,
    .presentation-public__heading > span,
    .agenda-public__eyebrow,
    .publications-public__eyebrow,
    .publication-public-card__type,
    .conseil-seance-card__eyebrow,
    .document-public-card__eyebrow,
    .contact-public__eyebrow,
    .site-search-result__type
) {
    color: var(--theme-primary);
}

.site-shell :where(
    .page-public__html,
    .presentation-public__html--simple,
    .public-article__content
) {
    line-height: var(--site-content-leading);
}

.site-shell :where(
    .page-public__html blockquote,
    .presentation-public__html--simple blockquote,
    .public-article__content blockquote
) {
    border-left-color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-primary) 7%, var(--site-surface));
}

.site-shell :where(
    .page-public__html th,
    .page-public__html td,
    .presentation-public__html--simple th,
    .presentation-public__html--simple td,
    .article-table__cell
) {
    border-color: var(--site-border);
}

.site-shell :where(
    .document-public-card__action,
    .publications-public__year-button,
    .publication-public-card__download,
    .site-search-result__action,
    .page-public__admin-actions a,
    .public-article__actions a,
    .public-article__actions button
) {
    border-color: var(--site-border-strong);
    border-radius: var(--site-button-radius);
    background: var(--site-surface);
}

.site-shell :where(
    .document-public-card__action--primary,
    .publication-public-card__view,
    .contact-form__actions button,
    .agenda-card__action a,
    .article-button
) {
    border-radius: var(--site-button-radius);
    background: var(--theme-primary);
    color: var(--theme-primary-contrast);
}


/* Contrôles de recherche publics. Ils restent plus compacts que les formulaires classiques. */
.site-shell .site-search-label {
    color: var(--site-heading);
    font-size: var(--site-form-label-size);
    font-weight: 750;
}

.site-shell .site-search-label--sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.site-shell .site-search-input {
    min-width: 0;
    min-height: var(--site-control-min-height);
    padding: var(--site-control-padding);
    border: 1px solid var(--site-border-strong);
    border-radius: var(--site-control-radius);
    background: var(--site-surface);
    color: var(--site-heading);
    font: inherit;
}

.site-shell .site-search-input::placeholder {
    color: var(--site-muted);
    opacity: 0.82;
}

.site-shell .site-search-input:focus {
    border-color: var(--theme-primary);
    outline: 2px solid color-mix(in srgb, var(--theme-primary) 18%, transparent);
    outline-offset: 1px;
}

.site-shell .site-search-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    border: 0;
    border-radius: var(--site-button-radius);
    cursor: pointer;
    font: inherit;
}

.site-shell .site-search-button--primary {
    min-height: var(--site-control-min-height);
    padding: 0.65rem 1rem;
    background: var(--theme-primary);
    color: var(--theme-primary-contrast);
    font-weight: 750;
}

.site-shell .site-search-button--primary:hover,
.site-shell .site-search-button--primary:focus-visible {
    filter: brightness(0.96);
}

.site-shell .site-search-button:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--theme-primary) 22%, transparent);
    outline-offset: 2px;
}

.site-shell .site-search-button .site-icon {
    width: 1.1rem;
    height: 1.1rem;
}

.site-shell .site-search-box {
    position: relative;
    display: flex;
    width: 15rem;
    min-width: 15rem;
    height: 2.45rem;
    flex: 0 0 15rem;
    border: 1px solid color-mix(in srgb, var(--theme-primary-contrast) 28%, transparent);
    border-radius: 0.55rem;
    background: color-mix(in srgb, var(--theme-primary-contrast) 96%, transparent);
    color: var(--theme-primary);
    overflow: hidden;
}

.site-shell .site-search-box .site-search-input {
    width: 100%;
    min-height: 0;
    padding: 0.45rem 0.2rem 0.45rem 0.7rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font-size: 0.88rem;
    outline: 0;
}

.site-shell .site-search-box .site-search-input::placeholder {
    color: color-mix(in srgb, currentColor 62%, transparent);
    opacity: 1;
}

.site-shell .site-search-box .site-search-input:focus {
    border: 0;
    outline: 0;
}

.site-shell .site-search-box .site-search-button {
    display: grid;
    width: 2.55rem;
    min-width: 2.55rem;
    place-items: center;
    border-radius: 0;
    background: transparent;
    color: inherit;
}

.site-shell .site-search-box .site-search-button:hover,
.site-shell .site-search-box .site-search-button:focus-visible {
    background: color-mix(in srgb, var(--theme-primary) 9%, transparent);
    outline: 0;
}

.site-shell .site-search-box:focus-within {
    border-color: var(--theme-primary-contrast);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--theme-primary-contrast) 22%, transparent);
}

.site-shell .site-search-box .site-icon {
    width: 1.15rem;
    height: 1.15rem;
}

.site-shell .site-form-label {
    color: var(--site-heading);
    font-size: var(--site-form-label-size);
    font-weight: 780;
}

.site-shell .site-form-optional {
    margin-left: 0.25rem;
    color: var(--site-muted);
    font-size: var(--site-form-hint-size);
    font-weight: 650;
}

.site-shell .site-form-control {
    width: 100%;
    min-width: 0;
    min-height: var(--site-control-min-height);
    padding: var(--site-control-padding);
    border: 1px solid var(--site-border-strong);
    border-radius: var(--site-control-radius);
    background: var(--site-surface);
    color: var(--site-heading);
    font: inherit;
}

.site-shell .site-form-control:focus {
    border-color: var(--theme-primary);
    outline: 2px solid color-mix(in srgb, var(--theme-primary) 18%, transparent);
    outline-offset: 1px;
}

.site-shell .site-form-control::placeholder {
    color: var(--site-muted);
    opacity: 0.82;
}

.site-shell .site-form-control[readonly] {
    background: var(--site-surface-soft);
    color: var(--site-muted);
}

/* Primitives sémantiques publiques à réutiliser dans les composants. */
.site-shell .site-form-field {
    display: grid;
    min-width: 0;
    gap: 0.38rem;
}

.site-shell .site-form-help {
    color: var(--site-muted);
    font-size: var(--site-form-hint-size);
    line-height: 1.4;
}

.site-shell .site-form-error {
    color: var(--site-danger);
    font-size: var(--site-form-hint-size);
    line-height: 1.4;
}

.site-shell .site-page-heading {
    margin-bottom: var(--site-page-heading-margin);
}

.site-shell .site-page-eyebrow {
    margin: 0 0 0.4rem;
    color: var(--theme-primary);
    font-size: var(--site-page-eyebrow-size);
    font-weight: 850;
    letter-spacing: var(--site-page-eyebrow-letter-spacing);
    text-transform: uppercase;
}

.site-shell .site-page-title {
    margin: 0;
    color: var(--site-heading);
    font-family: var(--site-font-heading);
    font-size: var(--site-page-title-size);
    font-weight: var(--site-heading-weight);
    letter-spacing: var(--site-heading-letter-spacing);
    line-height: 1.08;
}

.site-shell .site-page-description {
    display: block;
    max-width: var(--site-page-description-max-width);
    margin: 0.65rem 0 0;
    color: var(--site-muted);
    font-size: var(--site-page-description-size);
    line-height: 1.6;
}

.site-shell .site-button {
    display: inline-flex;
    min-height: var(--site-control-min-height);
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.65rem 1rem;
    border: 1px solid transparent;
    border-radius: var(--site-button-radius);
    cursor: pointer;
    font: inherit;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    transition: border-color 140ms ease, background-color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}

.site-shell .site-button--primary {
    border-color: var(--theme-primary);
    background: var(--theme-primary);
    color: var(--theme-primary-contrast);
}

.site-shell .site-button--secondary {
    border-color: var(--site-border-strong);
    background: var(--site-surface);
    color: var(--site-heading);
}

.site-shell .site-button:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--theme-primary) 22%, transparent);
    outline-offset: 2px;
}

.site-shell .site-button:disabled,
.site-shell .site-button[aria-disabled="true"] {
    cursor: not-allowed;
    opacity: 0.65;
}

.site-shell .site-card {
    padding: var(--site-card-padding);
    border: 1px solid var(--site-border);
    border-radius: var(--site-card-radius);
    background: var(--site-surface);
    box-shadow: var(--site-card-shadow);
    color: var(--site-text);
}

.site-shell .site-card--soft {
    background: var(--site-surface-soft);
}

.site-shell .site-card--interactive {
    transition: border-color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}

.site-shell .site-card--interactive:hover {
    border-color: color-mix(in srgb, var(--theme-primary) 42%, var(--site-border));
    box-shadow: var(--site-card-shadow-hover);
    transform: var(--site-card-hover-transform);
}

/* Contenu éditorial public partagé par les Articles et les Pages. */
.site-shell .site-rich-content {
    color: var(--site-text);
    line-height: var(--site-content-leading);
}

.site-shell .site-rich-content :where(h1, h2, h3, h4) {
    color: var(--site-heading);
    font-family: var(--site-font-heading);
    letter-spacing: var(--site-heading-letter-spacing);
    line-height: 1.2;
}

.site-shell .site-rich-content a {
    color: var(--theme-primary);
}

.site-shell .site-rich-content blockquote {
    border-left-color: var(--theme-primary);
    background: color-mix(in srgb, var(--theme-primary) 7%, var(--site-surface));
    color: var(--site-text);
}

.site-shell .site-rich-content :where(th, td, .article-table__cell) {
    border-color: var(--site-border);
}

.site-shell .site-rich-content .article-introduction {
    color: var(--site-muted);
    font-size: 1.18rem;
    font-weight: 550;
    line-height: 1.6;
}

.site-shell .site-rich-content .article-box {
    border-radius: var(--site-control-radius);
}

.site-shell .site-rich-content .article-box--info {
    border: 1px solid var(--site-info-border);
    background: var(--site-info-soft);
}

.site-shell .site-rich-content .article-box--attention {
    border: 1px solid var(--site-warning-border);
    background: var(--site-warning-soft);
}

.site-shell .site-rich-content .article-button {
    border-radius: var(--site-button-radius);
    background: var(--theme-primary);
    color: var(--theme-primary-contrast);
}

.site-shell .site-rich-content .article-image figcaption {
    color: var(--site-muted);
}

.site-shell .site-rich-content .article-document {
    border: 1px solid var(--site-border);
    border-radius: var(--site-control-radius);
    background: var(--site-surface-soft);
}

.site-shell .site-rich-content .article-card {
    border-color: var(--site-border);
    border-radius: var(--site-control-radius);
    background: var(--site-surface-soft);
    color: var(--site-text);
}

.site-shell .site-rich-content .article-table__row--header .article-table__cell {
    background: color-mix(in srgb, var(--theme-primary) 6%, var(--site-surface-soft));
    color: var(--site-heading);
}

.site-shell .site-rich-content .article-table__row--total .article-table__cell {
    background: var(--site-surface-soft);
    color: var(--site-heading);
}

.site-shell .site-state--success {
    border-color: var(--site-success-border);
    background: var(--site-success-soft);
    color: var(--site-success);
}

.site-shell .site-state--error {
    border-color: var(--site-danger-border);
    background: var(--site-danger-soft);
    color: var(--site-danger);
}

.site-shell :where(
    .publications-public__type-filter select
) {
    border-color: var(--site-border-strong);
    border-radius: var(--site-control-radius);
    background: var(--site-surface);
    color: var(--site-heading);
}

.site-shell :where(
    .contact-form__privacy,
    .contact-form__state,
    .contact-form__unavailable,
    .public-article__content .article-document,
    .article-card,
    .article-table__row--total .article-table__cell
) {
    background: var(--site-surface-soft);
}

.site-shell .home-module-hero {
    border-radius: var(--site-hero-radius);
    font-family: var(--site-font-body);
}

.site-shell .home-module-hero h1 {
    font-family: var(--site-font-heading);
}

.site-shell .home-module-hero__button {
    border-radius: var(--site-button-radius);
}

.site-shell .site-footer {
    background: var(--theme-secondary);
}

@media (prefers-reduced-motion: reduce) {
    .site-shell :where(
        .home-article-card,
        .home-agenda-datecard,
        .home-agenda-poster,
        .numero-utile-card,
        .association-card,
        .document-public-card,
        .publication-public-card,
        .site-search-result,
        .agenda-month-nav__side a,
        .site-card--interactive,
        .site-button
    ) {
        transition: none;
    }
}
