/* Start:/local/templates/rumles/components/bitrix/catalog/main/style.css?17810372044514*/
.catalog_page {
  background: var(--gray-150);
}
/* Catalog list modal */
.catalog-list-modal .item .list-item-name .h5 {
  font-size: 1rem;
}

.catalog-list-modal .item .item-prices .prices {
  display: flex;
  align-items: flex-start;
  margin-bottom: 0.25rem;
}

.catalog-list-modal .item .item-prices .price-group {
  border-top: 0;
  padding-top: 0;
  margin-bottom: 0;
}

.catalog-list-modal .item .item-prices .price-matrix {
  display: block;
}

.catalog-list-modal .item .item-prices .price-group {
  order: 1;
  margin-right: 2.5rem;
  color: var(--gray-600);
}

.catalog-list-modal .item .item-prices .price-group:not(.min) {
  order: 2;
}

.catalog-list-modal .item .item-prices .price-name {
  margin-bottom: 0.25rem;
}

.catalog-list-modal .item .item-prices .price {
  display: flex;
  flex-wrap: nowrap;
  white-space: nowrap;
  align-items: center;
}

.catalog-list-modal .item .item-prices .price-group .price {
  font-size: 1.2rem;
  padding-top: 0.125rem;
}

.catalog-list-modal .item .item-prices .price-group .price .price-measure {
  font-size: 1rem;
}

.catalog-list-modal .item .item-prices .price-group:not(.min) .price {
  font-size: 1.325rem;
  font-weight: 600;
}

.catalog-list-modal .item .item-prices .price-group:not(.min) .price .price-measure {
  font-size: 1.25rem;
}

.catalog-list-modal .item .item-prices .price-alt {
  margin-top: 0.15rem;
}

.catalog-list-modal .item .item-prices .price-group .price-alt {
  font-size: 1rem;
}

.catalog-list-modal .item .item-prices .price-group:not(.min) .price-alt {
  font-size: 1rem;
}

.catalog-list-modal .item .item-prices .alt-price-note {
  position: absolute;
  right: 0;
  bottom: 0.75rem;
  font-size: 85%;
}

.catalog-list-modal .item .counter_wrapp .input-group > .form-control {
  padding: 0.325rem 0.6125rem;
  font-size: 0.875rem;
  line-height: 1.5;
}

.catalog-list-modal .item .counter_wrapp .input-group > .form-control:not(textarea),
.catalog-list-modal .item .counter_wrapp .input-group > .custom-select {
  height: calc(1.5em + 0.65rem + 2px);
}

.catalog-list-modal .item .counter_wrapp .btn {
  padding: 0.325rem 0.6125rem;
  font-size: 0.875rem;
  line-height: 1.5;
  border-radius: 0.425rem;
}

.catalog-list-modal .item .counter_wrapp .total_summ {
  text-align: center;
}

@media (max-width: 767px) {
  /* Catalog list modal */
  .expandables-modal-header .h3 {
    font-size: 1.15rem;
  }

  .expandables-modal-header .h5 {
    font-size: 1.075rem;
  }

  .expandables-modal-header .svg-icon-24,
  .expandables-modal-header .svg-icon-24 svg {
    width: 16px;
    height: 16px;
  }

  .catalog-list-modal .item:first-child > .item-container {
    padding-top: 0 !important;
    border-top: 0 !important;
  }

  .catalog-list-modal .item:last-child > .item-container {
    border-bottom: 0 !important;
  }

  .catalog-list-modal .item .counter_wrapp .row {
    flex: 0 0 100%;
    max-width: none;
  }

  .catalog-list-modal .item .counter_wrapp .total_summ {
    position: relative;
    flex: 0 0 100%;
    max-width: none;
    padding-left: 0;
    padding-top: 0.25rem;
    text-align: center;
  }
}


