/* TravelDMC mock — layered on Bootstrap 5.3.3.
   Gradient and card treatment match the existing dynamic/ prototype. */

:root {
  --tdmc-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --tdmc-ink: #1f2333;
  --tdmc-muted: #6c757d;
  --tdmc-line: #e3e6ef;
}

body { background: #f6f7fb; color: var(--tdmc-ink); }
.card-gradient-header { background: var(--tdmc-gradient); color: #fff; }

.product-card {
  border: 1px solid var(--tdmc-line);
  transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
  height: 100%;
}
.product-card:hover {
  box-shadow: 0 10px 28px rgba(31,35,51,.12);
  transform: translateY(-4px);
  border-color: #c9cfe4;
}
.product-accent { height: 6px; border-radius: .375rem .375rem 0 0; }

/* The three orthogonal axes */
.axis {
  display: inline-block;
  font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  padding: .25rem .5rem; border-radius: .3rem; border: 1px solid transparent;
}
.axis-time { background: #eef1fe; color: #3c4fb5; border-color: #d7dcfb; }
.axis-sequence { background: #edf7f2; color: #1c7a56; border-color: #d2ebe0; }

/* Friction ladder */
.rung {
  display: inline-flex; align-items: center; gap: .5rem;
  font-weight: 700; padding: .4rem .8rem; border-radius: .4rem; border: 1px solid;
}
.rung-INSTANT { background: #e8f6ee; color: #146c43; border-color: #b7e0c8; }
.rung-CONFIRM_THEN_PAY { background: #eaf1fd; color: #0a58ca; border-color: #c3d7f8; }
.rung-DEPOSIT { background: #fff6e5; color: #97620a; border-color: #f5e0b4; }
.rung-PREPAY { background: #fdeee8; color: #a54012; border-color: #f6d2c3; }
.rung-MANUAL { background: #fdeaec; color: #b02a37; border-color: #f5c6cb; }

.ladder-step {
  padding: .5rem .75rem; border-radius: .375rem;
  border: 1px solid var(--tdmc-line); background: #fff;
  color: var(--tdmc-muted); font-size: .85rem;
}
.ladder-step.active { border-width: 2px; font-weight: 700; }

/* Entitlements */
.ent {
  border: 1px solid var(--tdmc-line); border-left-width: 4px;
  border-radius: .375rem; background: #fff;
}
.ent-ACCESS { border-left-color: #5b6ee1; }
.ent-VISIT { border-left-color: #0f8a7a; }
.ent-CREDIT { border-left-color: #b0552f; }
.ent-SCHEDULED { border-left-color: #6a4bb5; }
.ent-DISCOUNT { border-left-color: #8d8fa3; }
.ent.state-REDEEMED { background: #f7f8fb; opacity: .72; }
.ent.state-REDEEMED .ent-label { text-decoration: line-through; }

.kind-tag { font-size: .65rem; font-weight: 700; letter-spacing: .06em; color: var(--tdmc-muted); text-transform: uppercase; }

/* Day timeline */
.day-block { border-left: 3px solid #667eea; background: #fff; border-radius: 0 .5rem .5rem 0; padding: 1rem 1.25rem; }
.day-number {
  width: 2rem; height: 2rem; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; background: var(--tdmc-gradient); color: #fff; font-weight: 700; font-size: .85rem;
}
.slot { font-variant-numeric: tabular-nums; color: var(--tdmc-muted); font-size: .85rem; min-width: 5rem; }

/* Reasons */
.reasons td { font-size: .85rem; vertical-align: top; }
.reasons td:first-child { font-weight: 600; white-space: nowrap; }
.reasons td:nth-child(2) { font-variant-numeric: tabular-nums; white-space: nowrap; }
.reasons td:last-child { color: var(--tdmc-muted); }

.dim-bar { height: 6px; border-radius: 3px; background: #e9ecf5; overflow: hidden; }
.dim-bar > span { display: block; height: 100%; background: var(--tdmc-gradient); }

/* Slot picker — reservations */
.slot-picker > summary { list-style: none; cursor: pointer; }
.slot-picker > summary::-webkit-details-marker { display: none; }
.slot-picker[open] > summary { background: #667eea; color: #fff; border-color: #667eea; }
.slot-panel {
  border: 1px solid var(--tdmc-line);
  border-radius: .375rem;
  padding: .75rem;
  background: #fbfbfe;
  min-width: 18rem;
}
.slot-panel .kind-tag { display: block; }
.held-chip {
  display: inline-block;
  background: #eef1fe; color: #3c4fb5; border: 1px solid #d7dcfb;
  border-radius: .3rem; padding: .15rem .5rem;
  font-size: .75rem; font-weight: 700; font-variant-numeric: tabular-nums;
}

/* Provider portal */
.counterparty {
  background: #f7f8fd;
  border: 1px solid var(--tdmc-line);
  border-radius: .375rem;
  padding: .6rem .8rem;
}
.slot-chip {
  display: inline-flex; flex-direction: column;
  border: 1px solid var(--tdmc-line); border-radius: .375rem;
  padding: .3rem .6rem; background: #fff;
  font-size: .85rem; font-weight: 600; font-variant-numeric: tabular-nums;
}
.slot-chip-held { border-color: #667eea; background: #eef1fe; color: #3c4fb5; }
.slot-chip .kind-tag { font-weight: 700; }

/* Booking request lifecycle */
.booking-step {
  border: 1px solid var(--tdmc-line); border-radius: .5rem;
  background: #fff; padding: 1rem;
}
.booking-step.active { border-color: #667eea; background: #f3f4ff; }
.booking-step.complete { border-color: #9fd4b7; background: #f2fbf6; }

.mono { font-variant-numeric: tabular-nums; }
.table-scroll { overflow-x: auto; }
.customer-btn { width: 100%; text-align: left; border: 1px solid var(--tdmc-line); background: #fff; border-radius: .375rem; }
.customer-btn:hover { border-color: #667eea; }
.customer-btn.selected { border-color: #667eea; border-width: 2px; }