/* ========== НАСТРОЙКИ СЧЕТЧИКА ========== */
:root {
    --counter-height: 35px;        /* общая высота счетчика */
    --counter-width: 50px;         /* общая ширина счетчика */
    --counter-border-radius: 5px;    /* скругление углов */
    --counter-bg: #ffffff;           /* фон счетчика */
    --counter-border: 1px solid #e0e0e0; /* граница счетчика */
    
    /* Кнопки + и - */
    --button-width: 5px;            /* ширина кнопок */
    --button-bg: #f5f5f5;            /* фон кнопок */
    --button-bg-hover: #e8e8e8;       /* фон при наведении */
    --button-text-color: #333333;     /* цвет символов */
    --button-font-size: 15px;         /* размер символов */
    
    /* Поле ввода */
    --input-width: 10px;              /* ширина поля */
    --input-bg: #ffffff;              /* фон поля */
    --input-text-color: #333333;      /* цвет цифр */
    --input-font-size: 12px;          /* размер цифр */
}

/* Счетчик */
.t-store__card__btns-wrapper .t-store__prod__quantity {
    height: var(--counter-height) !important;
    width: var(--counter-width) !important;
    min-width: var(--counter-width) !important;
    display: flex !important;
    align-items: center !important;
    border-radius: var(--counter-border-radius) !important;
    background: var(--counter-bg) !important;
    border: var(--counter-border) !important;
    overflow: hidden !important;
    margin: 0 !important;
}

/* Кнопки + и - */
.t-store__card__btns-wrapper .t-store__prod__quantity .t-store__prod__quantity__minus-wrapper,
.t-store__card__btns-wrapper .t-store__prod__quantity .t-store__prod__quantity__plus-wrapper {
    height: var(--counter-height) !important;
    width: var(--button-width) !important;
    min-width: var(--button-width) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: var(--button-bg) !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease !important;
}

.t-store__card__btns-wrapper .t-store__prod__quantity .t-store__prod__quantity__minus-wrapper:hover,
.t-store__card__btns-wrapper .t-store__prod__quantity .t-store__prod__quantity__plus-wrapper:hover {
    background-color: var(--button-bg-hover) !important;
}

/* Символы + и - */
.t-store__card__btns-wrapper .t-store__prod__quantity .t-store__prod__quantity__minus,
.t-store__card__btns-wrapper .t-store__prod__quantity .t-store__prod__quantity__plus {
    font-size: var(--button-font-size) !important;
    font-weight: bold !important;
    color: var(--button-text-color) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
}

/* Поле ввода */
.t-store__card__btns-wrapper .t-store__prod__quantity .t-store__prod__quantity-input {
    height: var(--counter-height) !important;
    width: var(--input-width) !important;
    min-width: var(--input-width) !important;
    background-color: var(--input-bg) !important;
    color: var(--input-text-color) !important;
    font-size: var(--input-font-size) !important;
    text-align: center !important;
    border: none !important;
    border-left: 1px solid #e0e0e0 !important;
    border-right: 1px solid #e0e0e0 !important;
    padding: 0 !important;
    outline: none !important;
}

/* Убираем стрелки у input number */
.t-store__card__btns-wrapper .t-store__prod__quantity .t-store__prod__quantity-input::-webkit-outer-spin-button,
.t-store__card__btns-wrapper .t-store__prod__quantity .t-store__prod__quantity-input::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

.t-store__card__btns-wrapper .t-store__prod__quantity .t-store__prod__quantity-input[type=number] {
    -moz-appearance: textfield !important;
}

/* ========== ЦЕНА ========== */
.t-store__card__btns-wrapper .moved-price {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: var(--counter-height) !important;
    margin: 0 auto !important;
    background: transparent !important;
}

.t-store__card__btns-wrapper .moved-price .js-store-prod-price-val {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #333333 !important;
}

.t-store__card__btns-wrapper .moved-price .t-store__card__price-currency {
    font-size: 16px !important;
    margin-left: 2px !important;
    font-weight: 500 !important;
    color: #333333 !important;
}

/* ========== КНОПКА ДОБАВИТЬ В КОРЗИНУ ========== */
.t-store__card__btns-wrapper .t-store__card__btn_second {
    height: var(--counter-height) !important;
    min-height: var(--counter-height) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    padding: 0 12px !important;
    background-color: #eee0d1 !important;
    color: #000000 !important;
    border: 1px solid #000000 !important;
    border-radius: 5px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
}

.t-store__card__btns-wrapper .t-store__card__btn_second:hover {
    background-color: #e5d5c4 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
}

