/* ========================================
   SEDNA DEVEXPRESS DATA GRID - DESIGN SYSTEM ALIGNED
   Completamente basato su Sedna Design System Tokens
   ======================================== */

/* ========================================
   CSS VARIABLES - SEDNA ALIGNED
   ======================================== */
.sedna-dx-grid {
    /* ✅ Usa variabili Sedna */
    --grid-primary: var(--sedna-primary);
    --grid-primary-hover: var(--sedna-primary-hover);
    --grid-primary-active: var(--sedna-primary-active);
    --grid-primary-subtle: var(--sedna-primary-subtle);
    --grid-primary-subtle-hover: var(--sedna-primary-subtle-hover);
    --grid-surface: var(--sedna-surface);
    --grid-surface-variant: var(--sedna-surface-variant);
    --grid-surface-hover: var(--sedna-surface-hover);
    --grid-bg: var(--sedna-bg);
    --grid-border: var(--sedna-border);
    --grid-border-strong: var(--sedna-border-strong);
    --grid-divider: var(--sedna-divider);
    --grid-text: var(--sedna-text);
    --grid-text-secondary: var(--sedna-text-secondary);
    --grid-text-tertiary: var(--sedna-text-tertiary);
    --grid-text-disabled: var(--sedna-text-disabled);
    /* ✅ Focus state */
    --grid-focus-ring: var(--sedna-focus-ring);
    --grid-focus-color: var(--sedna-focus-color);
    /* ✅ Transitions */
    --grid-transition: var(--sedna-transition-fast);
    --grid-transition-base: var(--sedna-transition-base);
    /* ✅ Spacing */
    --grid-space-sm: var(--sedna-space-2);
    --grid-space-md: var(--sedna-space-3);
    --grid-space-lg: var(--sedna-space-4);
    /* ✅ Border Radius */
    --grid-radius-sm: var(--sedna-radius-sm);
    --grid-radius-md: var(--sedna-radius-md);
    --grid-radius-lg: var(--sedna-radius-lg);
    /* ✅ Shadows */
    --grid-shadow-sm: var(--sedna-shadow-sm);
    --grid-shadow-md: var(--sedna-shadow-md);
    --grid-shadow-lg: var(--sedna-shadow-lg);
    /* ✅ Typography */
    font-family: var(--sedna-font-sans);
    font-size: var(--sedna-text-sm);
    font-weight: var(--sedna-font-normal);
    line-height: var(--sedna-leading-normal);
    /* ✅ Font Smoothing */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* ========================================
   ROOT CONTAINER
   ======================================== */
.sedna-dx-grid {
    background: var(--grid-surface);
    border: 1px solid var(--grid-border);
    border-top-left-radius: var(--grid-radius-lg);
    border-top-right-radius: var(--grid-radius-lg);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: calc(100vh - 120px);
    box-shadow: var(--grid-shadow-sm);
}

    .sedna-dx-grid td, th {
        font-family: var(--sedna-font-sans) !important;
        font-size: var(--sedna-text-sm) !important;
        font-weight: var(--sedna-font-normal) !important;
        line-height: var(--sedna-leading-normal) !important;
        /* ✅ Font Smoothing */
        -webkit-font-smoothing: antialiased !important;
        -moz-osx-font-smoothing: grayscale !important;
    }

    .sedna-dx-grid th {
        background-color: var(--sedna-surface) !important;
        box-shadow: var(--sedna-shadow-sm);
        border-left: none !important;
        border-right: none !important;
        border-color: var(--sedna-border) !important;
    }

        .sedna-dx-grid th .dxbl-grid-header-content > span {
            color: var(--sedna-text-tertiary) !important;
        }

    .sedna-dx-grid td {
        border-left: none !important;
        border-right: none !important;
        border-color: var(--sedna-border) !important;
    }
    /* ========================================
   TOOLBAR CONTAINER
   ======================================== */
    /* .sedna-dx-grid .dxbl-toolbar,
    .sedna-dx-grid .dxbl-grid-toolbar-container {
        padding: var(--grid-space-md) var(--grid-space-lg);
        min-height: 60px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: var(--grid-space-sm);
        flex-wrap: wrap;
        background: var(--grid-surface);
        border-bottom: 1px solid var(--grid-divider);
        font-family: var(--sedna-font-sans);
        font-size: var(--sedna-text-sm);
        line-height: var(--sedna-leading-normal);
        color: var(--grid-text);
    }

        .sedna-dx-grid .dxbl-toolbar-items,
        .sedna-dx-grid .dxbl-toolbar > div {
            display: flex;
            align-items: center;
            gap: var(--grid-space-sm);
            flex-wrap: wrap;
        }

    .sedna-dx-grid .dxbl-toolbar-item {
        display: inline-flex;
        align-items: center;
        margin: 0;
    }*/
    /* ========================================
   TOOLBAR BUTTONS
   ======================================== */
    /*.sedna-dx-grid .dxbl-toolbar .btn,
    .sedna-dx-grid .dxbl-toolbar button,
    .sedna-dx-grid .dxbl-toolbar .dxbl-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: var(--sedna-space-2);
        height: var(--sedna-control-height-sm);
        padding: 0 var(--sedna-space-4);
        font-family: var(--sedna-font-sans);
        font-size: var(--sedna-text-sm);
        font-weight: var(--sedna-font-medium);
        line-height: var(--sedna-leading-none);
        text-align: center;
        white-space: nowrap;
        vertical-align: middle;
        border: 1px solid var(--grid-border);
        border-radius: var(--grid-radius-md);
        background: var(--grid-surface);
        color: var(--grid-text-secondary);
        cursor: pointer;
        user-select: none;
        text-decoration: none;
        transition: all var(--grid-transition);
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

        .sedna-dx-grid .dxbl-toolbar .btn:hover,
        .sedna-dx-grid .dxbl-toolbar button:hover,
        .sedna-dx-grid .dxbl-toolbar .dxbl-btn:hover {
            background-color: var(--grid-surface-hover);
            border-color: var(--grid-primary);
            color: var(--grid-primary);
            box-shadow: var(--grid-shadow-sm);
        }

        .sedna-dx-grid .dxbl-toolbar .btn:active,
        .sedna-dx-grid .dxbl-toolbar button:active,
        .sedna-dx-grid .dxbl-toolbar .dxbl-btn:active {
            box-shadow: none;
        }

        .sedna-dx-grid .dxbl-toolbar .btn:focus-visible,
        .sedna-dx-grid .dxbl-toolbar button:focus-visible,
        .sedna-dx-grid .dxbl-toolbar .dxbl-btn:focus-visible {
            outline: 0;
            box-shadow: var(--grid-focus-ring);
        }

        .sedna-dx-grid .dxbl-toolbar .btn:disabled,
        .sedna-dx-grid .dxbl-toolbar button:disabled,
        .sedna-dx-grid .dxbl-toolbar .dxbl-btn:disabled {
            opacity: 0.5;
            cursor: not-allowed;
            pointer-events: none;
        }*/

    /* ✅ Primary Button */
    /*.sedna-dx-grid .dxbl-toolbar .btn-primary,
    .sedna-dx-grid .dxbl-toolbar .dxbl-btn-primary {
        background: var(--grid-primary);
        border-color: var(--grid-primary);
        color: var(--sedna-on-primary);
    }

        .sedna-dx-grid .dxbl-toolbar .btn-primary:hover,
        .sedna-dx-grid .dxbl-toolbar .dxbl-btn-primary:hover {
            background: var(--grid-primary-hover);
            border-color: var(--grid-primary-hover);
            color: var(--sedna-on-primary);
        }*/

    /* ========================================
   TOOLBAR ICONS
   ======================================== */
    .sedna-dx-grid .dxbl-toolbar .btn i,
    .sedna-dx-grid .dxbl-toolbar button i,
    .sedna-dx-grid .dxbl-toolbar .dxbl-btn i,
    .sedna-dx-grid .dxbl-toolbar .bi {
        font-size: 1rem;
        line-height: 1;
        vertical-align: middle;
        flex-shrink: 0;
    }

    .sedna-dx-grid .dxbl-toolbar .btn:not(:has(span)),
    .sedna-dx-grid .dxbl-toolbar button:not(:has(span)) {
        width: var(--sedna-control-height-sm);
        padding: 0;
    }

    /* ========================================
   TOOLBAR BADGE & SELECTION INFO
   ======================================== */
    .sedna-dx-grid .dxbl-toolbar .badge {
        padding: var(--sedna-space-2) var(--sedna-space-3);
        border-radius: var(--sedna-radius-full);
        font-size: var(--sedna-text-xs);
        font-weight: var(--sedna-font-semibold);
        letter-spacing: 0.02em;
        display: inline-flex;
        align-items: center;
        gap: var(--sedna-space-1);
        line-height: var(--sedna-leading-none);
        vertical-align: middle;
    }

    .sedna-dx-grid .dxbl-toolbar .badge-primary {
        background: var(--grid-primary-subtle);
        color: var(--grid-primary);
    }

    /* ========================================
   TOOLBAR DROPDOWN
   ======================================== */
    .sedna-dx-grid .dxbl-toolbar .dropdown-toggle::after {
        margin-left: var(--sedna-space-2);
        vertical-align: middle;
    }

    .sedna-dx-grid .dxbl-toolbar .dropdown-menu {
        border-radius: var(--grid-radius-md);
        border: 1px solid var(--grid-border);
        box-shadow: var(--grid-shadow-lg);
        margin-top: var(--sedna-space-1);
        background: var(--grid-surface);
    }

    .sedna-dx-grid .dxbl-toolbar .dropdown-item {
        padding: var(--sedna-space-2) var(--sedna-space-4);
        font-size: var(--sedna-text-sm);
        display: flex;
        align-items: center;
        gap: var(--sedna-space-2);
        transition: all var(--grid-transition);
        color: var(--grid-text);
    }

        .sedna-dx-grid .dxbl-toolbar .dropdown-item:hover {
            background-color: var(--grid-surface-hover);
            color: var(--grid-primary);
        }



    /* ========================================
   HEADER ROW
   ======================================== */
    .sedna-dx-grid .dxbl-grid-header-row {
        background: var(--grid-surface-variant);
        border-bottom: 1px solid var(--grid-divider);
        /* D26: responsive via clamp() — vedi sedna.tokens.css */
        height: var(--sedna-grid-header-h, 44px);
    }

    .sedna-dx-grid .dxbl-grid-header-cell {
        padding: var(--grid-space-md) var(--grid-space-lg);
        height: var(--sedna-grid-header-h, 44px);
        font-weight: var(--sedna-font-semibold);
        font-size: var(--sedna-text-xs);
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: var(--sedna-text-tertiary);
        border-right: none;
        transition: background-color var(--grid-transition);
        white-space: nowrap;
        vertical-align: middle;
        line-height: var(--sedna-leading-tight);
        display: table-cell;
    }

        .sedna-dx-grid .dxbl-grid-header-cell:hover {
            background-color: var(--grid-surface-hover);
        }

        .sedna-dx-grid .dxbl-grid-header-sort-icon,
        .sedna-dx-grid .dxbl-grid-header-cell .dxbl-grid-icon {
            color: var(--grid-primary);
            font-size: var(--sedna-text-xs);
            margin-left: var(--sedna-space-1);
            vertical-align: middle;
        }

    /* ========================================
   FILTER ROW
   ======================================== */
    .sedna-dx-grid .dxbl-grid-filter-row {
        background: var(--grid-surface);
        border-bottom: 1px solid var(--grid-divider);
        /* D26: responsive via clamp() */
        height: var(--sedna-grid-filter-h, 40px);
    }

        .sedna-dx-grid .dxbl-grid-filter-row .dxbl-grid-filter-row-cell {
            padding: var(--sedna-space-1) var(--grid-space-lg);
            vertical-align: middle;
        }

        .sedna-dx-grid .dxbl-grid-filter-row input,
        .sedna-dx-grid .dxbl-grid-filter-row select,
        .sedna-dx-grid .dxbl-grid-filter-row .dxbl-edit,
        .sedna-dx-grid .dxbl-grid-filter-row .form-control {
            border: 1px solid var(--grid-border);
            border-radius: var(--grid-radius-sm);
            padding: var(--sedna-space-2);
            height: var(--sedna-control-height-sm);
            font-size: var(--sedna-text-sm);
            line-height: var(--sedna-leading-normal);
            transition: border-color var(--grid-transition), box-shadow var(--grid-transition);
            background: var(--grid-surface);
            color: var(--grid-text);
        }

            .sedna-dx-grid .dxbl-grid-filter-row input:focus,
            .sedna-dx-grid .dxbl-grid-filter-row select:focus,
            .sedna-dx-grid .dxbl-grid-filter-row .dxbl-edit:focus,
            .sedna-dx-grid .dxbl-grid-filter-row .form-control:focus {
                outline: none;
                border-color: var(--grid-focus-color);
                box-shadow: var(--grid-focus-ring);
            }

    /* ========================================
   DATA CONTAINER - SCROLLABLE
   ======================================== */
    .sedna-dx-grid .dxbl-grid-data-container {
        flex: 1 1 auto !important;
        overflow-y: auto !important;
        overflow-x: auto !important;
        min-height: 0 !important;
        background: var(--grid-surface);
    }

        .sedna-dx-grid .dxbl-grid-data-container::-webkit-scrollbar {
            width: 8px;
            height: 8px;
        }

        .sedna-dx-grid .dxbl-grid-data-container::-webkit-scrollbar-track {
            background: var(--grid-bg);
        }

        .sedna-dx-grid .dxbl-grid-data-container::-webkit-scrollbar-thumb {
            background: var(--grid-border-strong);
            border-radius: var(--sedna-radius-sm);
        }

            .sedna-dx-grid .dxbl-grid-data-container::-webkit-scrollbar-thumb:hover {
                background: var(--grid-text-tertiary);
            }

    /* Firefox scrollbar */
    .sedna-dx-grid .dxbl-grid-data-container {
        scrollbar-width: thin;
        scrollbar-color: var(--grid-border-strong) var(--grid-bg);
    }

    /* ========================================
   DATA ROWS
   ======================================== */
    .sedna-dx-grid .dxbl-grid-data-row,
    .sedna-dx-grid .dxbl-grid-data-row > td {
        border-bottom: 1px solid var(--grid-divider);
        transition: background-color var(--grid-transition);
        background: var(--grid-surface);
        /* D26: responsive 36→40px (era 48 fisso → liste sembravano spaziose su 14") */
        height: var(--sedna-grid-row-h, 48px);
    }

        .sedna-dx-grid .dxbl-grid-data-row:hover,
        .sedna-dx-grid .dxbl-grid-data-row:hover > td {
            background-color: var(--grid-surface-hover);
        }

    /* ========================================
   DATA CELLS
   ======================================== */
    .sedna-dx-grid .dxbl-grid-data-cell {
        padding: var(--grid-space-md) var(--grid-space-lg);
        /* D26: responsive */
        height: var(--sedna-grid-row-h, 48px);
        font-size: var(--sedna-text-sm);
        color: var(--grid-text);
        vertical-align: middle;
        border-right: none;
        line-height: var(--sedna-leading-snug);
    }

    /* Testo di TUTTE le celle del corpo, incluse le fixed-cell e le td senza
       classe dei template (CODICE/DESCRIZIONE, ecc.): DevExpress impone un
       near-black fisso che in dark resta scuro su scuro. Forziamo il colore del
       tema (theme-aware via --grid-text). I figli con colore proprio (es. badge)
       mantengono il loro, perché hanno una dichiarazione diretta. */
    .sedna-dx-grid .dxbl-grid-table tbody td {
        color: var(--grid-text) !important;
    }

        .sedna-dx-grid .dxbl-grid-data-cell img {
            border-radius: var(--sedna-radius-full);
            width: 32px;
            height: 32px;
            object-fit: cover;
            margin-right: var(--sedna-space-2);
            vertical-align: middle;
        }

    .sedna-dx-grid .user-info {
        display: inline-flex;
        align-items: center;
        gap: var(--sedna-space-2);
        line-height: 1;
    }

    .sedna-dx-grid .user-avatar {
        width: 32px;
        height: 32px;
        border-radius: var(--sedna-radius-full);
        object-fit: cover;
        flex-shrink: 0;
    }

    .sedna-dx-grid .user-name {
        font-weight: var(--sedna-font-medium);
        color: var(--grid-text);
        font-size: var(--sedna-text-sm);
        line-height: var(--sedna-leading-snug);
    }

    /* ========================================
   SELECTION COLUMN
   ======================================== */
    .sedna-dx-grid .dxbl-grid-selection-column,
    .sedna-dx-grid .dxbl-grid-selection-cell {
        width: 48px;
        text-align: center;
        padding: var(--grid-space-md) var(--sedna-space-2);
        vertical-align: middle;
    }

        .sedna-dx-grid .dxbl-grid-selection-column input[type="checkbox"],
        .sedna-dx-grid .dxbl-grid-selection-cell input[type="checkbox"] {
            width: 16px;
            height: 16px;
            cursor: pointer;
            accent-color: var(--grid-primary);
            vertical-align: middle;
            margin: 0;
        }

    .sedna-dx-grid .dxbl-grid-data-row-selected,
    .sedna-dx-grid .dxbl-grid-data-row-selected > td {
        background-color: var(--grid-primary-subtle) !important;
    }

        .sedna-dx-grid .dxbl-grid-data-row-selected:hover,
        .sedna-dx-grid .dxbl-grid-data-row-selected:hover > td {
            background-color: var(--grid-primary-subtle-hover) !important;
        }

    /* ========================================
   BADGES
   ======================================== */
    .sedna-dx-grid .badge {
        padding: var(--sedna-space-1) var(--sedna-space-2);
        border-radius: var(--sedna-radius-full);
        font-size: var(--sedna-text-xs);
        font-weight: var(--sedna-font-semibold);
        letter-spacing: 0.02em;
        display: inline-flex;
        align-items: center;
        gap: var(--sedna-space-1);
        line-height: var(--sedna-leading-tight);
        vertical-align: middle;
    }

    .sedna-dx-grid .badge-success {
        background-color: var(--sedna-success-50);
        color: var(--sedna-success-700);
    }

    .sedna-dx-grid .badge-danger {
        background-color: var(--sedna-error-50);
        color: var(--sedna-error-700);
    }

    .sedna-dx-grid .badge-warning {
        background-color: var(--sedna-warning-50);
        color: var(--sedna-warning-700);
    }

    .sedna-dx-grid .badge-primary {
        background-color: var(--sedna-brand-50);
        color: var(--sedna-brand-700);
    }

    .sedna-dx-grid .badge i {
        font-size: var(--sedna-text-xs);
        line-height: 1;
    }

    /* ========================================
   PAGER
   ======================================== */
    .sedna-dx-grid .dxbl-grid-pager {
        background: var(--grid-surface);
        border-top: 1px solid var(--grid-divider);
        padding: var(--grid-space-md) var(--grid-space-lg);
        /* D26: responsive */
        min-height: var(--sedna-grid-footer-h, 56px);
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .sedna-dx-grid .dxbl-pager {
        display: flex;
        align-items: center;
        gap: var(--sedna-space-1);
    }

        .sedna-dx-grid .dxbl-pager-item,
        .sedna-dx-grid .dxbl-pager .dxbl-btn {
            border-radius: var(--grid-radius-md);
            padding: var(--sedna-space-2) var(--sedna-space-3);
            height: var(--sedna-control-height-sm);
            font-size: var(--sedna-text-sm);
            line-height: var(--sedna-leading-none);
            border: 1px solid transparent;
            background: transparent;
            transition: all var(--grid-transition);
            cursor: pointer;
            color: var(--grid-text-secondary);
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

            .sedna-dx-grid .dxbl-pager-item:hover,
            .sedna-dx-grid .dxbl-pager .dxbl-btn:hover {
                background-color: var(--grid-surface-hover);
            }

        .sedna-dx-grid .dxbl-pager-item-active,
        .sedna-dx-grid .dxbl-pager .dxbl-btn-active {
            background-color: var(--grid-primary) !important;
            color: var(--sedna-on-primary) !important;
            font-weight: var(--sedna-font-semibold);
        }

    /* ========================================
   COLUMN CHOOSER
   ======================================== */
    .sedna-dx-grid .dxbl-grid-column-chooser {
        border-radius: var(--grid-radius-lg);
        box-shadow: var(--grid-shadow-lg);
        border: 1px solid var(--grid-border);
        background: var(--grid-surface);
    }

    /* ========================================
   LOADING STATE
   ======================================== */
    .sedna-dx-grid .dxbl-grid-loading-panel {
        background: var(--grid-surface);
        opacity: 0.95;
        backdrop-filter: blur(4px);
    }

    .sedna-dx-grid .dxbl-grid-loading-indicator {
        color: var(--grid-primary);
    }

    /* ========================================
   EMPTY STATE
   ======================================== */
    .sedna-dx-grid .dxbl-grid-empty-data-row {
        padding: var(--sedna-space-12) var(--sedna-space-4);
        text-align: center;
        color: var(--grid-text-secondary);
    }

        .sedna-dx-grid .dxbl-grid-empty-data-row i {
            font-size: 2.5rem;
            color: var(--grid-text-tertiary);
            display: block;
            margin-bottom: var(--sedna-space-4);
        }

    /* ========================================
   FIXED COLUMNS
   ======================================== */
    .sedna-dx-grid .dxbl-grid-fixed-column-left {
        position: sticky;
        left: 0;
        z-index: 5;
        background: var(--grid-surface);
        box-shadow: var(--grid-shadow-sm);
    }

    .sedna-dx-grid .dxbl-grid-fixed-column-right {
        position: sticky;
        right: 0;
        z-index: 5;
        background: var(--grid-surface);
        box-shadow: var(--grid-shadow-sm);
    }

/* ========================================
   RESPONSIVE
   ======================================== */
@media (max-width: 768px) {
    .sedna-dx-grid {
        border-radius: var(--grid-radius-md);
        max-height: calc(100vh - 80px);
    }

        .sedna-dx-grid .dxbl-toolbar {
            padding: var(--sedna-space-2) var(--sedna-space-3);
            min-height: 56px;
        }

        .sedna-dx-grid .dxbl-grid-data-cell {
            padding: var(--sedna-space-2) var(--sedna-space-3);
            font-size: var(--sedna-text-sm);
        }

        .sedna-dx-grid .dxbl-grid-header-cell {
            padding: var(--sedna-space-2) var(--sedna-space-3);
            font-size: var(--sedna-text-xs);
        }

        .sedna-dx-grid .user-avatar {
            width: 28px;
            height: 28px;
        }
}


.sedna-grid-empty-area {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 400px;
    padding: 3rem 2rem;
    text-align: center;
}

    .sedna-grid-empty-area i.bi {
        opacity: 0.6;
        animation: fadeInUp 0.5s ease-out;
    }

    .sedna-grid-empty-area h5 {
        color: var(--sedna-heading-color, #1f2937);
        font-weight: 600;
    }

    .sedna-grid-empty-area p {
        max-width: 400px;
        margin-left: auto;
        margin-right: auto;
    }

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

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

/* Loading animation per Wait Indicator */
.dxbl-wait-indicator-spin {
    color: var(--sedna-primary, #0ea5e9);
}


/* Animazione spinner circolare */
.sedna-spinner {
    animation: rotate 2s linear infinite;
    transform-origin: center center;
}

    .sedna-spinner .path {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
        animation: dash 1.5s ease-in-out infinite;
        stroke-linecap: round;
    }

@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes dash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -35px;
    }

    100% {
        stroke-dasharray: 89, 200;
        stroke-dashoffset: -124px;
    }
}

/* Animazione progress bar */
.sedna-progress-bar {
    animation: progress 1.5s ease-in-out infinite;
    transform-origin: left center;
}

@keyframes progress {
    0% {
        transform: scaleX(0);
        transform-origin: left center;
    }

    50% {
        transform: scaleX(0.7);
        transform-origin: left center;
    }

    100% {
        transform: scaleX(0);
        transform-origin: right center;
    }
}

/* Stile area vuota */
.sedna-grid-empty-area {
    padding: 3rem 2rem;
    min-height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sedna-badge-close-btn:hover {
    background: rgba(30, 64, 175, 0.15) !important;
}

.sedna-badge-close-btn:active {
    background: rgba(30, 64, 175, 0.25) !important;
    transform: scale(0.95);
}

.sedna-badge-close-btn:focus-visible {
    outline: 2px solid rgba(30, 64, 175, 0.5);
    outline-offset: 2px;
}

/* Barra azioni massive contestuali (BulkActionsTemplate) */
.sedna-grid-bulk-actions {
    display: flex;
    align-items: center;
    gap: var(--sedna-space-2, 0.5rem);
}

/* ===== REDUCED MOTION =====
   Disabilita le animazioni decorative (reveal icona empty-state, press scale).
   Spinner e progress bar restano: sono feedback di caricamento essenziali. */
@media (prefers-reduced-motion: reduce) {
    .sedna-grid-empty-area i.bi {
        animation: none;
    }

    .sedna-badge-close-btn:active {
        transform: none;
    }
}