:root {
  --brand-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --brand-body-bg: #f9fafb;
  --brand-surface: #ffffff;
  --brand-text: #4b5563;
  --brand-heading: #111827;
  --brand-muted: #6b7280;
  --brand-border: #d1d5db;

  --brand-primary: #22c55e;
  --brand-primary-600: #16a34a;
  --brand-primary-700: #15803d;
  --brand-primary-800: #166534;
  --brand-secondary: #374151;
  --brand-success: #16a34a;
  --brand-danger: #dc2626;
  --brand-danger-700: #b91c1c;
  --brand-warning: #f59e0b;
  --brand-info: #22c55e;

  --emerald-50: #ecfdf5;
  --emerald-900: #064e3b;
  --emerald-950: #022c22;
  --slate-50: #f8fafc;
  --slate-100: #f1f5f9;
  --gray-50: #f9fafb;
  --gray-100: #f3f4f6;
  --gray-200: #e5e7eb;
  --gray-300: #d1d5db;
  --gray-400: #9ca3af;
  --gray-600: #4b5563;
  --gray-700: #374151;
  --gray-800: #1f2937;
  --gray-900: #111827;
  --red-50: #fef2f2;
  --red-400: #f87171;
  --red-600: #dc2626;
  --red-700: #b91c1c;

  --overlay-white-5: rgba(255, 255, 255, 0.05);
  --overlay-white-10: rgba(255, 255, 255, 0.1);
  --overlay-white-15: rgba(255, 255, 255, 0.15);
  --overlay-white-60: rgba(255, 255, 255, 0.6);
  --overlay-black-40: rgba(0, 0, 0, 0.4);
  --overlay-black-60: rgba(0, 0, 0, 0.6);

  --brand-accent-a: #16a34a;
  --brand-accent-b: #22c55e;
  --brand-shadow: 0 10px 18px 0 rgba(17, 24, 39, 0.12);
  --brand-radius-sm: 8px;
  --brand-radius-md: 12px;
  --brand-radius-lg: 16px;
  --brand-shadow-soft: 0 8px 24px rgba(17, 24, 39, 0.08);
}

body {
  font-family: var(--brand-font-sans);
  color: var(--brand-text);
  background: var(--brand-body-bg);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--brand-heading);
}

a,
a:hover,
.text-c-blue,
.pcoded-header a:hover {
  color: var(--brand-primary);
}

.theme-bg,
.theme-bg2,
.md-show.md-effect-12 ~ .md-overlay,
.progress-bar {
  background: linear-gradient(-135deg, var(--brand-accent-a) 0%, var(--brand-accent-b) 100%);
}

.card.theme-bg,
.card.theme-bg2 {
  background: var(--brand-primary) !important;
  background-image: none !important;
}

.card,
body.layout-6 .card,
body.layout-8 .card {
  background: var(--brand-surface);
  border-color: var(--brand-border);
  border-radius: var(--brand-radius-md);
  box-shadow: var(--brand-shadow-soft);
}

.card .card-header,
.card .card-footer {
  border-color: var(--brand-border);
}

.card .card-header {
  border-top-left-radius: var(--brand-radius-md);
  border-top-right-radius: var(--brand-radius-md);
}

.card .card-footer {
  border-bottom-left-radius: var(--brand-radius-md);
  border-bottom-right-radius: var(--brand-radius-md);
}

.card .card-header h5,
.page-header-title + .breadcrumb > .breadcrumb-item:last-child a {
  color: var(--brand-heading);
}

.card .card-header h5:after {
  background-color: var(--brand-primary);
}

.btn-primary,
.btn-info,
.pcoded-header .navbar-nav > li span.top-icon a,
.pcoded-header .dropdown .profile-notification .pro-head,
.bg-c-blue,
.card-border-c-blue {
  background-color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  color: #fff !important;
}

.btn,
.badge,
.page-link,
.nav-pills .nav-link,
.nav-tabs .nav-link {
  border-radius: var(--brand-radius-sm);
}

.form-control,
.custom-select,
.form-select,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple,
.input-group-text,
.dropdown-menu,
.modal-content {
  border-radius: var(--brand-radius-sm) !important;
}

.table,
.table-responsive,
.dataTables_wrapper .dataTables_scroll,
.dataTables_wrapper .dataTables_paginate {
  border-radius: var(--brand-radius-sm);
}