@media (max-width: 575px) {
  /* Catalog list modal */
  .expandables-modal-title.h4 {
    font-size: 1.25rem;
  }

  .catalog-list-modal .item .stock_wrapper {
    font-size: 0.925rem;
  }

  .catalog-list-modal .item .list-item-name .h5 {
    font-size: 1.075rem;
    font-weight: 400;
  }

  .catalog-list-modal .item .item-prices .prices {
    display: block;
    align-items: flex-start;
    margin-bottom: 0.25rem;
  }

  .catalog-list-modal .item .item-prices .price-group {
    margin-right: 0;
    margin-bottom: 0.45rem;
  }

  .catalog-list-modal .item .item-prices .price-name {
    margin-bottom: 0;
    line-height: 1.35;
  }

  .catalog-list-modal .item .item-prices .price-group .price {
    font-size: 1rem;
    padding-top: 0;
  }

  .catalog-list-modal .item .item-prices .price-group:not(.min) {
    margin-bottom: 0.25rem;
  }

  .catalog-list-modal .item .item-prices .price-group:not(.min) .price {
    font-size: 1.275rem;
    font-weight: 600;
  }

  .catalog-list-modal .item .counter_wrapp {
    margin-left: calc(-25% - 1.25rem + 1px) !important;
    margin-right: 0 !important;
  }
}


@media (max-width: 419px) {
  /* Catalog list modal */
  .catalog-list-modal .item .list-item-name .h5 {
    font-size: 1rem;
  }

  .catalog-list-modal .item .article_block {
    font-size: 0.9rem;
  }

  .catalog-list-modal .item .item-prices .price-name {
    font-size: 0.95rem;
  }
}

/* End */


/* Start:/local/templates/rumles/components/bitrix/catalog.element/main/style.css?178911935322185*/
/** Image carousel **/
.pg-slider.f-carousel {
  --f-carousel-spacing: 0;

  --f-button-width: 2.5rem;
  --f-button-height: 2.5rem;
  --f-button-border-radius: 0;

  --f-button-color: var(--gray-900);
  --f-button-hover-color: var(--primary);

  --f-button-bg: var(--white);
  --f-button-hover-bg: var(--white);
  --f-button-active-bg: var(--white);
  --f-button-border-radius: 0.5rem;

  --f-button-svg-width: 1.25rem;
  --f-button-svg-height: 1.25rem;

  --f-button-svg-stroke-width: 2;
  --f-button-svg-filter: none;

  --f-button-next-pos: 0.75rem;
  --f-button-prev-pos: 0.75rem;
}

.pg-slider .f-carousel__slide {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  overflow: visible;
}

.pg-slider .f-carousel__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pg-slider .f-carousel__nav {
  opacity: 0;
  transition: opacity 0.15s;
}

.pg-slider:hover .f-carousel__nav {
  opacity: 1;
}

.pg-thumbs.f-thumbs, .pg-thumbs-container {
  --f-thumb-width: 4rem;
  --f-thumb-height: 4rem;
  --f-thumb-border-radius: 0;

  --f-thumb-gap: 1rem;

  --f-thumb-opacity: 1;
  --f-thumb-border: 1px solid var(--gray-300);
  --f-thumb-selected-opacity:0.75;
  --f-thumb-selected-border: 1px solid var(--gray-500);

  --f-button-color: var(--gray-900);
  --f-button-hover-color: var(--primary);

  --f-button-bg: var(--secondary);
  --f-button-hover-bg: var(--secondary);
  --f-button-active-bg: var(--secondary);

  --f-button-width: calc(100% - 0.5rem);
  --f-button-height: 1.5rem;
  --f-button-svg-width: 1.5rem;
  --f-button-svg-height: 1.5rem;
  --f-button-border-radius: .425rem;
  --f-button-next-pos: 0.25rem;
  --f-button-prev-pos: 0.25rem;
}

.product-video-btn {
  width: var(--f-thumb-width);
  min-width: var(--f-thumb-width);
  height: var(--f-thumb-height);
  margin-bottom: var(--f-thumb-gap);
  background: #CDE1F2;
  border: 1px solid #BAD4EA;
  color: #5EADF6;
}

.pg-thumbs.f-thumbs .f-thumbs__slide__img {
  object-fit: contain;
}

