/* Universal mobile footer styles for all pages */
/* Based on index.html footer implementation */

/* Mobile footer base styles */
@media (max-width: 1024px) {
  /* Ensure gray background fill on mobile footer */
  html body footer { 
    background-color: #666666 !important; 
    min-height: 200px !important; 
  }
  /* Remove gutters and padding inside footer like on index */
  html body footer .row { 
    --bs-gutter-x: 0 !important; 
    --bs-gutter-y: 0 !important; 
    margin-left: 0 !important; 
    margin-right: 0 !important; 
  }
  html body footer [class^="col-"],
  html body footer [class*=" col-"] { 
    padding-left: 0 !important; 
    padding-right: 0 !important; 
  }
  
  /* Красим вложенные контейнеры тоже в серый, чтобы не было белых просветов */
  html body footer .container,
  html body footer .row,
  html body footer .card-body,
  html body footer .footer-text1,
  html body footer .footer-text3,
  html body footer .footerLogo,
  html body footer .footerIcon { 
    background-color: #666666 !important; 
  }
  
  html body footer .footer-bottom { 
    background-color: #313131 !important; 
  }
}

/* Phone-specific footer styles */
@media (max-width: 767px) {
  /* Prevent horizontal overflow on phones */
  html, body { overflow-x: hidden !important; }
  
  /* Cancel full-bleed sections that use 100vw and negative margins */
  html body .index-section {
    width: 100% !important;
    left: auto !important;
    right: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  /* Footer base styles */
  footer {
    background-color: #666666 !important;
    color: #fff !important;
    padding: 0 !important;
    text-align: center !important;
    height: auto !important;
  }
  
  /* Footer container and row styles */
  footer .container,
  footer .row,
  footer .card-body,
  footer .footer-text1,
  footer .footer-text3,
  footer .footerLogo,
  footer .footerIcon { 
    background-color: #666666 !important; 
  }
  
  /* Footer row layout */
  footer .row { 
    display: flex !important; 
    flex-direction: column !important; 
    align-items: center !important; 
    text-align: center !important; 
    min-height: 200px !important;
    --bs-gutter-x: 0 !important; 
    --bs-gutter-y: 0 !important; 
    margin-left: 0 !important; 
    margin-right: 0 !important; 
  }
  
  /* Footer columns */
  footer .col-md-4, 
  footer .col-sm-12,
  footer .col-lg-4,
  footer .col-md-6,
  footer .col-12 { 
    width: 100% !important; 
    max-width: 100% !important; 
    margin-bottom: 20px !important; 
    text-align: center !important; 
    padding-left: 0 !important; 
    padding-right: 0 !important; 
  }
  
  /* Footer logo centering */
  footer .footerIcon, 
  footer .footerLogo { 
    display: flex !important; 
    justify-content: center !important; 
    align-items: center !important; 
    width: 100% !important; 
  }
  
  footer .footerImg { 
    display: block !important; 
    margin: 0 auto !important; 
    height: 135px !important; 
    width: auto !important; 
  }
  
  /* Footer text blocks */
  footer .footer-text1, 
  footer .footer-text3 { 
    text-align: center !important; 
    width: 100% !important; 
  }
  
  /* Footer bottom section */
  footer .footer-bottom { 
    background-color: #313131 !important;
    display: flex !important; 
    align-items: center !important; 
    justify-content: space-between !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 10px 0 !important;
    text-align: center !important;
  }
  
  /* Hide middle column in footer-bottom */
  footer .footer-bottom .col-sm-1 { 
    display: none !important; 
  }
  
  /* Footer bottom columns */
  footer .footer-bottom .footer-bottom_p1,
  footer .footer-bottom .footer-bottom_p2 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
    width: 50% !important;
    padding: 0 8px !important;
    display: flex !important;
    align-items: center !important;
  }
  
  footer .footer-bottom .footer-bottom_p1 { 
    text-align: left !important; 
  }
  
  footer .footer-bottom .footer-bottom_p2 { 
    text-align: right !important; 
    margin-left: 0 !important; 
  }
  
  /* Email formatting */
  footer .footer-text3 .footer-email { 
    display: block !important; 
    width: 100% !important; 
    white-space: normal !important; 
    margin-top: 6px !important;
  }
  
  /* Phone number formatting */
  footer .footer-text3 p.contact-phoneFooter, 
  footer .footer-text3 p, 
  footer .footer-text3 p a.contact-phoneFooter {
    line-height: 29px !important; 
    height: 29px !important; 
    min-height: 29px !important; 
    max-height: 29px !important; 
    margin: 0 !important; 
    padding: 0 !important; 
    display: inline-block !important; 
    white-space: nowrap !important;
  }
  
  /* Footer bottom text */
  footer .footer-bottom p { 
    font-size: 11px !important; 
    line-height: 1.2 !important; 
    margin: 0 !important; 
  }
  
  /* Copyright formatting */
  footer .footer-bottom .footer-copyright .unp-sep { 
    display: none !important; 
  }
  
  footer .footer-bottom .footer-unp { 
    display: block !important; 
  }
  
  /* Ensure all footer text is white */
  footer, 
  footer h1, 
  footer h2, 
  footer h3, 
  footer h4, 
  footer h5, 
  footer h6, 
  footer p, 
  footer span, 
  footer div, 
  footer a { 
    color: #fff !important; 
  }
  
  /* Специальные стили для адреса писем на мобильных */
  footer p[style*="width: 320px"] {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: initial !important;
    width: auto !important;
    max-width: 100% !important;
  }
}

