/* =============================================================================
   Points of Sale — Layout & Design
   ============================================================================= */

#midia-blocks-sales-points {
  font-family: inherit;
  padding: 20px 0 40px;
}

/* Layout: two columns */
.pos-layout {
  display: flex;
  gap: 0;
  align-items: stretch;
  min-height: 500px;
  width: 100%;
}

/* Left column: store list */
.pos-list-panel {
  width: 320px;
  flex-shrink: 0;
  overflow-y: auto;
  max-height: 520px;
  border: 1px solid #e0e0e0;
  border-right: none;
  background: #fff;
}

.pos-list-panel ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.pos-list-panel .midia-sales-points-item {
  border-bottom: 1px solid #f0f0f0;
}

.pos-list-panel .midia-sales-points-item:last-child {
  border-bottom: none;
}

.pos-list-panel .store-item {
  display: block;
  padding: 14px 16px;
  text-decoration: none;
  color: inherit;
  transition: background 0.15s ease;
}

.pos-list-panel .store-item:hover {
  background: #fdf0f1;
  text-decoration: none;
}

.pos-list-panel .pos-name {
  font-size: 16px;
  font-weight: 700;
  color: #c30f20;
  margin: 0 0 6px;
  line-height: 1.3;
}

.pos-list-panel .pos-address,
.pos-list-panel .pos-hours,
.pos-list-panel .pos-phone {
  font-size: 14px;
  color: #555;
  margin: 3px 0;
  line-height: 1.5;
}

.pos-list-panel .pos-hours span,
.pos-list-panel .pos-phone span {
  color: #333;
}

/* Right column: map */
.pos-map-panel {
  flex: 1;
  position: relative;
  min-height: 520px;
}

#midia-blocks-sales-points-map-city-wrapper {
  width: 100% !important;
  height: 100% !important;
  min-height: 520px;
  border: 1px solid #e0e0e0;
}

/* Error message */
.pos-map-error {
  margin: 0 0 16px;
  padding: 12px 16px;
  border-radius: 4px;
}

/* Popup info window */
.midia-sales-points-map-popup {
  padding: 4px;
  max-width: 260px;
}

.midia-sales-points-map-popup .midia-sales-points-name {
  font-size: 14px;
  font-weight: 700;
  color: #c30f20;
  margin: 0 0 6px;
}

.midia-sales-points-map-popup p {
  font-size: 12px;
  color: #555;
  margin: 3px 0;
  line-height: 1.4;
}

/* Responsive */
@media (max-width: 768px) {
  .pos-layout {
    flex-direction: column;
  }

  .pos-list-panel {
    width: 100%;
    max-height: 280px;
    border-right: 1px solid #e0e0e0;
    border-bottom: none;
  }

  .pos-map-panel,
  #midia-blocks-sales-points-map-city-wrapper {
    min-height: 350px;
  }
}
