body {
      margin: 0;
      font-family: "Poppins", sans-serif;
      background: #f5f7fa;
      min-height: 100vh;
      display: flex;
      flex-direction: column;
    }

    .manage-wrapper {
      flex: 1;
      padding: 30px 40px;
    }

    .manage-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 24px;
    }

    .manage-header h1 {
      margin: 0;
      font-size: 24px;
      font-weight: 700;
    }

    .manage-header a {
      font-size: 13px;
      text-decoration: none;
      color: #004aad;
    }

    .manage-filters {
      display: flex;
      gap: 12px;
      margin-bottom: 16px;
      flex-wrap: wrap;
      align-items: center;
    }

    .manage-filters select,
    .manage-filters input {
      padding: 8px 10px;
      border-radius: 8px;
      border: 1px solid #ccc;
      font-size: 13px;
      min-width: 180px;
    }

    .manage-filters input {
      flex: 1;
      min-width: 220px;
    }

    .docs-table-wrapper {
      background: white;
      border-radius: 12px;
      box-shadow: 0 4px 18px rgba(0, 0, 0, 0.06);
      padding: 12px 16px 16px;
      overflow: auto;
    }

    table.docs-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 13px;
    }

    .docs-table thead {
      background: #f0f4ff;
    }

    .docs-table th,
    .docs-table td {
      padding: 8px 10px;
      border-bottom: 1px solid #eee;
      text-align: left;
      white-space: nowrap;
    }

    .docs-table th {
      font-weight: 600;
      font-size: 12px;
      text-transform: uppercase;
      letter-spacing: 0.03em;
      color: #555;
    }

    .docs-table tr:last-child td {
      border-bottom: none;
    }

    .badge-type {
      display: inline-block;
      padding: 2px 8px;
      border-radius: 999px;
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: 0.04em;
      font-weight: 600;
    }

    .badge-invoice { background: #e5f0ff; color: #004aad; }
    .badge-loa { background: #e1f7e8; color: #1b7c3a; }
    .badge-cloa { background: #fff1d6; color: #b57400; }
    .badge-scholarship { background: #f3e7ff; color: #7e44e3; }
    .badge-receipt {
      background: #ffe7ec;
      color: #b3223a;
    }

    .doc-actions button {
      padding: 6px 12px;
      border: 1px solid #004aad;
      background: #eef2ff;
      color: #004aad;
      border-radius: 6px;
      border: none;
      cursor: pointer;
    }
    .doc-actions button:hover {
      background: #e0e7ff;
    }

    .doc-actions button.delete {
      padding: 6px 12px;
      border: 1px solid #b40000;
      background: #eef2ff;
      color: #b40000;
      border-radius: 6px;
      border: none;
      cursor: pointer;
    }
    .doc-actions button.delete:hover {
      background: #e0e7ff;
    }

    .no-records {
      text-align: center;
      padding: 16px;
      color: #777;
      font-size: 13px;
    }

    .manage-meta {
      margin-top: 8px;
      font-size: 12px;
      color: #666;
    }

    footer {
      padding: 12px 20px;
      font-size: 12px;
      text-align: center;
      color: #888;
    }

    .pagination-bar {
      display: flex;
      justify-content: flex-end;
      align-items: center;
      gap: 8px;
      margin-top: 10px;
      font-size: 13px;
      color: #4b5563;
    }

    .pagination-bar .page-btn {
      padding: 6px 10px;
      border-radius: 999px;
      border: 1px solid #215ed8;
      background: #6eaae5;
      cursor: pointer;
      font-size: 12px;
    }

    .pagination-bar .page-btn:hover:not(:disabled) {
      background: #e5e7eb;
    }

    .pagination-bar .page-btn:disabled {
      opacity: 0.4;
      cursor: default;
    }

    .pagination-bar .page-info {
      margin: 0 2px;
    }

    .manage-header-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin: 12px 0 4px;
    }

    .manage-meta {
      font-size: 13px;
      color: #4b5563;
    }

    @media (max-width: 768px) {
      .manage-wrapper {
        padding: 20px 16px;
      }
    }