/* DarooPol Dashboard Pro (Metronic/AdminLTE-inspired) */
:root{
  --dp-brand:#19ad8b;
  --dp-ocean:#1f7dff;
  --dp-ink:#0b1220;
  --dp-ink2:#111a2e;
  --dp-muted:#64748b;
  --dp-card:#ffffff;
  --dp-border: rgba(15,23,42,.10);
  --dp-shadow: 0 12px 30px rgba(2, 6, 23, .10);
  --dp-shadow2: 0 6px 18px rgba(2, 6, 23, .08);
  --dp-radius: 18px;
  --dp-radius-lg: 22px;
  --dp-grad: linear-gradient(135deg, var(--dp-ocean), var(--dp-brand));
}
[data-bs-theme="dark"]{
  --dp-card: rgba(17,26,46,.75);
  --dp-border: rgba(148,163,184,.14);
  --dp-shadow: 0 16px 34px rgba(0,0,0,.35);
  --dp-shadow2: 0 10px 22px rgba(0,0,0,.28);
}
body{
  background: radial-gradient(1200px 600px at 10% -10%, rgba(31,125,255,.18), transparent 55%),
              radial-gradient(900px 500px at 90% 0%, rgba(25,173,139,.18), transparent 60%),
              var(--bs-body-bg);
}

/* Layout */
.dp-app{
  min-height:100vh;
  display:flex;
  position: relative;
  z-index: 1;
}
.dp-sidebar{
  width: 280px;
  flex: 0 0 280px;
  background: linear-gradient(180deg, var(--dp-ink), var(--dp-ink2));
  color: rgba(255,255,255,.92);
  border-left: 1px solid rgba(255,255,255,.06);
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
}
.dp-sidebar .dp-brand{
  padding: 18px 18px 12px 18px;
  display:flex;
  align-items:center;
  gap:12px;
}
.dp-brand .dp-mark{
  width: 44px; height:44px;
  border-radius: 16px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
}
.dp-brand .dp-name{
  font-weight: 900;
  letter-spacing: .2px;
  font-size: 18px;
  line-height: 1.15;
}
.dp-brand .dp-slogan{
  font-size: 11px;
  color: rgba(255,255,255,.68);
  margin-top: 2px;
}
.dp-sidebar .dp-user{
  margin: 10px 14px 12px 14px;
  padding: 12px;
  border-radius: var(--dp-radius);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  display:flex;
  gap: 10px;
  align-items:center;
}
.dp-avatar{
  width: 44px; height:44px;
  border-radius: 16px;
  background: var(--dp-grad);
  display:flex; align-items:center; justify-content:center;
  font-weight: 900;
  color: #fff;
  box-shadow: 0 10px 20px rgba(0,0,0,.22);
}
.dp-user .dp-user-meta{ min-width:0; }
.dp-user .dp-user-meta .u1{ font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dp-user .dp-user-meta .u2{ font-size: 11px; color: rgba(255,255,255,.65); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Sidebar nav */
.dp-nav{
  padding: 6px 10px 16px 10px;
}
.dp-nav .nav-link{
  color: rgba(255,255,255,.78);
  border-radius: 14px;
  padding: 10px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  transition: all .15s ease;
  border: 1px solid transparent;
}
.dp-nav .nav-link .left{
  display:flex; align-items:center; gap: 10px;
  font-weight: 800;
  font-size: 14px;
}
.dp-nav .nav-link i{ opacity:.95; }
.dp-nav .nav-link:hover{
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.10);
  transform: translateY(-1px);
}
.dp-nav .nav-link.active{
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.16);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}
.dp-nav .nav-section{
  margin: 14px 10px 8px 10px;
  font-size: 11px;
  color: rgba(255,255,255,.55);
  letter-spacing: .6px;
}

