*,*:focus,*:hover{
    outline:none;
}

.customer_page {
    color: var(--bs-gray-dark);
}

.customer_page .customer_name {
    margin-bottom: 0;
}

.customer_page .company_name {
    display: flex; align-items: center;
}

.customer_page .company_name small {
    margin-left: 12px; align-self: center;
}

.customer_page .company_name img {
    width: 16px; object-fit: contain; display: block; margin-right: 4px;
}

.customer_page p {
    margin: 0 0 4px 0; font-size: 15px;
}

.customer_page .circle_initials {
    height: 80px; width: 80px; border-radius: 50%; background: var(--bs-gray-200); font-size: 32px; border: solid 2px var(--bs-gray-600); display: flex; justify-content: center; 
    align-items: center;
}

.customer_page .customer_info {
    margin-bottom: 12px;
}

.customer_page .customer_info p {
    margin-bottom: 0;
}

.customer_page .quick_buttons {
    display: flex; margin-top: 20px; justify-content: space-evenly;
}

.customer_page .quick_buttons .button {
    text-align: center; font-size: 14px;width: 75px;
}

.customer_page .quick_buttons .button a {
    text-decoration: none; color: var(--bs-gray-dark);
}

.customer_page .quick_buttons .button .icon {
    background: var(--bs-gray-200); height: 50px; width: 50px; border-radius: 50%; margin: 0 auto 4px auto; border: solid 2px var(--bs-gray-600); transition: 0.3s; display: flex;
    justify-content: center; align-items: center; font-size: 18px; position: relative;
}

.customer_page .quick_buttons .button .icon:hover {
    background: var(--bs-gray-400); transition: 0.3s; cursor: pointer;
}

.customer_page .quick_buttons .button .task_count, .customer_page .quick_buttons .button .reminder_count {
    border-radius: 50%; height: 20px; width: 20px; display: block; position: absolute; bottom: -6px; right: -6px; background: var(--bs-primary); text-align: center; line-height: 20px; 
    font-size: 12px; color: #fff;
}

.customer_page .vat {
    display: flex; align-items: center;
}

.customer_page .vat img {
    display: block; margin: 0 4px;
}

.activity_list .card-body i {
    margin-right: 12px;
}

.activity_list .card-body svg {
    margin-right: 12px;
}

.activity_list .card-body p {
    margin: 0;
}

.activity_list .card-body hr {
    margin: 8px 0;
}

.activity_list .card-body p.datetime {
    float: right;
}

#customer_note textarea {
    width: 100%; font-size: 14px; height: 100px; outline: none; border: solid 1px #dee2e6;
}

.customers_add .iti {
    display: block;
}

.customers_add .iti input {
    padding-left: 52px !important;
}

.show_more {
    color: #3b7ddd; transition: 0.3s; display: block; margin-top: 4px;
}

.show_more:hover {
    color: #2f64b1; transition: 0.3s; cursor: pointer;
}

.more_text {
    display: none;
}

.fc_selected_date {
    background: #ced4da !important;
}

#tableReminderTransfer_wrapper {
    height: calc(100vh - 300px); overflow-y: auto; overflow-x: hidden;
}

.reminders_color_legend, .calls_history_color_legend, .forms_history_color_legend {
    display: flex; flex-wrap: wrap;
}

.reminders_color_legend .rcl_container, .calls_history_color_legend .rcl_container, .forms_history_color_legend .rcl_container {
    display: flex; margin: 4px 12px 0px 4px; align-items: center; font-size: 14px;
}

.reminders_color_legend .rcl_container .box, .calls_history_color_legend .rcl_container .box, .forms_history_color_legend .rcl_container .box {
    height: 16px; width: 16px; margin-right: 4px;
}

#reminders .fc-event-title-container, #calls_history .fc-h-event .fc-event-title-container, #forms_history .fc-h-event .fc-event-title-container {
    text-align: center;
}

#transfer_list th:first-child {
    width: 90px;
}

#transfer_list th:first-child .form-check {
    margin-bottom: 0;
}

#transfer_list th:first-child label {
    color: #495057;
}

#reminders, #calls_history, #forms_history {
    font-size: 75%;
}

#tableCalls_wrapper .select2-container--default .select2-selection--single .select2-selection__rendered,
#tableForms_wrapper .select2-container--default .select2-selection--single .select2-selection__rendered {
    font-weight: 400;
}

.callcenter .buttons {
    position: fixed; right: 3px; bottom: 20px;
}

.callcenter .buttons .button {
    background: var(--bs-primary); color: #fff; border-radius: 20px; height: 2.5rem; width: 2.5rem; display: flex; justify-content: end; align-items: center; margin-top: 8px;
    transition: 0.3s; margin-left: auto;
}

.callcenter .buttons .button i {
    padding-right: 12px;
}

.callcenter .buttons .button .title {
    width: 0; overflow: hidden; font-size: 14px; white-space: nowrap;
}

.callcenter .buttons .button:hover {
    transition: 0.3s; cursor: pointer; width: auto;
}

.callcenter .buttons .button:hover:nth-child(1) {
    width: 144px;
}

.callcenter .buttons .button:hover:nth-child(2) {
    width: 130px;
}

.callcenter .buttons .button:hover:nth-child(3) {
    width: 156px;
}

.callcenter .buttons .button:hover:nth-child(4) {
    width: 130px;
}

.callcenter .buttons .button:hover:nth-child(5) {
    width: 180px;
}

.callcenter .buttons .button:hover .title {
    width: auto; padding: 0 20px; text-align: right;
}

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

.call_history_container svg {
    margin-right: 12px;
}

.color_list {
    display: flex;
}

.color_list .color_box:last-child {
    margin-right: 0;
}

.color_box:hover {
    transition: 0.3s; cursor: pointer; border-radius: 50%;
}

