/*
 * Layout moderno do CRM (RS Works TI).
 * Carregado depois do CSS do RISE: só ajusta aparência (tipografia, cantos, sombras, espaçamento),
 * sem mudar a estrutura das telas. As cores de destaque do menu/botões ficam no tema assets/css/color/0c1b54.css.
 */
@import url("https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;500;600;700&display=swap");

:root {
    --rs-navy: #0c1b54;
    --rs-navy-dark: #010c39;
    --rs-navy-soft: #1a2d78;
    --rs-accent: #f36716;
    --rs-accent-soft: #fff1e8;
    --rs-bg: #f3f5fa;
    --rs-surface: #ffffff;
    --rs-border: #e5e8f0;
    --rs-text: #1f2a44;
    --rs-muted: #6b7590;
    --rs-radius: 12px;
    --rs-radius-sm: 8px;
    --rs-shadow: 0 1px 2px rgba(16, 24, 64, 0.04), 0 4px 16px rgba(16, 24, 64, 0.06);
    --rs-shadow-lg: 0 12px 40px rgba(16, 24, 64, 0.16);
    --rs-focus: 0 0 0 3px rgba(243, 103, 22, 0.18);
}

/* ---------- base ---------- */
body {
    font-family: "Work Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    background-color: var(--rs-bg);
    color: var(--rs-text);
    -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 {
    font-family: inherit;
    color: var(--rs-text);
    font-weight: 600;
    letter-spacing: -0.01em;
}
.text-off, .text-muted {
    color: var(--rs-muted) !important;
}
::selection {
    background: var(--rs-accent);
    color: #fff;
}
* {
    scrollbar-width: thin;
    scrollbar-color: #c3c9d8 transparent;
}
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #c3c9d8; border-radius: 8px; }
::-webkit-scrollbar-track { background: transparent; }

/* ---------- barra superior ---------- */
.navbar-default {
    background-color: rgba(255, 255, 255, 0.96);
    box-shadow: none;
    border-bottom: 1px solid var(--rs-border);
    -webkit-backdrop-filter: saturate(180%) blur(8px);
    backdrop-filter: saturate(180%) blur(8px);
}
.navbar-default .navbar-nav > li > a,
#sidebar-toggle-md {
    color: var(--rs-muted);
    transition: color 150ms ease;
}
.navbar-default .navbar-nav > li > a:hover,
#sidebar-toggle-md:hover {
    color: var(--rs-navy);
}
.navbar-nav > .open > a,
.navbar-nav > .open > a:hover,
.navbar-nav > .open > a:focus,
.navbar-toggle:hover,
.navbar-toggle:focus {
    background-color: #eef1f8 !important;
}
.navbar-default .b-l,
.navbar .b-l {
    border-left-color: var(--rs-border);
}
.navbar .dashboard-image {
    max-height: 40px;
}
.navbar .badge,
#sidebar-menu .badge {
    background-color: var(--rs-accent);
    font-weight: 600;
}

/* ---------- menu lateral ---------- */
#sidebar {
    font-size: 13px;
    box-shadow: 1px 0 0 rgba(1, 12, 57, 0.4);
}
#sidebar-menu {
    padding-top: 10px;
}
#sidebar-menu > li > a {
    margin: 2px 8px;
    padding: 9px 12px 10px;
    border-radius: var(--rs-radius-sm);
    border-left: 0 !important;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#sidebar #sidebar-menu > li.active > a {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    box-shadow: inset 3px 0 0 var(--rs-accent);
}
#sidebar #sidebar-menu li > a:hover {
    background: rgba(255, 255, 255, 0.07);
    color: #fff;
}
#sidebar-menu > li > a i {
    width: 18px;
    text-align: center;
    opacity: 0.9;
}
#sidebar-menu li ul {
    margin: 0 10px;
    border-radius: var(--rs-radius-sm);
}
#sidebar-menu li ul > li > a {
    padding: 8px 14px 8px 24px;
    font-size: 13px;
}
#sidebar-menu > li > ul > .active > a {
    border-left: 0;
    color: #fff;
    box-shadow: inset 3px 0 0 var(--rs-accent);
}
#sidebar-menu li:hover {
    background: transparent !important;
}
#sidebar.collapsed #sidebar-menu > li > a {
    margin: 2px 8px;
    padding-left: 14px;
    padding-right: 14px;
}

/* ---------- área de conteúdo ---------- */
#page-content {
    padding: 24px !important;
}
.page-title {
    background: var(--rs-surface);
    border-bottom: 1px solid var(--rs-border);
    color: var(--rs-text);
}
.page-title h1 {
    font-size: 19px;
    font-weight: 600;
}
.page-title h4 {
    font-weight: 600;
}

