:root,
[data-theme="light"] {
    color-scheme: light;
    --color-bg: #f4f6fb;
    --color-bg-elevated: #ffffff;
    --color-surface: #ffffff;
    --color-surface-muted: #f8fafc;
    --color-border: #e2e8f0;
    --color-border-strong: #cbd5e1;
    --color-text: #0f172a;
    --color-text-muted: #64748b;
    --color-primary: #2563eb;
    --color-primary-hover: #1d4ed8;
    --color-primary-soft: #eff6ff;
    --color-success: #166534;
    --color-success-bg: #f0fdf4;
    --color-success-border: #bbf7d0;
    --color-warning: #b45309;
    --color-warning-bg: #fffbeb;
    --color-warning-border: #fde68a;
    --color-danger: #991b1b;
    --color-danger-bg: #fef2f2;
    --color-danger-border: #fecaca;
    --color-info: #1d4ed8;
    --color-info-bg: #eff6ff;
    --color-info-border: #bfdbfe;
    --color-highlight-bg: linear-gradient(135deg, #ffffff 0%, #f0f7ff 100%);
    --color-highlight-border: #bfdbfe;
    --color-nav-active-bg: #eff6ff;
    --color-shadow: rgba(15, 23, 42, 0.08);
    --color-overlay: rgba(15, 23, 42, 0.45);
    --color-input-bg: #ffffff;
    --color-chart-grid: #e2e8f0;
    --color-chart-text: #64748b;
    --sidebar-width: 248px;
    --header-height: 64px;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --transition-fast: 0.15s ease;
}

[data-theme="dark"] {
    color-scheme: dark;
    --color-bg: #0b0f17;
    --color-bg-elevated: #111827;
    --color-surface: #111827;
    --color-surface-muted: #0f172a;
    --color-border: #1f2937;
    --color-border-strong: #334155;
    --color-text: #f8fafc;
    --color-text-muted: #94a3b8;
    --color-primary: #60a5fa;
    --color-primary-hover: #93c5fd;
    --color-primary-soft: rgba(37, 99, 235, 0.16);
    --color-success: #86efac;
    --color-success-bg: rgba(22, 101, 52, 0.18);
    --color-success-border: rgba(34, 197, 94, 0.35);
    --color-warning: #fbbf24;
    --color-warning-bg: rgba(180, 83, 9, 0.18);
    --color-warning-border: rgba(251, 191, 36, 0.35);
    --color-danger: #fca5a5;
    --color-danger-bg: rgba(153, 27, 27, 0.2);
    --color-danger-border: rgba(248, 113, 113, 0.35);
    --color-info: #93c5fd;
    --color-info-bg: rgba(29, 78, 216, 0.18);
    --color-info-border: rgba(96, 165, 250, 0.35);
    --color-highlight-bg: linear-gradient(135deg, #111827 0%, rgba(37, 99, 235, 0.12) 100%);
    --color-highlight-border: rgba(96, 165, 250, 0.35);
    --color-nav-active-bg: rgba(37, 99, 235, 0.16);
    --color-shadow: rgba(0, 0, 0, 0.35);
    --color-overlay: rgba(2, 6, 23, 0.65);
    --color-input-bg: #0f172a;
    --color-chart-grid: #334155;
    --color-chart-text: #94a3b8;
}

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

body {
    margin: 0;
    font-family: var(--font-sans);
    font-size: 14px;
    line-height: 1.5;
    color: var(--color-text);
    background: var(--color-bg);
}

a {
    color: var(--color-primary);
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

.app {
    display: flex;
    min-height: 100vh;
}

.sidebar {
    position: sticky;
    top: 0;
    width: var(--sidebar-width);
    height: 100vh;
    background: var(--color-surface);
    border-right: 1px solid var(--color-border);
    padding: 1.25rem 0.875rem;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    z-index: 30;
}

.sidebar__brand {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 2rem;
    padding: 0 0.5rem;
}

.sidebar__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: var(--color-primary);
    color: #fff;
    border-radius: 8px;
    font-weight: 700;
    font-size: 16px;
}

.sidebar__title {
    font-weight: 600;
    font-size: 16px;
}

.sidebar__nav {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.sidebar__section {
    margin-top: 1.5rem;
}

.sidebar__section-label {
    margin: 0 0 0.5rem;
    padding: 0 0.75rem;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

.sidebar__link {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 0.75rem;
    border-radius: var(--radius-sm);
    color: var(--color-text-muted);
    text-decoration: none;
    transition: background var(--transition-fast), color var(--transition-fast);
}

.sidebar__link svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.sidebar__link:hover {
    background: var(--color-surface-muted);
    color: var(--color-text);
    text-decoration: none;
}

.sidebar__link--active {
    background: var(--color-nav-active-bg);
    color: var(--color-primary);
    font-weight: 500;
}

.sidebar__footer {
    margin-top: auto;
    padding-top: 1rem;
    border-top: 1px solid var(--color-border);
}

.main {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.main__header {
    position: sticky;
    top: 0;
    z-index: 20;
    min-height: var(--header-height);
    padding: 0 1.5rem;
    background: rgba(255, 255, 255, 0.82);
    border-bottom: 1px solid var(--color-border);
    backdrop-filter: blur(12px);
}

[data-theme="dark"] .main__header {
    background: rgba(17, 24, 39, 0.82);
}

.main__header h1 {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.main__content {
    padding: 1.5rem;
    flex: 1;
    max-width: 1320px;
    width: 100%;
    margin: 0 auto;
}

.welcome {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    padding: 2rem;
    max-width: 640px;
}

.welcome__text {
    margin: 0 0 0.75rem;
    font-size: 1rem;
}

.welcome__subtext {
    margin: 0;
    color: var(--color-text-muted);
}

.error-page {
    text-align: center;
    padding: 4rem 2rem;
}

.error-page h1 {
    font-size: 4rem;
    margin: 0 0 1rem;
    color: var(--color-text-muted);
}

.error-page p {
    color: var(--color-text-muted);
    margin-bottom: 1.5rem;
}

/* Authentification */
body.guest {
    background:
        radial-gradient(circle at top left, var(--color-primary-soft), transparent 42%),
        linear-gradient(180deg, var(--color-bg) 0%, var(--color-surface-muted) 100%);
}

.guest__wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
}

.guest__card {
    width: 100%;
    max-width: 420px;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 2rem;
    box-shadow: 0 12px 40px var(--color-shadow);
}

.guest__brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    margin-bottom: 2rem;
    width: 100%;
}

.guest__theme-toggle {
    margin-left: auto;
}

.guest__title {
    font-weight: 600;
    font-size: 1.25rem;
}

/* Formulaires */
.form {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.form__group {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.form__label {
    font-weight: 500;
    font-size: 0.875rem;
    color: var(--color-text);
}

.form__input {
    padding: 0.625rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-size: 0.875rem;
    font-family: inherit;
    background: var(--color-input-bg);
    color: var(--color-text);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.form__input:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 18%, transparent);
}

.form__hint {
    margin: 0;
    font-size: 0.75rem;
    color: var(--color-text-muted);
}

.form__actions {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
    margin-top: 0.5rem;
}

/* Boutons */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1rem;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}

.btn:hover {
    text-decoration: none;
}

.btn--primary {
    background: var(--color-primary);
    color: #fff;
}

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

.btn--ghost {
    background: transparent;
    color: var(--color-text-muted);
    border-color: var(--color-border);
}

.btn--ghost:hover {
    background: var(--color-surface-muted);
    color: var(--color-text);
}

.btn--icon {
    width: 38px;
    height: 38px;
    padding: 0;
}

.btn--icon svg {
    width: 18px;
    height: 18px;
}

.btn--block {
    width: 100%;
}

.btn--sm {
    padding: 0.375rem 0.75rem;
    font-size: 0.8125rem;
}

/* Alertes */
.alert {
    padding: 0.75rem 1rem;
    border-radius: 8px;
    margin-bottom: 1rem;
    font-size: 0.875rem;
}

.alert--success {
    background: var(--color-success-bg);
    color: var(--color-success);
    border: 1px solid var(--color-success-border);
}

.alert--error {
    background: var(--color-danger-bg);
    color: var(--color-danger);
    border: 1px solid var(--color-danger-border);
}

/* En-tête utilisateur */
.main__header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: var(--header-height);
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.header-actions h1 {
    margin: 0;
}

.theme-toggle__icon--dark,
[data-theme="dark"] .theme-toggle__icon--light {
    display: none;
}

[data-theme="dark"] .theme-toggle__icon--dark {
    display: inline;
}

.user-menu {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.btn-sync-header {
    white-space: nowrap;
}

.btn-sync-header .btn__icon {
    width: 16px;
    height: 16px;
    margin-right: 0.35rem;
}

.sync-feedback-region {
    margin-bottom: 1rem;
}

.sync-feedback-region[hidden] {
    display: none !important;
}

.sync-feedback__countdown {
    margin: 0.75rem 0 0;
    font-size: 0.8125rem;
    opacity: 0.85;
}

.user-menu__name {
    font-size: 0.875rem;
    color: var(--color-text-muted);
}

.user-menu__logout {
    margin: 0;
}

.auth-panel {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    padding: 2rem;
    max-width: 480px;
}

/* Dashboard */
.dashboard {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    max-width: 1200px;
}

.dashboard__header {
    margin-bottom: 0.25rem;
}

.dashboard__secondary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.kpi-section {
    margin: 0;
}

.kpi-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(25%, 1fr));
    gap: 1rem;
}

.kpi-card {
    display: flex;
    gap: 0.875rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    padding: 1.25rem;
    transition: box-shadow 0.15s ease;
}

.kpi-card:hover {
    box-shadow: 0 8px 24px var(--color-shadow);
}

.kpi-card--highlight {
    border-color: var(--color-highlight-border);
    background: var(--color-highlight-bg);
}

.kpi-card__icon {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-sm);
    background: var(--color-primary-soft);
    color: var(--color-primary);
    flex-shrink: 0;
    padding: 8px;
}

.kpi-card__icon--vat {
    background: var(--color-success-bg);
    color: var(--color-success);
}

.kpi-card__icon--expense {
    background: var(--color-warning-bg);
    color: var(--color-warning);
}

.kpi-card__icon--cash {
    background: var(--color-info-bg);
    color: var(--color-info);
}

.kpi-card__icon--alert {
    background: var(--color-danger-bg);
    color: var(--color-danger);
}

.kpi-card__icon svg {
    width: 18px;
    height: 18px;
}

.kpi-card__body {
    min-width: 0;
}

.kpi-card__label {
    margin: 0 0 0.25rem;
    font-size: 0.8125rem;
    color: var(--color-text-muted);
    font-weight: 500;
}

.kpi-card__amounts {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-bottom: 0.25rem;
}

.kpi-card__amount {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    margin: 0;
}

.kpi-card__amount-label {
    flex: 0 0 2.25rem;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}

.kpi-card__amount-value {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.02em;
}

.kpi-card__value {
    margin: 0 0 0.25rem;
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.02em;
}

.kpi-card__value--count {
    font-size: 1.75rem;
}

.kpi-card__value--due {
    color: var(--color-warning);
}

.kpi-card__value--credit,
.kpi-card__value--positive {
    color: var(--color-success);
}

.kpi-card__value--negative {
    color: var(--color-danger);
}

.kpi-card__hint {
    margin: 0;
    font-size: 0.75rem;
    color: var(--color-text-muted);
}

.info-card {
    display: flex;
    gap: 1rem;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    padding: 1.25rem;
}

.info-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--color-primary-soft);
    color: var(--color-primary);
    flex-shrink: 0;
}