.pg-thumbs.f-thumbs.is-horizontal .f-thumbs__track {
  padding: 0.5rem 0;
}

.pg-thumbs.f-thumbs.is-vertical {
  padding: 0;
}

.pg-thumbs.f-thumbs.is-vertical .f-button:disabled {
  display: none;
}

.pg-thumbs.f-thumbs .f-thumbs__slide__button {
  border: var(--f-thumb-border);
  border-radius: .3125rem;
}

.pg-thumbs.f-thumbs .is-nav-selected .f-thumbs__slide__button {
  border: var(--f-thumb-selected-border);
}

/** Prices **/
.product-main .item-prices {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.product-main .item-prices .price-group {
  max-width: 50%;
}

.product-main .item-prices .price-group:not(.min) {
  order: 1;
  margin-right: 2.5rem;
}

.product-main .item-prices .price-group.min {
  order: 2;
  color: var(--gray-600);
}

.product-main .item-prices .price-name {
  font-size: 1.125rem;
  font-weight: 500;
  margin-bottom: 0.5rem;
}

.product-main .item-prices .price-group .price {
  font-size: 1.95rem;
  display: flex;
  align-items: center;
  line-height: 2.65rem;
}

.product-main .item-prices .price-group .price .price_value {
  margin-right: 0.125rem;
}

.product-main .item-prices .price-group .price .price_currency,
.product-main .item-prices .price-group .price .price-measure {
  font-size: 1.35rem;
}

.product-main .item-prices .price-group .price-alt {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  font-size: 1.35rem;
}

.product-main .item-prices .price-group .price-alt .price_value {
  margin-right: 0.125rem;
}

.product-main .item-prices .alt-price-note {
  position: relative;
  font-size: 85%;
  flex: 0 0 100%;
  max-width: 100%;
  order: 3;
}

.product-main .item-prices .price-group:not(.min) .price,
.product-main .item-prices .price-group:not(.min) .price-alt {
  font-weight: 500;
}

.product-main .item-prices .price-group:not(.min) .price .price_value,
.product-main .item-prices .price-group:not(.min) .price-alt .price_value {
  font-weight: 700;
}

.product-main .counter_wrapp .total_summ {
  margin-top: 0.75rem;
  position: relative;
  text-align: center;
  width: 100%;
}

/* Properties */
.product-characteristics-top {
  font-size: 1.125rem;
}

.product-characteristics-top .item-stock-value.text-danger {
  font-size: 90%;
}

/* Bottom info */
.product-bottom-info-wrapper .tab-pane .content a {
  color: var(--primary);
  text-decoration: underline;
}

.product-bottom-info-wrapper .tab-pane-content img {
  max-width: 100%;
  height: auto;
}

.product-bottom-info-wrapper .tab-pane-content td img {
  max-width: 80%;
  height: auto;
}

.product-bottom-info-nav .nav-item .btn-light:not(:disabled):not(.disabled).active {
  color: var(--white) !important;
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
}

.product-stores-nav .nav-item .btn-light:not(:disabled):not(.disabled).active {
  color: var(--white);
  background-color: var(--primary);
  border-color: var(--primary);
}

.product-bottom-info-wrapper .properties-list .properties-item:first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

#stores-list > .h4:first-child {
  padding-top: 0 !important;
}

#stores-list > .store-block p {
  margin-bottom: 0.25rem;
}

#stores-map .bx-yandex-map {
  height: 568px;
}

.questions-container .question-item-btn .question-item-arrow {
  transition: all 0.2s linear;
}

.questions-container .question-item-btn:hover .question-item-arrow {
  background: var(--primary) !important;
  color: var(--white) !important;
}

.questions-container .question-item-btn[aria-expanded="true"] .question-item-arrow {
  background: var(--primary) !important;
  color: var(--white) !important;
  transform: rotate(180deg);
}

.product-bottom-info-wrapper .information-item {
  margin: 1.5rem 0;
}

.product-bottom-info-wrapper .information-item-btn {
  background: var(--gray-200);
  padding: 1rem 1.5rem;
  border-radius: 0.475rem;
}

