/*==============================================================*/
/*  Autore     : Giuseppe Rossino                               */
/*  Copyright  : © 2025 Giuseppe Rossino                        */
/*  Licenza    : Tutti i diritti riservati. Vietata la          */
/*               copia, la distribuzione, la modifica           */
/*               o l'uso non espressamente autorizzato.         */
/*==============================================================*/

@media (max-width:3000px) {
    
    body.public .wrapper {
        width: 35%
    }
    .primary-btn {
        width: 30%!important;
    }
    body.staff .primary-btn,
    body.coach .primary-btn,
    body.admin .primary-btn,
    body.user .primary-btn  {
       width: 20%!important;
    }
    body.admin .wrapper {
       max-width: 82%;
       margin: 100px auto 10px auto;
   }
    .custom-iframe,
    .iframe-popup iframe.custom-iframe {
       height: 750px;
  }
}

@media (max-width:2040px) {
    
    body.public .wrapper {
        width: 37%
    }
}

@media (max-width: 1920px) {
    
    /*wrapper*/
    body.public .wrapper {
        width: 39%
    }
    .primary-btn {
        width: 33%!important;
    }
    body.staff .primary-btn,
    body.coach .primary-btn,
    body.admin .primary-btn,
    body.user .primary-btn  {
       width: 22%!important;
    }
  
    body.admin .wrapper {
       max-width: 87%;
       margin: 75px auto 10px auto;
   }
    
  .jconfirm.jconfirm-modern .jconfirm-box {
       padding: 15px 0px!important;
  }

  .iframe-popup .jconfirm-title {
       font-size: 17px !important;
  }
  .custom-iframe,
  .iframe-popup iframe.custom-iframe {
       height: 650px;
  }


}
@media (max-width: 1600px) {
    
    .panel-body .icon-bg {
        left:-50px;
        top: 48%;
        font-size: 13vw !important;
    }
    
   .custom-iframe,
   .iframe-popup iframe.custom-iframe {
        height: 480px;
   }
  
    body.public .wrapper {
        width: 45%
    }
    body.admin .wrapper {
        max-width: 95%;
        /*margin: 10px auto;*/
        margin: 15px auto 10px auto;
   }
}

@media (max-width:1440px) {
    
    body.public .wrapper {
        width: 48%
    }
    .right-pnl {
        width: 40%
    }
}

@media (max-width:1366px) {
    
    .panel-body .icon-bg {
        left:-55px;
        top: 45%;
        font-size: 14vw !important;
    }
      
    
    body.public .wrapper {
        width: 52%
    }
    .primary-btn {
        width: 35%!important;
    }
    body.staff .primary-btn,
    body.coach .primary-btn,
    body.admin .primary-btn,
    body.user .primary-btn  {
       width: 25%!important;
    }    

    .left-w3ls {
        width: 59%
    }
}
@media (min-width: 1280px){    

    body.staff .ts-main-content .content-wrapper,
    body.coach .ts-main-content .content-wrapper {
        padding-top: 0px!important; 

    }
    body.staff .container-fluid,
    body.coach .container-fluid, 
    body.user .container-fluid {
        background: url(../images/basketball_2.png);
        background-repeat: no-repeat;
        background-size: 30%;
    }
    body.user .container-fluid {
        padding: 80px 150px 20px 150px!important;
        background-position: -75px -75px;
    }

    body.staff .container-fluid,
    body.coach .container-fluid {
       padding: 80px 100px!important;
       background-position: -75px -75px;
    }
    
    body.admin-dashboard .container-fluid{
    padding-left: 50px;
       padding-right: 50px;

    }
    
    body.admin-dashboard .panel-body[class^="bk-"],
    body.admin-dashboard .panel-body[class*=" bk-"] {
       padding: 19px;
    
    }

    body.user .ts-main-content .content-wrapper {
       padding-top: 0px; 
    }  

}

