@import "responsive.css";

html[dir = "rtl"] {
    --font-size: 16px;
}

h1 {
    font-weight: 600;
    font-size: calc(var(--font-size) + 13px);
    line-height: 40px;
}

h2 {
    font-weight: 600;
    font-size: calc(var(--font-size) + 7px);
    line-height: 28px;
}

h2 .bold {
    font-weight: 700;
    font-size: calc(var(--font-size) + 7px);
    line-height: 28px;
}

h3 {
    font-weight: 500;
    font-size: calc(var(--font-size) + 3px);
    line-height: 20px;
}

input[type=checkbox],
input[type=radio] {
    accent-color: var(--primary-500);
    cursor: pointer;
}

#page {
    display: block;
    width: 100%;
    height: 100%;
}

#page-row {
    inset: 0;
    display: flex;
    height: 100%;
}

#page-menuless {
    position: relative;
    overflow: auto;
    width: 100%;
    height: 100%;
}

#sidebar-menu {
    display: flex;
    background-color: var(--secondary-500);
    inset-inline-start: 0;
    top: 0;
    width: var(--sidebar-width);
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    height: 100%;
    user-select: none;
    transition: 0.45s;
    z-index: 95;
}

#sidebar-container {
    height: calc(100% - 110px);
    overflow-x: visible;
}

#sidebar-menu-header {
    margin-top: 10px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
}

main {
    height: 100%;
}

header {
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}

nav {
    height: calc(100% - 60px);
    overflow: auto;
    padding: 10px;
}


#sidebar-menu-content::-webkit-scrollbar {
    width: 3px;
}

#sidebar-menu footer {
    height: 110px;
}

#sidebar-menu-footer {
    margin-bottom: 10px;
    padding-inline: 10px;
}

#main-content {
    background-color: var(--gs-background);
}

#main-content.hide-sidebar {
    inset-inline-start: 0;
}

#main-content-body {
    top: 0;
    inset-inline-start: 9px;
    height: 100%;
}

#main-menu-header {
    display: flex;
    align-items: center;
    justify-content: center;
}

#sidebar-menu-header #main-menu-header div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: absolute;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background-color: #FFF;
}

#sidebar-menu #sidebar-menu-header #main-menu-header div > hr {
    position: absolute;
    width: 20px;
    height: 3px;
    background: linear-gradient(59.99deg, #0069B0 3.57%, #007ABE 25.43%, #8E559F 45.99%, #EE5D84 71.55%, #F2868F 98.27%);
    inset-inline-start: 10px;
    top: 29px;
}

#sidebar-menu #sidebar-menu-header #main-menu-header div>span  {
    position: absolute;
}

#sidebar-menu-header #main-menu-header div>span  {
    width: 17px;
    height: 24px;
    top: 6px;
    font-size: 24px;
    line-height: 24px;
    color: var(--primary-600);
    margin-top: 1px;
}

#sidebar-menu-header #main-menu-header div > hr {
    width: 18px;
    height: 3px;
    background: linear-gradient(59.99deg, #0069B0 3.57%, #007ABE 25.43%, #8E559F 45.99%, #EE5D84 71.55%, #F2868F 98.27%);
    border: transparent;
    margin-top: -1px;
}

#sidebar-menu-content #main-menu-actions {
    height: 100%;
}

#sidebar-menu-content #main-menu-actions ul {
    list-style: none;
    display: inline-block;
    margin: 0;
    padding: 0;
    height: 100%;
}

#sidebar-menu-content #main-menu-actions ul div {
    text-align: start;
}

#sidebar-menu-content #main-menu-actions ul li {
    list-style-type: none;
    display:inline-block;
    padding: 10px;
    cursor: pointer;
    border-radius: 8px;
    margin-top: 15px;
}

#sidebar-menu-content #main-menu-actions ul li.active {
    background-color: var(--primary-500);
}

#sidebar-menu-content #main-menu-actions ul li.active:hover  {
    background-color: var(--primary-600);
}

#sidebar-menu-content #main-menu-actions ul li:hover  {
    background-color: #adb0c73d;
}

#sidebar-menu-content #main-menu-actions ul li img {
    display: block;
    margin: 0 auto;
    border-radius: 15%;
}

#main-menu-footer-profile {
    display: flex;
    align-items: center;
    justify-content: center;
}

#main-menu-footer-profile ul {
    list-style: none;
    display: inline;
    margin: 0;
    padding: 0;
}

#main-menu-footer-profile ul li,
#mobile-toolbar-container ul li{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    border-radius: 50%;
    color: white;
    border: 2px solid #fff;
    cursor: pointer;
    list-style-type: none;
    padding: 10px;
}

#main-menu-footer-profile ul li:hover {
    border: 2px solid #adb0c73d;
}
#profile-initials {
    font-weight: 600;
    font-size: calc(var(--font-size) + 3px);
}

#sidebar-menu-footer #main-menu-footer #main-menu-footer-actions ul {
    list-style: none;
    display: inline;
    margin: 0;
    padding: 0;
}

#sidebar-menu-footer #main-menu-footer #main-menu-footer-actions ul li {
    display: flex !important;
    flex-direction: row;
    align-items: center;
    justify-content: start;
    color: var(--gs-white);
    font-size: var(--font-size);
    width: 100%;
    gap: 10px;
    margin: 0;
    padding: 0;
    border-radius: 8px;
    list-style-type: none;
}

#main-menu-footer {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

#main-menu-footer-actions a {
    display: flex;
    align-items: center;
    color: var(--gs-white);
    padding: 10px;
    width: 100%;
}

#sidebar-menu-footer #main-menu-footer #main-menu-footer-actions ul li img {
    display: block;
    margin: 0 auto;
    border-radius: 15%;
}

#sidebar-menu-footer #main-menu-footer-actions ul li.active {
    background-color: var(--primary-500);
}

#sidebar-menu-footer #main-menu-footer-actions ul li.active:hover  {
    background-color: #208FFF;
}

#sidebar-menu-footer #main-menu-footer-actions ul li:hover  {
    background-color: #adb0c73d;
}

button{
    font-family: var(--font-family);
    font-weight: 500;
}

.tooltip {
    display: inline;
    position: relative;
}

.tooltip:hover:after {
    background: var(--secondary-500);
    border-radius: 5px;
    inset-inline-start: 56px;
    color: #fff;
    content: attr(data-title);
    top: 4px;
    padding: 8px 10px;
    position: absolute;
    z-index: 98;
    width: max-content;
    font-weight: 500;
}

.tooltip:hover:before {
    border: solid;
    border-color: transparent var(--secondary-500);
    border-block-width: 4px;
    border-inline-width: 0 4px;
    top:14px;
    content: "";
    inset-inline-start: 52px;
    position: absolute;
    z-index: 99;
}

.ui-tooltip {
    background: var(--secondary-500);
    border-radius: 5px !important;
    font-weight: 500 !important;
    box-shadow: unset !important;
}

.ui-tooltip-content {
    font-family: var(--font-family);
    font-size: var(--font-size);
}

::-webkit-scrollbar {
    width: 7px;
    height: 7px;
    background: transparent; /* Set scrollbar track color to transparent */
}

::-webkit-scrollbar-thumb {
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    border-radius: 7px;
    background-color: hsl(0,0%,56%);
}

::-webkit-scrollbar-thumb:hover {
    background-color: hsl(0,0%,67%);
}

* {
    scrollbar-width: thin;
}

:is(#main-menu-footer-profile, #mobile-toolbar) .popup {
    display: flex !important;
    flex-direction: column;
    justify-content: space-between;
    min-width: max-content;
    width: 250px;
    padding: 10px 10px;
    overflow-y: visible;
    gap: 5px;
    z-index: 999 !important;
}

#mobile-toolbar .mobile-profile-preference-popup {
    inset-inline-end: 30px;
    inset-inline-start: unset !important;
    inset-block-end: unset !important;
    inset-block-start: 50px;
}

:is(#main-menu-footer-profile, #mobile-toolbar) .popup a {
    padding: 7px 5px;
    text-decoration: none;
    text-align: start;
}

:is(#main-menu-footer-profile, #mobile-toolbar) .popup > label {
    color: var(--primary-600);
}

:is(#main-menu-footer-profile, #mobile-toolbar) .popup > hr  {
    background: var(--primary-600);
    width: 100%;
    padding: 0;
    margin: 0;
}

#sidebar-menu-content #main-menu-actions ul hr {
    margin: 10px 0 -5px 0;
}

div.dbselect > .dbselect-input > .custom-select div.items.role-list {
    min-width: 200px;
    width: max-content;
    max-width: 400px;
    position: absolute;
    inset-inline-start: 244px;
    bottom: -4px;
    top: unset;
    max-height: 300px;
    border-radius: 5px;
}

div.ui-tooltip {
    color: #fff
}

#main-menu-footer-profile div.dbselect:after {
    transform: rotate(270deg);
}

html[dir="rtl"] #main-menu-footer-profile div.dbselect:after {
    transform: rotate(90deg);
}

/* sidebar */

/* bacground-color */
.bg-primary-medium {
    background-color: var(--primary-500) !important;
}

/* dbicon */

.dbicon {
    padding: 10px;
}

.dbicon-bookmark {
    -webkit-mask: url('../dbimages/icon-unfavoritedoc.svg') no-repeat center center;
	mask: url('../dbimages/icon-unfavoritedoc.svg') no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
}

