<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/* Äáº£m báº£o hÃ¬nh áº£nh cÃ³ kÃ­ch thÆ°á»›c vuÃ´ng vÃ&nbsp; cover toÃ&nbsp;n bá»™ card */
.product-image {
    width: 100%;
    height: 200px;  /* Thay Ä‘á»•i giÃ¡ trá»‹ nÃ&nbsp;y náº¿u báº¡n muá»‘n Ä‘iá»u chá»‰nh chiá»u cao */
    object-fit: cover;  /* Äáº£m báº£o hÃ¬nh áº£nh bao phá»§ toÃ&nbsp;n bá»™ tháº» mÃ&nbsp; khÃ´ng bá»‹ mÃ©o */
}

/* CÄƒn chá»‰nh icon vÃ&nbsp; vÄƒn báº£n */
.info-text {
    display: inline-flex;          /* DÃ¹ng inline-flex Ä‘á»ƒ cÄƒn chá»‰nh cÃ¡c pháº§n tá»­ trong cÃ¹ng má»™t dÃ²ng */
    align-items: center;           /* CÄƒn giá»¯a icon vÃ&nbsp; text theo chiá»u dá»c */
    width: 20px;                   /* Äáº·t chiá»u rá»™ng cá»‘ Ä‘á»‹nh cho icon */
    justify-content: flex-start;   /* CÄƒn trÃ¡i cho icon */
}

.card-text span {
    display: inline-block;
}

.card {
    font-size: 14px !important;
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
}

.shop_manage_product {
    height: 100vh;
    overflow: auto;
    padding-bottom: 60px !important;
}
#upload-box {
    background-color: white;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    color: #000;
}

#upload-image-product {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
}

#upload-image-product img {
    width: 70%;  /* Giá»¯ kÃ­ch thÆ°á»›c áº£nh cá»§a biá»ƒu tÆ°á»£ng upload */
    opacity: 0.5;
}

#upload-image-product p {
    font-size: 12px;
}

#thumbnail-image {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Giá»¯ áº£nh tá»· lá»‡ Ä‘Ãºng vÃ&nbsp; phá»§ Ä‘áº§y khu vá»±c */
    border-radius: 8px; /* Äáº£m báº£o thumbnail cÃ³ gÃ³c bo trÃ²n náº¿u cáº§n */
}

.stat-card {
    border-radius: 8px;  /* Bo gÃ³c card */
    background: linear-gradient(135deg, #8e2de2, #4a00e0);  /* MÃ&nbsp;u ná»n gradient */
    color: white;  /* MÃ&nbsp;u chá»¯ */
    padding: 15px;
    display: flex;
    flex-direction: column;
    position: relative;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
    margin-bottom: 20px;
}

.stat-card-body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;  /* Align items to the left */
    justify-content: space-between;
}

.stat-number {
    font-size: 22px;
    font-weight: bold;
    color: #ffc107;
}

@media (max-width: 1024px) {
    .stat-number {
        font-size: 16px;
    }
}

.stat-info {
    font-size: 14px;
    margin-top: 5px;
}

.stat-card i {
    position: absolute;
    bottom: 10px;
    right: 10px;  /* Äáº·t icon á»Ÿ gÃ³c dÆ°á»›i bÃªn pháº£i */
    font-size: 60px;  /* PhÃ³ng to icon */
    color: rgba(255, 255, 255, 0.5);  /* MÃ&nbsp;u icon nháº¹ */
}

.agent-dropdown-content, .dropdown-content {
    padding-left: 30px;
}

.agents {
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
}