.card.theme-bg,
.card.theme-bg2,
.bg-c-blue,
.bg-c-green,
.bg-c-red,
.bg-c-yellow,
.bg-c-purple {
  border-radius: var(--brand-radius-lg);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-info:hover,
.btn-info:focus {
  background-color: var(--brand-primary-700) !important;
  border-color: var(--brand-primary-700) !important;
}

.btn-success,
.bg-c-green,
.card-border-c-green {
  background-color: var(--brand-success) !important;
  border-color: var(--brand-success) !important;
  color: #fff !important;
}

.btn-danger,
.bg-c-red,
.card-border-c-red {
  background-color: var(--brand-danger) !important;
  border-color: var(--brand-danger) !important;
  color: #fff !important;
}

.btn-warning,
.bg-c-yellow,
.card-border-c-yellow {
  background-color: var(--brand-warning) !important;
  border-color: var(--brand-warning) !important;
}

.bg-c-purple,
.card-border-c-purple {
  background-color: var(--brand-secondary) !important;
  border-color: var(--brand-secondary) !important;
  color: #fff !important;
}

.text-c-green,
.text-c-blue {
  color: var(--brand-primary-600) !important;
}

.text-c-red {
  color: var(--brand-danger) !important;
}

.text-c-yellow {
  color: var(--brand-warning) !important;
}

.loader-bg {
  background: var(--overlay-black-40);
}

.card .card-header,
.dropdown-menu,
.pcoded-header .dropdown .dropdown-menu {
  background-color: var(--brand-surface);
}

.pcoded-navbar,
.pcoded-navbar.navbar-lightblue,
.pcoded-navbar[class*="navbar-"] {
  background: var(--brand-secondary);
}

.pcoded-navbar .header-logo,
.pcoded-header,
.pcoded-header.header-lightblue,
.pcoded-header[class*="header-"] {
  background: var(--brand-surface);
}

.pcoded-header .dropdown .dropdown-menu,
.dropdown-menu {
  border-color: var(--brand-border);
  box-shadow: var(--brand-shadow);
}

.pcoded-header .dropdown .dropdown-menu li a,
.dropdown-menu > li > a,
.page-header-title + .breadcrumb > .breadcrumb-item a {
  color: var(--brand-muted);
}

.pcoded-header .dropdown .dropdown-menu li.active a,
.pcoded-header .dropdown .dropdown-menu li:hover a,
.dropdown-menu > li.active > a,
.dropdown-menu > li:hover > a {
  color: var(--brand-primary);
}

.table.table-styling thead,
.table-hover tbody tr:hover {
  --bs-table-accent-bg: rgba(34, 197, 94, 0.08) !important;
}

/*
 * Second-pass normalization for legacy color variant classes.
 * This keeps existing class names/structure but forces the new brand palette.
 */
.pcoded-header[class*="header-"] {
  background: linear-gradient(180deg, var(--emerald-50) 0%, var(--brand-surface) 100%) !important;
  border-bottom: 1px solid var(--gray-200);
}

.pcoded-header[class*="header-"] .input-group .input-group-text,
.pcoded-header[class*="header-"] a,
.pcoded-header[class*="header-"] .dropdown-toggle,
.pcoded-header[class*="header-"] .navbar-nav > li .nav-link {
  color: var(--gray-700) !important;
}

.pcoded-header[class*="header-"] a:hover,
.pcoded-header[class*="header-"] .dropdown-toggle:hover,
.pcoded-header[class*="header-"] .navbar-nav > li .nav-link:hover {
  color: var(--brand-primary-700) !important;
}

.pcoded-header[class*="header-"] .dropdown .notification .noti-body li.notification:hover,
.pcoded-header[class*="header-"] .dropdown .profile-notification .pro-head,
.pcoded-header[class*="header-"] .main-search.open .input-group .search-btn,
.pcoded-header[class*="header-"] .b-bg {
  background: var(--brand-primary) !important;
}

.pcoded-header[class*="header-"] .dropdown .profile-notification .pro-head,
.pcoded-header[class*="header-"] .dropdown .profile-notification .pro-head .dud-logout {
  color: #fff !important;
}

.pcoded-navbar[class*="navbar-"] {
  background: linear-gradient(180deg, var(--emerald-950) 0%, var(--emerald-900) 100%) !important;
}

.pcoded-navbar[class*="brand-"] .header-logo,
.pcoded-navbar[class*="navbar-"] .header-logo {
  background: var(--overlay-white-5) !important;
}

.pcoded-navbar[class*="brand-"] .header-logo .b-bg,
.pcoded-navbar[class*="navbar-"] .header-logo .b-bg,
.pcoded-navbar[class*="navbar-"] .mobile-menu span,
.pcoded-navbar[class*="navbar-"] .mobile-menu span:after,
.pcoded-navbar[class*="navbar-"] .mobile-menu span:before {
  background: var(--brand-primary) !important;
}

.pcoded-navbar[class*="navbar-"] .navbar-brand,
.pcoded-navbar[class*="navbar-"] .pcoded-submenu,
.pcoded-navbar[class*="navbar-"] .pcoded-menu-caption,
.pcoded-navbar[class*="navbar-"] .pcoded-inner-navbar li a,
.pcoded-navbar[class*="title-"] .pcoded-inner-navbar .pcoded-menu-caption {
  color: rgba(255, 255, 255, 0.85) !important;
}

.pcoded-navbar[class*="active-"] .pcoded-inner-navbar li.active > a,
.pcoded-navbar[class*="active-"] .pcoded-inner-navbar li:focus > a,
.pcoded-navbar[class*="active-"] .pcoded-inner-navbar li:hover > a,
.pcoded-navbar[class*="active-"] .pcoded-inner-navbar > li.active > a,
.pcoded-navbar[class*="active-"] .pcoded-inner-navbar > li.pcoded-trigger > a,
.pcoded-navbar[class*="active-"] .pcoded-inner-navbar li .pcoded-submenu > li.active > a,
.pcoded-navbar[class*="active-"] .pcoded-inner-navbar li .pcoded-submenu > li:hover > a,
.pcoded-navbar[class*="active-"] .pcoded-inner-navbar li .pcoded-submenu > li:focus > a {
  color: #ffffff !important;
  background: var(--overlay-white-10) !important;
}

.pcoded-navbar[class*="active-"] .pcoded-inner-navbar > li.active:after,
.pcoded-navbar[class*="active-"] .pcoded-inner-navbar > li.pcoded-trigger:after,
.pcoded-navbar[class*="active-"] .pcoded-inner-navbar li .pcoded-submenu > li.active > a:before,
.pcoded-navbar[class*="active-"] .pcoded-inner-navbar li .pcoded-submenu > li:hover > a:before,
.pcoded-navbar[class*="active-"] .pcoded-inner-navbar li .pcoded-submenu > li:focus > a:before,
.pcoded-navbar[class*="menu-item-icon-style"] .pcoded-inner-navbar li.pcoded-hasmenu .pcoded-submenu li.active > a:before {
  background: var(--brand-primary) !important;
  color: var(--brand-primary) !important;
}

body.layout-1 .pcoded-navbar[class*="active-"] .sidemenu li.active,
body.layout-1 .pcoded-navbar[class*="active-"] .sidemenu li.active:after {
  background: var(--brand-primary) !important;
}

.pcoded-navbar.theme-horizontal[class*="active-"] .pcoded-inner-navbar > li.active > a,
.pcoded-navbar.theme-horizontal[class*="active-"] .pcoded-inner-navbar > li.pcoded-trigger > a,
.pcoded-navbar.theme-horizontal[class*="active-"] .pcoded-inner-navbar > li:hover > a,
.pcoded-navbar.theme-horizontal[class*="active-"] .pcoded-inner-navbar > li.pcoded-hasmenu.active > a,
.pcoded-navbar.theme-horizontal[class*="active-"] .pcoded-inner-navbar > li.pcoded-hasmenu.pcoded-trigger > a,
.pcoded-navbar.theme-horizontal[class*="active-"] .pcoded-inner-navbar > li.pcoded-hasmenu:hover > a,
.pcoded-navbar.theme-horizontal[class*="active-"] .pcoded-inner-navbar > li .pcoded-submenu > li.active > a,
.pcoded-navbar.theme-horizontal[class*="active-"] .pcoded-inner-navbar > li .pcoded-submenu > li.pcoded-trigger > a,
.pcoded-navbar.theme-horizontal[class*="active-"] .pcoded-inner-navbar > li .pcoded-submenu > li:hover > a {
  background: var(--overlay-white-10) !important;
  color: #fff !important;
}

/* keep destructive actions readable while honoring requested red status tones */
.badge-danger,
.alert-danger,
.btn-danger {
  background-color: var(--red-600) !important;
  border-color: var(--red-600) !important;
}

.btn-danger:hover,
.btn-danger:focus {
  background-color: var(--red-700) !important;
  border-color: var(--red-700) !important;
}

/* Common legacy blue/cyan hotspots */
.custom-select:focus,
.form-select:focus,
.form-control:focus,
.form-control.is-valid,
.form-control.is-valid:focus,
.was-validated .form-control:valid,
.was-validated .form-control:valid:focus {
  border-color: var(--brand-primary-600) !important;
  border-bottom-color: var(--brand-primary-600) !important;
  box-shadow: none !important;
}

.invalid-feedback,
.form-control.is-invalid,
.form-control.is-invalid:focus,
.was-validated .form-control:invalid,
.was-validated .form-control:invalid:focus {
  color: var(--red-600) !important;
  border-color: var(--red-600) !important;
}

.select2-container--default .select2-selection--multiple:active,
.select2-container--default .select2-selection--multiple:focus,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default .select2-results__option--highlighted[aria-selected] {
  border-color: var(--brand-primary-600) !important;
  background: var(--emerald-50) !important;
  color: var(--gray-900) !important;
}

.table thead th,
.table .thead-dark th,
.modal-header,
.dtp > .dtp-content > .dtp-date-view > header.dtp-header,
.dtp div.dtp-date,
.dtp div.dtp-time,
.dtp table.dtp-picker-days tr > td > a.selected,
.dtp .dtp-actual-meridien a.selected,
.fc button.fc-state-active,
.fc button.fc-state-down {
  background: var(--brand-primary-600) !important;
  border-color: var(--brand-primary-600) !important;
  color: #fff !important;
}

.table-dark td,
.table-dark th,
.table-dark thead th {
  border-color: var(--brand-primary-600) !important;
}

.form-group label span,
.form-group .form-label span,
.dataTables_wrapper .dt-buttons .btn,
.dtp .year-picker-item:hover,
.dtp .year-picker-item.active,
.pagination .page-link:hover,
.page-item.active .page-link,
.page-link:focus,
.nav-pills .nav-link.active,
.nav-tabs .nav-link.active,
.list-group-item.active,
.badge-info,
.alert-info,
.text-info,
.border-info {
  color: var(--brand-primary-600) !important;
  border-color: var(--brand-primary-600) !important;
}

.dataTables_wrapper .dt-buttons .btn:hover,
.dataTables_wrapper .dt-buttons .btn:focus,
.page-item.active .page-link,
.nav-pills .nav-link.active,
.list-group-item.active,
.badge-info,
.alert-info {
  background: var(--emerald-50) !important;
}

.fc th,
.fc hr,
.nav-tabs,
.page-link,
.badge-info,
.alert-info {
  border-color: var(--gray-300) !important;
}

/* Login backgrounds (admin + student auth pages) */
.auth-wrapper {
  background:
    radial-gradient(circle at 12% 18%, rgba(34, 197, 94, 0.2) 0%, rgba(34, 197, 94, 0) 44%),
    radial-gradient(circle at 88% 12%, rgba(22, 163, 74, 0.2) 0%, rgba(22, 163, 74, 0) 42%),
    linear-gradient(135deg, #ecfdf5 0%, #f8fafc 48%, #dcfce7 100%) !important;
}

.auth-wrapper .auth-bg .r:first-child {
  background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%) !important;
}

.auth-wrapper .auth-bg .r:last-child {
  background: linear-gradient(135deg, #166534 0%, #15803d 100%) !important;
}

.auth-wrapper .auth-bg .r.s:nth-child(2) {
  background: #22c55e !important;
}

.auth-wrapper .auth-bg .r.s:nth-child(3) {
  background: #16a34a !important;
}

.auth-wrapper .auth-icon:before {
  background: linear-gradient(135deg, #16a34a 0%, #22c55e 100%) !important;
  background-clip: text;
  text-fill-color: transparent;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
