/* ───── Subscription button в таблице водителей ───── */
.sub-btn {
  display: inline-flex; flex-direction: column;
  align-items: center; gap: 0;
  padding: 4px 12px;
  border: 1.5px solid;
  background: transparent;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s;
  font-family: inherit;
  min-width: 100px;
}
.sub-btn .sub-date { font-weight: 700; font-size: 13px; font-variant-numeric: tabular-nums; }
.sub-btn .sub-days { font-size: 10px; opacity: 0.75; text-transform: uppercase; letter-spacing: 0.4px; }

.sub-btn.sub-ok {
  border-color: rgba(34, 197, 94, 0.4);
  background: rgba(34, 197, 94, 0.08);
  color: #16a34a;
}
.sub-btn.sub-ok:hover {
  background: #22c55e; color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(34, 197, 94, 0.3);
}
.sub-btn.sub-warn {
  border-color: rgba(245, 158, 11, 0.5);
  background: rgba(245, 158, 11, 0.1);
  color: #d97706;
  animation: subPulse 1.8s ease-in-out infinite;
}
.sub-btn.sub-warn:hover { background: #f59e0b; color: #fff; }
@keyframes subPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0); }
  50% { box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.2); }
}
.sub-btn.sub-none {
  border-color: rgba(107, 114, 128, 0.4);
  background: rgba(107, 114, 128, 0.06);
  color: #6b7280;
}
.sub-btn.sub-none:hover {
  background: #FFC107; color: #000;
  border-color: #FFC107;
  transform: translateY(-1px);
}

/* ───── Subscription plan cards ───── */
.sub-plans {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  padding: 4px 24px 16px;
}
.sub-plan-card {
  background: rgba(255, 255, 255, 0.04);
  border: 1.5px solid #1f2937;
  border-radius: 12px;
  padding: 14px 12px;
  text-align: center;
  cursor: pointer;
  transition: all 0.2s;
  font-family: inherit;
  color: #e5e7eb;
}
.sub-plan-card:hover {
  background: rgba(255, 193, 7, 0.08);
  border-color: #FFC107;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(255, 193, 7, 0.15);
}
.sub-plan-name {
  font-size: 13px; font-weight: 700; color: #94a3b8;
  text-transform: uppercase; letter-spacing: 0.5px;
  margin-bottom: 8px;
}
.sub-plan-price {
  font-size: 28px; font-weight: 900; color: #FFC107;
  line-height: 1;
}
.sub-plan-price small { font-size: 14px; color: #B8860B; font-weight: 700; }
.sub-plan-days {
  font-size: 12px; color: #cbd5e1;
  margin-top: 6px;
}
.sub-plan-desc {
  font-size: 11px; color: #6b7280;
  margin-top: 6px; min-height: 28px;
}
.sub-plan-custom { border-style: dashed; opacity: 0.85; }
.sub-plan-custom:hover { opacity: 1; }