/* ==========================================================
   Elevate Professional Theme
   Final visual layer for a calmer, more polished, user-friendly UI.
   CSS-only: no route, template logic, or backend behavior changes.
   ========================================================== */

:root,
html[data-elevate-theme="light"] {
  --elevate-pro-bg: #f6f8fb;
  --elevate-pro-bg-soft: #eef4f8;
  --elevate-pro-surface: rgba(255, 255, 255, .96);
  --elevate-pro-surface-2: rgba(250, 252, 255, .94);
  --elevate-pro-ink: #0f172a;
  --elevate-pro-ink-soft: #334155;
  --elevate-pro-muted: #64748b;
  --elevate-pro-line: rgba(15, 23, 42, .10);
  --elevate-pro-line-strong: rgba(15, 23, 42, .16);
  --elevate-pro-primary: #145ea8;
  --elevate-pro-primary-2: #178ca6;
  --elevate-pro-accent: #c89b2f;
  --elevate-pro-success: #0f8a63;
  --elevate-pro-danger: #c2414b;
  --elevate-pro-radius: 18px;
  --elevate-pro-radius-sm: 12px;
  --elevate-pro-shadow: 0 14px 36px rgba(15, 23, 42, .08);
  --elevate-pro-shadow-hover: 0 20px 48px rgba(15, 23, 42, .12);
}

html[data-elevate-theme="dark"] {
  --elevate-pro-bg: #07111d;
  --elevate-pro-bg-soft: #0e1b2d;
  --elevate-pro-surface: rgba(14, 27, 45, .96);
  --elevate-pro-surface-2: rgba(11, 23, 39, .94);
  --elevate-pro-ink: #f8fafc;
  --elevate-pro-ink-soft: #d9e4f1;
  --elevate-pro-muted: #a9b8ca;
  --elevate-pro-line: rgba(226, 232, 240, .13);
  --elevate-pro-line-strong: rgba(226, 232, 240, .20);
  --elevate-pro-primary: #7cc5ff;
  --elevate-pro-primary-2: #5eead4;
  --elevate-pro-accent: #f1d078;
  --elevate-pro-success: #5ee0aa;
  --elevate-pro-danger: #fb7185;
  --elevate-pro-shadow: 0 16px 40px rgba(0, 0, 0, .30);
  --elevate-pro-shadow-hover: 0 22px 56px rgba(0, 0, 0, .42);
}

html {
  scroll-padding-top: 92px;
}

body.elevate-public-body,
body.elevate-app-body,
body {
  background:
    linear-gradient(180deg, rgba(246, 248, 251, .98), rgba(255, 255, 255, .98) 38%, rgba(241, 246, 250, .98)) !important;
  color: var(--elevate-pro-ink) !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  letter-spacing: 0;
}

html[data-elevate-theme="dark"] body.elevate-public-body,
html[data-elevate-theme="dark"] body.elevate-app-body,
html[data-elevate-theme="dark"] body {
  background:
    linear-gradient(180deg, #07111d 0%, #0b1728 46%, #07111d 100%) !important;
}

h1, h2, h3, h4, h5, h6,
strong,
.fw-bold,
.page-title,
.cakti-title,
.cakti-section-title {
  color: var(--elevate-pro-ink) !important;
  letter-spacing: 0 !important;
}

p,
.text-muted,
.form-text,
small,
.small {
  color: var(--elevate-pro-muted) !important;
}

.elevate-gradient-heading,
.cakti-gradient-text,
.elevate-gradient-text {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  color: var(--elevate-pro-ink) !important;
}

/* Navigation */
.elevate-public-nav,
.elevate-topbar,
.cakti-topbar {
  background: rgba(255, 255, 255, .88) !important;
  border-bottom: 1px solid var(--elevate-pro-line) !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .055) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

html[data-elevate-theme="dark"] .elevate-public-nav,
html[data-elevate-theme="dark"] .elevate-topbar,
html[data-elevate-theme="dark"] .cakti-topbar {
  background: rgba(8, 18, 31, .88) !important;
}

.elevate-public-links .nav-link,
.cakti-side-nav a {
  color: var(--elevate-pro-ink-soft) !important;
  border-radius: 12px !important;
  font-weight: 750 !important;
}

.elevate-public-links .nav-link:hover,
.elevate-public-links .nav-link:focus,
.cakti-side-nav a:hover,
.cakti-side-nav a:focus,
.cakti-side-nav a.active {
  color: var(--elevate-pro-primary) !important;
  background: rgba(20, 94, 168, .09) !important;
}

.elevate-sidebar,
.cakti-sidebar {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .94), rgba(247, 250, 252, .90)) !important;
  border-right: 1px solid var(--elevate-pro-line) !important;
  box-shadow: 14px 0 34px rgba(15, 23, 42, .055) !important;
}

html[data-elevate-theme="dark"] .elevate-sidebar,
html[data-elevate-theme="dark"] .cakti-sidebar {
  background:
    linear-gradient(180deg, rgba(11, 23, 39, .96), rgba(7, 17, 29, .92)) !important;
}

