.cabinet {
margin-top: 30px;
margin-bottom: 30px;
}

.cabinet_content {
min-height: 800px;
}

.cabinet_left {
width: 100%;
overflow: hidden;
}

.cabinet_right {
width: 100%;
}

.cabinet_title {
margin: 2rem 0 1.5rem 0;
font-weight: 500;
font-size: 24px;
opacity: .87;
padding-bottom: 5px;
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.cabinet_flex {
margin-top: 30px;
}

.cabinet_list {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 10px;
padding-bottom: 10px;
}

@media (min-width: 320px) and (max-width: 768px) {
.cabinet_list {
overflow-y: scroll;        
}

.status_blog_list_status {
flex-direction: column;
align-items: unset !important;
}

.status_cause_text, .review_product_list div {
font-size: 12px !important;
}



}

.cabinet_item,
.cabinet_item_exit {
padding: 10px;
color: black;
font-size: 16px;
cursor: pointer;
opacity: 0.5;
transition: 0.2s ease;
text-wrap: nowrap;
}

.cabinet_item_exit {
display: block;
transition: 0.2s ease;
}

.cabinet_item_exit:hover {
color: black;
opacity: 1;
transition: 0.2s ease;
}

.cabinet_item:hover {
opacity: 1;
transition: 0.2s ease;
}

.cabinet_item_active {
opacity: 1;
transition: 0.2s ease;
}

.cabinet_tabs_blog {
display: none;
}

.cabinet_status_tabs {
display: inline-flex;
align-items: center;
border: 1px solid rgba(0, 0, 0, 0.12);
}

.cabinet_status_item, .cabinet_status_link {
padding: 10px;
padding-left: 15px;
padding-right: 15px;
cursor: pointer;
border: 1px solid rgba(0, 0, 0, 0.12);
}


.cabinet_status_item_flex {
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
padding-top: 4px;
padding-bottom: 4px;
}

.cabinet_status_item_flex .cabinet_status_id {
border: none;
}

.cabinet_status_item_button {
padding: 10px;
display: flex;
align-items: center;
justify-content: end;
gap: 10px;
}

.cabinet_status_item_button input {
padding: 5px 15px;
border-radius: var(--border-px);
color: white;
border: none;
transition: 0.2s ease;
}

.cabinet_status_item_button input:hover {
opacity: 0.8;
transition: 0.2s ease;
}

.status_item_btn {
padding-left: 10px;
padding-right: 10px;
color: white;
text-align: center;
border-radius: var(--border-px);
}

.status_item_btn_red {
background: rgb(191, 31, 3);
}

.status_item_btn_green {
background: rgb(0, 152, 0);
}

.cabinet_status_item_active {
background: rgba(0, 0, 0, 0.12);
}

.cabinet_status_info {
margin-top: 30px;
}

.cabinet_status_blog {
display: none;
}


.cabinet_status_item_content {
border: 1px solid rgba(0, 0, 0, 0.12);
background-color: #fff;
border-radius: var(--border-px);
}

.cabinet_status_id {
padding-left: 20px;
padding-right: 20px;
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
padding-top: 4px;
padding-bottom: 4px;
font-size: 18px;
font-weight: 600;
display: flex;
align-items: center;
gap: 10px;
}

.cabinet_status_item_btn {
padding: 3px 10px;
border-radius: var(--border-px);
color: white;
border: none;
font-size: 14px;
transition: 0.2s ease;
background: rgb(0, 152, 0);
}

.cabinet_status_blog_list {
padding: 20px;
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.mob_statuc {
display: none;
}

.status_item_review {
display: flex;
align-items: center;
justify-content: flex-end;
padding: 15px;
}

.status_item_review_title {
color: var(--design-bg);
cursor: pointer;
font-size: 14px;
text-transform: uppercase;
font-weight: 600;
}

.status_dropdown_item_rigth {
width: 100%;
}

.status_dropdown_blog_list {
width: 100%;
height: 100%;
padding: 5px;
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
display: flex;
align-items: start;
justify-content: space-between;
}

.cabinet_status_blog_item {
margin-bottom: 20px;
}

.status_dropdown_list_item {
display: flex;
}

.status_dropdown_amount {
width: 25%;
display: flex;
flex-direction: column;
justify-content: space-around;
}

.status_dropdown_amount .status_dropdown_list_item {
gap: 15px;
}

.status_dropdown_amount .status_blog_list_title{
width: auto !important;
}

.status_dropdown_price {
width: 25%;
display: flex;
align-items: center;

}

.status_dropdown_list_item>.status_blog_list_right {
font-size: 14px !important;
}

.cabinet_status_blog_item:last-child {
margin-bottom: 0;
}

.status_blog_list_item, .status_dropdown_amount_item {
display: flex;
gap: 20px;
margin-bottom: 5px;
}

.status_dropdown_amount_item {
flex-direction: column;
gap: 0px;
width: 25%;
}

.status_dropdown_amount_title {
font-size: 16px;
}

.status_dropdown_amount_right {
font-size: 16px;
font-weight: 500;
}

.status_blog_list_title {
opacity: 1;
font-size: 16px;
width: 20%;
}

.status_blog_list_star {
display: flex;
align-items: center;
gap: 2px;
font-size: 16px;
}

.status_blog_list_status {
display: flex;
align-items: center;
gap: 10px;    
}

.status_blog_list_name {
font-size: 16px;
font-weight: 500;
color: black;
}

.status_blog_item {
padding: 3px 10px;
border-radius: var(--border-px);
font-size: 16px;  
width: max-content;  
display: flex;
align-items: center;
justify-content: center;
border: none;
}

.status_blog_list_active {
background: rgb(1, 149, 1);
color: white;
}

.status_blog_list_close {
background: rgb(248, 2, 2);
color: white;
}

.status_blog_list_expected {
background: rgb(186, 186, 186);
color: white;
}

.status_blog_list_onway {
background: rgb(13, 76, 235);
color: white;
}

.status_blog_list_collecting{
background: rgb(11, 164, 230);
color: white;
}

.status_blog_list_right {
color: black;
font-weight: 500;
}


.status_dropdown_header {
padding: 9px 20px;
display: flex;
align-items: center;
justify-content: space-between;
cursor: pointer;
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.status_dropdown_icon {
font-size: 20px;
transition: 0.2s ease;
}

.status_dropdown_active .status_dropdown_icon {
transform: rotate(180deg);
transition: 0.2s ease;
}

.status_dropdown {
display: none;
}

.status_dropdown_title {
font-size: 14px;
opacity: 0.8;
}

.status_dropdown_item {
position: relative;
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
margin-bottom: 10px;
}

.status_dropdown_checkbox {
position: absolute;
top: 5px;
right: 5px;
height: 100%;

}

.status_dropdown_header>div {
pointer-events: none !important;
}

.status_dropdown_promt {
font-size: 14px;
opacity: 0.8;

}

.status_dropdown_right {
gap: 10px;
}

.status_dropdown_item:last-child {
margin-bottom: 0;
}

.status_dropdown_item_content {
display: flex;
gap: 10px;
}

.status_dropdown_item_img {
max-width: 100px;
padding: 5px;
}

.userinfo_title {
font-weight: 600;
font-size: 18px;
}

.userinfo {
padding-left: 0px;
}

.userinfo_item {
margin-bottom: 10px;
}

.userinfo__content {
border: 1px solid rgba(0, 0, 0, 0.12);
padding: 20px;
}

.userinfo_list {
margin-top: 10px;
display: flex;
flex-wrap: wrap;
gap: 15px;
width: 70%;
}

.userinfo_list_item {
margin-bottom: 10px;
}

.userinfo_item_title {
color: rgba(0, 0, 0, 0.6);
font-size: 14px;
}

.userinfo_item_input input {
border: 1px solid rgba(0, 0, 0, 0.12);
font-weight: 400;
height: 2.5rem;
border-radius: var(--border-px);
color: rgba(0, 0, 0, 0.87);
}

.userinfo_button {
margin-top: 20px;
}

.userinfo_button input,
.status_dropdown_btn {
background: var(--design-bg);
padding: 5px 15px;
color: white;
border: none;
border-radius: var(--border-px);
transition: 0.2s ease;
}

.userinfo_button input:hover {
opacity: 0.8;
transition: 0.2s ease;
}

/* banner_setting */

.banner_manually {
border: 1px solid rgba(0, 0, 0, 0.12);
}

.banner_title {
padding-left: 20px;
padding-right: 20px;
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
padding-top: 4px;
padding-bottom: 4px;
font-size: 18px;
font-weight: 600;
}

.banner_setting {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
overflow: hidden;
padding: 15px;
}

.banner_setting_left {
display: flex;
height: 100%;
width: 100%;
}

.banner_setting_flex {
display: flex;
gap: 20px;
height: 100%;
width: 100%;

}

.banner_setting_item {
width: 50%;
}

.banner_setting_input {
margin-bottom: 15px;
}

.banner_setting_title {
color: rgba(0, 0, 0, 0.6);
font-size: 14px;
}

.banner_setting_text {
font-size: 14px;
max-width: 350px;
}

.banner_setting_input input,
.banner_setting_input textarea {
background: transparent;
display: inline-block;
max-width: 302px;
width: 100%;
line-height: 22px;
padding: 10px;
vertical-align: middle;
border-radius: var(--border-px);
background: #fff;
border: 1px solid #d7d7d7;
-webkit-transition: border 0.2s linear 0s;
transition: border 0.2s linear 0s;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

.banner_setting_right {
position: relative;
z-index: 100;
display: flex;
align-items: end;
justify-content: end;
height: 100%;
}

.banner_demo {
max-width: 88%;
height: 380px;
padding: 15px;
}

.banner_mine {
margin-top: 20px;
border: 1px solid rgba(0, 0, 0, 0.12);
}

.banner_mine_info, .banner2_mine_info {
padding: 15px;
}


.banner_checkbox {
gap: 10px;
}

.banner_tabs {
display: flex;
align-items: center;
}

.banner_item {
padding: 10px;
border: 1px solid rgba(0, 0, 0, 0.12);
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
font-weight: 500;
color: rgba(0, 0, 0, 0.6);
cursor: pointer;
max-width: 180px;
width: 100%;
height: 40px;
}

.banner_item_active {
background: rgba(0, 0, 0, 0.12);

}

.banner_header {
display: flex;
align-items: center;
justify-content: space-between;
}

.banner_button {
display: flex;
align-items: center;
justify-content: end;
padding: 10px;
}

.banner_btn {
padding: 10px 20px;
background-color: var(--design-bg);
color: #fff;
opacity: 1;
border-radius: var(--border-px);
transition: 0.2s ease;
text-align: center;
border: none;
}

.banner_blog {
display: none;
}

.report-dropdown {
position: relative;
max-width: 250px;
width: 100%;
height: 40px;
text-align: left;
cursor: pointer;
background: white;
border: 1px solid var(--design-bg);
color: black;
padding: 8px 12px;
font-size: 14px;
}

.report_option {
height: 100%;
display: flex;
align-items: center;
overflow: hidden;
}

.report-dropdown.report-active-creation .report_ul {
display: block;
left: 0px;
top: 100%;
position: absolute;
z-index: 1100;
transition: height 0.2s ease 0s;
cursor: pointer;
background: white;
border: 1px solid var(--design-bg);
min-width: 100%;
overflow-x: hidden;
}

.report-li {
padding: 5px;
}

.report-li:hover {
background: var(--design-bg);
color: white;
}

.product-main-name {
font-size: 16px;
}

.report-dropdown .report_ul {
position: relative;
top: 55px;
left: 0;
width: 100%;
background: #fff;
display: none;
}

.report-dropdown .report_option:before {
content: "";
position: absolute;
top: 40%;
right: 18px;
width: 4px;
height: 4px;
border: 4px solid;
border-color: transparent transparent var(--design-bg) var(--design-bg);
transform: rotate(-45deg);
}

.report-dropdown.report-active-creation .report_option:before {
top: 46%;
transform: rotate(-225deg);
}

.сancel_order_title {
font-size: 16px;
font-weight: 500;
margin-bottom: 10px;
margin-top: 10px;
}

.сancel_order_textarea {
border: 1px solid var(--design-bg);
}

.status_user_item {
display: flex;
align-items: center;
gap: 10px;
}

.cabinet_status_user {
padding: 5px;
width: 67%;
gap: 20px;
display: flex;
align-items: center;
justify-content: space-between;
}



.status_user_grade {
display: flex;
align-items: center;
gap: 3px;
}

.status_user_title {
opacity: 0.5;
font-size: 16px;
}

.status_user_value {
font-size: 16px;
}

.status_user_btn {
font-size: 14px;
opacity: 0.8;
cursor: pointer;
padding-right: 10px;
}

.status_user_btn:hover {
color: var(--design-bg);
}

.status_user_grade_icon {
color: rgb(255 194 0);
}

.status_blog_btn {
background: var(--design-bg);
border-radius: var(--border-px);
color: white;
padding: 5px 15px;
border: none;
}

.setting_text_flex {
display: flex;
align-items: center;
gap: 10px;
}

.setting_text_checkbox {
display: flex;
align-items: center;
gap: 2px;
}

.setting_text_checkbox input {
display: none;
}

.setting_text_checkbox label {
border: 1px solid var(--design-bg);
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
color: white;
width: 20px;
height: 20px;
margin: 5px;
cursor: pointer;
}

.setting_text_checkbox input:checked + .setting_text_label {
background: var(--design-bg);
}

.text_black {
color: #000 !important;
}

.text_white {
color: white !important;
}

@media (min-width: 576px) {
.user_grade_dialog {
max-width: 800px !important;
}
}

.grade_item_header {
display: flex;
align-items: center;
justify-content: space-between;
height: 50px;
}

.grade_item_header>div {
pointer-events: none;
}

.grade_header_col {
font-weight: 500;
font-size: 16px;
display: flex;
align-items: center;
gap: 2px;
}

.grade_header_icon {
font-size: 18px;
}

.grade_dropdown_avitve .grade_header_icon {
transform: rotate(180deg);
transition: 0.2s ease;
}

.grade_item_dropdown {
display: none;
}

.grade_modal_header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 10px;
margin-top: 10px;
}

.setting__banner_blog {
position: relative;
z-index: 100;
padding: 18px;
max-width: 550px;
width: 100%;
height: 100%;
}

.setting__banner_blog .header__banner_title {
font-size: 24px;
}

.setting__banner_blog .banner_oldprice {
font-size: 30px;
}

.setting__banner_blog .banner_newprice {
font-size: 25px;
height: 45px;
}

.setting__banner_blog .banner_newprice_sale {
top: -28px;
font-size: 22px;
}

.error_banner {
color: red;
font-size: 14px;
}

.discount_checkbox {
border: 1px solid var(--design-bg);
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
color: white;
width: 20px;
height: 20px;
margin: 5px;
cursor: pointer;
}

.discount_checkbox i,
.banner_blog_checkbox input,
.banner_foto input,
#banner_foto_delete, #banner2_foto_delete, #new_banner_foto_delete, #new_banner2_foto_delete {
display: none;
}

.banner_foto {
display: flex;
align-items: center;
gap: 10px;
}

#banner_discount_checkbox1:checked+.discount_checkbox {
background: var(--design-bg);
}

#banner_discount_checkbox1:checked+.discount_checkbox i {
display: block;
}

