.container {
	max-width:1600px !important;
}

.theme__button,
.product-page__choose-link {
	border-radius:10px;
}

.product-page__name {
	font-size:28px;
}

.product-page__price-title {
	font-size: 18px;
	color:#000;
	font-weight:400;
	padding-right:6px;
}

div.product-page__add-info {
	padding:0;
}

.product-page__specifications {
	margin-bottom:0;
}

.product-page__quiz-button {
	max-width:300px;
	border-radius: 10px;
}

.product-page__quiz-text {
	/*font-size: 13px;*/
	color: #48545a;
	margin-top: 8px;
}

.product-page__features {
	display: flex;
    padding: 20px 0px;
    gap: 20px;
    flex-direction: column;	
}

.product-page__features li {
	display: flex;
	gap: 8px;
	/*color: #0f766e;*/
}

.slick-vertical img {
	width:130px !important;
	border-radius:10px;
	border:1px solid #f1f1f1 !important;
	margin-bottom:10px;
}

.slick-vertical .slick-current {
	border:1px solid #d3d3d3 !important;
}

@media (max-width:768px) {
	.product-page__nav-slider .slick-track {
		display:flex;
		flex-wrap:wrap;
		gap:10px;
		height:auto !important;
	}
	
	.product-page__nav-slider .slick-track img {
		flex:1;
		height:130px;
	}
	
	div.product-page__gallery {
		flex-direction: column-reverse;
	}
	
	div.product-page__nav-slider,
	div.product-page__main-slider{
		width:100% !important;
	}

	.slick-list {
		height:auto !important;
	}

	.side-panel-content {
		flex-direction: column;
	}

	.lens-quiz__left,
	.lens-quiz__right {
		width:100% !important;
	}

	.lens-quiz__left {
		height:300px;
	}
	
}

/*
===================================
Боковая панель (КВИЗ)
===================================
*/

.cart-item__name .variation {
	display:block !important;
}

.side-panel {
	position: fixed;
	top: 0;
	right: -100%;
	width: 100%;
	max-width: 100%;
	height: 100vh;
	background: #fff;
	z-index: 9999;
	transition: right 0.3s ease;
}

.side-panel.is-open {
	right: 0;
}

/*
===================================
Правка слайдера товара
===================================
ПК: оставляем миниатюры слева, но добавляем счетчик фото.
Мобила: скрываем сетку миниатюр под фото, чтобы быстрее показать название, цену и кнопки.
*/

.product-page__main-slider {
	position: relative;
}

.os-product-gallery-counter {
	position: absolute;
	left: 50%;
	top: 14px;
	bottom: auto;
	transform: translateX(-50%);
	z-index: 5;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 58px;
	height: 34px;
	padding: 0 12px;
	border: 1px solid #e1e4e8;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.94);
	color: #1c1c1c;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
	pointer-events: none;
}

.os-product-gallery-arrow {
	position: absolute;
	top: 50%;
	z-index: 6;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border: 1px solid #e1e4e8;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	color: #1c1c1c;
	font-size: 30px;
	font-weight: 400;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
	transform: translateY(-50%);
}

.os-product-gallery-arrow--prev {
	left: 14px;
}

.os-product-gallery-arrow--next {
	right: 14px;
}

@media screen and (max-width: 768px) {
	div.product-page__gallery {
		/* Оставляем старую рабочую механику: главное фото сверху, миниатюры под ним. */
		flex-direction: column-reverse !important;
	}

	div.product-page__nav-slider {
		display: none !important;
		width: 100% !important;
	}

	div.product-page__main-slider {
		width: 100% !important;
	}

	.product-page__main-slider .slick-track {
		height: calc(100vw - 40px) !important;
	}

	.product-page__main-slider img {
		object-fit: cover;
	}

	.os-product-gallery-counter {
		top: 12px;
		min-width: 54px;
		height: 32px;
		font-size: 13px;
	}

	.os-product-gallery-arrow {
		width: 34px;
		height: 34px;
		font-size: 26px;
	}

	.os-product-gallery-arrow--prev {
		left: 10px;
	}

	.os-product-gallery-arrow--next {
		right: 10px;
	}
}

.overlay {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.5);
	opacity: 0;
	pointer-events: none;
	transition: opacity .3s;
	z-index: 9998;
}

.overlay.is-active {
	opacity: 1;
	pointer-events: auto;
}

.side-panel-content {
	display: flex;
	height: 100vh;
}

.lens-quiz__left {
	width: 60%;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}

.lens-quiz__left img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.lens-quiz__right {
	width: 40%;
	padding: 40px;
	overflow-y: auto;
}

#scenario-list button,
#no-recipe-lens-list button,
#recipe-lens-list button,
#thickness-list button {
	/*display: block;*/
	display:flex;
	justify-content:space-between;
	align-items:center;
	width: 100%;
	min-height:100px;
	font-size:18px;
	margin-bottom: 12px;
	padding: 16px;
	border: 1px solid #ddd;
	background: #fff;
	cursor: pointer;
	text-align: left;
	border-radius:10px;
}

#photochrom-list button {
	display: block;
	width: 100%;
	margin-bottom: 12px;
	padding: 16px;
	border: 1px solid #ddd;
	background: #fff;
	cursor: pointer;
	text-align: left;
	border-radius:10px;
}

.quiz-option__price {
	font-weight:700;
}

.quiz-option__content .quiz-option__title {
	text-transform:uppercase;
	font-weight:500;
	padding-bottom:15px;
}



