/* :root{
    --coffee-dark: #461c10;
    --coffee-edit: #B0876B;
} */

.breadcrumb_home {
    color: #D0B29D;
}

.profile_picture {
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.38) !important;
    border-radius: 16px !important;
    /* width: 443px; */
    height: 322px;
    aspect-ratio: 16/9;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #636363;
    cursor: pointer;
    font-family: sans-serif;
    transition: color 300ms ease-in-out, background 300ms ease-in-out;
    outline: none;
    overflow: hidden;
    background: #f1f1f1;
    width: 100%;
    height: 269px;
}

.profile {
    font-weight: bold;
    font-size: 1rem;
    overflow-wrap: break-word;
}

#picture__input {
    display: none;
}

.picture {
    /* width: 400px; */
    aspect-ratio: 16/9;
    background: #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #aaa;
    border: 2px dashed currentcolor;
    cursor: pointer;
    font-family: sans-serif;
    transition: color 300ms ease-in-out, background 300ms ease-in-out;
    outline: none;
    overflow: hidden;
    border-radius: 16px;
    background: #f1f1f1;
    border: 1px dashed var(--coffee-dark);
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.38);
    border-radius: 16px;
    color: #636363;
    width: 100%;
    height: 269px;
}

.picture:hover,
.profile_picture:hover {
    color: #777;
    color: #636363;
    background: #ccc;
}

.picture:active {
    border-color: turquoise;
    color: turquoise;
    background: #eee;
}

.picture:focus,
.profile_picture:focus {
    color: #777;
    background: #ccc;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

/* .picture__image {
    width: 100%;
} */

.picture__img {
    max-width: 100%;
    height: 269px;
}

.picture span {
    text-align: center;
}

.capital {
    text-transform: capitalize;
}

.edit_profile {
    column-gap: 10.5vw;
}

.model-close {
    width: 2rem !important;
}

.close {
    opacity: 1;
}

/* .switch.s-coffee-medium-light input:checked + .slider:before{
    background-color: var(--coffee-dark);
} */

.border-remove-model {
    border: 0 !important;
}

.svg-cafe-hours {
    width: 1.2rem;
}

.btn-coffee-edit {
    color: var(--coffee-light) !important;
    background: var(--coffee-edit) !important;
    border: 1px solid var(--coffee-edit) !important;
    box-shadow: 0px 8px 13px rgb(70 28 16 / 20%) !important;
    border-radius: 4px !important;
    text-transform: capitalize !important;
    font-weight: bold !important;
}

.dt-btn {
    padding: 0.4375rem 0.8rem !important;
}

.swal2-popup .swal2-styled.swal2-cancel {
    color: var(--coffee-dark) !important;
    font-size: 14px !important;
    border: 1px solid var(--coffee-dark) !important;
    box-shadow: 0px 8px 13px rgb(70 28 16 / 20%) !important;
    border-radius: 4px !important;
}

.swal2-popup .swal2-styled.swal2-confirm {
    color: var(--coffee-light) !important;
    background: var(--coffee-dark) !important;
    border: 1px solid #4C2F27 !important;
    box-shadow: 0px 8px 13px rgb(70 28 16 / 20%) !important;
    border-radius: 4px !important;
}

.mb-0.d-flex.collapsed .icons {
    transform: rotate(180deg) !important;
}

.faq .card,
.faq .card-header,
.faq .collapse {
    border-radius: 4px !important;
}

.faq .card {
    margin-bottom: 1rem !important;
}

.faq .card-header {
    border: 1px solid var(--coffee-dark) !important;
    background: #fff !important;
}

/* .fq-tab-section.collapse {
    background: rgba(106, 68, 46, 0.11);
} */


/* #content.main-content{padding-bottom: 30px;} */
/* .footer-wrapper{position: absolute;
    bottom: 0;background-color: #fafafa !important;} */

.layout-top-spacing {
    min-height: calc(100vh - 280px) !important;
}

.faq-layouting {
    padding-left: 73px !important;
    padding-right: 73px !important;
}

.fq-tab-section {
    background: #F5F3F0 !important;
    padding-top: 40px !important;
    padding-bottom: 40px !important;
    padding-left: 72px !important;
    padding-right: 72px !important;
}

.accordion>.card>.card-header {
    margin-bottom: 0 !important;
}

.fq-tab-section .card-body {
    background: rgba(106, 68, 46, 0.11) !important;
}

.faq .faq-layouting .fq-tab-section .accordion .card .card-header div[aria-expanded="true"] .faq-q-title,
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div .faq-q-title,
.faq .faq-layouting .fq-tab-section .accordion .card .card-header div .icons svg,
.faq .faq-layouting .fq-tab-section .accordion .card .card-body p {
    color: var(--coffee-dark) !important;
}

.faq .faq-layouting .fq-tab-section .accordion .card .card-body p {
    font-weight: 600 !important;
}

.faq .faq-layouting .fq-tab-section {
    border: 0 !important;
    box-shadow: 0 0 0 0 !important;
}

@media (min-width: 1200px) {
    .topbar-nav.header nav#topbar ul.menu-categories li.menu a>div svg:not(.feather-chevron-down) {
        width: 26px !important;
        height: 26px !important;
        stroke-width: 1px !important;
    }
}