/* Remove any remaining gap above footer-bottom (all viewports) */
footer .container { 
  margin-bottom: 0 !important; 
  padding-bottom: 0 !important; 
}

footer .footer-bottom {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

footer .container > .row { 
  margin-bottom: 0 !important; 
  min-height: auto !important; 
}

footer .row { 
  min-height: auto !important; 
}

footer .card-body { 
  padding-top: 0 !important; 
  padding-bottom: 0 !important; 
}

footer .footerIcon, 
footer .footerLogo, 
footer .footer-text1, 
footer .footer-text3 { 
  margin: 0 !important; 
  padding: 0 !important; 
}

/* Strong centering for footer logo to avoid right shift on server */
html body footer .footerIcon,
html body footer .footerLogo { 
  display: flex !important; 
  justify-content: center !important; 
  align-items: center !important; 
}

html body footer .footerLogo img.footerImg { 
  display: block !important; 
  margin-left: auto !important; 
  margin-right: auto !important; 
  float: none !important; 
}

/* Remove potential column padding causing horizontal shift */
html body footer .row > .col-md-4:first-child { 
  padding-left: 0 !important; 
  padding-right: 0 !important; 
  margin-left: 0 !important; 
  margin-right: 0 !important; 
}

/* On phones ensure the first footer column spans full width and is centered */
@media (max-width: 767px) {
  html body footer .row { 
    justify-content: center !important; 
  }
  
  html body footer .row > .col-md-4:first-child { 
    width: 100% !important; 
    max-width: 100% !important; 
    text-align: center !important; 
  }
  
  /* Set height for footer columns on mobile */
  html body footer .row.col-12.d-flex.align-items-center > div {
    height: 250px !important;
  }
  
  /* Remove margins and padding for footer logo on mobile */
  html body footer .footerIcon,
  html body footer .footerLogo,
  html body footer .footerImg {
    margin: 0 !important;
    padding: 0 !important;
  }
}

@media (max-width: 767px) {
  /* Center contacts column */
  html body main:not(.contacts) ~ footer .col-md-4:last-child {
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
  }
  /* Center the contacts card and its inner wrapper */
  html body main:not(.contacts) ~ footer .card-body.footer-text3,
  html body main:not(.contacts) ~ footer .card-body.footer-text3 > div {
    text-align: center !important;
  }
  /* Center all inner elements */
  html body main:not(.contacts) ~ footer .footer-text3 h2,
  html body main:not(.contacts) ~ footer .footer-text3 p,
  html body main:not(.contacts) ~ footer .footer-text3 a,
  html body main:not(.contacts) ~ footer .footer-text3 span,
  html body main:not(.contacts) ~ footer .footer-text3 .contact-phoneFooter,
  html body main:not(.contacts) ~ footer .footer-text3 .footer-email {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  /* Ensure the fixed-width 'Для писем' line is centered */
  html body main:not(.contacts) ~ footer .footer-text3 p[style*="width: 320px"] {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}