.dbicon-right-left-arrows {
    -webkit-mask: url(../dbimages/ic-right-left-arrows.svg) no-repeat center center;
	mask: url(../dbimages/ic-right-left-arrows.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
}

.dbicon-file-edit {
    -webkit-mask: url(../dbimages/ic-file-edit.svg) no-repeat center center;
	mask: url(../dbimages/ic-file-edit.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
    padding: 10px;
    background-color: var(--primary-500);
}

.dbicon-file-meta {
    -webkit-mask: url(../dbimages/ic-file-meta.svg) no-repeat center center;
	mask: url(../dbimages/ic-file-meta.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
    padding: 10px;
    background-color: var(--primary-500);
}

.dbicon-lock {
    color: var(--primary-600);
    -webkit-mask: url(../dbimages/ic-lock.svg) no-repeat center center;
	mask: url(../dbimages/ic-lock.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
}

.dbicon-basket {
    -webkit-mask: url(../dbimages/ic-basket-blue.svg) no-repeat center center;
	mask: url(../dbimages/ic-basket-blue.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
}

.dbicon-document {
    -webkit-mask: url(../dbimages/ic-document-blue.svg) no-repeat center center;
	mask: url(../dbimages/ic-document-blue.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
}

.dbicon-history {
    color: var(--primary-600);
    -webkit-mask: url(../dbimages/ic-history-blue.svg) no-repeat center center;
	mask: url(../dbimages/ic-history-blue.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
}

.dbicon-lock-table-action {
    color: var(--primary-600);
    -webkit-mask: url(../dbimages/ic-lock.svg) no-repeat center center;
	mask: url(../dbimages/ic-lock.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
    background-color: var(--primary-500);
}

.dbicon-freeze-unfreeze {
    color: var(--primary-600);
    -webkit-mask: url(../dbimages/ic-snowflake.svg) no-repeat center center;
	mask: url(../dbimages/ic-snowflake.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
    background-color: var(--primary-500);
}

.dbicon-freeze-unfreeze.frozen {
    background-color: grey !important;
}

.dbicon-close {
    -webkit-mask: url(../dbimages/ic-close.svg) no-repeat 100% / 100%;
	mask: url(../dbimages/ic-close.svg) no-repeat 100% / 100%;
    width: 12px;
    height: 12px;
}

.dbicon-note {
    -webkit-mask: url(../dbimages/ic-vd-nav-notes.svg) no-repeat center center;
	mask: url(../dbimages/ic-vd-nav-notes.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
	mask-size: var(--icon-size);
    background-color: #fcbe0e;
}

.dbicon-calendar {
    -webkit-mask: url(../dbimages/ic-calendar.svg) no-repeat 100% / 100%;
	mask: url(../dbimages/ic-calendar.svg) no-repeat 100% / 100%;
    width: 12px;
    height: 12px;
}

.dbicon-stats {
    -webkit-mask: url(../dbimages/ic-stats.svg) no-repeat 100% / 100%;
	mask: url(../dbimages/ic-stats.svg) no-repeat 100% / 100%;
    width: 12px;
    height: 12px;
}

.dbicon.drag {
    background: url(../dbimages/ic-drag.svg) no-repeat;
    background-size: 18px;
}

.dbicon.folder {
    background: url(../dbimages/ic-folder.svg) no-repeat;
}

.dbicon.file {
    background: url(../dbimages/ic-file.svg) no-repeat;
}

.dbicon.menu {
    background: url(../dbimages/ic-menu.svg) no-repeat;
    background-size: 18px;
}

.dbicon-unknown, td span[class*="dbicon-"] {
    background: url(../dbimages/ic-file-unknown.svg) no-repeat;
}

.dbicon-pdf {
    background: url(../dbimages/ic-file-pdf.svg) no-repeat !important;
}

.dbicon-doc, .dbicon-docx {
    background: url(../dbimages/ic-file-doc.svg) no-repeat !important;
}

.dbicon-jpg {
    background: url(../dbimages/ic-file-jpg.svg) no-repeat !important;
}

.dbicon-jpeg {
    background: url(../dbimages/ic-file-jpeg.svg) no-repeat !important;
}

.dbicon-png {
    background: url(../dbimages/ic-file-png.svg) no-repeat !important;
}

.dbicon-ppt, .dbicon-pptx {
    background: url(../dbimages/ic-file-ppt.svg) no-repeat !important;
}

.dbicon-txt {
    background: url(../dbimages/ic-file-txt.svg) no-repeat !important;
}

.dbicon-xls, .dbicon-xlsx {
    background: url(../dbimages/ic-file-xls.svg) no-repeat !important;
}

.dbicon-3gp {
    background: url(../dbimages/ic-file-3gp.svg) no-repeat !important;
}

.dbicon-7z {
    background: url(../dbimages/ic-file-7z.svg) no-repeat !important;
}

.dbicon-aac {
    background: url(../dbimages/ic-file-aac.svg) no-repeat !important;
}

.dbicon-ac3 {
    background: url(../dbimages/ic-file-ac3.svg) no-repeat !important;
}

.dbicon-aif {
    background: url(../dbimages/ic-file-aif.svg) no-repeat !important;
}

.dbicon-avi {
    background: url(../dbimages/ic-file-avi.svg) no-repeat !important;
}

.dbicon-bmp {
    background: url(../dbimages/ic-file-bmp.svg) no-repeat !important;
}

.dbicon-bz2 {
    background: url(../dbimages/ic-file-bz2.svg) no-repeat !important;
}

.dbicon-csv {
    background: url(../dbimages/ic-file-csv.svg) no-repeat !important;
}

.dbicon-dat {
    background: url(../dbimages/ic-file-dat.svg) no-repeat !important;
}

.dbicon-dwg {
    background: url(../dbimages/ic-file-dwg.svg) no-repeat !important;
}

.dbicon-eml {
    background: url(../dbimages/ic-file-eml.svg) no-repeat !important;
}

.dbicon-eps {
    background: url(../dbimages/ic-file-eps.svg) no-repeat !important;
}

.dbicon-flac {
    background: url(../dbimages/ic-file-flac.svg) no-repeat !important;
}

.dbicon-flv {
    background: url(../dbimages/ic-file-flv.svg) no-repeat !important;
}

.dbicon-gif {
    background: url(../dbimages/ic-file-gif.svg) no-repeat !important;
}

.dbicon-gz {
    background: url(../dbimages/ic-file-gz.svg) no-repeat !important;
}

.dbicon-heic {
    background: url(../dbimages/ic-file-heic.svg) no-repeat !important;
}

.dbicon-htm, .dbicon-html {
    background: url(../dbimages/ic-file-htm.svg) no-repeat !important;
}

.dbicon-inf {
    background: url(../dbimages/ic-file-inf.svg) no-repeat !important;
}

.dbicon-ini {
    background: url(../dbimages/ic-file-ini.svg) no-repeat !important;
}

.dbicon-jpeg {
    background: url(../dbimages/ic-file-jpeg.svg) no-repeat !important;
}

.dbicon-json {
    background: url(../dbimages/ic-file-json.svg) no-repeat !important;
}

.dbicon-log {
    background: url(../dbimages/ic-file-log.svg) no-repeat !important;
}

.dbicon-lst {
    background: url(../dbimages/ic-file-lst.svg) no-repeat !important;
}

.dbicon-m4a {
    background: url(../dbimages/ic-file-m4a.svg) no-repeat !important;
}

.dbicon-m4v {
    background: url(../dbimages/ic-file-m4v.svg) no-repeat !important;
}

.dbicon-mid {
    background: url(../dbimages/ic-file-mid.svg) no-repeat !important;
}

.dbicon-midi {
    background: url(../dbimages/ic-file-midi.svg) no-repeat !important;
}

.dbicon-mkv {
    background: url(../dbimages/ic-file-mkv.svg) no-repeat !important;
}

.dbicon-mov {
    background: url(../dbimages/ic-file-mov.svg) no-repeat !important;
}

.dbicon-mp3 {
    background: url(../dbimages/ic-file-mp3.svg) no-repeat !important;
}

.dbicon-mp4 {
    background: url(../dbimages/ic-file-mp4.svg) no-repeat !important;
}

.dbicon-mpeg {
    background: url(../dbimages/ic-file-mpeg.svg) no-repeat !important;
}

.dbicon-mpg {
    background: url(../dbimages/ic-file-mpg.svg) no-repeat !important;
}

.dbicon-msg {
    background: url(../dbimages/ic-file-msg.svg) no-repeat !important;
}

.dbicon-odt {
    background: url(../dbimages/ic-file-odt.svg) no-repeat !important;
}

.dbicon-ogg {
    background: url(../dbimages/ic-file-ogg.svg) no-repeat !important;
}

.dbicon-psd {
    background: url(../dbimages/ic-file-psd.svg) no-repeat !important;
}

.dbicon-rar {
    background: url(../dbimages/ic-file-rar.svg) no-repeat !important;
}

.dbicon-raw {
    background: url(../dbimages/ic-file-raw.svg) no-repeat !important;
}

.dbicon-rtf {
    background: url(../dbimages/ic-file-rtf.svg) no-repeat !important;
}

.dbicon-svg {
    background: url(../dbimages/ic-file-svg.svg) no-repeat !important;
}

.dbicon-tar {
    background: url(../dbimages/ic-file-tar.svg) no-repeat !important;
}

.dbicon-tex {
    background: url(../dbimages/ic-file-tex.svg) no-repeat !important;
}

.dbicon-tif {
    background: url(../dbimages/ic-file-tif.svg) no-repeat !important;
}

.dbicon-tiff {
    background: url(../dbimages/ic-file-tiff.svg) no-repeat !important;
}

.dbicon-wav {
    background: url(../dbimages/ic-file-wav.svg) no-repeat !important;
}

.dbicon-wma {
    background: url(../dbimages/ic-file-wma.svg) no-repeat !important;
}

.dbicon-wmf {
    background: url(../dbimages/ic-file-wmf.svg) no-repeat !important;
}

.dbicon-wmv {
    background: url(../dbimages/ic-file-wmv.svg) no-repeat !important;
}

.dbicon-xif {
    background: url(../dbimages/ic-file-xif.svg) no-repeat !important;
}

.dbicon-xml {
    background: url(../dbimages/ic-file-xml.svg) no-repeat !important;
}

.dbicon-xps {
    background: url(../dbimages/ic-file-xps.svg) no-repeat !important;
}

.dbicon-zip {
    background: url(../dbimages/ic-file-zip.svg) no-repeat !important;
}

.dbicon.note {
    padding: 2px 9px;
    background: url(../dbimages/ic-note.svg) no-repeat;
}

.dbicon.lock {
    padding: 1px 8px;
    background: url(../dbimages/ic-lock.svg) no-repeat;
}

.dbicon.alert {
    background: url(../dbimages/ic-alert-small.svg) no-repeat;
}

.dbicon.lock.mask {
    -webkit-mask: url(../dbimages/ic-lock.svg) no-repeat center center;
	mask: url(../dbimages/ic-lock.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
    padding-top: 10px;
}

.dbicon.attachment {
    padding: 1px 8px;
    background: url(../dbimages/ic-attachment.svg) no-repeat;
}

.dbicon.favorite {
    -webkit-mask: url(../dbimages/ic-favorite.svg) no-repeat center center;
	mask: url(../dbimages/ic-favorite.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
	mask-size: var(--icon-size);
}

.dbicon.favorite-filled {
    mask: url(../dbimages/ic-favorite-filled.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-favorite-filled.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: var(--primary-600);
}

.dbicon.sort {
    mask: url(../dbimages/ic-select.svg);
    mask-size: 20px;
    -webkit-mask: url(../dbimages/ic-sort.svg) no-repeat center center;
    -webkit-mask-size: 20px;
    background-color: var(--primary-600);
    margin-inline-start: 5px;
    cursor: pointer;
}

.dbicon.sort.up {
    mask: url(../dbimages/ic-sort-up.svg) no-repeat center center;
    mask-size: 13px;
    -webkit-mask: url(../dbimages/ic-sort-up.svg) no-repeat center center;
    -webkit-mask-size: 13px;
    background-color: var(--primary-600);
    margin-inline-start: 5px;
    cursor: pointer;
}

.dbicon.sort.down {
    mask: url(../dbimages/ic-sort-down.svg) no-repeat center center;
    mask-size: 13px;
    -webkit-mask: url(../dbimages/ic-sort-down.svg) no-repeat center center;
    -webkit-mask-size: 13px;
    background-color: var(--primary-600);
    margin-inline-start: 5px;
    cursor: pointer;
}

.dbicon.menu-open {
    mask: url(../dbimages/ic-menu-open.svg) no-repeat center center;
    mask-size: 20px;
    -webkit-mask: url(../dbimages/ic-menu-open.svg) no-repeat center center;
    -webkit-mask-size: 20px;
    background-color: #000;
}

.dbicon.menu-close {
    mask: url(../dbimages/ic-menu-close.svg) no-repeat center center;
    mask-size: 20px;
    -webkit-mask: url(../dbimages/ic-menu-close.svg) no-repeat center center;
    -webkit-mask-size: 20px;
    background-color: #000;
}

html[dir="rtl"] .dbicon.menu-open, html[dir="rtl"] .dbicon.menu-close {
    transform: scale(-1);
    display: inline-block;
}

.dbicon.search {
    mask: url(../dbimages/ic-search.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-search.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: #fff;
}

.dbicon.save {
    mask: url(../dbimages/ic-save.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-save.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: var(--primary-500);
}

.dbicon.reload {
    mask: url(../dbimages/ic-reload.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-reload.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: var(--primary-500);
}

.dbicon.remove {
    mask: url(../dbimages/ic-remove.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-remove.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: var(--func-danger-500);
}

.dbicon.bookmarks {
	mask: url(../dbimages/ic-bookmark.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-bookmark.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: var(--func-danger-500);
}

.dbicon.list {
    mask: url(../dbimages/ic-list.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-list.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: var(--primary-500);
}

.dbicon.detail {
    mask: url(../dbimages/ic-detail.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-detail.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: var(--primary-500);
}

.dbicon.contract {
    background: url(../dbimages/ic-contract.svg) no-repeat;
    background-size: 17px;
    padding-top: 7px !important;
}

.dbicon.certificate {
    background: url(../dbimages/ic-certificate.svg) no-repeat;
    background-size: 25px;
    padding-top: 5px;
}

.dbicon.annotation {
    background: url(../dbimages/ic-annotation.svg) no-repeat;
    background-size: 20px;
    padding-top: 3px;
}

.dbicon.validation {
    background: url(../dbimages/ic-validation.svg) no-repeat;
    background-size: 25px;
    padding-inline-start: 15px;
    padding-top: 5px;
}

.dbicon.add {
    mask: url(../dbimages/ic-add.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-add.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
	background-color: var(--primary-500);
}

.dbicon.add-rouneded {
    mask: url(../dbimages/ic-add-rounded.svg) no-repeat center center;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-add-rounded.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: #fff;
}

.dbicon.view {
    mask: url(../dbimages/ic-view.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-view.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
	background-color: var(--primary-500);
}

.dbicon.view.disabled {
    mask: url(../dbimages/ic-view-disabled.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-view-disabled.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: var(--gs-bold) !important;
}

.dbicon.edit {
    mask: url(../dbimages/ic-file-edit.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-file-edit.svg) no-repeat center center;
    -webkit-mask-size: 18px;
}

.dbicon.close {
    mask: url(../dbimages/ic-view.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-close.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: #9b9ba0;
    cursor: pointer;
}

.dbicon.close:hover {
    background-color: var(--func-danger-600);
}

.dbicon.show-columns {
    mask: url(../dbimages/ic-show-column.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-show-column.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: #fff;
}

.dbicon.basket {
    mask: url(../dbimages/ic-basket-black.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-basket-black.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: #fff;
}

.dbicon.csv {
    mask: url(../dbimages/ic-csv.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-csv.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: #fff;
}

.sort-columns {
    mask: url(../dbimages/ic-sort-column.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-sort-column.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: #fff;
}

.dbicon.freeze-columns {
    mask: url(../dbimages/ic-table-freeze-column.svg) no-repeat center center;
    mask-size: 20px;
    -webkit-mask: url(../dbimages/ic-table-freeze-column.svg) no-repeat center center;
    -webkit-mask-size: 20px;
    background-color: #fff;
}

.dbicon.info.outlined {
    mask: url(../dbimages/ic-info-outlined.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-info-outlined.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon.dropdown {
    mask: url(../dbimages/ic-dropdown.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-dropdown.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: #000;
}

.dbicon.bar {
    mask: url(../dbimages/ic-bar.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-bar.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: grey;
}

.dbicon.external-link {
    mask: url(../dbimages/ic-external.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-external.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: var(--primary-500);
}

.dbicon.move {
    mask: url(../dbimages/ic-move.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-move.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: var(--primary-500);
}

.dbicon.collapse {
    mask: url(../dbimages/ic-collapse.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-collapse.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: var(--primary-500);
}

.dbicon.score_star {
    mask: url(../dbimages/ic-score-star.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-score-star.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: var(--primary-500);
}

.dbicon-folder {
    mask: url(../dbimages/ic-folder.svg) no-repeat 100% 100%;
    mask-size: contain;
    -webkit-mask: url(../dbimages/ic-folder.svg) no-repeat 100% 100%;
    -webkit-mask-size: contain;
    background-color: var(--primary-500);
}

.dbicon-info {
    mask: url(../dbimages/ic-info-outlined.svg) no-repeat center center;
    mask-size: 16px;
    -webkit-mask: url(../dbimages/ic-info-outlined.svg) no-repeat center center;
    -webkit-mask-size: 16px;
}

.dbicon-file {
    mask: url(../dbimages/ic-file.svg) no-repeat center center;
    mask-size: contain;
    -webkit-mask: url(../dbimages/ic-file.svg) no-repeat center center;
    -webkit-mask-size: contain;
}

.dbicon-add {
    background: url(../dbimages/ic-add-hover.svg) no-repeat left center;
}

.dbicon-signature {
    mask: url(../dbimages/ic-signature.svg) no-repeat center center;
    mask-size: contain;
    -webkit-mask: url(../dbimages/ic-signature.svg) no-repeat center center;
    -webkit-mask-size: contain;
}

.dbicon-msteam {
    background: url(../dbimages/ic-msteam.svg) no-repeat center center;
    background-size: 18px;
    background-color: transparent!important;
}

.dbicon-validate-msteam {
    background: url(../dbimages/ic-check-green.svg) no-repeat center center;
    background-size: 18px;
    padding: 16px;
    background-color: transparent!important;
}

.collapse-header .dbicon.collapse {
    mask: url(../dbimages/ic-extend.svg) no-repeat center center;
    mask-size: 10px;
    -webkit-mask: url(../dbimages/ic-extend.svg) no-repeat center center;
    -webkit-mask-size: 10px;
    background-color: var(--primary-600);
    padding: 10px;
    cursor: pointer;
    transform: rotate(270deg);
}

.collapse-header .dbicon.collapsed {
    mask: url(../dbimages/ic-extend.svg) no-repeat center center;
    mask-size: 10px;
    -webkit-mask: url(../dbimages/ic-extend.svg) no-repeat center center;
    -webkit-mask-size: 10px;
    background-color: var(--primary-600);
    padding: 10px;
    cursor: pointer;
    transform: rotate(90deg);
}


.dbicon-container {
    width: 30px;
    height: 30px;
    border-radius: 5px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.dbicon-container-note {
    background-color: #fcbe0e;
}

.dbicon-container-folder {
    background-color: var(--primary-500);
}

.dbicon-container-signature {
    background-color: orange;
}

.dbicon-container-info {
    background-color: #7B61FF;
}

.dbicon-container-file-edit {
    background-color: #ff6653;
}

.dbicon-container-file {
    background-color: var(--primary-500);
}

.dbicon-container > .dbicon {
    background-color: white;
}

.dbicon-container i {
    -webkit-mask-size: contain;
    mask-size: contain;
}

.dbicon.upload-file {
    -webkit-mask: url(../dbimages/ic-upload-file.svg) no-repeat center center;
	mask: url(../dbimages/ic-upload-file.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
    background-color: var(--primary-500);
}

.dbicon.eye-on {
    -webkit-mask: url(../dbimages/ic-eye-on.svg) no-repeat center center;
	mask: url(../dbimages/ic-eye-on.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
    background-color: var(--primary-500);
}

.dbicon.eye-off {
    -webkit-mask: url(../dbimages/ic-eye-off.svg) no-repeat center center;
	mask: url(../dbimages/ic-eye-off.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
    background-color: var(--primary-500);
}

.dbicon.mail {
    -webkit-mask: url(../dbimages/ic-mail.svg) no-repeat center center;
	mask: url(../dbimages/ic-mail.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
}

.dbicon.mail-table-action {
    -webkit-mask: url(../dbimages/ic-mail.svg) no-repeat center center;
	mask: url(../dbimages/ic-mail.svg) no-repeat center center;
    -webkit-mask-size: 18px;
	mask-size: 18px;
    padding: 1px 8px;
}

.dbicon.delete {
    mask: url(../dbimages/ic-delete.svg) no-repeat center center;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-delete.svg) no-repeat center center;
    -webkit-mask-size: 18px;
    background-color: var(--func-danger-500);
}

.dbicon.list-view {
    mask: url(../dbimages/ic-eye-on.svg) no-repeat 50% 50%;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-row-structure.svg) no-repeat 50% 50%;
    -webkit-mask-size: 18px;
}

.dbicon.tree-view {
    mask: url(../dbimages/ic-eye-on.svg) no-repeat 50% 50%;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-tree-structure.svg) no-repeat 50% 50%;
    -webkit-mask-size: 18px;
}

.dbicon.distribute {
    mask: url(../dbimages/ic-distribuer.svg) no-repeat 50% 50%;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-distribuer.svg) no-repeat 50% 50%;
    -webkit-mask-size: 18px;
}

.dbicon.reassigner {
    mask: url(../dbimages/ic-reassigner.svg) no-repeat 50% 50%;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-reassigner.svg) no-repeat 50% 50%;
    -webkit-mask-size: 18px;
}

.dbicon.delegater {
    mask: url(../dbimages/ic-distribuer.svg) no-repeat 50% 50%;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-distribuer.svg) no-repeat 50% 50%;
    -webkit-mask-size: 18px;
}

.dbicon.next {
    mask: url(../dbimages/ic-next.svg) no-repeat center center;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-next.svg) no-repeat center center;
    -webkit-mask-size: 18px;
    padding: 1px 8px;
    margin-inline-end: 14px;
}

.dbicon.back {
    mask: url(../dbimages/ic-back.svg) no-repeat center center;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-back.svg) no-repeat center center;
    -webkit-mask-size: 18px;
    background-color: var(--primary-500);
}

html[dir="rtl"] .dbicon.back, html[dir="rtl"] .dbicon.next,
html[dir="rtl"] .dbicon.arrow-prev, html[dir="rtl"] .dbicon.arrow-next {
    display: inline-block;
    transform: scale(-1);
    width: 18px;
    height: 18px;
}

.dbicon.arrow-next {
    mask: url(../dbimages/ic-vd-nav-arrow-next.svg) no-repeat center center;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-vd-nav-arrow-next.svg) no-repeat center center;
    -webkit-mask-size: 18px;
}

.dbicon.arrow-prev {
    mask: url(../dbimages/ic-vd-nav-arrow-prev.svg) no-repeat center center;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-vd-nav-arrow-prev.svg) no-repeat center center;
    -webkit-mask-size: 18px;
}

.dbicon.settings {
    mask: url(../dbimages/ic-settings.svg) no-repeat 50% 50%;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-settings.svg) no-repeat 50% 50%;
    -webkit-mask-size: 18px;
    background-color: var(--primary-500);
}

.dbicon.receipt {
    mask: url(../dbimages/ic-receipt.svg) no-repeat 50% 50%;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-receipt.svg) no-repeat 50% 50%;
    -webkit-mask-size: 18px;
    background-color: var(--primary-500);
}

i.ic-vd-nav-toggle-down {
    mask: url(../dbimages/ic-vd-nav-toggle-down.svg) no-repeat center center;
    mask-size: contain;
    -webkit-mask: url(../dbimages/ic-vd-nav-toggle-down.svg) no-repeat center center;
    -webkit-mask-size: contain;
    background-color: #19204c;
}

.dbicon-printer {
    mask: url(../dbimages/ic-printer.svg) center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-printer.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-export {
    mask: url(../dbimages/ic-exporter.svg) center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-exporter.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-favorite {
    mask: url(../dbimages/ic-favorite.svg) no-repeat center center;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-favorite.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-lock {
    mask: url(../dbimages/ic-lock.svg) no-repeat center center;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-lock.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-mail {
    mask: url(../dbimages/ic-mail.svg) no-repeat center center;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-mail.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

/*Business action icons*/
.dbicon-validate {
    mask: url(../dbimages/ic-check-green.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-check-green.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-history {
    mask: url(../dbimages/ic-history-blue.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-history-blue.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-folder {
    mask: url(../dbimages/ic-folder.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-folder.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-folders {
    mask: url(../dbimages/ic-folders.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-folders.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-delete {
    mask: url(../dbimages/ic-delete.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-delete.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
	background-color: var(--func-danger-500) !important;
}

.dbicon-changeproc {
    mask: url(../dbimages/ic-file-edit.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-file-edit.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-close {
    mask: url(../dbimages/ic-close-black.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-close-black.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-reject {
    mask: url(../dbimages/ic-reject-black.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-reject-black.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-waiting {
    mask: url(../dbimages/ic-waiting-black.svg) no-repeat center center;
    mask-size: 10px;
    -webkit-mask: url(../dbimages/ic-waiting-black.svg) no-repeat center center;
    -webkit-mask-size: 10px;
}

.dbicon-assign {
    mask: url(../dbimages/ic-assigner-blue.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-assigner-blue.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-reassign {
    mask: url(../dbimages/ic-reassigner-blue.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-reassigner-blue.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-delay {
    mask: url(../dbimages/ic-calendar.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-calendar.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-applystatus {
    mask: url(../dbimages/ic-stats.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-stats.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-lock {
    mask: url(../dbimages/ic-lock.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-lock.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-create-business {
    mask: url(../dbimages/ic-add.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-add.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-unlock {
    mask: url(../dbimages/ic-lock-blue.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-lock-blue.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbtable button.dbtable-action,
.mobile-table button.dbtable-action {
    display: flex;
    padding: 7px;
    border-radius: 0.5em;
}

.dbtable button.dbtable-action i.dbicon:not(.delete),
.mobile-table button.dbtable-action i.dbicon:not(.delete) {
    padding: 10px;
    background-color: var(--primary-500);
}

.action-button {
    width: 20px;
    height: 20px;
    background-color: var(--primary-500);
}

.dbtable button.dbtable-action i.dbicon-validate, i.action-button.dbicon-validate {
    background-color: #18B66A;
}

.dbtable button.dbtable-action i.dbicon-close, i.action-button.dbicon-close {
    background-image: var(--func-danger-600);
}

.dbtable button.dbtable-action i.dbicon-reject, i.action-button.dbicon-reject {
    background-image: var(--func-danger-600);
}

.dbtable button.dbtable-action i.dbicon-history, i.action-button.dbicon-history {
    background-color: rgb(252, 190, 14);
}

.dbtable button.dbtable-action i.dbicon-file-edit, i.action-button.dbicon-file-edit {
    background-color: rgb(123, 97, 255);
}
.dbtable button.dbtable-action i.dbicon-folders, i.action-button.dbicon-folders {
    background-color: rgb(123, 97, 255);
}

.dbtable button.dbtable-action i.dbicon-signature, i.action-button.dbicon-signature {
    background-color: var(--primary-500);
}

.dbtable button.dbtable-action i.dbicon.favorite {
    background-color: #18B66A;
}

.dbtable button.dbtable-action i.dbicon-note {
    background-color: rgb(252, 190, 14);
}

.dbtable button.dbtable-action i.dbicon-note.active {
    background-color: rgb(252, 190, 14) !important;
}

.dbtable button.dbtable-action i.dbicon-attachment {
    background-color: #18B66A;
}

.dbtable button.dbtable-action i.dbicon.favorite-filled, i.action-button.dbicon.favorite-filled {
    background-color: #18B66A;
}

.dbtable button.dbtable-action i.dbicon.mail-table-action, i.action-button.dbicon.mail-table-action {
    background-color: rgb(252, 190, 14);
}

.dbtable button.dbtable-action i.dbicon-waiting, i.action-button.dbicon-waiting {
    background-color: rgb(252, 190, 14);
}

.dbtable button.dbtable-action i.dbicon-delay, i.action-button.dbicon-delay {
    background-color: rgb(252, 190, 14);
}

.dbtable button.dbtable-action i.dbicon-lock, i.action-button.dbicon-lock {
    background-image: var(--func-danger-600);
}

.dbtable button.dbtable-action i.dbicon-unlock, i.action-button.dbicon-unlock {
    background-color: #18B66A;
}

.dbtable button.dbtable-action i.dbicon-folder, i.action-button.dbicon-folder {
    background-color: #7B61FF;
}

.dbtable button.dbtable-action i.dbicon-delete, i.action-button.dbicon-delete {
    background-color: var(--func-danger-600);
}

.dbtable button.dbtable-action:hover {
    background-color: var(--hover-background-color);
}

.dbicon-exporter {
    color: var(--primary-600);
    mask: url(../dbimages/ic-exporter-blue.svg) no-repeat 50% 50%;
    mask-size: 18px;
    -webkit-mask: url(../dbimages/ic-exporter-blue.svg) no-repeat 50% 50%;
    -webkit-mask-size: 18px;
}

.dbicon-attachment {
    mask: url(../dbimages/ic-attachment.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-attachment.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon-version {
    mask: url(../dbimages/ic-vd-nav-version.svg) no-repeat center center;
    mask-size: 15px;
    -webkit-mask: url(../dbimages/ic-vd-nav-version.svg) no-repeat center center;
    -webkit-mask-size: 15px;
    background-color: #2a594d;
}

.dbicon.delegation {
    background: url(../dbimages/picto_delegation_table.png) no-repeat !important;
    mask-size: 18px;
    -webkit-mask-size: 18px;
}

.dbicon.validate {
    background: url(../dbimages/picto_bt-ok_dark.png) no-repeat !important;
}

.dbicon.import {
    background: url(../dbimages/picto_import.png) no-repeat;
}

.dbicon.datePicker {
    background: url(../dbimages/ic-datepicker.svg) no-repeat center;
}

.dbicon.dictionary {
    background: url(../dbimages/ic-dictionary-text.svg) no-repeat center;
}

.dbicon.text {
    background: url(../dbimages/ic-text.svg) no-repeat center;
}

.dbicon.document-frozen {
    padding: 2px 9px;
    background: url(../dbimages/ic-document-frozen.svg) no-repeat;
}

.dbicon-container-actions {
    background-color: #18B66A;
}

.dbicon-actions {
    mask: url(../dbimages/ic-actions.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-actions.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

.dbicon.extend {
    mask: url(../dbimages/ic-extend.svg) no-repeat center center;
    mask-size: 20px;
    -webkit-mask: url(../dbimages/ic-extend.svg) no-repeat center center;
    -webkit-mask-size: 8px;
    background-color: white;
    padding: 8px;
}

.dbicon.unextend {
    mask: url(../dbimages/ic-unextend.svg) no-repeat center center;
    mask-size: 20px;
    -webkit-mask: url(../dbimages/ic-unextend.svg) no-repeat center center;
    -webkit-mask-size: 8px;
    background-color: white;
    padding: 8px;
}

.red-bg {
    background-color: #ef5350 !important;
}

.blue-bg {
    background-color: rgb(67, 146, 241) !important;
}

.green-bg {
    background-color: rgb(63, 200, 170) !important;
}

.yellow-bg {
    background-color: rgb(252, 190, 14) !important;
}

.purple-bg {
    background-color: rgb(123, 97, 255) !important;
}

.pink-bg {
    background-color: rgb(244, 156, 187) !important;
}

.gray-bg {
    background-color: rgb(61, 116, 143) !important;
}

.dbicon.upload {
    mask: url(../dbimages/ic-drop-upload.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-drop-upload.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
    background-color: #fff;
}

/* dbicon */

.multiline-content {
    white-space: break-spaces;
    word-wrap: break-word;
}

.dbui-dbcontextual-liketooltip {
    background: #fff !important;
    color: black;
    border-radius: 5px !important;
    box-shadow: rgb(99 99 99 / 20%) 0 2px 8px;
}

.dbui-dblazynotes-section {
    border: unset !important;
    background-color: #FFF6BF;
    border-radius: 5px;
    padding: 5px;
    font-family: inherit;
    font-size: 1em;
    overflow: auto;
}

.dbui-dblazynotes-section-content {
    border: none;
}

.dbui-dblazynotes-section-reply-content {
    margin-inline-start: 10px;
}

.dbui-dblazynotes-section-reply-content .dbui-dblazynotes-section {
    margin-bottom: 0;
}

.dbui-dblazynotes-section-date, .dbui-dblazynotes-section-author {
    font-weight: 500;
}

.dbui-dblazynotes-section-content-header .dbui-dblazynotes-section-author::before {
    -webkit-mask-image: url(../dbimages/ic-assigner.svg);
    background: black;
}

.dbui-dblazynotes-section-content-header .dbui-dblazynotes-section-date::before {
    -webkit-mask: url(../dbimages/ic-clock-20.svg) no-repeat center;
    background: black;
    -webkit-mask-size: 14px;
}

.dbui-dblazynotes-nextnotes .dbbutton {
    border: 1px solid var(--primary-500);
    color: var(--primary-500);
    margin: unset;
}

.dbui-dblazynotes-nextnotes .dbbutton:hover {
    background-color: var(--primary-500);
    color: #fff;
}

.searchform-container {
    height: calc(100vh - 140px) !important;
}

.documentlist .dbsidebar-right .dbsidebar-content .dbsidebar-body .dbsidebar form .rhea_form_anchor {
    height: calc(100vh - 300px);
    overflow-y: auto;
}

.rhea_form_anchor fieldset.block fieldset.block {
    max-height: 400px;
    overflow-y: auto;
}

#createform #quicksearchform, #homepage #section-forms, #treeviewbuilder {
    transform: translate(0, 0);
    z-index: 0;
}

#collab-arrow {
    display: none;
}

.v-application {
    z-index: unset !important;
}

.mobile-drop {
    width: 2px;
    height: 50%;
    display: none;
}

.mobile-element {
    display: none;
}

.mobile-drop.active {
    background-image: var(--func-danger-600);
}

div#header-navigation {
    display: flex;
    flex-direction: row;
    position: relative;
    align-items: center;
    padding: 10px;
    background: white;
    box-shadow: 0 0 8px 0 #d0cece;
    height: var(--navbar-height);
    gap: 10px;
    z-index: 15;
}

div#header-navigation > div {
    display: flex;
    flex: auto;
    justify-content: center;
}

div#header-navigation .header-navigation-back {
    justify-content: start;
    align-items: center;
    gap: 20px;
}

div#header-navigation .header-navigation-back .leading {
    font-size: calc(var(--font-size) + 3px);
    cursor: pointer;
    display: flex;
    align-items: center;
}

div#header-navigation .header-navigation-title {
	color: var(--gs-black);
    font-size: 1.5em;
    font-weight: var(--font-weight);
    align-items: center;
    overflow: hidden;
    flex-wrap: wrap;
}

div#header-navigation button.header-navigation-button {
    padding: 10px 15px;
    border: none;
    border-radius: 5px;
    background-color: var(--primary-500);
    color: #fff;
    font-size: var(--font-size);
    cursor: pointer;
}

div#header-navigation button.header-navigation-button:hover {
    background-color: var(--primary-600);
}

div#header-navigation .header-navigation-trailing {
    display: flex;
    gap: 5px;
    justify-content: end;
}

div#header-navigation .header-navigation-trailing > hr {
    width: 1px;
    background: #CECFD8;
    border: none;
    margin: 0;
    height: auto;
}

.position-relative {
    position: relative;
}

.flex {
    display: flex;
}

.flex-center-align {
    align-items: center;
}

.flex-center-justify {
    justify-content: center;
}

.flex-center {
    align-items: center;
    justify-content: center;
}

.flex-space-between {
    justify-content: space-between;
}

/* db-panel Vue component */

div.dbpanel {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 15px;
    border: 1px solid #e4efff;
    border-radius: 5px;
    cursor: pointer;
    flex: 1;
}

div.dbpanel.selected {
    border: var(--primary-100);
    background-color: var(--gs-background);
}

div.dbpanel label {
    color: #000;
    font-weight: 600;
    margin-top: 10px;
    text-align: center;
    cursor: inherit;
}

div.dbpanel.selected label {
    color: var(--primary-600);
}

div.dbpanel .dbpanel-icon {
    width: 20px;
    height: 20px;
}

/* db-panel Vue component */

/* db-input Vue component */
div.dbinput {
    position: relative;
    display: flex;
    max-width: 100% !important;
}

div.dbinput > label {
    position: absolute;
    top: 10px;
    inset-inline-start: 12px;
    color: var(--secondary-500);
    font-weight: 600;
    font-size: calc(var(
    --font-size) - 1px);
    text-transform: uppercase;
    margin-bottom: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: flex;
}

div.dbinput > label > span {
    color: red;
}

div.dbinput > label > span.max-length {
    position: absolute;
    inset-inline-end: 20px;
    color: grey;
    font-weight: normal;
}

div.dbinput > input,
div.dbinput.container > textarea {
    width: 100%;
    padding: 12px;
    outline: none;
    font-size: var(--font-size);
    font-weight: 500;
}

div.dbinput.container > textarea {
    background-color: transparent;
}

html[dir="rtl"] input, html[dir="rtl"] textarea {
    direction: rtl;
}

div.dbinput,
div.dbinput.container {
    width: unset;
    padding: unset;
    margin-right: unset;
    margin-left: unset;
    border: 1px solid var(--primary-100);
    border-radius: 5px;
}

div.dbselect-parent.container {
    width: unset;
    padding: unset;
    margin-right: unset;
    margin-left: unset;
}

#qucik-search-form .dbselect-parent .dbselect .selected span {
    font-weight: 400;
}

div.dbinput.container > input {
    height: 60px;
    padding-top: 36px;
    font-weight: 500;
}

div.dbinput.container > input:disabled {
    background: #F0F0F0;
}

div.dbinput > i.dbicon {
    position: absolute;
    top: 20px;
    right: 10px;
    cursor: pointer;
}

div.dbinput > .popup {
    top: 65px;
    right: unset;
}

div.dbinput > div > span.btnDatePicker {
    width: 34px;
    height: 34px;
    display: block;
    background: url(../dbimages/ic-calendar.svg) no-repeat center;
    cursor: pointer;
}

div.dbinput.container > div > span.btnDatePicker {
    margin-top: 22px;
}

[id^="dbinput-tag"] > input,
[id^="dbinput-category"] > input {
    cursor: text;
    pointer-events: auto !important;
}

/* db-input Vue component */

/* db-checkbox Vue component */
div.dbcheckbox {
    display: flex;
    flex-direction: row;
    align-items: center;
}

div.dbcheckbox label {
    color: var(--primary-600)
}

/* db-checkbox Vue component */
/* db-container Vue component */
div.dbcontainer {
    display: flex;
    flex-direction: column;
    padding: 15px;
    border-radius: 5px;
    background-color: #fff;
}

div.dbcontainer div.title {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}

div.dbcontainer div.title h2 {
    font-weight: 500;
}

div.dbcontainer div.title span.title-suffix {
    font-size: calc(var(--font-size) + 1px);
    text-align: center;
    color: #a4a4a4;
}

/* db-container Vue component */

/* db-sidebar Vue component */

div.dbsidebar {
    display: flex;
    flex-direction: column;
    height: calc(100vh - var(--navbar-height));
}

div.dbsidebar .dbsidebar-title {
    padding: 15px;
    border-bottom: 2px solid #eeeef2;
}

div.dbsidebar .dbsidebar-title p {
    font-size: calc(var(--font-size) + 5px);
    font-weight: 600;
    margin: 0;
}

/* db-sidebar Vue component */

/* db-field Vue component */

div.dbfield {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 10px;
    border: 1px solid #e1edff;
    border-inline-start-width: 15px;
    border-radius: 5px;
    min-height: 50px;
    cursor: grab;
}

div.dbfield:before {
    position: absolute;
    top: 40%;
    inset-inline-start: -14px;
    height: 15px;
    width: 15px;
    content: url(../dbimages/ic-drag.svg);
}

div.dbfield label {
    color: var(--primary-600);
    font-weight: 600;
    text-transform: uppercase;
    cursor: grab;
}

div.dbfield p {
    margin: 5px 0 0;
    font-size: var(--font-size);
    color: #989898;
}

/* db-field Vue component */

/* db-form-field Vue component */

div.dbformfield {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 15px;
    border: 1px solid #bbd6ff;
    border-radius: 5px;
}

div.dbformfield span {
    display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -10px;
    inset-inline-end: -10px;
    background-color: #fce7ed;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    cursor: pointer;
    color: var(--func-danger-600);
}

div.dbformfield span:hover {
    background-image: var(--func-danger-600);
    color: white;
}

div.dbformfield label {
    color: var(--primary-600);
    font-weight: 600;
    text-transform: uppercase;
}

div.dbformfield p {
    color: #929292;
    margin: 5px 0 0;
}

div.dbformfield .field {
    display: flex;
    flex-direction: row;
    gap: 10px;
    align-items: center;
}

div.dbformfield .field .field-type {
    width: 35px;
    cursor: pointer;
}

div.dbformfield .field .field-type i {
	padding: 20px;
}

div.dbformfield .field .field-type .popup {
    max-height: max-content;
    overflow-y: auto;
    inset-block-start: 55px;
    inset-inline-start: 13px;
}

div.dbformfield.placeholder {
    align-items: center;
    border: 1px dashed #d5d7de;
}

div.dbformfield.placeholder.selected {
    border: 1px dashed #237bff;
}

/* db-form-field Vue component */

/* db-text-field Vue component */
div.dbtextfield {
	display: flex;
	flex-direction: row;
	justify-content: center;
    padding: 10px;
    border: 1px solid #e1edff;
    border-radius: 5px;
	min-height: 50px;
}

div.dbtextfield > input {
	outline: none;
}
/* db-text-field Vue component */

/* db-placeholder Vue component */

div.dbplaceholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: calc(var(--font-size) + 2px);
    gap: 10px;
}

div.dbplaceholder p {
    margin: 0;
    font-weight: 400;
    color: #666;
}

/* db-placeholder Vue component */

div.section {
    margin-top: 20px;
}

div.section:first-child {
    margin-top: 0;
    position: relative;
}

div.section > h2 {
    margin: 0;
}

div.header-section span {
    color: #8C90A6;
    font-size: calc(var(--font-size) + 5px);
    bottom: 5px;
    font-weight: 600;
    line-height: 40px;
    vertical-align: text-bottom;
}

div.section h1 {
    margin: 0;
}

div.forms-container {
    background: #FFFFFF;
    padding: 20px;
    border-radius: 10px;
    box-shadow: rgba(99, 99, 99, 0.2) 0 2px 8px 0;
}

div.forms-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

div.forms-container > div {
    display: flex;
    align-items: center;
    flex-direction: column;
    text-align: center;
}

div.forms-container > div > img {
    width: 60px;
}

div.forms-container a.btn-create-form {
    color: #fff;
    text-decoration: none;
    font-size: calc(var(--font-size) + 1px);
    padding: 20px;
    border-radius: 10px;
    background: var(--primary-500);
    font-weight: 500;
}

div.forms-container a.btn-create-form:hover {
    background-color: var(--primary-600);
}

div.forms-container > h2 {
    color: #1A204D;
    font-weight: 600;
}

div.forms-container > h3 {
    color: #000;
    font-weight: 500;
}

#homepage .theme--light.v-application {
    background-color: transparent;
}

#section-forms {
    margin-top: 20px;
    margin-bottom: 20px;
}

#section-forms div.forms-container {
    padding: 20px 30px;
    flex-direction: row;
    flex-wrap: wrap;
}

#section-forms div.forms-container > div {
    flex-direction: row;
    text-align: left;
    gap: 0 30px;
    justify-content: center;
    flex-wrap: wrap;
}

div.panel {
    display: flex;
    flex-direction: row;
    border-radius: 10px;
    padding: 15px;
    background-color: #fff;
    min-width: 230px;
    min-height: 210px;
    cursor: pointer;
    box-shadow: rgb(99 99 99 / 20%) 0 2px 8px 0;
}

div.card {
    border-radius: 5px;
    background-color: #fff;
    min-width: 250px;
}

div.card div.card-header {
    border-bottom: 1px solid var(--primary-150);
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 65px;
}

div.card div.card-header div.card-header-content div.card-header-icon {
    min-width: 30px;
    height: 30px;
    border-radius: 4px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

div.card div.card-header div.card-header-content {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 10px 15px;
    gap: 10px;
}

div.card div.card-header div.card-header-content span:last-child {
    font-size: calc(var(--font-size) + 5px);
    font-weight: 500;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

div.card div.card-header div.card-header-action {
    min-width: 30px;
    height: 30px;
    border-radius: 5px;
    cursor: pointer;
}

div.card div.card-header div.card-header-action {
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
    color: #d1d2db;
    padding-right: 10px;
}

div.card div.card-header div.card-header-action:hover {
    color: white;
}

#section-advanced-search {
    margin-top: 20px;
}

#section-advanced-search .card-header-action:hover {
    background-color: unset;
}

div.search-options {
    background-color: #FFFFFF;
    border-radius: 50px;
    padding: 5px;
    width: fit-content;
    box-shadow: rgba(99, 99, 99, 0.2) 0 2px 8px 0;
}

button.search-option-button {
    background-color: #FFFFFF;
    border-width: 0;
    border-radius: 50px;
    padding: 12px 25px;
    cursor: pointer;
}

button.active {
    background-color: var(--primary-500);
    color: #FFFFFF;
}

.skeleton {
    color: transparent !important;
    border-radius: 0.25rem;
    cursor: progress;
    animation: skeleton-loading 1s linear infinite alternate;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

@keyframes skeleton-loading {
    0% {
        background-color: hsl(199, 8%, 95%);
    }

    100% {
        background-color: hsl(234, 12%, 83%);
    }
}

.hide {
    display: none !important;
}

.disable {
    opacity: 0.7;
    pointer-events: none;
}

div.header-navigation-back a i {
    padding-inline-start: 16px;
}

html[dir="rtl"] div.header-navigation-back a i {
    display: inline-block;
    transform: scaleX(-1);
    height: 20px;
}

div.errors-container {
    padding: 15px;
}

div.errors-container ul.errors li.error {
    color: red;
}

.ic-back {
    background-image: url(../dbimages/ic-back.svg);
    background-repeat: no-repeat;
}

html[dir="rtl"] .ic-back {
    transform: scale(-1);
}

.ic-search {
    background-image: url(../dbimages/ic-search.svg);
    background-repeat: no-repeat;
}

.ic-remove {
    background: url(../dbimages/ic-remove.svg) no-repeat center;
    width: 26px !important;
    height: 26px;
    border-radius: 0.25em;
}

.ic-star {
    background-image: url(../dbimages/ic-star.svg);
    background-repeat: no-repeat;
}

.ic-doc {
    background-image: url(../dbimages/ic-doc.svg);
    background-repeat: no-repeat;
}

.ic-folder-filled {
    background-image: url(../dbimages/ic-folder-filled.svg);
    background-repeat: no-repeat;
}

.ic-plus {
    background-image: url(../dbimages/ic-plus.svg);
    background-repeat: no-repeat;
}

/* reattribute class style */
.v-application--wrap {
    min-height: 0;
}

.fb-btn.v-btn--outlined {
    border: white;
    text-transform: none;
}

.v-btn.v-size--default, .v-btn.v-size--large {
    font-size: var(--font-size);
}

.v-btn:not(.v-btn--round).v-size--default {
    padding: 0 0 !important;
}

.v-sheet.v-card {
    border-radius: 0;
    padding: 0;
}

.font-h3 {
    font-size: calc(var(--font-size) + 3px);
    font-weight: 500;
    letter-spacing: normal;
    padding: 10px
}

li {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.v-toolbar__title {
    display: flex;
}

div.forms-container > div#quickform-container {
    display: flex;
    flex-direction: column;
    align-items: start;
    flex-grow: 1;
    width: 100%;
}

#quickform-container .quickforms-title {
    display: flex;
    flex-direction: row;
    width: 100%;
}

#quickform-container .quickforms-title .quickform-list {
    display: flex;
    flex-direction: row;
    width: 100%;
    gap: 5px;
}

#quickform-container .quickforms-title a {
    color: var(--secondary-500);
    font-weight: 600;
    font-size: var(--font-size);
    text-decoration: none;
    text-align: center;
    display: flex;
    gap: 6px;
    white-space: nowrap;
}

#quickform-container .quickforms-title a i {
	mask: url(../dbimages/ic-plus.svg) no-repeat center center;
	mask-size: 16px;
	-webkit-mask: url(../dbimages/ic-plus.svg) no-repeat center center;
	-webkit-mask-size: 16px;
	background-color: var(--primary-500);
	padding-inline-start: 28px;
}

.quickform-info {
    display: flex;
    position: unset;
    padding: 8px;
    color: var(--primary-500);
    cursor: pointer;
    font-weight: 600;
    font-size: var(--font-size);
    align-items: center;
}

.quickform-info:hover, .quickform-info.selected {
    border-radius: 5px;
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.9),
    rgba(255, 255, 255, 0.9)), linear-gradient(0deg, var(--primary-500), var(--primary-500));
}

.quickform-info.create-quickform:hover {
    margin-right: unset;
}

.quickform-info.selected .toolbar .popup-button {
    visibility: visible;
}

.quickform-info .toolbar .popup {
    top: var(--popup-button-height);
}

.quickform-list .quickform-info > i {
    padding-top: 8px;
}

.quickform-list .quickform-info > .toolbar {
    position: unset;
    inset-inline-start: 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    visibility: hidden;
}

.quickform-list .quickform-info > .toolbar > i:last-child {
    backdrop-filter: blur(10px);
}

.quickform-list .quickform-info:hover > .toolbar {
    visibility: visible;
}

.quickform-list .quickform-info:hover > i.folder, .quickform-list .quickform-info:hover > i.file {
    display: none;
}

.quickform-list .quickform-info > i.drag {
	display: none;
}

.quickform-list .quickform-info:hover > i.drag {
    display: inherit;
}

#quickform-container .quickforms-content {
    width: 100%;
	margin-top: 10px;
}

#quickform-container .quickforms-content > form {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px 15px;
}

#quickform-container .quickforms-content > form .form-fields {
    display: flex;
    flex-direction: row;
    /* flex: 1; */
    align-items: center;
    flex-grow: 1;
}

#quickform-container .quickforms-content .dbbutton {
    width: 200px;
}

#quickform-container .quickforms-content .form-fields .dbinput {
    padding: 0;
}

#quickform-container .quickforms-content .form-fields .dbinput.container,
#quickform-container .quickforms-content .form-fields .dbselect {
    border-radius: 0;
}

#quickform-container .quickforms-content .form-fields .dbselect-parent,
#quickform-container .quickforms-content .form-fields .dbinput {
    height: 62px;
    flex: 1;
}

#quickform-container .quickforms-content .form-fields > .dbinput.container:first-of-type,
#quickform-container .quickforms-content .form-fields > .dbselect-parent:first-of-type > .dbselect {
    border-start-start-radius: 5px;
    border-end-start-radius: 5px;
}

#quickform-container .quickforms-content .dbinput span.addon.suffix {
    top: 30px;
}

#quickform-container .quickforms-content .form-fields .dbinput.container:last-child,
#quickform-container .quickforms-content .form-fields .dbselect-parent:last-of-type > .dbselect {
    border-start-end-radius: 5px;
    border-end-end-radius: 5px;
}

.quickforms-button {
    color: #fff;
    background-color: var(--primary-500);
    border: none;
    border-radius: 5px;
    outline: none;
    padding: 20px;
    cursor: pointer;
    margin: 20px;
    font-weight: 700;
    font-size: calc(var(--font-size) + 3px);
}

#quickform-container .quickforms-title .quickform-list div div.quickform-name {
	max-width: 300px;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	margin: 0 5px;
}

.quickform-list .quickform-info .popup-right {
	inset-inline-end: unset;
}

.quickform-list .quickform-item {
	display: inherit; 
	max-width: 100%;
	overflow-x: auto;
    align-items: center;
    gap: 5px;
}

::-webkit-calendar-picker-indicator{
    background: url(../dbimages/ic-calendar.svg) center no-repeat;
    cursor: pointer;
}

.documentlist {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: calc(100% - var(--navbar-height));
    overflow: hidden;
}

.documentlist > div.list-result .main-content-title {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
}

.documentlist > div.list-result .main-content-title .result-info {
    display: flex;
}

.documentlist > div.list-result .main-content-title .viewer-type {
	display: flex;
	flex-direction: row;
	gap: 10px;
    flex-grow: 1;
    justify-content: end;
}

.documentlist > div.list-result .main-content-title .viewer-type div.document-viewtype {
	padding: 10px 12px;
	border: 1px solid var(--primary-500);
	border-radius: 5px;
	cursor: pointer;
}

.documentlist > div.list-result .main-content-title .viewer-type div.document-viewtype.active {
	background-color: var(--primary-500);
	display: unset;
}

.documentlist > div.list-result .main-content-title .viewer-type div.document-viewtype.active span.dbicon {
	background-color: #fff;	
}

.documentlist > div.list-result .main-content-title .viewer-type div.document-viewtype span.dbicon {
	background-color: var(--primary-500);
	margin-inline-start: unset;
}

.documentlist > div.list-result .main-content-title .viewer-type .document-viewtype:hover {
	background-color: var(--primary-50);
}

.documentlist > div.list-result .main-content-title .viewer-type .document-viewtype:hover span.dbicon {
	background-color: var(--primary-500);
}

.documentlist > div.list-result {
    flex: 1;
    padding: 40px 50px;
    overflow: auto;
}

.documentlist .document-note-hover-preview div.popup, .business-note-hover-preview div.popup {
    inset-inline-start: unset;
    inset-inline-end: 35px;
    top: 0;
}

.business-list div.text-center {
    display: flex;
    justify-content: space-around;
} 

.business-list .text-center span.lock {
	padding: 10px;
}

.db-note-hover-container {
    padding: 10px;
    width: 400px;
    height: fit-content;
    overflow: auto;
}

.db-note-hover-preview {
    max-height: 600px;
    cursor: auto !important;
}

.db-note-hover-title {
    display: flex;
    border-bottom: 1px solid #E5E5E5;
}

.db-note-hover-preview .section-notes-list {
    margin: 10px 0;
}

.db-note-hover-preview .section-notes-list .section-main-note {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    padding: 10px !important;
    width: 100%;
    overflow: auto;
}

.db-note-hover-preview .section-notes-list .section-note-data {
    margin: 5px 0 10px 0;
    background-color: #FFF6BF;
    width: 100%;
    border-radius: 5px;
}

.db-note-hover-preview .section-notes-list .section-reply-notes {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    padding: 10px 10px 10px 30px !important;
    width: 100%;
    overflow: auto;
}

.db-note-hover-preview .section-notes-list span {
    margin: 0 !important;
    padding: 0 !important;
}

.db-note-hover-preview .section-actions {
    display: flex;
    align-items: flex-start;
}

.db-note-hover-preview .section-actions .next-note-btn-size {
    width: fit-content;
}

.main-content-title {
    display: block;
    font-size: calc(var(--font-size) + 7px);
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    margin-bottom: 15px;
}

.main-content-title span {
    margin-inline-start: 10px;
}

.main-content-title span a {
    font-size: var(--font-size);
    color: var(--primary-500);
    text-decoration: none;
}

.main-content-toolbar,
.main-content-toolbar .left,
.main-content-toolbar .right {
    display: flex;
    margin-bottom: 10px;
    gap: 10px;
}

.main-content-toolbar {
    flex-wrap: wrap;
    justify-content: space-between;
}

.main-content-toolbar .dbselect {
    width: 215px;
    margin-inline-end: 10px;
}

#document-detailed-view-toolbar .main-content-toolbar .dbpopup-button {
    width: unset;
}

.main-content-toolbar .dbselect > .dbselect-input > .custom-select {
    height: 40px;
}

.main-content-toolbar .dbbutton {
    margin: unset;
}

div.dbselect > .dbselect-input > .custom-select div.selected {
    color: var(--primary-600);
}

.dbheader-toolbar div.dbselect > .dbselect-input > .custom-select {
    min-width: 140px;
    height: 40px;
    padding-inline-start: unset;
    padding-right: 40px;
}

.dbheader-toolbar div.dbselect:after {
    top: 10px;
}

.dbheader-toolbar div.dbselect > .dbselect-input > .custom-select div.selected {
    color: #fff;
}

.dbheader-toolbar div.dbselect > .dbselect-input > .custom-select div.items {
    inset-inline-start: -15px;
    top: 42px;
    inset-inline-end: 0;
    z-index: 10;
    width: 140px;
}

.dbheader-toolbar .popup {
    top: 52px;
    width: max-content;
}

.main-content-toolbar .popup {
    min-width: 200px;
    /* min-height: 200px; */
    max-height: 500px;
    overflow-y: auto;
    width: max-content;
}

/*Popup button list item*/
.popup > button {
    display: flex;
    align-items: center;
    color: var(--gs-black);
}

.main-content-toolbar .dbpopup-button > i {
    background-color: var(--primary-600);
}

.main-content-toolbar .dbpopup-button {
    position: relative;
    user-select: none;
}

.main-content-toolbar .db-button-popup.sort-column .popup {
    height: max-content;
    overflow-y: visible;
    width: 530px;
    cursor: default;
}

.main-content-toolbar .dbpopup-button#sort-column .dbcontainer {
    padding: 10px 15px;
}

.dbsidebar-content .dbsidebar-body .dbsidebar .dbinput,
.dbsidebar-content .dbsidebar-body .dbsidebar .dbselect-parent {
    margin: 10px;
}

.dbsidebar-footer .dbbutton {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
}

.dbsidebar-footer .dbbutton i.dbicon {
    margin-right: 10px;
}

.dbsidebar-footer > .dbbutton {
    margin-bottom: 0;
}

.dbsidebar-footer > div {
    display: flex;
    gap: 5px;
}

div.dbsidebar form {
    margin: 20px 10px 0 10px;
}

#dbcontainer-sendmail .content form .from.label {
    font-size: 1.10em;
    padding: 12px;
    background: var(--gs-background);
    border-color: var(--primary-500);
    border-radius: 5px;
}

#dbcontainer-sendmail .content form,
#dbcontainer-sendmail .content form .to,
#dbcontainer-sendmail .content form .message {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

#dbcontainer-sendmail .content form .documentinfo {
    font-size: 1em;
}

#dbcontainer-sendmail .content form .documentinfo > label,
#dbcontainer-sendmail .content form .attachment > label {
    display: block;
    margin-bottom: 8px;
}

#dbcontainer-sendmail .content form .attachment,
#dbcontainer-sendmail .content form .link {
    padding: 10px;
    background: var(--gs-background);
    border: 1px dashed var(--primary-500);
}

#dbcontainer-sendmail .content form .link > div {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 10px;
}

#dbcontainer-sendmail .content form .link > div .dbinput > input[type=date] {
    width: 170px;
}

#dbcontainer-sendmail .content form .link > div .dbselect {
    width: 100px;
}

#dbcontainer-sendmail .content form .link > div .dbinput > input,
#dbcontainer-sendmail .content form .link > div .dbselect .dbselect-input > .custom-select {
    height: 30px;
}

#dbcontainer-sendmail .content form .link > div .dbselect {
    background-color: #fff;
}

#dbcontainer-sendmail .content form .link > div .dbselect:after {
    top: 5px;
}

#dbcontainer-sendmail .content form .actions {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 0;
    border-top: 2px solid var(--primary-100);
}

#dbcontainer-sendmail .content form .actions > div button {
    margin: unset;
    padding: 10px;
}

#dbcontainer-sendmail .content .tag-input {
	background-color: #fff;
}

#dbcontainer-sendmail .popup .user-label {
    padding: 15px;
    text-align: start;
}

#dbcontainer-sendmail .popup .user-label .initial {
    color: #fff;
    padding: 5px;
    background: red;
    border-radius: 50%;
}

#dbcontainer-sendmail .popup .user-label .username,
#dbcontainer-sendmail .popup .user-label .usermail {
    color: var(--primary-600);
}

#dbcontainer-sendmail .popup .user-label .username {
    font-size: calc(var(--font-size) + 1px);
    font-weight: var(--font-weight);
    margin: 0 8px;
}

#dbcontainer-sendmail .popup span {
    display: block;
    padding: 8px;
    font-size: calc(var(--font-size) + 1px);
    font-weight: var(--font-weight);
    color: var(--primary-600);
    text-align: start;
    cursor: pointer;
}

#dbcontainer-sendmail .popup span.noresult {
    cursor: default;
}

#sort-column .dbcontainer .title h2 {
    margin-bottom: 0;
}

#dbcontainer-registerSearchForm .content form div.info {
    margin-top: 15px;
    padding: 15px;
    background-color: var(--gs-background) !important;
    border-radius: 10px;
    border-color: unset !important;
}

#dbcontainer-registerSearchForm .content form div.info p {
    font-size: var(--font-size);
    margin-top: 0;
    margin-inline-start: 10px;
}

#dbcontainer-registerSearchForm .content form div.info i {
    margin-inline-end: 10px;
    -webkit-mask-size: 18px;
}

#dbcontainer-registerSearchForm .content form div.info div {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
}

#dbcontainer-registerSearchForm .content form div.info div div {
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: var(--font-size);
}

#dbcontainer-registerSearchForm .content form div.info div div > span:first-child {
    font-weight: 500;
}

#dbcontainer-registerSearchForm .content form .actions {
    justify-content: end;
}

#dbcontainer-registerSearchForm .content form .actions button {
    width: 100px;
    height: 45px;
}

.icon-arrow-down {
    -webkit-mask: url(../dbimages/ic-down-fill.svg) no-repeat center;
    mask: url(../dbimages/ic-down-fill.svg) no-repeat center;
    mask-size: var(--icon-size);
    -webkit-mask-size: var(--icon-size);
    background-color: var(--primary-500);
}

.icon-filter {
    -webkit-mask: url(../dbimages/ic-filter.svg) no-repeat center;
    mask: url(../dbimages/ic-filter.svg) no-repeat center;
}

#business-detail-header {
    width: calc(100vw - var(--sidebar-width));
    position: relative;
    z-index: 5;
}

#businessdetail {
    height: calc(100vh - var(--navbar-height) - 15px);
    width: calc(100vw - var(--sidebar-width) - 10px);
}

#businessdetail .dbtable table thead th {
    font-size: calc(var(--font-size) + 1px);
}

#businessdetail .dbtable table tbody td {
    font-size: var(--font-size);
}

#businessdetail .dbtable table tbody td.db-table-td-__actions {
	/*display: flex;*/
	/*align-items: center;*/
}

