/*
 * Tulia Real Estate — Responsive Fixes
 * Covers: Mobile (320–575px), Tablet (576–991px), Desktop (992px+)
 * Drop this file into assets/css/ and enqueue via functions.php
 */

/* ============================================================
   GLOBAL FIXES
   ============================================================ */

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
}

body {
  overflow-x: hidden;
  max-width: 100vw;
}

img,
video,
iframe,
embed,
object {
  max-width: 100%;
  height: auto;
}

/* Prevent long words / URLs from breaking layout */
p, li, td, th, span, a {
  word-break: break-word;
  overflow-wrap: break-word;
}

/* ============================================================
   CONTAINER FIXES
   ============================================================ */

@media (max-width: 575px) {
  .container,
  .container-fluid,
  .container-sm {
    padding-left: 15px;
    padding-right: 15px;
  }

  .row {
    margin-left: -10px;
    margin-right: -10px;
  }

  .row > * {
    padding-left: 10px;
    padding-right: 10px;
  }
}

/* ============================================================
   HEADER — LAYOUT 1
   ============================================================ */

/* Tablet */
@media (max-width: 991px) {
  .header-layout1 .header-top {
    padding: 10px 15px;
    text-align: center;
  }

  .header-layout1 .logo-bg {
    display: none;
  }

  .header-layout1 .header-top:before {
    display: none;
  }

  .header-links {
    justify-content: center;
    flex-wrap: wrap;
  }

  .header-links ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px 20px;
  }

  .header-links li:not(:last-child) {
    margin: 0;
  }

  .header-links li:not(:last-child):after {
    display: none;
  }

  .header-logo img {
    max-width: 180px;
  }

  .main-menu {
    display: none;
  }

  .themeholy-menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

/* Mobile */
@media (max-width: 575px) {
  .header-layout1 .header-top {
    padding: 8px 15px;
    font-size: 13px;
  }

  .header-links li {
    font-size: 13px;
  }

  .header-links li:nth-child(n+2) {
    display: none;
  }

  .header-logo img {
    max-width: 140px;
  }

  .header-logo {
    padding-top: 12px;
    padding-bottom: 12px;
  }
}

@media (max-width: 375px) {
  .header-logo img {
    max-width: 120px;
  }
}

/* ============================================================
   MOBILE MENU
   ============================================================ */

.themeholy-menu-wrapper {
  z-index: 999999;
}

.themeholy-menu-area {
  overflow-y: auto;
}

@media (max-width: 575px) {
  .themeholy-menu-wrapper .themeholy-menu-area {
    max-width: 100%;
    width: 100%;
  }

  .themeholy-mobile-menu > ul {
    padding: 0 16px;
  }
}

/* ============================================================
   HERO SECTION
   ============================================================ */

.themeholy-hero-wrapper {
  position: relative;
  overflow: hidden;
}

/* Ensure hero background covers full area */
.themeholy-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.themeholy-hero-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Hero overlay — ensure content is above background */
.hero-style1,
.hero-style2,
.hero-style3 {
  position: relative;
  z-index: 5;
}

/* Large tablet */
@media (max-width: 1199px) {
  .hero-style1 {
    max-width: 100%;
    padding: 140px 0;
  }
}

/* Tablet */
@media (max-width: 991px) {
  .hero-style1 {
    padding: 100px 0;
    text-align: center;
    margin: 0 auto;
    max-width: 100%;
  }

  .hero-style1 .btn-group {
    justify-content: center;
  }

  .hero-style1 .hero-text {
    margin-left: auto;
    margin-right: auto;
    max-width: 520px;
  }

  .hero-title {
    font-size: 46px;
    line-height: 1.2;
  }

  .hero-1 .icon-box {
    display: none;
  }

  .hero-2 .icon-box {
    display: none;
  }
}

/* Small devices */
@media (max-width: 767px) {
  .hero-style1 {
    padding: 80px 0;
  }

  .hero-title {
    font-size: 38px;
    line-height: 1.25;
  }

  .hero-subtitle {
    font-size: 16px;
    margin-bottom: 10px;
  }

  .hero-text {
    font-size: 15px;
    margin-bottom: 28px;
  }
}

