/* main.css */

/* Theme: graphite and blue ... */
:root {
    --bs-body-bg: #F4F6F8;
    --bs-body-bg-rgb: 244, 246, 248;
    --bs-body-color: #1E2A33;
    --bs-body-color-rgb: 30, 42, 51;
    --bs-border-color: #DDE3E8;
    --bs-primary: #245B78;
    --bs-primary-rgb: 36, 91, 120;
    --bs-secondary-color: #5F6F7A;
    --bs-secondary-rgb: 95, 111, 122;
    --bs-success: #2E7D4F;
    --bs-success-rgb: 46, 125, 79;
    --bs-danger: #C0392B;
    --bs-danger-rgb: 192, 57, 43;
    --bs-warning: #C98F00;
    --bs-warning-rgb: 201, 143, 0;
    --bs-dark: #1F3A4A;
    --bs-dark-rgb: 31, 58, 74;
    --bs-link-color: #245B78;
    --bs-link-color-rgb: 36, 91, 120;
    --bs-link-hover-color: #1A4258;
    --bs-link-hover-color-rgb: 26, 66, 88;
    --bs-focus-ring-color: rgba(36, 91, 120, 0.25);
}

.btn-primary {
    --bs-btn-bg: #245B78;
    --bs-btn-border-color: #245B78;
    --bs-btn-hover-bg: #1E4C65;
    --bs-btn-hover-border-color: #1A4258;
    --bs-btn-active-bg: #1A4258;
    --bs-btn-active-border-color: #163849;
    --bs-btn-disabled-bg: #245B78;
    --bs-btn-disabled-border-color: #245B78;
    --bs-btn-focus-shadow-rgb: 36, 91, 120;
}

.btn-outline-primary {
    --bs-btn-color: #245B78;
    --bs-btn-border-color: #245B78;
    --bs-btn-hover-bg: #245B78;
    --bs-btn-hover-border-color: #245B78;
    --bs-btn-active-bg: #1E4C65;
    --bs-btn-active-border-color: #1E4C65;
    --bs-btn-disabled-color: #245B78;
    --bs-btn-disabled-border-color: #245B78;
    --bs-btn-focus-shadow-rgb: 36, 91, 120;
}

.btn-outline-dark {
    --bs-btn-color: #1F3A4A;
    --bs-btn-border-color: #1F3A4A;
    --bs-btn-hover-bg: #1F3A4A;
    --bs-btn-hover-border-color: #1F3A4A;
    --bs-btn-active-bg: #1F3A4A;
    --bs-btn-active-border-color: #1F3A4A;
    --bs-btn-disabled-color: #1F3A4A;
    --bs-btn-disabled-border-color: #1F3A4A;
    --bs-btn-focus-shadow-rgb: 31, 58, 74;
}

.btn-success {
    --bs-btn-bg: #2E7D4F;
    --bs-btn-border-color: #2E7D4F;
    --bs-btn-hover-bg: #276B44;
    --bs-btn-hover-border-color: #246240;
    --bs-btn-active-bg: #246240;
    --bs-btn-active-border-color: #205838;
}

.btn-danger {
    --bs-btn-bg: #C0392B;
    --bs-btn-border-color: #C0392B;
    --bs-btn-hover-bg: #A93226;
    --bs-btn-hover-border-color: #9D2F24;
    --bs-btn-active-bg: #9D2F24;
    --bs-btn-active-border-color: #912B21;
}

.btn-outline-danger {
    --bs-btn-color: #C0392B;
    --bs-btn-border-color: #C0392B;
    --bs-btn-hover-bg: #C0392B;
    --bs-btn-hover-border-color: #C0392B;
    --bs-btn-active-bg: #A93226;
    --bs-btn-active-border-color: #A93226;
}

.table-dark {
    --bs-table-bg: #1F3A4A;
    --bs-table-border-color: #2E4E61;
    --bs-table-striped-bg: #274759;
    --bs-table-hover-bg: #274759;
}

.dropdown-menu {
    --bs-dropdown-link-active-bg: #245B78;
}

/* Fields are white; the theme's page background (--bs-body-bg) made them
   grey on the white cards. Disabled and read-only fields stay grey ... */
.form-control,
.form-select,
.select2-container--bootstrap-5 .select2-selection {
    background-color: #FFFFFF;
}

.form-control:disabled,
.form-control[readonly],
.form-select:disabled {
    background-color: var(--bs-secondary-bg);
}

.form-control:focus,
.form-select:focus {
    border-color: #7FA8BF;
    box-shadow: 0 0 0 0.25rem rgba(36, 91, 120, 0.25);
}

.form-check-input:checked {
    background-color: #245B78;
    border-color: #245B78;
}

.form-check-input:focus {
    border-color: #7FA8BF;
    box-shadow: 0 0 0 0.25rem rgba(36, 91, 120, 0.25);
}

.progress {
    --bs-progress-bar-bg: #245B78;
}

/* DataTables ... */
.pagination {
    --bs-pagination-active-bg: #245B78;
    --bs-pagination-active-border-color: #245B78;
    --bs-pagination-hover-color: #1A4258;
    --bs-pagination-focus-color: #1A4258;
    --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(36, 91, 120, 0.25);
}

.dt-search {
    position: relative;
}

.dt-search label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.dt-search .bi-search {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #5F6F7A;
    font-size: 0.8rem;
    pointer-events: none;
}

.dt-search input.form-control {
    padding-left: 30px !important;
}

/* Telemóvel: só a tabela desliza na horizontal - o título, os botões, a
   pesquisa e a paginação ficam à largura do ecrã. Antes deslizava o bloco
   inteiro (o .table-responsive à volta de tudo) ... */
