/**
 * WoMoGuide CPT Styles
 * Unified styles for Restaurant and Campsite templates
 */

/* ==========================================================================
   SHARED BASE STYLES
   ========================================================================== */

/* General Layout */
.rd-single-restaurant-page,
.rd-single-campsite-page {
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px;
  box-sizing: border-box;
  overflow-x: hidden;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

/* Header Section */
.rd-header-wrapper {
  margin-bottom: 30px;
}

.rd-single-restaurant-header,
.rd-single-campsite-header {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  align-items: center;
}

.rd-header-content {
  flex: 1 1 300px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.rd-header-thumbnail-column {
  flex: 1 1 300px;
  min-width: 0;
  max-width: 500px;
}

.rd-header-thumbnail img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.rd-header-subheader {
  font-size: 0.9em;
  color: #666;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin: 0 0 8px 0;
  font-weight: 500;
}

.rd-restaurant-title,
.rd-campsite-title {
  margin: 0 0 12px 0;
  font-size: 2.4em;
  color: #1a1a1a;
  font-weight: 700;
}

.rd-restaurant-tagline,
.rd-campsite-tagline {
  font-size: 1.15em;
  color: #555;
  margin: 0 0 20px 0;
  line-height: 1.5;
  font-style: italic;
}

/* Badges */
.rd-restaurant-badges,
.rd-campsite-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 15px;
}

.rd-badge {
  display: inline-block;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 0.9em;
  font-weight: 600;
}

.rd-badge-type {
  background: #e8f4fd;
  color: #1976d2;
}

.rd-badge-cuisine {
  background: #fff3e0;
  color: #e65100;
}

.rd-badge-price {
  background: #e8f5e9;
  color: #2e7d32;
}

.rd-badge-region {
  background: #f3e5f5;
  color: #7b1fa2;
}

.rd-campsite-type {
  display: inline-block;
  background-color: #e7f4e4;
  color: #2e7d32;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 0.9em;
  font-weight: 600;
}

/* Content Layout */
.rd-restaurant-content-wrapper,
.rd-campsite-content-wrapper {
  display: block;
}

.rd-restaurant-main-content,
.rd-campsite-main-content {
  width: 100%;
}

/* Section Styling */
.rd-restaurant-section,
.rd-campsite-section {
  background-color: #fff;
  border-radius: 12px;
  padding: 28px;
  margin-bottom: 24px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.rd-restaurant-section h2,
.rd-campsite-section h2 {
  margin: 0 0 20px 0;
  padding-bottom: 12px;
  border-bottom: 2px solid #f0f0f0;
  color: #1a1a1a;
  font-size: 1.5em;
  font-weight: 600;
}

.rd-restaurant-section h3,
.rd-campsite-section h3 {
  color: #333;
  font-size: 1.1em;
  margin: 20px 0 10px;
  font-weight: 600;
}

.rd-map-description {
  color: #666;
  margin: 0 0 16px 0;
  font-size: 0.95em;
}

/* ==========================================================================
   KEY INFO / OVERVIEW
   ========================================================================== */

.rd-key-info-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.rd-key-info-item {
  display: flex;
  flex-direction: column;
  padding: 14px 20px;
  background: #f8f9fa;
  border-radius: 8px;
  flex: 1 1 auto;
}

.rd-key-info-item.rd-key-info-wide {
  flex: 2 1 auto;
}

.rd-key-label {
  font-size: 0.85em;
  color: #666;
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.rd-key-value {
  font-size: 1.15em;
  font-weight: 600;
  color: #1a1a1a;
}

.rd-opening-hours-value {
  font-size: 0.95em;
  line-height: 1.5;
}

/* Overview Grid (Campsite) */
.rd-overview-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 20px;
  padding: 16px;
  background: #f8f9fa;
  border-radius: 8px;
}

.rd-overview-item {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}

.rd-overview-label {
  font-size: 0.85em;
  color: #666;
  margin-bottom: 4px;
}

.rd-overview-value {
  font-size: 1.1em;
  font-weight: 600;
  color: #1a1a1a;
}

/* ==========================================================================
   LOCATION SECTION
   ========================================================================== */

.rd-location-section {
  overflow: visible;
}

.rd-location-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: start;
}

.rd-location-map {
  border-radius: 8px;
  overflow: hidden;
  min-height: 280px;
}

.rd-location-info {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.rd-location-teaser {
  font-size: 1.1em;
  line-height: 1.6;
  color: #333;
  margin: 0;
  font-style: italic;
}

.rd-address {
  background: #f8f9fa;
  padding: 16px;
  border-radius: 8px;
}

.rd-address strong {
  display: block;
  margin-bottom: 8px;
  color: #666;
  font-size: 0.85em;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.rd-address p {
  margin: 0;
  line-height: 1.6;
}

.rd-access-notes strong {
  display: block;
  margin-bottom: 8px;
  color: #666;
  font-size: 0.85em;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.rd-access-notes p {
  margin: 0;
  line-height: 1.6;
  color: #444;
}

.rd-google-maps-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #1976d2;
  text-decoration: none;
  font-size: 0.95em;
  padding: 6px 0;
  transition: color 0.2s;
}

.rd-google-maps-link:hover {
  color: #1565c0;
}

.rd-google-maps-link svg {
  flex-shrink: 0;
}

/* Parking Info */
.rd-location-parking {
  background: #f8f9fa;
  padding: 12px 16px;
  border-radius: 8px;
}

.rd-parking-item {
  margin-bottom: 6px;
  font-size: 0.95em;
  color: #333;
}

.rd-parking-item:last-child {
  margin-bottom: 0;
}

.rd-parking-item strong {
  color: #666;
}

/* Contact Links in Location */
.rd-location-contact {
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid #e0e0e0;
}

.rd-location-contact > strong {
  display: block;
  margin-bottom: 10px;
  color: #666;
  font-size: 0.85em;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.rd-contact-links {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rd-contact-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #1976d2;
  text-decoration: none;
  font-size: 0.95em;
  transition: color 0.2s;
}

.rd-contact-link:hover {
  color: #1565c0;
}

.rd-contact-link.rd-booking-link {
  color: #2e7d32;
  font-weight: 500;
}

.rd-contact-link.rd-booking-link:hover {
  color: #1b5e20;
}

.rd-contact-notes-inline {
  margin: 10px 0 0;
  font-size: 0.9em;
  color: #666;
}

/* ==========================================================================
   EXPERIENCE SECTION (Restaurant)
   ========================================================================== */

.rd-experience-item {
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid #f0f0f0;
}

.rd-experience-item.rd-experience-has-gallery {
  display: flex;
  gap: 24px;
  align-items: flex-start;
}

.rd-experience-item:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.rd-experience-text {
  flex: 1;
  min-width: 0;
}

.rd-experience-item h3 {
  margin: 0 0 12px 0;
}

.rd-experience-content {
  line-height: 1.7;
  color: #444;
}

.rd-experience-gallery {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}

.rd-experience-thumb {
  display: block;
  width: 80px;
  height: 80px;
  border-radius: 8px;
  overflow: hidden;
}

.rd-experience-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.2s;
}

.rd-experience-thumb:hover img {
  transform: scale(1.05);
}

/* Motorhome Parking Section */
.rd-motorhome-parking-section {
  overflow: visible;
}

.rd-motorhome-parking-text {
  line-height: 1.7;
  color: #444;
  margin-bottom: 20px;
}

.rd-motorhome-parking-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
}

.rd-parking-thumb {
  display: block;
  border-radius: 8px;
  overflow: hidden;
}

.rd-parking-thumb img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.2s;
}

.rd-parking-thumb:hover img {
  transform: scale(1.02);
}

/* Overview / Description */
.rd-restaurant-description {
  line-height: 1.8;
  color: #333;
}

.rd-restaurant-description p {
  margin-bottom: 1.2em;
}

.rd-restaurant-description h2,
.rd-restaurant-description h3 {
  margin-top: 1.5em;
  margin-bottom: 0.5em;
}

.rd-restaurant-description img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

/* ==========================================================================
   COURSES SECTION (Restaurant)
   ========================================================================== */

.rd-courses-section {
  overflow: visible;
}

.rd-courses-list {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.rd-course-item {
  display: flex;
  gap: 24px;
  padding-bottom: 32px;
  border-bottom: 1px solid #f0f0f0;
}

.rd-course-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.rd-course-content {
  flex: 1;
  min-width: 0;
}

.rd-course-title {
  margin: 0 0 12px 0;
  font-size: 1.2em;
  font-weight: 600;
  color: #1a1a1a;
}

.rd-course-description {
  line-height: 1.7;
  color: #444;
}

.rd-course-gallery {
  flex: 0 0 280px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rd-course-main-image {
  display: block;
  position: relative;
  border-radius: 8px;
  overflow: hidden;
}

.rd-course-main-image img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.3s;
}

.rd-course-main-image:hover img {
  transform: scale(1.03);
}

.rd-course-gallery-count {
  position: absolute;
  bottom: 12px;
  right: 12px;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 0.85em;
  font-weight: 500;
}

.rd-course-thumbnails {
  display: flex;
  gap: 8px;
}

.rd-course-thumb {
  flex: 1;
  border-radius: 6px;
  overflow: hidden;
}

.rd-course-thumb img {
  width: 100%;
  height: 60px;
  object-fit: cover;
  display: block;
  transition: opacity 0.2s;
}

.rd-course-thumb:hover img {
  opacity: 0.85;
}

.rd-course-item:not(.rd-course-has-gallery) {
  display: block;
}

/* ==========================================================================
   FEATURES
   ========================================================================== */

.rd-features-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.rd-feature-badge {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 20px;
  font-size: 0.85em;
  font-weight: 500;
}

.rd-feature-badge.rd-feature-yes {
  background: #e8f5e9;
  color: #2e7d32;
}

.rd-feature-badge.rd-feature-partial {
  background: #fff3e0;
  color: #e65100;
}

.rd-feature-badge.rd-feature-no {
  background: #ffebee;
  color: #c62828;
}

/* ==========================================================================
   FACILITIES (Campsite)
   ========================================================================== */

.rd-facilities-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}

.rd-facility-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  background-color: #f0f7f0;
  border-radius: 6px;
  font-size: 0.95em;
}

