.layout {
    background-color: #fff !important;
    font-family: Cairo !important;
}

@font-face {
    font-family: Cairo;
    src: url("../fonts/Cairo-VariableFont.ttf");
    font-weight: 100 1000;
}

.rz-text-h1, .rz-text-h2, .rz-text-h3, .rz-text-h4, .rz-text-h5, .rz-text-h6, .rz-text-display-h6 {
    font-family: Cairo !important;
    font-weight: 700 !important;
}

.rz-text-body1 {
    font-family: Cairo !important;
    font-size: 18px !important;
}

.rz-body {
    margin: 0px !important;
    background-color: #fff !important;
    /* padding: 0 !important; */
    font-family: Cairo !important;
}

.rz-sidebar {
    background: var(--gradient) !important;
    border-radius: calc(4px * 4);
    margin: 10px;
    margin-right: 0 !important;
}

.rz-header {
    color: var(--light-color) !important;
    border-radius: calc(4px * 4);
    background-color: #fff;
    min-height: max-content;
    padding: 20px 0 !important;
}

.rz-menu:not(.rz-profile-menu) {
    background-color: #fff !important;
}

.rz-navigation-item-text {
    font-family: Cairo !important;
    font-weight: 700 !important;
}

.rz-card {
    background-color: #fff !important;
}

    .rz-card.rz-variant-filled {
        box-shadow: none;
        border: var(--rz-card-border);
        border-radius: 0;
    }

.rz-card-group > .rz-card:last-of-type {
    border-start-end-radius: 0 !important;
    border-end-end-radius: 0 !important;
}

.rz-card-group > .rz-card:first-of-type {
    border-start-start-radius: 0 !important;
    border-end-start-radius: 0 !important;
}


.rz-panel-menu .rz-navigation-item-active:before, .rz-panel-menu .rz-navigation-item-wrapper-active:before {
    background-color: var(--warning-color) !important;
}

.rz-panel-menu .rz-navigation-item-active .rz-navigation-item-icon, .rz-panel-menu .rz-navigation-item-wrapper-active .rz-navigation-item-icon {
    color: var(--dark-color) !important;
}

.rz-panel-menu .rz-navigation-item-active, .rz-panel-menu .rz-navigation-item-wrapper-active {
    background-color: #dfe5ec !important;
    color: var(--dark-color) !important;
}

.rz-panel-menu .rz-navigation-item {
    color: var(--light-color) !important;
}

.rz-panel-menu .rz-navigation-item {
    border-block-end: 0 !important;
    margin: 10px 10px !important;
}

    .rz-panel-menu .rz-navigation-item .rz-navigation-item-icon {
        color: var(--light-color)
    }

.rz-panel-menu {
    background-color: transparent !important;
}

.rz-color-primary {
    color: var(--primary-color) !important;
}

/*Data Grid*/

.rz-grid-table td {
    padding: 0.625rem 1rem !important;
    border-bottom: 1px dashed #e0e0e0 !important;
}

.rz-data-grid {
    border-top: 1px dashed #e0e0e0 !important;
    border-bottom: 1px dashed #e0e0e0 !important;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
}

.rz-grid-table th {
    padding: 0 0 !important;
    border-bottom: 1px dashed #e0e0e0 !important;
}

.rz-column-title-content {
    text-transform: uppercase;
    font-weight: 700;
}

.rz-datatable-data td .rz-cell-data,
.rz-grid-table td .rz-cell-data {
    font-size: 16px !important;
    line-height: 2 !important;
}

/*Data Grid*/

/*Buttons*/

.rz-button .rz-variant-filled .rz-primary {
    background-color: var(--primary-color);
    color: #fff;
}

.rz-button {
    border-radius: 0 !important;
    font-weight: 700 !important;
}

    .rz-button.rz-button-sm {
        font-size: 14px !important;
    }

    .rz-button.rz-primary.rz-variant-filled {
        background-color: var(--primary-color) !important;
        color: #fff !important;
        font-weight: 700 !important
    }

    .rz-button.rz-light.rz-variant-filled {
        background-color: var(--primary-color) !important;
        color: #fff !important;
        box-shadow: none !important;
        border: none;
        border-radius: 0 !important;
        padding: .5rem 1.5rem !important;
        font-weight: 700 !important
    }

.rz-textbox, .rz-inputtext, .rz-dropdown, .rz-numeric {
    border-radius: 0 !important;
}

/*Buttons*/


/*Dialog*/

.rz-dialog {
    border-radius: 0 !important;
    background-color: #fff;
}

.rz-dialog-titlebar {
    background-color: #fff;
}

.rz-dialog-content {
    background-color: #fff;
}

/*Dialog*/

/*Alerts*/

.rz-alert {
    border-radius: 0 !important;
}

    .rz-alert.rz-primary {
        border-color: var(--primary-color) !important;
        font-size: 16px !important;
        font-weight: 700;
    }

    .rz-alert.rz-variant-outlined.rz-primary.rz-shade-default {
        box-shadow: inset 0 0 0 var(--rz-border-width) var(--primary-color);
        --rz-alert-color: var(--primary-color);
        --rz-alert-title-color: var(--primary-color);
        --rz-alert-icon-color: var(--primary-color);
    }

/*Alerts*/

/*Store*/

.rzi-primary {
    color: var(--primary-color) !important;
}

.rz-badge-primary {
    background-color: var(--primary-color) !important;
}

    .rz-badge-primary > .rz-text-subtitle2 {
        color: #fff !important;
    }

.store-product {
    cursor: pointer;
    border: 2px solid transparent;
    transition: border 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}

    .store-product:hover {
        border: 2px solid var(--primary-color); /* Customize the border color */
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2); /* Customize the shadow */
        transform: translateY(-5px); /* Elevates the card */
    }

.categories-dropdown {
    background-color: var(--primary-color) !important;
    color: #fff !important;
    font-size: 16px;
    font-weight: bold
}

    .categories-dropdown:focus {
        border: none !important;
    }

.rz-dropdown-items-wrapper {
    max-height: max-content !important;
    overflow: visible;
}

/*Store*/



:root {
    --primary-color: #1f3c88;
    --warning-color: #f0ad4e;
    --light-color: #f8f9fa;
    --dark-color: #343a40;
    --gradient: linear-gradient(0deg, rgba(21, 62, 138, 1) 40%, rgba(30, 64, 175, 1) 66%);
}