/*
Theme Name: Anh Phuong Jewelry Child
Template: flatsome
Version: 1.1.0
*/
/* Thông số lấy từ CSS gốc (ditacom_index.css / ditacom_public.css, bản chụp 2022-04-19):
   Roboto 14px #666 · khung 1200px · thanh menu + footer #E6E6E6 · tiêu đề mục in hoa
   700 14px #000, gạch #e1e1e1 · tên SP nền #e6e6e6 · giá #da0700 · hotline #F00. */
/* Roboto tự host (bản gốc tự host qua family.css). Mô tả SP/bài nguyên văn ghi cứng
   `font-family: Roboto` không kèm dự phòng — thiếu font thì rơi về font chân (đo 375px 2026-10-05).
   Google Fonts v51, Apache-2.0; font biến thiên 100–900; tách tiếng Việt/Latin như bản Google. */
@font-face { font-family: Roboto; font-style: normal; font-weight: 100 900; font-display: swap; src: url("fonts/roboto-vi.woff2") format("woff2"); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: Roboto; font-style: normal; font-weight: 100 900; font-display: swap; src: url("fonts/roboto-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: Roboto; font-style: italic; font-weight: 100 900; font-display: swap; src: url("fonts/roboto-italic-vi.woff2") format("woff2"); unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: Roboto; font-style: italic; font-weight: 100 900; font-display: swap; src: url("fonts/roboto-italic-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
:root {
    --ntc-chu: #666;
    --ntc-dam: #333;
    --ntc-do: #da0700;
    --ntc-hotline: #f00;
    --ntc-xam: #e6e6e6;
    --ntc-vien: #e1e1e1;
}
body {
    font-family: Roboto, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.6;
    color: var(--ntc-chu);
    background: #fff;
}
/* Bản gốc: `*{font-family:Roboto}`. Flatsome in CSS nội tuyến `body/h1-h6 {font-family: Lato}`
   sau stylesheet này → bài blog không có style nội tuyến hiện Lato (đo 2026-10-05). */
html body, html body :is(h1, h2, h3, h4, h5, h6, p, li, td, th, a, span, strong, em, b, i, blockquote, input, select, label) {
    font-family: Roboto, Arial, sans-serif;
}
a { color: var(--ntc-dam); text-decoration: none; }
a:hover { color: var(--ntc-do); }
.material-icons { display: none; }

.ntc-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 16px;
}
main .ntc-wrap { padding-top: 20px; padding-bottom: 30px; }

/* ---------- Header: logo trái, menu ngang phải, hotline góc trên ---------- */
.ntc-header {
    background: #fff;
    border-bottom: 3px solid var(--ntc-xam);
    position: relative;
    z-index: 50;
}
.ntc-header .ntc-wrap {
    display: flex;
    align-items: center;
    gap: 24px;
    min-height: 100px;
    position: relative;
}
.ntc-brand { flex: none; }
.ntc-brand img { width: 130px; height: auto; display: block; }
.ntc-hotline {
    position: absolute;
    top: 6px;
    right: 16px;
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    color: var(--ntc-hotline);
}
.ntc-hotline a { color: var(--ntc-hotline); }
.ntc-header nav { flex: 1; min-width: 0; }
.ntc-header nav ul { list-style: none; margin: 0; padding: 0; }
.ntc-header nav > ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0 4px;
    padding-top: 18px;
}
.ntc-header nav > ul > li { position: relative; margin: 0; }
.ntc-header nav > ul > li > a {
    display: block;
    padding: 12px 10px;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--ntc-dam);
    white-space: nowrap;
}
.ntc-header nav > ul > li:hover > a,
.ntc-header nav > ul > li:focus-within > a { color: var(--ntc-do); }
/* Menu con: ẩn, sổ xuống khi rê chuột / focus bàn phím */
.ntc-header nav li ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 230px;
    background: #fff;
    border: 1px solid var(--ntc-vien);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
    padding: 6px 0;
}
.ntc-header nav li:hover > ul,
.ntc-header nav li:focus-within > ul { display: block; }
.ntc-header nav li ul li { margin: 0; position: relative; }
.ntc-header nav li ul a {
    display: block;
    padding: 7px 16px;
    font-size: 13px;
    color: var(--ntc-dam);
}
.ntc-header nav li ul a:hover { background: #f5f5f5; color: var(--ntc-do); }
.ntc-header nav li ul ul { top: 0; left: 100%; }
.ntc-header nav > ul > li:nth-last-child(-n+3) > ul { left: auto; right: 0; }

/* ---------- Banner trang chủ (owl-demo2 gốc: trái 74% · phải 22% hỗ trợ trực tuyến) ---------- */
.ntc-banner { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); gap: 20px; margin-bottom: 24px; }
.ntc-slider {
    display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
    box-shadow: 0 0 1px #999;
}
.ntc-slider::-webkit-scrollbar { display: none; }
.ntc-slide { flex: 0 0 100%; scroll-snap-align: start; }
.ntc-slide img { display: block; width: 100%; height: auto; aspect-ratio: 912 / 365; object-fit: cover; }
.ntc-ho-tro { box-shadow: 0 0 1px #999; padding: 0 0 12px; align-self: start; }
.ntc-ho-tro h4 { margin: 0 0 10px; padding: 10px; font-size: 14px; color: #000; text-transform: uppercase; border-bottom: 1px solid var(--ntc-vien); }
.ntc-ho-tro p { margin: 0; padding: 0 10px; }
.ntc-ho-tro strong { color: var(--ntc-hotline); }
@media (max-width: 979px) { .ntc-banner { grid-template-columns: 1fr; } .ntc-ho-tro { display: none; } }

/* ---------- Tiêu đề + breadcrumb ---------- */
main h1 {
    font-size: 20px;
    font-weight: 700;
    color: #000;
    margin: 0 0 16px;
    text-transform: uppercase;
}
main section { margin-bottom: 30px; }
main section > h2,
main section > h1.ntc-tieu-de,
main h2.ntc-tieu-de {
    font-size: 14px;
    font-weight: 700;
    color: #000;
    text-transform: uppercase;
    border-bottom: 1px solid var(--ntc-vien);
    margin: 25px 0 20px;
    padding-bottom: 9px;
}
nav[aria-label="Breadcrumb"] { font-size: 13px; margin-bottom: 14px; color: #999; }
nav[aria-label="Breadcrumb"] ol,
nav[aria-label="Breadcrumb"] ul { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0; padding: 0; }
nav[aria-label="Breadcrumb"] li { margin: 0; }
nav[aria-label="Breadcrumb"] li + li::before { content: "›"; margin-right: 6px; color: #bbb; }
nav[aria-label="Breadcrumb"] a { color: #666; }

/* ---------- Lưới thẻ SP / bài ---------- */
.ntc-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}
.ntc-grid article {
    background: #fff;
    box-shadow: 0 0 1px #999;
    display: flex;
    flex-direction: column;
    min-width: 0;
    transition: box-shadow .2s;
}
.ntc-grid article:hover { box-shadow: 0 2px 12px rgba(0, 0, 0, .15); }
.ntc-grid article > a { display: flex; flex-direction: column; flex: 1; }
.ntc-grid img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    background: #fff;
    padding: 8px;
    box-sizing: border-box;
}
.ntc-grid h3 {
    flex: 1;
    margin: 0;
    padding: 10px;
    background: var(--ntc-xam);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.4;
    text-align: center;
    color: var(--ntc-dam);
}
.ntc-grid article p {
    margin: 0;
    padding: 0 10px 12px;
    background: var(--ntc-xam);
    text-align: center;
    color: var(--ntc-do);
    font-weight: 700;
}

/* ---------- Trang SP ---------- */
.ntc-product {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 30px;
    align-items: start;
    margin-bottom: 20px;
}
.ntc-product > img {
    width: 100%;
    height: auto;
    max-height: 520px;
    object-fit: contain;
    box-shadow: 0 0 1px #999;
}
.ntc-product > div p { margin: 0 0 8px; }
.ntc-product > div p:first-child {
    font-size: 22px;
    font-weight: 700;
    color: var(--ntc-do);
    margin-bottom: 14px;
}
.ntc-gallery { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
.ntc-gallery img {
    width: 120px;
    height: 120px;
    object-fit: contain;
    box-shadow: 0 0 1px #999;
}
.ntc-content { line-height: 1.75; margin: 20px 0 30px; }
.ntc-content img { max-width: 100%; height: auto; }
.ntc-content table { max-width: 100%; display: block; overflow-x: auto; }
.ntc-xuat-xu { font-size: 13px; color: #999; font-style: italic; margin: 10px 0 30px; }

/* ---------- Sơ đồ site: 2 cột trên máy tính, bullet nằm trong lề ---------- */
.ntc-sitemap { columns: 2 260px; column-gap: 32px; padding-left: 20px; margin: 0 0 10px; }
.ntc-sitemap li { break-inside: avoid; margin: 0 0 6px; }

/* ---------- Giá vàng ---------- */
.gpv-table-wrap { overflow-x: auto; }
.gpv-province-page table { width: 100%; border-collapse: collapse; }
.gpv-province-page th,
.gpv-province-page td { border: 1px solid var(--ntc-vien); padding: 8px; text-align: left; }
.gpv-province-page th { background: var(--ntc-xam); color: #000; }
.ntc-gold-links ul { columns: 3 220px; padding-left: 18px; }

/* Giá vàng trên điện thoại: bảng 6 cột (Loại · Công ty/nguồn · Mua · Bán · Biến động · Thời điểm —
   khuôn duy nhất của plugin) → mỗi dòng một thẻ; tab đơn vị chia đều 4 ô. Đo 375px 2026-10-05. */
@media (max-width: 640px) {
    .gpv-province-page .gpv-unit-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; overflow: visible; }
    .gpv-province-page .gpv-tab { min-width: 0; padding: 10px 2px; font-size: 13px; white-space: nowrap; }
    .gpv-province-page .gpv-table-wrap { overflow: visible; }
    .gpv-province-page .gpv-table,
    .gpv-province-page .gpv-table tbody { display: block; width: 100%; min-width: 0; border: 0; }
    .gpv-province-page .gpv-table thead { display: none; }
    .gpv-province-page .gpv-table tbody tr {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 2px 12px;
        padding: 12px;
        margin-bottom: 10px;
        border: 1px solid var(--ntc-vien);
        border-radius: 6px;
        background: #fff;
    }
    .gpv-province-page .gpv-table td { display: block; border: 0; padding: 0; min-width: 0; overflow-wrap: anywhere; }
    .gpv-province-page .gpv-table td:nth-child(1) { grid-column: 1 / -1; font-weight: 700; color: #000; font-size: 15px; }
    .gpv-province-page .gpv-table td:nth-child(2) { grid-column: 1 / -1; font-size: 12px; color: #888; margin-bottom: 8px; }
    .gpv-province-page .gpv-table td:nth-child(3),
    .gpv-province-page .gpv-table td:nth-child(4) { font-size: 16px; font-weight: 700; }
    .gpv-province-page .gpv-table td:nth-child(3)::before { content: "Mua vào"; }
    .gpv-province-page .gpv-table td:nth-child(4)::before { content: "Bán ra"; }
    .gpv-province-page .gpv-table td:nth-child(3)::before,
    .gpv-province-page .gpv-table td:nth-child(4)::before { display: block; font-size: 11px; font-weight: 400; color: #888; text-transform: uppercase; }
    .gpv-province-page .gpv-table td:nth-child(5),
    .gpv-province-page .gpv-table td:nth-child(6) { font-size: 12px; margin-top: 8px; }
    .gpv-province-page .gpv-table td:nth-child(6) { text-align: right; color: #888; }
}

/* Content trang giá vàng (agy) + FAQ */
.ntc-gv-bai { margin: 30px 0 10px; line-height: 1.75; }
.ntc-gv-bai h2, .ntc-faq h2 { font-size: 18px; color: #000; margin: 26px 0 10px; }
.ntc-gv-bai h3 { font-size: 16px; color: #000; margin: 18px 0 8px; }
.ntc-gv-bai a { color: var(--ntc-do); text-decoration: underline; }
.ntc-faq { margin: 20px 0 30px; padding: 4px 18px 10px; background: #f7f7f7; border-radius: 6px; }
.ntc-faq h3 { font-size: 15px; color: #000; margin: 16px 0 4px; }
.ntc-faq p { margin: 0 0 8px; }

/* ---------- Footer ---------- */
.ntc-footer {
    background: var(--ntc-xam);
    color: var(--ntc-dam);
    padding: 24px 0 18px;
    margin-top: 20px;
    font-size: 13px;
}
.ntc-footer h5 { font-size: 14px; font-weight: 700; color: #000; margin: 0 0 10px; }
.ntc-footer ul { list-style: none; padding: 0; margin: 0 0 12px; }
.ntc-footer li { margin: 0 0 4px; }
.ntc-footer img { max-width: 160px; height: auto; }
.ntc-footer p:last-child { border-top: 1px solid #ccc; padding-top: 10px; margin: 10px 0 0; }

/* ---------- Điện thoại / máy tính bảng ---------- */
@media (max-width: 979px) {
    .ntc-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
    .ntc-header .ntc-wrap { flex-direction: column; align-items: flex-start; gap: 0; padding-top: 28px; }
    .ntc-brand img { width: 110px; }
    .ntc-header nav { width: 100%; }
    .ntc-header nav > ul {
        flex-wrap: nowrap;
        justify-content: flex-start;
        overflow-x: auto;
        padding-top: 4px;
        -webkit-overflow-scrolling: touch;
    }
    .ntc-header nav li ul { display: none !important; }
    .ntc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .ntc-product { grid-template-columns: 1fr; }
    .ntc-gallery img { width: 88px; height: 88px; }
}