/*
Theme Name: AffiliateCMS Child
Theme URI: https://lat.vn/
Description: Child theme for AffiliateCMS Theme. Add your custom styles and overrides here.
Author: AffiliateCMS Team
Author URI: https://lat.vn/
Template: affiliateCMS-theme
Version: 1.0.14
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: affiliatecms-child
*/

/* ==========================================================================
   Custom Styles - Add your overrides below
   ========================================================================== */

/* ============================================================
   BRAND TOKENS - The Yardstead (rule H2: 1 bộ token tập trung duy nhất,
   không hardcode hex rời rạc ở nơi khác). Override đúng token :root có sẵn
   của theme cha (tokens.css), không tạo bảng màu riêng.

   Primary Barnwood #2B332E   - gỗ sẫm, dùng cho heading/logo/text chính
   Sprout Green    #5A7A5A   - dùng cho CTA/link/navbar (--color-primary)
   Raised Bed Cedar #C2A27A  - dùng cho background section phụ
   Cream/Parchment #F5F1E8   - nền chính
   Accent Harvest  #D97B45   - badge/giá (--color-accent)

   Font: Merriweather (heading/logo) + Inter (body, token --font-sans có
   sẵn của theme cha đã đúng) + DM Sans Bold (badge/accent).
   ============================================================ */
:root {
    --color-primary: #5A7A5A;
    --color-primary-hover: #46614A;
    --color-primary-dark: #3A4F3D;
    --color-primary-light: #E8EFE8;
    --color-primary-rgb: 90, 122, 90;

    --color-accent: #D97B45;
    --color-accent-hover: #C0632F;
    --color-accent-light: #FBEBE0;

    --color-text: #2B332E;
    --color-text-secondary: #4A5147;
    --color-text-muted: #6B7268;
    --color-text-subtle: #8C9288;

    --color-bg: #F5F1E8;
    --color-bg-alt: #EFE7D6;
    --color-surface: #FFFFFF;
    --color-surface-raised: #FFFFFF;
    --color-surface-hover: #EFE7D6;

    --color-border: #DCD2BC;
    --color-border-subtle: #E7DFCC;
    --color-border-strong: #C2A27A;

    --font-heading: 'Merriweather', Georgia, 'Times New Roman', serif;
    --font-badge: 'DM Sans', var(--font-sans);
}

h1, h2, h3, h4, h5, h6,
.tys-logo,
.tys-footer__logo,
.tys-cat-title,
.tys-who-title,
.tys-hero__col--feat h3 {
    font-family: var(--font-heading);
}

/* ============================================================
   HEADER (header.php, mới thêm 2026-08-09): topbar + navbar accent +
   mega-dropdown category + FTC disclosure bar, đồng bộ với bestforyourhome.org
   (cùng stack theme). Trước đây site dùng header mặc định của theme cha
   (đơn hàng, không mega-dropdown). Sticky qua id="masthead", tái dùng
   đúng hiệu ứng .is-scrolled có sẵn ở theme.min.js, không viết JS mới.
   ============================================================ */
.tys-header {
    position: sticky;
    top: 0;
    z-index: var(--z-sticky);
    background: var(--color-bg);
    border-bottom: 1px solid var(--color-border);
    transition: box-shadow var(--duration-200) var(--ease-out);
}

.tys-header.is-scrolled {
    box-shadow: var(--shadow-md);
}

.tys-topbar {
    background: var(--color-bg);
}

.tys-topbar__inner {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    padding-top: var(--space-4);
    padding-bottom: var(--space-4);
}

.tys-hamburger {
    display: none;
    cursor: pointer;
    font-size: 1.4rem;
    color: var(--color-text);
}

.tys-ic-close {
    display: none;
}

.tys-mnav-toggle:checked ~ .tys-topbar .tys-ic-open {
    display: none;
}

.tys-mnav-toggle:checked ~ .tys-topbar .tys-ic-close {
    display: inline;
}

.tys-logo-wrap {
    margin: 0;
    flex-shrink: 0;
}

