/* app/assets/stylesheets/custom.css */

.card-wide {
  max-width: 820px;
  width: 100%;
  border-radius: 12px;
  background-color: #fff;
  border: 1px solid #cdd4db;
  overflow: hidden;
}

.gradient-header {
  background: linear-gradient(to right, #2b95d6, #1070ca);
  color: #fff;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.stack-box {
  border-left: 6px solid #2b95d6;
  border-radius: 12px;
}

.map-box {
  height: 300px;
  width: 100%;
  border: 1px solid #ccc;
  border-radius: 6px;
}

/* Image preview container inside card */
.image-preview-container {
  overflow: hidden;
  border-top-left-radius: 0.375rem; /* Bootstrap's .rounded-top */
  border-top-right-radius: 0.375rem;
}

/* Actual image inside the preview container */
.image-preview {
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.custom-form-card {
  max-width: 1100px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #cdd4db;
}

.custom-form-header {
  background: linear-gradient(to right, #2b95d6, #1070ca);
  color: #fff;
  padding: 1rem 1.5rem;
}

.custom-panel {
  border: 1px solid #dee2e6;
  border-left: 6px solid #2b95d6;
  border-radius: 12px;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.custom-map-box {
  height: 400px;
  border-radius: 0.375rem;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  margin-bottom: 1rem;
}

.custom-image-box {
  overflow: hidden;
}

.custom-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
}