#businessdetail #documentdetail {
    height: 100%;
}

.businessnote {
    border: 1px solid var(--primary-100);
    border-radius: 5px;
    margin-bottom: 8px;
}

.businessnote .info,
.businessnote .content,
.businessnote .actions {
    padding: 0 15px;
}

.businessnote .info {
    padding-top: 15px;
}

.businessnote .info .userinitial,
.businessnote-input .userinitial,
.businessnote .response .userinitial {
    display: inline-block;
    color: #fff;
    background-color: #fcbe0e;
    padding: 5px;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    font-size: calc(var(--font-size) + 3px);
    text-align: center;
}

.businessnote .info .username {
    margin-inline-start: 10px;
}

.businessnote .info .createdate {
    margin-inline-start: 10px;
    color: #ccc;
}

.businessnote .content {
    margin-top: 20px;
}

.businessnote .actions {
    margin-top: 15px;
    padding-bottom: 10px;
}

.businessnote .actions .dbbutton {
    font-size: calc(var(--font-size) - 1px);
    padding: unset;
    margin: unset 10px unset unset;
}

.businessnote .actions .dbbutton:hover {
    background-color: unset;
}

.businessnote .response {
    color: #ccc;
    padding: 15px;
    border-top: 1px solid var(--primary-100);
}