.tys-logo {
    font-family: var(--font-sans);
    font-weight: var(--font-bold);
    font-size: 1.4rem;
    color: var(--color-text);
    letter-spacing: -0.01em;
    display: flex;
    align-items: center;
}

/* Rebrand 2026-08-16: logo-header-600.png (600x200, house + paw + nest).
   36px ban đầu quá nhỏ so với topbar desktop, tăng lên 44px. Tràn ngang mobile
   hôm trước là do Cloudflare cache CSS cũ (xem memory wp-infra-gotchas #7),
   không phải do ảnh không có giới hạn kích thước, nên để lại logo trên mobile,
   chỉ thu nhỏ dần thay vì ẩn hẳn. */
.tys-logo__img {
    display: block;
    height: 88px;
    width: auto;
    max-width: 480px;
    object-fit: contain;
}

@media (max-width: 768px) {
    .tys-logo__img {
        height: 68px;
        max-width: 360px;
    }
}

@media (max-width: 480px) {
    .tys-logo__img {
        height: 56px;
        max-width: 300px;
    }
}

.tys-searchpill {
    flex: 1;
    max-width: 420px;
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: var(--space-2);
    background: var(--color-bg-alt);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    padding: var(--space-2) var(--space-2) var(--space-2) var(--space-4);
}

.tys-searchpill i {
    color: var(--color-text-subtle);
}

.tys-searchpill input {
    flex: 1;
    border: none;
    background: transparent;
    font-family: var(--font-sans);
    font-size: 0.9rem;
    color: var(--color-text);
    outline: none;
}

.tys-searchpill button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: var(--radius-full);
    border: none;
    background: var(--color-primary);
    color: #fff;
    cursor: pointer;
}

.tys-m-searchbtn,
.tys-mobile-search {
    display: none;
}

/* ---- Navbar accent (mega-dropdown category) ---- */
.tys-navbar {
    background: var(--color-primary);
}

.tys-navbar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tys-navbar__nav {
    display: flex;
    align-items: stretch;
}

.tys-ni {
    position: relative;
}

.tys-ni > a {
    display: flex;
    align-items: center;
    gap: 4px;
    height: 100%;
    padding: var(--space-4) var(--space-4);
    color: #fff;
    font-weight: var(--font-semibold);
    font-size: 0.9rem;
    white-space: nowrap;
}

.tys-ni > a:hover {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}

.tys-submenu {
    position: absolute;
    top: 100%;
    left: 0;
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-top: none;
    box-shadow: var(--shadow-lg);
    padding: var(--space-4);
    min-width: 220px;
    display: none;
    flex-direction: column;
    z-index: 50;
}

.tys-submenu--allcats {
    columns: 2;
    min-width: 320px;
}

.tys-submenu a {
    display: block;
    padding: var(--space-2) var(--space-3);
    color: var(--color-text-secondary);
    font-size: 0.88rem;
    border-radius: var(--radius-sm);
    white-space: nowrap;
}

.tys-submenu a:hover {
    background: var(--color-bg-alt);
    color: var(--color-primary);
}

.tys-ni:hover .tys-submenu {
    display: flex;
}

.tys-navbar__right {
    display: flex;
    align-items: center;
    gap: var(--space-6);
    flex-shrink: 0;
}

