@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;0,1000;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900;1,1000&display=swap');

/*----------------------------- Dashboard and List CSS -----------------------------*/
.function-dashboard,
.function-list {
font-family: 'Nunito', sans-serif;
background-color: #e1e5e7;

font-size: 1.4rem;
color: #858796;
line-height: 1.5;
font-weight: 500;
}
/* Navigation bar */
.function-dashboard .navbar,
.function-list .navbar {
background-color: #e1e5e7;
border: none;
}
/* space between navbar link and dropdown icon */
.function-list .navbar .dropdown-toggle > span,
.function-dashboard .navbar .dropdown-toggle > span {
margin-left: 5px;
}
.function-list .navbar .dropdown-toggle,
.function-dashboard .navbar .dropdown-toggle {
text-transform: none;
font-size: 1.4rem;
}
/* Dropdown text and caret design */
.function-list .navbar .dropdown-toggle:hover, .function-list .navbar .dropdown-toggle:focus, .function-list .navbar .dropdown-toggle:hover > span, .function-list .navbar .dropdown-toggle:focus > span {
text-decoration: none;
background-color: transparent;
color: #93C54B;
}
.navbar .btn.btn.btn .caret, .navbar .btn.btn.btn .caret:hover, .navbar .btn.btn.btn .caret:focus {
border-top-color: inherit; /* Caret Hover, focus color */
}
.function-list .navbar .btn {
color: #5a5c69; /* Link color */
}
.navbar .btn.btn.btn:hover, .navbar .btn.btn.btn:focus {
color: #93C54B;
}

.navbar a:hover {
color: #93C54B;
}

