/*
Theme Name:   TienVIP
Theme URI:    https://tienvip.com
Description:  Child theme của GeneratePress cho TienVIP – tra cứu tỷ giá & chuyển đổi tiền tệ. Giao diện theo thiết kế i4/.
Author:       TienVIP
Template:     generatepress
Version:      1.0.0
Requires PHP: 7.4
Text Domain:  tienvip
*/

/* =========================================================
   Tokens (light / dark) – đồng bộ biến màu của GeneratePress
   ========================================================= */
:root{
  --bg:#f4f7fb; --surface:#ffffff; --surface-2:#f6f8fb; --line:#e3e8ef;
  --ink:#0f1f33; --ink-2:#4a5a6e; --ink-3:#7b8898;
  --green:#14995a; --green-2:#0f7d49; --green-soft:#e6f6ed;
  --red:#e0453a; --navy:#071a33; --navy-2:#0b2a52;
  --shadow:0 1px 2px rgba(15,31,51,.06),0 6px 20px rgba(15,31,51,.06);
  --tv-font:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --tv-header-h:72px;
  --tv-admin-h:0px;

  /* Biến màu toàn cục của GeneratePress → tokens TienVIP */
  --contrast:var(--ink); --contrast-2:var(--ink-2); --contrast-3:var(--ink-3);
  --base:var(--line); --base-2:var(--bg); --base-3:var(--surface);
  --accent:var(--green);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0b1220; --surface:#121b2b; --surface-2:#172235; --line:#24324a;
    --ink:#e8eef6; --ink-2:#a9b6c7; --ink-3:#7d8ba0;
    --green:#22b46c; --green-2:#1c9a5c; --green-soft:#12301f;
    --shadow:0 1px 2px rgba(0,0,0,.3),0 6px 20px rgba(0,0,0,.25);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0b1220; --surface:#121b2b; --surface-2:#172235; --line:#24324a;
  --ink:#e8eef6; --ink-2:#a9b6c7; --ink-3:#7d8ba0;
  --green:#22b46c; --green-2:#1c9a5c; --green-soft:#12301f;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 6px 20px rgba(0,0,0,.25);
  color-scheme:dark;
}
body.admin-bar{--tv-admin-h:32px}
@media (max-width:782px){body.admin-bar{--tv-admin-h:46px}}
@media (max-width:600px){body.admin-bar{--tv-admin-h:0px}}

html{scroll-padding-top:calc(var(--tv-header-h) + var(--tv-admin-h) + 12px)}
body,button,input,select,textarea{font-family:var(--tv-font)}
body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}
:focus-visible{outline:2px solid var(--green);outline-offset:2px}

/* =========================================================
   Khối dùng chung cho header / trang chủ / footer
   ========================================================= */
.tv-header,.tv-main,.tv-footer{font-size:15px;line-height:1.55}
.tv-header a,.tv-main a,.tv-footer a{color:inherit;text-decoration:none}
.tv-header button,.tv-main button,.tv-footer button{padding:0;line-height:1.3;font-weight:inherit;font-size:inherit}
.tv-header svg,.tv-main svg,.tv-footer svg{max-width:100%}
.tv-header .wrap,.tv-main .wrap,.tv-footer .wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.tv-main h1,.tv-main h2,.tv-main h3,.tv-footer h4{color:inherit;font-family:inherit}

/* Logo */
.logo{display:flex;align-items:center;gap:10px;flex-shrink:1;min-width:0}
.logo b{font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1}
.logo b span{color:var(--green)}
.logo small{display:block;font-size:11.5px;color:var(--ink-3);margin-top:3px}
.logo .logo-img{display:block;max-height:48px;max-width:100%;width:auto;height:auto;object-fit:contain}

/* =========================================================
   Header
   ========================================================= */
