html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

@media (min-width: 576px) {
    .hiddenDesktop {
        display: none !important;
    }
}

@media (max-width: 575px) {
    .hiddenMobile {
        display: none !important;
    }

    .icon {
        position: relative;
        width: 128px !important; /* Quadrupla grandezza rispetto a 64px */
        height: 128px !important; /* Quadrupla grandezza rispetto a 64px */
        display: grid;
        place-items: center;
        margin: 8px;
        cursor: pointer;
        transition: transform 200ms ease;
        font-size: 3rem !important;
    }

    .icon .icon-svg {
        width: 64px !important; /* Quadrupla grandezza rispetto a 32px */
        height: 64px !important; /* Quadrupla grandezza rispetto a 32px */
        stroke: currentColor;
    }

    .mh-textarea {
        height: 51px !important;
        min-height: 51px !important;
        max-height: 51px !important;
    }
}

.mh-textarea {
    height: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
}

td {
    font-size: small;
}

.container{
    max-width: 1490px!important;
}

.buttonYesNo {
    width:3rem !important;
}

.custom-spinner {
    color: white;
    margin-top: 200px;
}

.bg-loader {
    background-color: black;
    z-index: 1072;
    overflow-x: hidden;
    overflow-y: auto;
    opacity: .7;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    outline: 0;
    transition: opacity .15s linear;
}

svg {
    width: 114px;
    height: 114px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -64px;
    margin-left: -64px;
    z-index: 9999999;
    /*background-color: #fff;
    opacity: 0.6;*/
}

.circle {
    fill: none;
    stroke-width: 10px;
    stroke: #EDE0D4;
    width: 114px;
    height: 114px;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -64px;
    margin-left: -64px;
}

.loader {
    fill: none;
    stroke-width: 10px;
    stroke-linecap: round;
    transform: rotate(-90deg);
    transform-origin: 50% 50%;
    stroke-dasharray: 360;
    stroke-dashoffset: 100;
    stroke: #7F5539;
    animation: load 10s infinite;
}

@keyframes load {
    0% {
        stroke-dasharray: 360;
    }

    50% {
        stroke-dasharray: 1;
    }

    100% {
        stroke-dasharray: 360;
    }
}

.identity-bg {
    background-color: #7F5539 !important;
}

.bar-bg {
    background-color: #766153 !important;
}

.page-bg {
    background-color: #EDE0D4 !important;
}

.card-glass {
    background: rgba(255, 255, 255, 0.5) !important;
    border:none!important;
    border-radius: 16px!important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(0px);
    -webkit-backdrop-filter: blur(0px);
}

.btn-basic {
    color: white !important;
    border-radius: 50px;
    background-color: #8a5a44;
    border: 1px solid #8a5a44;
    --bs-focus-ring-color: rgba(156, 102, 68, 1, .25);
}
    .btn-basic:hover {
        text-decoration: none !important;
        color: white !important;
        border-radius: 50px;
        background-color: #7F5539;
        border: 1px solid #7F5539;
        --bs-focus-ring-color: rgba(156, 102, 68, 1, .25);
    }

.btn-outline-basic {
    color: #8a5a44 !important;
    border: 1px solid #8a5a44;
    border-radius: 50px;
    background-color: transparent;
    --bs-focus-ring-color: rgba(156, 102, 68, 1, .25);
}
    .btn-outline-basic:hover {
        text-decoration: none !important;
        color: white !important;
        border-radius: 50px;
        background-color: #7F5539;
        border-color: #7F5539;
        --bs-focus-ring-color: rgba(156, 102, 68, 1, .25);
    }

.dropdown-menu {
    background-color: #8a5a44!important;
}

.dropdown-item:hover, .dropdown-item:focus {
    color: white !important;
    background-color: #7F5539 !important;
}

a {
    text-decoration: none;
    color: white !important;
}

    a:hover {
        /*text-decoration: underline !important;*/
        color: white!important;
    }

.text-dark:hover{
    color:black !important;
}


.icons {
    display: flex;
}