.tys-navbar__right a {
    color: #fff;
    font-weight: var(--font-bold);
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.tys-navbar__right a:hover {
    text-decoration: underline;
    color: #fff;
}

.tys-mobile-nav {
    display: none;
}

/* ---- FTC disclosure bar (markup có sẵn ở theme cha, restyle lại) ---- */
.post-disclosure {
    background: var(--color-bg-alt);
    border-bottom: 1px solid var(--color-border);
    padding: var(--space-3) 0;
}

.post-disclosure__main {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    text-align: center;
    max-width: var(--container-xl);
    margin: 0 auto;
    padding: 0 var(--space-4);
}

.post-disclosure__icon {
    display: none;
}

.post-disclosure__text {
    font-size: 0.85rem;
    color: var(--color-text-secondary);
    margin: 0;
}

.post-disclosure__link {
    font-weight: var(--font-semibold);
    color: var(--color-text);
    text-decoration: underline;
    white-space: nowrap;
}

@media (max-width: 1024px) {
    .tys-searchpill {
        max-width: 280px;
    }
}

@media (max-width: 768px) {
    .tys-hamburger {
        display: block;
    }

    .tys-searchpill {
        display: none;
    }

    .tys-m-searchbtn {
        display: flex;
        align-items: center;
        margin-left: auto;
        font-size: 1.2rem;
        color: var(--color-text);
    }

    .tys-msearch-toggle:checked ~ .tys-mobile-search {
        display: block;
    }

    .tys-mobile-search {
        background: var(--color-bg-alt);
        border-bottom: 1px solid var(--color-border);
        padding: var(--space-4);
    }

    .tys-mobile-search form {
        display: flex;
        align-items: center;
        gap: var(--space-2);
        background: var(--color-bg);
        border: 1px solid var(--color-border);
        border-radius: var(--radius-full);
        padding: var(--space-2) var(--space-4);
    }

    .tys-mobile-search input {
        flex: 1;
        border: none;
        background: transparent;
        outline: none;
    }

    .tys-navbar {
        display: none;
    }

    .tys-mnav-toggle:checked ~ .tys-mobile-nav {
        display: block;
    }

    .tys-mobile-nav {
        background: var(--color-bg);
        border-bottom: 1px solid var(--color-border);
        padding: var(--space-2) var(--space-4);
    }

    .tys-mobile-nav details {
        border-bottom: 1px solid var(--color-border-subtle);
        padding: var(--space-3) 0;
    }

    .tys-mobile-nav summary {
        font-weight: var(--font-semibold);
        cursor: pointer;
        color: var(--color-text);
    }

    .tys-mobile-nav__sub {
        display: flex;
        flex-direction: column;
        gap: var(--space-2);
        margin-top: var(--space-3);
        padding-left: var(--space-4);
    }

    .tys-mobile-nav__sub a {
        color: var(--color-text-secondary);
        font-size: 0.9rem;
    }

    .tys-mobile-nav__sep {
        font-size: 0.75rem;
        text-transform: uppercase;
        color: var(--color-text-subtle);
        padding: var(--space-3) 0;
    }

    .tys-mobile-nav__accent {
        display: block;
        padding: var(--space-2) 0;
        color: var(--color-primary);
        font-weight: var(--font-bold);
    }
}

@media (max-width: 480px) {
    .tys-submenu--allcats {
        columns: 1;
    }
}

/* ============================================================
   CATEGORY ARCHIVE PAGE (category.php, mới thêm 2026-08-09)
   ============================================================ */
.tys-catpage-head {
    text-align: center;
    padding: var(--space-10) 0 var(--space-8);
    border-bottom: 1px solid var(--color-border-subtle);
}

.tys-catpage-head .breadcrumb {
    justify-content: center;
    margin-bottom: var(--space-4);
}

.tys-catpage-head__title {
    font-size: 2.2rem;
    font-weight: var(--font-bold);
    letter-spacing: -0.01em;
    color: var(--color-text);
}

.tys-catpage-head__desc {
    max-width: 720px;
    margin: var(--space-4) auto 0;
    color: var(--color-text-secondary);
    line-height: 1.6;
}

.tys-catpage-head__chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-2);
    margin-top: var(--space-6);
}

.tys-chip {
    display: inline-block;
    padding: var(--space-2) var(--space-4);
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-full);
    font-size: 0.85rem;
    font-weight: var(--font-semibold);
    color: var(--color-text-secondary);
}

.tys-chip:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

@media (max-width: 768px) {
    .tys-catpage-head__title {
        font-size: 1.6rem;
    }
}

/* ============================================================
   QUICK PICKS SUMMARY (single post, thêm 2026-08-09)
   ============================================================ */
