/*
 * CentrusTotal dashboard brand theme (internal views)
 * Subtle accent layer on top of Material Dashboard + custom styles.
 */

:root {
  /* Brand core */
  --ct-color-primary-500: #1e88e5;
  --ct-color-indigo-500: #5e35b1;
  --ct-color-magenta-500: #d81b60;
  --ct-gradient-primary: linear-gradient(
    135deg,
    var(--ct-color-primary-500),
    var(--ct-color-indigo-500),
    var(--ct-color-magenta-500)
  );

  /* Neutral palette */
  --ct-color-dark-900: #0f172a;
  --ct-color-dark-800: #1e293b;
  --ct-color-gray-600: #475569;
  --ct-color-gray-300: #cbd5e1;
  --ct-color-gray-100: #f1f5f9;
  --ct-color-white: #ffffff;

  /* Status palette */
  --ct-color-success: #16a34a;
  --ct-color-warning: #f59e0b;
  --ct-color-error: #dc2626;
  --ct-color-info: #0284c7;

  /* Typography */
  --ct-font-primary: "Poppins", sans-serif;
  --ct-font-secondary: "Inter", sans-serif;
  --ct-text-h1-size: 32px;
  --ct-text-h2-size: 24px;
  --ct-text-h3-size: 20px;
  --ct-text-body-size: 16px;
  --ct-text-small-size: 14px;
  --ct-text-micro-size: 12px;

  /* Spacing + radius */
  --ct-space-1: 4px;
  --ct-space-2: 8px;
  --ct-space-3: 12px;
  --ct-space-4: 16px;
  --ct-space-5: 20px;
  --ct-space-6: 24px;
  --ct-space-8: 32px;
  --ct-radius-sm: 8px;
  --ct-radius-md: 12px;
  --ct-radius-lg: 16px;
  --ct-radius-xl: 20px;
  --ct-radius-pill: 999px;

  /* Shadows */
  --ct-shadow-sm: 0 8px 22px -16px rgba(15, 23, 42, 0.25);
  --ct-shadow-md: 0 18px 38px -24px rgba(15, 23, 42, 0.3);
  --ct-shadow-focus: 0 0 0 3px rgba(30, 136, 229, 0.22);

  /* Framework aliases */
  --bs-primary: var(--ct-color-primary-500);
  --bs-success: var(--ct-color-success);
  --bs-warning: var(--ct-color-warning);
  --bs-danger: var(--ct-color-error);
  --bs-info: var(--ct-color-info);
}

/* Typography system */
body.g-sidenav-show,
body.wizard-flow {
  font-family: var(--ct-font-secondary);
  font-size: var(--ct-text-body-size);
  color: var(--ct-color-dark-800);
}

body.g-sidenav-show h1,
body.wizard-flow h1,
body.g-sidenav-show .h1,
body.wizard-flow .h1 {
  font-family: var(--ct-font-primary);
  font-size: var(--ct-text-h1-size);
}

body.g-sidenav-show h2,
body.wizard-flow h2,
body.g-sidenav-show .h2,
body.wizard-flow .h2 {
  font-family: var(--ct-font-primary);
  font-size: var(--ct-text-h2-size);
}

body.g-sidenav-show h3,
body.wizard-flow h3,
body.g-sidenav-show .h3,
body.wizard-flow .h3 {
  font-family: var(--ct-font-primary);
  font-size: var(--ct-text-h3-size);
}

body.g-sidenav-show small,
body.wizard-flow small,
body.g-sidenav-show .small,
body.wizard-flow .small {
  font-size: var(--ct-text-small-size);
}

body.g-sidenav-show .text-xs,
body.wizard-flow .text-xs {
  font-size: var(--ct-text-micro-size) !important;
}

/* Navigation + shell accents */
body.g-sidenav-show .navbar-main,
body.g-sidenav-show .dashboard-appbar,
body.wizard-flow .navbar-main,
body.wizard-flow .dashboard-appbar {
  border-bottom: 1px solid rgba(203, 213, 225, 0.6);
  box-shadow: 0 12px 30px -24px rgba(30, 41, 59, 0.34);
}

