/* LESS Document */


@import "/assets/website/common/css/vars";


body
{
  color: @cstm-color-rolling_stone;
  font-family: 'Inter', sans-serif;
  font-size: @font-size-base;
  background-color: @cstm-color-alabaster;

  a
  {
    color: @cstm-color-rolling_stone;
    text-decoration: none;
    &:hover
    {
      //color: darken(@esn-color-hippie_blue, 10%);
      color: @cstm-color-primary_orange;
    }
  }

  .form-select,
  .form-control
  {
    color: @cstm-color-rolling_stone;
    font-size: @font-size-base;
  }

}


.btn-cstm {
  font-family: 'Inter', sans-serif;
  font-size: calc(@font-size-base ~"-" 0.05rem) !important;
  font-weight: 600;
  line-height: normal !important;
  white-space: nowrap;
  letter-spacing: 1px;
  -webkit-border-radius: 0.3rem;
  -moz-border-radius: 0.3rem;
  border-radius: 0.3rem;

  &.btn-cstm-sml
  {
    padding: 0.6rem 1.0rem;
  }

  &.btn-cstm-mdm
  {
    padding: 0.8rem 1.25rem;
  }

  &.btn-cstm-lrg
  {
    padding: 1rem 1.5rem;
  }

  &:focus
  {
    border-color:transparent;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
  }

  &.btn-color-white
  {
    background-color: #ffffff;
    border-color: @cstm-color-primary_orange;
    color: @cstm-color-primary_orange;

    &:hover
    {
      background-color: darken(#ffffff, 10%);
      border-color: darken(@cstm-color-primary_orange, 10%);
      color: @cstm-color-primary_orange;
    }
  }

  &.disabled {
    opacity:1;
    border-color: @cstm-color-athens_gray1;
    background-color: @cstm-color-athens_gray1;
    color: @cstm-color-santas_grey2;
  }

  &:disabled {
    opacity:1;
    border-color: @cstm-color-athens_gray1;
    background-color: @cstm-color-athens_gray1;
    color: @cstm-color-santas_grey2;
  }

  &.btn-color-primary_orange
  {
    background-color: @cstm-color-primary_orange;
    border-color: @cstm-color-primary_orange;
    color: #ffffff;

    &:hover
    {
      background-color: darken(@cstm-color-primary_orange, 10%);
      border-color: darken(@cstm-color-primary_orange, 10%);
      color: #ffffff;
    }
  }

  &.btn-color-mercury
  {
    background-color: @cstm-color-mercury;
    border-color: @cstm-color-mercury;
    color: @cstm-color-shark;

    &:hover
    {
      background-color: darken(@cstm-color-mercury, 10%);
      border-color: darken(@cstm-color-mercury, 10%);
      color: @cstm-color-shark;
    }
  }

  &.btn-color-mischka
  {
    background-color:@cstm-color-mischka;
    border-color: @cstm-color-mischka;
    color: @cstm-color-primary_orange;

    &:hover
    {
      background-color: darken(@cstm-color-mischka, 10%);
      border-color: darken(@cstm-color-mischka, 10%);
      color: @cstm-color-primary_orange;
    }
  }

  &.btn-color-shark
  {
    background-color: @cstm-color-shark;
    border-color: @cstm-color-shark;
    color: #ffffff;

    &:hover
    {
      background-color: lighten(@cstm-color-shark, 10%);
      border-color: lighten(@cstm-color-shark, 10%);
      color: #ffffff;
    }
  }

  &.disabled {
    opacity:1;
    border-color: @cstm-color-athens_gray1;
    background-color: @cstm-color-athens_gray1;
    color: @cstm-color-santas_grey2;
  }

  &:disabled {
    opacity:1;
    border-color: @cstm-color-athens_gray1;
    background-color: @cstm-color-athens_gray1;
    color: @cstm-color-santas_grey2;
  }

  &.btn_active::after
  {
    font-family: "Font Awesome 5 Free";
    font-size: calc(@font-size-base ~"-" 0.15rem);
    content: " \f058";
  }
}


/* // ACCESS **********/

#access_box
{
  //width: 100%;
  //max-width: 35rem;
  background-color: #ffffff;

  #access_box-validation_errors
  {
    text-align: center;

    p
    {
      margin:0;
      padding-bottom:0.35rem;
      font-size: calc(@font-size-base ~"-" 0.10rem);
      line-height: 1rem;

      &:last-child
      {
        padding-bottom:0;
      }
    }
  }

  #access_box-label
  {
    border-bottom: 1px solid @cstm-color-iron;

    span
    {
      font-size: calc(@font-size-base ~"+" 0.35rem);
      font-weight: bold;
    }
  }

}

/********** ACCESS // */


/* // HEADER **********/

header {
  height: 8rem;
  -webkit-border-radius: 0 0 1rem 1rem;
  -moz-border-radius: 0 0 1rem 1rem;
  border-radius: 0 0 1rem 1rem;
  background-image: -webkit-linear-gradient(106deg, @cstm-color-sea_buckthorn2 31%, @cstm-color-sea_buckthorn1 51%);
  background-image: -o-linear-gradient(106deg, @cstm-color-sea_buckthorn2 31%, @cstm-color-sea_buckthorn1 51%);
  background-image: linear-gradient(106deg, @cstm-color-sea_buckthorn2 31%, @cstm-color-sea_buckthorn1 51%);
}

#header-info_box {
  color: #ffffff;
  line-height: 1.4rem;
}

