/* =========================================================
   HÌNH ẢNH Y HỌC V7.1.0 — Visual polish + course editing
   Focus: image clarity, Vietnamese typography, alignment,
   stronger sidebar readability, and Admin course editing UI.
   ========================================================= */

:root{
  --v71-font:"Segoe UI Variable","Segoe UI",Arial,sans-serif;
}

html,body,button,input,select,textarea{font-family:var(--v71-font)!important}
body{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}

/* ---------- Robust Vietnamese typography ---------- */
.v70-hero h1,
.v70-section-heading h2,
.v70-experience-copy h2,
.v70-progress-panel h2,
.v70-library-preview h2,
.v70-dashboard-copy h1,
.v70-home-heading h1,
.v70-home-heading h2,
.page-heading h1,
.v46-subject-hero h1{
  font-family:var(--v71-font)!important;
  font-kerning:normal;
  font-variant-ligatures:normal;
  letter-spacing:-.045em!important;
  word-spacing:normal;
  overflow-wrap:normal;
  text-wrap:balance;
}
.v70-hero h1{font-weight:820!important;line-height:1.04!important}
.v70-section-heading h2,.v70-experience-copy h2,.v70-progress-panel h2,.v70-library-preview h2{font-weight:780!important;line-height:1.12!important}
.v70-hero h1 em{font-weight:850}

/* ---------- Sharper imagery ---------- */
.v70-hero-visual{background:#f6e2d3}
.v70-hero-visual:before{
  background:linear-gradient(90deg,#fff5e9 0%,rgba(255,245,233,.16) 13%,transparent 32%),linear-gradient(0deg,rgba(95,47,34,.035),transparent 45%)!important;
}
.v70-hero-visual>img{
  filter:saturate(1.02) contrast(1.055) brightness(1.01)!important;
  image-rendering:auto;
  transform:translateZ(0);
}
.v70-landing-course-media{
  background-image:linear-gradient(180deg,rgba(20,14,12,.02),rgba(20,14,12,.12)),var(--course-cover)!important;
  background-size:cover!important;
  background-position:center!important;
}
.v70-home-course-media{
  background-image:linear-gradient(180deg,rgba(8,22,27,.02),rgba(8,22,27,.16)),var(--home-course-cover)!important;
  background-size:cover!important;
  background-position:center!important;
  filter:none!important;
}
[data-effects="on"] .v70-landing-course:hover .v70-landing-course-media,
[data-effects="on"] .v70-home-course:hover .v70-home-course-media{background-size:105%!important}
.v46-course-cover[style*="url("],.v46-course-poster[style*="url("]{
  filter:none!important;
  background-size:cover!important;
  background-position:center!important;
  image-rendering:auto;
}
.v46-course-cover[style*="url("]::before,.v46-course-poster[style*="url("]::before{
  background:linear-gradient(180deg,transparent 62%,rgba(8,18,22,.16))!important;
}
.v46-course-cover[style*="url("] .v46-course-cover-label,
.v46-course-cover[style*="url("] .v46-course-cover-index,
.v46-course-cover[style*="url("] small{text-shadow:0 1px 8px rgba(0,0,0,.25)}
.v60-course-admin-image{object-fit:cover!important;object-position:center!important;filter:none!important}

/* ---------- Stronger / clearer left sidebar ---------- */
.sidebar .brand-name{font-weight:850!important;color:var(--ink)!important}
.sidebar .brand-sub{font-weight:750!important;color:color-mix(in srgb,var(--ink) 52%,var(--muted))!important}
.sidebar .nav-label{font-weight:850!important;color:color-mix(in srgb,var(--ink) 56%,var(--muted))!important}
.sidebar .nav-link{
  font-weight:720!important;
  color:color-mix(in srgb,var(--ink) 82%,var(--muted))!important;
  letter-spacing:.005em;
}
.sidebar .nav-link .icon{color:color-mix(in srgb,var(--theme-accent) 65%,var(--ink))}
.sidebar .nav-link:hover{color:var(--ink)!important}
.sidebar .nav-link.active{font-weight:850!important;color:var(--theme-accent)!important}
.sidebar .nav-link.active .icon{color:var(--theme-accent)!important}
.sidebar .sidebar-foot{font-weight:650;color:color-mix(in srgb,var(--ink) 55%,var(--muted))}

/* ---------- Alignment / spacing polish ---------- */
.main{overflow-x:clip}
.v70-section-heading,.v70-home-heading{width:100%}
.v70-section-heading h2,.v70-home-heading h2{max-width:980px}
.v70-home-course,.v70-landing-course,.v60-course-admin-card{align-self:stretch}
.v70-home-course-copy,.v70-landing-course-copy{display:flex;flex-direction:column;height:100%}
.v70-home-course-copy footer,.v70-landing-course-copy>div{margin-top:auto}
.v60-course-admin-card{overflow:hidden}
.v60-course-admin-card>div:last-child{min-width:0}

/* ---------- Modal consistency ---------- */
dialog#modal{max-height:min(88vh,820px);overflow:auto}
.v62-mode-dialog,.v62-guide-modal,.v62-settings-dialog,.v62-mini-review,.v71-course-edit-dialog{
  width:min(620px,calc(100vw - 44px))!important;
  max-width:100%;
  display:grid;
  gap:18px;
  margin:0;
}
.v62-mode-dialog .modal-actions,.v62-guide-modal .modal-actions,.v62-settings-dialog .modal-actions,.v62-mini-review .modal-actions,.v71-course-edit-dialog .modal-actions{
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  margin-top:0;
}
.v62-mode-dialog .btn,.v62-guide-modal .btn,.v62-settings-dialog .btn,.v62-mini-review .btn,.v71-course-edit-dialog .btn{min-width:96px}
.v62-mini-review .v50-mini-options{gap:10px}
.v62-mini-review .v50-mini-options .btn{min-height:46px}

/* ---------- Admin: edit course ---------- */
.v71-course-edit-dialog{position:relative}
.v71-course-edit-dialog>div:first-of-type{padding-right:40px}
.v71-course-edit-dialog h2{font-size:25px!important;margin:4px 0 4px!important}
.v71-course-edit-preview{
  min-height:190px;
  border:1px dashed var(--line);
  border-radius:16px;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:linear-gradient(145deg,var(--surface-2),var(--surface));
  background-size:cover;
  background-position:center;
  position:relative;
}
.v71-course-edit-preview:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(5,17,22,.22));opacity:0;transition:.2s}
.v71-course-edit-preview.has-image:before{opacity:1}
.v71-course-edit-preview span{position:relative;z-index:1;padding:7px 10px;border-radius:999px;background:color-mix(in srgb,var(--surface) 86%,transparent);backdrop-filter:blur(8px);font-size:10px;font-weight:800;color:var(--ink)}
.v71-course-edit-dialog .form-field small{display:block;margin-top:5px;color:var(--muted);font-size:10px}

