html,
body {
    margin: 0;
    padding: 0;
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
    font-size: 14px;
}

.fc-no-overlap .fc-body .fc-resource-area .fc-cell-content {
    padding-top: 6px;
    padding-bottom: 6px;
    height: 70%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.fc-fri,
.fc-sat,
.fc-sun {
    background-color: #f5f5f5;
}

.fc-today {
    background-color: #ff000054;
}

.fc-timeline td,
.fc-timeline th {
    overflow: hidden;
    ;
}

.fc-widget-header {
    text-transform: uppercase;
}

header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px;
}

.logo {
    max-width: 52px;
    border-radius: 4px;
}

#calendar {
    max-width: 100%;
    padding: 0 15px 0 15px;

}

.btn_primary {
    background-color: #2C3E50;
    border-radius: 4px;
    padding: 8px 20px;
    color: #fff;
    cursor: pointer;
    border: 2px solid #22303d;
}

.btn_primary:hover {
    background-color: #22303d;
}

.btn_secondary {
    background-color: transparent;
    border: 2px solid #22303d;
    border-radius: 4px;
    padding: 9px 20px;
    color: #22303d;
    cursor: pointer;

}

.btn_secondary:hover {
    background-color: #22303d;
    color: #fff !important;
}

.btn_group {
    margin: 20px 0 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.btn_group a {
    width: 100%;
    text-align: center;
}

.user_account {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-right: 20px;
}

.color_info {
    padding: 8px 12px;
}

.user_photo {
    width: 40px;
    height: 40px;
    border-radius: 100%;
    margin-right: 10px;
}

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

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.status_info {
    position: absolute;
    top: 52px;
    left: 50%;
    transform: translate(-50%, -50%);
}

.status_info select {
    height: 32px;
    border: 2px solid #22303d;
    border-radius: 4px;
    width: 100%;
    padding-left: 20px;
}

.container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    background-color: #f0f0f0;
    z-index: 100000;
    position: relative;
    flex-direction: column;
    gap: 15px;
}

.fc-license-message {
    display: none;

}

#filters {
    position: fixed;
    top: 77px;
    right: 0;
    z-index: 99999;
    margin: 0 15px;
    text-align: end;
}

#filters select {
    border-color: #2C3E50;
    border-radius: 4px;
    border: 2px solid;
    padding: 8px;
}

#filters select>option {
    padding: 8px;
}

#filters select>option:hover {
    color: #fff;
    background-color: #2C3E50;
}

#auth {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.input_group {
    margin-bottom: 15px;
}

.input_group label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}

.input_group input {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 16px;
}

.input_group input:focus {
    border-color: #007BFF;
    outline: none;
}



.alert-danger {
    color: #842029;
    background-color: #f8d7da;
    border-color: #f5c2c7;
}

.alert-success {
    color: #0f5132;
    background-color: #d1e7dd;
    border-color: #badbcc;
}

.alert {
    position: absolute;
    padding: 1rem 1rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    top: 20px;
}

#entrance:disabled {
    background-color: grey;
    cursor: not-allowed;
}


#confirm {
    background-color: #337ab7;
    width: 100px;
    height: 40px;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    border: 1px solid #2e6da4;
    border-radius: 5px;
}

#confirm:hover,
#confirm:active {
    background-color: #2e6da4;
}

.modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 99999;
}

.content {
    position: relative;
    border-radius: 10px;
    margin: auto;
    width: 590px;
    background-color: #fff;
    animation-name: animatetop;
    animation-duration: 0.4s;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5);
    margin-top: 15%;
}

.content h3 {
    margin: 0 0 10px 0;
    font-size: 24px;
}

.content p {
    font-size: 16px;
}

.body {
    padding: 40px;
}

#close {
    float: right;
    font-weight: bold;
    color: #333;
}

#close:hover {
    cursor: pointer;
}

@keyframes animatetop {
    from {
        top: -100px;
        opacity: 0
    }

    to {
        top: 0;
        opacity: 1
    }
}

#infoList {
    display: none;
    position: absolute;
    background: #fff;
    padding: 10px;
    border: 2px solid #22303d;
    border-radius: 10px 0 10px 10px;
    list-style-type: none;
}

#infoList li {
    margin: 13px 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

#infoList li:first-child {
    margin-top: 0;
}

#infoList li:last-child {
    margin-bottom: 0;
}

