.product .product-cont .product-cont-shortdesc {
   padding-top: 0.5rem;
   padding-bottom: 0.5rem;
}
.product .product-cont .product-cont-infolist__el {
   margin-top: 1rem;
}

/* PDF Viewer Styles */
/* Hide PDF viewer by default - only show when instruction tab is active */
.product-tabs-header {
   display: flex;
   align-items: flex-end;
   border-bottom: 2px solid #04682C;
   margin-bottom: 0;
   padding-bottom: 0;
   overflow: visible; /* Prevent clipping */
}

.product-tabs-header__el {
   padding: 12px 25px;
   margin-right: 10px !important;
   font-size: 18px;
   font-weight: 700;
   color: #04682C;
   background: transparent;
   border: 2px solid #04682C;
   border-bottom: none;
   border-radius: 12px 12px 0 0;
   cursor: pointer;
   transition: all 0.3s ease;
   position: relative;
   bottom: -2px;
   white-space: nowrap;
}

.product-tabs-header__el:hover {
   background: rgba(4, 104, 44, 0.05);
   color: #034d21;
}

.product-tabs-header__el.active {
   background: #04682C;
   color: #fff;
}

/* Position download button at the right edge, slightly raised above green border */
#pdf-download-tab {
   margin-left: auto;
   margin-bottom: 0;
   position: relative;
   bottom: 3px;
   align-self: center;
}

#pdf-download-tab.btn--invert {
   color: #04682C;
   border-color: #04682C;
   background-color: #04682C;
}

.product-tabs-cont__el:not(.active) #pdf-viewer-wrap {
   display: none;
}

.product-tabs-cont__el.active #pdf-viewer-wrap {
   display: flex;
   flex-direction: column;
   align-items: center;
   width: 100%;
}

.product-tabs-cont__el-inner #pdf-viewer-wrap canvas {
   display: block;
   max-width: 100%;
   height: auto;
}

.product-tabs-cont__el-inner #pdf-viewer-wrap .page-pagination {
   margin-top: 24px;
}

.product-tabs-cont__el-inner #pdf-viewer-wrap .page-pagination .pagination {
   display: flex;
   justify-content: center;
   gap: 8px;
   flex-wrap: wrap;
}

.product-tabs-cont__el-inner #pdf-viewer-wrap .page-pagination .pagination-btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   min-width: 36px;
   height: 36px;
   padding: 0 8px;
   border: 1px solid #ddd;
   border-radius: 4px;
   background: #fff;
   color: #333;
   cursor: pointer;
   font-size: 14px;
   transition: all 0.2s;
}

.product-tabs-cont__el-inner #pdf-viewer-wrap .page-pagination .pagination-btn:hover {
   background: #f5f5f5;
   border-color: #bbb;
}

.product-tabs-cont__el-inner #pdf-viewer-wrap .page-pagination .pagination-btn--active {
   background: #2271b1;
   border-color: #2271b1;
   color: #fff;
}

.product-tabs-cont__el-inner #pdf-viewer-wrap .page-pagination .pagination-btn--disabled {
   opacity: 0.5;
   cursor: not-allowed;
}

.product-tabs .content-wrap {
   margin-right: 0;
   max-width: 100%;
}

.product-tabs .content-part {
   margin-left: 0;
}

.product-main {
   margin-bottom: 5rem;
}

.product-tabs-cont__el .articles-list {
   padding-top: 3rem;
}

.product-tabs-instruction .sidebar-instruction {
   padding-top: 2.5rem;
}

.recipe-orange {
   color: #CC0000;
}

.recipe-green {
   color: #04682C;
}

.product-tabs-cont {
   margin-top: 0;
}

.product-tabs-cont__el .stick-left {
   max-width: 100%;
}

.product-tabs-cont__el .step {
   padding-bottom: 2rem;
}

/* Головне фото препарату (single-products.php): було «90% ширини колонки» (до ~640px заввишки на 1920) →
   вкладки Опис/Інструкція/Статті ховались під банером «Самолікування». Висота тепер ще й обмежена висотою екрана. */
@media only screen and (min-width: 769px) {
    .product-slider__el-img {
        width: 100%; /* без цього aspect-ratio + max-height звужує блок і фото зсувається вліво */
        padding-bottom: 0;
        aspect-ratio: 10 / 9;
        max-height: max(30rem, calc(100vh - 47rem));
    }
    .product-slider__el-img img {
        -o-object-fit: contain;
           object-fit: contain;
    }
}

/* Компактніший правий стовпчик + вкладки ближче до фото, щоб «Опис / Інструкція / Статті» не ховались
   під банером «Самолікування» на ноутбуках (банер не чіпаємо). Лише десктоп. */
@media only screen and (min-width: 769px) {
    /* «Дозування: 25 мл» — підпис і значення в один рядок (було два рядки на кожен пункт) */
    .product .product-cont .product-cont-infolist__el {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-align: baseline;
            -ms-flex-align: baseline;
                align-items: baseline;
        gap: 0 .6rem;
        margin-top: .8rem;
    }
    .product .product-cont .product-cont-infolist__el p {
        margin: 0;
    }
    .product-tabs {
        margin-top: 3rem;
    }
}