.rd-facility-icon {
  color: #2e7d32;
  font-weight: bold;
}

.rd-facilities-notes,
.rd-ve-notes {
  background-color: #f8f9fa;
  padding: 14px 18px;
  border-radius: 8px;
  margin-top: 16px;
  font-size: 0.95em;
  color: #555;
  line-height: 1.6;
}

.rd-connectivity-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 16px;
}

.rd-connectivity-item {
  font-size: 0.95em;
}

.rd-notes {
  color: #666;
  font-size: 0.9em;
}

/* Accessibility */
.rd-accessibility-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.rd-accessibility-item {
  display: flex;
  flex-direction: column;
  padding: 12px 16px;
  background: #f8f9fa;
  border-radius: 8px;
}

.rd-accessibility-item .rd-label {
  font-size: 0.85em;
  color: #666;
  margin-bottom: 4px;
}

.rd-accessibility-item .rd-value {
  font-weight: 600;
  color: #1a1a1a;
}

.rd-accessibility-features {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 16px 0;
}

.rd-accessibility-notes,
.rd-pets-notes {
  color: #555;
  font-size: 0.95em;
  line-height: 1.6;
}

/* ==========================================================================
   PRICING (Campsite)
   ========================================================================== */

.rd-pricing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.rd-pricing-item {
  padding: 14px 18px;
  background: #f8f9fa;
  border-radius: 8px;
}

