/* AHF · 21 Ngày Đồng Hành · CSS dùng chung (trang bán, đăng ký, khu học viên, admin) */
:root{
  --green:#1F8A70; --green-deep:#12634F; --green-soft:#E6F3EE;
  --coral:#FF6B4A; --coral-deep:#E8502F;
  --cream:#FFFCF6; --sand:#FDF3E7; --ink:#26302E; --muted:#5C6B67; --line:#E9E2D6;
  --radius:18px; --shadow:0 18px 45px -22px rgba(18,99,79,.35);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.6 'Be Vietnam Pro',system-ui,sans-serif}
img{max-width:100%;display:block}
a{color:var(--green-deep)}
h1,h2,h3{line-height:1.25;margin:0 0 .6em}
.wrap{max-width:1040px;margin:0 auto;padding:0 16px}
.narrow{max-width:640px;margin:0 auto;padding:0 16px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;border:0;border-radius:999px;
  background:var(--coral);color:#fff;font:700 1rem/1 inherit;font-family:inherit;padding:1rem 1.6rem;cursor:pointer;
  text-decoration:none;box-shadow:0 12px 26px -12px rgba(232,80,47,.7);transition:transform .15s,background .15s}
.btn:hover{background:var(--coral-deep);transform:translateY(-1px)}
.btn:disabled{opacity:.6;cursor:default;transform:none}
.btn.block{width:100%}
.btn.ghost{background:#fff;color:var(--green-deep);border:1.5px solid var(--green);box-shadow:none}
.btn.green{background:var(--green);box-shadow:none}
.btn.small{padding:.6rem 1rem;font-size:.9rem}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow)}
.muted{color:var(--muted)}
.tag{display:inline-block;background:var(--green-soft);color:var(--green-deep);font-weight:700;font-size:.78rem;
  letter-spacing:.04em;text-transform:uppercase;padding:.3rem .7rem;border-radius:999px}
label{display:block;font-weight:600;font-size:.92rem;margin:.9rem 0 .35rem}
input,textarea,select{width:100%;font:inherit;padding:.8rem .9rem;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--green)}
textarea{min-height:110px;resize:vertical}
.err{color:var(--coral-deep);font-size:.9rem;margin-top:.6rem;min-height:1.2em}
.hide{display:none!important}

/* thanh trên khu học viên */
.topbar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}
.topbar .in{display:flex;align-items:center;justify-content:space-between;gap:.5rem;max-width:640px;margin:0 auto;padding:.7rem 16px}
.brand{font-weight:800;color:var(--green-deep);text-decoration:none;font-size:.95rem}
.nav{display:flex;gap:.25rem;flex-wrap:wrap}
.nav a{font-size:.85rem;font-weight:600;color:var(--muted);text-decoration:none;padding:.4rem .6rem;border-radius:8px}
.nav a.on{background:var(--green-soft);color:var(--green-deep)}
.bar{height:12px;background:var(--green-soft);border-radius:999px;overflow:hidden}
.bar>i{display:block;height:100%;background:var(--green);border-radius:999px}
.choices{display:flex;flex-wrap:wrap;gap:.5rem}
.choices label{margin:0;font-weight:600;border:1.5px solid var(--line);border-radius:999px;padding:.55rem 1rem;cursor:pointer;background:#fff}
.choices input{display:none}
.choices label:has(input:checked){border-color:var(--green);background:var(--green-soft);color:var(--green-deep)}
.instr{white-space:pre-line}

@media (max-width:420px){.topbar .brand{font-size:.82rem}.nav a{padding:.35rem .4rem;font-size:.8rem}}

/* Bài học */
.rich{font-size:1rem;line-height:1.7}
.rich h3{font-size:1rem;margin:1.6rem 0 .15rem;color:var(--green-deep);text-transform:uppercase;letter-spacing:.03em}
.rich .rh{font-weight:700;margin:0 0 .6rem}
.rich p{margin:.6rem 0}
.rich ul{margin:.3rem 0 .7rem;padding-left:1.3rem}
.rich li{margin:.15rem 0}
.rich .rq{font-style:italic;color:var(--muted);border-left:3px solid var(--line);padding-left:.8rem;margin:.25rem 0}
.rich .rn{background:#FFF7E6;border-radius:10px;padding:.75rem .9rem;font-size:.92rem;margin:.9rem 0}
.lesson{background:var(--cream);border-radius:14px;padding:.2rem .85rem .6rem;margin:1rem -.55rem 0}
.lesson>summary{margin-top:.7rem}

/* Khối nội dung theo giáo án */
.co{border-radius:14px;padding:.7rem .95rem .4rem;margin:.75rem -.55rem;background:#F7F5F0}
.co-t{font-weight:800;margin:0 0 .15rem;font-size:.95rem}
.co .rich p{margin:.35rem 0}
.co .rich ul{margin:.25rem 0 .4rem}
.co-goal{background:var(--green-soft)}
.co-read{background:var(--cream);border:1px solid var(--line)}
.co-task{background:#fff;border:2px solid var(--green)}
.co-note,.co-eg{background:#F4F7FB}
.co-rule{background:#FFF7E6}
.co-warn{background:#FFF1EC;border:1px solid #F5C2B3}
.co-tip{background:#F1F8F5}
.doc{background:#fff;border:1.5px dashed var(--green);border-radius:14px;padding:.2rem .95rem .6rem;margin:.75rem -.55rem}
.doc>summary{margin-top:.55rem}
.rich table{width:100%;border-collapse:collapse;font-size:.88rem;margin:.6rem 0}
.rich th,.rich td{border:1px solid var(--line);padding:.4rem .5rem;text-align:left;vertical-align:top}
.rich th{background:var(--sand)}
.rich hr{border:0;border-top:1px dashed var(--line);margin:1rem 0}
.tri{padding:.55rem 0;border-bottom:1px dashed var(--line)}
.tri p{margin:0 0 .45rem;font-weight:600;font-size:.93rem}
.hl-co{color:var(--coral-deep);font-weight:700}