.tv-header{position:sticky;top:var(--tv-admin-h);z-index:100;background:var(--surface);border-bottom:1px solid var(--line);color:var(--ink)}
.tv-header .wrap{display:flex;align-items:center;gap:28px;height:var(--tv-header-h)}
.tv-header .nav{display:flex;gap:4px;flex:1}
.tv-header .nav a{padding:8px 12px;font-weight:500;font-size:14.5px;color:var(--ink-2);border-radius:8px;position:relative}
.tv-header .nav a:hover{color:var(--ink)}
.tv-header .nav a.on{color:var(--green);font-weight:600}
.tv-header .nav a.on::after{content:"";position:absolute;left:12px;right:12px;bottom:-15px;height:2px;background:var(--green)}
.tv-header .search{display:flex;gap:8px;align-items:center;margin:0}
.tv-header .search label{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:0 12px;height:40px;background:var(--surface-2);width:200px;color:var(--ink-3)}
.tv-header .search input{border:0;background:none;outline:none;width:100%;font-size:14px;padding:0;color:var(--ink)}
.tv-header .search button{width:40px;height:40px;border:0;border-radius:10px;background:var(--green);color:#fff;display:grid;place-items:center;cursor:pointer}
.tv-header .search button:hover{background:var(--green-2)}
.tv-header .burger{flex-shrink:0;display:none;margin-left:auto;width:40px;height:40px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);cursor:pointer}
.tv-header .theme-toggle{width:40px;height:40px;flex-shrink:0;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);color:var(--ink-2);display:grid;place-items:center;cursor:pointer;margin-left:-18px}
.tv-header .theme-toggle:hover{color:var(--green);border-color:var(--green);background:var(--surface-2)}
.tv-header .theme-toggle .i-sun{display:none}
:root[data-theme="dark"] .tv-header .theme-toggle .i-sun{display:block}
:root[data-theme="dark"] .tv-header .theme-toggle .i-moon{display:none}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .tv-header .theme-toggle .i-sun{display:block}
  :root:not([data-theme="light"]) .tv-header .theme-toggle .i-moon{display:none}
}

/* =========================================================
   Trang chủ – Hero + widget quy đổi
   ========================================================= */