.businessnote .response span:last-child {
    margin-inline-start: 5px;
}

.businessnote-input {
    position: relative;
}

.businessnote-input .dbinput > input {
    padding-top: 10px;
    padding-inline-start: 45px;
}

.businessnote-input span.userinitial {
    position: absolute;
    top: 6px;
    left: 8px;
}

.businessnote-input .dbbutton {
    font-size: calc(var(--font-size) - 1px);
    margin: unset;
}

.businessnote-input .dbbutton:hover {
    background-color: unset;
}

/* ============== treeViewBuilder.jsp =============== */

#treeviewbuilder {
	display: flex;
	flex-direction: row;
	width: 100%;
	height: calc(100vh - var(--navbar-height));
	/* overflow: hidden; */
}

#treeviewbuilder .dbtreeview > .v-treeview .v-treeview-node__label {
	overflow: visible;
}

#treeviewbuilder .dbtreeview > .v-treeview .v-treeview-node__label.droppable {
	color: rgb(0 0 0 / 38%);
	padding: 10px;
	border: 1px dashed var(--primary-100);
	border-radius: 5px;
}

#treeviewbuilder .dbtreeview > .v-treeview .v-treeview-node__label:not(.droppable) > span {
	position: relative;
	display: inline-block;
	min-width: 125px;
	margin-right: 5px;
    text-align: left;
	border: 1px solid var(--primary-100);
	border-radius: 5px;
    padding: 10px 25px 10px 10px;
}