@media (min-width: 850px){ 
    
    body.user .primary-btn.left {
      width: 35%!important;
    }
    
}


@media (max-width:1280px) {
    
    .panel-body .icon-bg {
        left:-47px;
        top: 50%;
        font-size: 14vw !important;
    }
    
    body.public .wrapper {
        width: 55%
    }
    .right-pnl {
        width: 38%
    }
    .left-pnl {
        width: 61%;
        margin-top: 20px
    }
    .ts-sidebar {
        z-index: 9999
    }

}

@media (max-width:1050px) {
    
    body.public .wrapper {
        width: 65%
    }

}

@media (min-width:1024px) {
    
    div.dt-button-collection.fixed.columns {
        margin-left: -308px
    }
    div.dt-button-collection.columns>:last-child {
        width: 612px
    }
}

@media (max-width:991px) {
    
    .right-pnl {
        width: 34%
    }
}

@media only screen and (min-width:1024px) {
    p {
        font-size: 1em;
        /*margin-bottom: 1.8em*/
    }

}    

@media only screen and (min-width:992px) {
    .brand .logo {
        width: 250px
    }
    .brand .menu-btn {
        display: none
    }
    .brand .ts-profile-nav {
        display: block
    }
    .ts-sidebar .ts-profile-nav {
        display: none
    }
    .ts-sidebar {
        max-height: 100%;
        bottom: 0
    }
    .ts-main-content .ts-sidebar {
        width: 250px;
        float: left
    }

    .ts-main-content .content-wrapper {
        margin-left: 250px
    }
}

@media (max-width:1080px) {
    
    .panel-body .icon-bg {
        left:-49px;
        top: 50%;
        font-size: 16vw !important;
    }

    .container {
        padding: 40px 0 32px
    }
    
    .footer p {
        padding: 3em 0
    }

    .header h1 {
        font-size: 36px
    }
}

@media (max-width:900px) {
    
      .panel-body .icon-bg {
        left:-48px;
        top: 51%;
        font-size: 19vw !important;
    }

    .primary-btn {
        width: 45%!important;
    }
    
    .right-pnl {
        width: 37%
    }
    .left-pnl {
        width: 58%;
        margin-top: 25px
    }

    body.public .wrapper {
        width: 75%
    }
    body.staff .primary-btn,
    body.coach .primary-btn,
    body.admin .primary-btn,
    body.user .primary-btn  {
        width: 35%!important;
    }    

    body.admin .wrapper {
       max-width: 97%;
       margin: 8px auto 0px auto;
   }
   
    .header h1 {
        font-size: 36px;
        letter-spacing: 7px
    }
}


@media only screen and (min-width:480px) {
    html {
        font-size: 17px
    }
}

