/* =========================================
   КАРКАС САЙТА (ШАПКА И ПОДВАЛ)
   ========================================= */
.site-header { background: #ffffff; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03); border-bottom: 1px solid #f3ebe3; position: relative; z-index: 1000; }
.site-header .header-wrap { display: flex; justify-content: space-between; align-items: center; height: 85px; }
.site-header .logo-text { font-size: 32px; font-weight: 700; color: var(--dark-bg, #222); letter-spacing: 1px; font-family: 'Cormorant Garamond', serif; }
.site-header .main-nav { display: flex; gap: 35px; }
.site-header .main-nav a { text-decoration: none; color: #555; font-weight: 600; font-size: 14px; text-transform: uppercase; letter-spacing: 1px; position: relative; padding-bottom: 5px; transition: color 0.3s; }
.site-header .main-nav a:hover, .site-header .main-nav a.active { color: var(--primary-color, #d4a373); }
.site-header .main-nav a::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0%; height: 2px; background: var(--primary-color, #d4a373); transition: width 0.3s ease; }
.site-header .main-nav a:hover::after, .site-header .main-nav a.active::after { width: 100%; }

.header-actions { display: flex; align-items: center; gap: 15px; }
.action-icon { position: relative; cursor: pointer; color: #333; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: #fdfbf7; border: 1px solid #eae4de; transition: all 0.3s ease; }
.action-icon:hover { color: var(--primary-color, #d4a373); border-color: var(--primary-color, #d4a373); transform: translateY(-3px); box-shadow: 0 5px 10px rgba(212, 163, 115, 0.2); }
.action-icon svg { width: 20px; height: 20px; }
.action-icon .badge { position: absolute; top: -4px; right: -4px; background: #dc3545; color: white; font-size: 11px; font-weight: 700; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; border-radius: 50%; border: 2px solid #fff; }

@media (max-width: 768px) {
    .site-header { position: relative; padding: 15px 0; }
    .site-header .header-wrap { height: auto; flex-wrap: wrap; padding: 12px 15px; justify-content: space-between; flex-direction: column; align-items: center; gap: 15px; }
    .site-header .logo-text { font-size: 26px; }
    .header-actions { gap: 25px; width: 100%; display: flex; justify-content: center; }
    .action-icon { width: 38px; height: 38px; }
    .action-icon svg { width: 18px; height: 18px; }
    .site-header .main-nav { order: 3; width: 100%; justify-content: center; gap: 15px; margin-top: 15px; overflow-x: auto; white-space: nowrap; padding-bottom: 5px; flex-wrap: wrap; padding-top: 15px; border-top: 1px solid rgba(255,255,255,0.1); margin: 0; }
    .site-header .main-nav a { font-size: 13px; margin: 0; }
}

.site-footer { background: var(--dark-bg); color: #f5eadd; padding: 50px 0; margin-top: 8px; font-size: 0.9rem; font-weight: 500; border-top: 4px solid var(--primary-color); }

/* =========================================
   ВЫЕЗЖАЮЩАЯ ПАНЕЛЬ КОРЗИНЫ (DRAWER)
   ========================================= */
#cartDrawer { position: fixed; top: 0; right: -450px; width: 100%; max-width: 420px; height: 100dvh; background: #ffffff; z-index: 2001; transition: right 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); display: flex; flex-direction: column; box-shadow: -10px 0 30px rgba(61, 23, 2, 0.08); }
#cartDrawer.open { right: 0; }
.cart-drawer-header { padding: 25px; border-bottom: 1px solid #eae4de; display: flex; justify-content: space-between; align-items: center; flex-shrink: 0; }
#cartDrawerBody { padding: 20px 25px; flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; background: var(--bg-light); }
#cartDrawerFooter { padding: 25px; background: #fff; border-top: 1px solid #eae4de; box-shadow: 0 -5px 15px rgba(0,0,0,0.02); flex-shrink: 0; }
.cart-drawer-empty { text-align: center; color: var(--text-muted); margin-top: 50px; line-height: 1.6; }
.cart-drawer-empty .empty-icon { color: #d1cedc; width: 80px; height: 80px; margin: 0 auto 20px; }
.cart-drawer-empty a { color: var(--primary-color); font-weight: 600; text-decoration: none; }