/**
* Fil: app.css
* Sti: /assets/css/app.css
* Version: 1.0.2
* Since: 2025-12-17
* Sidst opdateret: 2025-12-19
* Forfatter: MineTimer
*
* Changelog:
* - 1.0.2: Styling opdateret til Microsoft Outlook farver.
* - 1.0.1: Basal styling, footer-menu, kalender-celler, små knapper.
*/

:root {
    --theme-primary        : rgb(0, 120, 212);
    --theme-primary-hover  : rgb(0, 102, 184);
    --theme-primary-light  : rgba(0, 120, 212, 0.1);
    --theme-primary-border : rgba(0, 120, 212, 0.4);
}


body {
    padding-bottom: 76px;
}

.footer-nav {
    position   : fixed;
    left       : 0;
    right      : 0;
    bottom     : 0;
    z-index    : 1030;
    background : #ffffff;
    border-top : 1px solid rgba(0,0,0,.1);
}

.footer-nav .nav-link {
    color     : #444;
    font-size : 12px;
    padding   : 10px 6px;
}

.footer-nav .nav-link.active {
    color       : #0d6efd;
    font-weight : 600;
}

.footer-nav .nav-link i {
    display       : block;
    font-size     : 18px;
    line-height   : 18px;
    margin-bottom : 4px;
}

.calendar-cell {
    min-height: 160px;
}

.card-clickable {
    cursor: pointer;
}

.entry-row {
    display         : flex;
    justify-content : space-between;
    gap             : 10px;
}

.entry-actions .btn {
    padding: 2px 6px;
}

.btn-primary {
    background-color: var(--theme-primary);
    border-color: var(--theme-primary);
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--theme-primary-hover);
    border-color: var(--theme-primary-hover);
}

a {
    color: var(--theme-primary);
}

a:hover {
    color: var(--theme-primary-hover);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--theme-primary);
    box-shadow: 0 0 0 0.2rem var(--theme-primary-light);
}

.select2-container--bootstrap-5 .select2-selection--single:focus {
    border-color: var(--theme-primary);
    box-shadow: 0 0 0 0.2rem var(--theme-primary-light);
}

.select2-container--bootstrap-5 .select2-results__option--highlighted {
    background-color: var(--theme-primary);
    color: #fff;
}

.swal2-confirm {
    background-color: var(--theme-primary) !important;
}

.swal2-confirm:hover {
    background-color: var(--theme-primary-hover) !important;
}

.navbar,
.app-header {
    background-color: var(--theme-primary);
}

.navbar .nav-link,
.navbar-brand {
    color: #fff;
}

.navbar .nav-link:hover {
    color: #e6f2ff;
}

.badge.bg-primary {
    background-color: var(--theme-primary) !important;
}

.text-primary {
    color: var(--theme-primary) !important;
}

.bg-primary {
    background-color: var(--theme-primary) !important;
}