.info-card--vat .info-card__icon {
    background: var(--color-warning-bg);
    color: var(--color-warning);
}

.info-card--sync .info-card__icon {
    background: var(--color-success-bg);
    color: var(--color-success);
}

.info-card__title {
    margin: 0 0 0.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.info-card__value {
    margin: 0 0 0.25rem;
    font-size: 1rem;
    font-weight: 600;
}

.info-card__meta {
    margin: 0;
    font-size: 0.875rem;
    color: var(--color-text-muted);
}

.info-card__icon svg {
    width: 20px;
    height: 20px;
}

.info-card__urgent {
    color: var(--color-warning);
    font-weight: 600;
}

.info-card__error {
    margin: 0.75rem 0 0;
    padding: 0.75rem 1rem;
    border-radius: var(--radius-sm);
    background: var(--color-danger-bg);
    color: var(--color-danger);
    border: 1px solid var(--color-danger-border);
    font-size: 0.875rem;
}

.btn__icon {
    width: 16px;
    height: 16px;
    margin-right: 0.375rem;
    vertical-align: -2px;
}

.sync-panel {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    padding: 1.5rem;
}

.sync-panel__header h2 {
    margin: 0 0 0.5rem;
    font-size: 1rem;
    font-weight: 600;
}

.sync-panel__meta {
    margin: 0 0 1rem;
    color: var(--color-text-muted);
    font-size: 0.875rem;
}

.sync-status {
    text-transform: uppercase;
    font-size: 0.75rem;
    font-weight: 600;
}

.sync-status--success { color: var(--color-success); }
.sync-status--partial { color: var(--color-warning); }
.sync-status--failed { color: var(--color-danger); }
.sync-status--running { color: var(--color-info); }

.sync-feedback {
    padding: 0.75rem 1rem;
    border-radius: var(--radius-sm);
    font-size: 0.875rem;
}

.sync-feedback--loading {
    background: var(--color-info-bg);
    color: var(--color-info);
    border: 1px solid var(--color-info-border);
}

.sync-feedback--success {
    background: var(--color-success-bg);
    color: var(--color-success);
    border: 1px solid var(--color-success-border);
}

.sync-feedback--error {
    background: var(--color-danger-bg);
    color: var(--color-danger);
    border: 1px solid var(--color-danger-border);
}

.sync-feedback__summary {
    margin: 0;
}

.sync-feedback__details {
    margin-top: 0.75rem;
}

.sync-feedback__details summary {
    cursor: pointer;
    font-weight: 600;
}

.sync-feedback__errors {
    margin: 0.5rem 0 0;
    padding-left: 1.25rem;
    max-height: 16rem;
    overflow-y: auto;
}

.sync-feedback__errors li {
    margin-bottom: 0.35rem;
    word-break: break-word;
}

.dashboard__header {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1rem;
}

.dashboard-period-filter label {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    color: var(--color-text-muted);
    font-size: 0.8125rem;
}

.dashboard-period-filter select {
    min-width: 14rem;
    padding: 0.55rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    background: var(--color-surface);
    color: var(--color-text);
    font: inherit;
}

/* Graphiques */
.charts-section {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    margin-top: 1.5rem;
}

.charts-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 1.25rem;
    align-items: flex-start;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    padding: 1.25rem;
}

