/* ==========================================================================
   responsive.css v2 — адаптация «Арендазавр» под планшеты и телефоны
   Подключать ПОСЛЕ styles.css и callme.css
   ========================================================================== */

/* 0. Общие правила ------------------------------------------------------- */
.main-content img,
.main-content-wrapper img { max-width: 100% !important; height: auto !important; }

ul.yiiPager { text-align: center; padding: 15px 0; }
ul.yiiPager li { display: inline-block; float: none; margin: 2px 3px; }

/* 1. <= 980px ------------------------------------------------------------ */
@media (max-width: 980px) {

    *, *:before, *:after { -webkit-box-sizing: border-box; box-sizing: border-box; }
    body { overflow-x: hidden; }

    /* Каркас: у float-элементов width:auto СЖИМАЕТСЯ до контента,
       поэтому явно float:none + width:100% */
    #container, #header_bg, #search, div.content, #homeheader,
    div.main-content, div.main-content-wrapper, .last-news-index, div.footer {
        float: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }
    div.content { padding: 0 12px; }
    div.main-content-wrapper { padding: 0 !important; }

    /* --- Шапка: плашки друг под другом, фон заменяем цветом
           (header_bg.png 960px на мобильном кропается) --- */
    #header_bg { height: auto !important; background: none !important; padding: 6px 0; margin-bottom: 15px; }
    #header_bg .hleft, #header_bg .hright {
        float: none !important; width: 100% !important;
        height: auto !important; min-height: 0 !important; overflow: visible !important;
        padding: 10px 12px !important; margin: 0 0 6px; text-align: center;
    }
    #header_bg .hleft  { background: #9ec7bb; border-radius: 4px; }
    #header_bg .hright { background: #d9ee5c; border-radius: 4px; }
    ul#nav, ul.fronMenu { float: none !important; }
    .hright ul.fronMenu li { float: none !important; display: inline-block; margin: 0 6px; }
    .hright ul.fronMenu li a { display: inline-block; padding: 2px 4px; }
    .dayAndTimeNow { margin: 0 !important; padding: 0 !important; line-height: 1.6 !important; font-size: 13px !important; }
    .logo { margin-bottom: 4px; }
    .logo a { line-height: 1.3; font-size: 26px; }
    .adr  { line-height: 1.4; font-size: 16px; }

    /* --- Меню: перенос пунктов --- */
    #search { float: none !important; height: auto !important; padding: 8px 10px !important; }
    #search ul.sf-menu { width: 100% !important; height: auto !important; }
    #search ul.sf-menu li { float: left !important; width: auto !important; }
    #search ul.sf-menu li a { padding: 6px 10px !important; font-size: 14px; }

    /* --- #homeheader: слайдер и форма столбиком --- */
    #homeheader { float: none !important; width: 100% !important; height: auto !important; }
    #homeheader .slider-wrapper { float: none !important; margin: 0 auto 15px !important; width: 100% !important; max-width: 496px; }
    #homeheader #slider { width: 100% !important; height: auto !important; }
    #homeheader img, #homeheader #slider img { float: none !important; width: 100% !important; max-width: 100% !important; height: auto !important; }
    #homeintro {
        float: none !important; width: 100% !important;
        height: auto !important; min-height: 0 !important;
        margin: 0 0 20px; padding: 10px !important;
    }

    /* --- Форма поиска: убираем высоты/флоаты/абсолюты --- */
    #homeintro div.searchform-back,
    #homeintro div.searchform-index,
    #homeintro div.index-header-form {
        float: none !important; width: 100% !important;
        height: auto !important; min-height: 0 !important;
        overflow: visible !important; position: static !important;
    }
    #homeintro div.header-form-line {
        height: auto !important; min-height: 0 !important;
        padding-top: 4px !important; margin: 0 0 8px; overflow: hidden;
    }
    #homeintro .header-form-line > span.search { float: none !important; height: auto !important; padding: 0 !important; }
    #homeintro .header-form-line > span.search:first-child { float: left !important; width: 132px; }
    #homeintro .header-form-line .width135 { width: 100% !important; margin-top: 5px; }
    #homeintro .header-form-line > span.search + span.search { float: none !important; display: block; width: auto !important; overflow: hidden; }

    /* Контролы на всю ширину; 16px — иначе iOS зумит при фокусе */
    #homeintro input, #homeintro select, #homeintro button { font-size: 16px; }
    #homeintro select.width290, #homeintro select.width285 { width: 100% !important; }
    #homeintro input.width70 { width: calc(100% - 34px) !important; }
    #homeintro button.ui-multiselect { width: 100% !important; text-align: left; }
    .ui-multiselect-menu { width: 96% !important; max-width: 340px !important; }
    .ui-multiselect-filter input { width: 55% !important; }

    /* Строка поиска */
    .search-term { float: none !important; display: block; width: 100% !important; height: auto !important; position: relative; }
    .search-term input[type="text"] { width: 100% !important; padding: 4px 40px 4px 6px !important; }
    .search-term input[type="submit"] { position: absolute !important; right: 2px !important; top: 50% !important; -webkit-transform: translateY(-50%); transform: translateY(-50%); margin: 0 !important; }

    /* Слайдеры цены/этажей */
    .default-search-select, .floor-search-select, .rooms-search-select,
    .price-search-select, .square-search-select { float: none !important; top: 0 !important; width: 100% !important; }
    #slider-range-price, #slider-range-floor { width: 100% !important; margin: 10px 0 6px; }
    .slider-price-currency, .slider-site-square { float: none !important; position: static !important; display: block; text-align: right; margin: -2px 0 4px; }

    /* Кнопки формы */
    #homeintro div.index-search-button-line { position: static !important; bottom: auto !important; right: auto !important; width: 100% !important; margin-top: 12px; }
    #more-options-link { display: none !important; }
    #btnleft.btnsrch, a.btnsrch {
        float: none !important; display: block !important; width: 100% !important; height: auto !important;
        padding: 10px 0 !important; font-size: 16px; text-align: center;
    }

    /* --- Карта и карточки --- */
    div.appartment_box { display: flex; flex-wrap: wrap; justify-content: space-between; }
    div.apartment_list_map { float: none !important; width: 100% !important; padding: 0 !important; }
    #googleMap, #ymap, #osmap { width: 100% !important; height: 300px !important; }
    div.appartment_item {
        float: none !important; width: 48.5%; margin: 0 0 15px !important;
        max-height: none !important; min-height: 0 !important; height: auto !important;
        overflow: visible !important;
    }

    /* --- Подвал --- */
    div.footer { float: none !important; width: 100% !important; height: auto !important; background-size: 100% 100%; }
    .footer p { margin: 15px 0 5px !important; }
    .footer p.slogan { font-size: 12px; }
}