#treeviewbuilder .dbtreeview > .v-treeview .v-treeview-node__label.droppable:hover,
#treeviewbuilder .dbtreeview > .v-treeview .v-treeview-node__label:not(.droppable) > span:hover {
    background-color: #E5F0FF;
}

#treeviewbuilder .dbtreeview > .v-treeview .v-treeview-node__label:not(.droppable) > span i {
	position: absolute;
	top: 8px;
	inset-inline-end: 4px;
	-webkit-mask-size: 10px;
}

#treeviewbuilder .dbtreeview > .v-treeview .v-treeview-node__label:not(.droppable) > span i:hover {
    background-image: var(--func-danger-600);
}

#treeviewbuilder .dbtreeview > .v-treeview .v-treeview-node__label:not(.droppable) > span.btn-nbdocs,
#treeviewbuilder .dbtreeview > .v-treeview .v-treeview-node__label:not(.droppable) > span.btn-sort {
    min-width: unset;
    width: 45px;
    cursor: pointer;
}

#treeviewbuilder .dbtreeview > .v-treeview .v-treeview-node__label:not(.droppable) > span.btn-nbdocs.active {
    background-color: var(--primary-500);
    color: var(--gs-white);
}

#treeviewbuilder .dbtreeview > .v-treeview .v-treeview-node__label > span.droppable {
	text-align: center;
	color: rgb(0 0 0 / 38%);
	border: 1px dashed var(--primary-100);
}

