/* ══════════════════════════════════════════════════════════
   IZ-ORGANIZER.CSS  —  Interface organisateur Izibillet
   Mobile-first · minimaliste éditorial · rouge = signal
   Breakpoints : 480 · 640 · 768 · 1024px
   ══════════════════════════════════════════════════════════ */

/* ══ DESIGN TOKENS ══════════════════════════════════════════ */
:root {
    --ink: #0a0a0a;
    --ink-2: #1f1f1f;
    --muted: #6b6b6b;
    --muted-2: #9a9a9a;
    --muted-3: #c4c4c4;
    --line: #ececec;
    --line-2: #f4f4f4;
    --bg: #fafafa;
    --bg-2: #f6f6f6;
    --surface: #ffffff;
    --blue: #1e3a8a;
    --blue-2: #2e4fb8;
    --blue-bg: #eef2ff;
    --red: #E8192C;
    --red-2: #c81528;
    --red-lt: #fef1f2;
    --red-mid: #fecdd3;
    --success: #16794a;
    --succ-bg: #ecfdf5;
    --warning: #92400e;
    --warn-bg: #fffbeb;
    --info: #1e40af;
    --info-bg: #eff6ff;
    --violet: #7C3AED;
    --violet-2: #6D28D9;
    --violet-bg: #f5f3ff;
    --violet-mid: #ddd6fe;
    /* Aliases */
    --dark: var(--ink);
    --dark-2: var(--ink-2);
    --muted-lt: var(--muted-2);
    --border: var(--line);
    --white: var(--surface);
    --accent: var(--red);
    --accent-bg: var(--red-lt);
    --success-bg: var(--succ-bg);
    --warning-bg: var(--warn-bg);
    /* Radius */
    --r-sm: 6px;
    --r: 10px;
    --r-md: 10px;
    --r-lg: 14px;
    /* Shadow */
    --sh-sm: 0 1px 2px rgba(0, 0, 0, .04);
    --sh-md: 0 2px 8px rgba(0, 0, 0, .05);
    --sh-lg: 0 4px 16px rgba(0, 0, 0, .08);
    /* Transition */
    --t: .18s ease;
}

/* ══ BASE ════════════════════════════════════════════════════ */
*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    font-family: 'Montserrat', -apple-system, sans-serif;
    background: var(--bg);
    color: var(--ink);
    margin: 0;
    -webkit-font-smoothing: antialiased;
    font-feature-settings: 'cv11', 'ss01';
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Syne', sans-serif;
    font-weight: 500;
    letter-spacing: -0.01em;
}

/* ══ PAGE WRAPPERS ═══════════════════════════════════════════ */
.pw {
    padding: 1rem .9rem 2rem;
    max-width: 1240px;
    margin: 0 auto;
}

.page {
    max-width: 1240px;
    margin: 0 auto;
    padding: 1rem .9rem 2.5rem;
}

.page-wrapper {
    padding: 1rem .9rem 2rem;
    max-width: 1240px;
    margin: 0 auto;
}

/* ══ SHARED — SECTION CARD (.sc) ════════════════════════════ */
.sc {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r);
    overflow: hidden;
    margin-bottom: 1rem;
    transition: border-color var(--t);
}

.sc:hover {
    border-color: var(--muted-3);
}

.sc-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .8rem .9rem;
    border-bottom: 1px solid var(--line);
    background: transparent;
    flex-wrap: wrap;
}

.sc-head:has(.fin-tab-nav) {
    padding: 0 .9rem;
}

.sc-head-left {
    display: flex;
    align-items: center;
    gap: .65rem;
}

.sc-head-icon {
    width: 30px;
    height: 30px;
    border-radius: var(--r-sm);
    background: var(--blue-bg);
    color: var(--blue);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .85rem;
    flex-shrink: 0;
}

.sc-title {
    font-family: 'Montserrat', sans-serif;
    font-size: .875rem;
    font-weight: 500;
    color: var(--ink);
    margin: 0;
    line-height: 1.2;
}

.sc-sub {
    font-size: .72rem;
    color: var(--muted-2);
    margin: .15rem 0 0;
}

.sc-body {
    padding: .9rem;
}

/* ══ SHARED — KPI ════════════════════════════════════════════ */
.kpi {
    background: var(--bg-2);
    border-radius: var(--r);
    padding: .85rem .9rem;
    border: 1px solid transparent;
    transition: border-color var(--t), background var(--t);
    position: relative;
}

.kpi:hover {
    border-color: var(--blue-bg);
}

.kpi.highlight {
    background: var(--surface);
    border-color: var(--line);
}

.kpi.highlight:hover {
    border-color: var(--blue-bg);
}

.kpi.highlight .kpi-value,
.kpi.highlight .kpi-val {
    color: var(--blue);
}

/* Dashboard variant */
.kpi--highlight {
    background: var(--blue-bg);
    border-color: #c7d7f7;
}

.kpi--highlight:hover {
    border-color: var(--blue);
}

.kpi--highlight .kpi-lbl {
    color: var(--blue);
    opacity: .8;
}

/* Semantic value states */
.kpi-val--blue {
    color: var(--blue);
}

.kpi-val--ok {
    color: var(--success);
}

.kpi-val--warn {
    color: var(--warning);
}

.kpi-val--bad {
    color: var(--red);
}

/* Shared KPI text */
.kpi-label {
    font-size: .72rem;
    color: var(--muted);
    margin-bottom: .4rem;
}

.kpi-value {
    font-family: 'Inter', sans-serif;
    font-size: 1.3rem;
    font-weight: 500;
    color: var(--ink);
    line-height: 1;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
    margin-bottom: .3rem;
}

.kpi-value small {
    font-size: .65rem;
    color: var(--muted-2);
    font-weight: 400;
    margin-left: .15rem;
}

.kpi-sub {
    font-size: .68rem;
    color: var(--muted-2);
}

.kpi-wm { display: none; }
.kpi-icon {
    display: flex;
    width: 28px;
    height: 28px;
    border-radius: var(--r-sm);
    background: rgba(0, 0, 0, .04);
    color: var(--muted-2);
    align-items: center;
    justify-content: center;
    font-size: .8rem;
    margin-bottom: .5rem;
    flex-shrink: 0;
}
.kpi.highlight  .kpi-icon { background: var(--blue-bg); color: var(--blue); }
.kpi--highlight .kpi-icon { background: rgba(30, 58, 138, .12); color: var(--blue); }

/* kept for legacy — was display:none placeholder */
.kpi-icon-legacy {
    display: none;
}

/* Dashboard KPI text */
.kpi-lbl {
    font-size: .72rem;
    color: var(--muted);
    margin: 0 0 .4rem;
}

.kpi-val {
    font-size: 1.3rem;
    font-weight: 500;
    color: var(--ink);
    margin: 0;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.kpi-hint {
    font-size: .6875rem;
    color: var(--muted-2);
    margin: .3rem 0 0;
}

/* KPI strips — mobile: 2 colonnes */
.kpi-strip {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .6rem;
    margin-bottom: 1.25rem;
}

.kpi-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .6rem;
    margin-bottom: 1.75rem;
}

/* ══ SHARED — MODAL ═════════════════════════════════════════ */
.modal-content {
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    overflow: hidden;
    box-shadow: var(--sh-lg);
}

.modal-header {
    background: transparent;
    border-bottom: 1px solid var(--line);
    padding: 1rem 1.25rem;
}

.modal-title {
    font-family: 'Montserrat', sans-serif;
    font-size: .9rem;
    font-weight: 500;
    color: var(--ink);
}

.modal-footer {
    border-top: 1px solid var(--line);
    padding: .85rem 1.25rem;
    background: var(--bg-2);
}

/* ══ SHARED — FORMS ══════════════════════════════════════════ */
.form-label {
    font-size: .8rem;
    font-weight: 500;
    color: var(--ink);
    margin-bottom: .35rem;
}

.form-label .req {
    color: var(--red);
    font-weight: 400;
    margin-left: .15rem;
}

.form-control,
.form-select {
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    font-family: 'Montserrat', sans-serif;
    font-size: .85rem;
    padding: .55rem .85rem;
    background: var(--surface);
    color: var(--ink);
    transition: border-color .15s, box-shadow .15s;
    outline: none;
    width: 100%;
    min-height: 42px;
}

.form-control:hover,
.form-select:hover {
    border-color: var(--muted-3);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(30, 58, 138, .08);
}

.form-control::placeholder {
    color: var(--muted-2);
}

textarea.form-control {
    resize: vertical;
    min-height: 80px;
}

/* ══ SHARED — DATATABLES ═════════════════════════════════════ */
.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input {
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    font-family: 'Montserrat', sans-serif;
    font-size: .8125rem;
    padding: .3rem .65rem;
    background: var(--surface);
}

.dataTables_wrapper .dataTables_filter input:focus {
    border-color: var(--blue);
    outline: none;
}

table.dataTable thead th {
    font-family: 'Montserrat', sans-serif;
    font-size: .7rem;
    font-weight: 500 !important;
    letter-spacing: .03em;
    color: var(--muted) !important;
    background: transparent !important;
    border-bottom: 1px solid var(--line) !important;
    padding: .75rem 1rem;
    text-transform: none;
}

table.dataTable tbody td {
    font-size: .85rem;
    padding: .75rem 1rem;
    border-color: var(--line);
    color: var(--ink);
}

table.dataTable tbody tr:hover td {
    background: var(--bg-2);
}

table.dataTable.no-footer {
    border-bottom-color: var(--line);
}

.dt-buttons {
    display: none !important;
}

/* ══ SHARED — DROPDOWN ═══════════════════════════════════════ */
.dropdown-menu {
    border: 1px solid var(--line);
    border-radius: var(--r);
    box-shadow: 0 4px 16px rgba(0, 0, 0, .06);
    padding: .35rem;
    font-size: .82rem;
    min-width: 180px;
}

.dropdown-item {
    border-radius: 4px;
    padding: .5rem .65rem;
    color: var(--ink);
    font-size: .8rem;
    transition: background .15s;
    display: flex;
    align-items: center;
    gap: .4rem;
    min-height: 40px;
}

.dropdown-item:hover {
    background: var(--blue-bg);
    color: var(--blue);
}

.dropdown-item i {
    font-size: .85rem;
    opacity: .8;
}

.dropdown-divider {
    border-color: var(--line);
    margin: .25rem 0;
}

/* ════════════════════════════════════════════════════════════
   DASHBOARD  (organizer/dashboard)
   ════════════════════════════════════════════════════════════ */

/* mobile: colonne, titre seul */
.head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .75rem;
    margin-bottom: 1.5rem;
}

.head-date {
    font-size: 11px;
    color: var(--muted-2);
    margin: 0 0 .25rem;
    letter-spacing: .04em;
    text-transform: capitalize;
}

.head-title {
    font-family: 'Inter', sans-serif;
    font-size: 1.4rem;
    font-weight: 500;
    color: var(--ink);
    margin: 0;
    line-height: 1.2;
    letter-spacing: -0.01em;
}

.head-sub {
    font-size: .8125rem;
    color: var(--muted);
    margin: .3rem 0 0;
}

.head-sub strong {
    color: var(--accent);
    font-weight: 500;
}