/* Sidebar */
.function-dashboard .mCustomScrollbar,
.function-list .mCustomScrollbar {
font-family: 'Nunito', sans-serif;
background-color: #5a5c69;
background-image: linear-gradient(180deg,#5a5c69 10%,#373840 100%);
background-size: cover;
}
/*Expand button*/
.function-dashboard .mCustomScrollbar span a span.glyphicon,
.function-list .mCustomScrollbar span a span.glyphicon {
background-color: rgba(255,255,255,.2);
padding: 1rem;
border-radius: 50%;
}
.function-dashboard .r-topheader nav span span a.glyphicon,
.function-list .r-topheader nav span span a.glyphicon {
background-color: #5a5c69;
padding: 1rem;
border-radius: 50%;
color: white;
}
/*Active link*/
.function-dashboard .mCustomScrollbar .nav > li > a:hover, .nav > li > a:focus,
.function-list .mCustomScrollbar .nav > li > a:hover, .nav > li > a:focus {
background-color: rgba(255, 255, 255, 0.1);
}
/*Collapse submenu design*/
.function-dashboard .r-left .r-menu li.active.active.active > [data-menu-link], .function-list .r-left .r-menu li.active.active.active > [data-menu-link],
.function-list .r-left .r-menu li.active.active.active > [data-menu-link], .function-list .r-left .r-menu li.active.active.active > [data-menu-link] {
background-color: #5a5c69 !important;
}
.function-dashboard .r-left .r-menu li.active.active.active > [data-menu-link]:hover, .function-list .r-left .r-menu li.active.active.active > [data-menu-link]:hover,
.function-list .r-left .r-menu li.active.active.active > [data-menu-link]:hover, .function-list .r-left .r-menu li.active.active.active > [data-menu-link]:hover {
color: white !important;
}
/* Side bar filter field */
.r-vbar-page .r-left [data-itemtype="filter_panel"] .panel .panel-heading {
background-color: #4e73df;
}

/* Logo */
.function-dashboard .r-vbar-page .r-left [data-logo-cell][data-logo-cell] > [data-itemtype="expand_button"]:not([data-hidden]) { background-color: #5a5c69;}
.function-dashboard .r-vbar-page .r-left [data-logo-cell][data-logo-cell] > [data-itemid]:not([data-hidden]) { background-color: transparent; }
.function-dashboard .r-vbar-page .r-left [data-logo-cell][data-logo-cell],
.function-list .r-vbar-page .r-left [data-logo-cell][data-logo-cell] > [data-itemtype="expand_button"]:not([data-hidden]) { background-color: #5a5c69;}
.function-list .r-vbar-page .r-left [data-logo-cell][data-logo-cell] > [data-itemid]:not([data-hidden]) { background-color: transparent; }
.function-list .r-vbar-page .r-left [data-logo-cell][data-logo-cell] {
background-color: #5a5c69;
}
/* Sidebar link icon */
.function-dashboard .r-menu-title, .function-dashboard .menu-icon,
.function-list .r-menu-title, .function-dashboard .menu-icon {
font-size: 1.4rem;
margin-right: .5rem !important;
}
/* Sidebar link when active */
.function-dashboard .r-left .r-menu li.active.active.active > [data-menu-link],
.function-list .r-left .r-menu li.active.active.active > [data-menu-link] {
background-color: transparent;
font-weight: 700;
}
/* Sidebar link */
.function-dashboard .r-menu.nav.menu-treelike li a,
.function-list .r-menu.nav.menu-treelike li a{
text-transform: none;
margin-bottom: 1rem;
}
.function-dashboard .r-menu.nav.menu-treelike ul li a,
.function-list .r-menu.nav.menu-treelike ul li a{
margin-bottom: .3rem;
}


/* Dashboard content */
.function-dashboard .panel.panel-primary {
width: 20vw;
}


/*----------------------------- List CSS for list only -----------------------------*/

/* Table*/
.function-list .r-body .r-grid {
max-height: 60vh;
border: none;
padding: 1rem;
}

.function-list .r-body {
width: 100% !important;
}
/* Table head sticky and text design */
.function-list thead .r-gridrow {
background-color: #5a5c69;
position: sticky;
top: -10px;
z-index: 1;
}
.function-list thead .r-gridrow .rnr-orderlink {
color: white;
font-weight: 300;
text-decoration: none;
}
/*Edit, inline edit and view button*/
.function-list tbody .btn-link {
padding: 0 5px 0 5px;
}

.function-list .r-grid {
overflow-x:auto;
overflow-y:auto;
}

/* Custom srollbar */
.function-list .r-grid {
scrollbar-width: thin;
scrollbar-color: #1cc88a transparent;
scrollbar-border-radius: 5px;
}
.function-list .r-grid::-webkit-scrollbar { height: 8px; width: 10px;}
.function-list .r-grid::-webkit-scrollbar-thumb { background-color: #1cc88a; border-radius: 5px; box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);}
.function-list .r-grid::-webkit-scrollbar-track { background-color: transparent; }

/*Buttons - r-above section*/
.function-list .r-above .btn {
padding: 1rem 1.7rem;
line-height: 1.5;
font-weight: 400;
font-size: 1.4rem;
border-radius: .6rem;
text-transform: none;
color: white !important;
}

.function-list .btn#inlineAdd1,
.function-list .btn#New_Button3_12 {
background-color: #1cc88a;
border-color: #1cc88a;
}
.function-list .btn#inlineAdd1:hover,
.function-list .btn#New_Button3_12:hover{
background-color: #17a673;
border-color: #17a673;
}
.function-list .btn#delete_selected1 {
background-color: #e74a3b;
border-color: #e74a3b;
}
.function-list .btn#delete_selected1:hover {
background-color: #e02d1b;
border-color: #e02d1b;
}
.function-list .btn#update_selected1 {
background-color: #4e73df;
border-color: #4e73df;
}
.function-list .btn#update_selected1:hover {
background-color: #2e59d9;
border-color: #2e59d9;
}

.function-list #printpanelblock1 .btn {
background-color: #5a5c69;
padding: .4rem 1rem;
}
.function-list #printpanelblock1 .btn:hover {
background-color: #5a5c69;
}
.function-list #fildhidepanel1 .btn {
background-color: #5a5c69;
padding: .4rem 1rem;
}
.function-list #fildhidepanel1 .btn:hover {
background-color: #5a5c69;
}
/* Cancel */
.function-list #revertall_edited1 {
background-color: #3E3F3A;
border-color: #3E3F3A;
}
.function-list #revertall_edited1:hover {
background-color: #3E3F3A;
border-color: #3E3F3A;
}
/* Inline date button */
[id*="imgCal_value_release_date_"],
[id*="imgCal_value_created_date"] {
padding: .4rem 1rem;
}