.rd-pricing-item.rd-pricing-main {
  background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
}

.rd-price-label {
  display: block;
  font-size: 0.85em;
  color: #666;
  margin-bottom: 4px;
}

.rd-price-value {
  font-size: 1.2em;
  font-weight: 700;
  color: #2e7d32;
}

.rd-pricing-notes,
.rd-rules-notes {
  background: #f8f9fa;
  padding: 14px 18px;
  border-radius: 8px;
  margin: 16px 0;
  font-size: 0.95em;
  line-height: 1.6;
}

.rd-pricing-link {
  margin: 16px 0;
}

.rd-pricing-link a {
  color: #1976d2;
  font-weight: 500;
  text-decoration: none;
}

.rd-pricing-link a:hover {
  text-decoration: underline;
}

.rd-payment-methods {
  margin: 16px 0;
  font-size: 0.95em;
}

/* ==========================================================================
   DESCRIPTIONS (Campsite)
   ========================================================================== */

.rd-description-item {
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid #f0f0f0;
}

.rd-description-item:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.rd-description-content {
  line-height: 1.7;
  color: #444;
}

.rd-show-map-btn {
  display: inline-block;
  margin-top: 12px;
  padding: 8px 16px;
  background: #1976d2;
  color: #fff;
  border-radius: 6px;
  text-decoration: none;
  font-size: 0.9em;
  font-weight: 500;
  transition: background 0.2s;
}

.rd-show-map-btn:hover {
  background: #1565c0;
  color: #fff;
}

/* ==========================================================================
   GALLERY SECTION
   ========================================================================== */

.rd-gallery-section,
.rd-campsite-gallery-section {
  overflow: visible;
}

.rd-gallery-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 -28px;
  padding: 0 28px;
}

.rd-gallery-scroll-container {
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  flex: 1;
  margin: 0 -28px;
  padding: 8px 28px;
}