body.g-sidenav-show #sidenav-main,
body.wizard-flow #sidenav-main {
  border-right: 1px solid rgba(203, 213, 225, 0.48);
}

body.g-sidenav-show #sidenav-main .nav-link,
body.wizard-flow #sidenav-main .nav-link {
  border-radius: var(--ct-radius-md);
  transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

body.g-sidenav-show #sidenav-main .nav-link:hover,
body.wizard-flow #sidenav-main .nav-link:hover {
  background: rgba(30, 136, 229, 0.08);
  color: var(--ct-color-dark-900);
}

body.g-sidenav-show #sidenav-main .nav-link.active,
body.wizard-flow #sidenav-main .nav-link.active {
  background: linear-gradient(
    135deg,
    rgba(30, 136, 229, 0.16),
    rgba(94, 53, 177, 0.1),
    rgba(216, 27, 96, 0.1)
  );
  border-left: 3px solid var(--ct-color-primary-500);
  color: var(--ct-color-dark-900);
  font-weight: 600;
}

body.g-sidenav-show #sidenav-main .sidebar-section-title,
body.wizard-flow #sidenav-main .sidebar-section-title {
  color: var(--ct-color-gray-600) !important;
  letter-spacing: 0.07em;
}

/* Cards + surfaces */
body.g-sidenav-show .card,
body.g-sidenav-show .dashboard-panel,
body.wizard-flow .card,
body.wizard-flow .dashboard-panel {
  border: 1px solid rgba(203, 213, 225, 0.62);
  border-radius: var(--ct-radius-lg);
  box-shadow: var(--ct-shadow-sm);
}

body.g-sidenav-show .card:hover,
body.g-sidenav-show .dashboard-panel:hover,
body.wizard-flow .card:hover,
body.wizard-flow .dashboard-panel:hover {
  box-shadow: var(--ct-shadow-md);
}

body.g-sidenav-show .card .card-header,
body.g-sidenav-show .dashboard-panel__header,
body.wizard-flow .card .card-header,
body.wizard-flow .dashboard-panel__header {
  border-bottom: 1px solid rgba(203, 213, 225, 0.42);
}

/* Buttons */
body.g-sidenav-show .btn-primary,
body.g-sidenav-show .btn.bg-gradient-primary,
body.g-sidenav-show .btn.btn-primary,
body.wizard-flow .btn-primary,
body.wizard-flow .btn.bg-gradient-primary,
body.wizard-flow .btn.btn-primary {
  border: 0;
  color: var(--ct-color-white);
  background: var(--ct-gradient-primary) !important;
  box-shadow: 0 16px 28px -20px rgba(94, 53, 177, 0.75);
}

body.g-sidenav-show .btn-primary:hover,
body.g-sidenav-show .btn.bg-gradient-primary:hover,
body.g-sidenav-show .btn.btn-primary:hover,
body.wizard-flow .btn-primary:hover,
body.wizard-flow .btn.bg-gradient-primary:hover,
body.wizard-flow .btn.btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 20px 32px -20px rgba(216, 27, 96, 0.65);
}

body.g-sidenav-show .btn-outline-primary,
body.wizard-flow .btn-outline-primary {
  border-color: rgba(30, 136, 229, 0.5);
  color: var(--ct-color-primary-500);
}

body.g-sidenav-show .btn-outline-primary:hover,
body.wizard-flow .btn-outline-primary:hover {
  background-color: rgba(30, 136, 229, 0.1);
}

/* Forms */
body.g-sidenav-show .form-control,
body.g-sidenav-show .form-select,
body.wizard-flow .form-control,
body.wizard-flow .form-select {
  border-color: rgba(203, 213, 225, 0.9);
  border-radius: var(--ct-radius-md);
}

