:root {
    --fontName: "Raleway";
    --fontFolder: "../fonts";

    /* Font weight */
    --thin: 100;
    --hairline: 100;
    --extraLight: 200;
    --ultraLight: 200;
    --light: 300;
    --regular: 400;
    --fw-medium: 500;
    --semiBold: 600;
    --demiBold: 600;
    --bold: 700;
    --extraBold: 800;
    --ultraBold: 800;
    --fw-black: 900;
    --fw-heavy: 900;

    --ie: "(-ms-high-contrast: active), (-ms-high-contrast: none)";

    /* Default */
    --fontSize: 20px;
    --textColor: #fff;
    --placeholderColor: #ff1441;
    --primary: #ff1441;
    --wrapper: 1320px;
}

/* <--------------------------------------> */

html {
    font-size: 16px !important;
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    position: relative;

    background-color: #fafafa !important;
    color: #1f2131;
}

main {
    flex: 1;
}

.container {
    max-width: 1320px;
}

.header {
    height: 81px;
    padding-top: 1px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    background-color: #fff;
}

.po-footer {
    max-width: 1320px;
    background-color: #1f2131;
}

a:hover {
    color: #ff144180;
}

a:focus,
a:active {
    color: #de0d35;
}

/* <--------------------------------------> */

.form-control:focus,
.form-control:hover {
    color: #1f2131;
    background-color: #fafafa;
    outline: 0;

    box-shadow: none;
    box-sizing: border-box;
    border: 1px solid rgba(31, 33, 49, 0.5);
    border-radius: 4px;
}

/* <--------------------------------------> */

.popup-form {
    min-width: auto;
    margin-top: auto;
}

.popup {
    background: #ffffff;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.12);
    border-radius: 4px;
}

.popup-auth {
    position: absolute;
    top: 100px;
    right: 100px;
    left: auto;
    width: 340px;
    max-width: 90vw;
    box-sizing: border-box;
    z-index: 10;

    transform: none;
    -webkit-transform: none;
}

/* .popup-auth>.popup__close { */
.popup__close {
    top: 16px;
    right: 16px;
    fill: #ff1441;
}

.popup-auth > .popup__wrapper {
    width: 340px;
    padding: 48px 15px 24px;
}

.popup-auth-guest {
    width: 340px;
}

.popup-executor {
    top: auto;
    position: absolute;
    bottom: 100px;
    right: 100px;
    left: auto;
    width: 340px;
    max-width: 90vw;
    box-sizing: border-box;
    z-index: 10;

    transform: none;
    -webkit-transform: none;
}

/* .popup-executor>.popup__close { */
.popup__close {
    top: 16px;
    right: 16px;
    fill: #ff1441;
}

.popup-executor > .popup__wrapper {
    width: 340px;
    padding: 48px 15px 24px;
}

.popup__wrapper {
    padding: 48px 15px 24px;
}

.tabs__control {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;

    -webkit-column-gap: 30px;
    -moz-column-gap: 30px;
    column-gap: 30px;
}

.tabs__button {
    color: #000;
}

.tabs__button:not(:last-child):before {
    content: none;
}

.tabs__button--active {
    color: #ff1441;
}

.menu-avatar {
    width: 100%;
    height: auto;
}

.popup-menu {
    transform: none;

    top: 0px;
    left: 0px;
    margin: 0px;
    padding: 0px;

    height: 100vh;
    width: 70%;

    max-width: none;
    max-height: none;

    height: 100% !important;
    overflow-y: auto;
}

.popup-menu > .popup__wrapper {
    padding: 0;
    height: 100%;
    width: 100%;
    top: unset;
    margin: 0;
}

.dropdown-menu__link:hover {
    color: #ff144180;
}

/* <--------------------------------------> */

.steps {
    margin: 0;
    padding-left: 20px;
    padding-right: 20px;
}

/* <--------------------------------------> */

