/* VNDEVCODE.COM — Privacy / Terms
   Bám trực tiếp Dark Luxury theme của website */
html{scroll-behavior:smooth}

.legal-hero-section{
    padding:104px 0 46px;
    min-height:auto;
}
.legal-hero-section::before{
    opacity:.9;
}
.legal-hero-section .container{position:relative;z-index:2}
.legal-hero{max-width:920px;margin:0 auto}
.legal-kicker{margin-bottom:18px!important}
.legal-kicker>i{font-size:12px;opacity:.95}
.legal-title{
    margin:0 0 16px!important;
    font-size:clamp(38px,5vw,58px)!important;
    letter-spacing:-.8px!important;
}
.legal-lead{
    max-width:760px!important;
    margin:0 auto!important;
    color:var(--text-secondary)!important;
    font-size:16px!important;
    line-height:1.75!important;
}
.legal-meta{
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    gap:9px;
    margin-top:22px;
}
.legal-meta span,.legal-meta a{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:36px;
    padding:8px 13px;
    border-radius:11px;
    color:var(--text-tertiary);
    background:var(--bg-card);
    border:1px solid var(--border-subtle);
    box-shadow:var(--shadow-card);
    font-size:12px;
    font-weight:600;
    text-decoration:none;
    transition:all var(--transition-fast);
}
.legal-meta i{color:var(--accent-blue-light)}
.legal-meta a:hover{
    color:var(--text-primary);
    background:var(--bg-card-hover);
    border-color:var(--border-default);
    transform:translateY(-1px);
}

.legal-content-section{
    padding:8px 0 72px!important;
}
.legal-container{position:relative;z-index:2}
.legal-switch{
    justify-content:center;
    gap:8px!important;
    margin:0 auto 26px!important;
}
.legal-switch .dark-filter-tab{
    min-height:40px;
    padding:9px 17px;
    border-radius:12px;
    font-weight:700;
}
.legal-switch .dark-filter-tab i{font-size:13px}
.legal-switch .dark-filter-tab.active{
    background:var(--gradient-primary);
    box-shadow:0 5px 18px rgba(37,99,235,.24);
}

.legal-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) 285px;
    align-items:start;
    gap:20px;
    max-width:1180px;
    margin:0 auto;
}
.legal-main{min-width:0}

.legal-note{
    position:relative;
    display:flex;
    align-items:flex-start;
    gap:12px;
    margin:0 0 16px;
    padding:15px 17px;
    overflow:hidden;
    border:1px solid rgba(59,130,246,.14);
    border-radius:var(--radius-lg);
    background:linear-gradient(135deg,rgba(37,99,235,.09),rgba(6,182,212,.03));
    color:var(--text-secondary);
    box-shadow:var(--shadow-card);
    font-size:13px;
    line-height:1.7;
}
.legal-note::before{
    content:"";
    position:absolute;
    left:0;right:0;top:0;height:2px;
    background:linear-gradient(90deg,transparent,var(--accent-blue-light),var(--accent-cyan),transparent);
    opacity:.55;
}
.legal-note i{
    width:34px;height:34px;flex:0 0 34px;
    display:grid;place-items:center;
    margin-top:0;
    border-radius:11px;
    color:var(--accent-blue-light);
    background:rgba(59,130,246,.10);
    border:1px solid rgba(59,130,246,.12);
}
.legal-note>div{padding-top:6px}