.cakti-nav-label {
  color: var(--elevate-pro-muted) !important;
  letter-spacing: .07em !important;
  font-weight: 850 !important;
}

.elevate-logo-shell,
.cakti-brand-mark-wide {
  border-radius: 12px !important;
}

/* Cards and panels */
.card,
.cakti-card,
.metric-card,
.metric-card-pro,
.professional-api-card,
.readiness-ring-card,
.elevate-glass-card,
.elevate-feature-card,
.elevate-advantage-card,
.elevate-step-card,
.elevate-pricing-card,
.elevate-dashboard-preview,
.elevate-testimonial-card,
.elevate-final-cta,
.elevate-demo-frame,
.elevate-pricing-panel,
.eji-card {
  background: linear-gradient(180deg, var(--elevate-pro-surface), var(--elevate-pro-surface-2)) !important;
  border: 1px solid var(--elevate-pro-line) !important;
  border-radius: var(--elevate-pro-radius) !important;
  box-shadow: var(--elevate-pro-shadow) !important;
}

.card:hover,
.cakti-card:hover,
.elevate-feature-card:hover,
.elevate-advantage-card:hover,
.elevate-step-card:hover,
.elevate-testimonial-card:hover,
.elevate-admin-menu-card:hover {
  box-shadow: var(--elevate-pro-shadow-hover) !important;
  transform: translateY(-2px);
}

.card-header,
.modal-header,
.table thead th {
  background: rgba(248, 250, 252, .88) !important;
  border-color: var(--elevate-pro-line) !important;
  color: var(--elevate-pro-ink) !important;
}

html[data-elevate-theme="dark"] .card-header,
html[data-elevate-theme="dark"] .modal-header,
html[data-elevate-theme="dark"] .table thead th {
  background: rgba(15, 29, 49, .92) !important;
}

.card-body {
  color: var(--elevate-pro-ink-soft);
}

/* Public home */
.elevate-home-hero-v2 {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .97), rgba(241, 247, 251, .94)) !important;
  border-bottom: 1px solid var(--elevate-pro-line);
  padding-top: clamp(78px, 9vw, 118px) !important;
  padding-bottom: clamp(52px, 7vw, 88px) !important;
}

html[data-elevate-theme="dark"] .elevate-home-hero-v2 {
  background:
    linear-gradient(135deg, rgba(9, 20, 35, .98), rgba(13, 30, 50, .95)) !important;
}

.elevate-home-hero-v2::before,
.elevate-home-hero-v2::after,
.elevate-dashboard-preview::before,
.elevate-testimonials-section::before {
  opacity: .28 !important;
}

.elevate-hero-badge,
.elevate-section-kicker,
.elevate-price-badge,
.elevate-token-pill,
.badge {
  background: rgba(20, 94, 168, .10) !important;
  border: 1px solid rgba(20, 94, 168, .16) !important;
  color: var(--elevate-pro-primary) !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
}

.elevate-hero-title {
  max-width: 760px;
  line-height: 1.02 !important;
}

.elevate-hero-subtitle,
.elevate-section-lead {
  color: var(--elevate-pro-muted) !important;
  line-height: 1.72 !important;
}

.elevate-feature-icon,
.elevate-admin-menu-card .icon,
.eji-stat-icon {
  background: linear-gradient(135deg, rgba(20, 94, 168, .13), rgba(23, 140, 166, .13)) !important;
  color: var(--elevate-pro-primary) !important;
  border: 1px solid rgba(20, 94, 168, .16) !important;
  box-shadow: none !important;
}

.elevate-preview-ring {
  background: linear-gradient(135deg, var(--elevate-pro-primary), var(--elevate-pro-primary-2)) !important;
  color: #fff !important;
}

/* Buttons */
.btn,
.cakti-btn-primary,
.cakti-btn-gold,
.elevate-theme-toggle {
  border-radius: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background-color .16s ease;
}

.btn-primary,
.cakti-btn-primary,
.elevate-register-btn {
  background: linear-gradient(135deg, var(--elevate-pro-primary), var(--elevate-pro-primary-2)) !important;
  border: 0 !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(20, 94, 168, .22) !important;
}

.btn-primary:hover,
.cakti-btn-primary:hover,
.elevate-register-btn:hover {
  box-shadow: 0 16px 32px rgba(20, 94, 168, .28) !important;
  transform: translateY(-1px);
}