.color_red {
    width: 20px;
    height: 20px;
    background-color: #ec5353;
    margin-right: 5px;
    border-radius: 50%;
}

.color_black {
    width: 20px;
    height: 20px;
    background-color: #1c1c1c;
    margin-right: 5px;
    border-radius: 50%;
}

.color_green {
    width: 20px;
    height: 20px;
    background-color: #005536;
    margin-right: 5px;
    border-radius: 50%;
}

.color_yellow {
    width: 20px;
    height: 20px;
    background-color: #ffff00;
    margin-right: 5px;
    border-radius: 50%;
}

.color_orange {
    width: 20px;
    height: 20px;
    background-color: #ffa500;
    margin-right: 5px;
    border-radius: 50%;
}

.color_blue {
    width: 20px;
    height: 20px;
    background-color: #0000ff;
    margin-right: 5px;
    border-radius: 50%;
}

.color_purple {
    width: 20px;
    height: 20px;
    background-color: #800080;
    margin-right: 5px;
    border-radius: 50%;
}

.fc-timeline-event {
    bottom: -1px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: flex-start;

    overflow: hidden;
    padding: 5px !important;
}

.fc-timeline-event div {
    text-align: center;
    width: -webkit-fill-available;
    overflow: hidden;

}

.fc-time {
    display: none;
}

.fc-title {
    font-weight: 600;
}

.fc-resource-cell.categories {
    background-color: #ccc;
    /* Цвет фона для ресурсов */
}

.plus-sign {
    display: none;
    position: absolute;
    font-size: 20px;
    color: red;
}

.fc-widget-content {
    position: relative;
}












.modals {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 99999;
    opacity: 0;
    transition: opacity 400ms ease-in;
    pointer-events: none;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-wrap: wrap;
    height: 100%;
    padding-top: 80px;
}

.fc-event-resizable {
    cursor: ew-resize;
    /* Устанавливает курсор для изменения размера */
}

.content-modal {
    display: flex;
    justify-content: flex-start;
    background: white;
    padding: 80px 40px 110px 40px;
    width: 1200px;
    height: fit-content;
    position: relative;
}

.modals.active {
    opacity: 1;
    pointer-events: auto;
    overflow-y: scroll;
}




.bold {
    font-weight: 600;
}

.fc-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.fc-toolbar {
    position: relative;
}


thead th {
    height: 50px;
}

header {
    position: sticky;
    top: 0;
    z-index: 9999;
    background-color: white;
    /* Цвет фона заголовка, чтобы он не сливался с контентом */
}

.fc-toolbar.fc-header-toolbar {
    margin: 0;
    padding: 0px 0px 20px 0;
    border-bottom: 1px solid #ddd;


}

.fc-timeline-event {
    height: 10px;
}

.form {
    width: 48%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

#buyBtn {
    display: flex;
    align-items: center;
    justify-content: center;
}

#bookingForm {
    width: 48%;
}

.form_line {
    width: 4%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.flex_none {
    display: block !important;
}

.line {
    height: 100%;
    width: 1px;
    background-color: #ddd;

}

.blocks {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.incremental-input {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-direction: row;
    flex-wrap: nowrap;
    width: 50%;
    position: relative;
}

#openModal .form input {
    height: 52px;
}

.form input {
    width: -webkit-fill-available;
    height: 62px;
    padding-left: 20px;
    border: none;
    border-radius: 4px;
    border: 2px solid #2C3E50;
}

.date_picker::after {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    background-image: url(/img/schedule.png);
    background-size: 20px 20px;
    position: absolute;
    right: 20px;
    bottom: 20px;
}

#openModal .incremental-input .input_style {
    min-width: 150px;
    padding-left: 0;
    text-align: left;
    padding-left: 20px;
}

.count_btn {
    flex-direction: column;
    margin: 0 8px;
    position: absolute;
    right: 0;
}


.count_btn span:last-child {
    border-top: 1px solid #ddd;
}

.content-modal h3 {
    font-size: 24px;
    margin-bottom: 10px;
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
    position: absolute;
    top: 40px;
    left: 40px;
}

.content-modal p {
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 10px;
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
}

.date_picker {
    width: 80%;
    position: relative;
}

.date_picker::after {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    background-image: url(/img/schedule.png);
    background-size: 20px 20px;
    position: absolute;
    right: 20px;
    bottom: 16px;
}

