#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

/* Hover SideBar Styling  --starts here */

/*.rz-navigation-item-icon {
    padding-left: 2rem;
    padding-right: 2rem;
}

.rz-navigation-item-wrapper {
    white-space: nowrap;
}

.sidebar {
    width: 85px;
    transition: 0.5s;
    overflow-x: hidden;
    padding-top: 60px;
    white-space: nowrap;
}*/

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
/*@media screen and (max-height: 450px) {
    .sidebar {
        padding-top: 15px;
    }

        .sidebar a {
            font-size: 18px;
        }
}*/

/* Hover SideBar Styling  --ends here */

/*.customer-master-steps {
    background-color: var(--rz-base-background-color);*/
    /*padding: 1rem;
    border-radius: 2px;
    border: 1px solid #1e6ff8;
    border-top: none;*/
/*}

.customer-master-panel {
    background-color: #ffffff;
    padding: 1rem;
    border-radius: 2px;*/
   /* border: 1px solid #1e6ff8;*/
/*}*/

.footer {
    padding: 0.5rem !important;
}

@media (max-width: 768px) {
    .rz-colorpicker, .rz-lookup-search input, .rz-spinner, .rz-calendar .rz-inputtext, .rz-multiselect, .rz-dropdown, .mask, .rz-textarea, .rz-textbox,
    input {
        font-size: 0.875rem !important;
    }
}

.header-card {
    padding: 1.25rem !important;
    padding-top: unset !important;
    padding-bottom: unset !important;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    border: 1px solid var(--rz-panel-menu-background-color);
    border-bottom: 0px;
    background-color: var(--rz-panel-menu-background-color) !important;
    padding: 6.5px;
    margin-bottom: 0px !important;
    box-shadow: 0px 3px 5px rgb(0 0 0 / 50%);
    z-index: 9;
}

.body-card {
    border: 1px solid var(--rz-panel-menu-background-color);
    border-top: 0px !important;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    background-color: var(--rz-card-background-color);
}
.header-card-title {
    color: var(--rz-panel-menu-item-active-color) ;
    margin-bottom:0.2rem !important;
    margin-top:0.2rem !important;
}

/* Agent */
.filter-main-div {
    background-color: #ffffff !important;
}

.details-main-div {
    background-color: #ffffff !important;
}


/* Custom Styles to Helpdesk */
.primary-background {
    background-color: #1e6ff8 !important;
}
.primary-font {
   /* color: var(--rz-panel-menu-color) !important*/
}

.card-top-border {
    border-top: 1px solid #808080;
}

.split-border {
    border-right: 1px solid #4f4f50;
}

.grid-display {
    max-height: 400px;
}

.silver-background {
    background-color: #faf19da6;
}

/*@media only screen and (max-height : 860px) and (max-width : 400px) {
    .grid-display {
        max-height: 800px;
    }
}*/

@media only screen and (max-width : 780px) {
    .grid-display {
        max-height: 580px;
    }
}

@media only screen and (max-width : 400px) {
    .grid-display {
        max-height: 360px;
    }
}


@media only screen and (max-width : 780px) {
    body .body root .root {
       /* font-size: 10px;*/

        /* Total RadzenInput styles*/
        --rz-input-height: 2rem !important;
        --rz-input-font-size: 0.775rem !important;
        --rz-input-padding: 0.38rem !important;
        --rz-input-line-height: unset !important;
        --rz-root-font-size: 12px;
        --rz-body-font-size: 0.775rem !important;
        --rz-body-line-height: unset !important;
    }


}


/*.sidebar-custom-style {
    height: 100%;
    background-color: #1e6ff8;
}*/

/* Progress Bar Color*/
.rz-progressbar-indeterminate-primary .rz-progressbar-value:before {
    background-color: var(--rz-primary) !important;
}
.rz-progressbar-indeterminate-primary .rz-progressbar-value:after {
    background-color: var(--rz-primary) !important;
}

/* Ticket Styles New Starts*/

/* Tickets Custom styles*/
/* Style For List and View Tickets */

.tickets-main-card {
    border: 1px solid var(--rz-panel-menu-background-color);
    border-top: none;
    height: 87vh;
}

