/* FindADive Widgets — findadive-widgets.css */

/* ---- Shared ---- */
.findadive-map-wrapper,
.findadive-marine-life,
.findadive-conditions,
.findadive-tours-widget {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  margin: 32px 0;
}

/* ---- Map ---- */
.findadive-map { box-shadow: 0 4px 16px rgba(0,0,0,0.12); }
.findadive-map-attribution { font-size: 11px; color: #888; margin-top: 4px; }

/* ---- Marine Life Gallery ---- */
.findadive-marine-title { font-size: 1.4rem; margin-bottom: 16px; }
.findadive-marine-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 12px;
}
.findadive-marine-card {
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  background: #fff;
}
.findadive-marine-card img {
  width: 100%;
  height: 130px;
  object-fit: cover;
  display: block;
}
.findadive-marine-info { padding: 8px 10px; }
.findadive-marine-info strong { display: block; font-size: 13px; }
.findadive-marine-info em { display: block; font-size: 11px; color: #555; font-style: italic; }
.findadive-marine-info small { display: block; font-size: 10px; color: #999; margin-top: 2px; }
.findadive-marine-source { font-size: 11px; color: #888; margin-top: 8px; }

/* ---- Dive Conditions ---- */
.findadive-conditions-title { font-size: 1.4rem; margin-bottom: 16px; }
.findadive-conditions-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.findadive-condition-card {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #f0f9ff;
  border-radius: 10px;
  padding: 12px 14px;
  border: 1px solid #bae6fd;
}
.findadive-condition-icon { font-size: 22px; }
.findadive-condition-label { font-size: 11px; color: #0369a1; text-transform: uppercase; letter-spacing: 0.5px; }
.findadive-condition-value { font-size: 15px; font-weight: 600; color: #0c4a6e; margin-top: 2px; }
.findadive-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
}

/* Temperature Chart */
.findadive-temp-chart { background: #f8fafc; border-radius: 10px; padding: 16px; }
.findadive-temp-label { font-size: 12px; color: #64748b; margin-bottom: 8px; }
.findadive-temp-bars { display: flex; align-items: flex-end; gap: 4px; height: 100px; }
.findadive-temp-bar-wrap { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; }
.findadive-temp-bar { width: 100%; border-radius: 3px 3px 0 0; transition: opacity 0.2s; min-height: 20px; }
.findadive-temp-bar:hover { opacity: 0.8; }
.findadive-temp-month { font-size: 9px; color: #94a3b8; margin-top: 3px; }
.findadive-temp-val { font-size: 9px; color: #64748b; }

/* ---- Tours Widget ---- */
.findadive-tours-title { font-size: 1.4rem; margin-bottom: 16px; }
.findadive-tours-affiliate-note { margin-top: 8px; }
.findadive-gyg-widget { min-height: 200px; }

/* ---- Hero Image ---- */
.findadive-hero-image { margin: 0 0 24px; padding: 0; }
.findadive-image-credit {
  font-size: 11px;
  color: #888;
  margin-top: 4px;
  text-align: right;
}
.findadive-image-credit a { color: #888; text-decoration: underline; }

/* ---- Responsive ---- */
@media (max-width: 640px) {
  .findadive-conditions-grid { grid-template-columns: repeat(2, 1fr); }
  .findadive-marine-grid { grid-template-columns: repeat(2, 1fr); }
  .findadive-map { height: 220px !important; }
}
