﻿@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root {
    --primary: #73179E;     /* Roxo profundo    (hsl ~281 75% 35%) */
    --secondary: #04618B;   /* Azul tecnológico (hsl ~199 94% 28%) */
    --accent: #7877DF;      /* Azul violeta     (hsl ~241 61% 67%) */
    --bg-color: #0d1f2d;             /* mock-main — fundo escuro do mockup */

    --surface-sidebar: #0a1929;      /* mock-sidebar */
    --surface-card: rgba(255, 255, 255, 0.04);
    --border-subtle: rgba(255, 255, 255, 0.08);

    --bs-primary: var(--primary);
    --bs-secondary: var(--secondary);
    --bs-box-shadow: 0 0 0 0.25rem hsl(from var(--accent) h s 67% / 0.3);
    --bs-link-color: var(--accent);
}

/* Dark mode: paleta do mockup synobr sobre o tema escuro do Bootstrap */
[data-bs-theme="dark"] {
    --bs-body-bg: #0d1f2d;
    --bs-body-color: rgba(255, 255, 255, 0.9);
    --bs-secondary-color: rgba(255, 255, 255, 0.5);
    --bs-tertiary-color: rgba(255, 255, 255, 0.4);
    --bs-emphasis-color: #ffffff;
    --bs-emphasis-color-rgb: 255, 255, 255;

    /* No escuro o acento violeta tem melhor contraste que o roxo da marca */
    --bs-primary: var(--accent);
    --bs-primary-rgb: 120, 119, 223;
    --bs-link-color: #9b9aea;
    --bs-link-color-rgb: 155, 154, 234;
    --bs-link-hover-color: #b8b7f1;
    --bs-link-hover-color-rgb: 184, 183, 241;

    --bs-secondary-bg: #0a1929;
    --bs-secondary-bg-rgb: 10, 25, 41;
    --bs-tertiary-bg: #0a1929;
    --bs-tertiary-bg-rgb: 10, 25, 41;
    --bs-border-color: rgba(255, 255, 255, 0.1);
    --bs-border-color-translucent: rgba(255, 255, 255, 0.1);

    /* Tons "subtle" do acento violeta */
    --bs-primary-bg-subtle: rgba(120, 119, 223, 0.15);
    --bs-primary-border-subtle: rgba(120, 119, 223, 0.3);
    --bs-primary-text-emphasis: #c4c3f5;
}

/* Cards translúcidos como no mockup.
   O .card do Bootstrap redefine --bs-card-bg localmente, então é preciso
   sobrescrever no próprio seletor .card (especificidade maior). */
[data-bs-theme="dark"] .card {
    --bs-card-bg: var(--surface-card);
    --bs-card-border-color: var(--border-subtle);
}

/* Superfície escura da sidebar (desktop + offcanvas) */
.bg-sidebar {
    background-color: var(--surface-sidebar) !important;
}

/* Utilitários claros do Bootstrap reaproveitados no tema escuro
   (a sidebar usa um seletor mais específico em admin.css e continua navy) */
[data-bs-theme="dark"] .bg-white,
[data-bs-theme="dark"] .bg-light {
    background-color: var(--surface-card) !important;
}

[data-bs-theme="dark"] .btn-light {
    --bs-btn-bg: rgba(255, 255, 255, 0.08);
    --bs-btn-border-color: rgba(255, 255, 255, 0.14);
    --bs-btn-color: rgba(255, 255, 255, 0.85);
    --bs-btn-hover-bg: rgba(255, 255, 255, 0.16);
    --bs-btn-hover-border-color: rgba(255, 255, 255, 0.22);
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: rgba(255, 255, 255, 0.2);
    --bs-btn-active-border-color: rgba(255, 255, 255, 0.26);
    --bs-btn-active-color: #fff;
}

body {
    font-family: "Inter", sans-serif;
    overflow-x: clip;
}

.bg-primary {
    background-color: var(--bs-primary) !important;
}

/* Botões */
.btn {
    --bs-btn-border-radius: .55rem;
    transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease, border-color .12s ease;
}

.btn-primary, .btn-secondary {
    box-shadow: 0 4px 12px -6px hsl(from var(--bs-primary) h s 40% / .5);
}