#header-info_box-data {
}

.header-info_box-text {
  font-size: calc(@font-size-base ~"-" 0.1rem);
  font-weight: 600;
  line-height: 1.1rem;
}

#header-user-navbar
{
  a.nav-link {
    color:#ffffff;
    line-height: 1.1rem;

    span
    {
      font-size: calc(@font-size-base ~"+" 0.05rem);
      font-weight: 600;
    }

    &:after {
      border-top: 0.5em solid;
      border-right: 0.5em solid transparent;
      border-bottom: 0;
      border-left: 0.5em solid transparent;
    }
  }

  ul
  {
    padding: 0.5rem;
  }

 }

#header-user-tbl
{

  margin: 0;

  td
  {
    vertical-align: middle;

    &.header-user-tbl-td-link,
    &.header-user-tbl-td-exit
    {
      padding: 0.35rem 0.25rem;

     a
     {
       color: @cstm-color-rolling_stone;
       display: block;
       width: 100%;
       clear: both;
       font-size: @font-size-base;
       font-weight: 400;
       white-space: nowrap;
       &:hover
       {
         color: @cstm-color-rolling_stone;
       }
     }
    }

    &.header-user-tbl-td-pill
    {
      padding: 0.35rem 0.25rem;
      text-align: right;

      span
      {
        color: @cstm-color-primary_orange;
        //font-size: @font-size-base;
        font-size: calc(@font-size-base ~"-" 0.20rem);
        font-weight: 600;
        background-color: #ffffff;
        border:2px solid @cstm-color-primary_orange;
      }
    }

  }

  tr
  {
    &:hover
    {
      background-color: @cstm-color-athens_gray2;

      td
      {
        a
        {
          color: @cstm-color-rolling_stone;
        }
      }

    }

    &:last-child
    {
      td
      {
        border-top: 1px solid @cstm-color-mischka;
      }
    }

  }

}

/********** HEADER // */


/* // CONTENT **********/

// MAIN
.main {
  padding-top: 8rem;
  padding-bottom: 4rem;
}

#account_label
{
  background-color: @cstm-color-merino;
  border:1px solid @cstm-color-primary_orange;
  font-weight: bold;

  i,
  span
  {
    color:@cstm-color-primary_orange;
  }
}

// BREADCRUMB
#container_breadcrumb {
  margin-top: 0.5rem;
  margin-bottom: 1.5rem;

  .row {
    border-bottom: 1px dashed @cstm-color-mischka;
    padding-bottom: 0.5rem;
  }

}

ol.breadcrumb {
  padding: 0.75rem 0;
  margin-bottom: 0;

  li.active {
    color: @cstm-color-primary_orange;
    font-weight: 500;
  }

  a {
    color: @cstm-color-rolling_stone;

    &:hover {
      color: @cstm-color-primary_orange;
    }

  }

}

.btn_breadcrumb {
  padding: 0.3rem 1rem;
  margin-top: 0.3rem;
  color: @cstm-color-waterloo;
  background-color: @cstm-color-ghost;
  border-color: @cstm-color-ghost;
  font-family: 'Barlow', sans-serif;
  font-size: calc(@font-size-base ~"-" 0.20rem);
  font-weight: 500;
  letter-spacing: 1px;
  -webkit-border-radius: 0.25rem;
  -moz-border-radius: 0.25rem;
  border-radius: 0.25rem;

  &:first-child {
    margin-top: 0;
  }

  &:focus {
    border-color:transparent;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
  }

  &:hover {
    color: @cstm-color-waterloo;
    background-color: @cstm-color-ghost;
  }

  i {
    margin-right: 0.5rem;
  }

}