.tv-main{display:block}
.tv-main .hero{background:radial-gradient(1200px 600px at 75% 30%,#13457f 0%,transparent 60%),linear-gradient(120deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;position:relative;overflow:hidden}
.tv-main .hero .globe{position:absolute;right:-120px;top:-80px;width:720px;max-width:none;opacity:.55;pointer-events:none}
.tv-main .hero .wrap{position:relative;display:grid;grid-template-columns:1.05fr 1fr;gap:40px;padding-top:56px;padding-bottom:56px;align-items:center}
.tv-main .kicker{color:#3fd68a;font-weight:700;font-size:13px;margin:0 0 12px}
.tv-main .hero h1{font-size:clamp(32px,4.4vw,50px);line-height:1.12;letter-spacing:-.025em;margin:0 0 18px;font-weight:800}
.tv-main .hero p.lead{color:#c9d6e8;font-size:17px;max-width:520px;margin:0 0 32px}
.tv-main .feats{display:flex;gap:26px;flex-wrap:wrap}
.tv-main .feat{display:flex;gap:10px;align-items:center}
.tv-main .feat i{width:38px;height:38px;border-radius:10px;background:rgba(34,180,108,.18);display:grid;place-items:center;color:#3fd68a;flex-shrink:0}
.tv-main .feat b{display:block;font-size:14px}
.tv-main .feat span{font-size:12.5px;color:#a9bcd6}

.tv-main .cvt{background:var(--surface);color:var(--ink);border-radius:16px;padding:10px 14px 14px;box-shadow:0 20px 50px rgba(0,0,0,.35);min-width:0}
.tv-main .tabs{display:grid;grid-template-columns:repeat(3,1fr);background:var(--surface-2);border-radius:10px;padding:4px;gap:4px;margin-bottom:16px}
.tv-main .tabs button{border:0;background:none;padding:9px 6px;border-radius:8px;font-size:13.5px;font-weight:500;color:var(--ink-2);cursor:pointer}
.tv-main .tabs button[aria-selected="true"]{background:var(--green);color:#fff;font-weight:600}
.tv-main .panel[hidden]{display:none}
.tv-main .fl{font-size:13px;font-weight:600;margin:0 0 6px;display:block}
.tv-main .amount{width:100%;height:50px;border:1px solid var(--line);border-radius:10px;padding:0 14px;font-size:20px;font-weight:600;background:var(--surface);color:var(--ink);outline:none}
.tv-main .amount:focus{border-color:var(--green)}
.tv-main .quick{display:flex;gap:6px;margin:10px 0 16px;flex-wrap:wrap}
.tv-main .quick button{border:1px solid var(--line);background:var(--surface-2);border-radius:7px;padding:4px 14px;font-size:12.5px;cursor:pointer;color:var(--ink-2)}
.tv-main .quick button:hover{border-color:var(--green);color:var(--green)}
.tv-main .pair{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:end}
.tv-main .sel{position:relative;display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;height:54px;padding:0 12px;background:var(--surface)}
.tv-main .sel:focus-within{border-color:var(--green)}
.tv-main .sel .fg{line-height:0}
.tv-main .sel .meta b{display:block;font-size:14px;line-height:1.2}
.tv-main .sel .meta span{font-size:12px;color:var(--ink-3)}
.tv-main .sel select{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.tv-main .sel .chev{margin-left:auto;color:var(--ink-3)}
.tv-main .swap{width:40px;height:40px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);cursor:pointer;display:grid;place-items:center;margin-bottom:7px;color:var(--ink-2);transition:transform .25s}
.tv-main .swap:hover{color:var(--green);border-color:var(--green);background:var(--surface-2)}
.tv-main .swap.spin{transform:rotate(180deg)}
.tv-main .result{margin-top:16px;background:linear-gradient(135deg,#16a862,#0f8a4f);color:#fff;border-radius:12px;padding:16px;text-align:center}
.tv-main .result small{font-size:12.5px;opacity:.85}
.tv-main .result strong{display:block;font-size:clamp(22px,3vw,30px);font-weight:800;letter-spacing:-.01em;margin:2px 0;word-break:break-word}
.tv-main .result em{font-style:normal;font-size:12.5px;opacity:.85}
.tv-main .wfoot{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:12px;color:var(--ink-3);margin-top:12px}

.tv-main .rtable{width:100%;border-collapse:collapse;border:0;margin:0;font-size:13.5px}
.tv-main .rtable th{text-align:right;font-weight:600;color:var(--ink-3);font-size:12px;padding:6px 8px;border:0;border-bottom:1px solid var(--line)}
.tv-main .rtable th:first-child,.tv-main .rtable td:first-child{text-align:left}
.tv-main .rtable td{text-align:right;padding:8px;border:0;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
.tv-main .rtable td:first-child{display:flex;align-items:center;gap:8px;font-weight:600}
.tv-main .rtable abbr{text-decoration:none;border:0;cursor:help}
.tv-main .chart-msg{margin:0;padding:60px 10px;text-align:center;color:var(--ink-3);font-size:13.5px}
.tv-main .tscroll{max-height:330px;overflow:auto}

.tv-main .crow{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:10px}
.tv-main .mini-sel{border:1px solid var(--line);border-radius:8px;height:36px;padding:0 10px;background:var(--surface);color:var(--ink);width:auto}
.tv-main .ranges{display:flex;gap:4px;background:var(--surface-2);padding:3px;border-radius:8px}
.tv-main .ranges button{border:0;background:none;padding:5px 10px;border-radius:6px;font-size:12.5px;cursor:pointer;color:var(--ink-2)}
.tv-main .ranges button.on{background:var(--surface);color:var(--green);font-weight:600;box-shadow:var(--shadow)}
.tv-main .bigval{font-size:24px;font-weight:800;letter-spacing:-.01em}
.tv-main .bigval span{font-size:13px;font-weight:600;margin-left:6px}
.tv-main .chartbox{position:relative}
.tv-main .chartbox svg{display:block;width:100%;height:auto}
.tv-main .tip{position:absolute;pointer-events:none;background:var(--ink);color:var(--surface);font-size:12px;padding:5px 8px;border-radius:6px;white-space:nowrap;transform:translate(-50%,-120%);opacity:0;transition:opacity .1s}

/* =========================================================
   Trang chủ – Các section
   ========================================================= */
.tv-main section.blk{padding:44px 0}
.tv-main section.blk.alt{background:var(--surface)}
.tv-main .shead{display:flex;align-items:center;gap:14px;margin-bottom:22px}
.tv-main .shead .ic{width:48px;height:48px;border-radius:50%;background:var(--green-soft);display:grid;place-items:center;color:var(--green);flex-shrink:0}
.tv-main .shead h2{margin:0;font-size:22px;font-weight:700;letter-spacing:-.015em;line-height:1.25}
.tv-main .shead p{margin:2px 0 0;color:var(--ink-3);font-size:13.5px}
.tv-main .more{margin-left:auto;border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:8px 16px;font-size:13px;font-weight:500;white-space:nowrap}
.tv-main .more:hover{border-color:var(--green);color:var(--green)}

.tv-main .grid6{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.tv-main .rcard{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;display:block}
.tv-main .rcard:hover{border-color:var(--green)}
.tv-main .rcard .h{display:flex;align-items:center;gap:10px}
.tv-main .rcard .h b{display:block;font-size:14px;line-height:1.2}
.tv-main .rcard .h span{font-size:12px;color:var(--ink-3)}
.tv-main .rcard .val{font-size:21px;font-weight:800;margin:12px 0 0;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.tv-main .chg{font-size:12.5px;font-weight:600}
.tv-main .up{color:var(--green)}
.tv-main .down{color:var(--red)}
.tv-main .spark{display:block;width:100%;height:44px;margin-top:6px}

.tv-main .ccard{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.tv-main .ccard .scene{height:104px;position:relative;display:grid;place-items:center;overflow:hidden}
.tv-main .ccard .scene-img,.tv-main .art .cover>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s}
.tv-main .ccard:hover .scene-img,.tv-main .art:hover .cover>img{transform:scale(1.05)}
.tv-main .sym{font-size:64px;font-weight:800;color:rgba(255,255,255,.9);text-shadow:0 4px 20px rgba(0,0,0,.2);line-height:1;position:relative}
.tv-main .sym.is-text{font-size:40px;letter-spacing:.02em}
.tv-main .ccard .scene svg.sky{position:absolute;inset:auto 0 0 0;width:100%;height:40px}
.tv-main .ccard .body{padding:0 14px 14px;position:relative;display:flex;flex-direction:column;flex:1}
.tv-main .ccard .body.no-flag{padding-top:10px}
.tv-main .ccard .flag{margin-top:-17px;border:3px solid var(--surface);border-radius:50%;display:inline-flex;align-self:flex-start;line-height:0;position:relative;background:var(--surface)}
.flag-img{display:block;flex-shrink:0;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.flag-code{flex-shrink:0;border-radius:50%;display:inline-grid;place-items:center;background:var(--green-soft);color:var(--green);font-size:9px;font-weight:800;line-height:1;letter-spacing:-.02em}
.tv-main .ccard h3{font-size:14.5px;font-weight:700;line-height:1.3;margin:6px 0 0}
.tv-main .ccard h3 a:hover{color:var(--green)}
.tv-main .ccard p{margin:4px 0 12px;font-size:12.5px;line-height:1.45;color:var(--ink-3);flex:1}
.tv-main .ccard .btn{display:block;text-align:center;border:1px solid var(--line);border-radius:8px;padding:7px;font-size:13px;font-weight:600;background:var(--surface-2)}
.tv-main .ccard .btn:hover{border-color:var(--green);color:var(--green)}

.tv-main .grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.tv-main .art{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.tv-main .art .cover{height:150px;position:relative;overflow:hidden;display:grid;place-items:center}
.tv-main .art .body{padding:14px 16px 16px;display:flex;flex-direction:column;flex:1}
.tv-main .tag{align-self:flex-start;background:var(--green-soft);color:var(--green);font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:6px}
.tv-main .art h3{font-size:16px;font-weight:700;line-height:1.35;margin:10px 0 8px}
.tv-main .art h3 a:hover{color:var(--green)}
.tv-main .art p{font-size:13.5px;color:var(--ink-2);margin:0;flex:1}

/* =========================================================
   Footer
   ========================================================= */
.tv-footer{background:var(--navy);color:#c3cfdf;padding:40px 0 0}
.tv-footer .fgrid{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(var(--cols,2),minmax(0,1fr));gap:30px}
.tv-footer .fgrid[style*="--cols:0"]{grid-template-columns:1fr}
.tv-footer .logo b{color:#fff}
.tv-footer .logo small{color:#93a5bd}
.tv-footer p{font-size:13.5px;margin:12px 0 16px;max-width:320px}
.tv-footer h4{color:#fff;font-size:15px;font-weight:700;margin:4px 0 12px}
.tv-footer ul{list-style:none;margin:0;padding:0}
.tv-footer li{margin-bottom:7px;font-size:13.5px}
.tv-footer li a:hover{color:#fff}
.tv-footer .flinks{margin-top:14px;padding-top:10px;border-top:1px solid rgba(255,255,255,.1);font-size:11px}
.tv-footer .flinks summary{cursor:pointer;color:#93a5bd;font-weight:600;list-style:none;display:inline-flex;align-items:center;gap:6px}
.tv-footer .flinks summary::-webkit-details-marker{display:none}
.tv-footer .flinks summary::after{content:"";width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.tv-footer .flinks[open] summary::after{transform:rotate(-135deg) translateY(-1px)}
.tv-footer .flinks summary:hover{color:#fff}
.tv-footer .flinks ul{display:flex;flex-wrap:wrap;gap:2px 12px;margin-top:8px}
.tv-footer .flinks:not([open]) ul{display:none}
.tv-footer .flinks li{margin:0;font-size:11px;line-height:1.6}
.tv-footer .flinks a{color:#93a5bd}
.tv-footer .flinks a:hover{color:#fff}
.tv-footer .social{display:flex;gap:8px}
.tv-footer .social a{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.08);display:grid;place-items:center;color:#fff}
.tv-footer .social a:hover{background:var(--green)}
.tv-footer .fbot{border-top:1px solid rgba(255,255,255,.1);margin-top:32px;padding:14px 0;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:12.5px;color:#93a5bd}

/* =========================================================
   Trang trong (single / archive / page / search) – GeneratePress
   ========================================================= */
.site.grid-container{margin-top:28px;margin-bottom:44px}
.separate-containers .inside-article,
.separate-containers .comments-area,
.separate-containers .page-header,
.separate-containers .paging-navigation,
.one-container .site-content,
.sidebar .widget{background:var(--surface);border:1px solid var(--line);border-radius:14px}
.separate-containers .site-main>*{margin-bottom:20px}
.entry-title,.page-title{font-weight:800;letter-spacing:-.02em;line-height:1.25}
.single .entry-title,.page .entry-title{font-size:clamp(26px,5.5vw,38px)}
.entry-title a{color:var(--ink)}
.entry-title a:hover{color:var(--green)}
.entry-meta{color:var(--ink-3);font-size:13.5px}
.entry-meta a{color:var(--ink-2)}
.entry-content h2,.entry-content h3,.entry-content h4{font-weight:700;letter-spacing:-.01em;color:var(--ink)}
.entry-content a{color:var(--green);text-decoration:underline;text-underline-offset:2px}
.entry-content a:hover{color:var(--green-2)}
.entry-content img,.post-image img,.featured-image img{border-radius:10px}
.entry-content table{border-color:var(--line);font-size:15px}
.entry-content th,.entry-content td{border-color:var(--line)}
.entry-content th{background:var(--surface-2)}
.entry-content blockquote{border-left:4px solid var(--green);background:var(--surface-2);padding:14px 18px;border-radius:0 10px 10px 0}
.cat-links a,.tags-links a{color:var(--green)}
.sidebar .widget .wp-block-heading,.sidebar .widget-title{font-size:16px;font-weight:700}
.sidebar .widget a{color:var(--ink-2);text-decoration:none}
.sidebar .widget a:hover{color:var(--green)}
button,html input[type="button"],input[type="reset"],input[type="submit"],a.button,.wp-block-search__button{background:var(--green);color:#fff;border-radius:8px}
button:hover,html input[type="button"]:hover,input[type="reset"]:hover,input[type="submit"]:hover,a.button:hover,.wp-block-search__button:hover{background:var(--green-2);color:#fff}
input[type="text"],input[type="email"],input[type="url"],input[type="password"],input[type="search"],input[type="number"],textarea,select{background:var(--surface);color:var(--ink);border-color:var(--line);border-radius:8px}
.nav-links .page-numbers{border-radius:8px}
.nav-links .page-numbers.current{color:var(--green);font-weight:700}

/* =========================================================
   Trang con: hero, archive danh mục, bài viết
   ========================================================= */
.tv-main .page-hero{background:radial-gradient(900px 420px at 80% 0%,#13457f 0%,transparent 60%),linear-gradient(120deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;padding:26px 0 40px}
.tv-main .page-hero h1{font-size:clamp(26px,3.6vw,40px);font-weight:800;line-height:1.2;letter-spacing:-.02em;margin:10px 0 12px;max-width:920px;color:#fff}
.tv-main .page-hero h1 small{font-size:.55em;font-weight:600;color:#a9bcd6}
.tv-main .page-hero .lead{color:#c9d6e8;font-size:16px;max-width:640px;margin:0}
.tv-main .page-hero .tag{background:rgba(34,180,108,.18);color:#3fd68a}
.tv-main .page-hero .tag:hover{background:rgba(34,180,108,.3)}
.tv-main .crumbs{font-size:13px;color:#93a5bd;margin-bottom:18px}
.tv-main .crumbs p{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px 0;line-height:1.5}
.tv-main .crumbs a{color:#93a5bd}
.tv-main .crumbs a:hover{color:#fff}
.tv-main .crumbs .separator{margin:0 8px;color:#5f7590}
.tv-main .crumbs .last{color:#c9d6e8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60vw}

.tv-main .ph-row{display:flex;gap:30px;align-items:flex-end;justify-content:space-between}
.tv-main .ph-count{margin:14px 0 0;font-size:13px;font-weight:600;color:#3fd68a}
.tv-main .ph-search{display:flex;gap:8px;flex:0 0 380px;margin:0}
.tv-main .ph-search label{display:flex;align-items:center;gap:8px;flex:1;height:46px;padding:0 14px;border-radius:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#a9bcd6}
.tv-main .ph-search label:focus-within{border-color:#3fd68a}
.tv-main .ph-search input[type="search"]{border:0;background:none;outline:none;width:100%;padding:0;color:#fff;font-size:14px}
.tv-main .ph-search input::placeholder{color:#93a5bd}
.tv-main .ph-search button{height:46px;border:0;border-radius:12px;background:var(--green);color:#fff;font-weight:600;padding:0 18px;cursor:pointer}
.tv-main .ph-search button:hover{background:var(--green-2)}

.tv-main .art .cover-chip{position:absolute;left:10px;bottom:10px;display:flex;align-items:center;gap:6px;padding:3px 9px 3px 3px;border-radius:999px;background:rgba(7,26,51,.72);color:#fff;font-size:12px;font-weight:700;backdrop-filter:blur(4px)}
.tv-main .art h2{font-size:16px;font-weight:700;line-height:1.35;margin:10px 0 8px}
.tv-main .art h2 a:hover{color:var(--green)}
.tv-main .empty{color:var(--ink-3);text-align:center;padding:40px 0}

.tv-main .pager{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin-top:32px}
.tv-main .pager .page-numbers,.tv-main .pager>a,.tv-main .pager>span{min-width:40px;height:40px;padding:0 12px;display:inline-grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:var(--surface);font-size:14px;font-weight:600;color:var(--ink-2)}
.tv-main .pager a:hover{border-color:var(--green);color:var(--green)}
.tv-main .pager .current{background:var(--green);border-color:var(--green);color:#fff}
.tv-main .pager .dots{border:0;background:none}

/* Bài viết */
.tv-main .single-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:start;padding-top:28px;padding-bottom:44px}
.tv-main .post-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:28px 32px;min-width:0}
.tv-main .post-thumb{margin:0 0 22px}
.tv-main .post-thumb img{display:block;width:100%;height:auto;border-radius:12px}
.tv-main .toc{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:14px 18px;margin:0 0 24px}
.tv-main .toc summary{font-weight:700;cursor:pointer}
.tv-main .toc ol{margin:10px 0 0 22px;padding:0;font-size:14.5px;line-height:1.5}
.tv-main .toc li{margin:5px 0}
.tv-main .toc a{color:var(--ink-2)}
.tv-main .toc a:hover{color:var(--green)}
.tv-single .entry-content{font-size:17px;line-height:1.75;color:var(--ink)}
.tv-single .entry-content>:first-child{margin-top:0}
.tv-single .entry-content h2{font-size:clamp(21px,2.4vw,26px);font-weight:800;line-height:1.3;margin:1.8em 0 .6em}
.tv-single .entry-content h3{font-size:19px;font-weight:700;line-height:1.35;margin:1.5em 0 .5em}
.tv-single .entry-content p,.tv-single .entry-content ul,.tv-single .entry-content ol{margin-bottom:1.1em}
.tv-single .entry-content table{display:block;overflow-x:auto;border-collapse:collapse;border:0;font-size:15px}
.tv-single .entry-content th,.tv-single .entry-content td{border:1px solid var(--line);padding:9px 12px}
.tv-single .entry-content .wp-caption{max-width:100%}
.tv-single .entry-content .wp-caption-text{font-size:13.5px;color:var(--ink-3);text-align:center;margin-top:6px}
.tv-single .entry-content img{height:auto}
.entry-content .tv-highlight{margin:1.4em 0;padding:14px 18px;border-left:4px solid var(--green);border-radius:0 12px 12px 0;background:var(--green-soft);color:var(--ink);font-size:clamp(19px,2.2vw,24px);font-weight:800;line-height:1.35;letter-spacing:-.01em}
.entry-content .tv-highlight span{font-weight:inherit!important}

.tv-main .single-side{display:flex;flex-direction:column;gap:20px;position:sticky;top:calc(var(--tv-header-h) + var(--tv-admin-h) + 16px)}
.tv-main .side-box{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px}
.tv-main .side-title{font-size:16px;font-weight:700;margin:0 0 12px}
.tv-main .side-list{list-style:none;margin:0;padding:0}
.tv-main .side-list li+li{border-top:1px solid var(--line)}
.tv-main .side-list a{display:flex;gap:12px;align-items:center;padding:10px 0;font-size:13.5px;font-weight:600;line-height:1.4}
.tv-main .side-list a:hover{color:var(--green)}
.tv-main .side-list img{width:56px;height:56px;object-fit:cover;border-radius:10px;flex-shrink:0}

.tv-main .rate-box .rb-head{display:flex;gap:12px;align-items:center}
.tv-main .rate-box .rb-head b{display:block;font-size:15px;line-height:1.25}
.tv-main .rate-box .rb-head span{font-size:12.5px;color:var(--ink-3)}
.tv-main .rate-box .rb-val{margin:14px 0 2px;font-size:14px;color:var(--ink-2)}
.tv-main .rate-box .rb-val strong{font-size:26px;font-weight:800;color:var(--ink);letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.tv-main .rate-box .rb-bank{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:12px 0 0}
.tv-main .rate-box .rb-bank div{background:var(--surface-2);border-radius:8px;padding:7px 8px}
.tv-main .rate-box .rb-bank dt{font-size:11px;color:var(--ink-3)}
.tv-main .rate-box .rb-bank dd{margin:0;font-size:13.5px;font-weight:700;font-variant-numeric:tabular-nums}
.tv-main .mini-cvt{margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.tv-main .mc-row{display:flex;gap:8px;align-items:center}
.tv-main .mc-row .amount{height:44px;font-size:17px;min-width:0;flex:1}
.tv-main .mc-unit{font-weight:700;font-size:14px;min-width:34px}
.tv-main .mc-swap{margin:0;flex-shrink:0}
.tv-main .mini-cvt .result{margin-top:10px;padding:12px}
.tv-main .mini-cvt .result strong{font-size:20px;margin:0}
.tv-main .rb-foot{font-size:12px;color:var(--ink-3);margin:10px 0 12px}
.tv-main .rate-box .btn{display:block;text-align:center;border:1px solid var(--line);border-radius:10px;padding:9px;font-size:13.5px;font-weight:600;background:var(--surface-2)}
.tv-main .rate-box .btn:hover{border-color:var(--green);color:var(--green)}
.tv-main .single-comments{padding-bottom:44px}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:1100px){
  .tv-main .grid6{grid-template-columns:repeat(3,1fr)}
  .tv-header .nav a{padding:8px}
  .tv-header .search label{width:150px}
}
@media (max-width:900px){
  .tv-main .hero .wrap{grid-template-columns:1fr}
  .tv-main .grid4{grid-template-columns:repeat(2,1fr)}
  .tv-main .single-grid{grid-template-columns:1fr}
  .tv-main .single-side{display:contents}
  .tv-main .single-side .rate-box{order:-1}
  .tv-main .single-side .side-box:not(.rate-box){order:1}
  .tv-main .ph-row{flex-direction:column;align-items:stretch}
  .tv-main .ph-search{flex:none}
  .tv-footer .fgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tv-footer .fgrid>div:first-child{grid-column:1/-1}
  .tv-header .nav,.tv-header .search{display:none}
  .tv-header .burger{display:grid;place-items:center;margin-left:0}
  .tv-header .theme-toggle{margin-left:auto}
  .tv-header .wrap{gap:10px}
  .tv-header .logo .logo-img{max-height:40px}
  .tv-header.open .nav{display:flex;flex-direction:column;position:absolute;top:var(--tv-header-h);left:0;right:0;background:var(--surface);border-bottom:1px solid var(--line);padding:10px 20px;box-shadow:var(--shadow)}
  .tv-header.open .search{display:flex;position:absolute;top:calc(var(--tv-header-h) + var(--tv-nav-h, 0px));left:0;right:0;background:var(--surface);padding:0 20px 14px;border-bottom:1px solid var(--line)}
  .tv-header.open .search label{flex:1;width:auto}
  .tv-header.open .nav a.on::after{display:none}
}
@media (max-width:560px){
  .tv-main .grid6{grid-template-columns:repeat(2,1fr)}
  .tv-main .grid4{grid-template-columns:1fr}
  .tv-main .post-card{padding:18px 16px;border-radius:14px}
  .tv-single .entry-content{font-size:16px}
  .tv-main .ph-search button{padding:0 14px}
  .tv-footer .fgrid{grid-template-columns:1fr}
  .tv-main .shead .more{display:none}
  .tv-main .hero .wrap{padding-top:36px;padding-bottom:36px}
  .tv-main .pair{grid-template-columns:1fr}
  .tv-main .swap{justify-self:center;margin:0;transform:rotate(90deg)}
  .tv-main .swap.spin{transform:rotate(270deg)}
  .tv-main .feats{gap:16px}
  .tv-header .logo small{display:none}
  .tv-main .rtable{font-size:12.5px}
  .tv-main .rtable th,.tv-main .rtable td{padding:7px 4px}
  .tv-main .rtable th{font-size:11px;line-height:1.3}
  .tv-main .rtable td:first-child{gap:6px}
  .tv-main .rtable td:first-child .flag-img,.tv-main .rtable td:first-child .flag-code{width:16px;height:16px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}