:root{
  --hr-primary:#0d6efd;
  --hr-primary-600:#0b5ed7;
  --hr-primary-700:#0a58ca;
  --hr-bg:#f5f9ff;
  --hr-card:#ffffff;
  --hr-border:#d7e6ff;
  --hr-text:#0f172a;
  --hr-muted:#5b6b84;
}

html[data-theme="dark"]{
  --hr-bg:#0b1220;
  --hr-card:#0f1a2e;
  --hr-border:#1f335a;
  --hr-text:#e7eefc;
  --hr-muted:#a9b9d6;
}

html,body{height:100%;}
body{
  background:var(--hr-bg);
  color:var(--hr-text);
}

body{overflow-x:hidden;}

/* Subtle background accent */
body:before{
  content:"";
  position:fixed;
  inset:-200px;
  background:radial-gradient(closest-side at 20% 10%, rgba(13,110,253,.16), rgba(13,110,253,0)),
             radial-gradient(closest-side at 80% 0%, rgba(13,110,253,.10), rgba(13,110,253,0));
  pointer-events:none;
  z-index:-1;
}

a{color:var(--hr-primary-700);}
a:hover{color:var(--hr-primary);}

html[data-theme="dark"] a{color:#cfe0ff;}
html[data-theme="dark"] a:hover{color:#ffffff;}

/* Navbar */
.hr-navbar{
  background:linear-gradient(90deg,var(--hr-primary-700),var(--hr-primary));
  box-shadow:0 10px 30px rgba(13,110,253,.18);
}
.hr-navbar .navbar-brand,
.hr-navbar .nav-link,
.hr-navbar .btn.btn-link.nav-link{
  color:#fff !important;
}
.hr-navbar .nav-link{opacity:.92; border-radius:.6rem; padding:.5rem .75rem; margin:.1rem .15rem;}
.hr-navbar .nav-link:hover{opacity:1; background:rgba(255,255,255,.14);}
.hr-navbar .nav-link.active{opacity:1; background:rgba(255,255,255,.22);}
.hr-navbar .btn.btn-link.nav-link{ text-decoration:none; }

.hr-navbar .btn-outline-light{
  border-radius:.75rem;
  border-color:rgba(255,255,255,.55);
  color:#fff;
}
.hr-navbar .btn-outline-light:hover{
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.8);
}

.hr-navbar .navbar-toggler{border-color:rgba(255,255,255,.55);}
.hr-navbar .navbar-toggler:focus{box-shadow:0 0 0 .2rem rgba(255,255,255,.25);}
.hr-navbar .navbar-toggler-icon{filter:invert(1);}

/* Containers / cards */
.container{max-width:1200px;}
.card{
  background:var(--hr-card);
  border:1px solid rgba(13,110,253,.12);
  border-radius:1rem;
  box-shadow:0 12px 30px rgba(15,23,42,.06);
}

html[data-theme="dark"] .card{
  border-color:rgba(13,110,253,.22);
  box-shadow:0 12px 30px rgba(0,0,0,.35);
}

.card .fs-3{
  font-size:2.15rem !important;
  font-weight:700;
  color:var(--hr-primary-700);
  letter-spacing:-.02em;
}

html[data-theme="dark"] .card .fs-3{color:#cfe0ff;}

.card .card-body{padding:1.1rem 1.15rem;}

.dashboard-card{
  display:block;
  color:inherit;
  text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease;
}
.dashboard-card:hover{
  transform:translateY(-2px);
}

.dashboard-card .card{
  border-left:5px solid rgba(13,110,253,.65);
}

/* Typography */
.text-muted{color:var(--hr-muted) !important;}

/* Buttons */
.btn{border-radius:.75rem;}
.btn-primary{
  background:var(--hr-primary);
  border-color:var(--hr-primary);
  box-shadow:0 8px 18px rgba(13,110,253,.18);
}
.btn-primary:hover{
  background:var(--hr-primary-600);
  border-color:var(--hr-primary-600);
}
.btn-success,.btn-danger{
  border-radius:.75rem;
  background:var(--hr-primary);
  border-color:var(--hr-primary);
  color:#fff;
}
.btn-success:hover,.btn-danger:hover{
  background:var(--hr-primary-600);
  border-color:var(--hr-primary-600);
}
.btn-outline-primary{
  color:var(--hr-primary);
  border-color:rgba(13,110,253,.45);
}
.btn-outline-primary:hover{
  background:rgba(13,110,253,.10);
  border-color:rgba(13,110,253,.65);
  color:var(--hr-primary-700);
}

/* Treat outline-secondary as a blue themed secondary action across the app */
.btn-outline-secondary{
  color:var(--hr-primary);
  border-color:rgba(13,110,253,.35);
}
.btn-outline-secondary:hover{
  background:rgba(13,110,253,.08);
  border-color:rgba(13,110,253,.55);
  color:var(--hr-primary-700);
}

/* Map outline success/danger to blue outline for a consistent brand look */
.btn-outline-success,
.btn-outline-danger{
  color:var(--hr-primary);
  border-color:rgba(13,110,253,.35);
}
.btn-outline-success:hover,
.btn-outline-danger:hover{
  background:rgba(13,110,253,.08);
  border-color:rgba(13,110,253,.55);
  color:var(--hr-primary-700);
}

/* Forms */
.form-control,.form-select{
  border-radius:.75rem;
  border-color:rgba(13,110,253,.20);
}
.form-control:focus,.form-select:focus{
  border-color:rgba(13,110,253,.7);
  box-shadow:0 0 0 .2rem rgba(13,110,253,.18);
}

/* Tables */
.table{background:var(--hr-card); border-radius:1rem; overflow:hidden;}
.table thead th,
.table thead td{
  background:transparent;
  color:inherit;
  border-color:inherit;
}
.table>:not(caption)>*>*{border-color:rgba(13,110,253,.12);}
.table-striped>tbody>tr:nth-of-type(odd)>
*{ --bs-table-bg-type: rgba(13,110,253,.03); }
.table tbody tr:hover>*{ background:rgba(13,110,253,.06); }

html[data-theme="dark"] .table-striped>tbody>tr:nth-of-type(odd)>
*{ --bs-table-bg-type: rgba(255,255,255,.03); }
html[data-theme="dark"] .table tbody tr:hover>*{ background:rgba(255,255,255,.06); }

html[data-theme="dark"] .table{
  color:var(--hr-text);
}

/* Alerts */
.alert{border-radius:1rem;}

/* Badges */
.badge{border-radius:999px;}

@media (max-width: 767.98px){
  .container{padding-left:12px; padding-right:12px;}

  .hr-navbar .nav-link{display:block; padding:.7rem .9rem; margin:.15rem 0;}

  .card .card-body{padding:0.95rem 1rem;}

  .btn{min-height:44px;}
  .btn.btn-sm{min-height:40px;}

  form.row.g-2 > [class*="col-"]{width:100%;}
  form.row.g-2 .btn{width:100%;}
  form.row.g-2 .btn + .btn{margin-top:.5rem;}

  .table-responsive{border-radius:1rem;}
  .table>:not(caption)>*>*{padding:.55rem .6rem;}
}

@media (min-width: 768px) and (max-width: 1024px){
  .container{max-width:980px;}
}