:root {
    --btnprimaryback: #6497b1 !important;
    /* rgba(255, 73, 51, 1);*/
    /*#3c4b64;*/
    --btnprimarybackhover: #b3cde0 !important;
    /*rgb(255, 96, 79); */
    --btnprimaryselected: #12c5cb30 !important;
    --btnsecondaryback: #FFF !important;
    --dt-row-selected: 179, 205, 224 !important;
    --btntranshover: #12c5cb30 !important;
    --dt-row-selected-text: 0, 0, 0 !important;
}

.sidebar-nav li:first-child {
    background-color: transparent !important;
}

.sidebar-nav .sidebar-item:hover {
    background-color: var(--btnprimarybackhover) !important;
}

.sidebar-nav li.active {
    background-color: var(--btnprimaryback) !important;
}

.verticalDotsBtn {
    cursor: pointer;
    width: 24px;
    height: 24px;
    content: url("data:image/svg+xml,%3Csvg width='4' height='16' viewBox='0 0 4 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 16C1.45 16 0.979167 15.8042 0.5875 15.4125C0.195833 15.0208 0 14.55 0 14C0 13.45 0.195833 12.9792 0.5875 12.5875C0.979167 12.1958 1.45 12 2 12C2.55 12 3.02083 12.1958 3.4125 12.5875C3.80417 12.9792 4 13.45 4 14C4 14.55 3.80417 15.0208 3.4125 15.4125C3.02083 15.8042 2.55 16 2 16ZM2 10C1.45 10 0.979167 9.80417 0.5875 9.4125C0.195833 9.02083 0 8.55 0 8C0 7.45 0.195833 6.97917 0.5875 6.5875C0.979167 6.19583 1.45 6 2 6C2.55 6 3.02083 6.19583 3.4125 6.5875C3.80417 6.97917 4 7.45 4 8C4 8.55 3.80417 9.02083 3.4125 9.4125C3.02083 9.80417 2.55 10 2 10ZM2 4C1.45 4 0.979167 3.80417 0.5875 3.4125C0.195833 3.02083 0 2.55 0 2C0 1.45 0.195833 0.979167 0.5875 0.5875C0.979167 0.195833 1.45 0 2 0C2.55 0 3.02083 0.195833 3.4125 0.5875C3.80417 0.979167 4 1.45 4 2C4 2.55 3.80417 3.02083 3.4125 3.4125C3.02083 3.80417 2.55 4 2 4Z' fill='%2398A2B3'/%3E%3C/svg%3E%0A");
}

.btnRound {
    width: 26px;
    height: 26px;
    padding: 5px;
    border: 1px solid rgba(204, 206, 197, 0.3);
    border-radius: 30px;
    text-align: center;
}

/* MARK: ThreeDotsTable */

#secAccessList #rolesTable td:nth-child(2),
#secAccessList #accessListTable td:nth-child(5),
#secAccessList #doorsTable td:nth-child(4),
#secAccessRoles #accessRolesTable td:nth-child(2),
#secAccessRoles #accessRolesDoorsTable td:nth-child(3),
#secReaders #readersTable td:nth-child(4),
#secReaders #readersDoorsTable td:nth-child(2),
#secDoors #doorsTable td:nth-child(4) {
    width: 5%;
}

.svg-icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: middle;
    margin: 0 8px 0px 16px;
}

.svg-icon-edit {
    content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --%3E%3Csvg width='18px' height='18px' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' fill='%23000000'%3E%3Cpath d='M13.23 1h-1.46L3.52 9.25l-.16.22L1 13.59 2.41 15l4.12-2.36.22-.16L15 4.23V2.77L13.23 1zM2.41 13.59l1.51-3 1.45 1.45-2.96 1.55zm3.83-2.06L4.47 9.76l8-8 1.77 1.77-8 8z'/%3E%3C/svg%3E");
    
}

.svg-icon-delete {
    content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --%3E%3Csvg width='18px' height='18px' viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg' fill='%23000000'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 3h3v1h-1v9l-1 1H4l-1-1V4H2V3h3V2a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1v1zM9 2H6v1h3V2zM4 13h7V4H4v9zm2-8H5v7h1V5zm1 0h1v7H7V5zm2 0h1v7H9V5z'/%3E%3C/svg%3E");
}



/* MARK:: Main */
.btn-primary {
    background-color: var(--btnprimaryback);
    border-color: var(--btnprimaryback);
}

.btn-secondary {
    background-color: var(--btnsecondaryback);
    border-color: var(--btnprimaryback);
}

/* MARK:: Header */

.header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header .comp_button {
    margin-top: 44px;
    margin-bottom: 24px;
}

/* MARK:: Doors */

#secDoors .usedCodes {
    max-height: 300px;
    overflow-y: auto;
}

#secDoors #doorsView {
    display: flex;
}

#secDoors #div1col {
    width: 70%;
}

#secDoors #logsTableDiv {
    margin-left: 20px;
    width: 30%;
    max-height: 500px;
    overflow-y: auto;
}

#secDoors .secTitle {
    height: 30px;
}

#secDoors #logsTable th:nth-child(2),
#secDoors #logsTable td:nth-child(2) {
    text-align: left;
    width: 35%;
}

#secDoors #logsTable th:nth-child(1),
#secDoors #logsTable td:nth-child(1) {
    width: 65%;
}

/* #secDoors #logsTable th:nth-child(2) {
    padding-left: 30px;
} */


/* MARK:: Panels */

#secPanels #panelsTable td:nth-child(3) {
    text-align: left;
}

#secPanels #panelsTable th:nth-child(4),
#secPanels #panelsTable td:nth-child(4) {
    text-align: center;
}

#secPanels #panelsTable th:nth-child(4) {
    padding-right: 0px !important;
}

#secPanels .downloadBinBtnDiv {
    margin-top: 20px;
}



#secPanels #logsTable th:nth-child(2),
#secPanels #logsTable td:nth-child(2) {
    text-align: left;
}


/* MARK:AccessList */

#helperText {
    padding: 2px 15px;
    margin: 10px;
    line-height: 10px;
    font-size: small;
    color: rgba(106, 106, 106, 1);
}

#secAccessList #accessListTable th:nth-child(2),
#secAccessList #accessListTable th:nth-child(3),
#secAccessList #accessListTable td:nth-child(2),
#secAccessList #accessListTable td:nth-child(3) {
    text-align: left;
}

#secAccessList #doorsTable th:nth-child(4) {
    text-align: right;
}

#secAccessList #accessListTable th:nth-child(3) {
    width: 20%;
}

#secAccessList #accessListTable th:nth-child(2) {
    width: 20%;
}

#secAccessList #doorsTable th:nth-child(2),
#secAccessList #doorsTable th:nth-child(4),
#secAccessList #doorsTable td:nth-child(2),
#secAccessList #doorsTable td:nth-child(4) {
    text-align: center;
}

#secAccessList #doorsTable th:nth-child(2),
#secAccessList #doorsTable th:nth-child(4) {
    padding-left: 30px;
}


#modalDoors .modal-footer {
    display: none;
}

#modalDoors .comp_header {
    margin-top: 10px;
}

#modalDoors .comp_checkbox {
    display: flex;
}


/* MARK: AccessRoles */

#secAccessRoles #accessRolesDoorsTable th:nth-child(2),
#secAccessRoles #accessRolesDoorsTable td:nth-child(2) {
    text-align: center;
}

#secAccessRoles #accessRolesDoorsTable th:nth-child(2) {
    padding-left: 30px;
}