.product-bottom-info-wrapper .information-item-btn[aria-expanded="true"] {
  background: transparent;
  border: 1px solid var(--gray-300);
  border-bottom: 0;
  border-radius: 0.475rem 0.475rem 0 0;
}

.product-bottom-info-wrapper .information-item-btn .information-item-arrow {
	transition: all 0.2s linear;
}

.product-bottom-info-wrapper .information-item-btn[aria-expanded="true"] .information-item-arrow {
  transform: rotate(180deg);
}

.product-bottom-info-wrapper .information-item-content.collapse,
.product-bottom-info-wrapper .information-item-content.collapsing {
  border: 1px solid var(--gray-300);
  border-top: 0;
  padding: 1rem 1.5rem 0.5rem;
  border-radius: 0 0 0.475rem 0.475rem;
}


@media (min-width: 992px) {
  .product-gallery.with-video .product-gallery-stickers {
    top: 0.125rem;
  }
}


@media (max-width: 1399px) {
  /** Prices **/
  .product-main .item-prices .price-name {
    font-size: 1.075rem;
  }

  .product-main .item-prices .price-group.min .price {
    font-size: 1.6125rem;
    line-height: 2.75rem;
    margin-top: 0.375rem;
  }

  .product-main .item-prices .price-group.min .price .price_currency, .product-main .item-prices .price-group.min .price .price-measure {
    font-size: 1.325rem;
  }

  .product-main .item-prices .price-group:not(.min) {
    margin-right: 2.5rem;
  }

  .product-main .item-prices .price-group:not(.min) .price {
    font-size: 2rem;
    line-height: 3.25rem;
  }

  .product-main .item-prices .price-group:not(.min) .price .price_currency, .product-main .item-prices .price-group:not(.min) .price .price-measure {
    font-size: 1.75rem;
  }

  /** Top info **/
  .product-shipping-info .h5,
  .product-pickup-info .h5 {
    font-size: 1rem;
  }

  .product-bottom-info-menu {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
}




@media (max-width: 991px) {
  /* Bottom info */
  #stores-map .bx-yandex-map {
    height: 450px;
  }
}


@media (max-width: 767px) {
  .detail_page #pagetitle {
    font-size: 2.125rem;
  }

  /** Image carousel **/
  .pg-thumbs.f-thumbs, .pg-thumbs-container {
    --f-thumb-gap: 0.75rem;
  }

  .pg-thumbs.f-thumbs .f-carousel__nav .f-button[disabled] {
    opacity: 0;
  }


  .pg-thumbs.f-thumbs.is-vertical {
    height: 19rem;
  }

  .pg-thumbs.f-thumbs.is-vertical .f-thumbs__track {
    justify-content: center;
  }

  /** Prices **/
  .product-main .item-prices .price-name {
    font-size: 1.125rem;
  }

  .product-main .item-prices .price-group.min .price {
    font-size: 1.225rem;
    display: flex;
    align-items: center;
    line-height: 2.25rem;
    margin-top: 0.6rem;
  }

  .product-main .item-prices .price-group.min .price .price_currency, .product-main .item-prices .price-group.min .price .price-measure {
    font-size: 1.125rem;
  }

  .product-main .item-prices .price-group:not(.min) {
    order: 1;
    margin-right: 2rem;
  }

  .product-main .item-prices .price-group:not(.min) .price {
    font-size: 1.7rem;
    line-height: 3rem;
  }

  .product-main .item-prices .price-group:not(.min) .price .price_currency, .product-main .item-prices .price-group:not(.min) .price .price-measure {
    font-size: 1.375rem;
  }

  .product-main .item-prices .price-group.min .price-alt {
    font-size: 1rem;
  }

  .product-main .item-prices .price-group:not(.min) .price-alt {
    font-size: 1rem;
  }

  .product-main .buy_block {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 600;
    border-radius: .425rem .425rem 0 0;
  }

  .product-main .counter_wrapp .row {
    order: 2;
  }

  .product-main .counter_wrapp .total_summ {
    margin-top: 0;
    margin-bottom: 0.5rem;
    order: 1;
  }
}


