/* ═══════════════════════════════════════════
   themes.css — 7 цветовых тем для карточек услуг
   Используются в service card top-border и accent
   ═══════════════════════════════════════════ */

.theme-cyan {
  --t-color: #06b6d4;
  --t-dark: #0e7490;
  --t-gradient: linear-gradient(135deg, #0e7490 0%, #083344 100%);
  --t-light: #f0fdff;
  --t-border: #67e8f9;
}

.theme-blue-dark {
  --t-color: #2980b9;
  --t-dark: #1a3a5c;
  --t-gradient: linear-gradient(135deg, #1a3a5c 0%, #0d2440 100%);
  --t-light: #f0f7ff;
  --t-border: #93c5fd;
}

.theme-violet {
  --t-color: #8b5cf6;
  --t-dark: #6d28d9;
  --t-gradient: linear-gradient(135deg, #6d28d9 0%, #3b0764 100%);
  --t-light: #faf5ff;
  --t-border: #c4b5fd;
}

.theme-purple {
  --t-color: #8b5cf6;
  --t-dark: #5b21b6;
  --t-gradient: linear-gradient(135deg, #5b21b6 0%, #3b0764 100%);
  --t-light: #faf5ff;
  --t-border: #c4b5fd;
}

.theme-blue {
  --t-color: #3b82f6;
  --t-dark: #1e40af;
  --t-gradient: linear-gradient(135deg, #1e40af 0%, #1e3a8a 100%);
  --t-light: #eff6ff;
  --t-border: #93c5fd;
}

.theme-green {
  --t-color: #10b981;
  --t-dark: #065f46;
  --t-gradient: linear-gradient(135deg, #065f46 0%, #022c22 100%);
  --t-light: #f0fdf4;
  --t-border: #6ee7b7;
}

.theme-amber {
  --t-color: #f59e0b;
  --t-dark: #b45309;
  --t-gradient: linear-gradient(135deg, #b45309 0%, #78350f 100%);
  --t-light: #fffbf0;
  --t-border: #fcd34d;
}

/* Apply theme colors to service card top bar */
.service-card .service-card-top {
  border-top: 4px solid var(--t-color, #00d4ff);
}

.service-card .service-emoji-wrap {
  background: var(--t-light, #f0fdff);
  border: 1px solid var(--t-border, #67e8f9);
  border-radius: 50%;
  width: 56px; height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  margin-bottom: 14px;
}

.service-card .check-icon {
  color: var(--t-color, #06b6d4);
}

/* Case card colored left border */
.case-card {
  border-left: 4px solid var(--case-color, #00d4ff);
}

/* Metric colored number */
.case-metric-number {
  color: var(--case-color, #00d4ff);
}