.tys-quickpicks {
    background: var(--color-bg-alt);
    border: 1px solid var(--color-border-subtle);
    border-radius: var(--radius-md);
    padding: var(--space-6);
    margin: var(--content-section-spacing, var(--space-8)) 0;
}

.tys-quickpicks__title {
    margin-top: 0 !important;
}

.tys-quickpicks .acms-grid {
    max-width: 100% !important;
}

/* ---- Homepage (front-page.php): tái dùng token màu/spacing của theme cha ---- */

.tys-tagline {
    text-align: center;
    padding: var(--space-12) var(--container-padding) var(--space-10);
    background: var(--color-bg-alt);
    border-bottom: 1px solid var(--color-border);
}
.tys-tagline h1 {
    font-size: var(--text-4xl);
    margin: 0 0 var(--space-3);
    color: var(--color-text);
}
.tys-tagline p {
    color: var(--color-text-secondary);
    max-width: 640px;
    margin: 0 auto var(--space-6);
}
.tys-tagline form {
    display: flex;
    max-width: 480px;
    margin: 0 auto;
    gap: var(--space-2);
}
.tys-tagline input[type="search"] {
    flex: 1;
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    font-size: var(--text-base);
}
.tys-tagline button {
    padding: var(--space-3) var(--space-6);
    border: 0;
    border-radius: var(--radius-full);
    background: var(--color-primary);
    color: #fff;
    cursor: pointer;
}
.tys-tagline button:hover { background: var(--color-primary-hover); }

.tys-block,
.tys-catblock {
    margin: var(--space-12) 0;
}
.tys-sechead h2,
.tys-who-title,
.tys-cat-title a {
    color: var(--color-text);
}
.tys-cat-title {
    font-size: var(--text-2xl);
    margin: 0 0 var(--space-1);
}
.tys-cat-title a { text-decoration: none; }
.tys-cat-title a:hover { color: var(--color-primary); }
.tys-ch { margin-bottom: var(--space-5); }
.tys-subs {
    color: var(--color-text-muted);
    font-size: var(--text-sm);
}
.tys-subs a { color: var(--color-text-secondary); }
.tys-subs a:hover { color: var(--color-primary); }

.tys-empty {
    color: var(--color-text-muted);
    padding: var(--space-8);
    text-align: center;
    background: var(--color-bg-alt);
    border-radius: var(--radius-md);
    border: 1px dashed var(--color-border);
}

/* Why The Yardstead / team */
.tys-who {
    background: var(--color-bg-alt);
    padding: var(--space-12) 0;
    margin-top: var(--space-12);
}
.tys-who-title {
    font-size: var(--text-3xl);
    text-align: center;
    margin: 0 0 var(--space-4);
}
.tys-sub {
    text-align: center;
    max-width: 640px;
    margin: 0 auto var(--space-2);
    color: var(--color-text-secondary);
}
.tys-sub a { color: var(--color-primary); }

.tys-stats {
    display: flex;
    justify-content: center;
    gap: var(--space-10);
    margin: var(--space-8) 0;
}
.tys-stat { text-align: center; }
.tys-stat b {
    display: block;
    font-size: var(--text-3xl);
    color: var(--color-primary);
}
.tys-stat span {
    color: var(--color-text-muted);
    font-size: var(--text-sm);
}

.tys-teamlbl {
    text-align: center;
    font-weight: var(--font-semibold);
    margin-bottom: var(--space-5);
    color: var(--color-text);
}
.tys-team {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: var(--space-6);
    max-width: var(--container-lg);
    margin: 0 auto;
}
.tys-member {
    text-align: center;
    text-decoration: none;
    color: var(--color-text);
}
.tys-member img {
    width: 72px;
    height: 72px;
    border-radius: var(--radius-full);
    object-fit: cover;
    margin: 0 auto var(--space-2);
    display: block;
}
.tys-member b {
    display: block;
    font-size: var(--text-sm);
}
.tys-member span {
    display: block;
    font-size: var(--text-xs);
    color: var(--color-text-muted);
}
.tys-member:hover b { color: var(--color-primary); }

