/* =========================================================================
   3MADS DASHBOARD — SaaS Design System
   Thay thế toàn bộ CSS cũ (style.css + <style> nội tuyến trong index.php).
   Giữ nguyên 100% class/id để không ảnh hưởng JS hiện có.
   ========================================================================= */

:root{
    --primary:#4f46e5;
    --primary-dark:#4338ca;
    --primary-light:#eef2ff;
    --primary-100:#e0e7ff;

    --success:#12b76a;
    --success-dark:#0d8a50;
    --success-light:#ecfdf3;
    --danger:#f04438;
    --danger-dark:#d92d20;
    --danger-light:#fef3f2;
    --warning:#f79009;
    --warning-light:#fffaeb;
    --info:#0ea5e9;

    --bg:#f5f6fa;
    --surface:#ffffff;
    --surface-alt:#f9fafb;
    --border:#e4e7ec;
    --border-strong:#d0d5dd;

    --text:#101828;
    --text-muted:#667085;
    --text-faint:#98a2b3;

    --radius-sm:8px;
    --radius-md:12px;
    --radius-lg:16px;
    --shadow-xs:0 1px 2px rgba(16,24,40,.06);
    --shadow-sm:0 2px 8px rgba(16,24,40,.06);
    --shadow-md:0 8px 24px rgba(16,24,40,.08);
    --shadow-lg:0 16px 48px rgba(16,24,40,.12);
}

*{box-sizing:border-box;margin:0;padding:0;}

body{
    font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    background:var(--bg);
    color:var(--text);
    padding:24px 16px;
    min-height:100vh;
    -webkit-font-smoothing:antialiased;
}

.container{max-width:1900px;margin:0 auto;background:transparent;border-radius:0;overflow:visible;box-shadow:none;}

.header{background:var(--surface);color:var(--text);padding:28px 24px;text-align:center;border-radius:var(--radius-lg);border:1px solid var(--border);box-shadow:var(--shadow-sm);margin-bottom:16px;}
.header h1{font-size:1.6rem;font-weight:700;letter-spacing:-.01em;}

/* TOP MENUBAR */
.top-menubar{display:flex;align-items:center;gap:12px;padding:12px 24px;background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--border);box-shadow:var(--shadow-sm);margin-bottom:16px;flex-wrap:wrap;}
.top-menubar .logo-img{height:40px;border-radius:6px;display:block;flex-shrink:0;}

