/* Start:/bitrix/templates/proopt_default/components/bitrix/catalog.element/gopro/style.css?179119253543270*/
/* ==========================================================================
   Product detail — 3 колонки в стиле Ozon:
   галерея | артикул, варианты, «О товаре» | закреплённый блок покупки.
   Цвет кнопок — фирменный #3498db (.btn1 в styles.css).
   ========================================================================== */

.elementdetail.detail-modern {
    --oz-white: #ffffff;
    --oz-bg-soft: #f2f3f5;
    --oz-border: #e9ecf0;
    --oz-text: #001a34;
    --oz-text-secondary: #707f8d;
    --oz-accent: #3498db;
    --oz-accent-hover: #2980b9;
    --oz-accent-soft: #eaf4fc;
    --oz-success: #10c44c;
    --oz-danger: #f91155;
    --oz-card-radius: 20px;
    --oz-btn-radius: 14px;
    --oz-small-radius: 12px;
    --oz-shadow: 0 4px 24px rgba(0, 26, 52, 0.08);

    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) 340px;
    gap: 32px;
    float: none;
    align-items: start;
    font-family: "SF Pro Text", -apple-system, "Roboto", system-ui, sans-serif;
    color: var(--oz-text);
    line-height: 1.5;
}

/* Заголовок страницы товара: обычный регистр и жирный шрифт вместо капса */
body:has(.elementdetail.detail-modern) h1.pagetitle {
    margin-bottom: 20px;
    color: #001a34;
    font-family: "SF Pro Display", "SF Pro Text", -apple-system, "Roboto", system-ui, sans-serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.01em;
    text-transform: none;
}

.elementdetail.detail-modern > .icon.da2qb {
    display: none;
}

.elementdetail.detail-modern > .pictures,
.elementdetail.detail-modern > .detail-product__main,
.elementdetail.detail-modern > .detail-product__aside {
    float: none;
    width: auto;
    min-width: 0;
    padding: 0;
}

.elementdetail.detail-modern > .pictures              { grid-column: 1; grid-row: 1; }
.elementdetail.detail-modern > .detail-product__main  { grid-column: 2; grid-row: 1; }
.elementdetail.detail-modern > .detail-product__aside { grid-column: 3; grid-row: 1; }

