/* style.css - Personalização do Sistema de Finanças */

/* 1. Paleta de Cores */
:root {
    --main-bg: #f8f9fa;
    --main-primary: #3070f0;
    --main-success: #28a745;
    --main-danger:  #dc3545;
    --main-warning: #fd7e14;
    --main-info:    #17a2b8;
}

/* 2. Corpo e Navegação */
body {
    background: var(--main-bg);
    font-family: 'Segoe UI', 'Arial', sans-serif;
    font-size: 1rem;
}
.navbar {
    box-shadow: 0 2px 6px rgba(0,0,0,0.03);
}
.navbar-brand {
    letter-spacing: 1px;
}
.nav-link.active,
.nav-link:focus,
.nav-link:hover {
    background: #f0f4fd;
    color: var(--main-primary) !important;
    border-radius: .4rem;
}

/* 3. Cartões e Cards */
.card {
    border-radius: 0.6rem;
    transition: box-shadow 0.2s;
}
.card:hover {
    box-shadow: 0 6px 18px rgba(0,0,0,0.07);
}
.card-header {
    font-size: 1.1rem;
    font-weight: 600;
    background: #f5f7fb;
    border-bottom: 1px solid #e2e9f3;
}
/*.card-body {
    background: white;
}*/

.table tr.table-warning {
    background: #fff6e1;
}

.table th,
.table td {
    vertical-align: middle;
}

.alert i {
    margin-right: .5em;
    font-size: 1.2em;
}

/* 4. Botões */
.btn {
    border-radius: .45rem;
}

.btn-success, .bg-success {
    background: var(--main-success)!important;
    border-color: var(--main-success)!important;
}

.btn-danger, .bg-danger {
    background: var(--main-danger)!important;
    border-color: var(--main-danger)!important;
}

.btn-primary, .bg-primary {
    background: var(--main-primary)!important;
    border-color: var(--main-primary)!important;
}

/* 5. Responsivo */
@media (max-width: 700px) {
    .card-body .row.g-3 > [class^="col-"] {
        margin-bottom: 1rem;
    }
}

/* 6. Inputs e Formulários */
input:focus, select:focus, textarea:focus {
    border-color: var(--main-primary)!important;
    box-shadow: 0 0 0 0.08rem var(--main-primary)!important;
}
.form-label {
    font-weight: 500;
}

/* 7. Customizações Extras */
::-webkit-scrollbar {
    width: 7px;
    background: #eaeaea;
}
::-webkit-scrollbar-thumb {
    background: var(--main-primary);
    border-radius: 10px;
}

.text-success { color: var(--main-success)!important; }
.text-danger  { color: var(--main-danger)!important; }
.text-info    { color: var(--main-info)!important; }
.text-warning { color: var(--main-warning)!important; }
.text-primary { color: var(--main-primary)!important; }
.text-dark    { color: #333!important; }
