/* =============================================================
   EvvyTools — Aurora & Space Weather Forecast
   Location row, verdict hero, Kp gauge, threshold card, 3-day
   forecast strip, solar-wind row, viewing tips, saved locations,
   27-day heat strip, photography card, storm history table.
   ============================================================= */

/* ---- Editorial layout ---- */
.aur-ed-grid {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 1.5rem;
  align-items: start;
}
@media (max-width: 575.98px) {
  .aur-ed-grid { grid-template-columns: 1fr; }
  .aur-ed-side { flex-direction: row !important; gap: 1rem; }
}

/* ---- Location (mirrors the UV tool pattern) ---- */
.aur-location-row { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; }
.aur-location-current { font-size: 1rem; font-weight: 600; display: flex; align-items: center; gap: 0.4rem; }
.aur-location-current .bi { color: var(--cluster-dark, #1A237E); }

.aur-change-btn {
  padding: 0.3rem 0.8rem;
  font-size: 0.8rem;
  font-weight: 700;
  border-radius: 999px;
  border: 1.5px solid var(--cluster-dark, #1A237E);
  background: transparent;
  color: var(--cluster-dark, #1A237E);
  cursor: pointer;
}
.aur-change-btn:hover { background: var(--cluster-dark, #1A237E); color: #fff; }

.aur-search-wrap { margin-top: 0.75rem; position: relative; }
.aur-search-input-wrap { max-width: 320px; }
.aur-search-input { font-size: 1rem; padding-left: 1rem; }

.aur-suggest {
  display: none;
  position: absolute;
  top: calc(100% + 0.3rem);
  left: 0;
  max-width: 320px;
  width: 100%;
  background: var(--bs-body-bg, #fff);
  border: 1px solid var(--evvy-border-color, #DEE2E6);
  border-radius: var(--evvy-radius-md, 8px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  z-index: 20;
  overflow: hidden;
}
.aur-suggest.show { display: block; }
.aur-suggest-item {
  display: block; width: 100%; text-align: left;
  padding: 0.5rem 0.85rem; background: none; border: none;
  font-size: 0.88rem; cursor: pointer; color: var(--evvy-text-primary, #212529);
}
.aur-suggest-item:hover { background: var(--cluster-surface, #E8EAF6); }

/* ---- Viewing toggles ---- */
.aur-toggles { display: flex; gap: 1.25rem; flex-wrap: wrap; }
.aur-toggle { display: flex; align-items: center; gap: 0.5rem; font-size: 0.9rem; cursor: pointer; }
.aur-toggle-hint { font-size: 0.72rem; color: var(--evvy-text-secondary, #6C757D); display: block; }

/* ---- Loading ---- */
.aur-loading {
  display: flex; align-items: center; gap: 0.6rem;
  padding: 2rem 0;
  color: var(--evvy-text-secondary, #6C757D);
  font-size: 0.95rem;
}
.aur-spinner {
  width: 1.25rem; height: 1.25rem;
  border: 2.5px solid color-mix(in srgb, var(--cluster-dark, #1A237E) 25%, transparent);
  border-top-color: var(--cluster-dark, #1A237E);
  border-radius: 50%;
  animation: aur-spin 0.7s linear infinite;
}
@keyframes aur-spin { to { transform: rotate(360deg); } }

/* ---- Results ---- */
.aur-results { display: none; }
.aur-results.show { display: block; }

/* ---- Verdict hero ---- */
.aur-verdict {
  display: flex;
  align-items: center;
  gap: 1.1rem;
  border-radius: var(--evvy-radius-lg, 12px);
  padding: 1.2rem 1.4rem;
  margin-bottom: 1.1rem;
  color: #fff;
}
.aur-verdict-unlikely  { background: linear-gradient(120deg, #37474f, #263238); }
.aur-verdict-possible  { background: linear-gradient(120deg, #4a5f8a, #33406b); }
.aur-verdict-good      { background: linear-gradient(120deg, #2b7a5b, #1d5a44); }
.aur-verdict-likely    { background: linear-gradient(120deg, #2e9e5b, #14713f); }
.aur-verdict-nodark    { background: linear-gradient(120deg, #8a7b4a, #6b5d33); }
.aur-verdict-icon { font-size: 2.1rem; flex-shrink: 0; }
.aur-verdict-title { font-size: 1.35rem; font-weight: 800; line-height: 1.25; }
.aur-verdict-sub { font-size: 0.82rem; opacity: 0.85; margin-top: 0.2rem; }

/* ---- Kp gauge ---- */
.aur-gauge-wrap { margin: 0.4rem 0 0.2rem; }
.aur-gauge-track {
  position: relative;
  height: 14px;
  border-radius: 7px;
  background: linear-gradient(90deg, #2e9e5b 0%, #2e9e5b 44%, #d8a800 50%, #e07b39 66%, #d64545 78%, #a3153c 100%);
  opacity: 0.85;
}
.aur-gauge-marker {
  position: absolute;
  top: -5px;
  width: 4px;
  height: 24px;
  border-radius: 2px;
  background: var(--evvy-text-primary, #212529);
  box-shadow: 0 0 0 2px var(--bs-body-bg, #fff);
  transition: left 0.5s ease;
}
.aur-gauge-labels {
  display: flex;
  justify-content: space-between;
  font-size: 0.64rem;
  color: var(--evvy-text-secondary, #6C757D);
  margin-top: 0.4rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* ---- Cards / panels ---- */
.aur-panel {
  background: var(--bs-body-bg, #fff);
  border: 1px solid var(--evvy-border-color, #DEE2E6);
  border-radius: var(--evvy-radius-lg, 12px);
  padding: 1.1rem 1.25rem;
  margin-top: 1.1rem;
}
[data-bs-theme="dark"] .aur-panel { background: var(--evvy-gray-100, #1E1E1E); }
.aur-panel-title {
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--evvy-text-secondary, #6C757D);
  margin-bottom: 0.85rem;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.aur-panel-title .bi { color: var(--cluster-dark, #1A237E); }
.aur-muted { font-size: 0.88rem; color: var(--evvy-text-secondary, #6C757D); }

/* ---- Threshold card ---- */
.aur-threshold-flex { display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; }
.aur-threshold-num {
  font-size: 2.4rem;
  font-weight: 800;
  color: var(--cluster-dark, #1A237E);
  line-height: 1;
}
.aur-threshold-label { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--evvy-text-secondary, #6C757D); }
.aur-threshold-delta { font-size: 0.95rem; font-weight: 600; }
.aur-delta-good { color: #2e9e5b; }
.aur-delta-bad { color: #d64545; }

/* ---- Forecast strip ---- */
.aur-strip-day { margin-bottom: 0.9rem; }
.aur-strip-daylabel { font-size: 0.75rem; font-weight: 700; margin-bottom: 0.35rem; color: var(--evvy-text-secondary, #6C757D); }
.aur-strip {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 3px;
}
.aur-block {
  text-align: center;
  padding: 0.45rem 0.1rem;
  border-radius: 5px;
  color: #fff;
  position: relative;
}
.aur-block-kp { font-size: 0.85rem; font-weight: 800; }
.aur-block-hour { font-size: 0.58rem; opacity: 0.85; }
.aur-block-best { outline: 2.5px solid var(--evvy-text-primary, #212529); outline-offset: 1px; }
.aur-block-dark::after {
  content: "\2605";
  position: absolute;
  top: 1px; right: 3px;
  font-size: 0.5rem;
  opacity: 0.9;
}
.aur-kp-0 { background: #3f5261; } .aur-kp-1 { background: #3c6e54; }
.aur-kp-2 { background: #2e9e5b; } .aur-kp-3 { background: #6aa32e; }
.aur-kp-4 { background: #d8a800; } .aur-kp-5 { background: #e07b39; }
.aur-kp-6 { background: #d64545; } .aur-kp-7 { background: #b32c4a; }
.aur-kp-8 { background: #8e1e56; } .aur-kp-9 { background: #6b1266; }
.aur-strip-legend { font-size: 0.7rem; color: var(--evvy-text-secondary, #6C757D); margin-top: 0.4rem; }

/* ---- Solar row ---- */
.aur-solar-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.6rem;
}
.aur-solar-cell {
  text-align: center;
  padding: 0.75rem 0.4rem;
  border-radius: var(--evvy-radius-md, 8px);
  background: var(--cluster-surface, #E8EAF6);
}
[data-bs-theme="dark"] .aur-solar-cell {
  background: color-mix(in srgb, var(--cluster-dark, #1A237E) 22%, var(--evvy-gray-100, #1E1E1E));
}
.aur-solar-val { font-size: 1.2rem; font-weight: 800; color: var(--cluster-dark, #1A237E); }
.aur-solar-label { font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--evvy-text-secondary, #6C757D); }
.aur-solar-note { font-size: 0.7rem; margin-top: 0.15rem; font-weight: 600; }
.aur-bz-south { color: #2e9e5b; }
.aur-bz-north { color: #d8a800; }

/* ---- Tips ---- */
.aur-tip {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  padding: 0.4rem 0;
  font-size: 0.88rem;
}
.aur-tip .bi { color: var(--cluster-dark, #1A237E); flex-shrink: 0; margin-top: 0.15rem; }

/* ---- Buttons ---- */
.aur-outline-btn {
  padding: 0.4rem 0.9rem;
  font-size: 0.82rem;
  font-weight: 700;
  border-radius: 999px;
  border: 1.5px solid var(--cluster-dark, #1A237E);
  background: transparent;
  color: var(--cluster-dark, #1A237E);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.aur-outline-btn:hover { background: var(--cluster-dark, #1A237E); color: #fff; }
.aur-outline-btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* ---- Saved locations (Pro) ---- */
.aur-loc-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.6rem 0;
  border-bottom: 1px dashed var(--evvy-border-color, #DEE2E6);
  flex-wrap: wrap;
}
.aur-loc-row:last-child { border-bottom: none; }
.aur-loc-open {
  background: none; border: none; cursor: pointer;
  font-size: 0.9rem; font-weight: 600; color: var(--evvy-text-primary, #212529);
  display: flex; align-items: center; gap: 0.4rem;
}
.aur-loc-open .bi { color: var(--cluster-dark, #1A237E); }
.aur-loc-open:hover { text-decoration: underline; }
.aur-loc-kp { font-size: 0.78rem; font-weight: 700; }
.aur-loc-remove { background: none; border: none; color: var(--evvy-text-secondary, #6C757D); cursor: pointer; }
.aur-loc-remove:hover { color: #d64545; }

/* ---- 27-day heat strip (Pro) ---- */
.aur-outlook-grid {
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  gap: 4px;
}
.aur-outlook-day {
  text-align: center;
  padding: 0.4rem 0.1rem;
  border-radius: 5px;
  color: #fff;
}
.aur-outlook-date { font-size: 0.58rem; opacity: 0.9; }
.aur-outlook-kp { font-size: 0.85rem; font-weight: 800; }

/* ---- Photography card (Pro) ---- */
.aur-photo-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 0.6rem;
  margin-top: 0.75rem;
}
.aur-photo-cell {
  text-align: center;
  padding: 0.75rem 0.4rem;
  border-radius: var(--evvy-radius-md, 8px);
  border: 1px solid var(--evvy-border-color, #DEE2E6);
}
.aur-photo-val { font-size: 1.05rem; font-weight: 800; color: var(--cluster-dark, #1A237E); }
.aur-photo-label { font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--evvy-text-secondary, #6C757D); }

/* ---- Storm history (Pro) ---- */
.aur-history-wrap { overflow-x: auto; }
.aur-history { width: 100%; border-collapse: collapse; font-size: 0.83rem; }
.aur-history th, .aur-history td {
  padding: 0.45rem 0.6rem;
  border-bottom: 1px solid var(--evvy-border-color, #DEE2E6);
  text-align: left;
}
.aur-history th { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--evvy-text-secondary, #6C757D); }
.aur-history-you { background: color-mix(in srgb, #2e9e5b 10%, transparent); }

/* ---- Mobile ---- */
@media (max-width: 575.98px) {
  .aur-strip { grid-template-columns: repeat(4, 1fr); row-gap: 4px; }
  .aur-outlook-grid { grid-template-columns: repeat(5, 1fr); }
  .aur-verdict-title { font-size: 1.05rem; }
}
