/* ============================================
   MOBILE RESPONSIVE STYLES
   For Investor Info, AGM, Annual Reports, Tenders, Company Policies
   ============================================ */

/* Mobile breakpoints */
@media (max-width: 768px) {
  
  /* ===== GENERAL CONTAINER ADJUSTMENTS ===== */
  .container {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  
  .main-content {
    padding: 15px 0 !important;
  }
  
  .boxed-container {
    padding: 20px 15px !important;
  }
  
  /* ===== HERO SECTION ===== */
  .hero-section-title h2 {
    font-size: 28px !important;
    line-height: 1.3 !important;
  }
  
  .hero-section-title h5 {
    font-size: 16px !important;
    line-height: 1.4 !important;
  }
  
  /* ===== BREADCRUMBS ===== */
  .breadcrumbs-list {
    font-size: 12px !important;
    padding: 10px 0 !important;
  }
  
  /* ===== BOXED CONTENT ===== */
  .boxed-content-title h3 {
    font-size: 22px !important;
    margin-bottom: 15px !important;
  }
  
  .boxed-content p {
    font-size: 14px !important;
    padding: 0 10px !important;
    margin-bottom: 20px !important;
  }
  
  /* ===== TABLES - HORIZONTAL SCROLL ===== */
  .agm-table,
  .annual-table,
  .tender-table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    font-size: 13px !important;
  }
  
  .agm-table thead,
  .annual-table thead,
  .tender-table thead {
    display: table-header-group;
  }
  
  .agm-table tbody,
  .annual-table tbody,
  .tender-table tbody {
    display: table-row-group;
  }
  
  .agm-table tr,
  .annual-table tr,
  .tender-table tr {
    display: table-row;
  }
  
  .agm-table th,
  .agm-table td,
  .annual-table th,
  .annual-table td,
  .tender-table th,
  .tender-table td {
    min-width: 100px;
    padding: 10px 8px !important;
    font-size: 12px !important;
    white-space: nowrap;
  }
  
  .agm-table th,
  .annual-table th,
  .tender-table th {
    font-size: 11px !important;
    padding: 8px 6px !important;
  }
  
  /* Description columns - allow wrapping on mobile */
  .agm-table td.description,
  .annual-table td.description,
  .tender-table td.description {
    white-space: normal !important;
    max-width: 200px;
    word-wrap: break-word;
  }
  
  /* ===== BUTTONS ===== */
  .agm-view-btn,
  .annual-view-btn,
  .tender-view-btn {
    padding: 8px 12px !important;
    font-size: 12px !important;
    min-width: 80px;
    text-align: center;
    display: inline-block;
  }
  
  /* ===== ACCORDIONS ===== */
  .help-item-title {
    font-size: 18px !important;
    padding: 15px 10px !important;
  }
  
  .accordion .toggle {
    padding: 15px 12px !important;
    font-size: 15px !important;
  }
  
  .accordion-inner {
    padding: 15px 10px !important;
  }
  
  /* ===== META TEXT ===== */
  .agm-meta-small,
  .annual-meta-small,
  .tender-meta-small {
    font-size: 11px !important;
  }
  
  /* ===== POST BANNER WIDGET ===== */
  .post-banner-widget {
    margin-top: 30px !important;
    padding: 25px 15px !important;
  }
  
  .post-banner-widget_content h5 {
    font-size: 18px !important;
    margin-bottom: 15px !important;
  }
  
  .post-banner-widget_content a {
    font-size: 14px !important;
    padding: 10px 20px !important;
  }
  
  /* ===== HELP ITEM WRAP ===== */
  .help-item-wrap {
    margin-top: 20px !important;
  }
  
  /* ===== ROW AND COLUMN ADJUSTMENTS ===== */
  .row {
    margin-left: -10px !important;
    margin-right: -10px !important;
  }
  
  .row > [class*="col-"] {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  
}

/* ============================================
   SMALL MOBILE (up to 480px)
   ============================================ */
@media (max-width: 480px) {
  
  /* ===== HERO SECTION ===== */
  .hero-section-title h2 {
    font-size: 24px !important;
  }
  
  .hero-section-title h5 {
    font-size: 14px !important;
  }
  
  /* ===== TABLES - EVEN MORE COMPACT ===== */
  .agm-table th,
  .agm-table td,
  .annual-table th,
  .annual-table td,
  .tender-table th,
  .tender-table td {
    padding: 8px 5px !important;
    font-size: 11px !important;
    min-width: 80px;
  }
  
  .agm-table th,
  .annual-table th,
  .tender-table th {
    font-size: 10px !important;
    padding: 6px 4px !important;
  }
  
  /* ===== BUTTONS ===== */
  .agm-view-btn,
  .annual-view-btn,
  .tender-view-btn {
    padding: 6px 10px !important;
    font-size: 11px !important;
    min-width: 70px;
  }
  
  /* ===== BOXED CONTENT ===== */
  .boxed-content-title h3 {
    font-size: 20px !important;
  }
  
  .boxed-content p {
    font-size: 13px !important;
    padding: 0 5px !important;
  }
  
  /* ===== ACCORDIONS ===== */
  .accordion .toggle {
    padding: 12px 10px !important;
    font-size: 14px !important;
  }
  
  /* ===== POST BANNER ===== */
  .post-banner-widget_content h5 {
    font-size: 16px !important;
  }
  
}

/* ============================================
   TABLET (481px to 768px)
   ============================================ */
@media (min-width: 481px) and (max-width: 768px) {
  
  /* Tables can be slightly wider */
  .agm-table td.description,
  .annual-table td.description,
  .tender-table td.description {
    max-width: 300px;
  }
  
}

/* ============================================
   INVESTOR INFO PAGE (Card Layout)
   ============================================ */
@media (max-width: 768px) {
  
  /* Card grid adjustments */
  .row.g-3 {
    margin-left: -8px !important;
    margin-right: -8px !important;
  }
  
  .row.g-3 > [class*="col-"] {
    padding-left: 8px !important;
    padding-right: 8px !important;
    margin-bottom: 15px !important;
  }
  
  .card {
    border-radius: 8px !important;
  }
  
  .card-body {
    padding: 15px !important;
  }
  
  .card h3.h6 {
    font-size: 16px !important;
    margin-bottom: 10px !important;
  }
  
  .card .text-muted {
    font-size: 12px !important;
    margin-bottom: 12px !important;
  }
  
  .card .btn {
    font-size: 13px !important;
    padding: 8px 16px !important;
    width: 100% !important;
  }
  
}

/* ============================================
   PDF OVERLAY (Company Policies)
   ============================================ */
@media (max-width: 768px) {
  
  .ha-pdf-overlay-inner {
    width: 100% !important;
    height: 100% !important;
  }
  
  .ha-pdf-overlay-close {
    width: 40px !important;
    height: 40px !important;
    font-size: 24px !important;
    line-height: 38px !important;
    top: 10px !important;
    right: 10px !important;
  }
  
}

/* ============================================
   GENERAL SITE-WIDE MOBILE IMPROVEMENTS
   ============================================ */
@media (max-width: 768px) {
  
  /* ===== TYPography ===== */
  h1 { font-size: 28px !important; }
  h2 { font-size: 24px !important; }
  h3 { font-size: 20px !important; }
  h4 { font-size: 18px !important; }
  h5 { font-size: 16px !important; }
  h6 { font-size: 14px !important; }
  
  /* ===== SPACING ===== */
  .py-5 {
    padding-top: 30px !important;
    padding-bottom: 30px !important;
  }
  
  .mb-4 {
    margin-bottom: 20px !important;
  }
  
  /* ===== ALERTS ===== */
  .alert {
    font-size: 14px !important;
    padding: 12px 15px !important;
  }
  
  /* ===== LIMIT BOX ===== */
  .limit-box {
    margin-top: 30px !important;
  }
  
  /* ===== BACK TO TOP ===== */
  .to_top-btn-wrap {
    bottom: 20px !important;
    right: 15px !important;
  }
  
  .to-top {
    padding: 10px 15px !important;
    font-size: 12px !important;
  }
  
}

/* ============================================
   ENSURE TOUCH-FRIENDLY TARGETS
   ============================================ */
@media (max-width: 768px) {
  
  a, button, input[type="button"], input[type="submit"] {
    min-height: 44px;
    min-width: 44px;
  }
  
  /* Buttons that are too small get padding */
  .btn-sm {
    padding: 10px 16px !important;
  }
  
}

/* ============================================
   PROPERTY CARDS - VIEW DETAILS BUTTON
   Fix for hidden .gid_link button on mobile
   ============================================ */
@media (max-width: 768px) {
  
  /* Make View Details button visible on mobile */
  .gid_link {
    display: block !important;
    position: relative !important;
    bottom: auto !important;
    right: auto !important;
    margin-top: 10px;
    width: 100% !important;
    text-align: center;
    padding: 12px 20px !important;
    font-size: 13px !important;
  }
  
  /* Ensure footer is properly positioned on mobile */
  .geodir-category-footer {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    padding: 15px 20px !important;
  }
  
  .gcf-company {
    float: none !important;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
  }
  
  .gcf-company img {
    margin-right: 10px;
  }
  
  .gcf-company span {
    float: none !important;
    top: 0 !important;
    line-height: 40px;
  }
  
}

/* Small mobile - ensure button is still visible (must override style.css line 8911) */
@media (max-width: 640px) {
  
  /* Higher specificity to override style.css @media (max-width: 640px) rule */
  .geodir-category-footer .gid_link,
  .fw-listing-item .geodir-category-footer .gid_link,
  .listing-grid-item .geodir-category-footer .gid_link,
  .gid_link {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    bottom: auto !important;
    right: auto !important;
    margin-top: 10px !important;
    width: 100% !important;
    text-align: center;
    padding: 12px 20px !important;
    font-size: 13px !important;
  }
  
  .geodir-category-footer {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    padding: 15px 20px !important;
  }
  
}

/* ============================================
   IMAGE DISPLAY - PREVENT CROPPING ON MOBILE
   ============================================ */
@media (max-width: 768px) {
  
  /* All images - ensure they maintain aspect ratio and aren't cut off */
  img {
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: center !important;
  }
  
  /* Background images - use contain instead of cover on mobile to show full image */
  .bg,
  .bg-wrap .bg,
  [class*="bg-"] .bg,
  .bg-parallax-wrap-gradien .bg {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
  }
  
  /* Property listing images */
  .geodir-category-img_item .bg,
  .geodir-category-img .bg {
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
  }
  
  /* Slider images - show full image without cropping */
  .swiper-slide img,
  .synk-slider .swiper-slide img,
  .hero-slider .swiper-slide img,
  .fw-carousel .swiper-slide img,
  .single-slider img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    max-height: 70vh !important; /* Prevent images from being too tall */
  }
  
  /* Slider containers - allow height to adjust to image */
  .swiper-slide,
  .synk-slider .swiper-slide,
  .hero-slider .swiper-slide,
  .fw-carousel .swiper-slide {
    height: auto !important;
    min-height: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  
  .swiper-wrapper {
    height: auto !important;
  }
  
  /* Hero slider background images */
  .hero-blur-container .bg,
  .bg-wrap.bg-hero .bg {
    background-size: contain !important;
    background-attachment: scroll !important; /* Disable fixed on mobile for performance */
    background-position: center center !important;
    background-repeat: no-repeat !important;
  }
  
  /* Property detail page images */
  .synk-slider-wrap img,
  .property-image img,
  .single-slider-wrap img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
  
  /* Gallery images */
  .gallery-item img,
  .photo-gallery img,
  .album-photo img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
  
  /* Team member photos */
  .team-member img,
  .agent-card-item img,
  .board-member img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
  
  /* News/blog images */
  .post-card img,
  .news-item img,
  .blog-post img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
  
  /* Project images */
  .project-image img,
  .project-card img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
  
  /* Career images */
  .career-image img,
  .job-card img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
  
  /* Ensure container doesn't cut off images */
  .geodir-category-img,
  .geodir-category-img_item {
    overflow: visible !important;
    height: auto !important;
    min-height: 200px !important;
    max-height: none !important;
  }
  
  /* Listing grid items - allow images to show fully */
  .listing-grid-item .geodir-category-img {
    height: auto !important;
    padding-bottom: 0 !important; /* Remove aspect ratio padding on mobile */
  }
  
  /* Responsive images utility class */
  .respimg {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
  
}

/* Small mobile devices - additional adjustments */
@media (max-width: 480px) {
  
  /* Even smaller max-height for very small screens */
  .swiper-slide img,
  .synk-slider .swiper-slide img,
  .hero-slider .swiper-slide img {
    max-height: 50vh !important;
  }
  
  /* Property listing images - ensure they show fully */
  .geodir-category-img_item {
    min-height: 180px !important;
  }
  
}