:root {
  --glass-bg: rgba(255, 255, 255, 0.7);
  --glass-border: rgba(255, 255, 255, 0.8);
  --glass-shadow: 0 8px 32px 0 rgba(15, 23, 42, 0.1);
  --glass-blur: blur(12px);
  --gradient-bg: #F8FAFC;
}

body {
  background: var(--gradient-bg) !important;
  background-attachment: fixed !important;
  color: #0F172A;
  min-height: 100vh;
}

/* Glass Navbar */
.navbar {
  background: rgba(255, 255, 255, 0.3) !important;
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border-bottom: 1px solid var(--glass-border) !important;
  box-shadow: var(--glass-shadow);
}

/* Glass Cards & Tiles */
.card, .login-card, .dashboard-tile {
  background: var(--glass-bg) !important;
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border: 1px solid var(--glass-border) !important;
  box-shadow: var(--glass-shadow) !important;
  border-radius: 16px;
  overflow: hidden;
}

/* Modals should match main app background and not be transparent (to avoid dark backdrop bleeding through) */
.modal-content {
  background: var(--gradient-bg) !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: var(--glass-shadow) !important;
  border-radius: 16px;
  overflow: hidden;
}

/* Dashboard tile specific adjustments */
.dashboard-tile {
  transition: all 0.3s ease;
  border-left-width: 1px !important; /* Overriding bootstrap border-start */
}
.dashboard-tile:hover {
  transform: translateY(-10px);
  background: rgba(255, 255, 255, 0.65) !important;
  box-shadow: 0 15px 35px 0 rgba(31, 38, 135, 0.25) !important;
}

/* 3D Colorful Icons */
.icon-3d {
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  filter: drop-shadow(3px 5px 4px rgba(0,0,0,0.25));
  transform: perspective(200px) translateZ(15px);
  transition: transform 0.3s ease;
  display: inline-block;
}
.dashboard-tile:hover .icon-3d {
  transform: perspective(200px) translateZ(30px) scale(1.15);
}

/* Gradients for specific icons */
.icon-3d.warning { background: #F59E0B; }
.icon-3d.secondary { background: #64748B; }
.icon-3d.info { background: #38BDF8; }
.icon-3d.primary { background: #2563EB; }
.icon-3d.success { background: #10B981; }
.icon-3d.dark { background: #0F172A; }

/* Modals */
.modal-content {
    background: rgba(255, 255, 255, 0.8) !important;
}
.modal-header {
    border-bottom: 1px solid rgba(0,0,0,0.05);
}

/* Tables */
.table {
    background-color: transparent !important;
    --bs-table-bg: transparent;
}
.table tbody tr {
    background-color: rgba(255,255,255, 0.4) !important;
    transition: background-color 0.2s;
}
.table tbody tr:hover {
    background-color: rgba(255,255,255, 0.7) !important;
}

/* Buttons */
.btn {
    border-radius: 8px;
    backdrop-filter: blur(4px);
}