/* Extra small */
@media (max-width: 575px) {
  .hero-style1 {
    padding: 65px 0;
  }

  .hero-title {
    font-size: 30px;
    line-height: 1.3;
  }

  .hero-subtitle {
    font-size: 14px;
  }

  .hero-text {
    font-size: 14px;
    padding-right: 0 !important;
    margin-bottom: 24px;
  }

  .hero-text p {
    font-size: 14px;
  }

  .hero-title:last-of-type {
    margin-bottom: 14px;
  }
}

@media (max-width: 375px) {
  .hero-title {
    font-size: 26px;
  }

  .hero-style1 {
    padding: 55px 0;
  }
}

/* ============================================================
   BUTTONS
   ============================================================ */

@media (max-width: 575px) {
  .themeholy-btn {
    padding: 12px 24px;
    font-size: 14px;
  }

  .btn-group {
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
  }

  .btn-group > * {
    margin: 0 !important;
  }
}

/* ============================================================
   BREADCRUMB / PAGE HEADER
   ============================================================ */

@media (max-width: 767px) {
  .breadcumb-wrapper {
    padding: 50px 0;
  }

  .breadcumb-title {
    font-size: 28px;
  }

  .breadcumb-menu {
    font-size: 14px;
  }
}

@media (max-width: 575px) {
  .breadcumb-wrapper {
    padding: 40px 0;
  }

  .breadcumb-title {
    font-size: 24px;
  }
}

/* ============================================================
   PROPERTY / LISTING CARDS
   ============================================================ */

@media (max-width: 991px) {
  .property-card,
  .listing-card,
  .estate-card,
  [class*="property-box"],
  [class*="property-item"],
  [class*="listing-item"],
  [class*="estate-item"] {
    margin-bottom: 24px;
  }
}

@media (max-width: 767px) {
  .property-card img,
  .listing-card img,
  [class*="property-box"] img,
  [class*="property-item"] img {
    width: 100%;
    height: 220px;
    object-fit: cover;
  }
}

@media (max-width: 575px) {
  .property-card img,
  [class*="property-item"] img {
    height: 190px;
  }
}

/* ============================================================
   SECTION SPACING
   ============================================================ */

@media (max-width: 991px) {
  :root {
    --section-space: 80px;
    --section-space-mobile: 60px;
    --section-title-space: 40px;
  }

  .space,
  .space-top {
    padding-top: var(--section-space-mobile);
  }

  .space,
  .space-bottom {
    padding-bottom: var(--section-space-mobile);
  }
}

@media (max-width: 575px) {
  :root {
    --section-space-mobile: 50px;
    --section-title-space: 30px;
  }
}

/* ============================================================
   SECTION TITLES
   ============================================================ */

@media (max-width: 767px) {
  .sec-title,
  .section-title,
  [class*="sec-title"],
  [class*="section-title"] {
    font-size: 26px;
  }

  .sub-title,
  .sec-subtitle {
    font-size: 14px;
  }
}

@media (max-width: 575px) {
  .sec-title,
  .section-title,
  [class*="sec-title"] {
    font-size: 22px;
  }

  .title-area,
  .sec-title-wrap {
    margin-bottom: 30px;
  }
}

/* ============================================================
   FEATURE / SERVICE BOXES
   ============================================================ */

@media (max-width: 767px) {
  .feature-card,
  .service-card,
  [class*="feature-item"],
  [class*="service-item"],
  [class*="service-box"] {
    padding: 24px 20px;
    text-align: center;
    margin-bottom: 20px;
  }

  .feature-card .icon-box,
  .service-card .icon-box,
  [class*="service-box"] .icon-box {
    margin: 0 auto 16px;
  }
}

/* ============================================================
   ABOUT SECTION
   ============================================================ */

@media (max-width: 991px) {
  .about-img,
  [class*="about-image"],
  [class*="about-thumb"] {
    margin-bottom: 40px;
    text-align: center;
  }

  .about-img img,
  [class*="about-image"] img {
    max-width: 100%;
    height: auto;
  }
}

@media (max-width: 575px) {
  .about-img {
    margin-bottom: 30px;
  }

  [class*="about-content"] {
    text-align: center;
  }
}

/* ============================================================
   COUNTER / STATS
   ============================================================ */

@media (max-width: 767px) {
  [class*="counter-card"],
  [class*="counter-box"],
  [class*="fact-box"] {
    text-align: center;
    padding: 24px 16px;
    margin-bottom: 20px;
  }

  [class*="counter-number"],
  [class*="count-number"],
  [class*="fact-number"] {
    font-size: 36px;
  }
}

