/* Imports managed dynamically in header.php with cache-busting */
 @import "footer.css"; 
 @import "navigation.css"; 
 @import "home_modules.css"; 
 @import "about_modules.css"; 
 @import "contact_modules.css"; 
 @import "services_modules.css"; 
@import "service_widget.css";
@import "city_list.css";
@import "gallery_modules.css";

/* New Module Imports */
@import "blog_modules.css";
/* @import "gallery_modules.css"; - Loaded directly in header.php with cache-busting */
@import "packers_movers_modules.css";
@import "reviews_modules.css";
@import "template_modules.css";
@import "branch_modules.css";

/* ==========================================================================
   GLOBAL TYPOGRAPHY OVERRIDES (FONT SIZE INCREASE & BOLDNESS)
   ========================================================================== */
/* Unify font family globally across the entire website to Outfit */
html, body, p, li, td, th, a, span, label, input, textarea, select, h1, h2, h3, h4, h5, h6, .heading, .title, button, div, section, main, header, footer {
    font-family: 'Outfit', sans-serif !important;
}

/* Protect icon fonts from being overridden by the global font family */
.bi, .bi::before, [class^="bi-"], [class*=" bi-"],
.fa, .fa::before, .fab, .far, .fas, i {
    font-family: bootstrap-icons, FontAwesome, inherit !important;
}

body, p, li, td, th, a, span, label, input, textarea, select {
    font-size: 17px;
    line-height: 1.75;
    font-weight: 500; /* Balanced weight */
}



/* Headings scale-up */
h1, h2, h3, h4, h5, h6, .heading, .title {
    font-weight: 800 !important;
}

h1 { font-size: 40px !important; }
h2 { font-size: 30px !important; }
h3 { font-size: 22px !important; }
h4 { font-size: 18px !important; }
h5 { font-size: 16px !important; }

/* Keep icon fonts normal weight to prevent layout distortion */
.bi, .bi::before, .fa, .fa::before, i, i::before, .btn-close {
    font-weight: normal !important;
}

/* Navigation Links */
.navbar-nav .nav-link {
    font-size: 16px !important;
    font-weight: 700 !important;
}

/* Buttons & CTAs */
.btn, button, .theme-btn {
    font-size: 15px !important;
    font-weight: 700 !important;
}

/* Footer Links & Headings */
.footer-link {
    font-size: 15px !important;
    font-weight: 600 !important;
}
.footer-heading {
    font-size: 18px !important;
    font-weight: 800 !important;
}

/* ==========================================================================
   GLOBAL MOBILE RESPONSIVENESS AND SCALE-UP PATCH
   ========================================================================== */