.agents-distribute {
    border-radius: 8px;  /* Bo gÃ³c card */
    background: linear-gradient(135deg, #155724, #343a40db);
    color: white;  /* MÃ&nbsp;u chá»¯ */
    padding: 15px;
    display: flex;
    flex-direction: column;
    position: relative;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
}

.agents-distribute i {
    position: absolute;
    top: 10px;
    right: 10px;  /* Äáº·t icon á»Ÿ gÃ³c dÆ°á»›i bÃªn pháº£i */
    font-size: 60px;  /* PhÃ³ng to icon */
    color: rgba(255, 255, 255, 0.5);  /* MÃ&nbsp;u icon nháº¹ */
}

.right-top i {
    position: static;
    font-size: large;
    color: #000;

}
.transaction-log {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    padding: 10px;
    position: relative;
}

.transaction-log {
    position: relative; /* Äá»ƒ relative giÃºp con i cÄƒn theo container */
}

.transaction-log i {
    position: absolute;
    bottom: 50%; /* ÄÆ°a pháº§n tá»­ lÃªn giá»¯a chiá»u dá»c cá»§a container */
    right: 10px; /* CÄƒn vÃ&nbsp;o bÃªn pháº£i vá»›i khoáº£ng cÃ¡ch 10px */
    transform: translateY(50%); /* Dá»‹ch chuyá»ƒn vá» chÃ­nh giá»¯a theo chiá»u dá»c */
    font-size: 60px;
}

.pagination {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

.pagination a {
    padding: 5px;
    margin: 0 5px;
    text-decoration: none;
    color: #007bff;
    border: 1px solid #007bff;
    border-radius: 3px;
}

.pagination a.active {
    background-color: #007bff;
    color: white;
}

.pagination a:hover {
    background-color: #0056b3;
    color: white;
}

.agents_dashboard{
    height: 100vh;
    overflow: auto;
    margin: 0 auto;
}

/* TÃ¹y chá»‰nh thanh cuá»™n cho trÃ¬nh duyá»‡t hiá»‡n Ä‘áº¡i */
.agents_dashboard::-webkit-scrollbar {
    width: 8px; /* Äá»™ rá»™ng cá»§a thanh cuá»™n */
}

.agents_dashboard::-webkit-scrollbar-thumb {
    background-color: #ddd; /* MÃ&nbsp;u thanh cuá»™n */
    border-radius: 4px; /* Bo gÃ³c thanh cuá»™n */
}

.agents_dashboard::-webkit-scrollbar-thumb:hover {
    background-color: #3a3f44; /* MÃ&nbsp;u thanh cuá»™n khi hover */
}

.agents_dashboard::-webkit-scrollbar-track {
    background: #fff; /* MÃ&nbsp;u ná»n track */
}

.menu-content {
    display: block; /* LuÃ´n hiá»ƒn thá»‹ trÃªn giao diá»‡n mÃ¡y tÃ­nh */
    position: sticky; /* Cá»‘ Ä‘á»‹nh theo mÃ&nbsp;n hÃ¬nh khi cuá»™n */
    top: 10px; /* CÃ¡ch Ä‘á»‰nh 10px */
}

/* áº¨n báº£ng thÃ´ng bÃ¡o vÃ&nbsp; chá»‰ hiá»ƒn thá»‹ icon menu trÃªn di Ä‘á»™ng */
.menu-icon {
    display: none; /* áº¨n icon menu trÃªn mÃ&nbsp;n hÃ¬nh lá»›n */
}

@media (max-width: 768px) {
    /* Chá»‰ hiá»ƒn thá»‹ icon menu trÃªn di Ä‘á»™ng */
    .menu-icon {
        display: block;
        position: fixed;
        top: 5px;
        right: 5px;
        z-index: 1000;
        cursor: pointer;
        box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
        background: #fff;
        padding: 5px;
        border-radius: 100%;
    }

    /* áº¨n báº£ng thÃ´ng bÃ¡o trÃªn di Ä‘á»™ng */
    .menu-content {
        display: none; /* Máº·c Ä‘á»‹nh áº©n trÃªn di Ä‘á»™ng */
        position: fixed; /* Hiá»ƒn thá»‹ á»Ÿ dáº¡ng há»™p báº­t lÃªn khi Ä‘Æ°á»£c kÃ­ch hoáº¡t */
        top: 50px;
        left: 10px;
        right: 10px;
        z-index: 999;
        background-color: white;
        border: 1px solid #ccc;
        border-radius: 8px;
        padding: 10px;
        box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
    }

    /* Khi menu Ä‘Æ°á»£c kÃ­ch hoáº¡t */
    .menu-content.active {
        display: block; /* Hiá»ƒn thá»‹ báº£ng thÃ´ng bÃ¡o khi ngÆ°á»i dÃ¹ng báº¥m vÃ&nbsp;o icon */
    }
}

.comment-group {
    border: 2px solid #0040ff;
 }
 
.comment-divider {
    border-top: 2px solid #0040ff;
}

/* MÃ&nbsp;u ná»n cho thead */
.custom-table thead {
    background-color: #007bff; /* MÃ&nbsp;u xanh dÆ°Æ¡ng cho thead */
    color: #fff; /* MÃ&nbsp;u chá»¯ tráº¯ng */
}

/* MÃ&nbsp;u ná»n cho cÃ¡c dÃ²ng tbody */
.custom-table tbody tr:nth-child(odd) {
    background-color: rgba(255, 255, 255, 0.7); /* MÃ&nbsp;u tráº¯ng Ä‘á»¥c cho cÃ¡c dÃ²ng láº» */
}
    .custom-table tbody tr:nth-child(even) {
    background-color: #f8f9fa; /* MÃ&nbsp;u ná»n sÃ¡ng cho cÃ¡c dÃ²ng cháºµn */
}

/* MÃ&nbsp;u chá»¯ cho tbody */
.custom-table tbody td {
    color: #333; /* MÃ&nbsp;u chá»¯ tá»‘i cho dá»… Ä‘á»c */
}

/* ThÃ´ng tin so sÃ¡nh */
.info-comparison {
    margin: 20px 0 20px 0;
    padding: 10px;
    text-align: justify;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
}

.info-comparison h4 {
    font-size: 1.25rem;
    font-weight: bold;
}

.info-comparison p {
    font-size: 1rem;
    margin-bottom: 10px;
}

.info-comparison strong {
    font-weight: bold;
}

.icon-shop {
    background: blueviolet;
    padding: 5px;
    border-radius: 5px;
    color: white;
    text-decoration: none;
    display: inline-block;
}

.icon-shop span {
    color: white;
    font-size: 16px;
}

.shop-info {
    border: 1px solid #dee2e6;
    padding: 5px;
    border-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
}</pre></body></html>