.close {
    position: absolute;
    top: 40px;
    right: 40px;
    text-decoration: none;
    z-index: 9999;
}


.dropdown {
    position: relative;
    display: inline-block;
    width: 100%;
}

.dropdown::after {
    content: '';
    position: absolute;
    top: 18px;
    right: 8px;
    width: 13px;
    height: 13px;
    background-image: url(img/down.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.dropdown-input {
    padding: 10px 30px 10px 0;
    width: 100% !important;
    border: 1px solid #ccc;
    cursor: pointer;
}

.dropdown-menu {
    display: none;
    position: absolute;
    background-color: white;
    width: 100%;
    height: 185px;
    overflow-y: scroll;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 9999;
    padding: 10px;
    border: 1px solid #ddd;
}

.dropdown-menu .form-check {
    margin: 5px 0;

    display: flex;
    align-items: center;
    justify-content: flex-start;
    border-bottom: 1px solid #ddd;
}

.dropdown-menu .form-check input {
    margin-right: 10px;
    height: 16px !important;
    width: 16px;
}

.dropdown-menu.show {
    display: block;
}

.children {
    display: flex;
    flex-direction: row-reverse;
    align-items: flex-start;
    justify-content: flex-end;
    margin: 14px 0;
}

.child_label {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
}

.children label {
    width: 100%;
    font-weight: 700;
}

#openModal .form .children input {
    height: 16px;
    width: 30px;
}

#result_child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.incremental-input-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
    flex-direction: row;
    flex-wrap: nowrap;
    width: 50%;
    position: relative;
}

.incremental-input-child input {
    width: 100%;
    padding-left: 20px;
    text-align: left;
}

.count_btn-child img {
    width: 13px;
}

.w-100 {
    width: 100%;
}

.incremental-input-child-old {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-direction: row;
    flex-wrap: nowrap;
    width: 50%;
    position: relative;
}

.incremental-input-child-old input {
    width: 100%;
    padding-left: 20px;
    text-align: left;
}

.count_btn-child-old img {
    width: 13px;
}

.blocks:last-child {
    display: block;
}

.count_btn-child {
    flex-direction: column;
    margin: 0 8px;
    position: absolute;
    right: 0;
    bottom: 9px
}

.count_btn-child-old {
    flex-direction: column;
    margin: 0 8px;
    position: absolute;
    right: 0;
    bottom: 9px
}

.count_btn-child span:last-child {
    border-top: 1px solid #ddd;
}

.count_btn-child-old span:last-child {
    border-top: 1px solid #ddd;
}


/* Скрываем стандартный чекбокс */
.custom-checkbox input[type="checkbox"] {
    display: none;
}

/* Стиль для контейнера чекбокса */
.custom-checkbox {
    display: inline-block;
    position: relative;
    cursor: pointer;
    user-select: none;
    width: 100%;
}

.dropdown-menu .custom-checkbox label {
    padding: 10px 0 10px 24px;
    z-index: 99;
}

.dropdown-menu .custom-checkbox .checkmark {
    z-index: 9;
}

.custom-checkbox label {
    width: 100%;
    cursor: pointer;
    padding-left: 24px;
    z-index: 99;
}

.children .checkmark {
    top: -2px !important;
    left: 0;
    right: auto;
    z-index: 9;
}

.about_time .checkmark {
    top: -2px !important;
    left: 0;
    right: auto;
    z-index: 9;
}

.child_label {

    width: 100%;
}

/* Стиль для псевдо-элемента */
.custom-checkbox .checkmark {
    position: absolute;
    top: 7px;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: transparent;
    border: 2px solid #22303d;
    border-radius: 4px;
    display: flex;
    align-items: center;
}

.dropdown-menu div:last-child {
    border-bottom: none;
}

/* Стиль для состояния checked */
.custom-checkbox input[type="checkbox"]:checked+.checkmark {
    background-color: #22303d;
}

/* Стиль для псевдо-элемента, показывающего галочку */
.custom-checkbox .checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Показываем галочку, когда чекбокс выбран */
.custom-checkbox input[type="checkbox"]:checked+.checkmark:after {
    display: block;
}

/* Стилизуем галочку */
.custom-checkbox .checkmark:after {
    left: 5px;
    top: 2px;
    width: 4px;
    height: 6px;
    border: solid white;
    border-width: 0 3px 3px 0;
    transform: rotate(45deg);
}

.daterangepicker {
    z-index: 99999 !important;
}