@media (max-width: 768px) {
    
    .brand .cog-btn {
         padding: 19px 0px
    }

    
    table.dataTable thead>tr>td.sorting,table.dataTable thead>tr>td.sorting_asc,
    table.dataTable thead>tr>td.sorting_desc,table.dataTable thead>tr>th.sorting,
    table.dataTable thead>tr>th.sorting_asc,table.dataTable thead>tr>th.sorting_desc {
         padding-right: 30px;

   }

    .container-fluid {
        padding-left: 10px!important;
        padding-right: 10px!important;
    }

    .panel-body .icon-bg {
        left:-45px;
        top: 50%;
        font-size: 28vw !important;
    }
    
    .flex {
        flex-direction: column; 
        justify-content: center; 
        align-items: center; 
        gap: 3px;
    }
    
    body.admin .wrapper {
       max-width: 100%;
   }
    
    .not_found{
       padding: 10px;
    }

    .not_found p{
        font-size:18px;
    }

    #map {
       height: 70vh;
       z-index: 1;  
    }

   #toolbarContainer {
   margin: 10px;
    }

     .leaflet-bar {
        display: none;
    }
    
    #toast {
        position: fixed!important;
        left: 50%!important;
        transform: translateX(-50%)!important;
        width: 80% !important;
        text-align:center;
    }

    .frm-info {
    padding: 0 0 40px
    }

    table {
    font-size: 14px;
    }

    .my-4 {
    margin: 1.2rem 0.3rem !important;
    }
        
    body.public .wrapper .top {
    padding: 2px 20px 15px;
    }

    body.public .wrapper .content,
    body.public .j-forms .content {
        padding: 20px!important
    }

    body.public .wrapper {
        width: 80%
    }

    .primary-btn {
        width: 100%!important;
    }

    body.staff .primary-btn,
    body.coach .primary-btn,
    body.admin .primary-btn,
    body.user .primary-btn  {
        width: 50%!important;
    }

    body.public .container {
        padding: 0
    }

    .frm-info a {
        margin-right: 0!important
    }

    .ts-sidebar-menu {
        font-size: 16px!important
    }

    .ts-sidebar {
        z-index: 9999
    }

    .ts-sidebar-menu .ts-label,.ts-sidebar-menu li {
        font-size: 20px
    }

    .frm-btn input[type=button],.frm-btn input[type=submit] {
        width: 70%!important
    }

    /*.j-forms .content {
        padding: 20px!important
    }*/
    body.user .wrapper .content,    
    body.user .j-forms .content {
        padding: 0px!important
    }

    .container {
        padding: 24px 0 0
    }

    .footer p {
        padding: 3em 0
    }

    .header h1 {
        letter-spacing: 6px;
        margin: 80px 0 20px
    }

    .header {
        padding: 20px 0 12px
    }

    ul.nav1 {
        right: -85%!important
    }

    ::-webkit-scrollbar {
        height: 4px;
        width: 0
    }

    .left-pnl {
        border-left: none;
        padding:15px 0 0 0px!important;
        margin-top: .5em!important;
    }

    .right-pnl {
        padding: 15px 0 15px 0; 
    }

    .right-pnl img {
        width: 50%; 
    }

    .ucontent {
        width: 100%!important
        }

    .j-forms .error-message, .j-forms .info-message, .j-forms .success-message, .j-forms .warning-message {
        font-size: 13px!important;
    } 
    
    .jconfirm .jconfirm-box div.jconfirm-title-c .jconfirm-title {
        max-width: calc(80% - 8px); /* lascia spazio per l'icona */
        display: inline-block;
        vertical-align: middle;
    }
    /* Riga che appare al passaggio del mouse */
    .hover-expand-effect::after {
      transition: width 0.2s ease, left 0.2s ease!important;
    }
}


@media (min-width:769px) {
    body.public .wrapper .top {
        padding: 4px 40px 20px 40px;
    }
}


@media only screen and (min-width:768px) {
    html {
        font-size: 14px
    }
}

@media screen and (max-width: 767px) {
   
    .dt-buttons {
        text-align:center;
    }
    
    div.dataTables_wrapper div.dataTables_filter,
    div.dataTables_wrapper div.dataTables_info,
    div.dataTables_wrapper div.dataTables_length,
    div.dataTables_wrapper div.dataTables_paginate {
        text-align: center
    }
}


@media only screen and (min-width:780px) and (max-width:1080px) {
    .frm-info a {
        margin-right: 10px!important
    }
}

/* Tablet / smartphone orizzontale (2 per riga) */
@media (max-width: 1000px) and (min-width: 621px) {

        .j-forms [class*=span4] {
        margin-right: 0;
        width: 45%;
    }
}

@media (max-width:736px) {
    
    body.public .wrapper {
        width: 85%
    }
    
    .container {
        padding: 20px 0 0
    }

    .header h1 {
        letter-spacing: 5px
    }

    .right-pnl {
        width: 34%
    }

    .left-pnl {
        margin-top: 22px
    }
}


