/**
 * HPM Security – Anti-Copy Document Protection CSS.
 *
 * @package HitechPolicyManager
 */

/* ------------------------------------------------------------------ */
/*  Disable text selection                                             */
/* ------------------------------------------------------------------ */

/*
 * user-select la thuoc tinh KE THUA, nen dat o <body> la ca cay DOM nhan duoc.
 * Ban truoc viet them `body.hpm-no-select *` voi !important: mot selector pho
 * quat ap len tung phan tu cua trang, buoc trinh duyet tinh lai style cho toan
 * bo trang moi lan co bat ky thay doi lop CSS nao — day la ly do bam chuot hay
 * boi den trong tai lieu dai bi giat. Bo di, hanh vi khong doi.
 */
div.hc-wp.hpm-no-select {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/*
 * Cho phep boi den o o nhap lieu, va o thong tin lien he.
 *
 * Chan sao chep so hotline, dia chi email, dia chi tru so hay ma so thue la tu
 * chan chinh viec khach dinh lam: goi, gui mail, dan vao hop dong. Lop chong
 * sao chep sinh ra de giu noi dung bien tap, khong phai de giu thong tin lien
 * he — cai do cang di xa cang tot.
 *
 * `hpm-copy-ok` la lop mo san: bat ky mau giao dien nao cung danh dau duoc khoi
 * cua minh ma khong phai sua tep nay. Danh sach nay phai khop voi COPY_ALLOWED
 * trong assets/js/hpm-security.js.
 */
div.hc-wp.hpm-no-select input,
div.hc-wp.hpm-no-select textarea,
div.hc-wp.hpm-no-select select,
div.hc-wp.hpm-no-select [contenteditable="true"],
div.hc-wp.hpm-no-select [contenteditable="true"] *,
div.hc-wp.hpm-no-select .hpm-copy-ok,
div.hc-wp.hpm-no-select .hpm-copy-ok *,
div.hc-wp.hpm-no-select address,
div.hc-wp.hpm-no-select address *,
div.hc-wp.hpm-no-select a[href^="tel:"],
div.hc-wp.hpm-no-select a[href^="mailto:"],
div.hc-wp.hpm-no-select .ct-aside,
div.hc-wp.hpm-no-select .ct-aside *,
div.hc-wp.hpm-no-select .ct-channels-bar,
div.hc-wp.hpm-no-select .ct-channels-bar *,
div.hc-wp.hpm-no-select .ct-directory,
div.hc-wp.hpm-no-select .ct-directory *,
div.hc-wp.hpm-no-select .footer-address-area,
div.hc-wp.hpm-no-select .footer-address-area *,
div.hc-wp.hpm-no-select .footer-hotline-bar,
div.hc-wp.hpm-no-select .footer-hotline-bar *,
div.hc-wp.hpm-no-select .footer-contact-qr-card,
div.hc-wp.hpm-no-select .footer-contact-qr-card *,
div.hc-wp.hpm-no-select #hlc-widget,
div.hc-wp.hpm-no-select #hlc-widget *,
div.hc-wp.hpm-no-select #hlc-panel,
div.hc-wp.hpm-no-select #hlc-panel *,
div.hc-wp.hpm-no-select .hlc-frame,
div.hc-wp.hpm-no-select .hlc-frame *,
div.hc-wp.hpm-no-select .hci-doc,
div.hc-wp.hpm-no-select .hci-doc *,
div.hc-wp.hpm-no-select .htc-est,
div.hc-wp.hpm-no-select .htc-est *,
div.hc-wp.hpm-no-select .hiv6-embed,
div.hc-wp.hpm-no-select .hiv6-embed *,
div.hc-wp.hpm-no-select .whois-card,
div.hc-wp.hpm-no-select .whois-card *,
div.hc-wp.hpm-no-select .whois-info-grid,
div.hc-wp.hpm-no-select .whois-info-grid *,
div.hc-wp.hpm-no-select .htc-status-article,
div.hc-wp.hpm-no-select .htc-status-article *,
div.hc-wp.hpm-no-select .htc-pr__table,
div.hc-wp.hpm-no-select .htc-pr__table *,
div.hc-wp.hpm-no-select .c26-pricing-table,
div.hc-wp.hpm-no-select .c26-pricing-table *,
div.hc-wp.hpm-no-select code,
div.hc-wp.hpm-no-select pre,
div.hc-wp.hpm-no-select kbd,
div.hc-wp.hpm-no-select samp {
    -webkit-user-select: text !important;
    -moz-user-select: text !important;
    -ms-user-select: text !important;
    user-select: text !important;
}

/* ------------------------------------------------------------------ */
/*  Disable drag                                                       */
/* ------------------------------------------------------------------ */

div.hc-wp.hpm-no-drag img,
div.hc-wp.hpm-no-drag a img,
div.hc-wp.hpm-no-drag video,
div.hc-wp.hpm-no-drag audio,
div.hc-wp.hpm-no-drag [draggable="true"] {
    -webkit-user-drag: none !important;
    -moz-user-drag: none !important;
    user-drag: none !important;
    pointer-events: none !important;
}

/* Re-enable pointer events on links that wrap images (so links still work). */
div.hc-wp.hpm-no-drag a[href] img {
    pointer-events: auto !important;
}

/* ------------------------------------------------------------------ */
/*  Print protection – hide content when printing                      */
/* ------------------------------------------------------------------ */

@media print {
    div.hc-wp.hpm-no-select {
        display: none !important;
    }

    div.hc-wp.hpm-no-select::after {
        content: "Nội dung này được bảo vệ. Vui lòng liên hệ HiTechCloud để được hỗ trợ.";
        display: block !important;
        text-align: center;
        padding: 60px 20px;
        font-size: 18px;
        color: #333;
    }
}

/* ------------------------------------------------------------------ */
/*  Watermark overlay                                                  */
/* ------------------------------------------------------------------ */

/*
 * Mot phan tu duy nhat voi anh nen SVG lap lai, thay cho 60 the <span> position
 * fixed cua ban truoc. Cung mot hinh, nhung trinh duyet chi phai bo cuc mot o
 * thay vi 60 o inline-block nam de len toan trang.
 *
 * `contain` giu moi tinh toan lai nam trong lop nay, khong lan ra phan con lai.
 */
.hc-wp .hpm-watermark-overlay {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 999999;
    background-repeat: repeat;
    contain: strict;
}

/* ------------------------------------------------------------------ */
/*  Debug banner                                                       */
/* ------------------------------------------------------------------ */

.hc-wp #hpm-debug-banner {
    animation: hpm-debug-slide-up 0.3s ease-out;
}