.rd-gallery-scroll-container::-webkit-scrollbar {
  display: none;
}

.rd-gallery-grid {
  display: flex;
  gap: 12px;
}

.rd-gallery-item {
  flex: 0 0 auto;
}

.rd-gallery-thumb {
  display: block;
  width: 200px;
  height: 140px;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: transform 0.2s, box-shadow 0.2s;
}

.rd-gallery-thumb:hover {
  transform: scale(1.03);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.rd-gallery-thumb img,
.rd-gallery-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rd-gallery-nav {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s, transform 0.2s;
  color: #333;
  z-index: 10;
}

.rd-gallery-nav:hover {
  background: #f5f5f5;
  transform: scale(1.1);
}

.rd-gallery-nav svg {
  width: 24px;
  height: 24px;
}

/* 3-Row Grid Gallery Styles (based on video CPT) */
.rd-gallery-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
}

.rd-gallery-nav {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  background: #fff;
  border: 2px solid #e0e0e0;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
  z-index: 2;
}

.rd-gallery-nav:hover {
  background: #f5f5f5;
  border-color: #999;
}

.rd-gallery-nav svg {
  color: #333;
}

.rd-gallery-scroll-container {
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  flex: 1;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.rd-gallery-scroll-container::-webkit-scrollbar {
  display: none;
}

.rd-gallery-grid {
  display: grid;
  grid-template-rows: repeat(2, 160px);
  grid-auto-flow: column;
  grid-auto-columns: 220px;
  gap: 16px;
  height: 336px;
  padding-right: 16px;
  width: fit-content;
}

/* Dynamic row counts based on image count */
.rd-gallery-grid.rd-gallery-rows-1 {
  grid-template-rows: 160px;
  height: 160px;
}

.rd-gallery-grid.rd-gallery-rows-2 {
  grid-template-rows: repeat(2, 160px);
  height: 336px;
}

.rd-gallery-item {
  width: 220px;
  height: 160px;
  box-sizing: border-box;
}

.rd-gallery-thumb {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  background: #f8f8f8;
  display: block;
  transition: transform 0.2s, box-shadow 0.2s;
  cursor: pointer;
}

.rd-gallery-thumb:hover {
  transform: scale(1.02);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.rd-gallery-thumb img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

@media (max-width: 768px) {
  .rd-gallery-wrapper {
    gap: 8px;
  }

  .rd-gallery-nav {
    width: 36px;
    height: 36px;
  }

  .rd-gallery-grid {
    grid-template-rows: repeat(2, 140px);
    grid-auto-columns: 180px;
    gap: 12px;
    height: 292px;
  }

  .rd-gallery-grid.rd-gallery-rows-1 {
    grid-template-rows: 140px;
    height: 140px;
  }

  .rd-gallery-item {
    width: 180px;
    height: 140px;
  }
}

@media (max-width: 480px) {
  .rd-gallery-nav {
    display: none;
  }

  .rd-gallery-grid {
    grid-template-rows: repeat(2, 120px);
    grid-auto-columns: 150px;
    gap: 8px;
    height: 248px;
  }

  .rd-gallery-grid.rd-gallery-rows-1 {
    grid-template-rows: 120px;
    height: 120px;
  }

  .rd-gallery-item {
    width: 150px;
    height: 120px;
  }
}

/* ==========================================================================
   VIDEO SECTION
   ========================================================================== */

.rd-video-section {
  background: #f8f9fa;
  border-radius: 8px;
  padding: 24px;
}

.rd-video-container {
  margin-bottom: 16px;
  border-radius: 8px;
  overflow: hidden;
}

.rd-video-container iframe {
  width: 100%;
  aspect-ratio: 16 / 9;
  border: none;
  border-radius: 8px;
}

.rd-video-info {
  text-align: center;
}

.rd-video-link {
  display: inline-block;
  color: #2271b1;
  text-decoration: none;
  font-weight: 500;
  padding: 8px 16px;
  background: #fff;
  border-radius: 6px;
  border: 1px solid #ddd;
  transition: all 0.2s ease;
}

.rd-video-link:hover {
  background: #2271b1;
  color: #fff;
  border-color: #2271b1;
}

/* ==========================================================================
   PROS & CONS
   ========================================================================== */

.rd-pros-cons {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
  margin-bottom: 24px;
}

.rd-pros,
.rd-cons {
  padding: 24px;
  border-radius: 12px;
  position: relative;
}

.rd-pros {
  background: #f0fdf4;
}

.rd-cons {
  background: #fef2f2;
}

.rd-pros h3,
.rd-cons h3 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 16px 0;
  font-size: 1em;
  font-weight: 600;
}

.rd-pros h3 {
  color: #166534;
}

.rd-pros h3::before {
  content: "👍";
  font-size: 18px;
}

.rd-cons h3 {
  color: #991b1b;
}

.rd-cons h3::before {
  content: "👎";
  font-size: 18px;
}

.rd-pros-content,
.rd-cons-content {
  line-height: 1.7;
  color: #333;
}

.rd-pros-content ul,
.rd-cons-content ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.rd-pros-content li,
.rd-cons-content li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 8px;
}