@media (max-width:667px) {
    
    .panel-body .icon-bg {
        left:-47px;
        top: 50%;
        font-size: 38vw !important;
    }
    
    body.public .wrapper {
        width: 90%
    }
    
    .footer p {
        padding: 3em 0
    }

    .header h1 {
        letter-spacing: 2px
    }

    .right-pnl {
        width: 37%
    }

    .right-pnl h2 {
        font-size: 16px
    }

    .right-pnl p {
        font-size: 12.5px;
        letter-spacing: .7px
    }
}

@media all and (max-width:650px) {
    
    .j-forms .label {
        margin-bottom: 10px
    }

    .popup-btm-640 {
        width: 320px
    }

    .popup-btm-640 .j-forms [class*=span] {
        margin-right: 0;
        width: 100%
    }

    .popup-btm-640 .j-forms [class*=offset] {
        margin-left: 0
    }

    .popup-btm-640 .j-forms .label-center {
        height: 14px;
        line-height: 14px;
        text-align: left;
        padding-bottom: 3px
    }
}

@media screen and (max-width:640px) {

    div.dt-button-collection.fixed.columns {
        margin-left: -203px
    }
    div.dt-button-collection.columns>:last-child {
        width: 406px
    }

    div.dt-button-collection.columns.dtb-b3 .dt-button {
        flex: 0 1 32%
    }
}

@media all and (max-width:620px) {
    
    body.public .wrapper {
       width: 92%
    }

    .j-forms .header p {
        padding: 10px 0
    }

    .popup-list-open>.popup-list-wrapper {
        width: 100%
    }

    .popup-list-open {
        position: static
    }

    .j-forms [class*=span] {
        margin-right: 0;
        width: 100%
    }

    .j-forms [class*=offset] {
        margin-left: 0
    }

    .j-forms .label-center {
        height: 14px;
        line-height: 14px;
        text-align: left;
        padding-bottom: 3px
    }

    .j-forms .checkbox-toggle:last-child,.j-forms .checkbox:last-child,.j-forms .radio-toggle:last-child,.j-forms .radio:last-child,.wrapper-1000 .j-forms .checkbox-toggle:last-child,.wrapper-1000 .j-forms .checkbox:last-child,.wrapper-1000 .j-forms .radio-toggle:last-child,.wrapper-1000 .j-forms .radio:last-child {
        margin-bottom: 4px
    }

    .wrapper-1000 .j-forms [class*=span] {
        margin-right: 0;
        width: 100%
    }

    .wrapper-1000 .j-forms [class*=offset] {
        margin-left: 0
    }

    .wrapper-1000 .j-forms .label-center {
        height: 14px;
        line-height: 14px;
        text-align: left;
        padding-bottom: 3px
    }
}

@media (max-width: 600px) {

   .popup-buttons {
       flex-direction: column;
       align-items: center;
    }

   .popup-buttons button {
       width: 200px;
    }

    .container {
        padding: 5px 0 0
    }

    .footer p {
        letter-spacing: 1px
    }

    .right-pnl {
        width: 39%
    }

    .j-forms .steps {
        margin: 10px 0!important;
        width: 35px;
        height: 40px!important;
        padding-top: 5px!important
    }

    .j-forms .steps p {
        display: none
    }
    
    body.coach .primary-btn,
    body.staff .primary-btn,
    body.admin .primary-btn,
    body.user .primary-btn  {
        width: 75%!important;
    }
}

@media (max-width:568px) {
    
    body.public .wrapper {
        width: 94%
    } 

    .container {
        padding: 0
    }

    .header h1 {
        font-size: 33px;
        margin: 60px 0 35px
    }

    .left-pnl,.right-pnl {
        width: 100%
    }
    
    .ac-info p {
        font-size: 13px
    }
    
    .right-pnl h2 {
        font-size: 15px
    }

    .right-pnl p {
        letter-spacing: .5px
    }
}

