/* Dark Theme Tool Page Styles */
.tool-header {
    background: #2d2d2d;
    border: 1px solid #3d3d3d;
    color: #e0e0e0;
}

.tool-header h1,
.tool-header h2 {
    color: #e0e0e0;
}

.tool-wrapper {
    background: #2d2d2d;
    border: 1px solid #3d3d3d;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

.tool-wrapper:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.5);
}

.tool-input textarea {
    background: #1a1a1a;
    color: #e0e0e0;
    border-color: #3d3d3d;
}

.tool-input textarea:focus {
    border-color: #4a9eff;
    box-shadow: 0 0 0 3px rgba(74,158,255,0.2);
}

.tool-output {
    background: #1a1a1a;
    border-color: #3d3d3d;
    color: #e0e0e0;
}

.tool-output:focus-within {
    border-color: #4a9eff;
}

.tool-output pre {
    color: #e0e0e0;
}

.btn-primary {
    background: #4a9eff;
    box-shadow: 0 4px 12px rgba(74,158,255,0.3);
}

.btn-primary:hover {
    background: #7bb3ff;
    box-shadow: 0 6px 20px rgba(74,158,255,0.4);
}

.btn-secondary {
    background: #5a6268;
    color: #e0e0e0;
}

.btn-secondary:hover {
    background: #6c757d;
}

.tool-output .error {
    background: #7f1d1d;
    border-left-color: #dc2626;
    color: #fca5a5;
}

.loading {
    border-color: rgba(74,158,255,0.3);
    border-top-color: #4a9eff;
}