/* Kendo UI theme customization using CSS variables - Blue Star theme */

:root {
    /* IVE Group Brand Colors */
    --kendo-color-primary: #1B365D;
    --kendo-color-secondary: #2C5F7A;
    --kendo-color-accent: #3f95db;
    --kendo-color-info: #4A90A4;
    --kendo-color-success: #28A745;
    --kendo-color-warning: #FD7E14;
    --kendo-color-error: #DC3545;
    --kendo-color-neutral: #6C757D;
    --kendo-color-light: #F8F9FA;
    --kendo-color-dark: #212529;
    /* Primary colors */
    --kendo-primary-color: var(--kendo-color-primary);
    --kendo-secondary-color: var(--kendo-color-secondary);
    --kendo-info-color: var(--kendo-color-info);
    --kendo-success-color: var(--kendo-color-success);
    --kendo-warning-color: var(--kendo-color-warning);
    --kendo-error-color: var(--kendo-color-error);
    /* Font settings */
    --kendo-font-family: 'BuenosAires-Regular', Arial, sans-serif;
    --kendo-font-size: 14px;
    --kendo-font-weight-normal: 400;
    --kendo-font-weight-semibold: 600;
    --kendo-font-weight-bold: 700;
    /* Border settings */
    --kendo-border-radius: 4px;
    --kendo-border-color: #E0E6ED;
    /* Apply to Kendo variables */
    --kendo-button-bg: var(--kendo-primary-color);
    --kendo-button-text: white;
    --kendo-button-border: var(--kendo-primary-color);
    /* Component-specific variables */
    --kendo-grid-header-bg: var(--kendo-color-light);
    --kendo-grid-row-hover-bg: rgba(27, 54, 93, 0.05);
    --kendo-grid-border-color: var(--kendo-border-color);
    /* Focus states */
    --kendo-focus-border-color: var(--kendo-primary-color);
    --kendo-focus-shadow: 0 0 0 2px rgba(27, 54, 93, 0.15);
}

/* Component-specific overrides */
.k-button.k-primary {
    background-color: var(--kendo-primary-color);
    border-color: var(--kendo-primary-color);
    border-radius: var(--kendo-border-radius);
    font-weight: var(--kendo-font-weight-semibold);
    transition: all 0.2s ease-in-out;
}

    .k-button.k-primary:hover,
    .k-button.k-primary.k-state-hover {
        background-color: color-mix(in srgb, var(--kendo-primary-color) 85%, black);
        border-color: color-mix(in srgb, var(--kendo-primary-color) 85%, black);
        transform: translateY(-1px);
        box-shadow: 0 4px 8px rgba(27, 54, 93, 0.2);
    }

.k-button.k-button-outline {
    background-color: transparent;
    border-color: var(--kendo-primary-color);
    color: var(--kendo-primary-color);
}

    .k-button.k-button-outline:hover {
        background-color: var(--kendo-primary-color);
        color: white;
    }

.k-grid th {
    background-color: var(--kendo-grid-header-bg);
    font-weight: var(--kendo-font-weight-semibold);
    color: var(--kendo-color-dark);
    border-bottom: 2px solid var(--kendo-border-color);
}

.k-grid tbody tr:hover {
    background-color: var(--kendo-grid-row-hover-bg);
}

.k-input, .k-textbox, .k-dropdown .k-dropdown-wrap {
    border-color: var(--kendo-border-color);
    border-radius: var(--kendo-border-radius);
    transition: all 0.2s ease-in-out;
}

    .k-input:focus, .k-textbox:focus,
    .k-dropdown .k-dropdown-wrap.k-state-focused {
        border-color: var(--kendo-focus-border-color);
        box-shadow: var(--kendo-focus-shadow);
        outline: none;
    }

.k-card {
    border-color: var(--kendo-border-color);
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.2s ease-in-out;
}

    .k-card:hover {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    }

.k-notification.k-notification-success {
    background-color: var(--kendo-success-color);
}

.k-notification.k-notification-error {
    background-color: var(--kendo-error-color);
}

.k-notification.k-notification-warning {
    background-color: var(--kendo-warning-color);
}

.k-notification.k-notification-info {
    background-color: var(--kendo-info-color);
}

.k-grid tr:hover {
    background-color: var(--kendo-grid-row-hover-bg);
}

.k-grid td {
    border-color: #e6e6e6;
    padding: 10px 16px;
}

/* Blue Star navigation styling */
.k-tabstrip-top > .k-tabstrip-items-wrapper .k-item.k-selected {
    border-bottom-color: #2a1f6c;
    color: #2a1f6c;
}

.k-tabstrip-top > .k-tabstrip-items-wrapper .k-item:not(.k-selected):hover {
    color: #3060b2;
}