/* apps/techsupport/public/css/style.css */

/* Custom scrollbar for clean look */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #f3f4f6; /* gray-100 */
}

::-webkit-scrollbar-thumb {
    background: #cbd5e1; /* slate-300 */
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #dc2626; /* red-600 */
}

/* Base resets */
input::placeholder {
    color: #94a3b8; /* slate-400 */
    opacity: 1;
}

/* Interactive step styling for the clinical protocol */
.step-item {
    padding: 1rem;
    background-color: #f8fafc; /* slate-50 */
    border: 1px solid #e2e8f0; /* slate-200 */
    border-left: 4px solid #94a3b8; /* slate-400 */
    border-radius: 0.375rem; /* rounded-md */
    margin-bottom: 0.75rem;
}

.step-number {
    font-weight: 900;
    color: #dc2626; /* red-600 */
    margin-right: 0.5rem;
}

.diagnostic-text {
    color: #334155; /* slate-700 */
}

/* The final or highest severity step gets the primary red accent */
.severity-high {
    border-left-color: #dc2626; /* red-600 */
    background-color: #fef2f2; /* red-50 */
    border: 1px solid #fecaca; /* red-200 */
    border-left: 4px solid #dc2626;
}

.severity-high .step-number {
    color: #991b1b; /* red-800 */
}

/* Focus and active states */
button:active {
    transform: translateY(2px);
    box-shadow: none !important;
}