/* NNGX In theo yêu cầu */
.nip{--nip:#0b5345;--nip-2:#10715d;--nip-soft:#e8f4ef;--nip-line:#e2e7e5;--nip-muted:#66736f;--nip-err:#c62828;
  display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:32px;align-items:start;max-width:980px;margin:0 auto 32px;color:#1d2a26;font-size:15px;line-height:1.5;box-sizing:border-box}
.nip *,.nip *::before,.nip *::after{box-sizing:border-box}
.nip.nip-compact{display:block;max-width:none;margin:8px 0 20px}
.nip [hidden]{display:none!important}

/* Cột ảnh */
.nip-media{position:relative}
.nip-frame{position:relative;background:#f6f8f7;border:1px solid var(--nip-line);border-radius:14px;padding:18px;text-align:center}
.nip-frame-img{display:block;width:100%;height:auto;max-width:260px;margin:0 auto;transition:transform .25s}
.nip-frame[data-ext="pdf"] .nip-frame-img,.nip-frame[data-ext="docx"] .nip-frame-img,.nip-frame[data-ext="doc"] .nip-frame-img{transform:scale(1.02)}
.nip-frame-file{margin-top:12px;font-size:13px;line-height:1.4;word-break:break-word}
.nip-frame-file b{display:block}
.nip-frame-file span{color:var(--nip-muted)}
.nip-rates{list-style:none;margin:14px 0 0;padding:0;border:1px solid var(--nip-line);border-radius:12px;overflow:hidden}
.nip-rates li{display:flex;justify-content:space-between;gap:10px;padding:10px 14px;border-top:1px solid var(--nip-line);font-size:14px;margin:0}
.nip-rates li:first-child{border-top:0}
.nip-rates span{color:var(--nip-muted)}
.nip-rates b{color:var(--nip)}
.nip-rates li.nip-rates-note{display:block;font-size:13.5px;line-height:1.5;color:#3b4a45;background:#f7faf9}
.nip-rates li.nip-rates-note b{white-space:nowrap}

/* Cột thao tác */
.nip-title{font-size:24px;line-height:1.3;margin:0 0 16px;font-weight:700}
.nip-step{border:1px solid var(--nip-line);border-radius:14px;padding:16px 18px 18px;margin:0 0 14px;background:#fff;min-width:0}
fieldset.nip-step{display:block}
.nip-step[disabled]{opacity:.55}
.nip-step-h{display:flex;align-items:center;gap:10px;font-weight:700;font-size:16px;margin:0 0 12px}
.nip-step-h i{font-style:normal;width:26px;height:26px;border-radius:50%;background:var(--nip);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:13px}
.nip-step[disabled] .nip-step-h i{background:#9aa6a2}

.nip-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:150px;padding:20px;border:2px dashed #c4d3cd;border-radius:12px;background:#fafcfb;cursor:pointer;text-align:center;transition:border-color .15s,background .15s;margin:0}
.nip-drop:hover,.nip-drop:focus-visible,.nip-drop.is-over{border-color:var(--nip-2);background:var(--nip-soft);outline:none}
.nip-drop-ic{width:46px;height:46px;border-radius:50%;background:var(--nip-soft);color:var(--nip);display:flex;align-items:center;justify-content:center}
.nip-drop-ic svg{width:24px;height:24px}
.nip-drop-t{font-size:15px}
.nip-drop-t b{color:var(--nip)}
.nip-drop-s{font-size:12.5px;color:var(--nip-muted)}

.nip-prog{border:1px solid var(--nip-line);border-radius:12px;padding:14px}
.nip-prog-top{display:flex;justify-content:space-between;gap:12px;font-size:14px;margin-bottom:8px}
.nip-prog-name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nip-prog-pct{color:var(--nip);font-variant-numeric:tabular-nums}
.nip-prog-bar{height:8px;border-radius:6px;background:#e9eeec;overflow:hidden}
.nip-prog-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--nip-2),#1fa37f);border-radius:6px;transition:width .2s}
.nip-prog-sub{display:flex;justify-content:space-between;gap:12px;margin-top:8px;font-size:12.5px;color:var(--nip-muted)}

.nip-done{display:flex;align-items:flex-start;gap:12px;padding:14px;border-radius:12px;background:var(--nip-soft);border:1px solid #bfdccf}
.nip-done-ic{flex:none;width:32px;height:32px;border-radius:50%;background:#16875d;color:#fff;display:flex;align-items:center;justify-content:center}
.nip-done-ic svg{width:18px;height:18px}
.nip-done-t{flex:1;min-width:0;font-size:14px}
.nip-done-t b{display:block;color:#11643f;font-size:15px}
.nip-done-t small{display:block;color:var(--nip-muted);margin-top:2px;word-break:break-word}
.nip-err{margin-top:10px;padding:10px 12px;border-radius:10px;background:#fdecec;color:var(--nip-err);font-size:14px}

.nip-link{background:none!important;border:0!important;padding:0!important;color:var(--nip)!important;font-weight:600;cursor:pointer;text-decoration:underline;font-size:13.5px;box-shadow:none!important;min-height:0!important}

.nip-field{display:block;margin:0 0 14px}
.nip-field>span{display:block;font-size:13.5px;font-weight:600;margin-bottom:6px}
.nip-field em{color:var(--nip-err);font-style:normal}
.nip-field input[type=text],.nip-field input[type=number],.nip-field textarea{font-family:inherit;width:100%;max-width:none;padding:11px 13px;border:1px solid #cfd8d4;border-radius:10px;font-size:15px;background:#fff;color:inherit;margin:0;box-shadow:none;height:auto;line-height:1.4}
.nip-field input:focus,.nip-field textarea:focus{border-color:var(--nip-2);outline:2px solid rgba(16,113,93,.15)}
.nip-field textarea{resize:vertical;min-height:84px}
.nip-pages{font-size:18px!important;font-weight:700}
.nip-seg{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.nip-seg label{margin:0;cursor:pointer}
.nip-seg input{position:absolute;opacity:0;pointer-events:none}
.nip-seg label>span{display:block;padding:11px 14px;border:1.5px solid #cfd8d4;border-radius:10px;transition:border-color .15s,background .15s}
.nip-seg b{display:block;font-size:15px}
.nip-seg small{color:var(--nip-muted);font-size:13px}
.nip-seg small .amount{color:inherit;font-weight:600}
.nip-seg input:checked+span{border-color:var(--nip);background:var(--nip-soft);box-shadow:inset 0 0 0 1px var(--nip)}
.nip-seg input:focus-visible+span{outline:2px solid var(--nip-2)}
.nip-row{display:grid;grid-template-columns:1fr 150px;gap:12px}
.nip-row .nip-field{margin-bottom:6px}
.nip-qty{display:flex;border:1px solid #cfd8d4;border-radius:10px;overflow:hidden;height:48px}
.nip-qty button{width:42px;flex:none;border:0;background:#f3f6f5;font-size:20px;cursor:pointer;color:inherit;padding:0;margin:0;border-radius:0;min-height:0}
.nip-qty input{flex:1;min-width:0;border:0!important;text-align:center;font-weight:700;border-radius:0!important;padding:0!important;-moz-appearance:textfield}
.nip-qty input::-webkit-inner-spin-button{display:none}
.nip-hint{font-size:13px;color:var(--nip-muted);margin:0 0 14px}
.nip-hint.is-err{color:var(--nip-err);font-weight:600}
.nip-hint.is-info{color:#9a6400}

.nip-price{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-radius:12px;background:#fff8ec;border:1px solid #f3dfb7;margin:0 0 14px}
.nip-price-l{font-size:14px;color:#5c4a24}
.nip-price-l small{display:block;color:#8a7344}
.nip-price-v{font-size:24px;font-weight:800;color:#c62828;white-space:nowrap}

.nip-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.nip .nip-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 18px;border-radius:10px;border:1.5px solid var(--nip);background:#fff;color:var(--nip);font-weight:700;font-size:15px;cursor:pointer;text-decoration:none;line-height:1.2;transition:background .15s,opacity .15s;margin:0}
.nip .nip-btn.nip-add,.nip .nip-btn.nip-btn-p{background:var(--nip);color:#fff}
.nip .nip-btn:hover{opacity:.92}
.nip .nip-btn:disabled{opacity:.45;cursor:not-allowed}
.nip-added{margin-top:12px;padding:14px;border-radius:12px;background:var(--nip-soft);border:1px solid #bfdccf;font-size:14px}
.nip-added b{color:#11643f}
.nip-added .amount{font-weight:700}
.nip-added-a{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:10px}
.nip-added-a .nip-btn{min-height:40px;padding:8px 14px;font-size:14px}
.nip-privacy{font-size:12.5px;color:var(--nip-muted);margin:4px 2px 0;display:flex;gap:6px;align-items:flex-start}
.nip-privacy::before{content:"";flex:none;width:14px;height:14px;margin-top:2px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center/contain no-repeat}

.nip-thumb{object-fit:contain;background:#f6f8f7}

/* In theo số lượng */
.nip-multi{border:1px solid var(--nip-line);border-radius:12px;margin:0 0 14px;transition:border-color .15s,background .15s}
.nip-multi.is-on{border-color:var(--nip-2);background:#f7fbf9}
.nip-check{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;margin:0;cursor:pointer}
.nip-check input{width:20px;height:20px;margin:2px 0 0;flex:none;accent-color:var(--nip)}
.nip-check b{display:block;font-size:15px}
.nip-check small{display:block;font-size:13px;color:var(--nip-muted)}
.nip-multi-box{padding:0 14px 14px}
.nip-multi-box .nip-field{margin-bottom:10px;max-width:220px}
.nip-qpick{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.nip-qpick button{border:1px solid #cfd8d4;background:#fff;border-radius:20px;padding:6px 14px;font-size:13.5px;cursor:pointer;color:inherit;margin:0;min-height:0;line-height:1.3}
.nip-qpick button:hover{border-color:var(--nip-2);color:var(--nip)}
.nip-multi-sum{font-size:14px;color:#11643f}
.nip-multi-sum:empty{display:none}
@media (max-width:760px){
  .nip{grid-template-columns:1fr;gap:16px}
  .nip-media{position:static;display:grid;grid-template-columns:110px 1fr;gap:12px;align-items:center}
  .nip-frame{padding:8px}
  .nip-frame-file{display:none}
  .nip-rates{margin:0}
  .nip-rates li{padding:7px 10px;font-size:13px}
  .nip-title{font-size:20px}
  .nip-step{padding:14px}
  .nip-row{grid-template-columns:1fr 130px}
  .nip-price-v{font-size:21px}
}
@media (max-width:400px){.nip-actions{grid-template-columns:1fr}}

/* ── Đồng ý điều khoản ── */
.nip-agree{display:flex;gap:10px;align-items:flex-start;margin:0 0 12px;padding:10px 12px;border-radius:10px;border:1px solid var(--nip-line);font-size:14px;line-height:1.5;cursor:pointer;transition:border-color .15s,background .15s}
.nip-agree input{width:19px;height:19px;flex:none;margin:1px 0 0;accent-color:var(--nip)}
.nip-agree a{color:var(--nip);font-weight:700;text-decoration:underline}
.nip-agree.is-need{border-color:#e0a100;background:#fff8e6}

/* ── Điều khoản sử dụng + khuyến học ── */
.nip-terms{grid-column:1/-1;margin-top:8px;padding:22px 24px;border:1px solid var(--nip-line);border-radius:14px;background:#fff;scroll-margin-top:90px;transition:box-shadow .3s}
.nip-terms.is-flash{box-shadow:0 0 0 3px rgba(16,113,93,.35)}
.nip-compact .nip-terms{margin-top:16px;padding:18px}
.nip-terms-h{display:flex;align-items:center;gap:10px;font-size:19px;line-height:1.35;font-weight:800;margin:0 0 12px;color:#14231f}
.nip-terms-h svg{width:22px;height:22px;flex:none;color:var(--nip)}
.nip-terms-list{margin:0 0 18px;padding:0;list-style:none;counter-reset:nipt}
.nip-terms-list li{position:relative;margin:0;padding:9px 0 9px 36px;border-top:1px solid #eef2f0;font-size:15.5px;line-height:1.65;color:#25332e}
.nip-terms-list li:first-child{border-top:0}
.nip-terms-list li::before{counter-increment:nipt;content:counter(nipt);position:absolute;left:0;top:10px;width:24px;height:24px;border-radius:50%;background:var(--nip-soft);color:var(--nip);font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center}

.nip-support{padding:18px 20px;border-radius:12px;background:#fff5f5;border:1.5px solid #f3c2c2;border-left:6px solid #d32f2f}
.nip-support-h{display:flex;align-items:center;gap:10px;margin:0 0 10px;color:#c62828;font-weight:900;font-size:18px;line-height:1.35;text-transform:uppercase;letter-spacing:.01em}
.nip-support-h svg{width:24px;height:24px;flex:none}
.nip-support-t{margin:0 0 8px;color:#c62828;font-weight:800;font-size:16px;line-height:1.6}
.nip-support-a{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.nip .nip-support-a .nip-btn{gap:8px;min-height:46px}
.nip-support-a .nip-btn svg{width:19px;height:19px;flex:none}
.nip .nip-btn.nip-zalo{background:#0068ff;border-color:#0068ff;color:#fff}
.nip .nip-btn.nip-support-open{border-color:#d32f2f;color:#c62828;background:#fff}
.nip .nip-btn.nip-support-open[aria-expanded=true]{background:#c62828;color:#fff}
.nip-support-form{margin-top:16px;padding:16px;border-radius:12px;background:#fff;border:1px solid #f0d0d0}
.nip-sf-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.nip-support-form select{width:100%;padding:11px 13px;border:1px solid #cfd8d4;border-radius:10px;font-size:15px;background:#fff;font-family:inherit;height:auto;margin:0}
.nip-support-form input[type=tel],.nip-support-form input[type=email]{font-family:inherit;width:100%;padding:11px 13px;border:1px solid #cfd8d4;border-radius:10px;font-size:15px;background:#fff;margin:0;box-shadow:none;height:auto}
.nip-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.nip-sf-note{font-size:13px;color:#6b4a4a;margin:0 0 12px}
.nip-sf-msg{margin-top:12px;padding:10px 12px;border-radius:10px;font-size:14.5px;font-weight:600}
.nip-sf-msg.is-ok{background:#e8f6ee;color:#11643f}
.nip-sf-msg.is-err{background:#fdecec;color:#c62828}

@media (max-width:760px){
  .nip-terms{padding:16px 14px}
  .nip-terms-h{font-size:17px}
  .nip-terms-list li{font-size:15px;padding-left:34px}
  .nip-support{padding:14px;border-left-width:5px}
  .nip-support-h{font-size:16px}
  .nip-support-t{font-size:15.5px}
  .nip-support-a .nip-btn{flex:1 1 100%}
  .nip-sf-grid{grid-template-columns:1fr}
}

/* ── Tab đóng/mở (accordion) – mọi màn hình ── */
.nip-terms{grid-column:1/-1;order:-1;margin:0 0 6px;padding:0;border:0;background:none;display:grid;gap:12px;scroll-margin-top:90px}
.nip-terms-only{display:block!important;max-width:none;margin:0 0 18px}
.nip-acc-terms{border:1px solid var(--nip-line);border-radius:12px;background:#fff;overflow:hidden}
.nip .nip-acc-h{display:flex;align-items:center;gap:10px;width:100%;background:none;border:0;margin:0;padding:15px 18px;min-height:56px;text-align:left;font-family:inherit;cursor:pointer;box-shadow:none;border-radius:0;color:inherit;text-transform:none;letter-spacing:0;-webkit-tap-highlight-color:transparent}
.nip .nip-acc-h>span{flex:1;min-width:0}
.nip .nip-acc-h.nip-terms-h{font-size:17px;line-height:1.35;font-weight:800;color:#14231f}
.nip .nip-acc-h.nip-support-h{color:#c62828;font-weight:900;font-size:16.5px;line-height:1.35;text-transform:uppercase;letter-spacing:.01em}
.nip .nip-acc-h:hover,.nip .nip-acc-h:focus{background:rgba(0,0,0,.025);color:inherit;outline:none}
.nip .nip-acc-h:focus-visible{box-shadow:inset 0 0 0 2px var(--nip-2)}
.nip .nip-acc-h.nip-support-h:hover,.nip .nip-acc-h.nip-support-h:focus{color:#c62828;background:rgba(198,40,40,.04)}
.nip-acc-chev{display:block;width:22px;height:22px;flex:none;transition:transform .25s}
.nip-acc.is-open .nip-acc-chev{transform:rotate(180deg)}
.nip-acc:not(.is-open) .nip-acc-b{display:none}
.nip-acc-terms .nip-acc-b{padding:0 18px 8px;border-top:1px solid #eef2f0}
.nip-acc-terms.is-open .nip-terms-h{background:#f6faf8}
.nip-acc-terms .nip-terms-list{margin:0}
.nip-support{padding:0}
.nip-support .nip-acc-b{padding:0 18px 18px}
@media (max-width:760px){
  .nip .nip-acc-h{padding:15px 14px}
  .nip .nip-acc-h.nip-terms-h{font-size:16.5px}
  .nip .nip-acc-h.nip-support-h{font-size:15.5px}
  .nip-acc-terms .nip-acc-b{padding:0 14px 6px}
  .nip-support .nip-acc-b{padding:0 14px 14px}
}
