.sla-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.sla-table th, .sla-table td { padding: 16px 12px; text-align: left; border-bottom: 1px solid #ccc; vertical-align: top; }
.sla-table th { font-weight: 700; }
.sla-row-critical td { background: #fff5f5; } .sla-row-high td { background: #fff9f0; } .sla-row-medium td { background: #fffef3; } .sla-row-low td { background: #f4fbff; } .sla-row-none td { background: #f4fff6; }
/* Keep columns aligned */ .sla-col-priority { width: 140px; font-weight: bold; white-space: nowrap; }
.sla-col-time { width: 150px; white-space: nowrap; }
/* Mobile stacked layout */ @media (max-width: 768px) { .sla-table thead { display: none; }
.sla-table, .sla-table tbody, .sla-table tr, .sla-table td { display: block; width: 100%; }
.sla-table tr { margin-bottom: 18px; border: 1px solid #ddd; border-radius: 6px; overflow: hidden; }
.sla-table td { border-bottom: 1px solid #eee; padding: 14px; }
.sla-table td:last-child { border-bottom: none; }
.sla-table td::before { content: attr(data-label); display: block; font-size: 12px; font-weight: 600; margin-bottom: 6px; opacity: 0.7; text-transform: uppercase; }
.sla-col-priority, .sla-col-time { width: 100% !important; white-space: normal !important; } }
Fast IT Support When You Need It
One of the most common questions we hear is “What is your support response time?” At Affinity MSP, we understand that when something breaks, every second counts.