.charts-header h2 {
    margin: 0 0 0.35rem;
    font-size: 1rem;
}

.charts-header__meta {
    margin: 0;
    color: var(--color-text-muted);
}

.charts-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: end;
}

.charts-filters label {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    width: 15%;
    color: var(--color-text-muted);
    font-size: 0.8125rem;
}

.charts-filters input,
.charts-filters select {
    padding: 0.5rem 0.7rem;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    background: var(--color-surface);
    color: var(--color-text);
    font: inherit;
}

.charts-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.chart-card {
    min-width: 0;
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    padding: 1.25rem;
}

.chart-card--wide {
    grid-column: span 2;
}

.chart-card h3 {
    margin: 0 0 1rem;
    font-size: 0.95rem;
}

.chart-card__canvas {
    position: relative;
    height: 320px;
}

.chart-card:not(.chart-card--wide) .chart-card__canvas {
    height: 280px;
}

.chart-card--list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.ranking-list {
    display: grid;
    gap: 0.65rem;
}

.ranking-list__item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: 10px;
    background: var(--color-surface-muted);
}

.ranking-list__rank {
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: var(--color-primary-soft);
    color: var(--color-primary);
    font-size: 0.75rem;
    font-weight: 700;
}

.ranking-list__name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
}

.ranking-list__amount {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.ranking-list__empty {
    margin: 0;
    padding: 1rem;
    color: var(--color-text-muted);
    border: 1px dashed var(--color-border);
    border-radius: 10px;
}

.charts-feedback {
    padding: 0.75rem 1rem;
    border-radius: 10px;
}

.charts-feedback--loading {
    background: var(--color-info-bg);
    color: var(--color-info);
    border: 1px solid var(--color-info-border);
}

.charts-feedback--error {
    background: var(--color-danger-bg);
    color: var(--color-danger);
    border: 1px solid var(--color-danger-border);
}

/* TVA */
.vat-page {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    max-width: 1200px;
}

.vat-period-form__fields {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: end;
}

.vat-period-form label {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    font-size: 0.875rem;
    color: var(--color-text-muted);
}

.vat-period-form select,
.vat-period-form input[type="number"] {
    min-width: 120px;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    font: inherit;
}

.vat-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.vat-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.vat-panel {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    padding: 1.25rem;
    overflow-x: auto;
}

.vat-panel--full {
    grid-column: 1 / -1;
}

.vat-panel h2 {
    margin: 0 0 1rem;
    font-size: 1rem;
}

.table-wrap {
    overflow-x: auto;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-surface);
}

