@charset "UTF-8";
@font-face {
font-family: Roboto;
src: url(./assets/fonts/Roboto-Regular.woff2) format("woff2");
font-weight: 400;
font-style: normal;
font-display: swap
}
@font-face {
font-family: Roboto;
src: url(./assets/fonts/Roboto-Medium.woff2) format("woff2");
font-weight: 500;
font-style: normal;
font-display: swap
}
@font-face {
font-family: Roboto;
src: url(./assets/fonts/Roboto-SemiBold.woff2) format("woff2");
font-weight: 600;
font-style: normal;
font-display: swap
}
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
display: block
}
body {
line-height: 1.2
}
ol,ul {
list-style: none
}
blockquote,q {
quotes: none
}
blockquote:after,blockquote:before,q:after,q:before {
content: "";
content: none
}
table {
border-collapse: collapse;
border-spacing: 0
}
*,::after,::before {
box-sizing: border-box
}
button,label {
cursor: pointer
}
body {
min-height: 100%;
display: flex;
flex-direction: column
}
main {
flex-grow: 1
}
html {
height: 100%;
scrollbar-gutter: stable
}
button,input,select,textarea {
font: inherit;
color: inherit
}
button {
padding: 0;
border: none
}
a {
color: inherit;
text-decoration: none
}
:has(:target),html {
scroll-behavior: smooth
}
:root {
--font-roboto: 'Roboto',sans-serif;
--color-white: #FFFFFF;
--color-black: #434343;
--color-black2: #070707;
--color-black3: #282828;
--color-gray: #5c5c5c;
--color-gray2: #d9d9d9;
--color-gray3: #f8f8f8;
--color-gray4: #939393;
--color-gray5: #DFDFDF;
--color-gray6: #e9e9e9;
--color-gray7: #F4F4F4;
--color-blue: #0098ff;
--color-orange: #fff1e4;
--color-orange2: #FF7F00;
--color-orange3: #FF6600;
--color-red: #FF3B58
}
body {
font-family: var(--font-roboto);
font-weight: 500;
background-color: var(--color-white);
color: var(--color-black)
}
.body--pb {
padding-bottom: 90px
}
.main {
display: flex;
flex-direction: column
}
.grecaptcha-badge {
z-index: 5000
}
.container {
max-width: 1500px;
padding: 0 10px;
margin: 0 auto;
position: relative
}
.container--flex {
display: flex;
flex-direction: column;
width: 100%
}
.checkout-modal__form {
display: flex;
flex-direction: column;
min-height: 0;
flex: 1 1 0;
overflow: hidden
}
.checkout-modal__field-error {
display: block;
margin: 4px 13px 0;
font-size: 12px;
line-height: 1.3;
color: #c62828
}
.checkout-modal__field-error[hidden] {
display: none
}
.checkout-modal__input--full {
min-height: 44px;
padding: 10px 12px;
border-radius: 10px;
background-color: #f0f0f0
}
.checkout-modal__address--empty {
color: var(--color-gray4)
}
.auth-modal__error {
color: #c62828;
font-size: 13px;
margin-top: 10px;
text-align: center;
line-height: 1.35
}
.lavka-toast {
position: fixed;
left: 50%;
bottom: calc(24px + env(safe-area-inset-bottom,0));
z-index: 5000;
max-width: min(92vw,360px);
padding: 14px 18px;
border-radius: 14px;
background: var(--color-black3);
color: var(--color-white);
font-size: 14px;
line-height: 1.35;
font-weight: 500;
text-align: center;
box-shadow: 0 6px 24px rgba(0,0,0,.22);
opacity: 0;
pointer-events: none;
transition: opacity .25s ease,transform .25s ease;
transform: translate(-50%,12px)
}
.lavka-toast--visible {
opacity: 1;
pointer-events: auto;
transform: translate(-50%,0)
}
.lavka-toast.lavka-toast--light {
background: #fff;
text-align: left;
padding: 14px 22px 14px 24px;
border-radius: 999px;
box-shadow: 0 4px 24px rgba(0,0,0,.12);
width: 320px;
color: var(--color-black);
bottom: 100px!important
}
.header {
position: absolute;
left: 0;
right: 0;
padding-top: 18px
}
.header__inner {
display: flex;
justify-content: space-between;
align-items: center
}
.header__logo {
width: 31px;
height: 22px
}
.header__logo img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover
}
.header__problems {
font-size: 14px;
color: var(--color-white);
background-color: transparent
}
.header__enter {
background-color: transparent;
width: 30px;
height: 30px
}
.header__enter img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover
}
.delivery {
background-color: var(--color-orange3)
}
.delivery__wrapper {
padding-top: 13px;
background-color: var(--color-white);
border-radius: 20px 20px 0 0;
min-height: calc(100vh - 56px)
}
.delivery__tabs {
max-width: 500px;
margin: 0 auto;
display: inline-flex;
gap: 8px;
padding: 2px;
border-radius: 20px;
background-color: var(--color-gray3)
}
.delivery__tab {
min-width: 95px;
height: 25px;
padding: 0 12px;
border-radius: 15px;
font-size: 14px;
font-weight: 500;
color: var(--color-gray);
background-color: transparent;
transition: background-color .2s ease,color .2s ease
}
.delivery__tab--active {
color: var(--color-orange2);
background-color: var(--color-orange)
}
.delivery__list {
max-width: 500px;
margin: 12px auto 0;
display: flex;
flex-direction: column
}
.delivery__list--active {
display: flex
}
.delivery__item {
box-shadow: 0 0 4px 0 rgba(0,0,0,.25);
background: var(--color-white);
cursor: pointer;
border-radius: 20px;
padding-bottom: 8px
}
.delivery__link {
display: block
}
.delivery__img {
border-radius: 20px;
box-shadow: 0 1px 4px 0 rgba(0,0,0,.25);
background-color: var(--color-white);
display: flex;
align-items: center;
justify-content: center;
height: 120px
}
.delivery__img img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
border-radius: 20px
}
.delivery__title {
margin-top: 11px;
font-size: 18px;
padding-left: 20px;
text-transform: uppercase
}
.delivery__text {
padding-left: 20px;
margin-top: 5px;
font-size: 13px
}
.delivery__info-block {
padding-left: 20px;
margin-top: 15px;
display: flex;
gap: 5px;
align-items: center
}
.delivery__time {
display: flex;
align-items: center;
gap: 5px;
padding: 5px 15px;
background-color: var(--color-gray3);
border-radius: 20px
}
.delivery__time img {
width: 18px;
height: 18px
}
.delivery__time span {
font-size: 12px
}
.delivery__count {
font-size: 12px;
padding: 5px 12px;
background-color: var(--color-gray3);
border-radius: 20px
}
.footer {
position: fixed;
bottom: 25px;
left: 0;
right: 0
}
.footer__inner {
max-width: 500px;
margin: 0 auto
}
.footer__list {
padding: 5px 20px;
display: flex;
justify-content: space-between;
gap: 5px;
border-radius: 30px;
box-shadow: 0 0 4px 0 rgba(0,0,0,.25);
background-color: var(--color-white)
}
.footer__link {
padding: 3px 20px;
border-radius: 20px;
display: flex;
flex-direction: column;
align-items: center;
gap: 2px
}
.footer__link--active {
background-color: var(--color-orange)
}
.footer__link--active .footer__text {
color: var(--color-orange2)
}
.footer__link--active .footer__icon--stroke path {
stroke: var(--color-orange2)
}
.footer__link--active .footer__icon--fill {
fill: var(--color-orange2)
}
.footer__link--active .footer__icon--fill path {
stroke: none
}
.footer__img {
width: 25px;
height: 25px
}
.footer__img svg {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover
}
.footer__text {
font-size: 13px
}
.footer__icon--stroke {
fill: none
}
.shop {
padding: 20px 0;
border-bottom: 1px solid rgba(0,0,0,.25)
}
.shop__back {
position: absolute;
left: 0
}
.shop__promo {
position: relative
}
.shop__title {
max-width: 90px;
margin-inline: auto;
font-size: 20px;
color: var(--color-black2);
text-align: center
}
.shop__time-block {
display: inline-flex;
padding: 15px;
align-items: center;
gap: 30px;
border-radius: 20px;
margin-top: 37px;
background-color: var(--color-gray3)
}
.shop__time-top {
font-size: 12px;
color: var(--color-gray4)
}
.shop__time-bottom {
font-size: 14px;
margin-top: 4px
}
.shop__info-block {
display: flex;
align-items: center;
gap: 5px;
flex-wrap: wrap
}
.shop__info-text {
font-size: 13px;
padding: 8px 15px;
margin-top: 10px;
background-color: var(--color-gray3);
border-radius: 20px;
text-wrap: nowrap
}
.shop-catalog {
display: flex;
flex-direction: column;
flex-grow: 1;
padding-top: 20px
}
.shop-catalog__wrapper {
width: 100%;
display: flex;
flex-direction: column;
flex-grow: 1
}
.shop-catalog__inner {
display: grid;
grid-template-columns: repeat(4,1fr);
gap: 10px;
max-width: 1500px;
padding: 0 15px;
margin: 0 auto;
width: 100%
}
.shop-catalog__img {
background-color: var(--color-gray7);
width: 100%;
height: 185px;
border-radius: 20px;
position: relative;
display: flex;
justify-content: center
}
.shop-catalog__img img {
height: 95%
}
.shop-catalog__quantity {
position: absolute;
bottom: 5px;
left: 0;
right: 0;
width: 95%;
margin-inline: auto;
color: var(--color-white)
}
.shop-catalog__qty-input {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 20px;
background-color: var(--color-orange2);
border-radius: 20px;
text-align: center;
outline: 0;
border: none;
font-size: 16px
}
.shop-catalog__qty-input[readonly] {
cursor: default;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none
}
.shop-catalog__qty-minus-btn {
width: 20px;
height: 20px;
font-size: 25px;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
left: 15px;
top: 50%;
transform: translateY(-50%);
background-color: transparent
}
.shop-catalog__qty-minus-btn:disabled {
opacity: .4;
cursor: not-allowed
}
.shop-catalog__qty-plus-btn {
width: 20px;
height: 20px;
display: flex;
justify-content: center;
align-items: center;
font-size: 25px;
position: absolute;
right: 15px;
top: 50%;
transform: translateY(-50%);
background-color: transparent
}
.shop-catalog__qty-plus-btn:disabled {
opacity: .4;
cursor: not-allowed
}
.shop-catalog__title {
margin-top: 10px;
font-size: 14px;
color: var(--color-black3)
}
.shop-catalog__count {
font-size: 12px;
color: var(--color-gray4)
}
.shop-catalog__price {
margin-top: 15px;
font-size: 20px;
color: var(--color-black2)
}
.shop-catalog__info {
position: fixed;
bottom: 0;
left: 0;
right: 0
}
.shop-catalog__result-block {
max-width: 1500px;
padding: 0 15px;
margin: 0 auto;
width: 100%;
display: flex;
justify-content: flex-end
}
.shop-catalog__result {
padding: 14px 35px;
border-radius: 30px;
background-color: var(--color-orange2);
color: var(--color-white);
font-size: 20px
}
.shop-catalog__info-text {
margin-top: 20px;
padding-top: 10px;
padding-bottom: 50px;
border-radius: 20px 20px 0 0;
box-shadow: 0 -1px 4px 0 rgba(0,0,0,.25);
background: var(--color-white);
font-size: 14px;
text-align: center;
color: var(--color-black2)
}
.partner-page {
--partner-head-height: 60px;
--partner-catalog-side: 9px;
--partner-sticky-gap: var(--partner-catalog-side);
position: relative;
background-color: var(--color-white)
}
.partner-shop {
padding: 0 10px
}
.partner-shop__head {
position: sticky;
top: 0;
z-index: 40;
display: flex;
justify-content: center;
align-items: center;
padding: 15px 10px 10px;
background-color: var(--color-white)
}
.partner-shop__back {
position: absolute;
left: 10px;
top: 15px;
width: 35px;
height: 26px;
border-radius: 10px;
background-color: var(--color-gray6);
display: flex;
align-items: center;
justify-content: center
}
.partner-shop__back img {
width: 18px;
height: 18px
}
.partner-shop__title {
font-size: 20px;
line-height: 26px;
color: var(--color-black2)
}
.partner-shop__info-btn {
position: absolute;
right: 128px;
top: 20px;
background-color: transparent;
width: 16px;
height: 16px
}
.partner-shop__info-btn img {
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain
}
.partner-shop__service-tabs {
margin-top: 16px;
height: 35px;
border-radius: 20px;
padding: 5px;
background-color: var(--color-white);
box-shadow: 0 0 2px 0 rgba(0,0,0,.25);
display: grid;
grid-template-columns: 1fr 1fr;
gap: 6px
}
.partner-shop__service-tab {
border-radius: 15px;
font-size: 14px;
color: var(--color-black);
text-decoration: none;
display: flex;
align-items: center;
justify-content: center;
transition: background-color .2s ease,color .2s ease
}
.partner-shop__service-tab--active {
background-color: var(--color-orange);
color: var(--color-orange2)
}
.partner-shop__meta {
margin-top: 10px;
border-radius: 20px;
background-color: var(--color-gray3);
padding: 10px 15px;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 8px
}
.partner-shop__meta--pickup {
grid-template-columns: 1fr 1fr 1fr
}
.partner-shop__meta-label {
font-size: 12px;
color: var(--color-gray4)
}
.partner-shop__meta-value {
margin-top: 2px;
font-size: 14px;
color: var(--color-black);
white-space: nowrap
}
.partner-shop__delivery-badge {
margin-top: 10px;
border-radius: 20px;
background-color: var(--color-gray3);
padding: 6px 17px;
width: -moz-fit-content;
width: fit-content;
font-size: 13px
}
.partner-catalog {
padding: 16px var(--partner-catalog-side) 130px
}
.partner-catalog__panel--active {
display: block
}
.partner-catalog__tabs {
position: sticky;
top: calc(var(--partner-head-height) + var(--partner-sticky-gap));
z-index: 35;
border-radius: 20px;
box-shadow: 0 0 2px 0 rgba(0,0,0,.25);
padding: 5px;
display: inline-flex;
gap: 6px;
width: 100%;
background-color: var(--color-white)
}
.partner-catalog__tab {
border-radius: 15px;
min-width: 95px;
height: 25px;
background-color: transparent;
font-size: 14px;
color: var(--color-black)
}
.partner-catalog__tab--active {
background-color: var(--color-orange);
color: var(--color-orange2)
}
.partner-catalog__title {
margin-top: 12px;
font-size: 18px;
color: var(--color-black2)
}
.partner-catalog__grid {
margin-top: 16px;
display: grid;
grid-template-columns: repeat(2,1fr);
gap: 14px
}
.partner-catalog__card {
position: relative
}
.partner-catalog__image {
height: 185px;
border-radius: 20px;
background-color: var(--color-gray5)
}
.partner-catalog__image--photo {
background-size: cover;
background-position: center;
background-repeat: no-repeat
}
.partner-catalog__add-btn {
position: absolute;
right: 14px;
top: 145px;
width: 35px;
height: 35px;
border-radius: 50%;
font-size: 30px;
color: var(--color-white);
background-color: var(--color-orange2);
box-shadow: 0 0 2px 0 rgba(0,0,0,.25);
display: flex;
align-items: center;
justify-content: center;
line-height: 1
}
.partner-catalog__add-btn img {
width: 20px;
height: 20px;
-o-object-fit: contain;
object-fit: contain
}
.partner-catalog__add-btn[hidden] {
display: none
}
.partner-catalog__qty {
position: absolute;
left: 10px;
right: 10px;
top: 145px;
height: 35px;
border-radius: 20px;
background-color: var(--color-orange2);
box-shadow: 0 0 4px 0 rgba(0,0,0,.25);
display: grid;
grid-template-columns: 35px 1fr 35px;
align-items: center
}
.partner-catalog__qty[hidden] {
display: none
}
.partner-catalog__qty-btn {
height: 100%;
background-color: transparent;
color: var(--color-white);
font-size: 30px;
line-height: 1
}
.partner-catalog__qty-value {
text-align: center;
color: var(--color-white);
font-size: 16px
}
.partner-catalog__name {
margin-top: 10px;
font-size: 14px;
color: var(--color-black3)
}
.partner-catalog__weight {
margin-top: 2px;
font-size: 12px;
color: var(--color-gray4)
}
.partner-catalog__price {
margin-top: 8px;
font-size: 20px;
color: var(--color-black2)
}
.partner-catalog__total-btn {
position: fixed;
right: 20px;
bottom: 110px;
min-width: 124px;
height: 48px;
border-radius: 30px;
background-color: var(--color-orange2);
color: var(--color-white);
font-size: 20px;
display: flex;
align-items: center;
justify-content: center;
text-decoration: none;
box-shadow: 0 0 4px 0 rgba(0,0,0,.25);
z-index: 20
}
.partner-catalog__delivery-note {
position: fixed;
left: 0;
right: 0;
bottom: 0;
height: 68px;
border-radius: 20px 20px 0 0;
box-shadow: 0 -1px 4px 0 rgba(0,0,0,.25);
background-color: var(--color-white);
display: flex;
align-items: flex-start;
justify-content: center;
padding-top: 10px;
font-size: 14px;
color: var(--color-black2);
z-index: 10
}
.basket {
padding: 15px 0 10px;
box-shadow: 0 0 4px 0 rgba(0,0,0,.25);
color: var(--color-gray4);
position: sticky;
top: 0;
z-index: 20;
background-color: var(--color-white)
}
.basket__inner {
display: flex;
align-items: center;
justify-content: space-between
}
.basket__back {
width: 35px;
height: 26px;
border-radius: 10px;
background-color: var(--color-gray6);
display: flex;
align-items: center;
justify-content: center
}
.basket__back img {
width: 18px;
height: 18px
}
.basket__title {
max-width: 90px;
margin-inline: auto;
font-size: 20px;
color: var(--color-black2);
text-align: center
}
.basket__clear {
width: 20px;
height: 20px;
background-color: transparent;
padding: 0;
border: none;
cursor: pointer
}
.basket__clear--hidden {
visibility: hidden;
pointer-events: none
}
.basket__clear:disabled {
cursor: not-allowed;
opacity: .4
}
.basket__clear img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover
}
.basket__tabs {
margin-top: 14px;
border-radius: 20px;
box-shadow: 0 0 2px 0 rgba(0,0,0,.25);
padding: 5px;
display: flex;
flex-wrap: nowrap;
gap: 6px;
width: 100%;
max-width: 100%;
background-color: var(--color-white);
overflow-x: auto;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
scrollbar-width: none
}
.basket__tab {
border-radius: 15px;
padding: 6px 14px;
background-color: transparent;
font-size: 14px;
color: var(--color-black);
white-space: nowrap;
flex: 0 0 auto
}
.basket__tab--active {
background-color: var(--color-orange);
color: var(--color-orange2)
}
.basket__tabs--hidden {
display: none
}
.basket-list {
display: none;
padding: 20px 0 160px;
flex-direction: column
}
.basket-list--visible {
display: flex
}
.basket-list__panel {
width: 100%
}
.basket-list__inner {
padding-bottom: 10px;
border-bottom: 1px solid var(--lavka-divider);
max-width: 700px;
width: 100%;
margin-inline: auto;
display: flex;
flex-direction: column;
gap: 16px
}
.basket-list__item {
display: flex;
align-items: center;
gap: 10px
}
.basket-list__item--removed .basket-list__text-block {
opacity: .7
}
.basket-list__img {
width: 75px;
height: 73px;
border-radius: 15px;
background-color: var(--color-gray5);
flex-shrink: 0
}
.basket-list__img img {
border-radius: 15px;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover
}
.basket-list__text-block {
flex-grow: 1;
min-width: 0
}
.basket-list__title {
font-size: 14px;
color: var(--color-black)
}
.basket-list__count {
margin-top: 3px;
font-size: 12px;
color: var(--color-gray4)
}
.basket-list__price {
margin-top: 5px;
font-size: 16px;
color: var(--color-black2)
}
.basket-list__quantity {
position: relative;
color: var(--color-white);
min-width: 110px;
width: 110px;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: space-between;
padding: 5px 12px;
background-color: var(--color-orange2);
border-radius: 20px
}
.basket-list__qty-value {
flex-grow: 1;
text-align: center;
font-size: 14px;
color: var(--color-white)
}
.basket-list__qty-delete-btn[hidden],.basket-list__qty-minus-btn[hidden],.basket-list__quantity[hidden] {
display: none!important
}
.basket-list__qty-delete-btn {
background-color: transparent;
width: 20px;
height: 20px;
flex-shrink: 0;
padding: 0
}
.basket-list__qty-delete-btn img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover
}
.basket-list__qty-input {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 20px;
background-color: var(--color-orange2);
border-radius: 20px;
text-align: center;
outline: 0;
border: none;
font-size: 16px;
color: var(--color-white)
}
.basket-list__qty-input[readonly] {
cursor: default;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none
}
.basket-list__qty-minus-btn {
width: 20px;
height: 20px;
font-size: 25px;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
left: 15px;
top: 50%;
transform: translateY(-50%);
background-color: transparent
}
.basket-list__qty-minus-btn:disabled {
opacity: .4;
cursor: not-allowed
}
.basket-list__qty-plus-btn {
width: 20px;
height: 20px;
display: flex;
justify-content: center;
align-items: center;
font-size: 18px;
background-color: transparent;
color: var(--color-white);
flex-shrink: 0;
padding: 0
}
.basket-list__qty-plus-btn:disabled {
opacity: .4;
cursor: not-allowed
}
.basket-list__restore {
min-width: 110px;
width: 110px;
flex-shrink: 0;
padding: 8px 12px;
border-radius: 20px;
background-color: var(--color-gray6);
color: var(--color-gray4);
font-size: 14px;
text-align: center
}
.basket-list__restore[hidden] {
display: none!important
}
.basket-list__extra {
max-width: 700px;
width: 100%;
margin-inline: auto;
margin-top: 10px;
display: flex;
justify-content: flex-end;
align-items: center;
gap: 30px
}
.basket-list__extra .basket-list__quantity {
position: relative;
display: block;
padding: 0;
background: 0 0;
min-width: 110px;
width: 30%
}
.basket-list__extra-input {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
position: relative;
width: 25px;
height: 25px;
border-radius: 50%;
background-color: var(--color-gray2);
border: 1px solid var(--lavka-divider);
flex-shrink: 0;
margin: 0;
outline: 0;
cursor: pointer
}
.basket-list__extra-input::after {
content: "";
background-image: url(./assets/images/icons/checked.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
display: block;
width: 18px;
height: 18px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
opacity: 0
}
.basket-list__extra-input:checked {
background-color: var(--color-orange2)
}
.basket-list__extra-input:checked::after {
opacity: 1
}
.basket-list__extra-label {
font-size: 14px;
color: var(--color-black2)
}
.basket-list__btn {
position: fixed;
left: 50%;
transform: translateX(-50%);
bottom: 100px;
z-index: 25;
width: calc(100% - 62px);
max-width: 350px;
background-color: var(--color-orange2);
border-radius: 30px;
padding: 12px;
font-size: 20px;
color: var(--color-white);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center
}
.basket-list__btn span:not(.basket-list__btn-sum) {
font-size: 14px;
color: var(--color-orange)
}
.basket-list__btn-sum {
font-size: 20px
}
.checkout-modal {
position: fixed;
inset: 0;
z-index: 3000;
display: none;
align-items: center;
justify-content: flex-end;
padding: 0;
font-weight: 500;
padding-bottom: env(safe-area-inset-bottom,0);
max-height: 100vh;
max-height: 100dvh;
min-height: 100vh;
min-height: 100dvh;
flex-direction: column
}
.checkout-modal--open {
display: flex;
visibility: visible;
pointer-events: auto;
overflow: hidden
}
.checkout-modal__backdrop {
position: absolute;
inset: 0;
background: rgba(0,0,0,.55);
border: none;
padding: 0;
cursor: pointer
}
.checkout-modal__sheet {
position: relative;
z-index: 1;
width: 100%;
max-width: 412px;
display: flex;
flex-direction: column;
background-color: #f4f4f4;
border-radius: 20px 20px 0 0;
padding: 12px 13px 0;
box-shadow: 0 -4px 24px rgba(0,0,0,.12);
overflow: hidden;
flex: 0 0 auto;
min-height: 0;
max-height: min(917px,92vh,92dvh)
}
.checkout-modal__body {
flex: 1 1 auto;
min-height: 0;
overflow-x: hidden;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
overscroll-behavior: contain;
touch-action: pan-y
}
.checkout-modal__close {
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
margin: 0 4px 6px auto;
padding: 0;
border: none;
background: #eaeaea;
cursor: pointer;
color: var(--color-gray4);
border-radius: 50%;
transition: background-color .15s,color .15s
}
.checkout-modal__close:hover {
background-color: rgba(0,0,0,.06);
color: var(--color-black)
}
.checkout-modal__close:focus-visible {
outline: 2px solid var(--color-orange2);
outline-offset: 2px
}
.checkout-modal__close-icon {
display: block;
flex-shrink: 0
}
.checkout-modal__address {
display: inline-flex;
align-items: center;
justify-content: space-between;
gap: 5px;
padding: 0 13px 6px 13px;
margin: 0;
background: 0 0;
border: none;
cursor: pointer;
font: inherit;
font-size: 18px;
line-height: 24px;
letter-spacing: .15px;
color: var(--color-black);
text-align: left
}
.checkout-modal__delivery-time {
display: flex;
align-items: center;
gap: 7px;
padding: 0 13px 16px;
font-size: 14px;
line-height: 12px;
letter-spacing: .15px;
color: var(--color-gray)
}
.checkout-modal__delivery-time-icon {
width: 18px;
height: 18px;
flex-shrink: 0;
-o-object-fit: contain;
object-fit: contain
}
.checkout-modal__chevron {
flex-shrink: 0;
width: 20px;
height: 20px;
color: var(--color-gray4)
}
.checkout-modal__card {
background: var(--color-white);
border-radius: 20px;
padding: 16px 15px;
margin-bottom: 8px
}
.checkout-modal__card--delivery {
padding-top: 14px;
padding-bottom: 14px
}
.checkout-modal__card--compact {
border-radius: 10px;
padding: 12px 13px
}
.checkout-modal__card--summary {
padding-top: 14px;
padding-bottom: 14px
}
.checkout-modal__card-heading {
margin: 0 0 12px;
font-size: 16px;
line-height: 12px;
letter-spacing: .15px;
color: var(--color-black);
font-weight: 500
}
.checkout-modal__date-row {
display: grid;
grid-template-columns: 1fr 1fr 1.18fr;
gap: 6px;
align-items: stretch
}
.checkout-modal__date-btn {
min-height: 28px;
padding: 0 8px;
border: none;
border-radius: 10px;
background-color: #f0f0f0;
font: inherit;
font-size: 14px;
line-height: 12px;
letter-spacing: .15px;
color: var(--color-gray);
cursor: pointer;
transition: background-color .15s,color .15s
}
.checkout-modal__date-btn--active {
background-color: var(--color-orange2);
color: var(--color-white)
}
.checkout-modal__label {
display: block;
font-size: 12px;
line-height: 12px;
letter-spacing: .15px;
color: var(--color-black);
margin-bottom: 8px
}
.checkout-modal__field-text {
display: block;
font-size: 14px;
line-height: 12px;
letter-spacing: .15px;
color: var(--color-gray4);
margin-bottom: 12px
}
.checkout-modal__field-text[type=tel] {
width: 100%;
max-width: 100%;
box-sizing: border-box;
border: none;
background: 0 0;
padding: 0;
font: inherit;
cursor: default
}
.checkout-modal__field-text[type=tel]:focus {
outline: 0
}
.checkout-modal__divider {
height: 1px;
margin: 0 0 12px;
background-color: var(--color-gray6);
border: none
}
.checkout-modal__leave-row,.checkout-modal__row-pill {
display: inline-flex;
align-items: center;
gap: 10px;
min-height: 40px;
padding: 0 11px;
border-radius: 10px;
font-size: 14px;
line-height: 16px;
letter-spacing: .15px;
cursor: pointer;
transition: background-color .15s,color .15s;
background-color: #f0f0f0;
color: var(--color-gray)
}
.checkout-modal__leave-row:has(input:checked),.checkout-modal__row-pill:has(input:checked) {
background-color: #ffe9d9;
color: var(--color-orange2)
}
.checkout-modal__leave-check,.checkout-modal__toggle {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 20px;
height: 20px;
margin: 0;
flex-shrink: 0;
border-radius: 50%;
border: none;
background-color: var(--color-gray2);
cursor: pointer;
transition: background-color .15s,background-image .15s
}
.checkout-modal__leave-check:checked,.checkout-modal__toggle:checked {
background-color: var(--color-orange2);
background-image: url(assets/images/icons/mark.svg);
background-repeat: no-repeat;
background-position: center center;
background-size: 11px 9px
}
.checkout-modal__leave-check:not(:checked),.checkout-modal__toggle:not(:checked) {
background-color: var(--color-gray2);
background-image: none
}
.checkout-modal__input {
display: block;
width: 100%;
box-sizing: border-box;
min-height: 20px;
padding: 0;
border: none;
background: 0 0;
font: inherit;
font-size: 14px;
line-height: 12px;
letter-spacing: .15px;
color: var(--color-black)
}
.checkout-modal__input::-moz-placeholder {
color: var(--color-gray4)
}
.checkout-modal__input::placeholder {
color: var(--color-gray4)
}
.checkout-modal__input:focus {
outline: 0
}
.checkout-modal__pay {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px
}
.checkout-modal__pay-label {
display: block;
font-size: 12px;
line-height: 17px;
letter-spacing: .15px;
color: var(--color-gray);
margin-bottom: 6px
}
.checkout-modal__pay-value {
font-size: 16px;
line-height: 16px;
letter-spacing: .15px;
color: var(--color-black)
}
.checkout-modal__check-badge {
flex-shrink: 0;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: var(--color-orange2);
background-image: url(assets/images/icons/mark.svg);
background-repeat: no-repeat;
background-position: center;
background-size: 11px 9px
}
.checkout-modal__summary-title {
margin: 0 0 14px;
font-size: 16px;
line-height: 12px;
letter-spacing: .15px;
color: var(--color-black);
font-weight: 500
}
.checkout-modal__summary-rows {
display: flex;
flex-direction: column;
gap: 10px
}
.checkout-modal__summary-row {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 13px;
line-height: 12px;
letter-spacing: .15px;
color: var(--color-black)
}
.checkout-modal__footer {
flex-shrink: 0;
background-color: #f4f4f4
}
.checkout-modal__submit {
width: 100%;
max-width: 380px;
margin: 0 auto;
display: block;
padding: 12px 16px 14px;
border: none;
border-radius: 30px;
background-color: var(--color-orange2);
color: var(--color-white);
font: inherit;
cursor: pointer;
text-align: center
}
.checkout-modal__submit-title {
display: block;
font-size: 18px;
line-height: 20px;
letter-spacing: .15px;
font-weight: 500
}
.checkout-modal__submit-total {
display: block;
margin-top: 4px;
font-size: 14px;
line-height: 12px;
letter-spacing: .15px;
color: #ffeddf;
font-weight: 500
}
.checkout-modal__form {
display: flex;
flex-direction: column;
flex: 1 1 auto;
min-height: 0;
overflow: hidden
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0,0,0,0);
white-space: nowrap;
border: 0
}
.address-modal {
position: fixed;
inset: 0;
z-index: 3100;
display: none;
align-items: flex-end;
justify-content: center;
padding: 0;
font-weight: 500
}
.address-modal--open {
display: flex
}
.address-modal__backdrop {
position: absolute;
inset: 0;
background: rgba(0,0,0,.55);
border: none;
padding: 0;
cursor: pointer
}
.address-modal__sheet {
position: relative;
z-index: 1;
width: 100%;
max-width: 412px;
max-height: min(85vh,820px);
display: flex;
flex-direction: column;
overflow-x: hidden;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
overscroll-behavior: contain;
touch-action: pan-y;
background-color: var(--color-white);
border-radius: 20px 20px 0 0;
padding: 0 0 0;
box-shadow: 0 -4px 24px rgba(0,0,0,.12)
}
.address-modal__sheet:has(.address-modal__edit:not([hidden])) {
min-height: min(85vh,820px)
}
.address-modal__handle {
flex-shrink: 0;
width: 30px;
height: 3px;
margin: 10px auto 0;
border-radius: 2px;
background: #cfcfcf
}
.address-modal__close {
position: absolute;
top: 11px;
right: 12px;
z-index: 2;
display: flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
margin: 0;
padding: 0;
border: none;
background: #eaeaea;
cursor: pointer;
color: var(--color-gray4);
border-radius: 50%;
transition: background-color .15s,color .15s
}
.address-modal__close:hover {
background-color: rgba(0,0,0,.06);
color: var(--color-black)
}
.address-modal__close:focus-visible {
outline: 2px solid var(--color-orange2);
outline-offset: 2px
}
.address-modal__close-icon {
display: block;
flex-shrink: 0
}
.address-modal__title {
flex-shrink: 0;
margin: 8px 44px 18px;
font-size: 18px;
line-height: 22px;
letter-spacing: .15px;
font-weight: 500;
color: var(--color-black);
text-align: center
}
.address-modal__list {
list-style: none;
margin: 0;
padding: 0 9px 16px;
flex: 1 1 auto;
display: flex;
flex-direction: column;
gap: 0;
min-height: 0
}
.address-modal__item {
position: relative;
display: flex;
align-items: center;
gap: 0;
padding: 0;
margin: 0
}
.address-modal__select {
flex: 1;
min-width: 0;
display: flex;
align-items: center;
gap: 10px;
padding: 9px 40px 9px 9px;
border: none;
border-radius: 0;
background: 0 0;
font: inherit;
text-align: left;
cursor: pointer
}
.address-modal__select:focus-visible {
outline: 2px solid var(--color-orange2);
outline-offset: 2px
}
.address-modal__check {
flex-shrink: 0;
width: 20px;
height: 20px;
border-radius: 50%;
border: none;
background: var(--color-gray2);
display: flex;
align-items: center;
justify-content: center;
transition: background-color .15s
}
.address-modal__check svg {
width: 12px;
height: 10px;
opacity: 0;
transition: opacity .15s
}
.address-modal__select--active .address-modal__check {
background-color: var(--color-orange2)
}
.address-modal__select--active .address-modal__check svg {
opacity: 1
}
.address-modal__text {
font-size: 16px;
line-height: 24px;
letter-spacing: .15px;
color: var(--color-black)
}
.address-modal__divider {
height: 1px;
margin: 4px 0 0 40px;
background: #e8e8e8;
border: none
}
.address-modal__more {
position: absolute;
top: 50%;
right: 4px;
transform: translateY(-50%);
z-index: 1;
flex-shrink: 0;
width: 32px;
height: 32px;
padding: 0;
border: none;
border-radius: 50%;
background: 0 0;
color: var(--color-gray4);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center
}
.address-modal__more:hover {
color: var(--color-black);
background: rgba(0,0,0,.04)
}
.address-modal__more:focus-visible {
outline: 2px solid var(--color-orange2);
outline-offset: 2px
}
.address-modal__more--open {
color: var(--color-black);
background: rgba(0,0,0,.06)
}
.address-modal__more-icon {
display: block
}
.address-modal__footer {
flex-shrink: 0;
padding: 12px 16px calc(20px + env(safe-area-inset-bottom,0));
background-color: var(--color-white)
}
.address-modal__add {
width: 100%;
max-width: 380px;
margin: 0 auto;
display: block;
padding: 15px;
border: none;
border-radius: 30px;
background-color: var(--color-orange2);
color: var(--color-white);
font: inherit;
font-size: 16px;
line-height: 20px;
letter-spacing: .15px;
cursor: pointer;
text-align: center;
transition: opacity .15s
}
.address-modal__add:hover {
opacity: .95
}
.address-modal__add:focus-visible {
outline: 2px solid var(--color-black2);
outline-offset: 2px
}
.address-modal__create {
display: flex;
flex-direction: column;
min-height: 0;
flex: 1 1 auto;
padding: 0 13px
}
.address-modal__close[hidden],.address-modal__create[hidden],.address-modal__edit[hidden],.address-modal__footer[hidden],.address-modal__handle[hidden],.address-modal__list[hidden],.address-modal__title[hidden] {
display: none!important
}
.address-modal__field {
display: flex;
flex-direction: column;
gap: 4px;
margin: 0 0 6px;
padding: 12px 14px;
border-radius: 16px;
background: #f0f0f0
}
.address-modal__field--pnone {
padding: 0
}
.address-modal__field--joined {
margin: 0;
border-radius: 0;
background: 0 0
}
.address-modal__field-label {
font-size: 12px
}
.address-modal__input {
width: 100%;
border: none;
border-bottom: 1px solid var(--lavka-divider);
border-radius: 0;
padding: 2px 0 8px;
font-size: 12px;
line-height: 1.2;
color: var(--color-black);
background: 0 0;
outline: 0
}
.address-modal__input::-moz-placeholder {
color: var(--color-gray4)
}
.address-modal__input::placeholder {
color: var(--color-gray4)
}
.address-modal__input:focus {
border-bottom-color: var(--color-orange2)
}
.address-modal__street-block {
padding: 12px 14px;
margin: 0 0 6px;
border-radius: 16px;
background: #f0f0f0;
overflow: hidden
}
.address-modal__row-pill {
margin-top: 8px;
width: 55%;
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 13px;
border-radius: 10px;
font-size: 14px;
line-height: 16px;
letter-spacing: .15px;
cursor: pointer;
transition: background-color .15s,color .15s;
background-color: #e8e8e8;
color: var(--color-gray)
}
.address-modal__row-pill:has(input:checked) {
background-color: #ffe9d9;
color: var(--color-orange2)
}
.address-modal__pill-text {
font-size: 14px;
font-weight: 500;
color: var(--color-gray);
transition: color .2s ease
}
.address-modal__toggle {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 20px;
height: 20px;
margin: 0;
flex-shrink: 0;
border-radius: 50%;
border: 2px solid var(--lavka-divider);
background-color: var(--color-white);
cursor: pointer;
transition: border-color .15s,background-color .15s,background-image .15s
}
.address-modal__toggle:checked {
border-color: var(--color-orange2);
background-color: var(--color-orange2);
background-image: url(./assets/images/icons/checked.svg);
background-repeat: no-repeat;
background-position: center center;
background-size: 10px 9px
}
.address-modal__toggle:not(:checked) {
border-color: var(--lavka-divider);
background-color: var(--color-gray2);
background-image: none
}
.address-modal__checkbox-row--checked {
background: #ffe9d7
}
.address-modal__create-actions {
display: flex;
margin-top: auto;
padding: 18px 0 calc(14px + env(safe-area-inset-bottom,0))
}
.address-modal__primary {
width: 100%;
padding: 15px;
border-radius: 30px;
border: none;
font-size: 16px;
font-weight: 500;
cursor: pointer;
background: var(--color-orange2);
color: #fff
}
.address-modal__danger {
width: 100%;
padding: 15px;
border-radius: 30px;
border: none;
font-size: 16px;
line-height: 20px;
letter-spacing: .15px;
font-weight: 500;
cursor: pointer;
background: #f0f0f0;
color: var(--color-black)
}
.address-modal__error {
margin: 0 0 8px;
color: #d03333;
font-size: 14px
}
.address-modal__edit {
display: flex;
flex-direction: column;
min-height: 0;
flex: 1 1 auto;
padding: 0 16px calc(16px + env(safe-area-inset-bottom,0))
}
.address-modal__edit-head {
position: relative;
display: flex;
align-items: center;
justify-content: center;
margin: 14px 0 28px;
min-height: 26px
}
.address-modal__back {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
width: 35px;
height: 26px;
padding: 0;
border: none;
border-radius: 10px;
background: #eaeaea;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer
}
.address-modal__back img {
width: 18px;
height: 18px;
display: block
}
.address-modal__edit-title {
margin: 0;
font-size: 18px;
line-height: 22px;
letter-spacing: .15px;
font-weight: 500;
color: var(--color-black);
text-align: center
}
.address-modal__switch-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
margin: 0 0 24px;
cursor: pointer
}
.address-modal__switch-text {
font-size: var(--lavka-field-fs);
line-height: 22px;
letter-spacing: .15px;
color: var(--color-black)
}
.address-modal__switch {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 46px;
height: 20px;
margin: 0;
flex-shrink: 0;
border-radius: 999px;
background: #d9d9d9;
position: relative;
cursor: pointer;
transition: background-color .2s
}
.address-modal__switch::after {
content: "";
position: absolute;
top: 2px;
left: 2px;
width: 16px;
height: 16px;
border-radius: 50%;
background: #a6a6a6;
box-shadow: 0 1px 2px rgba(0,0,0,.15);
transition: transform .2s,background-color .2s
}
.address-modal__switch:checked {
background: var(--color-orange2)
}
.address-modal__switch:checked::after {
background: var(--color-white);
transform: translateX(26px)
}
.address-modal__edit-field {
display: flex;
flex-direction: column;
gap: 8px;
margin: 0 0 18px
}
.address-modal__edit-field[hidden] {
display: none!important
}
.address-modal__edit-label {
font-size: 12px;
line-height: 17px;
letter-spacing: .15px;
color: var(--color-gray)
}
.address-modal__edit-input-wrap {
position: relative;
display: block
}
.address-modal__edit-input {
width: 100%;
border: none;
border-bottom: 1px solid var(--lavka-divider);
border-radius: 0;
padding: 0 28px 10px 0;
font: inherit;
font-size: 14px;
line-height: 20px;
letter-spacing: .15px;
color: var(--color-black);
background: 0 0;
outline: 0
}
.address-modal__edit-input::-moz-placeholder {
color: var(--color-gray4)
}
.address-modal__edit-input::placeholder {
color: var(--color-gray4)
}
.address-modal__edit-input:focus {
border-bottom-color: var(--color-orange2)
}
.address-modal__edit-field:not(.address-modal__edit-field--street) .address-modal__edit-input {
padding-right: 0
}
.address-modal__edit-clear {
position: absolute;
right: 0;
top: 50%;
transform: translateY(calc(-50% - 4px));
width: 24px;
height: 24px;
padding: 0;
border: none;
background: 0 0;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer
}
.address-modal__edit-clear[hidden] {
display: none!important
}
.address-modal__edit-actions {
display: flex;
flex-direction: column;
gap: 10px;
margin-top: auto;
padding-top: 24px
}
.auth-modal {
position: fixed;
inset: 0;
z-index: 3100;
display: none;
align-items: flex-end;
justify-content: center;
padding: 0;
font-weight: 500
}
.auth-modal--code {
z-index: 3150
}
.auth-modal--open {
display: flex
}
.auth-modal__backdrop {
position: absolute;
inset: 0;
background: rgba(0,0,0,.55);
border: none;
padding: 0;
cursor: pointer
}
.auth-modal__sheet {
position: relative;
z-index: 1;
width: 100%;
max-width: 412px;
display: flex;
flex-direction: column;
background-color: #f4f4f4;
border-radius: 20px 20px 0 0;
padding: 12px 13px 0;
box-shadow: 0 -4px 24px rgba(0,0,0,.12)
}
.auth-modal__close {
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
margin: 0 4px 4px auto;
padding: 0;
border: none;
background: #eaeaea;
cursor: pointer;
color: var(--color-gray4);
border-radius: 50%;
transition: background-color .15s,color .15s
}
.auth-modal__close:hover {
background-color: rgba(0,0,0,.06);
color: var(--color-black)
}
.auth-modal__close:focus-visible {
outline: 2px solid var(--color-orange2);
outline-offset: 2px
}
.auth-modal__close-icon {
display: block
}
.auth-modal__body {
padding: 8px 4px 24px
}
.auth-modal__title {
margin: 0 0 8px;
font-size: 20px;
line-height: 24px;
letter-spacing: .15px;
font-weight: 500;
text-align: center
}
.auth-modal__subtitle {
margin: 0 0 30px;
font-size: 14px;
line-height: 20px;
letter-spacing: .15px;
max-width: 190px;
margin-inline: auto;
color: var(--color-gray4);
text-align: center
}
.auth-modal__subtitle--email span {
color: var(--color-black);
word-break: break-word
}
.auth-modal__field {
width: 100%;
max-width: 320px;
margin: 0 auto
}
.auth-modal__input {
width: 100%;
max-width: 100%;
padding: 0 0 4px;
border: none;
border-bottom: 1px solid var(--lavka-divider);
background: 0 0;
font: inherit;
font-size: 18px;
line-height: 24px;
letter-spacing: .15px;
font-weight: 500;
color: var(--color-black2)
}
.auth-modal__input::-moz-placeholder {
color: var(--color-gray4);
font-weight: 500
}
.auth-modal__input::placeholder {
color: var(--color-gray4);
font-weight: 500
}
.auth-modal__input:focus {
outline: 0;
border-bottom-color: var(--color-orange2)
}
.auth-modal__input--full {
max-width: 100%;
text-align: center
}
.auth-modal__footer {
flex-shrink: 0;
padding: 12px 0 calc(20px + env(safe-area-inset-bottom,0));
background-color: #f4f4f4
}
.auth-modal__policy {
font-size: 12px;
padding-left: 10px;
margin-bottom: 5px;
color: var(--color-black2)
}
.auth-modal__policy a {
color: var(--color-orange2)
}
.auth-modal__tech-title {
text-align: left;
font-size: 20px
}
.auth-modal__tech-phone-wrapper {
margin-top: 34px;
padding: 15px;
background-color: #f1f1f1;
border-radius: 20px;
display: flex;
justify-content: space-between;
align-items: center
}
.auth-modal__tech-phone-text {
font-size: 18px;
color: var(--color-black2)
}
.auth-modal__tech-phone-timer {
font-size: 13px;
line-height: 1.4;
margin-top: 4px;
color: var(--color-gray)
}
.auth-modal__tech-phone-icon {
width: 50px;
height: 50px;
border-radius: 50%;
background-color: var(--color-white);
display: flex;
align-items: center;
justify-content: center
}
.auth-modal__tech-phone-icon img {
width: 30px;
height: 30px
}
.auth-modal__submit {
width: 100%;
max-width: 380px;
margin: 0 auto;
display: block;
padding: 14px 16px 16px;
border: none;
border-radius: 30px;
background-color: var(--color-orange2);
color: var(--color-white);
font: inherit;
font-size: 18px;
line-height: 22px;
letter-spacing: .15px;
font-weight: 500;
cursor: pointer;
text-align: center
}
.auth-modal__submit:focus-visible {
outline: 2px solid var(--color-black2);
outline-offset: 2px
}
.auth-modal__submit:disabled:not(.is-loading) {
opacity: .5;
cursor: not-allowed
}
.partner-connect {
min-height: 100dvh;
display: flex;
flex-direction: column;
background: var(--color-black);
font-weight: 500;
color: var(--color-black)
}
.partner-connect--success {
background: var(--color-black)
}
.partner-connect--success .partner-connect__footer {
display: none
}
.partner-connect__top {
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
position: relative;
padding: 15px 17px 20px;
background: var(--color-black)
}
.partner-connect__top--light {
background: var(--color-white);
justify-content: flex-start;
gap: 16px;
padding: 15px 16px
}
.partner-connect__logo {
position: absolute;
left: 17px;
top: 15px;
width: 35px;
height: 25px
}
.partner-connect__logo img {
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain
}
.partner-connect__support {
background: 0 0;
border: none;
padding: 0;
font: inherit;
font-size: 16px;
line-height: 20px;
color: var(--color-white);
cursor: pointer
}
.partner-connect__back {
width: 35px;
padding: 4px 0;
border-radius: 10px;
background: #eaeaea;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0
}
.partner-connect__back img {
width: 18px;
height: 18px
}
.partner-connect__head {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 15px
}
.partner-connect__title--page {
margin: 0 0 15px;
font-size: 20px;
line-height: 24px;
color: var(--color-black2)
}
.partner-connect__title--page-inline {
margin: 0
}
.partner-connect__body,.partner-connect__sheet {
flex: 1 1 auto;
background: var(--color-white);
padding: 12px 16px 110px;
min-height: 0
}
.partner-connect__sheet {
padding: 12px 10px 110px
}
.partner-connect__step[hidden] {
display: none!important
}
.partner-connect__field {
margin-top: 12px;
padding: 10px 0 8px;
border-bottom: 1px solid var(--lavka-divider)
}
.partner-connect__field:first-child {
margin-top: 0
}
.partner-connect__label {
display: block;
font-size: 14px;
line-height: 12px;
color: var(--color-gray);
margin-bottom: 8px
}
.partner-connect__input {
width: 100%;
border: none;
background: 0 0;
padding: 0;
font: inherit;
font-size: 16px;
line-height: 20px;
color: var(--color-black2)
}
.partner-connect__input:focus {
outline: 0
}
.partner-connect__section-label {
margin: 22px 0 10px;
font-size: 14px;
line-height: 16px;
color: var(--color-black)
}
.partner-connect__chips {
display: flex;
flex-wrap: wrap;
gap: 10px
}
.partner-connect__chip {
display: inline-flex;
align-items: center;
gap: 10px;
padding: 10px 12px;
border-radius: 10px;
background: #f0f0f0;
border: none;
font: inherit;
font-size: 14px;
line-height: 16px;
color: var(--color-gray);
cursor: pointer
}
.partner-connect__chip--active {
color: var(--color-black)
}
.partner-connect__chip--active .partner-connect__chip-check {
background: var(--color-black);
background-image: url(assets/images/icons/mark.svg);
background-repeat: no-repeat;
background-position: center;
background-size: 11px 9px
}
.partner-connect__chip-check {
width: 20px;
height: 20px;
border-radius: 50%;
background: var(--color-gray2);
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center
}
.partner-connect__footer {
position: fixed;
left: 0;
right: 0;
bottom: 0;
padding: 12px 16px calc(16px + env(safe-area-inset-bottom,0));
background: var(--color-white)
}
.partner-connect__submit {
display: block;
width: 100%;
max-width: 380px;
margin: 0 auto;
padding: 14px 16px;
border: none;
border-radius: 30px;
background: var(--color-black);
color: var(--color-white);
font: inherit;
font-size: 18px;
line-height: 20px;
cursor: pointer;
text-align: center
}
.partner-connect__submit:disabled {
opacity: .5;
cursor: not-allowed
}
.partner-connect__error {
margin: 12px 0 0;
font-size: 13px;
line-height: 1.35;
color: #c62828
}
.partner-connect__error[hidden] {
display: none
}
.partner-connect__card {
display: block;
padding: 21px 25px 24px;
border-radius: 20px;
background: var(--color-white);
box-shadow: 0 0 2px rgba(0,0,0,.25)
}
.partner-connect__card-name {
margin: 0;
font-size: 20px;
line-height: 24px;
color: var(--color-black);
text-transform: uppercase
}
.partner-connect__card-status {
display: block;
margin-top: 8px;
font-size: 14px;
line-height: 18px;
color: var(--color-gray)
}
.partner-connect__toast {
position: fixed;
right: 16px;
bottom: calc(24px + env(safe-area-inset-bottom,0));
z-index: 20;
width: min(295px,100vw - 32px);
padding: 18px 22px;
border-radius: 20px;
background: var(--color-black);
color: var(--color-white);
box-shadow: 0 4px 24px rgba(0,0,0,.18)
}
.partner-connect__toast-title {
margin: 0;
font-size: 16px;
line-height: 18px
}
.partner-connect__toast-text {
margin: 8px 0 0;
font-size: 14px;
line-height: 16px;
color: var(--color-gray2)
}
.partner-orders {
min-height: 100dvh;
display: flex;
flex-direction: column;
background: var(--color-white);
font-weight: 500
}
.partner-orders__head {
position: sticky;
top: 0;
z-index: 20;
padding: 15px 12px 12px;
background: var(--color-white);
border-radius: 0 0 20px 20px;
box-shadow: 0 0 4px rgba(0,0,0,.25)
}
.partner-orders__top {
display: flex;
align-items: center;
justify-content: center;
position: relative
}
.partner-orders__back {
position: absolute;
left: 0;
top: 0;
width: 35px;
padding: 4px 0;
border-radius: 10px;
background: #eaeaea;
display: flex;
align-items: center;
justify-content: center
}
.partner-orders__back img {
width: 18px;
height: 18px
}
.partner-orders__title {
margin: 0;
font-size: 20px;
line-height: 26px;
letter-spacing: .15px;
color: #000;
text-align: center
}
.partner-orders__url {
display: block;
margin-top: 4px;
font-size: 14px;
line-height: 16px;
letter-spacing: .15px;
color: var(--color-gray);
text-align: center;
text-decoration: none
}
.partner-orders__menu {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 4px;
width: 99px;
margin: 18px auto 0;
padding: 8px 10px 10px;
border-radius: 10px;
background: #f0f0f0;
color: var(--color-black);
text-decoration: none;
font-size: 12px;
line-height: 12px;
letter-spacing: .15px
}
.partner-orders__menu img {
width: var(--lavka-icon);
height: var(--lavka-icon);
-o-object-fit: contain;
object-fit: contain
}
.partner-orders__filters {
display: flex;
align-items: center;
gap: 4px;
margin: 14px 11px 0;
padding: 3px 4px;
border-radius: 20px;
background: var(--color-white);
box-shadow: 0 0 4px rgba(0,0,0,.25);
overflow-x: auto;
scrollbar-width: none
}
.partner-orders__filters::-webkit-scrollbar {
display: none
}
.partner-orders__filter {
flex: 0 0 auto;
padding: 6px 12px;
border-radius: 20px;
background: 0 0;
color: var(--color-gray);
font-size: 12px;
line-height: 16px;
letter-spacing: .15px;
white-space: nowrap
}
.partner-orders__filter--active {
background: #f0f0f0;
color: var(--color-black)
}
.partner-orders__body {
flex: 1 1 auto;
padding: 18px 11px 24px;
overflow-y: auto
}
.partner-orders__month {
margin: 0 0 12px;
font-size: 20px;
line-height: 16px;
letter-spacing: .15px;
color: var(--color-black)
}
.partner-orders__month span {
color: var(--color-gray)
}
.partner-orders__group+.partner-orders__group {
margin-top: 20px
}
.partner-orders__list {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 10px
}
.partner-orders__card {
position: relative;
padding: 14px 18px;
border-radius: 20px;
background: var(--color-white);
box-shadow: 0 0 2px rgba(0,0,0,.25);
cursor: pointer
}
.partner-orders__card-count {
margin: 0;
font-size: 16px;
line-height: 20px;
letter-spacing: .15px;
color: var(--color-black);
padding-right: 110px
}
.partner-orders__card-status {
position: absolute;
top: 12px;
right: 16px;
display: flex;
align-items: center;
justify-content: center
}
.partner-orders__card-status img {
width: 22px;
height: 22px;
-o-object-fit: contain;
object-fit: contain
}
.partner-orders__card-status-text {
font-size: 11px;
line-height: 16px;
letter-spacing: .5px;
color: #ff2d2d;
text-align: right;
max-width: 120px
}
.partner-orders__card-meta {
margin-top: 28px;
display: flex;
align-items: center;
gap: 8px;
font-size: 12px;
line-height: 12px;
letter-spacing: .15px;
color: var(--color-gray)
}
.partner-orders__card-dot {
width: 6px;
height: 6px;
border-radius: 50%;
background: var(--color-gray2);
flex-shrink: 0
}
.partner-orders__empty {
padding: 40px 16px;
text-align: center;
color: var(--color-gray4);
font-size: 16px;
line-height: 22px
}
.partner-menu {
--partner-menu-head-height: 56px;
--partner-menu-side: 12px;
min-height: 100dvh;
display: flex;
flex-direction: column;
background: var(--color-white);
font-weight: 500
}
.partner-menu__head {
position: sticky;
top: 0;
z-index: 40;
display: flex;
align-items: center;
justify-content: center;
padding: 15px 12px;
background: var(--color-white);
border-radius: 0 0 20px 20px;
box-shadow: 0 0 4px rgba(0,0,0,.25)
}
.partner-menu__back {
position: absolute;
left: 12px;
top: 15px;
width: 35px;
padding: 4px 0;
border-radius: 10px;
background: #eaeaea;
display: flex;
align-items: center;
justify-content: center
}
.partner-menu__back img {
width: 18px;
height: 18px
}
.partner-menu__title {
margin: 0;
font-size: 20px;
line-height: 26px;
letter-spacing: .15px;
color: #000;
text-align: center
}
.partner-menu__tabs {
position: sticky;
top: calc(var(--partner-menu-head-height) + var(--partner-menu-side));
z-index: 35;
display: flex;
align-items: center;
gap: 6px;
margin: 10px var(--partner-menu-side) 0;
padding: 5px;
border-radius: 30px;
background: var(--color-white);
box-shadow: 0 0 2px rgba(0,0,0,.25);
overflow-x: auto;
scrollbar-width: none
}
.partner-menu__tabs::-webkit-scrollbar {
display: none
}
.partner-menu__tab {
flex: 0 0 auto;
min-width: 95px;
padding: 6px 16px;
border-radius: 15px;
background: 0 0;
color: var(--color-gray);
font-size: 14px;
line-height: 12px;
letter-spacing: .15px;
white-space: nowrap
}
.partner-menu__tab--active {
background: #f2f2f2;
color: var(--color-black)
}
.partner-menu__body {
flex: 1 1 auto;
padding: 16px 9px 32px
}
.partner-menu__panel {
display: none
}
.partner-menu__panel--active {
display: block
}
.partner-menu__grid {
display: grid;
grid-template-columns: repeat(2,1fr);
gap: 14px
}
.partner-menu__card {
min-width: 0
}
.partner-menu__image {
width: 100%;
aspect-ratio: 174/185;
border-radius: 20px;
background-color: var(--color-gray5)
}
.partner-menu__image--photo {
background-size: cover;
background-position: center;
background-repeat: no-repeat
}
.partner-menu__name {
margin: 10px 0 0;
padding: 0 6px;
font-size: 14px;
line-height: 12px;
letter-spacing: .15px;
color: var(--color-black3)
}
.partner-menu__weight {
margin: 4px 0 0;
padding: 0 6px;
font-size: 12px;
line-height: 12px;
letter-spacing: .15px;
color: var(--color-gray4)
}
.partner-menu__price {
margin: 8px 0 0;
padding: 0 6px;
font-size: 20px;
line-height: 12px;
letter-spacing: .15px;
color: #000
}
.partner-menu__empty {
margin: 0;
padding: 24px 12px;
text-align: center;
color: var(--color-gray4);
font-size: 16px;
line-height: 22px
}
.partner-menu__empty--page {
padding: 40px 16px
}
.partner-order-modal {
position: fixed;
inset: 0;
z-index: 1200;
display: flex;
flex-direction: column;
justify-content: flex-end;
pointer-events: none;
visibility: hidden
}
.partner-order-modal[aria-hidden=false] {
pointer-events: auto;
visibility: visible
}
.partner-order-modal[aria-hidden=false] .partner-order-modal__backdrop {
opacity: 1
}
.partner-order-modal[aria-hidden=false] .partner-order-modal__sheet {
transform: translateY(0)
}
.partner-order-modal__backdrop {
position: absolute;
inset: 0;
background: rgba(0,0,0,.7);
border: none;
padding: 0;
opacity: 0;
transition: opacity .25s ease
}
.partner-order-modal__sheet {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
max-height: calc(100dvh - 50px);
margin-top: 50px;
padding: 0 0 calc(16px + env(safe-area-inset-bottom,0));
border-radius: 20px 20px 0 0;
background: var(--color-gray7);
transform: translateY(100%);
transition: transform .28s ease;
overflow: hidden
}
.partner-order-modal__handle {
flex-shrink: 0;
width: 35px;
height: 3px;
margin: 12px auto 0;
border-radius: 2px;
background: #cfcfcf
}
.partner-order-modal__close {
position: absolute;
right: 13px;
top: 13px;
z-index: 2;
display: flex;
align-items: center;
justify-content: center;
width: 30px;
padding: 3px;
border: none;
border-radius: 50%;
background: #eaeaea;
color: var(--color-gray4);
cursor: pointer
}
.partner-order-modal__close:hover {
background-color: rgba(0,0,0,.06);
color: var(--color-black)
}
.partner-order-modal__close-icon {
display: block
}
.partner-order-modal__scroll {
flex: 1 1 auto;
overflow-y: auto;
padding: 0 10px 12px;
min-height: 0
}
.partner-order-modal__head {
margin: 0 -10px 10px;
padding: 16px 16px 14px;
border-radius: 20px;
background: var(--color-white);
text-align: center
}
.partner-order-modal__status-icon {
width: 28px;
height: 28px;
margin: 0 auto 10px;
display: flex;
align-items: center;
justify-content: center
}
.partner-order-modal__status-icon img {
width: 28px;
height: 28px;
-o-object-fit: contain;
object-fit: contain
}
.partner-order-modal__status-title {
margin: 0 0 14px;
font-size: 18px;
line-height: 20px;
letter-spacing: .15px;
color: var(--color-black)
}
.partner-order-modal__actions {
display: flex;
align-items: stretch;
justify-content: center;
gap: 12px;
flex-wrap: wrap
}
.partner-order-modal__actions[hidden] {
display: none
}
.partner-order-modal__head--final .partner-order-modal__status-title {
margin-bottom: 0
}
.partner-order-modal__action {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 4px;
min-width: 99px;
padding: 8px 10px 10px;
border-radius: 10px;
background: #f0f0f0;
color: var(--color-black);
font-size: 12px;
line-height: 12px;
letter-spacing: .15px
}
.partner-order-modal__action img {
width: 18px;
height: 18px;
-o-object-fit: contain;
object-fit: contain
}
.partner-order-modal__action[hidden] {
display: none
}
.partner-order-modal__action:disabled {
opacity: .5;
cursor: not-allowed
}
.partner-order-modal__card {
margin-top: 10px;
padding: 12px;
border-radius: 10px;
background: var(--color-white)
}
.partner-order-modal__field+.partner-order-modal__field {
margin-top: 16px
}
.partner-order-modal__label {
display: block;
font-size: 12px;
line-height: 12px;
letter-spacing: .15px;
color: var(--color-gray4)
}
.partner-order-modal__value {
display: block;
margin-top: 4px;
font-size: 14px;
line-height: 14px;
letter-spacing: .15px;
color: var(--color-black);
white-space: pre-wrap
}
.partner-order-modal__row {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 12px;
font-size: 14px;
line-height: 20px;
letter-spacing: .15px
}
.partner-order-modal__row-text {
color: var(--color-black);
flex: 1 1 auto;
min-width: 0
}
.partner-order-modal__row-price {
color: var(--color-gray);
flex-shrink: 0
}
.partner-order-modal__total {
margin: 10px 0 0;
padding: 18px 12px;
border-radius: 10px;
background: var(--color-white);
text-align: center;
font-size: 16px;
line-height: 20px;
letter-spacing: .15px;
color: var(--color-black)
}
.partner-order-modal__error {
margin: 8px 10px 0;
font-size: 13px;
line-height: 1.35;
color: #c62828;
text-align: center
}
.partner-order-modal__error[hidden] {
display: none
}
.partner-cancel-modal {
position: fixed;
inset: 0;
z-index: 1300;
display: flex;
flex-direction: column;
justify-content: flex-end;
pointer-events: none;
visibility: hidden
}
.partner-cancel-modal[aria-hidden=false] {
pointer-events: auto;
visibility: visible
}
.partner-cancel-modal[aria-hidden=false] .partner-cancel-modal__backdrop {
opacity: 1
}
.partner-cancel-modal[aria-hidden=false] .partner-cancel-modal__sheet {
transform: translateY(0)
}
.partner-cancel-modal__backdrop {
position: absolute;
inset: 0;
background: rgba(0,0,0,.7);
border: none;
padding: 0;
opacity: 0;
transition: opacity .25s ease
}
.partner-cancel-modal__sheet {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
max-height: calc(100dvh - 50px);
margin-top: 50px;
padding: 12px 16px calc(16px + env(safe-area-inset-bottom,0));
border-radius: 20px 20px 0 0;
background: var(--color-white);
transform: translateY(100%);
transition: transform .28s ease
}
.partner-cancel-modal__handle {
width: 35px;
height: 3px;
margin: 0 auto 40px;
border-radius: 2px;
background: #cfcfcf
}
.partner-cancel-modal__close {
position: absolute;
right: 13px;
top: 13px;
z-index: 2;
display: flex;
align-items: center;
justify-content: center;
width: 30px;
padding: 3px;
border: none;
border-radius: 50%;
background: #eaeaea;
color: var(--color-gray4);
cursor: pointer
}
.partner-cancel-modal__close:hover {
background-color: rgba(0,0,0,.06);
color: var(--color-black)
}
.partner-cancel-modal__close-icon {
display: block
}
.partner-cancel-modal__title {
margin: 0;
font-size: 20px;
line-height: 20px;
letter-spacing: .15px;
color: var(--color-black);
text-align: center
}
.partner-cancel-modal__subtitle {
margin: 8px 0 0;
font-size: 16px;
line-height: 20px;
letter-spacing: .15px;
color: var(--color-gray4);
text-align: center
}
.partner-cancel-modal__input {
flex: 1 1 auto;
width: 100%;
margin-top: 28px;
padding: 12px 0;
border: none;
background: 0 0;
resize: none;
font: inherit;
font-size: 20px;
line-height: 24px;
letter-spacing: .15px;
color: var(--color-black);
text-align: center;
min-height: 120px
}
.partner-cancel-modal__input:focus {
outline: 0
}
.partner-cancel-modal__input::-moz-placeholder {
color: var(--color-gray4)
}
.partner-cancel-modal__input::placeholder {
color: var(--color-gray4)
}
.partner-cancel-modal__error {
margin-top: 8px;
font-size: 13px;
line-height: 1.35;
color: #c62828;
text-align: center
}
.partner-cancel-modal__error[hidden] {
display: none
}
.partner-cancel-modal__submit {
display: block;
width: 100%;
margin-top: 24px;
padding: 14px 16px;
border: none;
border-radius: 30px;
background: #eaeaea;
color: var(--color-black);
font: inherit;
font-size: 18px;
line-height: 20px;
letter-spacing: .15px;
cursor: pointer
}
.partner-cancel-modal__submit:disabled {
opacity: .55;
cursor: not-allowed
}
.partner-cancel-modal__submit:not(:disabled) {
background: var(--color-black);
color: var(--color-white)
}
.partner-cancel-modal__submit--always {
background: var(--color-black);
color: var(--color-white);
opacity: 1;
cursor: pointer
}
.partner-cancel-modal__submit--always:disabled {
opacity: .55
}
.order {
padding: 40px 0 10px 0;
border-bottom: 1px solid rgba(0,0,0,.25)
}
.order__title {
max-width: 90px;
margin-inline: auto;
font-size: 20px;
color: var(--color-black2);
text-align: center
}
.order-list {
display: flex;
flex-grow: 1;
overflow-y: auto;
scrollbar-width: none;
-ms-overflow-style: none
}
.order-list::-webkit-scrollbar {
display: none
}
.order-list__wrapper {
max-width: 1500px;
padding: 0 15px;
margin: 10px auto;
display: flex;
flex-direction: column;
width: 100%
}
.order-list__title {
font-size: 20px;
margin-bottom: 15px
}
.order-list__month {
color: var(--color-black)
}
.order-list__year {
color: var(--color-gray)
}
.order-list__item {
position: relative;
padding: 14px 18px;
margin-bottom: 10px;
border-radius: 20px;
background-color: var(--color-gray3);
cursor: pointer;
list-style: none
}
.order-list__item:last-child {
margin-bottom: 0
}
.order-list__item:focus-visible {
outline: 2px solid var(--color-orange2);
outline-offset: 2px
}
.order-list__item-title {
font-size: 16px;
color: var(--color-black)
}
.order-list__item-count {
font-size: 12px;
margin-top: 5px;
color: var(--color-gray)
}
.order-list__item-info-block {
margin-top: 20px;
display: flex;
align-items: center;
gap: 8px;
font-size: 12px;
color: var(--color-gray)
}
.order-list__item-dot {
width: 6px;
height: 6px;
border-radius: 50%;
background-color: #d9d9d9;
flex-shrink: 0
}
.order-list__item-date {
display: flex;
align-items: center;
gap: 4px
}
.order-detail {
position: fixed;
inset: 0;
z-index: 3200;
display: none;
align-items: flex-end;
justify-content: center;
padding: 0;
font-weight: 500
}
.order-detail--open {
display: flex
}
.order-detail__backdrop {
position: absolute;
inset: 0;
background: rgba(0,0,0,.55);
border: none;
padding: 0;
cursor: pointer
}
.order-detail__sheet {
position: relative;
z-index: 1;
width: 100%;
max-width: 412px;
max-height: min(92vh,900px);
max-height: min(92dvh,900px);
display: flex;
flex-direction: column;
background-color: #f4f4f4;
border-radius: 20px 20px 0 0;
padding: 13px 13px calc(16px + env(safe-area-inset-bottom,0));
box-shadow: 0 -4px 24px rgba(0,0,0,.12);
overflow: hidden
}
.order-detail__scroll {
display: flex;
flex-direction: column;
flex: 1 1 auto;
min-height: 0;
overflow-y: auto;
-webkit-overflow-scrolling: touch
}
.order-detail__close {
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
padding: 0;
border: none;
background: #eaeaea;
cursor: pointer;
color: var(--color-gray4);
border-radius: 50%;
transition: background-color .15s,color .15s;
position: absolute;
right: 13px;
top: 13px
}
.order-detail__close:hover {
background-color: rgba(0,0,0,.06);
color: var(--color-black)
}
.order-detail__close:focus-visible {
outline: 2px solid var(--color-orange2);
outline-offset: 2px
}
.order-detail__close-icon {
display: block
}
.order-detail__info-card {
background: var(--color-white);
border-radius: 10px;
padding: 14px 13px 16px;
margin-bottom: 8px
}
.order-detail__field {
margin-bottom: 16px
}
.order-detail__field:last-child {
margin-bottom: 0
}
.order-detail__label {
display: block;
font-size: 12px;
line-height: 12px;
letter-spacing: .15px;
color: var(--color-gray4);
margin-bottom: 6px
}
.order-detail__value {
font-size: 14px;
line-height: 18px;
letter-spacing: .15px;
color: var(--color-black)
}
.order-detail__row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
min-height: 59px;
padding: 10px 12px;
margin-bottom: 8px;
background: var(--color-white);
border-radius: 10px;
font-size: 14px;
line-height: 20px;
letter-spacing: .15px;
color: var(--color-black)
}
.order-detail__row:last-of-type {
margin-bottom: 0
}
.order-detail__row-text {
flex: 1;
min-width: 0
}
.order-detail__row-price {
flex-shrink: 0;
font-weight: 500
}
.order-detail__total {
display: flex;
align-items: center;
justify-content: center;
min-height: 59px;
padding: 12px;
margin-top: 8px;
background: var(--color-white);
border-radius: 10px;
font-size: 16px;
line-height: 20px;
letter-spacing: .15px;
font-weight: 500;
color: var(--color-black2)
}
.order-detail__repeat {
display: block;
width: 100%;
min-height: var(--lavka-btn-h);
margin-top: 8px;
padding: 12px;
border: 0;
border-radius: var(--lavka-btn-radius);
background-color: var(--color-orange2);
color: var(--color-white);
font-family: inherit;
font-size: var(--lavka-btn-fs);
line-height: 1.25;
font-weight: 600;
letter-spacing: .15px;
cursor: pointer;
-webkit-tap-highlight-color: transparent
}
.order-detail__repeat[hidden] {
display: none;
}
.order-detail__repeat:disabled {
opacity: .55;
cursor: default
}
.order-detail__repeat:focus-visible {
outline: 2px solid var(--color-black);
outline-offset: 2px
}
.order-detail__info {
padding: 15px 15px 20px 15px;
border-radius: 20px;
background-color: var(--color-white);
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-bottom: 5px
}
.order-detail__status-img {
width: 30px;
height: 30px
}
.order-detail__status-img img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover
}
.order-detail__status-text {
font-size: 18px;
margin-top: 9px
}
.order-detail__status-cancel {
margin-top: 22px;
background-color: var(--color-gray7);
border-radius: 10px;
padding: 2px 2px 7px 2px;
width: 99px;
display: flex;
flex-direction: column;
align-items: center;
border: none;
cursor: pointer;
color: var(--color-black)
}
.order-detail__status-cancel-img {
width: 24px;
height: 24px;
margin-inline: auto
}
.order-detail__status-cancel-img img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover
}
.order-detail__status-cancel-text {
font-size: 12px;
margin-top: 5px;
text-align: center
}
.nothing {
display: none;
flex-grow: 1;
justify-content: center;
align-items: center;
flex-direction: column;
gap: 8px
}
.nothing--visible {
display: flex!important;
min-height: calc(100dvh - 180px);
align-items: center;
justify-content: center;
width: 100%
}
.nothing--hidden {
display: none!important
}
.nothing__text {
font-size: 16px;
color: var(--color-gray);
text-align: center
}
.main--not-found {
flex: 1;
display: flex;
flex-direction: column;
min-height: 0
}
.not-found {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
padding: 32px 0 48px
}
.not-found__inner {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
max-width: 320px;
margin-inline: auto
}
.not-found__window {
width: 60px;
height: 60px;
background-color: var(--color-gray2);
border-radius: 20px;
margin-bottom: 8px
}
.not-found__code {
font-size: 56px;
font-weight: 700;
line-height: 1;
color: var(--color-blue);
letter-spacing: -.02em
}
.not-found__title {
margin-top: 12px;
font-size: 20px;
color: var(--color-black2)
}
.not-found__text {
margin-top: 8px;
font-size: 14px;
line-height: 1.35;
color: var(--color-gray)
}
.not-found__btn {
margin-top: 28px;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 220px;
padding: 14px 28px;
background-color: var(--color-orange2);
border-radius: 30px;
font-size: 16px;
font-weight: 500;
color: var(--color-white);
text-decoration: none;
transition: opacity .2s ease
}
.not-found__btn:hover {
opacity: .92
}
.not-found__btn:focus-visible {
outline: 2px solid var(--color-blue);
outline-offset: 3px
}
.page-404 {
min-height: 100vh;
display: flex;
flex-direction: column
}
.lavka-pwa {
padding-top: 59px;
padding-bottom: 12px;
background-color: var(--color-orange3)
}
.lavka-pwa__inner {
position: relative;
max-width: 500px;
margin-inline: auto;
padding: 11px 13px;
border-radius: 20px;
background-color: var(--color-white)
}
.lavka-pwa__close {
position: absolute;
top: 11px;
right: 13px;
width: 22px;
height: 22px;
background-color: var(--color-gray6);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center
}
.lavka-pwa__close img {
width: 14px;
height: 14px
}
.lavka-pwa__title {
font-size: 14px;
color: var(--color-black2)
}
.lavka-pwa__text {
margin-top: 10px;
font-size: 12px;
max-width: 300px
}
.lavka-pwa__info-list {
margin-top: 16px;
display: flex;
gap: 10px;
flex-wrap: wrap
}
.lavka-pwa__info-item-title {
font-size: 13px;
color: var(--color-black2);
padding-left: 19px
}
.lavka-pwa__info-item-text-item {
font-size: 11px;
padding: 7px 10px;
width: 210px;
border-radius: 20px;
background-color: var(--color-gray3);
margin-top: 6px;
min-height: 38px
}
.lavka-pwa__info-item-btn {
font-size: 11px;
color: var(--color-orange2);
text-wrap: nowrap;
padding: 7px 25px;
border-radius: 20px;
background-color: var(--color-orange);
margin-top: 6px;
height: 38px
}
.lavka-pwa-overlay {
display: none;
position: fixed;
inset: 0;
background: rgba(0,0,0,.5);
z-index: 9999;
align-items: center;
justify-content: center
}
.lavka-pwa-overlay.is-active {
display: flex
}
.lavka-pwa-overlay .lavka-pwa-icon {
max-width: 50px;
margin: 0 auto
}
.lavka-pwa-overlay .lavka-pwa-icon img {
max-width: 50px;
margin: 0 auto;
display: block
}
.lavka-pwa-overlay .lavka-pwa__inner {
padding: 20px 15px;
display: flex;
flex-direction: column;
align-items: center;
gap: 15px
}
.lavka-pwa-overlay .lavka-pwa__btn {
width: 100%;
background: #f60;
color: #fff;
text-align: center;
padding: 15px;
border-radius: 100px;
cursor: pointer
}
.lavka-pwa-overlay .lavka-pwa__info-list {
margin-top: 16px;
display: flex;
gap: 15px
}
.lavka-pwa-overlay .lavka-pwa__link {
text-align: center;
width: 100%;
min-height: 44px;
display: flex;
align-items: center;
justify-content: center;
color: #f60;
font-size: 14px;
background: 0 0;
border: none;
box-shadow: none;
cursor: pointer
}
.lavka-pwa-overlay .lavka-pwa__text {
text-align: center
}
.back {
background-color: var(--color-gray6);
width: 35px;
height: 26px;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center
}
.back img {
width: 18px;
height: 18px
}
.confirm {
position: fixed;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,.8);
top: 0;
left: 0;
z-index: 1000
}
.confirm--lavka-order {
z-index: 4000
}
.confirm__inner {
background-color: var(--color-white);
border-radius: 20px;
padding: 16px 20px;
width: 320px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%)
}
.confirm__title {
font-size: 16px;
line-height: 20px;
letter-spacing: .15px;
color: var(--color-black)
}
.confirm__text {
font-size: 13px;
line-height: 14px;
letter-spacing: .15px;
margin-top: 10px;
color: var(--color-gray)
}
.confirm__btns {
display: flex;
gap: 60px;
margin-top: 25px;
justify-content: flex-end
}
.confirm__btn {
background-color: transparent;
font-size: 16px;
line-height: 14px;
letter-spacing: .15px;
color: var(--color-black)
}
.confirm__btn--cancel {
color: var(--color-orange2)
}
.order-success-modal {
position: fixed;
inset: 0;
z-index: 3200;
display: none;
align-items: flex-end;
justify-content: center;
padding: 0;
padding-bottom: env(safe-area-inset-bottom,0);
font-weight: 500
}
.order-success-modal--open {
display: flex
}
.order-success-modal__backdrop {
position: absolute;
inset: 0;
background: rgba(0,0,0,.55);
border: none;
padding: 0;
cursor: pointer
}
.order-success-modal__sheet {
position: relative;
z-index: 1;
width: 100%;
max-width: 412px;
background: var(--color-white);
border-radius: 20px 20px 0 0;
padding: 12px 13px calc(24px + env(safe-area-inset-bottom,0));
box-shadow: 0 -4px 24px rgba(0,0,0,.12);
text-align: center
}
.order-success-modal__close {
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
margin: 0 0 8px auto;
padding: 0;
border: none;
background: #eaeaea;
cursor: pointer;
color: var(--color-gray4);
border-radius: 50%;
transition: background-color .15s,color .15s
}
.order-success-modal__close:hover {
background-color: rgba(0,0,0,.06);
color: var(--color-black)
}
.order-success-modal__close:focus-visible {
outline: 2px solid var(--color-orange2);
outline-offset: 2px
}
.order-success-modal__close-icon {
display: block;
flex-shrink: 0
}
.order-success-modal__title {
margin: 0 0 12px;
font-size: 18px;
line-height: 1.25;
font-weight: 600;
color: var(--color-black3)
}
.order-success-modal__text {
max-width: 250px;
margin: 0 auto;
font-size: 12px;
line-height: 1.4;
color: var(--color-gray)
}
.order-success-modal__cta {
display: block;
width: 100%;
margin-top: 28px;
padding: 14px 16px;
border: none;
border-radius: 30px;
background: #f0f0f0;
color: var(--color-black);
font-size: 16px;
font-weight: 500;
text-align: center;
text-decoration: none;
box-sizing: border-box
}
.order-success-modal__cta:hover {
opacity: .92
}
.order-success-modal__cta:focus-visible {
outline: 2px solid var(--color-orange2);
outline-offset: 2px
}
.order-success-modal__push {
display: block;
width: 100%;
margin-top: 12px;
padding: 14px 16px;
border: none;
border-radius: 30px;
background: var(--color-orange2);
color: var(--color-white);
font-size: 16px;
font-weight: 500;
text-align: center;
text-decoration: none;
cursor: pointer;
box-sizing: border-box
}
.order-success-modal__push:hover {
opacity: .92
}
.order-success-modal__push:focus-visible {
outline: 2px solid var(--color-orange2);
outline-offset: 2px
}
.order-success-modal__push[hidden] {
display: none
}
.order-success-modal__pwa {
display: block;
width: 100%;
margin-top: 12px;
padding: 14px 16px;
border: none;
border-radius: 30px;
background: #f0f0f0;
color: var(--color-black);
font-size: 16px;
font-weight: 500;
text-align: center;
text-decoration: none;
cursor: pointer;
box-sizing: border-box
}
.order-success-modal__pwa:hover {
opacity: .92
}
.order-success-modal__pwa:focus-visible {
outline: 2px solid var(--color-orange2);
outline-offset: 2px
}
.order-success-modal--partner .order-success-modal__push {
margin-top: 28px;
background: #f0f0f0;
color: var(--color-black)
}
.order-success-modal--partner .order-success-modal__push:focus-visible {
outline-color: var(--color-black2)
}
.lavka-admin {
max-width: 1500px;
margin: 0 auto;
padding: 24px 15px 120px
}
.lavka-admin__title {
font-size: 22px;
color: var(--color-black3);
text-align: center;
margin-bottom: 24px
}
.lavka-admin__loading {
text-align: center;
padding: 40px;
color: var(--color-gray4)
}
.lavka-admin__board {
display: grid;
grid-template-columns: repeat(3,1fr);
gap: 16px;
align-items: start
}
.policy-page {
background: linear-gradient(180deg,#fff 0,var(--color-gray7) 100%)
}
.policy {
padding: 24px 0 56px
}
.policy__head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin-bottom: 18px
}
.policy__badge {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 36px;
padding: 8px 16px;
border-radius: 999px;
background-color: var(--color-white);
box-shadow: 0 8px 24px rgba(0,0,0,.06);
font-size: 13px;
line-height: 1.2;
color: var(--color-gray);
text-align: center
}
.policy__card {
max-width: 860px;
margin: 0 auto;
padding: 26px 20px;
border: 1px solid rgba(7,7,7,.06);
border-radius: 28px;
background-color: var(--color-white);
box-shadow: 0 18px 48px rgba(0,0,0,.08)
}
.policy__intro {
padding-bottom: 22px;
border-bottom: 1px solid var(--lavka-divider)
}
.policy__eyebrow {
display: inline-block;
margin-bottom: 10px;
font-size: 13px;
font-weight: 700;
line-height: 1.2;
letter-spacing: .08em;
text-transform: uppercase;
color: var(--color-orange2)
}
.policy__title {
font-size: 32px;
line-height: 1.05;
color: var(--color-black2)
}
.policy__lead {
max-width: 620px;
margin-top: 14px;
font-size: 16px;
line-height: 1.55;
color: var(--color-gray)
}
.policy__content {
margin-top: 28px
}
.policy__section {
padding: 22px 0;
border-bottom: 1px solid var(--lavka-divider)
}
.policy__section:last-child {
padding-bottom: 0;
border-bottom: none
}
.policy__section p+p {
margin-top: 10px
}
.policy__section-title {
margin-bottom: 14px;
font-size: 22px;
line-height: 1.2;
color: var(--color-black2)
}
.policy__list {
margin-top: 12px;
padding-left: 22px;
display: grid;
gap: 10px
}
.policy__list li {
font-size: 15px;
line-height: 1.6;
color: var(--color-gray)
}
.policy p {
font-size: 15px;
line-height: 1.6;
color: var(--color-gray)
}
.policy a {
color: var(--color-orange3);
text-decoration: none
}
.policy__contacts {
margin-top: 16px;
display: flex;
flex-wrap: wrap;
gap: 12px
}
.policy__contact {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 46px;
padding: 10px 18px;
border-radius: 14px;
background-color: var(--color-orange);
font-size: 14px;
font-weight: 500;
line-height: 1.2;
color: var(--color-orange3)
}
@media (max-width:900px) {
.lavka-admin__board {
grid-template-columns: 1fr
}
}
@media (max-width:767.98px) {
.shop-catalog__inner {
grid-template-columns: repeat(2,1fr)
}
.checkout-modal--open {
display: flex;
align-items: center;
justify-content: flex-end;
padding-left: 0;
padding-right: 0;
padding-bottom: env(safe-area-inset-bottom,0);
box-sizing: border-box;
max-height: 100vh;
max-height: 100dvh
}
}
@media (max-width:767px) {
.lavka-pwa-overlay.is-active {
align-items: flex-end
}
.lavka-pwa-overlay .lavka-pwa__inner {
border-radius: 20px 20px 0 0
}
.policy {
padding: 20px 0 40px
}
.policy__head {
align-items: flex-start;
flex-direction: column
}
.policy__card {
padding: 22px 16px;
border-radius: 22px
}
.policy__title {
font-size: 26px
}
.policy__section {
padding: 18px 0
}
.policy__section-title {
font-size: 20px
}
.policy p,.policy__lead,.policy__list li {
font-size: 14px
}
.policy__badge {
width: 100%
}
.policy__contact {
width: 100%
}
}
.partner-catalog__delivery-note[hidden],
.partner-catalog__total-btn[hidden],
.basket-list__btn[hidden],
.lavka-admin__board[hidden]{display:none}
.delivery__item--closed .delivery__link{opacity:.55}
.delivery__img{position:relative}
.delivery__closed{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);white-space:nowrap;border-radius:20px;background-color:var(--color-black);padding:4px 12px;font-size:12px;color:var(--color-white)}
.partner-shop__closed{margin:10px 20px 0;border-radius:20px;background-color:var(--color-orange);padding:8px 17px;font-size:14px;line-height:20px;color:var(--color-black2);text-align:center}
.partner-shop__delivery-badge--warn{background-color:var(--color-orange3);color:var(--color-white)}
.partner-catalog__delivery-note[hidden]{display:none}
.p-hours{display:flex;flex-direction:column;min-height:100vh;padding:0 20px 24px;box-sizing:border-box}
.p-hours__head{position:relative;display:flex;align-items:center;justify-content:center;min-height:56px;margin-bottom:8px}
.p-hours__back{position:absolute;left:0;top:50%;transform:translateY(-50%);display:flex;width:32px;height:32px;align-items:center;justify-content:center}
.p-hours__title{margin:0;font-size:20px;font-weight:600;color:var(--color-black2)}
.p-hours__check{display:flex;align-items:center;gap:12px;padding:12px 0;cursor:pointer}
.p-hours__check input{position:absolute;opacity:0;width:0;height:0}
.p-hours__check-box{flex:0 0 auto;width:24px;height:24px;border:2px solid var(--color-black2);border-radius:50%;box-sizing:border-box}
.p-hours__check input:checked + .p-hours__check-box{background-color:var(--color-black2);box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 5px var(--color-black2)}
.p-hours__check input:focus-visible + .p-hours__check-box{outline:2px solid var(--color-orange3);outline-offset:2px}
.p-hours__check-text{font-size:16px;color:var(--color-black2)}
.p-hours__group{padding:8px 0}
.p-hours__day{margin:16px 0 4px;font-size:15px;color:var(--color-gray)}
.p-hours__row{display:flex;gap:24px}
.p-hours__field{display:flex;align-items:baseline;gap:8px}
.p-hours__label{font-size:15px;font-weight:600;color:var(--color-black2)}
.p-hours__field input{width:96px;border:0;border-bottom:1px solid var(--lavka-divider);background:none;padding:2px 0;font-family:inherit;font-size:15px;color:var(--color-black2)}
.p-hours__hint{margin:12px 0 0;font-size:13px;color:var(--color-gray)}
.p-hours__cutoff{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--lavka-divider);padding-bottom:4px}
.p-hours__cutoff-text{font-size:15px;font-weight:600;color:var(--color-black2);white-space:nowrap}
.p-hours__cutoff select{flex:1;border:0;background:none;font-family:inherit;font-size:15px;color:var(--color-gray)}
.p-hours__status{margin:16px 0 0;font-size:14px;color:var(--color-gray)}
.p-hours__status--error{color:#c62828}
.p-hours__save{margin-top:auto;border:0;border-radius:30px;background-color:var(--color-black2);padding:18px;font-family:inherit;font-size:18px;color:var(--color-white);cursor:pointer}
.p-hours__save:disabled{opacity:.6;cursor:default}
.partner-orders__actions{display:flex;justify-content:center;gap:8px}
.partner-orders__actions .partner-orders__menu{margin:18px 0 0}
.p-set{display:flex;flex-direction:column;min-height:100vh;padding:0 20px 24px;box-sizing:border-box}
.p-set__head{position:relative;display:flex;align-items:center;justify-content:center;min-height:56px}
.p-set__back{position:absolute;left:0;top:50%;transform:translateY(-50%);display:flex;width:32px;height:32px;align-items:center;justify-content:center}
.p-set__title{margin:0;font-size:20px;font-weight:600;color:var(--color-black2)}
.p-set__avatar{width:96px;height:96px;margin:8px auto 0;border-radius:50%;background-color:#f4f4f4;background-size:cover;background-position:center}
.p-set__avatar-note{margin:8px 0 16px;font-size:12px;color:var(--color-gray);text-align:center}
.p-set__field{display:block;margin-top:18px}
.p-set__label{display:block;font-size:14px;color:var(--color-gray)}
.p-set__label--group{margin:24px 0 4px}
.p-set__field input,.p-set__field select{width:100%;box-sizing:border-box;border:0;border-bottom:1px solid var(--lavka-divider);background:none;padding:6px 0;font-family:inherit;font-size:16px;color:var(--color-black2)}
.p-set__field input::-moz-placeholder{color:var(--color-gray);opacity:1}
.p-set__field input::placeholder{color:var(--color-gray);opacity:1}
.p-set__static{margin:6px 0 0;padding-bottom:7px;border-bottom:1px solid var(--lavka-divider);font-size:16px;color:var(--color-black2)}
.p-set__rows{margin-top:24px}
.p-set__row{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--lavka-divider);padding:14px 0;text-decoration:none}
.p-set__row-title{font-size:16px;color:var(--color-black2)}
.p-set__row-value{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px;color:var(--color-gray);text-align:right}
.p-set__row::after{content:"";flex:0 0 auto;width:8px;height:8px;border-top:2px solid var(--color-gray2);border-right:2px solid var(--color-gray2);transform:rotate(45deg)}
.p-set__row--push{width:100%;min-height:var(--lavka-tap);margin:0;padding:14px 0;border-top:0;border-right:0;border-left:0;background:none;-webkit-appearance:none;appearance:none;font:inherit;text-align:left;cursor:pointer}
.p-set__row--locked{cursor:default;opacity:.6}
.p-set__row--locked::after{opacity:0}
.p-set__row[hidden]{display:none}
.p-set__zone{padding:6px 0}
.p-set__check{display:flex;align-items:center;gap:12px;padding:8px 0;cursor:pointer}
.p-set__check input{position:absolute;opacity:0;width:0;height:0}
.p-set__check-box{flex:0 0 auto;width:24px;height:24px;border:2px solid var(--color-black2);border-radius:50%;box-sizing:border-box}
.p-set__check input:checked + .p-set__check-box{background-color:var(--color-black2);box-shadow:inset 0 0 0 3px #fff,inset 0 0 0 5px var(--color-black2)}
.p-set__check input:focus-visible + .p-set__check-box{outline:2px solid var(--color-orange3);outline-offset:2px}
.p-set__check-text{font-size:16px;color:var(--color-black2)}
.p-set__zone-body{padding-left:36px}
.p-set__zone-warn{margin:4px 0 8px;font-size:14px;line-height:1.4;color:#c62828}
.p-set__toggle{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;cursor:pointer}
.p-set__toggle input{position:absolute;opacity:0;width:0;height:0}
.p-set__toggle-text{font-size:16px;color:var(--color-black2)}
.p-set__toggle-box{position:relative;flex:0 0 auto;width:52px;height:28px;border-radius:14px;background-color:var(--color-gray2);transition:background-color .15s}
.p-set__toggle-box::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background-color:#fff;transition:transform .15s}
.p-set__toggle input:checked + .p-set__toggle-box{background-color:var(--color-black2)}
.p-set__toggle input:checked + .p-set__toggle-box::after{transform:translateX(24px)}
.p-set__toggle input:focus-visible + .p-set__toggle-box{outline:2px solid var(--color-orange3);outline-offset:2px}
.p-set__hint{margin:12px 0 0;font-size:13px;color:var(--color-gray)}
.p-set__status{margin:16px 0 0;font-size:14px;color:var(--color-gray)}
.p-set__status--error{color:#c62828}
.p-set__save{margin-top:auto;border:0;border-radius:30px;background-color:var(--color-black2);padding:18px;font-family:inherit;font-size:18px;color:var(--color-white);cursor:pointer}
.p-set__save:disabled{opacity:.6;cursor:default}
.partner-menu__add{position:absolute;right:12px;top:50%;transform:translateY(-50%);display:flex;width:32px;height:32px;align-items:center;justify-content:center;border:0;border-radius:50%;background:#000;font-size:22px;line-height:1;color:#fff;text-decoration:none}
.partner-menu__card{position:relative;display:block;color:inherit;text-decoration:none}
.partner-menu__card--hidden .partner-menu__image,
.partner-menu__card--hidden .partner-menu__name,
.partner-menu__card--hidden .partner-menu__weight,
.partner-menu__card--hidden .partner-menu__price{opacity:.45}
.partner-menu__badge{position:absolute;left:8px;top:8px;border-radius:12px;background-color:var(--color-black2);padding:4px 10px;font-size:12px;line-height:16px;color:var(--color-white)}
.p-set__field textarea{width:100%;box-sizing:border-box;border:0;border-bottom:1px solid var(--lavka-divider);background:none;padding:6px 0;font-family:inherit;font-size:16px;line-height:22px;color:var(--color-black2);resize:vertical}
.p-item__category{display:block;margin-top:16px;border-radius:28px;background-color:var(--color-gray7);padding:16px 20px}
.p-item__category select{width:100%;box-sizing:border-box;border:0;border-bottom:1px solid var(--lavka-divider);background:none;padding:6px 0;font-family:inherit;font-size:16px;color:var(--color-black2)}
.p-item__photo{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:18px}
.p-item__preview{flex:0 0 auto;width:72px;height:72px;border-radius:16px;background-color:var(--color-gray5);background-size:cover;background-position:center}
.p-item__preview:not(.p-item__preview--filled){display:none}
.p-item__photo-btn{border:0;border-radius:24px;background-color:var(--color-gray7);padding:14px 22px;font-family:inherit;font-size:16px;color:var(--color-black2);cursor:pointer}
.p-item__photo-btn:disabled{opacity:.6;cursor:default}
.p-item__delete{margin-top:12px;border:0;border-radius:30px;background:none;padding:14px;font-family:inherit;font-size:16px;color:#c62828;cursor:pointer}
.p-item__delete:disabled{opacity:.6;cursor:default}
.screen-reader-text{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.p-set__field[hidden]{display:none}
:root{--color-orange:#ffe9d9}
.partner-shop__head{justify-content:space-between;padding:8px 12px}
.partner-shop__back{position:static;top:auto;left:auto;width:40px;height:40px;border-radius:12px}
.partner-shop__share{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:0;border-radius:12px;background-color:var(--color-gray6);cursor:pointer}
.partner-shop__share img{width:20px;height:20px;object-fit:contain}
.partner-shop__share:focus-visible{outline:2px solid var(--color-orange2);outline-offset:2px}
.partner-shop__identity{display:flex;flex-direction:column;align-items:center;padding:4px 20px 0;text-align:center}
.partner-shop__logo{display:flex;align-items:center;justify-content:center;width:60px;height:60px;border-radius:50%;background-color:var(--color-gray2);overflow:hidden}
.partner-shop__logo img{width:100%;height:100%;object-fit:cover}
.partner-shop__identity .partner-shop__title{margin:12px 0 0;font-size:22px;line-height:28px;font-weight:600;color:var(--color-black)}
.partner-shop__type{margin:2px 0 0;font-size:14px;line-height:20px;color:var(--color-gray4)}
.partner-shop__contacts{display:flex;justify-content:center;gap:10px;margin-top:14px}
.partner-shop__contact{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-width:90px;min-height:48px;padding:6px 18px;border:0;border-radius:15px;background-color:var(--color-gray7);font-family:inherit;font-size:14px;line-height:20px;color:var(--color-black);text-decoration:none;cursor:pointer}
.partner-shop__contact img{width:18px;height:18px;object-fit:contain}
.partner-shop__contact:focus-visible{outline:2px solid var(--color-orange2);outline-offset:2px}
.partner-shop__meta{display:block;margin-top:12px;border-radius:20px;background-color:var(--color-white);box-shadow:0 0 2px 0 rgba(0,0,0,.25);padding:0 16px}
.partner-shop__meta[hidden]{display:none}
.partner-shop__meta-item{display:flex;align-items:center;gap:12px}
.partner-shop__meta-item[hidden]{display:none}
.partner-shop__meta-icon{flex:0 0 auto;width:24px;height:24px;object-fit:contain}
.partner-shop__meta-text{flex:1 1 auto;min-width:0;padding:12px 0}
.partner-shop__meta-item+.partner-shop__meta-item .partner-shop__meta-text{border-top:1px solid var(--lavka-divider)}
.partner-shop__meta-value{margin-top:0;font-size:15px;line-height:21px;color:var(--color-black);white-space:normal}
.partner-shop__meta-label{margin-top:2px;font-size:13px;line-height:18px;color:var(--color-gray4)}
.partner-shop__meta-item--warn .partner-shop__meta-value{color:var(--color-orange3)}
.shop-info-modal{position:fixed;inset:0;z-index:3200;display:none;align-items:flex-end;justify-content:center}
.shop-info-modal--open{display:flex}
.shop-info-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);border:none;padding:0;cursor:pointer}
.shop-info-modal__sheet{position:relative;z-index:1;width:100%;max-width:412px;max-height:85vh;overflow-y:auto;background:var(--color-white);border-radius:20px 20px 0 0;padding:12px 20px calc(24px + env(safe-area-inset-bottom,0));box-shadow:0 -4px 24px rgba(0,0,0,.12);box-sizing:border-box}
.shop-info-modal__close{display:flex;align-items:center;justify-content:center;width:30px;height:30px;margin:0 0 4px auto;padding:0;border:none;border-radius:50%;background:#eaeaea;color:var(--color-gray4);cursor:pointer}
.shop-info-modal__close:focus-visible{outline:2px solid var(--color-orange2);outline-offset:2px}
.shop-info-modal__close-icon{display:block;flex-shrink:0}
.shop-info-modal__title{margin:0 0 8px;font-size:18px;line-height:24px;font-weight:600;color:var(--color-black2);text-align:center}
.shop-info-modal__row{padding:14px 0}
.shop-info-modal__row+.shop-info-modal__row{border-top:1px solid var(--lavka-divider)}
.shop-info-modal__label{font-size:13px;line-height:18px;color:var(--color-gray4)}
.shop-info-modal__value{margin-top:2px;font-size:15px;line-height:21px;color:var(--color-black2)}
.shop-info-modal__value a{color:inherit}
.checkout-modal__delivery-time,
.checkout-modal__date-btn,
.checkout-modal__field-text,
.checkout-modal__input,
.checkout-modal__submit-total,
.partner-connect__label,
.partner-menu__tab,
.partner-menu__name{line-height:20px}
.checkout-modal__summary-row{line-height:18px}
.checkout-modal__card-heading,
.checkout-modal__summary-title,
.confirm__btn{line-height:22px}
.partner-orders__month,
.partner-menu__price{line-height:25px}
.partner-menu__name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:40px}
.partner-shop__share{position:relative}
.partner-shop__share--copied::after{content:attr(aria-label);position:absolute;top:calc(100% + 6px);right:0;z-index:5;border-radius:10px;background:var(--color-black2);padding:6px 10px;font-size:12px;line-height:16px;color:var(--color-white);white-space:nowrap}
.partner-orders__accepting{position:absolute;right:0;top:50%;transform:translateY(-50%);display:flex;align-items:center;padding:8px 0;cursor:pointer}
.partner-orders__accepting input{position:absolute;opacity:0;width:0;height:0}
.partner-orders__accepting-box{position:relative;flex:0 0 auto;width:52px;height:28px;border-radius:14px;background-color:var(--color-gray2);transition:background-color .15s}
.partner-orders__accepting-box::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background-color:#fff;transition:transform .15s}
.partner-orders__accepting input:checked+.partner-orders__accepting-box{background-color:var(--color-black2)}
.partner-orders__accepting input:checked+.partner-orders__accepting-box::after{transform:translateX(24px)}
.partner-orders__accepting input:focus-visible+.partner-orders__accepting-box{outline:2px solid var(--color-orange3);outline-offset:2px}
.partner-orders__accepting input:disabled+.partner-orders__accepting-box{opacity:.6}
.partner-orders__accepting-note{margin:8px 0 0;font-size:13px;line-height:18px;color:var(--color-gray4);text-align:center}
.p-set__field select{width:100%;box-sizing:border-box;border:0;border-bottom:1px solid var(--lavka-divider);background:none;padding:6px 0;font-family:inherit;font-size:16px;line-height:22px;color:var(--color-black2)}
.header__address{display:flex;align-items:center;gap:4px;flex:1 1 auto;min-width:0;min-height:44px;margin-right:8px;padding:0;border:0;background:none;font-family:inherit;font-size:16px;line-height:22px;color:var(--color-black);text-align:left;cursor:pointer}
.header__address-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.header__address-chevron{flex:0 0 auto;color:var(--color-gray4)}
.header__address:focus-visible{outline:2px solid var(--color-orange2);outline-offset:2px}
.partner-shop__back,
.partner-shop__share,
.basket__back,
.address-modal__back,
.partner-connect__back,
.partner-menu__back,
.partner-orders__back {
width: 44px;
height: 44px;
padding: 0;
border: 0;
border-radius: 0;
background: none;
background-color: transparent;
box-shadow: none;
}
.partner-shop__back img,
.partner-shop__share img,
.basket__back img,
.address-modal__back img,
.partner-connect__back img,
.partner-menu__back img,
.partner-orders__back img {
width: 24px;
height: 24px;
object-fit: contain;
}
.partner-menu__back { left: 4px; top: 8px; }
.partner-orders__back { left: -10px; top: -6px; }
.partner-catalog__add-btn {
width: 44px;
height: 44px;
right: 10px;
top: auto;
bottom: 8px;
}
.partner-catalog__add-btn img { width: 24px; height: 24px; }
.partner-catalog__qty {
top: auto;
bottom: 8px;
height: 44px;
grid-template-columns: 44px 1fr 44px;
}
.partner-catalog__total-btn[hidden] { display: none; }
.delivery__tabs {
display: flex;
width: 100%;
max-width: 500px;
padding: 4px;
}
.delivery__tab {
flex: 1 1 0;
min-width: 0;
height: auto;
min-height: 40px;
padding: 0 10px;
line-height: 1.4;
}
.footer {
position: fixed;
left: 0;
right: 0;
bottom: calc(17px + env(safe-area-inset-bottom, 0px));
z-index: 30;
}
.footer__inner {
display: flex;
align-items: center;
gap: 16px;
max-width: 500px;
margin: 0 auto;
padding: 0 16px;
}
.footer__nav { flex: 1 1 auto; min-width: 0; }
.footer__list {
display: flex;
justify-content: space-between;
gap: 4px;
height: 60px;
padding: 5px;
border-radius: 30px;
background-color: var(--color-white);
box-shadow: 0 0 4px 0 rgba(0, 0, 0, .25);
}
.footer__item { flex: 1 1 0; min-width: 0; display: flex; }
.footer__link {
flex: 1 1 auto;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 2px;
padding: 0 6px;
border-radius: 20px;
color: var(--color-black2);
text-decoration: none;
}
.footer__link--active { background-color: var(--color-orange); color: var(--color-orange2); }
.footer__img { display: flex; width: 26px; height: 26px; align-items: center; justify-content: center; }
.footer__icon { display: block; color: inherit; }
.footer__text { font-size: 13px; line-height: 16px; color: inherit; }
.footer__link--active .footer__text { color: var(--color-orange2); }
.footer__support {
flex: 0 0 auto;
display: flex;
width: 60px;
height: 60px;
align-items: center;
justify-content: center;
padding: 0;
border: 0;
border-radius: 50%;
background-color: var(--color-white);
box-shadow: 0 0 4px 0 rgba(0, 0, 0, .25);
color: var(--color-black2);
cursor: pointer;
}
.footer__support:focus-visible { outline: 2px solid var(--color-orange2); outline-offset: 2px; }
.body--pb { padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px)); }
.header__address { color: var(--color-black); max-width: 64%; align-items: flex-start; }
.header__address-text {
overflow: visible;
text-overflow: clip;
white-space: normal;
overflow-wrap: normal;
word-break: normal;
hyphens: none;
}
.header__address-chevron { margin-top: 3px; color: var(--color-gray4); }
.profile { padding-top: 12px; }
.profile__head {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
min-height: 44px;
}
.profile__back,
.profile__menu-btn {
display: flex;
width: 44px;
height: 44px;
align-items: center;
justify-content: center;
padding: 0;
border: 0;
background: none;
color: var(--color-black2);
cursor: pointer;
}
.profile__back:focus-visible,
.profile__menu-btn:focus-visible { outline: 2px solid var(--color-orange2); outline-offset: 2px; }
.profile__menu-btn { margin-left: auto; }
.profile__identity { margin-top: -8px; text-align: center; }
.profile__avatar {
display: flex;
width: 110px;
height: 110px;
margin: 0 auto;
align-items: center;
justify-content: center;
border-radius: 50%;
background-color: var(--color-gray5);
color: var(--color-gray4);
}
.profile__name {
margin-top: 10px;
padding: 8px 12px;
border: 0;
background: none;
font-family: inherit;
font-size: 18px;
line-height: 24px;
color: var(--color-gray);
text-decoration: underline;
cursor: pointer;
}
.profile__guest-title { margin-top: 12px; font-size: 18px; line-height: 24px; color: var(--color-gray); }
.profile__row {
display: flex;
width: 100%;
align-items: center;
gap: 14px;
margin-top: 18px;
padding: 12px 4px;
border: 0;
border-bottom: 1px solid var(--lavka-divider);
background: none;
font-family: inherit;
text-align: left;
cursor: pointer;
}
.profile__row-icon { flex: 0 0 auto; display: flex; color: var(--color-black2); }
.profile__row-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.profile__row-value { font-size: 18px; line-height: 24px; color: var(--color-black); }
.profile__row-label { font-size: 14px; line-height: 20px; color: var(--color-gray4); }
.profile__row-chevron { flex: 0 0 auto; color: var(--color-gray4); }
.profile__login-btn {
display: block;
width: 100%;
min-height: 52px;
margin-top: 24px;
border: 0;
border-radius: 30px;
background-color: var(--color-orange2);
font-family: inherit;
font-size: 18px;
color: var(--color-white);
cursor: pointer;
}
.profile-sheet {
position: fixed;
inset: 0;
z-index: 1200;
display: flex;
flex-direction: column;
justify-content: flex-end;
visibility: hidden;
pointer-events: none;
}
.profile-sheet--open { visibility: visible; pointer-events: auto; }
.profile-sheet__backdrop {
position: absolute;
inset: 0;
padding: 0;
border: none;
background: rgba(0, 0, 0, .55);
opacity: 0;
transition: opacity .25s ease;
cursor: pointer;
}
.profile-sheet--open .profile-sheet__backdrop { opacity: 1; }
.profile-sheet__panel {
position: relative;
z-index: 1;
padding: 10px 20px calc(24px + env(safe-area-inset-bottom, 0px));
border-radius: 20px 20px 0 0;
background: var(--color-white);
transform: translateY(100%);
transition: transform .28s ease;
}
.profile-sheet--open .profile-sheet__panel { transform: translateY(0); }
.profile-sheet__grabber {
display: block;
width: 44px;
height: 4px;
margin: 0 auto 18px;
border-radius: 2px;
background: var(--color-gray5);
}
.profile-sheet__input {
width: 100%;
min-height: 44px;
padding: 8px 0;
border: 0;
border-bottom: 1px solid var(--lavka-divider);
border-radius: 0;
background: none;
font-family: inherit;
font-size: 16px;
line-height: 24px;
color: var(--color-black);
}
.profile-sheet__input:focus { outline: none; border-bottom-color: var(--color-orange2); }
.profile-sheet__error { margin-top: 8px; font-size: 14px; line-height: 20px; color: #e03131; }
.profile-sheet__submit {
display: block;
width: 100%;
min-height: 52px;
margin-top: 24px;
border: 0;
border-radius: 30px;
background-color: var(--color-orange2);
font-family: inherit;
font-size: 18px;
color: var(--color-white);
cursor: pointer;
}
.profile-sheet__panel--menu { padding-left: 0; padding-right: 0; }
.profile-sheet__action {
display: flex;
align-items: center;
gap: 14px;
min-height: 56px;
padding: 0 20px;
color: var(--color-black);
font-size: 18px;
text-decoration: none;
}
.profile-sheet__action + .profile-sheet__action { border-top: 1px solid var(--lavka-divider); }
.partner-connect__head { position: relative; justify-content: center; gap: 0; }
.partner-connect__head .partner-connect__back {
position: absolute;
left: -10px;
top: 50%;
transform: translateY(-50%);
}
.partner-connect__title--page-inline { text-align: center; }
.partner-connect-page .partner-connect__head .partner-connect__step-title { margin: 0; }
.partner-app-modal {
position: fixed;
inset: 0;
z-index: 1000;
display: none;
align-items: center;
justify-content: center;
padding: 20px;
}
.partner-app-modal--open { display: flex; }
.partner-app-modal__backdrop {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
padding: 0;
border: 0;
background-color: rgba(0, 0, 0, .6);
}
.partner-app-modal__sheet {
position: relative;
width: 100%;
max-width: 340px;
padding: 32px 24px;
border-radius: 20px;
background: var(--color-white);
text-align: center;
}
.profile-sheet__call { margin-top: 16px; text-align: center; }
.profile-sheet__call-text {
margin: 0;
font-size: 14px;
line-height: 20px;
color: var(--color-gray);
}
.profile-sheet__call-number {
display: inline-flex;
min-height: 44px;
align-items: center;
margin-top: 12px;
font-size: 22px;
line-height: 28px;
font-weight: 600;
color: var(--color-orange2);
}
.profile-sheet__call-status {
margin: 8px 0 0;
font-size: 14px;
line-height: 20px;
color: var(--color-gray4);
}
.profile-sheet__call-cancel {
min-height: 44px;
margin-top: 8px;
padding: 0 8px;
border: 0;
background: none;
font-size: 16px;
line-height: 22px;
color: var(--color-gray);
}
.profile-sheet__call[hidden] { display: none; }
.start-location {
position: fixed;
inset: 0;
z-index: 1100;
overflow-y: auto;
overscroll-behavior: contain;
background: var(--color-white);
}
.start-location[hidden] { display: none; }
.start-location__inner {
max-width: 500px;
margin: 0 auto;
padding: 80px 16px calc(32px + env(safe-area-inset-bottom, 0px));
text-align: center;
}
.start-location__logo { display: block; width: 180px; height: auto; margin: 0 auto; }
.start-location__tagline {
margin: 12px 0 0;
font-size: 18px;
line-height: 26px;
font-weight: 700;
color: var(--color-orange2);
}
.start-location__list { margin: 64px 0 0; padding: 0; list-style: none; }
.start-location__item + .start-location__item { margin-top: 12px; }
.start-location__row {
display: flex;
width: 100%;
min-height: 64px;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: 12px 20px;
border: 0;
border-radius: 20px;
background: var(--color-gray3);
font: inherit;
text-align: left;
}
.start-location__row:focus-visible { outline: 2px solid var(--color-orange2); outline-offset: 2px; }
.start-location__row-text { min-width: 0; }
.start-location__row-name {
display: block;
font-size: 18px;
line-height: 24px;
color: var(--color-black);
}
.start-location__row-sub {
display: block;
margin-top: 2px;
font-size: 14px;
line-height: 20px;
color: var(--color-gray4);
}
.start-location__chevron { flex: 0 0 auto; color: var(--color-gray4); }
.start-location__back {
min-height: 44px;
margin-top: 24px;
padding: 0 8px;
border: 0;
background: none;
font-size: 16px;
line-height: 22px;
color: var(--color-gray);
}
.start-location__back[hidden] { display: none; }
.partner-app-modal__icon { display: block; margin: 0 auto 20px; color: var(--color-black); }
.partner-app-modal__title { margin: 0; font-size: 20px; line-height: 26px; font-weight: 600; color: var(--color-black); }
.partner-app-modal__text { margin: 8px 0 0; font-size: 16px; line-height: 22px; color: var(--color-black2); }
.profile__legal-name { margin: 12px 0 0; font-size: 20px; line-height: 26px; font-weight: 600; color: var(--color-black); }
.profile__legal-sub { margin: 2px 0 0; font-size: 14px; line-height: 20px; color: var(--color-gray4); }
.profile__row--static { cursor: default; }
.profile-sheet__action--danger {
width: 100%;
border: 0;
background: none;
font-family: inherit;
font-size: 18px;
color: var(--color-red);
text-align: left;
cursor: pointer;
}
.profile-sheet__action--danger:disabled { opacity: .6; cursor: default; }
.profile-sheet__action--button {
width: 100%;
border: 0;
background: none;
font-family: inherit;
text-align: left;
cursor: pointer;
}
.profile-sheet__action--button:disabled { opacity: .6; cursor: default; }
.profile-sheet__panel--menu .profile-sheet__error { padding: 0 20px; }
.home { background-color: var(--color-white); }
.home__wrapper {
padding-top: 16px;
border-radius: 20px 20px 0 0;
background-color: var(--color-white);
min-height: calc(100vh - 56px);
}
.home__ests {
max-width: 500px;
margin: 0 auto;
overflow-x: auto;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
}
.home__ests::-webkit-scrollbar { display: none; }
.home__ests-list { display: flex; gap: 8px; margin: 0; padding: 0; list-style: none; }
.home__ests-item { flex: 0 0 auto; }
.home__est {
display: flex;
align-items: center;
gap: 10px;
width: 154px;
min-height: 60px;
padding: 8px 11px;
border-radius: 16px;
background-color: var(--color-gray7);
text-decoration: none;
color: inherit;
}
.home__est--closed { opacity: .55; }.home__est-logo{
flex: 0 0 auto;
display: block;
width: 32px;
height: 32px;
border-radius: 50%;
overflow: hidden;
background-color: var(--color-gray2);
}.home__est-logo img{ width: 100%; height: 100%; object-fit: cover; }
.home__est-text { min-width: 0; }
.home__est-name {
display: block;
font-size: 15px;
line-height: 20px;
font-weight: 700;
color: var(--color-black2);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.home__est-type {
display: block;
font-size: 13px;
line-height: 18px;
font-weight: 400;
color: var(--color-gray4);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.home__filters {
display: flex;
flex-wrap: wrap;
gap: 8px;
max-width: 500px;
margin: 16px auto 0;
}
.home__filter {
min-width: 76px;
min-height: 44px;
padding: 0 18px;
border: 0;
border-radius: 22px;
background-color: var(--color-gray7);
font-family: inherit;
font-size: 14px;
line-height: 20px;
font-weight: 500;
color: var(--color-black);
cursor: pointer;
}
.home__filter--active { background-color: var(--color-orange2); color: var(--color-white); }
.home__filter:focus-visible { outline: 2px solid var(--color-orange2); outline-offset: 2px; }
.home__grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px 18px;
max-width: 500px;
margin: 16px auto 0;
padding: 0;
list-style: none;
}
.home__cell[hidden] { display: none; }
.home__empty {
max-width: 500px;
margin: 24px auto 0;
font-size: 15px;
line-height: 22px;
color: var(--color-gray4);
text-align: center;
}
.partner-catalog__card--target .partner-catalog__image {
outline: 2px solid var(--color-orange2);
outline-offset: 3px;
}
.page-head {
position: sticky;
top: 0;
z-index: 30;
background-color: var(--color-white);
border-radius: 0 0 20px 20px;
box-shadow: 0 0 4px 0 rgba(0, 0, 0, .25);
}
.page-head__inner {
display: grid;
grid-template-columns: 44px 1fr 44px;
align-items: center;
min-height: 54px;
padding: 0 8px;
}
.page-head__side {
display: flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
padding: 0;
border: 0;
background: none;
color: var(--color-black2);
}
.page-head__back { text-decoration: none; }
.page-head__action { cursor: pointer; }
.page-head__action:disabled { opacity: .35; cursor: default; }
.page-head__title {
margin: 0;
font-size: 20px;
line-height: 26px;
font-weight: 700;
color: var(--color-black2);
text-align: center;
}
.nothing--state.nothing--visible {
justify-content: flex-start;
padding: clamp(60px, 20vh, 190px) 20px 0;
}
.empty-state {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
text-align: center;
}
.empty-state__title {
margin: 0;
font-size: 20px;
line-height: 26px;
font-weight: 700;
color: var(--color-black2);
}
.empty-state__text {
margin: 6px 0 0;
font-size: 16px;
line-height: 22px;
color: var(--color-gray4);
}
.order-list { flex-direction: column; }
.order-list__wrapper {
padding: 0 20px;
margin: 20px auto 0;
}
.order-list__title {
margin-bottom: 12px;
font-size: 20px;
line-height: 26px;
font-weight: 700;
}
.order-list__month,
.order-list__year { color: var(--color-black2); }
.order-list__inner {
display: flex;
flex-direction: column;
gap: 5px;
margin: 0;
padding: 0;
list-style: none;
}
.order-list__item {
display: flex;
flex-direction: column;
min-height: 100px;
margin: 0;
padding: 16px 18px;
border-radius: 20px;
background-color: var(--color-gray7);
}
.order-list__item-title {
font-size: 16px;
line-height: 22px;
font-weight: 700;
color: var(--color-black2);
}
.order-list__item-count {
margin-top: 2px;
font-size: 14px;
line-height: 20px;
color: var(--color-gray4);
}
.order-list__item-info-block {
margin-top: auto;
padding-top: 12px;
font-size: 14px;
line-height: 20px;
color: var(--color-gray4);
}
.basket {
position: static;
padding: 0;
background: none;
box-shadow: none;
}
.basket .container { padding: 0 9px; }
.basket__tabs {
height: 44px;
margin: 10px 0 0;
padding: 0 8px;
gap: 8px;
align-items: center;
border-radius: 22px;
box-shadow: 0 0 4px 0 rgba(0, 0, 0, .25);
}
.basket__tab {
height: 44px;
padding: 0;
background: none;
display: flex;
align-items: center;
}
.basket__tab-label {
display: flex;
align-items: center;
height: 30px;
padding: 0 14px;
border-radius: 15px;
font-size: 14px;
line-height: 1;
font-weight: 700;
color: var(--color-black);
}
.basket__tab--active .basket__tab-label {
background-color: var(--color-orange);
color: var(--color-orange2);
}
.basket-list { padding: 16px 0 96px; }
.basket-list__panels {
width: 100%;
max-width: 700px;
margin-inline: auto;
padding: 0 16px;
display: flex;
flex-direction: column;
}
.basket-list__inner {
max-width: none;
margin: 0;
padding: 0;
gap: 8px;
border-bottom: 0;
list-style: none;
}
.basket-list__item {
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.basket-list__img {
width: 75px;
height: 73px;
border-radius: 15px;
background-color: var(--color-gray2);
}
.basket-list__title {
font-size: 16px;
line-height: 22px;
font-weight: 400;
color: var(--color-black);
}
.basket-list__count {
margin-top: 2px;
font-size: 14px;
line-height: 20px;
color: var(--color-gray4);
}
.basket-list__price {
margin-top: 4px;
font-size: 16px;
line-height: 22px;
font-weight: 700;
color: var(--color-black2);
}
.basket-list__quantity {
width: 110px;
min-width: 110px;
height: 30px;
padding: 0 12px;
border-radius: 15px;
}
.basket-list__qty-delete-btn,
.basket-list__qty-plus-btn { position: relative; }
.basket-list__qty-delete-btn::after,
.basket-list__qty-plus-btn::after {
content: "";
position: absolute;
inset: -12px -10px;
}
.basket-list__qty-value {
font-size: 16px;
line-height: 20px;
}
.basket-list__qty-plus-btn {
font-size: 22px;
line-height: 1;
}
.basket-list__restore {
position: relative;
width: 110px;
min-width: 110px;
height: 30px;
padding: 0;
border: 0;
border-radius: 15px;
background-color: var(--color-gray7);
color: var(--color-gray);
font-size: 14px;
line-height: 30px;
text-align: center;
cursor: pointer;
}
.basket-list__restore::after {
content: "";
position: absolute;
inset: -8px 0;
}
.basket-list__item--removed .basket-list__text-block { opacity: 1; }
.basket-list__item--extra {
margin-top: 1px;
padding-top: 16px;
border-top: 1px solid var(--lavka-divider);
column-gap: 10px;
row-gap: 0;
}
.basket-list__add {
position: relative;
width: 30px;
height: 30px;
flex-shrink: 0;
padding: 0;
border: 0;
border-radius: 50%;
background-color: var(--color-orange2);
color: var(--color-white);
font-size: 22px;
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
.basket-list__add::after {
content: "";
position: absolute;
inset: -7px;
}
.basket-list__extra-note {
width: calc(100% - 85px);
margin: 0 0 0 85px;
padding-top: 10px;
border-top: 1px solid var(--lavka-divider);
font-size: 14px;
line-height: 20px;
color: var(--color-gray4);
}
.basket-list__btn {
bottom: calc(18px + env(safe-area-inset-bottom, 0px));
height: 60px;
padding: 0;
gap: 2px;
}
.basket-list__btn-sum {
font-size: 20px;
line-height: 26px;
font-weight: 700;
}
.basket-list__btn span:not(.basket-list__btn-sum) {
font-size: 14px;
line-height: 18px;
}
body.lavka-cart-filled .footer { display: none; }
body.lavka-cart-filled.body--pb { padding-bottom: 0; }
.confirm { background-color: rgba(0, 0, 0, .6); }
.confirm__title {
font-size: 18px;
line-height: 24px;
font-weight: 700;
}
.confirm__text {
margin-top: 8px;
font-size: 15px;
line-height: 21px;
color: var(--color-gray);
}
.confirm__btns {
gap: 40px;
margin-top: 20px;
align-items: center;
}
.confirm__btn {
min-height: 44px;
padding: 0 4px;
font-size: 16px;
line-height: 22px;
}
.lavka-home .main { flex: 1 1 auto; min-height: 0; }
.lavka-home .home { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
.lavka-home .home__wrapper { flex: 1 1 auto; min-height: 0; }
.lavka-home .lavka-pwa { display: none; }
.lavka-home .header {
position: static;
padding-top: 18px;
padding-bottom: 18px;
background-color: var(--color-white);
}
.lavka-home .header__address {
align-items: center;
max-width: none;
font-size: 18px;
line-height: 26px;
}
.lavka-home .header__address-chevron { margin-top: 0; }
.partner-catalog__image { position: relative; }
.partner-catalog__price { margin-top: 10px; line-height: 26px; }
.partner-catalog__name { margin-top: 2px; line-height: 20px; }
.partner-catalog__weight { margin-top: 2px; line-height: 17px; }
.checkout-modal__card--delivery { display: grid; gap: 12px; }
.day-picker {
position: fixed;
inset: 0;
z-index: 3200;
display: none;
align-items: flex-end;
justify-content: center;
}
.day-picker--open { display: flex; }
.day-picker__backdrop {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
padding: 0;
border: 0;
background-color: rgba(0, 0, 0, .6);
}
.day-picker__sheet {
position: relative;
width: 100%;
max-width: 600px;
padding: 20px 16px calc(20px + env(safe-area-inset-bottom));
border-radius: 20px 20px 0 0;
background: var(--color-white);
}
.day-picker__title {
margin: 0 0 12px;
font-size: 20px;
line-height: 26px;
font-weight: 600;
color: var(--color-black2);
}
.day-picker__wheel-wrap {
position: relative;
}
.day-picker__wheel-wrap::before,
.day-picker__wheel-wrap::after {
content: "";
position: absolute;
left: -16px;
right: -16px;
height: 1px;
background-color: var(--color-orange2);
pointer-events: none;
z-index: 1;
}
.day-picker__wheel-wrap::before { top: 56px; }
.day-picker__wheel-wrap::after { top: 112px; }
.day-picker__wheel {
position: relative;
height: 168px;
overflow-y: auto;
scroll-snap-type: y mandatory;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
}
.day-picker__wheel::-webkit-scrollbar { display: none; }
.day-picker__wheel::before,
.day-picker__wheel::after {
content: "";
display: block;
height: 56px;
}
.day-picker__wheel:focus-visible { outline: 2px solid var(--color-orange2); outline-offset: 2px; }
.day-picker__row {
display: flex;
align-items: center;
justify-content: center;
height: 56px;
scroll-snap-align: center;
font-size: 18px;
line-height: 24px;
color: var(--color-gray4);
cursor: pointer;
}
.day-picker__row--active {
color: var(--color-black2);
font-weight: 500;
}
.day-picker__submit {
width: 100%;
min-height: 56px;
margin-top: 16px;
border-radius: 30px;
background: var(--color-orange2);
font-size: 18px;
line-height: 24px;
font-weight: 500;
color: var(--color-white);
}
.day-picker__submit:focus-visible { outline: 2px solid var(--color-black2); outline-offset: 2px; }
.checkout-modal__date-row--pair { grid-template-columns: 1fr 1fr; }
.checkout-modal__slot-row {
display: flex;
flex-wrap: wrap;
gap: 6px;
}
.checkout-modal__slot-row[hidden] { display: none; }
.checkout-modal__slot-btn {
min-height: 44px;
padding: 0 14px;
border: none;
border-radius: 10px;
background-color: #f0f0f0;
font: inherit;
font-size: 14px;
line-height: 20px;
letter-spacing: .15px;
color: var(--color-gray);
cursor: pointer;
transition: background-color .15s, color .15s;
}
.checkout-modal__slot-btn--active {
background-color: var(--color-orange2);
color: var(--color-white);
}
.checkout-modal__slot-btn:focus-visible { outline: 2px solid var(--color-black2); outline-offset: 2px; }
.checkout-modal__submit:disabled:not(.is-loading) {
background-color: var(--color-gray2);
color: var(--color-gray);
cursor: not-allowed;
}
.checkout-modal__submit:disabled:not(.is-loading) .checkout-modal__submit-total { color: var(--color-gray); }
.lavka-home .main { display: flex; flex-direction: column; }
.lavka-home .header {
padding-top: 0;
padding-bottom: 20px;
margin-bottom: -20px;
}
.lavka-home .header__address {
min-height: 50px;
padding: 12px 0;
}
.lavka-home .home { background-color: transparent; }
.lavka-home .home__wrapper {
position: relative;
padding-bottom: calc(90px + env(safe-area-inset-bottom, 0px));
}
body.lavka-home.body--pb { padding-bottom: 0; }
.home__filters[hidden],
.home__ests[hidden],
.home__ests-item[hidden],
.home__filter[hidden] { display: none; }
.start-location__row--chosen {
background-color: var(--color-orange);
box-shadow: inset 0 0 0 2px var(--color-orange2);
}
.header__address--city .header__address-chevron { transform: rotate(-90deg); }
.address-modal__lines {
display: flex;
flex-direction: column;
gap: 2px;
min-width: 0;
}
.address-modal__comment {
font-size: 14px;
line-height: 20px;
color: var(--color-black);
}
.checkout-modal__address-comment {
margin: 0 0 6px;
padding: 0 13px;
font-size: 14px;
line-height: 20px;
color: var(--color-black);
}
.checkout-modal__address-comment[hidden] { display: none; }
.order-detail__value--comment,
.partner-order-modal__value--comment {
display: block;
margin-top: 4px;
font-size: 14px;
line-height: 20px;
color: var(--color-black);
}
.checkout-modal__delivery-time[hidden],
.checkout-modal__card--delivery[hidden] { display: none; }
.checkout-modal__delivery-time-icon[hidden] { display: none; }
html.lavka-needs-location [data-start-location][hidden] { display: block; }
html.lavka-needs-location,
html.lavka-needs-location body {
overflow: hidden;
height: 100%;
}
html.lavka-personal-pending .header__address,
html.lavka-personal-pending [data-checkout-address-text] { visibility: hidden; }
.checkout-modal--pending [data-checkout-total] { visibility: hidden; }
.checkout-modal__label {
color: var(--color-gray);
line-height: 1.4;
}
.checkout-modal__field-text {
color: var(--color-black);
line-height: 1.4;
}
.checkout-modal__input {
color: var(--color-black);
line-height: 1.4;
}
.checkout-modal__date-btn {
border-radius: 22px;
color: var(--color-black);
line-height: 1.4;
}
.checkout-modal__date-btn[data-checkout-date-other] {
background-color: transparent;
}
.checkout-modal__date-btn[data-checkout-date-other].checkout-modal__date-btn--active {
background-color: var(--color-orange2);
color: var(--color-white);
}
.checkout-modal__submit {
width: calc(100% - 16px);
}
.checkout-modal__slot-btn {
border-radius: 22px;
line-height: 1.4;
}
.confirm__price-note {
display: block;
font-size: 13px;
line-height: 1.4;
color: var(--color-gray);
}
.confirm__prices {
display: block;
margin-top: 12px;
max-height: 40vh;
overflow-y: auto;
}
.confirm__price-row {
display: block;
padding-bottom: 10px;
margin-bottom: 10px;
border-bottom: 1px solid var(--lavka-divider);
}
.confirm__price-row:last-child {
padding-bottom: 0;
margin-bottom: 0;
border-bottom: 0;
}
.confirm__price-name {
display: block;
font-size: 14px;
line-height: 1.4;
color: var(--color-black);
}
.confirm__price-values {
display: block;
margin-top: 2px;
font-size: 14px;
line-height: 1.4;
color: var(--color-black);
}
.confirm__price-values s {
margin-right: 6px;
color: var(--color-gray4);
}
.confirm__price-values b {
font-weight: 400;
}
.basket-list__notice {
position: fixed;
left: 50%;
transform: translateX(-50%);
bottom: 178px;
z-index: 25;
width: calc(100% - 62px);
max-width: 350px;
display: flex;
flex-direction: column;
gap: 10px;
padding: 14px 16px;
border-radius: 16px;
background-color: var(--color-orange);
border: 1px solid var(--color-orange2);
}
.basket-list__notice[hidden] {
display: none;
}
.basket-list__notice-text {
margin: 0;
font-size: 14px;
line-height: 1.4;
color: var(--color-black);
}
.basket-list__notice-btn {
min-height: 44px;
padding: 10px 16px;
border: 0;
border-radius: 22px;
background-color: var(--color-orange2);
color: var(--color-white);
font-size: 15px;
line-height: 1.4;
cursor: pointer;
}
.basket-list__notice-btn[hidden] {
display: none;
}
.checkout-modal__head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
padding: 0 3px 6px;
}
.checkout-modal__head .checkout-modal__address {
padding: 0;
min-width: 0;
flex: 1 1 auto;
justify-content: flex-start;
}
.checkout-modal__head .checkout-modal__close {
width: 44px;
height: 44px;
margin: 0 -10px 0 0;
flex-shrink: 0;
background: none;
border-radius: 0;
color: var(--color-black2);
}
.checkout-modal__head .checkout-modal__close:hover {
background: none;
color: var(--color-black2);
}
.checkout-modal__submit {
width: calc(100% - 62px);
max-width: 350px;
padding: 12px;
border-radius: 30px;
}
.checkout-modal__submit-title {
font-size: 20px;
line-height: 24px;
}
.checkout-modal__submit-total {
margin-top: 0;
font-size: 14px;
line-height: 20px;
color: var(--color-orange);
}
.checkout-modal__footer {
padding: 12px 0 calc(12px + env(safe-area-inset-bottom, 0px));
}
.checkout-modal__body > :last-child {
margin-bottom: 0;
}
.checkout-modal__date-btn {
min-height: 28px;
position: relative;
}
.checkout-modal__date-btn::after {
content: "";
position: absolute;
left: 0;
right: 0;
top: 50%;
transform: translateY(-50%);
height: 44px;
}
.address-modal__edit-actions {
padding-bottom: calc(20px + env(safe-area-inset-bottom, 0));
}
.address-modal__primary {
width: 100%;
max-width: 350px;
margin: 0 auto;
padding: 12px;
border-radius: 30px;
font-size: 20px;
line-height: 1.2;
}
.address-modal__danger {
max-width: 350px;
margin: 0 auto;
}
.checkout-modal__date-btn--active {
color: var(--color-white);
}
.day-picker__wheel-wrap::before,
.day-picker__wheel-wrap::after {
height: 2px;
}
.day-picker__wheel-wrap::before {
top: 55px;
}
.home__list {
display: flex;
flex-direction: column;
gap: 16px;
margin: 0;
padding: 0;
list-style: none;
}
.home__list[hidden] { display: none; }
.home__item[hidden] { display: none; }
.est-card {
display: block;
border-radius: 20px;
background-color: var(--color-white);
box-shadow: 0 0 4px 0 rgba(0, 0, 0, .25);
color: var(--color-black);
text-decoration: none;
}
.est-card:focus-visible { outline: 2px solid var(--color-orange2); outline-offset: 2px; }
.est-card__banner {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
aspect-ratio: 380 / 100;
border-radius: 20px;
background-color: var(--color-gray7);
background-position: center;
background-size: cover;
background-repeat: no-repeat;
overflow: hidden;
}
.est-card__banner-logo {
width: 64px;
height: 64px;
object-fit: contain;
opacity: .55;
}
.est-card__body {
display: block;
padding: 13px 16px 16px;
}
.est-card__name {
display: block;
font-size: 17px;
line-height: 22px;
font-weight: 600;
color: var(--color-black);
}
.est-card__type {
display: block;
margin-top: 2px;
font-size: 13px;
line-height: 18px;
color: var(--color-gray);
}
.est-card__tags {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: 12px;
}
.est-card__tag {
display: inline-block;
padding: 4px 12px;
border-radius: 10px;
background-color: var(--color-gray7);
font-size: 13px;
line-height: 18px;
color: var(--color-black);
}
.est-card__tag--warn { color: var(--color-orange3); }
.est-card__tag:empty { display: none; }
.footer__list {
height: 58px;
border-radius: 29px;
}
.footer__link {
color: var(--color-black);
border-radius: 0;
}
.footer__link--active {
background-color: transparent;
color: var(--color-orange2);
}
.footer__link--active .footer__text { color: var(--color-orange2); }
.footer__img { width: 24px; height: 24px; }
.footer__support {
width: 58px;
height: 58px;
color: var(--color-black);
}
.cart-fab[hidden] { display: none; }
.cart-fab {
position: fixed;
right: 16px;
bottom: calc(105px + env(safe-area-inset-bottom, 0px));
z-index: 60;
display: inline-flex;
align-items: center;
gap: 8px;
min-width: 119px;
height: 44px;
padding: 0 20px;
border-radius: 22px;
background-color: var(--color-orange2);
box-shadow: 0 0 4px 0 rgba(0, 0, 0, .25);
color: var(--color-white);
font-size: 16px;
line-height: 22px;
font-weight: 500;
text-decoration: none;
justify-content: center;
}
.cart-fab:focus-visible { outline: 2px solid var(--color-black); outline-offset: 2px; }
.cart-fab__icon { flex: 0 0 auto; display: block; color: inherit; }
.cart-fab__sum { white-space: nowrap; }
.p-set__media {
display: flex;
flex-direction: column;
align-items: center;
gap: 12px;
margin-top: 8px;
}
.p-set__avatar,
.p-set__banner {
display: flex;
align-items: center;
justify-content: center;
padding: 0;
border: 0;
background-color: var(--color-gray7);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
color: var(--color-black);
cursor: pointer;
}
.p-set__avatar {
width: 80px;
height: 80px;
margin: 0;
border-radius: 50%;
}
.p-set__banner {
width: 100%;
aspect-ratio: 380 / 100;
border-radius: 20px;
}
.p-set__avatar:focus-visible,
.p-set__banner:focus-visible { outline: 2px solid var(--color-orange2); outline-offset: 2px; }
.p-set__avatar--photo .p-set__media-icon,
.p-set__banner--photo .p-set__media-icon { display: none; }
.p-set__media-icon { display: flex; align-items: center; justify-content: center; }
.product-modal {
position: fixed;
inset: 0;
z-index: 3200;
display: none;
align-items: flex-end;
justify-content: center;
}
.product-modal--open { display: flex; }
.product-modal__backdrop {
position: absolute;
inset: 0;
background: rgba(0, 0, 0, .55);
border: none;
padding: 0;
cursor: pointer;
}
.product-modal__sheet {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
width: 100%;
max-width: 412px;
height: calc(100% - 40px);
padding: 0 16px;
background: var(--color-gray7);
border-radius: 20px 20px 0 0;
}
.product-modal__grabber {
position: absolute;
top: -12px;
left: 50%;
transform: translateX(-50%);
width: 36px;
height: 4px;
border-radius: 2px;
background: #B8B8B8;
}
.product-modal__photo {
position: relative;
flex: 0 0 auto;
aspect-ratio: 261 / 185;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
background: var(--color-white);
border-radius: 20px;
}
.product-modal__photo-img[hidden] { display: none; }
.product-modal__photo-empty[hidden] { display: none; }
.product-modal__row[hidden] { display: none; }
.product-modal__footer[hidden] { display: none; }
.product-modal__add[hidden] { display: none; }
.product-modal__qty[hidden] { display: none; }
.product-modal__photo-img {
display: block;
width: 100%;
height: 100%;
}
.product-modal__photo-empty {
margin: 0;
font-size: 20px;
line-height: 26px;
color: var(--color-black);
}
.product-modal__close {
position: absolute;
top: 10px;
right: 12px;
width: 44px;
height: 44px;
display: flex;
align-items: center;
justify-content: center;
padding: 0;
border: none;
border-radius: 50%;
background: transparent;
color: var(--color-black2);
cursor: pointer;
}
.product-modal__close:focus-visible { outline: 2px solid var(--color-orange2); outline-offset: 2px; }
.product-modal__close-icon { display: block; flex-shrink: 0; }
.product-modal__scroll {
margin-top: 26px;
flex: 1 1 auto;
display: flex;
flex-direction: column;
overflow-y: auto;
}
.product-modal__body {
flex: 1 0 auto;
margin-top: 8px;
padding: 12px 16px 16px;
background: var(--color-white);
border-radius: 20px 20px 0 0;
}
.product-modal__row {
padding: 12px 0;
border-bottom: 1px solid var(--lavka-divider);
}
.product-modal__title,
.product-modal__value {
margin: 0;
font-size: 18px;
line-height: 24px;
font-weight: 400;
color: var(--color-black);
}
.product-modal__value--long { white-space: pre-line; }
.product-modal__row-label {
margin: 2px 0 0;
font-size: 14px;
line-height: 20px;
color: var(--color-gray4);
}
.product-modal__footer {
flex: 0 0 auto;
padding: 12px 16px calc(28px + env(safe-area-inset-bottom, 0px));
background: var(--color-white);
}
.product-modal__add {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 2px;
width: 100%;
max-width: 350px;
height: 60px;
margin: 0 auto;
padding: 0;
border: none;
border-radius: 30px;
background-color: var(--color-orange2);
color: var(--color-white);
cursor: pointer;
}
.product-modal__add:focus-visible { outline: 2px solid var(--color-black); outline-offset: 2px; }
.product-modal__add-sum { font-size: 20px; line-height: 26px; font-weight: 700; }
.product-modal__add span:not(.product-modal__add-sum) {
font-size: 14px;
line-height: 18px;
color: var(--color-orange);
}
.product-modal__qty {
display: grid;
grid-template-columns: 56px 1fr 56px;
align-items: center;
width: 100%;
height: 50px;
border-radius: 25px;
background-color: var(--color-orange2);
}
.product-modal__qty-btn {
height: 100%;
padding: 0;
border: none;
background-color: transparent;
color: var(--color-white);
font-size: 28px;
line-height: 1;
cursor: pointer;
}
.product-modal__qty-btn:focus-visible { outline: 2px solid var(--color-black); outline-offset: -4px; border-radius: 25px; }
.product-modal__qty-value {
text-align: center;
color: var(--color-white);
font-size: 20px;
line-height: 26px;
font-weight: 500;
}
.partner-catalog__open {
position: absolute;
inset: 0;
z-index: 1;
padding: 0;
border: none;
background: transparent;
cursor: pointer;
}
.partner-catalog__open:focus-visible { outline: 2px solid var(--color-orange2); outline-offset: 2px; border-radius: 20px; }
.partner-catalog__add-btn,
.partner-catalog__qty { z-index: 2; }
.address-modal__edit-input.is-invalid {
border-bottom-color: #d03333;
box-shadow: 0 1px 0 #d03333;
}
.address-modal__edit-field.is-invalid .address-modal__edit-label {
color: #d03333;
}
.partner-connect__field.is-invalid {
border-bottom-color: #c62828;
box-shadow: 0 1px 0 #c62828;
}
.partner-connect__field.is-invalid .partner-connect__label {
color: #c62828;
}
.checkout-modal__field-text.is-invalid {
box-shadow: 0 1px 0 #c62828;
}
.checkout-modal__card.is-invalid .checkout-modal__label {
color: #c62828;
}
.p-set__field input.is-invalid,
.p-set__field select.is-invalid,
.p-set__field textarea.is-invalid {
border-bottom-color: #c62828;
box-shadow: 0 1px 0 #c62828;
}
.p-set__field.is-invalid .p-set__label {
color: #c62828;
}
.p-item__category.is-invalid select {
border-bottom-color: #c62828;
box-shadow: 0 1px 0 #c62828;
}
.p-hours__field input.is-invalid {
border-bottom-color: #c62828;
box-shadow: 0 1px 0 #c62828;
}
.p-hours__field.is-invalid .p-hours__label {
color: #c62828;
}
.p-set__check.is-invalid .p-set__check-box {
border-color: #c62828;
}
.p-set__check.is-invalid .p-set__check-text {
color: #c62828;
}
.p-cats {
display: flex;
flex-direction: column;
min-height: 100vh;
padding: 0 20px 24px;
box-sizing: border-box;
}
.p-cats__head {
position: relative;
display: flex;
align-items: center;
justify-content: center;
min-height: 56px;
margin-bottom: 8px;
}
.p-cats__back {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
display: flex;
width: 32px;
height: 32px;
align-items: center;
justify-content: center;
}
.p-cats__title {
margin: 0;
font-size: 20px;
font-weight: 600;
color: var(--color-black2);
}
.p-cats__hint {
margin: 0 0 12px;
font-size: 14px;
line-height: 1.45;
color: var(--color-gray);
}
.p-cats__list {
margin: 0;
padding: 0;
list-style: none;
}
.p-cats__row {
display: flex;
align-items: center;
gap: 8px;
border-bottom: 1px solid var(--lavka-divider);
padding: 6px 0;
}
.p-cats__row-main {
flex: 1 1 auto;
min-width: 0;
}
.p-cats__name {
width: 100%;
border: 0;
background: none;
padding: 4px 0;
font-family: inherit;
font-size: 16px;
line-height: 1.4;
color: var(--color-black2);
}
.p-cats__name:focus-visible {
outline: 2px solid var(--color-orange3);
outline-offset: 2px;
}
.p-cats__count {
margin: 0;
font-size: 13px;
line-height: 1.4;
color: var(--color-gray);
}
.p-cats__row-actions {
flex: 0 0 auto;
display: flex;
align-items: center;
}
.p-cats__move,
.p-cats__del {
display: flex;
width: 44px;
height: 44px;
align-items: center;
justify-content: center;
border: 0;
background: none;
padding: 0;
color: var(--color-black2);
cursor: pointer;
}
.p-cats__del {
color: #c62828;
}
.p-cats__move:disabled {
opacity: .3;
cursor: default;
}
.p-cats__empty {
margin: 8px 0 0;
font-size: 14px;
line-height: 1.45;
color: var(--color-gray);
}
.p-cats__add {
display: flex;
align-items: flex-end;
gap: 12px;
margin-top: 24px;
}
.p-cats__field {
flex: 1 1 auto;
display: flex;
flex-direction: column;
gap: 2px;
border-bottom: 1px solid var(--lavka-divider);
min-width: 0;
}
.p-cats__label {
font-size: 13px;
line-height: 1.4;
color: var(--color-gray);
}
.p-cats__field input {
width: 100%;
border: 0;
background: none;
padding: 4px 0;
font-family: inherit;
font-size: 16px;
line-height: 1.4;
color: var(--color-black2);
box-sizing: border-box;
}
.p-cats__add-btn {
flex: 0 0 auto;
min-height: 44px;
border: 1px solid var(--color-black2);
border-radius: 22px;
background: none;
padding: 0 20px;
font-family: inherit;
font-size: 15px;
color: var(--color-black2);
cursor: pointer;
}
.p-cats__add-btn:disabled {
opacity: .6;
cursor: default;
}
.p-cats__name.is-invalid {
box-shadow: 0 1px 0 #c62828;
}
.partner-menu__cats-line {
margin: 10px 0 0;
padding: 0 12px;
text-align: right;
}
.partner-menu__cats {
font-size: 14px;
line-height: 1.4;
color: #000;
text-decoration: underline;
}
.partner-shop__zone-notice {
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
margin: 10px 20px 0;
border-radius: 20px;
background-color: var(--color-orange);
padding: 10px 17px;
text-align: center;
}
.partner-shop__zone-notice[hidden] {
display: none;
}
.partner-shop__zone-notice-text {
margin: 0;
font-size: 14px;
line-height: 1.4;
color: var(--color-black2);
}
.partner-shop__zone-notice-link {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 44px;
padding: 0 12px;
font-size: 14px;
line-height: 1.4;
font-weight: 600;
color: var(--color-black2);
text-decoration: underline;
}
.partner-app-modal__hint {
margin: 12px 0 0;
font-size: 14px;
line-height: 20px;
color: var(--color-gray);
}
.partner-app-modal__error {
margin: 12px 0 0;
font-size: 14px;
line-height: 20px;
color: #c62828;
}
.partner-app-modal__error[hidden] { display: none; }
.partner-app-modal__btn {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
min-height: 52px;
margin-top: 20px;
padding: 14px 16px;
border: 0;
border-radius: 30px;
background: var(--color-gray3);
color: var(--color-black2);
font-size: 16px;
line-height: 22px;
font-weight: 600;
cursor: pointer;
}
.partner-app-modal__btn:disabled { opacity: .6; }
.partner-orders__more {
display: block;
width: calc(100% - 22px);
min-height: 44px;
margin: 4px 11px 8px;
padding: 12px 16px;
border: 1px solid var(--lavka-divider);
border-radius: 22px;
background: var(--color-white);
color: var(--color-black);
font-size: 14px;
line-height: 20px;
font-weight: 500;
cursor: pointer;
}
.partner-orders__more:disabled { opacity: .6; cursor: default; }
.partner-orders__more[hidden] { display: none; }
.admin-page {
background: var(--color-gray7);
font-family: var(--font-roboto);
}
.admin-main {
box-sizing: border-box;
min-height: 100vh;
padding: 16px 8px calc(24px + env(safe-area-inset-bottom, 0px));
}
.admin-stat {
box-sizing: border-box;
min-height: 100px;
margin: 0 8px 8px;
padding: 16px 20px;
background: var(--color-white);
border-radius: 20px;
}
.admin-stat__label {
margin: 0;
font-size: 14px;
font-weight: 400;
line-height: 1.4;
color: var(--color-gray);
}
.admin-stat__value {
margin: 8px 0 0;
font-size: 28px;
font-weight: 700;
line-height: 1.2;
text-align: center;
color: var(--color-black2);
}
.admin-alert {
box-sizing: border-box;
margin: 0 8px 8px;
padding: 16px 20px;
background: var(--color-white);
border: 2px solid var(--color-red);
border-radius: 20px;
}
.admin-alert[hidden] {
display: none;
}
.admin-alert__title {
margin: 0;
font-size: 16px;
font-weight: 700;
line-height: 1.4;
color: var(--color-black2);
}
.admin-alert__list {
margin: 8px 0 0;
padding: 0;
list-style: none;
font-size: 14px;
line-height: 1.4;
color: var(--color-black2);
}
.admin-alert__list li + li {
margin-top: 8px;
}
.admin-analytics {
box-sizing: border-box;
margin: 8px 8px 8px;
padding: 16px;
background: var(--color-white);
border-radius: 20px;
}
.admin-analytics__title {
margin: 0 0 12px;
font-size: 18px;
font-weight: 700;
line-height: 1.3;
color: var(--color-black2);
}
.admin-analytics .admin-analytics__tabs {
margin-bottom: 16px;
background: var(--color-gray7);
}
.admin-analytics .admin-analytics__tabs .admin-tabs__btn--active {
background: var(--color-white);
}
.admin-analytics__body[aria-busy="true"] {
opacity: .5;
}
.admin-analytics__note {
margin: 12px 0 0;
font-size: 14px;
line-height: 1.4;
color: var(--color-gray);
}
.admin-analytics__warn {
margin: 0 0 12px;
padding: 12px;
font-size: 14px;
line-height: 1.4;
color: var(--color-black2);
background: var(--color-orange);
border-radius: 12px;
}
.admin-analytics__tiles {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 8px;
}
.admin-analytics__tile {
display: flex;
flex-direction: column;
gap: 2px;
padding: 12px;
background: var(--color-gray3);
border-radius: 12px;
}
.admin-analytics__tile-label,
.admin-analytics__tile-sub {
font-size: 14px;
line-height: 1.4;
color: var(--color-gray);
}
.admin-analytics__tile-value {
font-size: 24px;
font-weight: 700;
line-height: 1.2;
color: var(--color-black2);
}
.admin-analytics__sub {
margin: 20px 0 8px;
font-size: 16px;
font-weight: 700;
line-height: 1.4;
color: var(--color-black2);
}
.admin-analytics__days {
display: flex;
flex-direction: column;
gap: 6px;
margin: 0;
padding: 0;
list-style: none;
}
.admin-analytics__day {
display: grid;
grid-template-columns: 72px 1fr auto;
align-items: center;
gap: 8px;
font-size: 14px;
line-height: 1.4;
color: var(--color-black);
}
.admin-analytics__day-bar {
height: 8px;
overflow: hidden;
background: var(--color-gray7);
border-radius: 4px;
}
.admin-analytics__day-bar > span {
display: block;
height: 100%;
background: var(--color-orange2);
border-radius: 4px;
}
.admin-analytics__day-num {
white-space: nowrap;
font-variant-numeric: tabular-nums;
}
.admin-analytics__card {
padding: 12px;
background: var(--color-gray3);
border-radius: 12px;
}
.admin-analytics__card + .admin-analytics__card {
margin-top: 8px;
}
.admin-analytics__card-name {
margin: 0 0 8px;
font-size: 16px;
font-weight: 500;
line-height: 1.4;
color: var(--color-black2);
}
.admin-analytics__grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 8px;
margin: 0;
}
.admin-analytics__cell dt {
margin: 0;
font-size: 14px;
line-height: 1.4;
color: var(--color-gray);
}
.admin-analytics__cell dd {
margin: 0;
font-size: 18px;
font-weight: 700;
line-height: 1.3;
color: var(--color-black2);
font-variant-numeric: tabular-nums;
}
.admin-analytics__table {
width: 100%;
border-collapse: collapse;
font-size: 14px;
line-height: 1.4;
}
.admin-analytics__table th,
.admin-analytics__table td {
padding: 8px 4px;
text-align: right;
border-bottom: 1px solid var(--color-gray6);
font-variant-numeric: tabular-nums;
}
.admin-analytics__table th:first-child {
text-align: left;
}
.admin-analytics__table thead th {
font-weight: 400;
color: var(--color-gray);
}
.admin-analytics__table tbody th {
font-weight: 500;
color: var(--color-black2);
}
.admin-tabs {
display: flex;
padding: 4px;
margin-bottom: 8px;
background: var(--color-white);
border-radius: 20px;
}
.admin-tabs__btn {
position: relative;
flex: 1 1 0;
min-width: 0;
height: 32px;
padding: 0 4px;
border: 0;
border-radius: 15px;
background: transparent;
font-family: var(--font-roboto);
font-size: 14px;
line-height: 1.4;
color: var(--color-black);
cursor: pointer;
}
.admin-tabs__btn::after {
content: '';
position: absolute;
top: 50%;
right: 0;
left: 0;
height: 44px;
transform: translateY(-50%);
}
.admin-tabs__btn--active {
background: var(--color-gray7);
font-weight: 500;
}
.admin-list {
display: flex;
flex-direction: column;
gap: 8px;
}
.admin-list__heading {
margin: 18px 0 10px;
font-size: 16px;
font-weight: 700;
line-height: 22px;
color: var(--color-black2);
}
.admin-list__empty {
margin: 24px 0 0;
font-size: 14px;
line-height: 1.4;
text-align: center;
color: var(--color-gray4);
}
.admin-card {
box-sizing: border-box;
position: relative;
display: block;
width: 100%;
min-height: 91px;
padding: 18px 20px;
border: 0;
border-radius: 20px;
background: var(--color-white);
font-family: var(--font-roboto);
text-align: left;
cursor: pointer;
}
.admin-card__title {
display: block;
font-size: 20px;
font-weight: 500;
line-height: 1.3;
color: var(--color-black2);
}
.admin-card__line {
display: block;
margin-top: 2px;
font-size: 14px;
line-height: 1.4;
color: var(--color-gray);
}
.admin-card__note {
display: block;
margin-top: 6px;
font-size: 14px;
line-height: 1.4;
color: var(--color-orange3);
}
.admin-card__note.admin-card__note--wait {
color: var(--color-red);
}
.admin-card__dot {
position: absolute;
top: 18px;
right: 20px;
}
.admin-partner-modal,
.admin-order-modal {
position: fixed;
inset: 0;
z-index: 1300;
display: flex;
flex-direction: column;
visibility: hidden;
pointer-events: none;
}
.admin-partner-modal[aria-hidden="false"],
.admin-order-modal[aria-hidden="false"] {
visibility: visible;
pointer-events: auto;
}
.admin-partner-modal__backdrop,
.admin-order-modal__backdrop {
position: absolute;
inset: 0;
padding: 0;
border: none;
background: rgba(0, 0, 0, .7);
opacity: 0;
transition: opacity .25s ease;
}
.admin-partner-modal[aria-hidden="false"] .admin-partner-modal__backdrop,
.admin-order-modal[aria-hidden="false"] .admin-order-modal__backdrop {
opacity: 1;
}
.admin-partner-modal__sheet,
.admin-order-modal__sheet {
position: relative;
z-index: 1;
box-sizing: border-box;
display: flex;
flex-direction: column;
flex: 1 1 auto;
margin-top: 62px;
padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
border-radius: 20px 20px 0 0;
background: var(--color-gray7);
overflow-y: auto;
transform: translateY(16px);
transition: transform .25s ease;
}
.admin-partner-modal[aria-hidden="false"] .admin-partner-modal__sheet,
.admin-order-modal[aria-hidden="false"] .admin-order-modal__sheet {
transform: translateY(0);
}
.admin-partner-modal__head,
.admin-order-modal__head {
position: relative;
padding: 26px 16px 20px;
border-radius: 20px 20px 0 0;
background: var(--color-white);
}
.admin-partner-modal__close,
.admin-order-modal__close {
position: absolute;
top: 10px;
right: 10px;
display: flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
padding: 0;
border: 0;
background: transparent;
color: var(--color-black2);
cursor: pointer;
}
.admin-partner-modal__title,
.admin-order-modal__title {
margin: 0 0 20px;
font-size: 20px;
font-weight: 500;
line-height: 1.3;
text-align: center;
color: var(--color-black2);
}
.admin-partner-modal__actions,
.admin-order-modal__actions {
display: flex;
justify-content: center;
gap: 8px;
}
.admin-partner-modal__action,
.admin-order-modal__action {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 2px;
width: 100px;
min-height: 45px;
padding: 4px;
border: 0;
border-radius: 10px;
background: var(--color-gray7);
font-family: var(--font-roboto);
font-size: 14px;
line-height: 1.4;
color: var(--color-black);
cursor: pointer;
}
.admin-partner-modal__action[hidden],
.admin-order-modal__action[hidden] {
display: none;
}
.admin-partner-modal__action-icon,
.admin-order-modal__action-icon {
display: block;
}
.admin-partner-modal__card,
.admin-order-modal__card {
margin: 8px 10px 0;
padding: 16px 20px;
border-radius: 10px;
background: var(--color-white);
}
.admin-partner-modal__field + .admin-partner-modal__field,
.admin-order-modal__field + .admin-order-modal__field {
margin-top: 16px;
}
.admin-partner-modal__label,
.admin-order-modal__label {
display: block;
font-size: 14px;
line-height: 1.4;
color: var(--color-gray4);
}
.admin-partner-modal__value,
.admin-order-modal__value {
display: block;
margin-top: 2px;
font-size: 16px;
line-height: 1.4;
color: var(--color-black2);
overflow-wrap: anywhere;
}
.admin-partner-modal__error,
.admin-order-modal__error {
margin: 12px 16px 0;
font-size: 14px;
line-height: 1.4;
color: #c62828;
}
.admin-partner-modal__error[hidden],
.admin-order-modal__error[hidden] {
display: none;
}
.admin-page--plain {
background: var(--color-white);
}
.admin-page--plain .admin-tabs {
box-shadow: 0 0 4px rgba(0, 0, 0, .25);
}
.admin-main--orders {
display: flex;
flex-direction: column;
padding-bottom: 0;
}
.admin-stats {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
padding: 0 8px;
}
.admin-stat--half {
margin: 0;
}
.admin-recent {
box-sizing: border-box;
flex: 1 1 auto;
margin: 16px -8px 0;
padding: 20px 16px calc(24px + env(safe-area-inset-bottom, 0px));
background: var(--color-white);
border-radius: 20px 20px 0 0;
}
.admin-recent__head {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 12px;
}
.admin-recent__title {
margin: 0;
font-size: 16px;
font-weight: 700;
line-height: 22px;
color: var(--color-black2);
}
.admin-recent__all {
padding: 12px 0;
margin: -12px 0;
font-size: 16px;
line-height: 1.4;
color: var(--color-black2);
text-decoration: underline;
}
.admin-orders--flat {
padding: 0 8px;
}
.admin-order {
box-sizing: border-box;
display: block;
width: 100%;
padding: 14px 0 16px;
border: 0;
border-bottom: 1px solid var(--lavka-divider);
background: transparent;
font-family: var(--font-roboto);
text-align: left;
cursor: pointer;
}
.admin-order__head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 12px;
}
.admin-order__num {
display: block;
font-size: 16px;
font-weight: 700;
line-height: 1.3;
color: var(--color-black2);
}
.admin-order__items {
display: block;
margin-top: 2px;
font-size: 14px;
line-height: 1.4;
color: var(--color-gray);
}
.admin-order__status {
box-sizing: border-box;
flex: 0 0 auto;
display: flex;
align-items: center;
justify-content: center;
min-width: 90px;
min-height: 24px;
padding: 2px 8px;
border-radius: 10px;
background: var(--color-gray7);
font-size: 14px;
line-height: 1.4;
color: var(--color-gray);
}
.admin-order__meta {
display: block;
margin-top: 12px;
font-size: 14px;
line-height: 1.4;
color: var(--color-gray);
}
.admin-order__dot {
display: inline-block;
width: 4px;
height: 4px;
margin: 0 6px;
border-radius: 50%;
background: var(--color-gray2);
vertical-align: middle;
}
.admin-order-modal__action {
text-decoration: none;
}
.admin-order-modal__card--total {
text-align: center;
}
.admin-order-modal__total {
margin: 0;
font-size: 18px;
font-weight: 500;
line-height: 1.3;
color: var(--color-black2);
}
.admin-order-modal__line {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 12px;
font-size: 16px;
line-height: 1.4;
color: var(--color-black2);
}
.admin-order-modal__line + .admin-order-modal__line {
margin-top: 10px;
}
.admin-order-modal__line-price {
flex: 0 0 auto;
}
.partner-orders__moderation-reason {
margin: 6px 12px 0;
padding: 10px 12px;
border-radius: 10px;
background: var(--color-gray7);
font-size: 14px;
line-height: 1.4;
color: var(--color-black2);
text-align: left;
overflow-wrap: anywhere;
}
.partner-orders__moderation-btn {
display: block;
width: calc(100% - 24px);
min-height: 44px;
margin: 10px 12px 0;
padding: 10px 16px;
border: 0;
border-radius: 10px;
background: var(--color-orange2);
font-family: var(--font-roboto);
font-size: 16px;
line-height: 1.4;
color: var(--color-white);
cursor: pointer;
}
.partner-orders__moderation-btn:disabled {
background: var(--color-gray2);
cursor: default;
}
.admin-log__filter {
display: block;
margin-bottom: 16px;
}
.admin-log__filter-label {
display: block;
margin-bottom: 6px;
font-size: 14px;
line-height: 1.4;
color: var(--color-gray4);
}
.admin-log__select {
box-sizing: border-box;
width: 100%;
min-height: 44px;
padding: 10px 14px;
border: 1px solid var(--lavka-divider);
border-radius: 12px;
background: var(--color-white);
font-family: var(--font-roboto);
font-size: 16px;
line-height: 1.4;
color: var(--color-black);
}
.admin-log__list {
display: flex;
flex-direction: column;
gap: 16px;
}
.admin-log__group {
display: flex;
flex-direction: column;
gap: 8px;
}
.admin-log__date {
margin: 0;
font-size: 16px;
font-weight: 500;
line-height: 1.3;
color: var(--color-black);
}
.admin-log__rows {
display: flex;
flex-direction: column;
gap: 8px;
margin: 0;
padding: 0;
list-style: none;
}
.admin-log__row {
box-sizing: border-box;
padding: 14px 20px;
border-radius: 20px;
background: var(--color-white);
}
.admin-log__row-head {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 12px;
margin-bottom: 6px;
}
.admin-log__time {
font-size: 14px;
line-height: 1.4;
color: var(--color-gray4);
}
.admin-log__est {
font-size: 14px;
line-height: 1.4;
text-align: right;
color: var(--color-orange2);
}
.admin-log__label {
margin: 0 0 6px;
font-size: 16px;
font-weight: 500;
line-height: 1.4;
color: var(--color-black);
}
.admin-log__value {
margin: 0 0 4px;
font-size: 14px;
line-height: 1.5;
color: var(--color-black);
overflow-wrap: anywhere;
}
.admin-log__value-key {
color: var(--color-gray4);
}
.admin-log__who {
margin: 6px 0 0;
font-size: 14px;
line-height: 1.4;
color: var(--color-gray4);
}
.admin-log__more {
display: block;
width: 100%;
min-height: 44px;
margin: 4px 0 8px;
padding: 12px 16px;
border: 1px solid var(--lavka-divider);
border-radius: 22px;
background: var(--color-white);
font-family: var(--font-roboto);
font-size: 14px;
line-height: 1.4;
color: var(--color-black);
cursor: pointer;
}
.admin-log__more:disabled {
opacity: .6;
cursor: default;
}
.admin-log__more[hidden] {
display: none;
}
.push-modal {
position: fixed;
inset: 0;
z-index: 1200;
display: flex;
align-items: flex-end;
justify-content: center;
}
.push-modal[hidden] {
display: none;
}
.push-modal__backdrop {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
border: 0;
padding: 0;
background: rgba(0, 0, 0, 0.45);
cursor: pointer;
}
.push-modal__sheet {
position: relative;
width: 100%;
max-width: 412px;
background: #fff;
border-radius: 20px 20px 0 0;
padding: 32px 20px calc(24px + env(safe-area-inset-bottom));
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
gap: 12px;
}
.push-modal__icon {
color: var(--color-black);
line-height: 0;
margin-bottom: 4px;
}
.push-modal__title {
margin: 0;
font-size: 20px;
line-height: 1.3;
font-weight: 700;
color: var(--color-black);
}
.push-modal__text {
margin: 0 0 12px;
font-size: 15px;
line-height: 1.45;
color: var(--color-gray2);
max-width: 300px;
}
.push-modal__accept {
width: 100%;
max-width: 350px;
min-height: 60px;
border: 0;
border-radius: 30px;
background: var(--color-orange3);
color: #fff;
font-size: 17px;
font-weight: 600;
line-height: 1.2;
cursor: pointer;
}
.push-modal__later {
min-height: 44px;
border: 0;
background: none;
color: var(--color-orange3);
font-size: 16px;
line-height: 1.3;
cursor: pointer;
padding: 0 16px;
}
.chat-list {
display: flex;
flex-direction: column;
gap: 8px;
padding: 10px 16px 24px;
}
.chat-list__row {
display: flex;
align-items: center;
gap: 16px;
min-height: 60px;
padding: 4px 8px;
margin: 0 -8px;
border-radius: 15px;
text-decoration: none;
color: inherit;
}
.chat-list__pic {
flex: none;
width: 60px;
height: 60px;
border-radius: 50%;
background: var(--color-gray7);
object-fit: cover;
}
.chat-list__body {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
gap: 2px;
}
.chat-list__title {
font-size: 17px;
line-height: 1.3;
font-weight: 600;
color: var(--color-black);
}
.chat-list__last {
font-size: 14px;
line-height: 1.4;
color: var(--color-gray4);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.chat-list__last--empty {
color: var(--color-gray4);
font-style: italic;
}
.chat-list__meta {
flex: none;
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: center;
gap: 4px;
min-width: 42px;
margin-right: 4px;
}
.chat-list__stamp {
font-size: 12px;
line-height: 1.4;
color: var(--color-gray4);
white-space: nowrap;
}
.chat-list__badge {
display: flex;
align-items: center;
justify-content: center;
min-width: 20px;
height: 20px;
padding: 0 6px;
border-radius: 10px;
background: var(--color-red);
color: var(--color-white);
font-size: 12px;
line-height: 1;
font-weight: 600;
}
.chat-list__empty,
.chat-list__loading {
padding: 24px 0;
text-align: center;
font-size: 15px;
line-height: 1.4;
color: var(--color-gray4);
}
.chat {
display: flex;
flex-direction: column;
height: 100vh;
height: 100dvh;
}
.chat__scroll {
flex: 1;
min-height: 0;
overflow-y: auto;
display: flex;
flex-direction: column;
gap: 6px;
padding: 12px 16px 8px;
}
.chat__day {
margin: 12px 0 6px;
text-align: center;
font-size: 15px;
line-height: 1.3;
font-weight: 500;
color: var(--color-black);
}
.chat__msg {
display: flex;
flex-direction: column;
align-items: flex-start;
align-self: flex-start;
max-width: 80%;
}
.chat__msg--mine {
align-self: flex-end;
align-items: flex-end;
}
.chat__bubble {
padding: 8px 14px;
border-radius: 16px;
background: var(--color-gray7);
color: var(--color-black);
font-size: 16px;
line-height: 1.4;
word-break: break-word;
}
.chat__msg--mine .chat__bubble {
background: var(--color-orange2);
color: var(--color-white);
}
.chat-page--partner .chat__msg--mine .chat__bubble,
.chat-page--partner .chat__send {
background: var(--color-black3);
}
.chat__time {
display: inline-flex;
align-items: center;
gap: 4px;
margin-top: 2px;
font-size: 11px;
line-height: 1.4;
color: var(--color-gray4);
}
.chat__empty,
.chat__loading {
margin: auto;
text-align: center;
font-size: 15px;
line-height: 1.4;
color: var(--color-gray4);
}
.chat__error {
margin: 0 16px 4px;
font-size: 14px;
line-height: 1.4;
color: #c62828;
}
.chat__error[hidden] {
display: none;
}
.chat__composer {
display: flex;
align-items: flex-end;
gap: 8px;
padding: 8px 8px calc(8px + env(safe-area-inset-bottom, 0px));
background: var(--color-white);
}
.chat__input {
flex: 1;
min-height: 48px;
max-height: 120px;
padding: 13px 18px;
border: 0;
border-radius: 24px;
background: var(--color-gray7);
color: var(--color-black);
font-size: 16px;
line-height: 1.4;
font-family: inherit;
resize: none;
overflow-y: auto;
}
.chat__input:focus,
.chat__input:focus-visible {
outline: 0;
}
.chat__input::placeholder {
color: var(--color-gray4);
}
.chat__send {
flex: none;
width: 48px;
height: 48px;
padding: 0;
border: 0;
border-radius: 24px;
background: var(--color-orange2);
color: var(--color-white);
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
.chat__send:disabled {
opacity: .6;
}
.lavka-dot {
flex: none;
width: 10px;
height: 10px;
border-radius: 50%;
background: var(--color-red);
}
.lavka-dot[hidden] {
display: none;
}
.footer__support {
position: relative;
}
.footer__support-dot {
position: absolute;
top: 6px;
right: 6px;
border: 2px solid var(--color-white);
}
.footer__support-dot[hidden] {
display: none;
}
.partner-shop__contact{flex:1 1 0;min-width:0;padding:6px 10px}
.chat__author{margin-bottom:2px;font-size:13px;line-height:1.4;color:var(--color-gray4)}
.chat__readonly{padding:12px 16px calc(12px + env(safe-area-inset-bottom, 0px));margin:0;background:var(--color-white);font-size:14px;line-height:1.4;color:var(--color-gray4);text-align:center}
.order-list__item-info-block { flex-wrap: wrap; row-gap: 4px; }
.order-list__item-status { white-space: nowrap; }
.order-list__item-status--cancelled { color: var(--color-red); }
.order-success-modal__handle,
.checkout-modal__handle,
.order-detail__handle { flex-shrink: 0; width: 30px; height: 3px; margin: 10px auto 0; border-radius: 2px; background: #cfcfcf; }
.address-modal__close,
.address-modal__close:hover,
.order-detail__close,
.order-detail__close:hover { background: transparent; color: var(--color-black2); }
.address-modal__close { top: 6px; right: 6px; width: 40px; height: 40px; border-radius: 50%; }
.order-detail__close { width: 44px; height: 44px; margin: 2px 0 6px auto; border-radius: 50%; }
.address-modal__switch { width: 54px; }
body.chat-page { min-height: 100vh; min-height: 100dvh; }
.chat { height: auto; flex: 1 1 auto; min-height: 0; }
body.chat-page--adminbar { min-height: calc(100vh - 32px); min-height: calc(100dvh - 32px); }
@media screen and (max-width: 782px) {
body.chat-page--adminbar { min-height: calc(100vh - 46px); min-height: calc(100dvh - 46px); }
}
body.chat-page--room { height: 100vh; height: 100dvh; overflow: hidden; }
body.chat-page--room.chat-page--adminbar { height: calc(100vh - 32px); height: calc(100dvh - 32px); }
@media screen and (max-width: 782px) {
body.chat-page--room.chat-page--adminbar { height: calc(100vh - 46px); height: calc(100dvh - 46px); }
}
.chat__scroll { overscroll-behavior: contain; }
.p-hours__check-box,
.p-set__check-box { position: relative; }
.p-hours__check input:checked + .p-hours__check-box,
.p-set__check input:checked + .p-set__check-box { background-color: var(--color-black2); box-shadow: none; }
.p-hours__check input:checked + .p-hours__check-box::after,
.p-set__check input:checked + .p-set__check-box::after { content: ""; position: absolute; left: 50%; top: 46%; width: 5px; height: 9px; border: solid var(--color-white); border-width: 0 2px 2px 0; transform: translate(-50%, -50%) rotate(45deg); }
.checkout-modal__date-btn { min-height: 40px; line-height: 20px; padding: 0 14px; }
.checkout-modal__slot-btn { font-size: 16px; }
.push-modal__text { color: var(--color-black); }
.push-modal__title,
.push-modal__icon { color: var(--color-black2); }
.address-modal__comment { color: var(--color-gray); }
.checkout-modal__address-comment { margin: 0 0 14px; }
.checkout-modal__field-text,
.checkout-modal__input { font-size: 16px; line-height: 20px; }
.partner-shop__meta-item + .partner-shop__meta-item .partner-shop__meta-text { border-top-color: var(--lavka-divider); }
.basket-list__qty-delete-btn--minus { display: flex; justify-content: center; align-items: center; font-size: 18px; line-height: 1; color: var(--color-white); }
a, button, label, summary, [role="button"], input, select, textarea { -webkit-tap-highlight-color: transparent; }
button, a.button, [role="button"] { -webkit-user-select: none; user-select: none; }
@keyframes lavka-page-in { from { opacity: 0; } to { opacity: 1; } }
main { animation: lavka-page-in .18s ease-out both; }
.bottom-nav__link, .page-head__back { transition: opacity .15s ease, color .15s ease, background-color .15s ease; }
@media (prefers-reduced-motion: reduce) {
main { animation: none; }
.bottom-nav__link, .page-head__back { transition: none; }
.lavka-skel { animation: none; }
}
@keyframes lavka-skel-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .55; } }
.lavka-skel__wrap { display: flex; flex-direction: column; gap: 10px; }
.lavka-skel { background: var(--color-gray7); border-radius: 12px; animation: lavka-skel-pulse 1.2s ease-in-out infinite; }
.lavka-skel__card { min-height: 100px; border-radius: 20px; }
.lavka-skel__chat { min-height: 60px; border-radius: 15px; }
.lavka-skel__row { min-height: 20px; }
.partner-shop__head-title { position: absolute; left: 50%; transform: translateX(-50%); max-width: 60%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; line-height: 20px; font-weight: 600; color: var(--color-black2); opacity: 0; transition: opacity .15s ease; pointer-events: none; }
.partner-shop__head-title--shown { opacity: 1; }
.partner-shop__head-title[hidden] { display: none; }
.partner-shop__head { position: sticky; }
:root {
--lavka-tap: 44px;
--lavka-tap-gap: 12px;
--lavka-btn-h: 52px;
--lavka-btn-h-lg: 56px;
--lavka-btn-h-sm: 44px;
--lavka-btn-fs: 17px;
--lavka-btn-fs-sm: 15px;
--lavka-btn-radius: 26px;
--lavka-field-fs: 16px;
--lavka-close-size: 32px;
--lavka-close-bg: #eaeaea;
--lavka-close-bg-active: #dcdcdc;
--lavka-grabber-w: 36px;
--lavka-grabber-h: 4px;
--lavka-grabber-color: rgba(0, 0, 0, .14);
--lavka-grabber-top: 10px;
--lavka-icon: 24px;
--lavka-divider: var(--color-gray6);
}
.basket-list__btn,
.checkout-modal__submit,
.address-modal__primary,
.address-modal__add,
.address-modal__danger,
.auth-modal__submit,
.partner-connect__submit,
.partner-cancel-modal__submit,
.p-hours__save,
.p-set__save,
.partner-orders__moderation-btn,
.p-item__photo-btn,
.profile__login-btn,
.profile-sheet__submit,
.day-picker__submit,
.not-found__btn,
.partner-app-modal__btn,
.product-modal__add,
.cart-fab,
.partner-catalog__total-btn,
.confirm__btn,
.chat__send,
.partner-catalog__add-btn,
.product-modal__qty-btn,
.partner-catalog__qty-btn,
.basket-list__add,
.partner-menu__add,
.est-card,
.partner-catalog__card,
.order-list__item,
.chat-list__row,
.profile__row,
.partner-shop__contact,
.checkout-modal__date-btn,
.checkout-modal__slot-btn,
.checkout-modal__row-pill,
.checkout-modal__leave-row,
.start-location__row,
.address-modal__select,
.admin-tabs__btn,
.admin-order-modal__action,
.admin-partner-modal__action,
.partner-order-modal__action,
.profile-sheet__action,
.page-head__action,
.footer__link,
.footer__support,
[data-address-list] li,
[data-orders-list] > * {
-webkit-tap-highlight-color: transparent;
}
.is-loading {
position: relative;
color: transparent !important;
pointer-events: none;
}
.is-loading * {
color: transparent !important;
}
.is-loading::after {
content: "";
position: absolute;
left: 50%;
top: 50%;
width: 20px;
height: 20px;
margin: -10px 0 0 -10px;
border: 2px solid var(--lavka-spinner-track, rgba(255, 255, 255, .4));
border-top-color: var(--lavka-spinner-head, #fff);
border-radius: 50%;
animation: lavka-spin .7s linear infinite;
}
.address-modal__danger.is-loading,
.confirm__btn.is-loading,
.p-item__photo-btn.is-loading {
--lavka-spinner-track: rgba(0, 0, 0, .15);
--lavka-spinner-head: var(--color-black2);
}
@keyframes lavka-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
.is-loading::after { animation-duration: 2s; }
}
.address-modal__primary,
.address-modal__add,
.address-modal__danger,
.auth-modal__submit,
.partner-connect__submit,
.partner-cancel-modal__submit,
.p-hours__save,
.p-set__save,
.partner-orders__moderation-btn,
.profile__login-btn,
.profile-sheet__submit,
.day-picker__submit,
.not-found__btn,
.partner-app-modal__btn,
.product-modal__add {
display: flex;
align-items: center;
justify-content: center;
min-height: var(--lavka-btn-h);
height: auto;
padding: 8px 20px;
border-radius: var(--lavka-btn-radius);
font-size: var(--lavka-btn-fs);
line-height: 1.25;
font-weight: 600;
}
.basket-list__btn,
.checkout-modal__submit {
min-height: var(--lavka-btn-h-lg);
height: auto;
padding: 8px 20px;
border-radius: var(--lavka-btn-radius);
}
.basket-list__btn-sum,
.checkout-modal__submit-title {
font-size: var(--lavka-btn-fs);
line-height: 22px;
font-weight: 600;
}
.basket-list__btn span:not(.basket-list__btn-sum),
.checkout-modal__submit-total {
font-size: 13px;
line-height: 16px;
}
.address-modal__danger {
min-height: var(--lavka-btn-h-sm);
font-size: var(--lavka-btn-fs-sm);
font-weight: 500;
}
.auth-modal__close,
.address-modal__close,
.checkout-modal__close,
.checkout-modal__head .checkout-modal__close,
.order-detail__close,
.product-modal__close,
.partner-order-modal__close,
.partner-cancel-modal__close,
.partner-app-modal__close,
.admin-partner-modal__close,
.admin-order-modal__close {
display: flex;
align-items: center;
justify-content: center;
width: var(--lavka-close-size);
height: var(--lavka-close-size);
flex-shrink: 0;
padding: 0;
border: 0;
border-radius: 50%;
background: var(--lavka-close-bg);
color: var(--color-black2);
cursor: pointer;
transition: background-color .15s ease;
-webkit-tap-highlight-color: transparent;
}
.auth-modal__close,
.checkout-modal__close {
position: relative;
}
.auth-modal__close::after,
.address-modal__close::after,
.checkout-modal__close::after,
.order-detail__close::after,
.product-modal__close::after,
.partner-order-modal__close::after,
.partner-cancel-modal__close::after,
.partner-app-modal__close::after,
.admin-partner-modal__close::after,
.admin-order-modal__close::after {
content: "";
position: absolute;
left: 50%;
top: 50%;
width: var(--lavka-tap);
height: var(--lavka-tap);
transform: translate(-50%, -50%);
}
.auth-modal__close:hover,
.address-modal__close:hover,
.checkout-modal__close:hover,
.checkout-modal__head .checkout-modal__close:hover,
.order-detail__close:hover,
.product-modal__close:hover,
.partner-order-modal__close:hover,
.partner-cancel-modal__close:hover,
.partner-app-modal__close:hover,
.admin-partner-modal__close:hover,
.admin-order-modal__close:hover {
background: var(--lavka-close-bg-active);
color: var(--color-black2);
}
.auth-modal__close:active,
.address-modal__close:active,
.checkout-modal__close:active,
.order-detail__close:active,
.product-modal__close:active,
.partner-order-modal__close:active,
.partner-cancel-modal__close:active,
.partner-app-modal__close:active,
.admin-partner-modal__close:active,
.admin-order-modal__close:active {
background: var(--lavka-close-bg-active);
}
.auth-modal__close-icon,
.address-modal__close-icon,
.checkout-modal__close-icon,
.order-detail__close-icon,
.product-modal__close-icon,
.partner-order-modal__close-icon,
.partner-cancel-modal__close-icon,
.partner-app-modal__close-icon,
.admin-partner-modal__close-icon,
.admin-order-modal__close-icon {
display: block;
flex-shrink: 0;
width: 18px;
height: 18px;
}
.address-modal__handle,
.order-detail__handle,
.checkout-modal__handle,
.order-success-modal__handle,
.auth-modal__handle,
.product-modal__handle,
.shop-info-modal__handle,
.profile-sheet__handle,
.partner-order-modal__handle,
.partner-cancel-modal__handle,
.partner-deliver-modal__handle,
.admin-order-modal__handle,
.admin-partner-modal__handle,
.profile-sheet__grabber,
.product-modal__grabber {
display: block;
width: var(--lavka-grabber-w);
height: var(--lavka-grabber-h);
margin: var(--lavka-grabber-top) auto 0;
border-radius: 999px;
background: var(--lavka-grabber-color);
flex-shrink: 0;
}
.profile-sheet__grabber,
.product-modal__grabber {
position: static;
transform: none;
margin-bottom: 12px;
}
.address-modal__edit-input,
.address-modal__input,
.auth-modal__input,
.partner-connect__input,
.partner-cancel-modal__input,
.profile-sheet__input,
.p-cats__name,
.chat__input,
.admin-log__select,
.p-hours__field input,
.p-hours__cutoff select,
.p-set__field input,
.p-set__field select,
.p-set__field textarea,
.p-item__field input,
.p-item__field select,
.p-item__field textarea {
font-size: var(--lavka-field-fs);
line-height: 22px;
}
.address-modal__edit-input {
padding-bottom: 12px;
}
.partner-shop__contact img,
.profile-sheet__action img,
.profile-sheet__action svg,
.page-head__action img,
.page-head__action svg,
.page-head__back img,
.page-head__back svg,
.order-detail__status-cancel-img img,
.chat__send svg,
.partner-order-modal__action img {
width: var(--lavka-icon);
height: var(--lavka-icon);
}
.footer__link {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 2px;
min-width: var(--lavka-tap);
min-height: var(--lavka-tap);
padding: 4px 6px;
border-radius: 14px;
}
.footer__img {
display: flex;
align-items: center;
justify-content: center;
width: var(--lavka-icon);
height: var(--lavka-icon);
}
.footer__icon {
width: var(--lavka-icon);
height: var(--lavka-icon);
}
.footer__text {
font-size: 11px;
line-height: 1.2;
letter-spacing: .1px;
}
.footer__support-icon {
width: var(--lavka-icon);
height: var(--lavka-icon);
}
.partner-shop__contact {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 6px;
min-height: var(--lavka-tap);
padding: 10px 12px;
}
.checkout-modal__date-btn {
border-radius: 22px;
padding: 0 12px;
}
.auth-modal__sheet,
.auth-modal__footer {
background-color: var(--color-white);
}
.partner-catalog__total-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
right: 16px;
bottom: calc(105px + env(safe-area-inset-bottom, 0px));
min-width: 119px;
width: auto;
height: var(--lavka-btn-h-sm);
padding: 0 20px;
border-radius: 22px;
box-shadow: 0 0 4px 0 rgba(0, 0, 0, .25);
font-size: 16px;
line-height: 22px;
font-weight: 500;
z-index: 60;
}
.partner-catalog__total-btn .cart-fab__icon {
flex: 0 0 auto;
display: block;
color: inherit;
}
.address-modal__switch {
width: 48px;
height: 28px;
}
.address-modal__switch::after {
width: 24px;
height: 24px;
top: 2px;
left: 2px;
}
.address-modal__switch:checked::after {
transform: translateX(20px);
}
.profile-sheet__action {
min-height: 48px;
padding: 0 18px;
gap: 12px;
font-size: 16px;
line-height: 22px;
}
.profile-sheet__action--danger {
font-size: 16px;
}
.checkout-modal__address-comment {
margin: -2px 0 10px;
padding: 0 3px;
color: var(--color-gray4);
}
.order-list__item-head {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 12px;
}
.order-list__item-head .order-list__item-title {
flex: 1 1 auto;
min-width: 0;
}
.order-list__item-head .order-list__item-status {
flex: 0 0 auto;
font-size: 14px;
line-height: 22px;
font-weight: 600;
color: var(--color-black2);
white-space: nowrap;
}
.order-list__item-head .order-list__item-status--cancelled {
color: var(--color-red);
}
.orders-guest {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 20px;
padding: 64px 20px 0;
text-align: center;
}
.orders-guest__text {
margin: 0;
max-width: 280px;
font-size: 16px;
line-height: 22px;
color: var(--color-gray4);
}
.orders-guest__btn {
width: 100%;
max-width: 350px;
min-height: var(--lavka-btn-h);
border: 0;
border-radius: var(--lavka-btn-radius);
background-color: var(--color-orange2);
color: var(--color-white);
font-family: inherit;
font-size: var(--lavka-btn-fs);
line-height: 1.25;
font-weight: 600;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
}
.orders-guest[hidden] {
display: none;
}
.auth-modal__consent {
display: flex;
align-items: flex-start;
gap: 10px;
margin: 0 0 10px;
padding: 0 10px;
cursor: pointer;
}
.auth-modal__consent-box {
flex-shrink: 0;
width: 20px;
height: 20px;
margin-top: 1px;
border: none;
border-radius: 50%;
background: var(--color-gray2);
display: flex;
align-items: center;
justify-content: center;
transition: background-color .15s;
}
.auth-modal__consent-box svg {
width: 12px;
height: 10px;
opacity: 0;
transition: opacity .15s;
}
.auth-modal__consent input {
position: absolute;
width: 1px;
height: 1px;
opacity: 0;
pointer-events: none;
}
.auth-modal__consent input:checked ~ .auth-modal__consent-box {
background-color: var(--color-orange2);
}
.auth-modal__consent input:checked ~ .auth-modal__consent-box svg {
opacity: 1;
}
.auth-modal__consent input:focus-visible ~ .auth-modal__consent-box {
outline: 2px solid var(--color-orange2);
outline-offset: 2px;
}
.auth-modal__submit:disabled:not(.is-loading) {
opacity: .45;
cursor: default;
filter: none;
transform: none;
}
.order-detail__status-cancel[hidden],
.address-modal__danger[hidden],
.order-list[hidden] {
display: none;
}
.partner-connect-page .partner-connect__step-title {
margin: 0 0 12px;
text-align: center;
}
.partner-connect-page .start-location__row--chosen {
background-color: var(--color-black);
box-shadow: inset 0 0 0 2px var(--color-black);
}
.partner-connect-page .start-location__row--chosen .start-location__row-name,
.partner-connect-page .start-location__row--chosen .start-location__chevron {
color: var(--color-white);
}
.partner-connect-page .start-location__row--chosen .start-location__row-sub {
color: rgba(255, 255, 255, .78);
}
.partner-connect__footer[hidden] {
display: none;
}
.p-cats__del {
margin-left: var(--lavka-tap-gap);
}
.p-set {
padding-bottom: calc(24px + env(safe-area-inset-bottom));
}
.p-set__toggle--locked {
cursor: default;
opacity: .6;
}
.p-set__toggle input:disabled + .p-set__toggle-box {
opacity: .6;
}
.partner-orders__accepting-row {
margin-top: 10px;
border-top: 1px solid var(--lavka-divider);
padding: 12px 0 0;
}
.partner-orders__accepting-note {
margin-top: 10px;
margin-bottom: 12px;
text-align: left;
}
.p-set__media {
gap: 6px;
}
.p-set__media .p-set__banner {
margin-top: 10px;
}
.p-set__media-hint {
margin: 0;
font-size: 12px;
line-height: 1.4;
color: var(--color-gray);
text-align: center;
}
.p-set__avatar.is-loading,
.p-set__banner.is-loading {
--lavka-spinner-track: rgba(0, 0, 0, .15);
--lavka-spinner-head: var(--color-black2);
}
* {
scrollbar-width: none;
-ms-overflow-style: none;
}
*::-webkit-scrollbar {
width: 0;
height: 0;
background: transparent;
}
.checkout-modal__sheet,
.order-success-modal__sheet,
.auth-modal__sheet,
.shop-info-modal__sheet,
.order-detail__sheet,
.profile-sheet__panel,
.day-picker__sheet {
padding-top: 0;
}
.checkout-modal__handle,
.order-success-modal__handle,
.auth-modal__handle,
.shop-info-modal__handle { margin-bottom: 12px; }
.profile-sheet__grabber { margin-bottom: 22px; }
.day-picker__handle,
.lavka-pwa-overlay__handle,
.push-modal__handle {
display: block;
width: var(--lavka-grabber-w);
height: var(--lavka-grabber-h);
margin: var(--lavka-grabber-top) auto 0;
border-radius: 999px;
background: var(--lavka-grabber-color);
flex-shrink: 0;
}
.day-picker__handle { margin-bottom: 10px; }
.push-modal__sheet { padding-top: 0; }
.push-modal__handle { margin-bottom: 6px; }
.lavka-pwa-overlay__handle { display: none; }
@media (max-width: 767px) {
.lavka-pwa-overlay .lavka-pwa__inner { padding-top: 0; }
.lavka-pwa-overlay__handle { display: block; }
}
.order-detail__close {
position: absolute;
top: 6px;
right: 6px;
z-index: 2;
margin: 0;
}
.order-detail__handle { margin-bottom: 34px; }
.checkout-modal__body {
margin-left: -13px;
margin-right: -13px;
padding-left: 13px;
padding-right: 13px;
}
.lavka-pwa-overlay__backdrop {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
padding: 0;
border: 0;
background: transparent;
cursor: pointer;
}
.lavka-pwa-overlay .lavka-pwa__inner {
z-index: 1;
}
.est-card__tag--closed {
color: #c62828;
}
.checkout-modal__pill-list {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 8px;
}
.checkout-modal__pill-list > .checkout-modal__row-pill,
.checkout-modal__pill-list > .checkout-modal__leave-row {
max-width: 100%;
padding: 8px 11px;
}
.checkout-modal__pill-list .checkout-modal__pill-text {
min-width: 0;
}
.checkout-modal__leave-check:checked,
.checkout-modal__toggle:checked,
.checkout-modal__check-badge,
.partner-connect__chip--active .partner-connect__chip-check {
background-size: 11px auto;
}
.checkout-modal__pay {
align-items: flex-end;
}
.checkout-modal__pay .checkout-modal__check-badge {
margin-bottom: -2px;
}
.checkout-modal__address-comment {
margin: -14px 0 10px;
}
.p-set__back,
.p-cats__back,
.p-hours__back,
.partner-connect__back,
.partner-menu__back,
.partner-orders__back,
.partner-shop__back,
.profile__back,
.back {
display: flex;
align-items: center;
justify-content: center;
width: var(--lavka-tap);
height: var(--lavka-tap);
padding: 0;
border: 0;
border-radius: 0;
background: none;
background-color: transparent;
box-shadow: none;
color: var(--color-black2);
text-decoration: none;
}
.p-set__back img,
.p-set__back svg,
.p-cats__back img,
.p-cats__back svg,
.p-hours__back img,
.p-hours__back svg,
.partner-connect__back img,
.partner-connect__back svg,
.partner-menu__back img,
.partner-menu__back svg,
.partner-orders__back img,
.partner-orders__back svg,
.partner-shop__back img,
.partner-shop__back svg,
.profile__back img,
.profile__back svg,
.back img,
.back svg {
width: var(--lavka-icon);
height: var(--lavka-icon);
}
.p-set__back,
.p-cats__back,
.p-hours__back {
left: -10px;
}
.partner-app-modal__close {
position: absolute;
right: 12px;
top: 12px;
z-index: 2;
}
.partner-app-modal__title {
font-size: 18px;
line-height: 24px;
}
.partner-app-modal__text {
font-size: 14px;
line-height: 20px;
}
.p-item__category {
display: block;
margin-top: 18px;
padding: 0;
border-radius: 0;
background-color: transparent;
}
.p-item .p-set__save {
margin-top: 18px;
}
.p-item .p-set__toggle {
padding-bottom: 2px;
}
.p-item .p-set__hint {
margin-top: 2px;
}
.partner-orders__filters {
gap: 6px;
padding: 5px;
border-radius: 20px;
box-shadow: 0 0 2px 0 rgba(0, 0, 0, .25);
}
.partner-orders__filter {
padding: 6px 12px;
border-radius: 15px;
font-size: 14px;
line-height: 18px;
letter-spacing: normal;
color: var(--color-black);
}
.partner-orders__filter--active {
background: #f0f0f0;
color: var(--color-black);
}
.p-set__phone-hint {
display: block;
margin: 8px 0 0;
font-size: 12px;
line-height: 17px;
color: var(--color-gray);
}
.p-mgr__lead {
margin: 8px 0 0;
font-size: 14px;
line-height: 20px;
color: var(--color-gray);
}
.p-mgr__invite,
.p-mgr__leave {
display: block;
width: 100%;
min-height: 52px;
margin-top: 20px;
padding: 14px 18px;
border: 0;
border-radius: 30px;
background-color: var(--color-black2);
font-family: inherit;
font-size: 16px;
line-height: 22px;
color: var(--color-white);
cursor: pointer;
}
.p-mgr__leave {
margin-top: 32px;
border: 1px solid var(--lavka-divider);
background: none;
color: #c62828;
}
.p-mgr__invite:disabled,
.p-mgr__leave:disabled {
opacity: .6;
cursor: default;
}
.p-mgr__note {
margin: 10px 0 0;
font-size: 13px;
line-height: 19px;
color: var(--color-gray);
}
.p-mgr__subtitle {
margin: 28px 0 0;
font-size: 16px;
line-height: 22px;
font-weight: 600;
color: var(--color-black2);
}
.p-mgr__list {
margin: 8px 0 0;
padding: 0;
list-style: none;
}
.p-mgr__item {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 8px 12px;
padding: 12px 0;
border-bottom: 1px solid var(--lavka-divider);
}
.p-mgr__info {
display: flex;
flex-direction: column;
gap: 2px;
min-width: 0;
}
.p-mgr__name {
font-size: 16px;
line-height: 22px;
color: var(--color-black2);
overflow-wrap: anywhere;
}
.p-mgr__you {
font-size: 14px;
color: var(--color-gray);
}
.p-mgr__meta {
font-size: 13px;
line-height: 18px;
color: var(--color-gray);
}
.p-mgr__actions {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-left: auto;
}
.p-mgr__btn {
min-height: 44px;
padding: 0 12px;
border: 0;
border-radius: 15px;
background: var(--color-gray7);
font-family: inherit;
font-size: 14px;
line-height: 18px;
color: var(--color-black);
cursor: pointer;
}
.p-mgr__btn--quiet {
background: none;
color: var(--color-gray);
}
.p-mgr__btn[hidden] {
display: none;
}
.p-mgr__btn:disabled,
.p-mgr__btn[aria-busy="true"] {
opacity: .6;
cursor: default;
}
.p-mgr__empty {
margin: 12px 0 0;
font-size: 14px;
line-height: 20px;
color: var(--color-gray);
}
.p-mgr__status {
margin: 12px 0 0;
font-size: 14px;
line-height: 20px;
color: #c62828;
overflow-wrap: anywhere;
}
.p-mgr__status[hidden] {
display: none;
}
.lavka-invite {
display: flex;
flex-direction: column;
justify-content: center;
min-height: 100vh;
max-width: 420px;
margin: 0 auto;
padding: 48px 20px 32px;
box-sizing: border-box;
text-align: center;
}
.lavka-invite__kicker {
margin: 0;
font-size: 14px;
line-height: 20px;
color: var(--color-gray);
}
.lavka-invite__title {
margin: 8px 0 0;
font-size: 24px;
line-height: 30px;
font-weight: 700;
color: var(--color-black2);
overflow-wrap: anywhere;
}
.lavka-invite__text {
margin: 16px 0 0;
font-size: 16px;
line-height: 23px;
color: var(--color-black2);
}
.lavka-invite__note {
margin: 12px 0 0;
font-size: 13px;
line-height: 19px;
color: var(--color-gray);
}
.lavka-invite__btn {
display: flex;
align-items: center;
justify-content: center;
min-height: 52px;
margin-top: 24px;
padding: 14px 18px;
border: 0;
border-radius: 30px;
background-color: var(--color-black2);
font-family: inherit;
font-size: 16px;
line-height: 22px;
color: var(--color-white);
text-decoration: none;
cursor: pointer;
}
.lavka-invite__btn--quiet {
margin-top: 12px;
background: none;
color: var(--color-gray);
}
.lavka-invite__btn:disabled {
opacity: .6;
cursor: default;
}
.lavka-invite__error {
margin: 12px 0 0;
font-size: 14px;
line-height: 20px;
color: #c62828;
}
.lavka-invite__error[hidden] {
display: none;
}
.checkout-modal__card > .checkout-modal__field-text:last-child {
margin-bottom: 0;
}
.checkout-modal__form {
margin-left: -13px;
margin-right: -13px;
padding-left: 13px;
padding-right: 13px;
}
@view-transition {
navigation: auto;
}
.footer {
view-transition-name: lavka-footer;
}
.cart-fab {
view-transition-name: lavka-cart-fab;
}
.page-head {
view-transition-name: lavka-page-head;
}
::view-transition-group(*),
::view-transition-old(*),
::view-transition-new(*) {
animation-duration: 180ms;
}
@media (prefers-reduced-motion: reduce) {
@view-transition {
navigation: none;
}
}
.checkout-modal--pickup .checkout-modal__address:not(.checkout-modal__address--pickup),
.checkout-modal--pickup .checkout-modal__address-comment:not(.checkout-modal__address-comment--pickup) {
display: none;
}
.checkout-modal__address--pickup {
cursor: default;
}
.checkout-modal__address[hidden] {
display: none;
}
.profile__notify {
padding: 18px 0;
border-bottom: 1px solid var(--lavka-divider);
}
.profile__notify-row {
padding: 0 4px;
}
.profile__row[data-pwa-open] {
margin-top: 6px;
}
.profile__notify-label {
display: flex;
align-items: center;
gap: 14px;
min-width: 0;
}
.profile__notify-label .p-set__toggle-text {
font-size: 18px;
line-height: 24px;
color: var(--color-black);
}
.profile__notify-note {
margin: 6px 0 0;
padding: 0 4px;
font-size: 14px;
line-height: 20px;
color: var(--color-gray4);
}
.profile__notify-note[hidden] {
display: none;
}
.profile__notify-escape {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 4px 12px;
margin-top: 10px;
padding: 0 4px;
}
.profile__notify-escape[hidden] {
display: none;
}
.profile__notify-escape-open,
.profile__notify-escape-copy {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 44px;
border: 0;
font-family: inherit;
font-size: 15px;
line-height: 20px;
cursor: pointer;
}
.profile__notify-escape-open {
padding: 0 18px;
border-radius: 22px;
background-color: var(--color-orange);
color: var(--color-black2);
text-decoration: none;
}
.profile__notify-escape-open[hidden] {
display: none;
}
.profile__notify-escape-copy {
padding: 0 4px;
background: none;
color: var(--color-black);
text-decoration: underline;
}
.p-set__autosave {
position: sticky;
bottom: 0;
z-index: 2;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
min-height: 48px;
margin: 16px -20px 0;
padding: 10px 20px calc(10px + env(safe-area-inset-bottom, 0px));
background: var(--color-white);
box-shadow: 0 -1px 0 var(--lavka-divider);
box-sizing: border-box;
}
.p-set__autosave-text {
margin: 0;
flex: 1;
line-height: 1.4;
}
.p-set__status--saved {
color: var(--color-gray);
}
.p-set__autosave-retry {
flex: 0 0 auto;
min-height: 44px;
padding: 8px 16px;
border: 0;
border-radius: 22px;
background: var(--color-black2);
font-family: var(--font-roboto);
font-size: 15px;
font-weight: 600;
color: var(--color-white);
cursor: pointer;
}
.p-set__autosave-retry[hidden] {
display: none;
}
.p-set__autosave--error {
box-shadow: 0 -1px 0 #c62828;
}
.partner-orders__moderation-btn {
width: calc(100% - 24px);
margin: 12px 12px 0;
background: var(--color-black2);
color: var(--color-white);
}
.partner-orders__moderation-btn:disabled {
opacity: .6;
background: var(--color-black2);
cursor: default;
}
.chat-ticks {
flex: none;
display: inline-flex;
align-items: center;
color: var(--color-black3);
}
.chat-ticks svg {
display: block;
width: 18px;
height: 13px;
}
.chat-ticks--sent {
opacity: .55;
}
[data-chat-scope="client"] .chat-list__ticks,
.chat[data-chat-role="client"] .chat__ticks {
color: var(--color-orange2);
}
.partner-orders__menu {
position: relative;
}
.partner-orders__menu-dot {
position: absolute;
top: 6px;
right: 10px;
}
.partner-orders__menu-dot[hidden] {
display: none;
}
@view-transition {
navigation: auto;
}
::view-transition-old(root),
::view-transition-new(root) {
animation-duration: .22s;
animation-timing-function: ease;
}
.footer {
view-transition-name: lavka-bottom-nav;
}
.page-head {
view-transition-name: lavka-page-head;
}
@media (prefers-reduced-motion: reduce) {
::view-transition-group(*),
::view-transition-old(*),
::view-transition-new(*) {
animation: none !important;
}
}
.partner-orders__moderation-btn {
width: auto;
max-width: calc(100% - 24px);
min-height: var(--lavka-btn-h-sm);
margin-inline: auto;
font-size: var(--lavka-btn-fs-sm);
}
.partner-orders__moderation-btn + .partner-orders__url {
margin-top: 16px;
}
.partner-orders__back {
top: 50%;
transform: translateY(-50%);
}
.chat-list__row {
position: relative;
}
.chat-list__row:not(:last-child)::after {
content: "";
position: absolute;
left: 8px;
right: 8px;
bottom: -4px;
height: 1px;
background: var(--lavka-divider);
pointer-events: none;
}
.p-set__field input:focus,
.p-set__field select:focus,
.p-set__field textarea:focus,
.p-item__category select:focus {
outline: 0;
border-bottom-color: var(--color-orange2);
}
.p-item .p-set__field textarea {
overflow: hidden;
resize: none;
}
.p-item__weight-row {
display: flex;
align-items: flex-end;
gap: 12px;
}
.p-item__weight-row input {
flex: 1 1 auto;
min-width: 0;
}
.p-item__weight-row select {
flex: 0 0 auto;
width: auto;
min-width: 56px;
min-height: 44px;
padding: 0 0 6px;
}
.p-item__photo-btn.is-invalid {
box-shadow: inset 0 0 0 1px #c62828;
color: #c62828;
}
.partner-orders__filters {
padding: 7px 5px;
}
.partner-orders__filter {
position: relative;
}
.partner-orders__filter::after {
content: '';
position: absolute;
top: 50%;
right: 0;
left: 0;
height: 44px;
transform: translateY(-50%);
}
.partner-menu__tabs {
padding: 6px 5px;
}
.partner-menu__tab {
position: relative;
}
.partner-menu__tab::after {
content: '';
position: absolute;
top: 50%;
right: 0;
left: 0;
height: 44px;
transform: translateY(-50%);
}
.partner-menu__add::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 44px;
height: 44px;
transform: translate(-50%, -50%);
}
.profile__name {
position: relative;
}
.profile__name::after {
content: '';
position: absolute;
top: 50%;
right: 0;
left: 0;
height: 44px;
transform: translateY(-50%);
}
.checkout-modal__head .checkout-modal__close::after {
top: 0;
transform: translate(-50%, 0);
}
.checkout-modal__head .checkout-modal__address {
position: relative;
}
.checkout-modal__head .checkout-modal__address::after {
content: '';
position: absolute;
top: -4px;
right: 0;
left: 0;
height: 44px;
}
.cookie-banner {
position: fixed;
right: 0;
bottom: calc(17px + env(safe-area-inset-bottom, 0px));
left: 0;
z-index: 50;
padding: 0 16px;
}
.cookie-banner--above-nav {
bottom: var(--cookie-bottom, 85px);
}
.cookie-banner__inner {
display: flex;
gap: 16px;
align-items: center;
max-width: 500px;
margin: 0 auto;
padding: 16px;
border-radius: 20px;
background: var(--color-white);
box-shadow: 0 2px 12px rgba(0, 0, 0, .12);
}
.cookie-banner__text {
flex: 1 1 auto;
margin: 0;
font-size: 13px;
line-height: 1.4;
color: var(--color-black);
}
.cookie-banner__accent {
color: var(--color-orange2);
}
.cookie-banner__link {
color: var(--color-orange2);
text-decoration: underline;
}
.cookie-banner__btn {
flex: 0 0 auto;
min-height: 44px;
padding: 0 20px;
border: 0;
border-radius: 22px;
background: var(--color-gray7);
font-family: inherit;
font-size: 14px;
font-weight: 600;
line-height: 1.2;
color: var(--color-black);
cursor: pointer;
}
@media (max-width: 480px) {
.cookie-banner__inner {
flex-wrap: wrap;
gap: 12px;
}
.cookie-banner__btn {
width: 100%;
}
}
.p-set__notify {
padding: 14px 0;
border-bottom: 1px solid var(--lavka-divider);
}
.p-set__notify .profile__notify-row,
.p-set__notify .profile__notify-note,
.p-set__notify .profile__notify-escape {
padding-right: 0;
padding-left: 0;
}
.p-set__notify .profile__notify-row {
min-height: var(--lavka-tap);
}
.p-set__notify .profile__notify-label .p-set__toggle-text {
font-size: 16px;
line-height: 22px;
color: var(--color-black2);
}
.body--cookie-pad {
padding-bottom: var(--cookie-pad, 0px);
}
.chat-list__title {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.chat-list__row {
min-height: 72px;
}
.profile-sheet__action + .profile-sheet__action {
margin-top: 8px;
}
.confirm__inner {
padding-bottom: 20px;
}
.basket-list__img--bottle {
background-image: url("assets/images/icons/bottle.svg");
background-repeat: no-repeat;
background-position: center;
background-size: auto 56px;
}
.lavka-pwa__title {
font-size: 18px;
}
.lavka-pwa-overlay .lavka-pwa__info-list {
margin-top: 10px;
justify-content: center;
}
.lavka-pwa-overlay .lavka-pwa__info-item {
display: flex;
flex-direction: column;
align-items: center;
}
.lavka-pwa-overlay .lavka-pwa__info-item[hidden] {
display: none;
}
.lavka-pwa-overlay .lavka-pwa__info-item-btn,
.lavka-pwa-overlay .lavka-pwa__info-item-text-item {
margin-top: 0;
}
.lavka-pwa-overlay .lavka-pwa__btn {
background: var(--color-gray7);
color: #434343;
}
.lavka-pwa-overlay .lavka-pwa__link {
color: #6E6E6E;
}
.lavka-pwa-overlay .lavka-pwa__inner {
width: 100%;
}
.lavka-pwa-overlay .lavka-pwa__info-item-btn {
min-height: 44px;
}
.lavka-photo-fit {
position: relative;
overflow: hidden;
background-image: none;
}
.lavka-photo-fit::before,
.lavka-photo-fit::after {
content: "";
position: absolute;
inset: 0;
z-index: 0;
background-image: var(--lavka-photo, none);
background-repeat: no-repeat;
background-position: center;
pointer-events: none;
}
.lavka-photo-fit::before {
background-size: cover;
filter: blur(var(--lavka-photo-blur, 12px));
transform: scale(1.25);
}
.lavka-photo-fit::after {
background-size: contain;
}
.p-set__avatar > *,
.p-set__banner > * {
position: relative;
z-index: 1;
}
.partner-catalog__image > * {
z-index: 1;
}
.p-set__avatar,
.p-item__preview,
.basket-list__img {
--lavka-photo-blur: 8px;
}
.partner-catalog__image,
.partner-menu__image,
.est-card__banner--photo {
--lavka-photo-blur: 14px;
}
.product-modal__photo,
.partner-shop__logo,
.chat-list__pic {
position: relative;
overflow: hidden;
}
.lavka-photo-blur {
position: absolute;
inset: 0;
z-index: 0;
width: 100%;
height: 100%;
object-fit: cover;
filter: blur(var(--lavka-photo-blur, 12px));
transform: scale(1.25);
pointer-events: none;
}
.product-modal__photo-img,
.partner-shop__logo img:not(.lavka-photo-blur),
.chat-list__pic-photo {
position: relative;
z-index: 1;
object-fit: contain;
}
.product-modal__photo {
--lavka-photo-blur: 18px;
}
.partner-shop__logo,
.chat-list__pic {
--lavka-photo-blur: 8px;
}
.chat-list__pic-photo {
display: block;
width: 100%;
height: 100%;
}
.partner-catalog__tabs {
overflow-x: auto;
scrollbar-width: none;
}
.partner-catalog__tabs::-webkit-scrollbar {
display: none;
}
.partner-catalog__tab {
flex: 0 0 auto;
white-space: nowrap;
}
.partner-catalog__tab,
.partner-menu__tab {
min-width: 0;
padding-left: 16px;
padding-right: 16px;
}
.page-head.page-head--float {
background-color: transparent;
border-radius: 0;
box-shadow: none;
pointer-events: none;
}
.page-head--float .page-head__inner {
min-height: 60px;
padding: 8px 16px;
column-gap: 8px;
}
.page-head--float .page-head__back,
.page-head--float .page-head__title {
pointer-events: auto;
background-color: var(--color-white);
box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .18);
}
.page-head--float .page-head__back {
border-radius: 50%;
}
.page-head--float .page-head__title {
justify-self: center;
max-width: 100%;
min-height: 44px;
padding: 9px 20px;
border-radius: 22px;
box-sizing: border-box;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.chat-list--client {
padding-bottom: calc(104px + env(safe-area-inset-bottom, 0px));
}
.chat-empty {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 8px;
min-height: calc(100vh - 220px);
min-height: calc(100dvh - 220px);
padding: 0 16px;
text-align: center;
}
.chat-empty__title {
margin: 0;
font-size: 22px;
line-height: 1.25;
font-weight: 600;
color: var(--color-black);
}
.chat-empty__text {
margin: 0;
font-size: 16px;
line-height: 1.4;
color: var(--color-gray4);
}
.chats-support {
position: fixed;
left: 50%;
bottom: calc(16px + env(safe-area-inset-bottom, 0px));
z-index: 40;
transform: translateX(-50%);
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
box-sizing: border-box;
min-width: 220px;
max-width: calc(100% - 32px);
min-height: 56px;
padding: 0 32px;
border-radius: 28px;
background-color: #FF7700;
color: var(--color-white);
font-size: 18px;
line-height: 1.2;
font-weight: 600;
text-decoration: none;
white-space: nowrap;
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, .18);
-webkit-tap-highlight-color: transparent;
}
.chats-support__icon {
flex: 0 0 auto;
display: block;
}
.chats-support__badge {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 22px;
height: 22px;
padding: 0 6px;
border-radius: 11px;
background-color: var(--color-white);
color: #FF7700;
font-size: 12px;
line-height: 1;
font-weight: 700;
}
.chats-support__badge[hidden] {
display: none;
}
.page-head--float .page-head__title {
font-size: 16px;
line-height: 22px;
}
.chats-support {
min-width: 0;
min-height: 48px;
padding: 0 24px;
border-radius: 24px;
gap: 6px;
font-size: 15px;
}
.chat-list--client {
padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px));
}
.page-head--float .page-head__action {
pointer-events: auto;
background-color: var(--color-white);
box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .18);
border-radius: 50%;
}
.page-head--float .page-head__action:disabled {
opacity: 1;
}
.page-head--float .page-head__action:disabled svg {
opacity: .35;
}
.lavka-toast.lavka-toast--light {
transform: translate(calc(-50% + 50vw + 100%), 0);
transition: opacity .3s ease, transform .3s ease;
}
.lavka-toast--light.lavka-toast--visible {
transform: translate(-50%, 0);
}
.page-head--float .page-head__title {
padding: 11px 20px;
}
a,
button,
summary,
[role="button"],
input[type="submit"],
input[type="button"] {
transition: opacity .2s ease;
}
a:not([aria-disabled="true"]):active,
button:not(:disabled):not([aria-disabled="true"]):active,
summary:active,
[role="button"]:not([aria-disabled="true"]):active,
input[type="submit"]:not(:disabled):active,
input[type="button"]:not(:disabled):active {
opacity: .7;
transition-duration: 0s;
}
@media (prefers-reduced-motion: reduce) {
a, button, summary, [role="button"], input[type="submit"], input[type="button"] {
transition: none;
}
}
.chat {
position: relative;
background-color: var(--color-white);
}
.chat > .page-head--float {
position: absolute;
top: 0;
left: 0;
right: 0;
}
.chat .chat__scroll {
padding-top: 72px;
}
.est-card__banner,
.p-set__banner {
aspect-ratio: 380 / 100;
}
.partner-menu__image,
.product-modal__photo {
aspect-ratio: 1 / 1;
}
.partner-catalog__image {
height: auto;
aspect-ratio: 1 / 1;
}
.basket-list__img--bottle {
background-image: url("assets/images/tara.webp");
background-size: auto 64px;
}
.p-item__photo .p-set__media-hint {
flex-basis: 100%;
text-align: left;
}
.orders-page .page-head {
position: static;
}
:root {
--lavka-desk-width: 500px;
}
.footer__inner,
.start-location__inner {
max-width: var(--lavka-desk-width);
}
@media (min-width: 560px) {
.header,
.main {
width: 100%;
max-width: var(--lavka-desk-width);
margin-left: auto;
margin-right: auto;
}
.cookie-banner,
.partner-connect__footer,
.partner-catalog__delivery-note,
.shop-catalog__info {
max-width: var(--lavka-desk-width);
margin-left: auto;
margin-right: auto;
}
.cart-fab,
.partner-catalog__total-btn {
right: calc(50% - var(--lavka-desk-width) / 2 + 16px);
}
body.partner-connect-page {
background: var(--color-black);
}
.address-modal__sheet,
.admin-order-modal__sheet,
.admin-partner-modal__sheet,
.auth-modal__sheet,
.checkout-modal__sheet,
.day-picker__sheet,
.order-detail__sheet,
.order-success-modal__sheet,
.partner-cancel-modal__sheet,
.partner-order-modal__sheet,
.product-modal__sheet,
.profile-sheet__panel,
.push-modal__sheet,
.shop-info-modal__sheet {
width: 100%;
max-width: var(--lavka-desk-width);
margin-left: auto;
margin-right: auto;
}
}
.auth-modal__tech-phone-text {
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 0 8px;
line-height: 1.3;
}
.auth-modal__tech-phone-action {
font-weight: 700;
}
[data-auth-call-phone] {
white-space: nowrap;
}
.auth-modal__tech-hint {
margin-top: 14px;
font-size: 14px;
line-height: 1.4;
color: var(--color-black2);
}
.auth-modal__tech-status {
margin-top: 10px;
font-size: 14px;
line-height: 1.4;
text-align: center;
color: var(--color-gray);
}
.auth-modal__submit[hidden] {
display: none;
}
.auth-modal__submit.auth-modal__submit--waiting:disabled {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
opacity: .7;
cursor: default;
}
.auth-modal__submit--waiting::after {
content: "";
flex: 0 0 auto;
width: 18px;
height: 18px;
border: 2px solid var(--lavka-spinner-track, rgba(255, 255, 255, .4));
border-top-color: var(--lavka-spinner-head, #fff);
border-radius: 50%;
animation: lavka-spin .7s linear infinite;
}
@media (prefers-reduced-motion: reduce) {
.auth-modal__submit--waiting::after { animation-duration: 2s; }
}
.auth-modal__submit.auth-modal__submit--waiting:disabled[hidden] {
display: none;
}
.auth-modal__success {
padding: 8px 0 4px;
text-align: center;
}
.auth-modal__success-icon {
width: 72px;
height: 72px;
margin: 0 auto 16px;
border-radius: 50%;
background-color: #00C217;
display: flex;
align-items: center;
justify-content: center;
}
.auth-modal__success-title {
font-size: 20px;
line-height: 1.3;
font-weight: 500;
color: var(--color-black2);
}
.auth-modal__success-text {
margin-top: 6px;
font-size: 14px;
line-height: 1.4;
color: var(--color-gray);
}
.auth-modal__submit.auth-modal__submit--ok {
background-color: var(--color-gray6);
color: var(--color-black2);
}
.profile__create-lavka {
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
box-sizing: border-box;
width: 100%;
min-height: 48px;
margin: 24px 0 8px;
padding: 0 24px;
border-radius: 24px;
background-color: var(--color-orange3);
color: var(--color-white);
font-size: 15px;
line-height: 1.3;
font-weight: 600;
text-decoration: none;
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, .18);
-webkit-tap-highlight-color: transparent;
}
.profile__create-lavka-icon {
flex: 0 0 auto;
display: block;
}
.partner-connect__done-check {
display: flex;
align-items: center;
justify-content: center;
width: 64px;
height: 64px;
margin: 0 auto 16px;
border-radius: 50%;
background-color: #00C217;
color: var(--color-white);
}
.partner-orders-page .partner-orders__body {
padding-bottom: calc(94px + env(safe-area-inset-bottom, 0px));
}
.partner-orders-page .partner-orders__more {
margin-bottom: calc(102px + env(safe-area-inset-bottom, 0px));
}
.admin-panel__actions .partner-orders__menu {
flex: 1 1 0;
min-width: 0;
width: auto;
max-width: 99px;
padding-right: 2px;
padding-left: 2px;
}
.admin-panel__body {
padding: 16px 8px calc(94px + env(safe-area-inset-bottom, 0px));
}
.admin-panel .admin-stat,
.admin-panel .admin-alert,
.admin-panel .admin-analytics {
box-shadow: 0 0 4px rgba(0, 0, 0, .25);
}
.footer__item--pick { position: relative; }
.footer--pick-open { z-index: 60; }
.lavka-pick {
position: absolute;
left: 50%;
bottom: calc(100% + 12px);
z-index: 40;
width: max-content;
min-width: 200px;
max-width: min(260px, calc(100vw - 32px));
padding: 6px;
border-radius: 16px;
background-color: var(--color-white);
box-shadow: 0 4px 16px 0 rgba(0, 0, 0, .18);
transform: translateX(-50%);
}
.lavka-pick[hidden] { display: none; }
.lavka-pick::after {
content: '';
position: absolute;
left: 50%;
top: 100%;
width: 12px;
height: 12px;
margin-top: -6px;
margin-left: -6px;
border-radius: 2px;
background-color: var(--color-white);
box-shadow: 3px 3px 6px 0 rgba(0, 0, 0, .10);
transform: rotate(45deg);
}
.lavka-pick__list {
display: flex;
flex-direction: column;
gap: 2px;
max-height: 278px;
margin: 0;
padding: 0;
overflow-y: auto;
list-style: none;
}
.lavka-pick__item { display: flex; }
.lavka-pick__link {
position: relative;
display: flex;
flex: 1 1 auto;
flex-direction: column;
justify-content: center;
gap: 2px;
min-height: 48px;
padding: 6px 40px 6px 12px;
border-radius: 12px;
color: var(--color-black);
text-decoration: none;
}
.lavka-pick__link:focus-visible { outline: 2px solid var(--color-orange2); outline-offset: -2px; }
.lavka-pick__name {
overflow: hidden;
font-size: 15px;
line-height: 21px;
font-weight: 500;
white-space: nowrap;
text-overflow: ellipsis;
}
.lavka-pick__state {
font-size: 13px;
line-height: 19px;
color: var(--color-gray);
}
.lavka-pick__badge {
position: absolute;
top: 50%;
right: 12px;
min-width: 18px;
height: 18px;
padding: 0 5px;
border-radius: 999px;
background: #b3261e;
color: var(--color-white);
font-size: 12px;
line-height: 18px;
font-weight: 500;
text-align: center;
box-sizing: border-box;
transform: translateY(-50%);
}
.partner-shop__meta-item--more {
width: 100%;
margin: 0;
padding: 0;
border: 0;
background: none;
font: inherit;
color: inherit;
text-align: left;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
}
.partner-shop__meta-item--more:focus-visible { outline: 2px solid var(--color-orange2); outline-offset: 2px; border-radius: 12px; }
.partner-shop__meta-item--more .partner-shop__meta-text { display: flex; align-items: center; gap: 8px; }
.partner-shop__meta-body { flex: 1 1 auto; min-width: 0; }
.partner-shop__meta-item--more .partner-shop__meta-value,
.partner-shop__meta-item--more .partner-shop__meta-label { display: block; }
.partner-shop__meta-chevron { flex: 0 0 auto; color: var(--color-gray4); }
.shop-hours {
margin: 4px 0 0;
padding: 0;
list-style: none;
}
.shop-hours__row {
display: flex;
align-items: baseline;
justify-content: space-between;
gap: 16px;
padding: 12px;
border-radius: 12px;
font-size: 15px;
line-height: 21px;
color: var(--color-black2);
}
.shop-hours__row--today { background-color: var(--color-orange); font-weight: 600; }
.shop-hours__today {
margin-left: 6px;
font-size: 13px;
line-height: 18px;
font-weight: 400;
color: var(--color-gray);
}
.shop-hours__time { flex: 0 0 auto; white-space: nowrap; font-variant-numeric: tabular-nums; }
.confirm--checkout-error .confirm__btns {
gap: 24px;
}
.home-water[hidden] { display: none; }
.home-water {
display: block;
margin: 0 0 16px;
}
.home-water__list {
display: flex;
gap: 12px;
margin: 0 -10px;
padding: 4px 10px 8px;
list-style: none;
overflow-x: auto;
overflow-y: hidden;
overscroll-behavior-x: contain;
-webkit-overflow-scrolling: touch;
scroll-snap-type: x mandatory;
scroll-padding: 0 10px;
scrollbar-width: none;
}
.home-water__list::-webkit-scrollbar { display: none; }
.home-water__item {
display: flex;
flex: 0 0 85%;
min-width: 0;
scroll-snap-align: start;
}
.home-water__list--single .home-water__item { flex-basis: 100%; }
.home-water__item > .est-card {
flex: 1 1 auto;
min-width: 0;
}
.order-list__item-note {
margin-top: 2px;
font-size: 14px;
line-height: 20px;
color: var(--color-gray);
}
.order-detail__status-note {
margin-top: 4px;
font-size: 14px;
line-height: 20px;
text-align: center;
color: var(--color-gray);
}
.order-detail__status-note[hidden] {
display: none;
}
.partner-order-modal__value--alert,
.admin-order-modal__alert {
color: #c62828;
}
.admin-order__alert {
display: block;
margin-top: 2px;
font-size: 14px;
line-height: 1.4;
color: #c62828;
}
.admin-acc__summary {
box-sizing: border-box;
margin: 0 0 16px;
padding: 16px 20px;
border-radius: 20px;
background: var(--color-white);
text-align: center;
}
.admin-acc__summary[hidden] {
display: none;
}
.admin-acc__due-label,
.admin-acc__due-note {
margin: 0;
font-size: 14px;
font-weight: 400;
line-height: 1.4;
color: var(--color-gray);
}
.admin-acc__due-value {
margin: 4px 0;
font-size: 28px;
font-weight: 700;
line-height: 1.2;
color: var(--color-black2);
}
.admin-acc__totals {
display: flex;
gap: 8px;
margin: 16px 0 0;
}
.admin-acc__total {
display: flex;
flex: 1 1 0;
flex-direction: column;
gap: 2px;
margin: 0;
padding: 10px 8px;
border-radius: 14px;
background: var(--color-gray7);
font-size: 14px;
font-weight: 400;
line-height: 1.4;
color: var(--color-gray);
}
.admin-acc__total b {
font-size: 18px;
font-weight: 600;
line-height: 1.3;
color: var(--color-black2);
}
.admin-acc__fees {
margin: 12px 0 0;
font-size: 13px;
font-weight: 400;
line-height: 1.4;
color: var(--color-gray);
}
.admin-acc__list {
display: flex;
flex-direction: column;
gap: 8px;
}
.admin-acc__period {
box-sizing: border-box;
padding: 6px 20px 14px;
border-radius: 20px;
background: var(--color-white);
font-size: 14px;
font-weight: 400;
line-height: 1.4;
color: var(--color-black);
}
.admin-acc__head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
width: 100%;
min-height: 44px;
margin: 0;
padding: 0;
border: 0;
background: none;
font-family: var(--font-roboto);
text-align: left;
color: var(--color-black2);
cursor: pointer;
}
.admin-acc__label {
font-size: 16px;
font-weight: 500;
line-height: 1.3;
}
.admin-acc__label::after {
content: "";
display: inline-block;
width: 6px;
height: 6px;
margin: 0 0 3px 8px;
border-right: 2px solid var(--color-gray);
border-bottom: 2px solid var(--color-gray);
transform: rotate(45deg);
transition: transform .2s;
}
.admin-acc__head[aria-expanded="true"] .admin-acc__label::after {
margin-bottom: -1px;
transform: rotate(225deg);
}
.admin-acc__amount {
flex: 0 0 auto;
font-size: 18px;
font-weight: 700;
line-height: 1.3;
}
.admin-acc__counts,
.admin-acc__status,
.admin-acc__pending,
.admin-acc__extra {
margin: 0 0 6px;
color: var(--color-gray);
}
.admin-acc__status--paid {
font-weight: 500;
color: #2e7d32;
}
.admin-acc__extra {
color: #c62828;
}
.admin-acc__btn {
display: block;
width: 100%;
min-height: 44px;
margin: 8px 0 0;
padding: 10px 16px;
border: 0;
border-radius: 22px;
background: var(--color-black2);
font-family: var(--font-roboto);
font-size: 14px;
font-weight: 500;
line-height: 1.4;
color: var(--color-white);
cursor: pointer;
}
.admin-acc__btn--quiet {
border: 1px solid var(--lavka-divider);
background: var(--color-white);
color: var(--color-black);
}
.admin-acc__btn:disabled {
opacity: .6;
cursor: default;
}
.admin-acc__details {
margin: 10px 0 0;
padding: 8px 0 0;
border-top: 1px solid var(--lavka-divider);
}
.admin-acc__details[hidden] {
display: none;
}
.admin-acc__rows {
margin: 0;
padding: 0;
list-style: none;
}
.admin-acc__row {
display: flex;
align-items: baseline;
gap: 8px;
padding: 6px 0;
}
.admin-acc__row + .admin-acc__row {
border-top: 1px solid var(--color-gray6);
}
.admin-acc__row-no {
flex: 1 1 auto;
min-width: 0;
}
.admin-acc__row-qty {
flex: 0 0 auto;
color: var(--color-gray);
}
.admin-acc__row-sum {
flex: 0 0 64px;
font-weight: 500;
text-align: right;
}
.admin-acc__rows-empty {
margin: 0;
color: var(--color-gray);
}