/* Works on Chrome, Edge, and Safari */
/* html, body, * {
    font-size: 18px !important;
} */

*::-webkit-scrollbar {
    width: 6px;
}
*::-webkit-scrollbar-track {
    background: var(--scroll-bg);
}
*::-webkit-scrollbar-thumb {
    background-color: var(--scroll-color);
    border-radius: 20px;
}
* {
    scrollbar-width: thin;
    scrollbar-color: var(--scroll-color) var(--scroll-bg);
}
.awesomplete .input-with-feedback {
    border: 1px solid var(--input-border);
    background-color: var(--input-background) !important;
    border-radius: 5px !important;
}
.form-control {
    border: 1px solid var(--input-border);
    background-color: var(--input-background) !important;
    border-radius: 5px !important;
}
.like-disabled-input{
    border: 1px solid var(--input-border);
    background-color: var(--input-background) !important;
}
.navbar .navbar-nav .nav-link {
    color: white;
}
.input-group {
    border-radius: 5px !important;
    background-color: var(--input-background) !important;
}

.search-bar .awesomplete input {
    background-color: var(--bg-color);
    color: black !important;
}
.modal-backdrop{
    background-color: #2c436b !important;
}
.widget .widget-head .widget-title {
    font-size: var(--text-base);
}
.comment-box .comment-input-header, .form-dashboard-section .section-head, .form-section .section-head, .head-title {
    font-size: var(--text-base);
    font-weight: 600;
}
.comment-box .comment-input-container .ql-editor {
    border: 1px solid var(--border-color);
}
.duration-picker .duration-input {
    background-color: var(--bg-color);
    border: 1px solid var(--border-color);
}
.control-label {
    font-weight: 700;
    font-size: var(--text-base);
}
[data-theme="dark"] {
    --bg-color: var(--gray-900);
    --disabled-control-bg: var(--gray-900);
    --border-color: #1c2126;
    --margin-lg : 15px;
    --text-bold: 600;
    --scroll-bg: #161a1f;
    --scroll-color: #1c2126;
}

[data-theme="light"] {
    --bg-color: #f2f5fa;
    --text-bold: 600;
    --control-bg : #fff;
    --control-bg-on-gray: #d4dcea;
    --disabled-control-bg: #f2f5fa;
    --heading-color: #333;
    --border-color:#e3e8f1;
    --avatar-frame-bg: #dde2ea;
    --margin-lg: 15px;
    --sidebar-select-color: #d4dcea;
    --awesomplete-hover-bg: #d4dcea;
    --scroll-bg: #eef1f5;
    --scroll-color: #d9dfe6;
}

:root {
    /* --background-color: #36414c; */
    --background-color:#0b3a68;
    --primary-color: #0b3a68;
    --primary-btn:#00366b !important;
    --secondary-color: #7574ff;
    --white-color: #ffffff;
    --black-color: #000000;
    --gray-color: #888;
    --btn-hover:#c0d2f1;
    --input-border:#758cb3;
    --input-background:#f2f5fa;
    --load-more:#e2e9f5;
    --table-head: #b9c5eb;

    --page-head-height: 50px;
    --navbar-height: 50px;
}
.btn-primary:active,
.btn-secondary:focus,
.btn-secondary:active,
.btn-secondary:focus{
    box-shadow: none !important;
}
.btn-primary{
    color: #fff !important;
    background-color: var(--primary-color) !important;
    border-radius: 5px !important;
}
.btn-primary:hover{
    background-color: var(--primary-btn) !important;
}
.btn-info{
    background-color: var(--load-more) !important;
    /* color: var(--white-color) !important; */
}
.btn-more{
    background-color: var(--load-more) !important;
}
.filter-x-button{
    background-color: var(--input-background) !important;
    border-color: var(--input-border);
    border-left: #888;
}
.filter-button{
    background-color: var(--input-background) !important;
    border-color: var(--input-border);
}
.filter-button:hover{
    background-color: var(--btn-hover) !important;
}
.filter-x-button:hover{
    background-color: var(--btn-hover) !important;
}
.btn-primary-light{
    background-color: var(--input-background) !important;
    border-color: var(--input-border);
}
.btn-order{
    background-color: var(--input-background) !important;
    border-color: var(--input-border);
}
.sort-selector-button{
    background-color: var(--input-background) !important;
    border-color: var(--input-border);
}
.sort-selector-button:hover{
    background-color: var(--btn-hover) !important;
}
.btn-order:hover{
    background-color: var(--btn-hover) !important;
}
.frappe-control .btn.btn-default{
    background-color: var(--gray-100) !important;
}
.btn.btn-default:hover{
    background-color: var(--btn-hover) !important;
}