/* 2. <= 767px ------------------------------------------------------------ */
@media (max-width: 767px) {

    /* Меню — вертикальный список */
    #search ul.sf-menu li { float: none !important; width: 100% !important; border-top: 1px solid rgba(255,255,255,.2); }
    #search ul.sf-menu li a { display: block; padding: 11px 8px !important; font-size: 15px; text-align: center; }

    /* Новости: столбик + снять высоту 25px/overflow, иначе заголовок обрезается */
    .last-news-index .last-news-item {
        float: none !important; width: 100% !important;
        height: auto !important; min-height: 0 !important; overflow: visible !important;
        margin: 0 0 8px;
    }
    .last-news-index .last-news-date,
    .last-news-index .last-news-title { float: none !important; display: block; width: auto !important; height: auto !important; overflow: visible !important; }

    /* Заголовок списка + переключатели вида */
    .title_list { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
    .title_list h2 { flex: 1 1 auto; float: none; font-size: 18px; margin: 0; }
    .change_list_show { float: none !important; margin-top: 5px; }

    /* «Заказать звонок» — усиленные селекторы против callme.css */
    div#callme, #callme {
        top: auto !important; bottom: 12px !important; right: 4px !important; left: auto !important;
        -webkit-transform: scale(.85); transform: scale(.85);
        -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%;
    }
    div#callmeform, #callmeform { right: 4px !important; left: auto !important; width: 272px !important; max-width: 94vw; }
    #callmeform input.text { width: 100% !important; }
}

/* 3. <= 600px — карточки в одну колонку ---------------------------------- */
@media (max-width: 600px) {
    div.appartment_item { width: 100% !important; }
    #googleMap, #ymap, #osmap { height: 240px !important; }
}

/* 4. <= 560px — форма: подпись НАД полем --------------------------------- */
@media (max-width: 560px) {
    #homeintro .header-form-line > span.search:first-child { float: none !important; width: 100% !important; }
    #homeintro .header-form-line .width135 { margin: 0 0 4px; }
    #homeintro .header-form-line > span.search + span.search { display: block; width: 100% !important; }
}

/* 5. <= 480px — карточка: фото над текстом ------------------------------- */
@media (max-width: 480px) {
    div.offer-photo { float: none !important; margin: 0 auto 10px !important; width: 160px; }
    div.offer-text  { float: none !important; width: auto !important; }
    .title_list { justify-content: center; }
    .title_list h2 { width: 100%; text-align: center; }
    .change_list_show { text-align: center; }
}

/* 6. <= 420px — страховка fancybox --------------------------------------- */
@media (max-width: 420px) {
    #fancybox-wrap { left: 4% !important; width: 92% !important; }
    #fancybox-content { width: auto !important; max-width: 100% !important; }
}

/* ==========================================================================
   7. Внутренние страницы: карточка объекта (/property/…)
   ========================================================================== */
