/**
 * HOBOWEB: Стили WooCommerce в соответствии с шаблоном темы
 * Ширина контента: 1000px (как в .container)
 * Шапка и футер: на всю ширину
 */

 /* Подключаем стили иконок */
@import url('cart-account-icons.css');

/* ============================================
   1. ОСНОВНОЙ КОНТЕЙНЕР - 1000px КАК В ШАБЛОНЕ
   ============================================ */

/* Главный контейнер страницы */
body.woocommerce-page #page.site,
body.woocommerce #page.site {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
}

/* Контейнер контента - ОСНОВНОЙ ограничитель 1000px */
body.woocommerce-page #content.site-content,
body.woocommerce #content.site-content {
    max-width: 1000px !important; /* ← ОСНОВНОЕ: как в шаблоне */
    width: 100% !important;
    margin: 0 auto !important;
    padding: 20px 0 !important;
    box-sizing: border-box !important;
    float: none !important;
}

/* ============================================
   2. ШАПКА - НА ВСЮ ШИРИНУ (как в шаблоне)
   ============================================ */

/* Шапка сайта - на всю ширину */
body.woocommerce-page #masthead.site-header,
body.woocommerce #masthead.site-header {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background-color: #00353f !important; /* Ваш цвет из шаблона */
}

/* Контейнер внутри шапки - тоже 1000px */
body.woocommerce-page #masthead .container,
body.woocommerce #masthead .container {
    max-width: 1000px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
    box-sizing: border-box !important;
}

/* ============================================
   3. ИЗОБРАЖЕНИЕ ШАПКИ - КАК В ШАБЛОНЕ
   ============================================ */

/* Контейнер изображения шапки */
body.woocommerce-page .header-image,
body.woocommerce .header-image {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

/* Само изображение */
body.woocommerce-page .header-image img,
body.woocommerce .header-image img {
    max-width: 100% !important;
    width: 1000px !important; /* Фиксированная ширина как в шаблоне */
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
    padding-top: 20px;
}

/* ============================================
   4. ОСНОВНОЙ КОНТЕНТ WOOCOMMERCE - 1000px
   ============================================ */

/* Область основного контента */
body.woocommerce-page #primary.content-area,
body.woocommerce #primary.content-area {
    max-width: 1000px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    float: none !important;
}

/* Основной контент */
body.woocommerce-page #main.site-main,
body.woocommerce #main.site-main {
    max-width: 1000px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
    box-sizing: border-box !important;
    float: none !important;
}

/* ============================================
   5. ФУТЕР - НА ВСЮ ШИРИНУ (как в шаблоне)
   ============================================ */

/* Футер сайта - на всю ширину */
body.woocommerce-page #colophon.site-footer,
body.woocommerce #colophon.site-footer {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Контейнер внутри футера - 1000px */
body.woocommerce-page #colophon .container,
body.woocommerce #colophon .container {
    max-width: 1000px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
    box-sizing: border-box !important;
}

/* ============================================
   6. WOOCOMMERCE КОНТЕЙНЕРЫ ВНУТРИ 1000px
   ============================================ */

/* Все контейнеры WooCommerce */
.woocommerce .container,
.woocommerce-page .container {
    max-width: 1000px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
    box-sizing: border-box !important;
}

/* Сетка товаров */
.woocommerce ul.products {
    margin: 0 -10px !important;
    padding: 0 !important;
    max-width: 100% !important;
}

.woocommerce ul.products li.product {
    padding: 0 10px !important;
    box-sizing: border-box !important;
}

/* Страница товара */
.single-product .product {
    max-width: 1000px !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
}

/* Корзина */
.woocommerce-cart .woocommerce {
    max-width: 1000px !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
}

/* Оформление заказа (уже чем основной контент) */
.woocommerce-checkout .woocommerce {
    max-width: 800px !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
}

