/* v0.22.0: chia sẻ, Quản lý liên kết, cấu hình tải lên, lưu nháp, form Sản phẩm. */
.share-item.current{border-color:var(--brand,#1f5fbf);background:#f5f8ff}
.share-item.highlight{animation:share-flash 1.6s ease-out}
@keyframes share-flash{0%,35%{box-shadow:0 0 0 4px color-mix(in srgb,var(--brand,#1f5fbf) 45%,transparent);background:#eaf1fb}100%{box-shadow:none}}
.share-chip{padding:1px 8px;border-radius:999px;background:#f2f4f7;color:#344054;font-size:12px;white-space:nowrap}
.share-chip.no-dl,.sl-no-dl{background:#fef3f2;color:#b42318}
.sl-no-dl{padding:1px 8px;border-radius:999px;font-size:12px;font-weight:600}
.share-mode .share-mode-state{font-style:normal;font-size:12px;font-weight:600;color:#667085}
.share-mode.used .share-mode-state{color:var(--brand,#1f5fbf)}
.share-form legend small{font-weight:400}
.share-flags{display:flex;flex-wrap:wrap;gap:18px}
/* Quản lý liên kết */
.sl-tools{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.sl-tools input{flex:1 1 260px;margin:0}
.sl-tools select{flex:0 0 200px;margin:0}
.sl-group+.sl-group{margin-top:20px}
.sl-group h3{display:flex;align-items:center;gap:8px;margin:0 0 8px;font-size:16px}
.sl-group h3 .solid-icon{width:18px;height:18px;color:var(--brand,#1f5fbf)}
.sl-group h3 em{font-style:normal;font-size:12px;font-weight:600;color:#667085;background:#f2f4f7;border-radius:999px;padding:1px 8px}
.sl-table td{vertical-align:top}
.sl-url{display:flex;gap:6px;flex-wrap:wrap}
.sl-url .small{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.sl-url .solid-icon{width:14px;height:14px}
/* Cấu hình tải lên */
.upload-table{margin:10px 0 14px}
.upload-table td{vertical-align:middle}
.upload-table input[type=number]{max-width:130px;margin:0}
.upload-table .switch{margin:0}
.upload-locked{color:#b42318}
/* Lưu nháp: danh sách cần xử lý */
.draft-issues{display:grid;gap:6px;margin:12px 0;padding-left:22px}
.draft-issues li{padding:6px 8px;border-radius:6px;background:#fff6f5;color:#912018}
/* Form Sản phẩm: "Thêm nhà cung cấp" thuộc khối nhà cung cấp, "Lưu dữ liệu" tách riêng bên phải */
#record-form .supplier-editor{display:grid;gap:8px;justify-items:start;padding-top:4px}
#record-form .supplier-editor>h3,#record-form .supplier-editor>p,#record-form .supplier-editor>#supplier-rows{justify-self:stretch;margin:0}
#record-form fieldset>button.primary{display:block;margin:20px 0 0 auto;min-width:140px}
#record-form fieldset>.grid+button.primary{border-top:0}
/* Popup kéo được bằng thanh tiêu đề */
dialog[open] .dialog-head,dialog[open]>h2:first-child,dialog[open]>h3:first-child,dialog[open]>form>h2:first-child{cursor:move;user-select:none;touch-action:none}
dialog[open] .dialog-head button{cursor:pointer}
dialog.dialog-dragging{box-shadow:0 24px 60px #10182859;transition:none}
body:has(dialog.dialog-dragging){cursor:move;user-select:none}
/* v0.22.1: Tải xuống tệp — hai lựa chọn rõ ràng */
.share-download .share-dl{display:inline-flex;flex-wrap:wrap;gap:8px}
.share-dl label{display:inline-flex!important;align-items:center;margin:0;cursor:pointer}
.share-dl input{position:absolute;opacity:0;width:1px;height:1px}
.share-dl label>span{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--line,#d0d5dd);border-radius:8px;background:#fff;font-weight:600;color:#344054}
.share-dl label>span .solid-icon{width:16px;height:16px}
.share-dl input:focus-visible+span{outline:2px solid var(--brand,#1f5fbf);outline-offset:2px}
.share-dl label.on:first-child>span{border-color:#12b76a;background:#ecfdf3;color:#067647}
.share-dl label.on:last-child>span{border-color:#f04438;background:#fef3f2;color:#b42318}
.share-download .hint{margin:4px 0 0}
/* v0.22.1: Quản lý liên kết → Xem nhanh */
.sl-name{display:inline-flex;align-items:flex-start;gap:6px;padding:0;border:0;background:none;color:var(--brand,#1f5fbf);font:inherit;text-align:left;cursor:pointer}
.sl-name strong{text-decoration:underline;text-underline-offset:3px}
.sl-name .solid-icon{width:16px;height:16px;flex:none;margin-top:2px}
.sl-name:hover strong{color:#1849a9}
#dialog.sl-preview-dialog{width:min(1200px,calc(100vw - 32px))}
.sl-preview-info{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:10px}
.sl-preview-info .share-open{margin-left:auto;display:inline-flex;align-items:center;gap:6px}
.sl-preview-info .solid-icon{width:14px;height:14px}
.sl-preview{display:block;width:100%;height:min(72vh,760px);border:1px solid #e4e7ec;border-radius:10px;background:#f5f7fa}
/* v0.22.1: Xem ảnh lớn (Thư viện ảnh) — ảnh luôn vừa khung khi mở / Vừa khung, không bị cắt */
.media-viewer .mv-stage{min-height:0}
.media-viewer .mv-img{position:absolute;inset:0;margin:auto;width:auto;height:auto;max-width:calc(100% - 140px);max-height:calc(100% - 44px)}
.media-viewer .mv-stage.zoomed .mv-img{max-width:calc(100% - 140px)}
@media (max-width:640px){.media-viewer .mv-img{max-width:calc(100% - 24px)}}
/* v0.22.2: Quản lý liên kết — chọn nhiều, nút trong Xem nhanh */
.sl-bulk{position:sticky;top:64px;z-index:5;margin:0 0 12px}
.sl-bulk .small{display:inline-flex;align-items:center;gap:6px}
.sl-bulk .solid-icon{width:14px;height:14px}
.sl-table tr.selected td{background:#f5f8ff}
.sl-preview-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 10px}
.sl-preview-actions .small{display:inline-flex;align-items:center;gap:6px}
.sl-preview-actions .solid-icon{width:14px;height:14px}
.sl-preview-actions .share-open{margin-left:auto}
.sl-preview-actions button:disabled{opacity:.45;cursor:not-allowed}
/* v0.22.4: chọn liên kết để sửa, đổi cách xem cho chính link đó */
#share-box .share-item{cursor:pointer}
#share-box .share-item:not(.current):hover{border-color:#98a2b3;background:#fcfcfd}
.share-editing{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:10px 12px;border:1px solid color-mix(in srgb,var(--brand,#1f5fbf) 35%,transparent);border-radius:8px;background:#f5f8ff}
.share-editing .solid-icon{width:16px;height:16px;color:var(--brand,#1f5fbf)}
.share-editing code{font-size:12px;padding:2px 6px;border-radius:4px;background:#fff;border:1px solid #e4e7ec;overflow-wrap:anywhere}
.share-editing .hint{flex-basis:100%}
.share-mode.picked{border-color:var(--brand,#1f5fbf);box-shadow:0 0 0 1px var(--brand,#1f5fbf)}
.share-mode-conflict{margin:4px 0 0;padding:8px 10px;border-radius:8px;background:#fffaeb;border:1px solid #fedf89;color:#93370d;font-size:13px}
.share-replace{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px;color:#912018}
/* v0.22.5: Danh mục — bấm vào dòng để xem / sửa, chọn nhiều để xoá */
.catalog-clickable tbody tr[data-record-row]{cursor:pointer}
.catalog-clickable tbody tr[data-record-row]:hover td{background:#f5f8ff}
.catalog-clickable tbody tr[data-record-row]:focus-visible{outline:2px solid var(--brand,#1f5fbf);outline-offset:-2px}
.catalog-clickable tbody tr.selected td{background:#eaf1fb}
.catalog-clickable .qm-check{width:40px}
.catalog-bulk{margin:0 0 10px}
.catalog-bulk .small{display:inline-flex;align-items:center;gap:6px}
.catalog-bulk .solid-icon{width:14px;height:14px}
.catalog-delete-failed{display:grid;gap:6px;margin:8px 0 14px;padding-left:20px}
.catalog-delete-failed li{padding:6px 8px;border-radius:6px;background:#fff6f5;color:#912018}
/* v0.22.5: số điện thoại khách trong Tất cả báo giá (che, bấm mắt để xem) */
.qm-phone{display:flex;align-items:center;gap:4px}
.qm-phone-num{font-variant-numeric:tabular-nums;letter-spacing:.02em}
.qm-phone-eye{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin-left:auto;padding:0;border:0;border-radius:4px;background:none;color:#98a2b3;cursor:pointer}
.qm-phone-eye .solid-icon{width:14px;height:14px}
.qm-phone-eye:hover,.qm-phone.revealed .qm-phone-eye{color:var(--brand,#1f5fbf);background:#eaf1fb}
/* v0.22.5: gợi ý Esc trên mọi thanh "Đã chọn" */
.bulk-bar:not([hidden]){flex-wrap:wrap}
.bulk-bar::after{content:"Esc để bỏ chọn";margin-left:auto;padding-left:8px;font-size:12px;color:#667085;white-space:nowrap}
/* v0.22.6: tìm kiếm đầu trang — thông tin phụ cùng dòng với tên */
.suggest-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;min-width:0}
.suggest-line strong{font-size:14px}
.suggest-phone,.suggest-email,.suggest-code{color:#475467;font-size:13px}
.suggest-phone{font-variant-numeric:tabular-nums;letter-spacing:.02em}
.suggest-phone::before,.suggest-email::before,.suggest-price::before,.suggest-code::before{content:"·";margin-right:10px;color:#98a2b3}
.suggest-price{color:#d92d20;font-weight:700;font-size:13px;font-variant-numeric:tabular-nums}
/* v0.22.6: giữ tên · SĐT · email trên đúng một dòng; email / mã dài thì rút gọn bằng … */
.suggest-line{flex-wrap:nowrap;white-space:nowrap}
.suggest-line strong{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.suggest-line .suggest-phone,.suggest-line .suggest-price{flex:none}
.suggest-line .suggest-email,.suggest-line .suggest-code{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
/* tên luôn hiện đủ, chỉ email / mã co lại */
.suggest-line strong{flex:0 0 auto;max-width:60%}
/* v0.22.7: Chọn mẫu nhanh theo báo giá mẫu */
#dialog.qt-dialog{width:min(860px,calc(100vw - 32px))}
.qt-tabs{display:flex;gap:6px;margin:0 0 12px;border-bottom:1px solid #eaecf0}
.qt-tabs button{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:0;border-bottom:2px solid transparent;border-radius:0;background:none;font-weight:600;color:#475467;cursor:pointer}
.qt-tabs button[aria-selected=true]{border-bottom-color:var(--brand,#1f5fbf);color:var(--brand,#1f5fbf)}
.qt-tabs .solid-icon{width:16px;height:16px}
.qt-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:10px}
.qt-tools input[type=search]{flex:1 1 280px;margin:0}
.qt-all{display:inline-flex!important;align-items:center;gap:6px;margin:0;white-space:nowrap}
.qt-list{display:grid;gap:8px;max-height:min(58vh,560px);overflow:auto;padding:2px}
.qt-item{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border:1px solid #e4e7ec;border-radius:10px;background:#fff;text-align:left;color:inherit;cursor:pointer}
.qt-item:hover,.qt-item:focus-visible{border-color:var(--brand,#1f5fbf);background:#f5f8ff}
.qt-thumb{flex:none;width:56px;height:44px;border-radius:6px;object-fit:cover;background:#f2f4f7;display:flex;align-items:center;justify-content:center;color:#98a2b3}
.qt-thumb .solid-icon{width:20px;height:20px}
.qt-info{display:grid;gap:2px;min-width:0}
.qt-title{display:flex;align-items:center;gap:8px;min-width:0}
.qt-title strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qt-info small{color:#667085;font-size:12px}
.qt-info small b{color:#d92d20}
.qt-badge{flex:none;padding:1px 8px;border-radius:999px;background:#ecfdf3;color:#067647;font-size:11px;font-weight:700}
.qt-back{display:inline-flex;align-items:center;gap:6px;margin-bottom:8px}
.qt-back .solid-icon{width:14px;height:14px;transform:rotate(90deg)}
.qt-preview-title{margin:4px 0 10px}
.qt-preview td,.qt-preview th{vertical-align:top}
.qt-preview .r{text-align:right;white-space:nowrap}
.qt-preview tfoot td{font-weight:700}
.qt-flag{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.qt-flag .solid-icon{width:16px;height:16px}
.qt-flag.on{border-color:#12b76a;color:#067647;background:#ecfdf3}
#dialog.qt-dialog .dialog-head h2{display:flex;align-items:center;gap:8px}
/* v0.22.8: Danh mục — hover màu thương hiệu */
.catalog-clickable tbody tr[data-record-row]:hover td{background:color-mix(in srgb,var(--brand,#1f5fbf) 10%,#fff)}
.catalog-clickable tbody tr[data-record-row]:hover td:first-child{box-shadow:inset 3px 0 0 var(--brand,#1f5fbf)}
.catalog-clickable tbody tr[data-record-row]:hover .catalog-name strong{color:var(--brand,#1f5fbf)}
.catalog-clickable tbody tr.selected:hover td{background:color-mix(in srgb,var(--brand,#1f5fbf) 16%,#fff)}
/* Thư viện căn hộ — Lưới / Danh sách */
.explorer-crumbs{flex-wrap:wrap}
.lib-view{display:inline-flex;margin-left:auto;border:1px solid #d0d5dd;border-radius:8px;overflow:hidden}
.lib-view button{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:0;border-radius:0;background:#fff;color:#475467;font-size:13px;cursor:pointer}
.lib-view button+button{border-left:1px solid #d0d5dd}
.lib-view button[aria-pressed=true]{background:var(--brand,#1f5fbf);color:#fff}
.lib-view .solid-icon{width:14px;height:14px}
.folder-list tbody tr{cursor:pointer}
.folder-list tbody tr:hover td{background:color-mix(in srgb,var(--brand,#1f5fbf) 10%,#fff)}
.folder-list tbody tr:hover strong{color:var(--brand,#1f5fbf)}
.folder-list .r{text-align:right}
.folder-list-name{display:inline-flex;align-items:center;gap:8px}
.folder-list-name .solid-icon{width:18px;height:18px;color:#f5a524}
/* Chia sẻ — số tệp mỗi thư mục */
.share-form .sub-count{margin-left:4px;font-style:normal;color:#475467;font-size:12px;font-weight:600}
.share-form label.sub-empty{color:#98a2b3}
.share-form label.sub-empty .sub-count{color:#b42318;font-weight:500}
.share-guest{border-color:#fedf89!important;color:#93370d!important;background:#fffaeb}
/* Ghi chú hướng dẫn trong dấu ? */
.help-q{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;min-width:18px;margin:0 0 0 6px;padding:0;border:1px solid #98a2b3;border-radius:50%;background:#fff;color:#475467;font:700 11px/1 system-ui,Arial,sans-serif;vertical-align:middle;cursor:help}
.help-q:hover,.help-q:focus-visible{border-color:var(--brand,#1f5fbf);background:var(--brand,#1f5fbf);color:#fff}
h1 .help-q{width:20px;height:20px;font-size:12px;vertical-align:4px}
.help-inline{margin:2px 0}
.help-tip{position:fixed;z-index:2147483000;padding:10px 12px;border-radius:8px;background:#1d2433;color:#f2f4f7;font-size:13px;line-height:1.5;font-weight:400;box-shadow:0 12px 32px #10182840;pointer-events:none;text-align:left;white-space:normal}
.help-tip b,.help-tip strong{color:#fff}
.page-head .muted:empty{display:none}
.help-q::before{content:"?"}
.help-label{display:inline-flex;align-items:center;gap:0}