.tickets-main-card-menu-header {
    border: 1px solid var(--rz-panel-menu-background-color);
    border-left: none;
    border-right: none;
    /*background-color: var(--rz-panel-menu-item-2nd-level-hover-background-color) !important;*/
    background-color: var(--rz-panel-menu-background-color);
   
    height:8%;
}
/*.header-card-title {
    color: var(--rz-base-200) !important;
    margin-bottom: 0px !important;
    padding: 6.5px;
}*/

.tickets-main-body {
    padding: 2px !important;
}

.tickets-main-card-body {
    padding: 0.5rem;
    padding-top: 3px !important;
    padding-bottom: 5px !important;
}

.tickets-main-card-sub-div {
    height: 75.5vh;
    overflow: scroll;
    overflow-x: hidden;
}

.tickets-main-card-collapsible-main-div {
    /*display:@FilterPanelVisibility;*/

    position: relative;
    /* height: 80.5vh;*/
    /*top: 2px;
    right: 4px;*/
    z-index: 9;
    box-shadow: var(--rz-shadow-10);
    /*  border: 1px solid #dedede;*/
    background-color: var(--rz-card-background-color) !important;
}

.tickets-main-card-collapsible-header-div {
}

.tickets-main-card-collapsible-body-div {
    height: 66vh;
    overflow: scroll;
    overflow-x: hidden;
}

.tickets-main-card-collapsible-footer-div {
    background-color: var(--rz-panel-menu-background-color) !important;
    color: var(--rz-base-200) !important;
}

.div-form-border {
    border: 1px solid #dedede;
    border-top: none;
}

@media only screen and (max-width : 780px) {

    .split-border{
        border-right:none;
    }

    .tickets-main-card-collapsible-main-div {
        position: absolute !important;
        left: 40%;
        top: 0.1rem;
        right: 0.1rem;
        max-width: 60% !important;
        width: auto !important;
        height: auto;
    }

    .tickets-main-card-collapsible-body-div {
        height: 42vh;
    }

    .tickets-main-card-sub-div{
        height:77.5vh !important;
    }

    .tickets-main-card{
        height:unset !important;
    }
}

/* Ticket Styles New Ends*/

.unread-messge-background-color {
     /*background-color: var(--rz-base-200);*/
    background-color: #a2a2a2;
}
/*.current-user-message-card-background-color {
    background-color: #2cc8c8;
}
.other-user-message-card-background-color {
    background-color: #f3d8fd;
}*/

:root {
    --unread-messge-background-color: #a2a2a2 !important;
    /*--unread-messge-background-color: var(--rz-base-200) !important;*/
    /* --current-user-message-card-background-color: #DCF8C6;*/
    --current-user-message-card-background-color: var(--rz-info-lighter) !important;
   /* --current-user-message-card-color: #ffffff;*/
    --other-user-message-card-background-color: var(--rz-base-background-color);
    --ticket-chat-list-height: 63.5vh;
    --reply-main-div-height: 24vh;
    --header-card-background-color: var(--rz-panel-menu-background-color);
    --header-card-color: var(--rz-base-200) !important;
    --custom-tab-button-selected-background-color: var(--header-card-background-color);
    --rz-grid-stripe-background-color: unset !important;
    --rz-panel-menu-item-2nd-level-offset: 4rem !important;
    --border-color: var(--rz-panel-menu-background-color);
    --rz-rating-selected-color: var(--rz-warning) !important;
    /*--visit-recentticket-div-height: 25.3rem;*/
}

.currentuser-reply-panel {
    /*background-color: var(--current-user-message-card-background-color) !important;*/
    background-color: var(--rz-info-lighter) !important;
}

/*.currentuser-reply-color {
    color: #ffffff !important;
}*/

.admin-container {
    height: 100%;
}

.agent-ticket-container {
    height: 100%;
}


/* To reduce side Model to Hide when we open popup model*/
.rz-dialog-mask {
    z-index: 8 !important;
}
.rz-dialog-side {
    z-index: 9 !important;
}



