/* embed.css — [04/08] Lớp phủ cho bản NHÚNG của AI Log Analyzer trong Tool GEO.
 *
 * ⚠ Cùng luật với embed-shim.js: mọi khác biệt của bản nhúng nằm ở ĐÂY, `static/*` và thân
 * `index.html` giữ nguyên để lần sau cập nhật tool chỉ cần chép đè.
 *
 * VÌ SAO CẦN: tool khai `darkMode: [selector, [data-theme=dark]]` cho Tailwind nhưng KHÔNG có
 * bảng màu tối thật — nền body và .card là CSS sáng cố định. Nhúng nguyên vào dashboard đang ở
 * theme tối thì khung tối bọc lấy một ruột trắng chói. Ở đây chép đúng token màu của dashboard
 * (tokens.css) — hằng số, không phải var(), vì trang tĩnh này nằm ngoài cây CSS của Next.
 *
 * Chỉ áp khi <html data-theme="dark"> (shim đặt theo dashboard). Theme sáng giữ nguyên bản gốc.
 */

/* Nền + chữ nền tảng */
html[data-theme="dark"] body{background:#0B0F16!important;color:#E6EBF2}
html[data-theme="dark"] .card,
html[data-theme="dark"] .bg-white{background:#131822!important;border:1px solid #262E3C;box-shadow:none!important}
html[data-theme="dark"] .bg-slate-50,
html[data-theme="dark"] .bg-gray-50,
html[data-theme="dark"] .bg-navy-50,
html[data-theme="dark"] .bg-blue-50{background:#171D28!important}
html[data-theme="dark"] .bg-slate-100,
html[data-theme="dark"] .bg-gray-100{background:#1E2531!important}

/* Chữ: xám tối của tool đọc không nổi trên nền tối */
html[data-theme="dark"] .text-slate-900,
html[data-theme="dark"] .text-gray-900,
html[data-theme="dark"] .text-slate-800,
html[data-theme="dark"] .text-gray-800{color:#E6EBF2!important}
html[data-theme="dark"] .text-slate-700,
html[data-theme="dark"] .text-gray-700,
html[data-theme="dark"] .text-slate-600,
html[data-theme="dark"] .text-gray-600{color:#C3CCD9!important}
html[data-theme="dark"] .text-slate-500,
html[data-theme="dark"] .text-gray-500,
html[data-theme="dark"] .text-slate-400{color:#97A1B0!important}
/* Xanh thương hiệu #004AEF quá tối trên nền #0B0F16 (tương phản < 3:1) — dùng bậc sáng như dashboard */
html[data-theme="dark"] .text-navy-500,
html[data-theme="dark"] .text-navy-600,
html[data-theme="dark"] .text-navy-700,
html[data-theme="dark"] .text-blue-600{color:#2F7AFF!important}

/* Viền */
html[data-theme="dark"] .border,
html[data-theme="dark"] .border-slate-200,
html[data-theme="dark"] .border-gray-200,
html[data-theme="dark"] .border-navy-100{border-color:#262E3C!important}

/* Bảng dữ liệu — đầu bảng dính (sticky) nên nền phải đục, không được trong suốt */
html[data-theme="dark"] .data-table th{background:#171D28!important;color:#2F7AFF!important;border-bottom-color:#262E3C!important}
html[data-theme="dark"] .data-table td{color:#C3CCD9!important;border-bottom-color:#202634!important}
html[data-theme="dark"] .data-table tbody tr:hover{background:#171D28!important}

/* Khu kéo-thả + ô nhập */
html[data-theme="dark"] .drop-zone{border-color:#2A3E76!important}
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea{background:#131822!important;color:#E6EBF2!important;border-color:#262E3C!important}

/* Bỏ lề/nền thừa của tool: khung ngoài (dashboard) đã có nền và lề riêng */
html[data-theme="dark"] .header-gradient,
html[data-theme="dark"] .footer-gradient{background:#131822!important}