﻿@import url("/data/plugin/fontawesome581pro/fontawesome581pro.css"); 
@import url("https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700&subset=vietnamese&display=swap");
@import url("/fonts/zmdi/zmdi.css"); 
@import url("https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i&subset=vietnamese&display=swap"); 
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,500;1,600&subset=vietnamese&display=swap");


@font-face {
    font-family: 'baskerville';
    src: local('baskerville'), url(/fonts/baskerville/baskerville.woff2) format('woff2');
    src: url('/data/fonts/baskerville/baskerville.ttf') format('truetype')
}

@font-face {
    font-family: 'UTM-Alter-Gothic';
    src: url('/data/fonts/UTM-Alter-Gothic/UTM-Alter-Gothic.ttf') format('truetype')
}

@layer reset, tokens, base, layout, components, template, utilities, overrides;

@layer tokens {
    :root {
        /* Template KHONG co che do dark/light: khoa color-scheme de trinh duyet khong tu doi mau input/select */
        color-scheme: light;
        --az-template-bg: #F6F0DD;
        --az-template-text: #4A2314;
        --az-template-accent: #C9A163;
        --az-template-danger: #7A1712;
        --az-template-danger-dark: #5C0F0B;
        --az-template-gold: #EBD59F;
    }
}


@layer template {
    * {
        outline: none;
        -ms-text-size-adjust: 100%;
        -webkit-text-size-adjust: 100%;
        box-sizing: border-box;
        color: inherit
    }


    body {
        margin: 0;
        padding: 0;
        background-color:var(--az-template-bg);background-image:radial-gradient(rgba(201,161,99,.09) 1px,transparent 1.3px);background-size:24px 24px;
        font-size: 15px;
        font-family: 'Be Vietnam Pro', sans-serif;
        color: black;
    }
    ul{margin:0;padding:0}
    a{text-decoration:none;color:inherit}
    .ui-page{background-color:var(--az-template-bg);background-image:radial-gradient(rgba(201,161,99,.09) 1px,transparent 1.3px);background-size:24px 24px;}
    .ui-panel {width:85%;max-width:500px;height:100%;overflow: auto;z-index: 1001;position:fixed;top:0;left:0}
    .ui-panel-dismiss {width:100%;height:100%;background-color:#000;opacity:.5;position:fixed;z-index:1000;}
    .ui-panel-position-right{left:unset}
    iframe{margin:0;padding:0;border:0}
    .az-template-schema{display:none}
    /* BAT BUOC: OS core (OS.http) an loader toan cuc bang class .az-hide.
       Template nay KHONG load OS.css nen phai tu dinh nghia, neu thieu thi loader khong bao gio tat. */
    .az-hide{display:none !important}

    .az-template-header{width:100%;height:49px;background-color:#5F100C;border-bottom: 1px solid #333;position: fixed;top: 0;left: 0;z-index: 999;display:flex;align-items:center}
    .az-template-header .az-template-logo{height:49px;display:flex;align-items:center;gap:10px;padding-left:15px;text-align:left;flex:0 0 auto;z-index:1}
    .az-template-header .az-template-logo a{font-family:UTM-Alter-Gothic;font-size:26px;color:var(--az-template-gold) !important;line-height:1;white-space:nowrap;display:flex;align-items:center}
    .az-template-header .az-template-logo .fa-bars{font-size:24px;display:block;line-height:1}
    .az-template-header i.fa-shopping-cart{font-size:22px;color:white;position:absolute;right:20px;top:15px}
    #cartcount{width:20px;height:20px;line-height:22px;padding:0;border-radius:50%;color:#fff;background-color:#C13A2C;font-size:0.8rem;display:flex;align-items:center;justify-content:center;position:absolute;top:5px;right:5px;}
    .az-template-cartalert{padding:7px 11px;border-radius:5px;color:yellow;background-color:#C13A2C;text-align:center;line-height:1;white-space:nowrap;display:block;position:absolute;top:56px;right:0;cursor:pointer;display:none;transition:all 0.3s;}
    .az-template-cartalert.active{display:flex;align-items:center;}
    .az-template-cartalert a{font-size:.82rem;font-weight:bold;color:yellow !important;line-height:1.3;}
    .az-template-cartalert .fa-times{margin-left:8px;font-size:.8rem;color:#fff;}
    /* Mui ten tam giac tro len tam icon gio: rong 12px nen right=6px se can giua icon 25px */
    .az-template-cartalert .fa-triangle{width:0;height:0;padding:0;border:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #C13A2C;transform:none;position:absolute;top:-6px;right:6px;}
    /* Tat glyph Font Awesome cua fa-triangle: mui ten da ve bang border, de nguyen se lo them 1 tam giac vang */
    .az-template-cartalert .fa-triangle:before{content:none;display:none}
    /* Gio hang tren Header - scope rieng, KHONG dinh rule .az-template-cart cua TRANG gio (margin:110px auto) */
    .az-template-header .az-template-cart{list-style:none;margin:0;padding:0;max-width:none;position:absolute;top:0;right:12px;height:49px;z-index:2}
    .az-template-header .az-template-cart > li{position:relative;list-style:none;height:49px;display:flex;align-items:center}
    .az-template-header .az-template-cart > li > a{display:flex;align-items:center;gap:6px;height:49px;color:#fff !important}
    .az-template-header .az-template-carticon{position:relative;display:block;width:25px;height:25px}
    .az-template-header .az-template-carticon img{width:25px;height:25px;display:block}
    .az-template-header .az-template-carticon #cartcount{width:15px;height:15px;min-width:15px;line-height:15px;font-size:.6rem;font-weight:600;top:-7px;right:-6px}
    /* Menu ngang tren Desktop (nam trong header) - truoc day thieu CSS nen bi do tran ra goc trai */
    .az-template-header .az-template-menu{flex:1 1 auto;min-width:0;height:49px;margin-left:26px;padding-right:125px;overflow:hidden}
    .az-template-header .az-template-menu ul{list-style:none;margin:0;padding:0;height:49px;display:flex;align-items:center;gap:20px}
    .az-template-header .az-template-menu li{list-style:none;flex:0 0 auto}
    .az-template-header .az-template-menu a{color:#fff !important;font-size:14px;font-weight:500;white-space:nowrap;text-transform:uppercase;letter-spacing:.3px}
    .az-template-header .az-template-menu a:hover{color:var(--az-template-gold) !important}
    .az-template-header .az-template-cart label{color:#fff !important;font-size:1rem;cursor:pointer;white-space:nowrap}

    .banner{width:100%;position:relative}
    .banner > img{width:100%;display:block}
    .banner .title{width: 100%;height: 85px;position: absolute;left: 0;top: calc(50% - 60px);}
    .banner .title1{width:100%;height: 25px;line-height: 25px;font-family: 'Cormorant Garamond', serif;font-size: 16px;text-align: center;color: #C9A163;}
    .banner .title2{width:100%;height: 30px;font-family: UTM-Alter-Gothic;font-size: 22px;letter-spacing: 12px;text-align: center;color: #ffffff;}
    .banner .title3{width:100%;height: 25px;line-height: 25px;padding-top: 5px;font-family: 'Cormorant Garamond', serif;font-size: 12px;font-weight: 400;font-style: italic;text-align: center;color: #ffffff;}
    .banner .pattern{width: 300px;position: absolute;bottom: 5px;left: calc(50% - 150px);}
    .banner .pattern img{display:block;margin:auto}
    /* Chu chi danh cho may tim kiem va trinh doc man hinh — mat khong thay,
       nhung VAN nam trong luong noi dung. Khac han `display:none`, thu ma Google
       coi nhu khong ton tai va trinh doc man hinh cung bo qua. */
    .az-sr-only{
        position:absolute;
        width:1px;
        height:1px;
        margin:-1px;
        padding:0;
        overflow:hidden;
        clip:rect(0,0,0,0);
        white-space:nowrap;
        border:0}

    /* ── DAI CAM KET DUOI HEADER (06/08/2026) ──────────────────────────────
       Bon o tra loi bon cau khach hoi truoc khi dat hang. Khong tieu de lon,
       khong anh, khong nut — de san pham duoc len ngay man hinh dau tien.
       ⚠ Mau bam theo `.az-template-header` (#5F100C): dai nay dam hon mot
         chut de tach duoc ra, nhung van cung ho mau — hai dai doc nhu MOT khoi,
         khong phai hai mieng dan canh nhau.
       ⚠ `margin-top` bang 0: header la `position:fixed` cao 49px, khoang cach
         da do body padding lo. Them margin o day se sinh khe ho la. */
    .az-hero{
        width:100%;
        margin:0;
        /* ⚠ padding-top 50px de tranh bi header de len.
           `.az-template-header` la `position:fixed` cao 49px, nen no KHONG chiem
           cho trong luong tai lieu — phan tu dau tien cua trang se nam ngay duoi no.
           Truoc day khoi `.az-template-sep` dung dau va co `padding-top:30px` nen
           tinh co khong bi che; nay dai cam ket len dau thi phai tu chua lay.
           ⚠ Nen mau van trai het len tren, chay ra sau header — dung y do: hai dai
           doc thanh mot khoi lien mach thay vi co mot vach cat ngang. */
        padding:50px 0 0;
        background:linear-gradient(180deg,#5b1010 0%,#7a1414 100%);
        border-bottom:1px solid rgba(255,191,67,.30);
        color:#f6ecd8;
        overflow:hidden}
    .az-hero-stat{
        display:flex;
        max-width:1200px;
        width:calc(100% - 24px);
        margin:0 auto;
        padding:14px 0 15px;
        list-style:none;
        flex-wrap:wrap}
    .az-hero-stat li{
        flex:1 1 25%;
        min-width:150px;
        padding:4px 10px;
        text-align:center}
    .az-hero-stat b{
        display:block;
        font-family:'Cormorant Garamond', serif;
        font-size:24px;
        font-weight:600;
        line-height:1.2;
        letter-spacing:.01em;
        color:var(--az-template-gold)}
    .az-hero-stat span{
        display:block;
        margin-top:3px;
        font-size:13px;
        line-height:1.35;
        color:#e3d2b4}

    /* Man hep: hai o mot hang thay vi bon o chen chuc */
    @media (max-width: 700px){
        .az-hero-stat li{flex:1 1 50%;min-width:0;padding:6px 4px}
        .az-hero-stat b{font-size:19px}
        .az-hero-stat span{font-size:12px}
    }


    /* ── VUNG BAN CHAY NHAT ────────────────────────────────────────────────
       Lam noi hon cac nhom khac: tieu de to hon, co phu de, va moi the mang
       mot dai ruy bang goc. Dung ::before nen KHONG phai sua markup the san pham
       — the do dung chung cho moi vung. */
    .az-home-group-hot{font-size:34px}
    .az-home-hot .az-template-item{position:relative}
    .az-home-hot .az-template-item::before{
        content:'BÁN CHẠY';
        position:absolute;
        left:0;
        top:8px;
        z-index:3;
        padding:4px 12px 4px 10px;
        border-radius:0 3px 3px 0;
        background-color:var(--az-template-danger);
        font-size:11px;
        font-weight:700;
        letter-spacing:.08em;
        line-height:1.3;
        color:#ffffff}

    /* ── VUNG TREN TRANG CHU (06/08/2026) ──────────────────────────────────
       Trang chu chia thanh cac vung: BAN CHAY NHAT truoc, roi tung nhom.
       ⚠ Dai ngan cach dung LAI anh `banh-trung-thu-bp.png` va class
         `.az-template-sep` san co — khong ve bo hoa van rieng. Mot bo hoa van
         moi chi de ngan cach se lech phong cach voi phan con lai cua trang.
       ⚠ Vung DAU TIEN khong do dai ngan cach (xem Homepage.cshtml): ngay tren no
         da co dung tam anh do o dau trang, do them se thanh hai anh trung nhau. */
    .az-home-sep{margin-top:34px}
    .az-home-group{
        width:100%;
        margin:6px 0 22px;
        font-family:'Cormorant Garamond', serif;
        font-size:30px;
        font-weight:500;
        line-height:1.2;
        text-align:center;
        color:var(--az-template-text)}
    .az-home-group a{color:inherit;text-decoration:none}
    .az-home-group a:hover{color:var(--az-template-danger)}

    /* Anh am tra cuoi trang. Dua style noi tuyen ra day: `display:block` cong
       `margin:auto` la cap can thiet de anh nam giua — de o thuoc tinh style thi
       khong sua tap trung duoc, va rat de bi quen khi doi bo cuc. */
    .az-home-amchen{width:250px;margin:30px auto}
    .az-home-amchen img{display:block;margin:0 auto;max-width:100%;height:auto}

    .az-template-introhome{max-width:800px;width:calc(100% - 20px);padding:0 10px;margin:30px auto 0;text-align:justify;font-family:'Be Vietnam Pro', sans-serif;font-size:16px;line-height:1.33;color:var(--az-template-text)}
    .az-template-introhome h2{width:calc(100%);font-family:'Cormorant Garamond', serif;color:var(--az-template-text);font-size:30px;font-weight:500;text-align:center}
    .az-template-introhome p{font-family:'Be Vietnam Pro', sans-serif;font-size:15.5px !important;color:var(--az-template-text);line-height:1.33}
    .az-template-sep{width:100%;margin:20px auto}
    .az-template-sep img{margin:auto;display:block}

    .az-template-product{max-width:1100px;width:100%;margin:20px auto;display:flex;justify-content:center;flex-wrap:wrap}
    .az-template-product a{color:#474747 !important}
    .az-template-product .az-template-item{width:300px;margin:15px auto}
    .az-template-product .az-template-item .az-template-image{width:300px;height:300px;display:block;position:relative;overflow:hidden}
    .az-template-product .az-template-item .az-template-image img{width:100%;height:100%;position:absolute;top:0;left:0;}
    .az-template-product .az-template-item .az-template-price{width:100%;height:30px;line-height:30px;margin:0 auto;color:var(--az-template-text);font-size:16px;font-weight:500;text-align:center}
    .az-template-product .az-template-item .az-template-price span{font-size:22px;font-weight:bold;color:#7A1712}
    .az-template-product .az-template-item .az-template-price sup{color:#7A1712;margin-left:2px}
    .az-template-product .az-template-item .az-template-name{width:calc(100%);height:35px;line-height:35px;margin:0;padding:0;text-align:center;color:var(--az-template-text);font-family:'Cormorant Garamond', serif;font-size:16px;font-weight:600;overflow:hidden}
    .az-template-product .az-template-item p{margin:0;padding:0;font-size:0.8rem;text-align:center}

    .az-template-book{width:calc(100% - 20px);margin:10px}
    .az-template-book .az-template-minus,.az-template-book .az-template-plus{width:38px;height:38px;line-height:38px;border:1px solid #ddd;background-color:var(--az-template-bg);display:inline-block;vertical-align:top;text-align:center;color:#999999;font-size:16px;font-weight:bold;cursor:pointer;float:left;user-select:none;}
    .az-template-book .az-template-minus:hover,.az-template-book .az-template-plus:hover{background-color:#F4F4F4;}
    /* Bat buoc set nen + mau chu: template KHONG co dark mode, thieu thi trinh duyet tu ap darkmode cho input */
    .az-template-book input[type="text"]{width:50px;height:38px;line-height:38px;margin:0;padding:0 5px;border:1px solid #ddd;border-left:0;border-right:0;background-color:#fff;color:var(--az-template-text);text-align:center;display:inline-block;vertical-align:top;float:left;-webkit-appearance:none;appearance:none}
    .az-template-book input[type="text"].incart{background-color:#eee;color:var(--az-template-text);}
    .az-template-book .az-template-order{max-width:150px;width:calc(100% - 180px);height:40px;line-height:40px;margin-left:10px;padding:0 5px;border-radius:2px;background-color:var(--az-template-danger);text-align:center;font-size:16px;font-weight:bold;color:#ffffff;display:inline-block;vertical-align:top;cursor:pointer;transition:all 0.3s linear}
    .az-template-book .az-template-order:hover{background-color:var(--az-template-danger-dark)}
    /* Khay thong bao tu dung — chi hien khi khung khong co AZ.Toast / AZ.toast / AZ.Alert.
       Dat z-index rat cao de khong bi khoi chat hay nhan vat che mat. */
    #azToastWrap{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:99999;
        display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
    .aztoast{max-width:min(92vw,420px);padding:12px 18px;border-radius:8px;background-color:#333333;
        color:#ffffff;font-size:15px;line-height:1.45;text-align:center;
        box-shadow:0 6px 20px rgba(0,0,0,.25);opacity:1;transition:opacity .35s ease}
    .aztoast.bad{background-color:#7A1712}
    .aztoast.ok{background-color:#1e7d32}
    .aztoast.info{background-color:#1c5d99}
    .aztoast.out{opacity:0}

    /* ── HOP THONG BAO DE MAN (06/08/2026) ─────────────────────────────────
       Dung cho loi CHAN CHOT DON. Khac han toast: khong tu tat, phai bam moi di.
       ⚠ Vi sao can rieng mot kieu: tren dien thoai bo cuc gio hang xep doc,
         nut CHOT DON nam tan day con o nhap sai o tren cach ca man hinh.
         Toast tu tat sau 4,5 giay -> khach khong kip doc, khong biet sua cho nao,
         va bo don. Day la phan hoi that tu khach di dong.
       ⚠ z-index cao hon #azToastWrap (99999) de khong bi toast nao che mat. */
    .azblock{
        position:fixed;
        left:0;
        top:0;
        width:100%;
        height:100%;
        z-index:100000;
        display:flex;
        align-items:center;
        justify-content:center;
        padding:20px;
        background-color:rgba(0,0,0,.55)}
    .azblock-card{
        width:100%;
        max-width:380px;
        padding:22px 22px 18px;
        border-radius:10px;
        background-color:#ffffff;
        box-shadow:0 10px 40px rgba(0,0,0,.3);
        text-align:left}
    .azblock-title{
        margin:0 0 12px;
        font-size:19px;
        font-weight:700;
        line-height:1.3;
        color:var(--az-template-danger)}
    .azblock-list{margin:0;padding:0 0 0 20px;list-style:disc}
    .azblock-list li{
        margin:0 0 6px;
        font-size:15.5px;
        line-height:1.5;
        color:#333333}
    .azblock-ok{
        width:100%;
        height:46px;
        margin:18px 0 0;
        border:0;
        border-radius:6px;
        background-color:var(--az-template-danger);
        font-size:16px;
        font-weight:700;
        color:#ffffff;
        cursor:pointer}
    .azblock-ok:hover{background-color:var(--az-template-danger-dark)}


    /* ⭐ TAM HET HANG — nut giu nguyen kich thuoc va vi tri de bo cuc khong nhay,
       chi doi mau va con tro. CO Y khong dat pointer-events:none: van cho bam de
       hien thong bao kem so dien thoai dat truoc — bam vao nut cam khong phan hoi
       gi con kho chiu hon la nut bi mo. */
    .az-template-book .az-template-order.az-soldout,
    .az-template-book .az-template-order.az-soldout:hover{
        background-color:#9b9b9b;
        color:#ffffff;
        cursor:not-allowed;
        font-size:15px}
    /* Het hang thi bo luon o so luong va hai nut +/- — bat khach chon so luong cho
       mot mon khong mua duoc chi lam ho mat cong roi that vong.
       ⚠ Chon theo [data-soldout="1"] thay vi them class moi: thuoc tinh do da co san
       tren the tu cshtml, khong phai sua markup them mot lan nua. */
    .az-template-book[data-soldout="1"] .az-template-minus,
    .az-template-book[data-soldout="1"] .az-template-plus,
    .az-template-book[data-soldout="1"] input{display:none}
    .az-template-book[data-soldout="1"] .az-template-order{
        width:100%;
        max-width:none;
        margin-left:0}

    .az-template-product .az-template-detail{width:calc(100% - 20px);padding:0 10px;position:relative}
    .az-template-product .az-template-detail > .az-template-name{margin:0;padding:0}
    .az-template-product .az-template-detail > .az-template-name > h3{width:calc(100% - 20px);height:40px;line-height:40px;color:white;margin:0;padding:0 10px;background-color:var(--az-template-accent);text-align:center;font-size:18px;font-weight:bold;text-transform:uppercase;border-top-left-radius:3px;border-top-right-radius:3px}
    .az-template-product .az-template-detail > .az-template-name > div{width:calc(100% - 2px);margin:10px 0;border:1px solid #E1E1E1}
    .az-template-product .az-template-detail > .az-template-name > div > a{width:100%;line-height:37px;background:url(Images/arrowfilter.png) no-repeat right+10px top+17px;text-indent:10px;color:black;font-size:1rem;display:block}
    .az-template-product .az-template-detail > .az-template-name .on > a{background-color:var(--az-template-accent) !important;color:white !important;font-size:16px !important;font-weight:bold !important;background-image:url(Images/arrowfilteron.png) !important}
    .az-template-product .az-template-detail .az-template-image img{max-width:100%;margin:auto;display:block}
    .az-template-product .az-template-detail .az-template-desc{font-size:1rem;border:1px solid #E1E1E1;border-top:0;margin:0;padding:10px;}
    .az-template-product .az-template-detail .az-template-desc p{padding:0;margin:15px 0 0 0}
    .az-template-product .az-template-detail .az-template-list{border-top:0}
    .az-template-product .az-template-detail .az-template-infoimage{width:100%;position:relative}
    .az-template-product .az-template-detail .az-template-infoimage .az-template-image{width:300px;height:300px;margin:0 auto;position:relative}
    .az-template-product .az-template-detail .az-template-infoimage .az-template-image img{width:300px;height:300px;display:block;margin:0;}
    .az-template-product .az-template-detail .az-template-infoimage .az-template-image .az-template-khung{width:300px;height:300px;position:absolute;top:0;left:0;z-index:2;pointer-events:none}
    .az-template-product .az-template-detail .az-template-infoproduct {}
    .az-template-product .az-template-detail .az-template-infoproduct h1{line-height:25px;font-size:18px;font-weight:bold;padding:10px 0;text-align:center;color:var(--az-template-danger);border-bottom:1px solid var(--az-template-danger);text-transform:uppercase}
    .az-template-product .az-template-detail .az-template-infoproduct .az-template-price{font-size:16px;font-weight:bold;color:black}
    .az-template-product .az-template-detail .az-template-infoproduct .az-template-price span{font-size:22px;color:#7A1712;font-weight:bold}
    .az-template-product .az-template-detail .az-template-infoproduct .az-template-price sup{color:#7A1712;margin-left:2px}
    .az-template-product .az-template-detail .az-template-combo{border-top:1px solid #ccc;border-bottom:1px solid #ccc;margin-bottom:10px}
    .az-template-product .az-template-detail .az-template-combo h2{margin:10px 0;font-size:18px}
    .az-template-product .az-template-detail .az-template-combo ul{margin:0;padding:0;list-style:none}
    .az-template-product .az-template-detail .az-template-combo li{margin-bottom:5px;position:relative}
    .az-template-product .az-template-detail .az-template-combo img{width:60px;height:60px}
    .az-template-product .az-template-detail .az-template-combo span{margin-left:5px;font-size:28px;font-weight:bold;color:var(--az-template-danger);position:absolute;top:0;left:70px}
    .az-template-product .az-template-detail .az-template-combo label{margin-left:5px;font-size:18px;position:absolute;left:70px;bottom:0}

    .az-template-intro{padding:20px 20px 50px;}
    .az-template-intro h1{margin:0;padding:0;line-height:60px;width:100%;text-align:center;font-size:26px}
    .az-template-intro h3{margin:0;padding:0;line-height: 1.5;font-size:16px}
    .az-template-intro p{line-height: 1.8;font-size:1rem;}

    .az-template-footer{padding:20px 20px 70px;background:linear-gradient(180deg,#5F100C,#470B08);font-family:'Be Vietnam Pro', sans-serif;font-size:15px;color:#DFC3AD}
    .az-template-footer img{max-width:calc(50% - 20px);max-height:40px;margin:0 10px}
    .az-template-footer h2{margin:0;padding:0;line-height: 1.5;font-size:22px;text-align:left;font-family: 'UTM-Alter-Gothic';color: var(--az-template-gold);font-weight: 400;}
    .az-template-footer h3{margin:0;padding:0;line-height:40px;font-size: 16px;text-align:left}
    .az-template-footer ul{margin:0;padding:0;list-style:none}
    .az-template-footer li{line-height:30px;font-size:1rem}
    .az-template-footer li a{color:inherit !important}
    .az-template-footer i{margin-right:8px}
    .az-template-footer img{max-width:150px;margin:10px 0;display:block}
    .az-template-footer div{margin:0;padding:0;line-height:2;font-size:1rem}
    .az-template-footer .info{margin:20px 0;padding:20px 0;border-top:1px solid #aaa;border-bottom:1px solid #aaa}

    /*Footer*/
    .az-template-navfooter{width:100%;height:49px;border-top:1px solid #A3A3A3;background:#F9F9F9;position:fixed;bottom:0;left:0;z-index:999;box-shadow: 0 0 3px 0 rgba(0,0,0,0.2)}
    .az-template-navfooter ul{margin:0;padding:0;display:flex}
    /* ⚠ Truoc day chot cung width:24pct — dung cho DUNG 4 o. Khi mot o bi an
       (chua co link Shopee, Telephone de NULL) thanh day bi ho mot khoang ben
       phai. flex:1 chia deu cho DU o hien ra, 2 hay 5 o deu kin thanh. */
    .az-template-navfooter li{flex:1 1 0;min-width:0;height:100%;list-style:none;display:inline-block;vertical-align:top;text-align:center}
    .az-template-navfooter a,.az-template-navfooter a:visited{line-height:15px;font-size:0.8rem !important;color:var(--az-template-danger) !important;display:block;padding:0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .az-template-navfooter a.on,.az-template-navfooter a.on .fa{color:var(--az-template-accent);}
    .az-template-navfooter i{width:100%;height:25px;line-height:25px;margin:3px 0;color:var(--az-template-danger);display:block;text-align:center;font-size:20px}
    .az-template-navfooter .gift a{}
    .az-template-navfooter img{width:25px;height:25px;border-radius:50%;display:block;margin:3px auto}

    .az-template-nav{max-width:1100px;margin:0 auto;padding:10px 5px;color:#898989;font-size:1rem;display:block}
    .az-template-nav li{margin:0 5px;color:black !important;font-size:1rem;display:inline}
    .az-template-nav li:first-child{margin-left:0}
    .az-template-nav li:last-child{color:#898989 !important}
    .az-template-nav a{color:inherit !important}

    ul.az-template-page{margin:10px auto;display:flex;justify-content:center}
    ul.az-template-page li{width:32px;height:32px;line-height:34px;margin:0 5px 0 0;border-radius:5px;border:1px solid #E1E1E1;background-color:white;text-align:center;display:inline-block;vertical-align:top}
    ul.az-template-page li a{color:#252525;font-size:1rem;}
    ul.az-template-page li.on{border:1px solid var(--az-template-accent);background-color:var(--az-template-accent);color:white}
    ul.az-template-page li.on a{color:white}
    .az-template-error404{margin:auto;padding:10px}
    .az-template-error404 .title{width:100%;margin:30px auto 0;font-size: 18px;font-weight: 500;line-height: 1.39;text-align: center;color: #2c2c2c;}
    .az-template-error404 img{width:100px;margin:50px auto;display:block;}
    .az-template-error404 .title2{width:100%;font-size: 17px;line-height: 1.47;color: #2c2c2c;text-align: center;}

    .empty{width:calc(100%);height:200px;padding:30px 0;}
    .empty img{max-height:50px;margin:10px auto;display:block;}
    .empty div{width:100%;height:40px;line-height:40px;margin:10px auto;font-size:32px;color:black;text-align:center;display:block;}
    .empty a{width:80%;height:43px;line-height:43px;margin:auto;background-color:rgb(52, 12, 12);border:solid 1px #333;display:block;font-size:20px;color:#fff !important;text-transform:uppercase;text-align:center;}
    .empty a:hover{background-color:#0080D5;}

    .az-template-cart{margin:110px auto 150px;max-width:1100px}
    .az-template-cart .az-template-panel{width:calc(100% - 32px);min-height:100px;margin:0 5px 20px;padding:10px;background-color:#fff;border:solid 1px #ddd}
    .az-template-cart h2{height:40px;line-height:40px;padding:0;margin:0;font-size:16px;color:black;text-align:left;border-bottom:1px solid #ddd;}
    .az-template-cart h3{height:30px;line-height:30px;padding:0;margin:5px;font-size:16px;color:black;text-align:left;}
    .az-template-cart .az-template-item{padding:10px 0;border-bottom:1px solid #ccc;}
    .az-template-cart .az-template-item:last-child{border-bottom:0;}
    .az-template-cart .az-template-image{width:80px;height:80px;display:inline-block;vertical-align:top;}
    .az-template-cart .az-template-image img{max-width:80px;max-height:80px;margin:auto;display:block;}
    .az-template-cart .az-template-name{width:calc(100% - 100px);margin-left:10px;line-height:25px;display:inline-block;vertical-align:top;}
    .az-template-cart .az-template-name a{line-height:30px;font-size:1rem;color:#7A1712;}
    .az-template-cart .az-template-name input[type="text"]{width:80px;height:30px;line-height:30px;margin:0;padding:0 5px;text-align:center;border: solid 1px #ddd;font-size:16px;color:black;}
    .az-template-cart .az-template-quantity{margin-top:5px;float:right;}
    .az-template-cart .az-template-quantity .az-template-minus,.az-template-cart .az-template-quantity .az-template-plus{width:33px;height:33px;line-height:33px;border:1px solid #ddd;display:inline-block;vertical-align:top;text-align:center;color:#999999;font-size:16px;font-weight:bold;cursor:pointer;}
    .az-template-cart .az-template-quantity .az-template-minus:hover,.az-template-cart .az-template-quantity .az-template-plus:hover{background-color:#F4F4F4;}
    .az-template-cart .az-template-quantity input[type="text"]{height:33px;line-height:33px;margin:0;padding:0;border-radius:0;border-top:1px solid #ddd;border-bottom:1px solid #ddd;text-align:center;display:inline-block;vertical-align:top;}
    .az-template-cart .bank{width: 150px;height: 30px;line-height: 30px;border: 1px solid #D09D2C;margin: 5px;padding: 5px 0;background-color: white;display: inline-block;vertical-align: top;cursor: pointer;overflow: hidden;text-align: center;font-weight: bold;}
    .az-template-cart .bank img{max-width: 100%;max-height: 100%;margin: auto;display: block;transition: all 0.5s;}
    .az-template-cart button{width:100%;height:40px;line-height:40px;padding:0 10px;border:0;background-color:var(--az-template-danger-dark);color:#fff;font-size:16px;font-weight:500;letter-spacing:1px;text-transform:uppercase;cursor:pointer;}
    .az-template-cart .az-template-PaymentConfirm{margin:10px}
    .az-template-cart .promotion{margin:10px 0;display:inline-block}
    .az-template-cart .promotion > input[type="text"]{max-width:calc(100% - 120px);width:200px;height:38px;line-height:38px;padding:0 10px;margin:0;border:1px solid #ccc;border-right:0;border-top-left-radius:5px;border-bottom-left-radius:5px;outline:none;display:inline-block;vertical-align:top;float:left}
    .az-template-cart .promotion div{width:calc(100% - 110px);margin:0;padding:0;line-height:20px;font-size:1rem;color:#afafaf;font-weight:500;float:left;clear:both}
    .az-template-cart .promotion span{width:calc(100%);margin:10px 0 5px;padding:0;line-height:20px;font-size:1rem;color:#212121;font-weight:500;display:inline-block}
    .az-template-cart .promotion > button{width:100px;height:40px;line-height:40px;margin:0;padding:0 10px;border:0;border-top-right-radius:5px;border-bottom-right-radius:5px;background-color:#7A1712;text-align:center;font-size:1rem;font-weight:bold;color:#ffffff;display:inline-block;vertical-align:top;cursor:pointer;transition:all 0.3s linear;display:inline-block;vertical-align:top;float:left}
    .az-template-cart .promotion > button:hover{background-color:#7A1712;}
    .az-template-cart .promotion > button.del{border-radius:5px}
    .az-template-cart .coupon{width:100%;display:inline-block}
    .az-template-cart .coupon div{width:calc(100% - 100px);margin:0;padding:0;line-height:20px;font-size:1rem;color:#afafaf;font-weight:500;float:left;clear:both}
    .az-template-cart .coupon span{width:calc(100%);margin:10px 0 5px;padding:0;line-height:20px;font-size:1rem;color:#212121;font-weight:500;display:inline-block}
    .az-template-cart .coupon button{width:90px;height:30px;float:right;padding:5px 10px;margin:10px 0;line-height:unset;font-size:0.8rem;text-align:center;display:block;border-radius:4px;background:#fff;color:#C13A2C;border:solid 1px #C13A2C}
    .az-template-cart .coupon button:hover{background-color:#fff;}
    .az-template-cart .coupon ul{margin:0;padding:0;list-style:none;display:inline}
    .az-template-cart .coupon li{text-indent:5px;display:inline}
    .az-template-cart .coupon li:before{content:", ";}
    .az-template-cart .coupon li:first-child{text-indent:0}
    .az-template-cart .coupon li:first-child:before{content:"";}

    .az-template-cartfooter{width:calc(100% - 20px);padding:5px 10px;background-color:#fff;position:fixed;bottom:0;left:0;z-index:999;border-top:1px solid #ccc;}
    .az-template-cartfooter div{height:25px;line-height:25px;text-align:right;color:#aaa;display:flex}
    .az-template-cartfooter label{width:calc(50% - 10px);height:25px;line-height:25px;font-size:16px;color:black;text-align:left;vertical-align:top;display:inline-block;}
    .az-template-cartfooter span{width:50%;height:25px;line-height:25px;color:black;font-size:16px;font-weight:bold;vertical-align:top;display:inline-block;}
    .az-template-cartfooter button,.az-template-cartfooter a{width:calc(100%);height:35px;line-height:35px;margin:10px 0;padding:0;border:0;background-color:#7A1712;color:#fff !important;font-size:16px;font-weight:500;letter-spacing:1px;text-transform:uppercase;cursor:pointer;display:block;text-align:center}

    /* Panel menu mobile - slide-in tu trai + overlay (JS them .active / .az-template-menudim) */
    .az-template-menudim{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);z-index:1000}
    .az-template-panelmenu{width:85%;max-width:360px;height:100%;background:#fff;position:fixed;top:0;left:0;z-index:1001;overflow-y:auto;-webkit-overflow-scrolling:touch;transform:translateX(-100%);transition:transform .25s ease}
    .az-template-panelmenu.active{transform:translateX(0)}
    .az-template-panelmenu .az-template-search{position:relative;padding:42px 15px 12px;background:#5F100C}
    .az-template-panelmenu .az-template-search .close{position:absolute;top:8px;right:12px;z-index:2}
    .az-template-panelmenu .az-template-search .close a{color:#fff !important;font-size:20px}
    .az-template-panelmenu .az-template-search > span{position:relative;display:block}
    .az-template-panelmenu .az-template-search input[type="text"]{width:100%;height:40px;line-height:40px;padding:0 42px 0 12px;border:0;border-radius:5px;font-size:15px;color:#333;box-sizing:border-box}
    .az-template-panelmenu .az-template-search > span > a{position:absolute;top:0;right:0;width:42px;height:40px;line-height:40px;text-align:center;color:#999 !important;font-size:16px}
    .az-template-panelmenu .az-template-menu ul{list-style:none;margin:0;padding:0}
    .az-template-panelmenu .az-template-menu > ul > li > a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 15px;background:var(--az-template-bg);border-bottom:1px solid #e0d5b8;color:var(--az-template-text) !important;font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:.3px}
    .az-template-panelmenu .az-template-menu > ul > li > a .fa-chevron-right{flex:0 0 auto;color:var(--az-template-gold);font-size:12px}
    .az-template-panelmenu .az-template-menu ul ul{background:#fff;padding:2px 0}
    .az-template-panelmenu .az-template-menu ul ul li a{display:block;padding:11px 15px 11px 32px;border-bottom:1px solid #f2ece0;color:var(--az-template-text) !important;font-size:14px;font-weight:500;position:relative}
    .az-template-panelmenu .az-template-menu ul ul li a:before{content:'';width:5px;height:5px;margin-top:-2px;border-radius:50%;background:var(--az-template-gold);position:absolute;top:50%;left:16px}
    .az-template-panelmenu .az-template-menu ul ul li:last-child a{border-bottom:0}
    .az-template-panelmenu .az-template-menu ul ul li a .fa-chevron-right{display:none}
    .az-template-panelmenu .az-template-menu li.on > a{color:var(--az-template-danger) !important}
    .az-template-panelmenu .az-template-menu li.on > a:before{background:var(--az-template-danger)}
    .az-template-panelmenu .az-template-schema{display:none}


    /* ⚠ Sau day la 6 rule truoc kia nam NGOAI @layer — CSS khong layer
       thang MOI @layer nen chung de gay loi kho hieu. Da dua vao dung tang. */
    .az-template-vary {
    	width: calc(100% - 20px);
    	margin: 15px 10px 5px;
    }
    
    .az-template-vary > label {
    	display: block;
    	margin-bottom: 8px;
    	font-family: 'Be Vietnam Pro', sans-serif;
    	font-size: 14.5px;
    	font-weight: 600;
    	color: #4A2314;
    }
    
    .az-template-vary ul {
    	margin: 0;
    	padding: 0;
    	list-style: none;
    	display: flex;
    	flex-wrap: wrap;
    	gap: 8px;
    }
    
    .az-template-vary li {
    	min-height: 42px;
    	line-height: 1.3;
    	padding: 10px 16px;
    	border: 1px solid #ddd;
    	border-radius: 4px;
    	background-color: #fff;
    	font-size: 15px;
    	color: #4A2314;
    	cursor: pointer;
    	user-select: none;
    	display: flex;
    	align-items: center;
    	transition: all 0.2s linear;
    }
    
    .az-template-vary li:hover {
    	border-color: #7A1712;
    	background-color: #FDF6F5;
    }
    
    .az-template-vary li.on {
    	border-color: #7A1712;
    	border-width: 2px;
    	padding: 9px 15px;
    	background-color: #F6F0DD;
    	font-weight: 600;
    }
}

/* ============================================================================
   Style.vary.css - Khoi chon bien the (ti le vo banh)
   Chen vao cuoi Style.css. Giu dung phong cach mau san co cua trang.
   ========================================================================== */

/* Man hinh nho: nut chiem het chieu ngang cho de bam */
@media (max-width: 480px) {
	.az-template-vary ul {
		flex-direction: column;
	}

	.az-template-vary li {
		width: 100%;
		min-height: 48px;
		font-size: 16px;
	}
}



/* ============================================================================
   MAN GIO HANG — truoc day nam o App.css rieng
   ----------------------------------------------------------------------------
   Gop vao day de template chi con MOT tep style. Nhung App.css von chi duoc nap
   o bon trang gio hang, con Style.css nap o MOI trang — bung nguyen si vao la
   "html, body { background-color: #f0f4f5 }" de bep nen kem cua trang chu.
   Nen moi rule duoi day deu duoc gioi han trong "body.az-cart"; Layout chi gan
   class do khi dang o trang gio hang.

   Khoi nay co Y nam NGOAI @layer, giong het luc App.css nap rieng: CSS khong
   layer thang moi @layer, giu dung do uu tien cu.
   ============================================================================ */
:root {
    /* Khoa che do sang: he dieu hanh dat dark mode thi trinh duyet tu doi mau
       nen/chu cua input, select, textarea -> o nhap thanh nen den chu trang,
       lech han tong mau template. Mot dong nay chan het.
       Style.css cua web da co; App.css (man gio hang) truoc day thieu. */
    color-scheme: light;
    --safe-top: var(--safe-top);
    --safe-top: env(safe-area-inset-top);
    --safe-bottom: var(--safe-bottom);
    --safe-bottom: env(safe-area-inset-bottom);
    --button-bg:#7A1712;
    --button-bg-hover:#1d96b2
}

/* Chot chan lop hai: bat ky rule nao khac tro tay lam the an nay phinh ra thi
   van bi keo ve. Nhan bon lan ten lop de do cu the (0,5,1) vuot moi rule hien co.
   Day dung la cach `OS_legacy.css` dang dung voi `.az-legacy.az-legacy`. */
select.select2-hidden-accessible.select2-hidden-accessible.select2-hidden-accessible.select2-hidden-accessible{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    margin:-1px !important;
    padding:0 !important;
    border:0 !important;
    overflow:hidden !important;
    clip:rect(0 0 0 0) !important;
    clip-path:inset(50%) !important;
    white-space:nowrap !important}

/* ============================================================================
   BANG CHON KENH CHAT (thanh bam day dien thoai)
   ----------------------------------------------------------------------------
   ⚠ Tien to rieng `azchat-`. Bung tu DUOI len — ngon tay khach dang o day man,
     bang truot len la trong tam mat va trong tam voi ngay.
   ============================================================================ */
.azchat-sheet {
    position: fixed;
    inset: 0;
    z-index: 100001;
    display: flex;
    align-items: flex-end;
}
.azchat-bg {
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, .45);
}
.azchat-box {
    position: relative;
    z-index: 1;
    width: 100%;
    padding: 16px 14px calc(14px + env(safe-area-inset-bottom, 0px));
    background-color: #fff;
    border-radius: 14px 14px 0 0;
    box-shadow: 0 -8px 30px rgba(0, 0, 0, .2);
}
.azchat-title {
    margin: 0 0 12px;
    color: #333;
    font-size: .95rem;
    font-weight: 600;
    text-align: center;
}
.azchat-item {
    margin: 0 0 8px;
    padding: 12px 14px;
    border: 1px solid #e2e2e2;
    border-radius: 10px;
    color: #333 !important;
    display: flex;
    align-items: center;
    gap: 13px;
}
.azchat-item > i {
    width: 38px;
    height: 38px;
    line-height: 38px;
    border-radius: 50%;
    background-color: rgba(237, 47, 46, .1);
    color: #7A1712;
    font-size: 1.05rem;
    text-align: center;
    flex-shrink: 0;
}
.azchat-item > span { flex: 1 1 auto; min-width: 0; }
.azchat-item b { font-size: .95rem; font-weight: 600; line-height: 1.35; display: block; }
.azchat-item span > i {
    color: #888;
    font-size: .8rem;
    font-style: normal;
    line-height: 1.4;
    display: block;
}
.azchat-cancel {
    margin: 6px 0 0;
    padding: 12px;
    border-radius: 10px;
    background-color: rgba(127, 127, 127, .09);
    color: #666 !important;
    font-size: .92rem;
    font-weight: 500;
    text-align: center;
    display: block;
}
.az-hide { display: none !important; }

/* ============================================================================
   CONG CU LIEN HE — DESKTOP (cot bam ben phai)
   ----------------------------------------------------------------------------
   Dien thoai co thanh bam day; desktop truoc day khong co gi, khach muon goi
   phai cuon xuong chan trang tim so. Khoi nay bam ben phai, luon trong tam mat.
   ⚠ Chi hien >= 1200px. Duoi nguong da co thanh bam day roi, hai thu cung hien
     la de len nhau.
   ============================================================================ */
@media (min-width: 1200px) {
    .azdesk-tool {
        position: fixed;
        right: 14px;
        top: 50%;
        transform: translateY(-50%);
        z-index: 9990;
        width: 62px;
        display: flex;
        flex-direction: column;
        gap: 8px;
        transition: width .18s ease;
    }
    /* ⚠ Thu gon con mot cot bieu tuong; ro chuot vao moi bung ra day chu.
       Khong chiem cho khi khach dang xem banh, nhung van o day khi can. */
    .azdesk-tool:hover { width: 232px; }

    .azdesk-item {
        height: 54px;
        padding: 0 10px;
        border: 1px solid #e0d5c4;
        border-radius: 10px;
        background-color: #fff;
        color: #444 !important;
        box-shadow: 0 2px 10px rgba(0, 0, 0, .08);
        display: flex;
        align-items: center;
        gap: 11px;
        overflow: hidden;
        transition: border-color .12s ease, box-shadow .12s ease;
    }
    .azdesk-item:hover {
        border-color: #7A1712;
        box-shadow: 0 4px 16px rgba(237, 47, 46, .18);
    }
    .azdesk-item > i {
        width: 38px;
        height: 38px;
        line-height: 38px;
        border-radius: 50%;
        background-color: rgba(237, 47, 46, .1);
        color: #7A1712;
        font-size: 1.05rem;
        text-align: center;
        flex: 0 0 38px;
    }
    .azdesk-item > span {
        flex: 1 1 auto;
        min-width: 0;
        opacity: 0;
        white-space: nowrap;
        transition: opacity .12s ease;
    }
    .azdesk-tool:hover .azdesk-item > span { opacity: 1; }
    .azdesk-item b {
        font-size: .92rem;
        font-weight: 600;
        line-height: 1.3;
        display: block;
    }
    .azdesk-item span > i {
        color: #999;
        font-size: .76rem;
        font-style: normal;
        line-height: 1.3;
        display: block;
    }

    /* So dien thoai la thu khach can DOC va CHEP — cho chon bang mot cu bam */
    .azdesk-tel b { user-select: all; }

    /* O tu van dam hon: day la cho khach dang phan van nen bam vao */
    .azdesk-chat {
        border-color: #7A1712;
        background-color: rgba(237, 47, 46, .05);
    }
    .azdesk-chat > i {
        background-color: #7A1712;
        color: #fff;
    }

    /* Bang chon kenh tren desktop: hop giua man, khong truot tu duoi len */
    .azchat-sheet { align-items: center; justify-content: center; }
    .azchat-box {
        width: 420px;
        max-width: calc(100% - 40px);
        padding: 20px;
        border-radius: 12px;
        box-shadow: 0 14px 44px rgba(0, 0, 0, .26);
    }

    @media (prefers-reduced-motion: reduce) {
        .azdesk-tool,
        .azdesk-item,
        .azdesk-item > span { transition: none; }
    }

}


/* Nhan vat AI Mai dung goc phai duoi — day cot cong cu len de khong de nhau */
@media (min-width: 1200px) {
    .azdesk-tool { margin-top: -40px; }
}


/* ============================================================================
   THANH TIEU DE — DAY NHOM SAN PHAM SANG PHAI, GAN GIO HANG
   ----------------------------------------------------------------------------
   Rule goc: `.az-template-menu{flex:1 1 auto; margin-left:26px}` — khoi menu
   chiem het cho con lai va BAT DAU ngay sau logo, nen cac nhom san pham dinh
   sat ten thuong hieu con khoang giua thi trong tenh.
   Sua: giu `flex:1` de khoi van an het cho (khong lam vo bo cuc), nhung day
   NOI DUNG ben trong sang phai bang `justify-content:flex-end`.
   ⚠ Chi ap >= 1200px: duoi nguong do menu la ngan keo ra tu canh, khong phai
     hang ngang.
   ============================================================================ */
@media (min-width: 1200px) {
    .az-template-header .az-template-menu {
        margin-left: 26px;
        /* 125px chua cho khoi "Gio hang" dang dat position:absolute o phai */
        padding-right: 140px;
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }
    .az-template-header .az-template-menu > ul {
        margin: 0;
        display: flex;
        align-items: center;
    }
}


/* ============================================================================
   TRANG CHI TIET SAN PHAM — khoi tin cay + thong so
   ----------------------------------------------------------------------------
   ⚠ Tien to rieng `azprod-`. Template co san rat nhieu rule cho `div`, `label`,
     `span` trong pham vi `.az-template-*` — dung ten chung la bi de.
   ============================================================================ */
.azprod-trust {
    margin: 16px 0 0;
    padding: 13px 15px;
    border-radius: 8px;
    background-color: rgba(127, 127, 127, .06);
    text-align: left;
}
.azprod-trust > div {
    padding: 4px 0;
    color: #666;
    font-size: .88rem;
    line-height: 1.6;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.azprod-trust > div > i {
    width: 20px;
    color: #7A1712;
    font-size: .95rem;
    text-align: center;
    flex: 0 0 20px;
    margin-top: 2px;
}
.azprod-trust b { color: #333; font-weight: 600; }

.azprod-spec {
    margin: 18px 0 0;
    padding: 14px 0 0;
    border-top: 1px solid #eee;
    text-align: left;
}
.azprod-specrow {
    padding: 8px 0;
    border-bottom: 1px solid #f2f2f2;
    display: flex;
    align-items: flex-start;
    gap: 14px;
}
.azprod-specrow:last-child { border-bottom: 0; }
.azprod-specrow > label {
    width: 150px;
    flex: 0 0 150px;
    color: #888;
    font-size: .88rem;
    line-height: 1.6;
    text-align: left;
}
.azprod-specrow > span {
    flex: 1 1 auto;
    min-width: 0;
    color: #333;
    font-size: .92rem;
    line-height: 1.6;
}
.azprod-specrow > span > b { font-weight: 600; }
/* Dong phu: ngay duoi, mo hon — khong bat mat khoi con so chinh */
.azprod-specrow > span > i {
    display: block;
    margin-top: 2px;
    color: #999;
    font-size: .8rem;
    font-style: normal;
    line-height: 1.5;
}

@media (max-width: 640px) {
    .azprod-specrow { display: block; }
    .azprod-specrow > label {
        width: auto;
        margin-bottom: 2px;
        font-size: .82rem;
        display: block;
    }
    .azprod-trust > div { font-size: .84rem; }
}


/* --- Dai anh phu trang san pham ---------------------------------------- */
.azprod-gallery {
    margin: 10px auto 0;
    max-width: 500px;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;
}
.azprod-thumb {
    aspect-ratio: 1;
    border: 1px solid #e0d5c4;
    border-radius: 6px;
    background-color: #fff;
    overflow: hidden;
    display: block;
    cursor: pointer;
    transition: border-color .12s ease;
}
.azprod-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.azprod-thumb:hover { border-color: #c9b48f; }
/* Anh dang xem: vien do — dau hieu duy nhat cho biet dang o anh nao */
.azprod-thumb.active {
    border-color: #7A1712;
    border-width: 2px;
}

@media (max-width: 640px) {
    .azprod-gallery {
        grid-template-columns: repeat(4, 1fr);
        max-width: none;
        padding: 0 10px;
    }
}


/* ============================================================================
   TRANG CHI TIET SAN PHAM — BO CUC HAI COT + TONG MAU
   ----------------------------------------------------------------------------
   ⚠ Tien to `az-prod-*`, dat SONG SONG voi lop `az-template-*` cu chu KHONG
     thay the: JS dang tim `.az-template-book/minus/plus/order/vary` de lo chuc
     nang mua hang. Doi ten lop cu la gay dat hang.
   ⚠ Nen trang la giay kem (#f5ecd7) co hoa van. Khoi noi dung dung nen trang
     MO `rgba(255,255,255,.6)` — de hoa van hien mo phia sau, giu khong khi Trung
     thu, ma chu van doc duoc. Trang duc 100% se cat trang thanh nhung mieng
     roi rac.
   ============================================================================ */

/* --- Bang mau dung chung cho trang san pham -------------------------------
   Lay tu tong nen giay kem san co cua template, khong doi mau thuong hieu. */
.az-prod-page {
    --az-prod-ink: #3d2b1f;      /* chu chinh — nau dam thay vi den tuyen */
    --az-prod-ink2: #7a6a5a;     /* chu phu */
    --az-prod-line: #e3d7c0;     /* duong ke — cung ho voi nen giay */
    --az-prod-panel: rgba(255, 255, 255, .6);
    --az-prod-red: #7A1712;      /* do thuong hieu */
}

.az-prod-panel,
.az-prod-buy,
.az-prod-info {
    background-color: var(--az-prod-panel);
    border-radius: 10px;
}

@media (min-width: 1200px) {
    .az-prod-page {
        max-width: 1200px;
        /* Cach header 30px — truoc day dinh sat, chu de len vien duoi header */
        margin: 30px auto 0;
        padding: 0 20px 40px;
    }
    .az-prod-main {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        column-gap: 30px;
        align-items: start;
    }
    .az-prod-media { grid-column: 1; grid-row: 1; }
    .az-prod-buy {
        grid-column: 2;
        grid-row: 1;
        padding: 22px 26px;
        text-align: left;
    }
    .az-prod-info {
        grid-column: 1 / -1;
        grid-row: 2;
        margin-top: 22px;
        padding: 22px 26px;
        text-align: left;
    }
    .az-prod-buy h1 {
        margin: 0 0 14px;
        font-size: 1.55rem;
        line-height: 1.3;
        color: var(--az-prod-ink);
        text-align: left;
    }
    .az-prod-buy .az-template-price {
        margin: 0;
        padding-bottom: 18px;
        /* ⚠ Da BO vien duoi (05/08/2026): voi san pham KHONG co bien the, duong ke nay
           nam sat ngay tren hang so luong + nut Mua ngay, cat doi khoi mua hang thanh
           hai manh roi rac. Giu nguyen padding de khoang cach khong doi. */
        border-bottom: 0;
        color: var(--az-prod-ink2);
        text-align: left;
    }
    .az-prod-buy .az-template-book {
        margin: 0;
        display: flex;
        align-items: stretch;
        gap: 10px;
    }
    .az-prod-buy .az-template-order {
        flex: 1 1 auto;
        height: 48px;
        line-height: 48px;
        font-size: 1rem;
    }
}


@media (max-width: 1199px) {
    /* ⚠ Man dien thoai hep — MOT con so duy nhat cho ca le ngoai lan le trong:
       10px. Truoc day ba lop chong nhau (page 10 + margin 10 + padding 18) lam
       moi ben mat 38px; tren man 390px thi noi dung chi con ~62% be ngang.
       ⚠ TAT CA nam trong `max-width: 1199px` — khong cham vao desktop. */
    .az-prod-page {
        margin-top: 10px;
        padding: 0 0 24px;
    }
    /* ⚠ Le NGOAI do chinh `.az-template-detail` lo (padding 5px moi ben), nen
       cac khoi con KHONG dat margin ngang nua — dat nua la cong don lai. */
    .az-template-product .az-template-detail {
        width: calc(100% - 10px);
        padding: 10px 5px;
    }
    .az-prod-buy,
    .az-prod-info {
        margin: 10px 0 0;
        padding: 14px 12px;
        border-radius: 10px;
    }
    .az-prod-buy h1 {
        margin-bottom: 10px;
        font-size: 1.15rem;
    }
    .az-prod-buy .az-template-price { padding-bottom: 14px; }
    .az-prod-buy .az-template-vary { margin: 18px 0 16px; }

    /* Anh trai het be ngang cot — le da do `.az-template-detail` lo */
    .az-prod-media .az-template-image,
    .az-prod-media .az-template-image img {
        width: 100%;
        max-width: none;
        height: auto;
        aspect-ratio: 1;
        margin: 0 auto;
    }
    .az-prod-media .azprod-gallery {
        max-width: none;
        margin: 8px 0 0;
        padding: 0;
    }
    .az-prod-buy .azprod-trust { padding: 11px 12px; }
    .az-prod-info .azprod-specrow { padding: 7px 0; }
}


/* --- CHON TI LE VO BANH — the chon, khong phai hang nut tran ngang -------
   ⚠ Cau truc that la <label> + <ul><li>. `az-template-vary` giu nguyen ten vi
     JS gan su kien theo `li`. */
/* ⚠ KHONG dung border-top o day. Ngay tren la khoi Gia ban — von da co
   duong ke duoi cua chinh no. Hai duong ke sat nhau tao mot dai xam nhin
   nhu loi dan trang. Tach bang KHOANG TRONG, khong bang duong ke. */
.az-prod-buy .az-template-vary {
    margin: 24px 0 20px;
    padding: 0;
    border: 0;
    display: block;
    width: auto;
}
.az-prod-buy .az-template-vary > label {
    width: auto;
    height: auto;
    line-height: 1.4;
    margin: 0 0 12px;
    color: var(--az-prod-ink);
    font-size: .95rem;
    font-weight: 600;
    text-align: left;
    display: block;
}
.az-prod-buy .az-template-vary > ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}
.az-prod-buy .az-template-vary > ul > li {
    width: auto;
    height: auto;
    line-height: 1.4;
    margin: 0;
    padding: 11px 13px;
    border: 1px solid var(--az-prod-line);
    border-radius: 8px;
    background-color: rgba(255, 255, 255, .75);
    color: var(--az-prod-ink);
    font-size: .88rem;
    font-weight: 500;
    text-align: left;
    list-style: none;
    cursor: pointer;
    transition: border-color .12s ease, background-color .12s ease;
}
.az-prod-buy .az-template-vary > ul > li:hover {
    border-color: #c9b48f;
    background-color: #fff;
}
/* Bien the dang chon: vien do + nen do rat nhat
   ⚠ `.on` PHAI dung dau danh sach: script.js ProductVary() gan dung class `on`,
     khong phai active/select/selected. Thieu no thi lua chon dang chon KHONG
     hien khac gi cac o con lai — ke ca lua chon mac dinh do JS tu ap luc nap
     trang. Rule cu `.az-template-vary li.on` co ton tai nhung nam TRONG @layer
     nen luon thua rule khong-layer o ngay tren, du do cu the the nao. */
.az-prod-buy .az-template-vary > ul > li.on,
.az-prod-buy .az-template-vary > ul > li.active,
.az-prod-buy .az-template-vary > ul > li.select,
.az-prod-buy .az-template-vary > ul > li.selected {
    border-color: var(--az-prod-red);
    background-color: rgba(193, 29, 13, .07);
    color: var(--az-prod-red);
    font-weight: 600;
}

@media (max-width: 480px) {
    .az-prod-buy .az-template-vary > ul { grid-template-columns: 1fr; }
}


/* --- Khoi tin cay: hoa vao tong giay kem --------------------------------- */
.az-prod-buy .azprod-trust {
    background-color: rgba(255, 255, 255, .55);
    border: 1px solid var(--az-prod-line);
}
.az-prod-buy .azprod-trust > div { color: var(--az-prod-ink2); }
.az-prod-buy .azprod-trust b { color: var(--az-prod-ink); }
.az-prod-buy .azprod-trust > div > i { color: var(--az-prod-red); }

/* --- Bang thong so: duong ke am, chu nau ---------------------------------- */
.az-prod-info .azprod-spec { max-width: 760px; border-top-color: var(--az-prod-line); }
.az-prod-info .azprod-specrow { border-bottom-color: var(--az-prod-line); }
.az-prod-info .azprod-specrow > label { color: var(--az-prod-ink2); }
.az-prod-info .azprod-specrow > span { color: var(--az-prod-ink); }
.az-prod-info .azprod-specrow > span > i { color: #9a8a78; }

/* --- Anh san pham lap day cot trai ---------------------------------------
   ⚠ Rule goc khoa cung `width:300px; height:300px` cho ca `.az-template-image`
     lan the `img` ben trong. Cot trai rong ~540px nen anh 300px de lai mot
     vung trong lon — dung loi trong anh chup.
     Cho anh an het be ngang cot, gioi han 520px de khong to qua khoi mua hang. */
@media (min-width: 1200px) {
    .az-prod-media .az-template-image {
        width: 100%;
        max-width: 520px;
        height: auto;
        aspect-ratio: 1;
        margin: 0 auto;
    }
    .az-prod-media .az-template-image img {
        width: 100%;
        height: 100%;
        max-width: none;
        object-fit: cover;
        display: block;
        margin: 0;
    }
    /* Khung vien trang tri phu theo anh, khong con neo theo 500px co dinh */
    .az-prod-media .az-template-image .az-template-khung {
        width: 100%;
        height: 100%;
        object-fit: fill;
        position: absolute;
        top: 0;
        left: 0;
    }
    /* Dai anh phu can theo be ngang anh chinh */
    .az-prod-media .azprod-gallery { max-width: 520px; }
}


@media (min-width: 641px) and (max-width: 1199px) {
    .az-prod-media .az-template-image,
    .az-prod-media .az-template-image img {
        width: 100%;
        max-width: 420px;
        height: auto;
        aspect-ratio: 1;
    }
}


/* --- Anh am chen ngan cach --------------------------------------------------
   ⚠ Truoc day dat style noi tuyen `margin:auto;display:block`. Nhung the dung
     `data-src` (nap luoi) nen TRUOC khi anh ve, the chua co kich thuoc va
     `margin:auto` khong co gi de can. Dat bang lop rieng, co san chieu rong
     toi da, thi cho trong duoc giu san va anh khong nhay khi ve toi. */
.az-prod-divider {
    display: block;
    width: auto;
    max-width: 160px;
    height: auto;
    margin: 26px auto;
}

@media (max-width: 1199px) {
    .az-prod-divider { max-width: 120px; margin: 18px auto; }
}

/* ⚠ KHOI NAY CO Y NAM NGOAI @layer - dat lai 14/08/2026.
   Truoc do no nam trong `@layer template`; tren may that giao dien khong an,
   trang Cam nang ra chu tran. CSS KHONG layer luon thang MOI @layer, nen dua
   ra ngoai la bo han mot bien so - giong het cach khoi `:root` o tren da lam.
   Bien mau `--az-template-*` van dung duoc: custom property khong theo layer. */
/* ================================================================
   CAM NANG (News) - 14/08/2026, theo mockup da duyet.
   Chi dung token mau co san cua template (khong che mau moi):
   danger = do son - gold = vang dong - bg = giay - text = nau do.
   Phan trang dung lai .az-template-page co san.
   ================================================================ */
    /* ---- Khoi Cam nang tren trang chu (phuong an A) ---- */
    .az-home-news { max-width: 1200px; margin: 26px auto 10px; padding: 0 14px; }
    .az-home-news-head { text-align: center; margin-bottom: 18px; }
    .az-home-news-kicker { display: inline-block; color: var(--az-template-danger);
        font-weight: 700; font-size: 13px; letter-spacing: 3px; text-transform: uppercase; }
    .az-home-news-head h2 { margin: 4px 0 0; color: var(--az-template-text); font-size: 28px; }
    .az-home-news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .az-home-news-card { display: flex; flex-direction: column; background: #FFFDF6;
        border: 1px solid var(--az-template-gold); border-radius: 12px; overflow: hidden;
        text-decoration: none; color: var(--az-template-text);
        transition: transform .18s ease, box-shadow .18s ease; }
    .az-home-news-card:hover { transform: translateY(-3px);
        box-shadow: 0 10px 24px rgba(71, 0, 0, .16); }
    .az-home-news-thumb { display: block; aspect-ratio: 16/9; overflow: hidden;
        background: var(--az-template-bg); }
    .az-home-news-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .az-home-news-body { display: flex; flex-direction: column; gap: 7px; padding: 12px 14px 14px; }
    .az-home-news-body > b { font-size: 16.5px; line-height: 1.4; }
    .az-home-news-sum { font-size: 13.5px; line-height: 1.5; opacity: .82;
        display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
    .az-home-news-more { text-align: center; margin: 18px 0 6px; }
    .az-home-news-more a { color: var(--az-template-danger); font-weight: 700; text-decoration: none; }
    .az-home-news-more a:hover { color: var(--az-template-danger-dark); }

    /* ---- Chip chuyen muc kieu trien do ---- */
    .az-news-chip { display: inline-block; background: var(--az-template-danger); color: #FFF3E4;
        font-size: 11.5px; font-weight: 700; font-style: normal; letter-spacing: 1.4px;
        text-transform: uppercase; padding: 4px 10px 3px; border-radius: 4px;
        text-decoration: none; line-height: 1.4;
        box-shadow: inset 0 0 0 1px rgba(255, 243, 228, .55); }
    a.az-news-chip:not(.on):not(:hover) { background: transparent; color: var(--az-template-danger);
        box-shadow: inset 0 0 0 1.5px var(--az-template-danger); }
    a.az-news-chip:hover, .az-news-chip.on { background: var(--az-template-danger); color: #FFF3E4; }
    .az-news-chip-mini { align-self: flex-start; }

    /* ---- Trang danh sach ---- */
    .az-news-list { max-width: 1200px; margin: 0 auto; padding: 6px 14px 30px; }
    .az-news-h1 { color: var(--az-template-text); font-size: 30px; margin: 10px 0 12px; }
    .az-news-h2 { color: var(--az-template-text); font-size: 22px; margin: 6px 0 12px; }
    .az-news-filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
    .az-news-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
    .az-news-card { display: flex; flex-direction: column; background: #FFFDF6;
        border: 1px solid var(--az-template-gold); border-radius: 12px; overflow: hidden;
        text-decoration: none; color: var(--az-template-text);
        transition: transform .18s ease, box-shadow .18s ease; }
    .az-news-card:hover { transform: translateY(-3px);
        box-shadow: 0 10px 24px rgba(71, 0, 0, .16); }
    .az-news-thumb { display: block; aspect-ratio: 16/9; overflow: hidden;
        background: var(--az-template-bg); }
    .az-news-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .az-news-body { display: flex; flex-direction: column; gap: 7px; padding: 12px 14px 14px; }
    .az-news-body > b { font-size: 16.5px; line-height: 1.4; }
    .az-news-sum { font-size: 13.5px; line-height: 1.5; opacity: .82;
        display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
    .az-news-empty { padding: 30px 10px; text-align: center; opacity: .75; }

    /* ---- Trang bai viet ---- */
    .az-news-article { max-width: 780px; margin: 0 auto; padding: 8px 14px 6px;
        color: var(--az-template-text); }
    .az-news-meta { display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
        font-size: 13px; opacity: .9; margin: 6px 0 8px; }
    .az-news-article h1 { font-size: 30px; line-height: 1.3; margin: 4px 0 10px; }
    .az-news-sapo { font-size: 17px; line-height: 1.6; margin: 0 0 14px; font-weight: 500; }
    .az-news-hero { border-radius: 12px; overflow: hidden; margin: 0 0 16px; }
    .az-news-hero img { width: 100%; display: block; }
    .az-news-desc { font-size: 15.5px; line-height: 1.7; }
    .az-news-desc h2 { font-size: 22px; margin: 26px 0 8px; color: var(--az-template-text); }
    .az-news-desc h2 + p > b:first-child { color: var(--az-template-danger-dark); }
    .az-news-desc img { max-width: 100%; height: auto; border-radius: 10px; }
    .az-news-desc blockquote { margin: 12px 0; padding: 10px 16px;
        border-left: 4px solid var(--az-template-gold); background: #FFF6DF; border-radius: 0 10px 10px 0; }

    /* ---- Bang gia dong (token BANG_GIA_SAN_PHAM) ---- */
    .az-news-pricegroup { font-size: 19px; margin: 22px 0 8px; color: var(--az-template-danger-dark); }
    .az-news-pricetable { width: 100%; border-collapse: collapse; font-size: 14.5px; margin: 0 0 10px; }
    .az-news-pricetable th, .az-news-pricetable td { text-align: left; padding: 9px 10px;
        border-bottom: 1px solid var(--az-template-gold); }
    .az-news-pricetable th { font-size: 12.5px; letter-spacing: 1px; text-transform: uppercase; opacity: .8; }
    .az-news-pricetable td:nth-child(2) { white-space: nowrap; font-weight: 700; }
    .az-news-pricetable a { color: var(--az-template-text); text-decoration: none; }
    .az-news-pricetable a:hover { color: var(--az-template-danger); }
    .az-news-buy { display: inline-block; background: var(--az-template-danger); color: #FFF3E4 !important;
        font-size: 13px; font-weight: 700; padding: 6px 12px; border-radius: 7px; }
    .az-news-buy:hover { background: var(--az-template-danger-dark); }

    /* ---- CTA cuoi bai + banner hotline ---- */
    .az-news-cta, .az-news-hotbanner { display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
        background: linear-gradient(135deg, var(--az-template-danger), var(--az-template-danger-dark));
        color: #FFF3E4; border-radius: 14px; padding: 18px 20px; margin: 26px 0 10px; }
    .az-news-cta-text, .az-news-hotbanner-text { flex: 1; min-width: 220px;
        display: flex; flex-direction: column; gap: 3px; }
    .az-news-cta-text b, .az-news-hotbanner-text b { font-size: 17px; }
    .az-news-cta-text span, .az-news-hotbanner-text span { font-size: 13.5px; opacity: .92; }
    .az-news-cta-btns { display: flex; gap: 10px; flex-wrap: wrap; }
    .az-news-btn { display: inline-block; background: #FFF3E4; color: var(--az-template-danger-dark);
        font-weight: 700; font-size: 14.5px; padding: 10px 18px; border-radius: 8px; text-decoration: none; }
    .az-news-btn:hover { background: #FFE9C9; }
    .az-news-btn-line { background: transparent; color: #FFF3E4;
        box-shadow: inset 0 0 0 1.5px rgba(255, 243, 228, .85); }
    .az-news-btn-line:hover { background: rgba(255, 243, 228, .12); }
    .az-news-related { padding-top: 14px; }

    /* ---- Man hep ---- */
    @media (max-width: 860px) {
        .az-home-news-grid, .az-news-grid { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 620px) {
        .az-home-news-grid, .az-news-grid { grid-template-columns: 1fr; }
        .az-home-news-head h2 { font-size: 23px; }
        .az-news-article h1, .az-news-h1 { font-size: 25px; }
    }

/* ================================================================
   HUONG TRA ADDON V2 (15/08/2026) — khoi rieng + lam mem khung BTK
   ----------------------------------------------------------------
   Nen tang: bo template Bao Phuong ban 15/08/2026 (Style.css v157 +
   Cart.css v24). Khoi nay CHI them, KHONG doi ten lop cu vi script.js
   dang tim theo chung (az-template-book/minus/plus/order/vary...).
   - Prefix az-ht-* : hero banner, USP, di san 1986, ke hoa, chung nhan,
     ban do chan trang.
   - @layer overrides : bo goc mem, khung anh MOT vien, nut pill.
   Go addon = cat tu banner nay den het tep.
   ================================================================ */
.az-ht-hero{position:relative;margin:0;padding:52px 22px 34px;overflow:hidden;color:#F1E7C9;text-align:left;background-color:#5C0F0B;background-size:cover;background-position:right center;background-repeat:no-repeat}
.az-ht-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(74,11,8,0) 50%,rgba(74,11,8,.78) 86%,rgba(74,11,8,.9) 100%),linear-gradient(90deg,rgba(71,11,8,.95) 0%,rgba(92,15,11,.88) 32%,rgba(92,15,11,.62) 52%,rgba(92,15,11,.24) 72%,rgba(92,15,11,.36) 100%)}
.az-ht-hero::after{content:"";position:absolute;inset:12px;border:1px solid rgba(201,161,99,.6);border-radius:18px;pointer-events:none}
.az-ht-heroinner{position:relative;max-width:1160px;margin:0 auto}
.az-ht-heroinner > *{max-width:620px}
.az-ht-eyebrow{display:inline-block;margin-bottom:12px;color:var(--az-template-gold);font-size:12px;font-weight:600;letter-spacing:3.2px;text-transform:uppercase}
.az-ht-title{margin:0 0 12px;line-height:1.05}
.az-ht-titletop{display:block;margin-bottom:7px;font-size:15px;font-weight:600;letter-spacing:7px;color:#F1E7C9}
.az-ht-titlemain{display:inline-block;font-family:'Cormorant Garamond',serif;font-size:58px;font-weight:700;letter-spacing:3px;color:#C9A163;background:linear-gradient(180deg,#F4E7BC 0%,#DDC084 48%,#A47B41 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 1px 0 rgba(60,30,10,.35))}
.az-ht-slogan{display:block;margin:2px 0 12px;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:19px;color:var(--az-template-gold)}
.az-ht-lead{margin:0 0 22px;color:rgba(241,231,201,.94);font-size:15.5px;line-height:1.6;text-shadow:0 1px 2px rgba(60,10,8,.45)}
.az-ht-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:4px}
.az-ht-btn{display:inline-block;min-height:46px;padding:12px 28px;border:0;border-radius:999px;font-size:15.5px;font-weight:700;cursor:pointer;transition:filter .2s,transform .15s;text-align:center}
.az-ht-btn:active{transform:translateY(1px)}
.az-ht-btngold{background:linear-gradient(180deg,#F0DFAA 0%,#D9BC82 55%,#BB9250 100%);color:#4A2314 !important;box-shadow:inset 0 0 0 1px rgba(150,112,59,.65),0 4px 14px rgba(0,0,0,.22)}
.az-ht-btngold:hover{filter:brightness(1.06)}
/* Bon o chi so — dung lai lop az-hero-stat cua khung, chi doi khung canh */
.az-ht-hero .az-ht-stats{max-width:none;margin:26px 0 0;padding-top:18px;border-top:1px solid rgba(201,161,99,.35);background:none}
.az-ht-hero .az-ht-stats li{border:0;background:none;padding:0 10px}
.az-ht-hero .az-ht-stats b{color:var(--az-template-gold);font-family:'Cormorant Garamond',serif}
.az-ht-hero .az-ht-stats span{color:rgba(241,231,201,.8)}
.az-ht-usp{max-width:1160px;margin:-26px auto 8px;padding:0 12px;position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.az-ht-uspitem{flex:1 1 240px;max-width:272px;min-width:220px;padding:16px 16px 15px;background:#FFFDF6;border:1px solid rgba(201,161,99,.75);border-radius:18px;box-shadow:0 10px 28px rgba(92,15,11,.10);text-align:center}
.az-ht-uspitem i{width:36px;height:36px;margin:0 auto 8px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#F0DFAA,#CDA968);color:#C13A2C;font-size:15px;font-style:normal;box-shadow:inset 0 0 0 1px rgba(150,112,59,.5)}
.az-ht-uspitem b{display:block;margin-bottom:3px;font-size:14.5px;color:var(--az-template-danger);font-family:'Be Vietnam Pro',sans-serif}
.az-ht-uspitem p{margin:0;font-size:12.5px;line-height:1.5;color:#8A6F55}
.az-ht-divider{max-width:420px;margin:30px auto;display:flex;align-items:center;gap:12px;scroll-margin-top:70px}
.az-ht-divider::before,.az-ht-divider::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--az-template-accent))}
.az-ht-divider::after{background:linear-gradient(90deg,var(--az-template-accent),transparent)}
.az-ht-divider span{color:#C13A2C;font-size:13px;line-height:1}
.az-ht-story{position:relative;margin:34px 0 0;padding:40px 20px 44px;overflow:hidden;background:linear-gradient(180deg,var(--az-template-danger) 0%,var(--az-template-danger-dark) 100%);color:#F1E7C9}
.az-ht-story::before{content:"";position:absolute;inset:12px;border:1px solid rgba(201,161,99,.5);border-radius:18px;pointer-events:none}
.az-ht-story > *{position:relative}
.az-ht-storyhead{text-align:center;margin-bottom:8px}
.az-ht-storyhead h2{display:block;margin:0;font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:700;color:var(--az-template-gold)}
.az-ht-storyhead p{max-width:640px;margin:10px auto 0;font-size:14.5px;color:rgba(241,231,201,.88)}
.az-ht-timeline{max-width:1020px;margin:30px auto 0;display:flex;gap:26px;justify-content:center;position:relative}
.az-ht-timeline::before{content:"";position:absolute;top:9px;left:8%;right:8%;height:1px;background:linear-gradient(90deg,transparent,var(--az-template-accent) 18%,var(--az-template-accent) 82%,transparent)}
.az-ht-milestone{flex:1 1 0;max-width:320px;text-align:center;padding:0 8px;position:relative}
.az-ht-dot{width:19px;height:19px;margin:0 auto 14px;border-radius:50%;background:linear-gradient(180deg,#F0DFAA,#C29538);box-shadow:0 0 0 4px var(--az-template-danger),0 0 0 5px rgba(201,161,99,.6)}
.az-ht-year{font-family:'Cormorant Garamond',serif;font-size:27px;font-weight:700;color:var(--az-template-gold);line-height:1.1}
.az-ht-milestone b{display:block;margin:4px 0 5px;font-size:14.5px;color:#F1E7C9}
.az-ht-milestone p{margin:0;font-size:13px;line-height:1.55;color:rgba(241,231,201,.82)}
.az-ht-quote{max-width:660px;margin:32px auto 0;text-align:center}
.az-ht-quotemark{display:block;font-family:'Cormorant Garamond',serif;font-size:52px;line-height:.6;color:var(--az-template-accent);margin-bottom:8px}
.az-ht-quote p{margin:0 0 20px;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:21px;line-height:1.5;color:var(--az-template-gold)}
.az-ht-certs{max-width:900px;margin:18px auto 6px;padding:0 20px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.az-ht-cert{padding:8px 16px;border:1px solid var(--az-template-accent);border-radius:999px;background:#FFFDF6;font-size:12.5px;color:var(--az-template-text)}
.az-ht-cert b{color:var(--az-template-danger)}
.az-ht-mapcol .az-ht-map{border:1px solid rgba(201,161,99,.55);border-radius:14px;overflow:hidden;margin-top:4px}
.az-ht-mapcol .az-ht-map iframe{display:block;width:100%;border:0}
.az-ht-mapnote{font-size:12.5px;margin-top:6px}
@media (max-width:900px){
    .az-ht-timeline{flex-direction:column;align-items:center;gap:22px}
    .az-ht-timeline::before{top:9px;bottom:9px;left:calc(50% - .5px);right:auto;width:1px;height:auto;background:linear-gradient(180deg,transparent,var(--az-template-accent) 14%,var(--az-template-accent) 86%,transparent)}
    .az-ht-milestone{max-width:420px}
}
@media (max-width:640px){
    .az-ht-hero{padding:34px 16px 26px;text-align:center;background-position:68% center}
    .az-ht-hero::before{background:linear-gradient(180deg,rgba(74,11,8,.9) 0%,rgba(74,11,8,.86) 100%)}
    .az-ht-heroinner > *{max-width:none}
    .az-ht-titletop{font-size:12.5px;letter-spacing:5px}
    .az-ht-titlemain{font-size:38px;letter-spacing:2px}
    .az-ht-actions{justify-content:center}
    .az-ht-usp{margin-top:-18px}
    .az-ht-uspitem{max-width:none;flex:1 1 100%}
    .az-ht-storyhead h2{font-size:28px}
}
@layer overrides{
    /* Lam mem khung — chi hinh khoi, khong dung kich thuoc/logic JS dang dua vao */
    .az-template-header .az-template-logo a{display:inline-flex;align-items:center;gap:9px;letter-spacing:1px}
    .az-template-header .az-template-logo img{height:38px;width:auto}
    .az-template-product .az-template-item .az-template-image{border:1px solid var(--az-template-accent);border-radius:13px;padding:6px;background:#FFFDF6;box-sizing:border-box}
    .az-template-product .az-template-item .az-template-image img{top:6px;left:6px;width:calc(100% - 12px);height:calc(100% - 12px);border-radius:8px;object-fit:cover}
    .az-template-product .az-template-detail .az-template-infoimage .az-template-image{border:1px solid var(--az-template-accent);border-radius:13px;padding:6px;background:#FFFDF6}
    .az-template-product .az-template-detail .az-template-infoimage .az-template-image img{border-radius:8px}
    .az-template-khung{display:none !important}
    .az-template-item .az-template-name{font-family:'Cormorant Garamond',serif}
    .az-template-book .az-template-minus{border-radius:999px 0 0 999px}
    .az-template-book .az-template-plus{border-radius:0 999px 999px 0}
    .az-template-book .az-template-minus,.az-template-book .az-template-plus{background-color:#FFFDF6;color:#B49A73;transition:background .2s,color .2s}
    .az-template-book .az-template-minus:hover,.az-template-book .az-template-plus:hover{background-color:#F5EDDA;color:var(--az-template-danger)}
    .az-template-book .az-template-order{border-radius:999px;color:#F1E7C9;transition:background .25s,color .25s}
    .az-template-book .az-template-order:hover{background:linear-gradient(180deg,#F0DFAA,#D0AC6A);color:#4A2314}
    .az-template-cartalert{border-radius:999px}
    .az-template-page li a{border-radius:10px}
    .azdesk-item,.azchat-item{border-radius:999px}
    .azchat-box{border-radius:18px}
    .azprod-thumb{border-radius:10px}
    .az-home-group{font-family:'Cormorant Garamond',serif;color:var(--az-template-danger)}
    .az-template-footer h2{font-family:'Cormorant Garamond',serif;color:var(--az-template-gold);letter-spacing:1px}
    .az-template-footer h3{font-family:'Cormorant Garamond',serif;color:#F1E7C9}
}


/* ============================================================================
   NEN HOA VAN HUONG TRA (toan trang) — 03/09/2026
   ----------------------------------------------------------------------------
   Giu nguyen mau nen kem va luoi cham vang von co, chi CHONG THEM o hoa van
   images/bg-huongtra.svg len tren. Hai lop cung khai trong mot rule: lop dau
   la hoa van (360px), lop sau la luoi cham cu (24px).
   Khoi nay NGOAI @layer va nam cuoi tep nen thang rule body/.ui-page phia tren.
   Muon tra ve nen cu: xoa nguyen khoi nay.
   ============================================================================ */
body {
    background-color: var(--az-template-bg, #F6F0DD);
    background-image: url("images/bg-huongtra.svg"), radial-gradient(rgba(201, 161, 99, .09) 1px, transparent 1.3px);
    background-size: 360px 360px, 24px 24px;
    background-repeat: repeat, repeat;
    background-position: center top, left top;
}

/* .ui-page von cung ve nen kem + cham -> de trong suot cho hoa van cua body hien qua,
   neu khong se co hai lop cham chong nhau. */
.ui-page {
    background-color: transparent;
    background-image: none;
}

@media (min-width: 768px) {
    body {
        background-attachment: fixed, fixed;
    }
}


/* ============================================================================
   CHAN TRANG BA COT (may tinh) — 03/09/2026
   ----------------------------------------------------------------------------
   Truoc: Style.css KHONG he co rule cho .container / .column cua chan trang
   (grep ra 0 dong) -> bon khoi xep chong doc, ban do keo dai het be ngang man
   hinh, chan trang cao gan hai man. Nay chia luoi:
       may tinh (>=980px): 3 cot  = lien he | lien ket | chi duong
       may bang (>=640px) : 2 cot, cot ban do trai het be ngang
       dien thoai         : 1 cot, giu nguyen thu tu doc
   Khoi nay NGOAI @layer va nam cuoi tep nen thang cac rule .az-template-footer
   khai o tren; muon tra ve nhu cu chi can xoa nguyen khoi.
   ============================================================================ */
.az-template-footer .container {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 26px;
    align-items: start;
}

.az-template-footer .column {
    min-width: 0;
}

/* h3 dau tien trong cot khong can khoang tren; cac h3 sau thi can tach nhom */
.az-template-footer .column h3 {
    margin-top: 14px;
}

.az-template-footer .column h3:first-child {
    margin-top: 0;
}

.az-template-footer .column > div {
    line-height: 1.9;
}

/* Ban do: cao co dinh, bo goc, khong tran ra ngoai cot */
.az-ht-mapcol .az-ht-map iframe {
    height: 200px;
}

/* Dong cuoi: ban quyen + nhan hieu, trai het be ngang, tach bang mot duong mo */
.az-ht-footbot {
    max-width: 1200px;
    margin: 22px auto 0;
    padding-top: 14px;
    border-top: 1px solid rgba(201, 161, 99, .28);
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 6px 20px;
    font-size: 13px;
    color: rgba(223, 195, 163, .85);
}

@media (min-width: 640px) {
    .az-template-footer .container {
        grid-template-columns: 1fr 1fr;
        gap: 24px 36px;
    }
    /* May bang: ban do dep nhat khi trai het be ngang, khong ep vao nua cot */
    .az-template-footer .az-ht-mapcol {
        grid-column: 1 / -1;
    }
}

@media (min-width: 980px) {
    .az-template-footer {
        padding-left: 28px;
        padding-right: 28px;
    }
    .az-template-footer .container {
        grid-template-columns: 1.2fr 0.9fr 1.1fr;
        gap: 40px;
    }
    .az-template-footer .az-ht-mapcol {
        grid-column: auto;
    }
    .az-ht-mapcol .az-ht-map iframe {
        height: 240px;
    }
}


/* ============================================================================
   HAI SUA GIAO DIEN — 03/09/2026
   ============================================================================ */

/* --- 1. O "Tu van" ben phai man hinh bi TRONG SUOT ------------------------
   .azdesk-item dat nen #fff, nhung .azdesk-chat viet de len bang
   rgba(237,47,46,.05) — mau do 5 pct tren nen TRONG SUOT, khong phai tren
   nen trang -> nhin xuyen thay anh bia phia sau, chu chong len anh.
   Nay dat mau DAC da tron san (do 5 pct chong len trang = #FEF5F4). */
.azdesk-chat,
.azdesk-item[name="btChatMenu"] {
    background-color: #FEF5F4;
}

.azdesk-chat:hover,
.azdesk-item[name="btChatMenu"]:hover {
    background-color: #FDEBE9;
}

/* --- 2. Hang so luong: dau tru / o so / dau cong phai DINH LIEN nhau ------
   Trang chi tiet dung .az-prod-buy .az-template-book { display:flex; gap:10px }
   — khoang cach 10px do ap cho MOI phan tu con, ke ca ba o so luong, nen
   chung roi ra thanh ba manh. Cac man khac (danh sach, cung loai) thi khoi
   nay la inline-block: khoang trang giua cac the trong HTML tu tao khe ~4px.
   Nay: bo gap, dat hang so luong thanh mot khoi lien, chi nut Mua ngay moi
   cach ra. Vien input da co border-left/right:0 nen ghep vao la lien mach. */
.az-template-book {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;
}

.az-template-book .az-template-minus,
.az-template-book .az-template-plus,
.az-template-book input[type="text"] {
    flex: 0 0 auto;
}

.az-template-book .az-template-order {
    margin-left: 12px;
}

/* Trang chi tiet: ba o cao bang nut Mua ngay cho thang hang */
.az-prod-buy .az-template-book {
    gap: 0;
}

.az-prod-buy .az-template-book .az-template-minus,
.az-prod-buy .az-template-book .az-template-plus {
    width: 46px;
    height: 46px;
    line-height: 44px;
}

.az-prod-buy .az-template-book input[type="text"] {
    width: 62px;
    height: 46px;
    line-height: 46px;
    font-size: 1rem;
}


/* --- 3. Chan trang: hai muc bo sung — kenh chinh thuc + gian cach nhom ----
   Cot 1 nay co them dong gio nhan don / giao hang / thanh toan va hai lien ket
   kenh ban chinh thuc; cot 3 co them nhom lien ket duoi ban do. */
.az-ht-footsocial {
    margin-top: 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.az-ht-footsocial a {
    padding: 7px 14px;
    border: 1px solid rgba(201, 161, 99, .45);
    border-radius: 999px;
    color: #F1E7C9 !important;
    font-size: .92rem;
    line-height: 1.4;
    display: inline-flex;
    align-items: center;
    transition: background-color .15s ease, border-color .15s ease;
}

.az-ht-footsocial a:hover {
    border-color: var(--az-template-gold);
    background-color: rgba(201, 161, 99, .16);
}

.az-ht-footsocial a i {
    margin-right: 8px;
}

/* Nhom lien ket duoi ban do: cach ban do mot khoang cho ro la muc khac */
.az-ht-mapcol h3 {
    margin-top: 18px;
}

.az-ht-mapcol h3:first-child {
    margin-top: 0;
}

/* Dong cuoi co ba so giay to nen dai: cho phep xuong dong va can trai tren dien thoai */
.az-ht-footbot span:last-child {
    text-align: right;
}

@media (max-width: 639px) {
    .az-ht-footbot span:last-child {
        text-align: left;
    }
}


/* --- 4. Ban do trai het be ngang, dat CUOI chan trang — 03/09/2026 -------
   Truoc: ban do nam trong cot 3 nen chi rong khoang mot phan ba, phai zoom
   moi doc duoc ten pho. Nay ba cot lien ket xong roi moi den ban do, keo het
   be ngang khoi chan trang -> nhin ro ca doan Thuy Khue va cac diem moc quanh.
   Giu ca lop az-ht-mapcol de thua vien + bo goc da khai o tren. */
.az-ht-mapfull {
    max-width: 1200px;
    margin: 26px auto 0;
}

.az-ht-mapfull h3 {
    margin-top: 0;
}

.az-ht-mapfull .az-ht-map iframe {
    height: 220px;
}

@media (min-width: 980px) {
    .az-ht-mapfull .az-ht-map iframe {
        height: 300px;
    }
    /* Cot 3 nay chi con danh sach lien ket -> chia lai cho can */
    .az-template-footer .container {
        grid-template-columns: 1.25fr 0.85fr 0.9fr;
    }
}