.btn-success {
  background: linear-gradient(135deg, var(--elevate-pro-success), #16a085) !important;
  border: 0 !important;
  color: #fff !important;
}

.btn-warning,
.cakti-btn-gold {
  background: linear-gradient(135deg, #f5d37a, var(--elevate-pro-accent)) !important;
  border: 0 !important;
  color: #2f2410 !important;
  box-shadow: 0 12px 24px rgba(200, 155, 47, .20) !important;
}

.btn-outline-primary,
.btn-outline-dark,
.btn-outline-info,
.btn-outline-success,
.btn-outline-warning,
.btn-outline-danger,
.elevate-login-btn,
.elevate-theme-toggle {
  background: rgba(255, 255, 255, .70) !important;
  border: 1px solid var(--elevate-pro-line-strong) !important;
  color: var(--elevate-pro-ink-soft) !important;
  box-shadow: none !important;
}

html[data-elevate-theme="dark"] .btn-outline-primary,
html[data-elevate-theme="dark"] .btn-outline-dark,
html[data-elevate-theme="dark"] .btn-outline-info,
html[data-elevate-theme="dark"] .btn-outline-success,
html[data-elevate-theme="dark"] .btn-outline-warning,
html[data-elevate-theme="dark"] .btn-outline-danger,
html[data-elevate-theme="dark"] .elevate-login-btn,
html[data-elevate-theme="dark"] .elevate-theme-toggle {
  background: rgba(255, 255, 255, .06) !important;
  color: var(--elevate-pro-ink) !important;
}

.btn-outline-primary:hover,
.btn-outline-dark:hover,
.btn-outline-info:hover,
.btn-outline-success:hover,
.btn-outline-warning:hover,
.btn-outline-danger:hover,
.elevate-login-btn:hover,
.elevate-theme-toggle:hover {
  background: rgba(20, 94, 168, .10) !important;
  color: var(--elevate-pro-primary) !important;
  border-color: rgba(20, 94, 168, .28) !important;
}

/* Forms and tables */
.form-control,
.form-select,
textarea,
input:not([type="checkbox"]):not([type="radio"]) {
  background: rgba(255, 255, 255, .92) !important;
  border: 1px solid var(--elevate-pro-line-strong) !important;
  border-radius: 12px !important;
  color: var(--elevate-pro-ink) !important;
  box-shadow: none !important;
}

html[data-elevate-theme="dark"] .form-control,
html[data-elevate-theme="dark"] .form-select,
html[data-elevate-theme="dark"] textarea,
html[data-elevate-theme="dark"] input:not([type="checkbox"]):not([type="radio"]) {
  background: rgba(7, 17, 29, .86) !important;
}

.form-control:focus,
.form-select:focus,
textarea:focus,
input:not([type="checkbox"]):not([type="radio"]):focus {
  border-color: rgba(20, 94, 168, .58) !important;
  box-shadow: 0 0 0 .22rem rgba(20, 94, 168, .12) !important;
}

.table,
.list-group-item,
.dropdown-menu,
.modal-content {
  background: var(--elevate-pro-surface) !important;
  border-color: var(--elevate-pro-line) !important;
  color: var(--elevate-pro-ink-soft) !important;
}

.table tbody tr:hover {
  background: rgba(20, 94, 168, .045) !important;
}

code,
pre {
  color: var(--elevate-pro-ink) !important;
  background: rgba(15, 23, 42, .045) !important;
  border-radius: 10px;
}

html[data-elevate-theme="dark"] code,
html[data-elevate-theme="dark"] pre {
  background: rgba(255, 255, 255, .07) !important;
}

/* Alerts and status */
.alert {
  border-radius: var(--elevate-pro-radius-sm) !important;
  border: 1px solid var(--elevate-pro-line) !important;
  box-shadow: none !important;
}

.alert-info {
  background: rgba(20, 94, 168, .10) !important;
  color: var(--elevate-pro-primary) !important;
}

.alert-success {
  background: rgba(15, 138, 99, .11) !important;
  color: var(--elevate-pro-success) !important;
}

.alert-warning {
  background: rgba(200, 155, 47, .13) !important;
  color: #856018 !important;
}

.alert-danger {
  background: rgba(194, 65, 75, .11) !important;
  color: var(--elevate-pro-danger) !important;
}

/* Responsive polish */
@media (max-width: 991.98px) {
  .elevate-public-nav {
    min-height: 68px;
  }

  .elevate-public-links {
    align-items: stretch !important;
    gap: 6px !important;
    padding-top: 12px;
  }

  .elevate-public-links .nav-link,
  .elevate-nav-actions .btn,
  .elevate-nav-actions .elevate-theme-toggle {
    width: 100%;
    justify-content: center;
  }

  .elevate-home-hero-v2 {
    padding-top: 58px !important;
  }

  .elevate-hero-actions,
  .elevate-nav-actions {
    width: 100%;
  }

  .elevate-hero-actions .btn,
  .elevate-hero-actions a {
    width: 100%;
    justify-content: center;
  }

  .elevate-dashboard-preview,
  .elevate-feature-card,
  .elevate-advantage-card,
  .elevate-step-card,
  .card {
    border-radius: 16px !important;
  }
}

@media (max-width: 575.98px) {
  .container,
  .container-lg,
  .container-xl,
  .container-xxl {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .elevate-section-title,
  .elevate-hero-title {
    font-size: clamp(2rem, 11vw, 3.2rem) !important;
    line-height: 1.07 !important;
  }

  .card-body {
    padding: 18px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}
