:root{
  --tone-bg:#f6f7fb;
  --tone-card:#fff;
  --tone-muted:#6c757d;
  --tone-border:#e8e9ee;
  --tone-shadow:0 8px 20px rgba(0,0,0,.06);
  --tone-radius:16px;
}

body{background:var(--tone-bg);}
.card-ghost{
  background:var(--tone-card);
  border:1px solid var(--tone-border);
  border-radius:var(--tone-radius);
  box-shadow:var(--tone-shadow);
}
.toolbar .form-control{border-radius:999px;}
.toolbar .btn{border-radius:999px;}
.badge-soft{
  background: #eef2ff; color:#3f51b5; border:1px solid #dfe4ff;
}
.table-dense tbody tr>td{padding:.55rem .75rem; vertical-align: middle;}
.course-url{max-width: 340px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.kebab{border-radius: 12px;}
.card-course{transition: transform .12s ease, box-shadow .12s ease;}
.card-course:hover{transform: translateY(-2px); box-shadow:0 12px 26px rgba(0,0,0,.08);}
.form-floating>label{opacity:.7;}
/* Modo oscuro suave si el usuario lo tiene */
.course-card {
      transition: transform 0.2s;
}
.course-card:hover {
  transform: translateY(-5px);
  box-shadow: 0px 6px 15px rgba(0,0,0,0.1);
}
.calendar-box {
  background: #fff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 3px 10px rgba(0,0,0,0.1);
}
.course-catalog .catalog-card{
  background: var(--tone-card);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--tone-shadow);
}
.course-cover{
  height: 180px;
  overflow: hidden;
  background: #0e1320;
}
.course-cover img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.02);
}
.course-title{
  background: linear-gradient(135deg, rgba(13,110,253,.15), rgba(111,66,193,.15));
  border-radius: 12px;
  padding: .6rem .75rem;
}
.toolbar .form-control,
.toolbar .btn,
.toolbar .form-select{
  min-height: 38px;
}
@media (max-width: 768px){
  .toolbar{
    width: 100%;
  }
  .toolbar .form-control,
  .toolbar .form-select,
  .toolbar .btn{
    width: 100%;
  }
}
@media (max-width: 576px){
  .course-cover{ height: 200px; }
}

@media (prefers-color-scheme: dark){
  :root{
    --tone-bg:#111316; --tone-card:#161a1f;
    --tone-muted:#98a2af; --tone-border:#232832;
  }
  .badge-soft{background:#1e2532;color:#9fb4ff;border-color:#293142;}
}