.elementdetail.detail-modern > .detail-product__main,
.elementdetail.detail-modern > .detail-product__aside {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.elementdetail.detail-modern > .detail-product__main > *,
.elementdetail.detail-modern > .detail-product__aside > * {
    min-width: 0;
}

/* Блок покупки остаётся на экране при прокрутке, как на Ozon */
.elementdetail.detail-modern > .detail-product__aside {
    position: sticky;
    top: 16px;
}

/* ==========================================================================
   Gallery — превью слева, большое фото справа
   ========================================================================== */

.elementdetail.detail-modern > .pictures {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}

.elementdetail.detail-modern .pic {
    grid-column: 2;
    grid-row: 1;
    position: relative;
    min-height: 480px;
    height: auto;
    margin: 0;
    padding: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: normal;
    text-align: center;
    border: none;
    border-radius: var(--oz-card-radius);
    background: var(--oz-white);
    box-shadow: inset 0 0 0 1px var(--oz-border);
    overflow: hidden;
}

.elementdetail.detail-modern .pic .glass,
.elementdetail.detail-modern .pic > img {
    width: 100%;
    max-width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.elementdetail.detail-modern .pic img {
    width: auto;
    max-width: 100%;
    max-height: 432px;
    object-fit: contain;
}

/* Подсказка «наведите мышкой» — лупа и так работает при наведении */
.elementdetail.detail-modern .zoom {
    display: none;
}

/* Одно фото — ленту превью не показываем, фото на всю ширину */
.elementdetail.detail-modern > .pictures:has(.sliderin > a:only-child) {
    grid-template-columns: minmax(0, 1fr);
}

.elementdetail.detail-modern > .pictures:has(.sliderin > a:only-child) > .picslider {
    display: none;
}

.elementdetail.detail-modern > .pictures:has(.sliderin > a:only-child) .pic {
    grid-column: 1;
}

/* Лента превью (jScrollPane в вертикальном режиме) */
.elementdetail.detail-modern .pictures > .picslider.vertical {
    grid-column: 1;
    grid-row: 1;
    float: none;
    width: 64px;
    margin: 0;
    padding: 0;
    border: none;
    background: transparent;
    box-shadow: none;
}

.elementdetail.detail-modern .pictures > .picslider.vertical .d_jscrollpane {
    width: 64px;
    height: 480px;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: none;
}

.elementdetail.detail-modern .pictures > .picslider.vertical .d_jscrollpane::-webkit-scrollbar,
.elementdetail.detail-modern .pictures > .picslider.vertical .jspVerticalBar,
.elementdetail.detail-modern .pictures > .picslider.vertical .jspHorizontalBar {
    display: none;
}

.elementdetail.detail-modern .pictures > .picslider .sliderin {
    width: 64px;
    height: auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.elementdetail.detail-modern .pictures > .picslider .scrollinner a {
    box-sizing: border-box;
    float: none;
    width: 64px;
    height: 64px;
    margin: 0;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: normal;
    border: 2px solid transparent;
    border-radius: var(--oz-small-radius);
    background: var(--oz-white);
    box-shadow: inset 0 0 0 1px var(--oz-border);
    transition: border-color 0.15s ease;
}

.elementdetail.detail-modern .pictures > .picslider .scrollinner a:hover {
    border-color: #c6dff3;
}

.elementdetail.detail-modern .pictures > .picslider .scrollinner a.selected {
    border-color: var(--oz-accent);
    box-shadow: none;
}

.elementdetail.detail-modern .pictures > .picslider .scrollinner a img {
    max-width: 100%;
    max-height: 100%;
    border-radius: 8px;
}

/* Стрелки ленты — круглые кнопки сверху и снизу */
.elementdetail.detail-modern .pictures > .picslider.vertical a.prev,
.elementdetail.detail-modern .pictures > .picslider.vertical a.next {
    position: absolute;
    left: 50%;
    z-index: 5;
    width: 28px;
    height: 28px;
    margin: 0 0 0 -14px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--oz-white);
    box-shadow: 0 2px 8px rgba(0, 26, 52, 0.16);
}

.elementdetail.detail-modern .pictures > .picslider.vertical a.prev { top: -14px; }
.elementdetail.detail-modern .pictures > .picslider.vertical a.next { bottom: -14px; top: auto; }

/* На телефонах лента листается свайпом — стрелки не нужны */
.elementdetail.detail-modern .pictures > .picslider.simple a.prev,
.elementdetail.detail-modern .pictures > .picslider.simple a.next {
    display: none;
}

.elementdetail.detail-modern .pictures > .picslider.vertical a .svg-icon {
    width: 12px;
    height: 12px;
    fill: var(--oz-text);
}

.elementdetail.detail-modern .pictures > .picslider.vertical a:hover .svg-icon {
    fill: var(--oz-accent);
}

/* ==========================================================================
   Main column — артикул и наличие
   ========================================================================== */

/* clearfix-псевдоэлементы во flex/grid становятся пустыми элементами и сдвигают плашки */
.elementdetail.detail-modern .articleandstores::before,
.elementdetail.detail-modern .articleandstores::after,
.elementdetail.detail-modern .threeblock::before,
.elementdetail.detail-modern .threeblock::after {
    display: none;
}

.elementdetail.detail-modern .articleandstores {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

/* > в селекторе перебивает адаптивное правило темы body.adaptive .elementdetail .article */
.elementdetail.detail-modern .articleandstores > .article,
.elementdetail.detail-modern .articleandstores > .stores {
    float: none;
    width: auto;
    min-height: 32px;
    flex: none;
    margin: 0;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: none;
    border-radius: 10px;
    background: var(--oz-bg-soft);
    box-shadow: none;
    color: var(--oz-text-secondary);
    font-size: 13px;
}

.elementdetail.detail-modern .offer_article {
    color: var(--oz-text);
    font-weight: 600;
}

.elementdetail.detail-modern .stores > span {
    width: auto;
    display: flex;
    align-items: center;
    gap: 6px;
}

.elementdetail.detail-modern .stores .genamount {
    margin-left: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0;
    background: transparent;
    color: var(--oz-success);
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}

.elementdetail.detail-modern .stores .genamount .svg-icon {
    width: 10px;
    height: 10px;
    flex: 0 0 10px;
    fill: currentColor;
}

/* ==========================================================================
   Main column — «О товаре»
   ========================================================================== */

.elementdetail.detail-modern .product-about {
    margin-top: 4px;
}

.elementdetail.detail-modern .product-about__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.elementdetail.detail-modern .product-about__title {
    color: var(--oz-text);
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
}

.elementdetail.detail-modern .product-about__more {
    color: var(--oz-accent);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
}

.elementdetail.detail-modern .product-about__more:after {
    content: " \203A";
}

.elementdetail.detail-modern .product-about__more:hover {
    color: var(--oz-accent-hover);
}

.elementdetail.detail-modern .product-about__list {
    margin: 0;
}

.elementdetail.detail-modern .product-about__row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 16px;
    padding: 11px 0;
    border-bottom: 1px solid var(--oz-border);
    font-size: 14px;
    line-height: 1.4;
}

.elementdetail.detail-modern .product-about__row dt {
    margin: 0;
    color: var(--oz-text-secondary);
    font-weight: 400;
}

.elementdetail.detail-modern .product-about__row dd {
    margin: 0;
    color: var(--oz-text);
    font-weight: 500;
    overflow-wrap: break-word;
}

/* ==========================================================================
   Main column — выбор вариантов (SKU)
   ========================================================================== */

.elementdetail.detail-modern .properties,
.elementdetail.detail-modern .charactersiticSKU {
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.elementdetail.detail-modern .properties .offer_prop {
    padding: 0 0 12px;
}

.elementdetail.detail-modern .properties .offer_prop-name,
.elementdetail.detail-modern .charactersiticSKU .name_prop_sku {
    color: var(--oz-text-secondary);
    font-size: 14px;
    font-weight: 400;
}

.elementdetail.detail-modern .properties .offer_prop-name {
    display: block;
    margin-bottom: 8px;
}

.elementdetail.detail-modern .properties .div_select {
    min-width: 0;
}

.elementdetail.detail-modern .properties .div_selected {
    min-height: 44px;
    padding: 8px 14px;
    border: none;
    border-radius: var(--oz-small-radius);
    background: var(--oz-bg-soft);
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
}

.elementdetail.detail-modern .properties .div_selected .svg-icon {
    fill: var(--oz-text-secondary);
}

.elementdetail.detail-modern .properties_list .div_options_list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.elementdetail.detail-modern .properties_list .div_option {
    cursor: pointer;
}

.elementdetail.detail-modern .properties_list .div_option .list-item {
    display: inline-block;
    padding: 9px 16px;
    border: 2px solid transparent;
    border-radius: var(--oz-small-radius);
    background: var(--oz-bg-soft);
    color: var(--oz-text);
    font-size: 14px;
    font-weight: 500;
    transition: border-color 0.15s, background-color 0.15s;
}

.elementdetail.detail-modern .properties_list .div_option:hover .list-item {
    border-color: #c6dff3;
}

.elementdetail.detail-modern .properties_list .div_option.selected .list-item {
    border-color: var(--oz-accent);
    background: var(--oz-white);
    font-weight: 600;
}

.elementdetail.detail-modern .properties_list .div_option.disabled .list-item {
    opacity: 0.4;
    pointer-events: none;
}

.elementdetail.detail-modern .charactersiticSKU .SKU_prop {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 16px;
    padding: 11px 0;
    border-bottom: 1px solid var(--oz-border);
    font-size: 14px;
}

.elementdetail.detail-modern .charactersiticSKU .val_prop_sku {
    color: var(--oz-text);
    font-weight: 500;
}

/* ==========================================================================
   Main column — анонс и «поделиться»
   ========================================================================== */

.elementdetail.detail-modern .previewtext {
    margin: 0;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--oz-text-secondary);
    font-size: 14px;
    line-height: 1.6;
}

.elementdetail.detail-modern .share {
    margin: 0;
    padding: 0;
    border: none;
    background: transparent;
}

.elementdetail.detail-modern .share a,
.elementdetail.detail-modern .previewtext a {
    color: var(--oz-accent);
}

/* ==========================================================================
   Aside — карточка покупки
   ========================================================================== */

.elementdetail.detail-modern .product-purchase-card {
    padding: 24px;
    border: none;
    border-radius: var(--oz-card-radius);
    background: var(--oz-white);
    display: flex;
    flex-direction: column;
    gap: 16px;
    box-shadow: var(--oz-shadow);
}

.elementdetail.detail-modern .product-purchase-card > .price-panel,
.elementdetail.detail-modern .product-purchase-card > noindex,
.elementdetail.detail-modern .product-purchase-card > noindex > .buy,
.elementdetail.detail-modern .product-purchase-card > .threeblock {
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.elementdetail.detail-modern .product-purchase-card > noindex {
    display: block;
    width: 100%;
}

/* Ошибка цен */
.elementdetail.detail-modern .price-error-block {
    padding: 14px 16px;
    border-radius: var(--oz-small-radius);
    background: #fff6e5;
}

.elementdetail.detail-modern .price-error-message {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.elementdetail.detail-modern .error-icon {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border-radius: 50%;
    background: #ffe2a8;
    color: #a86b00;
    font-size: 16px;
    font-weight: 700;
}

.elementdetail.detail-modern .error-text strong {
    display: block;
    margin-bottom: 4px;
    color: #6b4a00;
}

.elementdetail.detail-modern .error-text span {
    color: #8a6a26;
    font-size: 14px;
    line-height: 1.5;
}

/* ==========================================================================
   Aside — цены: крупная розничная + список оптовых
   ========================================================================== */

.elementdetail.detail-modern .price-panel {
    height: auto;
    min-height: 0;
    margin: 0;
}

.elementdetail.detail-modern .soloprice .line,
.elementdetail.detail-modern .soloprice .price,
.elementdetail.detail-modern .soloprice .discount {
    height: auto;
    min-height: 0;
}

.elementdetail.detail-modern .price-list {
    display: flex;
    flex-direction: column;
    border: none;
    background: transparent;
}

.elementdetail.detail-modern .price-list__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 9px 14px;
    background: var(--oz-bg-soft);
}

.elementdetail.detail-modern .price-list__row--primary + .price-list__row {
    margin-top: 14px;
    padding-top: 12px;
    border-radius: var(--oz-small-radius) var(--oz-small-radius) 0 0;
}

.elementdetail.detail-modern .price-list__row:last-child:not(.price-list__row--primary) {
    padding-bottom: 12px;
    border-radius: 0 0 var(--oz-small-radius) var(--oz-small-radius);
}

.elementdetail.detail-modern .price-list__row--primary + .price-list__row:last-child {
    border-radius: var(--oz-small-radius);
}

/* Розничная цена: сумма крупно, подпись под ней */
.elementdetail.detail-modern .price-list__row--primary {
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: 2px;
    padding: 0;
    background: transparent;
}

.elementdetail.detail-modern .price-list__label {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    color: var(--oz-text-secondary);
    font-size: 14px;
    line-height: 1.35;
    font-weight: 400;
}

.elementdetail.detail-modern .price-list__row--primary .price-list__label {
    font-size: 13px;
    letter-spacing: 0;
    text-transform: none;
}

.elementdetail.detail-modern .price-list__values {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    flex: 0 1 auto;
    min-width: 0;
    max-width: 60%;
    margin-left: auto;
    text-align: right;
}

.elementdetail.detail-modern .price-list__row--primary .price-list__values {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 10px;
    max-width: none;
    margin-left: 0;
    text-align: left;
}

.elementdetail.detail-modern .price-list__values .price.gen {
    display: block;
    max-width: 100%;
    color: var(--oz-text);
    font-size: 16px;
    line-height: 1.2;
    font-weight: 600;
    white-space: nowrap;
}

.elementdetail.detail-modern .price-list__row--primary .price-list__values .price.gen {
    color: var(--oz-text);
    font-size: 32px;
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.elementdetail.detail-modern .price-list__values .price.gen img {
    display: block;
    max-width: 120px;
    max-height: 38px;
    width: auto;
    height: auto;
    margin-left: auto;
}

.elementdetail.detail-modern .price-list__values .price.old {
    display: block;
    color: var(--oz-text-secondary);
    text-decoration: line-through;
    font-size: 14px;
    line-height: 1.3;
    font-weight: 400;
}

.elementdetail.detail-modern .price-list__values .discount {
    display: inline-block;
    color: var(--oz-danger);
    font-size: 13px;
    line-height: 1.3;
    font-weight: 600;
}

/* ==========================================================================
   Aside — количество и кнопки
   ========================================================================== */

.elementdetail.detail-modern .buy {
    margin: 0;
    padding: 0;
}

/* Сетка формы: всё на всю ширину, «В корзину» + сердечко в одну строку.
   .buy в селекторе нужен, чтобы перебить отступы темы (.elementdetail .add2basketform .add2basket) */
.elementdetail.detail-modern .buy .add2basketform {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 52px;
    gap: 8px;
}

/* clearfix-псевдоэлементы в grid превращаются в пустые строки */
.elementdetail.detail-modern .buy .add2basketform::before,
.elementdetail.detail-modern .buy .add2basketform::after {
    display: none;
}

.elementdetail.detail-modern .buy .add2basketform > * {
    grid-column: 1 / -1;
    margin: 0;
}

.elementdetail.detail-modern .buy .add2basketform > .add2basket,
.elementdetail.detail-modern .buy .add2basketform > .inbasket,
.elementdetail.detail-modern .buy .add2basketform.cantbuy > .js-product-subscribe {
    grid-column: 1;
}

.elementdetail.detail-modern .buy .add2basketform > .favorite-btn {
    grid-column: 2;
}

.elementdetail.detail-modern .buy .add2basketform.cantbuy > .js-product-subscribe,
.elementdetail.detail-modern .buy .add2basketform.cantbuy > .favorite-btn {
    grid-row: 1;
}

.elementdetail.detail-modern .buy .add2basketform > .quantity {
    margin-bottom: 6px;
}

/* Количество */
.elementdetail.detail-modern .add2basketform .quantity {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    clear: both;
    float: none;
    margin: 0 0 4px;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
}

.elementdetail.detail-modern .add2basketform .quantitytitle {
    flex: 0 0 auto;
    display: block;
    float: none;
    margin: 0;
    padding: 0;
    color: var(--oz-text-secondary);
    font-size: 14px;
    line-height: normal;
}

.elementdetail.detail-modern .add2basketform .quantity_inner {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    width: auto;
    min-height: 44px;
    margin: 0;
    padding: 0 4px;
    border: none;
    border-radius: var(--oz-small-radius);
    background: var(--oz-bg-soft);
    overflow: hidden;
}

.elementdetail.detail-modern .add2basketform .plus,
.elementdetail.detail-modern .add2basketform .minus {
    width: 36px;
    height: 36px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: transparent;
    color: var(--oz-accent);
    font-size: 22px;
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.15s;
}

.elementdetail.detail-modern .add2basketform .plus:hover,
.elementdetail.detail-modern .add2basketform .minus:hover {
    background: var(--oz-white);
}

.elementdetail.detail-modern .add2basketform .js-quantity {
    width: 48px;
    height: 36px;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    text-align: center;
    color: var(--oz-text);
    font-size: 16px;
    font-weight: 600;
}

.elementdetail.detail-modern .add2basketform .js-measurename {
    margin: 0 4px 0 -4px;
    background: transparent;
    color: var(--oz-text-secondary);
    font-size: 13px;
    font-weight: 400;
}

/* Кнопки */
.elementdetail.detail-modern .add2basketform .add2basket,
.elementdetail.detail-modern .add2basketform .inbasket,
.elementdetail.detail-modern .add2basketform .buy1click,
.elementdetail.detail-modern .add2basketform.cantbuy .js-product-subscribe {
    box-sizing: border-box;
    width: 100%;
    min-height: 52px;
    padding: 0 20px;
    border: none;
    border-radius: var(--oz-btn-radius);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0.01em;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease, transform 0.1s ease;
}

/* Основная кнопка: фон задаёт .btn1 (фирменный #3498db), добавляем объём */
.elementdetail.detail-modern .add2basketform .add2basket {
    color: #ffffff;
    box-shadow: 0 6px 16px -6px rgba(52, 152, 219, 0.7);
}

.elementdetail.detail-modern .add2basketform .add2basket:hover {
    box-shadow: 0 8px 20px -6px rgba(41, 128, 185, 0.75);
}

.elementdetail.detail-modern .add2basketform .add2basket:active,
.elementdetail.detail-modern .add2basketform .inbasket:active,
.elementdetail.detail-modern .add2basketform .favorite-btn:active {
    transform: scale(0.97);
}

/* «В корзине»: тот же фирменный цвет, но мягкий — видно, что товар уже добавлен */
.body .elementdetail.detail-modern .add2basketform .inbasket {
    background-color: var(--oz-accent-soft) !important;
    color: var(--oz-accent);
    box-shadow: none;
}

.body .elementdetail.detail-modern .add2basketform .inbasket:hover {
    background-color: #d9ecfa !important;
    color: var(--oz-accent-hover);
}

.elementdetail.detail-modern .add2basketform .btn-icon {
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.elementdetail.detail-modern .add2basketform .btn-icon circle {
    fill: currentColor;
    stroke: none;
}

/* Второстепенная кнопка: мягкий фирменный фон */
.elementdetail.detail-modern .add2basketform .buy1click,
.elementdetail.detail-modern .add2basketform.cantbuy .js-product-subscribe {
    min-height: 44px;
    background: var(--oz-accent-soft);
    color: var(--oz-accent);
    font-size: 15px;
}

.elementdetail.detail-modern .add2basketform .buy1click:hover,
.elementdetail.detail-modern .add2basketform.cantbuy .js-product-subscribe:hover {
    background: #d9ecfa;
    color: var(--oz-accent-hover);
}

/* Сердечко «Избранное» */
.elementdetail.detail-modern .add2basketform .favorite-btn {
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: start;
    border-radius: var(--oz-btn-radius);
    background: var(--oz-accent-soft);
    color: var(--oz-accent);
    text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease, transform 0.1s ease;
}

.elementdetail.detail-modern .add2basketform .favorite-btn svg {
    width: 24px;
    height: 24px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    transition: fill 0.15s ease, transform 0.15s ease;
}

.elementdetail.detail-modern .add2basketform .favorite-btn:hover {
    background: #d9ecfa;
}

.elementdetail.detail-modern .add2basketform .favorite-btn.in {
    color: var(--oz-danger);
    background: #ffeef3;
}

.elementdetail.detail-modern .add2basketform .favorite-btn.in svg {
    fill: currentColor;
    transform: scale(1.05);
}

/* Состояния: в корзине / нельзя купить */
.elementdetail.detail-modern .add2basketform .inbasket,
.elementdetail.detail-modern .add2basketform .go2basket,
.elementdetail.detail-modern .add2basketform .js-product-subscribe,
.elementdetail.detail-modern .add2basketform.in .add2basket,
.elementdetail.detail-modern .add2basketform.in .buy1click,
.elementdetail.detail-modern .add2basketform.in .js-product-subscribe {
    display: none;
}

.elementdetail.detail-modern .add2basketform .add2basket,
.elementdetail.detail-modern .add2basketform .buy1click,
.elementdetail.detail-modern .add2basketform.in .inbasket,
.elementdetail.detail-modern .add2basketform.in .go2basket {
    display: inline-flex;
}

.elementdetail.detail-modern .add2basketform.cantbuy .add2basket,
.elementdetail.detail-modern .add2basketform.cantbuy .inbasket,
.elementdetail.detail-modern .add2basketform.cantbuy .go2basket,
.elementdetail.detail-modern .add2basketform.cantbuy .buy1click,
.elementdetail.detail-modern .add2basketform.cantbuy .quantity {
    display: none;
}

.elementdetail.detail-modern .add2basketform.cantbuy .js-product-subscribe {
    display: inline-flex;
}

.elementdetail.detail-modern .add2basketform .go2basket {
    min-height: 0;
    padding: 0;
    align-items: center;
    justify-content: center;
    color: var(--oz-accent);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
}

.elementdetail.detail-modern .add2basketform:not(.in) .go2basket {
    display: none;
}

/* ==========================================================================
   Aside — сравнение / «хотите дешевле»
   ========================================================================== */

.elementdetail.detail-modern .threeblock {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.elementdetail.detail-modern .threeblock .compare,
.elementdetail.detail-modern .threeblock .cheaper {
    float: none;
    margin: 0;
}

.elementdetail.detail-modern .threeblock a {
    min-height: 36px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    border: none;
    border-radius: 10px;
    background: var(--oz-bg-soft);
    color: var(--oz-text);
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    transition: background-color 0.15s, color 0.15s;
}

.elementdetail.detail-modern .threeblock a:hover {
    background: var(--oz-accent-soft);
    color: var(--oz-accent);
}

.elementdetail.detail-modern .threeblock .svg-icon {
    margin-right: 6px;
    fill: currentColor;
}

/* ==========================================================================
   Aside — доставка, уведомление, склады
   ========================================================================== */

.elementdetail.detail-modern .product-delivery,
.elementdetail.detail-modern .storesfull {
    margin: 0;
    padding: 20px 24px;
    border: none;
    border-radius: var(--oz-card-radius);
    background: var(--oz-white);
    box-shadow: var(--oz-shadow);
}

.elementdetail.detail-modern .product-delivery.media {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.elementdetail.detail-modern .product-delivery__pic {
    width: 40px;
    min-width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--oz-small-radius);
    background: var(--oz-accent-soft);
}

.elementdetail.detail-modern .product-delivery__pic svg {
    width: 22px;
    height: 22px;
    fill: var(--oz-accent);
}

.elementdetail.detail-modern .product-delivery__title,
.elementdetail.detail-modern .storesfull b {
    display: block;
    margin-bottom: 8px;
    color: var(--oz-text);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
}

.elementdetail.detail-modern .product-delivery__list,
.elementdetail.detail-modern .storesfull span {
    color: var(--oz-text-secondary);
    font-size: 14px;
    line-height: 1.55;
}

.elementdetail.detail-modern .pdp-notification {
    margin: 0;
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 14px 16px;
    border: none;
    border-radius: var(--oz-small-radius);
    background: var(--oz-bg-soft);
    color: var(--oz-text-secondary);
    font-size: 13px;
    line-height: 1.5;
}

.elementdetail.detail-modern .pdp-notification-ico {
    color: var(--oz-accent);
    font-size: 18px;
}

.elementdetail.detail-modern .storesfull .genamount {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 4px;
    padding: 0;
    background: transparent;
    color: var(--oz-success);
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
}

.elementdetail.detail-modern .storesfull .genamount .svg-icon {
    width: 10px;
    height: 10px;
    flex: 0 0 10px;
    fill: currentColor;
}

.elementdetail.detail-modern .popupstores table {
    width: 100%;
    margin-top: 4px;
}

.elementdetail.detail-modern .popupstores table td {
    padding: 10px 0;
    border-bottom: 1px solid var(--oz-border);
    color: var(--oz-text);
    font-size: 14px;
}

.elementdetail.detail-modern .popupstores table td.amount {
    padding-left: 12px;
    text-align: right;
    white-space: nowrap;
}

.elementdetail.detail-modern .popupstores table tr:last-child td {
    border-bottom: none;
}

/* ==========================================================================
   Detail Tabs — Ozon-inspired description and characteristics
   ========================================================================== */

.detailtabs.detailtabs--modern {
    --oz-white: #ffffff;
    --oz-border: #e1e4e8;
    --oz-text: #001a34;
    --oz-text-secondary: #7b8794;
    --oz-accent: #3498db;
    --oz-accent-soft: #eaf4fc;
    --oz-card-radius: 18px;

    margin-top: 36px;
    padding-bottom: 0;
    border-bottom: none;
}

.detailtabs.detailtabs--modern .headers {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0;
    margin: 0 0 18px;
    background: transparent;
}

.detailtabs.detailtabs--modern .headers:after {
    content: none;
}

.detailtabs.detailtabs--modern .headers a {
    float: none;
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 0 16px;
    margin: 0;
    border: 1px solid var(--oz-border);
    border-radius: 999px;
    background: var(--oz-white);
    color: var(--oz-text-secondary);
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.detailtabs.detailtabs--modern .headers a.selected,
.detailtabs.detailtabs--modern .headers a.selected:active {
    border-color: #c6dff3;
    background: var(--oz-accent-soft);
    color: var(--oz-accent);
}

.detailtabs.detailtabs--modern .headers a:hover {
    border-color: #c6dff3;
    background: #f3f9fd;
    color: var(--oz-accent);
}

.detailtabs.detailtabs--modern .contents {
    overflow: visible;
}

.detailtabs.detailtabs--modern.tabs .content .contentbody,
.detailtabs.detailtabs--modern .content .switcher {
    display: none;
}

.detailtabs.detailtabs--modern .content.selected .contentbody {
    display: block;
}

.detailtabs.detailtabs--modern .contents .contentbody {
    border: 1px solid var(--oz-border);
    border-radius: var(--oz-card-radius);
    background: var(--oz-white);
    overflow: hidden;
}

.detailtabs.detailtabs--modern .contents .contentinner {
    padding: 28px 32px;
}

.detailtabs.detailtabs--modern #detailtext .contentinner {
    max-width: 980px;
    color: var(--oz-text);
    font-size: 15px;
    line-height: 1.72;
}

.detailtabs.detailtabs--modern #detailtext .contentinner > :first-child,
.detailtabs.detailtabs--modern #properties .contentinner > :first-child {
    margin-top: 0;
}

.detailtabs.detailtabs--modern #detailtext .contentinner > :last-child,
.detailtabs.detailtabs--modern #properties .contentinner > :last-child {
    margin-bottom: 0;
}

.detailtabs.detailtabs--modern #detailtext p,
.detailtabs.detailtabs--modern #detailtext ul,
.detailtabs.detailtabs--modern #detailtext ol {
    margin: 0 0 14px;
}

.detailtabs.detailtabs--modern #detailtext h2,
.detailtabs.detailtabs--modern #detailtext h3,
.detailtabs.detailtabs--modern #detailtext h4 {
    margin: 22px 0 12px;
    color: var(--oz-text);
    font-size: 22px;
    line-height: 1.25;
    font-weight: 700;
}

.detailtabs.detailtabs--modern #detailtext a {
    color: var(--oz-accent);
}

.detailtabs.detailtabs--modern #detailtext ul,
.detailtabs.detailtabs--modern #detailtext ol {
    padding-left: 22px;
}

