/* V50 - Nhóm học phần tự chọn trong từng học kỳ */
.v50-elective-editor{margin:0 0 28px;padding:18px;border:1px solid #d7e3ed;border-radius:16px;background:#fbfdff}
.v50-elective-editor-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:16px}
.v50-elective-editor-head strong{display:block;color:#173f5e;font-size:17px}
.v50-elective-editor-head p{margin:5px 0 0;color:#667e91;line-height:1.55}
.v50-elective-editor-head>span{white-space:nowrap;padding:6px 10px;border-radius:999px;background:#edf4f8;color:#38617d;font-size:12px;font-weight:700}
.v50-semester-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin-bottom:18px}
.v50-semester-setup{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px;border:1px solid #dbe6ee;border-radius:12px;background:#fff}
.v50-semester-setup.active{border-color:#7da6be;background:#f3f8fb}.v50-semester-setup.disabled{opacity:.65}
.v50-semester-setup strong,.v50-semester-setup small{display:block}.v50-semester-setup small{margin-top:3px;color:#74899a}
.v50-configured{font-size:12px;font-weight:700;color:#2d6f5d;background:#e9f5f0;border-radius:999px;padding:5px 9px;white-space:nowrap}
.v50-elective-config{margin-top:18px;padding:16px;border:1px solid #cddde8;border-radius:15px;background:#fff}
.v50-elective-config-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding-bottom:12px;border-bottom:1px solid #e5edf3}
.v50-elective-config-head h3{margin:0;color:#173f5e}.v50-elective-config-head p{margin:5px 0 0;color:#6b8193}
.v50-elective-sets{display:grid;gap:14px;margin-top:14px}
.v50-elective-set-card{padding:14px;border:1px solid #dce6ed;border-radius:13px;background:#f9fbfd}
.v50-elective-set-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.v50-elective-set-head strong{color:#214d6b}.v50-elective-set-head small{display:block;margin-top:3px;color:#71879a}
.v50-elective-set-fields{display:grid;grid-template-columns:1fr 1fr 220px;gap:12px}
.v50-elective-course-list{margin-top:10px}.v50-add-set{margin-top:14px}
.v50-public-elective-set{margin-top:14px;border:1px solid #d7e3ec;border-radius:12px;overflow:hidden;background:#fff}
.v50-public-elective-title{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:12px 18px;background:#f3f7fa;border-bottom:1px solid #dfe9f0}
.v50-public-elective-title strong{font-size:16px;font-style:italic;color:#173f5e}
.v50-public-elective-title span{font-size:13px;color:#5f7890;white-space:nowrap}
.v50-elective-semester>.course-table{margin-bottom:10px}
@media(max-width:850px){.v50-elective-set-fields{grid-template-columns:1fr}.v50-elective-editor-head,.v50-elective-config-head,.v50-public-elective-title{flex-direction:column;align-items:stretch}.v50-public-elective-title span{white-space:normal}}


/* V51 - Cải thiện bố cục khối thiết lập nhóm tự chọn theo học kỳ */
.v50-semester-grid{
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:14px;
  align-items:stretch;
}
.v50-semester-setup{
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  min-height:148px;
  padding:16px 16px 14px;
  border-radius:16px;
  box-shadow:0 4px 14px rgba(16,39,61,.04);
}
.v50-semester-setup > div{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}
.v50-semester-setup strong{
  display:block;
  font-size:28px;
  line-height:1.1;
  color:#173f5e;
  margin-bottom:8px;
}
.v50-semester-setup small{
  display:block;
  margin-top:0;
  color:#6d8294;
  line-height:1.55;
  font-size:15px;
}
.v50-semester-setup .outline-button{
  width:100%;
  justify-content:center;
  margin-top:auto;
  min-height:46px;
  border-radius:12px;
}
.v50-semester-setup .v50-configured,
.v50-semester-setup > small{
  align-self:flex-start;
  margin-top:auto;
}
.v50-semester-setup.active{
  border-color:#6c98b3;
  background:linear-gradient(180deg,#f6fbff 0%,#ffffff 100%);
}
.v50-semester-setup.disabled{
  background:#f8fafc;
}
@media(max-width:1200px){
  .v50-semester-grid{grid-template-columns:repeat(3,minmax(240px,1fr));}
}
@media(max-width:900px){
  .v50-semester-grid{grid-template-columns:repeat(2,minmax(240px,1fr));}
}
@media(max-width:640px){
  .v50-semester-grid{grid-template-columns:1fr;}
  .v50-semester-setup strong{font-size:24px;}
}

/* V52 - Card nhỏ + icon + màu trạng thái */
.v50-semester-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-bottom:20px;
}
.v50-semester-setup{
  position:relative;
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  grid-template-rows:auto auto;
  column-gap:12px;
  row-gap:8px;
  min-height:118px;
  padding:14px;
  border:1px solid #dbe6ee;
  border-radius:14px;
  background:#fff;
  box-shadow:0 4px 14px rgba(16,39,61,.045);
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,background .18s ease;
}
.v50-semester-setup:hover{
  border-color:#a8c3d5;
  box-shadow:0 8px 22px rgba(16,39,61,.08);
  transform:translateY(-1px);
}
.v50-semester-setup::before{
  content:"▤";
  grid-column:1;
  grid-row:1 / span 2;
  width:42px;
  height:42px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#edf5fb;
  color:#2c6a97;
  font-size:20px;
  font-weight:800;
  line-height:1;
  box-shadow:inset 0 0 0 1px #dceaf4;
}
.v50-semester-setup > div{
  grid-column:2;
  display:block;
  min-width:0;
}
.v50-semester-setup strong{
  display:block;
  margin:0 0 5px;
  font-size:18px;
  line-height:1.25;
  color:#173f5e;
  white-space:nowrap;
}
.v50-semester-setup small{
  display:block;
  margin:0;
  color:#70869a;
  font-size:13px;
  line-height:1.4;
}
.v50-semester-setup .outline-button{
  grid-column:2;
  width:100%;
  min-height:36px;
  margin:0;
  padding:7px 10px;
  border-radius:10px;
  font-size:13px;
  line-height:1.2;
  justify-content:center;
  background:#fff;
}
.v50-semester-setup .v50-configured,
.v50-semester-setup > small{
  grid-column:2;
  align-self:end;
  justify-self:start;
  margin:0;
}

/* Đã cấu hình nhóm tự chọn */
.v50-semester-setup.active{
  border-color:#b7dcc8;
  background:linear-gradient(180deg,#f7fcf9 0%,#ffffff 100%);
}
.v50-semester-setup.active::before{
  content:"✓";
  background:#e9f7ef;
  color:#287052;
  box-shadow:inset 0 0 0 1px #cde9da;
}
.v50-semester-setup.active:hover{border-color:#8fc8aa}
.v50-configured{
  padding:5px 9px;
  border-radius:999px;
  background:#e7f5ed;
  color:#28694f;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}

/* Học kỳ đang dùng nhóm định hướng nên không tạo nhóm tự chọn */
.v50-semester-setup.disabled{
  opacity:1;
  border-color:#ead7a5;
  background:linear-gradient(180deg,#fffaf0 0%,#fff 100%);
}
.v50-semester-setup.disabled::before{
  content:"!";
  background:#fff3d8;
  color:#9b6a12;
  box-shadow:inset 0 0 0 1px #f0dfb5;
}
.v50-semester-setup.disabled > small{
  display:inline-flex;
  align-items:center;
  width:auto;
  padding:5px 9px;
  border-radius:999px;
  background:#fff1d2;
  color:#896016;
  font-size:12px;
  font-weight:700;
}

/* Header trạng thái gọn hơn */
.v50-elective-editor-head>span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:6px 10px;
  border-radius:999px;
  background:#eef5fa;
  color:#315f7d;
  font-size:12px;
  font-weight:800;
}

@media(max-width:1200px){
  .v50-semester-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media(max-width:900px){
  .v50-semester-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:640px){
  .v50-semester-grid{grid-template-columns:1fr;}
  .v50-semester-setup{min-height:108px;}
  .v50-semester-setup strong{font-size:17px;}
}