.head-actions {
    display: flex;
    gap: .4rem;
    flex-wrap: wrap;
}

.btn {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    min-height: 40px;
    padding: 0 .9rem;
    background: var(--surface);
    color: var(--ink);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    font-family: inherit;
    font-size: .8125rem;
    font-weight: 500;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    transition: var(--t);
}

.btn:hover {
    border-color: var(--blue);
    background: var(--blue-bg);
    color: var(--blue);
}

.btn-dark {
    background: var(--ink);
    color: #fff;
    border-color: var(--ink);
}

.btn-dark:hover {
    background: var(--ink-2);
    border-color: var(--ink-2);
    color: #fff;
}

.btn i {
    font-size: .85rem;
}

.section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: .75rem;
}

.section-label {
    font-size: .8125rem;
    color: var(--muted);
    margin: 0;
    font-weight: 400;
}

.section-link {
    font-size: .75rem;
    color: var(--muted);
    text-decoration: none;
    transition: color var(--t);
}

.section-link:hover {
    color: var(--blue);
}

.actions {
    margin-bottom: 1.75rem;
}

.action-list {
    display: flex;
    flex-direction: column;
    gap: .45rem;
}

.action-row {
    display: flex;
    align-items: center;
    gap: .85rem;
    padding: .8rem .9rem;
    background: var(--surface);
    border: 1px solid var(--line);
    border-left: 2px solid var(--muted-3);
    border-radius: 0 var(--r-md) var(--r-md) 0;
    transition: var(--t);
    text-decoration: none;
    color: inherit;
    min-height: 52px;
}

.action-row:hover {
    border-color: var(--muted-3);
    background: var(--surface);
    transform: translateX(2px);
}

.action-row.urgent {
    border-left-color: var(--accent);
}

.action-row.warning {
    border-left-color: var(--warning);
}

.action-row.info {
    border-left-color: var(--info);
}

.action-day {
    font-size: .6875rem;
    font-weight: 500;
    padding: .25rem .5rem;
    border-radius: var(--r-sm);
    min-width: 52px;
    text-align: center;
    background: var(--bg-2);
    color: var(--muted);
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.action-row.urgent .action-day {
    background: var(--accent-bg);
    color: var(--accent);
}

.action-row.warning .action-day {
    background: var(--warning-bg);
    color: var(--warning);
}

.action-row.info .action-day {
    background: var(--info-bg);
    color: var(--info);
}

.action-body {
    flex: 1;
    min-width: 0;
}

.action-name {
    font-size: .8125rem;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--ink);
    margin: 0 0 .15rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.action-meta {
    font-size: .72rem;
    color: var(--muted);
    margin: 0;
}

.action-cta {
    display: none;
}

.hero {
    margin-bottom: 1.75rem;
    padding-bottom: 1.75rem;
    border-bottom: 1px solid var(--line);
}

.hero-label {
    font-size: .8125rem;
    color: var(--muted);
    margin: 0;
    display: flex;
    align-items: baseline;
    gap: .65rem;
}

.hero-delta {
    font-size: .75rem;
    color: var(--blue);
    font-weight: 500;
}

.hero-delta.neg {
    color: var(--accent);
}

.hero-value {
    font-family: 'Instrument Serif', Georgia, serif;
    font-size: 2.25rem;
    font-weight: 400;
    color: var(--blue);
    margin: .3rem 0 .3rem;
    line-height: 1;
    letter-spacing: -0.02em;
    font-feature-settings: 'lnum', 'tnum';
}

.hero-value .unit {
    font-family: 'Inter', sans-serif;
    font-size: .9rem;
    color: var(--muted-2);
    font-weight: 400;
    letter-spacing: 0;
    margin-left: .25rem;
}

.hero-sub {
    font-size: .8125rem;
    color: var(--muted-2);
    margin: 0;
}

.block {
    margin-bottom: 2rem;
}

.block:last-child {
    margin-bottom: 0;
}

.seg {
    display: inline-flex;
    background: var(--bg-2);
    border-radius: var(--r-sm);
    padding: 2px;
    gap: 2px;
}

.seg button {
    font-family: inherit;
    font-size: .6875rem;
    font-weight: 500;
    padding: .3rem .65rem;
    border: none;
    background: transparent;
    color: var(--muted);
    border-radius: 4px;
    cursor: pointer;
    transition: var(--t);
    min-height: 32px;
}

.seg button:hover {
    color: var(--ink);
}

.seg button.active {
    background: var(--surface);
    color: var(--ink);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
}

.chart-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: 1rem .9rem .85rem;
}

.apexcharts-toolbar {
    display: none !important;
}

.apexcharts-tooltip {
    font-family: 'Inter', sans-serif !important;
    border-radius: 8px !important;
    border: 1px solid var(--line) !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .06) !important;
}

/* mobile: colonne */
.split-2 {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

.tt-row {
    margin-bottom: 1.1rem;
}

.tt-row:last-child {
    margin-bottom: 0;
}

.tt-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: .45rem;
}

.tt-name {
    font-size: .875rem;
    color: var(--ink);
    font-weight: 500;
}

.tt-pct {
    font-size: .8125rem;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
}

.tt-track {
    height: 4px;
    background: var(--line-2);
    border-radius: 2px;
    overflow: hidden;
}

.tt-fill {
    height: 100%;
    border-radius: 2px;
    width: 0;
    transition: width 1.1s .2s cubic-bezier(.34, 1.56, .64, 1);
}

.tt-fill.digital {
    background: var(--blue);
}

.tt-fill.physical {
    background: var(--ink);
}

.tt-detail {
    display: flex;
    gap: 1rem;
    margin-top: .5rem;
    font-size: .72rem;
    color: var(--muted-2);
    flex-wrap: wrap;
}

.tt-detail span {
    font-variant-numeric: tabular-nums;
}

.tt-detail strong {
    color: var(--ink);
    font-weight: 500;
}

.tt-detail .sep {
    color: var(--muted-3);
}

.pm-list {
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.pm-row {
    display: grid;
    grid-template-columns: 1fr auto auto;
    align-items: center;
    gap: .65rem;
    font-size: .8125rem;
}

.pm-name {
    color: var(--ink);
    font-weight: 400;
    text-transform: capitalize;
}

.pm-amount {
    font-size: .72rem;
    color: var(--muted-2);
    font-variant-numeric: tabular-nums;
}

.pm-pct {
    font-size: .8125rem;
    font-weight: 500;
    color: var(--ink);
    min-width: 36px;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* top-table — mobile: sans top-val */
.top-table {
    display: flex;
    flex-direction: column;
}

.top-row {
    display: grid;
    grid-template-columns: 28px 1fr auto;
    align-items: center;
    gap: .75rem;
    padding: .8rem 0;
    border-bottom: 1px solid var(--line);
    text-decoration: none;
    color: inherit;
    transition: var(--t);
}

.top-row:last-child {
    border-bottom: none;
}

.top-row:hover {
    padding-left: .25rem;
}

.top-row:first-child .top-rank {
    color: var(--blue);
    font-weight: 500;
}

.top-row:first-child .top-share {
    color: var(--blue);
}

.top-rank {
    font-family: 'JetBrains Mono', monospace;
    font-size: .72rem;
    color: var(--muted-2);
    font-variant-numeric: tabular-nums;
}

.top-name {
    font-size: .875rem;
    color: var(--ink);
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.top-val {
    display: none;
}

.top-share {
    font-size: .8125rem;
    color: var(--ink);
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    min-width: 46px;
    text-align: right;
}

.upcoming-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: .65rem;
}

.upcoming-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-md);
    padding: .9rem 1rem;
    text-decoration: none;
    color: inherit;
    transition: var(--t);
    display: flex;
    flex-direction: column;
    gap: .6rem;
}

.upcoming-card:hover {
    border-color: var(--muted-3);
    transform: translateY(-1px);
}

.upcoming-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .5rem;
}

.upcoming-name {
    font-size: .875rem;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--ink);
    margin: 0;
    line-height: 1.3;
    flex: 1;
    min-width: 0;
}

.upcoming-day {
    font-size: .6875rem;
    font-weight: 500;
    padding: .2rem .5rem;
    border-radius: var(--r-sm);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.upcoming-day.urgent {
    background: var(--accent-bg);
    color: var(--accent);
}

.upcoming-day.warning {
    background: var(--warning-bg);
    color: var(--warning);
}

.upcoming-day.ok {
    background: var(--success-bg);
    color: var(--success);
}

.upcoming-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .2rem .65rem;
    font-size: .72rem;
    color: var(--muted);
}

.upcoming-meta i {
    font-size: .7rem;
    color: var(--muted-2);
    margin-right: .2rem;
}

.upcoming-fill {
    margin-top: .15rem;
}

.upcoming-fill-head {
    display: flex;
    justify-content: space-between;
    font-size: .7rem;
    color: var(--muted-2);
    margin-bottom: .3rem;
}

.upcoming-fill-head strong {
    color: var(--ink);
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.upcoming-fill-track {
    height: 3px;
    background: var(--line-2);
    border-radius: 2px;
    overflow: hidden;
}

.upcoming-fill-bar {
    height: 100%;
    border-radius: 2px;
    background: var(--ink);
    width: 0;
    transition: width 1s .3s cubic-bezier(.34, 1.56, .64, 1);
}

.upcoming-fill-bar.low {
    background: var(--accent);
}

.upcoming-fill-bar.mid {
    background: var(--warning);
}

.upcoming-fill-bar.high {
    background: var(--success);
}

.upcoming-empty {
    grid-column: 1 / -1;
    text-align: center;
    color: var(--muted-2);
    padding: 2.5rem 1rem;
    font-size: .875rem;
    background: var(--bg-2);
    border-radius: var(--r-md);
}

/* mobile: participation en colonne */
.part-wrap {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
    align-items: center;
}

.part-figure {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1.25rem;
}

.part-rate {
    font-family: 'Instrument Serif', Georgia, serif;
    font-size: 2.75rem;
    font-weight: 400;
    color: var(--blue);
    line-height: 1;
    letter-spacing: -0.02em;
}

.part-rate-lbl {
    font-size: .72rem;
    color: var(--muted-2);
    margin-top: .3rem;
}

.part-rate-context {
    font-size: .72rem;
    color: var(--muted);
    margin-top: .5rem;
    font-variant-numeric: tabular-nums;
}

.part-bars {
    display: flex;
    flex-direction: column;
    gap: .8rem;
}

.part-bar-row {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: .65rem;
}

.part-bar-name {
    font-size: .8125rem;
    color: var(--muted);
}

.part-bar-pct {
    font-size: .8125rem;
    color: var(--ink);
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    min-width: 36px;
    text-align: right;
}

.part-bar-track {
    grid-column: 1 / -1;
    height: 3px;
    background: var(--line-2);
    border-radius: 2px;
    overflow: hidden;
    margin-top: -.2rem;
}

.part-bar-fill {
    height: 100%;
    border-radius: 2px;
    background: var(--blue);
    width: 0;
    transition: width 1s .3s cubic-bezier(.34, 1.56, .64, 1);
}

.tab-pane {
    display: none;
}

.tab-pane.active {
    display: block;
}

.info-banner {
    background: var(--surface);
    border-bottom: 1px solid var(--line);
    padding: .6rem .9rem;
    font-size: .72rem;
    color: var(--muted);
    display: flex;
    align-items: center;
    gap: .4rem;
}

.info-banner i {
    color: var(--muted-2);
    flex-shrink: 0;
}

.info-banner .btn-close {
    margin-left: auto;
    opacity: .4;
    font-size: .65rem;
}

/* ════════════════════════════════════════════════════════════
   EVENTS LIST  (organizer/event/index)
   ════════════════════════════════════════════════════════════ */

.alert-banner {
    background: var(--surface);
    border: none;
    border-bottom: 1px solid var(--line);
    border-left: 2px solid var(--red);
    border-radius: 0;
    padding: .6rem .9rem;
    font-size: .78rem;
    color: var(--muted);
    display: flex;
    align-items: center;
    gap: .4rem;
}

.alert-banner i {
    color: var(--red);
    flex-shrink: 0;
}

.alert-banner strong {
    color: var(--ink);
    font-weight: 500;
}

.alert-banner .btn-close {
    margin-left: auto;
    opacity: .4;
    font-size: .65rem;
}

/* mobile: colonne */
.page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .65rem;
    margin-bottom: 1.25rem;
    flex-wrap: nowrap;
}

