/* Industry visual systems — each preset must feel like a different product UI,
   not only a recolored fintech skin. */

body.fintech-ui {
  --app-bg: var(--fin-bg);
  --app-panel: color-mix(in srgb, var(--fin-surface) 82%, transparent);
  --app-panel-solid: var(--fin-surface);
  --app-panel-raised: color-mix(in srgb, var(--fin-surface) 88%, #ffffff 12%);
  --app-line: var(--fin-border);
  --app-line-blue: color-mix(in srgb, var(--fin-blue) 28%, transparent);
  --app-blue: var(--fin-blue);
  --app-blue-bright: var(--fin-blue-bright);
  --app-gold: var(--fin-gold);
  --app-green: var(--fin-green);
  --app-text: var(--fin-text);
  --app-muted: var(--fin-muted);
  --theme-card-radius: var(--fin-radius);
  --theme-btn-radius: var(--fin-radius-sm);
  --theme-density: 1rem;
}

body.fintech-ui .card,
body.fintech-ui .stat-card,
body.fintech-ui .service-category,
body.fintech-ui .service-catalog__panel,
body.fintech-ui .service-modal__dialog,
body.fintech-ui .auth-card {
  border-radius: var(--theme-card-radius);
}

body.fintech-ui .btn,
body.fintech-ui .btn-primary,
body.fintech-ui .btn-secondary,
body.fintech-ui .btn-outline,
body.fintech-ui .form-control,
body.fintech-ui .theme-switcher {
  border-radius: var(--theme-btn-radius);
}

/* ═══════════════════════════════════════════
   HEALTHCARE — Soft UI, calm wellness
   ═══════════════════════════════════════════ */
body.theme-healthcare.fintech-ui {
  --fin-radius: 24px;
  --fin-radius-sm: 999px;
  --fin-radius-lg: 32px;
  --theme-card-radius: 24px;
  --theme-btn-radius: 999px;
  --shadow-sm: 0 10px 28px rgba(8, 145, 178, 0.1);
  --shadow-md: 0 22px 50px rgba(5, 150, 105, 0.12);
}

body.theme-healthcare.fintech-ui .dash-shell {
  background:
    radial-gradient(ellipse 60% 45% at 90% 0%, rgba(8, 145, 178, 0.2), transparent 65%),
    radial-gradient(ellipse 40% 35% at 5% 100%, rgba(16, 185, 129, 0.14), transparent 70%),
    linear-gradient(180deg, #0a1c24 0%, #07161c 50%, #0b1f1c 100%);
}

body.theme-healthcare.fintech-ui .dash-grid {
  opacity: 0.12;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(34, 211, 238, 0.35) 1px, transparent 0);
  background-size: 28px 28px;
}

body.theme-healthcare.fintech-ui .dash-ambient--blue {
  background: radial-gradient(circle, rgba(8, 145, 178, 0.35), transparent 70%);
  filter: blur(60px);
}

body.theme-healthcare.fintech-ui .dash-ambient--gold {
  background: radial-gradient(circle, rgba(16, 185, 129, 0.28), transparent 70%);
  filter: blur(70px);
}

body.theme-healthcare.fintech-ui .dash-sidebar,
body.theme-healthcare.fintech-ui .site-header,
body.theme-healthcare.fintech-ui .site-nav-drawer {
  backdrop-filter: blur(22px) saturate(140%);
  border-color: rgba(34, 211, 238, 0.12);
  background: rgba(10, 32, 40, 0.78);
}

body.theme-healthcare.fintech-ui .card,
body.theme-healthcare.fintech-ui .stat-card,
body.theme-healthcare.fintech-ui .service-category,
body.theme-healthcare.fintech-ui .service-catalog__panel {
  border: 1px solid rgba(34, 211, 238, 0.14);
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.07), transparent 42%),
    rgba(13, 42, 48, 0.88);
  box-shadow: var(--shadow-sm), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

