/* Este arquivo conterá apenas as variáveis de cores e estilos temáticos */
/* As variáveis já estão definidas em main.css, mas podemos expandir aqui */

:root {
    /* Variáveis principais (repetidas para clareza) */
    --primary-color: #FF6C37;
    --primary-dark: #E55A2B;
    --primary-light: #FF8C5F;
    --sidebar-bg: #252C3A;
    --sidebar-text: #B0B7C3;
    --sidebar-active: #FF6C37;
    --main-bg: #0F1217;
    --card-bg: #1A1D24;
    --card-border: #2D3440;
    --text-primary: #FFFFFF;
    --text-secondary: #8C95A6;
    --text-muted: #5A6375;
    
    /* Cores de status */
    --success-color: #4CAF50;
    --danger-color: #F44336;
    --warning-color: #FF9800;
    --info-color: #2196F3;
    
    /* Elementos UI */
    --border-radius: 4px;
    --shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    --transition: all 0.2s ease;
    
    /* Cores de sintaxe para editor (exemplo) */
    --syntax-keyword: #FF6C37;
    --syntax-string: #4CAF50;
    --syntax-comment: #5A6375;
    --syntax-function: #2196F3;
    --syntax-number: #FF9800;
    --syntax-operator: #FF6C37;
}

/* Estilos para scrollbars */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--card-bg);
}

::-webkit-scrollbar-thumb {
    background: var(--text-muted);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--text-secondary);
}

/* Seleção de texto */
::selection {
    background: rgba(255, 108, 55, 0.3);
    color: inherit;
}

/* Placeholders */
::placeholder {
    color: var(--text-muted);
    opacity: 1;
}

/* Focus styles */
:focus {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

:focus:not(:focus-visible) {
    outline: none;
}

/* Estilos para inputs e botões */
input, button, textarea, select {
    font-family: inherit;
    font-size: inherit;
}

button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Utility classes */
.text-primary { color: var(--text-primary); }
.text-secondary { color: var(--text-secondary); }
.text-muted { color: var(--text-muted); }
.text-success { color: var(--success-color); }
.text-danger { color: var(--danger-color); }
.text-warning { color: var(--warning-color); }
.text-info { color: var(--info-color); }

.bg-primary { background: var(--primary-color); }
.bg-dark { background: var(--main-bg); }
.bg-card { background: var(--card-bg); }
.bg-sidebar { background: var(--sidebar-bg); }

/* Animações */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes slideInLeft {
    from { transform: translateX(-20px); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

@keyframes slideInRight {
    from { transform: translateX(20px); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

.fade-in { animation: fadeIn 0.3s ease; }
.slide-in-left { animation: slideInLeft 0.3s ease; }
.slide-in-right { animation: slideInRight 0.3s ease; }

/* Loading spinner */
.spinner {
    width: 24px;
    height: 24px;
    border: 3px solid var(--text-muted);
    border-top-color: var(--primary-color);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}