.page-date {
    font-size: 11px;
    color: var(--muted-2);
    margin: 0 0 .25rem;
    letter-spacing: .04em;
    text-transform: capitalize;
}

.page-title {
    font-family: 'Instrument Serif', Georgia, serif;
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--ink);
    margin: 0;
    line-height: 1;
    letter-spacing: -0.015em;
    display: flex;
    align-items: baseline;
    gap: .4rem;
    flex-wrap: wrap;
}

.count-chip {
    font-family: 'Syne', sans-serif;
    font-size: .75rem;
    font-weight: 400;
    color: var(--muted-2);
    letter-spacing: 0;
}

.view-toggle {
    display: inline-flex;
    background: var(--bg-2);
    border-radius: var(--r-sm);
    padding: 2px;
    gap: 2px;
    flex-shrink: 0;
}

.view-btn {
    width: 34px;
    height: 30px;
    border-radius: 4px;
    border: none;
    background: transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .85rem;
    color: var(--muted);
    transition: var(--t);
}

.view-btn:hover {
    color: var(--ink);
}

.view-btn.on {
    background: var(--surface);
    color: var(--ink);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
}

/* filter-bar : flex + wrap, mobile friendly */
.filter-bar {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r);
    padding: .65rem .75rem;
    margin-bottom: .85rem;
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    align-items: center;
}

.f-group {
    display: flex;
    align-items: center;
    gap: .35rem;
}

.f-label {
    font-size: .72rem;
    color: var(--muted);
    white-space: nowrap;
}

.f-input {
    height: 36px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    font-family: 'Syne', sans-serif;
    font-size: .8125rem;
    color: var(--ink);
    padding: 0 .7rem;
    outline: none;
    transition: border-color .15s;
}

.f-input:focus {
    border-color: var(--blue);
}

.f-input::placeholder {
    color: var(--muted-2);
}

.search-wrap {
    position: relative;
    flex: 1;
    min-width: 150px;
}

.search-wrap i {
    position: absolute;
    left: .65rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--muted-2);
    font-size: .8rem;
    pointer-events: none;
}

.search-wrap .f-input {
    padding-left: 1.9rem;
    width: 100%;
}

input[type="date"].f-input {
    width: 136px;
}

.date-sep {
    font-size: .78rem;
    color: var(--muted-2);
}

.btn-bar {
    height: 36px;
    padding: 0 .75rem;
    border-radius: var(--r-sm);
    border: 1px solid var(--line);
    font-family: 'Syne', sans-serif;
    font-size: .8125rem;
    display: flex;
    align-items: center;
    gap: .3rem;
    cursor: pointer;
    transition: var(--t);
    white-space: nowrap;
    background: var(--surface);
    color: var(--muted);
}

.btn-bar:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.btn-bar.on {
    background: var(--blue-bg);
    border-color: var(--blue-bg);
    color: var(--blue);
}

.adv-count {
    background: var(--blue);
    color: #fff;
    font-size: .62rem;
    font-weight: 500;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-variant-numeric: tabular-nums;
}

.btn-export {
    height: 36px;
    padding: 0 .9rem;
    border: 1px solid var(--ink);
    border-radius: var(--r-sm);
    background: var(--ink);
    color: #fff;
    font-family: 'Syne', sans-serif;
    font-size: .8125rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: .3rem;
    cursor: pointer;
    transition: var(--t);
    white-space: nowrap;
    margin-left: 0;
}

.btn-export:hover {
    background: var(--blue);
    border-color: var(--blue);
}

.per-page-sel {
    height: 36px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    font-family: 'Syne', sans-serif;
    font-size: .8rem;
    color: var(--ink);
    padding: 0 .5rem;
    cursor: pointer;
    outline: none;
}

.per-page-sel:focus {
    border-color: var(--blue);
}

.adv-panel {
    border-top: 1px solid var(--line);
    padding-top: .65rem;
    margin-top: .1rem;
    width: 100%;
    display: none;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
}

.adv-panel.open {
    display: flex;
}

.btn-reset {
    height: 34px;
    padding: 0 .8rem;
    border: 1px dashed var(--muted-3);
    border-radius: var(--r-sm);
    background: transparent;
    font-family: 'Syne', sans-serif;
    font-size: .78rem;
    color: var(--muted);
    cursor: pointer;
    transition: var(--t);
    display: inline-flex;
    align-items: center;
    gap: .3rem;
}

.btn-reset:hover {
    border-color: var(--muted);
    border-style: solid;
    color: var(--ink);
}

.sort-bar {
    display: flex;
    align-items: center;
    gap: .35rem;
    margin-bottom: .85rem;
    font-size: .78rem;
    color: var(--muted);
    flex-wrap: wrap;
}

.sort-bar>span {
    margin-right: .1rem;
}

.sort-btn {
    height: 30px;
    padding: 0 .75rem;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    font-family: 'Syne', sans-serif;
    font-size: .75rem;
    font-weight: 400;
    color: var(--muted);
    cursor: pointer;
    transition: var(--t);
    display: flex;
    align-items: center;
    gap: .3rem;
}

.sort-btn i {
    font-size: .72rem;
}

.sort-btn.on {
    background: var(--ink);
    border-color: var(--ink);
    color: #fff;
    font-weight: 500;
}

.sort-btn:hover:not(.on) {
    border-color: var(--muted-3);
    color: var(--ink);
}

.events-list {
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

/* event-card mobile: image en haut, corps en bas */
.event-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr;
    transition: border-color var(--t), transform var(--t), box-shadow var(--t);
    opacity: 0;
    transform: translateY(12px);
}

.event-card.in {
    animation: cardIn .35s ease forwards;
}

.event-card:hover {
    border-color: var(--blue-bg);
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(0, 0, 0, .04);
}

.event-hero {
    position: relative;
    background-color: var(--bg-2);
    min-height: 150px;
    overflow: hidden;
}

.event-hero-img,
.event-hero-svg-placeholder {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}

.event-hero-img {
    object-fit: cover;
}

.event-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, transparent 30%, rgba(0, 0, 0, .55) 100%);
    z-index: 1;
}

.event-hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .05);
    opacity: 0;
    transition: opacity var(--t);
    z-index: 2;
}

.event-card:hover .event-hero::after {
    opacity: 1;
}

.event-hero-date {
    position: absolute;
    bottom: 12px;
    left: 14px;
    right: 14px;
    color: #fff;
    line-height: 1;
    z-index: 3;
}

.event-hero-month {
    font-size: 10px;
    letter-spacing: .08em;
    text-transform: uppercase;
    opacity: .85;
    margin-bottom: 2px;
}

.event-hero-day {
    font-family: 'Instrument Serif', Georgia, serif;
    font-size: 30px;
    font-weight: 400;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
}

.event-hero-time {
    font-size: 11px;
    opacity: .8;
    margin-top: 2px;
    font-variant-numeric: tabular-nums;
}

.event-body {
    padding: .9rem 1rem 1rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-width: 0;
    gap: .75rem;
}

.event-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .65rem;
}

.event-top-main {
    flex: 1;
    min-width: 0;
}

.event-name {
    font-family: 'Syne', sans-serif;
    font-size: .95rem;
    font-weight: 500;
    color: var(--ink);
    text-decoration: none;
    text-transform: uppercase;
    text-transform: uppercase;
    transition: color var(--t);
    line-height: 1.3;
    display: block;
    margin-bottom: .2rem;
}

.event-name:hover {
    color: var(--blue);
}

.event-sub {
    font-size: .75rem;
    color: var(--muted);
    display: flex;
    flex-wrap: wrap;
    gap: .15rem .45rem;
    align-items: center;
}

.event-sub .dot {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--muted-3);
    display: inline-block;
}

.event-top-actions {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-shrink: 0;
}

.s-badge {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .15rem .5rem;
    border-radius: 50px;
    font-size: .67rem;
    font-weight: 500;
    white-space: nowrap;
    background: var(--bg-2);
}

.s-badge::before {
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
}

.s-pub {
    color: var(--success);
}

.s-draft {
    color: var(--warning);
}

.s-bloc {
    color: var(--red);
}

.s-test {
    color: var(--info);
}

.btn-act {
    width: 32px;
    height: 32px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: .85rem;
    color: var(--muted);
    transition: var(--t);
}

.btn-act:hover {
    border-color: var(--blue);
    color: var(--blue);
    background: var(--blue-bg);
}

.cat-pill {
    display: inline-flex;
    align-items: center;
    padding: 0 .5rem;
    border-radius: 50px;
    font-size: .67rem;
    font-weight: 400;
    color: var(--muted);
    text-transform: capitalize;
    background: var(--bg-2);
    line-height: 18px;
}

/* event-stats mobile: 2 colonnes, divider caché */
.event-stats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: .65rem;
    padding-top: .75rem;
    border-top: 1px solid var(--line-2);
}

.stat-cell {
    display: flex;
    flex-direction: column;
    gap: .2rem;
}

.stat-cell-lbl {
    font-size: 10px;
    color: var(--muted-2);
    letter-spacing: .04em;
    text-transform: uppercase;
}

.stat-cell-val {
    font-family: 'Syne', sans-serif;
    font-size: .95rem;
    font-weight: 500;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.stat-cell-val small {
    font-size: 10px;
    color: var(--muted-2);
    font-weight: 400;
    margin-left: .15rem;
}

.stat-cell-val.blue {
    color: var(--blue);
}

.stat-cell-val.green {
    color: var(--success);
}

.stat-divider {
    display: none;
}

.prog-inline {
    grid-column: 1 / -1;
    min-width: 0;
    margin-top: .15rem;
}

.prog-inline-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: .3rem;
}

.prog-inline-head .lbl {
    font-size: 10px;
    color: var(--muted-2);
    letter-spacing: .04em;
    text-transform: uppercase;
}

