/* v0.39.0: nút Thao tác, dòng Người tạo, chữ ký, ô mật khẩu có con mắt, giấy báo giá trong giao diện tối */

/* Menu Thao tác */
.qa-menu{position:relative;display:inline-block}
.qa-toggle{display:inline-flex;align-items:center;gap:7px;font-weight:600}
.qa-toggle .solid-icon{width:16px;height:16px;flex-basis:16px}
.qa-toggle .solid-icon:last-child{width:14px;height:14px;flex-basis:14px;transition:transform .15s}
.qa-menu.open .qa-toggle .solid-icon:last-child{transform:rotate(180deg)}
.qa-panel{position:absolute;top:calc(100% + 6px);right:0;z-index:60;display:flex;flex-direction:column;min-width:270px;max-height:min(70vh,520px);overflow:auto;padding:6px;border:1px solid #d7dce5;border-radius:10px;background:#fff;box-shadow:0 16px 40px #1018282e;text-align:left}
.qa-panel[hidden]{display:none}
.qa-panel .qa-item{display:flex;align-items:center;gap:10px;width:100%;min-height:36px;margin:0;padding:7px 10px;border:0;border-radius:7px;background:none;color:#1d283b;font-size:14px;font-weight:500;text-align:left;text-decoration:none;white-space:nowrap;cursor:pointer}
.qa-panel .qa-item .solid-icon{width:16px;height:16px;flex-basis:16px;color:#475467}
.qa-panel .qa-item:hover,.qa-panel .qa-item:focus-visible{background:#eef4ff;color:var(--brand,#0964fe)}
.qa-panel .qa-item:hover .solid-icon{color:var(--brand,#0964fe)}
.qa-sep{height:1px;margin:5px 4px;background:#e4e7ec}
.qa-sub>summary{display:flex;align-items:center;gap:10px;min-height:36px;padding:7px 10px;border-radius:7px;color:#1d283b;font-size:14px;font-weight:600;list-style:none;cursor:pointer}
.qa-sub>summary::-webkit-details-marker{display:none}
.qa-sub>summary .solid-icon{width:16px;height:16px;flex-basis:16px;color:#475467}
.qa-sub>summary em{margin-left:auto;min-width:22px;padding:0 7px;border-radius:999px;background:#f2f4f7;color:#475467;font-size:12px;font-style:normal;text-align:center}
.qa-sub>summary:hover{background:#eef4ff}
.qa-sub-list{display:flex;flex-direction:column;margin:2px 0 4px 18px;padding-left:8px;border-left:2px solid #e4e7ec}
.qa-panel .qa-rev{justify-content:space-between;min-height:32px;padding:5px 10px;font-size:13.5px}
.qa-panel .qa-rev small{color:#667085;font-size:12px}
.qa-panel .qa-rev.current{background:#eef4ff;color:var(--brand,#0964fe);font-weight:700}
#main .page-head .qa-menu{margin-left:auto}
#main .page-head .qa-menu+[data-act="edit-quote"]{margin-left:8px}

/* Trang xem báo giá: Người tạo · ngày giờ */
.qv-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:4px;color:#667085;font-size:14px}
.qv-meta b{color:#344054}
body.theme-dark .qv-meta{color:var(--d-ink-3)}
body.theme-dark .qv-meta b{color:var(--d-ink)}
.qv-date{display:inline-flex;align-items:center;gap:6px}
.qv-date .solid-icon{width:15px;height:15px;flex-basis:15px}
.qv-draft{padding:2px 8px;border-radius:999px;background:#fff4d6;color:#b54708;font-size:12px;font-weight:700}

/* Trang soạn: không còn nút Huỷ chỉnh sửa */
#quote-form [data-cancel-quote]{display:none!important}
.qc-ask{margin:4px 0 14px;font-size:15px}

/* Chữ ký: tiêu đề in đậm, "(Ký, ghi rõ họ tên)" bên dưới */
.qt-sign>span{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.qt-sign>span b{font-weight:700}
.qt-sign>span small{font-size:.9em;font-style:italic;font-weight:400}
:is(#lb-page,.wm-a4,.lb-thumb-inner,.qp-page) .qt-layout .qt-sign>span{width:34%}
:is(#lb-page,.wm-a4,.lb-thumb-inner,.qp-page) .qt-layout .qt-sign>span:last-child{text-align:center}

/* Chia sẻ: mật khẩu có con mắt */
.pw-wrap{position:relative;display:block}
.pw-wrap input{width:100%;padding-right:42px}
.pw-eye{position:absolute;top:50%;right:4px;display:grid;place-items:center;width:32px;height:30px;min-height:0;margin:0;padding:0;border:0;background:none;color:#475467;transform:translateY(-50%)}
.pw-eye .solid-icon{width:18px;height:18px;flex-basis:18px}
.pw-eye:hover{color:var(--brand,#0964fe);background:none}
.pw-eye:disabled{opacity:.45;cursor:not-allowed}

/* Giao diện tối */
body.theme-dark .quote-paper{background:#fff}
body.theme-dark .quote-paper:not(.qt-layout){color:#1d283b}
body.theme-dark .qa-panel{border-color:var(--d-line-2);background:var(--d-surface);box-shadow:0 18px 44px #0000008c}
body.theme-dark .qa-panel .qa-item,body.theme-dark .qa-sub>summary{background:none;border:0;color:var(--d-ink)}
body.theme-dark .qa-panel .qa-item .solid-icon,body.theme-dark .qa-sub>summary .solid-icon{color:var(--d-ink-2)}
body.theme-dark .qa-panel .qa-item:hover,body.theme-dark .qa-panel .qa-item:focus-visible,body.theme-dark .qa-sub>summary:hover{background:var(--d-hover);color:#fff;box-shadow:inset 3px 0 0 var(--d-hover-line)}
body.theme-dark .qa-panel .qa-item:hover .solid-icon{color:var(--d-accent)}
body.theme-dark .qa-panel .qa-rev small{color:var(--d-ink-3)}
body.theme-dark .qa-panel .qa-rev.current{background:var(--d-brand-soft);color:#fff}
body.theme-dark .qa-sep,body.theme-dark .qa-sub-list{background:var(--d-line);border-color:var(--d-line-2)}
body.theme-dark .qa-sep{background:var(--d-line-2)}
body.theme-dark .qa-sub>summary em{background:#25365a;color:#dbe5f3}
body.theme-dark .qv-draft{background:#3a2a0c;color:#fcc96b}
body.theme-dark .pw-eye{background:none!important;border:0!important;color:var(--d-ink-2)}
body.theme-dark .pw-eye:hover{color:var(--d-accent)}

/* Hộp thoại: tiêu đề cố định, thanh cuộn chỉ ở phần nội dung */
#dialog[open]:has(>.dialog-body){display:flex;flex-direction:column;overflow:hidden;padding-bottom:0}
#dialog:has(>.dialog-body)>.dialog-head{position:relative;top:auto;flex:none;z-index:2}
#dialog>.dialog-body{flex:1 1 auto;min-height:0;overflow:auto;margin-right:-20px;padding:2px 20px 20px 0}

/* Dấu × lớn: đen ở giao diện sáng, trắng ở giao diện tối, rê chuột nền đỏ chữ trắng */
:is(.dialog-head [data-act=close-dialog],[data-media-close],.qd-x,[data-mv=close],button[aria-label="Xóa giá nhà cung cấp"]){display:inline-grid;place-items:center;min-width:36px;min-height:36px;padding:0 8px;border:1px solid transparent;border-radius:8px;background:transparent;color:#111827;font-size:26px;font-weight:400;line-height:1;cursor:pointer;transition:background .15s,color .15s}
:is(.dialog-head [data-act=close-dialog],[data-media-close],.qd-x,[data-mv=close],button[aria-label="Xóa giá nhà cung cấp"],.image-x):hover{border-color:#dc2626!important;background:#dc2626!important;color:#fff!important}
:is(.dialog-head [data-act=close-dialog],[data-media-close],.qd-x,[data-mv=close],button[aria-label="Xóa giá nhà cung cấp"],.image-x):focus-visible{outline:2px solid #98a2b3;outline-offset:2px}
.image-x{font-size:20px;line-height:1}
body.theme-dark :is(.dialog-head [data-act=close-dialog],[data-media-close],.qd-x,[data-mv=close],button[aria-label="Xóa giá nhà cung cấp"]){border-color:transparent;background:transparent;color:#fff}

/* Nút xoá liên kết (và các nút xoá dạng biểu tượng): màu chữ thường, rê chuột mới đỏ */
.icon-btn.danger{color:#344054}
body.theme-dark .icon-btn.danger{border-color:var(--d-line-2);color:#fff}
body.theme-dark .icon-btn.danger:hover,body.theme-dark .icon-btn.danger:focus-visible{border-color:#ff8a80;background:#4a1f1f;color:#ff8a80}
body.theme-dark .share-guest{color:#fff!important}
body.theme-dark .share-guest .solid-icon{color:#fff}

/* Chia sẻ: thư mục trống không hiện trong "Nội dung được xem" */
#share-form label.sub-empty{display:none}

/* "Đặt làm báo giá mẫu" nằm trong menu Thao tác */
.qa-panel .qt-flag.qa-item{border:0;background:none}
.qa-panel .qt-flag.qa-item.on{color:#b54708}
body.theme-dark .qa-panel .qt-flag.qa-item.on{color:#fcc96b}

/* Hợp đồng trong giao diện tối vẫn giống bản in */
body.theme-dark .qc-sheet .qc-table th{background:#f1f4f9;color:#1d283b;border-color:#98a2b3}
body.theme-dark .qc-sheet .qc-table td{background:#fff;color:#1d283b;border-color:#98a2b3}

/* Thư viện Media: nút tải ảnh cỡ vừa, nằm đầu thanh lọc */
#media-dialog .media-toolbar .native-file-row.media-upload-top{flex:none;order:-1;width:auto;margin:0;padding:0;border:0;gap:8px}
#media-dialog .media-upload-top .media-file-button{padding:7px 14px;font-size:14px;font-weight:600;box-shadow:none}
#media-dialog .media-upload-top .media-file-button .solid-icon{width:16px;height:16px;flex-basis:16px}
#media-dialog .media-upload-top [data-file-name]{max-width:180px;overflow:hidden;color:#667085;font-size:13px;text-overflow:ellipsis;white-space:nowrap}
body.theme-dark #media-dialog .media-upload-top [data-file-name]{color:var(--d-ink-3)}

/* Nhà cung cấp trong hộp sản phẩm: bỏ khoảng cách 14px dưới mỗi ô để danh sách gọn */
#record-form #supplier-rows .supplier-price-row>label{margin-bottom:0}
#record-form #supplier-rows .supplier-price-row{margin-bottom:6px}

/* Thêm ảnh bằng URL */
.media-url-toggle{display:inline-flex;align-items:center;gap:7px;padding:7px 12px;font-size:14px;font-weight:600;white-space:nowrap}
.media-url-toggle .solid-icon{width:16px;height:16px;flex-basis:16px}
.media-url-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 22px;border-bottom:1px solid #e0e5ec;background:#fff}
.media-url-row[hidden]{display:none}
.media-url-row .media-url-icon .solid-icon{width:18px;height:18px;flex-basis:18px;color:#667085}
.media-url-row input{flex:1;min-width:220px;margin:0}
.media-url-row button{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.media-url-row button .solid-icon{width:16px;height:16px;flex-basis:16px}
.media-url-row .inline-error{flex-basis:100%;margin:0}
.media-url-row .inline-error:empty{display:none}
#library-dropzone .media-url-toggle{margin-top:10px}
#library-dropzone .media-url-row{width:min(640px,100%);margin:12px auto 0;padding:10px;border:1px solid #d7dce5;border-radius:10px}
body.theme-dark .media-url-row{border-color:var(--d-line);background:var(--d-surface)}
body.theme-dark .media-url-row .media-url-icon .solid-icon{color:var(--d-ink-3)}

/* Thao tác → Xoá báo giá */
.qa-panel .qa-item.qa-danger,.qa-panel .qa-item.qa-danger .solid-icon{color:#d92d20}
.qa-panel .qa-item.qa-danger:hover,.qa-panel .qa-item.qa-danger:focus-visible{background:#fef3f2;color:#b42318}
.qa-panel .qa-item.qa-danger:hover .solid-icon{color:#b42318}
body.theme-dark .qa-panel .qa-item.qa-danger,body.theme-dark .qa-panel .qa-item.qa-danger .solid-icon{color:#ff9a90}
body.theme-dark .qa-panel .qa-item.qa-danger:hover{background:#4a1f1f;color:#ffd0ca;box-shadow:inset 3px 0 0 #ff8a80}
body.theme-dark .qa-panel .qa-item.qa-danger:hover .solid-icon{color:#ffd0ca}
