/**
 * @file
 * @deprecated
 */
 :root{
  --bs-border-radius: var(--brad);
  --bs-primary: var(--c-main);
  --brad-s: 8px;

  --c-status: var(--bs-gray);
  --c-status-success: #11A342;
  --c-status-progress: #FF891E;
  --c-status-wrong: var(--bs-red);
  --c-gray-secondary: #E4E4E4;

  --i-eye: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 28 28'%3E%3Cpath stroke='%23304F88' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M18.18 14a4.17 4.17 0 1 1-8.35 0 4.17 4.17 0 0 1 8.35 0Z'/%3E%3Cpath stroke='%23304F88' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M14 23.65c4.12 0 7.96-2.43 10.63-6.63a6.21 6.21 0 0 0 0-6.05C21.96 6.77 18.12 4.34 14 4.34c-4.12 0-7.96 2.43-10.63 6.63a6.21 6.21 0 0 0 0 6.05c2.67 4.2 6.51 6.63 10.63 6.63Z'/%3E%3C/svg%3E");
  --i-eye-gray: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 28 28'%3E%3Cpath stroke='%236B7076' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M18.18 14a4.17 4.17 0 1 1-8.35 0 4.17 4.17 0 0 1 8.35 0Z'/%3E%3Cpath stroke='%236B7076' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M14 23.65c4.12 0 7.96-2.43 10.63-6.63a6.21 6.21 0 0 0 0-6.05C21.96 6.77 18.12 4.34 14 4.34c-4.12 0-7.96 2.43-10.63 6.63a6.21 6.21 0 0 0 0 6.05c2.67 4.2 6.51 6.63 10.63 6.63Z'/%3E%3C/svg%3E");
  --i-carret: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='6' fill='none'%3E%3Cpath fill='%23304F88' d='M10.84.16a.543.543 0 0 1 .062.696l-.063.076L5.89 5.841a.552.552 0 0 1-.702.062l-.077-.062L.161.932A.543.543 0 0 1 .477.006a.554.554 0 0 1 .388.092L.94.16 5.5 4.683 10.06.16a.55.55 0 0 1 .6-.118.55.55 0 0 1 .178.118Z'/%3E%3C/svg%3E%0A");
  --i-carret-white: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='6' fill='none'%3E%3Cpath fill='%23fff' d='M10.84.16a.543.543 0 0 1 .062.696l-.063.076L5.89 5.841a.552.552 0 0 1-.702.062l-.077-.062L.161.932A.543.543 0 0 1 .477.006a.554.554 0 0 1 .388.092L.94.16 5.5 4.683 10.06.16a.55.55 0 0 1 .6-.118.55.55 0 0 1 .178.118Z'/%3E%3C/svg%3E%0A");
  --i-settings: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236B7076' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10' stroke-width='1.8' d='M18.33 5.42h-5M5 5.42H1.67m6.66 2.91a2.92 2.92 0 1 0 0-5.83 2.92 2.92 0 0 0 0 5.83Zm10 6.25H15m-8.33 0h-5m10 2.92a2.92 2.92 0 1 0 0-5.83 2.92 2.92 0 0 0 0 5.83Z'/%3E%3C/svg%3E");
  --i-calendar: url("../image/calendar.svg");
  --i-location: url("../image/location-black.svg");
  --i-messages: url("../image/messages.svg");
}

.user-page .page-title{
  font-weight: 700;
  font-size: 2.1875rem;
  margin-bottom: 2.1875rem;
}
.user-page h2.page-title{
  font-size: 2rem;
}
.user-page .user-profile-edit-wrapper .page-title{
  margin-bottom: 1.375rem;
}