.prog-inline-head .val {
    font-size: .78rem;
    font-weight: 500;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

.prog-track {
    height: 3px;
    background: var(--line-2);
    border-radius: 2px;
    overflow: hidden;
}

.prog-fill {
    height: 100%;
    border-radius: 2px;
    background: var(--red);
    transition: width 1s .3s cubic-bezier(.34, 1.56, .64, 1);
    width: 0;
}

.prog-fill.s {
    background: var(--success);
}

.prog-fill.w {
    background: var(--warning);
}

.sparkline-wrap {
    display: none;
}

/* grid-view mobile: 1 col */
.events-list.grid-view {
    display: grid;
    grid-template-columns: 1fr;
    gap: .65rem;
}

.events-list.grid-view .event-card {
    grid-template-columns: 1fr;
    grid-template-rows: 160px 1fr;
}

.events-list.grid-view .event-hero {
    min-height: 160px;
}

.events-list.grid-view .event-stats {
    grid-template-columns: 1fr 1fr 1fr;
    gap: .65rem;
}

.events-list.grid-view .stat-divider {
    display: none;
}

.events-list.grid-view .prog-inline {
    grid-column: 1 / -1;
    margin-top: .25rem;
}

.pag-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 1.25rem;
    flex-wrap: wrap;
    gap: .65rem;
}

.pag-info {
    font-size: .75rem;
    color: var(--muted);
}

.pag-info b {
    color: var(--ink);
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.pag-controls {
    display: flex;
    align-items: center;
    gap: .25rem;
    flex-wrap: wrap;
}

.page-btn {
    min-width: 34px;
    height: 34px;
    padding: 0 .35rem;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .8rem;
    color: var(--muted);
    cursor: pointer;
    transition: var(--t);
    font-family: 'Syne', sans-serif;
    font-weight: 400;
    font-variant-numeric: tabular-nums;
}

.page-btn:hover:not(:disabled):not(.active) {
    border-color: var(--blue);
    color: var(--blue);
}

.page-btn.active {
    background: var(--ink);
    border-color: var(--ink);
    color: #fff;
    font-weight: 500;
}

.page-btn:disabled {
    opacity: .25;
    cursor: not-allowed;
}

.empty-state {
    text-align: center;
    padding: 2.5rem 1rem;
    background: var(--surface);
    border-radius: var(--r);
    border: 1px dashed var(--muted-3);
    display: none;
}

.empty-state i {
    font-size: 1.75rem;
    color: var(--muted-2);
    display: block;
    margin-bottom: .65rem;
}

.empty-state p {
    font-size: .875rem;
    color: var(--muted);
    margin: 0;
}

/* ════════════════════════════════════════════════════════════
   EVENT SHOW  (organizer/event/show)
   ════════════════════════════════════════════════════════════ */

.ev-hero {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-lg);
    overflow: hidden;
    margin-bottom: 1rem;
    box-shadow: var(--sh-sm);
}

.ev-hero__cover {
    position: relative;
    height: 160px;
    overflow: hidden;
    background: var(--bg-2);
}

.ev-hero__cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .5s ease;
}

.ev-hero__cover-placeholder {
    width: 100%;
    height: 100%;
    display: block;
}

.ev-hero:hover .ev-hero__cover img {
    transform: scale(1.02);
}

.ev-hero__cover-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(10, 10, 10, 0) 0%, rgba(10, 10, 10, .55) 100%);
}

.ev-hero__status {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2;
    font-size: .68rem;
    font-weight: 500;
    padding: .25rem .6rem;
    border-radius: 50px;
    background: rgba(255, 255, 255, .95);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.ev-hero__status.pub {
    color: var(--success);
}

.ev-hero__status.draft {
    color: var(--warning);
}

.ev-hero__status.bloc {
    color: var(--red);
}

.ev-hero__status.test {
    color: var(--info);
}

.ev-hero__status::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-right: .35rem;
    vertical-align: middle;
    background: currentColor;
}

/* mobile: single column body */
.ev-hero__body {
    padding: 1rem .9rem;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    align-items: start;
}

.ev-hero__name {
    font-family: 'Syne', Georgia, serif;
    text-transform: uppercase;
    font-size: 1.35rem;
    font-weight: 400;
    color: var(--ink);
    margin: 0 0 .3rem;
    line-height: 1.15;
    letter-spacing: -0.015em;
}

.ev-hero__desc {
    font-size: .8125rem;
    color: var(--muted);
    margin: 0 0 .85rem;
    line-height: 1.5;
}

.ev-hero__meta {
    display: flex;
    flex-wrap: wrap;
    gap: .3rem 1rem;
}

.ev-hero__meta-item {
    display: flex;
    align-items: center;
    gap: .3rem;
    font-size: .8rem;
    color: var(--muted);
}

.ev-hero__meta-item i {
    font-size: .8rem;
    color: var(--muted-2);
}

.ev-hero__meta-item strong {
    color: var(--ink);
    font-weight: 500;
    text-transform: capitalize;
}

/* mobile: stats en ligne horizontale */
.ev-hero__stats {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: .85rem 1.5rem;
    min-width: 0;
    border-left: none;
    border-top: 1px solid var(--line);
    padding-left: 0;
    padding-top: .85rem;
    justify-content: flex-start;
}

.ev-hero__stat-box {
    text-align: left;
    min-width: 70px;
}

.ev-hero__stat-val {
    font-family: 'Instrument Serif', Georgia, serif;
    font-size: 1.35rem;
    font-weight: 400;
    color: var(--blue);
    line-height: 1;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
}

.ev-hero__stat-val.muted {
    color: var(--ink);
}

.ev-hero__stat-lbl {
    font-size: .68rem;
    color: var(--muted-2);
    margin-top: .2rem;
    letter-spacing: .03em;
}

.ev-type-pills {
    display: flex;
    gap: .3rem;
    margin-top: .65rem;
    flex-wrap: wrap;
}

.ev-type-pill {
    font-size: .7rem;
    font-weight: 500;
    padding: .15rem .5rem;
    border-radius: 50px;
    display: inline-flex;
    align-items: center;
    gap: .25rem;
}

.pill-num {
    background: var(--blue-bg);
    color: var(--blue);
}

.pill-phy {
    background: var(--bg-2);
    color: var(--muted);
}

.ev-progress-wrap {
    margin-top: .85rem;
}

.ev-progress-lbl {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: .72rem;
    color: var(--muted-2);
    margin-bottom: .35rem;
}

.ev-progress-lbl b {
    color: var(--ink);
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.ev-progress-track {
    height: 3px;
    border-radius: 2px;
    background: var(--line-2);
    overflow: hidden;
}

.ev-progress-fill {
    height: 100%;
    border-radius: 2px;
    background: var(--blue);
    transition: width 1s .2s cubic-bezier(.34, 1.56, .64, 1);
}

.ev-alert {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    background: var(--surface);
    border: 1px solid var(--line);
    border-left: 2px solid var(--red);
    border-radius: 0 var(--r) var(--r) 0;
    padding: .65rem .85rem;
    font-size: .8rem;
    color: var(--ink);
    margin-bottom: .85rem;
}

.ev-alert i {
    color: var(--red);
    flex-shrink: 0;
    margin-top: .15rem;
    font-size: .9rem;
}

.ev-alert strong {
    font-weight: 500;
}

.ev-alert .btn-close {
    margin-left: auto;
    opacity: .4;
    font-size: .65rem;
}

.ev-tab-nav {
    display: flex;
    gap: 0;
    margin-bottom: 1.25rem;
    border-bottom: 1px solid var(--line);
    overflow-x: auto;
    scrollbar-width: none;
}

.ev-tab-nav::-webkit-scrollbar {
    display: none;
}

.ev-tab-link {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .75rem .9rem;
    font-family: 'Syne', sans-serif;
    font-size: .8rem;
    font-weight: 400;
    color: var(--muted);
    text-decoration: none;
    transition: color var(--t);
    white-space: nowrap;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
}

.ev-tab-link i {
    font-size: .85rem;
}

.ev-tab-link:hover {
    color: var(--ink);
}

.ev-tab-link.active {
    color: var(--ink);
    font-weight: 500;
    border-bottom-color: var(--blue);
}

.btn-primary-red {
    background: var(--ink);
    color: #fff;
    border: 1px solid var(--ink);
    border-radius: var(--r-sm);
    min-height: 40px;
    padding: 0 .95rem;
    font-family: 'Montserrat', sans-serif;
    font-size: .8125rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    cursor: pointer;
    transition: var(--t);
    white-space: nowrap;
}

.btn-primary-red:hover {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.btn-primary-red:disabled {
    opacity: .4;
    cursor: not-allowed;
}

.btn-ghost {
    background: var(--surface);
    color: var(--ink);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    min-height: 40px;
    padding: 0 .9rem;
    font-family: 'Montserrat', sans-serif;
    font-size: .8125rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    cursor: pointer;
    transition: var(--t);
    text-decoration: none;
}

.btn-ghost:hover {
    border-color: var(--blue);
    background: var(--blue-bg);
    color: var(--blue);
}

.btn-danger-soft {
    background: var(--surface);
    color: var(--red);
    border: 1px solid var(--red-mid);
    border-radius: var(--r-sm);
    min-height: 40px;
    padding: 0 .95rem;
    font-family: 'Montserrat', sans-serif;
    font-size: .8125rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    cursor: pointer;
    transition: var(--t);
}

.btn-danger-soft:hover {
    background: var(--red);
    color: #fff;
    border-color: var(--red);
}

.del-modal-body {
    padding: 1.75rem 1.25rem;
    text-align: center;
}

.del-modal-icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--red-lt);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
    font-size: 1.4rem;
    color: var(--red);
}

/* ════════════════════════════════════════════════════════════
   PARTICIPANTS  (organizer/event/show-sections/participant)
   ════════════════════════════════════════════════════════════ */

/* mobile: 2 colonnes */
.p-kpi-strip {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .6rem;
    margin-bottom: 1.5rem;
}

.p-kpi {
    background: var(--bg-2);
    border: 1px solid transparent;
    border-radius: var(--r);
    padding: .85rem .9rem;
    cursor: pointer;
    transition: border-color var(--t), background var(--t);
}

.p-kpi.highlight {
    background: var(--surface);
    border-color: var(--line);
}

.p-kpi.p-kpi--active {
    border-color: var(--blue) !important;
    background: var(--blue-bg) !important;
}

.p-kpi:hover {
    border-color: var(--blue-bg);
}

.p-kpi-label {
    font-size: .72rem;
    color: var(--muted);
    margin-bottom: .3rem;
}

.p-kpi-val {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    font-weight: 500;
    color: var(--ink);
    line-height: 1;
    font-variant-numeric: tabular-nums;
    margin-bottom: .25rem;
}

.p-kpi.highlight .p-kpi-val {
    color: var(--blue);
}

.p-kpi--success .p-kpi-val {
    color: var(--success);
}

.p-kpi--active .p-kpi-val {
    color: var(--blue);
}

.p-kpi-sub {
    font-size: .67rem;
    color: var(--muted-2);
}

.p-toolbar {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    padding: .75rem .9rem;
    border-bottom: 1px solid var(--line);
}

.p-search-wrap {
    position: relative;
    flex: 1;
    min-width: 150px;
}

.p-search-wrap i {
    position: absolute;
    left: .6rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--muted-2);
    font-size: .8rem;
    pointer-events: none;
}

.p-search {
    width: 100%;
    height: 38px;
    padding-left: 1.9rem;
    padding-right: .75rem;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    color: var(--ink);
    font-family: 'Montserrat', sans-serif;
    font-size: .825rem;
    outline: none;
    transition: border-color var(--t);
}

