﻿
/* ============================= */
/*     Custom Table Styling      */
/* ============================= */

.CustomTableview table {
    width: 100%;
    border-collapse: collapse;
    border-radius: 8px; /* Rounded corners */
    overflow: hidden;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Light shadow */
}

.CustomTableview table,
.CustomTableview th,
.CustomTableview td {
    border: 1px solid #ddd; /* Softer border */
}

/* Table Headers */
.CustomTableview th {
    background-color: #f4f4f4;
    color: #333;
    font-weight: bold;
    padding: 10px;
    text-align: left;
}

/* Table Cells */
.CustomTableview td {
    padding: 10px;
    text-align: left;
}

/* Hover Effect for Rows */
.CustomTableview tr:hover {
    background-color: #f1f1f1;
    transition: background-color 0.3s ease;
}

/* ============================= */
/*        Edit Button            */
/* ============================= */

.CustomTableview .edit-btn {
    cursor: pointer;
    color: #007BFF;
    text-decoration: none;
    font-weight: bold;
    transition: color 0.3s ease;
}

    .CustomTableview .edit-btn:hover {
        color: #0056b3;
        text-decoration: underline;
    }

/* ============================= */
/*        Input Cell Styling     */
/* ============================= */

.CustomTableview .input-cell {
    background-color: #fafafa;
    border: 1px solid #ddd;
    padding: 8px;
    border-radius: 4px;
}

/* ============================= */
/*        Responsive Design      */
/* ============================= */

@media screen and (max-width: 768px) {
    .CustomTableview table {
        font-size: 14px;
    }

    .CustomTableview th,
    .CustomTableview td {
        padding: 8px;
    }
}




/*.CustomTableview table {
    width: 100%;
    border-collapse: collapse;
}

    .CustomTableview table, .CustomTableview th, .CustomTableview td {
        border: 1px solid black;
    }

    .CustomTableview th, .CustomTableview td {
        padding: 5px;
        text-align: left;
    }

    .CustomTableview .edit-btn {
        cursor: pointer;
        color: blue;
        text-decoration: underline;
    }

    .CustomTableview.input-cell {
        background-color: #f9f9f9;
    }
*/