/* ---------- painéis / cards ---------- */
.panel {
    border-radius: var(--rs-radius);
    border: 1px solid var(--rs-border);
    box-shadow: var(--rs-shadow);
    transition: box-shadow 200ms ease, transform 200ms ease;
}
.panel.dropdown-details {
    border: 0;
}
/* blocos de números do painel que não usam .panel */
div.bg-white:has(> .box > .widget-container) {
    border-radius: var(--rs-radius);
    border: 1px solid var(--rs-border);
    box-shadow: var(--rs-shadow);
    overflow: hidden;
}
.widget-container.b-r,
.widget-container .b-t {
    border-color: var(--rs-border) !important;
}
.panel > .page-title,
.panel > .panel-heading:first-child {
    border-top-left-radius: var(--rs-radius);
    border-top-right-radius: var(--rs-radius);
}
.panel-heading {
    border-radius: 0;
}
.panel-default > .panel-heading {
    background-color: var(--rs-surface);
    border-bottom: 1px solid var(--rs-border);
    font-weight: 600;
    padding: 14px 18px;
}
.panel-default > .panel-heading i {
    color: var(--rs-muted);
}
.panel-footer {
    background-color: #f8f9fc;
    border-top: 1px solid var(--rs-border);
    border-bottom-left-radius: var(--rs-radius);
    border-bottom-right-radius: var(--rs-radius);
}