.detailtabs.detailtabs--modern #detailtext table,
.detailtabs.detailtabs--modern #detailtext table td,
.detailtabs.detailtabs--modern #detailtext table th {
    border: none;
}

.detailtabs.detailtabs--modern #detailtext table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin: 18px 0;
}

.detailtabs.detailtabs--modern #detailtext table td,
.detailtabs.detailtabs--modern #detailtext table th {
    padding: 12px 14px;
    border-top: 1px solid #edf1f5;
    text-align: left;
}

.detailtabs.detailtabs--modern #detailtext table tr:last-child td,
.detailtabs.detailtabs--modern #detailtext table tr:last-child th {
    border-bottom: 1px solid #edf1f5;
}

.detailtabs.detailtabs--modern #properties .contentinner {
    padding-top: 22px;
    padding-bottom: 22px;
}

.detailtabs.detailtabs--modern table.groupedprops {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}

.detailtabs.detailtabs--modern table.groupedprops th {
    padding: 20px 0 12px;
    color: var(--oz-text);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-align: left;
}

.detailtabs.detailtabs--modern table.groupedprops th.first {
    padding-top: 0;
}

.detailtabs.detailtabs--modern .groupedprops th,
.detailtabs.detailtabs--modern .groupedprops td {
    padding: 14px 0;
    text-align: left;
    vertical-align: top;
}