/* ---------- Course cover: keep the image clean ---------- */
.v46-course-cover{isolation:isolate}
.v46-course-cover .v46-course-cover-icon{box-shadow:0 8px 22px rgba(0,0,0,.12)}
.v46-course-cover .v46-course-cover-label{backdrop-filter:blur(7px);background:rgba(255,255,255,.78);padding:5px 8px;border-radius:999px}
[data-theme="dark"] .v46-course-cover .v46-course-cover-label{background:rgba(10,24,30,.72)}

/* ---------- Responsive fixes ---------- */
@media(max-width:1000px){
  .v70-hero{grid-template-columns:1fr!important;padding:38px!important}
  .v70-hero-visual{margin:4px 0 0!important;min-height:380px!important}
  .v70-hero h1{font-size:clamp(42px,8vw,66px)!important}
}
@media(max-width:760px){
  .sidebar .nav-link{font-size:13px!important;min-height:44px}
  .sidebar .nav-label{font-size:9px!important}
  .v70-hero{padding:25px!important;border-radius:22px!important}
  .v70-hero-visual{min-height:300px!important;border-radius:20px!important}
  .v70-hero h1{font-size:42px!important;letter-spacing:-1.6px!important}
  .v70-section-heading h2,.v70-experience-copy h2,.v70-progress-panel h2,.v70-library-preview h2{font-size:32px!important;letter-spacing:-1px!important}
  .v62-mode-dialog,.v62-guide-modal,.v62-settings-dialog,.v62-mini-review,.v71-course-edit-dialog{width:100%!important;gap:15px}
  .v71-course-edit-preview{min-height:150px}
}
@media(max-width:480px){
  .v70-hero h1{font-size:36px!important}
  .v70-hero-copy>p{font-size:12px!important}
  .v70-hero-stats{grid-template-columns:1fr 1fr!important;row-gap:18px}
  .v70-hero-stats>div:nth-child(3){border-left:0;padding-left:0}
}