/**
 * Thème Clair — Stitch orgahal_fantasy_festival_manager_clair (parchemin / forêt).
 */
html[data-ui-theme="clair"] {
    --theme-filigree: url("../img/clair-filigree.svg");
}

html[data-ui-theme="clair"] .heritage-bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

html[data-ui-theme="clair"] .heritage-bg__layer {
    position: absolute;
    background: center / contain no-repeat var(--theme-filigree);
}

html[data-ui-theme="clair"] .heritage-bg__layer--primary {
    width: min(92vw, 680px);
    height: min(92vw, 680px);
    top: 6%;
    left: 50%;
    transform: translateX(-42%);
    opacity: 0.14;
}

html[data-ui-theme="clair"] .heritage-bg__layer--secondary {
    width: min(55vw, 380px);
    height: min(55vw, 380px);
    right: -4%;
    bottom: 8%;
    opacity: 0.08;
}

html[data-ui-theme="clair"] body {
    position: relative;
}

html[data-ui-theme="clair"] .app-content-area,
html[data-ui-theme="clair"] #flash-stack,
html[data-ui-theme="clair"] .preview-banner {
    position: relative;
    z-index: 1;
}

html[data-ui-theme="clair"] .app-sidebar {
    z-index: 250;
}

html[data-ui-theme="clair"] .app-header {
    box-shadow: 0 2px 16px rgba(27, 28, 28, 0.06);
    background: color-mix(in srgb, var(--bg-deep) 94%, transparent);
    backdrop-filter: blur(10px);
    border-bottom-color: var(--border-subtle);
    z-index: 500;
}

html[data-ui-theme="clair"] .app-sidebar {
    background: color-mix(in srgb, var(--ok) 92%, #1b1c1c);
    color: #f3f0ef;
    border-right-color: color-mix(in srgb, var(--ok) 70%, #0e1f13);
}

html[data-ui-theme="clair"] .app-sidebar__link {
    color: #f3f0ef;
}

html[data-ui-theme="clair"] .app-sidebar__link:hover,
html[data-ui-theme="clair"] .app-sidebar__link.is-active {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

html[data-ui-theme="clair"] .app-sidebar__section-label {
    color: rgba(243, 240, 239, 0.72);
}

html[data-ui-theme="clair"] .app-brand__title,
html[data-ui-theme="clair"] h1,
html[data-ui-theme="clair"] .page-title,
html[data-ui-theme="clair"] .page-hero__title,
html[data-ui-theme="clair"] .comms-center__title {
    font-weight: 600;
    letter-spacing: -0.02em;
}

html[data-ui-theme="clair"] .page-hero {
    border-top-width: 3px;
    border-top-color: var(--accent);
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--accent) 8%, var(--bg-deep)),
        color-mix(in srgb, var(--accent) 2%, var(--bg-deep)) 55%,
        var(--panel)
    );
    box-shadow: var(--shadow-card);
}

html[data-ui-theme="clair"] .form-card {
    border-radius: var(--radius-lg);
    border-top: 2px solid color-mix(in srgb, var(--accent) 45%, var(--border-subtle));
    box-shadow: var(--shadow-card);
    border-color: var(--border-subtle);
    background: var(--bg-deep);
    position: relative;
    overflow: hidden;
}

html[data-ui-theme="clair"] .form-card::after {
    content: "";
    position: absolute;
    right: -2.5rem;
    bottom: -2.5rem;
    width: 7.5rem;
    height: 7.5rem;
    background: center / contain no-repeat var(--theme-filigree);
    opacity: 0.07;
    pointer-events: none;
}

html[data-ui-theme="clair"] .form-card-title,
html[data-ui-theme="clair"] .comms-card__head h2 {
    font-family: var(--font-display);
    font-weight: 600;
    color: var(--muted);
}

html[data-ui-theme="clair"] th {
    background: var(--panel-elevated);
    color: var(--muted);
}

html[data-ui-theme="clair"] tr:hover td {
    background: color-mix(in srgb, var(--accent) 5%, var(--bg-deep));
}

html[data-ui-theme="clair"] .flash-success {
    border-color: var(--flash-success-border);
    background: var(--flash-success-bg);
    color: var(--text-flash-success);
}

html[data-ui-theme="clair"] .flash-danger {
    border-color: var(--flash-danger-border);
    background: var(--flash-danger-bg);
    color: var(--text-flash-danger);
}

html[data-ui-theme="clair"] .flash-info {
    border-color: var(--flash-info-border);
    background: var(--flash-info-bg);
    color: var(--text-flash-info);
}

html[data-ui-theme="clair"] button,
html[data-ui-theme="clair"] .btn {
    border-radius: var(--radius-md);
}

html[data-ui-theme="clair"] button:not(.secondary):not(.danger):not(.app-header__logout):not(.app-nav-toggle):not(.app-nav-dropdown__trigger):not(.exp-action-btn):not(.app-header__tool-link):not(.ui-theme-toggle):not(.preview-banner__exit):not(.invite-list-meal-icon),
html[data-ui-theme="clair"] .btn:not(.secondary):not(.danger):not(.invite-list-meal-icon) {
    background: var(--primary-container);
    color: var(--accent-on);
}

html[data-ui-theme="clair"] button.secondary,
html[data-ui-theme="clair"] .btn.secondary {
    background: var(--btn-secondary);
    color: var(--text-on-secondary-btn);
    border: 1px solid color-mix(in srgb, var(--ok) 35%, transparent);
}

html[data-ui-theme="clair"] .count-chip {
    color: var(--text-link);
    background: var(--chip-accent-bg);
    border-color: var(--chip-accent-border);
}

html[data-ui-theme="clair"] .count-chip--muted {
    color: var(--text-muted);
    background: var(--chip-muted-bg);
    border-color: var(--chip-muted-border);
}

html[data-ui-theme="clair"] .count-chip--ok {
    color: var(--text-ok);
    background: var(--chip-ok-bg);
    border-color: var(--chip-ok-border);
}

html[data-ui-theme="clair"] .count-chip--pending {
    color: var(--text-pending);
    background: var(--chip-pending-bg);
    border-color: var(--chip-pending-border);
}

html[data-ui-theme="clair"] .comms-stat-panel {
    background: var(--primary-container);
    color: var(--text-on-primary-container);
    border: none;
}

html[data-ui-theme="clair"] .comms-stat-panel::before {
    background-image: var(--theme-filigree);
    opacity: 0.2;
}

html[data-ui-theme="clair"] .ui-theme-toggle.is-clair,
html[data-ui-theme="clair"] .ui-theme-toggle.is-heritage,
html[data-ui-theme="heritage"] .ui-theme-toggle.is-heritage,
html[data-ui-theme="heritage"] .ui-theme-toggle.is-clair {
    background: var(--tool-link-active-bg);
    border-color: var(--tool-link-active-border);
    color: var(--accent);
}

html[data-ui-theme="clair"] body.public-layout main,
html[data-ui-theme="clair"] body.auth-layout .auth-page-wrap {
    position: relative;
    z-index: 1;
}

html[data-ui-theme="clair"] body.public-layout details.invite-section {
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-card);
    border-top: 2px solid color-mix(in srgb, var(--accent) 40%, var(--border-subtle));
    background: var(--bg-deep);
}

html[data-ui-theme="clair"] .skip-link {
    color: var(--accent-on);
}

html[data-ui-theme="clair"] tbody tr:hover {
    background: color-mix(in srgb, var(--accent) 4%, transparent);
}