.data-container{
  background-color: var(--bs-white);
}
.user-data{
  padding: 1.5625rem clamp(16px, 2.825vw, 25px) clamp(21px, 3.5vw, 2vw);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5625rem 1ch;
  line-height: 1;
  font-size: 1rem;

  margin-bottom: 6rem;
}
.user-data--label{
  display: block;
  margin-bottom: .5rem;
  color: var(--bs-gray);
}
.user-data--value{
  font-size: 1.125em;
  font-weight: 700;
}
.user-order{
  margin-bottom: clamp(13px , 2vw, 22px);
}
.user-order--header{
  padding: 10px 1.5rem 12px;
  gap: clamp(2ch, 5vw, 85px);
  border-bottom: 1px solid var(--c-bg-gray);
}
.user-order--wrapper{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.user-order--wrapper-title{
  align-items: start;
  justify-content: start;
}
.user-page--h3{
  color: var(--bs-primary);
  font-size: 1.25rem;
  font-weight: 800;
  min-width: 215px;
  margin: 0;
}
.user-order--link:hover{
  color: var(--c-dark);
  text-decoration: none;
}
.user-order--link:hover *{
  color: inherit;
}
.user-order--value{
  font-style: 1.25rem;
  font-weight: 700;
  margin-bottom: 0.5em;
}
.order-status .order-status--value{
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--c-status);
  border: 1px solid var(--c-status);
  border-radius: 8px;
  padding: 10px 13px;
  text-transform: uppercase;
  margin: 0;
}
.order-status .order-status--value::before{
  content: '';
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: var(--c-status);
  flex-shrink: 0;
}
.user-order--wrapper-created{
  width: 100%;
}
.user-order--wrapper-count{
  margin-left: auto;
}
.user-order--wrapper-price{
  margin-right: auto;
}

.user-order--products .products-row{
  padding: 1rem 3rem 1.375rem;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: min(10px, 1.5vw);
}

.product-item{
  display: flex;
  gap: 1.25rem;
  width: fit-content;
}
.product-img{
  --bs-border-radius: 8px;

  width: 4.625rem;
  aspect-ratio: 1;
}
b{
  display: block;
  width: fit-content;
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 0;
}
.product-title{
  max-width: 112px;
  letter-spacing: -0.3px;
  height: 4.9em;
  overflow: auto;
}

.carousel-control-next, .carousel-control-prev{
  opacity: .75;
  width: 1.5rem;
}
.carousel-control-next:hover, .carousel-control-prev:hover{
  opacity: 1;
  scale: 1.05;
}
.carousel-control-prev{
  left: 1rem;
}
.carousel-control-next{
  right: 1rem;
}
.carousel-control-prev-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23cacaca'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}
.carousel-control-next-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23cacaca'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* *** USER EDIT *** */

.user-profile-ajax-form{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
  gap: 1.75rem 1.875rem;
  padding-bottom: 6rem;
}

.user-profile-ajax-form .form-wrapper{
  position: relative;
  display: flex;
  align-items: center;
}
.user-profile-ajax-form .form-wrapper .form-item{
  width: 100%;
}

:is(.user-profile-ajax-form, .user-password-change-form) .form-wrapper label{
  display: block;
  font-size: 1rem;
  line-height: 1;
  margin-bottom: 10px;
  color: var(--bs-gray);
  margin-left: clamp(19px, 2.5vw, 27px);
}
:is(.user-profile-ajax-form, .user-password-change-form) .form-wrapper .form-required::after {
  content: "*";
  display: inline-block;
  color: var(--bs-red);
}
:is(.user-profile-ajax-form, .user-password-change-form) .form-wrapper .form-control{
  padding: 1rem clamp(19px, 2.5vw, 27px) 1rem 20px;
  width: 100%;
  background-image: none;
  font-size: 1.125rem;
  font-weight: 800;
  line-height: 1;
  max-height: 56px;
}

.user-profile-ajax-form .form-wrapper .form-submit{
  background-image: url('../image/edit.svg');
  position: absolute;
  right: 20px;
}
.user-profile-ajax-form .form-wrapper .form-submit,
.toggle-password{
  display: flex;
  align-items: center;
  margin-top: 26px;
  padding: 0;
  border: none;
  background-color: transparent;
  color: var(--c-main);
  line-height: 1;
  z-index: 2;

  font-size: 0;
  font-weight: 400;
  background-repeat: no-repeat;
  background-position: center;
  min-height: 1.1875rem;
  min-width: 2rem;
  transition: 0.25s ease;
}
.user-profile-ajax-form .form-wrapper .form-submit:hover{
  opacity: .75;
}
.user-profile-ajax-form .form-wrapper:hover .form-submit{
  background-image: none;
  font-size: 1rem;
}
:is(.user-profile-ajax-form, .user-password-change-form) .form-wrapper .alert{
  width: 100%;
  position: absolute;
  top: 3px;
  padding: 8px 10px;
  z-index: 3;
}
:is(.user-profile-ajax-form, .user-password-change-form) .form-wrapper .btn-close:not([data-bs-dismiss="toast"]){
  padding: 0;
  bottom: 0;
  right: 8px;
  margin: auto;
}

