/**
 * Bold theme - "Candy Pet": hong keo + xanh bac ha tren nen sang, chu tron net day.
 * Vars (nen sang #fff, chu tim dam, accent mint, panel tim) dat trong
 * config/themes.php va inject vao <style id="vs-theme-vars">.
 * Muc tieu: tuoi sang, de thuong, phu hop pet shop / spa / grooming.
 */

body { background: var(--vs-bg-soft); color: var(--vs-text); }

/* ===== Header ===== */
.vs-header { background: var(--vs-surface); border-bottom: 2px solid var(--vs-primary); box-shadow: 0 6px 24px rgba(180, 120, 145, .10); }
.vs-brand__text { font-family: var(--vs-font-heading); font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--vs-primary); }
.vs-menu a { font-family: var(--vs-font-heading); font-weight: 600; letter-spacing: .2px; font-size: 15px; color: var(--vs-text); }
.vs-menu a:hover,
.vs-menu a[aria-current="page"] { color: var(--vs-primary); background: var(--vs-teal-bg); }
.vs-header .vs-btn--ghost { color: var(--vs-primary); border-color: var(--vs-border); }
.vs-header .vs-btn--ghost:hover { color: #fff; background: var(--vs-primary); border-color: var(--vs-primary); }

/* ===== Buttons: vien tron, in hoa, net day ===== */
.vs-btn { border-radius: 999px; text-transform: uppercase; font-weight: 700; letter-spacing: .6px; }
.vs-btn--primary { background: var(--vs-primary); color: #fff; box-shadow: 0 8px 18px rgba(180, 120, 145, .22); }
.vs-btn--primary:hover { background: var(--vs-primary-dark); color: #fff; }
.vs-btn--outline { color: var(--vs-primary); border-color: var(--vs-primary); background: transparent; }
.vs-btn--outline:hover { background: var(--vs-primary); border-color: var(--vs-primary); color: #fff; }
.btn-lg.primary, .btn.lg.primary { background: var(--vs-primary); color: #fff; border-radius: 999px; }
.btn-lg.primary:hover, .btn.lg.primary:hover { background: var(--vs-primary-dark); color: #fff; }
.btn-lg.secondary, .btn.lg.secondary { background: transparent; color: var(--vs-primary); border-color: var(--vs-primary); border-radius: 999px; }
.btn-lg.secondary:hover, .btn.lg.secondary:hover { background: var(--vs-primary); color: #fff; }

/* ===== Headings ===== */
.section-title, .partners-title { font-family: var(--vs-font-heading); font-weight: 600; letter-spacing: .2px; color: var(--vs-gray-900); }
.section-title b, .partners-title b, .partners-title strong { color: var(--vs-primary); }
.section-label { color: var(--vs-accent); letter-spacing: 2px; }

/* ===== Hero ===== */
.hero h1 b { color: var(--vs-primary); }
.hero p { color: var(--vs-muted); }

/* ===== Product + category cards ===== */
.vs-product-card, .vs-cat-card { border: 2px solid var(--vs-border); border-radius: var(--vs-radius); background: var(--vs-surface); color: var(--vs-text); box-shadow: var(--vs-shadow-sm); }
.vs-product-card:hover, .vs-cat-card:hover { border-color: var(--vs-primary); transform: translateY(-4px); box-shadow: var(--vs-shadow); }
.vs-product-card__title, .vs-cat-card__title { color: var(--vs-gray-900); }
.vs-product-card__cat { color: var(--vs-primary); }
.vs-product-card__price-current { color: var(--vs-primary); }
.vs-product-card__badge { background: var(--vs-accent); }
.vs-cart-add { background: var(--vs-primary); color: #fff; border-radius: 999px; }
.vs-cart-add:hover { background: var(--vs-primary-dark); }

/* ===== Feature + partner cards ===== */
.feature-card, .partner-item { background: var(--vs-surface); border: 2px solid var(--vs-border); border-radius: var(--vs-radius); box-shadow: var(--vs-shadow-sm); }
.feature-card:hover, .partner-item:hover { border-color: var(--vs-primary); box-shadow: var(--vs-shadow); transform: translateY(-3px); }
.feature-card h4 { color: var(--vs-gray-900); }
.feature-card p { color: var(--vs-muted); }
.fc-icon { background: var(--vs-teal-bg); color: var(--vs-primary); border: none; border-radius: 16px; }
#features .section-label { color: var(--vs-accent); }
#features .section-title { color: var(--vs-gray-900); }
#features .section-title b { color: var(--vs-primary); }
#features .section-subtitle { color: var(--vs-muted); }
#features .feature-card p { color: var(--vs-muted); }

/* ===== Contact ===== */
/* Card thong tin: gradient hong -> tim dam, chu trang (accent tren nen toi = vang nang). */
.cv2-info__card { background: linear-gradient(160deg, var(--vs-primary-dark) 0%, var(--vs-navy) 100%); box-shadow: var(--vs-shadow); }
.cv2-info__card::after { background: rgba(255, 255, 255, .13); }
.cv2-info__company { color: #fff; }
.cv2-info__body span, .cv2-info__body a { color: #fff; }
.cv2-info__body a:hover, .cv2-info__item--hot .cv2-info__body a { color: var(--vs-accent-on-dark); }
.cv2-trust__pill { background: rgba(255, 255, 255, .16); border-color: rgba(255, 255, 255, .28); color: #fff; }
.cv2-trust__pill i { color: var(--vs-accent-on-dark); }
.cv2-cta { background: #fff; color: var(--vs-primary-dark); border-color: transparent; box-shadow: 0 6px 16px rgba(0, 0, 0, .12); }
.cv2-cta:hover { background: var(--vs-accent); color: #fff; border-color: var(--vs-accent); }
.cv2-socials { border-top-color: rgba(255, 255, 255, .24); }
.cv2-socials__link { color: #fff; background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .24); }
.cv2-socials__link:hover { color: #000; background: var(--vs-accent-on-dark); border-color: var(--vs-accent-on-dark); }
.cv2-form { background: var(--vs-surface); border: 2px solid var(--vs-border); }
.cv2-field input, .cv2-field textarea { color: var(--vs-text); background: var(--vs-surface); border: 2px solid var(--vs-border); }
.cv2-field input:focus, .cv2-field textarea:focus { border-color: var(--vs-primary); box-shadow: 0 0 0 3px rgba(180, 120, 145, .14); }
.cv2-submit { background: var(--vs-primary); color: #fff; border-radius: 999px; box-shadow: 0 8px 18px rgba(180, 120, 145, .22); }
.cv2-submit:hover { background: var(--vs-primary-dark); }

/* ===== Tab / pagination / chip active ===== */
.product-tab { border-radius: 999px; }
.product-tab.is-active,
.vs-pagination__item--active,
.post-cat-chip.active,
.post-cat-chip.active:hover { background: var(--vs-primary); border-color: var(--vs-primary); color: #fff; }

/* ===== Minicart ===== */
.vs-minicart__panel { background: var(--vs-surface); border: 2px solid var(--vs-border); box-shadow: var(--vs-shadow-lg); }
.vs-minicart__item-price,
.vs-minicart__subtotal strong { color: var(--vs-primary); }

/* ===== Footer: gradient hong -> tim ===== */
.vs-footer { background: linear-gradient(140deg, var(--vs-primary-dark) 0%, var(--vs-navy) 100%); color: #fbe9f1; }
.vs-footer__about p, .vs-footer__col a, .vs-footer__contact a { color: #fbe9f1; }
.vs-footer__col a:hover, .vs-footer__contact a:hover { color: #fff; }
.vs-footer__col h4, .vs-brand--footer .vs-brand__text { color: #fff; }
.vs-footer__contact i { color: var(--vs-accent-on-dark); }
.vs-footer__bottom { border-top: 1px solid rgba(255, 255, 255, .20); }
.vs-footer__bottom p { color: #fbe9f1; }