.detailtabs.detailtabs--modern .groupedprops td {
    border-top: 1px solid #edf1f5;
}

.detailtabs.detailtabs--modern .groupedprops tr:first-child td,
.detailtabs.detailtabs--modern .groupedprops tr:first-child th + td {
    border-top: none;
}

.detailtabs.detailtabs--modern .groupedprops td:first-child {
    width: 42%;
    padding-right: 24px;
}

.detailtabs.detailtabs--modern .groupedprops td:last-child {
    text-align: right;
}

.detailtabs.detailtabs--modern .groupedprops .line {
    display: none;
}

.detailtabs.detailtabs--modern .groupedprops .name {
    margin: 0;
    background: transparent;
    color: var(--oz-text-secondary);
    font-size: 14px;
    line-height: 1.45;
}

.detailtabs.detailtabs--modern .groupedprops .val {
    color: var(--oz-text);
    font-size: 15px;
    line-height: 1.45;
    font-weight: 500;
}

.detailtabs.detailtabs--modern .contents .content.files .contentinner {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}

.detailtabs.detailtabs--modern .contents .content.files .docs {
    width: auto;
    float: none;
    padding: 14px 16px;
    border: 1px solid var(--oz-border);
    border-radius: 14px;
    background: #fbfcfe;
}

.detailtabs.detailtabs--modern .contents .content.files .separator {
    display: none;
}


