/* ============================================================
   OurWayTrips V5.2.2 — Final Visual Polish
   Visual-only corrections from full screen-recording review.
   ============================================================ */

/* 1) Trip Recap dark section: guaranteed contrast */
.recap-highlight,
.recap-highlight * {
  color: #f8fbfc !important;
}
.recap-highlight {
  background: linear-gradient(135deg, #29495c 0%, #3e6a7b 100%) !important;
  border-color: rgba(255,255,255,.16) !important;
}
.recap-highlight .eyebrow,
.recap-highlight small {
  color: #dcecf2 !important;
}
.recap-highlight h2,
.recap-highlight h3,
.recap-highlight strong {
  color: #ffffff !important;
}
.recap-highlight p {
  color: #e5eef2 !important;
}
.recap-highlight article {
  background: rgba(255,255,255,.10) !important;
  border-color: rgba(255,255,255,.18) !important;
}
.recap-highlight article small {
  color: #d7e7ed !important;
}
.recap-highlight article strong {
  color: #ffffff !important;
}

/* 2) Desktop modals: fit content instead of feeling like tall sheets */
@media (min-width: 761px) {
  .modal-backdrop {
    align-items: center !important;
    padding: 28px !important;
  }

  .modal-backdrop .memory-modal,
  .modal-backdrop .trip-create-modal,
  .modal-backdrop .smart-import-modal,
  .modal-backdrop .attachment-modal {
    width: min(680px, calc(100vw - 56px)) !important;
    max-height: min(82vh, 760px) !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: auto !important;
    border-radius: 24px !important;
    padding: 24px !important;
  }

  .trip-create-modal {
    max-width: 620px !important;
  }

  .trip-create-modal form,
  .smart-import-modal form {
    margin-bottom: 0 !important;
  }

  .trip-create-modal .memory-form-actions,
  .smart-import-modal .memory-form-actions,
  .attachment-modal .memory-form-actions {
    margin-top: 18px !important;
    padding-bottom: 0 !important;
  }
}

/* 3) Form consistency */
.modal-backdrop input,
.modal-backdrop select,
.modal-backdrop textarea,
.memory-sheet input,
.memory-sheet select,
.memory-sheet textarea {
  min-height: 44px;
  border-radius: 13px !important;
}

.modal-backdrop textarea,
.memory-sheet textarea {
  min-height: 112px;
}

.modal-backdrop label,
.memory-sheet label {
  line-height: 1.35;
}

/* Native select/dropdown controls should visually fit the app better */
select {
  background-color: #fffaf4;
  color: #3a281e;
}

/* 4) Compact long secondary sections without hiding information */
#routeOptimizerPanel,
#nearbyPanel,
#todayProPanel,
#recapProPanel {
  margin-top: 18px;
  margin-bottom: 18px;
}

.integrated-panel {
  padding: 18px;
}

.integrated-panel > p {
  max-width: 880px;
}

/* 5) Actions stay tidy */
.integrated-actions {
  align-items: center;
}
.integrated-actions button,
.integrated-actions a {
  line-height: 1.2;
}

/* 6) Mobile refinements */
@media (max-width: 760px) {
  .recap-highlight {
    padding: 18px !important;
  }

  .recap-highlight .recap-pro-grid,
  .recap-highlight .route-proposal-grid {
    gap: 10px !important;
  }

  .recap-highlight article {
    padding: 13px !important;
  }

  .modal-backdrop .memory-modal,
  .modal-backdrop .trip-create-modal,
  .modal-backdrop .smart-import-modal,
  .modal-backdrop .attachment-modal {
    max-height: 88dvh !important;
  }

  .integrated-panel {
    padding: 15px;
  }
}