#banner2_discount_checkbox1:checked+.discount_checkbox {
background: var(--design-bg);
}

#banner2_discount_checkbox1:checked+.discount_checkbox i {
display: block;
}

#banner_discount_checkbox2:checked+.discount_checkbox {
background: var(--design-bg);
}

#banner_discount_checkbox2:checked+.discount_checkbox i {
display: block;
}

#banner2_discount_checkbox2:checked+.discount_checkbox {
background: var(--design-bg);
}

#banner2_discount_checkbox2:checked+.discount_checkbox i {
display: block;
}

.blog_disabled {
pointer-events: none;
opacity: 0.5;
}

.banner_foto_add,
.banner_foto_delete {
padding: 5px 10px;
background-color: var(--design-bg);
color: #fff;
opacity: 1;
border-radius: var(--border-px);
transition: 0.2s ease;
text-align: center;
border: none;
cursor: pointer;
}

.banner_foto_delete {
background: red;
}



.gradient_content {
margin-top: 10px;
}

.gradient {
width: 200px;
height: 150px;
background: red;
position: relative;

}

.overlay {
width: 100%;
height: 100%;
position: absolute;
pointer-events: none;
background: linear-gradient(to right, #fff 0%, rgba(255, 255, 255, 0) 99%);
z-index: 0;
}

.overlay:nth-child(2) {
z-index: 1;
background: linear-gradient(to bottom, transparent 0%, #000 100%);
box-shadow: inset 0 0 10px 0px rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(0, 0, 0, 0.1);
}

.picker {
position: absolute;
width: 14px;
height: 14px;
cursor: pointer;
z-index: 3;
}

.picker .inner {
width: 100%;
height: 100%;
border: 2px solid #fff;
box-sizing: border-box;
border-radius: 50%;
box-shadow: 0 0 10px rgb(0, 0, 0, 0.2);
background: #fff;

}

.slider_bg {
width: 200px;
position: relative;
border: 1px solid #e0e0e0;
}

.track {
width: 100%;
height: 11px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: rgb(255, 0, 0);
background: linear-gradient(90deg, rgba(255, 0, 0, 1) 0%, rgba(255, 255, 0, 1) 16.66%, rgba(0, 255, 0, 1) 33.33%, rgba(0, 255, 255, 1) 50%, rgba(0, 0, 255, 1) 66.66%, rgba(255, 0, 255, 1) 83.33%, rgba(255, 0, 0, 1) 100%);
}

.thumb {
position: relative;
width: 14px;
height: 14px;
border-radius: var(--border-px);
background: #fff;
box-shadow: 0 0 6px rgb(0, 0, 0, 0.2);
cursor: pointer;
}

.rgb {
font-size: 12px;
}

.gradient2, .gradient3 {
width: 200px;
height: 150px;
background: red;
position: relative;
}

.overlay2, .overlay3 {
width: 100%;
height: 100%;
position: absolute;
pointer-events: none;
background: linear-gradient(to right, #fff 0%, rgba(255, 255, 255, 0) 99%);
z-index: 0;
}

.overlay2:nth-child(2), .overlay3:nth-child(2) {
z-index: 1;
background: linear-gradient(to bottom, transparent 0%, #000 100%);
box-shadow: inset 0 0 10px 0px rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(0, 0, 0, 0.1);
}

.picker2, .picker3 {
position: absolute;
width: 14px;
height: 14px;
cursor: pointer;
z-index: 3;
}

.picker2 .inner2, .picker3 .inner3  {
width: 100%;
height: 100%;
border: 2px solid #fff;
box-sizing: border-box;
border-radius: 50%;
box-shadow: 0 0 10px rgb(0, 0, 0, 0.2);
background: #fff;
}

.slider_bg2, .slider_bg3 {
width: 200px;
position: relative;
border: 1px solid #e0e0e0;
}

.track2, .track3 {
width: 100%;
height: 11px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: rgb(255, 0, 0);
background: linear-gradient(90deg, rgba(255, 0, 0, 1) 0%, rgba(255, 255, 0, 1) 16.66%, rgba(0, 255, 0, 1) 33.33%, rgba(0, 255, 255, 1) 50%, rgba(0, 0, 255, 1) 66.66%, rgba(255, 0, 255, 1) 83.33%, rgba(255, 0, 0, 1) 100%);
}

.thumb2, .thumb3 {
position: relative;
width: 14px;
height: 14px;
border-radius: var(--border-px);
background: #fff;
box-shadow: 0 0 6px rgb(0, 0, 0, 0.2);
cursor: pointer;
}

.rgb2, .rgb3 {
font-size: 12px;
}


.search_card {
max-width: 250px;
width: 100%;
padding-left: 10px;
padding-right: 10px;
cursor: pointer;
}

.search_card_active .product-slider-item-blog{
border: 1px solid var(--design-bg);
}



/* banner_setting ...... */

/* review_modal_dialog */

@media (min-width: 576px) {
.review_modal_dialog {
max-width: 1100px !important;
}
}

.review_modal_title {
font-size: 22px;
font-weight: 600;
text-align: center;
}

.review_modal_item {
display: flex;
align-items: center;
gap: 20px;
margin-bottom: 10px;
}

.review_product_item {
margin-top: 10px;
margin-bottom: 10px;
display: flex;
justify-content: space-between;
gap: 10px;
}

.review_product_list div{
font-size: 14px ;
padding: 0px;
}

.review_modal_item_title {
font-size: 20px;
font-weight: 600;
}


.review_modal_item_star i, .status_blog_item_star i {
cursor: pointer;
padding: 2px;
font-size: 20px;
}

.review_star_active {
color: var(--design-bg);
}

.review_star_hover {
color: var(--design-bg);
}

.review_product_left {
display: flex;
justify-content: space-between;
gap: 15px;
width: 30%;
}

.review_product_center {
width: 29%;
}

.review_product_right {
width: 32%;
}

.review_product_list .status_blog_list_title{
width: 32%;
}

.review_product_img {
width: 33%;
height: 100px;
}

.review_product_info {
width: 84%;
}

.review_product_textarea {
width: 100%;
}

.review_product_textarea textarea{
min-height: 100px;
max-height: 100px;
width: 100%;
}

.review_product_foto {
display: flex;
align-items: center;
gap: 12px;
}

.review_foto_item {
position: relative;
}

.review_foto_item input{
display: none;
}

.review_foto_item label {
position: relative;
width: 100px;
height: 100px;
background: #9c9c9c;
cursor: pointer;

}

.review_foto_item label:before {
color: white;
content: "Фото";
position: absolute;
top: 0;
left: 0;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
text-align: center;
width: 100%;
height: 100%;
z-index: 1;
}

.review_foto_item label img {
width: 100%;
height: 100%;
display: none;
position: relative;
z-index: 50;
}

.review_foto_close {
position: absolute;
top: -4px;
right: -4px;
cursor: pointer;
height: 22px;
width: 22px;
color: white;
background-color: #bdbdbd;
border-radius: 100px;
padding: 4px;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
opacity: 0;
visibility: hidden;
z-index: -1;
}

.review_foto_show {
opacity: 1;
visibility: visible;
z-index: 100;
}

.review_foto_close:hover {
background: var(--design-bg);
}

.textarea_disabled, .product_foto_disabled {
pointer-events: none;
opacity: 0.5;
}

.review_label_close::before {
z-index: -1 !important;
}

.status_cause_modal {
color: var(--design-bg);
cursor: pointer;
}

.user_message_text {
margin-top: 20px;
}

.canvasjs-chart-credit, .header__content_exit {
display: none;
}



.exit_link {
font-size: 24px;
color: rgb(255, 10, 10);
}

/* review_modal_dialog ...... */

/* heart */

.heart {
min-height: 70vh;
}

.heart_flex {
display: flex;
flex-wrap: wrap;
gap: 15px;
}

.heart_flex {
margin-top: 20px;
}

.heart_title {
font-size: 25px;
font-weight: 500;
}

.heart_flex .product-slider-item{
max-width: 250px;
width: 100%;
}

/* heart ...... */

/* kass */

.kass_header {
display: flex;
align-items: center;
justify-content: space-between;
}

.kass_shop {
display: flex;
align-items: self-end;
gap: 20px;
width: 50%;
}

.kass_shop_left {
width: 50%;
}

.kass_search {
max-width: 280px;
width: 100%;

}

.kass_button {
display: flex;
align-items: center;
gap: 15px;
}

.kass_btn {
font-size: 16px;
line-height: 20px;
font-weight: 500;
text-align: center;
border-radius: var(--border-px);
width: 100%;
height: 44px;
padding: 0 14px;
background: var(--design-bg);
color: white;
border: none;
transition: 0.2s ease;
display: flex;
align-items: center;
justify-content: center;
}

.kass_btn:hover {
opacity: 0.8;
transition: 0.2s ease;
}

.kass_title {
margin-top: 40px;
font-size: 18px;
font-weight: 600;
}

.kass_list {
margin-top: 15px;
}

.kass_item_flex {
display: flex;
align-items: center;
gap: 5px;
}

.kass_list {
display: flex;
gap: 20px;
flex-wrap: wrap;
}

.kass_checkbox input{
display: none;
}

.kass_checkbox label {
background: transparent;
border: 2px solid rgb(77 67 193);
border-radius: var(--border-px);
cursor: pointer;
height: 18px;
width: 18px;
display: flex;
align-items: center;
justify-content: center;
}

.kass_checkbox label i {
display: none;
color: white;
font-size: 14px;
}

.kass_checkbox input:checked +  label {
background: #6e00ff;
border: 0;
}

.kass_checkbox input:checked +  label i {
display: block;
}

/* kass ...... */

/* setting */

.setting_site_content {
max-width: 70%;
}

.setting_messeg, .setting_logo, .setting_bg, .setting_contact {
margin-top: 20px;
}

.setting_logo_item {
display: flex;
align-items: center;
gap: 15px;
margin-top: 10px;
}

.setting_title {
font-size: 20px;
font-weight: 600;
padding-bottom: 5px;
margin-top: 27px;

}

.setting_width {
position: relative;
background: #838383;
border-radius: 8px;
width: 100%;
}

.setting_width img{
width: 100%;
height: 100%;
}

.width_item1 {
width: 80px;
height: 80px;
}

.width_item2 {
width: 130px;
height: 45px;
}

.setting_flex {
display: flex;
flex-wrap: wrap;
gap: 15px;
}

.setting_bg_info {
display: flex;
align-items: center;
gap: 15px;
}

.setting_bg_header {
display: flex;
align-items: center;
gap: 10px;
}

.setting_contact_item {
margin-top: 10px;
}

.setting_bg_val {
width: 30px;
height: 30px;
border: 1px solid rgba(0, 0, 0, 0.12);
}

.time_input{
max-width: 62px !important;
width: 100% !important;
}

.contact_item_input {
width: max-content;
display: flex;
align-items: center;
gap: 10px;
}

.contact_item_input input{
height: 35px !important; 
}

.setting_row {
display: flex;
flex-wrap: wrap;
gap: 10px;
}

.time_flex {
display: flex;
align-items: center;
gap: 10px;
}

.setting_contact_item {
width: 33%;
}

.setting_checkbox input, .setting_file input{
display: none;
}

.setting_checkbox .setting_checkbox_lab {
width: 20px;
height: 20px;
border: 1px solid var(--design-bg);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}

.setting_checkbox_lab i {
display: none;
color: white;
}

.setting_checkbox input:checked + .setting_checkbox_lab {
background: var(--design-bg);
}

.setting_checkbox input:checked + .setting_checkbox_lab i{
display: block;
}

.setting_file label{
background: var(--design-btn);
color: white;
padding: 5px 15px;
cursor: pointer;
}

.banner_blog_checkbox input:checked+.discount_checkbox {
background: var(--design-bg);
}

.banner_blog_checkbox input:checked+.discount_checkbox i {
display: block;
}

.width_img_delete {
position: absolute;
top: -5px;
right: -5px;
width: 20px;
height: 20px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
color: white;
font-size: 14px;
background: red;
cursor: pointer;
}

.setting_bg_item {
margin-top: 10px;
}

.setting_bg_input {
width: max-content;
}

.setting_bg_input input{
max-width: 250px;
height: 30px;
}

.setting_message_item {
position: relative;
display: flex;
align-items: center;
gap: 10px;
margin-top: 10px;
width: max-content;
}

.setting_message_logo {
max-width: 30px;
width: 100%;
}

.setting_message_input input {
height: 35px;
}



.setting_message_checkbox input{
display: none;
}

.message_checkbox_lab {
position: relative;
width: 50px;
height: 25px;
border: 1px solid rgb(215, 215, 215);
border-radius: 16px;
cursor: pointer;
}

.message_checkbox_lab::before {
position: absolute;
content: "";
top: 4px;
left: 5px;
width: 15px;
height: 15px;
background: var(--design-bg);
z-index: 10;
border-radius: 50%;
cursor: pointer;
transition: 0.2s ease;
}

.setting_message_checkbox input:checked + .message_checkbox_lab::before{
left: 56%;
transition: 0.2s ease;
background: white;
}

.setting_message_checkbox input:checked + .message_checkbox_lab {
background: rgb(123, 165, 123);
}

.message_checkbox_title {
position: absolute;
top: -30px;
right: -82px;
}

.setting_message_error {
color: red;
font-weight: 500;
font-size: 16px;
margin-top: 10px;
}

.setting_message_error {
display: none;
}

.banner_h {
height: 40px;
}

/* setting...... */

/* setProduct */


.product_add {
max-width: 220px;
}

.product_add_content {
display: flex;
justify-content: space-between;
gap: 50px;
margin-top: 10px; 
}

.product_add_left {
width: 70%;
}

.product_add_right {
width: 30%;
}

.prod_add_item_title {
font-size: 18px;
font-weight: 600;
}

.product_add_title {
margin-top: 10px;
text-align: center;
font-weight: 600;
}

.product_info_list {
border: 1px solid rgba(0, 0, 0, 0.12);
padding: 6px;
}

.product_info_list_item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px;
border-bottom: 1px solid rgba(0, 0, 0, 0.12);

}

.product_info_item_title {
font-weight: 500;
}

.product_add_item, .product_card {
border: 1px solid rgba(0, 0, 0, 0.12);
padding: 10px;

}

.prod_add_coteg_btn {
max-width: 220px;
cursor: pointer;
}

.coteg_modal_flex {
display: flex;
}

.coteg_modal_blog {
width: 50%;
}

.coteg_modal_blog:nth-child(1) {
border-right: 1px solid var(--design-bg);
}

.coteg_modal_item, .subcateg_modal_item {
padding: 10px 25px;
border-bottom: 1px solid var(--design-bg);
cursor: pointer;
text-align: center;
}

.coteg_modal_title {
padding: 10px 25px;
font-size: 18px;
font-weight: 600;
background: rgba(0, 0, 0, 0.12);

text-align: center;
}

.coteg_modal_button {
display: flex;
align-items: center;
justify-content: flex-end;
margin-top: 20px;
}

.coteg_modal_active {
background: var(--design-bg);
color: white;
}

.add_coteg_search{
margin-bottom: 10px;
}

.add_result_item_blog {
font-weight: 600;
}

.add_result_item_blog span {
font-weight: 400;
}
@media (min-width: 576px) {
.measurement_modal_dialog {
max-width: 515px !important;
}    
}

.measurement_list {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}

.measurement_item {
max-width: 180px;
border: 1px solid var(--design-bg);
padding: 5px 15px;
cursor: pointer;
transition: 0.2s ease;

}

.measurement_item:hover {
background: var(--design-bg);
color: white;
transition: 0.2s ease;
}

.measurement_item_flex {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
}

.prod_add_item_input input[type="number"] {
display: inline-block;
width: 302px;
height: 46px;
line-height: 22px;
padding: 10px;
vertical-align: middle;
border-radius: 2px;
background: #fff;
border: 1px solid #d7d7d7;
}

.formation_item {
display: flex;
align-items: end;
justify-content: space-between;
margin-bottom: 15px;
}

.formation_blog_input {
position: relative;
}

.formation_blog_input input {
max-width: 150px;
width: 100%;
height: 46px;
border-radius: 2px;
padding: 10px;
background: #fff;
border: 1px solid #d7d7d7;
}

.formation_procent_list {
display: flex;
align-items: center;
gap: 5px;
margin-bottom: 10px;
}

.procent_item {
padding: 5px;
border: 1px solid var(--design-bg);
display: flex;
align-items: center;
justify-content: center;
width: 35px;
height: 35px;
font-size: 14px;
cursor: pointer;
}

.procent_item_icon {
font-size: 20px;
}



.nds_checkbox_label {
position: relative;
width: 50px;
height: 25px;
border: 1px solid rgb(215, 215, 215);
border-radius: 16px;
}

.nds_checkbox_label::before {
position: absolute;
content: "";
top: 4px;
left: 5px;
width: 15px;
height: 15px;
background: var(--design-bg);
z-index: 10;
border-radius: 50%;
cursor: pointer;
transition: 0.2s ease;
}

.nds_checkbox {
display: none;
}

.formation_blog_nds {
display: flex;
align-items: center;
gap: 5px;
}

.nds_checkbox:checked + .nds_checkbox_label::before{
left: 56%;
transition: 0.2s ease;
background: white;
}

.nds_checkbox:checked + .nds_checkbox_label {
background: rgb(123, 165, 123);
}

.formation_roundUp {
position: absolute;
top: 0;
right: -17%;
}

.formation_roundUp_item:nth-child(1) {
background: #008000
}

.formation_roundUp_item:nth-child(2) {
margin-top: 10px;
background: #ff0000;
}

.formation_roundUp_item {
padding: 5px;
color: white;
display: flex;
align-items: center;
justify-content: center;
width: 20px;
height: 20px;
cursor: pointer;
border-radius: 50%;
font-size: 14px;
}

.prod_add_result_flex {
display: flex;
gap: 15px;
}

.formation_well {
font-weight: 600;
font-size: 16px;
text-align: center;
}

.foto_item input{
display: none;
}

.foto_list {
display: flex;
align-items: center;
gap: 10px;
}

.foto_item {
position: relative;
max-width: 100px;
width: 100%;
}

.foto_item_label {
max-width: 100px;
width: 100%;
height: 100px;
border-radius: 8px;
background: #838383;
overflow: hidden;
cursor: pointer;
}

.foto_item_label::before {
color: white;
content: "Фото";
position: absolute;
top: 0px;
left: 0px;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
text-align: center;
width: 100%;
height: 100%;
z-index: 1;
}

.result_label_close::before {
z-index: -1 !important;
}

.foto_item_img {
width: 100%;
height: 100%;
display: none;
}

.result_foto_delete {
position: absolute;
top: -5px;
right: -5px;
width: 20px;
height: 20px;
display: flex;
align-items: center;
justify-content: center;
padding: 10px;
background: #ebebeb;
border-radius: 50%;
font-size: 12px;
opacity: 0;
visibility: hidden;
z-index: -1;
cursor: pointer;
}

.result_foto_show {
opacity: 1;
visibility: visible;
z-index: 100;
}

.result_foto_delete:hover {
background: #ff0000;
color: white;
}

.product_add_button {
display: flex;
align-items: center;
justify-content: flex-end;
}

.product_card_title {
font-size: 18px;
font-weight: 600;
text-align: center;
}

.product_card_result {
display: flex;
align-items: center;
justify-content: center;
}

.change_prod_top {
margin-bottom: 15px;
}


.content_search_card {
display: none;
}

.delete_product_btn {
font-size: 16px;
line-height: 20px;
font-weight: 500;
text-align: center;
border-radius: var(--border-px);
max-width: 150px;
width: 100%;
height: 44px;
padding: 0 14px;
background: var(--design-bg);
color: white;
border: none;
transition: 0.2s ease;
display: flex;
align-items: center;
justify-content: center;
}

.btn_red {
background: #ff0000;
}
.delete_product_button {
display: flex;
align-items: center;
justify-content: flex-end;
padding: 15px;
gap: 20px;
}

/* setProduct......  */

@media (min-width: 768px) and (max-width: 1024px)  {

/* flex */

.mob_statuc {
display: block;
}

.status_user_item:nth-child(1), .status_user_item:nth-child(2), .status_user_item:nth-child(3)  {
display: none;
}

.status_dropdown_blog_list {
justify-content: space-between;
}

.kass_header {
align-items: unset;
}

.kass_header {
flex-direction: column;
}

.cabinet_status_user, .kass_button{
justify-content: flex-end;
}

.status_dropdown_amount_item {
justify-content: center;
}

.status_dropdown_amount_item {
align-items: unset;
}

.status_dropdown_amount_item {
flex-direction: column;
}

.status_blog_list_item {
gap: 100px;
}

.review_product_left {
gap: 10px;
}

.status_dropdown_amount_item {
gap: 8px;
}

.status_dropdown_item_content {
gap: 0;
}

/* flex finsish */

/* width */

.kass_btn {
width: max-content;
}

.review_product_right {
width: 45%;
}

.status_blog_list_title {
width: 35%;
}



/* width finsish */

/* height */

/* height finsish */

/* active */

/* active finsish */

/* position */

/* position finsish */

/* font-size */

.review_modal_item_star i, .status_blog_item_star i {
font-size: 16px;
}

.status_blog_list_name {
font-size: 12px;
}

/* font-size finsish */

/* padding */

/* padding finsish */

/* margin */

.kass_button {
margin-top: 15px;
}

/* margin finsish */


}

@media (min-width: 568px) and (max-width: 767px)  {

/* flex */

.header__content_exit, .mob_statuc {
display: block;
}

.cabinet_item_exit, .status_user_item:nth-child(1), .status_user_item:nth-child(2), .status_user_item:nth-child(3)  {
display: none;
}

.status_dropdown_blog_list {
justify-content: space-between;
}

.status_dropdown_amount_item {
justify-content: center;
}

.kass_header {
flex-direction: column;
}

.cabinet_status_user, .kass_button{
justify-content: flex-end;
}

.status_dropdown_amount_item, .kass_header {
align-items: unset;
}

.status_dropdown_amount_item {
flex-direction: column;
}

.review_product_item {
flex-wrap: wrap;
}

.status_blog_list_item {
gap: 50px;
}

.review_product_left {
gap: 10px;
}

.status_dropdown_amount_item {
gap: 8px;
}

.status_dropdown_item_content {
gap: 0;
}

/* flex finsish */

/* width */

.kass_btn {
width: max-content;
}

.banner2_default img, .kass_shop {
width: 100%;
}

.review_product_left {
width: 55%;
}

.review_product_right {
width: 45%;
}

.status_blog_list_title {
width: 35%;
}

.banner_item {
max-width: 140px;
}

/* width finsish */

/* height */

/* height finsish */

/* active */

/* active finsish */

/* position */

/* position finsish */

/* font-size */

.cabinet_title {
font-size: 20px;
}

.setting__banner_blog .header__banner_title {
font-size: 18px;
}


.review_modal_item_star i, .status_blog_item_star i, .cabinet_status_id, .review_modal_item_title, .banner_item {
font-size: 16px;
}

.status_blog_list_right, .status_blog_item, .status_dropdown_amount_title, .status_dropdown_amount_right, .user_message_title, .user_message_date, .banner_setting_input input, .banner_setting_input textarea  {
font-size: 14px;
}

.status_blog_list_name {
font-size: 11px;
}

/* font-size finsish */

/* padding */

/* padding finsish */

/* margin */

.cabinet {
margin-top: 0;
}

.cabinet_title {
margin: 1rem 0 1rem 0;
}

.kass_button {
margin-top: 15px;
}

/* margin finsish */


}

@media (min-width: 480px) and (max-width: 567px)  {

/* flex */

.header__content_exit, .mob_statuc {
display: block;
}

.cabinet_item_exit, .status_user_item:nth-child(1), .status_user_item:nth-child(2), .status_user_item:nth-child(3)  {
display: none;
}

.status_dropdown_blog_list {
justify-content: space-between;
}

.status_dropdown_amount_item {
justify-content: center;
}

.cabinet_status_user, .kass_button{
justify-content: flex-end;
}

.status_dropdown_amount_item, .kass_header {
align-items: unset;
}

.status_dropdown_amount_item, .banner_setting_flex, .kass_header {
flex-direction: column;
}



.review_product_item {
flex-wrap: wrap;
}

.status_blog_list_item {
gap: 30px;
}

.review_product_left {
gap: 10px;
}

.status_dropdown_amount_item {
gap: 8px;
}

.status_dropdown_item_content, .header__cotegory_flex {
gap: 0;
}

/* flex finsish */

/* width */

.kass_btn {
width: max-content;
}

.banner_setting_item, .banner2_default img, .kass_shop  {
width: 100%;
}

.review_product_left {
width: 55%;
}

.review_product_right, .cabinet_status_user {
width: 45%;
}

.review_product_center {
width: 41%;
}

.status_blog_list_title {
width: 35%;
}

/* width finsish */

/* height */

.kass_btn {
height: 40px;
}

/* height finsish */

/* active */

/* active finsish */

/* position */

.setting__banner_blog .banner_newprice_sale {
top: -17px;
font-size: 15px;
}

/* position finsish */

/* font-size */

.cabinet_title {
font-size: 20px;
}

.setting__banner_blog .header__banner_title, .setting__banner_blog .banner_oldprice, .setting__banner_blog .banner_newprice {
font-size: 18px;
}

.review_modal_item_star i, .status_blog_item_star i, .cabinet_status_id, .review_modal_item_title {
font-size: 16px;
}

.status_blog_list_right, .status_blog_item, .status_dropdown_amount_title, .status_dropdown_amount_right,  .status_blog_list_title, .user_message_title, .user_message_date, .kass_btn{
font-size: 14px;
}

.status_blog_list_name {
font-size: 11px;
}

/* font-size finsish */

/* padding */

.cabinet_status_item, .cabinet_status_link {
padding: 7px;
}

.cabinet_status_blog_list  {
padding: 12px;
}

/* padding finsish */

/* margin */

.cabinet, .cabinet_flex {
margin-top: 0;
}

.cabinet_title {
margin: 1rem 0 1rem 0;
}

.kass_button {
margin-top: 15px;
}

/* margin finsish */


}

@media (min-width: 320px) and (max-width: 479px)  {

/* flex */

.header__content_exit, .mob_statuc {
display: block;
}

.cabinet_item_exit, .cotegory-dropdown-title, .status_user_item:nth-child(1), .status_user_item:nth-child(2), .status_user_item:nth-child(3) {
display: none;
}

.status_dropdown_blog_list, .kass_button {
justify-content: space-between;
}

.status_dropdown_amount_item {
justify-content: center;
}

.status_dropdown_amount_item, .kass_header, .kass_shop{
align-items: unset;
}

.status_dropdown_amount_item, .banner_setting_flex, .kass_header, .kass_shop {
flex-direction: column;
}

.cabinet_status_user {
justify-content: flex-end;
}

.review_product_item {
flex-wrap: wrap;
}

.status_blog_list_item {
gap: 3px;
}

.review_product_left {
gap: 10px;
}

.status_dropdown_amount_item {
gap: 8px;
}

.status_dropdown_item_content {
gap: 0;
}

/* flex finsish */

/* width */

.kass_btn {
width: max-content;
}

.banner_setting_item, .kass_shop{
width: 100%;
}

.banner2_default img {
width: 60%;
}

.review_product_left {
width: 55%;
}

.review_product_right, .cabinet_status_user {
width: 45%;
}

.review_product_center {
width: 41%;
}

.status_blog_list_title {
width: 35%;
}

.kass_search {
max-width: 100%;
}

.time_input {
max-width: unset !important;
width: 68px !important;
}

.heart_flex .product-slider-item {
max-width: 47%;
}

.banner_item {
max-width: 125px;
}

.header__cotegory-dropdown {
max-width: unset;
width: auto;
}

/* width finsish */

/* height */

.banner_demo {
height: 100%;
}

.content_search_slider .product-slider-item_relative {
height: 160px;
}

.content_search_slider .product-slider-item-blog {
min-height: 410px;
}

/* height finsish */

/* active */

/* active finsish */

/* position */

.setting__banner_blog .banner_newprice_sale {
top: -13px;
}

/* position finsish */

/* font-size */

.review_modal_item_title, .cabinet_title, .setting__banner_blog .header__banner_title, .setting__banner_blog .banner_oldprice, .setting__banner_blog .banner_newprice, .setting__banner_blog .banner_newprice_sale {
font-size: 16px;
}

.cabinet_item_exit, .cabinet_item, .cabinet_item_exit, .cabinet_status_id, .banner_item, .banner_setting_input input, .banner_setting_input textarea, .kass_btn {
font-size: 14px;
}

.cabinet_status_item, .cabinet_status_link {
font-size: 13px;
}

.status_blog_list_right, .status_blog_list_title, .status_blog_item, .status_dropdown_amount_title, .status_dropdown_amount_right, .status_item_review_title, .review_modal_item_star i, .status_blog_item_star i, .user_message_title, .user_message_date, .product-slider-item-name, .slider_tabs_text, .status_dropdown_title, .status_dropdown_promt{
font-size: 12px;
}

.status_blog_list_name, .discount_prise_percent  {
font-size: 10px;
}

/* font-size finsish */

/* padding */

.cabinet_status_item, .cabinet_status_link {
padding: 7px;
}

.product-slider-item-blog {
padding: 9px;
}

.cabinet_status_blog_list  {
padding: 12px;
}

.status_blog_btn {
padding: 5px;
}

.userinfo__content {
padding: 0px;
border: none;
}

.cabinet_status_id {
padding-left: 10px;
padding-right: 10px;
}

/* padding finsish */

/* margin */

.cabinet, .cabinet_flex, .user_message_text, .userinfo_button {
margin-top: 0;
}

.cabinet_title {
margin: 1rem 0 1rem 0;
}

.user_message_list, .kass_button {
margin-top: 15px;
}

/* margin finsish */

}

.pay {
margin-top: 30px;
margin-bottom: 30px;
min-height: 800px;
}

.pay_check {
font-size: 18px;
font-weight: 600;
margin-top: 30px;
}

.pay_title {
font-size: 24px;
font-weight: 600px;
}

.pay_flex{
display: flex;
justify-content: space-between;
gap: 20px;
margin-top: 30px;
}

.pay_left {
width: 70%;
}

.pay_right {
width: 30%;
}

.pay_info, .pay_price {
border: 1px solid rgba(118,121,127,0.2);
padding: 15px;
}

.pay_info_title {
font-size: 20px;
font-weight: 600;
}

.pay_tabs {
display: flex;
align-items: center;
gap: 20px;
}

.pay_tabs_item {
position: relative;
border-radius: var(--border-px);
background: #fff;
box-shadow: 0 10px 10px rgb(1 63 102 / 10%);
cursor: pointer;
max-width: 180px;
width: 100%;
height: 80px;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
opacity: 0.4;
transition: 0.2s ease;   
}

.pay_tabs_item_active {
opacity: 1;
transition: 0.2s ease;    
}

.pay_tabs_item_icon  {
position: absolute;
bottom: 5px;
right: 5px;
opacity: 0;
visibility: hidden;
z-index: -1;
transition: 0.2s ease;
}

.payin_item_icon_content {
width: 25px;
height: 25px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background: var(--design-bg);
color: white;
font-size: 18px;
}

.pay_tabs_item_active .pay_tabs_item_icon {
opacity: 1;
visibility: visible;
z-index: 10;
transition: 0.2s ease;
}

.pay_tabs_blog {
display: none;
}

.pay_tabs_info {
margin-top: 30px;
}

.pay_tabs_blog_flex {
display: flex;
align-items: center;
gap: 20px;

}

.pay_tabs_sumbit {
background: var(--design-bg);
padding: 3px 15px;
color: white;
border-radius: var(--border-px);
border: none;
font-size: 18px;
}
.pay_quar_title {
font-weight: 600px;
font-size: 20px;
}

.pay_quar_text {
color: #838383;
font-size: 16px;
margin-top: 10px;
}

.pay_quar_code {
display: flex;
align-items: center;

margin-top: 20px;
}

.pay_quar_code_img {
max-width: 300px;
}

.quarcode-error {
color: red;
margin-top: 20px;
}


.pay_check_list {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 15px;
}

.pay_check_item {
position: relative;
width: 30%;
cursor: pointer;
}

.pay_check_active .pay_item_content{
border: 2px solid var(--design-bg);
}

.pay_item_content {
border: 2px solid rgba(118,121,127,0.2);
}

.pay_check_header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 5px 10px;

}

.pay_check_btn {
cursor: pointer;
background: rgb(253, 4, 4);
color: white;
display: inline-block;
padding: 5px 10px;
cursor: pointer;
border-radius: var(--border-px);
}

.pay_check_product {
margin-top: 20px;
}

.pay_check_drop_header {
display: flex;
align-items: center;
justify-content: space-between;
cursor: pointer;
padding: 5px 10px;
}

.pay_item_content:hover  .pay_check_dropdown  {
opacity: 1;
visibility: visible;
z-index: 1;
transition: 0.2s ease;
}

.pay_item_content:hover .pay_check_icon {
transform: rotate(180deg);
transition: 0.2s ease;
}

.pay_check_main {
margin-top: 15px;
}

.pay_check_dropdown {
position: absolute;
width: 100%;
background: white;
top: 100%;
left: 0;
opacity: 0;
visibility: hidden;
z-index: -1;
transition: 0.2s ease;
border: 3px solid rgba(118,121,127,0.2);
border-top: none;
padding: 10px;
}

.pay_check_icon {
font-size: 20px;
transition: 0.2s ease;
}

.pay_dropdown_blog, .pay_check_drop_Outcome {
display: flex;
align-items: center;
justify-content: space-between;
}

.pay_check_drop_Outcome  {
border-bottom: 1px solid lightgrey;
padding: 3px;
}

.pay_check_Outcome {
padding: 10px;
}

.pay_check_drop {
font-size: 16px;
text-align: center;
font-weight: 600;
}

.pay_check_header_title {
font-size: 18px;
font-weight: 500;
}

.pay_dropdown_title {
width: 75%;
font-weight: 600;
font-size: 14px;
}

.pay_check_title {
font-size: 16px;
font-weight: 500;
}

.pay_Outcome_title, .pay_Outcome_value {
font-weight: 600;
font-size: 16px;
}

.pay_dropdown_value {
font-size: 16px;
}

.pay_check_drop_mob {
display: none;

}


.check_drop_mob_title {
font-size: 16px;
font-weight: 600px;
}


@media (min-width: 1024px) and (max-width: 1280px) {

}

@media (min-width: 768px) and (max-width: 1023px) {
/* flex */

.pay_flex {
flex-direction: column;
}


/* flex finsish */

/* width */

.pay_left, .pay_right {
width: 100%;
}

.pay_check_item {
width: 48%;
}

/* width finsish */

/* height */

/* height finsish */

/* font-size */

/* font-size finsish */

/* padding */

/* padding finsish */

/* margin */

/* margin finsish */
}


@media (min-width: 480px) and (max-width: 767px) {
/* flex */

.pay_flex {
flex-direction: column;
}


/* flex finsish */

/* width */

.pay_left, .pay_right {
width: 100%;
}

.pay_dropdown_title {
width: 58%;
}

.pay_check_item {
width: 48%;
}

.pay_tabs_item {
max-width: 150px;
}

/* width finsish */

/* height */

/* height finsish */

/* font-size */

.pay_check_header_title, .pay_check_btn {
font-size: 14px;
}

.pay_Outcome_title, .pay_Outcome_value, .pay_check_title, .pay_dropdown_value, .pay_dropdown_title {
font-size: 12px;
}

/* font-size finsish */

/* padding */

/* padding finsish */

/* margin */

/* margin finsish */
}

@media (min-width: 320px) and (max-width: 479px) {
/* flex */

.pay_check_drop_header {
display: none;
}

.pay_check_drop_mob {
display: block;
}

.pay_flex {
flex-direction: column;
}

/* flex finsish */

/* width */

.pay_left, .pay_right {
width: 100%;
}

.pay_dropdown_title {
width: 58%;
}

.pay_check_item {
width: 100%;
}

.pay_tabs_item {
max-width: 150px;
}

/* width finsish */

/* height */

.pay_tabs_item {
height: 70px;
}

/* height finsish */

/* active */

.pay_check_active .pay_check_dropdown{
position: relative;
opacity: 1;
visibility: visible;
z-index: 1;
}

.payin_item_icon_content {
width: 22px;
height: 22px;
font-size: 16px;
}

/* active finsish */



/* font-size */

.ordering_title {
font-size: 20px;
}

.pay_info_title, .fullbasket_amount_value  {
font-size: 16px;
}

.pay_check_header_title, .pay_check_btn, .pay_tabs_sumbit, .pay_check {
font-size: 14px;
}

.pay_Outcome_title, .pay_Outcome_value, .pay_check_title, .pay_dropdown_value, .pay_dropdown_title {
font-size: 12px;
}

/* font-size finsish */

/* padding */

/* padding finsish */

/* margin */

.pay_check_main, .pay_check {
margin-top: 0;
}

.pay_flex {
margin-top: 10px;
}

.pay_tabs_info {
font-size: 20px;
}


/* margin finsish */
}