/*
 Theme Name:   navi
 Description:  bootScore Child Theme
 Author:       bootScore
 Author URI:   https://bootscore.me
 Template:     bootscore-main
 Version:      5.2.0.0
 Text Domain:  bootscore
*/

/* 
All style editing is done via scss/_bscore_custom.scss
*/


body {
    font-family: 'Roboto', sans-serif;
}

:root {
    --blu-principale: #32348b;
    --verde-principale: #89b12c;
    --giallo-principale: #ffd302;
}

a {
    text-decoration: none;
}

.blue-bold {
    color: cornflowerblue;
    font-size: 14px;
    font-weight: 600;
}

.width100 {
    width: 100%;
}

.site-content {
    min-height: 90vh;
}

.gap-10 {
    clear: both;
    height: 10px;
}
.gap-15 {
    clear: both;
    height: 15px;
}
.gap-20 {
    clear: both;
    height: 20px;
}
.gap-30 {
    clear: both;
    height: 30px;
}
.gap-40 {
    clear: both;
    height: 40px;
}
.gap-46 {
    clear: both;
    height: 46px;
}
.gap-50 {
    clear: both;
    height: 50px;
}
.gap-60 {
    clear: both;
    height: 60px;
}
.gap-90 {
    clear: both;
    height: 90px;
}

.hide {
    display: none;
}

.pointer {
    cursor: pointer;
}

.erroresq {
    border: 5px solid red;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 20px;
}

section {
    margin-top: 3rem;
}

.bg-blue {
    background-color: var(--blu-principale);
}

.c-blue {
    color: var(--blu-principale);
}

.attivo {
    color: green;
}
.nonattivo {
    color: orangered;
}

.bg-green {
    background-color: var(--verde-principale);
}

.bg-red {
    background-color: #EE4D47;
}

.blueblock {
    border: 2px solid cornflowerblue;
    border-radius: 8px;
    padding: 10px;
    background-color: aliceblue;
}

.blue-button {
    background-color: var(--blu-principale) !important;
    border-color: var(--blu-principale) !important;
}

.green-button {
    background-color: var(--verde-principale) !important;
    border-color: var(--verde-principale) !important;
    color:white !important;
}


.card-body {
    padding: 3rem !important;
}

.fullwidthtitle {
    background-color: #89b12c;
    width: 100%;
    padding: 10px;
    color: white;
    text-align: center;
}


.navbar {
    backdrop-filter: blur(4px);
    background-color: rgba(249, 250, 253, 0.243);
    background-image: none;
}

.err-mess {
    color: red;
    font-weight: 600;
    margin-bottom: 15px;
}

.err-mess span a {
    font-weight: 400;
    font-size: 14px;
    color: darkslategrey;
}

.err-mess span a:link {
    text-decoration: none;
}


.offcanvas {
    height: 100vh;
}

.site {
    background-color: #F0F4F9;
}

.site-content {
    background-color: #F0F4F9;
}

#page {
    height: auto;
}

.badge {
    font-weight: 500;
    border-radius: 0;
    font-size: 1rem;
    padding: 0.58rem 1.8rem;
}


.bg-badge-blue {
    background-color: var(--blu-principale);
}

.bg-badge-green {
    background-color: var(--verde-principale);
}

.bg-badge-red {
    background-color: #EE4D47;
}