/* ============================================================
   TEAM SECTION
   ============================================================ */

@media (max-width: 767px) {
  [class*="team-card"],
  [class*="team-item"] {
    margin-bottom: 24px;
  }

  [class*="team-card"] img,
  [class*="team-item"] img {
    width: 100%;
    height: auto;
  }
}

/* ============================================================
   TESTIMONIALS
   ============================================================ */

@media (max-width: 767px) {
  [class*="testi-card"],
  [class*="testimonial-card"],
  [class*="review-card"] {
    padding: 24px 20px;
    text-align: center;
  }

  [class*="testi-author"],
  [class*="testimonial-author"] {
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }
}

/* ============================================================
   BLOG / NEWS CARDS
   ============================================================ */

@media (max-width: 767px) {
  .blog-card,
  [class*="blog-item"],
  [class*="post-card"],
  [class*="news-card"] {
    margin-bottom: 30px;
  }

  .blog-card img,
  [class*="blog-item"] img {
    width: 100%;
    height: 220px;
    object-fit: cover;
  }

  [class*="blog-content"],
  [class*="post-content"] {
    padding: 20px 18px;
  }
}

/* ============================================================
   CONTACT PAGE
   ============================================================ */

@media (max-width: 991px) {
  .contact-form,
  [class*="contact-form"],
  .contact-info-wrap {
    margin-bottom: 40px;
  }
}

@media (max-width: 767px) {
  .contact-form select,
  .contact-form .form-control,
  .contact-form textarea,
  .contact-form input {
    height: 50px;
    font-size: 15px;
    padding: 0 18px;
  }

  .contact-form textarea {
    height: 130px;
    padding: 14px 18px;
  }

  [class*="contact-info-item"],
  [class*="contact-box"] {
    margin-bottom: 20px;
    padding: 20px 16px;
    text-align: center;
  }

  [class*="contact-info-item"] .icon,
  [class*="contact-box"] .icon {
    margin: 0 auto 12px;
  }
}

/* ============================================================
   FORMS — GENERAL
   ============================================================ */

@media (max-width: 575px) {
  select,
  .form-control,
  .form-select,
  textarea,
  input:not([type="radio"]):not([type="checkbox"]) {
    height: 50px;
    font-size: 15px;
    padding: 0 16px;
  }

  textarea {
    height: auto;
    min-height: 120px;
    padding: 14px 16px;
  }

  .form-group,
  .form-row {
    margin-bottom: 16px;
  }
}

/* ============================================================
   SEARCH / FILTER BAR
   ============================================================ */

@media (max-width: 991px) {
  [class*="search-form"],
  [class*="filter-form"],
  [class*="property-search"] {
    padding: 20px 16px;
  }

  [class*="search-form"] .row,
  [class*="filter-form"] .row {
    gap: 12px 0;
  }
}