#btn_breadcrumb_red {
  color: #ffffff;
  background-color: #dc3545;
  border-color: #dc3545;

  &:focus {
    border-color:transparent;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
  }

  &:hover {
    color: #ffffff;
    background-color: #dc3545;
    border-color: #dc3545;
  }

}

// TABLE
.common-tbl {
  background-color: #ffffff;
  border-radius: 0.5rem;

  th {
    padding: 1.2rem 1rem;
    color: @cstm-color-shark;
    font-size: calc(@font-size-base ~"+" 0.05rem);
    font-weight: 700;
    background-color: @cstm-color-athens_gray3;
    border-bottom: 1px solid @cstm-color-santas_grey1;

    &:first-child
    {
      border-radius: 0.5rem 0 0 0;
    }

    &:last-child
    {
      border-radius: 0 0.5rem 0 0;
    }
  }

  tr
  {
    &:last-child
    {
      td
      {
        border-bottom:0;
      }
    }

    &.tr_off
    {
      td
      {
        color: @cstm-color-santas_grey1;

        .item-sml,
        .item-lrg
        {
          color: @cstm-color-santas_grey1;
        }

      }
    }

    td
    {
      padding: 0.6rem 0.7rem;
      border-bottom: 1px solid @cstm-color-mischka;
      color: @cstm-color-shark;

      .item-sml
      {
        color: @cstm-color-shark;
        font-size: calc(@font-size-base ~"-" 0.15rem);
      }

      .item-lrg
      {
        color: @cstm-color-shark;
        font-size: calc(@font-size-base ~"+" 0.20rem);
        font-weight: 600;
      }
    }

    a
    {
      &:hover
      {
        color: @cstm-color-primary_orange;
      }
    }

  }

}

// MODAL
.modal-header
{
  background-color: @cstm-color-athens_gray3;
  border-bottom: 1px solid @cstm-color-santas_grey1;

  .modal-paziente_box,
  #modal-paziente_box
  {

    .modal-paziente_box-title,
    #modal-paziente_box-title {
      font-size: calc(@font-size-base ~"+" 0.25rem);
      font-weight: 500;
      line-height: calc(@font-size-base ~"+" 0.25rem);
    }

    .modal-paziente_box-nomecognome,
    #modal-paziente_box-nomecognome {
      font-style: italic;
      font-size: @font-size-base;
      line-height: @font-size-base;
    }

    .modal-paziente_box-iscrizione,
    #modal-paziente_box-iscrizione {
      font-style: italic;
      font-size: calc(@font-size-base ~"-" 0.15rem);
    }

    .modal-paziente_box-cellulare,
    #modal-paziente_box-cellulare,
    .modal-paziente_box-telefono,
    #modal-paziente_box-telefono {
      color: #777777;
      font-style: italic;
      font-size: calc(@font-size-base ~"-" 0.15rem);
    }

  }

  .modal-professionista_box,
  #modal-professionista_box
  {

    .modal-professionista_box-title,
    #modal-professionista_box-title {
      font-size: calc(@font-size-base ~"+" 0.25rem);
      font-weight: 500;
      line-height: calc(@font-size-base ~"+" 0.25rem);
    }

    .modal-professionista_box-nomecognome,
    #modal-professionista_box-nomecognome {
      font-style: italic;
      font-size: @font-size-base;
      line-height: @font-size-base;
    }
  }

}

