/* Safari-specific fixes and fallbacks */

/* Safari-specific backdrop-filter fixes */
@supports (-webkit-backdrop-filter: blur()) {
  .cookie-settings-icon {
    -webkit-backdrop-filter: blur(10px);
  }
}

/* Safari fallbacks for CSS variables */
@supports not (color: var(--bg-primary)) {
  .homepage-feed-post {
    background: #ffffff;
    border: 1px solid #dee2e6;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  }
  
  .homepage-feed-post:hover {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    border-color: #7b16ff;
  }
  
  .homepage-feed-post .post-title {
    color: #1a1a1a;
  }
  
  .homepage-feed-post .post-description {
    color: #7f8c8d;
  }
  
  .homepage-feed-post .post-image-container {
    border: 1px solid #dee2e6;
  }
  
  .cookie-settings-icon {
    background: rgba(255, 255, 255, 0.4) !important;
    border: 1px solid rgba(150, 150, 150, 0.3);
  }
  
  @media (prefers-color-scheme: dark) {
    .homepage-feed-post {
      background: #2c3e50;
      border: 1px solid #4a5f7a;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
    }
    
    .homepage-feed-post:hover {
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
      border-color: #9b59b6;
    }
    
    .homepage-feed-post .post-title {
      color: #ecf0f1;
    }
    
    .homepage-feed-post .post-description {
      color: #95a5a6;
    }
    
    .homepage-feed-post .post-image-container {
      border: 1px solid #4a5f7a;
    }
  }
}

/* Ensure consistent scaling across Safari versions */
.homepage-feed-post .post-image-container {
  -webkit-transform: scale(1);
  transform: scale(1);
  will-change: transform;
}

.homepage-feed-post .post-image-container:hover {
  -webkit-transform: scale(1.02);
  transform: scale(1.02);
}

/* Safari-specific flexbox fixes */
.homepage-images-feed {
  display: block; /* Fallback for older Safari */
}

@supports (display: flex) {
  .homepage-images-feed {
    display: flex;
    flex-direction: column;
  }
}

/* Cookie icon Safari fixes */
.cookie-settings-icon {
  -webkit-transform: scale(0.8);
  transform: scale(0.8);
  will-change: transform, opacity;
}

.cookie-settings-icon.visible {
  -webkit-transform: scale(1);
  transform: scale(1);
}

.cookie-settings-icon:hover {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

/* Fix for Safari image loading */
.homepage-feed-post .post-image,
.homepage-feed-post .post-video {
  width: 100%;
  height: auto;
  display: block;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

/* Post media container responsiveness for Safari */
.homepage-feed-post .post-media-container {
  display: block;
  width: 100%;
  overflow: hidden;
  border-radius: 12px;
  /* border: 1px solid var(--border-color, #dee2e6); */
}