/* Custom styles goes here */

:root {
    --bs-btn-font-size: 0.80rem !important;
    --bs-card-spacer-y: 1rem !important;
    --bs-card-spacer-x: 1rem !important;
    --bs-heading-color: #444050;
}

/* Prevent a transient horizontal scrollbar when a Select2 dropdown opens */
html, body {
    overflow-x: hidden;
}

h6, .h6 {
    line-height: unset !important;
}


.nav .nav-item {
    padding-right: 5px !important;
}

.bg-label-danger {
    text-transform: uppercase !important;
    font-size: 12px !important;
}

.tagify__tag > div::before {
    box-shadow: 0 0 0 var(--tag-inset-shadow-size) rgba(207, 207, 207, 1) inset !important;
}


.card-body {
    /*padding: var(--bs-card-spacer-y) var(--bs-card-spacer-x);*/
    padding: 1rem 1rem;
}

.btn {
    text-transform: uppercase !important;
}

.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__rendered {
    color: var(--bs-heading-color) !important;
}

.bg-label-primary {
    text-transform: uppercase !important;
    font-size: 12px;
}

.bg-label-secondary {
    text-transform: uppercase !important;
    font-size: 12px;
}

.form-select:disabled {
    color: var(--bs-heading-color) !important;
}

.toast-header {
    --fs-toast-color: #ffffff;
    /*  background-color: var(--bs-primary) !important;*/
    color: var(--fs-toast-color) !important;
}

.nav-align-top .tab-content {
    border: 1px solid var(--bs-primary) !important;
}


.nav-pills .nav-link {
    border: 1px solid var(--bs-primary) !important;
    text-transform: uppercase !important;
    /*font-size: 0.85rem !important;*/
    font-size: var(--bs-btn-font-size) !important;
}


.iti, .iti input, .iti__country-list, .iti__country {
    font-family: var(--bs-font-sans-serif) !important;
    width: 100% !important;
    font-size: 0.9375rem !important;
}

.iti__selected-country {
    font-size: 0.9375rem !important;
}

.iti__selected-dial-code {
    color: var(--bs-heading-color) !important;
}


.row {
    --bs-gutter-y: 0.75rem;
}

.form-label {
    text-transform: uppercase !important;
    font-size: 0.7125rem;
}
/* Remove extra spacing inside datatable wrapper */
.dt-container {
    padding-bottom: 0 !important;
}
    /* Remove bottom margin of table row */
    .dt-container .dt-layout-table {
        margin-bottom: 0 !important;
    }
    /* Reduce spacing of all rows inside datatable */
    .dt-container .row {
        margin-top: 4px !important;
        margin-bottom: 0 !important;
    }
/* Remove padding under table */
.card-datatable.table-responsive {
    padding-bottom: 0 !important;
}
/* Reduce info text spacing */
.dt-container .dt-info {
    padding-top: 2px !important;
    padding-bottom: 0 !important;
}
/* Remove pagination margin */
.dt-container .dt-paging {
    margin-top: 2px !important;
    margin-bottom: 0 !important;
}
/* Compact pagination buttons */
.dt-container .pagination .page-link {
    padding: 3px 8px !important;
}
/* Remove bottom margin of pagination */
.dt-container .pagination {
    margin-bottom: 0 !important;
}

.dt-container .dt-length,
.dt-container .dt-search {
    margin-bottom: 2px !important;
}

.dt-container .dt-layout-full {
    padding-bottom: 0 !important;
}
/*
.custom-table.table-bordered > :not(caption) > * > * {
    border-width: 1px !important;
}


.custom-table th,
.custom-table td {
    padding: 6px 10px !important;
    vertical-align: middle;
}


.custom-table {
    border: 1px solid #e4e6ef;
    border-radius: 6px;
    overflow: hidden;
}



    */
.custom-table th,
.custom-table td {
    padding: 6px 10px !important;
    vertical-align: middle;
}

.custom-table.table-bordered > :not(caption) > * > * {
    border-width: 1px !important;
}

div.dt-container div.dt-length, div.dt-container div.dt-search {
    margin-block: 0.5rem !important;
}


table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control::before,
table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control::before {
    border: none !important;
    content: "+" !important;
    font-size: 18px;
    font-weight: bold;
    color: var(--bs-body-color);
}
/* Show minus when expanded */
table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td.dtr-control::before,
table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th.dtr-control::before {
    content: "-" !important;
}


.row {
    --bs-gutter-y: 0.25rem !important;
}