.modal-body
{

  .modal-attivita_box-intro,
  #modal-attivita_box-intro,
  .modal-disponibilita_box-intro,
  #modal-disponibilita_box-intro,
  .modal-consulenza_box-intro,
  #modal-consulenza_box-intro {
   font-size: calc(@font-size-base ~"+" 0.65rem);
  }

  .modal-attivita_box-nome,
  #modal-attivita_box-nome {
    font-size: calc(@font-size-base ~"+" 0.65rem);
    font-weight: 600;
  }

  #modal-attivita_box-numero_per_call,
  #modal-attivita_box-numero_medico_per_call {
    span {
      display: inline-block;
      padding: 0.8rem 1.8rem;
      background-color: #e9e9e9;
      color: #3f3f3f;
      font-size: calc(@font-size-base ~"+" 0.85rem);
      font-weight: 500;
      border-radius: 2rem;
    }
  }

  #modal-attivita_box-nome_paziente,
  #modal-attivita_box-nome_medico {
    font-size: calc(@font-size-base ~"+" 0.25rem);
    line-height: calc(@font-size-base ~"+" 0.25rem);
  }

}

  .modal-esito_box-txt,
  #modal-esito_box-txt {
    font-size: calc(@font-size-base ~"+" 0.25rem);
    line-height: calc(@font-size-base ~"+" 0.25rem);
  }

  .modal-consulenza_fisioterapica_box-txt,
  #modal-consulenza_fisioterapica_box-txt,
  .modal-consulenza_infermieristica_box-txt,
  #modal-consulenza_infermieristica_box-txt,
  .modal-consulenza_nutrizionale_box-txt,
  #modal-consulenza_nutrizionale_box-txt,
  .modal-consulenza_psicologica_box-txt,
  #modal-consulenza_psicologica_box-txt
  {
    font-size: 1.2rem;
    font-weight: 600;
    line-height: 1.2rem;
  }

    .modal-footer
    {

      .modal-note_save_box,
      #modal-note_save_box {
        background-color: @cstm-color-alabaster;
      }

      .modal-note_save_box-txt,
      #modal-note_save_box-txt {
        font-weight: 600;
        font-size: calc(@font-size-base ~"+" 0.25rem);
        line-height: calc(@font-size-base ~"+" 0.25rem);
      }

      .modal-note_save_box-no,
      #modal-note_save_box-no,
      .modal-note_save_box-si,
      #modal-note_save_box-si {
        font-weight: 600;
        font-size: calc(@font-size-base ~"+" 0.25rem);
        line-height: calc(@font-size-base ~"+" 0.25rem);
        text-align: center;
      }

    }

    .professionisti-pazienti-cancellazione-modal,
    .medici-pazienti-cancellazione-modal,
    #attivita-modal-esegui
    {
      #modal-note_save_box,
      #modal-note_save_box-note_box,
      #modal-note_save_box-no,
      #modal-note_save_box-si,
      #modal-note_save_box-save_btn
      {
        display: none;
      }
    }

    // CARD
    .cst_card {
      background-color: #ffffff;
      margin-bottom: 2rem;
      border-radius: 0.5rem;

      .cst_card-header {
        padding: 1rem;
        color: @cstm-color-shark;
        font-size: calc(@font-size-base ~"+" 0.05rem);
        font-weight: 700;
        background-color: @cstm-color-athens_gray3;
        border-bottom: 1px solid @cstm-color-santas_grey1;
        border-radius: 0.5rem 0.5rem 0 0;

        button
        {
          position: relative;
          border: 0;
          padding: 0;
          color: @cstm-color-shark;
          font-size: calc(@font-size-base ~"+" 0.05rem);
          font-weight: 700;
          text-decoration: none;
          box-shadow: none;

          &:hover,
          &:focus,
          :active
          {
            color: @cstm-color-shark;
            text-decoration: none;
          }
        }

        button[aria-expanded="true"]:before
        {
          position: absolute;
          content: "\f077";
          font-family: 'Font Awesome\ 5 Free';
          font-size: 1.6rem;
          top: 0.7rem;
          right: 1.8rem;
        }

        button[aria-expanded="false"]:before
        {
          position: absolute;
          content: "\f078";
          font-family: 'Font Awesome\ 5 Free';
          font-size: 1.6rem;
          top: 0.8rem;
          right: 1.8rem;
        }

      }

      .cst_card-body {
        padding: 1rem;
      }

    }


    .common-validation_errors
    {
      //text-align: center;

      p
      {
        margin:0;
        padding-bottom:0.35rem;
        font-size: calc(@font-size-base ~"-" 0.10rem);
        line-height: 1rem;

        &:last-child
        {
          padding-bottom:0;
        }
      }
    }

    /********** CONTENT // */


    /* // FOOTER **********/
    footer {
      border-top: 1px solid @cstm-color-silver;
      background-color:@cstm-color-concrete;

      a {
        color: @cstm-color-rolling_stone;

        &:hover
        {
          color: @cstm-color-primary_orange;
        }
      }

    }


/********** FOOTER // */


// MIXIN LESS //
///////////////////////////////////////////