.service-options {
    background-color: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

/* <--------------------------------------> */

.order-option-error.orderAttachmentsError,
.order-option-error.orderAmountError {
    position: relative;
    right: auto;
    max-width: none;
    min-width: auto;
    text-align: left;
}

/* <--------------------------------------> */

.counters {
    gap: 130px;
}

.orderAmount {
    max-width: 100px;
}

/* .orderCopies {
    max-width: 100px;
} */

/* <--------------------------------------> */

.executors__map {
    width: 60%;
    height: auto;
}

.executors__aside {
    width: 40%;
    max-width: none;

    max-height: 600px;
}

.executors {
    margin-top: auto;
}

.executors__title {
    text-align: unset;
}

.executors__sort {
    min-width: 200px;
}

/* [data-order-info] {
    color: #1F2131;
    cursor: pointer;
}

[data-order-info]:hover,
[data-order-info]:focus {
    color: rgba(255, 20, 65, 0.5);
}

[data-order-info]:active {
    color: #de0d35;
} */

.executors__name {
    color: #1f2131;
    cursor: pointer;
}

.executors__name:hover,
.executors__name:focus {
    color: #ff1441;
}

.executors__name:active {
    color: #de0d35;
}

.executors__top {
    margin-bottom: 24px;
}

.executors__name {
    margin-bottom: 12px !important;
}

/* .executors__information {
} */

.executors__information:not(:last-child) {
    margin-bottom: 0;
}
/* <--------------------------------------> */

.rating.wrap {
    align-items: flex-start;
    /* flex-direction: column; */
}

/* <--------------------------------------> */

.notification {
    z-index: 1001;
}

/* <--------------------------------------> */

[data-order-info]:hover {
    color: #ff144180;
}

[data-order-info]:focus,
[data-order-info]:active {
    color: #de0d35;
}

/* <--------------------------------------> */

.page-block-controls {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    background: #ffffff;
    border-radius: 4px;

    padding: 20px;
}

.page-block-content {
    margin-top: 2px;
    padding: 20px;
    padding-top: 0;
    padding-bottom: 0;
}

/* <--------------------------------------> */

/* Цвет фона при наведении */
.daterangepicker td.in-range {
    background-color: rgba(255, 20, 65, 0.2) !important;
    color: white;
}

/* Цвет выделенных дат */
.daterangepicker td.active,
.daterangepicker td.active:hover {
    background-color: #ff1441 !important;
    color: white;
}

/* <--------------------------------------> */

.po-table-list {
    text-transform: none;
}

.po-table-list button {
    text-transform: none;
}

.po-table-list a:hover {
    text-decoration: none;
}

.order__cell--action {
    text-align: left;
}

/* <--------------------------------------> */

.page-item {
    padding-right: 10px;
}

.page-item .page-link {
    width: 30px;
    height: 30px;
    background: #ffffff;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.12);
    padding: 10px;
    border: none;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: relative;
    font-size: 14px;
    color: #000;
}

.page-item:first-child .page-link {
    background-image: url("/assets/img/new_po/icon/lft_black.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 12px 12px;
    color: transparent;
}

.page-item:first-child .page-link:focus,
.page-item:first-child .page-link:active,
.page-item:first-child .page-link:hover {
    background-image: url("/assets/img/new_po/icon/lft.svg");
    /* color: #FF1441; */
    background-color: #fff;
}

.page-item:last-child .page-link {
    background-image: url("/assets/img/new_po/icon/rght_black.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 12px 12px;
    color: transparent;
}

.page-item:last-child .page-link:focus,
.page-item:last-child .page-link:active,
.page-item:last-child .page-link:hover {
    background-image: url("/assets/img/new_po/icon/rght.svg");
    /* color: #FF1441; */
    background-color: #fff;
}

.page-item.disabled .page-link {
    opacity: 0.5;
    pointer-events: none;
}

.page-item.active .page-link {
    background-color: #fff;
    border-color: #fff;
    color: #ff1441;
    font-weight: 700;
}

.page-link:hover {
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.18);
}

.page-item:not(.disabled):not(:first-child):not(:last-child) .page-link:hover,
.page-item:not(.disabled):not(:first-child):not(:last-child) .page-link:focus,
.page-item:not(.disabled):not(:first-child):not(:last-child) .page-link:active {
    color: #ff1441;
    background-color: #fff;
    transition: color 0.2s ease;
}

/* <--------------------------------------> */

table.po-sample {
    width: 100%;
}
table.po-sample td {
    width: 40%;
    padding: 8px 20px;
}

table.po-sample tr {
    border-top: 1px solid rgba(31, 33, 49, 0.2);
    border-bottom: 2px solid rgba(31, 33, 49, 0.2);
}

table.po-sample tr:last-child {
    border-bottom: 1px solid rgba(31, 33, 49, 0.2);
}

/* table.po-sample tr:nth-child(even) {
    background-color: rgba(229, 230, 231, 0.5);
} */

/* <--------------------------------------> */

.order__row row {
    align-items: unset;
}

/* <--------------------------------------> */

.page-assessments-content {
    padding-top: 10px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 10px;
}

.page-assessments-hr {
    padding: 0px;

    margin-right: -20px;
    margin-left: -20px;
    margin-bottom: 10px;
    margin-top: 10px;

    border-top: 2px solid rgba(31, 33, 49, 0.2);
}

/* <--------------------------------------> */

.po-page-edit-content {
    padding: 1.5rem;
}

.form-group {
    margin-bottom: 1.5rem;
}

label {
    display: inline-block;
    margin-bottom: 0.7rem;
    color: rgba(31, 33, 49, 0.5) !important;
}

.personal-settings__item {
    margin-bottom: 1.5rem;
}

/* <--------------------------------------> */

/* Убрать иконку в Chrome, Edge, Safari */
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    opacity: 0;
    cursor: pointer;
}

/* Убрать фон в Safari */
input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-clear-button,
input[type="datetime-local"]::-webkit-inner-spin-button,
input[type="datetime-local"]::-webkit-clear-button {
    display: none;
}

/* Firefox — скрытие стрелочек и иконок */
input[type="date"],
input[type="datetime-local"] {
    appearance: none;
    -moz-appearance: textfield;
}

/* Дополнительно — убрать focus стиль если нужно */
input[type="date"]:focus,
input[type="datetime-local"]:focus {
    outline: none;
}

/* <--------------------------------------> */

.cursor-pointer {
    cursor: pointer;
}

/* <--------------------------------------> */

.has-error .form-control:focus,
.has-error .form-control {
    border-color: #ff1441;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid #ff1441;
}

.form-group.has-error .po-coolcheck-wrap {
    border: 1px solid #ff1441;
    border-radius: 4px;
    padding: 3px 8px;
}

/* <--------------------------------------> */

.executor-two-item {
    background-color: #ffffff;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

.executor-two-item {
    background-color: #ffffff;
}

.executor-two-item:not(:last-child) {
    /* border-bottom: 2px solid rgba(31, 33, 49, 0.1); */
}

.executor-two-item > h2 {
    margin: 0;
    padding: 0 20px;
    height: 38px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.executor-two-item > h2 {
    border-bottom: 2px solid rgba(31, 33, 49, 0.1);
}

.executor-two-item .caption {
    padding: 0 20px;
    height: 38px;
    display: flex;
    align-items: center;
}

.collapse-icon {
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 38px;
}

.collapse-icon svg {
    width: 16px;
    height: 16px;

    transition: transform 0.3s ease;
    transform: rotate(180deg);
}

.executor-two-item.collapsed .collapse-icon svg {
    transform: rotate(0deg);
}

.executor-two-body2 {
    border-bottom: 2px solid rgba(31, 33, 49, 0.1);
}

.executor-two-body2.no-border {
    border-bottom: none;
}

.executor-two-body table {
    width: 100%;
    border-collapse: collapse;
}

.executor-two-body tr {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    /* или padding если нужно */
}

.executor-two-body th,
.executor-two-body td {
    flex: 1;
    padding: 0 0;
    text-align: left;
}

.change-items-row {
    display: flex;
    gap: 20px;
    align-items: flex-end;
    flex-wrap: wrap;
}

/* <--------------------------------------> */