/* System Global CSS — auto-generated */
/* Editable in: System Administration → CSS (system.css) */

:root {
    --primary-color:            #0067b5;
    --primary-dark:             #005494;
    --primary-light:            #3385c6;
    --secondary-color:          #6c757d;
    --success-color:            #28a745;
    --danger-color:             #dc3545;
    --warning-color:            #ffc107;
    --info-color:               #17a2b8;
    --light-bg:                 #f8f9fa;
    --dark-text:                #212529;
    --topbar-height:            54px;
    --sidebar-width:            225px;
    --sidebar-collapsed-width:  63px;
    --dm-bg:          #1a1a1a;
    --dm-surface:     #2d2d2d;
    --dm-elevated:    #404040;
    --dm-border:      #505050;
    --dm-text:        #e0e0e0;
    --dm-text-muted:  #e0e0e0;
}

/* Tokens de cor — reutilizáveis (Status, Prioridade, etc.) */
:root {
    --ct-primary: var(--primary-color);
    --ct-secondary: var(--secondary-color);
    --ct-success: var(--success-color);
    --ct-danger: var(--danger-color);
    --ct-warning: var(--warning-color);
    --ct-info: var(--info-color);
    --ct-orange: #fd7e14;
}
body.dark-mode {
    --ct-orange: #ff922b;
}
.ct-text-primary { color: var(--ct-primary); } .ct-bg-primary { background-color: var(--ct-primary); } .ct-badge-primary { background-color: var(--ct-primary); color: #fff; padding: 1px 8px; border-radius: 12px; font-size: 0.78em; }
.ct-text-secondary { color: var(--ct-secondary); } .ct-bg-secondary { background-color: var(--ct-secondary); } .ct-badge-secondary { background-color: var(--ct-secondary); color: #fff; padding: 1px 8px; border-radius: 12px; font-size: 0.78em; }
.ct-text-success { color: var(--ct-success); } .ct-bg-success { background-color: var(--ct-success); } .ct-badge-success { background-color: var(--ct-success); color: #fff; padding: 1px 8px; border-radius: 12px; font-size: 0.78em; }
.ct-text-danger { color: var(--ct-danger); } .ct-bg-danger { background-color: var(--ct-danger); } .ct-badge-danger { background-color: var(--ct-danger); color: #fff; padding: 1px 8px; border-radius: 12px; font-size: 0.78em; }
.ct-text-warning { color: var(--ct-warning); } .ct-bg-warning { background-color: var(--ct-warning); } .ct-badge-warning { background-color: var(--ct-warning); color: #fff; padding: 1px 8px; border-radius: 12px; font-size: 0.78em; }
.ct-text-info { color: var(--ct-info); } .ct-bg-info { background-color: var(--ct-info); } .ct-badge-info { background-color: var(--ct-info); color: #fff; padding: 1px 8px; border-radius: 12px; font-size: 0.78em; }
.ct-text-orange { color: var(--ct-orange); } .ct-bg-orange { background-color: var(--ct-orange); } .ct-badge-orange { background-color: var(--ct-orange); color: #fff; padding: 1px 8px; border-radius: 12px; font-size: 0.78em; }

/* Modo Escuro — cores configuráveis sobrepostas ao main.css */
body.dark-mode { background-color: var(--dm-bg); color: var(--dm-text); }
body.dark-mode .topbar { background-color: var(--dm-surface); border-bottom-color: var(--dm-elevated); }
body.dark-mode .topbar-title { color: var(--dm-text); }
body.dark-mode .user-menu-button { color: var(--dm-text); }
body.dark-mode .user-menu-button:hover { background-color: var(--dm-elevated); }
body.dark-mode .user-menu-dropdown { background-color: var(--dm-surface); border: 1px solid var(--dm-elevated); }
body.dark-mode .user-menu-dropdown a { color: var(--dm-text); }
body.dark-mode .user-menu-dropdown a:hover { background-color: var(--dm-elevated); }
body.dark-mode .sidebar { background-color: var(--dm-surface); }
body.dark-mode .sidebar-menu-link { color: var(--dm-text); }
body.dark-mode .sidebar-menu-link:hover { background-color: var(--dm-elevated); }
body.dark-mode .sidebar-submenu-link { color: var(--dm-text-muted); }
body.dark-mode .sidebar-submenu-link:hover { background-color: var(--dm-elevated); color: var(--dm-text); }
body.dark-mode .sidebar-submenu-link.active { color: var(--dm-text); }
body.dark-mode .main-content { background-color: var(--dm-bg); }
body.dark-mode .page-header-sticky { background-color: var(--dm-surface); border-bottom-color: var(--dm-elevated); }
body.dark-mode .filter-bar { background-color: var(--dm-surface); }
body.dark-mode .content-area { background-color: var(--dm-bg); }
body.dark-mode .page-header { background-color: var(--dm-surface); }
body.dark-mode .page-title { color: var(--dm-text); }
body.dark-mode .page-subtitle { color: var(--dm-text-muted); }
body.dark-mode .card { background-color: var(--dm-surface); border-color: var(--dm-elevated); color: var(--dm-text); }
body.dark-mode .card-body, body.dark-mode .card-header, body.dark-mode .card-footer { color: var(--dm-text); }
body.dark-mode .dashboard-card { background-color: var(--dm-surface); color: var(--dm-text); }
body.dark-mode .dashboard-card-header, body.dark-mode .kanban-card-header { background-color: var(--dm-elevated); color: var(--dm-text); }
body.dark-mode .table { --bs-table-color: var(--dm-text); --bs-table-bg: var(--dm-surface); --bs-table-border-color: var(--dm-elevated); --bs-table-hover-bg: var(--dm-elevated); color: var(--dm-text); background-color: var(--dm-surface); }
body.dark-mode .table > :not(caption) > * > * { color: var(--dm-text); background-color: var(--dm-surface); border-color: var(--dm-elevated); }
body.dark-mode .table thead th, body.dark-mode .table-responsive thead th { background-color: var(--dm-elevated); color: var(--dm-text); border-color: var(--dm-border); }
body.dark-mode .table tbody td { color: var(--dm-text); background-color: var(--dm-surface); border-color: var(--dm-elevated); }
body.dark-mode .table-hover tbody tr:hover > * { background-color: var(--dm-elevated); color: var(--dm-text); }
body.dark-mode .table-responsive thead { background-color: var(--dm-surface); }
body.dark-mode .form-control, body.dark-mode .form-select { background-color: var(--dm-elevated); color: var(--dm-text); border-color: var(--dm-border); }
body.dark-mode .form-control:focus, body.dark-mode .form-select:focus { background-color: var(--dm-elevated); border-color: var(--primary-color); color: var(--dm-text); box-shadow: none; }
body.dark-mode .form-control::placeholder { color: var(--dm-text-muted); }
body.dark-mode label, body.dark-mode .form-label { color: var(--dm-text); }
body.dark-mode .input-group-text { background-color: var(--dm-elevated); color: var(--dm-text); border-color: var(--dm-border); }
body.dark-mode .btn-secondary { background-color: var(--dm-border); border-color: var(--dm-border); color: var(--dm-text); }
body.dark-mode .btn-outline-secondary { border-color: var(--dm-border); color: var(--dm-text); }
body.dark-mode .btn-outline-secondary:hover { background-color: var(--dm-elevated); color: var(--dm-text); }
body.dark-mode .text-muted { color: var(--dm-text-muted) !important; }
body.dark-mode small, body.dark-mode .small { color: var(--dm-text-muted); }
body.dark-mode strong, body.dark-mode b { color: var(--dm-text); }
body.dark-mode a:not(.btn):not(.sidebar-menu-link):not(.sidebar-submenu-link) { color: var(--primary-light); }
body.dark-mode .badge.bg-secondary { background-color: var(--dm-border) !important; }
body.dark-mode .alert { border-color: var(--dm-elevated); }

/* Mensagens persistentes (.alert-*) — configuráveis no submenu CSS */
.alert-info { background-color: #d1ecf1; border-left: 3.6px solid #17a2b8; color: #0c5460; }
.alert-success { background-color: #d4edda; border-left: 3.6px solid #28a745; color: #155724; }
.alert-danger, .alert-error { background-color: #f8d7da; border-left: 3.6px solid #dc3545; color: #721c24; }
.alert-warning { background-color: #fff3cd; border-left: 3.6px solid #ffc107; color: #856404; }
body.dark-mode .alert-info { background-color: #0d2d35; border-left-color: #17a2b8; color: #7dd6e8; }
body.dark-mode .alert-success { background-color: #0d2d1a; border-left-color: #28a745; color: #75d88a; }
body.dark-mode .alert-danger, body.dark-mode .alert-error { background-color: #2d0d0d; border-left-color: #dc3545; color: #f5a8b0; }
body.dark-mode .alert-warning { background-color: #2d2200; border-left-color: #ffc107; color: #ffd966; }

body {
    background-color: #f0f2f5;
    font-size: 12.6px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.topbar-title {
    font-size: 18px;
}

.login-container {
    background: linear-gradient(135deg, #00B2FF 0%, #ffffff 100%) !important;
}