.view-toggle-group{display:flex;border:1px solid var(--border-strong);border-radius:10px;overflow:hidden;flex-shrink:0;background:var(--surface-alt);}
.view-toggle-btn{padding:9px 18px;background:transparent;color:var(--text-muted);border:none;font-weight:600;font-size:13px;cursor:pointer;white-space:nowrap;font-family:inherit;transition:all .15s;}
.view-toggle-btn:hover{color:var(--primary);}
.view-toggle-btn.active{background:var(--primary);color:#fff;}
.view-toggle-btn+.view-toggle-btn{border-left:1px solid var(--border-strong);}

.menubar-btn{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-radius:10px;font-weight:600;font-size:13px;cursor:pointer;text-decoration:none;border:1px solid transparent;white-space:nowrap;transition:all .15s;font-family:inherit;}
.menubar-btn.danger{background:var(--danger-light);color:var(--danger-dark);border-color:#fecdca;}
.menubar-btn.danger:hover{background:var(--danger);color:#fff;border-color:var(--danger);}
.menubar-btn.extract{background:var(--success-light);color:var(--success-dark);border-color:#abefc6;}
.menubar-btn.extract:hover{background:var(--success);color:#fff;border-color:var(--success);}
.menubar-spacer{flex:1;}

@media(max-width:900px){
    .top-menubar{gap:8px;padding:10px 14px;}
    .menubar-btn,.view-toggle-btn{padding:8px 12px;font-size:12px;}
}

/* VÙNG ĐIỀU KHIỂN */
.control{padding:20px 24px;background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--border);box-shadow:var(--shadow-sm);text-align:center;display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:16px;}

select{padding:12px 16px;font-size:.95rem;border-radius:var(--radius-sm);border:1px solid var(--border-strong);background:var(--surface);width:100%;max-width:600px;color:var(--text);transition:border-color .15s,box-shadow .15s;}
select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-light);}

.company-name{padding:16px;background:var(--primary-light);color:var(--primary-dark);font-size:1.3rem;font-weight:700;text-align:center;border-radius:var(--radius-md);}

.extract-bar{padding:24px;background:var(--warning-light);text-align:center;border-bottom:1px solid var(--border);display:none;border-radius:var(--radius-md);}
.btn-extract{padding:13px 40px;font-size:1rem;background:var(--warning);color:#fff;border:none;border-radius:var(--radius-sm);cursor:pointer;font-weight:600;box-shadow:var(--shadow-sm);transition:all .15s;}
.btn-extract:hover{background:#dc7c00;transform:translateY(-1px);box-shadow:var(--shadow-md);}

.progress-bar{height:8px;background:var(--border);border-radius:8px;overflow:hidden;margin:16px auto;width:80%;}
.progress-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--success),#34d399);transition:width .6s;}

/* BẢNG DỮ LIỆU */
.table-wrapper{padding:20px;background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--border);box-shadow:var(--shadow-sm);overflow-x:auto;margin-bottom:16px;}

.table-controls{padding:0 0 16px;background:transparent;border-bottom:1px solid var(--border);margin-bottom:16px;display:none;align-items:center;justify-content:flex-start;gap:14px;flex-wrap:wrap;font-size:14px;}
.table-controls.show{display:flex;}
.table-controls #pagination{margin-left:auto;}
.table-controls > div:first-child{display:flex;align-items:center;gap:10px;white-space:nowrap;flex-shrink:0;}
#pageSize{min-width:80px;max-width:100px;padding:6px 8px;font-size:13px;text-align:center;border:1px solid var(--border-strong);border-radius:6px;}

table{width:100%;border-collapse:collapse;font-size:13.5px;min-width:1750px;background:var(--surface);border-radius:var(--radius-sm);overflow:hidden;}
thead{background:var(--surface-alt);color:var(--text);border-bottom:2px solid var(--border-strong);}
th{padding:13px 12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;text-align:center;font-size:11.5px;color:var(--text-muted);}
td{padding:13px 12px;border-bottom:1px solid var(--border);vertical-align:middle;}
td:nth-child(1), td:nth-child(2) { text-align:left !important; }
td:nth-child(n+3) { text-align:center !important; }
th:nth-child(1), th:nth-child(2) { text-align:left !important; }
th:nth-child(n+3) { text-align:center !important; }
tbody tr:hover {background:var(--surface-alt);}

th.sortable{cursor:pointer;position:relative;user-select:none;}
th.sortable::after{content:'\f0dc';font-family:'Font Awesome 6 Free';font-weight:900;margin-left:6px;opacity:0.35;font-size:0.9em;}
th.sortable.asc::after{content:'\f0de';opacity:1;color:var(--primary);}
th.sortable.desc::after{content:'\f0dd';opacity:1;color:var(--primary);}

.table-search-wrapper{display:flex;align-items:center;background:var(--surface-alt);padding:9px 16px;border-radius:var(--radius-sm);border:1px solid var(--border);margin:0;}
.table-search-wrapper i{color:var(--text-faint);margin-right:10px;}
#tableSearch{border:none;background:transparent;font-size:.95rem;width:340px;outline:none;color:var(--text);}
#tableSearch::placeholder{color:var(--text-faint);}
@media(max-width:768px){#tableSearch{width:200px;}}

.title-cell{font-weight:600;color:var(--text);max-width:520px;}
.title-row{display:inline-flex;align-items:center;gap:9px;width:100%;}
.type-icon{flex-shrink:0;font-size:1.05em;color:var(--text-muted);}
.title-link{color:var(--text);text-decoration:none;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0;}
.title-link:hover{color:var(--primary);text-decoration:underline;}
.title-missing{color:var(--danger);font-style:italic;font-weight:500;}
.web a{color:var(--primary-dark);font-weight:500;text-decoration:none;}
.web a:hover{text-decoration:underline;}
.status-icon{font-size:1.4em;}
.days{background:var(--warning-light);color:#b25000;padding:4px 12px;border-radius:20px;font-weight:600;font-size:12.5px;display:inline-block;min-width:50px;}
.region-count{font-weight:700;color:var(--primary-dark);}
.region-count.zero{color:var(--text-faint);}
.point-high{font-weight:700;color:var(--danger);font-size:1.15em;}

/* NÚT / TOAST / TICK */
#toast{position:fixed;top:20px;right:20px;padding:14px 22px;background:var(--success);color:white;border-radius:var(--radius-sm);font-weight:600;z-index:10000;opacity:0;transform:translateY(-20px);transition:all .3s;box-shadow:var(--shadow-lg);}
#toast.show{opacity:1;transform:translateY(0);}
#toast.error{background:var(--danger);}

.checkbox-wrapper{display:flex;align-items:center;gap:12px;background:var(--surface);padding:12px 18px;border-radius:var(--radius-sm);border:1px solid var(--border-strong);box-shadow:var(--shadow-xs);font-weight:600;color:var(--text);cursor:pointer;transition:all .15s;user-select:none;width:fit-content;}
.checkbox-wrapper:hover{border-color:var(--primary);}
.checkbox-wrapper input[type="checkbox"]{position:absolute;opacity:0;width:0;height:0;}
.checkbox-custom{width:20px;height:20px;border:2px solid var(--border-strong);border-radius:6px;background:var(--surface);position:relative;transition:all .15s;flex-shrink:0;}
.checkbox-custom::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg) scale(0);transition:all .15s;}
.checkbox-wrapper input[type="checkbox"]:checked + .checkbox-custom{background:var(--primary);border-color:var(--primary);}
.checkbox-wrapper input[type="checkbox"]:checked + .checkbox-custom::after{transform:rotate(45deg) scale(1);}
.checkbox-wrapper .label-text{font-size:.95rem;color:var(--primary-dark);}

#externalBtn{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;background:var(--primary);color:#fff;font-size:13px;font-weight:600;text-decoration:none;border-radius:var(--radius-sm);transition:all .15s;box-shadow:var(--shadow-xs);}
#externalBtn:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-sm);}

/* PHÂN TRANG */
#pagination{display:flex;justify-content:center;align-items:center;gap:6px;margin:16px 0;font-family:inherit;flex-wrap:wrap;}
#pagination span{margin-right:8px;font-size:13px;color:var(--text-muted);}
#pagination button{min-width:32px;height:32px;border-radius:var(--radius-sm);border:1px solid var(--border-strong);background:var(--surface);color:var(--text);font-size:13px;font-weight:500;cursor:pointer;transition:.15s;}
#pagination button:hover:not(:disabled){background:var(--primary-light);border-color:var(--primary);color:var(--primary-dark);}
#pagination button:active:not(:disabled){transform:scale(0.94);}
#pagination button[disabled]{background:var(--surface-alt);color:var(--text-faint);cursor:not-allowed;}
#pagination button.active{background:var(--primary) !important;color:white !important;border-color:var(--primary) !important;font-weight:600;}

.btn-paging-export{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;background:var(--success);color:white;border:none;border-radius:var(--radius-sm);font-weight:600;cursor:pointer;box-shadow:var(--shadow-xs);transition:all .15s;white-space:nowrap;}
.btn-paging-export:hover{background:var(--success-dark);transform:translateY(-1px);box-shadow:var(--shadow-sm);}
.btn-paging-export i{font-size:1.05em;}

#refreshDataBtn{margin-left:12px;padding:9px 14px;background:var(--surface);color:var(--text);border:1px solid var(--border-strong);border-radius:var(--radius-sm);cursor:pointer;font-size:.9rem;transition:.15s;}
#refreshDataBtn:hover{background:var(--surface-alt);border-color:var(--primary);color:var(--primary-dark);}

/* KEY MANAGER POPUP */
#keyManagerBtn{background:var(--primary);color:white;border:none;padding:11px 18px;border-radius:var(--radius-sm);font-size:14px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:10px;box-shadow:var(--shadow-xs);transition:all .15s;position:relative;}
#keyManagerBtn:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-sm);}
#keyManagerBtn:active{transform:translateY(0);}
#keyManagerBtn i{font-size:16px;transition:transform .3s ease;}
#keyManagerBtn:hover i{transform:rotate(60deg);}
#keyManagerBtn .count{background:var(--danger);color:white;font-size:11px;font-weight:bold;min-width:20px;height:20px;line-height:20px;border-radius:50%;display:inline-block;text-align:center;box-shadow:0 2px 6px rgba(240,68,56,.4);}

#keyPopup{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--surface);width:90%;max-width:600px;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:28px;display:none;z-index:1000;border:1px solid var(--border);}
#overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(16,24,40,.5);display:none;z-index:999;backdrop-filter:blur(2px);}
#keyPopup h3{margin:0 0 18px 0;font-size:19px;color:var(--text);font-weight:700;}
#keyPopup textarea{width:100%;height:320px;padding:14px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-family:'Courier New',monospace;font-size:13.5px;resize:vertical;box-sizing:border-box;}
#keyPopup textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-light);}

.popup-footer{margin-top:22px;text-align:right;}
.popup-footer .btn{padding:9px 20px;border:none;border-radius:var(--radius-sm);font-size:14px;font-weight:600;cursor:pointer;margin-left:10px;min-width:88px;transition:all .15s;}
.btn-cancel{background:var(--surface-alt);color:var(--text-muted);border:1px solid var(--border);}
.btn-cancel:hover{background:var(--border);}
.btn-save{background:var(--primary);color:white;}
.btn-save:hover{background:var(--primary-dark);}

/* LOG POPUP */
#logPopup{display:none;position:fixed;inset:0;width:92vw;max-width:900px;height:90vh;max-height:90vh;margin:auto;background:#0d1117;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);z-index:99999;flex-direction:column;font-family:system-ui,sans-serif;color:#fff;border:1px solid #21262d;}
#logPopup.show{display:flex !important;}
.popupHeader{padding:16px 22px;background:#161b22;border-bottom:1px solid #21262d;display:flex;justify-content:space-between;align-items:center;flex-shrink:0;border-radius:var(--radius-lg) var(--radius-lg) 0 0;}
#logPopupClose{cursor:pointer;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-size:20px;transition:.15s;}
#logPopupClose:hover{background:rgba(240,68,56,.3);}
#logPopupContent{flex:1;padding:0;background:#0d1117;overflow:hidden;}

#logWrapper{width:100%;height:100%;overflow:auto;padding:18px 22px;box-sizing:border-box;scrollbar-width:thin;scrollbar-color:#30363d #0d1117;}
#logWrapper::-webkit-scrollbar{width:9px;height:9px;}
#logWrapper::-webkit-scrollbar-track{background:transparent;border-radius:10px;}
#logWrapper::-webkit-scrollbar-track-piece{background:transparent;}
#logWrapper::-webkit-scrollbar-thumb{background:#30363d;border:2px solid #0d1117;border-radius:10px;}
#logWrapper::-webkit-scrollbar-thumb:hover{background:#484f58;}
#logWrapper::-webkit-scrollbar-corner{background:transparent;}

#logContent{margin:0;padding:0;font-family:Consolas,monospace;font-size:13.5px;line-height:1.55;color:#c9d1d9;white-space:pre;display:inline-block;min-width:max-content;user-select:text;}

.log-time{color:#7ee787;}
.log-id{color:#79c0ff;font-weight:bold;}
.log-title{color:#e3b341;}
.log-domain{color:#ff7b72;}
.log-separator{color:#484f58;}

@keyframes popupFadeIn{from{opacity:0;transform:translate(-50%,-50%) scale(0.96);}to{opacity:1;transform:translate(-50%,-50%) scale(1);}}

#LogGenmini{display:inline-flex;align-items:center;gap:10px;padding:11px 22px;background:var(--primary);color:#fff;font-size:14.5px;font-weight:600;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all .15s;box-shadow:var(--shadow-xs);}
#LogGenmini i{font-size:16px;}
#LogGenmini:hover{background:var(--primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-sm);}
#LogGenmini:active{transform:translateY(0);}

/* MINI WIDGET (chọn AR / Domain) */
.ar-mini-widget{width:100%;max-width:900px;background:var(--surface);border-radius:var(--radius-md);border:1px solid var(--border-strong);box-shadow:var(--shadow-xs);overflow:hidden;margin-top:4px;}
.ar-mini-header{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--surface-alt);border-bottom:1px solid var(--border);}
.ar-mini-export-btn{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;background:var(--success);color:white;border:none;border-radius:var(--radius-sm);font-weight:600;cursor:pointer;font-size:12.5px;white-space:nowrap;transition:.15s;}
.ar-mini-export-btn:hover{background:var(--success-dark);}
.ar-mini-search{flex:1;display:flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius-sm);padding:6px 12px;}
.ar-mini-search i{color:var(--text-faint);}
.ar-mini-search input{border:none;outline:none;flex:1;font-size:13.5px;background:transparent;color:var(--text);}
.ar-mini-scroll{max-height:190px;overflow-y:auto;}
.ar-mini-scroll table{width:100%;border-collapse:collapse;font-size:12.5px;min-width:0;box-shadow:none;border-radius:0;}
.ar-mini-scroll thead th{position:sticky;top:0;background:var(--primary);color:white;padding:8px 10px;font-size:11px;z-index:1;}
.ar-mini-scroll tbody td{padding:8px 10px;border-bottom:1px solid var(--border);white-space:nowrap;}
.ar-mini-scroll tbody tr{cursor:pointer;}
.ar-mini-scroll tbody tr:hover{background:var(--surface-alt);}
.ar-mini-scroll tbody tr.active{background:var(--primary-light);font-weight:700;}
.ar-mini-scroll .ar-company-cell{max-width:220px;overflow:hidden;text-overflow:ellipsis;}
.ar-mini-scroll .ar-pct{font-weight:700;}
.ar-mini-scroll .ar-pct.high{color:var(--success);}
.ar-mini-scroll .ar-pct.mid{color:var(--warning);}
.ar-mini-scroll .ar-pct.low{color:var(--danger);}
.ar-mini-empty{padding:22px;text-align:center;color:var(--text-faint);}

/* BỘ LỌC TRẠNG THÁI */
.status-filter-group{display:flex;gap:8px;flex-shrink:0;}
.status-filter-btn{padding:8px 14px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text-muted);border-radius:var(--radius-sm);font-weight:600;font-size:12.5px;cursor:pointer;white-space:nowrap;transition:all .15s;}
.status-filter-btn:hover{border-color:var(--primary);color:var(--primary-dark);}
.status-filter-btn.active{background:var(--primary);border-color:var(--primary);color:white;}

/* NÚT PHỤ (ẩn cột / sửa prompt) */
.btn-secondary-action{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;background:#eef0ff;color:#4338ca;border:1px solid #d6d9ff;border-radius:var(--radius-sm);font-weight:600;cursor:pointer;font-size:12.5px;white-space:nowrap;transition:all .15s;}
.btn-secondary-action:hover{background:#6366f1;color:#fff;border-color:#6366f1;}
.btn-secondary-action.prompt-btn{background:var(--warning-light);color:#b25000;border-color:#fde3b5;}
.btn-secondary-action.prompt-btn:hover{background:var(--warning);color:#fff;border-color:var(--warning);}

/* CỘT GHI CHÚ */
.note-cell{white-space:nowrap;}
.note-text{margin-right:6px;}
.note-edit-icon{color:var(--primary);cursor:pointer;opacity:.7;transition:opacity .15s;}
.note-edit-icon:hover{opacity:1;}
.note-save-icon{color:var(--success);cursor:pointer;opacity:.85;margin-left:6px;transition:opacity .15s;}
.note-save-icon:hover{opacity:1;}
.note-cancel-icon{color:var(--danger);cursor:pointer;opacity:.85;margin-left:6px;transition:opacity .15s;}
.note-cancel-icon:hover{opacity:1;}
.note-input{padding:6px 8px;border:1px solid var(--primary);border-radius:6px;font-size:12.5px;width:150px;}

/* CỘT HÀNH ĐỘNG */
.action-btn{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:none;border-radius:var(--radius-sm);font-size:12px;font-weight:600;cursor:pointer;margin:0 3px;color:white;transition:.15s;}
.action-open{background:var(--primary);}
.action-open:hover{background:var(--primary-dark);}
.action-gpt{background:#10a37f;}
.action-gpt:hover{background:#0d8c6c;}

/* POPUP CHUNG */
.popup-panel{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--surface);width:90%;max-width:480px;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:26px;display:none;z-index:1000;max-height:80vh;overflow-y:auto;border:1px solid var(--border);}
.popup-panel h3{margin:0 0 16px 0;font-size:19px;color:var(--text);font-weight:700;}
#colCheckList{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
#colCheckList label{display:flex;align-items:center;gap:8px;font-size:13.5px;cursor:pointer;color:var(--text);}
#promptTextarea{width:100%;height:140px;padding:14px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);font-size:13.5px;resize:vertical;box-sizing:border-box;}
#promptTextarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-light);}
.prompt-hint{font-size:12px;color:var(--text-faint);margin-top:8px;}

/* THẺ CÔNG TY (chế độ AR) */
.company-card{width:100%;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin:16px 0;overflow:hidden;animation:companyCardIn .2s ease;}
@keyframes companyCardIn{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:translateY(0);}}
.company-card-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 22px;background:var(--surface-alt);border-bottom:1px solid var(--border);flex-wrap:wrap;}
.company-card-title{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700;color:var(--text);}
.company-card-title i{color:var(--primary);font-size:14px;background:var(--primary-light);padding:8px;border-radius:8px;}
.company-card-updated{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--text-faint);white-space:nowrap;}
.company-card-updated i{color:var(--text-faint);font-size:11px;}
.company-card-body{display:flex;flex-wrap:wrap;}
.company-card-col{flex:1;min-width:220px;padding:18px 22px;}
.company-card-col+.company-card-col{border-left:1px solid var(--border);}
.company-card-label{font-size:11px;font-weight:700;color:var(--text-faint);letter-spacing:.06em;margin-bottom:8px;text-transform:uppercase;}
.company-card-value{font-size:24px;font-weight:800;color:var(--primary-dark);line-height:1.2;}
.company-card-status{display:flex;align-items:center;gap:22px;flex-wrap:wrap;}
.company-card-status .status-item{display:flex;flex-direction:column;gap:2px;}
.company-card-status .status-item .num{font-size:21px;font-weight:800;line-height:1.2;}
.company-card-status .status-item .lbl{font-size:11.5px;font-weight:600;color:var(--text-faint);}
.company-card-status .status-item.running .num{color:var(--success);}
.company-card-status .status-item.stopped .num{color:var(--danger);}
.company-card-status .status-item .pct-badge{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:20px;background:var(--success-light);color:var(--success-dark);font-size:11.5px;font-weight:700;}
@media(max-width:700px){.company-card-col+.company-card-col{border-left:none;border-top:1px solid var(--border);}.company-card-body{flex-direction:column;}}

/* THẺ DOMAIN (chế độ Website) */
.domain-card{width:100%;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);margin:16px 0;padding:16px 22px;animation:companyCardIn .2s ease;}
.domain-card-title{font-size:15px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px;}
.domain-card-title i{color:var(--primary);}
.domain-card-sub{font-size:12px;color:var(--text-muted);margin:4px 0 14px;}
.domain-stat-grid{display:flex;gap:10px;flex-wrap:wrap;}
.domain-stat-box{flex:1;min-width:220px;background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px;}
.domain-stat-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;}
.domain-stat-header span:first-child{font-weight:700;font-size:13px;color:var(--text);}
.domain-badge{font-size:12px;font-weight:700;padding:4px 12px;border-radius:999px;white-space:nowrap;}
.domain-badge.green{background:var(--success-light);color:var(--success-dark);}
.domain-badge.blue{background:var(--primary-light);color:var(--primary-dark);}
.domain-stat-row{display:flex;text-align:center;}
.domain-stat-item{flex:1;}
.domain-stat-item+.domain-stat-item{border-left:1px solid var(--border);}
.domain-stat-item .lbl{font-size:10.5px;color:var(--text-faint);}
.domain-stat-item .val{font-size:24px;font-weight:700;color:var(--text);}
.domain-stat-item .val.running{color:var(--success);}
.domain-stat-item .val.stopped{color:var(--danger);}
@media(max-width:700px){.domain-stat-grid{flex-direction:column;}}
/* ===== KHUNG BAO CHO TABLE CONTROLS ===== */
.table-controls {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    background: #fff;
    border: 1px solid #e3e6ea;
    border-radius: 14px;
    padding: 14px 18px;
    margin-bottom: 16px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

/* Cụm "Hiển thị ... mục" */
.table-controls > div:first-child {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #5f6368;
    font-size: 14px;
    white-space: nowrap;
}
.table-controls select#pageSize {
    border: 1px solid #dadce0;
    border-radius: 8px;
    padding: 6px 10px;
    font-size: 14px;
    background: #f8f9fa;
    cursor: pointer;
}

/* Cụm nút Tất cả / Đang chạy / Đã dừng — gom thành 1 pill-group */
.status-filter-group {
    display: flex;
    gap: 4px;
    background: #f1f3f4;
    padding: 4px;
    border-radius: 10px;
}
.status-filter-btn {
    border: none;
    background: transparent;
    padding: 7px 14px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #5f6368;
    cursor: pointer;
    transition: .15s;
    white-space: nowrap;
}
.status-filter-btn:hover { background: #e2e5e8; }
.status-filter-btn.active {
    background: #1967d2;
    color: #fff;
    box-shadow: 0 1px 3px rgba(25,103,210,.4);
}

/* Các nút hành động: Xuất xlsx / Chọn cột / Sửa Prompt — đồng bộ 1 kiểu, phân biệt bằng màu nhạt */
.btn-paging-export,
.btn-secondary-action {
    border: 1px solid #dadce0;
    background: #fff;
    color: #3c4043;
    border-radius: 8px;
    padding: 7px 14px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    transition: .15s;
}
.btn-paging-export {
    background: #0f9d58;
    color: #fff;
    border-color: #0f9d58;
}
.btn-paging-export:hover { background: #0c8043; }
.btn-secondary-action:hover { background: #f1f3f4; }
.prompt-btn {
    color: #b06000;
    background: #fff8ec;
    border-color: #f6d9a0;
}
.prompt-btn:hover { background: #fdefd6; }

/* Ô tìm kiếm — bo tròn, nền xám nhạt, chiếm khoảng trống còn lại */
.table-search-wrapper {
    flex: 1 1 220px;
    min-width: 200px;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #dadce0;
    border-radius: 8px;
    padding: 7px 12px;
    background: #f8f9fa;
}
.table-search-wrapper i { color: #9aa0a6; font-size: 13px; }
.table-search-wrapper input {
    border: none;
    outline: none;
    background: transparent;
    width: 100%;
    font-size: 14px;
}

/* Phân trang — đẩy sang phải, style nút số trang gọn hơn */
#pagination {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    font-size: 13px;
    color: #5f6368;
    white-space: nowrap;
}
#pagination button {
    border: 1px solid #dadce0;
    background: #fff;
    border-radius: 6px;
    min-width: 30px;
    height: 30px;
    cursor: pointer;
    transition: .15s;
}
#pagination button:hover:not(:disabled) { background: #f1f3f4; }
#pagination button:disabled { opacity: .4; cursor: default; }
/* ===== NÚT COPY CR_ID / COPY AR ID (top-menubar) ===== */
#btnCopyCrId,
#btnCopyAr {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 16px;
    border-radius: 9px;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    border: 1px solid #b3d1fb;
    background: #eaf2fe;
    color: #1967d2;
    transition: background .15s, border-color .15s, transform .1s;
}
#btnCopyCrId i,
#btnCopyAr i {
    font-size: 12px;
}
#btnCopyCrId:hover,
#btnCopyAr:hover {
    background: #d9e8fd;
    border-color: #8fb8f7;
}
#btnCopyCrId:active,
#btnCopyAr:active {
    transform: scale(0.97);
}

/* Trạng thái "đã copy" — bật tạm class .copied bằng JS sau khi copy thành công để tạo phản hồi trực quan */
#btnCopyCrId.copied,
#btnCopyAr.copied {
    background: #e6f6ea;
    border-color: #9adfae;
    color: #0f9d58;
}