/* Личный кабинет */
.woocommerce-account .woocommerce {
    max-width: 1000px !important;
    margin: 0 auto !important;
    padding: 0 15px !important;
}

/* ============================================
   7. САЙДБАР - ПОЛНОЕ УДАЛЕНИЕ
   ============================================ */

/* Убираем сайдбар полностью */
body.woocommerce-page #secondary,
body.woocommerce #secondary,
.woocommerce-page .widget-area,
.woocommerce .widget-area,
.woocommerce-page aside,
.woocommerce aside {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
}

/* ============================================
   8. АДАПТИВНОСТЬ
   ============================================ */

/* Для экранов меньше 1000px */
@media (max-width: 1000px) {
    body.woocommerce-page #content.site-content,
    body.woocommerce #content.site-content,
    body.woocommerce-page #masthead .container,
    body.woocommerce #masthead .container,
    body.woocommerce-page #colophon .container,
    body.woocommerce #colophon .container,
    .woocommerce .container,
    .woocommerce-page .container,
    body.woocommerce-page #primary.content-area,
    body.woocommerce #primary.content-area,
    body.woocommerce-page #main.site-main,
    body.woocommerce #main.site-main {
        max-width: 95% !important;
        width: 95% !important;
        padding: 0 10px !important;
    }
    
    /* Изображение шапки адаптируется */
    body.woocommerce-page .header-image img,
    body.woocommerce .header-image img {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* Для мобильных */
@media (max-width: 768px) {
    body.woocommerce-page #content.site-content,
    body.woocommerce #content.site-content {
        padding: 10px 0 !important;
    }
    
    .woocommerce ul.products {
        margin: 0 -5px !important;
    }
    
    .woocommerce ul.products li.product {
        padding: 0 5px !important;
    }
}






/* ============================================
   ФОРМА СОРТИРОВКИ ТОВАРОВ (сортировка/количество на странице)
   ============================================ */