/*Loading Spinner*/
#ExecButton {
    margin-top: 800px;
    margin-left: 48%;
}

#semiTransparenDiv {
    width: 100%;
    /*-Lets Center the Spinner-*/
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    /*Centering my shade */
    /*margin-bottom: 40px;
    margin-top: 60px;*/
    background-color: var(--rz-dialog-mask-background-color);
    opacity:0.5;
    z-index: 9999;
    display: none;
}

/*RadzenDataGrid Loading Starts Here*/

.rz-datatable-loading {
    background-color: var(--rz-dialog-mask-background-color) !important;
    opacity: 0.5 !important;
}

/*.rz-datatable-loading-content {
    color: var(--rz-panel-menu-item-active-color) !important;
}*/

/*RadzenDataGrid Loading  Ends Here*/



/*Fluent Validation Error Message --start*/
/*.validation-message {
    display: inline-block;
    color: var(--rz-form-error-color);
    font-size: var(--rz-form-error-font-size);
    padding: var(--rz-validator-text-padding);
}*/

.validation-message {
    color: var(--rz-form-error-color);
    font-size: var(--rz-form-error-font-size);
    position: absolute !important;
    z-index: 3 !important;
    left: 50% !important;
    background-color: var(--rz-card-background-color) !important;
    padding: 0.5rem !important;
    /*top: -0.5rem !important;*/
    top: 0;
}

/*Fluent Validation Error Message --end*/


/* Radio btn Disabled the selection should be shown*/

.rz-radiobutton-box.rz-state-disabled.rz-state-active {
    background-color: var(--rz-radio-checked-background-color) !important;
}

/*Dialog Box form Mobile Show From Left stop Corner*/
@media(max-width: 768px){
    .rz-dialog:not(.rz-dialog-confirm):not(.rz-dialog-alert) {
        left: 0px !important;
    }
}

.cursor-pointer{
    cursor:pointer;
}

.nothing-to-display {
    color: lightgrey;
    font-size: 24px;
    text-align: center;
    margin: 2rem;
    font-weight: 600;
}

/*Radzen Dialog MinHeight*/
.rz-dialog{
    min-height:unset !important;
}

/* Mainlayout Styles --Starts Here*/
.custom-sidebar-toggle {
    padding: 0.5rem !important;
}

.custom-header {
    min-height: unset !important;
}
/* Mainlayout Styles --Ends Here*/


/* AgentViewTicket.Razor - Tags --Starts Here*/
.radzen-editor-custom {
    height: 15rem;
}

.custom-textbox {
    height: 1.25rem !important;
    padding: 0.2rem !important;
    background-color: var(--rz-input-background-color) !important;
    box-shadow: none !important;
    font-size: var(--rz-badge-font-size) !important;
    font-weight: var(--rz-badge-font-weight) !important;
    position: relative;
    z-index: 999999999;
}

.custom-profilemenu {
    /*height: 100%;*/
    padding: 0px !important;
    min-width: 50px;
    width: 120px;
    border: none !important;
    font-size: var(--rz-badge-font-size);
    font-weight: var(--rz-badge-font-weight);
}



/* AgentViewTicket.Razor - Tags --Ends Here*/


/* End User Landing Page- Starts Here*/
.banner {
    /*background-image: linear-gradient(90deg, #020024 0%, #090979 35%, #00d4ff 100%);*/
    width: 100%;
    height: 8rem;
    border-bottom: 1px solid #00000042;
}

.banner-text {
  /*  color: #ffffff !important;*/
}

.search-box {
    display: grid;
    grid-template-columns: 90% 10%;
    align-items: center;
    gap: 0;
}

.search-text-box {
    border-radius: 0 !important;
    padding-left: 1rem;
    border-top-left-radius: 1rem !important;
    border-bottom-left-radius: 1rem !important;
}

.search-btn {
    border-radius: 0 !important;
    border-top-right-radius: 1rem !important;
    border-bottom-right-radius: 1rem !important;
    height: var(--rz-input-height) !important;
}

.custom-dropdown {
    background: transparent;
    box-shadow: none;
    color: #ffffff;
}

