/* Biểu mẫu soạn thảo, tiến trình và thể thức tài liệu */
.st::before{display:none}
.st .icon{width:13px;height:13px}
.st-planned{background:#A52A2A;color:#fff}
.st-draft{background:#FFE75C;color:#B3121F}
.st-pending1{background:var(--sky-l);color:var(--sky-d)}
.st-rejected{background:#FDE3EC;color:#B3134F}
.st-expired{background:#E8EDF2;color:#516679}

/* Biểu mẫu soạn thảo */
.tpl-pick{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-weight:700;color:var(--navy)}
.tpl-pick select{max-width:340px}
.sec{background:#F4F6F8;border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:14px}
.sec-h{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.sec-h h4{font-size:16px;font-weight:800;color:var(--ink)}
.sec .hint{font-size:13px;color:var(--muted);margin-top:6px}
.person input{border:1px solid var(--line);border-radius:8px;padding:8px 10px;width:100%;margin-bottom:6px}
.fbar{position:sticky;bottom:0;background:rgba(241,248,253,.96);padding:10px 0;display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;z-index:20;border-top:1px solid var(--line)}
.rte{background:#fff;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.rte-bar{display:flex;flex-wrap:wrap;align-items:center;gap:3px;padding:6px 8px;border-bottom:1px solid var(--line);background:#fff}
.rte-bar button{min-width:34px;height:32px;padding:0 7px;border:1px solid transparent;border-radius:6px;background:none;cursor:pointer;font:inherit;font-size:14px;color:var(--ink)}
.rte-bar button:hover,.rte-bar button.on{background:var(--sky-l);border-color:var(--sky-m)}
.rte-bar select{height:32px;border:1px solid transparent;border-radius:6px;background:none;font-size:14px;cursor:pointer;max-width:125px}
.rte-bar select:hover{background:var(--sky-l)}
.rte-sep{width:1px;height:22px;background:var(--line);margin:0 3px}
.rte-body{min-height:92px;padding:10px 12px;outline:0;overflow-wrap:anywhere;overflow-x:auto}
.rte-body:focus{box-shadow:inset 0 0 0 2px rgba(30,150,216,.3)}
.rte-src{width:100%;min-height:160px;border:0;padding:10px;font:13px/1.5 Consolas,monospace;outline:0}
.rte-body p,.doc-body p{margin:0 0 8px}
.rte-body img,.doc-body img{max-width:100%;height:auto}
.rte-body h3,.rte-body h4,.rte-body h5{margin:8px 0 6px;color:var(--ink)}
.rte-body table,.doc-body table{border-collapse:collapse;width:100%;margin:8px 0}
.rte-body td,.rte-body th,.doc-body td,.doc-body th{border:1px solid #9FB3C4;padding:6px 8px;vertical-align:top}
.rte-body td{min-width:50px}
.doc-body th{background:#F1F6FA}
.rte-body blockquote,.doc-body blockquote{margin:8px 0;padding:6px 12px;border-left:4px solid var(--sky);background:var(--sky-l)}
.rte-body pre,.doc-body pre{background:#F1F4F7;padding:8px 10px;border-radius:6px;white-space:pre-wrap}
.grid-ed textarea{width:100%;border:1px solid var(--line);border-radius:6px;padding:6px 8px;resize:vertical;font:inherit;font-size:14px;min-width:60px}
.grid-ed .tbl td{padding:6px}
.grid-ed .acts{width:118px}

/* Thanh tiến trình */
.track{list-style:none;margin:6px 0 14px;padding:0;display:flex;counter-reset:s}
.track li{flex:1;min-width:0;position:relative;text-align:center;padding:0 4px}
.track li::before{content:"";position:absolute;top:21px;right:50%;width:100%;height:4px;background:#DFE8EF}
.track li:first-child::before{display:none}
.track li.t-done::before,.track li.t-now::before,.track li.t-bad::before{background:var(--green)}
.t-ic{position:relative;z-index:1;width:46px;height:46px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:20px;background:#E5ECF2;color:#7D91A3;border:3px solid #fff;box-shadow:0 0 0 1px var(--line)}
.t-done .t-ic{background:var(--green);color:#fff}
.t-now .t-ic{background:var(--yellow);color:#6A3B00;animation:pulse 1.8s infinite}
.t-bad .t-ic{background:#E8467C;color:#fff}
.t-tx{font-size:13px;margin-top:5px;color:var(--muted)}
.t-tx b{display:block;color:var(--ink);font-size:14px}
.t-todo .t-tx b{color:var(--muted);font-weight:600}
.t-tx small{display:block;overflow-wrap:anywhere}
.t-wait{color:#A84E00;font-weight:700}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,201,40,.7)}70%{box-shadow:0 0 0 11px rgba(255,201,40,0)}100%{box-shadow:0 0 0 0 rgba(255,201,40,0)}}
.mini{display:flex;align-items:center;white-space:nowrap}
.mini i{width:7px;height:2px;background:var(--line)}
.mi{width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#E5ECF2;color:#8CA0B2;font-size:11px;flex:none}
.mi.t-done{background:var(--green);color:#fff}
.mi.t-now{background:var(--yellow);color:#6A3B00}
.mi.t-bad{background:#E8467C;color:#fff}
.htl{list-style:none;margin:0;padding:0}
.htl li{display:flex;gap:9px;padding:7px 0;border-bottom:1px solid #EAF2F8;font-size:14px}
.htl li:last-child{border-bottom:0}
.htl .ic{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex:none}
.ic.p{background:#EFEAF6;color:#67508A}

/* Tổng hợp tiến độ */
.stage-tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:16px}
.stage{display:flex;align-items:center;gap:9px;border:3px solid transparent;border-radius:12px;padding:12px 13px;cursor:pointer;font:inherit;font-weight:700;box-shadow:var(--shadow);text-align:left;min-width:0}
.stage .icon{font-size:20px}
.stage span{flex:1;min-width:0}
.stage b{font-size:24px;line-height:1}
.stage.on{border-color:var(--navy)}
.c-planned{background:#A52A2A;color:#fff}
.c-drafting{background:#FFE75C;color:#B3121F}
.c-reviewing{background:#1E96D8;color:#fff}
.c-done{background:#0E8A5F;color:#fff}
.c-expired{background:#7B8FA1;color:#fff}
.sum-c{width:100%;border:0;border-radius:6px;padding:6px 10px;font:inherit;font-weight:700;cursor:pointer;min-width:64px}
.sum-c:hover{filter:brightness(.93)}
.legend-row{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.flag{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:700;padding:0 7px;border-radius:12px;margin-top:3px}
.f-r{background:var(--red-l);color:var(--red-d)}
.f-y{background:var(--yellow-l);color:#8A5A00}

/* Thể thức tài liệu */
.doc-body{font-family:"Times New Roman",Times,serif;font-size:16.5px;line-height:1.5;color:#111}
.doc-body h2,.doc-body h3,.doc-body h4,.doc-body h5{color:#111;font-family:inherit}
.doc-h{font-size:17px;font-weight:700;margin:16px 0 8px}
.doc-cover{text-align:center;border:2px solid #111;padding:14px 12px;margin-bottom:18px}
.doc-org{border-bottom:1px solid #111;padding-bottom:8px;margin-bottom:18px}
.doc-cover>img{width:120px;height:120px;border-radius:50%;margin:8px 0}
.doc-cover h2{font-size:22px;font-weight:700;margin:8px 0}
.doc-cover h3{font-size:19px;font-weight:700;margin:10px 0 4px}
.doc-kv{text-align:left;display:inline-block}
.doc-sign td,.doc-sign th{text-align:center;vertical-align:middle}
.doc-sign .sig td{height:74px}
.doc-rec{list-style:none;padding:0;margin:0}
.doc-rec li{display:flex;gap:9px;align-items:center;padding:3px 0}
.doc-rec .box{width:20px;height:20px;border:1px solid #111;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex:none}
.doc-scroll{overflow-x:auto}
.doc-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:12px;text-align:center}
.doc-head hr{width:45%;border:0;border-top:1px solid #111;margin:4px auto}
.doc-title{text-align:center;margin:16px 0}
.doc-to{margin:0 0 12px;padding-left:12%}
.doc-foot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;margin-top:16px}
.doc-foot .prewrap{font-size:15px}
.doc-signer{text-align:center}
.doc-signer .gap{height:80px}

@media (max-width:960px){
  .stage-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stage-tiles .stage:last-child{grid-column:1/-1}
}
@media (max-width:640px){
  .track{flex-direction:column;gap:0}
  .track li{display:flex;gap:11px;text-align:left;padding:0 0 12px}
  .track li::before{top:-50%;left:21px;right:auto;width:4px;height:100%}
  .t-tx{margin-top:0}
  .sec{padding:10px}
  .rte-bar select{max-width:102px}
  .fbar .btn{flex:1}
  .stage{padding:9px 10px}
  .stage b{font-size:20px}
  .sum-td{align-items:center}
  .sum-c{width:auto}
  .grid-ed .tbl td{display:block !important;text-align:left}
  .grid-ed .tbl td::before{display:block;margin-bottom:3px}
  .grid-ed .acts{width:100%}
  .doc-body{font-size:16px}
  .doc-head,.doc-foot{grid-template-columns:1fr}
  .doc-to{padding-left:0}
  .doc-cover h2{font-size:18px}
}
@media print{
  .no-print,.toolbar,#toasts,#tip{display:none !important}
  main{padding:0;min-height:0}
  .wrap{max-width:none;padding:0}
  .row{display:block}
  .doc-body{padding:0;margin:0}
  .sec,.doc-cover{break-inside:avoid}
}