/* =====================================================================
   SoftVN — trang danh sách bài viết (index /tin-tuc/ + chuyên mục/tag/tác giả/ngày), 2026-09-07.
   Scope body.svb-archive (softvn_is_blog_archive()). Markup: template-parts/posts/layout.php (child).
   Cùng ngôn ngữ với trang catalog (shop.css): hero gọn một hàng, chip, thẻ viền mảnh không bóng, phân trang pill.
   ===================================================================== */
.svb-archive #content.blog-wrapper{padding-top:0 !important;padding-bottom:0 !important} /* khoảng thở đáy đặt ở phân trang (luật padding của Flatsome/Additional CSS đè mất padding-bottom ở đây) */
.svb-archive .svb-wrap{padding-left:15px;padding-right:15px}
/* hero */
/* hero canh giữa + nền chấm/quầng sáng + chip màu (2026-09-07, cùng hệ với 14 trang tĩnh) */
.svb-ac-blue{--ac:#1d4ed8;--ac-bg:#e2eafc;--ac-soft:#f3f6fd}
.svb-ac-green{--ac:#0f7a4f;--ac-bg:#dcf3e7;--ac-soft:#f0faf5}
.svb-ac-violet{--ac:#6d28d9;--ac-bg:#ebe5fb;--ac-soft:#f6f3fd}
.svb-ac-orange{--ac:#c2410c;--ac-bg:#ffe8d9;--ac-soft:#fff6f0}
.svb-ac-teal{--ac:#0f766e;--ac-bg:#d8f1f0;--ac-soft:#eff9f8}
.svb-ac-rose{--ac:#be185d;--ac-bg:#fce4ee;--ac-soft:#fdf2f7}
.svb-ac-amber{--ac:#b45309;--ac-bg:#fdefcf;--ac-soft:#fdf8ec}
.svb-archive .svb-hero{position:relative;display:block;margin:0 0 22px;padding:52px 0 24px;border:0;text-align:center}
.svb-archive .svb-hero > *{position:relative;z-index:1}
.svb-archive .svb-bg{position:absolute;left:50%;top:-30px;width:100vw;height:420px;transform:translateX(-50%);pointer-events:none;z-index:0;overflow:hidden;background:linear-gradient(180deg,var(--ac-soft) 0%,#fff 100%)}
.svb-archive .svb-bg::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#c7d0dc 1px,transparent 1.3px);background-size:26px 26px;-webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.5) 45%,transparent 85%);mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.5) 45%,transparent 85%)}
.svb-archive .svb-bg::after{content:"";position:absolute;inset:-40px;background:radial-gradient(circle at 28% 32%,var(--ac-bg) 0,transparent 30%),radial-gradient(circle at 72% 22%,#fff1e8 0,transparent 28%);filter:blur(36px);opacity:.95;animation:svbGlow 16s ease-in-out infinite alternate}
@keyframes svbGlow{from{transform:translate3d(-2%,0,0) scale(1)}to{transform:translate3d(2%,3%,0) scale(1.06)}}
@media (prefers-reduced-motion:reduce){.svb-archive .svb-bg::after{animation:none}}
.svb-archive .svb-eyebrow{display:block;margin:0 0 12px;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ac)}
.svb-archive .svb-title{margin:0 0 12px;font-size:40px;line-height:1.15;font-weight:700;letter-spacing:-.02em;color:#0f172a;text-transform:none}
.svb-archive .svb-sub{max-width:660px;margin:0 auto 12px;font-size:16px;line-height:1.6;color:#64748b}
.svb-archive .svb-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px;margin:0;font-size:13px;line-height:1.4;color:#64748b}
.svb-archive .svb-meta > span{display:inline-flex;align-items:center;gap:6px}
.svb-archive .svb-meta b{color:#0f172a;font-weight:700}
.svb-archive .svb-meta > span + span{position:relative;padding-left:16px}
.svb-archive .svb-meta > span + span::before{content:"";position:absolute;left:0;top:50%;width:4px;height:4px;margin-top:-2px;border-radius:50%;background:#cbd5e1}
.svb-archive .svb-meta svg,.svb-archive .svb-range svg{width:16px;height:16px;flex:0 0 16px;color:#94a3b8}
.svb-archive .svb-toolbar{display:flex;justify-content:flex-end;margin:0 0 14px}
.svb-archive .svb-range{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#64748b;white-space:nowrap}
.svb-archive .svb-range b{color:#0f172a;font-weight:700}
.svb-archive .svb-chips{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 18px}
.svb-archive .svb-chip{--c:#14355f;--c-bg:#e9eef5;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px 0 12px;border:1px solid #e2e8f0;border-radius:999px;background:#fff;color:#334155;font-size:13.5px;font-weight:600;line-height:1;text-decoration:none;transition:border-color .12s,background-color .12s,color .12s}
.svb-archive .svb-chip .svb-dot{width:8px;height:8px;flex:none;border-radius:50%;background:var(--c)}
.svb-archive .svb-chip .svb-n{font-style:normal;font-size:11.5px;font-weight:600;color:#94a3b8}
.svb-archive .svb-chip:hover{border-color:var(--c);color:var(--c)}
.svb-archive .svb-chip.is-on{background:var(--c-bg);border-color:var(--c-bg);color:var(--c)}
.svb-archive .svb-chip.is-on .svb-n{color:var(--c);opacity:.7}
.svb-archive .svb-chip--blue{--c:#1d4ed8;--c-bg:#e2eafc}
.svb-archive .svb-chip--green{--c:#0f7a4f;--c-bg:#dcf3e7}
.svb-archive .svb-chip--violet{--c:#6d28d9;--c-bg:#ebe5fb}
.svb-archive .svb-chip--orange{--c:#c2410c;--c-bg:#ffe8d9}
.svb-archive .svb-chip--teal{--c:#0f766e;--c-bg:#d8f1f0}
.svb-archive .svb-chip--rose{--c:#be185d;--c-bg:#fce4ee}
.svb-archive .svb-chip--amber{--c:#b45309;--c-bg:#fdefcf}
/* lưới thẻ */
.svb-archive .svb-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0 0 28px}
.svb-archive .svb-card{display:flex;flex-direction:column;margin:0;border:1px solid #e8ecf1;border-radius:10px;background:#fff;overflow:hidden;transition:border-color .12s}
.svb-archive .svb-card:hover{border-color:#cfd6df}
.svb-archive .svb-card__media{display:block;position:relative;aspect-ratio:16/9;background:#fff;border-bottom:1px solid #eef2f6;overflow:hidden}
.svb-archive .svb-card__img{display:block;width:100%;height:100%;object-fit:cover;margin:0}
.svb-archive .svb-card__img.is-contain{object-fit:contain;padding:10px} /* ảnh cao (tỉ lệ < 1.5): contain kẻo cắt logo */
.svb-archive .svb-card__noimg{display:block;width:100%;height:100%;background:linear-gradient(135deg,#eef2f7,#f8fafc)}
.svb-archive .svb-card__body{display:flex;flex-direction:column;flex:1;padding:14px 16px 16px}
.svb-archive .svb-card__meta{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin:0 0 8px;font-size:12.5px;line-height:1.3;color:#64748b}
.svb-archive .svb-card__cat{color:#14355f;font-weight:600;text-decoration:none}
.svb-archive .svb-card__cat:hover{color:#e04a1f}
.svb-archive .svb-card__meta time{position:relative;padding-left:12px;color:#94a3b8}
.svb-archive .svb-card__cat + time::before{content:"";position:absolute;left:0;top:50%;width:4px;height:4px;margin-top:-2px;border-radius:50%;background:#cbd5e1}
.svb-archive .svb-card__meta time:first-child{padding-left:0}
.svb-archive .svb-card__title{margin:0 0 8px;font-size:16px;line-height:1.35;font-weight:600;color:#0f172a;letter-spacing:0;text-transform:none;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.svb-archive .svb-card__title a{color:inherit;text-decoration:none}
.svb-archive .svb-card__title a:hover{color:#14355f}
.svb-archive .svb-card__excerpt{margin:0 0 12px;font-size:13.5px;line-height:1.55;color:#5b6b7f;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.svb-archive .svb-card__more{margin-top:auto;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#64748b;text-decoration:none;transition:color .12s}
.svb-archive .svb-card__more span{width:14px;height:14px;flex:0 0 14px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23000%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M5 12h14%27/%3E%3Cpath d=%27m12 5 7 7-7 7%27/%3E%3C/svg%3E") no-repeat center/14px 14px;mask:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 24 24%27 fill=%27none%27 stroke=%27%23000%27 stroke-width=%272%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27%3E%3Cpath d=%27M5 12h14%27/%3E%3Cpath d=%27m12 5 7 7-7 7%27/%3E%3C/svg%3E") no-repeat center/14px 14px}
.svb-archive .svb-card__more:hover{color:#e04a1f}
/* phân trang: markup Flatsome ul.nav-pagination li .page-number (cùng kiểu trang catalog) */
.svb-archive ul.nav-pagination{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:6px;margin:0 0 48px !important;padding:0;list-style:none;border:0} /* 48px cách footer (người dùng: "khoảng thở ko có") */
.svb-archive ul.nav-pagination li{margin:0;padding:0;border:0}
.svb-archive ul.nav-pagination li .page-number{display:inline-flex !important;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 10px;border:1px solid #d5dbe3 !important;border-radius:8px !important;background:#fff !important;color:#0f172a !important;font-size:13px;font-weight:600;line-height:1;text-decoration:none;transition:border-color .12s,color .12s}
.svb-archive ul.nav-pagination li a.page-number:hover{border-color:#f1592a !important;color:#e04a1f !important}
.svb-archive ul.nav-pagination li .page-number.current{background:#14355f !important;border-color:#14355f !important;color:#fff !important}
.svb-archive ul.nav-pagination li .page-number i{font-size:12px}
/* rỗng */
.svb-archive .svb-empty{margin:0 0 48px;padding:48px 24px;text-align:center;border:1px dashed #d5dbe3;border-radius:10px}
.svb-archive .svb-empty h2{margin:0 0 8px;font-size:18px;text-transform:none}
.svb-archive .svb-empty p{margin:0;color:#64748b}
/* responsive */
@media (max-width:849px){.svb-archive .svb-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.svb-archive .svb-hero__r{display:none}
/* chip: dưới 850px cuộn ngang một hàng (ở 390px xếp 5 hàng = 174px, chiếm nửa màn hình) */
.svb-archive .svb-chips{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:0 -15px 16px;padding:0 15px 2px}.svb-archive .svb-chips::-webkit-scrollbar{display:none}.svb-archive .svb-chip{flex:0 0 auto;white-space:nowrap}}
@media (max-width:549px){.svb-archive .svb-grid{grid-template-columns:1fr;gap:12px}.svb-archive .svb-title{font-size:26px}.svb-archive .svb-chips{gap:6px}.svb-archive .svb-chip{height:30px;padding:0 10px;font-size:12.5px}}

@media (max-width:849px){.svb-archive .svb-hero{padding:36px 0 18px}.svb-archive .svb-title{font-size:28px}.svb-archive .svb-sub{font-size:15px}.svb-archive .svb-chips{justify-content:flex-start}.svb-archive .svb-toolbar{display:none}}