button.btn.btn-secondary {
    background-color: var(--gray-100) !important;
}
button.btn.btn-secondary:hover{
    background-color: var(--btn-hover) !important;
}
.page-head,
.page-head .page-head-content{
    height: var(--page-head-height);
}
.page-head,
.page-head .page-head-content{
    top: var(--page-head-height);
}

.dropdown-item:hover{
    background-color: var(--input-background) !important;
}

/* Top Header */
.navbar{
    background: var(--background-color) !important;
    height: var(--navbar-height);
}
.navbar-expand{
    background-color: var(--background-color);
}
#navbar-breadcrumbs > li > a::before{
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    text-decoration: inherit;
    -webkit-font-smoothing: antialiased;
    margin-right: .3em;
    display: inline-block;

    font-size: 24px;
    transition: 0.2s;
    position: relative;
    top: 3px;
    content: "\f105";
    margin-right: 10px;
    color: var(--white-color);
}
#navbar-breadcrumbs a{
    color: var(--white-color) !important;
    text-decoration: none;
}
header .form-control{
    color: var(--white-color);
}
header .form-control:focus{
    border: 0;
}
.search-bar .awesomplete input{
    height: 32px;
}
/*#navbar-search{
    width: 300px;
    background-color: rgb(65, 78, 90);
    border-radius: 0px;
    color: #f9f9f9;
    border: none;
}*/
header ul#navbar-breadcrumbs{
    margin-top: -8px;
}
header .form-control:focus{
    background-color: var(--white-color) !important;
}



/* Sidebar */
.layout-side-section .sidebar-label{
    color: var(--primary-color);
}
.sidebar-label svg,
.layout-side-section .sidebar-label .icon{
    stroke: var(--primary-color);
}
.list-sidebar-button{
    /* background-color: #c8c4c4 !important; */
    box-shadow: none !important;
}
.list-sidebar-button:active,
.list-sidebar-button:focus{
    text-decoration: none !important;
    box-shadow: none !important;
}


/* Input Fields */
input{
    /* border-radius: 5px !important; */
}
.form-control{
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    /* background-color: #f2f2f2 !important; */
}
.form-control:focus{
    outline: 0;
    border: 1px solid var(--input-border);
    box-shadow: none;
    background: var(--input-background) !important;
}
.navbar .navbar-nav a.nav-link{
    color: var(--white-color);
}
span.notifications-seen use,
symbol#icon-small-down{
    fill: var(--white-color);
}
/* .filter-button:hover{
    background-color: gray;
} */






/* Table */
.form-grid{
    /* border-radius: 0; */
    border:1px solid var(--input-border);
    border: 1px solid #bbbbbb;
    font-size: 12px;
}
.form-grid .grid-heading-row{
    background-color: var(--table-head) !important;
}
.form-grid .grid-heading-row:hover{
    background-color: var(--table-head) !important;
}
.grid-heading-row{
    border-bottom: 1px solid var(--input-border);
    font-size: 14px;
    color: #000000;
}
.grid-heading-row .grid-static-col{
    background-color: var(--table-head) !important;
}
.grid-row > .row .col{
    border-right: 1px solid var(--input-border);
}
.col:last-child{
    border-radius: 0px !important;
}
.col{
    padding: 8px !important;
}
.grid-row{
    border-bottom: 1px solid var(--input-border);
}
.form-grid .grid-row:hover{
    background: rgba(219, 211, 198, 0.15);
}

.for-description{
    background-color: var(--white-color) !important;
}


/* Heading Color */
.head-title, .form-section .section-head, .form-dashboard-section .section-head, .comment-box .comment-input-header{
    color: var(--primary-color);
}