.p-search:focus {
    border-color: var(--blue);
}

.p-type-sel {
    height: 38px;
    padding: 0 .7rem;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    color: var(--ink);
    font-family: 'Montserrat', sans-serif;
    font-size: .825rem;
    outline: none;
    cursor: pointer;
}

.p-export-btn {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    height: 38px;
    padding: 0 .85rem;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    color: var(--ink);
    font-family: 'Montserrat', sans-serif;
    font-size: .8rem;
    cursor: pointer;
    transition: border-color var(--t), background var(--t);
    margin-left: 0;
}

.p-export-btn:hover {
    border-color: var(--blue);
    background: var(--blue-bg);
    color: var(--blue);
}

.p-count-chip {
    font-size: .72rem;
    color: var(--muted-2);
    margin-left: auto;
    white-space: nowrap;
}

.p-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
    flex-wrap: wrap;
    padding: .7rem .9rem;
    border-top: 1px solid var(--line);
    font-family: 'Montserrat', sans-serif;
    font-size: .8rem;
}

.p-pagination-info {
    color: var(--muted);
    white-space: nowrap;
}

.p-pagination-controls {
    display: flex;
    align-items: center;
    gap: .25rem;
    flex-wrap: wrap;
}

.p-page-btn {
    min-width: 32px;
    height: 32px;
    padding: 0 .5rem;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    color: var(--ink);
    font-family: 'Montserrat', sans-serif;
    font-size: .78rem;
    cursor: pointer;
    transition: border-color var(--t), background var(--t);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.p-page-btn:hover:not(:disabled) {
    border-color: var(--blue);
    color: var(--blue);
}

.p-page-btn.active {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.p-page-btn:disabled {
    opacity: .35;
    cursor: default;
}

.p-page-size {
    height: 30px;
    padding: 0 .5rem;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    color: var(--muted);
    font-family: 'Montserrat', sans-serif;
    font-size: .78rem;
    cursor: pointer;
}

.p-table-wrap {
    overflow-x: auto;
}

.p-table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Montserrat', sans-serif;
    font-size: .82rem;
}

.p-table th {
    padding: .6rem .9rem;
    text-align: left;
    font-size: .68rem;
    font-weight: 500;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .04em;
    border-bottom: 1px solid var(--line);
    white-space: nowrap;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
}

.p-table th:hover {
    color: var(--ink);
}

.p-table th .sort-icon {
    opacity: .35;
    margin-left: .25rem;
    font-size: .65rem;
}

.p-table th.sorted .sort-icon {
    opacity: 1;
    color: var(--blue);
}

.p-table td {
    padding: .6rem .9rem;
    border-bottom: 1px solid var(--line);
    vertical-align: middle;
    color: var(--ink);
}

.p-table tbody tr:hover td {
    background: var(--bg-2);
}

.p-table tbody tr:last-child td {
    border-bottom: none;
}

.p-avatar {
    width: 32px;
    height: 32px;
    border-radius: var(--r-sm);
    background: var(--blue-bg);
    color: var(--blue);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 500;
    font-size: .72rem;
    flex-shrink: 0;
    letter-spacing: .02em;
}

.p-avatar.phys {
    background: #fef3c7;
    color: #92400e;
}

.p-name-cell {
    display: flex;
    align-items: center;
    gap: .6rem;
    min-width: 160px;
}

.p-name {
    font-weight: 500;
    color: var(--ink);
    white-space: nowrap;
}

.p-code {
    font-size: .68rem;
    color: var(--muted-2);
    font-variant-numeric: tabular-nums;
    margin-top: .1rem;
}

.p-email {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 160px;
    color: var(--muted);
}

.p-phone {
    font-size: .75rem;
    color: var(--muted-2);
    font-variant-numeric: tabular-nums;
}

.p-pass-badge {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .15rem .5rem;
    border-radius: 50px;
    background: var(--bg-2);
    color: var(--muted);
    font-size: .67rem;
    font-weight: 500;
    white-space: nowrap;
}

.p-type-dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    display: inline-block;
}

.dot-num {
    background: var(--blue);
}

.dot-phys {
    background: #f59e0b;
}

.p-price {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.p-price-free {
    color: var(--muted-2);
}

.p-date {
    font-size: .75rem;
    color: var(--muted);
    white-space: nowrap;
}

.p-status-present {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .75rem;
    font-weight: 500;
    color: var(--success);
}

.p-status-pending {
    font-size: .75rem;
    font-weight: 500;
    color: var(--muted-2);
}

.p-scan-time {
    font-size: .67rem;
    color: var(--muted-2);
    margin-top: .1rem;
}

.p-empty {
    text-align: center;
    padding: 2.5rem 1rem;
    color: var(--muted-2);
    font-size: .875rem;
}

.p-empty i {
    font-size: 1.75rem;
    display: block;
    margin-bottom: .6rem;
    opacity: .35;
}

/* ════════════════════════════════════════════════════════════
   FINANCE  (organizer/finance/index + sub-pages)
   ════════════════════════════════════════════════════════════ */

/* mobile: colonne */
.fin-topbar {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .75rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
}

.fin-date {
    font-size: 11px;
    color: var(--muted-2);
    margin: 0 0 .25rem;
    letter-spacing: .04em;
    text-transform: capitalize;
}

.fin-title {
    font-family: 'Montserrat', Georgia, serif;
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--ink);
    margin: 0;
    line-height: 1;
    letter-spacing: -0.015em;
}

.test-badge {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .72rem;
    font-weight: 500;
    color: var(--info);
    background: var(--info-bg);
    padding: .25rem .65rem;
    border-radius: 50px;
}

.test-badge i {
    font-size: .75rem;
}

.ev-selector {
    position: relative;
}

.ev-selector-btn {
    display: flex;
    align-items: center;
    gap: .5rem;
    min-height: 42px;
    padding: 0 .85rem 0 .4rem;
    background: var(--ink);
    color: #fff;
    border: 1px solid var(--ink);
    border-radius: var(--r-sm);
    font-family: 'Montserrat', sans-serif;
    font-size: .825rem;
    font-weight: 500;
    cursor: pointer;
    transition: var(--t);
    max-width: 100%;
    width: 100%;
}

.ev-selector-btn:hover {
    background: var(--ink-2);
}

.ev-selector-img {
    width: 26px;
    height: 26px;
    border-radius: 4px;
    object-fit: cover;
    flex-shrink: 0;
}

.ev-selector-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
    text-transform: uppercase;
}

.ev-selector-meta {
    font-size: .72rem;
    opacity: .55;
    font-weight: 400;
    white-space: nowrap;
    margin-left: .2rem;
    padding-left: .55rem;
    border-left: 1px solid rgba(255, 255, 255, .15);
    flex-shrink: 0;
}

.ev-selector-caret {
    color: rgba(255, 255, 255, .5);
    font-size: .7rem;
    margin-left: .15rem;
    transition: transform var(--t);
    flex-shrink: 0;
}

.ev-selector-btn[aria-expanded="true"] .ev-selector-caret {
    transform: rotate(180deg);
}

/* sheet dropdown mobile: largeur contrainte */
.ev-sheet {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    width: min(360px, calc(100vw - 1.8rem));
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .10), 0 4px 12px rgba(0, 0, 0, .05);
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: var(--t);
    overflow: hidden;
}

.ev-sheet.open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.ev-sheet-head {
    padding: .85rem 1rem;
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ev-sheet-title {
    font-size: .875rem;
    font-weight: 500;
    color: var(--ink);
    margin: 0;
}

.ev-sheet-count {
    font-size: .7rem;
    color: var(--muted-2);
    font-variant-numeric: tabular-nums;
}

.ev-sheet-search {
    padding: .65rem 1rem;
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: center;
    gap: .5rem;
}

.ev-sheet-search i {
    color: var(--muted-2);
    font-size: .82rem;
}

.ev-sheet-search input {
    flex: 1;
    border: none;
    outline: none;
    font-family: 'Montserrat', sans-serif;
    font-size: .825rem;
    background: transparent;
    color: var(--ink);
    min-height: 32px;
}

.ev-sheet-search input::placeholder {
    color: var(--muted-2);
}

.ev-sheet-filters {
    padding: .55rem 1rem;
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: .35rem;
    flex-wrap: wrap;
}

.ev-filter-pill {
    font-family: 'Montserrat', sans-serif;
    font-size: .7rem;
    font-weight: 500;
    padding: .25rem .65rem;
    border-radius: 50px;
    background: transparent;
    color: var(--muted);
    border: 1px solid var(--line);
    cursor: pointer;
    transition: var(--t);
    min-height: 30px;
}

.ev-filter-pill:hover:not(.active) {
    border-color: var(--muted-3);
    color: var(--ink);
}

.ev-filter-pill.active {
    background: var(--ink);
    color: #fff;
    border-color: var(--ink);
}

.ev-sheet-list {
    max-height: 300px;
    overflow-y: auto;
    scrollbar-width: thin;
}

.ev-sheet-list::-webkit-scrollbar {
    width: 4px;
}

.ev-sheet-list::-webkit-scrollbar-thumb {
    background: var(--muted-3);
    border-radius: 2px;
}

.ev-drop-item {
    display: grid;
    grid-template-columns: 36px 1fr auto;
    gap: .6rem;
    align-items: center;
    padding: .65rem 1rem;
    border-bottom: 1px solid var(--line-2);
    text-decoration: none;
    color: inherit;
    transition: background .12s;
    position: relative;
    min-height: 52px;
}

.ev-drop-item:last-child {
    border-bottom: none;
}

.ev-drop-item:hover {
    background: var(--bg-2);
}

.ev-drop-item.current {
    background: var(--bg-2);
}

.ev-drop-item.current::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--blue);
}

.ev-drop-img {
    width: 36px;
    height: 36px;
    border-radius: 6px;
    object-fit: cover;
    flex-shrink: 0;
    background: var(--bg-2);
}

.ev-drop-img-fallback {
    width: 36px;
    height: 36px;
    border-radius: 6px;
    background: var(--bg-2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Montserrat', sans-serif;
    font-size: .7rem;
    font-weight: 500;
    color: var(--muted);
    flex-shrink: 0;
}

.ev-drop-info {
    min-width: 0;
}

.ev-drop-name {
    font-size: .82rem;
    font-weight: 500;
    color: var(--ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
    text-transform: uppercase;
}

.ev-drop-item.current .ev-drop-name {
    color: var(--blue);
}

.ev-drop-meta {
    font-size: .68rem;
    color: var(--muted-2);
    margin-top: .15rem;
    display: flex;
    align-items: center;
    gap: .35rem;
}

.ev-drop-status {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
}

.ev-drop-status.pub::before {
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--success);
}

.ev-drop-status.draft::before {
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--warning);
}

