.doc-table-wrapper { font-family: sans-serif; width: 100%; position: relative;}
.doc-table { width: 100%; border-collapse: collapse; margin-bottom: 20px; }
.doc-table th { color: #004a99; font-weight: 600; text-align: left; padding: 15px; border-bottom: 1px solid #eee; }
.doc-row { border-bottom: 1px solid #f9f9f9; transition: background 0.3s; }
.doc-row:nth-child(even) { background-color: #fcfcfc; }
.doc-row:hover { background-color: #f0f7ff; }
.doc-row td { padding: 12px 15px; color: #666; font-size: 14px; }
.col-name a { color: #004a99; font-weight: 700; text-decoration: none; }
.col-icon svg { color: #004a99; cursor: pointer; }

.doc-footer { display: flex; justify-content: space-between; align-items: center; padding-top: 20px; border-top: 1px solid #eee; font-size: 14px; color: #888; }
.doc-pagination { display: flex; align-items: center; gap: 15px; }
.doc-pagination button { background: none; border: none; cursor: pointer; color: #004a99; display: flex; align-items: center; }
.doc-pagination button:disabled { color: #ccc; cursor: not-allowed; }
.page-num { border: 1px solid #eee; padding: 2px 8px; border-radius: 4px; color: #004a99; font-weight: bold; }

.doc-table-wrapper .table-responsive{
    width: inherit;
    overflow: auto;
}

/* Trạng thái Loading */
.doc-table-wrapper.is-loading .doc-table,
.doc-table-wrapper.is-loading .doc-footer {
    visibility: hidden; /* Giữ layout nhưng ẩn nội dung để tránh giật nhảy */
}

.doc-loader-overlay {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
}

.doc-table-wrapper.is-loading .doc-loader-overlay {
    display: block;
}

/* Spinner đơn giản */
.doc-spinner {
    width: 40px;
    height: 40px;
    border: 3px solid #f3f3f3;
    border-top: 3px solid #004a99;
    border-radius: 50%;
    animation: doc-spin 1s linear infinite;
}

@keyframes doc-spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Tối ưu UI cho No Data */
.doc-no-data {
    padding: 20px;
    background: #f9f9f9;
    border: 1px dashed #ccc;
    text-align: center;
    color: #666;
}