.tagify[readonly]:not(.tagify--mix):not(.tagify--select) .tagify__tag > div::before, .tagify[disabled]:not(.tagify--mix):not(.tagify--select) .tagify__tag > div::before {
    animation: none !important;
}

.tagify[readonly]:not(.tagify--mix) .tagify__tag > div::before {
    background-color: #cdcdcd !important;
}


/*.tagify__tag > div {
    border: 1px solid #cccbcd !important;
}*/

.tagify__tag__removeBtn {
    margin-left: 5px !important;
    margin-right: 5px !important;
}

.tab-content {
    padding: 1rem !important;
}

.custom-table {
    border: 1px solid #949494;
    border-radius: 6px;
    overflow: hidden;
}

.table.table-light, .table .table-light {
    border: 1px solid #949494;
}

.table:not(.table-borderless):not(.dataTable) thead th {
    border: 1px solid #949494;
}

.custom-table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order::before,
.custom-table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order::before,
.custom-table.dataTable thead > tr > td.dt-orderable-asc span.dt-column-order::before,
.custom-table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order::before {
    bottom: 40%;
}


.custom-table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order::after,
.custom-table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order::after,
.custom-table.dataTable thead > tr > td.dt-orderable-asc span.dt-column-order::after,
.custom-table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order::after {
    top: 40%;
}




table.dataTable thead .dt-column-order::before,
table.dataTable thead .dt-column-order::after {
    visibility: visible !important;
}


table.dataTable thead th {
    padding-right: 28px !important;
}

table.dataTable thead .dt-column-order {
    right: 8px !important;
}

table.dataTable th,
table.dataTable td {
    white-space: nowrap;
}

.form-control:read-only {
    background-color: #f6f6f6 !important;
}


[data-bs-theme="dark"] .form-control:read-only {
    background-color: #525567 !important;
}
/*.card-datatable.table-responsive {
    padding-bottom: 20px;
}*/

.no-resize {
    resize: none;
}


.status-badge {
    --bs-badge-font-size: 0.7667em;
    --bs-badge-border-radius: 0rem;
    display: inline-block;
    width: 80px;
    text-align: center;
    text-transform: uppercase !important;
}

.modal-header {
    background-color: #eeeeef !important;
    padding-bottom: 15px !important;
}


.sub-heading {
    color: var(--bs-primary) !important;
    font-size: 0.7375rem;
}

.flatpickr-calendar .flatpickr-current-month .numInputWrapper {
    inline-size: 8ch !important;
}

/* date picker validation border */
input.flatpickr-input.is-invalid,
input.is-invalid.form-control,
.form-control-validation input.is-invalid {
    border-color: var(--bs-form-validation-border-color) !important;
}

    input.flatpickr-input.is-invalid:focus,
    input.is-invalid.form-control:focus,
    .form-control-validation input.is-invalid:focus {
        border-color: var(--bs-form-validation-border-color) !important;
        box-shadow: var(--bs-form-validation-shadow) !important;
        border-width: 2px !important;
    }


/* base / inactive — gray */
.menu-toggle::after {
    mask-image: none !important;
    -webkit-mask-image: none !important;
    background-color: transparent !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23697a8d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6l-6 6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

/* active menu item — white, to match the active label text */
.menu.menu-horizontal .menu-inner > .menu-item.active > .menu-link.menu-toggle::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6l-6 6'/%3E%3C/svg%3E");
}





/* Photo Zoom Effect */
.photo-thumb-wrap {
    position: relative;
    width: 140px;
    height: 140px;
    border-radius: .5rem;
    overflow: hidden;
    border: 1px solid var(--bs-border-color, #dee2e6);
}

.photo-thumb-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    cursor: zoom-in;
}

.photo-zoom-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: none;
    background: rgba(0, 0, 0, .5);
    color: #fff;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .photo-zoom-nav:hover {
        background: rgba(0, 0, 0, .75);
        color: #fff;
    }

.photo-zoom-prev {
    left: 12px;
}

.photo-zoom-next {
    right: 12px;
}

.photo-thumb-remove {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: none;
    background: rgba(0, 0, 0, .6);
    color: #fff;
    line-height: 1;
    font-size: 14px;
}

    .photo-thumb-remove:hover {
        background: rgba(220, 53, 69, .9);
    }

.photo-drop-zone {
    border: 2px dashed var(--bs-border-color, #ced4da);
    border-radius: .5rem;
    padding: 2rem;
    text-align: center;
    cursor: pointer;
}

    .photo-drop-zone.dragover {
        border-color: var(--bs-primary, #696cff);
        background-color: rgba(105, 108, 255, .05);
    }