/* ---- Hero 3 cột (Latest / Featured / Trending) ---- */
.tys-hero {
    display: grid;
    grid-template-columns: 1fr 1.3fr 1fr;
    gap: var(--space-8);
    padding: var(--space-8) 0;
    border-bottom: 1px solid var(--color-border);
}
.tys-hero__label {
    font-size: var(--text-sm);
    font-weight: var(--font-semibold);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--color-primary);
    border-bottom: 2px solid var(--color-primary);
    padding-bottom: var(--space-2);
    margin-bottom: var(--space-3);
}
.tys-hero__item {
    padding: var(--space-2) 0;
    border-bottom: 1px solid var(--color-border-subtle);
}
.tys-hero__item a {
    display: block;
    color: var(--color-text);
    text-decoration: none;
    font-weight: var(--font-medium);
}
.tys-hero__item a:hover { color: var(--color-primary); }
.tys-hero__col--feat img {
    width: 100%;
    height: auto;
    border-radius: var(--radius-md);
    display: block;
    margin-bottom: var(--space-3);
}
.tys-hero__col--feat h3 { margin: 0 0 var(--space-2); font-size: var(--text-xl); }
.tys-hero__col--feat h3 a { color: var(--color-text); text-decoration: none; }
.tys-hero__col--feat p { color: var(--color-text-secondary); }

.tys-date {
    display: block;
    font-size: var(--text-xs);
    color: var(--color-text-subtle);
}
.tys-byline {
    font-size: var(--text-sm);
    color: var(--color-text-muted);
}

/* ---- Category block layout: lead-list ---- */
.tys-cols {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: var(--space-8);
}
.tys-lead img { width: 100%; height: auto; border-radius: var(--radius-md); margin-bottom: var(--space-2); }
.tys-lead h3 { margin: var(--space-2) 0; }
.tys-lead h3 a { color: var(--color-text); text-decoration: none; }
.tys-lead p { color: var(--color-text-secondary); margin-top: var(--space-2); }
.tys-list .tys-li {
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--color-border-subtle);
}
.tys-list .tys-li a {
    display: block;
    color: var(--color-text);
    text-decoration: none;
    font-weight: var(--font-medium);
}
.tys-list .tys-li a:hover { color: var(--color-primary); }

/* ---- Category block layout: compact-list ---- */
.tys-compact {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-4);
}
.tys-crow {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    text-decoration: none;
    color: var(--color-text);
    padding: var(--space-2);
    border-radius: var(--radius-sm);
}
.tys-crow:hover { background: var(--color-surface-hover); }
.tys-crow img { width: 64px; height: 64px; object-fit: cover; border-radius: var(--radius-sm); flex-shrink: 0; }

/* ---- Category block layout: carousel ---- */
.tys-carousel {
    display: flex;
    gap: var(--space-4);
    overflow-x: auto;
    padding-bottom: var(--space-3);
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}
.tys-carousel .tys-carousel__item {
    flex: 0 0 260px;
    scroll-snap-align: start;
}

/* ---- Newsletter band ---- */
.tys-news {
    background: var(--color-text);
    color: var(--color-surface);
    margin-top: var(--space-12);
}
.tys-news__wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-6);
    padding: var(--space-8) var(--container-padding);
    flex-wrap: wrap;
}
.tys-news__eyebrow {
    display: block;
    font-size: var(--text-xs);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--color-primary-light);
}
.tys-news__text strong { display: block; font-size: var(--text-xl); margin: var(--space-1) 0; }
.tys-news__text p { color: var(--color-border); margin: 0; }
.tys-news__form { display: flex; gap: var(--space-2); }
.tys-news__form input[type="email"] {
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-sm);
    min-width: 260px;
}
.tys-news__form button {
    padding: var(--space-3) var(--space-6);
    border: 0;
    border-radius: var(--radius-sm);
    background: var(--color-primary);
    color: #fff;
    cursor: pointer;
    font-weight: var(--font-semibold);
}
.tys-news__form button:hover { background: var(--color-primary-hover); }
.tys-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.tys-news__msg { font-weight: var(--font-medium); }
.tys-news__msg--error { color: var(--color-error); }