@keyframes hpm-debug-slide-up {
    from { transform: translateY(100%); opacity: 0; }
    to   { transform: translateY(0); opacity: 1; }
}

.hc-wp #hpm-debug-banner button:hover {
    background: rgba(0, 255, 136, 0.15) !important;
}

/* ------------------------------------------------------------------ */
/*  Bang canh bao ban quyen                                            */
/* ------------------------------------------------------------------ */

/*
 * Ban truoc chan thao tac ma khong noi gi: nguoi doc bam chuot phai thi menu
 * khong hien, khong ro vi sao. Bang nay hien MOI lan co thao tac bi chan, va
 * doi giong khi lap lai tu lan thu ba.
 */
.hc-wp .hpm-guard {
    position: fixed;
    right: 20px;
    bottom: 20px;
    z-index: 2147483000;
    width: min(340px, calc(100vw - 32px));
    padding: 12px 14px 14px;
    border: 1px solid #f0c2c2;
    border-left: 5px solid #c0392b;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(20, 10, 10, 0.22);
    font-family: var(--hc-font-sans);
    color: #2b2b2b;
    /*
     * Bang nay la mot loi nhac, khong phai mot trang tai lieu. Phan can cu phap
     * ly gio nam trong khoi gap lai nen phan luon hien chi con vai dong; chan
     * chieu cao theo phan tram khung nhin de tren man hinh nho no van khong an
     * het trang, va de doan luat khi duoc mo ra thi cuon trong chinh no.
     */
    /*
     * Noi dung hien day du tro lai: ca doan than bai lan phan can cu phap ly.
     * O co chu nho va be rong 340px thi tron bo van vua mot khung nhin may tinh
     * ma khong phai cuon.
     *
     * Van giu tran chieu cao lam luoi an toan cho man hinh thap: neu vuot tran
     * thi cuon, nhung phan dau cua bang duoc ghim lai (xem .hpm-guard__head), nen
     * tieu de va nut dong khong bao gio troi ra khoi tam mat — do moi la dieu
     * lam phien o ban truoc, chu khong phai viec cuon.
     */
    max-height: min(82vh, 600px);
    overflow-y: auto;
    overscroll-behavior: contain;
    /* An ma khong dung display:none de con chuyen dong vao/ra. */
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
}