.res_list {
    list-style: none;
    margin: 20px 0;
}

.head {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    border-bottom: 1px solid #ddd;
    margin: 0 auto;
}

.head div {
    width: 100%;
    text-align: center;
    border-right: 1px solid #ddd;
}

.head div:last-child {
    border-right: none;
}

.room {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    border-bottom: 1px solid #ddd;
}

.room div {
    width: 100%;
    height: 52.57px;
    text-align: center;
    border-right: 1px solid #ddd;
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    margin: 0 auto;
}

.room p {
    font-weight: 400 !important;
    margin: 10px 0;
}

.room div:last-child {
    border-right: none;
}

.custom-select {
    position: relative;
    display: inline-block;
    width: 100%;
    margin-top: 20px;
}

.input_child_room {
    height: 32px !important;
    text-align: center;
    padding-left: 11px !important;
}

.input_child_room2 {
    height: 32px !important;
    text-align: center;
    padding-left: 11px !important;
}

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

/* 
.additionally {
    padding: 0 15px;
} */

tr[data-resource-id="Executive suite"] {
    background-color: #F3F3F3;
}

tr[data-resource-id="Deluxe"] {
    background-color: #F3F3F3;
}

tr[data-resource-id="Wellness suite"] {
    background-color: #F3F3F3;
}

tr[data-resource-id="Superior"] {
    background-color: #F3F3F3;
}

.custom-select select {
    width: 100%;
    padding-left: 20px;
    appearance: none;
    /* Убираем стандартную стрелку */
    -webkit-appearance: none;
    /* Safari и Chrome */
    -moz-appearance: none;
    /* Firefox */
    background: transparent;
    border: 2px solid #22303d;
    border-radius: 4px;
    height: 52px;
}

.custom-select::after {
    content: '';
    position: absolute;
    top: 63%;
    right: 10px;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #000;
    /* Цвет стрелки */
    transform: translateY(-50%);
    pointer-events: none;
    /* Не позволяет кликам по стрелке мешать выпадающему списку */
}

.about_price {
    margin-bottom: 15px;
}

.about_price .checkmark {
    top: -3px;
}

#other_price {
    margin-top: 20px;
}

.form-group {
    width: 100%;
}

label {
    display: inline-block;
    font-weight: 600;
    margin-bottom: 5px;
}

.gap-2 {
    gap: 8px;
}

#bookingForm input {
    height: 52px;
    border: 2px solid #22303d;
    border-radius: 4px;
    width: 100%;
    padding-left: 20px;
}

.mb-2 {
    margin-bottom: 10px;

}

.pos-check .checkmark {
    top: -2px !important;
    left: 0;
    right: auto;
}

#certificate {
    margin: 10px 0 20px 0;
}

.warning {
    margin-top: 10px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    position: absolute;
}

.red {
    color: #FF0000;
}

.green {
    color: #2BA500;
}

.create_btn {
    position: absolute;
    bottom: 40px;
    left: 40px;
    display: flex;
    align-items: center;
    gap: 8px;
    width: 44.8%;
}

.create_btn button {
    width: 50%;
    height: 52px;
}

.update_btn {
    position: absolute;
    bottom: 40px;
    left: 40px;
    display: flex;
    align-items: center;
    gap: 8px;
    width: 44.8%;
}

.update_btn button {
    width: 50%;
    height: 52px;
}

.block_btn {
    position: absolute;
    bottom: 40px;
    right: 40px;
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 8px;
    width: 44.8%;
}

.block_btn button {
    width: 50%;
    height: 52px;
}

.fc-resource-area {
    width: 10% !important;
}

.user_info {
    position: relative;
}

#other_infos {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
}

#other_infos a {
    text-decoration: none;
}

#updateBtn {
    display: flex;
    align-items: center;
    justify-content: center;
}

#time_input_container {
    position: relative;
    width: 98%;
    max-width: 600px;
    height: 42px;
}

#time_range {
    width: 100%;
    height: 20px !important
}

#time_labels {
    display: flex;
    justify-content: space-between;
    position: absolute;
    bottom: 0;
    /* Положение меток под шкалой */
    width: 102%;
    padding-left: 10px;
}

.time-label {
    cursor: pointer;
    flex: 1;
    text-align: center;
    position: relative;
}

.time-label::before {
    content: '';
    position: absolute;
    top: -10px;
    /* Положение индикатора над меткой */
    left: 50%;
    transform: translateX(-50%);
    width: 1px;
    height: 10px;
    background: #333;
}