.ev-drop-gains {
    font-size: .72rem;
    font-weight: 500;
    color: var(--muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.ev-drop-item.current .ev-drop-gains {
    color: var(--blue);
}

.ev-sheet-empty {
    padding: 2rem 1rem;
    text-align: center;
    color: var(--muted-2);
    font-size: .8rem;
}

.ev-sheet-empty i {
    font-size: 1.25rem;
    display: block;
    margin-bottom: .35rem;
    opacity: .5;
}

.ev-drop-sep {
    display: none;
}

.btn-withdrawal {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    min-height: 42px;
    padding: 0 1rem;
    background: var(--ink);
    color: #fff;
    border: 1px solid var(--ink);
    border-radius: var(--r-sm);
    font-family: 'Montserrat', sans-serif;
    font-size: .825rem;
    font-weight: 500;
    text-decoration: none;
    transition: var(--t);
    white-space: nowrap;
}

.btn-withdrawal:hover {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.fin-alert {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    background: var(--surface);
    border: 1px solid var(--line);
    border-left: 2px solid var(--info);
    border-radius: 0 var(--r) var(--r) 0;
    padding: .65rem .85rem;
    font-size: .8rem;
    color: var(--ink);
    margin-bottom: .85rem;
}

.fin-alert i {
    color: var(--info);
    flex-shrink: 0;
    margin-top: .15rem;
    font-size: .9rem;
}

.fin-alert strong {
    font-weight: 500;
}

.fin-alert .btn-close {
    margin-left: auto;
    opacity: .4;
    font-size: .65rem;
}

.fin-toast {
    display: flex;
    align-items: center;
    gap: .5rem;
    background: var(--succ-bg);
    border: 1px solid #86efac;
    border-radius: var(--r);
    padding: .65rem .85rem;
    font-size: .8rem;
    color: var(--success);
    margin-bottom: .85rem;
    font-weight: 500;
}

.fin-toast .btn-close {
    margin-left: auto;
    opacity: .5;
    font-size: .65rem;
}

.fin-tab-nav {
    display: flex;
    gap: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

.fin-tab-nav::-webkit-scrollbar {
    display: none;
}

.fin-tab-link {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .85rem .9rem;
    font-family: 'Montserrat', sans-serif;
    font-size: .8rem;
    font-weight: 400;
    color: var(--muted);
    text-decoration: none;
    transition: color var(--t);
    white-space: nowrap;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    min-height: 44px;
}

.fin-tab-link i {
    font-size: .85rem;
}

.fin-tab-link:hover {
    color: var(--ink);
}

.fin-tab-link.active {
    color: var(--ink);
    font-weight: 500;
    border-bottom-color: var(--blue);
}

.dt-picker.active {
    background: var(--surface) !important;
    color: var(--ink) !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
}

/* ════════════════════════════════════════════════════════════
   SETTINGS  (organizer/setting)
   ════════════════════════════════════════════════════════════ */

.set-topbar {
    margin-bottom: 1.5rem;
}

.set-date {
    font-size: 11px;
    color: var(--muted-2);
    margin: 0 0 .25rem;
    letter-spacing: .04em;
    text-transform: capitalize;
}

.set-title {
    font-family: 'Montserrat', Georgia, serif;
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--ink);
    margin: 0;
    line-height: 1;
    letter-spacing: -0.015em;
}

.set-sub {
    font-size: .8125rem;
    color: var(--muted);
    margin: .3rem 0 0;
}

/* mobile: colonne */
.settings-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    align-items: start;
}

.profile-card {
    padding: 1.5rem 1rem 1.25rem;
    text-align: center;
}

.profile-avatar-wrap {
    position: relative;
    width: 88px;
    height: 88px;
    margin: 0 auto 1rem;
}

.profile-avatar {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    background: var(--bg-2);
}

.profile-avatar-edit {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--ink);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .85rem;
    cursor: pointer;
    border: 3px solid var(--surface);
    transition: var(--t);
}

.profile-avatar-edit:hover {
    background: var(--blue);
}

.profile-name {
    font-size: .95rem;
    font-weight: 500;
    color: var(--ink);
    line-height: 1.3;
    text-transform: capitalize;
}

.profile-role {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .72rem;
    font-weight: 500;
    color: var(--blue);
    background: var(--blue-bg);
    padding: .2rem .6rem;
    border-radius: 50px;
    margin-top: .5rem;
}

.profile-role i {
    font-size: .75rem;
}

.profile-divider {
    height: 1px;
    background: var(--line);
    margin: 1.1rem 0 .9rem;
}

.profile-meta {
    font-size: .8rem;
    color: var(--muted);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    text-align: center;
    line-height: 1.4;
    word-break: break-word;
}

.profile-meta i {
    color: var(--muted-2);
    font-size: .8rem;
    flex-shrink: 0;
}

.set-tabs {
    display: flex;
    gap: 0;
    border-bottom: 1px solid var(--line);
    padding: 0 .75rem;
    overflow-x: auto;
    scrollbar-width: none;
}

.set-tabs::-webkit-scrollbar {
    display: none;
}

.set-tab {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .8rem .65rem;
    font-family: 'Montserrat', sans-serif;
    font-size: .78rem;
    font-weight: 400;
    color: var(--muted);
    background: transparent;
    border: none;
    cursor: pointer;
    transition: color var(--t);
    white-space: nowrap;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    min-height: 44px;
}

.set-tab i {
    font-size: .875rem;
}

.set-tab:hover {
    color: var(--ink);
}

.set-tab.active {
    color: var(--ink);
    font-weight: 500;
    border-bottom-color: var(--blue);
}

.set-pane {
    display: none;
    padding: 1rem .9rem;
}

.set-pane.active {
    display: block;
    animation: fadeIn .25s ease;
}

/* mobile: 1 colonne */
.form-grid-2 {
    display: grid;
    grid-template-columns: 1fr;
    gap: .85rem;
}

.form-grid-3 {
    display: grid;
    grid-template-columns: 1fr;
    gap: .85rem;
}

.form-group {
    display: flex;
    flex-direction: column;
}

.btn-actions {
    display: flex;
    justify-content: flex-end;
    gap: .45rem;
    margin-top: 1.1rem;
    padding-top: .85rem;
    border-top: 1px solid var(--line-2);
    flex-wrap: wrap;
}

.btn-cancel {
    min-height: 40px;
    padding: 0 1rem;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    font-family: 'Montserrat', sans-serif;
    font-size: .8125rem;
    font-weight: 500;
    color: var(--muted);
    cursor: pointer;
    transition: var(--t);
}

.btn-cancel:hover {
    border-color: var(--muted-3);
    color: var(--ink);
    background: var(--bg-2);
}

.btn-save {
    min-height: 40px;
    padding: 0 1.1rem;
    border: 1px solid var(--ink);
    border-radius: var(--r-sm);
    background: var(--ink);
    color: #fff;
    font-family: 'Montserrat', sans-serif;
    font-size: .8125rem;
    font-weight: 500;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    transition: var(--t);
}

.btn-save:hover {
    background: var(--blue);
    border-color: var(--blue);
}

.forgot-link {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .78rem;
    color: var(--muted);
    text-decoration: none;
    transition: color var(--t);
}

.forgot-link:hover {
    color: var(--blue);
}

.org-avatar-wrap {
    position: relative;
    width: 100px;
    height: 100px;
    margin: 0 auto;
}

.org-avatar {
    width: 100%;
    height: 100%;
    border-radius: 12px;
    object-fit: cover;
    background: var(--bg-2);
}

.org-avatar-edit {
    position: absolute;
    bottom: -6px;
    right: -6px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--ink);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .9rem;
    cursor: pointer;
    border: 3px solid var(--surface);
    transition: var(--t);
}

.org-avatar-edit:hover {
    background: var(--blue);
}

.form-section-title {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .8rem;
    font-weight: 500;
    color: var(--ink);
    margin: 1.25rem 0 .75rem;
    padding-top: 1rem;
    border-top: 1px solid var(--line-2);
}

.form-section-title i {
    color: var(--muted-2);
    font-size: .85rem;
}

.social-row {
    display: flex;
    align-items: center;
    gap: .6rem;
    margin-bottom: .6rem;
}

