/*! (c) 2025 @meteobezana - Bezana Explorer */

/* ── Panel legal ── */
.p-legal-mini { display: none; }
@media (max-width: 768px) {
  .p-legal-full { display: none !important; }
  .p-legal-mini {
    display: flex; align-items: center; justify-content: center;
    gap: 0; padding: 6px 8px;
    border-top: 1px solid rgba(15,23,42,0.14); flex-shrink: 0;
  }
  .p-legal-mini a {
    display: inline-flex; align-items: center; gap: 4px; flex: 1;
    justify-content: center; font-size: 11px; font-weight: 600;
    color: #3b7dd8; text-decoration: none; padding: 4px 6px;
    border-radius: 7px; white-space: nowrap; transition: background 0.15s;
  }
  .p-legal-mini a:hover { background: rgba(59,125,216,0.08); }
  .p-legal-mini a .material-icons-round { font-size: 13px; }
  .p-legal-mini-sep { width: 1px; height: 14px; background: rgba(15,23,42,0.18); flex-shrink: 0; }
  .p-pane { flex: 1 1 0 !important; min-height: 0 !important; max-height: none !important; overflow-y: auto !important; }
}

/* ── Export buttons GPX / KML ── */
.l-export-btn {
  flex-shrink: 0; background: none; border: 1px solid; border-radius: 3px;
  cursor: pointer; padding: 2px 6px; margin-right: 2px; line-height: 1.4;
  display: inline-flex; align-items: center; transition: background .15s, color .15s;
  font-size: 9px; font-weight: 700; letter-spacing: .05em; font-family: monospace;
}
.l-export-fmt { pointer-events: none; }
.l-gpx-btn { color: #16a34a; border-color: rgba(22,163,74,.45); }
.l-gpx-btn:hover { background: rgba(22,163,74,.15); }
.l-kml-btn { color: #3b7dd8; border-color: rgba(59,125,216,.45); }
.l-kml-btn:hover { background: rgba(59,125,216,.15); }

/* ── Offline Banner ── */
#offline-banner {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 9999;
  display: flex; align-items: center; gap: 10px; padding: 10px 16px;
  background: #1a1f26; color: #e2e8f0; font-size: 13px; font-family: inherit;
  border-top: 2px solid #dc2626; transform: translateY(100%);
  transition: transform .3s ease; pointer-events: none;
}
#offline-banner.visible { transform: translateY(0); pointer-events: auto; }
#offline-banner .material-icons-round { color: #dc2626; font-size: 18px; }
#offline-banner-close {
  margin-left: auto; background: none; border: none; color: #94a3b8;
  cursor: pointer; font-size: 18px; padding: 0; line-height: 1;
}
.offline-status-row {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 14px; border-bottom: 1px solid var(--border, #2a2f38);
  font-size: 11px; color: var(--ink-55, #94a3b8);
}
.offline-status-ic { font-size: 15px; color: #3b7dd8; }
.offline-status-lbl { flex: 1; }
.offline-cache-btn { background: none; border: none; color: #3b7dd8; cursor: pointer; padding: 2px; display: flex; align-items: center; }
.offline-cache-btn .material-icons-round { font-size: 18px; }
.offline-cache-btn:hover { color: #60a5fa; }

/* ── GeoJSON info panel ── */
.pm-geojson-info {
  display: flex; align-items: center; gap: 8px;
  background: var(--surface-2, #1a1f26); border: 1px solid var(--ink-12, rgba(240,242,245,.12));
  border-radius: 8px; padding: 10px 14px; margin-bottom: 16px;
  font-size: 13px; font-weight: 500; color: var(--ink, #f0f2f5);
}
.pm-geojson-badge {
  margin-left: auto; background: rgba(var(--c-amber-rgb),0.15);
  color: #c27800; border: 1px solid rgba(var(--c-amber-rgb),0.3);
  border-radius: 20px; padding: 2px 10px; font-size: 11px; font-weight: 600;
}
@media (prefers-color-scheme: light) {
  .pm-geojson-info { background: #f4f4f4; color: #111; }
  .pm-geojson-badge { color: #92580a; }
}

/* ── m-btn amber variant ── */
.m-btn {
  background: rgba(var(--c-amber-rgb), 0.12) !important;
  color: #c27800 !important;
  border: 1.5px solid rgba(var(--c-amber-rgb), 0.30) !important;
  font-weight: 600 !important; box-shadow: none !important;
}
.m-btn .material-icons-round { color: var(--c-amber) !important; }
.m-btn:hover {
  background: rgba(var(--c-amber-rgb), 0.22) !important;
  border-color: var(--c-amber) !important;
  box-shadow: 0 2px 14px rgba(var(--c-amber-rgb), 0.28) !important;
  transform: translateY(-1px) !important; color: #c27800 !important;
}
@media (prefers-color-scheme: dark) {
  .m-btn { color: #fbbf24 !important; }
  .m-btn:hover { color: #fbbf24 !important; }
}

/* ── Geodata modal ── */
#geodata-modal-wrap {
  display: none; position: fixed; inset: 0; z-index: 98000;
  align-items: center; justify-content: center; padding: 16px;
  background: rgba(0,0,0,0.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
#geodata-modal {
  position: relative; background: #fff;
  border: 1.5px solid rgba(255,255,255,0.55); border-radius: 20px;
  box-shadow: 0 24px 80px rgba(15,23,42,0.30); width: 100%;
  max-width: 520px; max-height: 92dvh;
  display: flex; flex-direction: column; overflow: hidden;
  animation: cardSlideUp .30s cubic-bezier(.34,1.2,.64,1);
}
.gdm-file-zone { cursor: default !important; pointer-events: none; transition: border-color .25s, background .25s; }
.gdm-file-zone.gdm-ready { border-color: rgba(14,165,160,.55) !important; background: rgba(14,165,160,.06) !important; }
.gdm-ready-badge {
  display: none; align-items: center; gap: 5px; margin-top: 8px;
  padding: 4px 12px; border-radius: 20px;
  background: rgba(14,165,160,.12); color: #0ea5a0;
  font-size: .72rem; font-weight: 700;
  border: 1px solid rgba(14,165,160,.30); animation: fadeInUp .25s ease;
}
.gdm-ready-badge .material-icons-round { font-size: 14px !important; }
@keyframes fadeInUp { from { opacity:0; transform:translateY(4px) } to { opacity:1; transform:translateY(0) } }
@media (max-width: 540px) {
  #geodata-modal-wrap { align-items: flex-end; padding: 0; }
  #geodata-modal { max-width: 100%; border-radius: 20px 20px 0 0; max-height: 94dvh; }
}
@media (prefers-color-scheme: dark) {
  #geodata-modal { background: rgba(22,27,36,0.97); border-color: rgba(255,255,255,0.10); }
  .gdm-ready-badge { background: rgba(14,165,160,.18); border-color: rgba(14,165,160,.35); }
}