/*
 Theme Name:   Hotel411 Child Theme
 Theme URI:    https://hotel411.com/
 Description:  Universal Luxury Directory & Travel Child Theme for Twenty Twenty-Five.
 Author:       Hotel411 Team
 Template:     twentytwentyfive
 Version:      1.5.0
 Text Domain:  hotel411-child
*/

/* 1. Base Variables */
:root {
  --wp--preset--color--hotel-navy: #0A192F;
  --wp--preset--color--hotel-gold: #D4AF37;
  --wp--preset--color--hotel-cream: #F8F6F0;
  --wp--preset--color--hotel-slate: #334155;
  --wp--preset--color--hotel-white: #FFFFFF;
}

/* 2. Image Hover Metadata Tooltip / Caption Overlay */
.wp-block-image,
figure.wp-block-image {
  position: relative;
  overflow: hidden;
  border-radius: 6px;
}

.wp-block-image figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(10, 25, 47, 0.88);
  color: #FFFFFF !important;
  font-size: 0.88rem;
  padding: 8px 14px;
  margin: 0;
  opacity: 0;
  transform: translateY(100%);
  transition: all 0.25s ease-in-out;
  text-align: center;
  z-index: 2;
}

.wp-block-image:hover figcaption,
figure.wp-block-image:hover figcaption {
  opacity: 1;
  transform: translateY(0);
}

/* 3. Universal Two-Column Sitemap */
.sitemap-container {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  margin-top: 20px;
}

.sitemap-column {
  flex: 1 1 calc(50% - 20px);
  min-width: 280px;
}

.sitemap-section {
  margin-bottom: 30px;
}

.sitemap-section h3 {
  border-bottom: 2px solid #e5e7eb;
  padding-bottom: 8px;
  margin-bottom: 15px;
}

.sitemap-section ul {
  list-style-type: disc;
  padding-left: 20px;
  margin: 0;
}

.sitemap-section li {
  margin-bottom: 8px;
  line-height: 1.5;
}

/* =========================================================
   Hotel411 Universal Ad Unit Containment
   Prevents vertical blowing-out and sets responsive caps
   ========================================================= */

/* 1. General Ad Container Constraint */
.hotel411-ad-container,
.wp-block-group.hotel411-ad-container,
div[class*="hotel411-ad-"] {
  width: 100%;
  max-width: 100%;
  margin: 1.75rem auto !important;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  overflow: hidden !important; /* Hard stop for vertical overflow */
  clear: both;
}

/* 2. Cap Height on In-Content Responsive Units (Max 280px tall) */
.hotel411-ad-container ins.adsbygoogle {
  display: block !important;
  max-height: 280px !important; /* Prevents tall vertical skyscrapers */
  min-height: 90px;             /* Prevents layout shift while loading */
  width: 100% !important;
}

/* 3. Mobile Viewport Safeguards (Screens under 768px) */
@media screen and (max-width: 768px) {
  .hotel411-ad-container {
    margin: 1.25rem auto !important;
  }
  .hotel411-ad-container ins.adsbygoogle {
    max-height: 250px !important; /* Locks mobile ads to standard banner/rectangle */
    min-height: 60px;
  }
}