/* custom-ag-grid-theme.css */

/* Base styles for the Modern Quartz theme */
.ag-theme-quartz {
    --ag-background-color: #1A1A1D;
    --ag-foreground-color: #E0E0E0;
    --ag-accent-color: #1DB9C3;
    --ag-header-background-color: #2C2F33;
    --ag-header-foreground-color: #F5F5F5;
    --ag-font-size: 15px;
    --ag-font-family: 'Inter', sans-serif;
    --ag-header-font-size: 13px;
    --ag-header-font-weight: 600;
    --ag-icon-size: 18px;

    /* Remove borders */
    --ag-border-color: transparent;
    --ag-column-border-color: transparent;
    --ag-row-border-color: transparent;
    --ag-wrapper-border-color: transparent;
    --ag-side-panel-border-color: transparent;

    /* Padding and spacing */
    --ag-cell-horizontal-padding: 10px;
    --ag-row-vertical-padding: 10px;
    --ag-header-vertical-padding: 10px;
    --ag-spacing: 10px;

    /* Other customizations */
    border-radius: 12px;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15); /* Add shadow */
    transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1); /* Add transition */
}

/* Override specific ag-Grid classes as needed */
.ag-theme-quartz .ag-header {
    background-color: var(--ag-header-background-color);
    color: var(--ag-header-foreground-color);
    font-size: var(--ag-header-font-size);
    font-weight: var(--ag-header-font-weight);
    text-align: center; /* Center text */
}

.ag-theme-quartz .ag-row {
    background-color: var(--ag-background-color);
    color: var(--ag-foreground-color);
    display: flex; /* Use flexbox */
    align-items: center; /* Center items vertically */
}

.ag-theme-quartz .ag-cell {
    display: flex; /* Use flexbox for alignment */
    align-items: center; /* Center items vertically */
    justify-content: center; /* Center items horizontally if needed */
    font-size: var(--ag-font-size);
    font-family: var(--ag-font-family);
    padding: var(--ag-cell-horizontal-padding);
    text-align: left; /* Align text to the left */
}

.ag-theme-quartz .ag-icon {
    width: var(--ag-icon-size);
    height: var(--ag-icon-size);
    fill: var(--ag-accent-color);
}

/* Additional custom styles based on the theme parameters */