body.g-sidenav-show .form-control:focus,
body.g-sidenav-show .form-select:focus,
body.g-sidenav-show .input-group.input-group-outline.is-focused .form-control,
body.wizard-flow .form-control:focus,
body.wizard-flow .form-select:focus,
body.wizard-flow .input-group.input-group-outline.is-focused .form-control {
  border-color: var(--ct-color-primary-500) !important;
  box-shadow: var(--ct-shadow-focus);
}

/* Material input-group-outline default focus/fill (pink) override */
body.g-sidenav-show .input-group.input-group-outline.is-focused .form-label + .form-control,
body.g-sidenav-show .input-group.input-group-outline.is-filled .form-label + .form-control,
body.wizard-flow .input-group.input-group-outline.is-focused .form-label + .form-control,
body.wizard-flow .input-group.input-group-outline.is-filled .form-label + .form-control {
  border-color: var(--ct-color-primary-500) !important;
  border-top-color: transparent !important;
  box-shadow: inset 1px 0 var(--ct-color-primary-500), inset -1px 0 var(--ct-color-primary-500), inset 0 -1px var(--ct-color-primary-500) !important;
}

body.g-sidenav-show .input-group.input-group-outline.is-focused .form-label,
body.g-sidenav-show .input-group.input-group-outline.is-filled .form-label,
body.wizard-flow .input-group.input-group-outline.is-focused .form-label,
body.wizard-flow .input-group.input-group-outline.is-filled .form-label {
  color: var(--ct-color-primary-500) !important;
}

body.g-sidenav-show .input-group.input-group-outline.is-focused .form-label:before,
body.g-sidenav-show .input-group.input-group-outline.is-focused .form-label:after,
body.g-sidenav-show .input-group.input-group-outline.is-filled .form-label:before,
body.g-sidenav-show .input-group.input-group-outline.is-filled .form-label:after,
body.wizard-flow .input-group.input-group-outline.is-focused .form-label:before,
body.wizard-flow .input-group.input-group-outline.is-focused .form-label:after,
body.wizard-flow .input-group.input-group-outline.is-filled .form-label:before,
body.wizard-flow .input-group.input-group-outline.is-filled .form-label:after {
  border-top-color: var(--ct-color-primary-500) !important;
  box-shadow: inset 0 1px var(--ct-color-primary-500) !important;
}

/* Dynamic/static variants also use pink in focused state */
body.g-sidenav-show .input-group.input-group-dynamic.is-focused label,
body.g-sidenav-show .input-group.input-group-static.is-focused label,
body.wizard-flow .input-group.input-group-dynamic.is-focused label,
body.wizard-flow .input-group.input-group-static.is-focused label {
  color: var(--ct-color-primary-500) !important;
}

/* Links and status */
body.g-sidenav-show a,
body.wizard-flow a {
  color: var(--ct-color-primary-500);
}

body.g-sidenav-show a:hover,
body.wizard-flow a:hover {
  color: var(--ct-color-indigo-500);
}

body.g-sidenav-show .badge.bg-success,
body.wizard-flow .badge.bg-success {
  background-color: var(--ct-color-success) !important;
}

body.g-sidenav-show .badge.bg-warning,
body.wizard-flow .badge.bg-warning {
  background-color: var(--ct-color-warning) !important;
}

body.g-sidenav-show .badge.bg-danger,
body.wizard-flow .badge.bg-danger {
  background-color: var(--ct-color-error) !important;
}

body.g-sidenav-show .badge.bg-info,
body.wizard-flow .badge.bg-info {
  background-color: var(--ct-color-info) !important;
}

/* Utility classes for future feature work */
body.g-sidenav-show .ct-brand-gradient,
body.wizard-flow .ct-brand-gradient {
  background: var(--ct-gradient-primary) !important;
}

body.g-sidenav-show .ct-font-display,
body.wizard-flow .ct-font-display {
  font-family: var(--ct-font-primary) !important;
}

body.g-sidenav-show .ct-font-body,
body.wizard-flow .ct-font-body {
  font-family: var(--ct-font-secondary) !important;
}