@media (max-width:480px) {

    body.public .wrapper {
        width: 96%
    }

    .left-pnl,.right-pnl {
        width: 100%
    }

    .qr .qr-testo {
        height: 170px;
    }

    .qr h2 {
        font-size: 36px;
    }

    .footer p {
        line-height: 1.8em;
        padding: 3em 0
    }

    .header h1 {
        font-size: 30px;
        letter-spacing: 1px
    }
}

@media screen and (max-width:460px) {

    div.dt-button-collection.fixed.columns {
        margin-left: -100px
    }

    div.dt-button-collection.columns>:last-child {
        width: 200px
    }
}


@media (max-width:440px) {
    .header h1 {
        font-size: 26px;
        letter-spacing: 1px
    }
}

@media all and (max-width:430px) {
    
    .j-tabs-container .j-tabs-label {
        font-size: 10px;
        padding: 11px 18px 13px
    }

    .j-tabs-container .j-tabs-label i {
        font-size: 16px;
        height: 18px
    }

    .j-tabs-container input[type=radio]:checked+.j-tabs-label i {
        color: rgba(0,0,0,.87)
    }

    .j-forms .rating-group .label {
        font-size: 12px
    }

    .j-forms .label {
        margin-bottom: 10px
    }
}

@media (max-width:414px) {
    
    .left-pnl,.right-pnl {
        width: 100%;
        float: none;
        margin: 0 auto
    }

    .ac-info p {
        font-size: 14px;
        margin-top: .9em
    }
    .footer p {
        padding: 2em 0
    }
    .header h1 {
        line-height: 40px;
        margin: 44px 0 28px;
        font-size: 25px
    }
    
}

@media all and (max-width:410px) {
    
    .popup-btm-400 {
        width: 320px
    }

    .popup-btm-400 .j-forms [class*=span] {
        margin-right: 0;
        width: 100%
    }

    .popup-btm-400 .j-forms [class*=offset] {
        margin-left: 0
    }

    .popup-btm-400 .j-forms .label-center {
        height: 14px;
        line-height: 14px;
        text-align: left;
        padding-bottom: 3px
    }
}

@media (max-width:384px) {
    
    .left-pnl,.right-pnl {
        width: 100%
    }

    .ac-info p {
        font-size: 13px;
        margin-top: .7em
    }

    .left-pnl {
        margin-top: 11px
    }

    .right-pnl h2 {
        font-size: 14.5px;
        margin: 3px 0
    }

    .right-pnl p {
        font-size: 12.3px
    }

    .button a {
        font-size: 14px
    }
    .footer p {
        padding: 2em 0
    }
}


@media all and (max-width:380px) {
    
    .popup-list-wrapper .j-forms [class*=span] {
        margin-right: 0;
        width: 100%
    }

    .popup-list-wrapper .j-forms [class*=offset] {
        margin-left: 0
    }

    .popup-list-wrapper .j-forms .label-center {
        height: 14px;
        line-height: 14px;
        text-align: left;
        padding-bottom: 3px
    }
}

@media (max-width:375px) {
    
    body.public .wrapper {
        width: 98%
    }
    .header h1 {
        margin: 35px 0 20px;
        font-size: 23px
    }
}

@media (max-width:320px) {
    
    .left-pnl,.right-pnl {
        width: 100%
    }
    .button a {
        padding: 4px 13px
    }

    .left-pnl {
        margin-top: 3px
    }
    .right-pnl h2 {
        font-size: 14px;
        margin: 1px 0
    }
    .footer p {
        padding: 1em 0
    }
    .header h1 {
        margin: 30px 0 15px;
        font-size: 22px
    }
}


@media (min-width:50em) {
    
    .question-section {
        font-size: .75rem;
    }
}

@media (min-width:62.5em) {
    
    .question-section {
        font-size: 1rem
    }
}
@media (min-width:50em) {
   
   div[class^=cat]>label {
        font-size: 14px
    }
}

@media (min-width:50em) {
    
    .question-wrap label {
        font-size: 1.25em
    }
}