.color_box {
    width: 40px; height: 40px; margin-right: 8px; color: #fff; font-size: 20px; text-align: center; justify-content: center; align-items: center; display: flex; transition: 0.3s;
}

.color_list .on {
    border-radius: 50%;
}

.campaign_badge {
    color: #fff; display: inline-block; border-radius: 4px; padding: 2px 8px; font-size: 12px;
}

.campaign_0_bg {
    background: #222 !important; border: none !important;
}

.campaign_1_bg {
    background: #800000 !important; border: none !important;
}

.campaign_2_bg {
    background: #9a6324 !important; border: none !important;
}

.campaign_3_bg {
    background: #808000 !important; border: none !important;
}

.campaign_4_bg {
    background: #469990 !important; border: none !important;
}

.campaign_5_bg {
    background: #000075 !important; border: none !important;
}

.campaign_6_bg {
    background: #f44336 !important; border: none !important;
}

.campaign_7_bg {
    background: #ffa000 !important; border: none !important;
}

.campaign_8_bg {
    background: #cddc39 !important; border: none !important;
}

.campaign_9_bg {
    background: #3cb44b !important; border: none !important;
}

.campaign_10_bg {
    background: #42d4f4 !important; border: none !important;
}

.campaign_11_bg {
    background: #4363d8 !important; border: none !important;
}

.campaign_12_bg {
    background: #911eb4 !important; border: none !important;
}

.campaign_13_bg {
    background: #f032e6 !important; border: none !important;
}

.campaign_14_bg {
    background: #a9a9a9 !important; border: none !important;
}

.campaign_15_bg {
    background: #e91e63 !important; border: none !important;
}

.campaign_16_bg {
    background: #fd99bd !important; border: none !important;
}

.campaign_17_bg {
    background: #795548 !important; border: none !important;
}

.campaign_18_bg {
    background: #607d8b !important; border: none !important;
}

.campaign_19_bg {
    background: #616161 !important; border: none !important;
}

.campaign_20_bg {
    background: #c899ff !important; border: none !important;
}


.sold_bg{
    background: var(--bs-success) !important; border: none !important;
}

.callbk_bg{
    background: var(--bs-warning) !important; border: none !important;
}

.dnd_bg{
    background: var(--bs-danger) !important; border: none !important;
}

.home_container {
    margin: calc(-3rem - 24px) -3rem 1rem -3rem; width: calc(100% + 6rem);
}

.home_container .home_table {
    display: flex;
}

.home_container .home_table .home_chart {
    width: 20%; position: relative;
}

.home_container .home_table > div:first-child {
    border-right: solid 1px var(--bs-gray-400); margin: -1.25rem 0;
}

.home_container .home_table .sla, .home_container .home_table .online_users {
    position: absolute; z-index: 0; display: flex; flex-direction: column; left: 50%; top: 50%; transform: translate(-50%, -50%);
}

.home_container .home_table .sla div:nth-child(1), .home_container .home_table .online_users div:nth-child(1) {
    font-size: 40px; font-weight: 300; color: var(--bs-gray-700); text-align: center; line-height: 40px;
}

.home_container .home_table .sla div:nth-child(2), .home_container .home_table .online_users div:nth-child(2) {
    font-size: 12px; font-weight: 700; color: var(--bs-gray-700); text-transform: uppercase; text-align: center;
}

.home_container .home_table .sla div:nth-child(3), .home_container .home_table .online_users div:nth-child(3) {
    font-size: 11px; font-weight: 700; color: var(--bs-gray-600); text-transform: uppercase; text-align: center; 
}

.home_container .home_table .sla .sla_percent .percent {
    font-size: 24px;
}

.home_container .home_table > div:last-child {
    border-left: solid 1px var(--bs-gray-400); margin: -1.25rem 0; 
}

#chart_online {
    display: flex; justify-content: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
}

.home_container .home_table .home_data {
    width: 15%; text-align: center; position: relative; align-self: center;
}

.home_container .home_table .home_data:before {
    content: " "; width: 1px; height: 50px; background: var(--bs-gray-400); position: absolute; left: 0; transform: translateY(-50%); top: 50%;
}

.home_container .home_table > div:nth-of-type(2):before {
    height: 0;
}

.home_container .home_table .home_data div:nth-child(1) {
    font-size: 50px; font-weight: 300; color: var(--bs-gray-700);
}

.home_container .home_table .home_data div:nth-child(2) {
    font-size: 12px; font-weight: 700; color: var(--bs-gray-700); text-transform: uppercase;
}

.home_container .home_table .home_data div:nth-child(3) {
    font-size: 11px; font-weight: 700; color: var(--bs-gray-600); text-transform: uppercase;
}

.calendar_card {
    position: relative; width: 100%; transition: 0.3s;
}

table th select {
    padding: 4px 0 4px 8px !important; margin-top: 4px; outline: none;
}

table th select:focus {
    border-color: #ced4da !important; box-shadow: none !important;
}

table th .select2-container {
    margin-top: 4px;
}

table th .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 4px !important;
}

table th .select2-container--default .select2-selection--single {
    height: 29.2px;
}

.statistics_filter {
    display: flex; margin-bottom: 24px; padding: 0;
}

.statistics_filter input {
    border: solid 1px #ced4da; height: 43px;
}

.filter_activity_type {
    margin-right: -24px;
}

@media only screen and (max-width: 770px) {
    .calendar_card {
        position: relative; width: 100%; top: 0 !important;
    }

    
}

@media only screen and (max-width: 1500px) {
    .customer_page .circle_initials_container{
        display:none;
    }

    .customer_page .quick_buttons {
        flex-wrap: wrap;
    }

    .customer_page .quick_buttons .button{
        margin-bottom: 10px;
    }
}