/*
 * TLMS GOLD FINAL THEME
 * Sửa logo, giỏ hàng và toàn bộ quản trị sang Gold.
 */

:root {
    --tlms-gold-950: #2b1800;
    --tlms-gold-900: #412600;
    --tlms-gold-850: #583503;
    --tlms-gold-800: #704707;
    --tlms-gold-700: #96630b;
    --tlms-gold-600: #b77d12;
    --tlms-gold-500: #d99d22;
    --tlms-gold-400: #e9bc4d;
    --tlms-gold-300: #f1d276;
    --tlms-gold-200: #f8e5a8;
    --tlms-gold-100: #fff3cb;
    --tlms-gold-50: #fffaf0;

    --tlms-text: #271b0a;
    --tlms-muted: #6b5d47;
    --tlms-border: #dfbf69;
    --tlms-danger: #b42318;
    --tlms-success: #067647;
}

/* =========================================================
   1. LOGO TRƯƠNG LẬP MOBILE
   ========================================================= */

body .brand-logo,
body .logo-mark,
body .site-logo-mark,
body .brand-icon,
body .header-logo-mark {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;

    padding: 0 !important;

    color: #765006 !important;

    background:
        radial-gradient(
            circle at 32% 25%,
            #ffffff 0,
            #fff8dc 28%,
            #f3cf6b 70%,
            #d89b1b 100%
        ) !important;

    border: 2px solid #f4d67c !important;
    border-radius: 13px !important;

    box-shadow:
        inset 0 0 0 3px rgba(255, 255, 255, 0.68),
        0 5px 14px rgba(43, 24, 0, 0.24)
        !important;

    font-size: 16px !important;
    font-weight: 950 !important;
    line-height: 1 !important;

    text-shadow: none !important;
    opacity: 1 !important;
}

body .brand-logo *,
body .logo-mark *,
body .site-logo-mark *,
body .brand-icon *,
body .header-logo-mark * {
    color: #765006 !important;
    opacity: 1 !important;
}

body .brand-logo img,
body .logo-mark img,
body .site-logo-mark img,
body .brand-icon img {
    display: block !important;

    width: 32px !important;
    height: 32px !important;

    object-fit: contain !important;

    filter:
        contrast(1.18)
        saturate(1.15)
        brightness(0.93)
        !important;

    opacity: 1 !important;
}

/* Tên thương hiệu */

body .brand-name,
body .brand-title,
body .logo-text,
body .site-brand-name {
    color: #fff6d2 !important;
    font-weight: 950 !important;
    opacity: 1 !important;
}

body .brand-description,
body .brand-subtitle,
body .logo-subtitle {
    color: #efd17c !important;
    font-weight: 650 !important;
    opacity: 1 !important;
}

/* =========================================================
   2. NÚT GIỎ HÀNG TRANG KHÁCH
   ========================================================= */

body header a[href*="gio-hang"],
body header a[href*="/cart"],
body .site-header a[href*="gio-hang"],
body .main-header a[href*="gio-hang"],
body .customer-header a[href*="gio-hang"],
body .cart-button,
body .cart-link,
body .header-cart,
body .nav-cart {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;

    min-width: 102px !important;
    min-height: 38px !important;

    padding: 8px 15px !important;

    color: #2b1a00 !important;

    background:
        linear-gradient(
            135deg,
            #fff7d2 0%,
            #f4d16f 50%,
            #d89b1a 100%
        ) !important;

    border: 1px solid #b97a0b !important;
    border-radius: 999px !important;

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.85),
        0 6px 15px rgba(49, 28, 0, 0.2)
        !important;

    font-size: 13px !important;
    font-weight: 950 !important;
    line-height: 1.2 !important;

    text-decoration: none !important;
    text-shadow: none !important;
    opacity: 1 !important;
}

body header a[href*="gio-hang"] *,
body header a[href*="/cart"] *,
body .cart-button *,
body .cart-link *,
body .header-cart *,
body .nav-cart * {
    color: #2b1a00 !important;
    opacity: 1 !important;
}

body header a[href*="gio-hang"]:hover,
body header a[href*="/cart"]:hover,
body .cart-button:hover,
body .cart-link:hover,
body .header-cart:hover,
body .nav-cart:hover {
    color: #211300 !important;

    background:
        linear-gradient(
            135deg,
            #fffbe9,
            #f8dc87 48%,
            #e1aa2d
        ) !important;

    transform: translateY(-1px);
}

