/**
 * HOME-STYLES.CSS - Home page specific styles
 * All inline styles and embedded CSS moved here
 */

/* ===== HERO SECTION RESPONSIVE LAYOUT ===== */

/* Desktop: Show desktop text, hide mobile text and buttons */
@media (min-width: 992px) {
  .hero-text-mobile,
  .hero-buttons-mobile {
    display: none !important;
  }
  
  .hero-text-desktop {
    display: block !important;
    min-height: 580px;
  }
}

/* Mobile/Tablet: Hide desktop text, show mobile text after wheel */
@media (max-width: 991px) {
  .hero-text-desktop {
    display: none !important;
    min-height: 124px;
  }
  
  .hero-text-mobile,
  .hero-buttons-mobile {
    display: block !important;
  }
  
  /* Reduce top padding on hero section for mobile */
  .hero-gradient {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
  }
  
  .hero-gradient .container {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }
}

/* ===== AD CONTAINER STYLES ===== */
.ad-container {
  background: #f8f9fa;
  border: 1px solid #dee2e6;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 250px;
  position: relative;
}

.ad-container-bottom {
  min-height: 90px;
}

.ad-unit {
  display: block;
}

.ad-label {
  position: absolute;
  top: 5px;
  left: 5px;
  font-size: 10px;
  color: #6c757d;
  text-transform: uppercase;
}

.ad-close-btn {
  position: absolute;
  top: 5px;
  right: 5px;
  background: rgba(0, 0, 0, 0.6);
  color: white;
  border: none;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  font-size: 12px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
}

.ad-close-btn:hover {
  background: rgba(0, 0, 0, 0.8);
}

/* ===== STICKY AD POSITIONS ===== */
.sticky-ad-left,
.sticky-ad-right {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  width: 160px;
  z-index: 100;
  transition: all 0.3s ease;
}

.sticky-ad-left {
  left: 0;
}

.sticky-ad-right {
  right: 0;
}

.sticky-ad-left .ad-container,
.sticky-ad-right .ad-container {
  min-height: 600px;
  width: 160px;
}

.sticky-ad-left.collapsed {
  left: -150px;
}

.sticky-ad-right.collapsed {
  right: -150px;
}

.bottom-sticky-ad {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: white;
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  transition: all 0.3s ease;
}

.bottom-sticky-ad.collapsed {
  bottom: -100%;
}

.bottom-sticky-ad .ad-container {
  min-height: 90px;
}

/* Hide side ads on smaller screens */
@media (max-width: 1400px) {
  .sticky-ad-left,
  .sticky-ad-right {
    display: none;
  }
}

@media (max-width: 768px) {
  .bottom-sticky-ad {
    display: block;
  }
}

.accordion-item .accordion-header .accordion-button {
  padding: 20px;
}