.legal-card{
    position:relative;
    margin-bottom:14px;
    padding:23px 24px;
    overflow:hidden;
    border:1px solid var(--border-subtle);
    border-radius:var(--radius-xl);
    background:linear-gradient(145deg,rgba(255,255,255,.04),rgba(255,255,255,.012));
    box-shadow:var(--shadow-card);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
    transition:transform var(--transition-base),border-color var(--transition-base),background var(--transition-base),box-shadow var(--transition-base);
}
.legal-card::before{
    content:"";
    position:absolute;
    top:0;left:14%;right:14%;height:2px;
    background:linear-gradient(90deg,transparent,var(--accent-blue-light),var(--accent-cyan),transparent);
    opacity:0;
    transform:scaleX(.45);
    transition:opacity var(--transition-base),transform var(--transition-base);
}
.legal-card:hover{
    transform:translateY(-3px);
    background:var(--bg-card-hover);
    border-color:rgba(59,130,246,.16);
    box-shadow:var(--shadow-card-hover);
}
.legal-card:hover::before{opacity:.65;transform:scaleX(1)}
.legal-heading{
    display:flex;
    align-items:center;
    gap:13px;
    margin-bottom:12px;
}
.legal-icon{
    width:42px;height:42px;flex:0 0 42px;
    display:grid;place-items:center;
    border-radius:13px;
    color:var(--accent-blue-light);
    background:linear-gradient(135deg,rgba(59,130,246,.16),rgba(37,99,235,.07));
    border:1px solid rgba(59,130,246,.14);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
    font-size:16px;
    transition:transform var(--transition-base),background var(--transition-base);
}
.legal-card:hover .legal-icon{transform:scale(1.05);background:rgba(59,130,246,.14)}
.legal-heading h2{
    margin:0;
    color:var(--text-primary);
    font-size:18px;
    font-weight:800;
    letter-spacing:-.15px;
    line-height:1.4;
}
.legal-card p,.legal-card li{
    color:var(--text-tertiary);
    font-size:14px;
    line-height:1.82;
}
.legal-card p{margin:0}
.legal-card p+p{margin-top:10px}
.legal-card ul{margin:8px 0 0;padding-left:19px}
.legal-card li+li{margin-top:7px}
.legal-card strong{color:var(--text-secondary);font-weight:750}
.legal-card a{color:var(--accent-blue-light);font-weight:650;text-decoration:none}
.legal-card a:hover{color:#60a5fa;text-decoration:underline}
.legal-custom{
    margin-top:16px;
    padding-top:16px;
    border-top:1px solid var(--border-subtle);
}
.legal-custom img{max-width:100%;height:auto;border-radius:var(--radius-md)}

.legal-toc{
    position:sticky;
    top:82px;
    padding:18px;
    border:1px solid var(--border-subtle);
    border-radius:var(--radius-xl);
    background:var(--bg-card);
    box-shadow:var(--shadow-card);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
}
.legal-toc-title{
    display:flex;
    align-items:center;
    gap:9px;
    margin:0 0 13px;
    color:var(--text-primary);
    font-size:13px;
    font-weight:800;
}
.legal-toc-title i{color:var(--accent-blue-light)}
.legal-toc-links{display:flex;flex-direction:column;gap:3px}
.legal-toc a{
    position:relative;
    display:flex;
    align-items:center;
    gap:9px;
    min-height:34px;
    padding:7px 9px;
    border-radius:9px;
    color:var(--text-tertiary);
    font-size:12px;
    font-weight:600;
    line-height:1.35;
    text-decoration:none;
    transition:all var(--transition-fast);
}
.legal-toc a::before{
    content:"";
    width:5px;height:5px;flex:0 0 5px;
    border-radius:50%;
    background:var(--text-muted);
    transition:all var(--transition-fast);
}
.legal-toc a:hover,.legal-toc a.is-active{
    color:var(--text-primary);
    background:rgba(37,99,235,.09);
}
.legal-toc a:hover::before,.legal-toc a.is-active::before{
    background:var(--accent-blue-light);
    box-shadow:0 0 10px rgba(59,130,246,.65);
}
.legal-card[id]{scroll-margin-top:92px}

@media(max-width:991.98px){
    .legal-hero-section{padding:92px 0 38px}
    .legal-content-section{padding-top:4px!important}
    .legal-grid{grid-template-columns:1fr;gap:14px}
    .legal-toc{position:relative;top:auto;order:-1}
    .legal-toc-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px}
}
@media(max-width:575.98px){
    .legal-hero-section{padding:82px 0 30px}
    .legal-title{font-size:34px!important;line-height:1.12!important}
    .legal-lead{font-size:14px!important;line-height:1.68!important}
    .legal-meta{margin-top:17px;gap:6px}
    .legal-meta span,.legal-meta a{font-size:11px;padding:7px 10px;min-height:33px}
    .legal-switch{display:grid!important;grid-template-columns:1fr 1fr;width:100%;gap:7px!important}
    .legal-switch .dark-filter-tab{justify-content:center;min-width:0;padding:9px 8px;font-size:11.5px}
    .legal-card{padding:19px 17px;border-radius:18px}
    .legal-heading{align-items:flex-start;gap:11px}
    .legal-icon{width:38px;height:38px;flex-basis:38px;border-radius:12px;font-size:14px}
    .legal-heading h2{font-size:16px;padding-top:2px}
    .legal-card p,.legal-card li{font-size:13.2px;line-height:1.75}
    .legal-note{padding:13px 14px;font-size:12.5px}
    .legal-note i{width:32px;height:32px;flex-basis:32px}
    .legal-toc{padding:15px;border-radius:18px}
    .legal-toc-links{grid-template-columns:1fr 1fr}
    .legal-toc a{font-size:11.5px;padding:7px}
}
@media(max-width:390px){
    .legal-toc-links{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    .legal-card,.legal-icon,.legal-meta a,.legal-toc a{transition:none!important}
}