/*
 * municipality-selector.css
 * -------------------------
 * Styles the "You're viewing {Municipality} rules · Change municipality ▾"
 * strip at the top of every municipality-specific page.
 */
.municipality-selector {
  margin: 0 0 20px 0;
  padding: 10px 18px;
  background: linear-gradient(90deg, #013E4F 0%, #04657A 100%);
  color: #FFFFFF;
  border-radius: 8px;
  font-family: var(--font-body, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
  font-size: 14px;
  line-height: 1.4;
  box-shadow: 0 4px 14px -6px rgba(1, 62, 79, 0.35);
}

.municipality-selector .ms-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 18px;
  justify-content: space-between;
}

.municipality-selector .ms-label {
  color: rgba(255, 255, 255, 0.92);
}

.municipality-selector .ms-label strong {
  color: #FFFFFF;
  font-weight: 700;
}

.municipality-selector .ms-change {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.municipality-selector .ms-change-label {
  color: rgba(255, 255, 255, 0.85);
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}

.municipality-selector .ms-select {
  appearance: none;
  -webkit-appearance: none;
  background: rgba(255, 255, 255, 0.14);
  color: #FFFFFF;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 6px;
  padding: 6px 32px 6px 12px;
  font-size: 14px;
  font-family: inherit;
  font-weight: 600;
  cursor: pointer;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='white' stroke-width='2'><path d='M2 4 L6 8 L10 4'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 10px;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.municipality-selector .ms-select:hover,
.municipality-selector .ms-select:focus {
  background-color: rgba(255, 255, 255, 0.22);
  border-color: rgba(255, 255, 255, 0.55);
  outline: none;
}

.municipality-selector .ms-select option,
.municipality-selector .ms-select optgroup {
  color: #013E4F;
  background: #FFFFFF;
}

.municipality-selector .ms-loading {
  color: rgba(255, 255, 255, 0.85);
  font-style: italic;
}

/* Print — hide the selector; the printed page carries a static header instead */
@media print {
  .municipality-selector { display: none !important; }
}

/* Small screens — stack the label and dropdown */
@media (max-width: 560px) {
  .municipality-selector .ms-inner { flex-direction: column; align-items: flex-start; }
  .municipality-selector .ms-select { width: 100%; }
}