.user-password-change-form{
  padding-bottom: 5rem;
}
.password-field{
  display: grid;
  align-items: center;
}
.password-field .form-item{
  grid-column: 1 / -1;
  grid-row: 1 / 2;
  display: grid;
  grid-template-rows: 1.125rem 3.5rem;
}
.password-field .toggle-password{
  background-image: var(--i-eye);
  transform: none;
  grid-column: 1 / -1;
  grid-row: 1 / 2;
  margin-left: auto;
  margin-top: 1.125rem;
  margin-right: 1.125rem;
}
.password-field .toggle-password.active{
  background-image: var(--i-eye-gray);
}

.user-password-change-form .form-submit{
  margin-top: 1.375rem;
  padding: 1em;
  min-width: 180px;
}

.form-item--error-message{
  color: var(--c-status-wrong);
}

.user-order--link:not(:hover){
  text-decoration: none;
}

.nav-pills{
  margin-bottom: 2.25rem;
}

.btn.btn-pill{
  --bs-btn-font-size: 15px;
  --bs-btn-font-weight: 800;
  --bs-btn-border-radius: var(--brad);
  --bs-btn-padding-y: 1em;
  --bs-btn-padding-x: 1.5rem;
  --bs-btn-border-color: var(--c-main);
  --bs-btn-bg: var(--c-main);
  --bs-btn-color: var(--bs-white);
  --bs-btn-hover-bg: transparent;
  --bs-btn-hover-color: var(--c-main);
  --bs-btn-hover-border-color: var(--c-main);
}
.btn.btn-pill.active{
  background-color: transparent;
  color: var(--c-main);
  border-color: var(--c-main);
}

/* *** ОRDER PAGE *** */

