/*
Theme Name: Houzez Child
Theme URI: http://www.favethemes.com/
Author: Favethemes
Author URI: http://www.favethemes.com/
Description: Houzez is a premium WordPress theme for real estate agents where modern aesthetics are combined with tasteful simplicity, and where the ease of use is achieved without compromise in your ability to customise the design. Whether you are a real estate agent looking to build a website for your company or a web developer seeking a perfect WordPress theme for your next project, you are certain to appreciate the numerous features and benefits that our theme provides.
Version: 1.0
Tags: white, right-sidebar, left-sidebar, custom-colors, custom-menu, featured-images, post-formats, theme-options, translation-ready
License: GNU General Public License version 3.0
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: houzez
Template: houzez
*/


@import url("../houzez/style.css");

/* Your CSS code goes here
-------------------------------------- */
@media (max-width: 767px) {
  .article-detail .d-flex.align-items-center.justify-content-between {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .article-detail .d-flex.align-items-center.justify-content-between .d-flex.align-items-center {
    flex-wrap: wrap;
  }

  .article-detail .article-meta {
    text-align: left;
    width: 100%;
  }
}

@media (max-width: 767px) {
  .item-footer {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 4px;
  }

  .item-footer .item-date {
    margin-left: 0 !important;
  }
}

/* Плавное появление Lazy-Load картинок (WP Rocket) */
img[data-lazy-src],               /* пока ещё загружаются */
img[data-lazy-srcset] {
    opacity: 0;
    /* лёгкое масштабирование/blur, чтобы убрать «рывок» */
    transform: scale(1.03);
    filter: blur(10px);
    transition: opacity .35s ease-out,
                transform .6s ease-out,
                filter .6s ease-out;
}

img.lazyloaded {                  /* когда картинка готова */
    opacity: 1;
    transform: scale(1);
    filter: blur(0);
}

/* Тройной курс валют - рубли, баты, доллары */
.nlp-price-wrap { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.nlp-currency-switcher { display:flex; gap:6px; }
.nlp-currency-switcher--inline { margin-left: auto; }
.nlp-curr-btn {
  border:1px solid #e5e7eb; background:#fff; padding:4px 8px; border-radius:6px;
  font: 500 12px/1.2 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  cursor:pointer;
}
.nlp-curr-btn.is-active { border-color:#111827; background:#111827; color:#fff; }


/* Снижаем размер H1 в шапке объекта до 20px */

.page-title-wrap .page-title h1 {
    font-size: 20px !important;
    line-height: 1.2;
}
/* Мобайл — сделать 20px */
@media (max-width: 767.98px) {
  .property-price-wrap .item-price,
  .property-price-wrap .item-price .price {
    font-size: 20px !important;
    line-height: 1.2;
  }
}

/* ===== MOBILE: цена слева, свитчер справа ===== */
@media (max-width: 767.98px) {
  /* Контейнер цены — в строку */
  .property-price-wrap,
  .page-title-wrap .item-price-wrap {
    display: flex !important;
    align-items: center;
    justify-content: space-between; /* ← цена … свитчер → */
    gap: 10px;
    width: 100%;
  }

  /* Снимаем у списка правое выравнивание (Bootstrap .text-end) */
  .property-price-wrap ul.list-unstyled,
  .page-title-wrap .item-price-wrap ul.list-unstyled,
  .property-price-wrap ul[class*="text-end"],
  .page-title-wrap .item-price-wrap ul[class*="text-end"] {
    text-align: left !important;
    margin: 0;
  }

  /* Сам элемент с ценой — слева и тянется */
  .property-price-wrap .item-price,
  .page-title-wrap .item-price-wrap .item-price {
    text-align: left !important;
    white-space: nowrap;
    flex: 1 1 auto;
    font-size: 20px !important;   /* ваш мобильный размер */
    line-height: 1.2 !important;
    margin: 0 !important;
  }

  /* Свитчер — строго справа, не сжимать */
  .property-price-wrap .nlp-currency-switcher,
  .page-title-wrap .item-price-wrap .nlp-currency-switcher {
    margin-left: auto !important;
    display: inline-flex !important;
    gap: 6px;
    flex: 0 0 auto;
  }
}