/* Content */
.dp-main{
  flex: 1;
  min-width: 0;
}
.dp-topbar{
  position: sticky;
  top: 0;
  z-index: 1020;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--dp-border);
  background: rgba(255,255,255,.75);
}
[data-bs-theme="dark"] .dp-topbar{
  background: rgba(15,23,42,.55);
}
.dp-topbar .container-fluid{ padding: 0; }
.dp-search{
  max-width: 520px;
  min-width: 220px;
  flex: 1 1 320px;
  display:flex;
  align-items:center;
  gap:.5rem;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--dp-border);
  background: rgba(255,255,255,.70);
}
[data-bs-theme="dark"] .dp-search{ background: rgba(15,23,42,.50); }
.dp-search .form-control{ border: none; background: transparent; box-shadow:none; padding: 0; }
.dp-search .form-control:focus{ box-shadow:none; }
.dp-search i{ opacity:.75; }
.dp-surface{
  background: var(--dp-card);
  border: 1px solid var(--dp-border);
  box-shadow: var(--dp-shadow2);
  border-radius: var(--dp-radius-lg);
}
.dp-card{
  background: var(--dp-card);
  border: 1px solid var(--dp-border);
  border-radius: var(--dp-radius-lg);
  box-shadow: var(--dp-shadow2);
}
.dp-kpi{
  overflow:hidden;
  position: relative;
}
.dp-kpi:before{
  content:"";
  position:absolute;
  inset:-2px -2px auto auto;
  width: 180px; height: 180px;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.35), transparent 60%);
  opacity:.7;
  transform: translate(40px,-60px);
}
.dp-kpi .kpi-title{ color: rgba(255,255,255,.85); font-weight: 800; font-size: 12px; }
.dp-kpi .kpi-value{ font-weight: 900; font-size: 40px; line-height:1; }
.dp-kpi .kpi-sub{ color: rgba(255,255,255,.78); font-size: 12px; }
.dp-chip{
  border-radius: 999px;
  padding: .35rem .7rem;
  font-weight: 800;
  font-size: 12px;
}
.dp-table thead th{ font-weight: 900; color: var(--dp-muted); }
.dp-table tbody tr:hover{ background: rgba(100,116,139,.06); }

/* Buttons */
.btn-dp{
  background: var(--dp-grad);
  border: none;
  color: #fff;
  font-weight: 900;
  border-radius: 14px;
  box-shadow: var(--dp-shadow2);
}
.btn-dp:hover{ filter: brightness(.98); transform: translateY(-1px); }
.btn-soft{
  border-radius: 14px;
  font-weight: 900;
}
.dp-icon-btn{
  width: 42px; height: 42px;
  border-radius: 14px;
  display:flex; align-items:center; justify-content:center;
}
.dp-divider{
  height: 1px;
  background: var(--dp-border);
}

/* Utilities */
.fw-black{ font-weight: 900 !important; }
.rounded-4{ border-radius: 18px !important; }
.rounded-5{ border-radius: 22px !important; }

/* Responsive */
@media (max-width: 991.98px){
  .dp-sidebar{ display:none; }
}


/* Extra components */
.dp-dropdown{border-radius:18px;box-shadow:var(--dp-shadow2);border:1px solid var(--dp-border);background:var(--dp-card);}
.dp-mini-avatar{width:26px;height:26px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--dp-grad);color:#fff;font-weight:900;}
.dp-dot{width:10px;height:10px;border-radius:999px;flex:0 0 10px;margin-top:6px;}


/* Mobile tweaks */
@media (max-width: 991.98px){
  .dp-app{ padding: 0 !important; }
  .dp-content{ padding: 1rem !important; }
  .dp-card{ border-radius: 1.25rem !important; }
  .dp-topbar{ position: sticky; top: 0; z-index: 1020; backdrop-filter: blur(10px); }
  .dp-sidebar{ box-shadow: 0 10px 40px rgba(0,0,0,.12); }
  .table-responsive{ border-radius: 1.25rem; }
}
@media (max-width: 575.98px){
  .dp-content{ padding: .85rem !important; }
  .fw-black.fs-2{ font-size: 1.6rem !important; }
  .btn{ border-radius: 1.1rem !important; }
}


