/* public/assets/mobility.css */
/* =========================================================
   MOBILITY — Transport + Rides
   Приведено к единому светлому воздушному стилю сайта
   Scope: только .transport_view и .rides_view
   ========================================================= */

/* =========================================================
   0) SAFETY BASE (локально)
   ========================================================= */
.transport_view,
.transport_view *,
.rides_view,
.rides_view *{
  box-sizing: border-box;
}

/* =========================================================
   1) TOKENS BRIDGE (единые переменные)
   ========================================================= */
.transport_view,
.rides_view{
  --m-surface: rgba(255,255,255,.70);
  --m-surface-2: rgba(255,255,255,.56);
  --m-border: rgba(181,194,222,.24);
  --m-text: var(--ui-text, #0f172a);
  --m-muted: rgba(15,23,42,.58);
  --m-brand: var(--ui-primary, var(--theme-color, #0088cc));

  --m-radius: 18px;
  --m-radius-sm: 14px;
  --m-shadow:
    0 10px 24px rgba(71,85,105,.05),
    inset 0 1px 0 rgba(255,255,255,.54);
  --m-shadow-sm:
    0 8px 18px rgba(71,85,105,.04),
    inset 0 1px 0 rgba(255,255,255,.50);

  --m-soft: rgba(0,136,204,.08);
  --m-soft-2: rgba(255,255,255,.44);
  --m-line: rgba(181,194,222,.18);

  color: var(--m-text);
}

/* =========================================================
   2) PAGE CONTAINER
   ========================================================= */
.transport_view,
.rides_view{
  width: 100%;
  max-width: var(--container, 1440px);
  margin-left: auto;
  margin-right: auto;
  padding-top: 14px;
  padding-bottom: 28px;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
  min-width: 0;
}

@media (max-width: 1024px){
  body.has-bottom-nav .transport_view,
  body.has-bottom-nav .rides_view:not(.rides_view--cabinet){
    padding-bottom: calc(var(--bottom-nav-h, 78px) + 16px);
  }
}

.transport_view .text-muted,
.transport_view .muted,
.rides_view .text-muted,
.rides_view .muted{
  color: var(--m-muted);
}

.transport_view .text-center,
.rides_view .text-center{
  text-align: center;
}

/* =========================================================
   3) CARD / ALERTS / BUTTONS / INPUTS
   ========================================================= */
.rides_view .card,
.transport_view .card{
  background: var(--m-surface);
  border: 1px solid var(--m-border);
  border-radius: var(--m-radius);
  box-shadow: var(--m-shadow-sm);
  overflow: hidden;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.rides_view .card-body,
.transport_view .card-body{
  padding: 14px;
  min-width: 0;
}

.rides_view .card-header,
.transport_view .card-header{
  padding: 12px 14px;
  font-weight: 950;
  color: var(--m-text);
  border-bottom: 1px solid var(--m-line);
  background: rgba(255,255,255,.34);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap: wrap;
}

.transport_view .alert,
.rides_view .alert{
  border-radius: 14px;
  padding: 10px 12px;
  margin: 0 0 12px;
  border: 1px solid rgba(181,194,222,.20);
  background: rgba(255,255,255,.52);
  color: var(--m-text);
  line-height: 1.35;
  font-weight: 800;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.transport_view .alert-success,
.rides_view .alert-success{
  background: rgba(236,253,245,.80);
  border-color: rgba(22,163,74,.18);
  color: #14532d;
}

.transport_view .alert-danger,
.rides_view .alert-danger{
  background: rgba(254,242,242,.80);
  border-color: rgba(220,38,38,.18);
  color: #7f1d1d;
}

.transport_view .alert-info,
.rides_view .alert-info{
  background: rgba(239,246,255,.80);
  border-color: rgba(2,132,199,.18);
  color: #0c4a6e;
}

.transport_view .alert-warning,
.rides_view .alert-warning{
  background: rgba(255,251,235,.82);
  border-color: rgba(245,158,11,.20);
  color: #7c4a00;
}

.transport_view .btn,
.transport_view a.btn,
.transport_view button.btn,
.rides_view .btn,
.rides_view a.btn,
.rides_view button.btn{
  appearance: none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius: 14px;
  padding: 8px 14px;
  font-size: 14px;
  font-weight: 900;
  text-decoration:none;
  cursor:pointer;
  border: 1px solid transparent;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease, filter .12s ease;
  user-select:none;
  line-height:1.1;
  white-space: nowrap;
  background: rgba(255,255,255,.54);
  color: var(--m-text);
  box-sizing: border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.42);
}

.transport_view .btn:active,
.rides_view .btn:active{
  transform: translateY(1px);
}

.transport_view .btn:focus,
.rides_view .btn:focus{
  outline:none;
}

.transport_view .btn:focus-visible,
.rides_view .btn:focus-visible{
  box-shadow: 0 0 0 4px rgba(0,136,204,.10);
}

.transport_view .btn.btn-sm,
.rides_view .btn.btn-sm{
  padding: 6px 12px;
  font-size: 13px;
}

.transport_view .btn.btn-block,
.rides_view .btn.btn-block{
  width: 100%;
}

.transport_view .btn-primary,
.rides_view .btn-primary{
  background: linear-gradient(180deg, var(--m-brand), #006fa8);
  color: #fff;
  box-shadow: 0 10px 20px rgba(0,136,204,.14);
}

.transport_view .btn-primary:hover,
.rides_view .btn-primary:hover{
  filter: brightness(1.02);
}

.transport_view .btn-success,
.rides_view .btn-success{
  background: linear-gradient(180deg, var(--m-brand), #006fa8);
  color:#fff;
  box-shadow: 0 10px 20px rgba(0,136,204,.14);
}

.transport_view .btn-success:hover,
.rides_view .btn-success:hover{
  filter: brightness(1.02);
}

.transport_view .btn-outline,
.rides_view .btn-outline{
  background: rgba(239,246,255,.72);
  border-color: rgba(0,136,204,.16);
  color: rgba(0,136,204,.98);
}

.transport_view .btn-outline:hover,
.rides_view .btn-outline:hover{
  background: rgba(239,246,255,.88);
}

.transport_view .btn-warning,
.rides_view .btn-warning{
  background: rgba(255,251,235,.82);
  border-color: rgba(245,158,11,.22);
  color: #7c4a00;
}

.transport_view .btn-warning:hover,
.rides_view .btn-warning:hover{
  background: rgba(255,247,220,.92);
}

.transport_view .btn-outline-danger,
.rides_view .btn-outline-danger{
  background: rgba(254,242,242,.80);
  border-color: rgba(220,38,38,.18);
  color: #7f1d1d;
}

.transport_view .btn-outline-danger:hover,
.rides_view .btn-outline-danger:hover{
  background: rgba(254,232,232,.92);
}

.transport_view .btn[disabled],
.transport_view .btn:disabled,
.rides_view .btn[disabled],
.rides_view .btn:disabled{
  opacity: .55;
  cursor: not-allowed;
  pointer-events: none;
}

.transport_view input[type="text"],
.transport_view input[type="number"],
.transport_view input[type="date"],
.transport_view input[type="time"],
.transport_view input[type="datetime-local"],
.transport_view select,
.transport_view textarea,
.rides_view input[type="text"],
.rides_view input[type="number"],
.rides_view input[type="date"],
.rides_view input[type="time"],
.rides_view input[type="datetime-local"],
.rides_view select,
.rides_view textarea{
  width: 100%;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(181,194,222,.28);
  background: rgba(255,255,255,.82);
  color: var(--m-text);
  outline: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.50);
}

.transport_view input:focus,
.transport_view select:focus,
.transport_view textarea:focus,
.rides_view input:focus,
.rides_view select:focus,
.rides_view textarea:focus{
  border-color: rgba(0,136,204,.32);
  box-shadow: 0 0 0 4px rgba(0,136,204,.10);
}

/* =========================================================
   4) TRANSPORT
   ========================================================= */
.transport_view .transport-page{
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  min-width: 0;
}

.transport_view :where(.transport-page,.transport-card,.transport-filters,.transport-route-card,.transport-cards,.tr-left,.tr-route,.tr-notes,.ui-field){
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.transport_view .transport-head{
  margin-bottom: 12px;
}

.transport_view .transport-sub{
  margin-top: 6px;
  font-weight: 800;
  font-size: 13px;
  color: rgba(100,116,139,.92);
}

.transport_view .transport-card{
  padding: 14px;
}

@media (min-width: 900px){
  .transport_view .transport-card{
    padding: 16px;
  }
}

.transport_view .transport-filters{
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.6fr) minmax(0, 1.6fr) minmax(0, 1.2fr) auto;
  gap: 10px;
  align-items: end;
  margin-bottom: 14px;
  min-width: 0;
}

.transport_view .transport-filters.is-sticky{
  position: sticky;
  top: 12px;
  z-index: 5;
  padding: 12px;
  border-radius: var(--m-radius);
  border: 1px solid rgba(181,194,222,.22);
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow:
    0 10px 24px rgba(71,85,105,.05),
    inset 0 1px 0 rgba(255,255,255,.56);
}

.transport_view .transport-actions{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  min-width: 0;
}

.transport_view .transport-actions .ui-btn{
  width: 100%;
  min-width: 0;
}

.transport_view .route-badge{
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: keep-all;
  hyphens: none;
  line-height: 1;
  min-width: 54px;
  justify-content: center;
  font-variant-numeric: tabular-nums;
}

.transport_view .days-badge{
  font-weight: 900;
}

.transport_view .time-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.transport_view .time-chip{
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  font-weight: 900;
}

.transport_view .transport-empty{
  margin-top: 6px;
}

.transport_view .transport-table-wrap{
  overflow-x: auto;
  max-width: 100%;
  border: 1px solid rgba(181,194,222,.20);
  border-radius: 16px;
  background: rgba(255,255,255,.70);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  -webkit-overflow-scrolling: touch;
}

.transport_view .transport-table{
  width:100%;
  border-collapse: collapse;
  min-width: 860px;
  background: transparent;
}

.transport_view .transport-table thead th{
  position: sticky;
  top: 0;
  z-index: 2;
  text-align:left;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: rgba(15,23,42,.55);
  font-weight: 950;
  background: rgba(255,255,255,.74);
  border-bottom: 1px solid rgba(181,194,222,.20);
  padding: 12px 12px;
  white-space: nowrap;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.transport_view .transport-table td{
  border-bottom: 1px solid rgba(181,194,222,.16);
  padding: 12px 12px;
  vertical-align: top;
  color: rgba(15,23,42,.92);
  font-size: 14px;
}

.transport_view .transport-table tbody tr:hover td{
  background: rgba(239,246,255,.52);
}

.transport_view .col-num{
  width:70px;
}

.transport_view .transport-table th.col-num,
.transport_view .transport-table td.col-num{
  width: 92px;
  text-align: center;
  vertical-align: middle;
}

.transport_view .col-time{
  width:380px;
}

.transport_view .col-days{
  width:170px;
}

.transport_view .transport-cards{
  display:none;
  margin-top: 12px;
}

.transport_view .transport-route-card{
  border: 1px solid rgba(181,194,222,.20);
  border-radius: var(--m-radius-sm);
  padding: 12px 14px;
  box-shadow: var(--m-shadow-sm);
  background: rgba(255,255,255,.68);
  margin-bottom: 10px;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  min-width: 0;
  max-width: 100%;
}

.transport_view .tr-top{
  display:flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 8px;
}

.transport_view .tr-left{
  min-width: 0;
  width: 100%;
}

.transport_view .tr-badges{
  display:flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items:center;
  margin-bottom: 8px;
}

.transport_view .tr-route{
  color: rgba(15,23,42,.92);
  font-weight: 950;
  overflow-wrap:anywhere;
}

.transport_view .tr-arrow{
  color: rgba(15,23,42,.45);
  margin:0 6px;
}

.transport_view .tr-meta{
  margin-top: 10px;
}

.transport_view .tr-notes{
  margin-top: 0;
  color: rgba(15,23,42,.70);
  font-size: 13px;
  line-height: 1.4;
  font-weight: 750;
}

.transport_view .transport-pagination{
  margin-top: 14px;
}

@media (max-width: 980px){
  .transport_view .transport-filters{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .transport_view .transport-actions{
    grid-column: 1 / -1;
  }
}

@media (max-width: 680px){
  .transport_view{
    padding-top: 10px;
    padding-bottom: 22px;
  }

  .transport_view .transport-card{
    padding: 12px;
  }

  .transport_view .transport-filters{
    grid-template-columns: minmax(0, 1fr);
  }

  .transport_view .transport-filters.is-sticky{
    top: 8px;
    padding: 10px;
  }

  .transport_view .ui-title{
    font-size: clamp(1.25rem, 5.5vw, 1.55rem);
    line-height: 1.2;
  }

  .transport_view .transport-route-card{
    padding: 12px;
  }

  .transport_view .transport-actions{
    grid-template-columns: 1fr;
  }

  .transport_view .transport-table-wrap{
    display:none;
  }

  .transport_view .transport-cards{
    display:block;
  }
}

/* =========================================================
   5) RIDES
   ========================================================= */
.rides_view{
  padding-top: 12px;
}

.rides_view .rides-header{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.rides_view .rides-header--split{
  align-items: flex-start;
}

.rides_view .rides-title,
.rides_view .ui-title{
  margin: 0;
  font-size: 22px;
  font-weight: 800;
  color: var(--m-text);
  letter-spacing: -0.02em;
  line-height: 1.15;
}

@media (max-width: 520px){
  .rides_view .rides-title{
    font-size: 18px;
  }
}

.rides_view .rides-actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

/* search */
.rides_view .rides-search-card{
  margin: 12px 0 14px;
}

.rides_view .rides-search-form{
  display:grid;
  grid-template-columns: 1.2fr 1.2fr .9fr .6fr;
  gap: 10px;
  align-items:end;
}

.rides_view .rs-field{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.rides_view .rs-label{
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(15,23,42,.55);
}

.rides_view .rs-input{
  width:100%;
}

.rides_view .rs-actions .btn{
  width:100%;
}

/* sections on index */
.rides_view .rides-sections{
  display:grid;
  gap: 18px;
  margin-top: 18px;
}

.rides_view .rides-section-card{
  border-radius: 18px;
}

.rides_view .rides-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:14px;
}

.rides_view .rides-section-title{
  margin:0;
  font-size:1.15rem;
  font-weight:1000;
  line-height:1.2;
  color: var(--m-text);
}

.rides_view .rides-section-subtitle{
  margin-top:4px;
  color: var(--m-muted);
  font-size:.95rem;
  line-height:1.4;
}

.rides_view .rides-empty{
  padding:16px;
  border-radius:16px;
  background: rgba(255,255,255,.50);
  color: var(--m-muted);
  border: 1px dashed rgba(181,194,222,.22);
}

.rides_view .rides-mini-list{
  display:grid;
  gap:12px;
}

.rides_view .ride-mini{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:14px 16px;
  border:1px solid rgba(181,194,222,.20);
  border-radius:16px;
  background: rgba(255,255,255,.62);
  box-shadow:
    0 8px 18px rgba(71,85,105,.04),
    inset 0 1px 0 rgba(255,255,255,.48);
}

.rides_view .ride-mini__main{
  min-width:0;
  flex:1 1 auto;
}

.rides_view .ride-mini__route{
  font-weight:950;
  color: rgba(15,23,42,.92);
  margin-bottom:6px;
  overflow-wrap:anywhere;
}

.rides_view .ride-mini__meta{
  color: var(--m-muted);
  font-size:13px;
  line-height:1.5;
}

.rides_view .ride-mini__right{
  text-align:right;
  white-space:nowrap;
  flex:0 0 auto;
}

.rides_view .ride-mini__price{
  font-size:15px;
  font-weight:1000;
  color: rgba(15,23,42,.92);
  margin-bottom:8px;
}

/* list */
.rides_view .rides-list{
  display:flex;
  flex-direction: column;
  gap: 12px;
}

.rides_view .ride-item{
  overflow: hidden;
}

.rides_view .ride-item .ride-body{
  display:flex;
  gap: 14px;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  padding: 14px;
}

.rides_view .ride-main{
  min-width: 0;
  flex: 1 1 auto;
}

.rides_view .ride-route{
  font-size: 15px;
  font-weight: 1000;
  color: rgba(15,23,42,.92);
  overflow-wrap:anywhere;
}

.rides_view .ride-arrow{
  margin: 0 8px;
  color: rgba(15,23,42,.45);
}

.rides_view .ride-meta{
  margin-top: 6px;
  font-size: 13px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.rides_view .ride-dot{
  color: rgba(15,23,42,.35);
}

.rides_view .ride-car{
  margin-top: 6px;
  font-size: 13px;
}

.rides_view .ride-right{
  text-align: right;
  display:flex;
  flex-direction: column;
  gap: 8px;
  min-width: 180px;
}

@media (max-width: 768px){
  .rides_view .ride-right{
    text-align:left;
    min-width: 0;
    width: 100%;
  }

  .rides_view .ride-mini{
    flex-direction:column;
    align-items:stretch;
  }

  .rides_view .ride-mini__right{
    text-align:left;
    white-space:normal;
  }
}

.rides_view .ride-price{
  font-size: 14px;
  color: rgba(15,23,42,.92);
}

.rides_view .rides-pagination{
  margin-top: 14px;
}

.rides_view .mt-gap{
  margin-top: 10px;
}

.rides_view .small{
  font-size: 13px;
}

.rides_view .fw-strong{
  font-weight: 950;
}

.rides_view .ride-show_layout{
  display:grid;
  grid-template-columns: 1fr 340px;
  gap: 14px;
  align-items: start;
  margin-top: 10px;
}

@media (max-width: 768px){
  .rides_view .ride-show_layout{
    grid-template-columns: 1fr;
  }
}

.rides_view .ride-route-main{
  font-size: 18px;
  font-weight: 1000;
  color: rgba(15,23,42,.92);
}

.rides_view .ride-route-main .arrow{
  margin: 0 8px;
  color: rgba(15,23,42,.45);
}

.rides_view .ride-time{
  margin-top: 8px;
  font-size: 14px;
}

.rides_view .ride-info{
  margin-top: 14px;
  display:flex;
  flex-direction: column;
  gap: 8px;
}

.rides_view .ride-info-row{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

.rides_view .ride-desc{
  margin-top: 12px;
}

.rides_view .ride-desc-title{
  font-weight: 950;
  margin-bottom: 6px;
}

.rides_view .ride-desc-text{
  color: rgba(15,23,42,.80);
  line-height: 1.55;
  font-weight: 700;
  white-space: pre-line;
}

.rides_view .booking-list{
  display:flex;
  flex-direction: column;
  gap: 10px;
}

.rides_view .booking-item{
  border: 1px solid rgba(181,194,222,.20);
  border-radius: 14px;
  padding: 12px;
  display:flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  flex-wrap: wrap;
  background: rgba(255,255,255,.68);
  box-shadow:
    0 8px 18px rgba(71,85,105,.04),
    inset 0 1px 0 rgba(255,255,255,.48);
}

.rides_view .booking-item--compact{
  padding: 10px 12px;
  border-radius: 12px;
}

.rides_view .booking-actions{
  display:flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

.rides_view .booking-title{
  font-weight: 950;
  color: rgba(15,23,42,.92);
}

.rides_view .booking-meta{
  margin-top: 6px;
}

.rides_view .booking-points{
  margin-top: 6px;
}

.rides_view .ride-book-form{
  display:flex;
  flex-direction: column;
  gap: 10px;
}

.rides_view .field{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.rides_view .field-label{
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(15,23,42,.55);
}

.rides_view .hint{
  margin-top: 8px;
  font-size: 13px;
  line-height:1.4;
  font-weight: 700;
  color: rgba(15,23,42,.60);
}

.rides_view .booking-row,
.rides_view .ride-row{
  display:flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  align-items: flex-start;
}

.rides_view .ride-actions{
  text-align: right;
  display:flex;
  flex-direction: column;
  gap: 8px;
  min-width: 220px;
}

.rides_view .btn-row{
  display:flex;
  gap: 8px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

@media (max-width: 768px){
  .rides_view .ride-actions{
    text-align:left;
    min-width: 0;
    width:100%;
  }

  .rides_view .btn-row{
    justify-content: flex-start;
  }
}

.rides_view .ride-create-form{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.rides_view .field-full{
  grid-column: 1 / -1;
}

.rides_view .ride-create-footer{
  grid-column: 1 / -1;
  display:flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 6px;
}

.rides_view .err-list{
  margin: 8px 0 0;
  padding-left: 18px;
}

.rides_view .badge{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 950;
  line-height: 1.1;
  border: 1px solid transparent;
  white-space: nowrap;
}

.rides_view .badge::before{
  content:"";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: currentColor;
  opacity: .9;
}

.rides_view .badge-success{
  background: rgba(236,253,245,.80);
  color: #047857;
  border-color: rgba(34,197,94,.18);
}

.rides_view .badge-warning{
  background: rgba(255,251,235,.82);
  color: #b45309;
  border-color: rgba(245,158,11,.20);
}

.rides_view .badge-danger{
  background: rgba(254,242,242,.80);
  color: #b91c1c;
  border-color: rgba(239,68,68,.18);
}

.rides_view .badge-primary{
  background: rgba(239,246,255,.80);
  color: #1d4ed8;
  border-color: rgba(59,130,246,.18);
}

.rides_view .badge-secondary{
  background: rgba(255,255,255,.54);
  color: rgba(15,23,42,.78);
  border-color: rgba(181,194,222,.20);
}

.rides_view .text-muted .badge{
  transform: translateY(-1px);
}

.rides_view .rides-pay-help{
  margin-bottom: 8px;
}

.rides_view .rides-pay-options{
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}

.rides_view .rides-pay-option{
  display: flex;
  gap: 8px;
  align-items: center;
  cursor: pointer;
  font-weight: 800;
}

.rides_view .rides-pay-note{
  margin-top: 6px;
}

.rides_view .rides-pay-warn{
  display:none;
  margin-top: 10px;
}

.rides_view .rides-card-header{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.rides_view .rides-card-header-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin-left:auto;
}

.rides_view .rides-chat-link-wrap{
  margin-top:10px;
}

.rides_view .rides-pay-methods{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.rides_view .rides-pay-method{
  display:flex;
  gap:8px;
  align-items:center;
  font-weight: 800;
}

.rides_view .rides-booking-hint{
  margin-top: 6px;
}

.rides_view .rides-book-reason{
  margin-top: 6px;
}

.rides_view .rides-time-extra{
  margin-top: 4px;
}

.rides_view .rides-time-sep{
  margin-left: 10px;
}

@media (max-width: 900px){
  .rides_view .rides-search-form{
    grid-template-columns: 1fr 1fr;
  }

  .rides_view .rs-actions{
    grid-column: 1 / -1;
  }
}

@media (max-width: 768px){
  .rides_view .rides-search-form{
    grid-template-columns: 1fr;
  }

  .rides_view .ride-create-form{
    grid-template-columns: 1fr;
  }
}

.rides_view .ride-review-form{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.rides_view .ride-review-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
}

.rides_view .ride-review-grid .field-full{
  grid-column:1 / -1;
}

@media (max-width: 768px){
  .rides_view .ride-review-grid{
    grid-template-columns: 1fr;
  }
}

.rides_view .ride-rating-summary{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.rides_view .ride-rating-summary__value{
  font-size:24px;
  font-weight:1000;
  line-height:1.1;
}

.rides_view .ride-rating-breakdown{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.rides_view .ride-rating-row{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  padding:8px 0;
  border-top:1px solid rgba(181,194,222,.18);
}

.rides_view .ride-rating-row:first-child{
  border-top:none;
  padding-top:0;
}

.rides_view .ride-review-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.rides_view .ride-review-item{
  border:1px solid rgba(181,194,222,.18);
  border-radius:14px;
  padding:12px;
  background: rgba(255,255,255,.66);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.42);
}

.rides_view .ride-review-item__top{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  margin-bottom:6px;
}

.rides_view .ride-review-item__score{
  font-weight:900;
  white-space:nowrap;
}

.rides_view .ride-review-item__text{
  margin-top:8px;
  line-height:1.5;
  color:rgba(15,23,42,.84);
  white-space:pre-line;
}

.rides_view .ride-driver-rating{
  margin-top:8px;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  font-size:13px;
  line-height:1.4;
}

.rides_view .ride-driver-rating__value{
  font-weight:1000;
  color:rgba(15,23,42,.92);
}

.rides_view .ride-driver-rating__count{
  color:var(--m-muted);
}

.rides_view .ride-driver-rating--empty{
  color:var(--m-muted);
}

.rides_view .ride-mini__rating{
  margin-top:4px;
}

.rides_view .rides-fee-note{
  margin-top: 6px;
}

.rides_view .alert--flush{
  margin-bottom: 0;
}

/* Softer hierarchy */
.transport_view,
.rides_view{
  font-weight: 450;
  color: #1b2a40;
}

.transport_view :where(h1,h2,h3,.transport-title,.rides-title,.ride-title,.card-header),
.rides_view :where(h1,h2,h3,.transport-title,.rides-title,.ride-title,.card-header){
  font-weight: 720;
  letter-spacing: 0;
  color: var(--m-text);
}

.transport_view :where(.btn,.ui-btn,button,.badge,.pill),
.rides_view :where(.btn,.ui-btn,button,.badge,.pill){
  font-weight: 650;
  letter-spacing: 0;
}

.transport_view :where(.muted,.text-muted,.ride-meta,.transport-meta),
.rides_view :where(.muted,.text-muted,.ride-meta,.transport-meta){
  color: rgba(37,52,75,.64);
  font-weight: 500;
}

.transport_view :where(.card,.alert),
.rides_view :where(.card,.alert){
  border-color: rgba(181,194,222,.28);
  box-shadow:
    0 10px 24px rgba(71,85,105,.045),
    inset 0 1px 0 rgba(255,255,255,.58);
}

/* =========================================================
   6) RIDES — public ui-page + cabinet
   ========================================================= */
.rides_view .ui-page{
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  min-width: 0;
}

.rides_view .rides-sub{
  margin-top: 6px;
  font-weight: 800;
  font-size: 13px;
}

.rides_view .rides-actions,
.rides_view .ui-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

.rides_view .ui-card{
  background: var(--m-surface);
  border: 1px solid var(--m-border);
  border-radius: var(--m-radius);
  box-shadow: var(--m-shadow-sm);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.rides_view .rides-search-card{
  padding: 14px;
  margin-bottom: 14px;
}

.rides_view .rides-search-form{
  display:grid;
  grid-template-columns: 1.2fr 1.2fr .9fr auto;
  gap: 10px;
  align-items: end;
}

.rides_view .rides-search-actions .ui-btn{
  width: 100%;
  min-width: 120px;
}

.rides_view .ui-btn--block{
  width: 100%;
  display: flex;
  justify-content: center;
}

.rides_view .rides-section-body{
  padding: 14px;
}

.rides_view .rides-form-card{
  padding: 14px 16px 16px;
}

.rides_view .ui-field{
  margin-bottom: 0;
}

/* Личный кабинет: поездки внутри user-ui */
.user-ui.rides-cabinet-page .rides_view--cabinet{
  max-width: none;
  margin: 0;
  padding: 0 0 28px;
}

.user-ui.rides-cabinet-page .rides-cabinet-hero{
  margin-bottom: 14px;
}

.user-ui.rides-cabinet-page .rides-cabinet-card{
  margin-bottom: 12px;
}

.user-ui.rides-cabinet-page .rides_view--cabinet .ui-alert{
  margin-bottom: 12px;
}

@media (max-width: 900px){
  .rides_view .rides-search-form{
    grid-template-columns: 1fr 1fr;
  }

  .rides_view .rides-search-actions{
    grid-column: 1 / -1;
  }
}

@media (max-width: 520px){
  .rides_view .rides-search-form{
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   7) STATUS CHIPS (цветные, единые)
   ========================================================= */
:where(.rides_view, .user-ui.rides-cabinet-page) .ride-status{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  padding: 5px 11px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.1;
  border: 1px solid transparent;
  white-space: nowrap;
  vertical-align: middle;
}

:where(.rides_view, .user-ui.rides-cabinet-page) .ride-status::before{
  content:"";
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: currentColor;
  opacity: .85;
  flex-shrink: 0;
}

:where(.rides_view, .user-ui.rides-cabinet-page) .ride-status--active{
  background: linear-gradient(180deg, rgba(220,252,231,.95), rgba(236,253,245,.88));
  color: #047857;
  border-color: rgba(34,197,94,.28);
}

:where(.rides_view, .user-ui.rides-cabinet-page) .ride-status--progress{
  background: linear-gradient(180deg, rgba(219,234,254,.95), rgba(239,246,255,.9));
  color: #1d4ed8;
  border-color: rgba(59,130,246,.28);
}

:where(.rides_view, .user-ui.rides-cabinet-page) .ride-status--filled{
  background: linear-gradient(180deg, rgba(254,243,199,.95), rgba(255,251,235,.9));
  color: #b45309;
  border-color: rgba(245,158,11,.30);
}

:where(.rides_view, .user-ui.rides-cabinet-page) .ride-status--pending{
  background: linear-gradient(180deg, rgba(254,243,199,.95), rgba(255,251,235,.9));
  color: #c2410c;
  border-color: rgba(249,115,22,.28);
}

:where(.rides_view, .user-ui.rides-cabinet-page) .ride-status--approved{
  background: linear-gradient(180deg, rgba(220,252,231,.95), rgba(236,253,245,.88));
  color: #047857;
  border-color: rgba(34,197,94,.28);
}

:where(.rides_view, .user-ui.rides-cabinet-page) .ride-status--rejected{
  background: linear-gradient(180deg, rgba(254,226,226,.95), rgba(254,242,242,.9));
  color: #b91c1c;
  border-color: rgba(239,68,68,.28);
}

:where(.rides_view, .user-ui.rides-cabinet-page) .ride-status--cancelled{
  background: rgba(241,245,249,.85);
  color: #64748b;
  border-color: rgba(148,163,184,.28);
}

:where(.rides_view, .user-ui.rides-cabinet-page) .ride-status--completed{
  background: rgba(241,245,249,.9);
  color: #475569;
  border-color: rgba(148,163,184,.22);
}

:where(.rides_view, .user-ui.rides-cabinet-page) .ride-status--neutral{
  background: rgba(255,255,255,.6);
  color: #64748b;
  border-color: rgba(181,194,222,.24);
}

/* =========================================================
   8) RIDE SHOW — BlaBlaCar-like
   ========================================================= */
.rides_view .ui-card__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  padding: 12px 14px;
  border-bottom: 1px solid var(--m-line);
  background: rgba(255,255,255,.34);
}

.rides_view .ui-card__title{
  font-weight: 800;
  font-size: 15px;
  color: var(--m-text);
}

.rides_view .ui-card__body{
  padding: 14px;
}

.rides_view .ui-alert{
  margin-bottom: 12px;
  border-radius: 14px;
  padding: 10px 12px;
  font-weight: 700;
}

.rides_view .ui-alert--success{
  background: rgba(236,253,245,.85);
  border: 1px solid rgba(34,197,94,.2);
  color: #14532d;
}

.rides_view .ui-alert--danger{
  background: rgba(254,242,242,.85);
  border: 1px solid rgba(239,68,68,.2);
  color: #7f1d1d;
}

.rides_view .ride-show-hero{
  padding: 16px;
  margin-bottom: 14px;
}

.rides_view .ride-show-hero__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom: 14px;
}

.rides_view .ride-show-hero__date{
  font-size: 13px;
  font-weight: 800;
  color: var(--m-muted);
}

.rides_view .ride-timeline{
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 10px;
  align-items: start;
  margin-bottom: 16px;
}

.rides_view .ride-timeline__point--to{
  text-align: right;
}

.rides_view .ride-timeline__time{
  font-size: 22px;
  font-weight: 900;
  color: var(--m-text);
  line-height: 1.1;
  min-height: 1.2em;
}

.rides_view .ride-timeline__city{
  font-size: 17px;
  font-weight: 900;
  color: var(--m-text);
  margin-top: 4px;
  overflow-wrap: anywhere;
}

.rides_view .ride-timeline__hint{
  font-size: 12px;
  margin-top: 4px;
}

.rides_view .ride-timeline__track{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding-top: 10px;
  min-width: 72px;
}

.rides_view .ride-timeline__line{
  display:block;
  width: 2px;
  height: 36px;
  background: linear-gradient(180deg, var(--m-brand), rgba(0,136,204,.25));
  border-radius: 999px;
  margin-bottom: 6px;
}

.rides_view .ride-timeline__icon{
  font-size: 18px;
  line-height: 1;
}

.rides_view .ride-show-chips{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
}

.rides_view .ride-show-chip{
  display:inline-flex;
  align-items:baseline;
  gap: 4px;
  padding: 8px 12px;
  border-radius: 12px;
  font-size: 13px;
  font-weight: 800;
  border: 1px solid rgba(181,194,222,.22);
  background: rgba(255,255,255,.72);
}

.rides_view .ride-show-chip--price{
  background: rgba(239,246,255,.9);
  color: #1d4ed8;
  border-color: rgba(59,130,246,.22);
  font-size: 15px;
}

.rides_view .ride-show-chip__sub{
  font-size: 11px;
  font-weight: 700;
  opacity: .75;
}

.rides_view .ride-show-chip--seats{
  background: rgba(236,253,245,.85);
  color: #047857;
  border-color: rgba(34,197,94,.2);
}

.rides_view .ride-show-chip--pay{
  color: #475569;
}

.rides_view .ride-detail-row{
  display:flex;
  gap: 12px;
  flex-wrap:wrap;
  padding: 6px 0;
}

.rides_view .ride-detail-row--stack{
  flex-direction:column;
  gap: 6px;
}

.rides_view .ride-detail-row__label{
  font-weight: 800;
  color: var(--m-muted);
  min-width: 120px;
}

.rides_view .ride-plate{
  display:inline-block;
  margin-left: 6px;
  padding: 2px 8px;
  border-radius: 8px;
  background: rgba(241,245,249,.9);
  border: 1px solid rgba(148,163,184,.25);
  font-weight: 800;
  font-size: 12px;
}

.rides_view .ride-show_side{
  display:flex;
  flex-direction:column;
  gap: 12px;
}

@media (min-width: 769px){
  .rides_view .ride-show_side{
    position: sticky;
    top: 12px;
  }
}

.rides_view .ride-driver-avatar{
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 20px;
  font-weight: 900;
  color: #fff;
  background: linear-gradient(135deg, var(--m-brand), #1d4ed8);
  margin-bottom: 10px;
}

.rides_view .ride-driver-name{
  font-weight: 900;
  margin-bottom: 10px;
}

.rides_view .ride-show-book .ui-card__head{
  align-items: baseline;
}

.rides_view .ride-show-book__price{
  font-size: 18px;
  font-weight: 900;
  color: #047857;
}

.rides_view .ride-book-cta{
  margin-top: 4px;
  font-size: 15px;
  padding-top: 12px;
  padding-bottom: 12px;
}

.rides_view .rides-book-hint{
  margin: 10px 0 0;
  line-height: 1.4;
}

.rides_view .booking-title{
  display:flex;
  align-items:center;
  gap: 8px;
  flex-wrap:wrap;
}

.rides_view .ride-review-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 12px;
}

.rides_view .ride-review-grid__full{
  grid-column: 1 / -1;
}

.rides_view .ui-empty--compact{
  padding: 8px 0;
}

/* BlaBlaCar list + cabinet cards */
.rides_view .rides-bbc-list,
.user-ui.rides-cabinet-page .rides-cabinet-list{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.rides_view a.ride-bbc-card{
  display:block;
  text-decoration:none;
  color:inherit;
  transition: transform .12s ease, box-shadow .12s ease;
}

.rides_view a.ride-bbc-card:hover{
  transform: translateY(-1px);
  box-shadow: var(--m-shadow);
}

.rides_view .ride-bbc-card__body{
  display:flex;
  gap:14px;
  padding:14px;
  align-items:stretch;
}

.rides_view .ride-bbc-card__main{
  flex:1;
  min-width:0;
}

.rides_view .ride-bbc-card__top{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  margin-bottom:8px;
}

.rides_view .ride-bbc-card__time{
  font-size:13px;
  font-weight:800;
  color:var(--m-muted);
}

.rides_view .ride-bbc-card__instant,
.user-ui .ride-bbc-card__instant{
  font-size:11px;
  font-weight:900;
  padding:4px 8px;
  border-radius:999px;
  background:linear-gradient(180deg,#fef9c3,#fef08a);
  color:#a16207;
  border:1px solid rgba(234,179,8,.35);
}

.rides_view .ride-bbc-card__route{
  font-size:17px;
  font-weight:900;
  color:var(--m-text);
  margin-bottom:6px;
}

.rides_view .ride-bbc-card__arrow{
  margin:0 6px;
  color:rgba(15,23,42,.35);
}

.rides_view .ride-bbc-card__meta{
  font-size:13px;
  color:var(--m-muted);
  margin-bottom:10px;
}

.rides_view .ride-bbc-card__dot{
  margin:0 4px;
}

.rides_view .ride-bbc-card__aside{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:center;
  flex-shrink:0;
  min-width:88px;
}

.rides_view .ride-bbc-card__price{
  font-size:22px;
  font-weight:1000;
  color:#047857;
  line-height:1;
}

.rides_view .ride-bbc-card__per{
  font-size:12px;
  font-weight:700;
  color:var(--m-muted);
  margin-top:4px;
}

.rides_view .ride-driver-chip{
  display:flex;
  align-items:center;
  gap:10px;
}

.rides_view .ride-driver-chip__avatar{
  width:36px;
  height:36px;
  border-radius:12px;
  overflow:hidden;
  flex-shrink:0;
  background:linear-gradient(135deg,var(--m-brand),#1d4ed8);
  display:flex;
  align-items:center;
  justify-content:center;
}

.rides_view .ride-driver-chip--sm .ride-driver-chip__avatar{
  width:32px;
  height:32px;
}

.rides_view .ride-driver-chip__avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.rides_view .ride-driver-chip__initial{
  color:#fff;
  font-weight:900;
  font-size:14px;
}

.rides_view .ride-driver-chip__name{
  font-weight:800;
  font-size:13px;
  color:var(--m-text);
}

.rides_view .ride-driver-chip__sub{
  display:block;
  font-size:12px;
  color:var(--m-muted);
  font-weight:600;
}

.user-ui.rides-cabinet-page .ride-cabinet-card{
  overflow:hidden;
}

.user-ui.rides-cabinet-page .ride-cabinet-card__body{
  padding:14px 16px;
}

.user-ui.rides-cabinet-page .ride-cabinet-card__head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:10px;
}

.user-ui.rides-cabinet-page .ride-cabinet-card__route{
  font-size:17px;
  font-weight:900;
}

.user-ui.rides-cabinet-page .ride-cabinet-card__arrow{
  margin:0 6px;
  opacity:.45;
}

.user-ui.rides-cabinet-page .ride-cabinet-card__when{
  display:flex;
  flex-wrap:wrap;
  gap:8px 14px;
  align-items:center;
  margin-bottom:10px;
  font-size:13px;
  color:var(--ui-muted, #64748b);
}

.user-ui.rides-cabinet-page .ride-cabinet-card__datetime{
  font-weight:800;
}

.user-ui.rides-cabinet-page .ride-cabinet-card__points{
  font-size:13px;
  margin:8px 0;
}

.user-ui.rides-cabinet-page .ride-cabinet-card__footer{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid rgba(181,194,222,.2);
}

.user-ui.rides-cabinet-page .ride-cabinet-card__price{
  font-size:20px;
  font-weight:1000;
  color:#047857;
}

.user-ui.rides-cabinet-page .ride-cabinet-card__price-sub{
  font-size:12px;
  font-weight:700;
  color:#64748b;
  margin-left:4px;
}

.user-ui.rides-cabinet-page .ride-cabinet-card__actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.user-ui.rides-cabinet-page .ride-cabinet-card__bookings{
  margin-top:12px;
  font-size:13px;
}

.user-ui.rides-cabinet-page .ride-cabinet-card__bookings summary{
  cursor:pointer;
  font-weight:800;
  color:#1d4ed8;
}

.rides_view .rides-head-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

@media (max-width: 640px){
  .rides_view .ride-bbc-card__body{
    flex-direction:column;
  }

  .rides_view .ride-bbc-card__aside{
    flex-direction:row;
    align-items:baseline;
    justify-content:space-between;
    width:100%;
  }
}

@media (max-width: 520px){
  .rides_view .ride-timeline{
    grid-template-columns: 1fr;
    gap: 0;
  }

  .rides_view .ride-timeline__track{
    flex-direction:row;
    padding: 8px 0 8px 8px;
    min-width: 0;
    align-items:center;
    gap: 10px;
  }

  .rides_view .ride-timeline__line{
    width: 100%;
    height: 2px;
    margin: 0;
    flex: 1;
  }

  .rides_view .ride-timeline__point--to{
    text-align: left;
  }

  .rides_view .ride-review-grid{
    grid-template-columns: 1fr;
  }
}