/* Стилизация блока каталога (ST315N) */
#rec[data-record-type="315"] .tn-atom,
#rec[data-record-type="315"] .t-store__card {
    border: 1px solid #e0e0e0;       /* Серая обводка */
    border-radius: 20px;              /* Скругление 20px */
    background-color: #ffffff;        /* Белый фон карточки */
    overflow: hidden;                 /* Чтобы картинка не вылезала за скругленные углы */
    transition: box-shadow 0.2s ease; /* Плавная тень при наведении (опционально) */
    display: flex;
    flex-direction: column;
    height: 100%;                     /* Чтобы карточки в ряду были одной высоты */
}

/* Убираем лишние фоны и рамки у внутренних элементов */
#rec[data-record-type="315"] .t-store__card .t-store__card__wrap {
    background-color: transparent !important;
    border: none !important;
    padding: 15px 15px 20px 15px;     /* Внутренние отступы (подбери под свой вкус) */
    flex-grow: 1;                     /* Растягиваем текстовую часть */
    display: flex;
    flex-direction: column;
}

/* Стили для фото товара (галереи) */
#rec[data-record-type="315"] .t-store__card .t-store__card__imgwrapper,
#rec[data-record-type="315"] .t-store__card .t-slds__frame {
    border-top-left-radius: 19px;      /* Скругляем верхние углы фото (19, чтобы наложение было идеальным) */
    border-top-right-radius: 19px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    overflow: hidden;
    margin: 0;
}

/* Цвет цены (красный) */
#rec[data-record-type="315"] .t-store__card .t-store__card__price,
#rec[data-record-type="315"] .t-store__card .t-store__card__price-old {
    color: #D6304C !important;         /* Твой красный */
    font-weight: 600;                  /* Чуть жирнее */
}

/* Если есть старая цена (зачеркнутая), можно сделать её серой, а новую - красной */
#rec[data-record-type="315"] .t-store__card .t-store__card__price-old {
    color: #9e9e9e !important;          /* Серая для старой цены */
    font-weight: 400;
    margin-right: 8px;
}

/* Стили для кнопки "Добавить в корзину" */
#rec[data-record-type="315"] .t-store__card .t-btn,
#rec[data-record-type="315"] .t-store__card a[href*="#order"],
#rec[data-record-type="315"] .t-store__card .t-store__btn {
    background-color: #D6304C !important; /* Красный фон */
    border-color: #D6304C !important;     /* Красная обводка */
    border-radius: 30px !important;       /* Скругление кнопки (можно сделать поменьше, например 10px) */
    color: #ffffff !important;             /* Белый текст */
    font-weight: 600;
    transition: opacity 0.2s;
    margin-top: 15px;                      /* Отступ сверху до кнопки */
    align-self: flex-start;                /* Для маленьких кнопок (если нужно выровнять по левому краю) */
    width: 100%;                            /* Растянуть кнопку на всю ширину карточки (убери, если нужна кнопка по тексту) */
    text-align: center;
}

/* Эффект при наведении на кнопку */
#rec[data-record-type="315"] .t-store__card .t-btn:hover {
    opacity: 0.85;
    background-color: #bf2b41 !important; /* Чуть темнее при наведении */
    border-color: #bf2b41 !important;
}

/* Делаем отступы внутри карточки для текста */
#rec[data-record-type="315"] .t-store__card .t-store__card__textwrapper {
    padding: 0; /* Убираем стандартные отступы, т.к. мы добавили свои в .t-store__card__wrap */
}

/* Подгоняем высоту картинок (чтобы они не сплющивались) */
#rec[data-record-type="315"] .t-store__card .t-store__card__imgwrapper {
    height: auto; /* Или задай фиксированную высоту, например 250px */
    min-height: 200px;
    background-color: #f5f5f5; /* Фон на время загрузки */
}

/* Адаптация для мобильных */
@media screen and (max-width: 640px) {
    #rec[data-record-type="315"] .tn-atom,
    #rec[data-record-type="315"] .t-store__card {
        border-radius: 15px; /* Чуть меньше скругление на телефонах */
    }
    #rec[data-record-type="315"] .t-store__card .t-store__card__wrap {
        padding: 10px;
    }
}