.btn-primary:hover, .btn-secondary:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px -6px hsl(from var(--bs-primary) h s 40% / .55);
}

.btn-primary:active, .btn-secondary:active {
    transform: translateY(0);
}

.btn-primary {
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-bg: hsl(from var(--bs-primary) h s 45%);
    --bs-btn-hover-border-color: hsl(from var(--bs-primary) h s 45%);
    --bs-btn-active-bg: hsl(from var(--bs-primary) h s 40%);
    --bs-btn-active-border-color: hsl(from var(--bs-primary) h s 40%);
}

.btn-primary:disabled,
.btn-primary.disabled {
    color: #ffffffcc;
    background-color: hsl(from var(--bs-primary) h s 80%);
    border-color: hsl(from var(--bs-primary) h s 80%);
    opacity: 1;
}

.btn-outline-primary {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
}

.btn-outline-primary:disabled,
.btn-outline-primary.disabled {
    color: hsl(from var(--bs-primary) h s 70%);
    border-color: hsl(from var(--bs-primary) h s 70%);
}

.btn-secondary {
    --bs-btn-bg: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary);
    --bs-btn-hover-bg: hsl(from var(--bs-secondary) h s 45%);
    --bs-btn-hover-border-color: hsl(from var(--bs-secondary) h s 45%);
    --bs-btn-active-bg: hsl(from var(--bs-secondary) h s 40%);
    --bs-btn-active-border-color: hsl(from var(--bs-secondary) h s 40%);
}

/* Inputs */
.form-control,
.form-select {
    border-radius: .5rem;
}

.form-control:focus,
.form-select:focus,
.input-group .form-control:focus {
    border-color: var(--bs-primary);
    box-shadow: var(--bs-box-shadow);
}

.form-check-input:checked {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

.form-check-input:focus {
    border-color: hsl(from var(--bs-primary) h s 80%);
    outline: 0;
    box-shadow: var(--bs-box-shadow);
}

ul[uib-typeahead-popup].dropdown-menu {
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
}

.dropdown-menu > .uib-typeahead-match.active {
    background-color: rgba(120, 119, 223, 0.18) !important;
}

.dropdown-item.active,
.dropdown-item:hover {
    background-color: rgba(120, 119, 223, 0.18) !important;
    color: #ffffff !important;
}

/* COR DE FUNDO */
.bg-green-30{
 background-color: rgba(120, 119, 223, 0.06);
}

.bg-green-80{
 background-color: rgba(120, 119, 223, 0.12);
}

.bg-section-soft {
    background-color: rgba(255, 255, 255, 0.03);
}

/* TEXTO */
.text-xs {
    font-size: .75rem;
}
.text-sm {
    font-size: .875rem;
    line-height: 1.25rem;
}
.text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
}

.text-primary {
    color: var(--bs-primary) !important;
}

.text-blue {
    color: #6ea8e0;
}

/* BORDAS */
.table-light {
    --bs-table-border-color: var(--border-subtle);
}
[data-bs-theme="dark"] .table-light {
    --bs-table-color: rgba(255, 255, 255, 0.9);
    --bs-table-bg: rgba(255, 255, 255, 0.05);
    --bs-table-border-color: var(--border-subtle);
}
.border-accent-50{
    border-color: rgba(120, 119, 223, 0.5) !important;
}
.border-dashed {
    border: 2px dashed var(--border-subtle);
}

/* Paginação */
.page-item.active .page-link {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
    color:white !important;
}

.page-link:hover{
    color:var(--bs-pagination-color);
}

.pagination {
    --bs-pagination-focus-box-shadow: var(--bs-box-shadow);
    --bs-pagination-active-bg: var(--bs-primary) !important;
    --bs-pagination-active-border-color: var(--bs-primary) !important;
}

/* UTILITÁRIOS */
.cursor-pointer {
    cursor: pointer;
}

/* ESPECÍFICOS */
.modal-backdrop {
    z-index: 1040 !important;
}

@media (max-width: 768px) {
    .table-fixed {
        table-layout: inherit;
        width: auto;
    }
    .table-responsive-mobile th, .table-responsive-mobile td {
        min-width: 80vw !important;
    }
}