.rd-pros-content li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: #22c55e;
  font-weight: 600;
}

.rd-cons-content li::before {
  content: "–";
  position: absolute;
  left: 0;
  color: #ef4444;
  font-weight: 600;
}

/* ==========================================================================
   VERDICT
   ========================================================================== */

.rd-verdict {
  background: #f8fafc;
  padding: 24px;
  border-radius: 12px;
  margin-bottom: 16px;
}

.rd-verdict h3 {
  color: #333;
  margin: 0 0 12px 0;
}

.rd-verdict-content {
  line-height: 1.7;
  color: #333;
  font-size: 1.05em;
  font-style: italic;
}

/* Would Return */
.rd-would-return {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: #f8f9fa;
  border-radius: 8px;
}

.rd-would-return strong {
  color: #333;
}

.rd-return-answer {
  font-weight: 600;
  padding: 6px 14px;
  border-radius: 6px;
}

.rd-return-definitely {
  background: #4caf50;
  color: #fff;
}

.rd-return-probably {
  background: #8bc34a;
  color: #fff;
}

.rd-return-maybe {
  background: #ffc107;
  color: #333;
}

.rd-return-unlikely {
  background: #ff9800;
  color: #fff;
}

.rd-return-no {
  background: #f44336;
  color: #fff;
}

/* ==========================================================================
   CONTACT SECTION
   ========================================================================== */

.rd-contact-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.rd-contact-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.rd-contact-icon {
  font-size: 1.2em;
}

.rd-contact-item a {
  color: #1976d2;
  text-decoration: none;
}

.rd-contact-item a:hover {
  text-decoration: underline;
}

.rd-opening-hours div {
  line-height: 1.6;
  color: #444;
}

.rd-contact-notes {
  margin-top: 16px;
  padding: 14px 18px;
  background: #f8f9fa;
  border-radius: 8px;
  font-size: 0.95em;
  color: #555;
}

/* ==========================================================================
   MAPS SECTION
   ========================================================================== */

.rd-nearby-map {
  border-radius: 8px;
  overflow: hidden;
  min-height: 350px;
}

.rd-location-map-section,
.rd-site-map-section,
.rd-nearby-map-section {
  overflow: hidden;
}

.rd-map-content {
  margin: 0 -28px -28px -28px;
  border-radius: 0 0 12px 12px;
  overflow: hidden;
}

/* ==========================================================================
   POI SECTION
   ========================================================================== */

.rd-poi-section {
  overflow: visible;
}

.rd-section-description {
  color: #666;
  margin: -10px 0 20px 0;
  font-size: 0.95em;
}

.rd-poi-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: start;
}

.rd-poi-map {
  border-radius: 8px;
  overflow: hidden;
  min-height: 300px;
}

.rd-poi-list {
  background: #f8f9fa;
  border-radius: 8px;
  padding: 16px;
}

.rd-poi-items {
  list-style: none;
  margin: 0;
  padding: 0;
}

.rd-poi-item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid #e9ecef;
}

.rd-poi-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.rd-poi-item:first-child {
  padding-top: 0;
}

.rd-poi-item-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.rd-poi-name {
  color: #1a1a1a;
  font-size: 0.95em;
}

.rd-poi-description {
  color: #666;
  font-size: 0.85em;
  line-height: 1.4;
}

.rd-poi-maps-link {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 6px;
  background: #e3f2fd;
  color: #1976d2;
  transition: background 0.2s, color 0.2s;
}

.rd-poi-maps-link:hover {
  background: #1976d2;
  color: #fff;
}

/* ==========================================================================
   RELATED CONTENT
   ========================================================================== */

.rd-related-content-section {
  background: transparent;
  box-shadow: none;
  padding: 0;
}

.rd-related-content-section > h2 {
  margin-bottom: 24px;
}