.rz-dropdown-panel {
  /*  background: #01336630;*/
    border: transparent;
    /*color: #ffffff;*/
}

/* End User Landing Page - Ends Here*/

/* Enduser TicketList Feedback -Starts Here */
.emojee-image-div {
    width: 1.5rem;
}
/* Enduser TicketList Feedback -Ends Here*/

/*Home -Starts Here*/

.agent-status-datagrid-card {
    height: 28.7rem;
}
/*Home -Ends Here*/

/*Forgot Password -Starts Here*/
.forgot-password-link {
    position: absolute;
    bottom: 0;
    left: 0;
}
/*Forgot Password -Ends Here*/

/*Tags List Height: AgentTicket and AgentViewTicket --Starts Here*/
.rz-navigation-menu{
    max-height:10rem !important;
}
/*Tags List Height: AgentTicket and AgentViewTicket --Ends Here*/

.box-shadow-none{
    box-shadow:none !important;
}

.rz-footer{
    padding:0.5rem !important;
}



.rz-textbox:focus ~ .rz-form-field-label, .rz-textarea:focus ~ .rz-form-field-label, .rz-spinner:focus-within ~ .rz-form-field-label, .rz-autocomplete:focus-within ~ .rz-form-field-label, .rz-textbox:not(:placeholder-shown) ~ .rz-form-field-label, :not(.rz-state-empty) ~ .rz-form-field-label, .rz-variant-filled .rz-textarea:focus ~ .rz-form-field-label, .rz-variant-flat .rz-textarea:focus ~ .rz-form-field-label, .rz-variant-filled :not(.rz-state-empty) ~ .rz-form-field-label, .rz-variant-flat :not(.rz-state-empty) ~ .rz-form-field-label, .rz-radio-button-list-vertical ~ .rz-form-field-label, .rz-radio-button-list-horizontal ~ .rz-form-field-label, .rz-checkbox-list-vertical ~ .rz-form-field-label, .rz-checkbox-list-horizontal ~ .rz-form-field-label, .rz-chkbox ~ .rz-form-field-label
{
    display:none !important;
}
/*Hide Label when focus in FormField --Ends Here*/


/* BroadcastNotification -NotificationDisplay  --Starts Here */

.my-notification-container {
    position: fixed;
    top: 10px;
    right: 10px;
    z-index: 1000;
}

.my-notification {
    margin-bottom: 10px;
    padding: 15px;
    border-radius: 5px;
    color: white;
}

.info {
    background-color: blue;
}

.warning {
    background-color: orange;
}

.error {
    background-color: red;
}


/* BroadcastNotification -NotificationDisplay  --Ends Here */

/* RadzenDataGrid Unset Strip --Starts Here*/
    /*.rz-grid-table-striped tbody > tr:not(.rz-expanded-row-content):nth-child(odd) > td {*/
       /* background-color: unset !important;*/
        /*background-color: unset;
    }*/
/* RadzenDataGrid Unset Strip --Ends Here*/

/* Radzen datagrid Row Hover --Starts Here*/

.rz-data-row:hover {
    background-color: #0000001f !important;
}
/* Radzen datagrid Row Hover --Ends Here*/

/* My Report --Starts Here*/
.my-report {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: auto;
}

.report-header, .report-body, .report-filter {
    padding: 0.75rem;
    background: var(--rz-card-background-color);
    border: var(--rz-grid-cell-border);
}

.report-body {
    height: 100%;
    overflow: auto;
}
/* My Report --Ends Here*/



.my-popup {
    padding: 0.75rem;
    display: none;
    position: absolute;
    overflow: hidden;
    /*  height: auto; */
    max-width: 500px;
    z-index: 999999999999999999;
    padding: 0.5rem;
    border: var(--rz-panel-border);
    background-color: var(--rz-panel-background-color);
    box-shadow: var(--rz-shadow-10);
    border-radius: var(--rz-border-radius);
}

.custom-text-box {
    border: none;
    height: unset;
    border-bottom: var(--rz-input-border);
    border-radius: 0;
    line-height: unset;
    outline: none;
    padding: 0.25rem;
    box-shadow: none;
}