@media (max-width: 639px) {
  /* Bottom info */
  .product-stores-nav {
    width: 100%;
  }

  .product-stores-nav .nav-item {
    flex: 0 0 50%;
    min-width: 50%;
  }

  .product-stores-nav .nav-item .btn {
    width: 100%;
    display: block;
  }

  #stores-list .store-info-schedule {
    font-size: 90%;
  }

  #stores-list .store-info-note {
    font-size: 90%;
  }

  #stores-list > .store-block p {
    margin-bottom: 0.25rem;
  }

  #stores-map .bx-yandex-map {
    height: 400px;
  }

  .product-bottom-info-menu {
    margin-right: -15px;
  }

  .product-bottom-info-wrapper .information-item-btn {
    padding: 0.75rem 1rem;
  }

  .product-bottom-info-wrapper .information-item-btn .h5 {
    font-size: 1.1rem;
  }

  .product-bottom-info-wrapper .information-item-btn .information-item-arrow .svg-icon-26,
  .product-bottom-info-wrapper .information-item-btn .information-item-arrow .svg-icon-26 svg {
    width: 22px;
    height: 22px;
  }

  .product-bottom-info-wrapper .information-item-content.collapse,
  .product-bottom-info-wrapper .information-item-content.collapsing {
    padding: 0.25rem 1rem 0.5rem;
  }

  #installation .tab-content h4, #installation .tab-content .h4 {
    font-size: 1.25rem;
  }
}

@media (max-width: 575px) {
  .detail_page #pagetitle {
    font-size: 1.375rem;
  }

  /** Image carousel **/
  .product-gallery-info {
    font-size: 90%;
  }

  /** Top info **/
  .product-shipping-info .h5,
  .product-pickup-info .h5 {
    font-size: 1.05rem;
  }

  /* Bottom info */
  #stores-map .bx-yandex-map .ymaps-point-overlay svg {
    width: 32px;
    height: 32px;
  }
}

@media (max-width: 399px) {
  .product-bonuses .font-size-md {
    font-size: 1rem !important;
  }

  .product-main .item-prices .price-name {
    font-size: 1rem;
    margin-bottom: 0.25rem;
  }

  .product-main .item-prices .price-group.min {
    max-width: 45%;
  }

  .product-main .item-prices .price-group.min .price {
    font-size: 1.125rem;
    display: flex;
    align-items: center;
    line-height: 2.25rem;
    margin-top: 0;
  }

  .product-main .item-prices .price-group.min .price .price_currency, .product-main .item-prices .price-group.min .price .price-measure {
    font-size: 1.125rem
  }

  .product-main .item-prices .price-group:not(.min) {
    margin-right: 2rem;
    max-width: 55%;
  }

  .product-main .item-prices .price-group:not(.min) .price {
    font-size: 1.6rem;
    line-height: 2rem;
  }

  .product-main .item-prices .price-group:not(.min) .price .price_currency, .product-main .item-prices .price-group:not(.min) .price .price-measure {
    font-size: 1.6rem;
  }
}

@media (max-width: 379px) {
  .product-shipping-info .h5,
  .product-pickup-info .h5 {
    font-size: 1.075rem;
  }
}

@media (max-width: 359px) {
  .detail_page #pagetitle {
    font-size: 1.25rem;
  }

  /** Prices **/
  .product-main .item-prices .price-group:not(.min) {
    margin-right: 1rem;
  }

  /** Top info **/
  .product-mobile-fastlinks {
    font-size: 0.925rem;
  }
}

/* ============================================================
   Перелинковка товаров
   ------------------------------------------------------------
   Стандартное оформление своего CSS не имеет — оно целиком
   собрано на Bootstrap-классах в result_modifier.php. Здесь
   только описание под подписью и «Яркое» оформление, которое
   включается свойством товара LINK_STYLE.
   ============================================================ */