@media (max-width: 991.98px) {
    /* Prevent horizontal scrolling issues on body */
    html, body {
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Ensure images and media fit screen */
    img, iframe, video {
        max-width: 100% !important;
        height: auto !important;
    }
    
    /* Safeguard flex elements from overflowing */
    .d-flex:not(.contact-rating-select):not(.rv-stars):not(.faq-flex-nowrap):not(.faq-card-header):not(.trust-item):not(.hero-actions) {
        flex-wrap: wrap !important;
    }
    
    /* Container layout spacing */
    .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

@media (max-width: 767.98px) {
    /* Collapse columns on mobile portrait for clean reading */
    .row > * {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        margin-bottom: 15px;
    }
    
    /* Keep footer columns col-6 on mobile */
    .footer-section .row > * {
        width: 50% !important;
        max-width: 50% !important;
        flex: 0 0 50% !important;
    }

    /* Restore explicit mobile column widths (col-1 to col-11, and col-auto) */
    .row > .col-12 { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; }
    .row > .col-11 { width: 91.666667% !important; max-width: 91.666667% !important; flex: 0 0 91.666667% !important; }
    .row > .col-10 { width: 83.333333% !important; max-width: 83.333333% !important; flex: 0 0 83.333333% !important; }
    .row > .col-9  { width: 75% !important; max-width: 75% !important; flex: 0 0 75% !important; }
    .row > .col-8  { width: 66.666667% !important; max-width: 66.666667% !important; flex: 0 0 66.666667% !important; }
    .row > .col-7  { width: 58.333333% !important; max-width: 58.333333% !important; flex: 0 0 58.333333% !important; }
    .row > .col-6  { width: 50% !important; max-width: 50% !important; flex: 0 0 50% !important; }
    .row > .col-5  { width: 41.666667% !important; max-width: 41.666667% !important; flex: 0 0 41.666667% !important; }
    .row > .col-4  { width: 33.333333% !important; max-width: 33.333333% !important; flex: 0 0 33.333333% !important; }
    .row > .col-3  { width: 25% !important; max-width: 25% !important; flex: 0 0 25% !important; }
    .row > .col-2  { width: 16.666667% !important; max-width: 16.666667% !important; flex: 0 0 16.666667% !important; }
    .row > .col-1  { width: 8.333333% !important; max-width: 8.333333% !important; flex: 0 0 8.333333% !important; }
    .row > .col-auto { width: auto !important; max-width: 100% !important; flex: 0 0 auto !important; }

    /* Restore row-cols-* system */
    .row-cols-1 > * { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; }
    .row-cols-2 > * { width: 50% !important; max-width: 50% !important; flex: 0 0 50% !important; }
    .row-cols-3 > * { width: 33.333333% !important; max-width: 33.333333% !important; flex: 0 0 33.333333% !important; }
    .row-cols-4 > * { width: 25% !important; max-width: 25% !important; flex: 0 0 25% !important; }
    .row-cols-5 > * { width: 20% !important; max-width: 20% !important; flex: 0 0 20% !important; }
    .row-cols-6 > * { width: 16.666667% !important; max-width: 16.666667% !important; flex: 0 0 16.666667% !important; }
    .row-cols-auto > * { width: auto !important; max-width: 100% !important; flex: 0 0 auto !important; }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    /* Restore tablet-specific column widths (col-sm-*) on screens between 576px and 767.98px */
    .row > .col-sm-12 { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; }
    .row > .col-sm-11 { width: 91.666667% !important; max-width: 91.666667% !important; flex: 0 0 91.666667% !important; }
    .row > .col-sm-10 { width: 83.333333% !important; max-width: 83.333333% !important; flex: 0 0 83.333333% !important; }
    .row > .col-sm-9  { width: 75% !important; max-width: 75% !important; flex: 0 0 75% !important; }
    .row > .col-sm-8  { width: 66.666667% !important; max-width: 66.666667% !important; flex: 0 0 66.666667% !important; }
    .row > .col-sm-7  { width: 58.333333% !important; max-width: 58.333333% !important; flex: 0 0 58.333333% !important; }
    .row > .col-sm-6  { width: 50% !important; max-width: 50% !important; flex: 0 0 50% !important; }
    .row > .col-sm-5  { width: 41.666667% !important; max-width: 41.666667% !important; flex: 0 0 41.666667% !important; }
    .row > .col-sm-4  { width: 33.333333% !important; max-width: 33.333333% !important; flex: 0 0 33.333333% !important; }
    .row > .col-sm-3  { width: 25% !important; max-width: 25% !important; flex: 0 0 25% !important; }
    .row > .col-sm-2  { width: 16.666667% !important; max-width: 16.666667% !important; flex: 0 0 16.666667% !important; }
    .row > .col-sm-1  { width: 8.333333% !important; max-width: 8.333333% !important; flex: 0 0 8.333333% !important; }
    .row > .col-sm-auto { width: auto !important; max-width: 100% !important; flex: 0 0 auto !important; }

    /* Restore row-cols-sm-* system */
    .row-cols-sm-1 > * { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; }
    .row-cols-sm-2 > * { width: 50% !important; max-width: 50% !important; flex: 0 0 50% !important; }
    .row-cols-sm-3 > * { width: 33.333333% !important; max-width: 33.333333% !important; flex: 0 0 33.333333% !important; }
    .row-cols-sm-4 > * { width: 25% !important; max-width: 25% !important; flex: 0 0 25% !important; }
    .row-cols-sm-5 > * { width: 20% !important; max-width: 20% !important; flex: 0 0 20% !important; }
    .row-cols-sm-6 > * { width: 16.666667% !important; max-width: 16.666667% !important; flex: 0 0 16.666667% !important; }
    .row-cols-sm-auto > * { width: auto !important; max-width: 100% !important; flex: 0 0 auto !important; }
}

@media (max-width: 767.98px) {
    
    /* Text adjustment on mobile */
    body, p, li, span, a, td, th, label, input, textarea, select {
        font-size: 14.5px;
        font-weight: 500; /* Balanced weight */
    }
    
    h1 { font-size: 26px !important; }
    h2 { font-size: 22px !important; }
    h3 { font-size: 18px !important; }
    h4 { font-size: 16px !important; }
    h5 { font-size: 15px !important; }
}

::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  background: #0d0d0d;
  border-left: 1px solid rgba(255, 215, 0, 0.15);
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(
    180deg,
    #ffd700,
    #d4af37,
    #b8860b
  );
  border-radius: 100px;
  border: 2px solid #0d0d0d;
  box-shadow:
    0 0 10px rgba(255, 215, 0, 0.3),
    inset 0 0 5px rgba(255, 255, 255, 0.3);
}

::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(
    180deg,
    #ffe55c,
    #ffd700,
    #c99700
  );

  box-shadow:
    0 0 15px rgba(255, 215, 0, 0.5),
    inset 0 0 8px rgba(255, 255, 255, 0.4);
}

::-webkit-scrollbar-thumb:active {
  background: linear-gradient(
    180deg,
    #fff0a0,
    #ffd700,
    #b8860b
  );
}

::-webkit-scrollbar-corner {
  background: #0d0d0d;
}

/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #d4af37 #0d0d0d;
}

::-webkit-scrollbar {
  width: 14px;
}

::-webkit-scrollbar-track {
  background: #050505;
  box-shadow: inset 0 0 8px rgba(255, 215, 0, 0.08);
}

::-webkit-scrollbar-thumb {
  background:
    linear-gradient(
      180deg,
      #fff8dc 0%,
      #ffd700 35%,
      #d4af37 65%,
      #b8860b 100%
    );

  border-radius: 999px;
  border: 2px solid #050505;

  box-shadow:
    0 0 12px rgba(255, 215, 0, 0.35),
    0 0 25px rgba(255, 215, 0, 0.15);
}

::-webkit-scrollbar-thumb:hover {
  box-shadow:
    0 0 18px rgba(255, 215, 0, 0.6),
    0 0 35px rgba(255, 215, 0, 0.3);
}

::-webkit-scrollbar-track-piece {
  background: #050505;
}

* {
  scrollbar-width: thin;
  scrollbar-color: #d4af37 #050505;
}