.tooltip {
    position: absolute;
    background: #333;
    color: #fff;
    padding: 5px;
    border-radius: 5px;
    display: none;
    white-space: nowrap;
    transform: translateX(-50%);
    z-index: 999999;
}

.color_darkred {
    width: 20px;
    height: 20px;
    background-color: #9b2d30;
    margin-right: 5px;
    border-radius: 50%;
}

.payed .checkmark {
    top: -3px;
}

#payed_all {
    margin-top: 10px;
}

#time {
    margin-left: 10px;
    color: #ec5353;
}

/* Стиль для прелоадера */
#preloader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 1);
    z-index: 999999;
    display: flex;
    justify-content: center;
    align-items: center;
}

#preloader1 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 1);
    z-index: 999999;
    display: flex;
    justify-content: center;
    align-items: center;
}

#preloader2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 1);
    z-index: 999999;
    display: flex;
    justify-content: center;
    align-items: center;
}

@-webkit-keyframes dyinglight {
    15% {
        transform: scale(1.6);
    }

    50% {
        transform: rotate(-89deg);
    }

    100% {
        transform: rotate(-90deg);
    }
}

@keyframes dyinglight {
    15% {
        transform: scale(1.6);
    }

    50% {
        transform: rotate(-89deg);
    }

    100% {
        transform: rotate(-90deg);
    }
}

.dl {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: inline-block;
}

.dl__square {
    display: block;
    width: 50px;
    height: 50px;
    background: url('img/logo.png');
    background-position: center;
    background-size: cover;
    border-radius: 4px;

}

.dl__container {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    transform-origin: 50% 50% 0;
    -webkit-animation: dyinglight 1s ease infinite;
    animation: dyinglight 1s ease infinite;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.dl__corner--top:before,
.dl__corner--top:after,
.dl__corner--bottom:before,
.dl__corner--bottom:after {
    position: absolute;
    width: 17px;
    height: 17px;
    color: #4285F4;
    content: "";
}

.dl__corner--top:before {
    border-left: 1px solid;
    border-top: 1px solid;
    top: -6px;
    left: -6px;
}

.dl__corner--top:after {
    border-right: 1px solid;
    border-top: 1px solid;
    top: -6px;
    right: -6px;
}

.dl__corner--bottom:before {
    border-left: 1px solid;
    border-bottom: 1px solid;
    bottom: -6px;
    left: -6px;
}

.dl__corner--bottom:after {
    border-right: 1px solid;
    border-bottom: 1px solid;
    bottom: -6px;
    right: -6px;
}

#edit_true {
    position: absolute;
    top: 40px;
    right: 60px;
    font-style: italic;
    color: #842029;
}

#infoList li>i {
    width: 20px;
    height: 20px;
    margin-right: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}














.tabs {
    width: 100%;
    display: inline-block;
}

.tab-links {
    margin: 0;
    padding: 0;
    list-style: none;
}

.tab-links li {
    display: inline-block;
    margin-right: 5px;
}

.tab-links a {
    padding: 9px 15px;
    display: inline-block;
    background: #fff;
    border: 2px solid #22303d;
    font-size: 14px;
    font-weight: 400;
    color: #333;
    border-radius: 4px;
    text-decoration: none;
}

.tab-links a:hover {
    background: #2C3E50;
    color: #fff;
}

.tab-links .active a {
    background: #2C3E50;
    color: #fff;
}



.tab {
    display: none;
}

.tab.active {
    display: block;
}

.logo_tab {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
}

#timeline {
    padding: 0 15px 0 15px;
}

/* Стили для модального окна */
.infra_modal {
    display: none;
    /* Скрыть по умолчанию */
    position: fixed;
    /* Оставаться на месте */
    z-index: 9999;
    /* Поместить на верхний слой */
    left: 0;
    top: 0;
    width: 100%;
    /* Полная ширина */
    height: 100%;
    /* Полная высота */
    overflow: auto;
    /* Включить прокрутку, если нужно */
    background-color: rgb(0, 0, 0);
    /* Цвет фона */
    background-color: rgba(0, 0, 0, 0.4);
    /* Чёрный с прозрачностью */
}

