a.view-detail-btn {
    display: inline-block;
    font-size: 13px;
    color: #fff !important;
    padding: 6px 14px;
    border-radius: 20px;
    background-color: #797979 !important;
    border-color: #797979 !important;
    transition: 0.3s;
}
a.view-detail-btn:hover {
  background: #797979;
  color: #fff !important;
}

/* ===== PRODUCT TABLE LAYOUT FIX ===== */

/* Table wrapper */
.table-responsive {
    width: 100%;
    overflow-x: auto;
}

/* Table base */
.table {
    width: 100%;
    table-layout: fixed; /* IMPORTANT */
    border-collapse: collapse;
}

/* Header & cell text wrap */
.table th,
.table td {
    white-space: normal !important;
    word-break: break-word;
    overflow-wrap: break-word;
    vertical-align: top;
    padding: 12px 10px;
    font-size: 14px;
}

/* Column widths (DESKTOP) */
.table th:nth-child(1),
.table td:nth-child(1) {
    width: 14%; /* Category */
}

.table th:nth-child(2),
.table td:nth-child(2) {
    width: 20%; /* Brand Name */
}

.table th:nth-child(3),
.table td:nth-child(3) {
    width: 46%; /* Composition */
}

.table th:nth-child(4),
.table td:nth-child(4) {
    width: 20%; /* Detail */
    text-align: center;
}

/* Make links look clean */
.table td a {
    display: block;
    text-decoration: none;
}

/* Hover effect (layout only) */
.table tbody tr:hover {
    background-color: #f7f9fc;
}

/* ===== MOBILE RESPONSIVE ===== */
@media (max-width: 768px) {

    .table {
        font-size: 13px;
    }

    .table th,
    .table td {
        padding: 8px;
    }

    /* Reduce composition dominance */
    .table th:nth-child(3),
    .table td:nth-child(3) {
        width: auto;
    }
}