/* Lists */
.list-subject a{
    text-decoration: none;
    transition: 0.3s;
}
.list-subject a:hover{
    color: #1a61a7;
}


/* Report Table */
.datatable .dt-header .dt-cell--header .dt-cell__content{
    background-color: #f4f4f4;
}

.comment-box .comment-input-container {
    align-items: center;
}
.list-row-head {
    font-weight: 700 !important;
    height: 40px;
}
.level-item {
    font-weight: 700 !important;
}
.list-liked-by-me{
    display: none;

}
.list-row-like {
    display: none !important;
}
.list-row-head .list-subject {
    font-weight: 700 !important;
    /* flex: none !important; */
}
.list-subject {
    flex: 1 !important;
}

[data-fieldname="description_of_work"] {
    min-width: 300px !important;
    /* max-width: 150px !important; */
}

.list-row .col[data-fieldname="amount"] {
    min-width: 100px !important;
    text-align: right;
}

.list-row:hover:not(.list-row-head):hover:not(.list-subject) {
    background-color: var(--bg-color) !important;
}
.widget-title {
    font-size: var(--text-base) !important;
}
.list-row-col a {
    color: var(--black-color) !important;
}
.list-row {
    height: 50px;
}
.bold {
    font-weight: 500 !important;
}
.grid-footer .btn:not(:last-child) {
    background-color:var(--gray-100);
}
.grid-footer .btn:not(:last-child):hover {
    background-color:var(--gray-300);
}
.btn.btn-danger {
    color: #fff;
    background-color: red !important;
}
.page-content-wrapper {
    min-height: calc(100vh - 48px) !important;
    background: url('/assets/build_pro/images/login-bg-img.jpg') no-repeat center center !important;
    background-color: var(--input-background) !important;
    background-size: cover !important;
}
.navbar-light {
    border-bottom: none !important;
}
.my-4 {
    margin-top: 0px !important;
}

.for-login .page-card {
    /* background: url('/assets/build_pro/images/login-bg-img.jpg') no-repeat center center !important; */
    background-size: cover !important;
    background-color: white;
    border: none !important;
}

.btn-login {
    background-color: var(--primary-btn) !important;
}
.btn-login:hover {
    background-color: #002b55 !important;
}

.forgot-password-message > *{
    color: black !important;
    font-size: var(--text-sm);
    font-weight: var(--weight-regular);
    letter-spacing: 0.02em;
}

.notifications-icon {
    background-color: white;
    border-radius: 5px;
    padding: 4px !important;
}

