/* Giao diện riêng của công cụ tạo schema, bố cục hai cột theo trang mẫu kiem-tra-ma-phan-hoi. */
.tl-page .note{margin:0 0 12px;background:#e3ebff;border-radius:14px;padding:12px 16px;font-size:14px;display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;color:#212025;min-width:0}
.tl-page .note .ic{width:20px;height:20px;margin-top:2px;fill:#004aef;flex:none}
.tl-page .note.warn{background:#fff6d6}
.tl-page .note.warn .ic{fill:#7a5f00}

/* Năm loại schema trên nút gạt: hàng trên 3 nút, hàng dưới 2 nút */
.tl-page .loai-row{grid-auto-flow:row;grid-template-columns:repeat(6,1fr)}
.tl-page .loai-row > button{grid-column:span 2;font-size:14px;padding:9px 4px}
.tl-page .loai-row > button:nth-child(n+4){grid-column:span 3}

.tl-page .schema-nhan-hang{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px}
.tl-page .schema-nhan-hang .tl-bc{margin:0}
.tl-page .schema-xoa{background:none;border:0;padding:2px 4px;color:#616a7a;font:600 13px/1.3 var(--font-body);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.tl-page .schema-xoa:hover{color:#004aef}
.tl-page .schema-bc-3{margin-top:22px !important}

.tl-page .f{margin-top:12px}
.tl-page .f:first-child{margin-top:0}
.tl-page .f2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.tl-page .f2 .f{margin-top:0}
@media (max-width:560px){ .tl-page .f2{grid-template-columns:1fr} }
.tl-page .schema-in .f label{display:block;font:600 13.5px/1.35 var(--font-body);color:#434343;margin-bottom:6px}
.tl-page .schema-in input[type="text"],.tl-page .schema-in input[type="date"],.tl-page .schema-in .f textarea{width:100%;box-sizing:border-box;border:1px solid #d7dfe2;border-radius:12px;background:#fff;color:#212025;font:400 14.5px/1.5 var(--font-body);padding:9px 12px}
.tl-page .schema-in .f textarea{min-height:76px;resize:vertical}
.tl-page .schema-in input:focus,.tl-page .schema-in .f textarea:focus{outline:none;border-color:#004aef;box-shadow:0 0 0 3px #c0d2fb}
.tl-page .goi{margin:6px 0 0;font-size:12.5px;color:#616a7a;line-height:1.45}
.tl-page .btn{align-self:flex-start;border:1px dashed #80a4f7;background:#fff;color:#004aef;border-radius:10px;padding:8px 12px;font:600 13.5px/1.2 var(--font-body);cursor:pointer}
.tl-page .btn:hover{background:#e3ebff}
.tl-page .faq-row,.tl-page .bc-row{border:0;border-radius:12px;padding:12px;margin-bottom:10px;background:#f4f7fd}
.tl-page .faq-xoa,.tl-page .bc-xoa{margin-top:10px;font-size:12.5px;padding:6px 10px;border-style:solid;border-color:#dbe3f5;color:#8f1d1d}
.tl-page .faq-xoa:hover,.tl-page .bc-xoa:hover{background:#f6cbcb;border-color:#dc2f2f}

/* Cột kết quả */
.tl-page .schema-dau{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 12px}
.tl-page .schema-dau-ten{margin:0;font-size:17px;font-weight:700;color:#212025}
.tl-page .schema-dau-phu{font-size:13.5px;color:#616a7a}
.tl-page .schema-pre{margin:0;background:#212025;color:#dcfbef;border-radius:14px;padding:16px;font:12.5px/1.6 var(--font-mono);overflow:auto;min-height:260px;max-height:640px;white-space:pre-wrap;word-break:break-word}
.tl-page .schema-ghi{margin:10px 0 0;font-size:13.5px;color:#616a7a}
.tl-page .schema-ghi code{font-family:var(--font-mono);font-size:12.5px;color:#0033b3}
@media (max-width:760px){ .tl-page .schema-dau-phu{display:none} }