/* Описание под подписью в стандартном оформлении */
.properties-value-sub {
	margin-top: 1px;
	font-size: 11.5px;
	font-weight: 400;
	line-height: 1.2;
	opacity: .85;
}

/* «Яркое» оформление — выделенный блок-переключатель */
.product-links--bright {
	padding: 14px 16px;
	border: 1px solid var(--green-6);
	border-radius: 12px;
	background-color: var(--green-4);
}

.product-links__label {
	margin-bottom: 10px;
	color: var(--green-7);
	font-size: 12.5px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: .03em;
	text-transform: uppercase;
}

.product-links__group {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

/* Селекторы «таблеток» намеренно уточнены родителем .product-links__group:
   в теме есть правило a:not(.btn, .f-button) { border-color: currentColor }
   со специфичностью (0,1,1), которое иначе перебивает border-color ссылки
   и красит рамку в цвет текста вместо фирменного зелёного. */
.product-links__group .product-links__pill {
	flex: 1 1 130px;
	min-width: 0;
	padding: 9px 12px;
	border: 1.5px solid var(--green-6);
	border-radius: 9px;
	background-color: #fff;
	color: var(--gray-900);
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.25;
	text-align: center;
	text-decoration: none;
	transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}

.product-links__group a.product-links__pill:hover,
.product-links__group a.product-links__pill:focus {
	border-color: var(--primary);
	color: var(--gray-900);
	text-decoration: none;
}

.product-links__group .product-links__pill--active {
	border-color: var(--primary);
	background-color: var(--primary);
	color: #fff;
	cursor: default;
}

.product-links__group .product-links__pill--disabled {
	border-color: var(--gray-2);
	background-color: var(--gray-1);
	color: var(--gray-4);
	cursor: default;
}

.product-links__pill-title {
	display: block;
}

.product-links__pill-sub {
	display: block;
	margin-top: 2px;
	font-size: 11.5px;
	font-weight: 400;
	line-height: 1.2;
	opacity: .85;
}

/* Блок доставки: иконка-плитка (когда самовывоз скрыт) и обещание по срокам.
   Стилистика взята с новой страницы контактов — скруглённый квадрат
   с мягкой зелёной подложкой и иконкой цветом бренда. */
.product-shipping-info__ico {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: .625rem;
	background: var(--green-4);
	color: var(--primary);
}

.product-delivery-promise__ico {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 2rem;
	height: 2rem;
	border-radius: .5rem;
	background: var(--green-4);
	color: var(--primary);
}

.product-delivery-promise__title {
	color: var(--gray-900);
	font-size: .9375rem;
	font-weight: 600;
	line-height: 1.25;
}

.product-delivery-promise__text {
	color: var(--gray-4);
	font-size: .8125rem;
	line-height: 1.3;
}

/* ---------- Выбор расчёта в попапе калькулятора ----------
   Показывается, когда у товара есть и большой калькулятор, и простой
   пересчёт в штуки. Разметка — <template> в template.php, переключение —
   .js-calc-chooser-* в main.js. */

#product-calc-modal .calc-modal-content {
  transition: opacity .15s ease;
}

/* пока грузится выбранный калькулятор, текущий экран гаснет и не кликается */
#product-calc-modal .calc-modal-content.is-loading {
  opacity: .45;
  pointer-events: none;
}

/* Кнопка на месте крестика в попапе с выбором расчёта: по умолчанию крестик,
   с классом is-back (калькулятор открыт из выбора) — стрелка назад */
#product-calc-modal .calc-modal-nav .calc-modal-nav-back,
#product-calc-modal .calc-modal-nav.is-back .calc-modal-nav-close {
  display: none;
}

#product-calc-modal .calc-modal-nav.is-back .calc-modal-nav-back {
  display: block;
}

/* ---------- Поля попапов калькуляторов ----------
   Эталон — калькулятор обшивки: .calc-container добавляет 24px по бокам и
   снизу к полям контейнера попапа (px-3 pb-3), на экранах до 576px — только
   снизу. Экран выбора и простой калькулятор получают такие же поля, а шапка
   с кнопкой закрытия/назад — такой же отступ слева и справа, чтобы иконка
   стояла на одной линии с контентом. */