#treeviewbuilder .dbtreeview > .v-treeview .v-treeview-node--disabled {
	display: none;
}

#treeviewbuilder .treebuilder {
    display: flex;
    flex: 1;
    margin: 40px 50px;
    overflow-x: auto;
}

#treeviewbuilder .dbsidebar .category-container {
    overflow-y: auto;
    height: calc(100% - 245px);
}

#treeviewbuilder .dbsidebar .section-category {
	margin: 15px;
}

#treeviewbuilder .dbsidebar .section-category h2 {
	font-size: calc(var(--font-size) + 2px);
	font-weight: 700;
	margin-top: 0;
	text-transform: uppercase;
}

#treeviewbuilder .dbsidebar .section-category .list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	overflow-y: auto;
/* height: 200px; */}

#treeviewbuilder .dbsidebar .section-category .dbfield,
#treeviewbuilder .dbsidebar .section-category .dbtextfield {
	flex: 25%;
    margin: 8px 5px 8px 0;
}

#treeviewbuilder .dbsidebar-footer > div {
	display: block;
}

#treeviewbuilder .dbsidebar-footer > div .dbbutton {
	margin: 10px;
}

/* ============== treeViewBuilder.jsp =============== */

.v-progress-circular {
    margin: 1rem;
}

.iframe-container {
    height: 400px;
    position: relative;
}

.iframe-container .progress-container {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    inset-inline-start: 0;
    z-index: 1;
    background: rgba(211, 211, 211, 0.1);
    border-radius: 5px;
}

.iframe-container-print {
    height: 80vh;
    position: relative;
}

span.checked {
    display: inline-block;
    background: url(../dbimages/ic-check-blue.svg) no-repeat center;
    width: 24px;
    float: right;
    color: transparent;
}

div.simple-table-container {
    height: 500px;
    overflow-y: auto;
    margin-bottom: 20px;
}

table.simple-table {
    border-spacing: 0;
    border-collapse: separate;
    width: 100%;
}

table.simple-table thead th, table.simple-table tbody td {
    font-size: calc(var(--font-size) + 1px);
    font-weight: 500;
    height: 45px;
    padding: 0 10px;
    border-inline-start: 1px solid var(--primary-100);
    border-bottom: 1px solid var(--primary-100)
}

table.simple-table thead th:last-child,
table.simple-table tbody td:last-child {
    border-inline-end: 1px solid var(--primary-100);
}

table.simple-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    border-top: 1px solid var(--primary-100);
    background-color: white;
    text-align: left;
    font-weight: 600;
}

table.simple-table tbody tr:nth-child(even) {
    background-color: #F5F5F5;
}

div#treebuilder a,
div#treebuilder a:VISITED {
	color: var(--primary-600);
	text-decoration: none;
	display: flex;
	gap: 5px;
	align-items: center;
}

.db-business-history {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 12px;
    border: 1px solid #BBD6FF;
    border-radius: 5px;
    outline: none;
    gap: 1rem;
    margin-bottom: 1rem;
}

.db-business-history .header {
    display: flex;
    gap: 10px;
}

.db-business-history .bg-type-display {
    background-color: #7b61ff;
}

.db-business-history .bg-type-extract {
    background-color: #fcbe0e;
}

.db-business-history .bg-type-update {
    background-color: #ff6653;
}

.db-business-history .bg-type-store {
    background-color: #3fc8aa;
}

.db-business-history .bg-type-default {
    background-color: #8c90a6;
}

.logo-letter {
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px;
    border-radius: 50%;
    width: 35px;
    min-width: 35px;
    height: 35px;
    min-height: 35px;
    font-size: calc(var(--font-size) + 4px);
}

.date {
    display: flex;
    align-items: center;
    gap: 5px;
}

.ic-vd-attachment-clock {
    padding: 0 8px;
    -webkit-mask: url(../dbimages/ic-vd-attachment-clock.svg) no-repeat center;
    -webkit-mask-size: contain;
    background-color: #8c90a6;
    height: 14px !important;
    width: 14px !important;
}

.header .type-par-user {
    display: block;
    line-height: 20px;
    font-weight: 700;
    font-size: calc(var(--font-size) + 1px);
}

.action-name {
    font-size: 1.1em;
}

i.icon-setting {
	background: url(../dbimages/ic-settings-gray.svg) no-repeat center;
	width: 14px;
	height: 14px;
}

.pref-action-label {
    display: flex;
    align-items: center;
    gap: 10px;
    user-select: none;
    cursor: pointer;
}

.action-class input[type=checkbox] {
    width: 16px;
    height: 16px;
    cursor: pointer;
}

.log-arg-key.enhanced {
    font-weight: bold;
}

[v-cloak] {
    display: block;
}

@keyframes spinner {
    to {
        transform: rotate(360deg);
    }
}

[v-cloak]:before {
    content: "";
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
    border-radius: 50%;
    border: 2px solid #ccc;
    border-top-color: #333;
    animation: spinner 0.6s linear infinite;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

[v-cloak] * {
    display: none;
}

#submit-button-container {
    text-align: center;
}

button#submit-btn-desktop {
    border: 1px solid grey;
    padding: 10px 20px;
    border-radius: 7px;
    color: white;
    background-color: var(--primary-500);
}

button#submit-btn-desktop:hover {
    background-color: var(--primary-600);
}

.form-selection {
    margin-bottom: 15px;
    margin-top: 15px;
}

.selection-popup {
    appearance: auto;
    outline: 1px solid var(--primary-600);
    border-right: 16px solid transparent;
    border-radius: 7px;
    padding: 10px;
    margin-inline-start: 5px;
}

.selection-popup option {
	display: block;
	padding: 0 20px;
}

#historicCompare.historicCompare {
	width: 100%;
} 

#historicCompare.historicCompare tbody tr{
    word-break: break-word;
 
}

.radio-choice-center {
	display: flex;
	justify-content: center;
}

.table-layout-fixed {
    table-layout: fixed !important;
    max-width: fit-content;
}

.theme--light.v-pagination .v-pagination__item--active {
	background: var(--primary-600);
}

#createBusinessDialog .modal-content .modal-footer {
    border-top: 1px solid #BBD6FF;
}

#createBusinessDialog .modal-content .modal-header h2 {
    margin: revert;
}

#createBusinessDialog .modal-content .modal-body {
    padding-bottom: unset;
}

#createBusinessDialog .modal-content .modal-body form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-bottom: 20px;
}

#main-content-body #loadingDialog .modal-content {
    padding: 20px;
}

#main {
    padding: 30px;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

div#baskets-favorite {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 0 -10px;
}

div.header-section {
    display: flex;
    align-items: center;
    gap: 10px;
}

div.header-section img {
    padding: 6px;
    background: #FFCF53;
    width: 25px;
    height: 25px;
    border-radius: 4px;
}

div.search-section {
    display: flex;
    align-items: center;
}

div#section-basket div.header-section-basket {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    flex-wrap: wrap;
}

div#section-basket div.header-section-basket div.section-basket-header-trailing-menu{
    padding: 11px 10px 0;
}

div#section-basket div.header-section-basket div.section-basket-header-trailing-menu a {
    text-decoration: none;
    font-size: var(--font-size);
    color: var(--primary-600);
    font-weight: 600;
}

div#baskets-favorite div.panel.basket {
    flex: 0 0 calc(20% - 20px);
    margin: 10px;
    transition: all 0.2s ease-in-out;
}

div#baskets-favorite div.panel.basket:hover {
    transform: translate(0, -0.5rem);
}

div#baskets-favorite div.panel.basket.drag-over {
    box-shadow: rgb(99 99 99 / 20%) 0 7px 8px 5px;
}


div#baskets-favorite div.panel.basket.panel-basket-add:hover {
    transform: unset;
}

div#baskets-favorite div.panel.basket div.basket-info {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 10px;
    flex: 1;
    overflow: hidden;
}

div#baskets-favorite div.panel.basket div.basket-info > div {
    display: flex;
    flex-direction: column;
}

div#baskets-favorite div.panel.basket div.basket-info > div span {
    font-weight: 600;
}

div#baskets-favorite div.panel.basket div.basket-info > div span:first-child {
    font-size: calc(var(--font-size) + 5px);
    margin-bottom: 15px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
}

div#baskets-favorite div.panel.basket div.basket-info > div span:last-child {
    color: var(--primary-500);
}

div#baskets-favorite div.panel.basket div.options-button {
    height: 100%;
    width: 28px;
}

div#baskets-favorite div.panel.basket .options-button > button {
    align-self: flex-start;
    background-color: #FFFFFF;
    border: none;
    cursor: pointer;
    color: var(--primary-500);
    border-radius: 0.5em;
    width: 25px;
    height: 25px;
    padding: 0;
}

.svg-button {
    display: flex;
    align-items: center;
    justify-content: center;
}

div#baskets-favorite div.panel.basket .popup {
    top: 30px;
}

div#baskets-favorite div.panel.basket .options-button > button:hover {
    background-color: var(--primary-500);
    color: #FFF;
}

div#baskets-favorite div.panel.basket .options-button > button.popup-button > * {
    pointer-events: none;
}

div#baskets-favorite div.panel.basket div.basket-info span.basket-business-count.skeleton {
    width: 100px;
}

div#baskets-favorite span.basket-business-count {
    font-size: calc(var(--font-size) + 17px);
    font-weight: 600;
}

div#baskets-favorite div.panel.basket span.basket-business-count {
    font-size: 50px;
    font-weight: 400;
}

div#baskets-favorite div.panel-basket-add {
    justify-content: center;
    align-items: center;
    border: 2px dashed var(--primary-500);
    background-color: #FAFBFD;
    padding: 0;
}

div#baskets-favorite div.panel-basket-add:hover {
    background-color: var(--hover-background-color);
}

div#baskets-favorite div.panel-basket-add > div:first-child {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

div#baskets-favorite div.panel-basket-add > div:first-child * {
    pointer-events: none;
}

div#baskets-favorite div.panel-basket-add > div:first-child > button{
    background-color: var(--primary-500);
    border-width: 0;
    border-radius: 5px;
    width: fit-content;
    cursor: inherit;
}

div#baskets-favorite div.panel-basket-add > div:first-child > span {
    height: 20px;
}

div#baskets-favorite div.panel-basket-add > div:first-child > div:last-child{
    font-weight: 600;
    font-size: 1.2rem;
    text-align: center;
    padding: 0 20px;
}

div#section-advanced-search div#search-form-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
}

div#section-advanced-search div#search-form-list div.card {
    flex: 1 0 calc(25% - 10px);
    box-shadow: rgb(99 99 99 / 20%) 0 2px 8px 0;
    display: flex;
    flex-direction: column;
}

div#section-advanced-search div#search-form-list div.card:first-child {
    margin-inline-start: 0;
}

div#section-advanced-search div#search-form-list div.card:last-child {
    margin-inline-end: 0
}

div#section-advanced-search div#search-form-list div.card-content {
    padding: 10px 15px;
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 400px;
    min-height: 330px;
    overflow-y: auto;
}

div#section-advanced-search div#search-form-list div.card-content p:first-child {
    font-weight: 600;
    color: var(--primary-600);
}

div#section-advanced-search div#search-form-list div.card-content p  {
    font-style: normal;
    font-weight: 500;
    font-size: calc(var(--font-size) + 1px);
    line-height: 24px;
    padding: 0 10px;
}

div#section-advanced-search div#search-form-list div.card-content ul {
    list-style: none;
    text-align: start;
    margin: 0;
    padding: 0;
}

div#section-advanced-search div#search-form-list div.card-content ul li  {
    font-style: normal;
    font-weight: 500;
    font-size: calc(var(--font-size) + 1px);
    line-height: 24px;
    letter-spacing: -0.004em;
    color: #000000;
    border-radius: 5px;
    text-overflow: ellipsis;
    overflow-x: hidden;
    white-space: nowrap;
}

div#section-advanced-search div#search-form-list div.card-content ul.recent-activities li {
    padding: 5px 10px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: 5px;
}

div#section-advanced-search div#search-form-list div.card-content ul.recent-activities li:hover {
    cursor: default;
}

