/* =========================================
   ЗАГАЛЬНІ СТИЛІ СТОРІНКИ
========================================= */
body { 
    font-family: Arial, sans-serif; 
    background-color: #f5f0e8; 
    margin: 0; 
}

/* =========================================
   ШАПКА САЙТУ (HEADER)
========================================= */
.site-header {
    position: sticky; /* Липка позиція */
    top: 0; /* Приклеюємо до верху */
    z-index: 1000; /* Вона найвища, все ховається ПІД неї */
    background-color: #fffcf7; /* Обов'язково фон! */
    box-shadow: 0 4px 10px rgba(92, 61, 46, 0.08); /* Тінь */
}

/* З header-main прибираємо sticky і тіні, він просто форматує контент */
.header-main {
    display: flex;
    justify-content: space-between; 
    align-items: center;
    padding: 15px 40px;
    max-width: 1200px;
    margin: 0 auto;
}

.header-right-group {
    display: flex;
    align-items: center;
    gap: 40px; 
}

/* Логотип */
.logo-img {
    height: 70px; 
    object-fit: contain;
    mix-blend-mode: multiply; 
   
}

/* Овальний пошук */
.header-search form {
    display: flex;
    align-items: center;
    background: #f5f0e8;
    border-radius: 25px;
    padding: 5px 20px;
    width: 450px;
    border: 1px solid #e8c9a0;
}

.header-search input {
    border: none;
    background: transparent;
    padding: 10px;
    width: 100%;
    outline: none;
    font-size: 13px;
    color: #5c3d2e;
}

.header-search button {
    background: transparent;
    border: none;
    color: #8a6030;
    cursor: pointer;
    font-size: 18px;
}

/* Іконки справа */
.header-actions {
    display: flex;
    gap: 25px;
    align-items: center;
}

.action-icon {
    color: #5c3d2e;
    font-size: 26px;
    text-decoration: none;
    position: relative;
    transition: color 0.3s, transform 0.2s;
}

.action-icon:hover {
    color: #8a6030;
    transform: scale(1.1);
}


/* =========================================
   НИЖНІЙ БЛОК МЕНЮ ТА НАВІГАЦІЯ
========================================= */
.nav-wrapper {
    background: #5c3d2e;
    position: relative;
    z-index: 5;
}

.site-header.nav-hidden .nav-wrapper {
    grid-template-rows: 0fr;
    opacity: 0;
}

.header-nav-bar {
    display: flex;
    align-items: center;
    max-width: 1200px; /* Ширина така ж, як у контейнера сайту */
    margin: 0 auto;    /* Центруємо блок по горизонталі */
    padding: 0 15px;   /* Мінімальні відступи по боках */
    height: 50px;      /* Задаємо панелі фіксовану красиву висоту */
}

/* --- Основні посилання (Головна, Хіти продаж) --- */
.main-nav {
    display: flex;
    gap: 35px;
    margin-left: 50px; 
}

.main-nav a {
    color: #f5f0e8;
    text-decoration: none;
    font-size: 15px;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: color 0.3s;
}

.main-nav a:hover {
    color: #e8c9a0;
}

/* =========================================
   ВИПАДАЮЧЕ МЕНЮ "КАТАЛОГ ТОВАРІВ"
========================================= */
/* Контейнер для меню */
.catalog-menu {
    position: relative; 
    height: 100%; /* Кнопка займає всю висоту панелі */
    display: flex;
    align-items: center;
}

/* Сама кнопка (виглядає ідентично до .main-nav a) */
.catalog-menu-title {
    color: #f5f0e8; 
    font-size: 16px; 
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    transition: color 0.3s;
}

.catalog-menu-title:hover {
    color: #e8c9a0; 
}

/* --- Випадаючий список --- */
.catalog-dropdown {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    top: 100%;
    left: 0;
    width: 250px; 
    background: #fffcf7;
    border: 1px solid #e8e0d5;
    border-top: none;
    box-shadow: 0 10px 20px rgba(92, 61, 46, 0.15);
    padding: 10px 0;
    margin: 0;
    list-style: none;
    z-index: 2000;
    transition: all 0.3s ease;
    transform: translateY(10px);
}

