/* SEOTH — kiểu dáng phần nội dung Dashboard SEO (khung + đăng nhập ở index.html).
   Chuẩn bảng công cụ nội bộ ĐVP: đơn sắc teal, tên in đậm, cột số căn phải. */

.hop{background:#fff;border:1px solid var(--vien);border-radius:12px;
  padding:16px 18px;margin-bottom:16px}
.hop h2{margin:0 0 8px;font-size:15.5px;color:var(--teal-dam)}
.chu-nho{font-size:12.5px;color:var(--xam)}
.nhat{color:#a6b0ba}
.xanh{color:var(--xanh)}
.do{color:var(--do)}
.phai{text-align:right}
.hai-cot{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:16px}
.hai-cot .hop{margin-bottom:0}
.hai-cot{margin-bottom:16px}
.nut-p{border:1px solid var(--vien);background:#fff;border-radius:8px;padding:7px 13px;
  font-size:13px;font-weight:600;color:var(--teal-dam)}
.nut-p:hover{background:#f0f9fa}
.nut-p:disabled{opacity:.55;cursor:wait}
.nut-xoa{color:var(--do)}

/* Thẻ số */
.day-the{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:12px;margin-bottom:16px}
.the{background:#fff;border:1px solid var(--vien);border-radius:12px;padding:13px 15px}
.the-nhan{font-size:12px;color:var(--xam);font-weight:600;text-transform:uppercase;
  letter-spacing:.3px}
.the-so{font-size:26px;font-weight:800;color:var(--teal-dam);line-height:1.25}
.the-phu{font-size:11.5px;color:var(--xam)}
.the-ta{border-top:3px solid var(--teal)}
.the-ta .the-so{color:var(--teal)}
.the-dt{border-top:3px solid var(--cam-dam)}
.the-dt .the-so{color:var(--cam-dam)}

/* Bảng */
.bang{width:100%;border-collapse:collapse;font-size:13.5px}
.bang th{background:#f3f7f8;color:var(--teal-dam);font-size:12px;text-transform:uppercase;
  letter-spacing:.3px;padding:8px 10px;text-align:left;border-bottom:2px solid var(--vien);
  white-space:nowrap}
.bang th.phai{text-align:right}
.bang th[data-cot]{cursor:pointer}
.bang th[data-cot]:hover{background:#e8f2f4}
.bang td{padding:7px 10px;border-bottom:1px solid #eef2f5;vertical-align:middle}
.bang tr:hover td{background:#fafcfc}
.bang tr.mo td{opacity:.5}
.cuon-ngang{overflow-x:auto}
.bang-tk{min-width:980px}
.nhan-nhom{background:#eef6f7;color:var(--teal-dam);border-radius:12px;
  padding:2px 9px;font-size:11.5px;font-weight:600;white-space:nowrap}
.nhan-tat{background:#f4e8e8;color:var(--do);border-radius:10px;padding:1px 7px;
  font-size:10.5px;font-weight:700}
.o-link{white-space:nowrap}
.link-nho{display:inline-block;background:#f3f7f8;border-radius:10px;padding:2px 9px;
  font-size:11.5px;font-weight:600;color:var(--teal-dam);text-decoration:none;margin-right:4px}
.link-nho:hover{background:var(--teal);color:#fff}

/* Thanh lọc tab từ khoá */
.thanh-loc-tk{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.thanh-loc-tk input,.thanh-loc-tk select{padding:8px 11px;border:1px solid var(--vien);
  border-radius:8px;background:#fff}
.thanh-loc-tk input{flex:1;min-width:200px}
.thanh-loc-tk .chu-nho{margin-left:auto}

/* Biểu đồ đường */
.bieu-do{width:100%;height:auto;display:block}
.bd-luoi{stroke:#eef2f5;stroke-width:1}
.bd-chu{font-size:10.5px;fill:var(--xam)}
.bd-duong{fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.bd-ta{stroke:var(--teal)}
.bd-dt{stroke:var(--cam-dam)}
.bd-cham-ta{fill:var(--teal)}
.bd-cham-dt{fill:var(--cam-dam)}

/* Sparkline */
.spark{width:120px;height:28px;display:block}
.spark path{fill:none;stroke:var(--teal);stroke-width:1.8;stroke-linecap:round}
.spark circle{fill:var(--cam-dam)}

/* Tab quản lý */
#manQuanLy textarea{width:100%;padding:10px 12px;border:1px solid var(--vien);
  border-radius:9px;resize:vertical;margin-bottom:10px}
#manQuanLy code{background:#f3f7f8;border-radius:5px;padding:1px 6px;font-size:12px}
.o-cau-hinh{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-bottom:14px}
.o-cau-hinh label{display:flex;flex-direction:column;gap:4px;font-size:12.5px;
  font-weight:600;color:var(--xam)}
.o-cau-hinh input{padding:8px 11px;border:1px solid var(--vien);border-radius:8px}
.dong-ho{margin-top:6px}
.thanh-credit{height:10px;background:#eef2f5;border-radius:6px;overflow:hidden;margin-top:6px}
.thanh-credit div{height:100%;background:linear-gradient(90deg,var(--teal),var(--cam));
  border-radius:6px}
#bangQL input[type=text],#bangQL input:not([type]),#bangQL select{padding:5px 8px;
  border:1px solid var(--vien);border-radius:7px;font-size:12.5px;max-width:150px}

@media(max-width:640px){
  .the-so{font-size:21px}
  .bang{font-size:12.5px}
}