/* Giao diện riêng của công cụ tạo robots.txt, 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}
.tl-page .note .ic{width:20px;height:20px;margin-top:2px;flex:none;fill:#004aef}
.tl-page .note.warn{background:#fff6d6}
.tl-page .note.warn .ic{fill:#7a5f00}
.tl-page .note.loi{background:#f6cbcb}
.tl-page .note.loi .ic{fill:#8f1d1d}

/* Nút mẫu: dùng khung nút gạt chung, nhưng là nút bấm một lần nên không giữ trạng thái chọn */
.tl-page .rb-mau > button{font-size:13.5px;padding:9px 4px}
.tl-page .rb-mau > button:active{background:#fff;color:#004aef;box-shadow:0 1px 4px rgba(0,74,239,.15)}

.tl-page .rb-nhan-hang{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 8px}
.tl-page .rb-nhan-hang .tl-bc{margin:0}
.tl-page .rb-xoa-het{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 .rb-xoa-het:hover{color:#004aef}
.tl-page .rb-bc-3{margin-top:18px !important}

/* Mỗi dòng quy tắc là một thẻ nhỏ: hàng trên bot + loại, hàng dưới đường dẫn + nút xoá */
.tl-page .rb-dong{display:grid;grid-template-columns:1fr 1fr 36px;gap:8px;align-items:start;margin-bottom:8px;padding:10px;background:#f4f7fd;border-radius:12px;min-width:0}
.tl-page .rb-dong > :nth-child(1){grid-column:1}
.tl-page .rb-dong > :nth-child(2){grid-column:2 / 4}
.tl-page .rb-dong > :nth-child(3){grid-column:1 / 3}
.tl-page .rb-dong > :nth-child(4){grid-column:3}
.tl-page .rb-f{display:grid;gap:4px;min-width:0}
.tl-page .rb-f label{font-size:12px;color:#616a7a}
.tl-page .rb-dong input,.tl-page .rb-dong select,.tl-page .rb-sm input{width:100%;min-width:0;box-sizing:border-box;border:1px solid #d7dfe2;border-radius:10px;background:#fff;color:#212025;font:400 14px/1.4 var(--font-body);padding:0 10px;height:38px}
.tl-page .rb-dong input:focus,.tl-page .rb-dong select:focus,.tl-page .rb-sm input:focus{outline:none;border-color:#004aef;box-shadow:0 0 0 3px #c0d2fb}
.tl-page .rb-dong input.rb-loi,.tl-page .rb-sm input.rb-loi{border-color:#dc2f2f;background:#f6cbcb}
.tl-page .rb-xoa{border:1px solid #dbe3f5;background:#fff;color:#8f1d1d;border-radius:10px;width:36px;height:38px;font-size:18px;line-height:1;cursor:pointer;align-self:end}
.tl-page .rb-xoa:hover{background:#f6cbcb;border-color:#dc2f2f}
.tl-page .rb-sm{display:grid;grid-template-columns:1fr 36px;gap:8px;margin-bottom:8px;min-width:0}
.tl-page .rb-trong{color:#616a7a;font-size:13.5px;margin:0 0 8px}
.tl-page .rb-them{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 .rb-them:hover{background:#e3ebff}
.tl-page .rb-nut-tai{margin-top:22px}

/* Cột kết quả */
.tl-page .rb-dau{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
.tl-page .rb-nhan{font-size:17px;font-weight:700;color:#212025}
.tl-page .rb-copy{flex:none;border:1px solid #dbe3f5;background:#f4f7fd;color:#212025;border-radius:10px;padding:8px 14px;font:600 13.5px/1.2 var(--font-body);cursor:pointer}
.tl-page .rb-copy:hover{background:#e3ebff;border-color:#004aef;color:#004aef}
.tl-page #rb-xem{width:100%;box-sizing:border-box;min-height:340px;flex:1 0 340px;resize:vertical;border:1px solid #dbe3f5;border-radius:14px;background:#f4f7fd;color:#212025;font:400 13.5px/1.6 var(--font-mono);padding:14px 16px;white-space:pre;overflow:auto}
.tl-page .rb-ghi{margin:10px 0 0;font-size:13.5px;color:#616a7a}
.tl-page .rb-ghi code{font-family:var(--font-mono);font-size:12.5px;color:#0033b3}
@media (max-width:760px){ .tl-page #rb-xem{min-height:260px;flex-basis:260px} }
