@font-face {
  font-family: "Exo-Thin";
  src: url('../fonts/Exo/static/Exo-Thin.ttf') format('truetype');
  font-weight: 100;
}

@font-face {
  font-family: "Exo-ExtraLight";
  src: url('../fonts/Exo/static/Exo-ExtraLight.ttf') format('truetype');
  font-weight: 200;
}

@font-face {
  font-family: "Exo-Light";
  src: url('../fonts/Exo/static/Exo-Light.ttf') format('truetype');
  font-weight: 300;
}

@font-face {
  font-family: "Exo-Regular";
  src: url('../fonts/Exo/static/Exo-Regular.ttf') format('truetype');
  font-weight: 400;
}

@font-face {
  font-family: "Exo-Medium";
  src: url('../fonts/Exo/static/Exo-Medium.ttf') format('truetype');
  font-weight: 500;
}

@font-face {
  font-family: "Exo-SemiBold";
  src: url('../fonts/Exo/static/Exo-SemiBold.ttf') format('truetype');
  font-weight: 600;
}

@font-face {
  font-family: "Exo-Bold";
  src: url('../fonts/Exo/static/Exo-Bold.ttf') format('truetype');
  font-weight: 700;
}

@font-face {
  font-family: "Exo-ExtraBold";
  src: url('../fonts/Exo/static/Exo-ExtraBold.ttf') format('truetype');
  font-weight: 800;
}

@font-face {
  font-family: "Exo-Black";
  src: url('../fonts/Exo/static/Exo-Black.ttf') format('truetype');
  font-weight: 900;
}




tr.trHighlighted
{
  background-color:  rgba(255, 255, 150, 0.5)!important;
}
 
tr.trHighlighted td{
  background-color:  rgba(255, 255, 150, 0.5)!important;  
} 

.headerSection {
  background-color: rgba(255, 255, 150, 0.5)!important;
}

  html * {
    font-family: "Exo-Regular"; 
  }
  
  .logoutLink
  {  
    color: #cc0000;
    font-size: 12pt;
  }
  
  h5{
    font-size:19pt;
  }
  
  tr.clickable-row {
      cursor: pointer;      /* manina */
  }
  
  tr.clickable-row:hover {
      background-color: #eee;
  }
  
  button.delButtonX
  {
    width: 30px;
    height: 30px;
    margin: 0;
    padding: 0;
  }

  h3.card-title
  {
    font-family: 'Exo-Medium';
  }

  button
  {
    font-family: 'Exo-Medium';
  }
  

  .asyncloading {
    position: relative;
    opacity: 0.6;
    filter: blur(1px);
    pointer-events: none;
  }
  
  /* Stato salvataggio OK (flash verde + checkmark) */
  .asyncsaved {
    position: relative;
    animation: flashSaved 1.5s ease;
  }
  
  .asyncsaved::after {
    content: "✔";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 2.5rem;
    color: #28a745; /* verde Bootstrap */
    opacity: 0;
    animation: showCheck 1.6s ease;
  }
  
  @keyframes showCheck {
    0% { opacity: 0; transform: translate(-50%, -50%) scale(0.5); }
    30% { opacity: 1; transform: translate(-50%, -50%) scale(1.2); }
    100% { opacity: 0; transform: translate(-50%, -50%) scale(1); }
  }
  
  @keyframes flashSaved {
    0%   { box-shadow: 0 0 0 rgba(0, 255, 0, 0); }
    30%  { box-shadow: 0 0 15px 5px rgba(40, 167, 69, 0.6); }
    100% { box-shadow: 0 0 0 rgba(0, 255, 0, 0); }
  }
  
  /* Stato errore (flash rosso + vibrazione) */
  .asyncerror {
    animation: flashError 0.9s ease;
    position: relative;
  }
  
  .asyncerror::after {
    content: "✖";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 2.5rem;
    color: #dc3545; /* rosso Bootstrap */
    opacity: 0;
    animation: showError 0.9s ease;
  }
  
  @keyframes showError {
    0% { opacity: 0; transform: translate(-50%, -50%) scale(0.5); }
    30% { opacity: 1; transform: translate(-50%, -50%) scale(1.2); }
    100% { opacity: 0; transform: translate(-50%, -50%) scale(1); }
  }
  
  @keyframes flashError {
    0%   { box-shadow: 0 0 0 rgba(255, 0, 0, 0); transform: translateX(0); }
    25%  { box-shadow: 0 0 15px 5px rgba(220, 53, 69, 0.6); transform: translateX(-2px); }
    50%  { transform: translateX(2px); }
    75%  { transform: translateX(-2px); }
    100% { box-shadow: 0 0 0 rgba(255, 0, 0, 0); transform: translateX(0); }
  }
  
  .search-overlay {
    position: relative; /* necessario per pseudo-elemento */
}

.search-overlay::after {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(255,255,255,0.7);
    backdrop-filter: blur(3px);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
    transition: background 0.5s ease-out;
}

/* immagine centrata */
.search-overlay::after {
    background: rgba(255,255,255,0.7) url('../images/favicon256.png') no-repeat center center;
    background-size: 50px 50px; /* dimensione immagine */
}


/* stati animati success/fail */
.search-overlay.success::after {
    background: rgba(0, 255, 0, 0.3); /* verde semi-opaco */
}

.search-overlay.fail::after {
    background: rgba(255, 0, 0, 0.3); /* rosso semi-opaco */
}

.header-half {
  height: 28px !important;       /* altezza forzata */
  min-height: 28px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  overflow: hidden !important;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.header-mid {
  height: 34px !important;       /* altezza forzata */
  min-height: 28px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  overflow: hidden !important;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.card-header
{
  font-weight: 550 ;
}

tr.selectedRow td
{
  background-color: rgba(255, 255, 150, 0.5);
}

td.ellipsis {
    max-width: 100px;      /* scegli tu */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


.global-loader {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.6);
  z-index: 99999;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  color: white;
}


#containerPassword {
    position: relative;
}

.pwd-overlay {
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}

.pwd-loader {
    width: 50px;
    height: 50px;
    border: 5px solid #ddd;
    border-top-color: #0d6efd;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

.pwd-success {
    font-size: 48px;
    color: #28a745;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.d-none {
    display: none;
}



.password-wrapper {
    position: relative;
}

.password-toggle {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 1rem;
    color: #6c757d;
}

.password-toggle:hover {
    color: #212529;
}

.loginMessages
{
  color: #ff0000;
  font-weight: bold;
  font-size: 25pt;
  text-align: center;
}








  @media (max-width: 768px) {
    .championships input,
    .championships select {
        font-size: 16px;   /* evita anche lo zoom iOS */
        padding: 10px;
    }
}


  @media (max-width: 768px) {
    .championships tr {
        display: block;
        margin-bottom: 1rem;
    }

    .championships td {
        display: block;
        width: 100%;
    }

    .championships td:first-child {
        font-weight: bold;
        margin-bottom: 4px;
    }
}



  @media (max-width: 768px) {
    input,
    select {
        font-size: 16px;   /* evita anche lo zoom iOS */
        padding: 10px;
    }
}


  @media (max-width: 768px) {
    tr {
        display: block;
        margin-bottom: 1rem;
    }

    td {
        display: block;
        width: 100%;
    }

    td:first-child {
        font-weight: bold;
        margin-bottom: 4px;
    }
}

body{
background-color: #121212 !important;
  /*  color: #e0e0e0 !important;*/

}