.fw-medium {
    font-weight: 500 !important;
    font-size: 2.98598rem;
    line-height: 1;
    color: var(--blu-principale) !important;
    font-family: "Rubik", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

.listini .card ul {
    height: 100px;
}

.listini .card .info-icon img {
    width: 45px;
    cursor: pointer;
}

.listini .card .display-4 {
    font-weight: 500 !important;
    font-size: 2.5rem;
    line-height: 1;
    color: var(--blu-principale) !important;
    font-family: "Rubik", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}

.listini .bestchoice {
    position: absolute;
    z-index: 100;
    width: 134px;
    top: -40px;
    right: -14px;
    transform: rotate(35deg);
}

.login-form {
  background-color: #f2f2f2;
  border: 1px solid #ddd;
  padding: 20px;
  margin-top: 20px;
}

.login-form input[type="text"],
.login-form input[type="password"] {
  display: block;
  width: 100%;
  padding: 10px;
  margin-bottom: 10px;
  border: 1px solid #ddd;
  border-radius: 4px;
}

.login-form input[type="submit"] {
  background-color: #0073aa;
  color: #fff;
  padding: 10px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

.login-form input[type="submit"]:hover {
  background-color: #005d88;
}


.logout a {
    text-decoration: none;
    color: var(--bs-nav-link-hover-color);
    position: relative;
    bottom: -8px;
}



.login a {
    text-decoration: none;
    color: var(--bs-nav-link-hover-color);
    position: relative;
    bottom: -8px;
}


.listini .card {
    max-width: 360px !important;
    min-width: 250px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.listini .cardteam .card {
    max-width: 100% !important;
    min-width: 250px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.configurazione {
    position: relative;
}
.configurazione select {
    max-width: 500px;
}

.height600 {
    min-height: 630px;
}



/* The dashboard side navigation menu */
.d-sidebar {
    margin: 0;
    padding: 0;
    width: 200px;
    background-color: #f1f1f1;
    position: absolute;
    height: auto;
    overflow: auto;
}

/* Sidebar links */
.d-sidebar a {
    display: block;
    color: black;
    padding: 16px;
    text-decoration: none;
}

/* Active/current link */
.d-sidebar a.active {
    background-color: #04AA6D;
    color: white;
}

/* Links on mouse-over */
.d-sidebar a:hover:not(.active) {
    background-color: #555;
    color: white;
}

/* Page content. The value of the margin-left property should match the value of the sidebar's width property */
div.d-content {
    margin-left: 200px;
    padding: 1px 16px;
    /*height: 1000px;*/
}

.sch-note-in {
    background-color: white;
    padding: 5px;
}


.danger i{
    font-size: 30px;
    color: #F32013;
}
.danger h5{
    font-weight: 600;
}

.btntopscheda {
    border: 1px solid darkslategrey;
    border-radius: 6px;
    padding: 5px;
    background-color: floralwhite;
}






/***************************   FAQ  **********************************/

.help-faq .accordion-body p {
    font-size: 15px;
}









/*************************************   APP   ***************************/

.app-cell-1 {
    border: 2px solid black;
    background-color: var(--verde-principale);
    color: white;
    display: flex;
    align-items: center;
}

.app-cell-2 {
    border: 2px solid black;
    background-color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}

.app-cell-tit {
    border: 2px solid black;
    background-color: var(--giallo-principale);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 20px;
    height: 60px;
}

.app-cell-tit img {
    height: 45px;
    width: auto;
}

.border-top-none {
    border-top: 0;
}

.border-right-none {
    border-right: 0;
}

.border-bottom-none {
    border-bottom: 0;
}

.pos-fin-lo {
    background-color: var(--blu-principale);
    color: white;
    font-weight: 800;
    font-size: 45px;
}

.app-layout {
    padding: 30px;
    background-color: transparent; /* Rimuovi il colore di sfondo da qui */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    z-index: 10;
    font-size: 14px;
}

.app-layout::before {
    content: "";
    background: url(https://www.navigoal.it/wp-content/themes/navi/img/hero-header.jpg);
    background-color: rgba(255, 255, 255, 1); /* Imposta l'opacità desiderata con RGBA */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1; /* Assicurati che il pseudo-elemento sia dietro il contenuto principale */
    opacity: 0.6;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 10px;
}

.apptab1,
.sevolessiarrivare,
.risultato-arrivare {
    max-width: 500px;
    margin-right: auto;
    margin-left: auto;
}

.scheda-sum, .sevolessiarrivare {
    background-color: rgba(255, 255, 255, 0.6);
    padding: 14px;
    border-radius: 8px;
    border: 1px solid black;
}

.sevolessiarrivare input{
    max-width: 70px;
    display: inline;
    margin-right: 10px;
}

.app h3{
    text-transform: uppercase;
    font-weight: 800;
    color: #383838;
}

.app img{
    margin-left: 10px;
    margin-right: 20px;
}

.app .textcenter{
    text-align: center;
}

.app .infoicona{
    margin-left: 4px;
    color: #005d88;
    cursor: pointer;
    font-size: 12px;
}

.admin-user-nav input,
.admin-user-nav button {
    height: 38px;
}

.apptabfoot {
    background-color: rgba(255, 255, 255, 0.6); 
    padding: 14px;
    border: 1px solid black;
    border-radius: 8px;
    margin-top: 30px;
}



/* GUIDA */
.guida h3 {
    margin-left: 10px;
}

.guida .sezione {
    margin-left: 20px;
}

.guida .area {
    background-color: white;
    padding: 5px;
    border-radius: 10px;
}


.ass-ind-cmp {
    background-color: white;
    padding: 10px;
    border-left: 2px solid red;
}



/* MENU ACCOUNT */

.avviso-rinnovo-account i {
    color: rgb(255, 64, 0);
}
.avviso-rinnovo-account p {
    font-size: 15px;
}

.avviso-rinnovo-account {
    border: 2px solid beige;
    padding: 6px;
    border-radius: 8px;
}

.useraccountpage input {
    height: 35px !important;
}

.avviso-rinnovo-account a {
    color: white;
    background-color: #0d6efd;
    text-decoration: none;
    padding: 4px;
    border-radius: 4px;
}

.acc-menu {
    font-size: 14px;
    margin-bottom: 20px;
    color: #fff;
    padding: 10px;
    border-radius: 9px;
}

.acc-menu nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.acc-menu .logo {
  font-size: 24px;
  font-weight: bold;
}

.acc-menu .menu {
  display: flex;
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.acc-menu .menu li {
  margin-left: 10px;
}

.acc-menu .menu li a {
  color: #fff;
  text-decoration: none;
}

.acc-menu .hamburger {
  display: none;
  cursor: pointer;
}

.acc-menu .hamburger-icon {
    padding-right: 10px;
}











@media only screen and (max-width: 768px) {
  .acc-menu .menu {
    display: none;
  }

  .acc-menu .hamburger {
    display: block;
  }
}






/* On screens that are less than 700px wide, make the sidebar into a topbar */
@media screen and (max-width: 700px) {
    .d-sidebar {
        width: 100%;
        height: auto;
        position: relative;
    }

    .d-sidebar a {
        float: left;
    }

    div.d-content {
        margin-left: 0;
    }
}

@media screen and (min-width: 769px) {
    
    .logout {
        margin-left: 5px;
    }
    .login {
        margin-left: 5px;
    }

}

/* On screens that are less than 400px, display the bar vertically, instead of horizontally */
@media screen and (max-width: 400px) {
    .d-sidebar a {
        text-align: center;
        float: none;
    }
}


@media screen and (max-width: 769px) {
    
    .listini .card .display-4 {
        font-size: 1.5rem;
    }
    
    .app img{
        margin-left: 10px;
        margin-right: 10px;
    }
    
}

    

.shUtSqsec {
    background-color: white;
    padding: 10px;
    border-radius: 10px;
}

.shUtSqsec select, 
.shUtSqsec input {
    background-color: aliceblue;
}


.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    list-style: none;
    padding: 0;
}

.pagination li {
    margin: 0 5px;
    display: inline;
    font-size: 18px;
}

.pagination a {
    display: block;
    padding: 5px 10px;
    background-color: #0073e6;
    color: #fff;
    text-decoration: none;
    border-radius: 3px;
}

.pagination a:hover {
    background-color: #0056b3;
}

.pagination .current {
    background-color: #0056b3;
    margin-right: 1px;
    margin-left: 1px;
    color: white;
}

.pagination .prev,
.pagination .next {
    background-color: transparent; /* Rimuovi lo sfondo */
    color: #212529; /* Imposta il colore del testo a nero */
}

.pagination .prev:hover,
.pagination .next:hover {
    color: #fff; /* Imposta il colore del testo a bianco in modalità hover */
}

.area-pagamento {
    padding: 10px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

#col_pagamento .titolo {
        text-align: center;
        font-style: italic;
        padding-top: 15px;
        padding-left: 10px;
        padding-right: 10px;
}

.account-banner img {
    width: 100%;
    border-radius: 6px;
}




.rinnovo .info {
    text-align: center;
}


.richiedi-squadra {
    margin-top: 50px;
}

#richSq {

    position: absolute;
    left: -100%; /* Posiziona l'elemento fuori dallo schermo a sinistra */
    transition: left 0.5s ease; /* Aggiungi una transizione per animare lo slide */
}

.mostrare-left {
    left: 0 !important; /* Posiziona l'elemento nella sua posizione originale (sinistra: 0) */
}






.hometraspbg {
    max-width: 800px;
    margin-right: auto;
    margin-left: auto;
    color: #32348b;
}

.hometraspbg {
    background-color: rgba(255, 255, 255, 0.6);
    padding: 14px;
    border-radius: 8px;
    border: 1px solid #32348b;
}

.hometraspbg span {
    font-size: 30px;
    font-weight: 600;
}


.hometraspbg2 {
    max-width: 800px;
    margin-right: auto;
    margin-left: auto;
    color: #32348b;
    padding: 14px;
    border-radius: 8px;
    border: 1px solid #32348b;
    background-color: #ffd302;
    text-align: center;
}

.hometraspbg2 span {
    font-size: 30px;
}



@media screen and (max-width: 769px) {
    
    .hometraspbg span {
        font-size: 28px;
        font-weight: 600;
    }

    .hometraspbg2 span {
        font-size: 22px;
    }
    
}