/* =============================================================================
   JAOS — Compact Desktop (Chromebook 1280×720 – 1366×768)
   Active sous 1440 px de largeur (desktop ≥ 1024 px). Grands écrans inchangés.
   ============================================================================= */

@media (max-width: 1440px) and (min-width: 1024px) {
    /* ── Tokens locaux ── */
    html.fi {
        --ja-compact-sidebar: 12.5rem; /* 200px */
        --ja-compact-main-padding: 20px;
        --ja-compact-topbar-height: 56px;
        --ja-compact-btn-height: 34px;
        --ja-compact-input-height: 2.125rem;
        --ja-compact-table-row: 46px;
        --ja-panel-width: 360px;
        --sidebar-width: var(--ja-compact-sidebar);
        --ja-sidebar-width: var(--ja-compact-sidebar);
    }

    /* ── HEADER / TOPBAR ── */
    .fi-topbar {
        min-height: var(--ja-compact-topbar-height) !important;
        padding-block: 0.35rem !important;
    }

    .fi-topbar .fi-logo,
    .fi-topbar img.fi-logo,
    .fi-sidebar-header .fi-logo,
    .fi-sidebar-header img.fi-logo {
        max-width: 160px;
        max-height: 2rem;
        width: auto;
        height: auto;
        object-fit: contain;
    }

    .fi-topbar .fi-input-wrp,
    .fi-topbar .fi-global-search-field .fi-input-wrp {
        min-height: 2rem;
        padding-block: 0.15rem;
    }

    .fi-topbar .fi-input-wrp input,
    .fi-topbar .fi-global-search-field input {
        font-size: 0.8125rem;
        padding-block: 0.25rem;
    }

    .fi-topbar .fi-user-menu-trigger .fi-avatar,
    .fi-topbar .fi-avatar,
    .fi-topbar [class*="fi-user-menu"] .fi-avatar {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        min-height: 32px !important;
    }

    .fi-topbar .fi-icon-btn {
        width: 2rem;
        height: 2rem;
        min-width: 2rem;
        min-height: 2rem;
    }

    /* ── SIDEBAR ── */
    .fi-sidebar.fi-sidebar-open,
    .fi-body-has-sidebar-collapsible-on-desktop .fi-sidebar:not(.fi-sidebar-collapsed) {
        width: var(--ja-compact-sidebar) !important;
    }

    html.ja-sidebar-compact .fi-sidebar {
        width: var(--ja-sidebar-collapsed) !important;
    }

    .fi-sidebar-header {
        padding: 10px !important;
    }

    .fi-sidebar-group-label {
        margin-top: 10px;
        padding-inline: 10px;
        font-size: 10px !important;
    }

    .fi-sidebar-item a {
        margin: 2px 8px !important;
        min-height: 34px;
        padding-block: 0.28rem;
    }

    .fi-sidebar-item-icon,
    .fi-sidebar-item-icon svg {
        width: 20px !important;
        height: 20px !important;
    }

    .fi-sidebar-item-label {
        font-size: 0.8125rem;
    }

    .ja-sidebar-logout {
        margin-inline: 0.5rem;
        padding-top: 0.5rem;
    }

    .ja-sidebar-logout__btn {
        min-height: 36px;
        padding: 0.4rem 0.55rem;
        font-size: 0.8125rem;
    }

    /* ── PAGES : padding & titres ── */
    .fi-main-ctn {
        padding-left: var(--ja-compact-main-padding) !important;
        padding-right: var(--ja-compact-main-padding) !important;
    }

    .fi-page-content {
        gap: 0.85rem;
    }

    .fi-header {
        gap: 0.65rem;
        margin-bottom: 0.15rem;
    }

    .fi-header-heading {
        font-size: 2rem !important; /* 32px */
        line-height: 1.15 !important;
    }

    .fi-header-subheading {
        font-size: 0.9375rem !important; /* 15px */
        line-height: 1.45 !important;
        margin-top: 0.25rem !important;
    }

    .ja-premium-page-header .fi-header-heading {
        font-size: 1.35rem !important;
    }

    /* ── BOUTONS (CompactButton) ── */
    .fi-btn:not(.fi-size-xs):not(.fi-size-sm) {
        min-height: var(--ja-compact-btn-height);
        padding-block: 0.35rem;
        padding-inline: 0.65rem;
        font-size: 0.8125rem;
        gap: 0.35rem;
    }

    .fi-btn:not(.fi-size-xs):not(.fi-size-sm) > .fi-icon,
    .fi-btn:not(.fi-size-xs):not(.fi-size-sm) svg {
        width: 16px !important;
        height: 16px !important;
    }

    .fi-btn.ja-btn-compact,
    .ja-btn-compact.fi-btn {
        min-height: var(--ja-compact-btn-height);
        padding-block: 0.3rem;
        padding-inline: 0.6rem;
        font-size: 0.8125rem;
    }

    .fi-btn.ja-btn-compact > .fi-icon,
    .ja-btn-compact.fi-btn > .fi-icon {
        width: 16px !important;
        height: 16px !important;
    }

    .fi-icon-btn {
        width: 2rem;
        height: 2rem;
    }

    /* ── FORMULAIRES ── */
    .fi-input-wrp,
    .fi-select-input,
    .fi-fo-date-time-picker .fi-input-wrp {
        min-height: var(--ja-compact-input-height);
    }

    .fi-input,
    .fi-select-input,
    .fi-fo-date-time-picker input {
        font-size: 0.8125rem;
        min-height: var(--ja-compact-input-height);
        padding-block: 0.35rem;
    }

    .fi-fo-textarea textarea,
    .fi-fo-textarea .fi-input {
        min-height: 5.5rem;
        font-size: 0.8125rem;
    }

    .fi-fo-field-wrp {
        gap: 0.3rem;
    }

    .fi-sc.fi-sc-has-gap,
    .fi-fo-component-ctn {
        gap: 0.65rem;
    }

    .fi-section-content {
        padding: 0.85rem 1rem !important;
        gap: 0.65rem;
    }

    .ja-premium-form .fi-input,
    .ja-premium-form .fi-select-input,
    .ja-premium-form .fi-fo-date-time-picker {
        min-height: var(--ja-compact-input-height);
    }

    .ja-prestation-cards .fi-input,
    .ja-prestation-cards .fi-select-input {
        min-height: 2.35rem;
        font-size: 0.875rem;
    }

    .ja-prestation-cards .fi-fo-textarea textarea {
        min-height: 5.5rem;
    }

    /* ── CARTES / SECTIONS ── */
    .fi-wi-stats-overview-stat,
    .fi-widget,
    .fi-section:not(.fi-section-not-contained),
    .fi-ta {
        border-radius: 14px !important;
    }

    .fi-wi-stats-overview-stat {
        padding: 0.75rem 0.85rem !important;
    }

    .fi-wi-stats-overview-stat-value {
        font-size: 1.65rem !important;
    }

    .fi-wi-stats-overview-stat-chart {
        height: 40px !important;
        margin-top: 10px !important;
    }

    .fi-section-header {
        padding: 0.65rem 0.85rem !important;
    }

    .fi-ta-content-grid {
        gap: 0.85rem !important;
    }

    /* ── TABLEAUX FILAMENT ── */
    .fi-ta-cell {
        padding-top: 0.45rem !important;
        padding-bottom: 0.45rem !important;
        padding-inline: 0.5rem !important;
        font-size: 0.8125rem;
    }

    .fi-ta-row {
        min-height: var(--ja-compact-table-row);
    }

    .fi-ta-header-cell {
        padding: 0.35rem 0.5rem 0.4rem !important;
        font-size: 10px !important;
    }

    .fi-ta-actions .fi-icon-btn,
    .fi-ta-actions .fi-btn {
        width: 1.75rem;
        height: 1.75rem;
        min-width: 1.75rem;
        min-height: 1.75rem;
    }

    .fi-badge {
        padding: 0.12rem 0.4rem !important;
        font-size: 0.68rem !important;
        line-height: 1.2;
    }

    /* Tables premium / data */
    .ja-premium-table .fi-ta-row.ja-premium-row > td,
    .ja-premium-table .fi-ta-row.ja-premium-row:hover > td,
    .ja-premium-table .fi-ta-row.ja-premium-row--active > td {
        padding: 0.45rem 0.5rem;
        min-height: var(--ja-compact-table-row);
        font-size: 0.8125rem;
    }

    .ja-premium-avatar {
        width: 30px;
        height: 30px;
        font-size: 0.6rem;
    }

    .ja-premium-client__meta,
    .ja-premium-object,
    .ja-col-desc,
    .ja-col-email {
        font-size: 0.75rem; /* 12px */
    }

    .ja-data-table .fi-ta-cell,
    .ja-clients-hub-page .fi-ta-cell,
    .ja-events-hub__table-wrap .fi-ta-cell,
    .ja-orgs-hub-page .fi-ta-cell,
    .ja-rental-bookings-hub-page .fi-ta-cell {
        padding-top: 0.45rem !important;
        padding-bottom: 0.45rem !important;
    }

    .fi-ta table.fi-ta-table.ja-ta-compact th,
    .fi-ta table.fi-ta-table.ja-ta-compact td {
        padding: 0.45rem 0.5rem !important;
        font-size: 0.8125rem;
    }

    /* ── TABLEAUX DE BORD : 4 KPI sur une ligne ── */
    div:has(> .fi-wi-stats-overview-stat) {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 0.65rem !important;
    }

    .ja-cockpit-v2__kpi-grid--3,
    .ja-cockpit-v2__kpi-grid--4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ja-cockpit-v2__kpi {
        min-height: 72px;
        padding: 0.65rem 0.75rem;
        border-radius: 0.7rem;
        gap: 0.55rem;
    }

    .ja-cockpit-v2__kpi-value {
        font-size: 1.35rem;
    }

    .ja-cockpit-v2__kpi-label {
        font-size: 0.72rem;
    }

    .ja-cockpit-v2__kpi-icon {
        font-size: 1.15rem;
    }

    .ja-cockpit-v2 {
        gap: 0.85rem;
    }

    .ja-bi__kpi-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ja-bi__kpi {
        padding: 0.65rem;
        border-radius: 0.7rem;
    }

    .ja-bi__kpi-value {
        font-size: 1.15rem;
    }

    .ja-clients-crm__kpis {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ja-clients-crm__kpi {
        padding: 0.65rem 0.75rem;
        gap: 0.55rem;
    }

    .ja-events-hub__stats {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ja-events-hub__stat {
        padding: 0.6rem 0.7rem;
    }

    /* ── Hubs & pages custom ── */
    .ja-events-hub {
        gap: 0.65rem;
    }

    .ja-clients-hub__card-inner {
        padding: 0.55rem 0.65rem;
    }

    .ja-pipeline__kanban {
        grid-auto-columns: minmax(200px, 1fr);
        min-height: 440px;
    }

    /* ── Anti-débordement horizontal ── */
    .fi-layout,
    .fi-main,
    .fi-main-ctn,
    .fi-page,
    .fi-ta {
        max-width: 100%;
        overflow-x: clip;
    }

    .fi-header-actions-ctn {
        gap: 0.45rem;
        flex-wrap: wrap;
    }
}

/* Cockpit : conserver 4 KPI jusqu'à 980px (au lieu de 1100px) en compact desktop */
@media (max-width: 1440px) and (min-width: 980px) {
    .ja-cockpit-v2__kpi-grid--4,
    .ja-cockpit-v2__kpi-grid--3 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}