/* Поява меню при наведенні */
.catalog-menu:hover .catalog-dropdown {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}

/* Елементи списку */
.catalog-dropdown li {
    margin: 0;
}

.catalog-dropdown li a {
    display: block;
    padding: 12px 25px;
    color: #3d2b1f;
    text-decoration: none;
    font-size: 15px;
    transition: background 0.2s, color 0.2s, padding-left 0.2s;
    border-bottom: 1px solid #f5f0e8;
}

.catalog-dropdown li:last-child a {
    border-bottom: none; 
}

.catalog-dropdown li a:hover {
    background: #fdf8f2;
    color: #4bb3b3;
    padding-left: 30px; 
}
/* =========================================
   РОЗМІТКА КАТАЛОГУ (Сайдбар + Товари)
========================================= */
.container {
    max-width: 1200px; /* Збільшили ширину, щоб вліз сайдбар */
    margin: 24px auto;
    padding: 0 20px;
}

.catalog-layout {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}

.catalog-content {
    flex: 3; /* Займає 75% ширини */
}

/* Сайдбар фільтрів справа */
.catalog-sidebar {
    flex: 1; /* Займає 25% ширини */
    background: #fffcf7;
    border: 0.5px solid #d9cab5;
    padding: 20px;
    border-radius: 8px;
    position: sticky;
    top: 100px; /* Прилипає при скролі під шапкою */
}

