/**
 * Theme Name:     Infinity Web Experts
 * Author:         the WordPress team
 * Template:       twentytwentyfive
 * Text Domain:	   infinity-web-experts
 * Description:    Twenty Twenty-Five emphasizes simplicity and adaptability. It offers flexible design options, supported by a variety of patterns for different page types, such as services and landing pages, making it ideal for building personal blogs, professional portfolios, online magazines, or business websites. Its templates cater to various blog styles, from text-focused to image-heavy layouts. Additionally, it supports international typography and diverse color palettes, ensuring accessibility and customization for users worldwide.
 */


  
body { background-color: #fff !important;}

a {text-decoration:none !important;}



.has-global-padding {
    padding-right: 0px !important;
    padding-left: 0px !important;
}

:where(.wp-site-blocks *:focus) {
    outline-width: 0px !important;
    outline-style: none !important;
}

.single-post {
	h2,h3,h4,h5,h6 { padding: 20px 0px 10px 0px !important}
	li { font-size: 20px !important;}
 img.attachment-post-thumbnail.size-post-thumbnail.wp-post-image {
    width: 100% !important;
    height: 380px !important;
}
}

@media (max-width: 768px) {
  .custom-list {
    grid-template-columns: repeat(2, 1fr); 
  }
}

@media only screen and (max-width: 767px) {
button.wp-block-navigation__responsive-container-open {
    background: #0E6B54!important;
    padding: 7px !important;
    border-radius: 10px !important;
    color: #fff !important;
}

button.wp-block-navigation__responsive-container-close {
background: #0E6B54 !important;
    padding: 7px !important;
    border-radius: 10px !important;
    color: #000 !important;
}
}



/* Container Fixes */
.container {
  display: grid;
  /* Desktop: 3 columns */
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
  /* Crucial: ensures padding doesn't cause overflow */
  box-sizing: border-box; 
  padding: 10px;
}

/* Button Fixes */
.location-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 10px; /* Reduced side padding to prevent text squishing */
  border: 1px solid #0E6B54;
  border-radius: 30px;
  color: #0E6B54;
  font-weight: 500;
  font-size: 16px; /* Slightly smaller for mobile compatibility */
  cursor: pointer;
  transition: 0.3s;
  background-color: transparent;
  width: 100%; 
  box-sizing: border-box; /* Prevents button from growing wider than its grid cell */
  white-space: nowrap;  /* Keeps text on one line */
  overflow: hidden;      /* Safety for very long names */
  text-overflow: ellipsis;
}

.location-btn i {
  color: #0E6B54;
  flex-shrink: 0; /* Prevents the icon from squishing */
}

/* Tablet & Mobile: 2 Columns */
@media (max-width: 768px) {
  .container {
    /* Fixed: Forces exactly 2 columns without overlap */
    grid-template-columns: repeat(2, 1fr);
    gap: 12px; /* Sufficient spacing to prevent touching */
  }

  .location-btn {
    font-size: 14px; /* Adjust font size for narrow screens */
    padding: 10px 8px;
  }
}

/* Small Mobile: 2 Columns adjustment */
@media (max-width: 400px) {
  .container {
    gap: 8px; /* Tighter gap for very small screens */
  }
  
  .location-btn {
    font-size: 13px;
    gap: 4px;
  }
}