div.dataTables_wrapper div.dataTables_info {
    color: var(--coffee-medium) !important;
}

.success-btn {
    background: #1C8213 !important;
    color: var(--white) !important;
    border-radius: 8px;
}

.coffee-dark-btn {
    background: var(--coffee-dark) !important;
    color: var(--white) !important;
    border-radius: 8px;
}

.danger-btn {
    background: #FE5656 !important;
    color: var(--white) !important;
    border-radius: 8px;
}


.topbar-nav.header nav#topbar ul.menu-categories li.menu>a:hover svg:not(.feather-chevron-down),
.topbar-nav.header nav#topbar ul.menu-categories li.menu>a:hover div span {
    color: var(--coffee-dark) !important;
}

::selection {
    /* color: var(--coffee-dark) !important; */
    color: var(--coffee-light) !important;
    background: var(--coffee-dark) !important;
}

.navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .dropdown-item:hover a {
    color: var(--coffee-dark) !important;
}

.show-password {
    right: 10px !important;
    left: auto !important;
    border-right: 0 !important;
    cursor: pointer;
}

#growls-default {
    top: 75px !important;
    right: 10px !important;
}

.page-link:hover {
    color: var(--coffee-dark) !important;
}

.modal-backdrop {
    background-color: var(--coffee-medium) !important;
}

.topbar-nav.header nav#topbar ul.menu-categories li.menu>a:hover {
    background: #d0b29d6b;
    border-radius: 6px;
}

.select2-container--default {
    .select2-selection--single {
        /* border-color: #fff; */
        height: 60px;
        padding: 7.5px 0;
        border-radius: 0;

        .select2-selection__arrow {
            height: 58px;
        }
    }
}

.select2-dropdown {
    border-radius: 0;
    box-shadow: #444 0px 3px 5px;
    border: 0;
}

img.img-flag {
    height: 1.5rem;
}

.select2-container--default .select2-selection--multiple {
    background: var(--coffee-light) !important;
    padding: 5px 16px !important;
    border: 1px solid var(--coffee-dark) !important;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    border: 1px solid var(--coffee-dark) !important;
    background: var(--coffee-light) !important;
}

.page-item.active .page-link:hover {
    color: var(--coffee-light) !important;
}

.spinner-grow {
    color: var(--coffee-dark);
}

span.select2.select2-container.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--multiple {
    border: 0 !important;
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #d0b29d6b !important;
    color: var(--coffee-dark) !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    color: var(--coffee-dark) !important;
}

.form-form .form-form-wrap form .field-wrapper input:focus {
    border-bottom: 1px solid #C0987C !important;
}

.bg-coffee-dark {
    background: var(--coffee-dark) !important;
}

.bg-coffee-medium {
    background: var(--coffee-medium) !important;
}

.bg-coffee-light {
    background: var(--coffee-light) !important;
}

.repeat {
    padding: 10px 12px !important;
    margin-top: 30px !important;
}

.status-btn {
    cursor: text !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    border-radius: 0.25rem !important;
    border: 0px !important;
    padding: 0.6rem 0.8rem !important;
}

.modal-content .modal-footer a.btn {
    padding: 10px 25px;
    letter-spacing: 1px;
}

.custom-control-input:checked~.custom-control-label::before {
    color: #fff;
    border-color: var(--coffee-dark) !important;
    background-color: var(--coffee-dark) !important;
}

.modalDilogFilter {
    margin: 115px 195px 0 auto !important;
}

.custom-control-input:focus~.custom-control-label::before {
    box-shadow: none !important;
}

.custom-control-input:focus:not(:checked)~.custom-control-label::before {
    border-color: var(--coffee-dark) !important;
}

.select2-container--default .select2-results__group {
    color: var(--coffee-light) !important;
    background: var(--coffee-dark) !important;
}

input[disabled],
select[disabled],
textarea[disabled],
input[readonly],
select[readonly],
textarea[readonly] {
    color: var(--coffee-dark) !important;
}

.flatpickr-day.today {
    border-color: var(--coffee-dark) !important;
    color: var(--coffee-dark) !important;
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
    background: var(--coffee-dark) !important;
    border-color: var(--coffee-dark) !important;
    color: var(--coffee-light) !important;
}

.select2-container .select2-search--inline {
    width: 100% !important;
}

.footer-section {
    position: relative !important;
    bottom: 0 !important;
    margin: 0 auto !important;
}