/* ==========================================================================
   Responsive
   ========================================================================== */

/* Ноутбуки: фото и «О товаре» слева друг под другом, покупка справа */
@media (max-width: 1199px) {
    body.adaptive .elementdetail.detail-modern {
        grid-template-columns: minmax(0, 1fr) 320px;
        gap: 24px;
    }

    body.adaptive .elementdetail.detail-modern > .pictures             { grid-column: 1; grid-row: 1; }
    body.adaptive .elementdetail.detail-modern > .detail-product__main { grid-column: 1; grid-row: 2; }
    body.adaptive .elementdetail.detail-modern > .detail-product__aside {
        grid-column: 2;
        grid-row: 1 / span 2;
    }
}

/* Телефоны и планшеты: одна колонка — фото, покупка, «О товаре» */
@media (max-width: 767px) {
    body.adaptive .elementdetail.detail-modern {
        grid-template-columns: minmax(0, 1fr);
        gap: 20px;
    }

    body.adaptive .elementdetail.detail-modern > .pictures             { grid-column: 1; grid-row: 1; }
    body.adaptive .elementdetail.detail-modern > .detail-product__aside { grid-column: 1; grid-row: 2; position: static; }
    body.adaptive .elementdetail.detail-modern > .detail-product__main { grid-column: 1; grid-row: 3; }

    body:has(.elementdetail.detail-modern) h1.pagetitle {
        font-size: 22px;
    }

    body.adaptive .elementdetail.detail-modern > .pictures {
        grid-template-columns: 52px minmax(0, 1fr);
        gap: 8px;
    }

    body.adaptive .elementdetail.detail-modern .pic {
        min-height: 300px;
        padding: 16px;
    }

    body.adaptive .elementdetail.detail-modern .pic img {
        max-height: 268px;
    }

    body.adaptive .elementdetail.detail-modern .pictures > .picslider.vertical,
    body.adaptive .elementdetail.detail-modern .pictures > .picslider.vertical .d_jscrollpane,
    body.adaptive .elementdetail.detail-modern .pictures > .picslider .sliderin {
        width: 52px;
    }

    body.adaptive .elementdetail.detail-modern .pictures > .picslider.vertical .d_jscrollpane {
        height: 300px;
    }

    body.adaptive .elementdetail.detail-modern .pictures > .picslider .scrollinner a {
        width: 52px;
        height: 52px;
    }

    body.adaptive .elementdetail.detail-modern .product-purchase-card,
    body.adaptive .elementdetail.detail-modern .product-delivery,
    body.adaptive .elementdetail.detail-modern .storesfull {
        padding: 16px;
    }

    body.adaptive .elementdetail.detail-modern .price-list__row--primary .price-list__values .price.gen {
        font-size: 28px;
    }

    body.adaptive .elementdetail.detail-modern .product-delivery.media {
        flex-direction: column;
    }

    /* Наличие уже показано карточкой складов выше — плашку не дублируем */
    body.adaptive .elementdetail.detail-modern .articleandstores > .stores {
        display: none;
    }

    body.adaptive .detailtabs.detailtabs--modern {
        margin-top: 28px;
    }

    body.adaptive .detailtabs.detailtabs--modern .headers {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 4px;
        margin-bottom: 14px;
        scrollbar-width: none;
    }

    body.adaptive .detailtabs.detailtabs--modern .headers::-webkit-scrollbar {
        display: none;
    }

    body.adaptive .detailtabs.detailtabs--modern .headers a {
        white-space: nowrap;
    }

    body.adaptive .detailtabs.detailtabs--modern .content {
        margin-top: 0;
    }

    body.adaptive .detailtabs.detailtabs--modern .content .switcher,
    body.adaptive .detailtabs.detailtabs--modern .content.selected .switcher {
        display: none;
    }

    body.adaptive .detailtabs.detailtabs--modern .contents .contentinner {
        padding: 20px 18px;
    }

    body.adaptive .detailtabs.detailtabs--modern .groupedprops td,
    body.adaptive .detailtabs.detailtabs--modern .groupedprops th {
        display: block;
        width: 100%;
        padding-right: 0;
        text-align: left;
    }

    body.adaptive .detailtabs.detailtabs--modern .groupedprops td:first-child {
        width: 100%;
        padding-bottom: 6px;
    }

    body.adaptive .detailtabs.detailtabs--modern .groupedprops td:last-child {
        padding-top: 0;
        text-align: left;
    }

    body.adaptive .detailtabs.detailtabs--modern .contents .content.files .contentinner {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* End */
/* /bitrix/templates/proopt_default/components/bitrix/catalog.element/gopro/style.css?179119253543270 */