.user-order-view{
  display: grid;
  grid-template-columns: 1.815fr 1fr;
  gap: min(2vw, 30px);
}
.order-body{
  min-width: 320px;
  display: flex;
  flex-direction: column;
  gap: min(2vw, 25px);
}
.order-right{
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-width: 320px;
}
.order-data{
  padding: 1rem 2.1875rem;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
}
.order-data--col{
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.order-data--value{
  display: grid;
  grid-template-columns: auto auto;
  align-items: center;
  column-gap: 10px;
}
.order-data--value::before{
  content: '';
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.order-data--created::before{
  background-image: var(--i-calendar);
}
.order-data--delivery-form::before, .order-data--delivery-to::before{
  background-image: var(--i-location);
}

.order-data--delivery-to .order-data--address{
  grid-column: 2;
  grid-row: 2;
  font-weight: 400;
  font-size: 15px;
  line-height: 1;
  color: var(--bs-gray);
}
.order-items{
  padding: 1.625rem 2.25rem 2.5rem 2.25rem;
}
.order-item{
  display: flex;
  gap: min(2vw, 30px);
  padding: 1.75rem 0;
  line-height: 1;
}
.order-item:not(:last-child){
  border-bottom: 1px solid var(--c-gray-secondary);
}
.order-item--img{
  --bs-borer-radius: var(--brad);
  aspect-ratio: 1;
  width: 74px;
  flex-shrink: 0;
}
.order-item--title{
  margin-bottom: 1rem;
}

.order-right .order-right--wrapper{
  display: flex;
  flex-direction: column;
}
.order-total{
  padding: 12px;
}
.order-total--title{
  margin: 0 1rem 1.75rem;
}
.order-total--row{
  display: flex;
  justify-content: space-between;
  margin: 0 1rem 1.25rem;
  line-height: 1;
}
.order-total--row .order-total--value{
  font-size: 1.25rem;
  line-height: 1rem;
}
.order-total--about{
  display: flex;
  justify-content: center;
  text-align: center;
  font-size: 1.125rem;
  color: var(--bs-gray);
  background-color: var(--c-gray-secondary);
  padding: 1rem;
  margin-top: 1.375rem;
  width: 100%;
}

.order-delivery{
  padding: 18px;
  display: flex;
  gap: 1.75rem;
  max-height: 96px;
  font-size: 14px;
}
.order-delivery--img{
  width: 70px;
  height: auto;
  object-fit: contain;
  object-position: center;
  border: 1px dashed var(--bs-gray);
  flex-shrink: 0;
}
.order-delivery--type{
  font-weight: 800;
  width: 100%;
}
.order-delivery--wrapper{
  width: 100%;
  max-width: 171px;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.5ch 1ch;
}
.order-delivery--btn{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
}
.order-delivery--btn::after{
  content: '';
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: var(--i-messages);
}

[data-drupal-selector*="views-form-commerce-products-page-user-1"]{
  display: flex;
  flex-direction: column-reverse;
}
[data-drupal-selector*="views-form-commerce-products-page-user-1"]>.form-actions{
  display: none;
}

.view-commerce-products.view-display-id-page_user .view-header{
  margin-bottom: 1.5rem;
}
.view-commerce-products.view-display-id-page_user th{
  background-color: transparent;
}
.view-commerce-products.view-display-id-page_user tr{
  border: transparent;
}
.view-commerce-products.view-display-id-page_user .tr-separator{
  height: 11px;
}
.view-commerce-products.view-display-id-page_user td{
  background-color: var(--bs-white);
  padding: 1.25rem;
  margin-bottom: 11px;
}
.view-commerce-products.view-display-id-page_user :is(th, td):first-child{
  border-radius: var(--brad) 0 0 var(--brad);
  padding-left: 1.75rem;
}
.view-commerce-products.view-display-id-page_user :is(th, td):last-child{
  border-radius: 0 var(--brad) var(--brad) 0;
  padding-right: 1.75rem;
}
.view-commerce-products.view-display-id-page_user a:not(.btn){
  text-decoration: none;
  font-size: 1rem;
}
.view-commerce-products.view-display-id-page_user a:not(.btn):hover{
  color: var(--c-main);
}

.view-display-id-page_user .dropbutton-widget{
  border-radius: var(--brad-s);
  background-color: var(--c-main);
  color: var(--bs-white);
  font-size: 15px;
  padding: 0.35rem 2rem 0.35rem 1rem;
}
.view-display-id-page_user .dropbutton-widget:hover{
  background-color: var(--c-dark);
}
.view-display-id-page_user .dropbutton-action.secondary-action{
  margin-top: 0.5rem;
}

.view-display-id-page_user button .dropbutton-arrow{
  background-image: var(--i-carret-white);
  width: 11px;  
  height: 6px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  border: none;
}
.view-display-id-page_user button:hover .dropbutton-arrow{
  background-image: var(--i-carret);
}
.view-display-id-page_user .open button .dropbutton-arrow{
  transform: scale(-1);
  border-bottom: none;
  height: 11px;
}

.view-display-id-page_user [data-drupal-selector*="edit-commerce-product-bulk-form"]{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 1.25rem;
  color: var(--bs-white); 
  border-radius: var(--brad-s); 
  background-color: var(--c-dark);
}

.view-display-id-page_user [data-drupal-selector*="edit-commerce-product-bulk-form"] .form-type-select{
  display: flex;
  align-items: center;
  gap: 10px;
}
.view-display-id-page_user [data-drupal-selector*="edit-commerce-product-bulk-form"] .form-type-select label{
  min-width: max-content;
}
.view-display-id-page_user [data-drupal-selector*="edit-commerce-product-bulk-form"] .form-type-select .form-select{
  --bs-border-radius: var(--brad-s);
  height: 42px;
}
.view-display-id-page_user [data-drupal-selector*="edit-commerce-product-bulk-form"] .btn{
  padding: 0.5rem 1.5rem;
  height: 42px;
}


.user-orders .form-item-states{
  position: relative;
  display: flex;
  align-items: center;
}
.user-orders .form-item-states .form-select{
  background-color: transparent;
  border-color: var(--bs-gray);
  color: var(--bs-gray);
  padding: 13px 24px 13px 48px;
  line-height: 1;
}
.user-orders .form-item-states label{
  display: block;
  position: absolute;
  left: 24px;
  font-size: 0;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: var(--i-settings);
}

.user-orders--empty{
  padding: 1rem 1.5rem;
}

.view-otzyvy.view-display-id-block_store{
  margin-top: 4rem;
}