.hc-wp .hpm-guard.is-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Lan thu ba tro di: nen do dam, khong con la mot loi nhac nhe. */
.hc-wp .hpm-guard.is-strong {
    border-color: #c0392b;
    background: #fff5f4;
    box-shadow: 0 18px 48px rgba(140, 20, 20, 0.3);
}

.hc-wp .hpm-guard__head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    /* Ghim tieu de va nut dong: cuon toi dau van bam dong duoc. */
    position: sticky;
    top: -12px;
    z-index: 1;
    padding-top: 12px;
    margin-top: -12px;
    background: inherit;
}

.hc-wp .hpm-guard.is-strong .hpm-guard__head {
    background: #fff5f4;
}

.hc-wp .hpm-guard__icon {
    font-size: 15px;
    line-height: 1;
    color: #c0392b;
}

.hc-wp .hpm-guard__title {
    flex: 1;
    font-size: 13px;
    font-weight: 700;
    color: #c0392b;
    line-height: 1.3;
}

.hc-wp .hpm-guard__close {
    flex: none;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #8a8a8a;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}

.hc-wp .hpm-guard__close:hover {
    background: rgba(0, 0, 0, 0.06);
    color: #333;
}

/*
 * `!important` o day khong phai thoi quen xau ma la bat buoc: site-typography.css
 * nap sau cung va ap `body :where(p, li, ...) { font-size: 16px !important }` cho
 * moi doan van trong trang. Khong co !important thi bang canh bao bi keo len co
 * chu 16px, cao 560px, tuc 62% khung nhin — dung cai to qua ma nguoi dung phan
 * anh. Pham vi chi trong .hpm-guard nen khong anh huong gi ben ngoai.
 */
.hc-wp .hpm-guard__reason {
    margin: 0 0 5px;
    font-size: 12px !important;
    font-weight: 600;
    line-height: 1.4;
}

.hc-wp .hpm-guard__body {
    margin: 0 0 8px;
    font-size: 12px !important;
    line-height: 1.55;
    color: #444;
}

.hc-wp .hpm-guard__legal {
    margin: 0;
    padding-top: 8px;
    border-top: 1px solid rgba(192, 57, 43, 0.18);
    font-size: 11px !important;
    line-height: 1.5;
    color: #6b4a46;
}


.hc-wp .hpm-guard__count {
    margin: 6px 0 0;
    font-size: 11px !important;
    font-weight: 700;
    color: #c0392b;
}

.hc-wp .hpm-guard__count:empty {
    display: none;
}

@media (max-width: 640px) {
    .hc-wp .hpm-guard {
        right: 10px;
        left: 10px;
        bottom: 10px;
        width: auto;
        max-height: 72vh;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hc-wp .hpm-guard {
        transition: none;
    }
}

/* ------------------------------------------------------------------ */
/*  Lam mo noi dung khi DevTools mo                                    */
/* ------------------------------------------------------------------ */

/*
 * Dat bang lop CSS chu khong ghi thang vao element.style nhu ban truoc, nho vay
 * go ra duoc khi DevTools dong lai — truoc day mo mot lan la mo vinh vien.
 */
.hc-wp .hpm-blurred {
    filter: blur(10px);
    user-select: none;
    pointer-events: none;
}