@media (max-width: 767.98px) {
    .dt-layout-table > .dt-layout-full {
        display: block !important;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .dt-layout-table > .dt-layout-full > table {
        white-space: nowrap;
    }

    .w-100.p-4.table-responsive {
        padding: 0.75rem !important;
    }
}

html,
body {
    background-color: #F4F6F8;
    height: 100%;
    width: 100%;
}

body {
    display: flex;
    flex-direction: column;
}

main {
    flex: 1;
}

.text-justify {
    text-align: justify;
}

/* Checkbox in front of a select (entries: Ficha financeira / Contrato):
   same width for all, so the selects beside them line up ... */
.check-col {
    width: 150px;
    flex-shrink: 0;
}

/* Form pages: full width on small screens, capped on large ones ... */
.page-narrow {
    max-width: 520px;
}

.page-medium {
    max-width: 960px;
}

.rounded-table {
    border-collapse: separate;
    /* necessário para que o border-radius funcione */
    border-spacing: 0;
    border: 1px solid;
    border-radius: 12px;
    /* Sem overflow:hidden (impedia o cabeçalho de ficar fixo ao rolar) -
       os cantos arredondados são feitos diretamente nas células dos
       extremos em vez de recortar toda a tabela ... */
    width: 100%;
}

.rounded-table thead tr:first-child th:first-child {
    border-top-left-radius: 12px;
}

.rounded-table thead tr:first-child th:last-child {
    border-top-right-radius: 12px;
}

.rounded-table tbody tr:last-child td:first-child {
    border-bottom-left-radius: 12px;
}

.rounded-table tbody tr:last-child td:last-child {
    border-bottom-right-radius: 12px;
}

.rounded-table th,
.rounded-table td {
    padding: 13px 14px;
    border-bottom: 1px solid;
}

.rounded-table tr:last-child td {
    border-bottom: none;
}

/* Tables with a totals row (tfoot): the bottom corners go to the totals row,
   and the last body row keeps its dividing line ... */
.rounded-table tfoot tr:last-child td:first-child {
    border-bottom-left-radius: 12px;
}

.rounded-table tfoot tr:last-child td:last-child {
    border-bottom-right-radius: 12px;
}

.rounded-table:has(tfoot tr) tbody tr:last-child td:first-child {
    border-bottom-left-radius: 0;
}

.rounded-table:has(tfoot tr) tbody tr:last-child td:last-child {
    border-bottom-right-radius: 0;
}

.rounded-table:has(tfoot tr) tbody tr:last-child td {
    border-bottom: 1px solid;
}

/* Agenda (Processos): a calendar of the cases' deadlines and appointments.
   Fixed layout, so the seven days keep the same width whatever is written in them;
   a minimum width, so on small screens the calendar slides instead of squeezing ... */
.agenda {
    --bs-table-bg: #FFFFFF;
    table-layout: fixed;
    min-width: 700px;
}

.agenda td {
    vertical-align: top;
    padding: 4px;
}

/* A click on a day opens a new appointment on that date ... */
.agenda td.agenda-day {
    cursor: pointer;
}

.agenda-month td {
    height: 110px;
}

.agenda-week td {
    height: 360px;
}

/* Weekends and holidays (courts and services closed) ... */
.agenda td.agenda-closed,
span.agenda-closed {
    background-color: #ECEFF2;
}

/* Court holidays (judicial deadlines are suspended): a light warning tint ... */
.agenda td.agenda-court-holiday,
span.agenda-court-holiday {
    background-color: #FBF4E2;
}

.agenda td.agenda-court-holiday.agenda-closed {
    background-color: #F1E6C8;
}

.agenda-tag {
    font-size: 0.72rem;
}


/* Breadcrumb at the top of each page (layout-app): small, "›" between links, theme colours ... */
.page-breadcrumb .breadcrumb {
    --bs-breadcrumb-divider: '›';
    --bs-breadcrumb-divider-color: #5F6F7A;
    --bs-breadcrumb-item-active-color: #5F6F7A;
    font-size: 0.85rem;
    flex-wrap: wrap;
}

.page-breadcrumb .breadcrumb-item {
    color: #5F6F7A;
}

.page-breadcrumb .breadcrumb a {
    color: #245B78;
    text-decoration: none;
}

.page-breadcrumb .breadcrumb a:hover {
    text-decoration: underline;
}

/* The page right below the breadcrumb starts closer to it (the pages use p-4, which is !important) ... */
.page-breadcrumb + .p-4 {
    padding-top: 0.75rem !important;
}

.navbar .nav-link.active {
    color: #D9B26A;
}

.nav-tabs {
    --bs-nav-tabs-link-active-color: #1F3A4A;
    --bs-nav-tabs-link-active-bg: #FFFFFF;
    --bs-nav-tabs-link-active-border-color: #DDE3E8 #DDE3E8 #FFFFFF;
}

.nav-tabs .nav-link {
    color: #5F6F7A;
}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus {
    border-color: #DDE3E8 #DDE3E8 #DDE3E8;
    color: #245B78;
}

.navbar[data-bs-theme=dark] .dropdown-menu {
    --bs-dropdown-bg: #1F3A4A;
    --bs-dropdown-border-color: rgba(255, 255, 255, 0.15);
    --bs-dropdown-divider-bg: rgba(255, 255, 255, 0.15);
    --bs-dropdown-link-color: #E6EDF2;
    --bs-dropdown-link-hover-color: #FFFFFF;
    --bs-dropdown-link-hover-bg: #2E4E61;
    --bs-dropdown-link-active-color: #FFFFFF;
    --bs-dropdown-link-active-bg: #245B78;
}