/* --- Preloader (Capsule 3D) --- */
.dp-preloader{
  position: fixed;
  inset: 0;
  display: grid;
  place-items: center;
  background: radial-gradient(1200px 600px at 10% -10%, rgba(31,125,255,.30), transparent 55%),
              radial-gradient(900px 500px at 90% 0%, rgba(25,173,139,.24), transparent 60%),
              linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.78));
  z-index: 9999;
  transition: opacity .35s ease, visibility .35s ease;
  /* CSS-only safety net: if JS fails to run, the preloader will still disappear. */
  animation: dpPreloaderAutoHide 0s linear 6s forwards;
}
[data-bs-theme="dark"] .dp-preloader{
  background: radial-gradient(1200px 600px at 10% -10%, rgba(31,125,255,.22), transparent 55%),
              radial-gradient(900px 500px at 90% 0%, rgba(25,173,139,.20), transparent 60%),
              linear-gradient(180deg, rgba(8,12,22,.92), rgba(8,12,22,.78));
}
.dp-preloader.is-hidden{ opacity: 0; visibility: hidden; pointer-events: none; }
.dp-preloader-inner{ text-align:center; }
.dp-capsule3d{
  width: 86px; height: 86px;
  margin: 0 auto;
  position: relative;
  transform-style: preserve-3d;
  animation: dpSpin 1.5s linear infinite;
  filter: drop-shadow(0 18px 28px rgba(2,6,23,.18));
}
.dp-capsule3d .cap{
  position:absolute; inset: 10px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(31,125,255,.95), rgba(25,173,139,.92));
  transform: translateZ(12px);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.35);
}
.dp-capsule3d .cap-b{
  inset: 18px 10px 10px 18px;
  background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(240,248,255,.75));
  transform: translateZ(0);
}
.dp-capsule3d .cap-c{
  inset: 10px 18px 18px 10px;
  background: linear-gradient(135deg, rgba(255,255,255,.65), rgba(255,255,255,.15));
  transform: translateZ(18px);
  mix-blend-mode: overlay;
}
@keyframes dpSpin{
  from{ transform: rotateX(18deg) rotateY(0deg); }
  to{ transform: rotateX(18deg) rotateY(360deg); }
}

@keyframes dpPreloaderAutoHide{
  to{ opacity: 0; visibility: hidden; pointer-events: none; }
}

@keyframes dpPreloaderAutoHide{
  to{ opacity: 0; visibility: hidden; pointer-events: none; }
}

/* --- Background orbs / medical vibe --- */
.dp-bg-orbs{
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(520px 240px at 12% 12%, rgba(31,125,255,.18), transparent 60%),
    radial-gradient(480px 240px at 88% 18%, rgba(25,173,139,.16), transparent 60%),
    radial-gradient(640px 360px at 60% 92%, rgba(31,125,255,.10), transparent 60%);
  filter: blur(0px);
  opacity: .85;
}

/* --- 3D Tilt cards + pill motif --- */
.dp-tilt{
  transform-style: preserve-3d;
  will-change: transform;
  transition: transform .2s ease, box-shadow .2s ease;
}
.dp-tilt::after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius: var(--dp-radius);
  background: radial-gradient(280px 140px at 20% 10%, rgba(31,125,255,.18), transparent 60%),
              radial-gradient(240px 120px at 90% 20%, rgba(25,173,139,.18), transparent 60%);
  opacity: 0;
  transition: opacity .25s ease;
  pointer-events:none;
}
.dp-tilt:hover::after{ opacity: 1; }
.dp-tilt:hover{ box-shadow: 0 18px 46px rgba(2,6,23,.14); }

.dp-pill-float{
  position:absolute;
  width: 140px; height: 72px;
  border-radius: 999px;
  right: -40px;
  top: -18px;
  background: linear-gradient(135deg, rgba(31,125,255,.16), rgba(25,173,139,.14));
  transform: rotate(-18deg);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.22);
  opacity: .9;
}
[data-bs-theme="dark"] .dp-pill-float{
  box-shadow: inset 0 0 0 1px rgba(148,163,184,.18);
}

/* Glassmorphism helper */
.dp-glass{
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

/* Topbar layout fix (overlap) */
.dp-topbar{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:.75rem; padding: 12px 18px; }
.dp-search{ max-width: 520px; min-width: 220px; flex: 1 1 320px; }
.dp-search .form-control{ width: 100%; }

.dp-public{ position: relative; z-index: 1; }


/* --- AOS safety: never hide content if AOS isn't initialized --- */
html:not(.dp-aos-on) [data-aos]{
  opacity: 1 !important;
  transform: none !important;
}

/* Topbar / dropdown visibility fixes */
.dp-topbar{ overflow: visible; }
.dropdown-menu{ z-index: 2000; }

/* DataTables RTL + filter layout tidy */
.dataTables_wrapper .dataTables_filter label{
  display: inline-flex;
  gap: .5rem;
  align-items: center;
  flex-wrap: wrap;
}
.dataTables_wrapper .dataTables_filter input{
  margin: 0 !important;
}

.dp-search{ position:relative; display:flex; align-items:center; gap:.5rem; }
.dp-search i{ opacity:.7; }


/* Hover micro-interactions */
.dp-hover{ transition: transform .18s ease, box-shadow .18s ease, filter .18s ease; }
.dp-hover:hover{ transform: translateY(-2px); box-shadow: var(--dp-shadow3); filter: saturate(1.02); }

/* Ensure dropdowns over glass/blur */
.dp-topbar .dropdown-menu{ z-index: 1055; }