.social-icon {
    width: 36px;
    height: 36px;
    border-radius: var(--r-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .95rem;
    flex-shrink: 0;
}

.ck.ck-editor__main>.ck-editor__editable {
    border: 1px solid var(--line) !important;
    border-radius: 0 0 var(--r-sm) var(--r-sm) !important;
    background: var(--surface) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: .85rem !important;
    min-height: 120px;
}

.ck.ck-toolbar {
    border: 1px solid var(--line) !important;
    border-bottom: none !important;
    border-radius: var(--r-sm) var(--r-sm) 0 0 !important;
    background: var(--bg-2) !important;
}

.ck.ck-editor__editable.ck-focused {
    border-color: var(--blue) !important;
    box-shadow: 0 0 0 3px rgba(30, 58, 138, .08) !important;
}

/* ══ ANIMATIONS ══════════════════════════════════════════════ */
@keyframes cardIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ══ RESPONSIVE — 480px (grands smartphones) ═════════════════ */
@media (min-width: 480px) {
    .ev-selector-btn {
        width: auto;
        max-width: 320px;
    }

    .ev-selector-name {
        max-width: 200px;
    }

    .kpi-value {
        font-size: 1.4rem;
    }

    .kpi-val {
        font-size: 1.4rem;
    }

    .p-kpi-val {
        font-size: 1.35rem;
    }

    .upcoming-grid {
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    }

    .action-cta {
        display: block;
        font-size: .72rem;
        font-weight: 500;
        color: var(--muted);
        padding: .3rem .7rem;
        border: 1px solid var(--line);
        border-radius: var(--r-sm);
        background: transparent;
        transition: var(--t);
        white-space: nowrap;
    }

    .action-row:hover .action-cta {
        color: var(--ink);
        border-color: var(--muted-3);
        background: var(--bg-2);
    }
}

/* ══ RESPONSIVE — 640px (tablette portrait / paysage) ════════ */
@media (min-width: 640px) {

    /* Wrappers */
    .pw {
        padding: 1.5rem 1.25rem 2.5rem;
    }

    .page {
        padding: 1.5rem 1.25rem 3rem;
    }

    .page-wrapper {
        padding: 1.5rem 1.25rem 2.5rem;
    }

    .sc-head {
        padding: .9rem 1.1rem;
        gap: 1rem;
    }

    .sc-head:has(.fin-tab-nav) {
        padding: 0 1.1rem;
    }

    .sc-body {
        padding: 1.1rem;
    }

    /* Typographie */
    .head-title {
        font-size: 1.5rem;
    }

    .hero-value {
        font-size: 2.75rem;
    }

    .page-title {
        font-size: 1.75rem;
    }

    .fin-title {
        font-size: 1.75rem;
    }

    .set-title {
        font-size: 1.75rem;
    }

    .ev-hero__name {
        font-size: 1.5rem;
    }

    .kpi-value {
        font-size: 1.45rem;
    }

    .kpi-val {
        font-size: 1.45rem;
    }

    /* Espacements */
    .head {
        flex-direction: row;
        align-items: flex-end;
        margin-bottom: 2rem;
    }

    .hero {
        margin-bottom: 2.25rem;
        padding-bottom: 2.25rem;
    }

    .block {
        margin-bottom: 2.5rem;
    }

    .kpi-strip {
        gap: .7rem;
        margin-bottom: 1.5rem;
    }

    .kpi-grid {
        gap: .7rem;
        margin-bottom: 2.25rem;
    }

    /* KPI : 3 colonnes sur tablette */
    .kpi-strip {
        grid-template-columns: repeat(3, 1fr);
    }

    .kpi-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .p-kpi-strip {
        grid-template-columns: repeat(3, 1fr);
        gap: .7rem;
    }

    .kpi {
        padding: 1rem 1.1rem;
    }

    /* Page header */
    .page-header {
        align-items: flex-end;
        justify-content: space-between;
        margin-bottom: 1.75rem;
    }

    /* Event cards : image latérale */
    .event-card {
        grid-template-columns: 110px 1fr;
    }

    .event-hero {
        min-height: 115px;
    }

    .event-hero-day {
        font-size: 28px;
    }

    .event-stats {
        grid-template-columns: auto auto 1fr;
        gap: 1rem;
    }

    .stat-divider {
        display: block;
        width: 1px;
        height: 26px;
        background: var(--line);
    }

    .prog-inline {
        grid-column: auto;
        min-width: 0;
        margin-top: 0;
    }

    .events-list.grid-view {
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    }

    /* Filter */
    .search-wrap .f-input {
        width: 190px;
    }

    .btn-export {
        margin-left: auto;
    }

    .info-banner {
        padding: .65rem 1.25rem;
    }

    .alert-banner {
        padding: .65rem 1.25rem;
    }

    /* Finance topbar */
    .fin-topbar {
        flex-direction: row;
        align-items: flex-end;
        margin-bottom: 2rem;
    }

    /* Event show */
    .ev-hero__body {
        padding: 1.25rem 1.25rem;
        gap: 1.25rem;
    }

    .ev-hero__cover {
        height: 180px;
    }

    /* Settings tabs */
    .set-tabs {
        padding: 0 1.1rem;
    }

    .set-tab {
        padding: .9rem .85rem;
        font-size: .8125rem;
    }

    .set-pane {
        padding: 1.25rem 1.1rem;
    }

    /* Top table */
    .top-val {
        display: block;
        font-size: .8rem;
        color: var(--muted);
        font-variant-numeric: tabular-nums;
        text-align: right;
        min-width: 90px;
    }

    .top-row {
        grid-template-columns: 28px 1fr auto auto;
        gap: 1rem;
    }

    /* Participant export */
    .p-export-btn {
        margin-left: auto;
    }
}

/* ══ RESPONSIVE — 768px (tablette large) ════════════════════ */
@media (min-width: 768px) {

    /* Split et grids */
    .split-2 {
        grid-template-columns: 1fr 1fr;
        gap: 2.5rem;
    }

    .part-wrap {
        grid-template-columns: auto 1fr;
        gap: 2rem;
    }

    .part-figure {
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
    }

    .part-rate {
        font-size: 3.25rem;
    }

    /* KPI auto-fit */
    .kpi-strip {
        grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
    }

    .kpi-grid {
        grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
    }

    .p-kpi-strip {
        grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    }

    /* Event cards */
    .event-card {
        grid-template-columns: 125px 1fr;
    }

    .event-hero {
        min-height: 125px;
    }

    .event-hero-day {
        font-size: 30px;
    }

    .events-list.grid-view {
        grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    }

    /* Event show hero : 2 colonnes */
    .ev-hero__body {
        grid-template-columns: 1fr auto;
        gap: 1.75rem;
        padding: 1.5rem 1.5rem;
    }

    .ev-hero__name {
        font-size: 1.75rem;
    }

    .ev-hero__stats {
        flex-direction: column;
        border-left: 1px solid var(--line);
        border-top: none;
        padding-left: 1.35rem;
        padding-top: 0;
        justify-content: flex-start;
        min-width: 150px;
        gap: 1rem;
    }

    .ev-hero__stat-val {
        font-size: 1.5rem;
    }

    .ev-hero__cover {
        height: 200px;
    }

    /* Forms */
    .form-grid-2 {
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
    }

    .form-grid-3 {
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
    }

    /* Settings */
    .set-pane {
        padding: 1.5rem 1.25rem;
    }
}

/* ══ RESPONSIVE — 1024px (desktop) ══════════════════════════ */
@media (min-width: 1024px) {

    /* Wrappers plein desktop */
    .pw {
        padding: 2.5rem 2rem 3rem;
    }

    .page {
        padding: 2.5rem 2rem 4rem;
    }

    .page-wrapper {
        padding: 2rem 2rem 3rem;
    }

    .sc-head {
        padding: .9rem 1.25rem;
    }

    .sc-head:has(.fin-tab-nav) {
        padding: 0 1.25rem;
    }

    .sc-body {
        padding: 1.25rem;
    }

    /* Typographie desktop */
    .head-title {
        font-size: 1.5rem;
    }

    .hero-value {
        font-size: 3.25rem;
    }

    .page-title {
        font-size: 2rem;
    }

    .fin-title {
        font-size: 2rem;
    }

    .set-title {
        font-size: 2rem;
    }

    .ev-hero__name {
        font-size: 2rem;
    }

    /* Espacements desktop */
    .head {
        margin-bottom: 2.5rem;
    }

    .hero {
        margin-bottom: 2.5rem;
        padding-bottom: 2.5rem;
    }

    .block {
        margin-bottom: 3rem;
    }

    .kpi-strip {
        gap: .75rem;
        margin-bottom: 1.5rem;
    }

    .kpi-grid {
        gap: .75rem;
        margin-bottom: 3rem;
    }

    .kpi {
        padding: 1rem 1.1rem;
    }

    .fin-topbar {
        margin-bottom: 2rem;
    }

    .set-topbar {
        margin-bottom: 2rem;
    }

    /* KPI auto-fit desktop */
    .kpi-strip {
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    }

    .kpi-grid {
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    }

    /* Event cards desktop */
    .event-card {
        grid-template-columns: 130px 1fr;
    }

    .event-hero {
        min-height: 130px;
    }

    .event-hero-day {
        font-size: 32px;
    }

    .events-list.grid-view {
        grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
    }

    .event-stats {
        gap: 1.1rem;
    }

    .events-list {
        gap: .65rem;
    }

    /* Filter */
    .search-wrap .f-input {
        width: 220px;
    }

    .page-header {
        margin-bottom: 2rem;
    }

    .info-banner {
        padding: .65rem 2rem;
    }

    .alert-banner {
        padding: .65rem 1.5rem;
    }

    /* Event show hero */
    .ev-hero__body {
        padding: 1.5rem 1.75rem;
        gap: 2rem;
    }

    .ev-hero__cover {
        height: 200px;
    }

    .ev-hero__stats {
        min-width: 160px;
    }

    .ev-hero__stat-val {
        font-size: 1.5rem;
    }

    /* Split 2 */
    .split-2 {
        gap: 3rem;
    }

    /* Part */
    .part-rate {
        font-size: 3.5rem;
    }

    /* Settings 2 colonnes */
    .settings-grid {
        grid-template-columns: 280px 1fr;
        gap: 1.25rem;
    }

    .form-grid-3 {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .set-tabs {
        padding: 0 1.25rem;
    }

    .set-tab {
        padding: .9rem 1rem;
    }

    .profile-card {
        padding: 1.75rem 1.25rem 1.5rem;
    }

    .profile-avatar-wrap {
        width: 96px;
        height: 96px;
    }

    /* Finance */
    .ev-selector-btn {
        max-width: 320px;
    }

    .fin-tab-link {
        padding: .9rem 1.1rem;
    }

    .ev-tab-link {
        padding: .85rem 1.1rem;
    }
}

/* ══ RESPONSIVE — 1280px (grand écran) ══════════════════════ */
@media (min-width: 1280px) {
    .head-title {
        font-size: 1.5rem;
    }

    .upcoming-grid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }

    .split-2 {
        gap: 3rem;
    }
}

/* ════════════════════════════════════════════════════════════
   TEMPLATE SYSTEM — Profondeur, états et composants globaux
   ════════════════════════════════════════════════════════════ */

/* ── Variable topbar (fixe 56px dans izi-tb-styles) ───────── */
:root {
    --topbar-h: 56px;
}

/* ── Sélection texte brand ───────────────────────────────── */
::selection {
    background: var(--blue-bg);
    color: var(--blue);
}

/* ── Scrollbar globale ───────────────────────────────────── */
::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: var(--muted-3);
    border-radius: 99px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--muted-2);
}

/* ── Focus accessible (tous les éléments interactifs) ──────── */
:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 2px;
    border-radius: var(--r-sm);
}

/* ── Barre de progression page (utilisable via JS) ──────────── */
.iz-loader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--red), #ff6b6b 50%, var(--blue));
    background-size: 200% 100%;
    z-index: 9999;
    transform: scaleX(0);
    transform-origin: left;
    opacity: 0;
    transition: transform .35s ease, opacity .25s ease;
}

.iz-loader.running {
    opacity: 1;
    transform: scaleX(.75);
    animation: loaderPulse 1.4s ease-in-out infinite;
}

.iz-loader.done {
    transform: scaleX(1);
    opacity: 0;
    transition: transform .2s ease, opacity .4s ease .15s;
}

@keyframes loaderPulse {
    0% {
        transform: scaleX(.55);
    }

    50% {
        transform: scaleX(.82);
    }

    100% {
        transform: scaleX(.55);
    }
}

/* ── Skeleton / shimmer (transform-based — GPU composited) ── */
@keyframes shimmer {
    to {
        transform: translateX(100%);
    }
}

.skel {
    position: relative;
    overflow: hidden;
    background: var(--line-2);
    border-radius: var(--r-sm);
    display: block;
}

.skel::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
            transparent 0%,
            rgba(255, 255, 255, .45) 50%,
            transparent 100%);
    transform: translateX(-100%);
    animation: shimmer 1.8s ease-in-out infinite;
}

.skel-text {
    height: .7em;
    border-radius: 3px;
}

.skel-title {
    height: 1.15rem;
    border-radius: 4px;
    max-width: 220px;
}

.skel-kpi {
    height: 1.6rem;
    border-radius: 4px;
    max-width: 100px;
}

.skel-label {
    height: .65rem;
    border-radius: 3px;
    max-width: 80px;
}

.skel-block {
    height: 90px;
    border-radius: var(--r);
}

.skel-btn {
    height: 34px;
    border-radius: var(--r-sm);
    max-width: 90px;
}

.skel-avatar {
    border-radius: 50%;
    width: 38px;
    height: 38px;
}

.skel-bar {
    height: 3px;
    border-radius: 2px;
}

/* ── Profondeur — ombres sur composants ─────────────────────── */
.sc {
    transition: border-color var(--t), box-shadow var(--t);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .04), 0 1px 1px rgba(0, 0, 0, .02);
}

.sc:hover {
    border-color: var(--muted-3);
    box-shadow: 0 4px 16px rgba(0, 0, 0, .07), 0 1px 3px rgba(0, 0, 0, .04);
}

.chart-card {
    box-shadow: 0 1px 3px rgba(0, 0, 0, .04);
    transition: box-shadow var(--t);
}

.chart-card:hover {
    box-shadow: 0 4px 16px rgba(0, 0, 0, .07);
}

.event-card {
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
    transition: border-color var(--t), transform var(--t), box-shadow var(--t);
}

.event-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .08), 0 2px 6px rgba(0, 0, 0, .04);
}