#product-calc-modal .calc-modal-header,
#simple-calc-modal .calc-modal-header {
  padding-left: calc(1rem + 24px);
  padding-right: calc(1rem + 24px);
}

#product-calc-modal .calc-chooser,
#product-calc-modal .simple-calc,
#simple-calc-modal .simple-calc {
  padding: 0 24px 24px;
}

@media (max-width: 576px) {
  #product-calc-modal .calc-modal-header,
  #simple-calc-modal .calc-modal-header {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  #product-calc-modal .calc-chooser,
  #product-calc-modal .simple-calc,
  #simple-calc-modal .simple-calc {
    padding: 0 0 24px;
  }
}

.calc-chooser {
  max-width: 640px;
}

.calc-chooser-title {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--gray-900, #1e1e1e);
}

.calc-chooser-sub {
  margin-top: 6px;
  font-size: 14px;
  color: var(--gray-600, #747474);
}

.calc-chooser-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 20px;
}

/* карточка расчёта: иконка, название с пояснением, стрелка */
.calc-chooser-item {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  padding: 18px 20px;
  border: 1.5px solid var(--gray-3, #d7d8d9);
  border-radius: 14px;
  background: var(--white, #fff);
  text-align: left;
  color: var(--gray-900, #1e1e1e);
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease, transform .06s ease;
}

.calc-chooser-item:hover,
.calc-chooser-item:focus {
  /* общее правило шаблона button:not(.btn):hover красит текст кнопок в
     тёмно-серый — у карточки цвет задан явно */
  border-color: var(--green-3, #528149);
  box-shadow: 0 4px 16px rgba(20, 134, 54, .10);
  color: var(--gray-900, #1e1e1e);
  outline: none;
}

/* общее правило шаблона button:not(.btn, .f-button) красит рамку кнопок в
   currentColor и по специфичности сильнее одного класса — цвет рамки
   задаём через id попапа */
#product-calc-modal .calc-chooser-item {
  border-color: var(--gray-3, #d7d8d9);
}

#product-calc-modal .calc-chooser-item:hover,
#product-calc-modal .calc-chooser-item:focus {
  border-color: var(--green-3, #528149);
}

.calc-chooser-item:active {
  transform: translateY(1px);
}

.calc-chooser-icon {
  flex: 0 0 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 12px;
}

.calc-chooser-icon--product {
  background: var(--green-4, #f1f6f2);
  color: var(--primary, #148636);
}

.calc-chooser-icon--simple {
  background: var(--gray-1, #f0f1f1);
  color: var(--gray-800, #393939);
}

.calc-chooser-text {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.calc-chooser-name {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
}

.calc-chooser-desc {
  font-size: 13px;
  line-height: 1.4;
  color: var(--gray-600, #747474);
}

.calc-chooser-arrow {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--gray-1, #f0f1f1);
  color: var(--gray-700, #5d5d5d);
  transition: background-color .18s ease, color .18s ease;
}

.calc-chooser-item:hover .calc-chooser-arrow,
.calc-chooser-item:focus .calc-chooser-arrow {
  background: var(--primary, #148636);
  color: var(--white, #fff);
}

@media (max-width: 575.98px) {
  .calc-chooser-title {
    font-size: 20px;
  }

  .calc-chooser-item {
    gap: 12px;
    padding: 14px;
  }

  .calc-chooser-icon {
    flex-basis: 44px;
    width: 44px;
    height: 44px;
  }

  .calc-chooser-name {
    font-size: 15px;
  }
}

/* End */


/* Start:/local/templates/rumles/components/bitrix/news.list/front_services/style.css?178282791037*/
.front-service-img {
  width: 30%;
}

/* End */
/* /local/templates/rumles/components/bitrix/catalog/main/style.css?17810372044514 */
/* /local/templates/rumles/components/bitrix/catalog.element/main/style.css?178911935322185 */
/* /local/templates/rumles/components/bitrix/news.list/front_services/style.css?178282791037 */