.table,
.data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.table thead,
.data-table thead {
    background: var(--color-surface-muted);
}

.table th,
.table td,
.data-table th,
.data-table td {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--color-border);
    text-align: left;
    vertical-align: middle;
}

.table thead th,
.data-table thead th {
    color: var(--color-text-muted);
    font-weight: 600;
    font-size: 0.75rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.table tbody th[scope="row"],
.data-table tbody th[scope="row"] {
    color: var(--color-text);
    font-weight: 500;
    font-size: 0.875rem;
    letter-spacing: normal;
    text-transform: none;
}

.table tbody tr:last-child td,
.table tbody tr:last-child th,
.data-table tbody tr:last-child td,
.data-table tbody tr:last-child th {
    border-bottom: none;
}

.table tbody tr:hover,
.data-table tbody tr:hover {
    background: color-mix(in srgb, var(--color-primary) 4%, var(--color-surface));
}

.table tfoot,
.data-table tfoot {
    background: var(--color-surface-muted);
}

.table tfoot th,
.table tfoot td,
.data-table tfoot th,
.data-table tfoot td {
    font-weight: 600;
    color: var(--color-text);
    border-top: 2px solid var(--color-border-strong);
    border-bottom: none;
}

.table td:not(:first-child),
.table thead th:not(:first-child) {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.data-table__row--muted {
    opacity: 0.65;
}

.vat-actions-cell {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.inline-form {
    display: inline;
    margin: 0;
}

.badge {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
}

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

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

.badge--muted {
    background: var(--color-surface-muted);
    color: var(--color-text-muted);
}

.vat-status {
    display: inline-block;
    padding: 0.25rem 0.625rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
}

.vat-status--draft { background: var(--color-info-bg); color: var(--color-info); }
.vat-status--validated { background: var(--color-success-bg); color: var(--color-success); }
.vat-status--submitted { background: var(--color-primary-soft); color: var(--color-primary); }
.vat-status--archived { background: var(--color-surface-muted); color: var(--color-text-muted); }

/* Rapports */
.reports-page {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    max-width: 1200px;
}

.reports-panel {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: 12px;
    padding: 1.25rem;
}

.reports-panel h2 {
    margin: 0 0 1rem;
    font-size: 1rem;
}

.report-form__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.report-form label {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    font-size: 0.875rem;
    color: var(--color-text-muted);
}

.report-form select,
.report-form input[type="number"] {
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    font: inherit;
}

.report-actions-cell {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    white-space: nowrap;
    justify-content: flex-end;
}

.text-muted {
    color: var(--color-text-muted);
}

.report-show-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.report-show-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.report-preview h1 {
    font-size: 1.25rem;
    margin: 0 0 0.5rem;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.report-preview h2 {
    font-size: 0.9375rem;
    margin: 1.5rem 0 0.75rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--color-border);
    font-weight: 600;
    letter-spacing: -0.01em;
}

.report-preview h2:first-of-type {
    margin-top: 0.75rem;
}

.report-preview .meta {
    color: var(--color-text-muted);
    margin: 0 0 0.25rem;
    font-size: 0.875rem;
}

.report-preview .table-wrap {
    margin-bottom: 0.25rem;
}

.report-preview .table-wrap--summary {
    max-width: 28rem;
}

.report-preview .table--summary tbody th[scope="row"] {
    width: 62%;
    color: var(--color-text-muted);
    font-weight: 500;
}

.report-preview .table--summary tbody tr:last-child th[scope="row"],
.report-preview .table--summary tbody tr:last-child td {
    font-weight: 600;
    color: var(--color-text);
}

.report-preview .table__value--highlight {
    font-weight: 600;
    color: var(--color-primary);
}

.report-preview .table__empty {
    text-align: center;
    color: var(--color-text-muted);
    padding: 1.5rem 1rem;
}

.report-preview .summary-grid {
    display: grid;
    gap: 0.35rem;
    max-width: 420px;
}

.report-preview .summary-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.25rem 0;
    border-bottom: 1px solid var(--color-border);
}

.report-preview .summary-value {
    font-weight: 600;
}

.page-shell {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.page-intro {
    display: flex;
    gap: 0.35rem;
}

.page-intro__title {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.page-intro__meta {
    margin: 0;
    color: var(--color-text-muted);
    font-size: 0.875rem;
}

.panel {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: 1.25rem;
}

.mobile-nav-toggle {
    display: none;
}

.sidebar-overlay {
    display: none;
}

select,
input[type="number"],
input[type="text"],
input[type="email"],
input[type="password"] {
    background: var(--color-input-bg);
    color: var(--color-text);
    border: 1px solid var(--color-border);
}

select:focus,
input:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 18%, transparent);
}

@media (max-width: 768px) {
    .mobile-nav-toggle {
        display: inline-flex;
    }

    .sidebar-overlay {
        position: fixed;
        inset: 0;
        background: var(--color-overlay);
        z-index: 25;
    }

    .sidebar-overlay.is-visible {
        display: block;
    }

    .sidebar {
        position: fixed;
        left: 0;
        top: 0;
        transform: translateX(-100%);
        transition: transform var(--transition-fast);
        box-shadow: 12px 0 32px var(--color-shadow);
    }

    .sidebar.is-open {
        transform: translateX(0);
    }

    .main__content {
        padding: 1rem;
    }

    .user-menu__name {
        display: none;
    }

    .btn-sync-header__label {
        display: none;
    }

    .btn-sync-header .btn__icon {
        margin-right: 0;
    }

    .dashboard__secondary {
        grid-template-columns: 1fr;
    }

    .dashboard__header {
        align-items: stretch;
    }

    .dashboard-period-filter,
    .dashboard-period-filter select {
        width: 100%;
    }

    .kpi-grid {
        grid-template-columns: 1fr;
    }

    .charts-grid {
        grid-template-columns: 1fr;
    }

    .chart-card--wide {
        grid-column: span 1;
    }

    .vat-grid {
        grid-template-columns: 1fr;
    }
}

.ae-simulation__note {
    margin: 0;
}

.ae-simulation__section-title {
    margin: 0 0 1rem;
    font-size: 1rem;
    font-weight: 600;
}

.ae-simulation__fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.ae-simulation__field {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    font-size: 0.875rem;
    color: var(--color-text-muted);
}

.ae-simulation__field span {
    font-weight: 500;
    color: var(--color-text);
}

.ae-simulation__input-group {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.ae-simulation__input-group input {
    flex: 1;
    min-width: 0;
    padding: 0.65rem 0.75rem;
    border-radius: var(--radius-sm);
}

.ae-simulation__suffix {
    color: var(--color-text-muted);
    font-size: 0.875rem;
    white-space: nowrap;
}

.ae-simulation__frequency {
    margin: 1.25rem 0 0;
    padding: 0;
    border: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.ae-simulation__frequency legend {
    width: 100%;
    margin-bottom: 0.35rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--color-text);
}

.ae-simulation__radio {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.875rem;
    color: var(--color-text);
}

.ae-simulation__actions {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-top: 1.25rem;
    flex-wrap: wrap;
}

.ae-simulation__hint {
    margin: 0;
    color: var(--color-text-muted);
    font-size: 0.8125rem;
}

.ae-simulation__feedback {
    padding: 0.75rem 1rem;
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--color-primary) 10%, transparent);
    color: var(--color-text);
    font-size: 0.875rem;
}

.ae-simulation__feedback--error {
    background: color-mix(in srgb, var(--color-danger) 12%, transparent);
    color: var(--color-danger);
}

.ae-simulation__table th,
.ae-simulation__table td {
    white-space: nowrap;
}

.ae-simulation__warnings {
    margin: 1rem 0 0;
    padding-left: 1.1rem;
    color: var(--color-warning, #b45309);
    font-size: 0.875rem;
}

.ae-simulation__warnings li + li {
    margin-top: 0.35rem;
}

.ae-simulation__form--filter {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
}

.ae-simulation__field--inline {
    max-width: 12rem;
}

.ae-simulation__field--inline select {
    width: 100%;
}

.ae-recap__row--current {
    background: color-mix(in srgb, var(--color-primary) 8%, transparent);
}

.ae-recap__row--current:hover {
    background: color-mix(in srgb, var(--color-primary) 12%, transparent);
}

.ae-recap__badge {
    display: inline-block;
    margin-left: 0.5rem;
    padding: 0.1rem 0.45rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--color-primary) 15%, transparent);
    color: var(--color-primary);
    font-size: 0.75rem;
    font-weight: 500;
}

.ae-recap__cell--highlight {
    font-weight: 600;
}

.ae-recap__cell--negative {
    color: var(--color-danger);
}

@media (max-width: 768px) {
    .ae-simulation__fields {
        grid-template-columns: 1fr;
    }
}