div#section-advanced-search div#search-form-list div.card-content ul li > a,
div#section-advanced-search div#search-form-list div.card-content ul li > a:visited,
div#section-advanced-search div#search-form-list div.card-content ul li > a:active {
    display: block;
    padding: 5px 10px;
    color: inherit;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow-x: hidden;
}

div#section-advanced-search div#search-form-list div.card-content ul li:first-child  {
    margin-top: 0;
}

div#section-advanced-search div#search-form-list div.card-content ul li:last-child  {
    margin-bottom: 0;
}

div#section-advanced-search div#search-form-list div.card-content ul li:hover {
    cursor: pointer;
    background-color: var(--hover-background-color);
}

.list-item-border {
    border: 1px solid var(--primary-100);
}

.list-search-form {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.list-search-form a {
    width: 100%;
}

.list-search-form button.icon {
    margin: 3px;
    display: none;
}

.list-search-form:hover button.icon {
    display: flex;
}

.addition-option {
    display: flex;
    align-items: center;
}

.addition-option .datePicker {
    width: 25px !important;
    height: 30px;
    position: relative;
    top: 7px;
    margin-right: 10px;
}

.addition-option button.datePicker:hover {
    background-color: unset !important;
}

.quickforms-content .dbinput .dic-button {
    width: unset !important;
    margin-inline-end: 10px;
}

.quickforms-content .form-fields .dbinput {
    display: flex;
}

.quickforms-content .dbinput .dic-button:hover {
    cursor: unset;
}

.quickforms-content .dbinput .dic-button span {
    font-size: calc(var(--font-size) + 11px);
    color: var(--primary-500);
}

.quickforms-content .dbinput .dic-button span:hover {
    cursor: pointer;
}

.dicocont {
    max-height: 250px;
    overflow: auto;
}

.card-content .searchbox {
    margin-bottom: 10px;
}

.card-content > div.empty {
    text-align: center;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    align-items: center;
}

.dbtable-header-button {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3px;
    border-radius: 6px;
    width: 24px;
    height: 24px;
}

.dbtable-header-button:hover {
    background-color: lightgray;
}

i.icon-bookmark-outline {
    mask: url(../dbimages/ic-bookmark-blue.svg) no-repeat center;
    -webkit-mask: url(../dbimages/ic-bookmark-blue.svg) no-repeat center;
    background-color: rgb(123, 97, 255);
    padding: 10px
}

i.icon-recent-search {
    mask: url(../dbimages/ic-recent-search.svg) no-repeat center;
    -webkit-mask: url(../dbimages/ic-recent-search.svg) no-repeat center;
    background-color: rgb(255, 102, 83);
    padding: 10px
}

i.icon-file-edit {
    mask: url(../dbimages/ic-file-edit.svg) no-repeat center;
    -webkit-mask: url(../dbimages/ic-file-edit.svg) no-repeat center;
    background-color: rgb(252, 190, 14);
    padding: 10px
}

.icon-select {
    mask: url(../dbimages/ic-select.svg) no-repeat center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-select.svg) no-repeat center;
    -webkit-mask-size: var(--icon-size);
}

#sort-column .popup {
    max-width: 550px;
    overflow: visible;
}

#mailDocForm .tag-input {
    background-color: var(--gs-white);
}

.db-table-td-info > div {
    display: flex;
}
.db-table-td-info > span.dbicon {
    min-width: 23px;
    min-height: 23px;
}

i.icon-split-view {
    mask: url(../dbimages/ic-vd-nav-splitview.svg) no-repeat center center;
    mask-size: 15px;
    -webkit-mask: url(../dbimages/ic-vd-nav-splitview.svg) no-repeat center center;
    -webkit-mask-size: 15px;
    background-color: var(--primary-500);
}

.toggle-expand {
    mask: url(../dbimages/ic-down-fill.svg) no-repeat center;
    -webkit-mask: url(../dbimages/ic-down-fill.svg) no-repeat center;
    -webkit-mask-size: 15px;
    mask-size: 15px;
    width: 16px;
    height: 16px;
    background: var(--primary-600);
    transform: rotate(0deg);
}

.toggle-expand.collapse {
    transform: rotate(-90deg);
}

#sidebar-menu-content label.sidebar-label {
    display: none;
}
        
table td .header-span-column {
    display: flex;
    align-items: center;
    gap: 8px;
}

#main-menu-footer-actions a {
    font-size: 0;
}

#dropped-files .document-indexation-body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 15px;
}

.v-data-table--fixed-header > .v-data-table__wrapper, .v-data-table__wrapper {
    overflow: unset;
}

.v-data-table--fixed-header > .v-data-table__wrapper > table > thead > tr.v-data-table__progress > th {
    z-index: 5;
}