.rd-related-section {
  background: #fff;
  border-radius: 12px;
  padding: 24px;
  margin-bottom: 24px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.rd-related-section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.rd-related-section-header h3 {
  margin: 0;
  font-size: 1.2em;
  color: #1a1a1a;
}

.rd-see-all {
  color: #1976d2;
  text-decoration: none;
  font-weight: 500;
  font-size: 0.95em;
}

.rd-see-all:hover {
  text-decoration: underline;
}

.rd-related-cards-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.rd-related-card {
  display: flex;
  flex-direction: column;
  background: #f8f9fa;
  border-radius: 8px;
  overflow: hidden;
  text-decoration: none;
  transition: transform 0.2s, box-shadow 0.2s;
}

.rd-related-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.rd-related-card-thumb {
  aspect-ratio: 16/10;
  overflow: hidden;
}

.rd-related-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rd-related-card-content {
  padding: 12px;
}

.rd-related-card-type {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.75em;
  color: #666;
  margin-bottom: 6px;
}

.rd-related-card-type .dashicons {
  font-size: 14px;
  width: 14px;
  height: 14px;
}

.rd-related-card-title {
  margin: 0;
  font-size: 0.95em;
  font-weight: 600;
  color: #1a1a1a;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.rd-related-region {
  font-size: 0.8em;
  color: #888;
  display: block;
  margin-top: 6px;
}

/* ==========================================================================
   MAIN CONTENT
   ========================================================================== */

.rd-content-body {
  line-height: 1.8;
  color: #333;
}

.rd-content-body p {
  margin-bottom: 1.2em;
}

.rd-content-body h2,
.rd-content-body h3 {
  margin-top: 1.5em;
  margin-bottom: 0.5em;
}

.rd-content-body img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

/* ==========================================================================
   LIGHTBOX
   ========================================================================== */

.rd-lightbox {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
}

.rd-lightbox-bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.92);
  cursor: pointer;
}

.rd-lightbox-image {
  max-width: 90vw;
  max-height: 90vh;
  position: relative;
  z-index: 10001;
  border-radius: 4px;
}

.rd-lightbox-close {
  position: absolute;
  top: 24px;
  right: 32px;
  z-index: 10002;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}

.rd-lightbox-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10002;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}

.rd-lightbox-arrow-left {
  left: 24px;
}

.rd-lightbox-arrow-right {
  right: 24px;
}

/* ==========================================================================
   CAMPSITE-SPECIFIC: Environment Section
   ========================================================================== */

.rd-environment-info {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid #e0e0e0;
}

.rd-environment-info h3 {
  margin: 0 0 12px 0;
  font-size: 1.1em;
  color: #333;
}

.rd-environment-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin-bottom: 12px;
}

.rd-environment-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.rd-environment-item .rd-label {
  font-size: 0.85em;
  color: #666;
}

.rd-environment-item .rd-value {
  font-weight: 500;
  color: #333;
}

.rd-environment-item .rd-notes {
  font-size: 0.85em;
  color: #666;
  font-style: italic;
}

