/*
    Postnummerlista - Karlstad
    DEV: Karl Artinger 
    Projektstart: 2023-06-11
    Version: 0.92

    Fil: style.css
    Innehåll: Styling för komponenter
*/

/*Globala inställningar*/
* {
    box-sizing: border-box;
}

nav {
    border-bottom: 2px solid black;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
}

/* Sätt font-family för hela body och ändra bakgrundsfärg*/
body {
    font-family: 'Roboto', sans-serif;
    background-color: #c9c9c9;
} 

main {
    font-family: 'Roboto Mono';
    margin-bottom: 5.5rem;
}

    
.navbar,
#icon-navbar {
    background-image: linear-gradient(to top, #ffcd00, #ffaf1c);
    color: black;
}

.bi-box-seam-fill {
    font-size: 2rem;
    color: #ba0c2f;
}

.navbar-icon {
    font-size: 1.7rem;
}

.icon-text {
    font-size: 0.9rem;
}


.container {
    --bs-gutter-x: 0;
}

/* Sätt font-family för hela main*/


.nav-item {
    width: 100%;
}

.container-fluid {
    padding: 0;
}

.nav-item.active {
    position: relative;
    color: black;
    font-weight: bolder;
}

.nav-item.active::before {
    content: "";
    position: absolute;
    bottom: 65px;
    left: 0;
    width: 100%;
    height: 6px;
    background-color: #ba0c2f;
    border-radius: 80px;
}

/*! TA BORT DETTA EFTERÅT*/
.nav-item.disabled{
    opacity: 0.5;
    filter: blur(1px);
    color: grey;    
}

#title {
    font-size: 2rem;
    font-weight: bolder;
}

i {
    font-size: 2.25rem;
}

.icon {
    font-size: 1.8rem;
}

.form-control {
    font-size: 1rem;
    /* Justera textstorleken efter behov */
}

.label {
    font-size: 1.3rem;
}

.value {
    font-size: 1.3rem;
    color: #0000FF;
    font-weight: 700;
}

/*Inställningar för ui-autocomplete*/
.ui-menu-item {
    font-size: 1.3rem;
    border-bottom: 1px solid black;
    border-left: 1px solid black;
    border-right: 1px solid black;
}

.ui-menu-item:last-child {
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

.ui-autocomplete {
    max-height: 308px;
    overflow-y: auto;
}

.card {
    display: none;
}

.selected {
    font-weight: bold;
}

.district {
    word-break: break-all;
}