/* ============================================
 * GN – Current Location Page Layout
 * - 2-column: Left = Map, Right = Info
 * - Full-width, 50/50, fill all space
 * ============================================ */

#gn-mf-current-location-page {
  width: 100%;
  min-height: calc(100vh - 160px);
  /* simple background, Zillow-style */
  padding: 1.25rem 0 2rem;
  box-sizing: border-box;
  background: #f5f5f6; /* very light gray */
  color: #111827;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  display: flex;          /* para ma-stretch yung inner */
}

/* INNER: full-width, walang max-width, walang side padding */
.gn-mf-current-location-inner {
  flex: 1;
  width: 100%;
  max-width: none;        /* tanggal limit na 1400px */
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)); /* 50/50 columns */
  gap: 0;                 /* dikit sila */
  align-items: stretch;   /* pareho naka-stretch sa height */
}

/* generic column wrapper */
.gn-mf-current-location-col {
  position: relative;
  display: flex;
  flex: 1 1 50%;
  align-items: stretch;   /* siguradong stretch pa rin */
}

/* MAP SIDE */
.gn-mf-current-location-col--map {
  align-items: stretch;
}

.gn-mf-current-location-map-shell {
  width: 100%;
  height: 100%;
  min-height: calc(100vh - 160px); /* sumalo ng full available height */
  border-radius: 0;                /* para walang bakanteng kanto */
  overflow: hidden;
  background: #e5e7eb; /* kulay habang naglo-load ang map */
  border: 1px solid #d1d5db;
  border-right: 0; /* dikit sa info panel */
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12);
}

.gn-mf-current-location-map {
  width: 100%;
  height: 100%;
}

/* INFO SIDE */
.gn-mf-current-location-col--info {
  align-items: stretch;
}

.gn-mf-current-location-info-card {
  height: 100%;
  min-height: calc(100vh - 160px); /* match sa map para walang bakante */
  width: 100%;
  padding: 1.75rem 2rem;
  border-radius: 0;                /* walang kanto gap */
  background: #ffffff;
  border: 1px solid #d1d5db;
  border-left: 0; /* seamless sa map shell */
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

/* Title / text styles na simple at malinis */
.gn-mf-current-location-title {
  margin: 0;
  font-size: clamp(1.4rem, 2.1vw, 1.9rem);
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #111827;
}

.gn-mf-current-location-subtitle {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.6;
  color: #4b5563;
}

/* Parang info/disclaimer block ng Zillow */
.gn-mf-current-location-details {
  margin-top: 0.5rem;
  padding: 0.9rem 1rem;
  border-radius: 0.75rem;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  font-size: 0.9rem;
  color: #374151;
}

/* Buttons */
.gn-mf-current-location-actions {
  margin-top: auto;
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.gn-mf-current-location-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.65rem 1.2rem;
  border-radius: 999px;
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition:
    transform 0.17s ease,
    box-shadow 0.17s ease,
    background 0.17s ease,
    color 0.17s ease,
    border-color 0.17s ease;
}

/* Ghost / outline style na bagay sa Zillow UI */
.gn-mf-current-location-btn--ghost {
  background: #ffffff;
  color: #1f2937;
  border: 1px solid #d1d5db;
}

.gn-mf-current-location-btn--ghost:hover {
  background: #eef2ff;
  border-color: #2563eb;
  color: #1d4ed8;
  transform: translateY(-1px);
  box-shadow: 0 10px 26px rgba(37, 99, 235, 0.25);
}

/* Responsive: stack columns sa mobile,
 * pero parehong full-width pa rin
 */
@media (max-width: 900px) {
  #gn-mf-current-location-page {
    padding: 1rem 0 1.5rem;
    display: block; /* balik block para hindi awkward sa mobile */
  }

  .gn-mf-current-location-inner {
    grid-template-columns: 1fr;
    padding: 0;
  }

  .gn-mf-current-location-map-shell,
  .gn-mf-current-location-info-card {
    min-height: 360px;
    border-radius: 0;
    border-right: 1px solid #d1d5db;
  }

  .gn-mf-current-location-info-card {
    margin-top: 1rem;
  }
}

