/*
Theme Name: KQXS Wiki
Theme URI: https://kqxs.wiki/
Author: KQXS.wiki
Description: Giao diện kết quả xổ số 3 miền cho KQXS.wiki (dùng kèm plugin KQXS Core).
Version: 1.1.2
Requires PHP: 8.0
Text Domain: kqxswiki
*/
:root{--red:#C8101A;--red2:#E3161D;--dred:#8E0B11;--gold:#F5A700;--gold2:#FFD54A;--ink:#1d1d1f;--muted:#666;--line:#dcdcdc;--bg:#f1f2f4;--card:#fff;--head:#5f6368}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
a{color:#0b57d0;text-decoration:none}a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
.container{max-width:1180px;margin:0 auto;padding:0 10px}

/* Header */
.kq-header{background:#fff}
.kq-hd{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px}
.kq-logo img{display:block;height:64px;width:auto}
.kq-hd-right{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.kq-today{font-size:14px;color:var(--muted)}.kq-today b{color:var(--red)}
.kq-search{display:flex}.kq-search input{border:1px solid var(--line);border-right:0;padding:7px 10px;width:190px;border-radius:4px 0 0 4px;font-size:14px}
.kq-search button{background:var(--gold);border:0;color:#3a2600;font-weight:700;padding:0 14px;border-radius:0 4px 4px 0;cursor:pointer}
.kq-navtoggle{display:none;background:var(--red);color:#fff;border:0;font-size:22px;border-radius:6px;width:44px;height:40px;cursor:pointer}
.kq-nav{background:linear-gradient(#E3161D,#C8101A);border-bottom:3px solid var(--gold)}
.kq-menu{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap}
.kq-menu>li{position:relative}
.kq-menu>li>a{display:block;color:#fff;font-weight:700;padding:11px 15px;border-right:1px solid rgba(255,255,255,.18);font-size:15px}
.kq-menu>li>a:hover,.kq-menu>li:hover>a{background:var(--dred);text-decoration:none}
.kq-menu>li.live>a:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--gold2);margin-right:6px;animation:blink 1s infinite}
.kq-menu .sub,.kq-menu .sub-menu{display:none;position:absolute;left:0;top:100%;background:#fff;min-width:220px;list-style:none;margin:0;padding:6px 0;box-shadow:0 8px 24px rgba(0,0,0,.15);z-index:50;border-top:3px solid var(--gold)}
.kq-menu li:hover>.sub,.kq-menu li:hover>.sub-menu{display:block}
.kq-menu .sub a,.kq-menu .sub-menu a{display:block;padding:7px 14px;color:var(--ink)}
.kq-menu .sub a:hover,.kq-menu .sub-menu a:hover{background:#fff4f4;color:var(--red);text-decoration:none}
.kq-quick{display:none}
@keyframes blink{50%{opacity:.25}}

/* Layout */
.kq-wrap{display:flex;gap:10px;align-items:flex-start;margin-top:10px}
.kq-left{flex:0 0 200px}.kq-right{flex:0 0 280px}
.kq-main{flex:1;min-width:0;background:var(--card);padding:12px;border-radius:6px}
.sbox{background:#fff;margin-bottom:10px;border-radius:6px;overflow:hidden}
.sbox-h{background:var(--red);color:#fff;font-weight:700;padding:9px 12px;text-transform:uppercase;font-size:14px}
.sbox ul{list-style:none;margin:0;padding:6px 10px}
.sbox li{padding:3px 0;font-size:14.5px}.sbox li a{color:var(--ink)}.sbox li a:hover{color:var(--red)}
.sbox ul.lich li{padding:5px 0;border-bottom:1px dashed #eee}.sbox ul.lich a{color:#0b57d0}
.sbox .more{display:block;padding:0 12px 10px;font-size:13px}

.kq-bc{font-size:13px;color:var(--muted);margin-bottom:8px}.kq-bc a{color:var(--muted)}
.kq-h1{font-size:22px;line-height:1.3;margin:4px 0 12px;text-align:center;color:var(--ink)}
.kq-lead{background:#fffbea;border-left:4px solid var(--gold);padding:8px 12px;border-radius:4px}
.kq-notice{background:#fff3f3;border:1px solid #ffc9c9;color:#a30d12;padding:9px 12px;border-radius:6px;margin:8px 0;font-weight:600}
.kq-notice.win{background:#effbef;border-color:#9bd89b;color:#136b13}
.kq-empty{color:var(--muted);text-align:center;padding:20px}
.kq-note{font-size:13px;color:var(--muted);font-style:italic}

/* Tabs / chips */
.kq-tabs{display:flex;gap:6px;justify-content:center;margin:0 0 10px}
.kq-tabs a{padding:6px 16px;border-radius:20px;background:#f3f3f3;color:var(--ink);font-weight:700}
.kq-tabs a.on,.kq-tabs a:hover{background:var(--red);color:#fff;text-decoration:none}
.kq-chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 10px}
.kq-chips a,.kq-chips span{background:#f5f5f7;border:1px solid #e5e5e5;border-radius:4px;padding:4px 9px;font-size:14px;color:var(--ink)}
.kq-chips span{font-weight:700;color:var(--red)}.kq-chips small{color:var(--muted);font-weight:400}
.kq-linkbox{margin-top:14px}
.kq-subtitle{font-weight:700;background:var(--head);color:#fff;padding:7px 10px;text-align:center}
.kq-hub{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.kq-hub a{display:block;padding:14px;border:1px solid var(--line);border-radius:6px;font-weight:700;color:var(--ink);background:#fafafa}
.kq-hub a:hover{border-color:var(--red);color:var(--red);text-decoration:none}

/* Result box */
.kq-box{margin:0 0 18px;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.kq-title{margin:0;background:linear-gradient(#6b7075,#55595e);color:#fff;font-size:18px;text-align:center;padding:9px 8px;font-weight:700}
.kq-title a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.kq-scroll{overflow-x:auto}
.kq-table{width:100%;border-collapse:collapse;background:#fff}
.kq-table th,.kq-table td{border:1px solid var(--line);padding:6px 4px;text-align:center;vertical-align:middle}
.kq-table thead th{background:#f7f7f7;font-weight:700}
.kq-table td:first-child{color:var(--muted);font-size:13.5px;width:70px}
.kq-mb td:first-child{width:78px}
.kq-mb .nums{display:grid;gap:2px 6px;grid-template-columns:repeat(var(--c,1),1fr)}
.kq-mb .nums.c2{--c:2}.kq-mb .nums.c3{--c:3}.kq-mb .nums.c4{--c:4}.kq-mb .nums.c6{--c:3}.kq-mb .nums.c7{--c:4}
.n{display:inline-block;font-weight:700;font-size:23px;letter-spacing:.5px;color:#111;line-height:1.35;font-variant-numeric:tabular-nums}
.n.db{color:var(--red);font-size:28px}.n.g8{color:var(--red);font-size:26px}
.p-g7 .n{color:#111}.kq-mb .p-g7 .n{color:var(--red)}
.n.new{animation:pop 1.2s ease}
@keyframes pop{0%{background:var(--gold2);transform:scale(1.2)}100%{background:transparent;transform:none}}
.n.wait{width:40px;height:22px;position:relative}
.n.wait i{position:absolute;left:50%;top:50%;width:18px;height:18px;margin:-9px;border:3px solid #eee;border-top-color:var(--red);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.kq-multi thead th{font-size:16px;color:var(--red)}
.kq-multi thead th a{color:var(--red)}
.kq-multi thead th small{display:block;font-size:11.5px;color:var(--muted);font-weight:400}
.kq-multi .nums{display:flex;flex-direction:column;align-items:center}
.kq-multi{table-layout:fixed}.kq-multi th:first-child,.kq-multi td:first-child{width:52px}
.kq-loto .kq-dd{table-layout:fixed}.kq-loto .kq-dd th:first-child{width:50px}
.kq-multi .n{font-size:21px}.kq-multi .n.db{font-size:24px}
.kq-code td{font-size:13px}.kq-code td:last-child{color:var(--dred);font-weight:600}
.kq-tools{display:flex;align-items:center;gap:14px;background:#8a4b12;color:#fff;padding:6px 10px;font-size:14px}
.kq-tools label{cursor:pointer;display:flex;align-items:center;gap:4px}
.kq-zoom{margin-left:auto;background:none;border:0;color:#fff;cursor:pointer;font-size:14px}
.kq-box.kq-zoomed .n{font-size:34px}.kq-box.kq-zoomed .n.db{font-size:40px}

/* Loto */
.kq-loto .kq-subtitle{margin-top:0}
.loto-grid{display:grid;grid-template-columns:repeat(9,1fr);border-left:1px solid var(--line);border-top:1px solid var(--line)}
.loto-grid span{border-right:1px solid var(--line);border-bottom:1px solid var(--line);text-align:center;padding:6px 0;font-weight:700;font-size:19px}
.loto-grid span.db,.kq-dd b.db{color:var(--red)}
.kq-dd thead th{background:var(--head);color:#fff}
.kq-dd td{font-weight:600;font-size:16px}.kq-dd td.dh{color:var(--red);font-weight:700;width:50px}

/* Date nav */
.kq-datenav{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:0 0 12px;flex-wrap:wrap}
.kq-datenav a{background:#f3f3f3;padding:6px 12px;border-radius:4px;color:var(--ink);font-weight:600}
.kq-datenav input{padding:6px 8px;border:1px solid var(--line);border-radius:4px;font-size:15px}

/* Forms & stats */
.kq-form{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;background:#fafafa;border:1px solid var(--line);border-radius:6px;padding:10px;margin-bottom:12px}
.kq-form label{display:flex;flex-direction:column;font-size:13px;color:var(--muted);gap:3px}
.kq-form select,.kq-form input{padding:7px 8px;border:1px solid #ccc;border-radius:4px;font-size:15px;min-width:120px}
.kq-form button{background:var(--red);color:#fff;border:0;border-radius:4px;padding:9px 18px;font-weight:700;cursor:pointer}
.kq-grid100{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;margin:8px 0}
.kq-grid100 div{text-align:center;border:1px solid var(--line);border-radius:4px;padding:4px 2px;background:rgba(200,16,26,calc(var(--w)*.55));line-height:1.2}
.kq-grid100 b{display:block;font-size:17px}.kq-grid100 span{display:block;font-size:12px}.kq-grid100 small{font-size:11px;color:#333}
.kq-heat td{font-size:13px}.kq-heat .h1{background:#fff1d6}.kq-heat .h2{background:#ffd98a}.kq-heat .h3{background:#ffb35c}.kq-heat .h4,.kq-heat .h5{background:#ff7b5c;color:#fff}
.kq-dbtable td{font-size:15px;font-weight:600;padding:5px 2px}.kq-dbtable td b{color:var(--red)}.kq-dbtable td small{display:block;font-size:10.5px;color:#999;font-weight:400}.kq-dbtable td a{color:var(--ink)}
.kq-sokq td.db,.kq-table td.db{color:var(--red);font-weight:700}.kq-sokq td.small{font-size:13px;text-align:left}
.kq-lich tr.today{background:#fffbea}.kq-lich td{text-align:left;padding:8px}
.kq-mini-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}

/* Content */
.kq-content{margin-top:16px;line-height:1.7}
.kq-content h2{font-size:19px;color:var(--dred);border-left:4px solid var(--gold);padding-left:8px}
.kq-content h3{font-size:17px}
.kq-content table{border-collapse:collapse;width:100%}.kq-content td,.kq-content th{border:1px solid var(--line);padding:6px}
.kq-meta{color:var(--muted);font-size:13px;text-align:center;margin-top:-6px}
.kq-posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.kq-post{border:1px solid var(--line);border-radius:6px;overflow:hidden}.kq-post img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.kq-post h2{font-size:16px;margin:8px 10px;color:var(--ink)}.kq-post p{margin:0 10px 10px;font-size:14px;color:var(--muted)}
.kq-pages,.nav-links{display:flex;gap:4px;justify-content:center;margin:12px 0}
.kq-pages a,.kq-pages span,.nav-links a,.nav-links span{padding:6px 11px;border:1px solid var(--line);border-radius:4px;color:var(--ink)}
.kq-pages span,.nav-links .current{background:var(--red);color:#fff;border-color:var(--red)}

/* Footer */
.kq-footer{background:#2a0406;color:#e8d9d9;margin-top:20px;border-top:4px solid var(--gold)}
.kq-ft{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:18px;padding:24px 10px}
.ft-col b{display:block;color:#fff;margin-bottom:8px}.ft-col a,.ft-col li{display:block;color:#e8d9d9;padding:2px 0;font-size:14px;list-style:none}
.ft-col p{font-size:14px}
.kq-copy{text-align:center;font-size:13px;padding:10px;background:#1c0203;color:#bfaaaa}

/* Responsive */
@media (max-width:1100px){.kq-left{display:none}}
@media (max-width:860px){
  .kq-wrap{flex-direction:column}.kq-right{flex:auto;width:100%}
  .kq-main{width:100%;padding:8px;border-radius:0}
  .kq-hd-right{display:none}.kq-navtoggle{display:block}
  .kq-logo img{height:48px}
  .kq-nav{display:none}.nav-open .kq-nav{display:block}
  .kq-menu{flex-direction:column}.kq-menu>li>a{border-right:0;border-bottom:1px solid rgba(255,255,255,.15)}
  .kq-menu .sub,.kq-menu .sub-menu{position:static;box-shadow:none;display:none;border:0}
  .kq-menu li:hover>.sub{display:none}.nav-open .kq-menu li.has-sub:focus-within>.sub{display:block}
  .kq-quick{display:flex;gap:6px;overflow-x:auto;padding:8px 10px;background:#fff;border-top:1px solid #eee}
  .kq-quick a{flex:0 0 auto;background:#fff1f1;color:var(--red);font-weight:700;padding:6px 12px;border-radius:16px;font-size:14px}
  .kq-ft{grid-template-columns:1fr 1fr}
  .container{padding:0 6px}
}
@media (max-width:520px){
  .kq-h1{font-size:19px}.kq-title{font-size:16px}
  .n{font-size:20px}.n.db{font-size:24px}.kq-multi .n{font-size:18px}.kq-multi .n.db{font-size:19px}
  .kq-multi.cols-4 .n{font-size:16.5px}.kq-multi.cols-4 .n.db{font-size:16.5px}.kq-multi.cols-4 thead th{font-size:14px}
  .kq-table td:first-child{width:46px;font-size:12px}
  .loto-grid{grid-template-columns:repeat(6,1fr)}.loto-grid span{font-size:17px}
  .kq-grid100{grid-template-columns:repeat(5,1fr)}
  .kq-mini-stats{grid-template-columns:1fr}
  .kq-tools{gap:10px;font-size:13px}
}
.kq-single .p-g7 .n{color:#111}

/* v1.1: heading phụ, tóm tắt, FAQ, Vietlott, quay thử */
.kq-h2{font-size:18px;margin:18px 0 8px;color:var(--dred);border-left:4px solid var(--gold);padding-left:8px}
h3.kq-subtitle{margin:0;font-size:15px}
.kq-summary{background:#fffdf5;border:1px solid #f3e3b0;border-radius:6px;padding:4px 14px 8px;margin:-6px 0 18px}
.kq-summary .kq-h2{margin-top:10px}.kq-summary ul{margin:4px 0;padding-left:20px}.kq-summary .db{color:var(--red)}
.kq-faq details{border:1px solid var(--line);border-radius:6px;margin:6px 0;background:#fff}
.kq-faq summary{cursor:pointer;padding:10px 12px;font-weight:700;list-style:none}
.kq-faq summary::-webkit-details-marker{display:none}
.kq-faq summary:before{content:"+";display:inline-block;width:18px;color:var(--red);font-weight:900}
.kq-faq details[open] summary:before{content:"−"}
.kq-faq details>div{padding:0 12px 10px 30px;line-height:1.65}
.vl-balls{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;padding:14px 8px;background:#fff}
.vl-balls .ball{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:19px;color:#fff;background:radial-gradient(circle at 35% 30%,#ff5a5f,#C8101A 60%,#8E0B11);box-shadow:0 2px 4px rgba(0,0,0,.2)}
.vl-balls .ball.sp{background:radial-gradient(circle at 35% 30%,#ffe27a,#F5A700 60%,#b67800);color:#3a2600}
.vl-power .vl-balls .ball:not(.sp){background:radial-gradient(circle at 35% 30%,#ff8a3d,#e0590b 60%,#9b3a05)}
.kq-title small{font-weight:400;font-size:13px;opacity:.85}
.vl-prizes td{font-size:14px}.vl-prizes td.db{font-weight:700}
.vl-grid{grid-template-columns:repeat(9,1fr)}
.qt-tabs button{padding:7px 16px;border-radius:20px;background:#f3f3f3;border:0;font-weight:700;cursor:pointer;font-size:14px}
.qt-tabs button.on{background:var(--red);color:#fff}
.qt-act{text-align:center;padding:10px;background:#fafafa}
.qt-run{background:var(--gold);border:0;border-radius:24px;padding:10px 26px;font-weight:800;font-size:16px;cursor:pointer;color:#3a2600}
.n.qt{color:#bbb}.n.qt.done{color:#111}.n.qt.db.done{color:var(--red)}
.kq-datenav .cur{font-weight:700}
@media (max-width:520px){.vl-balls .ball{width:40px;height:40px;font-size:17px}.vl-grid{grid-template-columns:repeat(5,1fr)}}

.ft-menu{margin:0;padding:0;list-style:none}
.kq-content a,.kq-lead a,.kq-faq a,.kq-summary a{text-decoration:underline;text-underline-offset:2px}