/* =========================================================
   3. ZALO VÀ MESSENGER
   ========================================================= */

body .floating-contact a,
body .floating-social a,
body .contact-float a,
body .social-floating a,
body .zalo-float,
body .messenger-float {
    overflow: visible !important;

    border: 3px solid #f1c853 !important;
    border-radius: 50% !important;

    outline: none !important;

    box-shadow:
        0 8px 22px rgba(53, 31, 0, 0.26),
        0 0 0 5px rgba(232, 180, 48, 0.13)
        !important;
}

body .floating-contact a::before,
body .floating-contact a::after,
body .floating-social a::before,
body .floating-social a::after,
body .contact-float a::before,
body .contact-float a::after {
    border-radius: 50% !important;
}

body .floating-contact,
body .floating-social,
body .contact-float,
body .social-floating {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* =========================================================
   4. PHẠM VI QUẢN TRỊ
   Chỉ áp dụng khi trang có #adminSidebar
   ========================================================= */

body:has(#adminSidebar) {
    color: var(--tlms-text) !important;

    background:
        radial-gradient(
            circle at 90% 0%,
            rgba(225, 168, 39, 0.15),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #fffdf8,
            #f8efd9
        ) !important;
}

/* Topbar quản trị */

body:has(#adminSidebar) .topbar {
    color: #fff3c3 !important;

    background:
        linear-gradient(
            105deg,
            #2b1800 0%,
            #4e2f02 37%,
            #7c5007 72%,
            #4b2c01 100%
        ) !important;

    border-bottom: 1px solid #dca52c !important;

    box-shadow:
        0 7px 22px rgba(54, 31, 0, 0.22)
        !important;
}

body:has(#adminSidebar) .topbar *,
body:has(#adminSidebar) .topbar a,
body:has(#adminSidebar) .topbar strong,
body:has(#adminSidebar) .topbar span {
    color: #fff3c3 !important;
    opacity: 1 !important;
}

/* Nút đăng xuất */

body:has(#adminSidebar) .logout-button,
body:has(#adminSidebar) form[action*="logout"] button {
    color: #291800 !important;

    background:
        linear-gradient(
            135deg,
            #fff4c4,
            #e4ad2f
        ) !important;

    border: 1px solid #bd7f0d !important;
    border-radius: 9px !important;

    font-weight: 900 !important;
}

/* Sidebar quản trị */

body:has(#adminSidebar) #adminSidebar,
body:has(#adminSidebar) .admin-sidebar,
body:has(#adminSidebar) aside.sidebar {
    color: #fff1bd !important;

    background:
        radial-gradient(
            circle at 20% 0%,
            rgba(238, 190, 63, 0.14),
            transparent 27%
        ),
        linear-gradient(
            180deg,
            #1f1202,
            #342001 45%,
            #251500
        ) !important;

    border-right: 1px solid #bd8317 !important;

    box-shadow:
        7px 0 25px rgba(44, 25, 0, 0.18)
        !important;
}

body:has(#adminSidebar) #adminSidebar *,
body:has(#adminSidebar) .admin-sidebar *,
body:has(#adminSidebar) aside.sidebar * {
    opacity: 1 !important;
}

body:has(#adminSidebar) #adminSidebar a,
body:has(#adminSidebar) .admin-sidebar a,
body:has(#adminSidebar) aside.sidebar a,
body:has(#adminSidebar) #adminSidebar button {
    color: #f7e5ac !important;

    background:
        rgba(255, 255, 255, 0.035) !important;

    border-color:
        rgba(229, 186, 75, 0.18) !important;

    font-weight: 750 !important;
}

/* Nhóm menu */

body:has(#adminSidebar) .tlms-menu-section,
body:has(#adminSidebar) .menu-section,
body:has(#adminSidebar) .sidebar-section {
    border-color:
        rgba(231, 193, 94, 0.5) !important;

    background:
        rgba(255, 255, 255, 0.018) !important;
}

body:has(#adminSidebar) .tlms-menu-title,
body:has(#adminSidebar) .menu-title,
body:has(#adminSidebar) .sidebar-title,
body:has(#adminSidebar) .menu-section-title {
    color: #eec65d !important;
    font-weight: 950 !important;
}

/* Icon menu */

body:has(#adminSidebar) .tlms-menu-icon,
body:has(#adminSidebar) .menu-icon,
body:has(#adminSidebar) .sidebar-icon,
body:has(#adminSidebar) nav a > span:first-child {
    color: #ffdd7a !important;

    background:
        rgba(237, 193, 75, 0.12) !important;

    border-color:
        rgba(235, 198, 99, 0.38) !important;
}

/* Menu hover và đang chọn */

body:has(#adminSidebar) #adminSidebar a:hover,
body:has(#adminSidebar) #adminSidebar a.active,
body:has(#adminSidebar) #adminSidebar a[aria-current="page"],
body:has(#adminSidebar) .admin-sidebar a:hover,
body:has(#adminSidebar) .admin-sidebar a.active,
body:has(#adminSidebar) aside.sidebar a:hover,
body:has(#adminSidebar) aside.sidebar a.active {
    color: #2a1900 !important;

    background:
        linear-gradient(
            135deg,
            #fff4c5 0%,
            #e9bd50 52%,
            #cf9016 100%
        ) !important;

    border-color: #f2cf70 !important;

    box-shadow:
        0 5px 13px rgba(15, 8, 0, 0.23),
        inset 0 1px 0 rgba(255, 255, 255, 0.75)
        !important;

    font-weight: 950 !important;
}

body:has(#adminSidebar) #adminSidebar a:hover *,
body:has(#adminSidebar) #adminSidebar a.active *,
body:has(#adminSidebar) #adminSidebar a[aria-current="page"] *,
body:has(#adminSidebar) .admin-sidebar a:hover *,
body:has(#adminSidebar) .admin-sidebar a.active * {
    color: #2a1900 !important;
}

/* =========================================================
   5. LOẠI BỎ MÀU XANH TRONG DASHBOARD
   ========================================================= */

body:has(#adminSidebar) .content,
body:has(#adminSidebar) .content-inner,
body:has(#adminSidebar) main {
    color: var(--tlms-text) !important;
    background: transparent !important;
}

body:has(#adminSidebar) .page-heading,
body:has(#adminSidebar) .page-header,
body:has(#adminSidebar) .dashboard-header,
body:has(#adminSidebar) .content-header {
    color: var(--tlms-text) !important;
}

body:has(#adminSidebar) h1,
body:has(#adminSidebar) h2,
body:has(#adminSidebar) h3,
body:has(#adminSidebar) h4 {
    color: #352202 !important;
}

/* Chữ nhỏ màu xanh đổi thành nâu Gold */

body:has(#adminSidebar) .eyebrow,
body:has(#adminSidebar) .page-eyebrow,
body:has(#adminSidebar) .dashboard-eyebrow,
body:has(#adminSidebar) .section-eyebrow,
body:has(#adminSidebar) [class*="eyebrow"] {
    color: #9a6508 !important;
    font-weight: 950 !important;
}

/* Thẻ thống kê */

body:has(#adminSidebar) .statistics > *,
body:has(#adminSidebar) .stats-grid > *,
body:has(#adminSidebar) .dashboard-stats > *,
body:has(#adminSidebar) .stat-card,
body:has(#adminSidebar) .statistics-card,
body:has(#adminSidebar) .summary-card,
body:has(#adminSidebar) .overview-card {
    color: var(--tlms-text) !important;

    background:
        linear-gradient(
            145deg,
            #fffef9,
            #fff5d8
        ) !important;

    border: 1px solid #dfbd61 !important;
    border-top: 3px solid #d99d22 !important;

    box-shadow:
        0 8px 22px rgba(80, 49, 2, 0.09)
        !important;
}

body:has(#adminSidebar) .stat-card *,
body:has(#adminSidebar) .statistics-card *,
body:has(#adminSidebar) .summary-card *,
body:has(#adminSidebar) .overview-card * {
    color: inherit !important;
}

body:has(#adminSidebar) .stat-card strong,
body:has(#adminSidebar) .statistics-card strong,
body:has(#adminSidebar) .summary-card strong,
body:has(#adminSidebar) .overview-card strong {
    color: #342101 !important;
    font-weight: 950 !important;
}

/* Các card chức năng */

body:has(#adminSidebar) .dashboard-card,
body:has(#adminSidebar) .quick-card,
body:has(#adminSidebar) .shortcut-card,
body:has(#adminSidebar) .module-card,
body:has(#adminSidebar) .action-card,
body:has(#adminSidebar) .feature-card,
body:has(#adminSidebar) .menu-card,
body:has(#adminSidebar) .function-card,
body:has(#adminSidebar) .card {
    color: var(--tlms-text) !important;

    background:
        linear-gradient(
            145deg,
            #fffefb 0%,
            #fff7df 100%
        ) !important;

    border: 1px solid #dfbe68 !important;
    border-top: 3px solid #d7a028 !important;

    box-shadow:
        0 8px 20px rgba(76, 46, 2, 0.09)
        !important;
}

body:has(#adminSidebar) .dashboard-card:hover,
body:has(#adminSidebar) .quick-card:hover,
body:has(#adminSidebar) .shortcut-card:hover,
body:has(#adminSidebar) .module-card:hover,
body:has(#adminSidebar) .action-card:hover,
body:has(#adminSidebar) .feature-card:hover {
    border-color: #bf8315 !important;

    box-shadow:
        0 11px 27px rgba(95, 59, 2, 0.15)
        !important;

    transform: translateY(-1px);
}

/* Icon card đang màu xanh */

body:has(#adminSidebar) .dashboard-card [class*="icon"],
body:has(#adminSidebar) .quick-card [class*="icon"],
body:has(#adminSidebar) .shortcut-card [class*="icon"],
body:has(#adminSidebar) .module-card [class*="icon"],
body:has(#adminSidebar) .action-card [class*="icon"],
body:has(#adminSidebar) .feature-card [class*="icon"],
body:has(#adminSidebar) .page-heading-icon,
body:has(#adminSidebar) .card-icon,
body:has(#adminSidebar) .quick-icon,
body:has(#adminSidebar) .module-icon {
    color: #754a04 !important;

    background:
        linear-gradient(
            145deg,
            #fff5ca,
            #e6b744
        ) !important;

    border-color: #d7a028 !important;
}

/* Thanh tùy chỉnh dashboard đang xanh */

body:has(#adminSidebar) .dashboard-toolbar,
body:has(#adminSidebar) .dashboard-toggle,
body:has(#adminSidebar) .customize-dashboard,
body:has(#adminSidebar) .dashboard-customizer,
body:has(#adminSidebar) [class*="customize"],
body:has(#adminSidebar) [class*="customizer"] {
    color: #2b1900 !important;

    background:
        linear-gradient(
            90deg,
            #f7d975,
            #dca32a,
            #f1cc62
        ) !important;

    border-color: #b97a0a !important;
}

body:has(#adminSidebar) .dashboard-toolbar *,
body:has(#adminSidebar) .dashboard-toggle *,
body:has(#adminSidebar) .customize-dashboard *,
body:has(#adminSidebar) .dashboard-customizer *,
body:has(#adminSidebar) [class*="customize"] * {
    color: #2b1900 !important;
}

/* =========================================================
   6. NÚT QUẢN TRỊ
   ========================================================= */

body:has(#adminSidebar)
button:not(.btn-danger):not(.danger):not(.delete):not([class*="danger"]):not([class*="delete"]),

body:has(#adminSidebar)
.btn:not(.btn-danger):not([class*="danger"]):not([class*="delete"]),

body:has(#adminSidebar)
.button:not([class*="danger"]):not([class*="delete"]),

body:has(#adminSidebar)
a.btn:not(.btn-danger):not([class*="danger"]):not([class*="delete"]),

body:has(#adminSidebar)
input[type="submit"] {
    color: #291800 !important;

    background:
        linear-gradient(
            135deg,
            #fff4c5 0%,
            #e8b947 48%,
            #cf9015 100%
        ) !important;

    border: 1px solid #b8790a !important;

    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.8),
        0 5px 13px rgba(85, 51, 1, 0.14)
        !important;

    font-weight: 900 !important;
}

body:has(#adminSidebar)
button:not(.btn-danger):not(.danger):not(.delete):not([class*="danger"]):not([class*="delete"]):hover,

body:has(#adminSidebar)
.btn:not(.btn-danger):not([class*="danger"]):not([class*="delete"]):hover,

body:has(#adminSidebar)
.button:not([class*="danger"]):not([class*="delete"]):hover {
    color: #211300 !important;

    background:
        linear-gradient(
            135deg,
            #fff9df,
            #efca65,
            #d89d22
        ) !important;

    border-color: #946007 !important;
}

/* Nút xóa vẫn đỏ để tránh thao tác nhầm */

body:has(#adminSidebar) .btn-danger,
body:has(#adminSidebar) [class*="danger"],
body:has(#adminSidebar) [class*="delete"] {
    color: #ffffff !important;
    background: #b42318 !important;
    border-color: #8f1b14 !important;
}

/* =========================================================
   7. FORM VÀ BẢNG QUẢN TRỊ
   ========================================================= */

body:has(#adminSidebar) input:not([type="checkbox"]):not([type="radio"]),
body:has(#adminSidebar) select,
body:has(#adminSidebar) textarea {
    color: #281e10 !important;
    background: #fffef9 !important;
    border-color: #d8ba70 !important;
}

body:has(#adminSidebar) input:focus,
body:has(#adminSidebar) select:focus,
body:has(#adminSidebar) textarea:focus {
    border-color: #c58913 !important;

    box-shadow:
        0 0 0 3px rgba(211, 157, 34, 0.19)
        !important;
}

body:has(#adminSidebar) table {
    color: #281e10 !important;
    background: #fffef9 !important;
    border-color: #dfc783 !important;
}

body:has(#adminSidebar) table thead th,
body:has(#adminSidebar) table thead td {
    color: #fff5cf !important;

    background:
        linear-gradient(
            105deg,
            #4b2d02,
            #805208,
            #4e2f02
        ) !important;

    border-color:
        rgba(238, 200, 96, 0.38) !important;

    font-weight: 900 !important;
}

body:has(#adminSidebar) table tbody tr:nth-child(even) {
    background: #fff9e9 !important;
}

body:has(#adminSidebar) table tbody tr:hover {
    background: #fff0c0 !important;
}

/* Badge */

body:has(#adminSidebar) .badge,
body:has(#adminSidebar) .tag,
body:has(#adminSidebar) .chip,
body:has(#adminSidebar) .pill,
body:has(#adminSidebar) .status-badge,
body:has(#adminSidebar) .status-pill {
    color: #543603 !important;
    background: #fff0b9 !important;
    border-color: #d9a832 !important;
}

/* =========================================================
   8. NÚT AI GÓC PHẢI
   ========================================================= */

body:has(#adminSidebar) .ai-button,
body:has(#adminSidebar) .ai-assistant-button,
body:has(#adminSidebar) [class*="ai-float"],
body:has(#adminSidebar) [class*="ai-button"] {
    color: #291800 !important;

    background:
        linear-gradient(
            145deg,
            #fff4c5,
            #dc9f22
        ) !important;

    border: 2px solid #bd7e0c !important;

    box-shadow:
        0 8px 22px rgba(74, 43, 0, 0.23)
        !important;
}

/* =========================================================
   9. ĐIỆN THOẠI
   ========================================================= */

@media (max-width: 900px) {
    body header a[href*="gio-hang"],
    body header a[href*="/cart"],
    body .cart-button,
    body .cart-link,
    body .header-cart,
    body .nav-cart {
        min-width: 88px !important;
        min-height: 36px !important;

        padding: 7px 11px !important;

        font-size: 12px !important;
    }

    body .brand-logo,
    body .logo-mark,
    body .site-logo-mark,
    body .brand-icon {
        width: 43px !important;
        min-width: 43px !important;
        height: 43px !important;

        border-radius: 11px !important;
    }

    body:has(#adminSidebar) #adminSidebar,
    body:has(#adminSidebar) .admin-sidebar,
    body:has(#adminSidebar) aside.sidebar {
        box-shadow:
            12px 0 35px rgba(35, 19, 0, 0.34)
            !important;
    }
}

/*
 * Dự phòng cho trình duyệt không áp dụng :has().
 * Các selector này chỉ tác động những thành phần quản trị rõ ràng.
 */

#adminSidebar,
.admin-sidebar,
aside.sidebar {
    --blue: #b77d12 !important;
    --blue-light: #fff2c3 !important;
}

#adminSidebar .active,
.admin-sidebar .active {
    color: #2a1900 !important;
    background: #e5b13a !important;
}