.trip-completion-dialog { width: min(820px, calc(100vw - 32px)); max-height: min(900px, calc(100dvh - 40px)); padding: 0; color: #dce8df; background: linear-gradient(140deg,#193329,#0c1c15); border: 1px solid #4b6756; border-radius: 22px; box-shadow: 0 28px 100px #0009; }
.trip-completion-dialog::backdrop { background: #030d09ba; backdrop-filter: blur(8px); }
.trip-completion-dialog[open] { display: flex; flex-direction: column; }
.trip-completion-dialog > header { display: flex; justify-content: space-between; gap: 20px; padding: 24px 28px 16px; border-bottom: 1px solid #385042; }
.trip-completion-dialog h2 { margin: 4px 0 8px; font-size: var(--ui-text-base, 10px); }
.trip-completion-dialog h3 { font-size: var(--ui-text-base, 10px); margin: 0 0 8px; }
.trip-completion-dialog p { margin: 6px 0; line-height: 1.6; color: #a9bfb1; font-size: var(--ui-text-base, 10px); }
.trip-completion-dialog form { display: flex; flex-direction: column; min-height: 0; }
.trip-completion-body { overflow: auto; padding: 22px 28px; overscroll-behavior: contain; }
.trip-completion-dialog fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.trip-completion-media { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; margin-bottom: 26px; }
.trip-completion-upload, .trip-completion-videos { min-width: 0; }
.trip-file-drop { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: start; gap: 12px; height: 180px; padding: 20px 16px; border: 1.5px dashed #a35d3b; border-radius: 15px; background: #e98a4510; cursor: pointer; }
.trip-file-drop:hover, .trip-file-drop.is-dragging { background: #e98a451c; border-color: #ef995e; }
.trip-file-drop[aria-disabled="true"] { opacity: .65; cursor: default; border-color: #69775f; background: #b2c5ab08; }
.trip-file-drop[aria-disabled="true"] .trip-file-drop-action { color: #dfbea2; }
.trip-file-drop:focus-within { outline: 2px solid #c4ded0; outline-offset: 3px; }
.trip-file-drop-icon { display: grid; place-items: center; width: 42px; height: 46px; border: 1px solid #dcb59a; border-radius: 12px; background: #e4e2d8c9; color: #d96631; }
.trip-file-drop-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.trip-file-drop-copy { display: flex; flex-direction: column; align-items: start; gap: 7px; min-width: 0; }
.trip-file-drop-copy strong { font-size: var(--ui-text-base, 10px); font-weight: 600; line-height: 1.5; color: #dce8df; }
.trip-file-drop-copy small { font-size: var(--ui-text-base, 10px); color: #9db3a5; }
.trip-file-drop-action { margin-block: 3px; font-size: var(--ui-text-base, 10px); color: #c3cec4; line-height: 1.6; }
.trip-file-drop-hint { font-size: var(--ui-text-base, 10px); line-height: 1.7; color: #a9b9ab; overflow-wrap: anywhere; }
.trip-file-drop .trip-actual-tip { color: #e6c2a5; }
.trip-upload-file-card [data-actual-time] { font-size: var(--ui-text-base, 10px); line-height: 1.7; color: #bdd6c6; }
.trip-upload-file-card [data-actual-time][data-state="warning"] { color: #edb38b; }
.trip-completion-dialog fieldset:disabled .trip-file-drop { opacity: .6; cursor: default; }
.trip-completion-dialog button { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; padding: 8px 12px; border: 1px solid #506959; border-radius: 9px; background: #bdd6c6; color: #132b1f; font: inherit; font-size: var(--ui-text-base, 10px); cursor: pointer; }
.trip-completion-dialog > header button { flex: 0 0 34px; height: 34px; min-height: 34px; padding: 0; background: transparent; color: #b9d0c1; font-size: 23px; }
.trip-completion-dialog [data-copy-plan], .trip-completion-dialog [data-actual-remove], .trip-completion-dialog footer [data-completion-close] { background: transparent; color: #b9d0c1; }
.trip-completion-gear-heading { display: flex; justify-content: space-between; gap: 16px; align-items: start; }
.trip-completion-gear-heading button { flex-shrink: 0; }
.trip-completion-note { margin-bottom: 16px !important; }
.trip-review-columns, .trip-review-row { display: grid; grid-template-columns: minmax(0, 1fr) 58px 58px; gap: 8px; align-items: center; }
.trip-review-columns { padding: 9px 0; border-bottom: 1px solid #47614f; color: #a3bbaa; font-size: var(--ui-text-base, 10px); }
.trip-review-columns > :not(:first-child), .trip-review-row > label { text-align: center; }
.trip-review-category h4 { display: flex; align-items: center; gap: 8px; margin: 20px 0 8px; font-size: var(--ui-text-base, 10px); line-height: 1.6; }
.trip-review-row { padding: 11px 0; border-bottom: 1px solid #9ab6a315; }
.trip-review-identity { display: grid; gap: 4px; overflow-wrap: anywhere; }
.trip-review-identity strong { font-size: var(--ui-text-base, 10px); font-weight: 500; }
.trip-review-identity small { color: #8fa999; font-size: var(--ui-text-base, 10px); }
.trip-review-row input { width: 16px; height: 16px; accent-color: #b5d6c2; }
.trip-review-row input:disabled { opacity: .75; }
.trip-completion-dialog footer { padding: 16px 28px 20px; border-top: 1px solid #385042; }
.trip-completion-dialog footer > div { display: flex; justify-content: flex-end; gap: 10px; margin-top: 12px; }
.trip-completion-dialog footer > p:first-child { color: #dabb95; }
.trip-completion-dialog button:disabled { opacity: .5; cursor: default; }
.trip-completion-toggle { display: flex; justify-content: center; align-items: center; }
.trip-completion-toggle input { width: 14px; height: 14px; margin: 0; accent-color: #afcfbd; cursor: pointer; }
.trip-completion-toggle input:disabled { cursor: default; opacity: .75; }
.trip-route-source { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 8px 0 18px; font-size: var(--ui-text-base, 10px); color: #a6bbaE; }
.trip-route-source[hidden] { display: none; }
.trip-route-source button { padding: 6px 10px; border: 1px solid #4b6554; border-radius: 7px; background: #15291e; color: #aec6b7; font: inherit; }
.trip-route-source button[aria-pressed="true"] { background: #b5d1bf; color: #173221; }
.trip-route-source button:disabled { opacity: .45; cursor: default; }
.trip-route-source small { width: 100%; font-size: var(--ui-text-base, 10px); }
@media (pointer: coarse) {
  .trip-history .session-item { grid-template-columns: 60px minmax(0, 1fr) 24px 32px; }
}
@media (max-width: 600px) {
  .trip-completion-dialog { width: calc(100vw - 16px); max-height: calc(100dvh - 20px); border-radius: 16px; }
  .trip-completion-dialog > header, .trip-completion-body, .trip-completion-dialog footer { padding: 16px; }
  .trip-completion-dialog h2 { font-size: var(--ui-text-base, 10px); }
  .trip-completion-gear-heading { flex-wrap: wrap; gap: 8px; }
  .trip-review-columns, .trip-review-row { grid-template-columns: minmax(0, 1fr) 42px 42px; gap: 4px; }
  .trip-completion-media { grid-template-columns: minmax(0, 1fr); }
  .trip-file-drop { padding: 18px 14px; }
}

.trip-completion-videos [data-trip-video-note] { margin: 12px 0 0; color: #e6c2a5; font-size: var(--ui-text-base, 10px); line-height: 1.6; }
/* File feedback lives outside the equal-size upload targets. */
.trip-upload-file-card { display: flex; align-items: start; justify-content: space-between; gap: 12px; padding: 14px; margin-top: 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.trip-upload-file-card > div { min-width: 0; flex: 1; }
.trip-upload-file-card strong, .trip-upload-file-card small { display: block; overflow-wrap: anywhere; }
.trip-upload-file-card strong { font-size: var(--ui-text-base, 10px); line-height: 1.6; color: var(--ink); }
.trip-upload-file-card small { color: var(--ink-soft); font-size: var(--ui-text-base, 10px); line-height: 1.6; margin-top: 5px; }
.trip-upload-file-card p { margin: 6px 0 0; font-size: var(--ui-text-base, 10px); color: var(--mint); overflow-wrap: anywhere; }
.trip-upload-file-card [data-state="warning"] { color: #edb38b; }
.trip-upload-file-card button { flex-shrink: 0; padding: 6px 10px; border: 1px solid var(--line); border-radius: 10px; background: none; color: var(--ink-soft); white-space: nowrap; }