/* ---- Pillars (Who we are / What we do / How we do it) ---- */
.tys-pillars {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-5);
    margin: var(--space-8) 0;
}
.tys-pillar {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    padding: var(--space-5);
}
.tys-pillar__title { font-weight: var(--font-semibold); margin-bottom: var(--space-2); }
.tys-pillar p { color: var(--color-text-secondary); margin: 0; font-size: var(--text-sm); }
.tys-pillar a { color: var(--color-primary); }

/* ---- Footer 3 cột ---- */
.tys-footer {
    background: var(--color-text);
    color: var(--color-border);
    margin-top: var(--space-12);
}
.tys-footer__top {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: var(--space-10);
    padding: var(--space-12) var(--container-padding) var(--space-8);
}
.tys-footer__logo { color: #fff; font-size: var(--text-xl); font-weight: var(--font-bold); margin-bottom: var(--space-2); }
.tys-footer__logo-img { display: block; height: 86px; width: auto; max-width: 468px; object-fit: contain; }
@media (max-width: 768px) {
    .tys-footer__logo-img { height: 72px; max-width: 396px; }
}
.tys-footer__desc { color: var(--color-border); font-size: var(--text-sm); max-width: 320px; }
.tys-footer__cols {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
}
.tys-footer__cols h5 { color: #fff; font-size: var(--text-sm); text-transform: uppercase; letter-spacing: var(--tracking-wide); margin: 0 0 var(--space-3); }
.tys-footer__cols ul { list-style: none; margin: 0; padding: 0; }
.tys-footer__cols li { margin-bottom: var(--space-2); }
.tys-footer__cols a { color: var(--color-border); text-decoration: none; font-size: var(--text-sm); }
.tys-footer__cols a:hover { color: #fff; }
.tys-footer__disclosure {
    padding: var(--space-4) var(--container-padding);
    border-top: 1px solid var(--color-text-secondary);
    font-size: var(--text-xs);
    color: var(--color-text-subtle);
}
.tys-footer__disclosure a { color: var(--color-border); }
.tys-footer__bottom {
    padding: var(--space-4) var(--container-padding) var(--space-6);
    font-size: var(--text-xs);
    color: var(--color-text-subtle);
}

/* Responsive check: 1080 / 768 / 480 */
@media (max-width: 1080px) {
    .tys-hero { grid-template-columns: 1fr; }
    .tys-cols { grid-template-columns: 1fr; }
    .tys-footer__top { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
    .tys-tagline h1 { font-size: var(--text-3xl); }
    .tys-stats { gap: var(--space-6); }
    .tys-pillars { grid-template-columns: 1fr; }
    .tys-compact { grid-template-columns: 1fr; }
    .tys-footer__cols { grid-template-columns: 1fr 1fr; }
    .tys-news__wrap { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 480px) {
    .tys-tagline { padding: var(--space-8) var(--space-4); }
    .tys-tagline form { flex-direction: column; }
    .tys-tagline h1 { font-size: var(--text-2xl); }
    .tys-stats { gap: var(--space-4); flex-wrap: wrap; row-gap: var(--space-4); }
    .tys-team { grid-template-columns: repeat(2, 1fr); }
    .tys-news__form { flex-direction: column; width: 100%; }
    .tys-news__form input[type="email"] { min-width: 0; width: 100%; }
    .tys-footer__cols { grid-template-columns: 1fr; }
}

/* ============================================================
   Post footer: social share icons (rebrand 2026-08-16)
   Đặt cạnh nút Share cũ của theme cha, không thay thế. Icon xám mặc định
   (đồng bộ token site), đổi màu thương hiệu thật của từng mạng khi hover
   (quy ước chuẩn, không phải màu brand của site nên không tính vi phạm
   rule H2 "1 bộ token brand duy nhất", token đó áp cho màu CỦA SITE).
   ============================================================ */
.post-footer__share-group {
    display: flex;
    align-items: center;
    gap: var(--space-3);
}

.post-footer__share-icons {
    display: flex;
    align-items: center;
    gap: var(--space-2);
}

.post-footer__share-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    border: 1px solid var(--color-border);
    background-color: transparent;
    color: var(--color-text-secondary);
    font-size: var(--text-base);
    cursor: pointer;
    transition: color var(--duration-200) var(--ease-out), border-color var(--duration-200) var(--ease-out), background-color var(--duration-200) var(--ease-out);
}

.post-footer__share-icon:hover {
    border-color: currentColor;
    background-color: var(--color-bg-alt);
}

.post-footer__share-icon--pinterest:hover { color: #e60023; }
.post-footer__share-icon--facebook:hover { color: #1877f2; }
.post-footer__share-icon--x:hover { color: #000000; }
.post-footer__share-icon--copy:hover { color: var(--color-primary); }

.post-footer__share-icon--copy.is-copied {
    color: var(--color-success);
    border-color: var(--color-success);
}

@media (max-width: 639px) {
    .post-footer__share-group {
        flex-wrap: wrap;
        justify-content: flex-end;
    }
}

@media (max-width: 480px) {
    .post-footer__share-icon {
        width: 32px;
        height: 32px;
        font-size: 0.9rem;
    }
}

/* ============================================================
 * ABOUT PAGE: trust-item row cuối trang (page-about.php override)
 * Vị trí + nội dung theo bestforyourhome.org (.about-section__trust),
 * dùng token :root sẵn có (rule H2).
 * ============================================================ */

.tys-about-trust {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-6);
    list-style: none;
    max-width: 800px;
    margin: var(--space-8) auto 0;
    padding: var(--space-6) 0 0;
    border-top: 1px solid var(--color-border);
}

.tys-about-trust__item {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--text-sm);
    color: var(--color-text-secondary);
}

.tys-about-trust__item i {
    color: var(--color-primary);
}

@media (max-width: 480px) {
    .tys-about-trust {
        flex-direction: column;
        align-items: center;
        gap: var(--space-3);
    }
}

/* ============================================================
 * SITEWIDE DISCLOSURE BAR: hàng badge phía trên câu disclosure
 * (template-parts/single/disclosure.php override). Giữ cỡ chữ nhỏ
 * (--text-xs) và tông màu muted, đồng bộ .post-disclosure__text
 * gốc của theme cha, không lấn át nội dung chính trang.
 * ============================================================ */

.tys-disclosure-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: var(--space-1) var(--space-4);
    list-style: none;
    margin: 0 0 var(--space-1);
    padding: 0;
}

.tys-disclosure-badges__item {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--text-xs);
    font-weight: var(--font-medium);
    color: var(--color-text-muted);
    white-space: nowrap;
}

.tys-disclosure-badges__item i {
    color: var(--color-primary);
}

@media (max-width: 480px) {
    .tys-disclosure-badges {
        gap: var(--space-1) var(--space-3);
    }
}

/* ==========================================================================
   View counters (2026-08-19): hides the "0 views" badge site-wide. Site
   traffic is still low so a live view count reads as a broken trust
   signal instead of a real one (rule C3, no fabricated-looking data).
   CSS-only because post-hero__views in the parent theme's single.php
   prints unconditionally with no show_views arg, and post-card__views /
   post-card__footer-item--views can render on any post-card instance
   (homepage, category, search, archive). Editing parent theme files is
   not allowed (rule I1), so this is the only hook point. Kept in sync
   with the same hide applied on bestforyourhome.org and the sibling
   AffiliateCMS site.
   ========================================================================== */

.post-card__views,
.post-card__footer-item--views,
.post-hero__views {
    display: none;
}