/* ──────────────────────────────────────────────────────────────
   custom.css  –  loaded AFTER uno.css
   • Imports theme variables
   • Adds dynamic‐text fix (.account-field)
   • Preserves your legacy, Leaflet, toast, and debug styles
   ──────────────────────────────────────────────────────────── */

/* Palette hook (do NOT delete) */
@import "/css/theme-vars.css";

/* Dynamic-content contrast fix */
.account-field{ color:var(--text) !important; }

/* ── Legacy form widgets ───────────────────────────────────── */
.button-legacy{
  padding:0.75rem 1rem;
  font-size:1rem;
  font-weight:600;
  border:none;
  border-radius:6px;
  cursor:pointer;
  transition:background-color 0.2s ease;
  display:inline-block;
  width:100%;
  color:#fff;
}
.input-legacy{
  width:100%;
  padding:0.75rem;
  border:1px solid #ccc;
  border-radius:6px;
  margin-bottom:1rem;
  font-size:1rem;
  transition:border-color 0.2s ease,box-shadow 0.2s ease;
  box-sizing:border-box;
}

/* ── Debug helpers (comment out when done) ─────────────────── */
/*
#mini-map{
  display:block !important;
  border:4px solid red !important;
  min-height:100px;
}
.thread-list{
  display:grid !important;
  border:4px solid limegreen !important;
  padding:1rem;
  min-height:150px;
}
*/

/* ── Custom nav toggle ─────────────────────────────────────── */
nav.menu{
  display:none !important;
  flex-direction:column;
  align-items:center;
  background-color:#222;
  padding:1em;
  position:relative;
  z-index:9999;
}
nav.menu.visible{ display:flex !important; }
nav.menu.hidden { display:none !important; }
nav.menu a{
  color:#fff;
  text-decoration:none;
  padding:10px;
  width:100%;
  text-align:center;
}
nav.menu a:hover{ background-color:#444; }

/* ── Stand-alone link styled as button ─────────────────────── */
.link-button{
  background:none;
  border:none;
  padding:0;
  color:var(--primary);
  cursor:pointer;
  text-decoration:underline;
  font:inherit;
}

/* ── Focus states ──────────────────────────────────────────── */
input:focus,
textarea:focus,
select:focus{
  border-color:#007BFF;
  box-shadow:0 0 0 2px rgba(0,123,255,0.2);
  outline:none;
}

/* ── Label styling ─────────────────────────────────────────── */
label{
  display:block;
  font-weight:600;
  margin-bottom:0.5rem;
  color:#333;
}

/* ── Leaflet Zip-Search Control ────────────────────────────── */
.leaflet-control-custom{
  background-color:#fff;
  padding:8px;
  border-radius:6px;
  box-shadow:0 2px 8px rgba(0,0,0,0.15);
  font-size:14px;
  z-index:1000;
}
.leaflet-control-custom input[type="text"]{
  width:100px;
  padding:4px 6px;
  margin-right:6px;
  border:1px solid #ccc;
  border-radius:4px;
}
.leaflet-control-custom button{
  padding:4px 10px;
  background-color:#007BFF;
  border:none;
  color:#fff;
  border-radius:4px;
  cursor:pointer;
  font-weight:600;
}
.leaflet-control-custom button:hover{ background-color:#0056b3; }

/* ── Spinner ──────────────────────────────────────────────── */
.spinner-border{
  display:inline-block;
  width:1rem;
  height:1rem;
  vertical-align:text-bottom;
  border:0.15em solid currentColor;
  border-right-color:transparent;
  border-radius:50%;
  animation:spinner-border 0.75s linear infinite;
}
@keyframes spinner-border{
  100%{ transform:rotate(360deg); }
}

/* ── Utility button colors ─────────────────────────────────── */
button.bg-green,.button-green      { background-color:#28a745; }
button.bg-green:hover,.button-green:hover{ background-color:#218838; }
button.bg-dark-blue,.button-dark-blue{ background-color:#0056b3; }
button.bg-dark-blue:hover,.button-dark-blue:hover{ background-color:#003f88; }

/* ── Modal & toast helpers ─────────────────────────────────── */
#successModal{ display:none; }
#successModal.fixed{ display:flex !important; }
.bg-black-50{ background-color:rgba(0,0,0,0.5); }

#toast-container{
  position:fixed;
  top:1rem;
  right:1rem;
  z-index:9999;
}
.toast{
  margin-bottom:0.5rem;
  padding:0.75rem 1.25rem;
  border-radius:6px;
  font-weight:500;
  box-shadow:0 2px 8px rgba(0,0,0,0.1);
  color:#fff;
  background-color:#333;
  transition:opacity 0.3s ease;
}
.toast-success{ background-color:#28a745; }
.toast-error  { background-color:#dc3545; }
.toast-info   { background-color:#17a2b8; }

/* ── Map height fix ────────────────────────────────────────── */
#map{ height:70vh; width:100%; display:block; position:relative; z-index:0; }

/* ── Podcast summary styles ────────────────────────────────── */
.podcast-summary-btn{
  background-color:#b5e48c;
  color:#0f2a10;
  border:1px solid #8bcf6d;
  padding:0.5em 1em;
  border-radius:0.25em;
  cursor:pointer;
  font-weight:600;
}
.podcast-summary-btn:hover{
  filter:brightness(0.97);
}
.podcast-summary-modal{
  position:fixed;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:2000;
}
.podcast-summary-modal.hidden{
  display:none;
}
.podcast-summary-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.45);
}
.podcast-summary-modal__dialog{
  position:relative;
  background:var(--theme);
  color:var(--content);
  padding:1.25rem;
  border-radius:var(--radius);
  box-shadow:0 10px 40px rgba(0,0,0,0.25);
  max-width:600px;
  width:90%;
  z-index:1;
}
.podcast-summary-modal__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:0.75rem;
}
.podcast-summary-modal__title{
  margin:0;
  font-size:1.1rem;
  font-weight:700;
}
.podcast-summary-modal__close{
  background:none;
  border:none;
  font-size:1.4rem;
  line-height:1;
  cursor:pointer;
}
.podcast-summary-modal__body{
  font-size:0.98rem;
  line-height:1.5;
}