:root{
    --trust-bg:#ffffff;
    --trust-bg-2:#f8fafc;
    --trust-text:#111827;
    --trust-muted:#64748b;
    --trust-line:#e5e7eb;
    --trust-line-soft:#f1f5f9;

    --trust-admin:#ef4444;
    --trust-admin-2:#7f1d1d;
    --trust-admin-3:#fecaca;

    --trust-gold:#facc15;
    --trust-gold-2:#a16207;

    --trust-silver:#c0c0c0;
    --trust-silver-2:#94a3b8;
    --trust-silver-3:#e5e7eb;

    --trust-diamond:#0ea5e9;
    --trust-diamond-2:#075985;
    --trust-diamond-3:#bae6fd;

    --trust-member:#ffffff;
    --trust-member-2:#f8fafc;

    --trust-money:#16a34a;
    --trust-money-2:#15803d;
}

html,
body{
    background:#ffffff !important;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption,
tbody, tfoot, thead, tr, th, td, article, aside,
canvas, details, embed, figure, figcaption, footer,
header, hgroup, menu, nav, output, ruby, section,
summary, time, mark, audio, video, input, button,
textarea, select{
    font-family:Arial, Helvetica, sans-serif !important;
}

i.fa,
i.fa-solid,
i.fa-regular,
i.fa-brands,
.fa,
.fa-solid,
.fa-regular,
.fa-brands,
.fas,
.far,
.fab{
    font-family:"Font Awesome 6 Free","Font Awesome 6 Brands" !important;
    font-style:normal !important;
}

.fa-solid,
.fas{
    font-weight:900 !important;
}

/* ===============================
   NỀN CHUNG
================================ */

.section-trust-x{
    position:relative;
    overflow:hidden;
    background:
        radial-gradient(circle at 18% 8%, rgba(239,68,68,.045), transparent 22%),
        radial-gradient(circle at 88% 10%, rgba(14,165,233,.055), transparent 24%),
        linear-gradient(180deg,#ffffff 0%,#f8fafc 100%) !important;
    min-height:100vh;
    padding:24px 0 46px;
    color:#111827 !important;
}

.trust-shell{
    width:min(100%,1320px);
    margin:0 auto;
}

/* ===============================
   KHUNG TIÊU ĐỀ
================================ */

.trust-hero{
    position:relative;
    overflow:hidden;
    border-radius:28px;
    padding:22px;
    margin-bottom:16px;
    background:
        radial-gradient(circle at right top, rgba(14,165,233,.08), transparent 30%),
        radial-gradient(circle at left bottom, rgba(239,68,68,.06), transparent 28%),
        linear-gradient(135deg,#ffffff 0%,#f8fafc 100%) !important;
    border:1px solid #e5e7eb !important;
    box-shadow:0 14px 34px rgba(15,23,42,.06) !important;
}

.trust-hero::before{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    right:-90px;
    top:-110px;
    border-radius:50%;
    background:rgba(14,165,233,.08);
    filter:blur(8px);
}

.trust-hero::after{
    content:"";
    position:absolute;
    width:220px;
    height:220px;
    left:-80px;
    bottom:-110px;
    border-radius:50%;
    background:rgba(239,68,68,.06);
    filter:blur(8px);
}

.trust-hero-inner{
    position:relative;
    z-index:2;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    flex-wrap:wrap;
}

.trust-hero-title{
    margin:0;
    color:#111827 !important;
    font-size:28px;
    font-weight:900;
    line-height:1.2;
    letter-spacing:.2px;
}

.trust-hero-desc{
    margin-top:8px;
    max-width:780px;
    color:#64748b !important;
    font-size:14px;
    line-height:1.7;
}

.trust-total-pill{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 14px;
    border-radius:999px;
    background:#eff6ff !important;
    border:1px solid #dbeafe !important;
    color:#1d4ed8 !important;
    font-size:13px;
    font-weight:900;
    white-space:nowrap;
}

/* ===============================
   KHUNG TÌM KIẾM
================================ */

.trust-toolbar{
    background:#ffffff !important;
    border:1px solid #e5e7eb !important;
    border-radius:24px;
    box-shadow:0 12px 30px rgba(15,23,42,.05) !important;
    padding:16px;
    margin-bottom:16px;
}

.trust-search{
    position:relative;
    width:100%;
    margin-bottom:12px;
}

.trust-search i{
    position:absolute;
    left:16px;
    top:50%;
    transform:translateY(-50%);
    color:#94a3b8 !important;
    font-size:15px;
    z-index:2;
    pointer-events:none;
}

.trust-search input{
    width:100%;
    height:56px;
    border-radius:18px;
    border:1px solid #dbe3ef !important;
    outline:none;
    background:#f8fafc !important;
    color:#111827 !important;
    padding:0 16px 0 48px;
    font-size:16px;
    box-shadow:none !important;
    transition:.2s ease;
}

.trust-search input::placeholder{
    color:#94a3b8 !important;
}

.trust-search input:focus{
    background:#ffffff !important;
    border-color:#93c5fd !important;
    box-shadow:0 0 0 4px rgba(37,99,235,.08) !important;
}

.trust-tier-filter{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.trust-filter-btn{
    border:1px solid #e5e7eb !important;
    background:#f8fafc !important;
    color:#475569 !important;
    border-radius:999px;
    padding:9px 13px;
    font-size:12px;
    font-weight:900;
    cursor:pointer;
    transition:.2s ease;
    display:inline-flex;
    align-items:center;
    gap:7px;
}

.trust-filter-btn:hover,
.trust-filter-btn.active{
    color:#ffffff !important;
    background:linear-gradient(135deg,#2563eb,#0ea5e9) !important;
    border-color:#60a5fa !important;
    transform:translateY(-1px);
    box-shadow:0 8px 18px rgba(37,99,235,.14) !important;
}

/* ===============================
   KHUNG TẤT CẢ GDV
================================ */

.trust-section{
    position:relative;
    background:#ffffff !important;
    border:1px solid #e5e7eb !important;
    border-radius:26px;
    box-shadow:0 14px 34px rgba(15,23,42,.05) !important;
    padding:18px;
    margin:0 auto 18px;
    width:100%;
}

.trust-section-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin-bottom:18px;
    padding-bottom:14px;
    border-bottom:1px solid #eef2f7 !important;
}

.trust-section-title{
    margin:0;
    color:#111827 !important;
    font-size:20px;
    font-weight:900;
    line-height:1.25;
    text-transform:uppercase;
    letter-spacing:.6px;
    display:flex;
    align-items:center;
    gap:10px;
}

.trust-section-title i{
    width:38px;
    height:38px;
    border-radius:14px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:#2563eb !important;
    background:#eff6ff !important;
    border:1px solid #dbeafe !important;
}

.trust-section-sub{
    margin:6px 0 0;
    color:#64748b !important;
    font-size:13px;
}

.trust-section-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:44px;
    height:34px;
    padding:0 12px;
    border-radius:999px;
    background:#f1f5f9 !important;
    color:#111827 !important;
    font-size:13px;
    font-weight:900;
    border:1px solid #e5e7eb !important;
}

/* ===============================
   GRID
================================ */

.trust-grid{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:18px;
}

.trust-card-link{
    display:block;
    text-decoration:none !important;
    color:inherit;
    min-width:0;
}

.trust-card-link:active .trust-card,
.trust-card-link.is-loading .trust-card{
    transform:scale(.985);
}

/* ===============================
   PROFILE CARD CHUNG
================================ */

.trust-card{
    position:relative;
    min-height:305px;
    border-radius:28px;
    padding:20px 12px 18px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    text-align:center;
    transition:.22s ease;
    overflow:hidden;
    isolation:isolate;
    border:1px solid #e5e7eb !important;
    background:#ffffff !important;
    box-shadow:0 10px 26px rgba(15,23,42,.055) !important;
}

.trust-card::before{
    content:"";
    position:absolute;
    inset:-2px;
    border-radius:inherit;
    opacity:.55;
    z-index:-2;
}

.trust-card::after{
    content:"";
    position:absolute;
    inset:1px;
    border-radius:inherit;
    background:
        radial-gradient(circle at 50% 0%, rgba(255,255,255,.98), transparent 34%),
        linear-gradient(180deg,#ffffff 0%,#f8fafc 100%) !important;
    z-index:-1;
}

.trust-card:hover{
    transform:translateY(-4px);
}

.trust-tier-label{
    height:34px;
    min-width:130px;
    max-width:94%;
    padding:0 12px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    font-size:11px;
    font-weight:900;
    letter-spacing:1.3px;
    text-transform:uppercase;
    margin-bottom:15px;
}

.trust-card-avatar{
    width:78px;
    height:78px;
    object-fit:cover;
    border-radius:50%;
    background:#fff;
    margin-bottom:15px;
    flex:0 0 auto;
}

.trust-card-code{
    margin:0 0 8px;
    color:#334155 !important;
    font-size:14px;
    line-height:1.2;
    font-weight:900;
    letter-spacing:.5px;
}

.trust-card-name{
    margin:0;
    color:#111827 !important;
    font-size:20px;
    line-height:1.18;
    font-weight:900;
    min-height:48px;
    word-break:break-word;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    text-shadow:none !important;
}

.trust-card-role{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    padding:7px 10px;
    border-radius:999px;
    background:#f8fafc !important;
    border:1px solid #e5e7eb !important;
    color:#475569 !important;
    font-size:10.5px;
    line-height:1;
    font-weight:800;
    margin:10px 0 0;
    max-width:94%;
}

.trust-card-role span{
    display:block;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.trust-card-role.is-empty{
    display:none !important;
}

.trust-card-spacer{
    flex:1;
    min-height:16px;
}

/* ===============================
   TIỀN BẢO HIỂM XANH LÁ TOÀN BỘ
================================ */

.trust-card-money,
.trust-card-money *,
.trust-card-money i,
.tier-admin .trust-card-money,
.tier-admin .trust-card-money *,
.tier-diamond .trust-card-money,
.tier-diamond .trust-card-money *,
.tier-gold .trust-card-money,
.tier-gold .trust-card-money *,
.tier-silver .trust-card-money,
.tier-silver .trust-card-money *,
.tier-member .trust-card-money,
.tier-member .trust-card-money *{
    color:#16a34a !important;
    text-shadow:none !important;
}

.trust-card-money{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    font-size:17px;
    line-height:1.2;
    font-weight:900;
    text-align:center;
    letter-spacing:.4px;
}

.trust-card-money i{
    font-size:15px;
    flex:0 0 auto;
}

/* =========================================================
   ADMIN - VIP ĐỎ PREMIUM
   Đẹp hơn Gold, nổi hơn, có glow nhưng không quá gắt
========================================================= */

.tier-admin .trust-card{
    background:
        linear-gradient(180deg,#ffffff 0%,#fff7f7 100%) !important;
    border:1px solid rgba(239,68,68,.45) !important;
    box-shadow:
        0 0 0 1px rgba(239,68,68,.08),
        0 0 26px rgba(239,68,68,.18),
        0 16px 38px rgba(15,23,42,.08) !important;
}

.tier-admin .trust-card::before{
    background:
        conic-gradient(
            from 180deg,
            rgba(127,29,29,.20),
            rgba(239,68,68,.70),
            rgba(254,202,202,.36),
            rgba(185,28,28,.58),
            rgba(127,29,29,.20)
        ) !important;
    box-shadow:
        0 0 34px rgba(239,68,68,.28),
        0 0 60px rgba(127,29,29,.16) !important;
    opacity:.80 !important;
}

.tier-admin .trust-card::after{
    background:
        radial-gradient(circle at 50% 0%, rgba(239,68,68,.16), transparent 36%),
        radial-gradient(circle at 12% 12%, rgba(254,202,202,.34), transparent 22%),
        linear-gradient(180deg,#ffffff 0%,#fff5f5 100%) !important;
}

.tier-admin .trust-tier-label{
    color:#ffffff !important;
    background:
        linear-gradient(135deg,#7f1d1d 0%,#ef4444 45%,#b91c1c 100%) !important;
    border:1px solid rgba(254,202,202,.65) !important;
    box-shadow:
        0 0 0 1px rgba(239,68,68,.10),
        0 0 22px rgba(239,68,68,.32),
        inset 0 1px 0 rgba(255,255,255,.28) !important;
}

.tier-admin .trust-tier-label i{
    color:#fff !important;
    text-shadow:0 0 10px rgba(255,255,255,.32) !important;
}

.tier-admin .trust-card-avatar{
    border:4px solid rgba(239,68,68,.82) !important;
    box-shadow:
        0 0 0 3px rgba(254,202,202,.60),
        0 0 26px rgba(239,68,68,.32) !important;
}

.tier-admin .trust-card-code{
    color:#991b1b !important;
}

.tier-admin .trust-card-name{
    color:#7f1d1d !important;
}

.tier-admin .trust-card-role{
    background:#fff1f2 !important;
    border-color:#fecaca !important;
    color:#991b1b !important;
}

/* =========================================================
   DIAMOND - VIP KIM CƯƠNG XANH
   Nổi hơn Gold, xanh sâu, glow cyan đẹp hơn
========================================================= */

.tier-diamond .trust-card{
    background:
        linear-gradient(180deg,#ffffff 0%,#f0f9ff 100%) !important;
    border:1px solid rgba(14,165,233,.48) !important;
    box-shadow:
        0 0 0 1px rgba(14,165,233,.08),
        0 0 30px rgba(14,165,233,.22),
        0 16px 38px rgba(15,23,42,.08) !important;
}

.tier-diamond .trust-card::before{
    background:
        conic-gradient(
            from 160deg,
            rgba(7,89,133,.26),
            rgba(14,165,233,.72),
            rgba(186,230,253,.48),
            rgba(56,189,248,.66),
            rgba(7,89,133,.26)
        ) !important;
    box-shadow:
        0 0 38px rgba(14,165,233,.34),
        0 0 70px rgba(7,89,133,.18) !important;
    opacity:.82 !important;
}

.tier-diamond .trust-card::after{
    background:
        radial-gradient(circle at 50% 0%, rgba(14,165,233,.18), transparent 36%),
        radial-gradient(circle at 14% 12%, rgba(186,230,253,.45), transparent 22%),
        linear-gradient(180deg,#ffffff 0%,#effaff 100%) !important;
}

.tier-diamond .trust-tier-label{
    color:#ecfeff !important;
    background:
        linear-gradient(135deg,#0c4a6e 0%,#0284c7 45%,#38bdf8 100%) !important;
    border:1px solid rgba(186,230,253,.72) !important;
    box-shadow:
        0 0 0 1px rgba(14,165,233,.10),
        0 0 24px rgba(14,165,233,.36),
        inset 0 1px 0 rgba(255,255,255,.30) !important;
}

.tier-diamond .trust-tier-label i{
    color:#e0f2fe !important;
    text-shadow:0 0 12px rgba(255,255,255,.36) !important;
}

.tier-diamond .trust-card-avatar{
    border:4px solid rgba(56,189,248,.88) !important;
    box-shadow:
        0 0 0 3px rgba(186,230,253,.70),
        0 0 30px rgba(14,165,233,.34) !important;
}

.tier-diamond .trust-card-code{
    color:#075985 !important;
}

.tier-diamond .trust-card-name{
    color:#0c4a6e !important;
}

.tier-diamond .trust-card-role{
    background:#f0f9ff !important;
    border-color:#bae6fd !important;
    color:#075985 !important;
}

/* ===============================
   GOLD - VÀNG ĐẸP NHƯNG NHẸ HƠN ADMIN/DIAMOND
================================ */

.tier-gold .trust-card{
    border-color:rgba(250,204,21,.34) !important;
    background:#ffffff !important;
    box-shadow:
        0 0 13px rgba(250,204,21,.10),
        0 12px 28px rgba(15,23,42,.055) !important;
}

.tier-gold .trust-card::before{
    background:linear-gradient(135deg,rgba(250,204,21,.34),rgba(255,255,255,.16),rgba(234,179,8,.20)) !important;
    box-shadow:0 0 18px rgba(250,204,21,.11) !important;
    opacity:.62 !important;
}

.tier-gold .trust-card::after{
    background:
        radial-gradient(circle at 50% 0%, rgba(250,204,21,.08), transparent 36%),
        linear-gradient(180deg,#ffffff 0%,#fffbeb 100%) !important;
}

.tier-gold .trust-tier-label{
    color:#422006 !important;
    background:linear-gradient(135deg,#fef08a,#eab308) !important;
    border:1px solid rgba(234,179,8,.46) !important;
    box-shadow:0 0 13px rgba(250,204,21,.16) !important;
}

.tier-gold .trust-card-avatar{
    border:4px solid rgba(250,204,21,.62) !important;
    box-shadow:0 0 15px rgba(250,204,21,.13) !important;
}

.tier-gold .trust-card-code{
    color:#854d0e !important;
}

.tier-gold .trust-card-name{
    color:#422006 !important;
}

.tier-gold .trust-card-role{
    background:#fffbeb !important;
    border-color:#fde68a !important;
    color:#854d0e !important;
}

/* ===============================
   SILVER - XÁM BẠC RÕ RÀNG
================================ */

.tier-silver .trust-card{
    background:#f8fafc !important;
    border-color:#bfc7d1 !important;
    box-shadow:
        0 0 16px rgba(148,163,184,.16),
        0 12px 28px rgba(15,23,42,.06) !important;
}

.tier-silver .trust-card::before{
    background:linear-gradient(135deg,#c0c0c0,#ffffff,#94a3b8) !important;
    box-shadow:0 0 22px rgba(148,163,184,.18) !important;
    opacity:.75 !important;
}

.tier-silver .trust-card::after{
    background:
        radial-gradient(circle at 50% 0%, rgba(255,255,255,.95), transparent 32%),
        linear-gradient(180deg,#ffffff 0%,#e5e7eb 100%) !important;
}

.tier-silver .trust-tier-label{
    color:#111827 !important;
    background:linear-gradient(135deg,#ffffff 0%,#d1d5db 45%,#a8b0bb 100%) !important;
    border:1px solid #a8b0bb !important;
    box-shadow:0 0 16px rgba(148,163,184,.22) !important;
}

.tier-silver .trust-card-avatar{
    border:4px solid #c0c0c0 !important;
    box-shadow:0 0 18px rgba(148,163,184,.20) !important;
}

.tier-silver .trust-card-code{
    color:#334155 !important;
}

.tier-silver .trust-card-name{
    color:#111827 !important;
}

.tier-silver .trust-card-role{
    background:#ffffff !important;
    border-color:#cbd5e1 !important;
    color:#475569 !important;
}

/* ===============================
   MEMBER - MÀU TRẮNG
================================ */

.tier-member .trust-card{
    background:#ffffff !important;
    border-color:#e5e7eb !important;
    box-shadow:
        0 0 12px rgba(148,163,184,.08),
        0 12px 28px rgba(15,23,42,.055) !important;
}

.tier-member .trust-card::before{
    background:linear-gradient(135deg,#ffffff,rgba(226,232,240,.28),#ffffff) !important;
    box-shadow:0 0 16px rgba(148,163,184,.08) !important;
    opacity:.70 !important;
}

.tier-member .trust-card::after{
    background:
        radial-gradient(circle at 50% 0%, #ffffff, transparent 36%),
        linear-gradient(180deg,#ffffff 0%,#f8fafc 100%) !important;
}

.tier-member .trust-tier-label{
    color:#111827 !important;
    background:linear-gradient(135deg,#ffffff,#f1f5f9) !important;
    border:1px solid #e5e7eb !important;
    box-shadow:0 0 10px rgba(148,163,184,.10) !important;
}

.tier-member .trust-card-avatar{
    border:4px solid #f1f5f9 !important;
    box-shadow:0 0 14px rgba(148,163,184,.10) !important;
}

/* ===============================
   EMPTY + TOAST
================================ */

.trust-empty-global{
    display:none;
    text-align:center;
    padding:22px;
    border-radius:18px;
    border:1px dashed #cbd5e1 !important;
    background:#f8fafc !important;
    color:#64748b !important;
    font-size:15px;
    margin-top:10px;
}

.trust-toast{
    position:fixed;
    left:50%;
    bottom:24px;
    transform:translateX(-50%) translateY(20px);
    background:#0f172a !important;
    color:#fff !important;
    border:1px solid rgba(255,255,255,.12) !important;
    border-radius:14px;
    padding:12px 16px;
    box-shadow:0 16px 34px rgba(0,0,0,.30) !important;
    font-size:13px;
    font-weight:800;
    z-index:99999;
    opacity:0;
    visibility:hidden;
    transition:.25s ease;
    display:flex;
    align-items:center;
    gap:8px;
}

.trust-toast.show{
    opacity:1;
    visibility:visible;
    transform:translateX(-50%) translateY(0);
}

/* ===============================
   RESPONSIVE
================================ */

@media (max-width:1199px){
    .trust-shell{
        width:min(100%,1080px);
    }

    .trust-grid{
        grid-template-columns:repeat(4,minmax(0,1fr));
        gap:16px;
    }
}

@media (max-width:991px){
    .trust-shell{
        width:min(100%,860px);
    }

    .trust-grid{
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:14px;
    }

    .trust-card{
        min-height:280px;
    }
}

@media (max-width:767px){
    .section-trust-x{
        padding:14px 0 30px;
    }

    .trust-shell{
        width:100%;
    }

    .trust-hero,
    .trust-toolbar,
    .trust-section{
        border-radius:20px;
        padding:14px;
    }

    .trust-hero-title{
        font-size:22px;
    }

    .trust-hero-desc{
        font-size:13px;
    }

    .trust-search input{
        height:52px;
        border-radius:16px;
        font-size:15px;
    }

    .trust-section-head{
        align-items:flex-start;
    }

    .trust-section-title{
        font-size:16px;
    }

    .trust-section-title i{
        width:34px;
        height:34px;
        border-radius:12px;
    }

    .trust-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:12px;
    }

    .trust-card{
        min-height:252px;
        border-radius:22px;
        padding:14px 10px 14px;
    }

    .trust-tier-label{
        min-width:118px;
        height:30px;
        font-size:10px;
        letter-spacing:1.2px;
        padding:0 10px;
        margin-bottom:12px;
    }

    .trust-card-avatar{
        width:70px;
        height:70px;
        margin-bottom:13px;
    }

    .trust-card-code{
        font-size:13px;
        margin-bottom:6px;
    }

    .trust-card-name{
        font-size:18px;
        min-height:44px;
    }

    .trust-card-role{
        font-size:9.5px;
        padding:5px 9px;
        margin-top:8px;
    }

    .trust-card-money{
        font-size:16px;
    }

    .trust-card-money i{
        font-size:14px;
    }
}

@media (max-width:480px){
    .trust-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px;
    }

    .trust-card{
        min-height:238px;
        border-radius:20px;
        padding:12px 8px 12px;
    }

    .trust-card-avatar{
        width:62px;
        height:62px;
        margin-bottom:11px;
    }

    .trust-card-code{
        font-size:12px;
    }

    .trust-card-name{
        font-size:16px;
        min-height:40px;
    }

    .trust-card-money{
        font-size:15px;
    }
}