.icon {
    position: relative;
    width: 256px; /* Quadrupla grandezza rispetto a 64px */
    height: 256px; /* Quadrupla grandezza rispetto a 64px */
    display: grid;
    place-items: center;
    margin: 8px;
    cursor: pointer;
    transition: transform 200ms ease;
    font-size: 6rem;
}

    .icon:hover {
        transform: scale(1.125); /* Quadrupla grandezza rispetto a 1.125 */
    }

    .icon .icon-svg {
        width: 128px; /* Quadrupla grandezza rispetto a 32px */
        height: 128px; /* Quadrupla grandezza rispetto a 32px */
        stroke: currentColor;
    }

    .icon .squircle {
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: -1;
    }

    .icon:nth-of-type(1) {
        color: white;
        --bg: #7F5539;
    }

.svg-position {
    top: 0 !important;
    left: 0 !important;
    margin-top: 0 !important;
    margin-left: 0 !important;
}

.accordion-button {
    background-color: #8a5a44 !important;
    padding: 1rem 1.25rem !important;
    color: white !important;
}
    .accordion-button::after {
        color: white !important;
    }
    .accordion-button:not(.collapsed) {
        color: white !important;
    }

    .accordion-button:focus {
        color: white !important;
        border-color: white !important;
        border-color: none !important;
        outline: none!important;
        box-shadow: none!important;
    }

    .accordion-button.collapsed {
        border-radius: .25rem !important;
    }

    .accordion-button:not(.collapsed){
        color: white !important;
    }

    .accordion-button:not(.collapsed)::after {
        color: white !important;
    }

    .accordion-button::after {
        color: white !important;
    }        
        
.accordion-body {
    border: 2px solid #8a5a44;
    border-top: 0;
    background-color: #EFF1ED;
    border-bottom-right-radius: .25rem;
    border-bottom-left-radius: .25rem;
}

.table {
    background-color: #EDE0D4;
    --bs-table-striped-bg: rgba(0, 0, 0, 0.1);
    border: 2px solid #8a5a44;
    border-radius: .25rem!important;
}

thead {
    background-color: #8a5a44;
    color: white !important;
}


tbody {
    border: 2px solid #8a5a44;
}

.card {
    background-color: #EFF1ED;
    border: 2px solid #8a5a44;
}

.card-header {
    background-color: #8a5a44;
    color: white !important;
}

    .card-header:first-child {
         border-radius: 0!important; 
    }



.modal-header {
    background-color: #8a5a44;
    color: white !important;
    border: 2px solid #8a5a44;
}

.modal-body {
    background-color: #EFF1ED;
    border: 2px solid #8a5a44;
    border-bottom-right-radius: .25rem;
    border-bottom-left-radius: .25rem;
}


.view-hover {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    height: 100%;
}

.view-hover:hover h1#Servizi {
    transform: scale(1.125);
}
.view-hover:hover h1#Attivita {
    transform: scale(1.125);
}
.view-hover:hover h1#Immobili {
    transform: scale(1.125);
}
.view-hover:hover h1#Compensi {
    transform: scale(1.125);
}
.view-hover:hover h1#Fatture {
    transform: scale(1.125);
}


.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: white !important;
    background-color: #8a5a44;
    border-radius: 50px;
    border: 1px solid #8a5a44;
}

.text-brown {
    color: #8a5a44!important;
}
    .text-brown:hover {
        color: #8a5a44 !important;
    }

.fs-xl {
    font-size: x-large;
}

.hidden-btn {
    background: transparent;
    border-color: transparent;
}

.img-responsive {
    width: 100%;
    height: auto;
    max-width: 40rem;
}

.btn:focus {
    outline-color: #8a5a44; 
}
}


/* icone file + nome */
.file-icon-container {
    text-align: center;
}

.file-icon {
    font-size: 30px;
}

.file-label {
    margin-top: 5px;
    font-size: 10px;
}

.w-10{
    width: 10% !important;
}

#complete:hover {
    transform: scale(1.1);
}

.underline {
    text-decoration: underline!important;
}