:root {
  --rebuild-bg: #eef2f8;
  --rebuild-bg-strong: #e5ebf5;
  --rebuild-surface: rgba(255, 255, 255, 0.88);
  --rebuild-surface-strong: #ffffff;
  --rebuild-border: rgba(26, 54, 93, 0.12);
  --rebuild-text: #10233d;
  --rebuild-muted: #5e708a;
  --rebuild-primary: #13795b;
  --rebuild-primary-strong: #0f5f47;
  --rebuild-accent: #0f4c81;
  --rebuild-shadow: 0 18px 40px rgba(10, 25, 47, 0.08);
}

html {
  background:
    radial-gradient(1200px 700px at 10% -10%, rgba(19, 121, 91, 0.12), transparent 52%),
    radial-gradient(900px 560px at 92% 0%, rgba(15, 76, 129, 0.12), transparent 46%),
    linear-gradient(180deg, var(--rebuild-bg), #f9fbff 42%, #f4f7fb 100%);
}

body {
  color: var(--rebuild-text);
  font-family: "Inter", "Segoe UI", "Apple SD Gothic Neo", sans-serif;
  letter-spacing: -0.01em;
}

a {
  color: var(--rebuild-accent);
}

.btn,
.form-control,
.form-select,
.card,
.modal-content,
.dropdown-menu,
.nav-pills .nav-link,
.sidebar,
.top-header,
.admin-menu-bar,
.auth-card,
.helpdesk-modal-card,
.view,
.card {
  border-color: var(--rebuild-border);
}

.btn,
.form-control,
.form-select,
.nav-pills .nav-link {
  border-radius: 14px;
}

.btn-primary,
.btn.primary,
.btn.btn-primary {
  background: linear-gradient(135deg, var(--rebuild-primary), var(--rebuild-primary-strong));
  border-color: transparent;
  box-shadow: 0 10px 20px rgba(19, 121, 91, 0.22);
}

.btn-primary:hover,
.btn.primary:hover,
.btn.btn-primary:hover {
  background: linear-gradient(135deg, var(--rebuild-primary-strong), #0d4f3c);
}

.card,
.view,
.helpdesk-modal-card,
.auth-card,
.admin-menu-bar,
.sidebar,
.top-header,
.topbar,
.page-wrapper {
  box-shadow: var(--rebuild-shadow);
}

.card,
.view {
  background: var(--rebuild-surface);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.sidebar,
.admin-menu-bar {
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.sidebar-brand strong,
.topbar h1,
.topbar-title h1,
.card-title,
.auth-panel h1 {
  letter-spacing: -0.03em;
}

.sidebar-brand small,
.topbar-title span,
.text-muted,
.muted,
.auth-copy,
.helpdesk-modal-desc {
  color: var(--rebuild-muted) !important;
}

.sidebar .nav-item,
.nav-item {
  border-radius: 12px;
}

.sidebar .nav-item.active,
.nav-item.active,
.nav-pills .nav-link.active {
  background: linear-gradient(135deg, rgba(19, 121, 91, 0.14), rgba(15, 76, 129, 0.14));
  color: var(--rebuild-text);
  box-shadow: inset 0 0 0 1px rgba(19, 121, 91, 0.16);
}

.page.page-admin,
body.layout-fluid.user-tabler,
body.layout-fluid.user-v2 {
  min-height: 100vh;
  background: transparent;
}

body.layout-fluid.user-tabler .auth-wrap {
  background:
    radial-gradient(1200px 700px at 15% -10%, rgba(19, 121, 91, 0.18), transparent 46%),
    radial-gradient(900px 560px at 85% 5%, rgba(15, 76, 129, 0.16), transparent 40%),
    linear-gradient(180deg, transparent 0%, rgba(255, 255, 255, 0.5) 100%);
}

body.layout-fluid.user-tabler .auth-card {
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid var(--rebuild-border);
}

body.layout-fluid.user-tabler .auth-panel h1 {
  color: var(--rebuild-text);
}

body.layout-fluid.user-tabler .auth-panel .btn.primary {
  min-width: 124px;
}

body.layout-fluid.user-tabler .welcome-card {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(245, 250, 255, 0.9)),
    radial-gradient(1200px 500px at 0% 0%, rgba(19, 121, 91, 0.08), transparent 42%);
}

body.layout-fluid.user-tabler .stat-card {
  background: rgba(255, 255, 255, 0.85);
}

body.layout-fluid.user-tabler .sidebar {
  border-right: 1px solid var(--rebuild-border);
}

body.layout-fluid.user-tabler .main-content {
  background: transparent;
}

body.layout-fluid.user-v2 .navbar {
  background: rgba(255, 255, 255, 0.84);
  border-bottom: 1px solid var(--rebuild-border);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

body.layout-fluid.user-v2 .page-wrapper {
  padding-top: 1.25rem;
}

body.layout-fluid.user-v2 .section-stack {
  display: grid;
  gap: 1rem;
}

body.layout-fluid.admin-v2 {
  overflow-x: hidden;
}

body.layout-fluid.admin-v2 .helpdesk-row {
  cursor: pointer;
}

body.layout-fluid.admin-v2 .helpdesk-row:hover {
  background: rgba(19, 121, 91, 0.05);
}

body.layout-fluid.admin-v2 .helpdesk-admin-drawer {
  position: fixed;
  inset: 0;
  z-index: 1200;
}

body.layout-fluid.admin-v2 .helpdesk-drawer-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(10, 20, 36, 0.34);
}

body.layout-fluid.admin-v2 .helpdesk-admin-drawer-panel {
  position: absolute;
  top: 0;
  right: 0;
  width: min(520px, 100%);
  height: 100%;
  padding: 1rem;
}

body.layout-fluid.admin-v2 .helpdesk-admin-drawer-panel .card {
  height: 100%;
  border-radius: 22px 0 0 22px;
  overflow: auto;
}

body.layout-fluid.admin-v2 .record-modal {
  position: fixed;
  inset: 0;
  z-index: 1300;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

body.layout-fluid.admin-v2 .record-modal.open {
  display: flex;
}

body.layout-fluid.admin-v2 .record-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(10, 20, 36, 0.38);
  backdrop-filter: blur(6px);
}

body.layout-fluid.admin-v2 .record-modal-dialog {
  position: relative;
  width: min(1100px, 100%);
  max-height: calc(100vh - 2rem);
  z-index: 1;
}

body.layout-fluid.admin-v2 .record-modal-dialog .modal-content {
  max-height: calc(100vh - 2rem);
  overflow: auto;
  border-radius: 24px;
}

body.layout-fluid.admin-v2 .record-fields {
  display: none;
}

body.layout-fluid.admin-v2 .record-fields.hidden {
  display: none;
}

body.layout-fluid.admin-v2 .record-fields.open {
  display: block;
}

body.layout-fluid.user-tabler .top-header,
body.layout-fluid.user-tabler .card,
body.layout-fluid.user-tabler .helpdesk-modal-card {
  background: rgba(255, 255, 255, 0.88);
}

body.layout-fluid.user-tabler .nav-menu .nav-item:hover,
.sidebar .nav-item:hover,
.nav-item:hover {
  background: rgba(15, 76, 129, 0.08);
}

body.layout-fluid.user-tabler .welcome-actions .btn,
body.layout-fluid.user-tabler .chip,
body.layout-fluid.user-tabler .helpdesk-quick-btn,
body.layout-fluid.user-tabler .handover-card-btn {
  box-shadow: none;
}

.dashboard-grid,
.dashboard-kpi-grid,
.helpdesk-quick-actions,
.handover-grid {
  gap: 16px;
}

.table,
.table thead th,
.table tbody td {
  border-color: rgba(26, 54, 93, 0.08) !important;
}

.table thead th {
  background: rgba(245, 248, 252, 0.92);
  color: var(--rebuild-muted);
  font-weight: 600;
}

.table tbody tr:hover {
  background: rgba(19, 121, 91, 0.045);
}

@media (max-width: 1024px) {
  .sidebar,
  .admin-menu-bar {
    box-shadow: none;
  }

  body.layout-fluid.user-tabler .auth-card {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .card,
  .view,
  .auth-card,
  .helpdesk-modal-card {
    border-radius: 18px;
  }

  .btn,
  .form-control,
  .form-select,
  .nav-pills .nav-link {
    border-radius: 12px;
  }
}