.upcoming-card {
    box-shadow: 0 1px 2px rgba(0, 0, 0, .03);
    transition: border-color var(--t), transform var(--t), box-shadow var(--t);
}

.upcoming-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, .07);
}

.kpi {
    box-shadow: 0 1px 2px rgba(0, 0, 0, .02);
    transition: border-color var(--t), background var(--t), box-shadow var(--t), transform var(--t);
}

.kpi:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, .06);
}

.kpi.highlight {
    box-shadow: 0 1px 3px rgba(0, 0, 0, .05);
}

.p-kpi {
    transition: border-color var(--t), background var(--t), box-shadow var(--t), transform var(--t);
}

.p-kpi:hover {
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(0, 0, 0, .05);
}

/* ── Sticky tab nav (ev-tab-nav, hors overflow:hidden) ──────── */
.ev-tab-nav {
    position: sticky;
    top: var(--topbar-h);
    background: var(--surface);
    z-index: 20;
    margin-bottom: 1.25rem;
    box-shadow: none;
    border-bottom: 1px solid var(--line);
}

/* Ombre apparaît quand sticky actif (JS ajoute .is-stuck) */
.ev-tab-nav.is-stuck {
    box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
    border-bottom-color: transparent;
}

/* Fade indicator de scroll horizontal sur les tab navs */
.fin-tab-nav,
.set-tabs {
    position: relative;
}

.ev-tab-nav::after,
.fin-tab-nav::after,
.set-tabs::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    bottom: 1px;
    width: 40px;
    background: linear-gradient(to left, var(--surface) 40%, transparent);
    pointer-events: none;
    z-index: 1;
}

/* ── sc-head gradient discret ────────────────────────────────── */
.sc-head {
    background: linear-gradient(180deg, var(--surface) 0%, rgba(250, 250, 250, .6) 100%);
}

/* ── Validation formulaires ──────────────────────────────────── */
.form-control.is-valid,
.form-select.is-valid {
    border-color: var(--success);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2316794a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .7rem center;
    background-size: 14px;
}

.form-control.is-valid:focus,
.form-select.is-valid:focus {
    border-color: var(--success);
    box-shadow: 0 0 0 3px rgba(22, 121, 74, .09);
}

.form-control.is-invalid,
.form-select.is-invalid {
    border-color: var(--red);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23E8192C' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='8' x2='12' y2='12'/%3E%3Ccircle cx='12' cy='16' r='.5' fill='%23E8192C'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .7rem center;
    background-size: 14px;
}

.form-control.is-invalid:focus,
.form-select.is-invalid:focus {
    border-color: var(--red);
    box-shadow: 0 0 0 3px rgba(232, 25, 44, .09);
}

.valid-feedback {
    font-size: .72rem;
    color: var(--success);
    margin-top: .3rem;
    display: flex;
    align-items: center;
    gap: .25rem;
}

.invalid-feedback {
    font-size: .72rem;
    color: var(--red);
    margin-top: .3rem;
    display: flex;
    align-items: center;
    gap: .25rem;
}

/* ── États de boutons (active scale) ────────────────────────── */
.btn:active,
.btn-primary-red:active,
.btn-ghost:active,
.btn-danger-soft:active,
.btn-save:active,
.btn-cancel:active,
.btn-withdrawal:active,
.btn-export:active,
.btn-bar:active {
    transform: scale(.97);
    transition: transform .08s ease;
}

/* ── Status badges avec fond teinté ─────────────────────────── */
.s-badge {
    letter-spacing: .015em;
}

.s-pub {
    background: rgba(22, 121, 74, .1);
}

.s-draft {
    background: rgba(146, 64, 14, .1);
}

.s-bloc {
    background: rgba(232, 25, 44, .1);
}

.s-test {
    background: rgba(30, 64, 175, .1);
}

.s-muted {
    color: var(--muted-2);
    background: var(--bg-2);
}

.s-violet {
    color: var(--violet);
    background: var(--violet-bg);
}

/* ── Action rows avec gradient hover ────────────────────────── */
.action-row:hover {
    background: linear-gradient(to right, var(--bg-2), var(--surface) 60%);
}

.action-row.urgent:hover {
    background: linear-gradient(to right, var(--accent-bg), var(--surface) 60%);
}

.action-row.warning:hover {
    background: linear-gradient(to right, var(--warning-bg), var(--surface) 60%);
}

.action-row.info:hover {
    background: linear-gradient(to right, var(--info-bg), var(--surface) 60%);
}

/* ── Top rows hover ─────────────────────────────────────────── */
.top-row {
    border-radius: var(--r-sm);
}

.top-row:hover {
    background: var(--bg-2);
    padding-left: .35rem;
    border-radius: var(--r-sm);
}

/* ── Ev hero cover overlay amélioré ─────────────────────────── */
.ev-hero__cover-overlay {
    background: linear-gradient(to bottom,
            rgba(10, 10, 10, 0) 0%,
            rgba(10, 10, 10, .18) 45%,
            rgba(10, 10, 10, .65) 100%);
}

/* ── Progress bar pulse pour faible remplissage ─────────────── */
@keyframes pulseLow {

    0%,
    100% {
        opacity: 1;
    }

    50% {
        opacity: .55;
    }
}

.prog-fill.low,
.upcoming-fill-bar.low {
    animation: pulseLow 2.2s ease-in-out infinite;
}

/* ── KPI animation d'entrée différée par rang ───────────────── */
.kpi-strip>.kpi:nth-child(1),
.kpi-grid>.kpi:nth-child(1),
.p-kpi-strip>.p-kpi:nth-child(1) {
    animation-delay: .05s;
}

.kpi-strip>.kpi:nth-child(2),
.kpi-grid>.kpi:nth-child(2),
.p-kpi-strip>.p-kpi:nth-child(2) {
    animation-delay: .1s;
}

.kpi-strip>.kpi:nth-child(3),
.kpi-grid>.kpi:nth-child(3),
.p-kpi-strip>.p-kpi:nth-child(3) {
    animation-delay: .15s;
}

.kpi-strip>.kpi:nth-child(4),
.kpi-grid>.kpi:nth-child(4) {
    animation-delay: .2s;
}

.kpi-strip>.kpi:nth-child(5),
.kpi-grid>.kpi:nth-child(5) {
    animation-delay: .25s;
}

.kpi-strip>.kpi:nth-child(6),
.kpi-grid>.kpi:nth-child(6) {
    animation-delay: .3s;
}

/* ── Toast IZ global (hors page) ────────────────────────────── */
.iz-toast-wrap {
    position: fixed;
    bottom: 1.25rem;
    right: 1.25rem;
    z-index: 8888;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    pointer-events: none;
    max-width: calc(100vw - 2.5rem);
}

.iz-toast {
    display: flex;
    align-items: center;
    gap: .65rem;
    background: var(--ink);
    color: #fff;
    padding: .75rem 1rem;
    border-radius: var(--r);
    font-family: 'Montserrat', sans-serif;
    font-size: .8125rem;
    font-weight: 500;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
    pointer-events: all;
    animation: toastIn .25s cubic-bezier(.34, 1.56, .64, 1) forwards;
    max-width: 340px;
}

.iz-toast i {
    font-size: 1rem;
    flex-shrink: 0;
}

.iz-toast.success {
    background: var(--success);
}

.iz-toast.error {
    background: var(--red);
}

.iz-toast.info {
    background: var(--blue);
}

.iz-toast.warning {
    background: var(--warning);
    color: #fff;
}

.iz-toast.out {
    animation: toastOut .2s ease forwards;
}

@keyframes toastIn {
    from {
        opacity: 0;
        transform: translateY(12px) scale(.95);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes toastOut {
    to {
        opacity: 0;
        transform: translateY(8px) scale(.95);
    }
}

/* ── bc-bar (breadcrumb composant) dans contexte manage ─────── */
.bc-bar {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r);
    padding: .85rem 1rem;
    margin-bottom: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .04);
    border-bottom-width: 1px;
}

/* ── Empty state premium ────────────────────────────────────── */
.empty-state {
    background: radial-gradient(ellipse at 50% 0%, var(--blue-bg) 0%, var(--bg-2) 70%);
    border: 1.5px dashed var(--muted-3);
}

.empty-state i {
    font-size: 2rem;
    opacity: .35;
}

.p-empty {
    padding: 3.5rem 1.5rem;
    background: radial-gradient(ellipse at 50% 0%, var(--blue-bg) 0%, var(--bg-2) 65%);
    border-radius: 0 0 var(--r) var(--r);
}

/* ── Pagination style unifié ────────────────────────────────── */
.page-btn,
.p-page-btn {
    font-variant-numeric: tabular-nums;
    font-weight: 400;
    transition: border-color var(--t), background var(--t), color var(--t), transform var(--t);
}

.page-btn:active:not(:disabled),
.p-page-btn:active:not(:disabled) {
    transform: scale(.93);
}

/* ── Ev-hero pulse sur cover hover ──────────────────────────── */
.ev-hero__cover {
    transition: none;
}

.ev-hero:hover .ev-hero__cover img {
    transform: scale(1.025);
}

/* ── Profil avatar edit hover effect ────────────────────────── */
.profile-avatar-edit,
.org-avatar-edit {
    box-shadow: 0 2px 6px rgba(0, 0, 0, .2);
}

.profile-avatar-edit:hover,
.org-avatar-edit:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 10px rgba(0, 0, 0, .25);
}

/* ── Fin-tab / ev-tab / set-tab : fond hover subtil ────────── */
.fin-tab-link:hover,
.ev-tab-link:hover,
.set-tab:hover {
    background: var(--bg-2);
    border-radius: var(--r-sm) var(--r-sm) 0 0;
}

.fin-tab-link.active,
.ev-tab-link.active,
.set-tab.active {
    background: linear-gradient(to bottom, rgba(30, 58, 138, .04), transparent);
}

/* ── Modal : animation entrée ───────────────────────────────── */
.modal.fade .modal-dialog {
    transition: transform .25s cubic-bezier(.34, 1.56, .64, 1), opacity .2s ease;
}

.modal.fade:not(.show) .modal-dialog {
    transform: translateY(-12px) scale(.97);
    opacity: 0;
}

/* ── Événement card entrance séquentielle ────────────────────── */
.event-card:nth-child(1) {
    animation-delay: .04s;
}

.event-card:nth-child(2) {
    animation-delay: .08s;
}

.event-card:nth-child(3) {
    animation-delay: .12s;
}

.event-card:nth-child(4) {
    animation-delay: .16s;
}

.event-card:nth-child(5) {
    animation-delay: .20s;
}

.event-card:nth-child(6) {
    animation-delay: .24s;
}

/* ── IzTable inside .sc card ────────────────────────────────── */
.sc .izt {
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
}

/* ── Responsive template ────────────────────────────────────── */
@media (min-width: 640px) {
    .bc-bar {
        padding: .9rem 1.25rem;
        margin-bottom: 1.5rem;
    }

    .iz-toast-wrap {
        bottom: 1.5rem;
        right: 1.5rem;
    }
}

@media (min-width: 1024px) {
    .bc-bar {
        margin-bottom: 1.75rem;
    }

    .kpi:hover {
        transform: translateY(-2px);
    }

    .p-kpi:hover {
        transform: translateY(-2px);
    }
}