/* ========== ДЛЯ ПОПАПА ========== */
.t-popup .t-store__prod-popup__btn-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    gap: 8px !important;
}

.t-popup .t-store__prod__quantity {
    height: var(--counter-height) !important;
    width: var(--counter-width) !important;
    display: flex !important;
    align-items: center !important;
    border-radius: var(--counter-border-radius) !important;
    background: var(--counter-bg) !important;
    border: var(--counter-border) !important;
    overflow: hidden !important;
    margin: 0 !important;
}

.t-popup .t-store__prod-popup__btn {
    height: var(--counter-height) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 12px !important;
    background-color: #eee0d1 !important;
    color: #000000 !important;
    border: 1px solid #000000 !important;
    border-radius: 5px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.t-popup .js-store-prod-price-val {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #333333 !important;
    margin: 0 !important;
}

/* Выравнивание по центру для текста "Вес" в карточках товара */
.t-store__card .js-product-edition-option-name.t-product__option-title {
    text-align: center !important;
    width: 100% !important;
    display: block !important;
}

/* Оставляем стандартное выравнивание слева в попапе */
.t-store__card__prod-controls-wrapper:has(*) {
    padding-top: 5px !important;
}

.t-store__card .t-store__card__price {
    font-size: 20px;
    font-weight: 800 !important;
}

.t-store .t-product__option {
    margin-bottom: 0px;
    margin-top: 0px;
}

/* Радиус для кнопок опций */
.t-product__option-item.t-product__option-item_buttons {
    border-radius: 5px !important;
    overflow: hidden !important;
}

/* Если кнопки находятся в контейнере */
.t-product__option-variants.t-product__option-variants_buttons {
    gap: 5px !important;
}

/* Для активной кнопки */
.t-product__option-item.t-product__option-item_buttons.t-product__option-item_active {
    border-radius: 5px !important;
}

/* Для самой кнопки (если нужно добавить рамку) */
.t-product__option-item.t-product__option-item_buttons {
    border: 1px solid #e0e0e0 !important;
    border-radius: 5px !important;
    padding: 5px 10px !important;
    transition: all 0.2s ease !important;
}

/* При наведении */
.t-product__option-item.t-product__option-item_buttons:hover {
    background-color: #f5f5f5 !important;
    border-color: #b0b0b0 !important;
}

/* Активное состояние */
.t-product__option-item.t-product__option-item_buttons.t-product__option-item_active {
    background-color: #eee0d1 !important;
    border-color: #000000 !important;
}

/* Убираем стандартные линии */
.t-store__tabs__item {
    border: none !important;
    background: transparent !important;
    margin-bottom: 8px !important;
}

/* Стилизация кнопок табов (заголовков) */
.t-store__tabs__item-button {
    border: 1px solid #e0e0e0 !important;
    border-radius: 5px !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important;
    background-color: #ffffff !important;
    padding: 12px 16px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

/* Стиль для активного (открытого) таба */
.t-store__tabs__item_active .t-store__tabs__item-button {
    background-color: #f8f8f8 !important;
    border-color: #999999 !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1) !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border-bottom: none !important;
}

/* Эффект при наведении */
.t-store__tabs__item-button:hover {
    background-color: #f5f5f5 !important;
    border-color: #b0b0b0 !important;
}

/* Стилизация текста заголовка */
.t-store__tabs__item-title {
    font-weight: 500 !important;
    color: #333333 !important;
}

/* Стилизация иконки (+) / (×) */
.t-store__tabs__close {
    width: 24px !important;
    height: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.t-store__tabs__close svg {
    width: 16px !important;
    height: 16px !important;
}

.t-store__tabs__close svg path {
    stroke: #666666 !important;
    stroke-width: 1.5px !important;
}

/* При открытом табе иконка меняется */
.t-store__tabs__item_active .t-store__tabs__close svg path:last-child {
    display: none !important; /* Скрываем вертикальную линию, оставляем только горизонтальную */
}

/* Стилизация контента таба */
.t-store__tabs__content {
    border: 1px solid #e0e0e0 !important;
    border-top: none !important;
    border-bottom-left-radius: 5px !important;
    border-bottom-right-radius: 5px !important;
    padding: 16px !important;
    background-color: #ffffff !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.03) !important;
}

/* Для скрытых табов */
.t-store__tabs__content[style*="display: none"] {
    display: none !important;
}

/* Стилизация верхних кнопок (если они есть) */
.t-store__tabs__button {
    border: 1px solid #e0e0e0 !important;
    border-radius: 5px !important;
    background: white !important;
    padding: 8px 16px !important;
    margin-right: 8px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

.t-store__tabs__button:hover {
    background-color: #f5f5f5 !important;
}