@ticketboothapp/booking 0.1.23 → 1.2.24

package/src/components/booking/BookingDialog.module.css

@@ -1,643 +0,0 @@
-.overlay {
-  position: fixed;
-  inset: 0;
-  z-index: 9999;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: rgba(0, 0, 0, 0.5);
-  backdrop-filter: blur(4px);
-  padding: 1rem;
-}
-
-@media (max-width: 639px) {
-  .overlay {
-    padding: 1rem 1.25rem;
-  }
-}
-
-.dialog {
-  background: var(--accent-white);
-  border-radius: 1rem;
-  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
-  width: 100%;
-  max-width: 680px;
-  max-height: 90vh;
-  display: flex;
-  flex-direction: column;
-  overflow: hidden;
-}
-
-.header {
-  display: grid;
-  grid-template-columns: auto 1fr auto;
-  align-items: center;
-  gap: 0.75rem;
-  padding: 1rem 0.75rem;
-  border-bottom: 1px solid #e5e7eb;
-  flex-shrink: 0;
-}
-
-.headerLeft {
-  display: flex;
-  justify-content: flex-start;
-  flex-shrink: 0;
-}
-
-.headerSpacer {
-  display: block;
-  width: 2.5rem;
-  height: 2.5rem;
-  flex-shrink: 0;
-}
-
-.backButton {
-  display: flex;
-  align-items: center;
-  gap: 0.25rem;
-  padding: 0.5rem;
-  font-size: 0.875rem;
-  font-family: 'Figtree', sans-serif;
-  color: var(--accent-turquoise);
-  background: none;
-  border: none;
-  cursor: pointer;
-  font-weight: 500;
-}
-
-.backButton:hover {
-  text-decoration: underline;
-}
-
-.title {
-  font-size: 1.125rem;
-  font-weight: 700;
-  margin: 0;
-  justify-self: center;
-  text-align: center;
-  min-width: 0;
-  overflow-wrap: break-word;
-}
-
-.headerRight {
-  display: flex;
-  justify-content: flex-end;
-  flex-shrink: 0;
-}
-
-.closeButton {
-  padding: 0.5rem;
-  background: none;
-  border: none;
-  cursor: pointer;
-  color: #6b7280;
-}
-
-.closeButton:hover {
-  color: #111;
-}
-
-.content {
-  flex: 1;
-  overflow-y: auto;
-  overflow-x: hidden;
-  min-height: 0;
-  overscroll-behavior: contain;
-}
-
-.screen {
-  padding: 1.25rem;
-}
-
-@media (min-width: 768px) {
-  .dialog {
-    max-width: 960px;
-    max-height: 92vh;
-  }
-
-  .title {
-    font-size: 1.375rem;
-  }
-
-  .titleProductGrid {
-    font-size: 1.5rem;
-  }
-}
-
-.titleProductGrid {
-  composes: title;
-}
-
-/* ----- Dependent add-on dialog (photo sessions): layout + typography; control sizing in booking-flow.css (.dap-add-on-dialog) ----- */
-
-.dapTopMedia {
-  margin-bottom: 1.25rem;
-}
-
-.dapSlotRow {
-  display: flex;
-  flex-direction: column;
-  gap: 0.625rem;
-}
-
-.dapSessionPickerLabel {
-  margin-bottom: 0.375rem !important;
-}
-
-.dapSlotDateLine {
-  font-size: 0.75rem;
-  font-weight: 500;
-  color: var(--booking-stone-600, #57534e);
-  margin-bottom: 0.125rem;
-}
-
-.dapSlotTimeRangeLine {
-  font-size: 0.9375rem;
-  font-weight: 600;
-  color: var(--booking-stone-900, #1c1917);
-  font-variant-numeric: tabular-nums;
-}
-
-/* Selected session row: green button uses ReturnTimeSelector child colors; force white for contrast. */
-.dapSlotBtnSelected,
-.dapSlotBtnSelected * {
-  color: #fff !important;
-}
-
-/* Full-width “how this fits your trip” below the session list (not inside a slot row). */
-.dapItineraryInsert {
-  margin-top: 0.75rem;
-}
-
-.dapRefItinerarySummaryTitle {
-  margin-bottom: 0.375rem !important;
-}
-
-.dapItineraryInsertTitle {
-  margin-bottom: 0.375rem !important;
-}
-
-.dapSessionDateUnderTitle {
-  font-family: 'Figtree', sans-serif;
-  font-size: 0.8125rem;
-  font-weight: 600;
-  color: var(--booking-stone-700, #44403c);
-  padding: 0.5rem;
-}
-
-.dapItineraryInsertRow {
-  padding-bottom: 0.5rem;
-  border-bottom: 1px solid var(--booking-stone-200, #e7e5e4);
-}
-
-.dapItineraryInsertRow:last-of-type {
-  border-bottom: none;
-  padding-bottom: 0;
-}
-
-.dapItineraryInsertLead {
-  font-family: 'Poppins', sans-serif;
-  font-weight: 700;
-  font-size: 0.9375rem;
-  text-transform: lowercase;
-  color: var(--accent-orange, #ff4d00);
-  margin-bottom: 0.375rem;
-}
-
-.dapItineraryInsertText {
-  font-family: 'Figtree', sans-serif;
-  font-size: 0.875rem;
-  line-height: 1.45;
-  color: var(--booking-stone-700, #44403c);
-  margin: 0;
-}
-
-.dapItineraryInsertFoot {
-  font-family: 'Figtree', sans-serif;
-  font-size: 0.8125rem;
-  line-height: 1.4;
-  color: var(--booking-stone-500, #78716c);
-  margin: 0.75rem 0 0;
-}
-
-.dapCheckoutSectionPlain {
-  border-top: none !important;
-  margin-top: 0 !important;
-  padding-top: 0 !important;
-}
-
-.dapSubmitBtnWrapper {
-  margin-top: 0.25rem !important;
-}
-
-.dapCancellationFinePrint {
-  font-family: 'Figtree', sans-serif;
-  font-size: 0.8125rem;
-  line-height: 1.5;
-  color: var(--booking-stone-500, #78716c);
-  padding: var(--spacing-small);
-}
-
-.dapCancellationFinePrint strong {
-  font-weight: 600;
-  color: var(--booking-stone-600, #57534e);
-}
-
-.dapPreviewItinList {
-  display: flex;
-  flex-direction: column;
-  gap: 0;
-  border: 1px solid var(--booking-stone-200, #e7e5e4);
-  border-radius: 0.5rem;
-  overflow: hidden;
-  background: #fff;
-}
-
-.dapPreviewItinRow {
-  display: flex;
-  align-items: flex-start;
-  justify-content: space-between;
-  gap: 1rem;
-  padding: 0.75rem 1rem;
-  border-bottom: 1px solid var(--booking-stone-100, #f5f5f4);
-  font-family: 'Figtree', sans-serif;
-  font-size: 0.875rem;
-  line-height: 1.35;
-}
-
-.dapPreviewItinRow:last-child {
-  border-bottom: none;
-}
-
-.dapPreviewItinLabel {
-  flex: 1;
-  min-width: 0;
-  color: var(--booking-stone-800, #292524);
-}
-
-.dapPreviewItinTime {
-  flex-shrink: 0;
-  font-weight: 600;
-  color: var(--booking-stone-900, #1c1917);
-  text-align: right;
-  font-variant-numeric: tabular-nums;
-}
-
-.dapPreviewItinMain {
-  flex: 1;
-  min-width: 0;
-  display: flex;
-  flex-direction: column;
-  gap: 0.25rem;
-}
-
-.dapPreviewItinLead {
-  font-weight: 700;
-  color: var(--booking-emerald-700, #047857);
-  font-size: 0.875rem;
-}
-
-.dapPreviewItinSub {
-  font-size: 0.8125rem;
-  color: var(--booking-stone-600, #57534e);
-}
-
-.dapPreviewPhotoRow {
-  background: var(--booking-emerald-50, #ecfdf5);
-  border-bottom-color: var(--booking-emerald-100, #d1fae5);
-}
-
-.dapPreviewPhotoRow .dapPreviewItinTime {
-  color: var(--booking-emerald-800, #065f46);
-}
-
-.dapForm {
-  display: flex;
-  flex-direction: column;
-  gap: 1.25rem;
-}
-
-/* Must come after `.dapForm` and use both classes — otherwise `gap: 1.25rem` wins over a lone `.dapFormSlotsTight`. */
-.dapForm.dapFormSlotsTight {
-  gap: 0.25rem;
-}
-
-/* Times + continue block sits under the ref / session-length form (single scroll, no step change). */
-.dapSlotsPanelBelow {
-  margin-top: 1rem;
-  padding-top: 0.25rem;
-}
-
-/* DAP checkout questionnaire — tighter than CheckoutForm contactSection (gap 1rem) */
-.dapCheckoutQuestions {
-  margin-top: 0.75rem;
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
-}
-
-.dapCheckoutQuestionField {
-  display: flex;
-  flex-direction: column;
-  gap: 0.25rem;
-}
-
-.dapCheckoutQuestionLabel {
-  display: block;
-  font-size: 0.875rem;
-  font-weight: 500;
-  color: #44403c;
-  margin: 0 0 0.125rem;
-  line-height: 1.35;
-}
-
-.dapCheckoutQuestionHelp {
-  font-family: 'Figtree', sans-serif;
-  font-size: 0.8125rem;
-  line-height: 1.45;
-  color: #57534e;
-  margin: 0.25rem 0 0;
-}
-
-.dapCheckoutCheckboxQuestion {
-  padding: var(--spacing-small);
-}
-
-.dapField {
-  display: flex;
-  flex-direction: column;
-  gap: 0.375rem;
-}
-
-.dapLabel {
-  font-family: 'Figtree', sans-serif;
-  font-weight: 600;
-  font-size: 1rem;
-  line-height: 1.4;
-  color: #292524;
-}
-
-.dapIntro {
-  font-family: 'Figtree', sans-serif;
-  font-size: 1rem;
-  line-height: 1.55;
-  color: #57534e;
-  margin: 0;
-}
-
-.dapMetaLine {
-  font-family: 'Figtree', sans-serif;
-  font-size: 1rem;
-  line-height: 1.5;
-  color: #57534e;
-  margin: 0;
-}
-
-.dapMetaLine strong,
-.dapMetaLine .dapRefMono {
-  color: #1c1917;
-}
-
-.dapRefMono {
-  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
-    monospace;
-  font-weight: 600;
-  font-size: 0.95em;
-}
-
-.dapFieldset {
-  border: 0;
-  padding: 0;
-  margin: 0;
-  min-width: 0;
-}
-
-.dapLegend {
-  font-family: 'Figtree', sans-serif;
-  font-weight: 600;
-  font-size: 1rem;
-  line-height: 1.4;
-  color: #292524;
-  padding: 0;
-}
-
-.dapRadioList {
-  display: flex;
-  flex-direction: column;
-  gap: 0.625rem;
-}
-
-.dapRadioOption {
-  display: flex;
-  align-items: center;
-  gap: 0.75rem;
-  cursor: pointer;
-  font-family: 'Figtree', sans-serif;
-  font-size: 1rem;
-  line-height: 1.4;
-  color: #292524;
-  padding: 0.875rem 1.125rem;
-  border: 1px solid #e7e5e4;
-  border-radius: 0.5rem;
-  background: #fff;
-  margin: 0;
-}
-
-.dapRadioOption:hover {
-  border-color: #d6d3d1;
-  background: #fafaf9;
-}
-
-.dapSessionOptionGrid {
-  display: grid;
-  grid-template-columns: 1fr;
-  gap: 0.5rem;
-}
-
-@media (min-width: 480px) {
-  .dapSessionOptionGrid {
-    grid-template-columns: repeat(3, 1fr);
-  }
-}
-
-/* Base tile look; .booking-flow-preflight overrides padding/background to beat button reset */
-.dapSessionOptionBtn {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 1rem 1.25rem;
-  border: none;
-  border-radius: 0.5rem;
-  background: var(--light-orange-background-dark, #f7e4dc);
-  color: var(--booking-stone-700, #44403c);
-  cursor: pointer;
-  text-align: center;
-  font-family: 'Figtree', sans-serif;
-  transition: background 0.2s ease;
-  width: 100%;
-  box-sizing: border-box;
-}
-
-.dapSessionOptionBtn:hover:not(:disabled):not(.dapSessionOptionBtnSelected) {
-  background: var(--light-orange-background, #fff1eb);
-}
-
-.dapSessionOptionBtn:disabled {
-  cursor: wait;
-  opacity: 0.55;
-}
-
-.dapSessionOptionBtnSelected {
-  background: var(--booking-emerald-600, #059669);
-  color: #fff;
-}
-
-.dapSessionOptionTitle {
-  font-weight: 600;
-  font-size: 0.875rem;
-  line-height: 1.35;
-  color: inherit;
-}
-
-.dapSessionOptionBtnSelected .dapSessionOptionTitle {
-  color: #fff;
-}
-
-.dapSessionOptionMeta {
-  font-size: 0.8125rem;
-  font-weight: 500;
-  line-height: 1.35;
-  color: var(--booking-stone-500, #78716c);
-}
-
-.dapSessionOptionBtnSelected .dapSessionOptionMeta {
-  color: rgba(255, 255, 255, 0.92);
-}
-
-.dapSessionOptionPrice {
-  font-size: 0.8125rem;
-  font-weight: 500;
-  line-height: 1.35;
-  color: var(--booking-stone-500, #78716c);
-}
-
-.dapSessionOptionBtnSelected .dapSessionOptionPrice {
-  color: rgba(255, 255, 255, 0.92);
-}
-
-.dapTableWrap {
-  overflow-x: auto;
-  border-radius: 0.5rem;
-  border: 1px solid #e7e5e4;
-  background: #fff;
-}
-
-.dapTable {
-  width: 100%;
-  border-collapse: collapse;
-  text-align: left;
-  font-family: 'Figtree', sans-serif;
-  font-size: 1rem;
-}
-
-.dapTable thead {
-  background: #fafaf9;
-  color: #44403c;
-}
-
-.dapTable th {
-  font-weight: 600;
-  padding: 0.75rem 1rem;
-  vertical-align: middle;
-}
-
-.dapTable td {
-  padding: 0.75rem 1rem;
-  vertical-align: middle;
-}
-
-.dapTable tbody tr {
-  border-top: 1px solid #f5f5f4;
-}
-
-.dapRowSelected {
-  background: #ecfdf5 !important;
-}
-
-.dapQtyField {
-  max-width: 12rem;
-}
-
-.dapGrid2 {
-  display: grid;
-  grid-template-columns: 1fr;
-  gap: 1rem;
-}
-
-@media (min-width: 640px) {
-  .dapGrid2 {
-    grid-template-columns: 1fr 1fr;
-  }
-}
-
-.dapSummary {
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
-  border-radius: 0.5rem;
-  border: 1px solid #e7e5e4;
-  background: #fafaf9;
-  padding: 1rem 1.125rem;
-  font-family: 'Figtree', sans-serif;
-  font-size: 1rem;
-  line-height: 1.45;
-  color: #292524;
-}
-
-.dapSummaryRow {
-  display: flex;
-  justify-content: space-between;
-  gap: 1rem;
-  align-items: baseline;
-}
-
-.dapSummaryAmount {
-  font-variant-numeric: tabular-nums;
-  font-weight: 600;
-}
-
-.dapSummaryTotal {
-  display: flex;
-  justify-content: space-between;
-  gap: 1rem;
-  align-items: baseline;
-  padding-top: 0.5rem;
-  margin-top: 0.25rem;
-  border-top: 1px solid #e7e5e4;
-  font-weight: 700;
-}
-
-.dapSummaryTotal .dapSummaryAmount {
-  font-weight: 700;
-}
-
-.dapError {
-  font-family: 'Figtree', sans-serif;
-  font-size: 1rem;
-  line-height: 1.45;
-  color: #b91c1c;
-  margin: 0;
-}
-
-.dapStripeNotice {
-  font-family: 'Figtree', sans-serif;
-  font-size: 0.9375rem;
-  line-height: 1.5;
-  color: #92400e;
-  background: #fffbeb;
-  border: 1px solid #fde68a;
-  border-radius: 0.5rem;
-  padding: 0.875rem 1.125rem;
-  margin: 0;
-}