/* cards coloridos do painel (widgets) */
.panel-info,
.panel-sky,
.panel-success,
.panel-primary,
.panel-coral {
    border: 0;
    color: #fff;
    overflow: hidden;
    position: relative;
}
.panel-info    { background: linear-gradient(135deg, #1a2d78 0%, #0c1b54 100%); }
.panel-sky     { background: linear-gradient(135deg, #2b6de0 0%, #1a4fb8 100%); }
.panel-success { background: linear-gradient(135deg, #14a37f 0%, #0d7d62 100%); }
.panel-primary { background: linear-gradient(135deg, #3a4a8c 0%, #26336b 100%); }
.panel-coral   { background: linear-gradient(135deg, #f58a3d 0%, #f36716 100%); }
.panel-info .btn,
.panel-coral .btn {
    color: var(--rs-navy);
    border-radius: var(--rs-radius-sm);
    font-weight: 500;
}
.panel-info:hover,
.panel-sky:hover,
.panel-success:hover,
.panel-primary:hover,
.panel-coral:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(12, 27, 84, 0.18);
}
.panel-info h1, .panel-info h2, .panel-info h3, .panel-info h4,
.panel-sky h1, .panel-sky h2, .panel-sky h3, .panel-sky h4,
.panel-success h1, .panel-success h2, .panel-success h3, .panel-success h4,
.panel-primary h1, .panel-primary h2, .panel-primary h3, .panel-primary h4,
.panel-coral h1, .panel-coral h2, .panel-coral h3, .panel-coral h4 {
    color: #fff;
}
.widget-icon {
    opacity: 0.28;
}
.widget-details h1 {
    font-weight: 700;
}

/* cores de apoio do RISE alinhadas à paleta da marca */
.bg-off-white {
    background: var(--rs-bg);
}
.bg-info {
    background: linear-gradient(135deg, #1a2d78 0%, #0c1b54 100%) !important;
    color: #dfe5ff;
}
.btn-info {
    background-color: var(--rs-navy-soft);
    border-color: var(--rs-navy-soft);
    color: #fff;
}
.btn-info:hover,
.btn-info:focus,
.btn-info:active {
    background-color: var(--rs-navy);
    border-color: var(--rs-navy);
    color: #fff;
}
.btn-success {
    background-color: #14a37f;
    border-color: #14a37f;
}
.btn-success:hover,
.btn-success:focus {
    background-color: #0d7d62;
    border-color: #0d7d62;
}
.progress {
    border-radius: 999px;
    box-shadow: none;
    background-color: #e9ecf4;
}
.progress-bar {
    box-shadow: none;
}
.progress-bar:not([class*="progress-bar-"]) {
    background-color: var(--rs-accent);
}

/* ---------- tabelas ---------- */
.table > thead > tr > th,
table.dataTable thead th {
    background: #f8f9fc;
    color: var(--rs-muted);
    font-size: 11.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid var(--rs-border) !important;
}
.table > tbody > tr > td,
table.dataTable tbody td {
    border-top-color: #eef0f6;
    vertical-align: middle;
}
table.dataTable tbody tr:hover > td,
.table-hover > tbody > tr:hover > td {
    background-color: #f6f8fd;
}
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    border-radius: var(--rs-radius-sm);
}

/* ---------- formulários ---------- */
.form-control,
.select2-container .select2-choice,
.select2-container-multi .select2-choices {
    border-radius: var(--rs-radius-sm) !important;
    border-color: var(--rs-border);
    box-shadow: none;
    transition: border-color 150ms ease, box-shadow 150ms ease;
}
.form-control:focus,
.select2-container-active .select2-choice,
.select2-container-active .select2-choices {
    border-color: var(--rs-accent) !important;
    box-shadow: var(--rs-focus) !important;
}
.input-group-addon {
    border-color: var(--rs-border);
    background: #f8f9fc;
}
.input-group .form-control:not(:first-child),
.input-group .form-control:not(:last-child) {
    border-radius: var(--rs-radius-sm);
}
label {
    font-weight: 500;
}

/* ---------- botões ---------- */
.btn {
    border-radius: var(--rs-radius-sm);
    font-weight: 500;
    transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, box-shadow 150ms ease;
}
.btn:focus-visible {
    box-shadow: var(--rs-focus);
}
.btn-default {
    border-color: var(--rs-border);
    color: var(--rs-text);
}
.btn-default:hover {
    background-color: #f3f5fa;
    border-color: #d3d8e6;
}
.btn-group > .btn:not(:first-child):not(:last-child) {
    border-radius: 0;
}

/* ---------- abas ---------- */
.nav-tabs {
    border-bottom: 1px solid var(--rs-border);
}
.nav-tabs > li > a {
    font-weight: 500;
    color: var(--rs-muted);
}

/* ---------- menus suspensos, modais, popovers ---------- */
.dropdown-menu {
    border: 1px solid var(--rs-border);
    border-radius: var(--rs-radius);
    box-shadow: var(--rs-shadow-lg);
    padding: 6px;
}
.dropdown-menu > li > a {
    border-radius: 6px;
    padding: 7px 12px;
}
.dropdown-menu > li > a:hover {
    background-color: #f3f5fa;
}
.modal-content {
    border: 0;
    border-radius: 14px;
    box-shadow: var(--rs-shadow-lg);
    overflow: hidden;
}
.modal-header {
    border-bottom: 1px solid var(--rs-border);
    padding: 16px 20px;
}
.modal-title {
    font-weight: 600;
}
.modal-footer {
    border-top: 1px solid var(--rs-border);
    background: #f8f9fc;
}
.modal-backdrop.in {
    opacity: 0.45;
}
.popover,
.tooltip-inner {
    border-radius: var(--rs-radius-sm);
}

/* ---------- selos e rótulos ---------- */
.label,
.badge {
    border-radius: 999px;
    font-weight: 600;
    padding: 3px 9px;
}
.alert {
    border-radius: var(--rs-radius-sm);
}

/* ---------- tela de login ---------- */
body:has(.signin-box) {
    min-height: 100vh;
    background: radial-gradient(1200px 600px at 10% -10%, rgba(243, 103, 22, 0.18), transparent 60%),
                linear-gradient(160deg, var(--rs-navy) 0%, var(--rs-navy-dark) 100%);
    background-attachment: fixed;
}
.signin-box {
    max-width: 420px;
    margin: 8vh auto;
    padding: 0 16px;
}
.signin-box .panel {
    border: 0;
    border-radius: 16px;
    box-shadow: 0 24px 60px rgba(1, 12, 57, 0.45);
}
.signin-box .panel-heading {
    background: transparent !important;
    border-bottom: 0 !important;
    padding-top: 28px;
}
.signin-box .panel-heading img {
    max-width: 220px;
    padding: 0 !important;
}
.signin-box .panel-body {
    padding: 8px 32px 32px !important;
}
.signin-box .form-control {
    padding: 12px 14px !important;
    font-size: 14px;
}
.signin-box .btn-primary {
    width: 100%;
    padding: 11px;
    font-size: 15px;
    font-weight: 600;
    background: var(--rs-accent);
    border-color: var(--rs-accent);
}
.signin-box .btn-primary:hover,
.signin-box .btn-primary:focus {
    background: #d95a10;
    border-color: #d95a10;
}
.signin-box a {
    color: #fff;
}
body:has(.signin-box) .footer {
    background: transparent;
    color: rgba(255, 255, 255, 0.6);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}
body:has(.signin-box) .footer a {
    color: rgba(255, 255, 255, 0.85);
}
body:has(.signin-box) .footer a:hover {
    color: var(--rs-accent);
}
.signin-box .panel a {
    color: var(--rs-navy-soft);
}

/* ---------- celular ---------- */
@media (max-width: 767px) {
    #page-content {
        padding: 12px !important;
    }
    .signin-box {
        margin: 4vh auto;
    }
}