body.theme-healthcare.fintech-ui .btn-primary {
  background: linear-gradient(135deg, #0891b2, #10b981);
  box-shadow: 0 14px 30px rgba(8, 145, 178, 0.28);
}

body.theme-healthcare.fintech-ui .fin-page-header h1,
body.theme-healthcare.fintech-ui .services-page__header h1 {
  font-weight: 500;
  letter-spacing: -0.02em;
}

body.theme-healthcare.fintech-ui .dash-commandbar,
body.theme-healthcare.fintech-ui .page-kicker {
  letter-spacing: 0.12em;
}

html[data-ui-theme="light"] body.theme-healthcare.fintech-ui {
  --fin-bg: #ecfeff;
  --fin-surface: #ffffff;
  --fin-text: #164e63;
  --fin-muted: #547d8c;
  --fin-border: rgba(8, 145, 178, 0.16);
  --color-bg: #ecfeff;
  --color-surface: #ffffff;
  --color-text: #164e63;
  --color-muted: #547d8c;
  --app-bg: #ecfeff;
  --app-panel-solid: #ffffff;
  --app-text: #164e63;
  --app-muted: #547d8c;
}

html[data-ui-theme="light"] body.theme-healthcare.fintech-ui .dash-shell {
  background:
    radial-gradient(ellipse 55% 40% at 100% 0%, rgba(8, 145, 178, 0.12), transparent 60%),
    linear-gradient(180deg, #f0fdff, #ecfeff 40%, #f0fdf4);
}

html[data-ui-theme="light"] body.theme-healthcare.fintech-ui .card,
html[data-ui-theme="light"] body.theme-healthcare.fintech-ui .stat-card,
html[data-ui-theme="light"] body.theme-healthcare.fintech-ui .service-category {
  background: #ffffff;
  border-color: rgba(8, 145, 178, 0.14);
  box-shadow: 0 12px 32px rgba(8, 145, 178, 0.08);
}

/* ═══════════════════════════════════════════
   GAMING — Neon HUD / angular energy
   ═══════════════════════════════════════════ */
body.theme-gaming.fintech-ui {
  --fin-radius: 8px;
  --fin-radius-sm: 6px;
  --fin-radius-lg: 12px;
  --theme-card-radius: 8px;
  --theme-btn-radius: 6px;
  --shadow-sm: 0 0 0 1px rgba(167, 139, 250, 0.22), 0 0 24px rgba(124, 58, 237, 0.22);
  --shadow-md: 0 0 0 1px rgba(244, 63, 94, 0.25), 0 0 40px rgba(244, 63, 94, 0.18);
}

body.theme-gaming.fintech-ui .dash-shell {
  background:
    linear-gradient(135deg, rgba(124, 58, 237, 0.18), transparent 40%),
    linear-gradient(225deg, rgba(244, 63, 94, 0.12), transparent 35%),
    #0a0a1a;
}

body.theme-gaming.fintech-ui .dash-grid {
  opacity: 0.45;
  background-image:
    linear-gradient(rgba(167, 139, 250, 0.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(244, 63, 94, 0.08) 1px, transparent 1px);
  background-size: 48px 48px;
}

body.theme-gaming.fintech-ui .dash-ambient--blue {
  background: radial-gradient(circle, rgba(124, 58, 237, 0.55), transparent 68%);
}

body.theme-gaming.fintech-ui .dash-ambient--gold {
  background: radial-gradient(circle, rgba(244, 63, 94, 0.4), transparent 68%);
}

body.theme-gaming.fintech-ui .dash-sidebar,
body.theme-gaming.fintech-ui .site-header,
body.theme-gaming.fintech-ui .site-nav-drawer {
  border: 1px solid rgba(167, 139, 250, 0.28);
  background: rgba(12, 10, 32, 0.92);
  box-shadow: inset 0 0 40px rgba(124, 58, 237, 0.08);
  clip-path: none;
}

body.theme-gaming.fintech-ui .dash-sidebar .nav-link.active {
  background: linear-gradient(90deg, rgba(124, 58, 237, 0.35), transparent);
  border-color: rgba(167, 139, 250, 0.45);
  box-shadow: 0 0 18px rgba(124, 58, 237, 0.25);
}

body.theme-gaming.fintech-ui .card,
body.theme-gaming.fintech-ui .stat-card,
body.theme-gaming.fintech-ui .service-category,
body.theme-gaming.fintech-ui .service-catalog__panel {
  border: 1px solid rgba(167, 139, 250, 0.28);
  background:
    linear-gradient(135deg, rgba(124, 58, 237, 0.14), transparent 40%),
    rgba(18, 14, 42, 0.95);
  box-shadow: var(--shadow-sm);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
}

body.theme-gaming.fintech-ui .btn-primary {
  background: linear-gradient(90deg, #7c3aed, #f43f5e);
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 0 24px rgba(244, 63, 94, 0.35);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.78rem;
}

body.theme-gaming.fintech-ui .fin-page-header h1,
body.theme-gaming.fintech-ui .services-page__header h1 {
  text-transform: uppercase;
  letter-spacing: 0.02em;
  text-shadow: 0 0 24px rgba(124, 58, 237, 0.45);
}

body.theme-gaming.fintech-ui .page-kicker,
body.theme-gaming.fintech-ui .dash-commandbar {
  color: #a78bfa;
  text-shadow: 0 0 10px rgba(167, 139, 250, 0.45);
}

body.theme-gaming.fintech-ui .service-category:hover,
body.theme-gaming.fintech-ui .stat-card:hover {
  box-shadow: 0 0 0 1px rgba(244, 63, 94, 0.5), 0 0 30px rgba(244, 63, 94, 0.22);
}

html[data-ui-theme="light"] body.theme-gaming.fintech-ui {
  --fin-bg: #f5f3ff;
  --fin-surface: #ffffff;
  --fin-text: #1e1b4b;
  --fin-muted: #6b728e;
  --fin-border: rgba(124, 58, 237, 0.18);
  --color-bg: #f5f3ff;
  --color-surface: #ffffff;
  --color-text: #1e1b4b;
  --color-muted: #6b728e;
  --app-bg: #f5f3ff;
  --app-panel-solid: #ffffff;
  --app-text: #1e1b4b;
  --app-muted: #6b728e;
}

html[data-ui-theme="light"] body.theme-gaming.fintech-ui .dash-shell {
  background:
    linear-gradient(135deg, rgba(124, 58, 237, 0.08), transparent 45%),
    #f5f3ff;
}

html[data-ui-theme="light"] body.theme-gaming.fintech-ui .card,
html[data-ui-theme="light"] body.theme-gaming.fintech-ui .service-category {
  background: #ffffff;
  border-color: rgba(124, 58, 237, 0.22);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

/* ═══════════════════════════════════════════
   FITNESS — Bold athletic blocks
   ═══════════════════════════════════════════ */
body.theme-fitness.fintech-ui {
  --fin-radius: 4px;
  --fin-radius-sm: 4px;
  --fin-radius-lg: 8px;
  --theme-card-radius: 4px;
  --theme-btn-radius: 4px;
  --shadow-sm: 6px 6px 0 rgba(249, 115, 22, 0.35);
  --shadow-md: 10px 10px 0 rgba(34, 197, 94, 0.28);
}

body.theme-fitness.fintech-ui .dash-shell {
  background:
    repeating-linear-gradient(
      -18deg,
      transparent,
      transparent 40px,
      rgba(249, 115, 22, 0.035) 40px,
      rgba(249, 115, 22, 0.035) 41px
    ),
    linear-gradient(160deg, #1a2332, #111827 55%, #14221c);
}

body.theme-fitness.fintech-ui .dash-grid {
  opacity: 0.15;
  background-image: none;
}

body.theme-fitness.fintech-ui .dash-ambient--blue {
  background: radial-gradient(circle, rgba(249, 115, 22, 0.35), transparent 70%);
}

body.theme-fitness.fintech-ui .dash-ambient--gold {
  background: radial-gradient(circle, rgba(34, 197, 94, 0.28), transparent 70%);
}

body.theme-fitness.fintech-ui .dash-sidebar,
body.theme-fitness.fintech-ui .site-header {
  border-right: 3px solid #f97316;
  border-bottom: 3px solid transparent;
  background: #0f1623;
  backdrop-filter: none;
}

body.theme-fitness.fintech-ui .site-header {
  border-right: 0;
  border-bottom: 3px solid #f97316;
}

body.theme-fitness.fintech-ui .card,
body.theme-fitness.fintech-ui .stat-card,
body.theme-fitness.fintech-ui .service-category,
body.theme-fitness.fintech-ui .service-catalog__panel {
  border: 3px solid rgba(249, 115, 22, 0.55);
  background: #1f2937;
  box-shadow: var(--shadow-sm);
}

body.theme-fitness.fintech-ui .stat-card:nth-child(even),
body.theme-fitness.fintech-ui .service-category:nth-child(even) {
  border-color: rgba(34, 197, 94, 0.55);
  box-shadow: 6px 6px 0 rgba(34, 197, 94, 0.3);
}

body.theme-fitness.fintech-ui .btn-primary {
  background: #f97316;
  border: 3px solid #fff;
  box-shadow: 4px 4px 0 #22c55e;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 800;
}

body.theme-fitness.fintech-ui .btn-primary:hover {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 #22c55e;
}

body.theme-fitness.fintech-ui .fin-page-header h1,
body.theme-fitness.fintech-ui .services-page__header h1 {
  text-transform: uppercase;
  font-weight: 800;
  letter-spacing: -0.01em;
  line-height: 0.95;
}

body.theme-fitness.fintech-ui .fin-page-header {
  border-left: 6px solid #f97316;
  padding-left: 1rem;
}

html[data-ui-theme="light"] body.theme-fitness.fintech-ui {
  --fin-bg: #fff7ed;
  --fin-surface: #ffffff;
  --fin-text: #1f2937;
  --fin-muted: #6b7280;
  --fin-border: rgba(234, 88, 12, 0.2);
  --color-bg: #fff7ed;
  --color-surface: #ffffff;
  --color-text: #1f2937;
  --color-muted: #6b7280;
  --app-bg: #fff7ed;
  --app-panel-solid: #ffffff;
  --app-text: #1f2937;
  --app-muted: #6b7280;
}

html[data-ui-theme="light"] body.theme-fitness.fintech-ui .dash-shell {
  background:
    repeating-linear-gradient(-18deg, transparent, transparent 40px, rgba(249, 115, 22, 0.05) 40px, rgba(249, 115, 22, 0.05) 41px),
    #fff7ed;
}

html[data-ui-theme="light"] body.theme-fitness.fintech-ui .card,
html[data-ui-theme="light"] body.theme-fitness.fintech-ui .service-category {
  background: #ffffff;
  border: 3px solid #f97316;
  box-shadow: 6px 6px 0 rgba(249, 115, 22, 0.25);
}

/* ═══════════════════════════════════════════
   MUSIC — Immersive editorial / soft blobs
   ═══════════════════════════════════════════ */
body.theme-music.fintech-ui {
  --fin-radius: 28px;
  --fin-radius-sm: 18px;
  --fin-radius-lg: 40px;
  --theme-card-radius: 28px;
  --theme-btn-radius: 999px;
  --shadow-sm: 0 18px 40px rgba(67, 56, 202, 0.22);
  --shadow-md: 0 30px 70px rgba(30, 27, 75, 0.35);
}

body.theme-music.fintech-ui .dash-shell {
  background:
    radial-gradient(circle at 15% 20%, rgba(99, 102, 241, 0.35), transparent 32%),
    radial-gradient(circle at 85% 15%, rgba(34, 197, 94, 0.18), transparent 28%),
    radial-gradient(circle at 70% 80%, rgba(129, 140, 248, 0.22), transparent 35%),
    #0b0a1c;
}

body.theme-music.fintech-ui .dash-grid {
  opacity: 0;
}

body.theme-music.fintech-ui .dash-ambient--blue {
  width: 55vmax;
  height: 55vmax;
  background: radial-gradient(circle, rgba(99, 102, 241, 0.45), transparent 70%);
  filter: blur(40px);
}

body.theme-music.fintech-ui .dash-ambient--gold {
  width: 40vmax;
  height: 40vmax;
  background: radial-gradient(circle, rgba(163, 230, 53, 0.28), transparent 70%);
  filter: blur(50px);
}

body.theme-music.fintech-ui .dash-sidebar,
body.theme-music.fintech-ui .site-header,
body.theme-music.fintech-ui .site-nav-drawer {
  border: 0;
  background: rgba(20, 16, 55, 0.55);
  backdrop-filter: blur(28px) saturate(160%);
  border-radius: 0 28px 28px 0;
}

body.theme-music.fintech-ui .site-header {
  border-radius: 0 0 28px 28px;
  margin: 0.75rem 1rem 0;
  width: calc(100% - 2rem);
}

body.theme-music.fintech-ui .card,
body.theme-music.fintech-ui .stat-card,
body.theme-music.fintech-ui .service-category,
body.theme-music.fintech-ui .service-catalog__panel {
  border: 0;
  background: rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(18px);
  box-shadow: var(--shadow-sm);
}

body.theme-music.fintech-ui .btn-primary {
  background: linear-gradient(120deg, #4338ca, #22c55e);
  border: 0;
  box-shadow: 0 16px 36px rgba(67, 56, 202, 0.35);
}

body.theme-music.fintech-ui .fin-page-header h1,
body.theme-music.fintech-ui .services-page__header h1 {
  font-weight: 700;
  letter-spacing: -0.05em;
  background: linear-gradient(120deg, #e0e7ff, #a3e635);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

body.theme-music.fintech-ui .dash-main {
  padding-top: 0.5rem;
}

html[data-ui-theme="light"] body.theme-music.fintech-ui {
  --fin-bg: #eef2ff;
  --fin-surface: #ffffff;
  --fin-text: #1e1b4b;
  --fin-muted: #6366a8;
  --fin-border: rgba(67, 56, 202, 0.14);
  --color-bg: #eef2ff;
  --color-surface: #ffffff;
  --color-text: #1e1b4b;
  --color-muted: #6366a8;
  --app-bg: #eef2ff;
  --app-panel-solid: #ffffff;
  --app-text: #1e1b4b;
  --app-muted: #6366a8;
}

html[data-ui-theme="light"] body.theme-music.fintech-ui .dash-shell {
  background:
    radial-gradient(circle at 20% 10%, rgba(99, 102, 241, 0.18), transparent 35%),
    radial-gradient(circle at 80% 80%, rgba(34, 197, 94, 0.12), transparent 30%),
    #eef2ff;
}

html[data-ui-theme="light"] body.theme-music.fintech-ui .card,
html[data-ui-theme="light"] body.theme-music.fintech-ui .service-category {
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 18px 40px rgba(67, 56, 202, 0.1);
}

/* ═══════════════════════════════════════════
   LEGAL — Formal authority / editorial
   ═══════════════════════════════════════════ */
body.theme-legal.fintech-ui {
  --fin-radius: 2px;
  --fin-radius-sm: 2px;
  --fin-radius-lg: 4px;
  --theme-card-radius: 2px;
  --theme-btn-radius: 2px;
  --shadow-sm: 0 1px 0 rgba(255, 255, 255, 0.04), 0 12px 28px rgba(0, 0, 0, 0.28);
  --shadow-md: 0 1px 0 rgba(255, 255, 255, 0.05), 0 20px 48px rgba(0, 0, 0, 0.35);
}

body.theme-legal.fintech-ui .dash-shell {
  background:
    linear-gradient(180deg, #10182c 0%, #0b1220 45%, #0d1528 100%);
}

body.theme-legal.fintech-ui .dash-grid {
  opacity: 0.08;
  background-image:
    linear-gradient(rgba(212, 175, 55, 0.25) 1px, transparent 1px);
  background-size: 100% 48px;
}

body.theme-legal.fintech-ui .dash-ambient--blue {
  background: radial-gradient(circle, rgba(30, 58, 138, 0.35), transparent 70%);
}

body.theme-legal.fintech-ui .dash-ambient--gold {
  background: radial-gradient(circle, rgba(180, 83, 9, 0.22), transparent 70%);
}

body.theme-legal.fintech-ui .dash-sidebar,
body.theme-legal.fintech-ui .site-header,
body.theme-legal.fintech-ui .site-nav-drawer {
  border-color: rgba(212, 175, 55, 0.22);
  background: #0e1629;
  backdrop-filter: none;
}

body.theme-legal.fintech-ui .dash-sidebar .brand span,
body.theme-legal.fintech-ui .site-header .brand span {
  font-family: var(--font-heading);
  letter-spacing: 0.02em;
  font-weight: 600;
}

body.theme-legal.fintech-ui .card,
body.theme-legal.fintech-ui .stat-card,
body.theme-legal.fintech-ui .service-category,
body.theme-legal.fintech-ui .service-catalog__panel {
  border: 1px solid rgba(212, 175, 55, 0.28);
  border-top: 3px solid #d97706;
  background: #14213d;
  box-shadow: none;
}

body.theme-legal.fintech-ui .btn-primary {
  background: #1e3a8a;
  border: 1px solid #d97706;
  box-shadow: none;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 0.75rem;
  font-weight: 700;
}

body.theme-legal.fintech-ui .fin-page-header h1,
body.theme-legal.fintech-ui .services-page__header h1 {
  font-family: var(--font-heading);
  font-weight: 600;
  letter-spacing: -0.01em;
  border-bottom: 1px solid rgba(212, 175, 55, 0.35);
  padding-bottom: 0.65rem;
}

body.theme-legal.fintech-ui .page-kicker {
  color: #d97706;
}

body.theme-legal.fintech-ui .dash-commandbar {
  border-bottom: 1px solid rgba(212, 175, 55, 0.25);
  color: #c4b58a;
}

html[data-ui-theme="light"] body.theme-legal.fintech-ui {
  --fin-bg: #f8fafc;
  --fin-surface: #ffffff;
  --fin-text: #0f172a;
  --fin-muted: #64748b;
  --fin-border: rgba(30, 58, 138, 0.14);
  --color-bg: #f8fafc;
  --color-surface: #ffffff;
  --color-text: #0f172a;
  --color-muted: #64748b;
  --app-bg: #f8fafc;
  --app-panel-solid: #ffffff;
  --app-text: #0f172a;
  --app-muted: #64748b;
}

html[data-ui-theme="light"] body.theme-legal.fintech-ui .dash-shell {
  background: #f8fafc;
}

html[data-ui-theme="light"] body.theme-legal.fintech-ui .card,
html[data-ui-theme="light"] body.theme-legal.fintech-ui .service-category {
  background: #ffffff;
  border: 1px solid #cbd5e1;
  border-top: 3px solid #b45309;
  box-shadow: 0 1px 0 #e2e8f0;
}

/* ═══════════════════════════════════════════
   CRM — Dense flat SaaS support desk
   ═══════════════════════════════════════════ */
body.theme-crm.fintech-ui {
  --fin-radius: 10px;
  --fin-radius-sm: 8px;
  --fin-radius-lg: 12px;
  --theme-card-radius: 10px;
  --theme-btn-radius: 8px;
  --theme-density: 0.75rem;
  --shadow-sm: none;
  --shadow-md: none;
}

body.theme-crm.fintech-ui .dash-shell {
  background: #020617;
}

body.theme-crm.fintech-ui .dash-grid,
body.theme-crm.fintech-ui .dash-ambient {
  display: none;
}

body.theme-crm.fintech-ui .dash-sidebar,
body.theme-crm.fintech-ui .site-header,
body.theme-crm.fintech-ui .site-nav-drawer {
  border-color: #1e293b;
  background: #0f172a;
  backdrop-filter: none;
  box-shadow: none;
}

body.theme-crm.fintech-ui .dash-wrap {
  gap: 0;
}

body.theme-crm.fintech-ui .dash-main {
  padding: 1rem clamp(0.85rem, 2vw, 1.25rem) 2rem;
}

body.theme-crm.fintech-ui .dash-commandbar {
  min-height: 40px;
  margin-bottom: 0.85rem;
  padding-bottom: 0.55rem;
  border-bottom-color: #1e293b;
}

body.theme-crm.fintech-ui .card,
body.theme-crm.fintech-ui .stat-card,
body.theme-crm.fintech-ui .service-category,
body.theme-crm.fintech-ui .service-catalog__panel,
body.theme-crm.fintech-ui .dashboard-section {
  border: 1px solid #1e293b;
  background: #0f172a;
  box-shadow: none;
  padding: 0.85rem;
}

body.theme-crm.fintech-ui .stat-card,
body.theme-crm.fintech-ui .service-category {
  min-height: 0;
}

body.theme-crm.fintech-ui .btn-primary {
  background: #2563eb;
  border: 0;
  box-shadow: none;
}

body.theme-crm.fintech-ui .btn-primary:hover {
  background: #1d4ed8;
  transform: none;
  box-shadow: none;
}

body.theme-crm.fintech-ui .fin-page-header {
  min-height: 0;
  margin-bottom: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid #1e293b;
}

body.theme-crm.fintech-ui .fin-page-header h1,
body.theme-crm.fintech-ui .services-page__header h1 {
  font-size: clamp(1.35rem, 2.5vw, 1.85rem);
  letter-spacing: -0.03em;
}

body.theme-crm.fintech-ui .dashboard-metrics,
body.theme-crm.fintech-ui .service-categories {
  gap: 0.65rem;
}

body.theme-crm.fintech-ui .dash-sidebar .nav-link {
  border-radius: 8px;
  padding: 0.55rem 0.7rem;
}

body.theme-crm.fintech-ui .dash-sidebar .nav-link.active {
  background: rgba(37, 99, 235, 0.16);
  border-color: rgba(37, 99, 235, 0.35);
}

html[data-ui-theme="light"] body.theme-crm.fintech-ui {
  --fin-bg: #f1f5f9;
  --fin-surface: #ffffff;
  --fin-text: #0f172a;
  --fin-muted: #64748b;
  --fin-border: rgba(37, 99, 235, 0.14);
  --color-bg: #f1f5f9;
  --color-surface: #ffffff;
  --color-text: #0f172a;
  --color-muted: #64748b;
  --app-bg: #f1f5f9;
  --app-panel-solid: #ffffff;
  --app-text: #0f172a;
  --app-muted: #64748b;
}

html[data-ui-theme="light"] body.theme-crm.fintech-ui .dash-shell {
  background: #f1f5f9;
}

html[data-ui-theme="light"] body.theme-crm.fintech-ui .dash-sidebar,
html[data-ui-theme="light"] body.theme-crm.fintech-ui .site-header {
  background: #ffffff;
  border-color: #e2e8f0;
}

html[data-ui-theme="light"] body.theme-crm.fintech-ui .card,
html[data-ui-theme="light"] body.theme-crm.fintech-ui .service-category,
html[data-ui-theme="light"] body.theme-crm.fintech-ui .stat-card {
  background: #ffffff;
  border-color: #e2e8f0;
  box-shadow: none;
}

/* ═══════════════════════════════════════════
   FINTECH — keep dimensional glass default
   ═══════════════════════════════════════════ */
body.theme-fintech.fintech-ui {
  --theme-card-radius: 18px;
  --theme-btn-radius: 12px;
}

html[data-ui-theme="light"] body.theme-fintech.fintech-ui,
html[data-ui-theme="light"] body.theme-default.fintech-ui {
  --fin-bg: #f3f6fb;
  --fin-surface: #ffffff;
  --fin-text: #111c30;
  --fin-muted: #64748b;
  --fin-border: rgba(40, 61, 96, 0.13);
  --color-bg: #f3f6fb;
  --color-surface: #ffffff;
  --color-text: #111c30;
  --color-muted: #64748b;
  --app-bg: #f3f6fb;
  --app-panel-solid: #ffffff;
  --app-text: #111c30;
  --app-muted: #64748b;
}

html[data-ui-theme="light"] body.theme-unlockergroup.fintech-ui {
  --fin-bg: #fdf2f8;
  --fin-surface: #ffffff;
  --fin-text: #1e1230;
  --fin-muted: #6b5b73;
  --fin-border: rgba(231, 12, 169, 0.14);
  --color-bg: #fdf2f8;
  --color-surface: #ffffff;
  --color-text: #1e1230;
  --color-muted: #6b5b73;
  --app-bg: #fdf2f8;
  --app-panel-solid: #ffffff;
  --app-text: #1e1230;
  --app-muted: #6b5b73;
}

/* Shared light sync */
html[data-ui-theme="light"] body.fintech-ui {
  --app-panel: color-mix(in srgb, var(--fin-surface) 92%, transparent);
  --app-panel-raised: #ffffff;
  --app-line: var(--fin-border);
  --app-line-blue: color-mix(in srgb, var(--fin-blue) 25%, transparent);
}

/* Homepage hero adapts with preset body class */
body.theme-healthcare.page-home-fintech .fintech-hero {
  background:
    radial-gradient(ellipse at 80% 20%, rgba(8, 145, 178, 0.22), transparent 45%),
    radial-gradient(ellipse at 10% 80%, rgba(16, 185, 129, 0.16), transparent 40%),
    var(--fin-bg);
}

body.theme-gaming.page-home-fintech .fintech-hero {
  background:
    linear-gradient(135deg, rgba(124, 58, 237, 0.2), transparent 40%),
    linear-gradient(225deg, rgba(244, 63, 94, 0.14), transparent 40%),
    #0a0a1a;
}

body.theme-gaming.page-home-fintech .fintech-console,
body.theme-gaming.page-home-fintech .fintech-float {
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px));
  border-color: rgba(167, 139, 250, 0.35);
  box-shadow: 0 0 30px rgba(124, 58, 237, 0.25);
}

body.theme-fitness.page-home-fintech .fintech-hero {
  background:
    repeating-linear-gradient(-18deg, transparent, transparent 36px, rgba(249, 115, 22, 0.05) 36px, rgba(249, 115, 22, 0.05) 37px),
    #111827;
}

body.theme-fitness.page-home-fintech .fintech-btn--primary {
  border-radius: 4px;
  box-shadow: 5px 5px 0 #22c55e;
}

body.theme-music.page-home-fintech .fintech-hero {
  background:
    radial-gradient(circle at 20% 30%, rgba(99, 102, 241, 0.35), transparent 30%),
    radial-gradient(circle at 80% 20%, rgba(34, 197, 94, 0.18), transparent 28%),
    #0b0a1c;
}

body.theme-music.page-home-fintech .fintech-console {
  border: 0;
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.07);
  backdrop-filter: blur(20px);
}

body.theme-legal.page-home-fintech .fintech-hero {
  background: linear-gradient(180deg, #10182c, #0b1220);
}

body.theme-legal.page-home-fintech .fintech-console {
  border-radius: 2px;
  border-color: rgba(212, 175, 55, 0.3);
  border-top: 3px solid #d97706;
}

body.theme-crm.page-home-fintech .fintech-hero {
  background: #020617;
}

body.theme-crm.page-home-fintech .fintech-hero__grid,
body.theme-crm.page-home-fintech .fintech-hero__glow {
  opacity: 0.15;
}

body.theme-crm.page-home-fintech .fintech-console {
  border-radius: 10px;
  border-color: #1e293b;
  box-shadow: none;
  background: #0f172a;
}

/* Mobile safety: clip-path cards can overflow — keep readable on small screens */
@media (max-width: 720px) {
  body.theme-gaming.fintech-ui .card,
  body.theme-gaming.fintech-ui .stat-card,
  body.theme-gaming.fintech-ui .service-category,
  body.theme-gaming.fintech-ui .service-catalog__panel {
    clip-path: none;
    border-radius: 8px;
  }

  body.theme-music.fintech-ui .site-header {
    margin: 0;
    width: 100%;
    border-radius: 0;
  }

  body.theme-fitness.fintech-ui .card,
  body.theme-fitness.fintech-ui .service-category {
    box-shadow: 4px 4px 0 rgba(249, 115, 22, 0.28);
  }
}