.rd-environment-features {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* Pets Section */
.rd-pets-section .rd-pets-status {
  margin-bottom: 12px;
}

.rd-pets-section .rd-pets-notes {
  background: #f8f9fa;
  padding: 14px 18px;
  border-radius: 8px;
  font-size: 0.95em;
  line-height: 1.6;
  color: #555;
}

/* Tents Allowed in Rules */
.rd-tents-allowed {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #e0e0e0;
}

/* About Infos Link */
.rd-about-infos-section {
  background: transparent;
  box-shadow: none;
  padding: 0;
  text-align: center;
}

.rd-about-infos-link {
  margin: 0;
}

.rd-about-infos-link a {
  color: #666;
  font-size: 0.9em;
  text-decoration: none;
}

.rd-about-infos-link a:hover {
  text-decoration: underline;
}

/* ==========================================================================
   RESPONSIVE DESIGN
   ========================================================================== */

@media (max-width: 992px) {
  .rd-related-cards-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 768px) {
  .rd-single-restaurant-page,
  .rd-single-campsite-page {
    padding: 12px;
    max-width: 100%;
  }

  .rd-single-restaurant-header,
  .rd-single-campsite-header {
    flex-direction: column;
    padding: 20px;
  }

  .rd-restaurant-title,
  .rd-campsite-title {
    font-size: 1.8em;
  }

  .rd-restaurant-section,
  .rd-campsite-section {
    padding: 20px;
  }

  .rd-location-grid {
    grid-template-columns: 1fr;
  }

  .rd-gallery-wrapper {
    margin: 0 -20px;
    padding: 0 20px;
  }

  .rd-gallery-scroll-container {
    margin: 0 -20px;
    padding: 8px 20px;
  }

  .rd-gallery-thumb {
    width: 160px;
    height: 110px;
  }

  .rd-gallery-nav {
    display: none;
  }

  .rd-map-content {
    margin: 0 -20px -20px -20px;
  }

  .rd-pros-cons {
    grid-template-columns: 1fr;
  }

  .rd-key-info-grid {
    gap: 12px;
  }

  .rd-key-info-item {
    padding: 12px 16px;
  }

  .rd-poi-grid {
    grid-template-columns: 1fr;
  }

  .rd-related-cards-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .rd-facilities-list {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  }

  .rd-experience-item.rd-experience-has-gallery {
    flex-direction: column;
  }

  .rd-experience-gallery {
    width: 100%;
    justify-content: flex-start;
  }

  .rd-course-item {
    flex-direction: column-reverse;
    gap: 16px;
  }

  .rd-course-gallery {
    flex: none;
    width: 100%;
  }

  .rd-course-thumbnails {
    display: none;
  }
}

@media (max-width: 600px) {
  .rd-related-cards-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .rd-restaurant-title,
  .rd-campsite-title {
    font-size: 1.5em;
    word-wrap: break-word;
  }

  .rd-key-info-grid {
    gap: 8px;
  }

  .rd-key-info-item {
    padding: 10px 12px;
  }

  .rd-key-label {
    font-size: 0.75em;
  }

  .rd-key-value {
    font-size: 1em;
  }

  .rd-restaurant-section,
  .rd-campsite-section {
    padding: 16px;
    margin-bottom: 16px;
  }

  .rd-restaurant-section h2,
  .rd-campsite-section h2 {
    font-size: 1.25em;
  }

  .rd-overview-grid {
    gap: 12px;
    padding: 12px;
  }

  .rd-address {
    padding: 12px;
  }

  .rd-similar-post-thumb {
    width: 70px;
    height: 70px;
  }

  .rd-restaurant-badges,
  .rd-campsite-badges {
    gap: 6px;
  }

  .rd-badge {
    padding: 4px 10px;
    font-size: 0.8em;
  }
}

@media (max-width: 400px) {
  .rd-single-restaurant-page,
  .rd-single-campsite-page {
    padding: 8px;
  }

  .rd-restaurant-section,
  .rd-campsite-section {
    padding: 12px;
    border-radius: 8px;
  }

  .rd-restaurant-title,
  .rd-campsite-title {
    font-size: 1.3em;
  }

  /* Stack key info items vertically on very small screens */
  .rd-key-info-item {
    flex: 1 1 100%;
  }

  .rd-related-cards-grid {
    grid-template-columns: 1fr;
  }

  .rd-facilities-list {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   SIMILAR POSTS SECTION
   ========================================================================== */

.rd-similar-posts-section {
  margin: 40px 0;
}

.rd-similar-posts-title {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 20px;
  color: var(--contrast, #1a1a1a);
}

.rd-similar-posts-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.rd-similar-post-item {
  display: flex;
  align-items: center;
  gap: 15px;
  text-decoration: none;
}

.rd-similar-post-thumb {
  flex-shrink: 0;
  width: 100px;
  height: 100px;
  border-radius: 4px;
  overflow: hidden;
}

.rd-similar-post-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rd-similar-post-content {
  flex: 1;
}

.rd-similar-post-title {
  margin: 0 0 5px;
  font-size: 18px;
  font-weight: 600;
  color: var(--accent, #1976d2);
  line-height: 1.3;
}

.rd-similar-post-item:hover .rd-similar-post-title {
  text-decoration: underline;
}

.rd-similar-post-excerpt {
  margin: 0;
  font-size: 14px;
  color: var(--contrast-2, #666);
  line-height: 1.4;
}

.rd-similar-post-more {
  display: none;
}

/* ==========================================================================
   POST NAVIGATION (matches GP Element 4-column grid styling)
   ========================================================================== */

.rd-post-navigation {
  max-width: 920px;
  margin: 40px auto;
  padding: 0 30px;
}

.rd-post-nav-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  align-items: center;
  min-height: 160px;
}

/* Column 1: Previous image */
.rd-post-nav-prev .rd-post-nav-thumb {
  grid-column: 1;
  grid-row: 1;
  height: 160px;
  overflow: hidden;
}

/* Column 2: Previous text (overlaps image) */
.rd-post-nav-prev .rd-post-nav-content {
  grid-column: 2;
  grid-row: 1;
  margin-left: -80px;
  padding: 20px 40px 20px 20px;
  background: linear-gradient(
    90deg,
    var(--base-3, #f8f9fa) 60%,
    rgba(255, 255, 255, 0) 100%
  );
  z-index: 5;
  position: relative;
}

/* Column 3: Next text (overlaps image) */
.rd-post-nav-next .rd-post-nav-content {
  grid-column: 3;
  grid-row: 1;
  margin-right: -80px;
  padding: 20px 20px 20px 40px;
  text-align: right;
  background: linear-gradient(
    270deg,
    var(--base-3, #f8f9fa) 60%,
    rgba(255, 255, 255, 0) 100%
  );
  z-index: 5;
  position: relative;
}

/* Column 4: Next image */
.rd-post-nav-next .rd-post-nav-thumb {
  grid-column: 4;
  grid-row: 1;
  height: 160px;
  overflow: hidden;
}

.rd-post-nav-item {
  display: contents;
}

.rd-post-nav-empty {
  display: contents;
}

/* Empty placeholders for missing prev/next */
.rd-post-nav-empty.rd-post-nav-prev::before {
  content: "";
  grid-column: 1 / 3;
  grid-row: 1;
}

.rd-post-nav-empty.rd-post-nav-next::before {
  content: "";
  grid-column: 3 / 5;
  grid-row: 1;
}

.rd-post-nav-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.rd-post-nav-content {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  justify-content: center;
  min-height: 160px;
}

.rd-post-nav-arrow {
  display: block;
  width: 0.7em;
  height: 0.7em;
  margin-bottom: 0.2em;
  color: var(--accent, #1976d2);
}

.rd-post-nav-arrow svg {
  width: 100%;
  height: 100%;
  fill: currentColor;
}

.rd-post-nav-next .rd-post-nav-arrow {
  margin-left: auto;
}

.rd-post-nav-title {
  margin: 0;
  font-size: 22px;
  font-weight: 600;
  color: var(--contrast, #1a1a1a);
  line-height: 1.3;
}

.rd-post-nav-content:hover .rd-post-nav-title {
  color: var(--contrast-2, #555);
}

/* Responsive - stack vertically on mobile */
@media (max-width: 768px) {
  .rd-post-nav-grid {
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .rd-post-nav-item {
    display: flex;
    flex-direction: row;
    width: 100%;
    min-height: 100px;
  }

  .rd-post-nav-prev {
    flex-direction: row;
  }

  .rd-post-nav-next {
    flex-direction: row-reverse;
  }

  .rd-post-nav-thumb {
    flex: 0 0 100px;
    height: 100px;
  }

  .rd-post-nav-prev .rd-post-nav-thumb,
  .rd-post-nav-next .rd-post-nav-thumb {
    grid-column: auto;
  }

  .rd-post-nav-prev .rd-post-nav-content,
  .rd-post-nav-next .rd-post-nav-content {
    grid-column: auto;
    margin-left: -40px;
    margin-right: -40px;
    padding: 15px 20px;
  }

  .rd-post-nav-title {
    font-size: 16px;
  }
}

/* ==========================================================================
   AUTHOR SECTION
   ========================================================================== */

.rd-author-section {
  margin: 50px 0 20px;
}

.rd-author-box {
  display: flex;
  gap: 20px;
  align-items: center;
  padding: 40px;
  background: linear-gradient(
    154deg,
    rgba(255, 255, 255, 0.1) 50%,
    rgba(213, 213, 213, 0.3) 50%
  );
  background-color: var(--base-2, #f0f0f0);
  border-radius: 8px;
}

.rd-author-avatar {
  flex-shrink: 0;
}

.rd-author-avatar img {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  object-fit: cover;
}

.rd-author-info {
  flex: 1;
}

.rd-author-label {
  display: block;
  font-size: 13px;
  color: var(--contrast-2, #666);
  margin-bottom: 10px;
}

.rd-author-name {
  margin: 0 0 10px;
  font-size: 1.25em;
  font-weight: 600;
  color: var(--contrast, #1a1a1a);
}

.rd-author-bio {
  color: var(--contrast, #1a1a1a);
  line-height: 1.6;
}

.rd-author-bio a {
  color: var(--accent, #1976d2);
}

.rd-author-social {
  display: flex;
  gap: 15px;
  margin-top: 15px;
}

.rd-social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--contrast-2, #666);
  font-size: 1.1em;
  transition: color 0.2s;
}

.rd-social-link:hover {
  color: var(--contrast, #1a1a1a);
}

/* Responsive */
@media (max-width: 768px) {
  .rd-author-box {
    flex-direction: column;
    text-align: center;
    padding: 30px;
  }

  .rd-author-social {
    justify-content: center;
  }
}