@media (max-width: 575px) {
  [class*="search-form"] .col-sm-6,
  [class*="search-form"] .col-sm-4,
  [class*="search-form"] .col-sm-3,
  [class*="filter-form"] .col-sm-6,
  [class*="filter-form"] .col-sm-4 {
    width: 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* ============================================================
   SIDEBAR
   ============================================================ */

@media (max-width: 991px) {
  .sidebar-area,
  .widget-area,
  aside.sidebar {
    margin-top: 50px;
  }
}

@media (max-width: 767px) {
  .sidebar-area,
  aside.sidebar {
    margin-top: 40px;
  }
}

/* ============================================================
   PAGINATION
   ============================================================ */

@media (max-width: 575px) {
  .pagination,
  [class*="pagination-wrap"],
  nav.navigation {
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
  }

  .page-numbers,
  .pagination .page-item .page-link {
    min-width: 38px;
    height: 38px;
    font-size: 14px;
  }
}

/* ============================================================
   FOOTER
   ============================================================ */

@media (max-width: 991px) {
  .footer-wrapper {
    padding: 60px 0 0;
  }

  .footer-wrapper .col-xl-3,
  .footer-wrapper .col-xl-4,
  .footer-wrapper .col-lg-3,
  .footer-wrapper .col-lg-4 {
    margin-bottom: 40px;
  }
}

@media (max-width: 767px) {
  .footer-wrapper .widget-area {
    padding: 0;
    text-align: left;
  }

  .footer-widget .widget_title {
    font-size: 18px;
    margin-bottom: 20px;
  }

  .footer-wrapper .footer-shape1,
  .footer-wrapper .footer-shape2,
  .footer-wrapper [class*="footer-shape"] {
    display: none;
  }
}

@media (max-width: 575px) {
  .copyright-wrap {
    flex-direction: column;
    text-align: center;
    gap: 10px;
    padding: 16px 0;
  }

  .copyright-text,
  .copyright-text a {
    font-size: 13px;
  }

  .footer-wrapper .social-links {
    justify-content: flex-start;
  }
}

/* ============================================================
   PRELOADER FIX (logged-in admin bar)
   ============================================================ */

@media (max-width: 782px) {
  .logged-in .sticky-wrapper.sticky {
    top: 46px;
  }
}

@media (max-width: 600px) {
  .logged-in .sticky-wrapper.sticky {
    top: 0;
  }
}

/* ============================================================
   WOOCOMMERCE / CART
   ============================================================ */

@media (max-width: 767px) {
  table.woocommerce-cart-form__contents,
  table.shop_table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .woocommerce-page .col-12.col-lg-7,
  .woocommerce-page .col-12.col-lg-5 {
    flex: 0 0 100%;
    max-width: 100%;
  }
}

/* ============================================================
   SINGLE PROPERTY PAGE
   ============================================================ */

@media (max-width: 991px) {
  [class*="property-details"],
  [class*="listing-details"],
  [class*="estate-details"] {
    padding: 24px 20px;
  }

  [class*="property-gallery"],
  [class*="listing-gallery"] {
    margin-bottom: 30px;
  }
}

@media (max-width: 575px) {
  [class*="property-meta"],
  [class*="listing-meta"],
  [class*="property-features"] {
    flex-direction: column;
    gap: 12px;
  }

  [class*="property-meta"] > *,
  [class*="listing-meta"] > * {
    width: 100%;
  }

  [class*="property-price"],
  [class*="listing-price"] {
    font-size: 24px;
  }
}

/* ============================================================
   MAPS (Google Maps / OpenStreetMap iframes)
   ============================================================ */

.map-embed,
.gmap,
[class*="map-wrap"] {
  width: 100%;
  overflow: hidden;
}

.map-embed iframe,
.gmap iframe,
[class*="map-wrap"] iframe {
  width: 100% !important;
  height: 350px;
}

@media (max-width: 575px) {
  .map-embed iframe,
  .gmap iframe,
  [class*="map-wrap"] iframe {
    height: 250px;
  }
}

/* ============================================================
   VIDEO EMBEDS
   ============================================================ */

.video-wrap,
[class*="video-box"],
[class*="video-wrap"] {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}

.video-wrap iframe,
[class*="video-box"] iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

/* ============================================================
   POPUP / MODAL FIXES
   ============================================================ */

@media (max-width: 575px) {
  .popup-search-area,
  [class*="popup-overlay"] {
    padding: 20px 15px;
  }

  .popup-search-area .search-form input {
    font-size: 18px;
  }

  .mfp-wrap .mfp-container {
    padding: 0 10px;
  }
}

/* ============================================================
   SLICK SLIDER ARROWS — HIDE ON SMALL TOUCH SCREENS
   ============================================================ */

@media (max-width: 575px) {
  .slick-arrow {
    display: none !important;
  }

  .slick-dots {
    display: block;
  }
}

/* ============================================================
   TABLE — HORIZONTAL SCROLL ON MOBILE
   ============================================================ */

@media (max-width: 767px) {
  table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* ============================================================
   ACCESSIBILITY — TAP TARGETS
   ============================================================ */

@media (max-width: 991px) {
  a,
  button,
  [role="button"],
  input[type="submit"],
  input[type="button"],
  .page-numbers {
    min-height: 44px;
    min-width: 44px;
  }

  nav a,
  .main-menu a,
  .themeholy-mobile-menu a {
    min-height: 44px;
    display: flex;
    align-items: center;
  }
}

/* ============================================================
   PRINT — HIDE NAVIGATION & SIDEBAR
   ============================================================ */

@media print {
  .themeholy-header,
  .themeholy-footer,
  .sidebar-area,
  .themeholy-menu-toggle,
  .slick-arrow,
  .slick-dots,
  .preloader {
    display: none !important;
  }

  body {
    font-size: 12pt;
    color: #000;
  }

  a[href]:after {
    content: " (" attr(href) ")";
    font-size: 10pt;
  }
}