@media (max-width: 800px), (max-height: 500px) {

    /*hide freeze column on mobile*/
    #freeze-column, .db-button-popup.freeze-column {
        display: none;
    }

    #page-row {
        flex-direction: column;
    }


    /*hide toolbar*/
    :is(#indexDocument, #restitution, #elimination, #preference, #treeview) #mobile-toolbar-container {
        display: none;
    }

    #businessSearchForm .searchform-container {
        overflow: unset;
    }
    :is(#businessSearchForm, #searchform, #createQuickForm, #solutionlist, #targetlistpage, #businesslist, #businessDetail, #documentDetail,
     #indexDocument, #restitution, #elimination, #preference, #treeview) #main-content-body {
        transition: padding-top 0.5s;
        padding-top: 50px;
    }

    #sidebar-menu #sidebar-container {
        height: unset !important;
        border-top: 11px solid var(--gs-white);
    }

    #sidebar-menu {
        position: absolute;
        z-index: 25;
        padding-top: 40px;
        width: 100%;
        height: 0;
        overflow: auto;
    }

    #sidebar-menu.mobile-sidebar {
        justify-content: flex-start;
    }

    nav, main {
        height: 100%;
    }

    #sidebar-container nav {
        padding-bottom: unset;
    }

    #sidebar-menu.mobile-sidebar {
        height: 100%;
    }

    #sidebar-menu.mobile-sidebar > div, #sidebar-menu.mobile-sidebar > footer {
        display: block;
        width: 100%;
    }

    #sidebar-menu > div, #sidebar-menu > footer {
        display: none;
    }
    #sidebar-menu-content #main-menu-actions ul {
        width: 100%;
    }

    #main-menu-footer-actions a {
        gap: 10px;
        font-size: var(--font-size);
    }

    #sidebar-menu-content li.menu-item {
        display: flex !important;
        flex-direction: row;
        align-items: center;
        justify-content: start;
        color: var(--gs-white);
        font-size: var(--font-size);
        width: 100%;
        gap: 10px;
        margin: 0;
    }

    #sidebar-menu-footer #main-menu-footer #main-menu-footer-actions ul li {
        padding: 0 !important;
    }
    #sidebar-menu-content #main-menu-actions li.menu-item img, #main-menu-footer-actions a img {
        margin: unset !important;
    }
    #sidebar-menu-content label.sidebar-label {
        display: block;
    }

    header {
        display: none;
    }


    #sidebar-menu-content {
        height: 100% !important;
        overflow-x: hidden;
    }

    #main-menu-footer-profile {
        justify-content: start;
    }

    #main-menu-footer-profile ul {
        display: flex;
        align-items: center;
        gap: 10px;
        color: var(--gs-white);
        font-size: var(--font-size);
    }

    #search-form-list .card-content .db-list-item-title i {
        -webkit-mask-size: var(--icon-size);
        mask-size: var(--icon-size);
    }

    #quickform-container .quickforms-title .quickform-list {
        flex-wrap: wrap;
    }
    #quickform-container .quickforms-title {
        display: block!important;
    }
    #quickform-container .quickform-list .quickform-item {
        max-width: 100%;
    }
    #quickform-container .quickforms-title a {
        text-align: start;
        align-items: center;
    }
    #quickform-container .quickforms-title a i {
        height: 16px;
    }

    #quickform-container .quickforms-content > form {
        flex-direction: column!important;
        align-items: start !important;
        gap: 0;
    }
    #quickform-container .quickforms-content > form .form-fields {
        flex-direction: column !important;
        align-items: start!important;
        gap: 5px;
        width: 100%;
    }
    #quickform-container .quickforms-content > form .form-fields .dbinput,
    #quickform-container .quickforms-content > form .form-fields .dbselect-parent {
        border-radius: 5px!important;
        width: 100%;
    }
    #quickform-container .quickforms-content > form .form-fields .dbselect-parent .dbselect {
        border-radius: 5px !important;
    }
    #quickform-container .quickforms-content button.dbbutton {
        margin: 5px 0;
        width: 100% !important;
        margin-inline-start: 0;
    }
    .quickform-list .quickform-info .popup-right #modify {
        inset-inline-end: unset;
        display: none;
    }
    .popup-right button.popup-item {
        font-size: var(--font-size);
    }


    .panel-basket-add .modal-body {
        min-height: 250px;
    }

    /*select toolbar*/
    .dbheader-toolbar {
        width: 100% !important;
        z-index: 32;
    }

    .dbheader-toolbar .right-content {
        flex: 1;
        justify-content: end;
    }
    .dbheader-action span {
        display: none;
    }
    .dbheader-toolbar .dbpopup-button {
        line-height: 30px !important;
    }
    .quickform-info.create-quickform {
        display: none !important;
    }

    #main-content {
        position: unset !important;
        width: 100%;
    }

    #main-content-body {
        position: relative !important;
        width: 100%;
        inset-inline-start: 0;
        display: flex;
        flex-direction: column;
    }

    div.header-navigation-back a i.ic-back {
        padding: 10px;
        background-position: 50%;
    }
    div#header-navigation .header-navigation-back {
        gap: unset;
    }
    #createBusinessDialog .modal-content .modal-body form {
        overflow: unset;
    }

    .panel-basket-add .modal-body ul li p {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    div#baskets-favorite div.panel.basket {
        flex-grow: 1;
        height: 145px;
        min-height: unset;
    }
    #favorite-header-navigation {
        width: 100% !important;
        flex-wrap: wrap;
        gap: 10px;
    }

    #favorite-header-navigation .header-title {
        gap: 10px;
    }
    #favorite-header-navigation .header-title h3,
    #favorite-header-navigation .header-title li {
        font-size: var(--font-size);
        font-weight: var(--font-weight);
        white-space: nowrap;
        padding: 0 !important;
        margin: 0;
    }

    #favorite-header-navigation .favorite-header-action {
        display: flex;
        justify-content: end;
        flex-grow: 1;
    }

    .section .frame, .briefcase-section .frame {
        position: fixed;
        inset: 50%;
        transform: translate(-50%,-50%);
        z-index: 100;
        margin: 0 !important;
        padding: 10px;
        width: 85%;
    }

    /*document list and document view*/
    .main-content-toolbar .popup {
        max-height: 60vh !important;
    }
    .no-mobile-action {
        display: none !important;
    }
    .v-dialog.dbdialog, #main-content .v-dialog:not(.v-dialog--fullscreen) {
        max-height: 65% !important;
        width: 85% !important;
    }
    #tableAction .actions-class, #tableAction .action-class {
        width: unset !important;
    }

    .documentlist > div.list-result {
        padding: 20px !important;
    }

    #sort-column .popup, .sort-column .popup {
        position: fixed;
        top: 50% !important;
        right: 50% !important;
        left: unset !important;
        transform: translate(50%, -50%);
        width: 85vw !important;
        max-width: 500px;
        z-index: 32 !important;
    }

    .filter-column .popup {
        position: fixed;
        top: 0 !important;
        left: 0;
        width: 100% !important;
        height: 100%;
        max-height: unset !important;
        z-index: 35 !important;
    }

    .filter-column #filterForm > div {
        padding-inline: unset;
        height: 100%;
    }

    .filter-column #filterForm form {
        margin-inline: 0;
        padding-inline: 10px;
        width: unset;
        height: 100%;
    }

    #filterForm {
        max-height: unset;
        height: 100%;
        display: flex;
        flex-direction: column;
        padding: unset !important;
    }

    #filterForm .filter-form-container {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        overflow: auto;
    }

    #filterForm .filter-form-container .filter-form-footer .form-button {
        padding: 10px
    }

    #sort-column .popup .content {
        max-height: 65vh;
        overflow: auto;
    }
    #sort-column .dbselect {
        width: 28vw !important;
    }
    .main-content-toolbar,
    .main-content-toolbar .left,
    .main-content-toolbar .right {
        margin-bottom: unset !important;
        flex-wrap: wrap;
    }

    #document-detailed-view-toolbar .main-content-toolbar .left {
        row-gap: 0;
    }
    #dbcontainer-registerSearchForm .content form div.info > div {
        flex-direction: column;
        align-items: flex-start;
    }

    #dbcontainer-registerSearchForm .content form div.info > div > div {
        flex-direction: row;
        flex-wrap: wrap;
    }

    #dbcontainer-registerSearchForm .content form .actions button {
        height: unset !important;
        width: 80px !important;
    }

    #dbcontainer-registerSearchForm {
        padding-bottom: 0;
    }

    .view-document-favorite-btn {
        font-size: 0 !important;
        gap: unset !important;
    }

    .document-title-icon-status  span {
        display: block !important;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        max-width: 30vw;
    }

    .documentlist > div.list-result .main-content-title {
        font-size: calc(var(--font-size) + 2px) !important;
        margin-bottom: 5px;
        flex-wrap: unset;
    }
    .documentlist > div.list-result .main-content-title .result-info {
        flex-wrap: wrap;
        gap: 0 5px;
    }
    .documentlist > div.list-result .main-content-title .result-info span {
        margin-inline-start: unset;
    }
    .main-content-title span a {
        font-size: calc(var(--font-size) - 2px) !important;
    }
    .view-document-title {
        gap: 5px !important;
    }

    .main-content-toolbar .dbpopup-button {
        margin-bottom: 10px;
    }

    .dbsidebar-right .dbsidebar-content {
        min-width: calc(100vw - 40px) !important;
    }

    .dbsidebar-right .dbsidebar-content .dbsidebar-body {
        height: calc(100% - 110px);
    }

    div.dbsidebar {
        height: 100% !important;
    }
    div.dbsidebar form {
        height: 100%;
        overflow: auto;
        margin: unset !important;
    }

    .dbsidebar .quickforms-content {
        padding-bottom: 10px;
        overflow: auto;
        height: 100%;
    }

    .dbsidebar-footer > button.dbbutton {
        padding: 8px!important;
    }
    .dbsidebar-footer .dbbutton {
        padding: 3px !important;
        margin: 0 0 5px 0 !important;
        width: 100% !important;
    }
    .dbsidebar-footer > div button {
        font-size: 0;
    }
    .dbsidebar-right .dbsidebar-menu {
        width: 40px!important;
    }

    .dbsidebar-right .dbsidebar-menu .dbaction {
        padding: 20px 0;
    }

    .dbsidebar-footer .dbbutton i:not(.edit):not(.mail):not(.lock):not(.sort.up):not(.sort.down) {
        -webkit-mask-size: 15px !important;
        margin-inline-end: unset !important;
    }
    aside {
        width: calc(100vw - 60px) !important;
    }
    .document-view-sidebar-menu-wrapper {
        overflow-y: auto;
        overflow-x: hidden;
    }
    .document-view-sidebar-menu-wrapper div.position-relative {
        position: unset!important;
    }
    .document-view-sidebar-menu-wrapper div.position-relative .popup-right {
        inset-inline-end: 60px;
        top: unset;
    }
    @media (max-height: 700px) {
        .document-view-sidebar-menu-wrapper div.position-relative .popup-right {
            bottom: 60px;
        }
    }
    .document-view-sidebar-menu-wrapper .button-item {
        padding: 16px 12px;
    }

    #businesslist .business-list .dbsidebar #businessSearchForm {
        height: calc(100% - 110px);
    }
    #businesslist .business-list .dbsidebar #standardSearchForm {
        height: 100%;
    }

    :is(#document-viewer-container, #businessdetail) .v-dialog.mass-index-document {
        width: 100% !important;
        height: 100%;
        max-height: unset !important;
        max-width: unset !important;
        margin: unset;
    }

    .v-dialog.mass-index-document .dbdialog{
        height: 100%;
    }
    .v-dialog.mass-index-document .dbcontainer {
        padding-block: unset;
        height: 100%;
    }

    #dbcontainer-massIndexingFormDialogContainer .content {
        height: 100%;
    }
    .v-dialog.mass-index-document .dbcontainer form {
        height: 100%;
        display: flex;
        flex-direction: column;
    }
    :is(#massIndexingForm, #mass-modify-form) .iframe-container {
        height: 100%;
        position: unset;
    }

    #dbcontainer-sendmail .content form .actions > div button {
        padding: 6px;
    }

    .dbsidebar-right {
        position: relative;
        z-index: 13;
    }

    .dbsidebar-right .dbsidebar-content {
        position: absolute;
        inset-inline-end: 40px;
        background-color: var(--gs-white);
        height: 100%;
    }
    #document-viewer .doc-sidebar-wrapper {
        position: relative;
    }
    #document-viewer .doc-sidebar-wrapper aside.active {
        position: absolute;
        inset-inline-end: 60px;
        box-shadow: 0 0 8px 0 #d0cece;
    }

    .date {
        flex-wrap: wrap;
    }

    .mobile-actions {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
    }

    .documentlist .dbsidebar-right .dbsidebar-content .dbsidebar-body .dbsidebar form .rhea_form_anchor {
        height: unset !important;
    }

    .list-result .table-layout-fixed {
        max-width: unset!important;
    }


    .list-result table, #favoriteDocument-table table, #business-table table {
        width: 100% !important;
        border: unset !important;
    }

    #favoriteDoc #main, #saeDashboard #main {
        padding-top: unset;
    }

    :is(#favoriteDoc, #saeDashboard) #main .section:first-child {
        padding-top: 60px;
    }

    #favoriteDocument-table tr th:first-child, #favoriteDocument-table tr td:first-child {
        position: sticky;
        inset-inline-start: 0;
        background-color: var(--gs-white);
    }

    #favoriteDocument-table tr th:first-child {
        z-index: 12 !important;
    }

    #favoriteDocument-table.mobile-table tr th:first-child, #favoriteDocument-table.mobile-table tr td:first-child {
        background-color: inherit;
    }

    .db-table-td-info div.text-center {
        flex-wrap: wrap;
    }
    .db-document-history {
        overflow-wrap: break-word;
    }

    /*	business list*/
    .business-list #main {
        padding: 0 20px 20px !important;
        gap: unset !important;
        overflow: auto !important;
    }
    .main-content-toolbar .dbpopup-button {
        min-width: 170px !important;
        width: unset !important;
        font-weight: 500 !important;
    }
    .dbheader-toolbar {
        gap: 10px;
        height: unset !important;
        align-items: center;
        position: fixed;
    }
    .header-navigation-trailing > div > button {
        font-size: 0!important;
    }
    #businesslist #header-navigation .header-navigation-title {
        flex-wrap: nowrap;
    }
    #businesslist div#header-navigation button.header-navigation-button {
        background-size: 16px 16px !important;
        padding: 25px 15px 0 !important;
    }
    .dbheader-toolbar > div {
        flex-wrap: wrap;
        justify-content: start;
        row-gap: 10px !important;
    }
    .dbheader-toolbar .dbdivider {
        display: none;
    }

    :is(#changeproc, #createBusinessDialog, #set-priority) :is(.modal-content, .modal-body) {
        overflow: unset !important;
    }
    .modal .modal-header .modal-addition-header {
        margin-block: 10px;
    }
    .modal-body .history-list {
        width: unset !important;
    }
    .modal .modal-content .modal-body .display-list {
        justify-content: space-around !important;
    }
    .db-business-history, .db-business-history .header .type-par-user {
        font-size: calc(var(--font-size) - 2px) !important;
    }

    #archiveMail.modal .modal-content {
        width: 100% !important;
        max-height: unset !important;
        height: 100%;
    }

    #archiveMail.modal .modal-body {
        width: 100% !important;
        max-width: unset !important;
        max-height: unset !important;
        padding: unset;
    }

    #archiveMail.modal .modal-body > div {
        width: 100% !important;
    }

    .db-button-popup {
        margin: unset !important;
    }
    #main .section.section-custom-list {
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 10px
    }

    #main > div:first-child, #briefcase, #supervision > div:first-child {
        padding-top: 30px;
    }

    #preference #main > div:first-child {
        padding-top: unset !important;
    }

    #main .section.section-custom-list .main-content-toolbar {
        justify-content: unset !important;
    }
    .modal .modal-content .modal-body .display-list > div {
        max-width: 230px !important;
    }
    .modal .modal-content .modal-footer button, .dbdialog.confirmation .actions button {
        white-space: nowrap;
        text-overflow: ellipsis;
        max-width: 30vw;
        overflow: hidden;
        display: block;
    }
    .modal .modal-content .modal-footer > div {
        width: unset !important;
    }

    .popup button, .popup a {
        padding: 8px;
    }

    #sort-column .popup .sort-row button {
        padding: 5px;
    }

        /*	standard search form page*/
    #searchform #header-navigation .header-navigation-back > div,
    #businessSearchForm #header-navigation .header-navigation-back > div,
    #createform #header-navigation .header-navigation-back > div,
    #treeview #header-navigation .header-navigation-back > div {
        display: none;
    }
    #searchform .header-navigation-title,
    #businessSearchForm .header-navigation-title,
    #createform .header-navigation-title,
    #treeview .header-navigation-title {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        max-width: 80%;
        display: block;
    }
    #btnsearch, .btnCreateForm {
        padding: 15px !important;
        font-size: 0 !important;
        background-position: 50%;
    }

    /*:quick form*/
    #homepage :is(#section-forms.no-form, .section.no-form) {
        display: none !important;
    }

    #quicksearchform .btnCreateForm {
        background-image: url("../dbimages/ic-save-white.svg");
    }

    #header-navigation, #business-detail-header {
        position: sticky !important;
        top: 0;
        z-index: 22 !important;
    }

    #business-detail-header {
        width: 100%;
    }

    #searchform .searchform-container, #businessSearchForm .searchform-container {
        margin: 0;
        height: unset !important;
        overflow: unset;
    }

    div.dbselect > .dbselect-input > .custom-select div.items.role-list {
        inset-inline-start: 10% !important;
        max-height: 50vh !important;
    }

    #mobile-toolbar div.dbselect > .dbselect-input > .custom-select div.items.role-list {
        inset-inline-start: 0 !important;
        bottom: unset !important;
    }

    /*	create quick search form*/
    .mobile-element, #mobile-field {
        display: inherit;
    }

    #createform .form-container .form-fields {
        display: none;
    }

    #createform .form-container .form-info #dbcontainer-form-title,
    #createform .form-container .form-info #dbcontainer-form-selected-fields{
        width: 100% !important;
    }
    #createform .no-field:hover {
        text-decoration: underline;
    }
    #mobile-field .dbfield {
        min-height: unset !important;
    }
    .base-selection {
        margin-top: 10px;
    }
    #mobile-field .modal-body {
        height: 44vh;
    }

    #document-detailed-view .mobile-table .v-data-table__wrapper::-webkit-scrollbar,
    #businesslist .mobile-table .v-data-table__wrapper::-webkit-scrollbar {
        display: none;
    }

    /*	tree view builder*/
    #treeviewbuilder {
        height: calc(100vh - 120px) !important;
    }
    #treeviewbuilder .treebuilder {
        margin: 10px !important;
    }
    .droppable.active {
        background-color: #E5F0FF;
    }
    #treeviewbuilder .dbsidebar-right {
        display: none;
    }

    #mobile-field .section-category .list {
        display: flex;
        flex-direction: column;
        justify-content: center;
        width: 95%;
        gap: 5px
    }
    .mobile-element .dbtextfield input {
        width: 90%;
    }
    #treeview #header-navigation button {
        margin: unset !important;
        padding: 8px;
        align-items: center;
    }
    #treeview #header-navigation button.reset {
        font-size: 0;
    }
    #treeview #header-navigation button.reset i.reload {
        margin-inline-end: unset !important;
    }

    /*business detail*/
    #business-detail-header #header-navigation {
        height: unset !important;
        flex-wrap: wrap;
    }
    #business-detail-header div#header-navigation .header-navigation-title {
        order: 3;
    }

    .lm_title .collapse-header {
        flex: 1;
        justify-content: end;
        height: 20px;
    }

    #business-detail-header .header-navigation-trailing > button,
    #business-detail-header .header-navigation-trailing .header-nav-buttons > button,
    #business-detail-header .header-nav-buttons .db-button-popup .buttons button {
        font-size: 0 !important;
        background-size: 15px 17px !important;
    }
    #business-detail-header .header-navigation-trailing {
        gap: 10px !important;
        align-items: center;
        justify-content: center !important;
    }

    #businessdetail #document-detail {
        min-width: unset !important;
    }

    #businessNote .no-note {
        padding: unset !important;
    }

    #businessdetail .modal .business-piece-popup-size {
        width: unset !important;
        height: unset !important;
    }

    #businessNote .modal-body > div {
        width: 100% !important;
        height: unset !important;
        overflow: unset !important;
    }

    #dropped-files {
        position: fixed !important;
        z-index: 35 !important;
    }
    #dropped-files .document-indexation-body {
        display: flex;
        flex-direction: column;
    }

    #dropped-files .D5 form {
        max-height: unset !important;
        overflow: unset !important;
    }
    #dropped-files #header-navigation {
        margin: unset !important;
    }
    #dropped-files #header-navigation .header-navigation-title {
        font-size: var(--font-size);
    }

    #dropped-files #header-navigation .header-navigation-title span p {
        max-width: 45vw !important;
    }

    #dropped-files .modal-content {
        display: flex;
        flex-direction: column;
        height: 100% !important;
        width: 100% !important;
        max-height: unset !important;
        padding-inline: unset;
    }
    #dropped-files .modal-content .modal-body {
        height: 100% !important;
        max-height: 100% !important;
        width: 100% !important;
        min-width: unset !important;
        max-width: unset;
    }
    #dropped-files .modal-content .modal-footer {
        padding-bottom: 10px;
        justify-content: flex-end;
    }

    .mass-index-document .actions-container {
        flex-wrap: wrap;
        align-content: center;
    }
    .mass-index-document .actions-container .cancel-button {
        height: 30px;
    }
    .mass-index-document .actions-container .index-actions {
        flex: 1;
        justify-content: flex-end;
    }

    #header-navigation .header-nav-buttons {
        gap: 15px;
        align-items: center;
    }

    .flex-helper {
        display: none;
    }

    #treeviewbuilder .treebuilder .dbtreeview button {
        margin-right: 10px;
    }

    .db-button-with-icons {
        min-width: unset !important;
        font-size: calc(var(--font-size) - 2px) !important;
    }
    .display-inline .dbbutton i {
        -webkit-mask-size: calc(var(--icon-size) - 3px);
    }
    #briefcase .dbbutton.delete {
        padding: 5px;
    }
    #briefcase .display-inline .db-button-with-icons {
        padding: 8px !important;
        height: unset !important;
    }

    #briefcase .index-document {
        font-size: calc(var(--font-size) - 2px);
        padding: 8px !important;
    }

    #addbusinessdocument .dbheader-toolbar .right-content button {
        font-size: 0;
        gap: 0;
    }

    #document-viewer :is(.attachement-list-area .no-attachment, .no-note) {
        padding: 15px !important;
    }

    :is(.doc-sidebar-menu, .sidebar-menu) .button-item {
        width: 35px;
        min-width: 35px;
        height: 35px;
        min-height: 35px;
    }

    :is(.doc-sidebar-menu, .sidebar-menu) .button-item i {
        -webkit-mask-size: var(--icon-size) !important;
        mask-size: var(--icon-size) !important;
        padding: 10px;
    }

    /*dashboard*/
    #dashboard #main {
        gap: 0;
    }

    #dashboard :is(.dbicon.distribute, .dbicon.delegater, .dbicon.reassigner) {
        mask-size: 15px;
        -webkit-mask-size: 15px
    }

    #dashboard .business-total div.forms-container.business-info div.icon,
    #dashboard .performance div.forms-container.business-info div.icon {
        width: 30px;
        height: 30px;
    }

    #dashboard .business-total div.forms-container.business-info div.icon i,
    #dashboard .performance div.forms-container.business-info div.icon i {
        -webkit-mask-size: var(--icon-size) !important;
        mask-size: var(--icon-size) !important;
    }

    .forms-container .header .legend {
        flex-wrap: wrap;
        gap: 5px !important;
    }

    .chart-container {
        height: calc(100% - 60px) !important;
    }

    .mobile-table .v-label {
        font-size: var(--font-size);
    }

    #saeDashboard {
        height: unset !important;
    }
    #saeDashboard .sub-section {
        height: unset !important;
        flex-wrap: wrap;
        margin: 15px 0 !important;
    }
    .mobile-table tr td:first-child {
        position: unset !important;
    }

    .dbcontextual-content-wrapper {
        max-width: 60vw !important;
    }

    .v-input .v-select__selections {
        font-size: var(--font-size);
    }

    /* :preference change password */
    #preference #main {
        overflow: unset !important;
        padding: 20px;
    }
    #preference #main .v-data-table__wrapper {
        height: unset !important;
    }
    #formnewpwd .content-change-password .actions {
        flex-direction: row-reverse;
    }
}

.dbicon.dbicon-priority {
    mask: url(../dbimages/ic-file-edit.svg) no-repeat center center;
    mask-size: var(--icon-size);
    -webkit-mask: url(../dbimages/ic-file-edit.svg) no-repeat center center;
    -webkit-mask-size: var(--icon-size);
}

#corbeilles-page .searchbox {
    width: 400px;
}