.quiz-header{
	display:flex;
	align-items:center;
	gap:12px;
	margin-bottom:16px;
}

.quiz-nav{
	width:40px;height:40px;
	border:1px solid #ddd;
	border-radius:999px;
	background:#fff;
	font-size:22px;
	line-height:1;
	cursor:pointer;
}

.quiz-progress{
	flex:1;
	height:6px;
	background:#e9e9e9;
	border-radius:999px;
	overflow:hidden;
}

.quiz-progress__bar{
	height:100%;
	width:0%;
	background:#000;
	transition: width .2s ease;
}

.quiz-summary{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:12px;
	margin:12px 0 18px;
}

.quiz-total{
	font-size:16px;
	font-weight:600;
}

#rx_sph_os,
#rx_cyl_os,
#rx_axis_os,
#rx_sph_od,
#rx_cyl_od,
#rx_axis_od {
	padding:10px 15px;
	border-radius:10px;
}

#rx_pd {
	padding: 10px 15px;
	border-radius: 10px;
	border: 1px solid #d3d3d3;
}

/* =========================
   LENS QUIZ — option layout
   (price pinned to the right)
========================= */

#lens-quiz .quiz-option{
  display: grid;                    /* вместо flex */
  grid-template-columns: 1fr auto;  /* слева текст, справа цена */
  gap: 12px;
  align-items: start;
}

#lens-quiz .quiz-option__content{
  min-width: 0;                     /* важно: иначе длинные слова могут ломать сетку */
}

#lens-quiz .quiz-option__price{
  width: 72px;                      /* можно 64–90, подбери визуально */
  text-align: right;
  white-space: nowrap;
  font-weight: 700;
  line-height: 1.1;
}

/* Чуть лучше типографика внутри карточки */
#lens-quiz .quiz-option__title{
  display: block;
  margin: 0 0 6px;
  text-transform: uppercase;
  font-weight: 600;
}

#lens-quiz .quiz-option__desc{
  margin: 0;
  font-size: 14px;
  line-height: 18px;
  color: #48545a;
}


/* =========================
   LENS QUIZ — SCENARIO buttons (make text not pale)
========================= */
#lens-quiz #scenario-list button{
  color:#111;              /* убрать блеклость */
  font-weight:600;         /* как заголовок */
  font-size:18px;
  line-height:1.25;
  letter-spacing:0;
}

/* На мобиле можно чуть меньше */
@media (max-width:768px){
  #lens-quiz #scenario-list button{
    font-size:16px;
  }
}


/* =========================
   LENS QUIZ — RECIPE UPLOAD (новый стиль рецепта добавки )
========================= */

/* 1) Радио-выбор как карточки */
#lens-quiz [data-step="recipe-upload"] > label{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:12px;

  width:100%;
  min-height:70px;

  margin:0 0 12px 0;
  padding:16px;

  border:1px solid #ddd;
  border-radius:10px;
  background:#fff;
  cursor:pointer;
  box-sizing:border-box;
}

/* убрать <br> разрывы на этом шаге */
#lens-quiz [data-step="recipe-upload"] br{ display:none; }

/* радио аккуратно */
#lens-quiz [data-step="recipe-upload"] input[type="radio"]{
  width:18px;
  height:18px;
  margin:0;
}

/* подсветка выбранного варианта */
#lens-quiz [data-step="recipe-upload"] label:has(input[type="radio"]:checked){
  border-color:#000;
}

/* 2) Блок загрузки файла — тоже в стиле карточки */
#recipe-file-block{
  margin: 8px 0 0;
}

#recipe-file{
  width:100%;
  min-height:56px;
  padding:14px 16px;
  border:1px solid #ddd;
  border-radius:10px;
  background:#fff;
  box-sizing:border-box;
}

/* 3) Ручной ввод: убрать инлайновую “кашу” и сделать аккуратно */
#recipe-manual-block{
  margin-top: 14px;
  padding:16px;
  border:1px solid #ddd;
  border-radius:10px;
  background:#fff;
}

/* заголовки OD/OS/PD в одном стиле */
#recipe-manual-block h3{
  margin:16px 0 10px !important;
  font-size:16px;
  font-weight:700;
  text-transform:uppercase;
}

/* строки OD/OS */
#recipe-manual-block .rx-row{
  display:flex !important;
  gap:12px !important;
  flex-wrap:wrap;
}

/* подписи и поля */
#recipe-manual-block label{
  display:flex !important;
  flex-direction:column !important;
  gap:6px !important;
  min-width:120px;
}

#recipe-manual-block select,
#recipe-manual-block input{
  height:44px;
  border:1px solid #ddd;
  border-radius:10px;
  padding:0 12px;
  box-sizing:border-box;
  background:#fff;
}

/* PD поле */
#recipe-manual-block #rx_pd{
  height:44px;
}

/* 4) Кнопка — привести к общему стилю (без гуляний) */
#recipeSubmitBtn{
  display:inline-block;
  width:100%;
  max-width:320px;
  height:50px;

  border-radius:10px !important;
  padding:0 18px !important;

  border:none !important;
  background:#000 !important;
  color:#fff !important;

  font-weight:700;
  cursor:pointer;
}

/* На мобиле — кнопка во всю ширину */
@media (max-width:768px){
  #recipeSubmitBtn{
    max-width:100%;
  }
}

#lens-quiz #recipe-file{
  width:100%;
  padding:14px;
  border:1px solid #ddd;
  border-radius:12px;
  background:#fff;
}