/* Search */
.function-list #ctlSearchFor1,
.function-dashboard #ctlSearchFor1 {
color: #6e707e;
background-color: #f8f9fc;
border-radius: 3px 0 0 3px;
padding: .8rem 1.5rem;
}
.function-list #ctlSearchFor1::placeholder,
.function-dashboard #ctlSearchFor1::placeholder {
color: #aaa;
}
.function-list #ctlSearchFor1:hover,
.function-dashboard #ctlSearchFor1:hover {
box-shadow: 0 0 0 .2rem rgba(78,115,223,.25);
}
.function-list .navbar .input-group-btn,
.function-dashboard .navbar .input-group-btn {
background-color: #4e73df;
border-radius: 0 3px 3px 0;
}
.function-list .navbar .input-group-btn .btn,
.function-dashboard .navbar .input-group-btn .btn {
color: white;
}
.function-list .navbar .input-group input:placeholder-shown + * > .btn,
.function-dashboard .navbar .input-group input:placeholder-shown + * > .btn {
color: white;
}
.function-list .navbar .input-group-btn .btn .glyphicon,
.function-dashboard .navbar .input-group-btn .btn .glyphicon {
padding: .5rem;
}
.function-list .navbar .input-group-btn:hover,
.function-dashboard .navbar .input-group-btn:hover  {
background-color: #2e59d9;
}

/* Input field */
.function-list .form-control {
height: auto;
width: auto;
padding: .5rem;
}

/* Pagination */
.pagination li.active a {
background-color: #4e73df;
border-color: #4e73df;
color: white;
}
.pagination li.active a:hover {
background-color: #4e73df;
border-color: #4e73df;
color: white;
}

/*----------------------------- Import CSS -----------------------------*/
.function-import {
font-family: 'Nunito', sans-serif;
background-color: #e1e5e7;

font-size: 1.4rem;
color: #858796;
line-height: 1.5;
font-weight: 500;
}

.function-import .bs-pagepanel.panel.panel-primary {
border: none;
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
border-radius: 5px;
}

.function-import .panel-heading {
background-color: #5a5c69;
border-radius: 5px 5px 0 0;
}
.function-import .panel-heading h3 {
font-size: 1.9rem;
text-transform: none;
}

.function-import .btn {
padding: 1rem 1.7rem;
line-height: 1.5;
font-weight: 400;
font-size: 1.4rem;
border-radius: .6rem;
text-transform: none;
color: white !important;
background-color: #3E3F3A;
}

.function-import .btn#importButton1 {
background-color: #1cc88a;
border-color: #1cc88a;
}
.function-import .btn#importButton1:hover {
background-color: #17a673;
border-color: #17a673;
}


/* Dashboard content */
.bs-dbelement .panel.panel-primary {
width: 19vw;
height: 230px;
border: none;
border-radius: 15px;
padding: 1rem;
}

.bs-dbelement .panel-heading {
background-color: transparent;
border: none;
color: black;
font-weight: 400;
font-size: 1.5rem;
text-align: center;
}

.bs-dbelement .info-box {
text-align: center;
}

.bs-dbelement .info-img {
font-size: 3rem;
}

.bs-dbelement .dashtext {
font-size: 4rem;
border-radius: 10px;
}

.bs-dbelement .dashtext b {
font-size: 1.5rem;
padding: 8px 20px;
background-color: #5a5c69;
color: white;
border-radius: 8px;
background: linear-gradient(to right, rgb(182, 244, 146), rgb(51, 139, 147));
}

.function-dashboard [id*="list1"] .panel.panel-primary {
width: 100%;
height: 100%;
overflow: auto;
}

/* Custom srollbar */
.function-dashboard [id*="list1"] .panel.panel-primary {
scrollbar-width: thin;
scrollbar-color: #1cc88a transparent;
scrollbar-border-radius: 5px;
}
.function-dashboard [id*="list1"] .panel.panel-primary::-webkit-scrollbar { height: 8px; width: 10px;}
.function-dashboard [id*="list1"] .panel.panel-primary::-webkit-scrollbar-thumb { background-color: #1cc88a; border-radius: 5px; box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);}
.function-dashboard [id*="list1"] .panel.panel-primary::-webkit-scrollbar-track { background-color: transparent; }