| Server IP : 104.171.130.249 / Your IP : 216.73.216.146 Web Server : nginx/1.25.5 System : Linux 0dac65491b7e 6.8.0-134-generic #134-Ubuntu SMP PREEMPT_DYNAMIC Fri Jun 26 18:43:11 UTC 2026 x86_64 User : root ( 0) PHP Version : 8.4.23 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : OFF | Perl : ON | Python : OFF | Sudo : OFF | Pkexec : OFF Directory : /var/www/html/wp-content/themes/matreshka/assets/css/ |
Upload File : |
:root {
--red-primary: #A92231;
--red-secondary: #E02842;
--red-light: #D30000;
--red-gradients: linear-gradient(90deg, #A92231 0%, #E02842 100%);
--bg-gray: #F4F4F4;
--bg-red: #FFC5CD;
--dark: #171717;
--dark-opacity: #17171780;
--warning: #FCD603;
--success: #528A4D;
--bg-footer: #2B2B2B;
--bg-footer-light: #353535;
}
header {
margin-top: 28px;
}
h2 {
margin: 0;
}
p {
margin: 0;
}
input {
border: none !important;
outline: none !important;
box-shadow: none !important;
border-color: transparent !important;
}
input:focus {
border: none !important;
outline: none !important;
box-shadow: none !important;
border-color: transparent !important;
}
input::placeholder {
color: #17171766 !important;
opacity: 1;
}
a {
text-decoration: none !important;
color: inherit !important;
}
.woocommerce-account .woocommerce-MyAccount-content {
float: none !important;
width: 100% !important;
}
/* colors */
.text-red-primary {
color: var(--red-primary);
}
.text-red-secondary {
color: var(--red-secondary);
}
.text-red-light {
color: var(--red-light);
}
.text-dark {
color: var(--dark);
}
.text-dark-opacity {
color: var(--dark-opacity);
}
.text-warning {
color: var(--warning);
}
.text-success {
color: var(--success);
}
.text-gray {
color: var(--bg-gray);
}
.text-red {
color: var(--bg-red);
}
.bg-red-primary {
background-color: var(--red-primary);
}
.bg-red-secondary {
background-color: var(--red-secondary);
}
.bg-red-light {
background-color: var(--red-light);
}
/* --- Woo quantity input: hide native spinners but keep numeric keyboard --- */
.quantity input.qty::-webkit-outer-spin-button,
.quantity input.qty::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
.quantity input.qty[type=number] {
-moz-appearance: textfield;
appearance: textfield;
}
.woocommerce .quantity .qty {
width: 32px !important;
}
.bg-dark {
background-color: var(--dark);
}
.bg-dark-opacity {
background-color: var(--dark-opacity);
}
.bg-warning {
background-color: var(--warning);
}
.bg-success {
background-color: var(--success);
}
.bg-gray {
background-color: var(--bg-gray);
}
.bg-red {
background-color: var(--bg-red);
}
.bg-footer {
background-color: var(--bg-footer);
}
.bg-footer-light {
background-color: var(--bg-footer-light);
}
.bg-red-gradient {
background: var(--red-gradients);
}
.border-red-primary {
border-color: var(--red-primary) !important;
}
.border-red-secondary {
border-color: var(--red-secondary);
}
.border-red-light {
border-color: var(--red-light);
}
.border-dark {
border-color: var(--dark);
}
.border-dark-opacity {
border-color: var(--dark-opacity);
}
.border-warning {
border-color: var(--warning);
}
.border-success {
border-color: var(--success);
}
.border-gray {
border-color: var(--bg-gray);
}
.border-red {
border-color: var(--bg-red);
}
.border-red-gradient {
border-color: var(--red-gradients);
}
.border-none {
border: none;
}
/* button */
.wc-proceed-to-checkout {
padding: 0 !important;
}
/* --- Woo quantity input: hide native spinners but keep numeric keyboard --- */
.quantity input.qty::-webkit-outer-spin-button,
.quantity input.qty::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
.quantity input.qty[type=number] {
-moz-appearance: textfield;
appearance: textfield;
}
.woocommerce .quantity .qty {
width: 32px !important;
}
.btn {
border-radius: 32px;
padding: 10px 22px;
font-size: 14px;
align-items: center;
border: none;
}
.btn:hover {
border: none;
transition: 0.5s ease all;
}
.btn-red-primary {
position: relative;
display: inline-block;
color: #fff !important;
overflow: hidden;
background: linear-gradient(90deg,rgba(169, 34, 49, 1) 0%, rgba(224, 40, 66, 1) 100%);
}
.btn-red-primary:hover {
color: #fff;
background: linear-gradient(90deg,rgba(242, 136, 104, 1) 0%, rgba(250, 62, 87, 1) 100%);
}
.btn-secondary {
color: var(--dark);
background-color: var(--bg-gray);
}
.btn-secondary:hover {
color: var(--dark);
background-color: var(--bg-red) !important;
}
.btn-white {
color: var(--dark);
background-color: #fff;
font-size: 12px;
height: 34px;
padding: 10px 13px;
}
.btn-white:hover {
color: var(--dark);
background-color: var(--bg-red);
}
.btn-red-secondary {
background-color: #FFC5CD;
color: var(--red-secondary);
}
.btn-red-secondary:hover {
background-color: #fff;
color: var(--red-secondary);
}
/* alert */
.alert {
display: flex;
border: none;
border-radius: 20px;
padding: 16px;
margin-top: 40px;
font-size: 14px;
}
.alert-secondary {
background-color: var(--bg-gray);
}
.product-card .btn-secondary.view-cart-btn {
width: 100% !important;
}
/* badge */
.badge {
position: absolute;
top: 0px;
right: 0px;
border-radius: 200px;
padding: 12px;
font-size: 28px;
}
.badge-warning {
background-color: var(--warning);
color: var(--dark);
}
/* sale badge - бейдж знижки */
.sale-badge {
display: inline-block;
background-color: var(--warning);
color: var(--dark);
font-weight: 700;
font-family: 'Montserrat', sans-serif;
border-radius: 8px;
text-align: center;
line-height: 1;
}
/* Бейдж на картці товару */
.sale-badge-card {
position: absolute;
bottom: 8px;
right: 8px;
padding: 6px 10px;
font-size: 14px;
z-index: 10;
}
/* Бейдж на сторінці товару - замість іконки like */
.sale-badge-single {
padding: 10px 16px;
font-size: 18px;
border-radius: 20px;
margin-right: 16px;
margin-top: 8px;
}
/* header */
.header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
}
.header-catalog {
display: flex;
flex: 1;
align-items: center;
gap: 16px;
border-radius: 32px;
padding: 0;
box-sizing: border-box;
box-shadow: inset 0 0 0 3px var(--red-secondary);
background-color: #fff;
}
.header-catalog input {
font-size: 14px;
color: #17171766;
}
.header-catalog img[alt="search icon"] {
cursor: pointer;
transition: opacity 0.2s;
}
.header-catalog img[alt="search icon"]:hover {
opacity: 0.7;
}
.header-catalog a {
min-width: 135px;
height: 48px;
display: flex;
align-items: center;
gap: 6px;
}
.bonuses {
display: flex;
align-items: center;
font-size: 14px;
}
.acounts-icons {
display: flex;
align-items: center;
}
.acounts-icons .cart-icon-wrapper {
position: relative;
display: inline-block;
}
.acounts-icons .cart-count-badge {
position: absolute;
top: -8px;
right: -8px;
background-color: var(--red-secondary);
color: white;
border-radius: 50%;
width: 20px;
height: 22px;
display: flex;
align-items: center;
justify-content: center;
font-size: 13px;
font-weight: 600;
line-height: 1;
}
.bonuses p.montserrat-medium {
color: #17171780;
font-size: 16px;
}
.bonuses p.montserrat-bold {
font-size: 24px;
}
.dot {
font-size: 8px;
color: #C3C3C3;
margin: 0 6px;
}
.bread-crumb {
margin-bottom: 19px;
font-size: 14px;
}
.bread-crumb-product {
color: #17171766;
}
/* container-sale */
.about-service-box {
padding: 40px;
background: var(--red-gradients);
border-radius: 12px;
color: #fff;
font-size: 20px;
text-align: center;
}
.block-activities {
display: flex;
gap: 35px;
}
.activities-item {
flex: 1;
align-items: center;
text-align: center;
justify-content: center;
border: 2px solid var(--bg-gray);
border-radius: 20px;
padding: 30px 10px;
}
.activities-item:hover {
border: 2px solid var(--bg-red);
box-shadow: 0 4px 20px rgba(224, 40, 66, .08);
}
.activities-item img {
margin-bottom: 10px;
width: 35px;
height: auto;
}
.activities-item p {
font-size: 15px;
}
.activities-item-title {
font-size: 20px !important;
margin-bottom: 10px;
min-height: 60px;
}
.container-sale {
display: flex;
background: var(--red-gradients);
width: 100%;
border-radius: 40px;
margin-top: 24px;
color: #fff;
gap: 16px;
padding: 13px;
justify-content: center;
align-items: center;
}
.container-sale h2 {
font-size: 20px!important;
align-items: center;
}
/* container-home-info */
.container-home-info {
display: flex;
gap: 23px;
margin-top: 24px;
justify-content: start;
align-items: center;
}
.home-info-item {
font-size: 14px;
display: grid;
justify-content: center;
align-items: center;
text-align: center;
}
.home-info-item a {
color: var(--dark);
text-decoration: none;
max-width: 100px;
}
.home-info-item p {
margin-top: 11px;
}
.home-info-cards {
display: flex;
gap: 10px;
}
.home-info-card {
background-color: var(--bg-gray);
border-radius: 15px;
padding: 12px 10px;
font-size: 12px;
}
.home-info-buttons {
margin-top: 8px;
display: flex;
align-items: center;
gap: 5px;
}
.home-info-buttons .btn-red-primary {
padding: 9px 13px;
max-height: 35px;
}
.home-info-buttons .btn-red-secondary {
height: auto;
padding: 7px 8px 8px 8px;
width: 35px;
height: 35px;
align-items: center;
}
.home-info-buttons .btn.btn-white {
padding: 8px 11px;
}
.home-info-buttons p {
font-size: 18px;
}
/* container-banner */
.container-banner {
margin-top: 32px;
gap: 16px;
}
.container-banner img {
border-radius: 24px;
max-height: 200px;
}
/* container-current-discounts */
.container-current-discounts {
margin-top: 48px;
}
.container-current-discounts h2 {
font-size: 24px!important;
}
.current-discounts-list {
margin-top: 20px;
}
.current-discounts-list .slick-track {
margin-left: 0;
margin-right: 0;
}
.current-discounts-list a {
text-decoration: none !important;
}
.current-discounts-list img {
height: auto;
width: 100%;
border-top-left-radius: 24px;
border-top-right-radius: 24px;
}
.discounts-title {
background-color: var(--bg-gray);
min-height: 60px;
color: var(--dark);
font-size: 12px;
padding: 12px 16px;
width: 100%;
border-bottom-left-radius: 24px;
border-bottom-right-radius: 24px;
}
/* container-interesting */
.container-interesting {
margin-top: 48px;
}
.container-interesting h2 {
font-size: 24px!important;
}
/* product-card */
.product-cards {
margin-top: 20px;
display: flex;
gap: 20px !important;
}
.product-page-titles .like-icon {
position: static;
}
.product-card {
padding: 0;
}
.product-card span {
color: var(--dark-opacity);
font-size: 14px;
}
.product-card p {
font-size: 14px;
margin-top: 10px;
max-width: 220px !important;
height: 42px !important;
}
.product-card .link-product > p {
display: -webkit-box;
line-height: 1.4;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-word;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
line-clamp: 2;
}
.product-card h3 {
font-size: 22px;
margin-right: 6px;
}
.product-card button {
max-height: 40px;
}
.product-card-bottom {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
width: 100%;
margin-top: 10px;
margin-bottom: 10px;
min-height: 32px;
}
.product-card-bottom .product-card-price {
flex: 1 1 auto;
min-width: 0;
flex-wrap: wrap;
align-items: baseline;
margin-top: 0;
margin-bottom: 0;
}
.product-card-bottom .like-icon {
flex: 0 0 26px;
width: 26px !important;
height: 26px !important;
max-width: none;
max-height: none;
object-fit: contain;
cursor: pointer;
}
.product-card-img {
display: flex;
width: 220px;
height: 220px;
border-radius: 12px;
align-items: center;
justify-content: center;
text-align: center;
background-color: var(--bg-gray);
position: relative;
background-size: contain;
}
.product-card-img img {
max-height: 200px;
width: auto;
}
.product-card-img .product-card-image {
max-width: 90%;
object-fit: contain;
}
.product-card-placeholder {
display: flex;
width: 100%;
height: 100%;
align-items: center;
justify-content: center;
border-radius: inherit;
background: linear-gradient(135deg, #fbfbfc 0%, #e8ebf1 100%);
}
.product-card-placeholder-fallback {
display: none;
}
.product-card-img.is-image-missing .product-card-placeholder-fallback {
display: flex;
}
.product-card-img .product-card-placeholder-logo {
width: 64px;
height: auto;
max-height: 72px;
opacity: 0.72;
}
.subcategory-more-card {
flex: 0 0 220px;
width: 220px;
min-height: 360px;
display: flex;
flex-direction: column;
text-decoration: none;
border-radius: 10px;
background: #f9f9f9;
padding: 50px 20px;
text-align: center;
justify-content: center;
}
.subcategory-more-card__image {
overflow: hidden;
}
.subcategory-more-card__image .product-card-placeholder {
border: 1px dashed rgba(23, 23, 23, 0.16);
filter: blur(2px);
}
.subcategory-more-card__placeholder .product-card-placeholder-logo {
width: 82px;
max-height: 92px;
opacity: 0.82;
}
.subcategory-more-card__content {
flex: 1 1 auto;
display: flex;
flex-direction: column;
gap: 14px;
justify-content: center;
padding-top: 12px;
}
.subcategory-more-card__title {
min-height: 58px;
color: #969696;
font-size: 14px;
line-height: 1.85;
overflow-wrap: anywhere;
}
.subcategory-more-card__button {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 40px;
width: 100%;
padding: 10px 14px;
border-radius: 10px;
background: #d300009c;
color: #ffffff !important;
font-size: 13px !important;
line-height: 1.2;
text-align: center;
margin-top: auto;
}
.subcategory-more-card__content:hover .subcategory-more-card__button {
background: var(--red-light);
}
.subcategory-more-card__content:hover {
transform: translateY(-1px);
}
.history-product-media {
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
background: #f6f7f9;
border-radius: 10px;
}
.history-product-image {
display: block;
width: 100%;
height: 100%;
object-fit: contain;
}
.history-product-placeholder {
border-radius: inherit;
}
.history-product-placeholder .product-card-placeholder-logo {
width: 45%;
height: auto;
max-height: 60%;
opacity: 0.72;
}
.history-product-placeholder-fallback {
display: none;
}
.history-product-media.is-image-missing .history-product-placeholder-fallback {
display: flex;
}
.like-icon.active {
width: 26px;
height: 26px;
}
.price-small {
font-size: 12px;
color: var(--dark) !important;
vertical-align: top;
line-height: 1;
margin-left: 1px;
white-space: nowrap;
}
.price-small.text-red-primary{
color: var(--red-primary) !important;
}
.text-success .price-small{
color: var(--success) !important;
}
.price-old {
font-size: 14px;
text-decoration: line-through;
vertical-align: middle;
}
.product-card-price {
display: flex;
margin-top: 10px;
margin-bottom: 10px;
}
.link-product {
text-decoration: none;
color: inherit;
}
/* new-products-grid */
.new-products-grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 20px;
margin-top: 20px;
}
@media (max-width: 1200px) {
.new-products-grid {
grid-template-columns: repeat(4, 1fr);
}
}
@media (max-width: 992px) {
.new-products-grid {
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 768px) {
.new-products-grid {
grid-template-columns: repeat(2, 1fr);
gap: 15px;
}
}
@media (max-width: 480px) {
.new-products-grid {
grid-template-columns: repeat(2, 1fr);
gap: 10px;
}
}
/* pagination */
.matreshka-pagination {
margin-top: 40px;
}
.matreshka-pagination .pagination {
display: flex;
gap: 8px;
margin: 0;
padding: 0;
list-style: none;
}
.matreshka-pagination .page-item {
margin: 0;
}
.matreshka-pagination .page-link {
display: flex;
align-items: center;
justify-content: center;
min-width: 40px;
height: 40px;
padding: 8px 12px;
border: none;
border-radius: 8px;
background-color: var(--bg-gray);
color: var(--dark);
font-weight: 600;
font-family: 'Montserrat', sans-serif;
text-decoration: none;
transition: all 0.3s ease;
}
.matreshka-pagination .page-link:hover {
background-color: var(--bg-red);
color: var(--dark);
}
.matreshka-pagination .page-item.active .page-link {
background-color: var(--red-primary);
color: white;
cursor: default;
}
.matreshka-pagination .page-item.disabled .page-link {
background-color: var(--bg-gray);
color: var(--dark-opacity);
cursor: not-allowed;
opacity: 0.6;
}
.matreshka-pagination .page-item.disabled .page-link:hover {
background-color: var(--bg-gray);
color: var(--dark-opacity);
}
/* product-page */
.product-page {
display: flex;
gap: 36px;
}
.product-row {
display: flex;
align-items: center;
justify-content: center;
width: 500px;
height: 500px;
flex: 0 0 500px;
max-width: 500px;
background-color: var(--bg-gray);
border-radius: 24px;
overflow: hidden;
}
.product-image-wrapper {
display: flex !important;
align-items: center;
justify-content: center;
width: 500px;
height: 500px;
max-width: 500px;
}
.product-image-wrapper img,
.product-image {
display: block;
width: 500px;
height: 500px;
max-width: 500px;
max-height: 500px;
object-fit: contain;
margin-right: auto !important;
margin-left: auto !important;
}
.product-page .product-image {
padding: 20px;
}
.product-page-slider:not(.slick-initialized) .product-page-slide:not(:first-child) {
display: none;
}
.product-page-slider.slick-initialized .slick-list,
.product-page-slider.slick-initialized .slick-track {
height: 500px;
min-height: 500px;
}
.product-page-title {
font-size: 40px;
color: var(--dark);
}
.product-page-text {
font-size: 16px;
color: var(--dark-opacity);
margin-top: 12px;
}
.product-page-price {
font-size: 44px;
color: var(--dark);
margin-top: 20px;
display: inline-block;
}
.product-page-price.text-red-primary{
color: var(--red-primary) !important;
}
.product-page-price + .price-old {
font-size: 24px;
margin-left: 16px;
vertical-align: middle;
}
.price-old .price-small {
color: var(--dark-opacity) !important;
text-decoration: line-through !important;
font-size: 10px !important;
}
.product-page-titles {
position: relative;
}
.product-page-titles .btn {
padding: 18px 73px 18px 73px;
height: auto;
font-size: 16px;
}
.product-page-description {
margin-top: 28px;
}
.product-page-description h6 {
font-size: 18px;
}
.product-page-description p {
font-size: 14px;
}
.product-page-description .btn-link {
font-size: 16px;
color: var(--red-light);
text-decoration: none;
padding: 0;
}
.nutritional-value h6 {
margin-top: 20px;
font-size: 16px;
color: #17171766;
}
.nutritional-value-colums {
display: flex;
gap: 8px;
margin-top: 13px;
justify-content: space-between;
width: 100%;
}
.nutritional-value-colums div {
padding: 9px;
background-color: var(--bg-gray);
font-size: 24px;
border-radius: 12px;
text-align: center;
width: 160px;
}
.nutritional-value-colums p {
font-size: 12px;
color: var(--dark-opacity);
}
.product-characteristics {
margin-top: 47px;
}
.characteristic-item {
display: flex;
font-size: 16px;
align-items: center;
}
.characteristic-item p {
white-space: nowrap;
margin-top: 3px;
font-size: 16px;
}
.characteristic-item > .hr {
flex-grow: 1;
margin: 11px 11px 0 11px;
border-bottom: 2px dashed #C5C5C5;
}
.characteristic-item .montserrat-semibold{
color: var(--dark-opacity) !important;
font-size: 16px;
}
.product-disclaimer {
font-size: 12px !important;
color: var(--dark-opacity) !important;
}
/* account-section */
.account-section {
border-radius: 24px;
background-color: var(--bg-gray);
padding: 16px;
position: relative;
}
.account-section button {
padding: 8px 20px !important;
margin-top: 20px;
font-size: 14px;
min-width: 111px;
height: 39px;
}
.account-section h3 {
font-size: 20px;
}
.account-section p {
font-size: 13px;
width: 80%;
}
.smile1-mobile {
position: absolute;
top: 10px;
right: 5px;
}
.smile2-mobile {
position: absolute;
bottom: 0px;
right: 44px;
}
/* slider */
.dots img {
margin: 0 3px;
width: 10px;
height: 10px;
}
.slick-dots li {
margin: 0 !important;
width: 11px !important;
height: 11px !important;
}
.slick-prev {
left: -10px !important;
z-index: 999 !important;
}
.slick-next {
right: -2px !important;
}
.slick-arrows img {
z-index: 999 !important;
padding: 3px;
border-radius: 40px;
background-color: #fff;
width: 30px;
height: 30px;
max-width: none !important;
}
.slick-next:before {
content: none !important;
}
.slick-prev:before {
content: none !important;
}
/* footer */
.footer {
background-color: var(--bg-footer);
padding-bottom: 40px;
margin-top: 50px;
}
.footer-menu {
background-color: var(--bg-footer);
padding: 20px 0px;
gap: 30px;
justify-content: space-between;
align-items: center;
}
.footer-items {
min-width: 600px;
}
.footer-logo {
display: grid;
margin-right: 10px;
font-size: #FFFFFF4D !important;
}
.footer-logo img {
margin-bottom: 8px;
}
.footer-item {
color: #fff;
display: grid;
margin-top: 20px;
}
.footer-logo .contact-link {
color: #FF4B5F !important;
font-size: 12px;
margin-top: 15px !important;
text-decoration: underline !important;
}
.footer-contact-btn {
display: inline-flex;
align-items: center;
gap: 10px;
background: #fff;
border-radius: 40px;
padding: 6px 20px 6px 6px;
margin-top: 16px;
transition: background 0.3s ease, transform 0.2s ease;
}
.footer-contact-btn:hover {
background: var(--bg-red);
transform: translateY(-2px);
}
.footer-contact-btn-icon {
width: 50px;
height: auto;
flex-shrink: 0;
}
.footer-contact-btn span {
color: var(--dark) !important;
font-size: 13px;
white-space: nowrap;
}
.footer-item a {
color: #FFFFFF80 !important;
text-decoration: none;
margin-top: 12px;
font-size: 14px;
}
.footer-item a:first-child {
font-size: 16px;
color: #fff !important;
font-weight: 700;
}
.footer-logo .tel-link {
font-size: 20px;
color: #FFFFFF4D !important;
margin-top: 8px !important;
text-decoration: none;
}
.footer-icons {
display: flex;
}
.footer-icons a {
padding: 28px 34px 20px 0
}
.footer-contact .working-hours {
color: #FFFFFF80;
font-size: 14px;
letter-spacing: 1%;
}
.footer-contact p {
color: #fff;
font-size: 14px;
margin-bottom: 12px !important;
}
.email-link {
color: #fff !important;
font-size: 14px;
text-decoration: underline !important;
}
.footer-bottom {
background-color: var(--bg-footer-light);
}
.footer-info {
padding: 32px 0;
font-size: 14px;
justify-content: center;
align-items: center;
}
.footer-info a {
color: #FFFFFF80;
font-weight: 400;
}
.footer-info p {
color: #FFFFFF80;
font-weight: 400;
}
.btn-group .btn-link {
color: var(--dark-opacity);
font-size: 16px;
text-decoration: none;
padding: 0;
border-radius: 0;
margin-top: 20px;
}
.btn-group .active {
border-bottom: 4px solid var(--red-light);
color: var(--red-light);
}
/* navigation */
.navigation {
justify-content: space-between;
align-items: center;
margin-top: 40px;
}
.navigation h2 {
font-size: 40px;
margin-right: 12px;
}
.navigation h3 {
font-size: 18px;
color: var(--dark-opacity);
align-content: end;
}
.navigation .btn-link {
font-size: 18px;
color: var(--dark-opacity);
text-decoration: none;
}
/* cart */
/* Приховуємо тільки стандартні повідомлення про оновлення кошика (типу "Cart updated") */
.woocommerce-cart .woocommerce-message[role="alert"]:not(.first-order-notice) {
display: none !important;
}
/* Красиві сповіщення тепер в cart-notices.css */
.free-delivery {
margin: 22px 0 24px 0;
}
.free-delivery .progress{
height: 4px;
margin: 10px 0;
}
.free-delivery .progress-bar {
background-color: var(--warning);
}
.cart-info-total {
justify-content: space-between;
align-items: center;
margin-top: 10px;
}
.cart-info-total .btn-red-primary {
width: 100%;
margin-top: 10px;
border-radius: 16px;
}
.cart-info-total .spb {
font-size: 16px;
margin-bottom: 10px;
}
.delivery-price {
display: flex;
justify-content: space-between;
align-items: center;
}
.info-total-price {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 28px;
margin: 0 6px;
gap: 12px;
flex-wrap: nowrap;
}
.info-total-price > p {
white-space: nowrap;
flex-shrink: 0;
margin: 0;
}
.info-total-price .price-small{
font-size: .55em;
vertical-align: super;
}
.cart-info-pay {
margin: 18px 6px 0px 6px;
border-bottom: 3px solid #E4E4E4;
padding-bottom: 20px;
}
.cart-info-pay .characteristic-item{
margin-bottom: 4px;
}
.cart-info-pay span.hr {
flex-grow: 1;
margin: 11px 11px 0 15px;
border-bottom: 2px dashed #C5C5C5;
}
.cart-info-pay span.text-success {
color: var(--success) !important;
}
.text-success {
color: var(--success) !important;
}
.cart-info-pay .sale-group p {
align-content: center;
color: var(--success) !important;
margin-top: 10px;
}
.sale-group-toggle {
display: inline-flex;
align-items: center;
padding: 0;
border: 0;
background: transparent;
cursor: pointer;
}
.sale-group-toggle img {
transition: transform .2s ease;
}
.sale-group.is-collapsed .sale-group-toggle img {
transform: rotate(-90deg);
}
.sale-group.is-collapsed + .sale-group-details {
display: none;
}
.cart {
margin-top: 8px;
display: flex;
gap: 40px;
}
.cart-products {
justify-content: space-between;
align-items: center;
max-width: 770px;
width: 100%;
}
.cart-product-img img {
max-width: 80px;
height: auto;
}
.cart-product-img {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
width: 103px;
height: 103px;
background-color: var(--bg-gray);
border-radius: 12px;
margin-right: 16px;
padding: 10px;
}
.cart-product-item {
width: 100%;
justify-content: space-between;
border-bottom: 3px solid #EEEEEE;
padding-bottom: 32px;
padding-top: 32px;
}
.cart-product-item:last-child {
border-bottom: none;
}
.cart-product-count .btn-group {
text-align: center;
align-items: center;
background-color: var(--bg-gray);
padding: 8px;
border-radius: 8px;
gap: 12px;
max-height: 32px;
width: max-content;
}
.quantity-cart-group.btn-group {
text-align: center;
align-items: center;
background-color: var(--bg-gray);
padding: 8px;
border-radius: 8px;
gap: 12px;
max-height: 40px;
width: max-content;
}
.quantity-cart-group .btn {
padding: 0 5px !important;
margin-top: 0;
}
.quantity-cart-group .qty-input {
display: none !important;
max-width: 45px;
text-align: center;
background-color: transparent !important;
border: none !important;
padding: 0 !important;
font-size: 14px;
font-weight: 500;
font-family: 'Montserrat Alternates', sans-serif;
}
.quantity-cart-group .qty-input::-webkit-outer-spin-button,
.quantity-cart-group .qty-input::-webkit-inner-spin-button {
-webkit-appearance: none;
appearance: none;
margin: 0;
}
.quantity-cart-group .qty-input[type="number"] {
-moz-appearance: textfield;
appearance: textfield;
}
.quantity-cart-group .qty-input.active {
display: block !important;
}
.quantity-cart-group .qty-display {
font-size: 14px;
white-space: nowrap;
cursor: pointer;
user-select: none;
}
.quantity-cart-group .qty-display:hover {
opacity: 0.7;
}
.quantity-cart-group .qty-display.hidden {
display: none;
}
.quantity input {
background-color: var(--bg-gray) !important;
}
.cart-product-count .btn {
padding: 0;
height: auto;
}
.cart-product-name p {
font-size: 18px;
}
.cart-product-name a {
text-decoration: none !important;
color: var(--dark) !important;
}
.cart-product-name span {
font-size: 16px;
color: var(--dark-opacity);
}
.cart-product-count span {
font-size: 24px;
}
.cart-product-count .price-old {
font-size: 20px;
}
.cart-product-name .price-small{
font-size: .55em;
color: var(--dark-opacity) !important;
}
.cart-info {
background-color: #F0F1F6;
border-radius: 24px;
padding: 16px;
margin-top: 40px;
max-width: 388px;
min-width: 370px;
}
.cart-info .btn-white {
padding: 16px;
margin-bottom: 10px;
min-height: 76px;
height: auto;
width: 100%;
display: inline-flex;
justify-content: space-between;
text-align: left;
border-radius: 16px;
}
.cart-info .btn-white div {
margin-right: auto;
width: 100%;
}
.cart-info .btn-white .montserrat-semibold {
font-size: 14px;
}
.cart-info .btn-white .montserrat-medium {
font-size: 12px;
color: var(--dark-opacity);
}
.cart-info input {
padding: 11px 14px;
background-color: var(--bg-gray);
border-radius: 8px;
border: none !important;
margin-top: 10px;
width: 100%;
}
.cart-info .btn-promo:hover {
background-color: #fff;
}
.btn-promo .form-control:focus {
background-color: var(--bg-gray);
}
.matreshka-coupon-form {
display: grid;
gap: 10px;
}
.matreshka-coupon-submit {
width: 100%;
min-height: 40px;
padding: 10px 14px;
border: 0;
border-radius: 10px;
font-size: 13px;
}
.matreshka-coupon-submit[hidden] {
display: none !important;
}
.product-page {
max-width: 1200px !important;
margin-right: auto !important;
margin-left: auto !important;
}
.btn-group.web {
display: inline-flex !important;
}
.woocommerce-Price-amount.amount {
font-size: 15px !important;
}
.woocommerce-Price-amount.amount span{
font-size: 15px !important;
}
.price-old .woocommerce-Price-amount.amount span{
text-decoration: none !important;
display: none !important;
}
/* section-profile-info */
.container-offers {
display: flex;
gap: 16px;
margin-top: 28px;
}
.offers-item {
border-radius: 16px;
background-color: #F6F7F9;
padding: 12px;
height: 112px;
width: 168px;
position: relative;
}
.offers-item-long {
width: 366px;
margin-right: 12px;
}
.offers-item-long span{
font-size: 12px;
}
.offers-item a{
text-decoration: none;
color: var(--dark);
}
.offers-item-red a{
color: white !important;
}
.offers-item-red {
background: var(--red-gradients);
}
.offers-item img {
position: absolute;
bottom: 0px;
right: -8px;
}
.long-bannerpart1 {
right: 5px !important;
bottom: 5px !important;
}
.user-list-item {
display: flex;
border-bottom: 1px solid #EDEDED;
text-decoration: none;
color: var(--dark);
padding: 5px 0;
min-height: 60px;
align-items: center;
}
.user-list-item span {
color: var(--dark-opacity);
font-size: 14px;
}
.container-user-list {
width: 730px;
margin-top: 20px;
}
.container-offers div{
gap: 12px;
}
.user-list-item:hover {
color: var(--red-secondary) !important;
transition: all 0.4s ease;
}
.profile-title {
font-weight: 600 !important;
}
.container-cart {
max-width: 760px !important;
}
/* notifications-profile */
.notifications-profile {
margin-top: 32px;
margin-bottom: 32px;
}
.notification-profile {
background-color: #F6F7F9;
padding: 16px;
border-radius: 16px;
margin-bottom: 16px;
}
.notification-profile span {
font-size: 12px;
}
.notification-profile h4 {
font-size: 19px;
}
/* notification bell badge */
.matreshka-notif-badge {
position: absolute;
top: -4px;
right: -6px;
min-width: 18px;
height: 18px;
padding: 0 5px;
border-radius: 9px;
background: var(--red-secondary, #E02842);
color: #fff;
font-size: 11px;
font-weight: 700;
line-height: 18px;
text-align: center;
pointer-events: none;
box-shadow: 0 0 0 2px #fff;
}
.history-title {
font-size: 24px !important;
}
.history-nav .btn-secondary {
border: none;
padding: 8px;
border-radius: 10px;
height: 40px;
width: 40px;
justify-content: space-between;
}
.history-nav {
align-items: center;
}
.history-nav .btn {
font-weight: 500 !important;
}
.btn-group .active {
background-color: white;
color: var(--dark);
font-weight: 600 !important;
}
.btn-group {
background-color: var(--bg-gray);
border-radius: 100px;
}
.btn-group .btn {
padding: 10px 50px;
border-radius: 100px !important;
margin: 4px;
border: none;
}
.btn-group .btn:hover{
color: var(--red-secondary);
background-color: var(--bg-gray);
}
.btn-group .btn.active:hover{
color: var(--red-secondary);
background-color: white;
}
.history-item {
display: flex;
border-radius: 16px;
background-color: #F6F7F9;
justify-content: space-between;
padding: 15px;
align-items: center;
margin-bottom: 12px;
}
.history-item--interactive {
cursor: pointer;
transition: box-shadow .2s ease, transform .2s ease;
}
.history-item--interactive:hover {
box-shadow: 0 8px 22px rgba(23, 23, 23, .08);
transform: translateY(-1px);
}
.history-item--interactive:focus-visible {
outline: 3px solid rgba(169, 34, 49, .45);
outline-offset: 3px;
}
.history-order-modal {
position: fixed;
inset: 0;
z-index: 100001;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
}
.history-order-modal__overlay {
position: absolute;
inset: 0;
background: rgba(23, 23, 23, .5);
backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(3px);
}
.history-order-modal__dialog {
position: relative;
z-index: 1;
width: min(100%, 580px);
max-height: min(90vh, 820px);
overflow: auto;
background: #fff;
border-radius: 20px;
box-shadow: 0 18px 50px rgba(0, 0, 0, .2);
opacity: 0;
transform: translateY(16px) scale(.98);
transition: opacity .2s ease, transform .2s ease;
}
.history-order-modal.is-open .history-order-modal__dialog {
opacity: 1;
transform: translateY(0) scale(1);
}
.history-order-modal__header {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 16px;
padding: 24px 24px 18px;
border-bottom: 1px dashed #d9dce3;
margin-top: 0px !important;
}
.history-order-modal__eyebrow {
margin: 0 0 5px;
color: #777b85;
font-size: 13px;
}
.history-order-modal__header h3 {
margin: 0;
font-size: 22px;
}
.history-order-modal__close {
display: grid;
place-items: center;
flex: 0 0 auto;
width: 36px;
height: 36px;
padding: 0;
color: #4c4f56;
background: #f4f5f7;
border: 0;
border-radius: 50%;
font-size: 28px;
line-height: 1;
}
.history-order-modal__close:hover { background: #eceef2; }
.history-order-modal__body { padding: 20px 24px 28px; }
.history-order-modal__meta {
display: flex;
flex-wrap: wrap;
gap: 10px 18px;
margin-bottom: 24px;
color: #5a5e66;
font-size: 14px;
}
.history-order-modal__meta span {
display: inline-flex;
align-items: center;
gap: 5px;
}
.history-order-modal .material-icons-outlined { font-size: 18px; }
.history-receipt-section { padding: 20px 0; border-top: 1px dashed #d9dce3; }
.history-receipt-section:first-of-type { padding-top: 0; border-top: 0; }
.history-receipt-section h4 { margin: 0 0 14px; font-size: 17px; }
.history-receipt-items { display: grid; gap: 14px; }
.history-receipt-item {
display: grid;
grid-template-columns: 54px minmax(0, 1fr) auto;
align-items: center;
gap: 12px;
}
.history-receipt-item .history-product-media {
width: 54px;
height: 54px;
background: #f6f7f9;
border-radius: 10px;
}
.history-receipt-item__info { min-width: 0; }
.history-receipt-item__info p { margin: 0 0 4px; font-size: 14px; }
.history-receipt-item__info span { color: #777b85; font-size: 13px; }
.history-receipt-item > strong { white-space: nowrap; font-size: 14px; }
.history-receipt-totals { display: grid; gap: 10px; font-size: 14px; }
.history-receipt-totals > div { display: flex; justify-content: space-between; gap: 20px; }
.history-receipt-totals__discount { color: #528a4d; }
.history-receipt-totals__coupon {
color: var(--red-primary, #A92231);
font-weight: 600;
}
.history-receipt-totals__coupon strong {
color: inherit;
text-transform: uppercase;
}
.history-receipt-totals__total {
margin-top: 4px;
padding-top: 14px;
border-top: 1px solid #e3e5e9;
font-size: 18px;
}
.history-receipt-details { display: grid; gap: 10px; color: #4c4f56; font-size: 14px; }
.history-receipt-details p { display: flex; align-items: flex-start; gap: 8px; margin: 0; }
.history-receipt-details a { color: inherit; }
body.history-order-modal-open { overflow: hidden; }
@media (max-width: 575px) {
.history-order-modal { align-items: flex-end; padding: 0; }
.history-order-modal__dialog { width: 100%; max-height: 92vh; border-radius: 20px 20px 0 0; }
.history-order-modal__header { padding: 20px 18px 16px; }
.history-order-modal__body { padding: 18px 18px 24px; }
.history-order-modal__header h3 { font-size: 19px; }
.history-receipt-item { grid-template-columns: 48px minmax(0, 1fr); }
.history-receipt-item .history-product-media { width: 48px; height: 48px; }
.history-receipt-item > strong { grid-column: 2; }
}
.container-history {
margin-top: 24px;
}
.history-item-title .montserrat-medium{
font-size: 14px;
}
.history-item-title .montserrat-semibold{
font-size: 18px;
}
.history-item-title span{
font-size: 14px;
}
.history-item-price p {
font-size: 18px;
}
.history-item-price span {
font-size: 14px;
}
.history-item-img {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 3px;
flex-shrink: 0;
}
.history-item-img .history-product-media {
width: 44px;
height: 44px;
background: #fff;
border-radius: 6px;
padding: 2px;
}
/* 3 images: third spans full width */
.history-item-img--3 .history-product-media:nth-child(3) {
grid-column: 1 / -1;
justify-self: center;
}
/* 2 images: each spans full width, stacked */
.history-item-img--2 {
grid-template-columns: 1fr;
justify-items: center;
}
/* 1 image: single centered */
.history-item-img--1 {
grid-template-columns: 1fr;
justify-items: center;
}
.btn-group.mobile {
display: none !important;
}
.btn-group.web {
display: inline-flex !important;
}
/* category */
.category-title {
font-size: 24px !important;
margin-left: 15px !important;
}
.container-subcategories {
display: flex;
flex-wrap: wrap;
margin-top: 15px;
}
.container-categories {
margin-top: 25px;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(115px, 1fr));
gap: 10px;
position: relative;
}
.container-products {
overflow: scroll !important;
display: flex;
flex-wrap: nowrap;
overflow-x: auto;
overflow-y: hidden;
-ms-overflow-style: none; /* IE, Edge */
scrollbar-width: none; /* Firefox */
}
.container-products::-webkit-scrollbar {
display: none;
}
.product-scroll-hint {
position: relative;
margin-top: 20px;
}
.product-scroll-hint .container-products {
margin-top: 0;
}
.product-scroll-hint::before,
.product-scroll-hint__button {
position: absolute;
top: 50%;
opacity: 0;
transition: opacity 0.2s ease;
}
.product-scroll-hint::before {
content: "";
right: 0;
z-index: 2;
width: 96px;
height: 100%;
background: linear-gradient(90deg, rgba(255, 255, 255, 0), #ffffff 82%);
transform: translateY(-50%);
pointer-events: none;
}
.product-scroll-hint__button {
right: -50px;
z-index: 3;
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
border-radius: 50%;
background: linear-gradient(135deg, var(--red-primary, #E02842), var(--red-secondary, #e02841ad));
box-shadow: 0 8px 28px rgba(255, 37, 62, 0.46);
color: #ffffff;
border: 0;
padding: 0;
transform: translate(0, -50%);
animation: productScrollHintFloat 1.35s ease-in-out infinite;
cursor: pointer;
pointer-events: none;
}
.product-scroll-hint__button .material-icons-outlined {
font-size: 25px;
}
.product-scroll-hint--active::before,
.product-scroll-hint--active .product-scroll-hint__button {
opacity: 1;
}
.product-scroll-hint--active .product-scroll-hint__button {
pointer-events: auto;
}
.product-scroll-hint__button:hover {
box-shadow: 0 10px 32px rgba(255, 37, 62, 0.56);
}
.product-scroll-hint__button:focus-visible {
outline: 3px solid rgba(224, 40, 66, 0.24);
outline-offset: 3px;
}
@keyframes productScrollHintFloat {
0%,
100% {
transform: translate(0, -50%);
}
50% {
transform: translate(8px, -50%);
}
}
@media (prefers-reduced-motion: reduce) {
.product-scroll-hint__button {
animation: none;
}
}
@media (max-width: 768px) {
.product-scroll-hint::before {
width: 76px;
}
.product-scroll-hint__button {
display: none !important;
}
.product-scroll-hint__button .material-icons-outlined {
font-size: 22px;
}
}
.container-subcategories::-webkit-scrollbar {
display: none; /* Chrome, Safari */
}
.container-subcategories .btn {
margin-right: 8px;
}
.container-subcategories .btn.active {
background-color: var(--bg-footer);
color: #ffffff !important;
}
.container-subcategories .btn.active:hover {
background-color: var(--bg-footer);
color: var(--bg-red);
}
.subcategory-title-link {
display: inline-flex;
align-items: center;
gap: 8px;
color: inherit;
text-decoration: none;
font-size: 24px !important;
}
.subcategory-title-link:hover {
color: inherit;
text-decoration: none;
}
.subcategory-title-link img {
width: 20px;
height: 20px;
flex: 0 0 auto;
}
.img-blure {
position: absolute;
bottom: 40px;
right: 10px;
height: 400px;
}
/* shop */
.shop-title{
font-size: 28px !important;
margin-top: 32px;
}
.btn-category:hover {
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
background-color: #FFE16F;
}
.btn-category {
transition: all 0.3s ease;
display: flex;
align-items: flex-start;
width: 122px;
height: 122px;
border-radius: 14px;
background-color: #FFE16F;
text-align: left;
align-items: start;
padding: 8px;
font-size: 12px;
background-image: url('/assets/img/categories/steak.png');
background-repeat: no-repeat;
background-position: bottom -10px right;
background-size: 122px auto;
line-height: normal;
}
/* empty cart */
.empty-cart-content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 400px;
}
.empty-cart-content img {
max-width: 280px;
width: 100%;
height: auto;
margin-bottom: 32px;
}
.empty-cart-content h2 {
font-size: 28px;
color: var(--dark);
margin-bottom: 16px;
text-align: center;
}
.empty-cart-content p {
font-size: 16px;
color: var(--dark-opacity);
margin-bottom: 32px;
text-align: center;
max-width: 400px;
}
.empty-cart-content .btn {
padding: 14px 40px;
font-size: 16px;
}
/* checkout */
.cart-info-checkout .btn-white {
min-height: 92px;
}
.cart-info-checkout .btn-white:hover {
background-color: #fff;
}
.cart-info-checkout .img-product-checkout {
width: 50px;
}
.cart-info-checkout .price-small {
font-size: .55em;
}
.cart-product-checkout input {
background-color: #F0F1F6;
padding: 15px;
border-radius: 10px !important;
width: 100%;
}
.input-address {
border-top-left-radius: 0 !important;
border-bottom-left-radius: 0 !important;
padding-left: 0 !important;
}
.cart-product-checkout .input-address {
border-top-left-radius: 0 !important;
border-bottom-left-radius: 0 !important;
padding-left: 0 !important;
}
.cart-product-checkout span {
background-color: #F0F1F6 !important;
border: none !important;
border-top-left-radius: 10px !important;
border-bottom-left-radius: 10px !important;
}
.checkout-input span{
background-color: #fff !important;
border: none !important;
border-top-left-radius: 10px !important;
border-bottom-left-radius: 10px !important;
padding: 14px !important;
}
.checkout-input input {
background-color: #fff;
padding: 14px 14px 14px 0 !important;
border-radius: 10px !important;
width: 100%;
margin-right: 0px;
margin-top: 0px !important;
border-top-left-radius: 0 !important;
border-bottom-left-radius: 0 !important;
height: 100%;
text-transform: none !important;
}
.btn-with-checkout {
min-height: 0 !important;
padding: 14px !important;
justify-content: start !important;
border-radius: 10px !important;
font-size: 16px;
}
.btn-with-checkout div {
margin-right: 0 !important;
width: auto !important;
}
.cart-product-checkout .form-label {
color: #17171766;
}
.cart-product-checkout {
display: flex;
margin-bottom: 20px;
}
.info-total-price button{
min-width: 160px;
flex-shrink: 1;
margin-bottom: 10px;
}
.form-check-input:checked {
background-color: #34C759 !important;
}
.form-switch .form-check-input {
width: 2.5em !important;
}
.input-group {
display: block !important;
}
.input-group input {
width: 100% !important;
}
.cart-product-checkout .address{
display: contents !important;
}
.checkout.woocommerce-checkout {
gap: 60px !important;
}
.checkout-input {
background-color: #fff;
border-radius: 10px !important;
width: 100%;
flex-wrap: nowrap !important;
display: flex !important;
}
.checkout-input.phone-invalid {
box-shadow: 0 0 0 2px #dc3545;
}
.checkout-input.phone-invalid #billing_phone {
border-color: #dc3545 !important;
}
.checkout-coupon-row__label {
color: var(--dark);
white-space: normal !important;
width: min-content;
}
.checkout-coupon-row__label span {
color: var(--red-primary, #A92231);
font-weight: 700;
text-transform: uppercase;
}
.checkout-coupon-row__remove {
display: inline-flex;
align-items: center;
min-height: 24px;
padding: 3px 9px;
border: 1px solid rgba(169, 34, 49, 0.24);
border-radius: 999px;
color: var(--red-primary, #A92231) !important;
background: #fff;
font-size: 11px;
line-height: 1;
text-decoration: none;
}
.checkout-coupon-row__remove:hover {
background: rgba(169, 34, 49, 0.08);
text-decoration: none;
}
.subcategory-filter {
width: max-content;
margin-top: 10px;
}
.cart-product-checkout textarea {
width: 100%;
border: none !important;
background-color: #F0F1F6 !important;
border-radius: 10px !important;
padding: 14px !important;
}
.about-service-excellence {
background-color: var(--bg-gray);
padding: 40px;
border-radius: 20px;
}
.shop-title-subcategory {
font-size: 24px;
}
textarea::placeholder {
color: #dedfe3 !important;
}
textarea:focus-visible {
border: none !important;
outline-color: #F0F1F6 !important;
}
.cart-product-checkout input:focus {
background-color: #F0F1F6 !important;
}
.mobile-menu-item.border-none {
border: none !important;
}
/* .price-small */
.woocommerce-Price-amount.amount span {
font-size: 11px !important;
}
.text-red-primary .price-small {
color: var(--red-primary) !important;
}
.bonus-redemption__toggle .price-small {
font-size: 9px;
color: var(--dark-opacity) !important;
}
.bonus-redemption__discount .price-small {
color: var(--success) !important;
}
.shipping-cost-row-price {
font-size: 15px !important;
}
.shipping-cost-row-price .price-small {
font-size: 9px !important;
}
.cashback-info-sub {
font-size: 17px !important;
}
.cashback-info-sub .price-small {
font-size: 11px !important;
color: var(--dark-opacity) !important;
}
.cashback-info-balance span {
font-size: 14px !important;
}
.cashback-info-balance .price-small {
font-size: 10px !important;
color: var(--dark-opacity) !important;
}
.header .price-small {
color: #17171780 !important;
}
#matreshka-floating-cart .price-small {
color: white !important;
}
.mty-item__price-old .price-small {
color: #888 !important;
text-decoration: line-through !important;
}
.mty-item__price-sale .price-small {
color: var(--red-primary) !important;
}
.history-receipt-totals__discount .price-small {
color: #528a4d !important;
}
@media (min-width: 1000px) {
.container {
max-width: 1200px;
}
}
@media (max-width: 999px) {
header {
margin-top: 0px;
}
.header-catalog {
gap: 0px;
flex: none;
}
.product-info .product-name {
font-size: 14px;
}
.search-products {
padding: 6px !important;
max-height: 500px !important;
}
.search-show-all {
margin-top: 3px;
font-size: 11px;
width: auto;
padding: 10px 20px;
margin-bottom: 10px !important;
}
.about-service-excellence {
padding: 25px;
}
.current-discounts-arrow {
display: unset !important;
margin-top: 3px;
margin-left: 2px;
}
.container-current-discounts h2 {
display: flex !important;
}
.btn-group.mobile {
display: inline-flex !important;
}
.btn-group.web {
display: none !important;
}
.cart-product-checkout input {
margin-right: 0px;
}
.btn-group .btn {
height: auto;
}
.btn-group {
margin-top: 20px;
}
.history-nav {
justify-content: space-between;
}
.history-nav .btn-secondary{
background-color: transparent;
}
.history-item-price {
width: 100%;
}
.like-icon {
width: 23px !important;
}
.nav-container-like .like-icon {
top: 130px;
}
.container-subcategories {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
align-items: stretch;
gap: 8px;
}
.container-subcategories .subcategory-filter {
margin-right: 0;
}
.subcategory-filter {
display: inline-flex;
align-items: center;
justify-content: center;
width: 100%;
max-width: none;
height: 100%;
min-width: 0;
box-sizing: border-box;
padding: 8px 12px;
font-size: 12px;
line-height: 1.25;
text-align: center;
white-space: normal;
overflow-wrap: anywhere;
}
.container h2 img {
display: none;
}
.offers-item-long {
margin-top: 12px;
width: 100%;
}
.offers-item {
width: 100%;
}
.view-cart-btn {
font-size: 11px;
}
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
width: 90% !important;
}
.container h2 {
font-size: 20px !important;
margin-left: 10px;
}
.container-sale h2 {
font-size: 12px !important;
max-width: 160px;
}
.container-sale {
justify-content: right;
background-image: url('/assets/img/bg-bag.png');
background-repeat: no-repeat;
background-position: left center;
background-size: contain;
}
.sale {
background: var(--red-gradients);
border-radius: 32px;
}
.sale .btn-white {
font-size: 10px;
}
.current-discounts-list .col-5 {
padding: 0 10px 0 10px;
}
.current-discounts-item {
min-width: 155px;
}
.discounts-title {
font-size: 10px;
}
.cart-info-checkout {
background-color: #F0F1F6 !important;
padding: 16px !important;
}
.btn-with-checkout {
background-color: #fff !important;
}
.product-card-img {
width: 170px;
height: 170px;
}
.subcategory-more-card {
flex-basis: 170px;
width: 170px;
min-height: 314px;
}
.subcategory-more-card__placeholder .product-card-placeholder-logo {
width: 64px;
max-height: 72px;
}
.subcategory-more-card__title {
min-height: 70px;
font-size: 13px;
}
.subcategory-more-card__button {
min-height: 40px;
padding: 9px 10px;
font-size: 12px !important;
}
.product-card p {
max-width: 170px !important;
}
.product-card-img .product-card-placeholder-logo {
width: 52px;
max-height: 60px;
}
.navigation h2 {
margin-left: 0px;
}
.navigation {
margin-top: 10px;
}
.btn-category {
width: 115px;
height: 115px;
background-size: 115px auto;
}
.container-categories {
gap: 8px;
margin: 0 auto;
justify-content: center;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
margin-top: 25px;
}
.container-user-list {
width: 100%;
}
.product-card img {
width: 150px;
height: auto;
}
.product-page {
padding-left: 12px;
padding-right: 12px;
}
.footer-info {
padding: 18px 0;
}
.footer-logo {
text-align: center;
}
.footer-logo img {
margin: 0 auto;
}
.footer-contact-btn-icon {
margin: 0 !important;
}
.footer-contact-btn {
width: max-content;
margin: 20px auto 0 auto!important;
}
.footer-contact a {
font-size: 10px;
}
.first {
order: 2 !important;
}
.second {
order: 1 !important;
}
.third {
order: 3 !important;
}
.footer-items {
min-width: unset;
}
.product-row {
background-color: #fff;
display: flex;
flex: 0 1 auto;
width: 100%;
height: 320px;
max-width: 100%;
min-height: 320px;
}
.product-image-wrapper {
width: 100%;
height: 320px;
min-height: 320px;
}
.product-image-wrapper img,
.product-image {
width: 100%;
height: 320px;
max-width: 250px;
max-height: 300px;
}
.product-page-slider.slick-initialized .slick-list,
.product-page-slider.slick-initialized .slick-track {
height: 320px;
min-height: 320px;
}
.product-page-title {
font-size: 18px;
}
.product-page-price {
margin-top: 18px;
}
.product-page-titles .btn {
width: 100%;
margin-top: 0px;
padding: 10px 40px;
}
.cart-product-name p {
font-size: 14px;
}
.product-page-description {
margin-top: 35px;
}
.quantity-cart-group .btn {
padding: 0 5px;
margin-top: 0;
width: 20px;
}
.quantity-cart-group.btn-group {
padding: 6px;
gap: 10px;
}
.quantity-cart-group .qty-display {
font-size: 12px;
}
.cart-product-count span {
font-size: 16px;
}
.cart-product-count .price-small {
font-size: .5em;
}
.title-category-shop {
text-align: center;
margin-left: 0 !important;
}
.shop-title-subcategory {
font-size: 20px !important;
margin-top: 30px;
}
.product-page-description h6 {
font-weight: 500;
font-style: normal;
}
.cont-subcategories {
justify-content: start !important;
}
.badge {
position: static;
font-size: 14px;
padding: 6px;
margin-bottom: 8px;
}
.about-service-title {
font-size: 20px;
}
.cart-info {
background-color: white;
padding: 0;
min-width: 0;
}
.cart {
gap: 20px;
}
.cart-info .btn-white {
background-color: var(--bg-gray)
}
/* Empty cart mobile styles */
.empty-cart-content {
padding: 40px 20px !important;
}
.empty-cart-content img {
max-width: 200px !important;
margin-bottom: 24px !important;
}
.empty-cart-content h2 {
font-size: 22px !important;
margin-bottom: 12px !important;
}
.empty-cart-content p {
font-size: 14px !important;
margin-bottom: 24px !important;
}
.empty-cart-content .btn {
padding: 12px 32px !important;
font-size: 14px !important;
}
.block-activities {
display: block;
}
.about-service-box {
padding: 25px;
font-size: 17px;
}
.activities-item {
margin-bottom: 15px;
padding: 25px;
}
.activities-item p {
font-size: 12px;
}
.activities-item-title {
font-size: 16px!important;
min-height: 0;
}
.container-home-info {
justify-content: center;
margin-top: 5px;
}
.home-info-buttons {
margin-top: 0;
}
.history-order-modal__dialog {
margin: 20px;
}
}
/* WooCommerce Cart Page - hide default table structure */
.woocommerce-cart table.shop_table,
.woocommerce-cart .cart-collaterals h2 {
display: none !important;
}
.woocommerce-cart .cart-collaterals {
width: 100%;
max-width: 388px;
float: none;
}
.woocommerce-cart .cart_totals {
width: 100%;
max-width: none;
float: none;
}
/* Cart quantity controls */
.cart-product-count .qty-input {
display: none;
}
.cart-product-count .btn {
padding: 0 !important;
background: transparent !important;
border: none !important;
height: auto !important;
}
.cart-product-count .btn:hover {
background: transparent !important;
}
.cart-product-count .btn-group p {
margin: 0;
padding: 0;
font-size: 14px;
}
/* WooCommerce price display */
.woocommerce-Price-amount {
display: inline;
white-space: nowrap;
}
/* Custom price formatting */
.price-small {
display: inline-block;
font-size: .55em;
line-height: 1;
vertical-align: super;
margin-left: .04em;
}
.product-page-price .price-small {
font-size: 14px;
}
.cart-product-price .price-small {
font-size: .55em;
}
/* A price amount is nested in the summary row. Limit the flexible dashed
* divider to .hr only, so price spans keep their own size and baseline. */
.cart-info-pay .woocommerce-Price-amount {
flex: 0 0 auto;
margin: 0;
border: 0;
font-size: inherit;
}
.cart-info-pay .price-small {
flex: 0 0 auto;
margin: 0 0 0 .04em;
border: 0;
font-size: 11px !important;
}
.product-page {
max-width: 1200px !important;
margin-right: auto !important;
margin-left: auto !important;
}
/* Category buttons with custom background */
.btn-category[style*="background-image"] {
color: #1A1A1A;
}
.btn-category[style*="background-image"]:hover {
transform: translateY(-2px);
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
/* Ensure text is readable on category buttons */
.btn-category {
position: relative;
overflow: hidden;
}
.btn-category::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: linear-gradient(135deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0) 50%);
pointer-events: none;
z-index: 0;
}
.btn-category > * {
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.container-categories {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.container-categories .btn-category {
width: 100%;
min-width: 0;
height: auto;
aspect-ratio: 1 / 1;
background-size: 100% auto;
}
}
/* Add to Cart button states */
.btn-secondary.loading {
opacity: 0.7;
cursor: wait;
}
.btn-secondary.error {
background-color: #dc3545 !important;
border-color: #dc3545 !important;
}
/* View Cart button - same styling as Add to Cart */
.view-cart-btn {
display: inline-block;
text-align: center;
vertical-align: middle;
cursor: pointer;
user-select: none;
text-decoration: none !important;
}
.view-cart-btn:hover {
opacity: 0.9;
text-decoration: none !important;
}
.category-loading {
top: 0;
left: 0;
width: 100%;
height: 465px;
background: rgba(255, 255, 255, 0.9);
display: flex;
justify-content: center;
align-items: center;
z-index: 9999;
}
.category-loading .spinner-border {
width: 3rem;
height: 3rem;
border-width: 0.3rem;
border-color: var(--red-primary);
border-right-color: transparent;
}
/* Search Modal Styles */
.search-modal {
scrollbar-width: thin;
scrollbar-color: #ccc #f5f5f5;
}
.search-modal a{
height: auto;
}
.search-modal::-webkit-scrollbar {
width: 8px;
}
.search-modal::-webkit-scrollbar-track {
background: #f5f5f5;
border-radius: 4px;
}
.search-modal::-webkit-scrollbar-thumb {
background: #ccc;
border-radius: 4px;
}
.search-modal::-webkit-scrollbar-thumb:hover {
background: #999;
}
.search-category-item:hover .category-icon {
transform: scale(1.05);
transition: transform 0.2s;
}
.search-category-item span{
padding: 8px 13px;
border-radius: 10px;
}
.search-category-item span:hover {
background-color: var(--bg-gray);
}
.search-products .product-info-wrapper{
padding: 5px 10px;
border-radius: 10px;
}
.search-products .product-info-wrapper:hover {
background-color: var(--bg-gray);
}
.search-product-item:hover .product-image {
transform: scale(1.05);
transition: transform 0.2s;
}
.search-loading,
.search-no-results {
padding: 40px 20px;
text-align: center;
}
.search-loading {
color: #666;
}
.search-no-results {
color: #999;
font-size: 16px;
}
/* Breadcrumb styles for search results */
.breadcrumb {
background: transparent;
padding: 0;
margin: 0;
font-size: 14px;
}
.breadcrumb-item + .breadcrumb-item::before {
content: "•";
padding: 0 8px;
color: #999;
}
.breadcrumb-item a {
color: #666;
text-decoration: none;
}
.breadcrumb-item a:hover {
color: var(--red-primary);
}
.breadcrumb-item.active {
color: #000;
}
/* --- Home: Gift Certificates Banner --- */
.home-gc-banner {
display: flex;
align-items: center;
gap: 40px;
background: linear-gradient(135deg, #FFF5F6 0%, #FFF 60%);
border: 1px solid #FDDDE1;
border-radius: 24px;
padding: 32px 40px;
margin-bottom: 40px;
overflow: hidden;
}
.home-gc-img {
flex-shrink: 0;
width: 230px;
}
.home-gc-img img {
width: 100%;
height: auto;
border-radius: 16px;
}
.home-gc-body {
flex: 1;
}
.home-gc-tag {
display: inline-block;
background: var(--bg-red);
color: var(--red-primary);
font-size: 12px;
padding: 4px 14px;
border-radius: 20px;
margin-bottom: 12px;
}
.home-gc-title {
font-size: 24px;
color: var(--dark);
margin-bottom: 10px;
line-height: 1.3;
}
.home-gc-text {
font-size: 14px;
color: var(--dark-opacity);
line-height: 1.6;
margin-bottom: 20px;
max-width: 420px;
}
.home-gc-btn {
display: inline-flex;
align-items: center;
padding: 12px 28px;
font-size: 14px;
}
@media (max-width: 767px) {
.home-gc-banner {
flex-direction: column;
padding: 24px 20px;
gap: 20px;
text-align: center;
}
.home-gc-img {
width: 180px;
}
.home-gc-title {
font-size: 20px;
}
.home-gc-text {
max-width: 100%;
}
.home-gc-btn {
width: 100%;
justify-content: center;
}
}
/* ── Substitution Modal ─────────────────────────────────────── */
.substitution-overlay {
display: none;
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.45);
z-index: 999;
transition: opacity 0.25s ease;
}
.substitution-overlay.open {
display: block;
}
.substitution-modal {
display: none;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(0.95);
width: 360px;
max-height: 90vh;
overflow-y: auto;
background: #fff;
border-radius: 24px;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
z-index: 1001;
opacity: 0;
transition: opacity 0.25s ease, transform 0.25s ease;
}
.substitution-modal.open {
display: block;
opacity: 1;
transform: translate(-50%, -50%) scale(1);
}
.substitution-modal__header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20px 20px 0;
}
.substitution-modal__header h3 {
font-size: 18px;
color: var(--dark);
margin: 0;
}
.substitution-modal__close {
background: none;
border: none;
font-size: 24px;
line-height: 1;
color: var(--dark-opacity);
cursor: pointer;
padding: 0 4px;
transition: color 0.2s;
}
.substitution-modal__close:hover {
color: var(--dark);
}
.substitution-modal__body {
padding: 16px 20px;
}
/* ── Radio group ── */
.substitution-radio-group {
display: flex;
flex-direction: column;
gap: 8px;
}
.substitution-radio-item {
display: flex;
align-items: center;
gap: 12px;
padding: 14px 16px;
background: var(--bg-gray);
border: 2px solid transparent;
border-radius: 16px;
cursor: pointer;
transition: border-color 0.2s, background 0.2s;
}
.substitution-radio-item:hover {
background: #ececec;
}
.substitution-radio-item.active {
border-color: var(--red-primary);
background: #fff;
}
.substitution-radio-item input[type="radio"] {
display: none;
}
.substitution-radio-item__text {
flex: 1;
display: flex;
flex-direction: column;
gap: 2px;
}
.substitution-radio-item__text .montserrat-semibold {
font-size: 13px;
color: var(--dark);
}
.substitution-radio-item__text .montserrat-regular {
font-size: 11px;
color: var(--dark-opacity);
line-height: 1.4;
}
.substitution-radio-item__circle {
width: 22px;
height: 22px;
min-width: 22px;
border-radius: 50%;
border: 2px solid #ccc;
position: relative;
transition: border-color 0.2s;
}
.substitution-radio-item.active .substitution-radio-item__circle {
border-color: var(--red-primary);
}
.substitution-radio-item.active .substitution-radio-item__circle::after {
content: '';
position: absolute;
inset: 3px;
border-radius: 50%;
background: var(--red-primary);
}
/* ── Comment textarea ── */
.substitution-comment {
margin-top: 16px;
}
.substitution-comment p {
font-size: 14px;
margin-bottom: 8px;
color: var(--dark);
}
.substitution-comment textarea {
width: 100%;
padding: 12px 14px;
background: var(--bg-gray);
border: 2px solid transparent;
border-radius: 12px;
font-size: 12px;
color: var(--dark);
resize: none;
transition: border-color 0.2s;
font-family: 'Montserrat Alternates', sans-serif;
box-sizing: border-box;
}
.substitution-comment textarea::placeholder {
color: var(--dark-opacity);
}
.substitution-comment textarea:focus {
outline: none;
border-color: var(--red-primary);
}
/* ── Bag options (checkbox pills) ── */
.substitution-bag-options {
display: flex;
gap: 8px;
margin-top: 16px;
}
.substitution-bag-item {
flex: 1;
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
padding: 12px 14px;
background: var(--bg-gray);
border: 2px solid transparent;
border-radius: 16px;
cursor: pointer;
transition: border-color 0.2s, background 0.2s;
}
.substitution-bag-item:hover {
background: #ececec;
}
.substitution-bag-item.active {
border-color: var(--red-primary);
background: #fff;
}
.substitution-bag-item input[type="checkbox"] {
display: none;
}
.substitution-bag-item .montserrat-medium {
font-size: 12px;
color: var(--dark);
}
.substitution-bag-item__circle {
width: 20px;
height: 20px;
min-width: 20px;
border-radius: 50%;
border: 2px solid #ccc;
position: relative;
transition: border-color 0.2s;
}
.substitution-bag-item.active .substitution-bag-item__circle {
border-color: var(--red-primary);
}
.substitution-bag-item.active .substitution-bag-item__circle::after {
content: '';
position: absolute;
inset: 3px;
border-radius: 50%;
background: var(--red-primary);
}
/* ── Footer button ── */
.substitution-modal__footer {
padding: 0 20px 20px;
}
.substitution-modal__footer .btn-red-primary {
width: 100%;
padding: 14px;
font-size: 15px;
border: none;
border-radius: 16px;
color: #fff;
background: var(--red-gradients);
cursor: pointer;
transition: opacity 0.2s;
}
.substitution-modal__footer .btn-red-primary:hover {
opacity: 0.9;
}
/* ── Mobile adaptation ── */
@media (max-width: 480px) {
.substitution-modal {
width: calc(100% - 32px);
max-width: 360px;
}
}
/* ══════════════════════════════════════════════
* Payment Method Modal
* ══════════════════════════════════════════════ */
/* ── Overlay ──────────────────────────────── */
.payment-modal-overlay {
display: none;
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.45);
z-index: 999;
transition: opacity 0.25s ease;
}
.payment-modal-overlay.open {
display: block;
}
/* ── Modal box ────────────────────────────── */
.payment-modal {
display: none;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) scale(0.95);
width: 380px;
max-height: 90vh;
overflow-y: auto;
background: #fff;
border-radius: 24px;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
z-index: 1001;
opacity: 0;
transition: opacity 0.25s ease, transform 0.25s ease;
}
.payment-modal.open {
display: block;
opacity: 1;
transform: translate(-50%, -50%) scale(1);
}
/* ── Header ───────────────────────────────── */
.payment-modal__header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20px 20px 0;
}
.payment-modal__header h3 {
font-size: 18px;
color: var(--dark);
margin: 0;
}
.payment-modal__close {
background: none;
border: none;
font-size: 24px;
line-height: 1;
color: var(--dark-opacity);
cursor: pointer;
padding: 0 4px;
transition: color 0.2s;
}
.payment-modal__close:hover {
color: var(--dark);
}
/* ── Body ─────────────────────────────────── */
.payment-modal__body {
padding: 16px 20px;
}
/* ── Methods list ─────────────────────────── */
.payment-methods-list {
display: flex;
flex-direction: column;
gap: 8px;
}
/* ── Method Item ──────────────────────────── */
.payment-method-item {
display: flex;
align-items: center;
gap: 12px;
padding: 14px 16px;
background: var(--bg-gray, #F0F1F6);
border: 2px solid transparent;
border-radius: 16px;
cursor: pointer;
transition: border-color 0.2s, background 0.2s;
}
.payment-method-item:hover {
background: #ececec;
}
.payment-method-item.active {
border-color: var(--red-primary, #A92231);
background: #fff;
}
.payment-method-item input[type="radio"] {
display: none;
}
.payment-method-item__content {
flex: 1;
display: flex;
align-items: center;
gap: 12px;
}
.payment-method-icon {
font-size: 24px;
color: var(--dark-opacity, #777);
}
.payment-method-item.active .payment-method-icon {
color: var(--red-primary, #A92231);
}
.payment-method-item__text {
flex: 1;
display: flex;
flex-direction: column;
gap: 2px;
}
.payment-method-item__text .montserrat-semibold {
font-size: 13px;
color: var(--dark);
}
.payment-method-item__text .montserrat-regular {
font-size: 11px;
color: var(--dark-opacity);
line-height: 1.4;
}
/* ── Radio Circle ─────────────────────────── */
.payment-method-radio {
width: 22px;
height: 22px;
min-width: 22px;
border-radius: 50%;
border: 2px solid #ccc;
position: relative;
transition: border-color 0.2s;
}
.payment-method-item.active .payment-method-radio {
border-color: var(--red-primary, #A92231);
}
.payment-method-item.active .payment-method-radio::after {
content: '';
position: absolute;
inset: 3px;
border-radius: 50%;
background: var(--red-primary, #A92231);
}
/* ── Footer ───────────────────────────────── */
.payment-modal__footer {
padding: 0 20px 20px;
}
.payment-modal__footer .btn-red-primary {
width: 100%;
padding: 14px;
font-size: 15px;
border: none;
border-radius: 16px;
color: #fff;
background: var(--red-gradients);
cursor: pointer;
transition: opacity 0.2s;
}
.payment-modal__footer .btn-red-primary:hover {
opacity: 0.9;
}
/* ── Mobile ───────────────────────────────── */
@media (max-width: 480px) {
.payment-modal {
width: calc(100% - 32px);
max-width: 380px;
}
}
.info-total-price .woocommerce-Price-amount.amount {
font-size: inherit !important;
}
/* ════════════════════════════════════════════════
MATRESHKA THANKYOU PAGE
════════════════════════════════════════════════ */
.matreshka-thankyou {
max-width: 960px;
margin: 0 auto;
padding: 32px 16px 48px;
}
/* ── Hero ── */
.mty-hero {
text-align: center;
padding: 40px 20px 32px;
background: #fff;
border-radius: 16px;
border: 1px solid #f0f0f0;
margin-bottom: 24px;
}
.mty-hero__check {
margin-bottom: 16px;
}
.mty-hero__check .material-icons-outlined {
font-size: 64px;
color: #528A4D;
}
.mty-hero__check--neutral .material-icons-outlined {
color: #999;
}
.mty-hero h1 {
font-size: 28px;
color: var(--dark);
margin: 0 0 8px;
}
.mty-hero__sub {
font-size: 15px;
color: #666;
margin: 0 0 20px;
}
.mty-hero__meta {
display: flex;
justify-content: center;
gap: 24px;
flex-wrap: wrap;
}
.mty-hero__meta-item {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 14px;
color: #444;
background: var(--bg-gray);
padding: 8px 16px;
border-radius: 8px;
}
.mty-hero__meta-item .material-icons-outlined {
font-size: 18px;
color: var(--red-primary);
}
/* ── Error ── */
.mty-error {
text-align: center;
padding: 48px 20px;
background: #fff;
border-radius: 16px;
border: 1px solid #f0f0f0;
}
.mty-error__icon .material-icons-outlined {
font-size: 64px;
color: var(--red-primary);
}
.mty-error h2 {
margin: 16px 0 8px;
}
.mty-error p {
color: #666;
margin-bottom: 24px;
}
.mty-error__actions {
display: flex;
justify-content: center;
gap: 12px;
flex-wrap: wrap;
}
/* ── Section title ── */
.mty-section-title {
font-size: 20px;
color: var(--dark);
margin: 0 0 20px;
}
/* ── Steps ── */
.mty-steps {
background: #fff;
border-radius: 16px;
border: 1px solid #f0f0f0;
padding: 28px 24px;
margin-bottom: 24px;
}
.mty-steps__list {
position: relative;
}
.mty-step {
display: flex;
align-items: flex-start;
position: relative;
padding-bottom: 24px;
}
.mty-step--last {
padding-bottom: 0;
}
.mty-step__icon {
width: 44px;
height: 44px;
min-width: 44px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background: var(--bg-gray);
border: 2px solid #e0e0e0;
z-index: 1;
transition: all .3s;
}
.mty-step__icon .material-icons-outlined {
font-size: 22px;
color: #999;
}
.mty-step--active .mty-step__icon {
background: linear-gradient(135deg, #A92231, #E02842);
border-color: transparent;
}
.mty-step--active .mty-step__icon .material-icons-outlined {
color: #fff;
}
.mty-step__line {
position: absolute;
left: 21px;
top: 44px;
bottom: 0;
width: 2px;
background: #e0e0e0;
}
.mty-step--last .mty-step__line {
display: none;
}
.mty-step__content {
margin-left: 16px;
padding-top: 2px;
}
.mty-step__content p:first-child {
font-size: 15px;
color: var(--dark);
margin: 0 0 4px;
}
.mty-step__desc {
font-size: 13px;
color: #888;
margin: 0;
line-height: 1.5;
}
/* ── Details grid ── */
.mty-details {
background: #fff;
border-radius: 16px;
border: 1px solid #f0f0f0;
padding: 28px 24px;
margin-bottom: 24px;
}
.mty-details__grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 0;
}
.mty-details__col {
padding: 0 20px;
border-right: 1px solid #f0f0f0;
}
.mty-details__col:first-child {
padding-left: 0;
}
.mty-details__col:last-child {
padding-right: 0;
border-right: none;
}
.mty-details__col-title {
display: flex;
align-items: center;
gap: 8px;
font-size: 15px;
color: var(--dark);
margin: 0 0 16px;
padding-bottom: 12px;
border-bottom: 2px solid #f0f0f0;
}
.mty-details__col-title .material-icons-outlined {
font-size: 20px;
color: var(--red-primary);
}
/* ── Info cards ── */
.mty-info-card {
background: var(--bg-gray);
border-radius: 10px;
padding: 12px 14px;
margin-bottom: 12px;
}
.mty-info-card__badge {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 4px 10px;
border-radius: 6px;
font-size: 12px;
font-weight: 600;
margin-bottom: 10px;
}
.mty-info-card__badge .material-icons-outlined {
font-size: 16px;
}
.mty-info-card__badge--delivery {
background: #e8f5e9;
color: #2e7d32;
}
.mty-info-card__badge--pickup {
background: #e3f2fd;
color: #1565c0;
}
.mty-info-card__body p {
font-size: 13px;
color: #333;
line-height: 1.7;
display: flex;
align-items: center;
gap: 4px;
}
.mty-info-card__tag {
display: inline-flex;
align-items: center;
gap: 4px;
margin-top: 8px;
padding: 5px 10px;
border-radius: 6px;
font-size: 12px;
font-weight: 600;
}
.mty-info-card__tag--door {
background: #fce4ec;
color: #c62828;
}
/* ── Detail rows ── */
.mty-detail-row {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 0;
border-bottom: 1px solid #f7f7f7;
font-size: 13px;
}
.mty-detail-row:last-child {
border-bottom: none;
}
.mty-detail-row--col {
flex-direction: column;
align-items: flex-start;
gap: 6px;
}
.mty-detail-row--total {
padding-top: 12px;
border-top: 2px solid #f0f0f0;
border-bottom: none;
}
.mty-coupons {
display: grid;
gap: 8px;
padding: 12px 0;
border-top: 1px solid #f7f7f7;
font-size: 13px;
}
.mty-coupon-row {
display: flex;
justify-content: space-between;
align-items: center;
gap: 12px;
}
.mty-coupon-row__code,
.mty-coupon-row__discount {
color: var(--red-primary, #A92231);
}
.mty-coupon-row__code {
text-transform: uppercase;
}
.mty-detail-row a {
color: var(--red-primary);
text-decoration: none;
}
.mty-detail-row a:hover {
text-decoration: underline;
}
/* ── Tags ── */
.mty-tag {
display: inline-flex;
align-items: center;
gap: 4px;
padding: 4px 10px;
border-radius: 6px;
font-size: 12px;
}
.mty-tag--substitution {
background: #fff3e0;
color: #e65100;
}
.mty-tag--paid {
background: #e8f5e9;
color: #2e7d32;
}
.mty-tag--pending {
background: #fff8e1;
color: #f57f17;
}
/* ── Checks ── */
.mty-checks {
display: flex;
flex-direction: column;
gap: 4px;
}
.mty-check {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 13px;
color: #2e7d32;
}
.mty-check .material-icons-outlined {
color: #528A4D;
}
/* ── Note ── */
.mty-note {
display: flex;
align-items: flex-start;
gap: 8px;
background: #fffde7;
border-left: 3px solid #ffc107;
padding: 10px 12px;
border-radius: 0 8px 8px 0;
margin: 10px 0;
font-size: 13px;
color: #5d4037;
line-height: 1.5;
}
.mty-note .material-icons-outlined {
font-size: 18px;
color: #f57f17;
margin-top: 1px;
}
/* ── Total amount ── */
.mty-total-amount {
font-size: 22px;
color: var(--dark);
}
/* ── Icon small ── */
.mty-icon-sm {
font-size: 16px !important;
vertical-align: middle;
}
/* ── Text helpers ── */
.mty-text-muted {
color: #888;
}
.mty-empty {
font-style: italic;
font-size: 13px;
padding: 8px 0;
}
/* ── Items list ── */
.mty-items {
background: #fff;
border-radius: 16px;
border: 1px solid #f0f0f0;
padding: 28px 24px;
margin-bottom: 24px;
}
.mty-items__list {
display: flex;
flex-direction: column;
gap: 0;
}
.mty-item {
display: flex;
align-items: center;
gap: 14px;
padding: 12px 0;
border-bottom: 1px solid #f5f5f5;
}
.mty-item:last-child {
border-bottom: none;
}
.mty-item__thumb {
width: 56px;
height: 56px;
min-width: 56px;
border-radius: 10px;
overflow: hidden;
background: var(--bg-gray);
}
.mty-item__thumb img {
width: 100%;
height: 100%;
object-fit: cover;
}
.mty-item__info {
flex: 1;
min-width: 0;
}
.mty-item__name {
font-size: 14px;
color: var(--dark);
margin: 0 0 2px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.mty-item__price {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 2px;
font-size: 14px;
color: var(--dark);
white-space: nowrap;
}
.mty-item__price-old {
color: #888;
font-size: 13px;
}
.mty-item__price-sale {
color: var(--red-primary);
text-decoration: none;
}
/* Items summary */
.mty-items__summary {
border-top: 2px solid #f0f0f0;
margin-top: 12px;
padding-top: 12px;
}
.mty-summary-row {
display: flex;
justify-content: space-between;
padding: 6px 0;
font-size: 13px;
color: #555;
}
.mty-summary-row--coupon {
color: var(--red-primary, #A92231);
}
.mty-summary-row--coupon strong {
text-transform: uppercase;
}
/* ── Actions ── */
.mty-actions {
display: flex;
gap: 12px;
justify-content: center;
margin-bottom: 24px;
flex-wrap: wrap;
}
.mty-actions .btn {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 12px 28px;
border-radius: 12px;
font-size: 15px;
text-decoration: none;
}
.mty-actions .btn .material-icons-outlined {
font-size: 20px;
}
/* ── Contact block ── */
.mty-contact {
display: flex;
align-items: center;
gap: 16px;
background: var(--bg-gray);
border-radius: 16px;
padding: 24px 28px;
margin-bottom: 16px;
}
.mty-contact__icon {
width: 52px;
height: 52px;
min-width: 52px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, #A92231, #E02842);
}
.mty-contact__icon .material-icons-outlined {
font-size: 26px;
color: #fff;
}
.mty-contact__body {
flex: 1;
}
.mty-contact__body h3 {
font-size: 17px;
color: var(--dark);
margin: 0 0 4px;
}
.mty-contact__body p {
font-size: 13px;
color: #888;
margin: 0;
}
.mty-contact__btn {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 10px 22px;
border-radius: 10px;
font-size: 14px;
white-space: nowrap;
text-decoration: none;
}
/* ── Responsive ────────────────────────────── */
@media screen and (max-width: 768px) {
.mty-hero h1 {
font-size: 22px;
}
.mty-details__grid {
grid-template-columns: 1fr;
gap: 0;
}
.mty-details__col {
padding: 16px 0;
border-right: none;
border-bottom: 1px solid #f0f0f0;
}
.mty-details__col:last-child {
border-bottom: none;
}
.mty-details__col:first-child {
padding-top: 0;
}
.mty-contact {
flex-direction: row;
text-align: center;
}
.mty-actions .btn {
width: 100%;
justify-content: center;
}
.mty-item__name {
white-space: normal;
}
.matreshka-thankyou {
padding-bottom: 0px;
}
}
/* ── Hide default WooCommerce blocks on thankyou page ── */
.matreshka-thankyou .woocommerce-order-details,
.matreshka-thankyou .woocommerce-customer-details {
display: none !important;
}
/* ═══════════════════════════════════════════════════════
FLOATING CART BUTTON — MFC
═══════════════════════════════════════════════════════ */
.mfc {
position: fixed;
bottom: 24px;
right: 24px;
z-index: 9999;
display: flex !important;
align-items: center;
gap: 10px;
background: linear-gradient(135deg, var(--red-primary, #A92231), var(--red-secondary, #E02842));
color: #fff !important;
text-decoration: none !important;
padding: 12px 20px;
border-radius: 50px;
box-shadow: 0 6px 24px rgba(169, 34, 49, 0.35);
transition: transform 0.25s ease, box-shadow 0.25s ease, opacity 0.3s ease;
opacity: 0;
transform: translateY(20px);
pointer-events: none;
}
.mfc.mfc--visible {
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}
.mfc:hover {
transform: translateY(-2px);
box-shadow: 0 8px 30px rgba(169, 34, 49, 0.45);
color: #fff !important;
}
.mfc:active {
transform: translateY(0);
}
/* Icon + badge */
.mfc__icon {
position: relative;
display: flex;
align-items: center;
}
.mfc__icon .material-icons-outlined {
font-size: 24px;
}
.mfc__badge {
position: absolute;
top: -8px;
right: -10px;
background: #fff;
color: var(--red-primary, #A92231);
font-size: 11px;
min-width: 18px;
height: 18px;
border-radius: 9px;
display: flex;
align-items: center;
justify-content: center;
padding: 0 4px;
line-height: 1;
}
/* Text */
.mfc__text {
display: flex;
flex-direction: column;
line-height: 1.2;
margin-left: 10px;
}
.mfc__label {
font-size: 11px;
opacity: 0.85;
}
.mfc__total {
font-size: 15px;
white-space: nowrap;
}
/* Arrow */
.mfc__arrow {
font-size: 20px !important;
opacity: 0.7;
margin-left: 2px;
}
/* Hide when cart empty */
.mfc[data-empty="true"] {
display: none !important;
}
/* Pulse animation on update */
@keyframes mfcPulse {
0% { transform: scale(1); }
50% { transform: scale(1.08); }
100% { transform: scale(1); }
}
.mfc--pulse {
animation: mfcPulse 0.35s ease;
}
.characteristic-item .checkout-coupon-row__value {
display: inline-flex;
align-items: center;
gap: 8px;
color: #212529 !important;
}
/* ── Responsive ── */
@media screen and (max-width: 768px) {
.mfc {
bottom: 16px;
right: 16px;
left: 16px;
justify-content: center;
padding: 12px 16px;
border-radius: 16px;
width: max-content;
}
.mfc__arrow {
margin-left: auto;
}
}