.catalog-sidebar h3 { margin-top: 0; color: #3d2b1f; border-bottom: 1px solid #e8c9a0; padding-bottom: 10px;}
.filter-group { margin-bottom: 20px; font-size: 14px; color: #5c3d2e; }
.filter-group label { display: block; margin-bottom: 8px; cursor: pointer; }
.price-input { width: 40%; padding: 5px; border: 1px solid #c4a882; border-radius: 4px; }

/* =========================================
   КАРТКА ТОВАРУ (Стиль: 4 картки в ряд)
========================================= */
.products-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); /* 4 картки в ряд */
    gap: 20px; 
}

.product-card {
    background: #fff;
    border: 1px solid #e8e0d5;
    border-radius: 8px;
    padding: 15px;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.3s, transform 0.3s;
    position: relative;
    height: 100%; 
    box-sizing: border-box;
}

/* Легкий ефект "підйому" картки при наведенні */
.product-card:hover {
    box-shadow: 0 8px 20px rgba(92, 61, 46, 0.12);
    transform: translateY(-3px); 
}

.product-image-placeholder {
    height: 150px; /* Зменшили висоту для вужчої картки */
    background: #f5f0e8;
    border-radius: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #d9cab5;
    font-size: 35px; /* Іконка трохи менша */
    margin-bottom: 12px;
}
/* Стиль для реальної картинки товару */
.product-real-image {
    width: 100%;
    height: 150px;
    object-fit: cover; /* Запобігає сплющуванню/розтягуванню картинки */
    border-radius: 6px;
    margin-bottom: 12px;
    display: block;
}

.product-info {
    display: flex;
    flex-direction: column;
    flex-grow: 1; 
    align-items: flex-start; 
}

.status-ready { color: #5a7a4a; font-size: 11px; font-weight: bold; margin-bottom: 6px; }
.status-wait  { color: #8a6030; font-size: 11px; font-weight: bold; margin-bottom: 6px; }

.product-card h3 { 
    font-size: 15px; /* Трохи менший шрифт */
    font-weight: bold; 
    color: #2a1d15; 
    margin: 0 0 8px 0;
    line-height: 1.4;
}

.product-card p {
    font-size: 12px; /* Зменшили для акуратності */
    color: #666;
    margin: 0 0 12px 0;
    line-height: 1.4;
    flex-grow: 1; 
}

.product-price {
    font-size: 18px; /* Було 20px */
    font-weight: bold;
    color: #3d2b1f;
    margin-bottom: 12px;
    margin-top: auto; 
}

/* Блок кнопок внизу картки */
.product-actions {
    display: flex;
    gap: 8px; /* Зменшили відступ між кнопками */
    margin-top: auto;
}

.btn-buy {
    flex-grow: 1;
    background: #8a6030; 
    color: white;
    border: none;
    border-radius: 25px;
    padding: 10px; /* Зробили кнопку трохи тоншою */
    font-size: 14px; 
    font-weight: bold;
    cursor: pointer;
    transition: background 0.3s;
}

.btn-buy:hover { background: #5c3d2e; } 

.btn-fav {
    background: #f5f0e8;
    color: #8a6030;
    border: none;
    border-radius: 50%;
    width: 38px; /* Зменшили, щоб зберегти простір для кнопки "Купити" */
    height: 38px;
    font-size: 16px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: background 0.3s, color 0.3s, transform 0.2s;
    flex-shrink: 0; /* Забороняємо кнопці сплющуватися */
}

.btn-fav:hover { background: #e8c9a0; color: #5c3d2e; transform: scale(1.05); } 

.admin-delete {
    position: absolute;
    top: 10px;
    left: 10px;
    opacity: 0.2; 
    transition: opacity 0.3s;
}
.product-card:hover .admin-delete { opacity: 1; }
.admin-delete button { background: none; border: none; color: #ff4d4d; cursor: pointer; }
/* =========================================
   САЙДБАР З ФІЛЬТРАМИ
========================================= */
.catalog-sidebar {
    background: #fffcf7;
    border: 1px solid #e8e0d5;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 5px 20px rgba(92, 61, 46, 0.05); /* Легка тінь як у карток */
    box-sizing: border-box;
}

.filter-group {
    margin-bottom: 25px;
}

.filter-group h4 {
    margin: 0 0 12px 0;
    font-size: 15px;
    color: #2a1d15;
    font-weight: bold;
}

/* Стилізація чекбоксів */
.checkbox-label {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    font-size: 14px;
    color: #5c3d2e;
    cursor: pointer;
    transition: color 0.3s;
}

.checkbox-label:hover {
    color: #8a6030;
}

/* Фарбуємо стандартний чекбокс браузера у наш фірмовий колір */
.checkbox-label input[type="checkbox"] {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: #8a6030; 
}

/* Фільтр ціни в один рядок */
.price-filter-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.price-input {
    width: 100%;
    padding: 10px;
    border: 1px solid #d9cab5;
    border-radius: 6px;
    font-size: 14px;
    color: #3d2b1f;
    outline: none;
    transition: border-color 0.3s;
    box-sizing: border-box;
}

.price-input:focus {
    border-color: #8a6030;
}

/* Кнопка скидання (Outline стиль) */
.btn-reset {
    display: block;
    text-align: center;
    text-decoration: none;
    width: 100%;
    box-sizing: border-box;
    margin-top: 12px;
    padding: 10px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: bold;
    color: #8a3a2a; /* Темно-червоний */
    background: transparent;
    border: 1px solid #e8c0c0;
    transition: all 0.3s;
}

.btn-reset:hover {
    background: #fdf0f0;
    border-color: #8a3a2a;
}


/* =========================================
   МОДАЛЬНЕ ВІКНО (Popup) ТА ЙОГО ВМІСТ
========================================= */
/* Головна темна обгортка */
.modal {
    display: none; 
    position: fixed; 
    z-index: 2000; 
    left: 0; 
    top: 0; 
    width: 100%; 
    height: 100%; 
    background-color: rgba(42, 29, 21, 0.7); /* Зробили фон трохи темнішим і теплішим */
    justify-content: center;
    align-items: center;
}

/* Саме біле віконце */
.modal-content {
    background-color: #fffcf7;
    padding: 30px;
    border-radius: 12px; /* М'якіші кути */
    width: 400px;
    max-width: 90%;
    position: relative;
    box-shadow: 0 10px 30px rgba(42, 29, 21, 0.15); /* Тепла тінь */
}

/* Хрестик закриття */
.close-modal {
    position: absolute;
    top: 15px; 
    right: 20px;
    color: #d9cab5; /* Не такий яскравий хрестик */
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
    transition: color 0.3s;
}
.close-modal:hover { color: #8a6030; }

/* --- Внутрішність модалки --- */
.modal-product-summary {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #f5f0e8; /* Лінія стала дуже ніжною */
}

.modal-img-placeholder {
    width: 80px;
    height: 80px;
    background: #f5f0e8;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    color: #d9cab5;
}

.modal-product-info h3 {
    margin: 0 0 8px 0;
    color: #2a1d15;
    font-size: 16px;
    font-weight: bold;
}

.modal-price {
    font-size: 20px;
    font-weight: bold;
    color: #2a1d15; /* Забрали бірюзовий, поставили стильний темний */
}
/* =========================================
   СТОРІНКА КОШИКА
========================================= */
.cart-layout {
    display: flex;
    gap: 40px;
    align-items: flex-start;
}

.cart-items-list {
    flex: 2; /* Ліва колонка ширша */
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.cart-item {
    background: #fffcf7;
    border: 1px solid #e8e0d5;
    border-radius: 8px;
    padding: 15px;
    display: flex;
    align-items: center;
    gap: 20px;
    transition: box-shadow 0.3s;
}

.cart-item:hover { box-shadow: 0 4px 12px rgba(92, 61, 46, 0.08); }

.cart-item-img {
    width: 80px;
    height: 80px;
    background: #f5f0e8;
    border-radius: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    color: #d9cab5;
}

.cart-item-info { flex-grow: 1; }
.cart-item-info h3 { margin: 0 0 8px 0; font-size: 16px; color: #2a1d15; }
.cart-item-extra { margin: 3px 0; font-size: 13px; color: #8a6030; }

.cart-item-price {
    font-size: 18px;
    color: #3d2b1f;
    min-width: 80px;
    text-align: right;
}

.cart-item-remove {
    color: #c4a882;
    font-size: 18px;
    cursor: pointer;
    padding: 10px;
    transition: color 0.3s;
}
.cart-item-remove:hover { color: #ff4d4d; }

/* Форма замовлення справа */
.cart-summary-form {
    flex: 1;
    background: #fffcf7;
    border: 1px solid #e8e0d5;
    border-radius: 8px;
    padding: 30px;
    position: sticky;
    top: 100px;
}

.cart-summary-form h3 {
    margin-top: 0; margin-bottom: 20px; color: #3d2b1f;
    border-bottom: 1px solid #e8e0d5; padding-bottom: 10px;
}

.form-group { margin-bottom: 15px; }
.form-group label {
    display: block; margin-bottom: 5px; font-size: 13px; color: #5c3d2e; font-weight: bold;
}
.form-group input {
    width: 100%; box-sizing: border-box; padding: 10px;
    border: 1px solid #c4a882; border-radius: 5px;
    background: #fff; font-size: 14px; color: #3d2b1f;
}

.summary-total {
    display: flex; justify-content: space-between; align-items: center;
    margin: 25px 0; padding-top: 15px; border-top: 1px dashed #c4a882;
    font-size: 18px; font-weight: bold; color: #2a1d15;
}
.summary-total .total-price { font-size: 24px; color: #3a9c9c; }
/* =========================================
   ПІДВАЛ САЙТУ (FOOTER)
========================================= */
.site-footer {
    background-color: #3d2b1f; /* Дуже темний коричневий, що додає контрасту */
    color: #f5f0e8;
    margin-top: 50px; /* Відступ від основного контенту (каталогу) */
}

.footer-content {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Розбиваємо футер на 3 однакові колонки */
    gap: 40px;
    padding: 40px;
}

.footer-col h4 {
    color: #e8c9a0; /* Золотисто-коричневий акцент для заголовків */
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 18px;
    border-bottom: 1px solid #5c3d2e;
    padding-bottom: 10px;
}

.footer-col p {
    font-size: 14px;
    line-height: 1.6;
    color: #d9cab5;
}

.footer-col ul {
    list-style: none; /* Прибираємо стандартні кружечки списку */
    padding: 0;
    margin: 0;
}

.footer-col ul li {
    margin-bottom: 12px;
}

.footer-col ul a {
    color: #d9cab5;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s;
}

.footer-col ul a:hover {
    color: #fffcf7;
}

.footer-col .fas, .footer-col .fab {
    margin-right: 10px;
    color: #e8c9a0;
}

.social-icons {
    margin-top: 20px;
}

.social-icons a {
    display: inline-block;
    font-size: 22px;
    margin-right: 15px;
    color: #e8c9a0;
    transition: transform 0.3s, color 0.3s;
}

.social-icons a:hover {
    color: #fffcf7;
    transform: scale(1.2); /* Іконки трохи збільшуватимуться при наведенні */
}

.footer-bottom {
    background-color: #2a1d15; /* Найтемніша смужка в самому низу */
    text-align: center;
    padding: 15px;
    font-size: 13px;
    color: #a69480;
}

/* =========================================
   СТОРІНКА ОДНОГО ТОВАРУ
========================================= */
.breadcrumbs { font-size: 13px; margin-bottom: 25px; color: #5c3d2e; }
.breadcrumbs a { color: #5c3d2e; text-decoration: none; transition: color 0.3s; }
.breadcrumbs a:hover { color: #8a6030; }

.product-page-layout { 
    display: flex; gap: 50px; 
    background: #fffcf7; padding: 40px; 
    border-radius: 8px; border: 1px solid #e8e0d5; 
}

.product-gallery { flex: 1; }
.main-image { 
    height: 450px; background: #f5f0e8; 
    border-radius: 8px; display: flex; 
    align-items: center; justify-content: center; 
    font-size: 60px; color: #d9cab5; 
}

.product-details-info { flex: 1; }
.product-details-info h1 { font-size: 28px; text-transform: uppercase; margin-top: 0; color: #2a1d15; }
.brand, .sku { font-size: 14px; color: #666; margin-bottom: 5px; }

.price-row { border-top: 1px solid #e8e0d5; border-bottom: 1px solid #e8e0d5; padding: 15px 0; margin: 20px 0; }
.price-big { font-size: 32px; font-weight: bold; color: #3a9c9c; /* Бірюзовий акцент */ }

.action-row { display: flex; gap: 20px; margin-bottom: 40px; }
.btn-buy-large { 
    flex: 1; background: transparent; 
    border: 2px solid #3d2b1f; color: #3d2b1f; 
    font-size: 16px; font-weight: bold; 
    border-radius: 30px; cursor: pointer; transition: 0.3s; 
}
.btn-buy-large:hover { background: #3d2b1f; color: #fffcf7; }

.btn-fav-large { 
    background: transparent; border: 1px solid #c4a882; 
    color: #8a6030; border-radius: 50%; 
    width: 50px; height: 50px; font-size: 20px; 
    cursor: pointer; display: flex; 
    justify-content: center; align-items: center; transition: 0.3s; 
}
.btn-fav-large:hover { border-color: #3d2b1f; color: #3d2b1f; }

.desc-block h3 { font-size: 15px; text-transform: uppercase; margin-bottom: 15px; color: #111; }
.desc-block p { font-size: 15px; line-height: 1.6; color: #444; }

/* =========================================
   ОСОБИСТИЙ КАБІНЕТ ТА ЗАМОВЛЕННЯ
========================================= */
.account-container {
    max-width: 1000px;
    margin: 40px auto;
}

.account-title {
    color: #2a1d15;
    margin-bottom: 30px;
}

.account-layout {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}

/* Сайдбар (Ліва частина) */
.account-sidebar {
    width: 280px;
    background: #fffcf7;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 5px 20px rgba(92, 61, 46, 0.05);
    flex-shrink: 0;
}

.account-sidebar h2 {
    margin-top: 0;
    color: #2a1d15;
    font-size: 20px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.account-menu {
    list-style: none;
    padding: 0;
    margin: 25px 0 0 0;
}

.account-menu li {
    margin-bottom: 15px;
}

.account-menu a {
    text-decoration: none;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: color 0.3s;
}

.account-menu a i { width: 20px; text-align: center; }
.menu-link-profile { color: #5c3d2e; }
.menu-link-profile:hover { color: #4bb3b3; }
.menu-link-orders { color: #5c3d2e; }
.menu-link-orders:hover { color: #3a9c9c; }
.menu-link-active { color: #3a9c9c; font-weight: bold; }
.menu-link-logout { color: #8a3a2a; border-top: 1px solid #e8e0d5; padding-top: 15px; margin-top: 15px; }
.menu-link-logout:hover { color: #e63946; }

/* Головний контент (Права частина) */
.account-content {
    flex-grow: 1;
    background: #fffcf7;
    padding: 30px;
    border-radius: 12px;
    box-shadow: 0 5px 20px rgba(92, 61, 46, 0.05);
}

.account-content-title {
    margin-top: 0;
    color: #2a1d15;
    font-size: 22px;
    border-bottom: 1px solid #e8e0d5;
    padding-bottom: 15px;
    margin-bottom: 25px;
}

/* Форми профілю */
.profile-form-group { margin-bottom: 15px; }
.profile-form-row { display: flex; gap: 20px; margin-bottom: 25px; }
.profile-form-col { flex: 1; }
.profile-form-col-2 { flex: 2; }

.form-label {
    display: block;
    font-size: 13px;
    color: #5c3d2e;
    font-weight: bold;
    margin-bottom: 5px;
}

.form-input {
    width: 100%;
    box-sizing: border-box;
    padding: 12px;
    border: 1px solid #d9cab5;
    border-radius: 6px;
    font-size: 14px;
    background: #fff;
    outline: none;
    transition: border-color 0.3s;
}
.form-input:focus { border-color: #8a6030; }
.form-input:disabled { background: #f5f0e8; color: #888; cursor: not-allowed; }

/* Повідомлення (Алерти) */
.alert { padding: 15px; border-radius: 8px; margin-bottom: 25px; text-align: center; font-weight: 500; }
.alert-success { background: #f0fdf4; color: #3a8a5a; }
.alert-error { background: #fdf0f0; color: #8a3a2a; }

/* Картки замовлень */
.empty-orders { text-align: center; padding: 40px 0; }
.order-card { border: 1px solid #e8e0d5; border-radius: 8px; margin-bottom: 20px; padding: 20px; background: #fff; }
.order-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px dashed #e8e0d5; padding-bottom: 12px; margin-bottom: 15px; }
.order-id-date { font-size: 16px; color: #2a1d15; font-weight: bold; }
.order-date { color: #a38d75; font-size: 13px; margin-left: 10px; font-weight: normal; }

.order-badge { padding: 5px 12px; border-radius: 20px; font-size: 13px; font-weight: bold; border: 1px solid #f5f0e8; }
.badge-new { background: #fdf8f2; color: #8a6030; }
.badge-done { background: #f0fdf4; color: #5a7a4a; }

.order-items-list { margin-bottom: 15px; }
.order-item { display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid #f9f6f0; }
.order-item-name { color: #5c3d2e; font-weight: 500; }
.order-item-qty { color: #a38d75; font-size: 13px; margin-left: 5px; }
.order-item-extras { font-size: 12px; color: #8a6030; margin-top: 3px; }
.order-item-price { font-weight: bold; color: #3d2b1f; }

.order-footer { display: flex; justify-content: space-between; align-items: flex-end; background: #faf7f2; padding: 15px; border-radius: 6px; }
.order-delivery { font-size: 13px; color: #666; }
.order-total-text { font-size: 18px; color: #2a1d15; }
.order-total-price { color: #3a9c9c; font-size: 22px; font-weight: bold; }