.for-login .page-card {
    padding: 80px 10px !important;
    background: linear-gradient(136deg, #7eacff, #00800085);
    max-width: 470px !important;
    margin: 0 auto;
    border-radius: var(--border-radius-md);
    border: 1px solid var(--border-color);
    min-height: 370px;
}

.for-forgot .page-card {
    padding: 130px 10px !important;
    background: linear-gradient(136deg, #7eacff, #00800085);
    max-width: 470px !important;
    margin: 0 auto;
    border-radius: var(--border-radius-md);
    border: 1px solid var(--border-color);
    min-height: 300px !important;
    /* background: url('/assets/abo/images/login-bg-img.png') no-repeat center center !important; */
    background-size: cover !important;
    border: none !important;
}
.for-forgot .sign-up-message a{
    color: black !important ;
}

.btn-forgot {
    background-color: var(--primary-btn) !important;
}
.btn-forgot:hover {
    background-color: #002b55 !important;
}
.for-login .page-card .page-card-body .email-field input {
    height: 35px;
}
.for-login .page-card .page-card-body .field-icon {
    left: 9px;
    top: 10px !important;
    position: absolute;
    z-index: 2;
}
.for-login .page-card .page-card-body .password-field input{
    height: 35px !important;
}
.for-login .page-card .page-card-body .password-field .toggle-password{
    top: 10px !important;
}
[data-page-route=Workspaces] .widget.number-widget-box  {
    border: 1px solid #344f80 !important;
    background-color: #d5d8dbcf !important;
    color: white;
}
.widget.number-widget-box .widget-head .widget-title { 
    color:rgb(0, 0, 0) !important;
}
a:not([href]):not([class]) {
    color:rgb(0, 0, 0) !important;
}
.page-card-head {
    padding: 2% 2% !important;
    margin: 0 auto;
    text-align: center;
    font-size: var(--text-xl);
    font-weight: 600;
}
.page-card-head h4 {
    margin: 1.5rem;
    color:var(--primary-color) !important;
    font-size:28px !important;
}
.for-login{
    margin-top: 60px ;
}
.page-card-head img {
    max-height: 50px !important;
    /* margin-top: -160px; */
}
.page-content-wrapper .container .page_content .web-form .web-form-wrapper .form-control{
    border: 1px solid var( --input-border) !important;
}
.navbar-brand{
    color:white !important
}

/* .form-grid-container{
    position: relative !important;
    overflow: auto !important;
} */
.form-grid{
    /* position :relative !important;
    overflow-x: auto !important;
    overflow-y: visible !important; */
    /* width: 150% !important; */
    min-height: 0px;
    /* max-height: 300px; */
    min-width: fit-content !important;
    /* z-index: 0 !important; */
}
/* .awesomplete>ul:first-of-type{
    position: absolute !important;
    z-index: 9999 !important;
    top: auto !important;
}  */


/* .form-grid-container {
    overflow-x: auto !important;
    overflow-y: auto !important;
    position: relative !important;
    z-index: 0 !important;
    min-height: 250px !important;
    transition: height 0.3s ease-in-out;
    max-width: 100%;
}

.grid-heading-row, .grid-body {
    display: table;
    table-layout: fixed;
    width: max-content;
    min-width: 100%;
    border: 1px solid var(--input-border);
}

.grid-heading-row {
    border-bottom: 0;
    white-space: nowrap;
}

.grid-heading-row:hover {
    background-color: var(--table-head) !important;
}

.grid-body {
    border: 1px solid var(--input-border);
}

.grid-body .grid-row, .grid-heading-row .grid-cell {
    min-width: 150px; 
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.form-grid {
    display: block;
    max-width: calc(100% * 5);
    overflow-x: auto; 
} */

/* .awesomplete>[role=listbox] {
    position: absolute !important;
    z-index: 9999 !important;
    left: 0;
    top: 100%;
} */
/* .result {
    overflow-x: scroll;
    justify-content: space-evenly;
}

.list-row-head {
    width: 150%
}
.list-row-container {
    width: 150%
} */

.list-row .level-right, .list-row-head .level-right {
    flex: none;
    overflow: visible;
    align-items: center;
}
.grid-heading-row .grid-row .row-check{
    border-radius: 0px;
    background-color: var(--table-head) !important;
}


input[type=checkbox]:checked {
    background-color: var(--primary);
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 8 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 4.00001L2.66667 5.80001L7 1.20001' stroke='white' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"), var(--checkbox-gradient);
}
input[type=checkbox]{
    border: 1px solid var( --input-border) !important;
}


.force-left {
    left: 100px !important; /* Adjust as needed */
}
/* 
.col-2{
    display:none !important;
} */

.kanban .kanban-column{
    background-color: #aab6c4 !important;
}

.avatar-group .avatar .avatar-frame{
    border: 1px solid var(--black-color);
}
/* .btn-group{
    border: 1px solid var(--black-color);
    border-radius: 5px;
} */
.kanban .compose-column-form .new-column-title {
    background-color: var(--white-color) !important;
    border-radius: 5px !important;
}

/* .row.form-section.card-section.visible-section:last-child{
    border-bottom: none !important;
    height: 700px !important;
} */

/* .column-limit-reached {
    overflow-y: auto !important;
} */


/* .indicator-pill.red{
    background-color: rgb(184, 253, 190)  !important;
    color: green !important;
} */

.form-links .document-link .document-link-badge{
    background-color: var(--control-bg-on-gray) !important;
    font-size: var(--text-base) !important;
    cursor: pointer;
}
/* .search-autocomplete-dropdown {
    background-color: white;
    border: 1px solid #d1d8dd;
    border-radius: 3px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

.search-item:hover {
    background-color: #f8f8f8;
} */