@media (max-width: 980px) {

    /* --- Компактная форма поиска #search-form --- */
    #search-form, #search-form .searchform-back,
    #search-form .searchform, #search-form #search_form,
    #search-form #searchform-block.compact {
        float: none !important; width: 100% !important;
        height: auto !important; min-height: 0 !important;
        overflow: visible !important; position: static !important;
    }
    #search-form #search_form { padding: 10px !important; }
    #search-form .small-header-form-line { float: none !important; width: 100% !important; padding-bottom: 8px !important; }
    #search-form .small-header-form-line > span.search { float: none !important; height: auto !important; padding: 0 !important; }
    #search-form .small-header-form-line > span.search:first-child { float: left !important; width: 132px; }
    #search-form .small-header-form-line .width135 { width: 100% !important; margin-top: 5px; }
    #search-form .small-header-form-line > span.search + span.search { float: none !important; display: block; width: auto !important; overflow: hidden; }
    #search-form select.width290, #search-form select.width285 { width: 100% !important; }
    #search-form input.width70 { width: calc(100% - 34px) !important; }
    #search-form button.ui-multiselect { width: 100% !important; text-align: left; }
    #search-form .search-term { float: none !important; display: block; width: 100% !important; height: auto !important; position: relative; }
    #search-form .search-term input[type="text"] { width: 100% !important; padding: 4px 40px 4px 6px !important; }
    #search-form .search-term input[type="submit"] { position: absolute !important; right: 2px !important; top: 50% !important; -webkit-transform: translateY(-50%); transform: translateY(-50%); margin: 0 !important; }
    #search-form .index-search-form { float: none !important; top: 0 !important; width: 100% !important; }
    #search-form .slider-price-currency { float: none !important; position: static !important; display: block; text-align: right; margin: -2px 0 4px; }
    #more-options-link-inner { display: none !important; }
    #search-form .inner-search-button-line { position: static !important; bottom: auto !important; right: auto !important; width: 100% !important; margin: 4px 0 0; }
    #search-form #btnleft { float: none !important; display: block !important; width: 100% !important; height: auto !important; margin: 0 !important; padding: 10px 0 !important; font-size: 16px; text-align: center; }

    /* Хлебные крошки (height:40px + overflow:hidden обрезали длинный путь) */
    .breadcrumbs { height: auto !important; overflow: visible !important; padding-top: 6px !important; }

    /* --- .apartment-description: колонка «фото → цена/кнопки → миниатюры → контакт» --- */
    .apartment-description { position: relative; min-height: 0 !important; display: flex; flex-direction: column; }
    .apartment-description .viewapartment-main-photo { position: relative; float: none !important; margin: 0 0 15px !important; order: 1; text-align: center; }
    .apartment-description .apartment_type { top: 0; left: 0; }
    .apartment-description .viewapartment-description-top { float: none !important; width: auto !important; padding: 0 !important; order: 2; }
    .apartment-description .images-area { order: 3; }
    .apartment-description .apartment-user-info { position: static !important; width: 100% !important; order: 4; margin: 15px 0 0; }
    .apartment-user-info .user-info-ava { float: none !important; width: auto !important; text-align: center; }
    .apartment-user-info .user-ava { float: none !important; display: inline-block; }
    .apartment-user-info .user-info-right { position: static !important; width: 100% !important; }
    .apartment-user-info .user-info-ul li { margin: 0 0 4px; }
    #owner-phone { position: static !important; left: auto !important; top: auto !important; }

    /* --- .viewapartment-description: характеристики и QR --- */
    .viewapartment-description .qrcode { float: none !important; text-align: center; padding: 0 0 10px !important; }
    dl.ap-descr dt { float: none !important; width: auto !important; margin: 8px 0 0; padding: 0 !important; font-weight: bold; }
    dl.ap-descr dd { margin-left: 0 !important; padding: 0 0 6px !important; }
    #tab_1 { min-height: 0 !important; }

    /* --- «Похожие объявления»: карусель → горизонтальный скролл пальцем --- */
    .jcarousel-container { width: 100% !important; }
    .jcarousel-clip { width: 100% !important; overflow-x: auto !important; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
    #mycarousel { width: auto !important; left: 0 !important; display: flex; }
    #mycarousel li { float: none !important; flex: 0 0 auto; width: 160px !important; margin: 0 12px 0 0; }
    .jcarousel-prev, .jcarousel-next,
    .jcarousel-prev-disabled, .jcarousel-next-disabled { display: none !important; }
}

/* Форма карточки: подпись над полем на узких экранах */
@media (max-width: 560px) {
    #search-form .small-header-form-line > span.search:first-child { float: none !important; width: 100% !important; }
    #search-form .small-header-form-line .width135 { margin: 0 0 4px; }
    #search-form .small-header-form-line > span.search + span.search { width: 100% !important; }
}