/* Всплывающее окно контента */
.content_infra {
    width: 45%;
    margin-top: 5%;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: flex-start;
    background: white;
    padding: 60px 40px 40px 40px;
    height: fit-content;
    position: relative;
    flex-direction: column;
    gap: 8px;
}

.content_infra .input_lines {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

input:disabled {
    color: #000;
    /* Ваш цвет текста для отключенного input */
    -webkit-text-fill-color: #000;
    /* Цвет текста для iOS */
    -webkit-opacity: 1;
    /* Отключаем изменение прозрачности на iOS */
}

@media (max-width: 700px) {
    .fc-toolbar>*>:not(:first-child) {
        margin-left: 0;
    }

    .fc-toolbar>*>:first-child {
        display: none;
    }

    .fc-left {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }

    .fc-toolbar .fc-center h2 {
        display: block !important;
        font-size: 18px;
    }

    .fc-resource-area {
        width: 128px !important;
    }

    .content-modal h3 {
        font-size: 18px;
        top: 48px;
    }

    .content-modal {
        padding: 80px 20px 110px 20px;
    }

    .date_picker::after {
        display: none;
        color: #000;
    }

    .house {
        margin-bottom: 0 !important;
    }

    .content {
        width: 90%;
    }
}

/* Кнопка закрытия */
.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.content_infra h3 {
    font-size: 24px;
    margin-top: -14px;
}

.content_infra input {
    width: 50%;
    height: 62px;
    padding-left: 20px;
    border: none;
    border-radius: 4px;
    border: 2px solid #2C3E50;
}

#reserv_ids {
    width: 100%;
    height: 62px;
    padding-left: 20px;
    border-radius: 4px;
    border: 2px solid #2C3E50;
    appearance: none;
    /* Убираем стандартную стрелку */
    -webkit-appearance: none;
    /* Убираем стандартную стрелку для Safari */
    -moz-appearance: none;
    /* Убираем стандартную стрелку для Firefox */
}


#infra_status {
    width: 100%;
    height: 62px;
    padding-left: 20px;
    border-radius: 4px;
    border: 2px solid #2C3E50;
    appearance: none;
    /* Убираем стандартную стрелку */
    -webkit-appearance: none;
    /* Убираем стандартную стрелку для Safari */
    -moz-appearance: none;
    /* Убираем стандартную стрелку для Firefox */
}


.custom-dropdown {
    position: relative;
    display: inline-block;
    width: 50%;
}

.custom-dropdown::after {
    content: '';
    position: absolute;
    top: 25px;
    right: 14px;
    width: 13px;
    height: 13px;
    background-image: url(img/down.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.custom-dropdown-input {
    padding: 10px 30px 10px 0;
    width: 100% !important;
    border: 1px solid #ccc;
    cursor: pointer;
}

.custom-dropdown-menu {
    display: none;
    position: absolute;
    background-color: white;
    width: 100%;
    height: 185px;
    overflow-y: scroll;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 9999;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 10px 0 0 10px;
}

.custom-dropdown-menu .form-check {
    margin: 5px 0;

    display: flex;
    align-items: center;
    justify-content: flex-start;
    border-bottom: 1px solid #ddd;
}

.custom-dropdown-menu .form-check input {
    margin-right: 10px;
    height: 16px !important;
    width: 16px;
}

.custom-dropdown-menu .show {
    display: block;
}

.custom-dropdown-menu .custom-checkbox .checkmark {
    position: absolute;
    top: 7.5px;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: transparent;
    border: 2px solid #22303d;
    border-radius: 4px;
    display: flex;
    align-items: center;
}

.custom-dropdown-menu .custom-checkbox label {
    padding: 10px 0 10px 24px;
}

.custom_select {
    width: 50%;
    position: relative;
}

.custom_select::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 10px;
    width: 13px;
    height: 13px;
    background-image: url('img/down.png');
    /* Замените на ваш путь к изображению стрелки */
    background-repeat: no-repeat;
    background-size: cover;
    transform: translateY(-50%);
    pointer-events: none;
    /* Стрелка не будет мешать кликам по select */
}

#save_infra {
    height: 62px;
    width: 49.5%;
}

#updste_infra {
    height: 62px;
    width: 49.5%;
}

#block_infra {
    height: 62px;
    width: 49.5%;
}

#unblock_infra {
    width: 40px;
    height: 40px;
    padding: 0;
}

.fc-timeline-event .fc-title {
    width: 100%;
    text-align: center !important;
}


.blocks .children {
    display: none !important;
}