.dashboard-page {
     padding: 50px 0 80px;
     background: radial-gradient(circle at top right, rgba(31, 42, 74, 0.35), transparent 55%);
 }

 .dashboard-card {
     background: #ffffff;
     border-radius: 20px;
     box-shadow: 0 24px 60px rgba(10, 15, 30, 0.2);
     padding: 32px 36px 28px;
     color: #1b2230;
 }

 .dashboard-header {
     display: flex;
     flex-wrap: wrap;
     gap: 18px;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 22px;
 }

 .dashboard-header h1 {
     margin: 0 0 6px;
     font-size: 2rem;
     color: #1f2a4a;
 }

 .dashboard-header p {
     margin: 0;
     color: #6b7280;
 }

 .dashboard-search {
     display: grid;
     gap: 6px;
     min-width: 240px;
 }

 .dashboard-search label {
     font-size: 0.85rem;
     color: #6b7280;
 }

 .dashboard-search input {
     height: 42px;
     padding: 0 14px;
     border-radius: 10px;
     border: 1px solid #d3d8e4;
     background: #ffffff;
     color: #1b2230;
     font-size: 0.95rem;
 }

 .dashboard-search input:focus {
     outline: none;
     border-color: #000080;
     box-shadow: 0 0 0 3px rgba(0, 0, 128, 0.18);
 }

 .table-wrap {
     overflow-x: auto;
     border-radius: 14px;
     border: 1px solid #e2e6f0;
 }

 .dashboard-table {
     width: 100%;
     border-collapse: collapse;
     min-width: 680px;
     background: #ffffff;
 }

 .dashboard-table th,
 .dashboard-table td {
     padding: 14px 16px;
     text-align: left;
     border-bottom: 1px solid #edf0f7;
     font-size: 0.95rem;
 }

 .dashboard-table thead th {
     background: #f7f8fc;
     color: #3b4355;
     font-weight: 600;
 }

 .dashboard-table tbody tr:hover {
     background: #f3f5fb;
 }

 .status {
     display: inline-flex;
     align-items: center;
     padding: 4px 10px;
     border-radius: 999px;
     font-size: 0.8rem;
     font-weight: 600;
 }

 .badge-success {
     background: rgba(61, 220, 151, 0.2);
     color: #1f8f5b;
 }

 .badge-warning {
     background: rgba(255, 209, 102, 0.35);
     color: #a37000;
 }

 .badge-danger {
     background: rgba(239, 68, 68, 0.2);
     color: #b42318;
 }

 .no-results td {
     text-align: center;
     color: #6b7280;
     font-style: italic;
 }

 @media (max-width: 720px) {
     .dashboard-card {
         padding: 24px 20px;
     }

     .dashboard-header {
         align-items: stretch;
     }
 }