/* GT America Font Declarations */
@font-face {
  font-family: 'GTAmerica';
  src: url('/fonts/GTAmericaStandard/GT-America-Standard-Regular.woff2') format('woff2'),
       url('/fonts/GTAmericaStandard/GT-America-Standard-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'GTAmerica';
  src: url('/fonts/GTAmericaStandard/GT-America-Standard-Regular-Italic.woff2') format('woff2'),
       url('/fonts/GTAmericaStandard/GT-America-Standard-Regular-Italic.woff') format('woff');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'GTAmerica';
  src: url('/fonts/GTAmericaStandard/GT-America-Standard-Medium.woff2') format('woff2'),
       url('/fonts/GTAmericaStandard/GT-America-Standard-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'GTAmerica';
  src: url('/fonts/GTAmericaStandard/GT-America-Standard-Medium-Italic.woff2') format('woff2'),
       url('/fonts/GTAmericaStandard/GT-America-Standard-Medium-Italic.woff') format('woff');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

/* Global Styles */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: 'GTAmerica', sans-serif;
  font-weight: 400;
  font-size: 15.5px;
  line-height: 19.5px;
  /* letter-spacing: -0.007em; */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: 'ss01', 'onum' 0, 'pnum' 1;
}

/* Custom Marker Styles */
.custom-marker {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #000000;
  border: 3px solid white;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  color: white;
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: 'tnum' 1, 'lnum' 1;
}

.marker-number {
  transform: translateY(-0.05em);
}

/* Gallery marker uses same style as regular markers */
.gallery-marker {
  /* No additional styling needed - inherits from .custom-marker */
}

/* Map Info Display */
.map-info {
  position: absolute;
  top: 10px;
  left: 10px;
  background: rgba(0, 0, 0, 0.8);
  color: white;
  padding: 8px 12px;
  border-radius: 3px;
  z-index: 1000;
}


/* Popup Styles */
.popup-content {
  padding: 10px 10px 10px 6px;
}

.popup-title {
  margin: 0;
  color: #fff;
  font-weight: 500;
  white-space: nowrap;
}

.popup-address {
  margin: 0;
  color: #fff;
  white-space: nowrap;
}

.popup-button {
  margin-top: 15px;
}

/* Utility Classes */
.text-base {
  font-size: 15.5px !important;
  line-height: 19.5px !important;
  letter-spacing: -0.007em !important;
}

/* Force GT America on popup elements */
.popup-content,
.popup-title,
.popup-address,
.popup-button {
  font-family: 'GTAmerica', sans-serif !important;
  font-feature-settings: 'ss01', 'onum' 0, 'pnum' 1 !important;
  font-size: 15.5px !important;
  line-height: 19.5px !important;
  letter-spacing: -0.007em !important;
}

/* MapLibre Popup Overrides */
.maplibregl-popup {
  z-index: 1000 !important;
}

.maplibregl-popup-content {
  background: #000;
  color: white;
  border-radius: 10px;
  padding: 5px 10px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
  border: 3px solid #fff;
  font-family: 'GTAmerica', sans-serif !important;
  font-feature-settings: 'ss01', 'onum' 0, 'pnum' 1 !important;
  max-width: none !important;
  width: max-content !important;
}

.maplibregl-popup-content * {
  font-family: 'GTAmerica', sans-serif !important;
  font-feature-settings: 'ss01', 'onum' 0, 'pnum' 1 !important;
}

.maplibregl-popup-close-button {
  color: white;
  font-size: 20px;
  position: absolute;
  right: 7px;
  top: 0px;
}

.maplibregl-popup-tip {
  border-top-color: #fff;
}

/* Button Styles */
.popup-button {
  /* Layout */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  flex-shrink: 0;

  /* Sizing - h-10 = 40px, px-[13px] */
  height: 30px;
  min-width: 30px;
  padding: 9.5px 8px;

  /* Typography */
  font-weight: 400;
  text-decoration: none;

  /* Appearance */
  background-color: #000;
  color: #fff;
  border: 1px solid #fff;
  cursor: pointer;

  /* Transitions */
  transition: border-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
              background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
              color 150ms cubic-bezier(0.4, 0, 0.2, 1);
}

.popup-button:hover {
  background-color: #fff;
  color: #000;
  border-color: #fff;
}