/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/widgets/homePage/viewHome/chessList.vue?vue&type=style&index=0&id=0cf2a28b&lang=scss ***! \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .chessList .p-paginator-bottom { border: none !important; } .chessList .p-paginator { display: flex; justify-content: flex-end; align-items: center; -moz-column-gap: 10px; column-gap: 10px; padding: 0; padding-top: 50px; padding-bottom: 50px; } .chessList .p-paginator .p-dropdown { height: 37px; } .chessList .p-paginator-first, .chessList .p-paginator-prev, .chessList .p-paginator-next, .chessList .p-paginator-last { width: 37px; height: 37px; padding: 10px; display: flex; justify-content: center; align-items: center; border-radius: 3px; border: 1px solid #dedede; margin: 0; min-width: 0; } .chessList .p-paginator-first svg, .chessList .p-paginator-prev svg, .chessList .p-paginator-next svg, .chessList .p-paginator-last svg { width: 16px; height: 16px; } .chessList .p-paginator-prev { margin-right: 10px; } .chessList .p-paginator-next { margin-left: 10px; } .chessList .p-paginator-pages { display: flex; justify-content: flex-start; align-items: center; } .chessList .p-paginator-pages .p-paginator-page { height: auto; min-height: 37px; min-width: 37px; padding: 10px; border-radius: 3px; border: 1px solid #dedede; box-shadow: none !important; } .chessList .p-paginator-pages .p-paginator-page.p-highlight { background: #4caf50; color: #ffffff; } .chessList .to_send_complexes { cursor: pointer; } .chessList .houseLink { cursor: pointer; } .chessList .houseLink:hover { color: #1a73e8; } /*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-12.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-12.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/RouterHistory.vue?vue&type=style&index=0&id=79b150ea&lang=css ***! \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .navigation { width: 100%; gap: 20px; padding-bottom: 10px; top: 20px; z-index: 11; height: 56px; } .nav-button { padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; font-size: 16px; transition: background-color 0.3s ease; } .back { border: 1px solid; color: rgb(236 46 46 / 1); border-color: rgb(198, 132, 132); } .back:hover { color: white; background-color: #d32f2f; } .next { background-color: #4caf50; color: white; } .next:hover { background-color: #388e3c; } /*!*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/widgets/homePage/viewHome/filtersWidget.vue?vue&type=style&index=0&id=2ca3c428&scoped=true&lang=scss ***! \*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .filters[data-v-2ca3c428] { background-color: #ffffff; position: relative; } .filters.filters--facades[data-v-2ca3c428] { width: 100%; position: absolute; top: 0; left: 0; right: 0; z-index: 10; padding-top: 126px; padding-bottom: 53px; opacity: 0; visibility: hidden; transition: 0.5s all ease-in-out; } .filters.filters--facades.open[data-v-2ca3c428] { opacity: 1; visibility: visible; transition: 0.5s all ease-in-out; } .filters .inputs[data-v-2ca3c428] { display: flex; align-items: center; } .filters .head__foundText[data-v-2ca3c428] { display: flex; align-items: center; justify-content: space-between; } @media screen and (max-width: 1610px) { .filters .p-inputtext[data-v-2ca3c428] { max-width: 100px !important; } } /*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-12.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-12.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/widgets/homePage/viewHome/filtersWidget.vue?vue&type=style&index=1&id=2ca3c428&lang=css ***! \********************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .viewHome__filters .p-inputwrapper { border-radius: 6px !important; justify-content: space-between !important; padding: 8px !important; width: 300px !important; height: 36px !important; } .viewHome__filters .p-placeholder, .viewHome__filters .p-multiselect-label { font-weight: 500; font-size: 16px; line-height: 19.2px; color: #757575; } .viewHome__filters .p-inputswitch.p-focus .p-inputswitch-slider { box-shadow: unset !important; } .custom-header { display: flex !important; .p-checkbox-box, input { box-shadow: unset !important; } input { padding: 5px !important; } } /*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-12.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-12.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/widgets/homePage/viewHome/viewHead.vue?vue&type=style&index=0&id=6bf38c68&lang=css ***! \***************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .viewHome__head .p-inputswitch.p-focus .p-inputswitch-slider { box-shadow: unset !important; } .custom-status-container::-webkit-scrollbar-thumb:hover { background-color: #7e827e !important; cursor: pointer !important; } .head__top { display: flex; flex-wrap: wrap; position: relative; } .filter-bottom { position: absolute; bottom: -15px; right: 0; display: flex; flex-wrap: wrap; gap: 20px; } /*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-12.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-12.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/Tabs.vue?vue&type=style&index=0&id=bdda1ea4&scoped=true&lang=css ***! \********************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .tabs[data-v-bdda1ea4] { height: 100%; width: 100%; } .tab-block[data-v-bdda1ea4] { display: flex; justify-content: space-between; border-bottom: 1px solid #dedede; } .tab-block ul[data-v-bdda1ea4] { font-size: 16px; list-style: none; padding: 0; display: flex; } .tab-block ul li[data-v-bdda1ea4] { padding: 10px 20px; display: flex; justify-content: center; align-items: center; gap: 5px; cursor: pointer; border-bottom: 2px solid transparent; } .tab-block ul li.active[data-v-bdda1ea4] { /* background-color: #f0f8ff; */ border-bottom: 2px solid #4caf50; fill: #4caf50; color: #4caf50; } .tab-block ul li .count[data-v-bdda1ea4] { background-color: #4caf50; color: white; border-radius: 50%; height: 24px; width: 26px; margin-left: 5px; display: flex; justify-content: center; align-items: center; } .tab-content[data-v-bdda1ea4] { height: 95%; } .is_not_visible[data-v-bdda1ea4] { display: none !important; } /*!*******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/shared/UI/modalLayout.vue?vue&type=style&index=0&id=704a8f1d&scoped=true&lang=scss ***! \*******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .modalWindow[data-v-704a8f1d] { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1000; width: 100%; height: 100vh; background-color: rgba(0, 0, 0, 0.3); display: flex; justify-content: center; align-items: center; opacity: 0; visibility: hidden; transition: 0.3s all ease-in-out; } .modalWindow.open[data-v-704a8f1d] { opacity: 1; visibility: visible; transition: 0.3s all ease-in-out; } .modalWindow__wrapper[data-v-704a8f1d] { position: relative; width: 760px; height: 80vh; --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); padding: 30px; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; overflow-y: scroll; } .modalWindow__title[data-v-704a8f1d] { font-size: 28px; line-height: 100%; } .modalWindow__close[data-v-704a8f1d] { position: absolute; right: 30px; top: 30px; width: 20px; height: 20px; } .modalWindow__close svg[data-v-704a8f1d] { width: 100%; height: 100%; } /*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/widgets/forms/formAddRoom.vue?vue&type=style&index=0&id=658454ef&scoped=true&lang=scss ***! \***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .addRoom[data-v-658454ef] { width: 100%; height: auto; } .addRoom__form[data-v-658454ef] { width: 100%; height: auto; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; margin-top: 30px; row-gap: 20px; } .addRoom__form .p-accordion[data-v-658454ef] { width: 100%; } .addRoom__form .p-accordion-header[data-v-658454ef] { background: red !important; } .addRoom__form .form__item[data-v-658454ef] { position: relative; width: 100%; height: auto; display: grid; } .addRoom__form .form__item[data-v-658454ef]:not(.wrapped) { grid-template-columns: 1fr 436px; } .addRoom__form .form__item label[data-v-658454ef] { margin-top: 8px; font-size: 16px; font-weight: 400; --tw-text-opacity: 1; color: rgb(117 117 117 / var(--tw-text-opacity)); } .addRoom__form .form__item label span[data-v-658454ef] { --tw-text-opacity: 1; color: rgb(236 46 46 / var(--tw-text-opacity)); } .addRoom__form .form__item .item__content[data-v-658454ef] { width: 100%; height: auto; display: flex; justify-content: flex-start; align-items: flex-start; -moz-column-gap: 16px; column-gap: 16px; row-gap: 16px; } .addRoom__form .form__item .item__text[data-v-658454ef] { --tw-text-opacity: 1; color: rgb(117 117 117 / var(--tw-text-opacity)); font-size: 16px; } .addRoom__form .form__item .item__btns[data-v-658454ef] { width: 100%; height: auto; display: flex; justify-content: flex-start; align-items: center; -moz-column-gap: 8px; column-gap: 8px; } /*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-12.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-12.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/widgets/forms/formAddRoom.vue?vue&type=style&index=1&id=658454ef&lang=css ***! \******************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .addRoom > .modalWindow__wrapper { width: unset !important; max-width: 830px; } .addRoom .p-inputnumber-input { width: 100%; } .addRoom .p-accordion-content { display: flex; flex-direction: column; gap: 16px; } .error-msg { padding: 5px; font-size: 12px; position: absolute; bottom: -25px; } .error-color { color: red; } .errored-input { border: 1px solid red !important; box-shadow: none !important; height: -moz-max-content; height: max-content } .errored-input .p-inputtext { box-shadow: none !important; border-color: transparent !important; } .errored-input .p-inputtext:focus { box-shadow: none !important; border-color: transparent !important; } .errored-input .p-inputtext:hover { box-shadow: none !important; border-color: transparent !important; } /*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/widgets/homePage/viewHome/windowInfoForList.vue?vue&type=style&index=0&id=ff77da94&scoped=true&lang=scss ***! \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .btns-wrapper[data-v-ff77da94] { display: flex; gap: 40px; justify-content: center; align-items: center; } .request-btn[data-v-ff77da94] { height: 35px; } .modelWindow[data-v-ff77da94] { position: absolute; top: 0; right: 0; bottom: 0; width: 0; height: 100vh !important; z-index: 1000; background-color: #ffffff; display: flex; flex-direction: row-reverse; justify-content: flex-start; align-items: flex-start; visibility: hidden; transition: 0.5s all ease-in-out; overflow: hidden; opacity: 0; /* .btn-wrapper { display: flex; align-items: center; } */ } .modelWindow.open[data-v-ff77da94] { visibility: visible; width: 750px; transition: 0.5s all ease-in-out; opacity: 1; } .modelWindow.openFull[data-v-ff77da94] { width: 100%; } .modelWindow__content[data-v-ff77da94] { width: 100%; height: 100%; max-width: 750px; padding: 50px; overflow-y: scroll; overflow-x: hidden; border-left: 1px solid #dedede; } .modelWindow__fullImage[data-v-ff77da94] { width: 0; height: 100%; visibility: hidden; transition: 0.5s all ease-in-out; display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 10px; } .modelWindow__fullImage.open[data-v-ff77da94] { width: 100%; visibility: visible; transition: 0.5s all ease-in-out; } .modelWindow__fullImage img[data-v-ff77da94] { width: 50%; height: auto; -o-object-fit: cover; object-fit: cover; } .modelWindow__head[data-v-ff77da94] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; } .modelWindow__title[data-v-ff77da94] { font-weight: 700; } .modelWindow__info_box[data-v-ff77da94] { display: flex; justify-content: space-between; position: relative; } .modelWindow__info[data-v-ff77da94] { width: 100%; height: auto; display: flex; justify-content: flex-start; align-items: center; -moz-column-gap: 30px; column-gap: 30px; margin-bottom: 30px; } .modelWindow__info .apartment-requisitions[data-v-ff77da94] { color: #237ef7 !important; border-color: #3a8efa !important; border-radius: 4px; cursor: pointer; position: relative; height: 30px; line-height: 30px; background: -webkit-linear-gradient(top, rgb(255, 255, 255), rgb(245, 245, 245)); border: 1px solid rgb(208, 208, 208); padding: 0px 13px; margin: 0px; font-family: Lato, sans-serif; } .modelWindow__status[data-v-ff77da94] { --tw-bg-opacity: 1; background-color: rgb(76 175 80 / var(--tw-bg-opacity)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); border-start-start-radius: 0.375rem; border-end-start-radius: 0.375rem; font-weight: 700; padding: 8px 10px; margin-left: auto; margin-right: -50px; } .modelWindow__image[data-v-ff77da94] { width: 100%; min-width: 500px; position: relative; margin-bottom: 30px; } .modelWindow__image .image[data-v-ff77da94] { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } .modelWindow__image .image img[data-v-ff77da94] { width: 50%; } .modelWindow__image .image__loop[data-v-ff77da94] { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(255, 255, 255, 0.5); display: flex; justify-content: center; align-items: center; opacity: 0; visibility: hidden; transition: 0.5s all ease-in-out; } .modelWindow__image .image__loop svg[data-v-ff77da94] { width: 140px; height: 140px; } .modelWindow__image:hover .image__loop[data-v-ff77da94] { opacity: 1; visibility: visible; transition: 0.5s all ease-in-out; cursor: pointer; } .modelWindow .square-price-and-btn[data-v-ff77da94] { display: flex; justify-content: space-between; } .modelWindow .to_send_complexes[data-v-ff77da94] { background-color: #e2574c; color: #ffffff; -webkit-user-select: none; -moz-user-select: none; user-select: none; cursor: pointer; border-radius: 3px; min-width: 55px; max-width: 55px; height: 25px; font-size: 14px; line-height: 0.6; padding: 8px 13px; } .modelWindow .mt-30px[data-v-ff77da94] { margin-top: 30px; } .modelWindow__btns[data-v-ff77da94] { display: flex; flex-direction: column; gap: 20px; align-items: center; margin-bottom: 30px; } .modelWindow__price[data-v-ff77da94] { display: flex; justify-content: space-between; font-size: 28px; font-weight: 700; margin-bottom: 8px; } .modelWindow__price p[data-v-ff77da94] { padding: 0; font-size: 14px; cursor: pointer; color: #666666; } .modelWindow__price p[data-v-ff77da94]:hover { color: #007eff; } .modelWindow__price p:hover path[data-v-ff77da94] { fill: #007eff; } .modelWindow__priceSqure[data-v-ff77da94] { font-size: 18px; --tw-text-opacity: 1; color: rgb(117 117 117 / var(--tw-text-opacity)); margin-bottom: 30px; } .modelWindow__settings[data-v-ff77da94] { width: 100%; height: auto; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; } .modelWindow__settings .settings__title[data-v-ff77da94] { font-size: 18px; line-height: 100%; font-weight: 700; margin-bottom: 10px; } .modelWindow__settings .settings__table[data-v-ff77da94] { width: 100%; height: auto; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; } .modelWindow__settings .settings__table .row[data-v-ff77da94] { width: 100%; height: auto; display: grid; grid-template-columns: 250px 1fr; border-bottom-width: 1px; --tw-border-opacity: 1; border-color: rgb(222 222 222 / var(--tw-border-opacity)); } .modelWindow__settings .settings__table .row .cell[data-v-ff77da94] { display: flex; justify-content: flex-start; align-items: flex-start; padding: 11px 30px; --tw-text-opacity: 1; color: rgb(0 0 0 / var(--tw-text-opacity)); font-size: 14px; font-weight: 300; } .modelWindow__settings .settings__table .row .cell[data-v-ff77da94]:first-child { padding: 11px 0; border-right-width: 1px; --tw-border-opacity: 1; border-color: rgb(222 222 222 / var(--tw-border-opacity)); --tw-text-opacity: 1; color: rgb(117 117 117 / var(--tw-text-opacity)); } @media screen and (max-width: 1600px) { .modelWindow.open[data-v-ff77da94] { visibility: visible; width: 550px; transition: 0.5s all ease-in-out; } .modelWindow.openFull[data-v-ff77da94] { width: 100%; } .modelWindow__content[data-v-ff77da94] { width: 100%; height: 100%; max-width: 550px; padding: 30px; overflow-y: scroll; border-left: 1px solid #dedede; } .modelWindow__fullImage[data-v-ff77da94] { width: 0; height: 100%; visibility: hidden; transition: 0.5s all ease-in-out; display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 10px; } .modelWindow__fullImage.open[data-v-ff77da94] { width: 100%; visibility: visible; transition: 0.5s all ease-in-out; } .modelWindow__fullImage img[data-v-ff77da94] { width: 50%; height: auto; -o-object-fit: cover; object-fit: cover; } .modelWindow__head[data-v-ff77da94] { margin-bottom: 24px; } .modelWindow__title[data-v-ff77da94] { font-size: 24px; line-height: 100%; } .modelWindow__close[data-v-ff77da94] { width: 32px; height: 32px; } .modelWindow__close svg[data-v-ff77da94] { width: 100%; height: 100%; } .modelWindow__info[data-v-ff77da94] { -moz-column-gap: 30px; column-gap: 30px; margin-bottom: 30px; } .modelWindow__status[data-v-ff77da94] { padding: 6px 8px; margin-right: -30px; } .modelWindow__image[data-v-ff77da94] { margin-bottom: 24px; } .modelWindow__image .image[data-v-ff77da94] { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } .modelWindow__image .image img[data-v-ff77da94] { width: 60%; } .modelWindow__image .image__loop svg[data-v-ff77da94] { width: 80px; height: 80px; } .modelWindow__price[data-v-ff77da94] { font-size: 22px; margin-bottom: 4px; } .modelWindow__priceSqure[data-v-ff77da94] { font-size: 14px; margin-bottom: 30px; } } .reservation[data-v-ff77da94] { cursor: pointer; } /*!************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-12.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-12.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/widgets/homePage/viewHome/windowInfoForList.vue?vue&type=style&index=1&id=ff77da94&lang=css ***! \************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/ .p-button:focus { box-shadow: unset !important; } .tabs { display: flex; flex-direction: column; align-items: end; } .tab-block { width: 750px; border-left: 1px solid #dedede; } .tab-content { display: flex; flex-direction: row-reverse; transition: 0.5s all ease-in-out; width: 100%; } .item-reservation-box { border-radius: 15px; margin: 20px; } .item-reservation { background-color: white; border: 0.125rem solid #dedede; border-radius: 15px; padding: 10px; } .employee-info-top { display: flex; justify-content: space-between; padding-bottom: 20px; border-bottom: 1px solid #dedede; } .employee-info-top .employee-header { display: flex; flex-direction: column; gap: 10px; } .employee-info-top .employee-header .e-reservation-id { display: flex; } .employee-info-top .employee-header .e-reservation-id-box { padding: 8px 10px; background: #4caf50; color: #ffffff; border-radius: 10px; } .employee-info-top .employee-header .employee-info-fio { font-size: 20px; color: #56b35a; } .employee-info-top .handle-icon-block { display: flex; gap: 8px; } .employee-info-top .handle-icon-block .item-icon { height: -moz-max-content; height: max-content; } .employee-info-top .handle-icon-block .item-icon .trash-box { border: 1px solid #d3cfcf; border-radius: 16%; } .employee-info-top .handle-icon-block .item-icon:hover { cursor: pointer; } .employee-info-top .handle-icon-block .item-icon:hover svg path { fill: #66ba6a !important; } .employee-info-top .handle-icon-block .item-icon:hover .trash-box { border-color: #66ba6a; } .employee-info-bottom { display: flex; justify-content: space-between; padding-top: 10px; gap: 5px; flex-direction: column; } .employee-info-bottom .e-email-box, .employee-info-bottom .e-phone-box, .employee-info-bottom .e-position-box { display: flex; justify-content: space-between; font-size: 16px; } .e-position-box .e-position { height: -moz-max-content; height: max-content; padding: 0 7px; background: #87c98a; color: #ffffff; border-radius: 8px; } .e-email-box .e-email, .e-phone-box .e-phone, .e-position-box .e-position { font-weight: 400; letter-spacing: 0.2px; } .dragDrop { height: 100%; width: 750px; overflow-y: auto; border-left: 1px solid #dedede; } .ghost { opacity: 0.5; background: #a2d0e5; } .active_reservation { text-wrap: nowrap; border-top-left-radius: 0.375rem; border: 1px solid #3a8efa; position: absolute; background: #ffffff; width: 160px; overflow: hidden; right: -50px; top: -8px; } .active_reservation p { padding: 5px 10px; margin: 0; } .active_reservation .title { display: flex; justify-content: space-between; gap: 10px; background: #3a8efa; color: #fff; fill: #ffffff; } .active_reservation .title .count_reservations { background-color: #4caf50; color: white; border-radius: 50%; height: 20px; width: 20px; display: flex; justify-content: center; align-items: center; } @media screen and (max-width: 1600px) { .active_reservation { right: -30px; } .tab-block { width: 550px; } .dragDrop { width: 550px; } }