.p-0 {
    padding: 0 !important;
}

.table-vertical .table>tbody>tr>th:first-child {
    background-color: #212529;
    border-color: #32383e;
    color: #fff;
}

.table-color-danger .table>thead th,
.table-color-danger.table-vertical .table>tbody>tr>th:first-child {
    background-color: #98272D !important;
    color: #fff;
}
.table-color-primary .table>thead th,
.table-color-primary.table-vertical .table>tbody>tr>th:first-child {
    background-color: #263E72 !important;
    color: #fff;
}


.table-color-success .table>thead th,
.table-color-success.table-vertical .table>tbody>tr>th:first-child {
    background-color: #28a745 !important;
    color: #fff;
}

.table-color-warning .table>thead th,
.table-color-warning.table-vertical .table>tbody>tr>th:first-child {
    background-color: #ffc107 !important;
    color: #fff;
}

.table-color-info .table>thead th,
.table-color-info.table-vertical .table>tbody>tr>th:first-child {
    background-color: #17a2b8 !important;
    color: #fff;
}


.table-striped tbody tr:nth-of-type(odd) {
    background-color: #fff;
}

.table-striped tbody tr:nth-of-type(even) {
    background-color: #ECF0FA;
}

.table-color-danger tbody tr:nth-of-type(odd) {
    background-color: #fff;
}

.table-color-danger tbody tr:nth-of-type(even) {
    background-color: #F4F4F4;
}


.table-borderless table th,
.table-borderless table td {
    border: unset;
}

/*  Table Styles
------------------------------- */
.paragraph .table-wrapper ul li::before,
.gavias-builder--content .table-wrapper ul li::before {
    display: none;
}

.table-wrapper table {
    box-shadow: 0px 35px 50px rgba(27, 31, 49, 0.1);
}

.table-wrapper .table {
    border-collapse: collapse;
    width: 100%;
    background-color: white;
    margin-bottom: 0;
}

.table-wrapper .table td,
.table-wrapper .table th {
    text-align: center;
    padding: 10px;
}

.table-wrapper .table td {
    border-right: 1px solid #f8f8f8;
}

/*  thead th color
  ------------------------------- */

.table-wrapper .table thead th {
    color: #ffffff;
    background: #ffb4a2;
    /* 指定第一個和預設的標題顏色 */
}

.table-wrapper .table thead th:nth-child(2) {
    background: #e5989b;
    /* 指定第二個標題顏色 */
}

.table-wrapper .table thead th:nth-child(3) {
    background: #b5838d;
    /* 指定第三個標題顏色 */
}

.table-wrapper .table thead th:nth-child(4) {
    background: #6d6875;
    /* 指定第四個標題顏色 */
}

/*  table ul
  ------------------------------- */

.table-wrapper .table ul {
    padding: 20px;
    margin: 0;
    text-align: left;
}

.table-wrapper .table ul li {
    border-bottom: 1px solid #e7e7e7;
    padding: 5px;
    position: relative;
    list-style-type: none;
}

/*  Responsive ------------------------------- */
@media (max-width: 767px) {

    .table-wrapper .table thead {
        display: none;
    }

    .table-wrapper .table td {
        display: block;
        /* 一定要下！ */
        padding: 0;
    }

    .table-wrapper .table td:before {
        content: attr(data-title);
        /* 顯示 data-title */
        display: inline-block;
        width: 100%;
        font-weight: 500;
        padding: 6px 0;
        color: #ffffff;
        background: #ffb4a2;
        /* 指定第一個和預設的標題顏色 */
    }

    .table-wrapper .table td:nth-child(2):before {
        background: #e5989b;
        /* 指定第二個標題顏色 */
    }

    .table-wrapper .table td:nth-child(3):before {
        background: #b5838d;
        /* 指定第三個標題顏色 */
    }

    .table-wrapper .table td:nth-child(4):before {
        background: #6d6875;
        /* 指定第四個標題顏色 */
    }
}

@media (min-width: 576px) {
    .modal-lg {
        max-width: 800px;
    }
}