/* Основной контейнер формы сортировки */
.woocommerce-ordering {
    margin: 20px 0 30px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

/* Select (выпадающий список сортировки) */
.woocommerce-ordering select,
.woocommerce .woocommerce-ordering select {
    min-width: 200px !important;
    padding: 12px 40px 12px 15px !important;
    border: 2px solid #00353f !important; /* Ваш основной цвет */
    border-radius: 8px !important;
    background-color: white !important;
    font-size: 14px !important;
    color: #333 !important;
    cursor: pointer !important;
    appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%2300353f' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 15px center !important;
    background-size: 16px !important;
    transition: all 0.3s ease !important;
}

.woocommerce-ordering select:hover,
.woocommerce .woocommerce-ordering select:hover {
    border-color: #005566 !important;
    box-shadow: 0 0 0 3px rgba(0, 53, 63, 0.1) !important;
}

.woocommerce-ordering select:focus,
.woocommerce .woocommerce-ordering select:focus {
    outline: none !important;
    border-color: #00353f !important;
    box-shadow: 0 0 0 3px rgba(0, 53, 63, 0.2) !important;
}

/* ============================================
   ФОРМА ТОВАРА (количество + кнопка "В корзину")
   ============================================ */

/* Основной контейнер формы */
form.cart {
    margin: 30px 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 25px !important;
    background: #f8f9fa !important;
    border-radius: 12px !important;
    border: 1px solid #e9ecef !important;
}

/* Контейнер количества */
form.cart .quantity {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

/* Поле ввода количества */
form.cart .quantity .input-text.qty {
    width: 80px !important;
    min-width: 80px !important;
    padding: 14px 12px !important;
    border: 2px solid #00353f !important;
    border-radius: 8px !important;
    text-align: center !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #333 !important;
    background: white !important;
    transition: all 0.3s ease !important;
}

form.cart .quantity .input-text.qty:focus {
    outline: none !important;
    border-color: #005566 !important;
    box-shadow: 0 0 0 3px rgba(0, 53, 63, 0.1) !important;
}

/* Кнопка "В корзину" */
form.cart .single_add_to_cart_button {
    padding: 15px 15px 35px !important;
    background: linear-gradient(135deg, #00353f 0%, #005566 100%) !important;
    color: white !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(0, 53, 63, 0.2) !important;
    position: relative !important;
    overflow: hidden !important;
}

form.cart .single_add_to_cart_button:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 53, 63, 0.3) !important;
    background: linear-gradient(135deg, #005566 0%, #006677 100%) !important;
}

form.cart .single_add_to_cart_button:active {
    transform: translateY(0) !important;
}

/* Добавляем иконку корзины (опционально) */
form.cart .single_add_to_cart_button::before {
    content: "🛒" !important;
    margin-right: 10px !important;
    font-size: 18px !important;
}

/* Контейнер для дополнительных полей (Alternative) */
form.cart .altEmail_container {
    width: 100% !important;
    margin-top: 15px !important;
    padding-top: 15px !important;
    border-top: 1px dashed #dee2e6 !important;
}

form.cart .altEmail_container label {
    display: block !important;
    margin-bottom: 8px !important;
    font-weight: 500 !important;
    color: #495057 !important;
}

form.cart .altEmail_container input[type="text"] {
    width: 100% !important;
    max-width: 300px !important;
    padding: 12px 15px !important;
    border: 1px solid #ced4da !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    transition: all 0.3s ease !important;
}

form.cart .altEmail_container input[type="text"]:focus {
    outline: none !important;
    border-color: #00353f !important;
    box-shadow: 0 0 0 3px rgba(0, 53, 63, 0.1) !important;
}

/* ============================================
   АДАПТИВНОСТЬ ДЛЯ МОБИЛЬНЫХ
   ============================================ */

@media (max-width: 768px) {
    /* Форма сортировки */
    .woocommerce-ordering {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    
    .woocommerce-ordering select {
        width: 100% !important;
        min-width: unset !important;
    }
    
    /* Форма товара */
    form.cart {
        flex-direction: column !important;
        align-items: stretch !important;
        padding: 20px !important;
    }
    
    form.cart .quantity {
        justify-content: center !important;
        margin-bottom: 15px !important;
    }
    
    form.cart .single_add_to_cart_button {
        width: 100% !important;
        padding: 15px 20px !important;
    }
    
    form.cart .altEmail_container input[type="text"] {
        max-width: 100% !important;
    }
}

/* Для очень маленьких экранов */
@media (max-width: 480px) {
    form.cart .quantity .input-text.qty {
        width: 70px !important;
        min-width: 70px !important;
        padding: 12px 8px !important;
    }
}

/* Анимация кнопки при нажатии */
@keyframes addToCartAnimation {
    0% { transform: scale(1); }
    50% { transform: scale(0.95); }
    100% { transform: scale(1); }
}

form.cart .single_add_to_cart_button.adding {
    animation: addToCartAnimation 0.3s ease !important;
}




/* ============================================
   КНОПКА "ПЕРЕЙТИ К ОФОРМЛЕНИЮ ЗАКАЗА" В КОРЗИНЕ
   ============================================ */

/* Основные стили кнопки */
.wc-block-components-button__text,
.wc-block-cart__submit-button .wc-block-components-button__text,
.woocommerce .wc-block-cart .wc-block-components-button__text {
    display: inline-block !important;
    padding: 18px 45px !important;
    background: linear-gradient(135deg, #00353f 0%, #005566 100%) !important;
    color: white !important;
    text-decoration: none !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    cursor: pointer !important;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
    box-shadow: 0 6px 20px rgba(0, 53, 63, 0.25) !important;
    position: relative !important;
    overflow: hidden !important;
    z-index: 1 !important;
    text-align: center !important;
    min-width: 280px !important;
}

/* Эффект при наведении */
.wc-block-components-button__text:hover,
.wc-block-cart__submit-button .wc-block-components-button__text:hover,
.woocommerce .wc-block-cart .wc-block-components-button__text:hover {
    transform: translateY(-4px) scale(1.03) !important;
    box-shadow: 0 12px 30px rgba(0, 53, 63, 0.35) !important;
    background: linear-gradient(135deg, #005566 0%, #006677 100%) !important;
    color: white !important;
}

/* Эффект при нажатии */
.wc-block-components-button__text:active,
.wc-block-cart__submit-button .wc-block-components-button__text:active,
.woocommerce .wc-block-cart .wc-block-components-button__text:active {
    transform: translateY(-1px) scale(0.98) !important;
    box-shadow: 0 4px 15px rgba(0, 53, 63, 0.25) !important;
    transition: all 0.1s ease !important;
}

/* Блестящий эффект поверх кнопки */
.wc-block-components-button__text::before,
.wc-block-cart__submit-button .wc-block-components-button__text::before,
.woocommerce .wc-block-cart .wc-block-components-button__text::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: -100% !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.2),
        transparent
    ) !important;
    transition: left 0.7s ease !important;
    z-index: -1 !important;
}

/* Анимация блеска при наведении */
.wc-block-components-button__text:hover::before,
.wc-block-cart__submit-button .wc-block-components-button__text:hover::before,
.woocommerce .wc-block-cart .wc-block-components-button__text:hover::before {
    left: 100% !important;
}

/* Иконка стрелки (опционально) */
.wc-block-components-button__text::after,
.wc-block-cart__submit-button .wc-block-components-button__text::after,
.woocommerce .wc-block-cart .wc-block-components-button__text::after {
    content: '→' !important;
    margin-left: 12px !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    display: inline-block !important;
    transition: transform 0.3s ease !important;
}

/* Анимация стрелки при наведении */
.wc-block-components-button__text:hover::after,
.wc-block-cart__submit-button .wc-block-components-button__text:hover::after,
.woocommerce .wc-block-cart .wc-block-components-button__text:hover::after {
    transform: translateX(5px) !important;
}

/* Контейнер кнопки (чтобы центрировать) */
.wc-block-cart__submit-container,
.woocommerce .wc-block-cart .wc-block-cart__submit-container {
    text-align: center !important;
    margin: 40px 0 30px !important;
    padding: 20px !important;
}

/* Анимация пульсации (для привлечения внимания) */
@keyframes pulseAnimation {
    0% {
        box-shadow: 0 6px 20px rgba(0, 53, 63, 0.25);
    }
    50% {
        box-shadow: 0 6px 30px rgba(0, 53, 63, 0.4), 0 0 0 10px rgba(0, 53, 63, 0.05);
    }
    100% {
        box-shadow: 0 6px 20px rgba(0, 53, 63, 0.25);
    }
}

/* Применяем пульсацию к кнопке (можно удалить если не нужно) */
.wc-block-components-button__text {
    animation: pulseAnimation 3s infinite ease-in-out !important;
}

/* Анимация появления кнопки */
@keyframes slideUpFadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.wc-block-cart__submit-container {
    animation: slideUpFadeIn 0.6s ease-out 0.3s both !important;
}

/* ============================================
   АДАПТИВНОСТЬ ДЛЯ МОБИЛЬНЫХ
   ============================================ */

@media (max-width: 768px) {
    .wc-block-components-button__text,
    .wc-block-cart__submit-button .wc-block-components-button__text,
    .woocommerce .wc-block-cart .wc-block-components-button__text {
        padding: 16px 30px !important;
        font-size: 16px !important;
        min-width: 240px !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .wc-block-cart__submit-container,
    .woocommerce .wc-block-cart .wc-block-cart__submit-container {
        padding: 15px 0 !important;
        margin: 30px 0 20px !important;
    }
}

/* Для очень маленьких экранов */
@media (max-width: 480px) {
    .wc-block-components-button__text,
    .wc-block-cart__submit-button .wc-block-components-button__text,
    .woocommerce .wc-block-cart .wc-block-components-button__text {
        padding: 14px 20px !important;
        font-size: 15px !important;
        min-width: 200px !important;
        letter-spacing: 0.5px !important;
    }
    
    .wc-block-components-button__text::after {
        margin-left: 8px !important;
        font-size: 18px !important;
    }
}

/* ============================================
   КНОПКИ "В КОРЗИНУ" НА СТРАНИЦЕ МАГАЗИНА (КАТАЛОГ)
   ============================================ */

/* Основные стили для всех кнопок добавления в корзину в каталоге */
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce-page ul.products li.product .button.add_to_cart_button,
.woocommerce .add_to_cart_button,
.woocommerce-page .add_to_cart_button {
    display: inline-block !important;
    padding: 14px 25px !important;
    background: linear-gradient(135deg, #00353f 0%, #005566 100%) !important;
    color: white !important;
    text-decoration: none !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
    box-shadow: 0 4px 12px rgba(0, 53, 63, 0.2) !important;
    position: relative !important;
    overflow: hidden !important;
    text-align: center !important;
    width: auto !important;
    margin-top: 15px !important;
}

/* Эффект при наведении */
.woocommerce ul.products li.product .button.add_to_cart_button:hover,
.woocommerce-page ul.products li.product .button.add_to_cart_button:hover,
.woocommerce .add_to_cart_button:hover,
.woocommerce-page .add_to_cart_button:hover {
    transform: translateY(-3px) scale(1.05) !important;
    box-shadow: 0 8px 20px rgba(0, 53, 63, 0.3) !important;
    background: linear-gradient(135deg, #005566 0%, #006677 100%) !important;
    color: white !important;
}

/* Эффект при нажатии */
.woocommerce ul.products li.product .button.add_to_cart_button:active,
.woocommerce-page ul.products li.product .button.add_to_cart_button:active,
.woocommerce .add_to_cart_button:active,
.woocommerce-page .add_to_cart_button:active {
    transform: translateY(-1px) scale(0.98) !important;
    box-shadow: 0 3px 10px rgba(0, 53, 63, 0.2) !important;
    transition: all 0.1s ease !important;
}

/* Иконка корзины (аналогично странице товара) */
.woocommerce ul.products li.product .button.add_to_cart_button::before,
.woocommerce-page ul.products li.product .button.add_to_cart_button::before {
    content: "🛒" !important;
    margin-right: 8px !important;
    font-size: 16px !important;
}

/* Для товаров, которые уже в корзине (опционально) */
.woocommerce ul.products li.product .added_to_cart {
    font-size: 13px !important;
    margin-top: 8px !important;
    color: #005566 !important;
    font-weight: 500 !important;
    display: block !important;
}

/* Адаптивность для кнопок в каталоге */
@media (max-width: 768px) {
    .woocommerce ul.products li.product .button.add_to_cart_button,
    .woocommerce-page ul.products li.product .button.add_to_cart_button {
        padding: 12px 20px !important;
        font-size: 14px !important;
        margin-top: 10px !important;
    }
}


/* ============================================
   КРАСИВЫЕ ИКОНКИ КОРЗИНЫ И АККАУНТА
   ============================================ */

/* Контейнер иконок */
.hoboweb-cart-account-icons {
    display: flex !important;
    gap: 20px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 20px 0 !important;
    padding: 15px !important;
    background: linear-gradient(135deg, #00353f10 0%, #00556610 100%) !important;
    border-radius: 12px !important;
    border: 1px solid #00353f20 !important;
}

/* Общие стили для иконок */
.hoboweb-cart-account-icons a {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-decoration: none !important;
    color: #00353f !important;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
    padding: 10px 15px !important;
    border-radius: 10px !important;
    min-width: 80px !important;
}

.hoboweb-cart-account-icons a:hover {
    background: white !important;
    transform: translateY(-5px) !important;
    box-shadow: 0 10px 25px rgba(0, 53, 63, 0.15) !important;
    color: #005566 !important;
}

/* Обёртка для иконки */
.icon-wrapper {
    position: relative !important;
    display: inline-block !important;
    margin-bottom: 5px !important;
}

/* SVG иконки */
.cart-svg,
.account-svg {
    width: 28px !important;
    height: 28px !important;
    stroke-width: 1.5 !important;
}

/* Счётчик товаров в корзине */
.cart-count {
    position: absolute !important;
    top: -8px !important;
    right: -8px !important;
    background: #ff4757 !important;
    color: white !important;
    font-size: 11px !important;
    font-weight: bold !important;
    min-width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    animation: pulse 2s infinite !important;
}

/* Точка для авторизованных пользователей */
.logged-in-dot {
    position: absolute !important;
    top: -3px !important;
    right: -3px !important;
    width: 10px !important;
    height: 10px !important;
    background: #4cd137 !important;
    border-radius: 50% !important;
    border: 2px solid white !important;
}

/* Текст под иконкой */
.icon-text {
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px !important;
    text-align: center !important;
}

/* Анимация пульсации для счётчика */
@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

/* Для страниц WooCommerce - более компактный вариант */
.woocommerce-page .hoboweb-cart-account-icons,
.woocommerce .hoboweb-cart-account-icons {
    margin: 15px 0 25px !important;
    padding: 12px !important;
}

/* Для главной страницы - более крупный */
.home .hoboweb-cart-account-icons {
    margin: 30px 0 !important;
    padding: 20px !important;
    background: linear-gradient(135deg, #00353f15 0%, #00556615 100%) !important;
}

.home .hoboweb-cart-account-icons a {
    min-width: 100px !important;
    padding: 15px 20px !important;
}

.home .cart-svg,
.home .account-svg {
    width: 32px !important;
    height: 32px !important;
}

/* Адаптивность */
@media (max-width: 768px) {
    .hoboweb-cart-account-icons {
        gap: 15px !important;
        padding: 12px !important;
    }
    
    .hoboweb-cart-account-icons a {
        min-width: 70px !important;
        padding: 8px 12px !important;
    }
    
    .cart-svg,
    .account-svg {
        width: 24px !important;
        height: 24px !important;
    }
    
    .icon-text {
        font-size: 12px !important;
    }
}

/* ============================================
   БЛОК МЕТА-ИНФОРМАЦИИ ТОВАРА (Артикул, Категория)
   ============================================ */

/* Вариант: в одну строку с красивым разделителем */
.product_meta {
    margin: 25px 0 !important;
    padding: 18px !important;
    background: white !important;
    border-radius: 10px !important;
    border: 2px solid #e9ecef !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 20px !important;
}

.product_meta .sku_wrapper,
.product_meta .posted_in {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

/* Разделитель между элементами */
.product_meta .sku_wrapper::after {
    content: "|" !important;
    color: #dee2e6 !important;
    margin-left: 20px !important;
    font-size: 20px !important;
    font-weight: 100 !important;
}

/* Текст меток */
.product_meta .sku_wrapper > span:first-child,
.product_meta .posted_in > span:first-child {
    font-weight: 300 !important;
    color: #6c757d !important;
    font-size: 14px !important;
}

/* Значения */
.product_meta .sku {
    font-family: 'Courier New', monospace !important;
    font-weight: 400 !important;
    color: #00353f !important;
    padding: 2px 8px !important;
    background: #f8f9fa !important;
    border-radius: 4px !important;
}

.product_meta .posted_in a {
    color: #005566 !important;
    font-weight: 300 !important;
    text-decoration: none !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    transition: all 0.3s ease !important;
}

.product_meta .posted_in a:hover {
    background: #00353f !important;
    color: white !important;
}