/* -----------------
new components
--------------------*/
/*------ CSS sorttable.js ----*/
table.sortable thead{cursor:pointer;}
table.sortable thead th.sorttable_sorted, table.sortable thead th.sorttable_sorted_reverse{background-color: var(--website-main-color-light)!important;}

/* table */
table.table-padding td,table.table-padding th{padding:8px 16px !important;}
table.table-padding-tiny td,table.table-padding-tiny th{padding:1px 2px !important;}
table.table-padding-xsmall td,table.table-padding-xsmall th{padding:2px 4px !important;}
table.table-padding-small td,table.table-padding-small th{padding:4px 8px !important;}
table.table-padding-small-square td,table.table-padding-small-square th{padding:4px 4px !important;}
table.table-padding-large td,table.table-padding-large th{padding:12px 24px !important;}
table.table-valign-middle td,table.table-valign-middle th{vertical-align:middle !important;}

div.table-title{
  text-align: center!important;
  font-weight: bold;
  letter-spacing: .07272727em;
  font-family: Arial, Helvetica, sans-serif !important;
  text-transform: uppercase;
  font-size: 15px !important;
}
div.table-subtitle{text-align: center!important; font-style: italic; font-size: 12px !important;}

table.money {white-space: nowrap; border:0; width:99%; margin-top:0px; margin-bottom:0px; font-family: Arial, Helvetica, sans-serif; letter-spacing: 0.02em;}
table.money td, table.money th{vertical-align:middle;}
table.money thead {line-height: 14px; border-bottom: 2px solid black; color: black; background-color: inherit; /*#f8f9fa;*/}
table.money th {font-weight: bold;}
table.money tbody tr {border-bottom: 1px dotted #ccc;}

table.money td, table.money th {padding:8px 8px;}
table.money.pd12 td, table.money.pd12 th, table.money tr.pd12 td, table.money tr.pd12 th {padding:1px 2px;}
table.money.pd22 td, table.money.pd22 th, table.money tr.pd22 td, table.money tr.pd22 th {padding:2px 2px;}
table.money.pd24 td, table.money.pd24 th, table.money tr.pd24 td, table.money tr.pd24 th {padding:2px 4px;}
table.money.pd42 td, table.money.pd42 th, table.money tr.pd42 td, table.money tr.pd42 th {padding:4px 2px;}
table.money.pd44 td, table.money.pd44 th, table.money tr.pd44 td, table.money tr.pd44 th {padding:4px 4px;}
table.money.pd62 td, table.money.pd62 th, table.money tr.pd62 td, table.money tr.pd62 th {padding:6px 2px;}
table.money.pd64 td, table.money.pd64 th, table.money tr.pd64 td, table.money tr.pd64 th {padding:6px 4px;}
table.money.pd66 td, table.money.pd66 th, table.money tr.pd66 td, table.money tr.pd66 th {padding:6px 6px;}
table.money.pd68 td, table.money.pd68 th, table.money tr.pd68 td, table.money tr.pd68 th {padding:6px 8px;}
table.money.pd84 td, table.money.pd84 th, table.money tr.pd84 td, table.money tr.pd84 th {padding:8px 4px;}

table.money th.border-bottom {border-bottom: 1px solid black;}
table.money th.narrow-border-bottom {padding:0px 4px;}
table.money th.narrow-border-bottom div {padding:8px 4px; border-bottom: 1px solid black;}
table.money.pd12 th.narrow-border-bottom, table.money tr.pd12 th.narrow-border-bottom {padding:0px 1px;}
table.money.pd12 th.narrow-border-bottom div, table.money tr.pd12 th.narrow-border-bottom div{padding:1px 1px;}
table.money.pd22 th.narrow-border-bottom, table.money tr.pd22 th.narrow-border-bottom {padding:0px 1px;}
table.money.pd22 th.narrow-border-bottom div, table.money tr.pd22 th.narrow-border-bottom div{padding:2px 1px;}
table.money.pd24 th.narrow-border-bottom, table.money tr.pd24 th.narrow-border-bottom {padding:0px 2px;}
table.money.pd24 th.narrow-border-bottom div, table.money tr.pd24 th.narrow-border-bottom div{padding:2px 2px;}
table.money.pd42 th.narrow-border-bottom, table.money tr.pd42 th.narrow-border-bottom {padding:0px 1px;}
table.money.pd42 th.narrow-border-bottom div, table.money tr.pd42 th.narrow-border-bottom div{padding:4px 1px;}
table.money.pd44 th.narrow-border-bottom, table.money tr.pd44 th.narrow-border-bottom {padding:0px 2px;}
table.money.pd44 th.narrow-border-bottom div, table.money tr.pd44 th.narrow-border-bottom div{padding:4px 2px;}
table.money.pd62 th.narrow-border-bottom, table.money tr.pd62 th.narrow-border-bottom {padding:0px 1px;}
table.money.pd62 th.narrow-border-bottom div, table.money tr.pd62 th.narrow-border-bottom div{padding:6px 1px;}
table.money.pd64 th.narrow-border-bottom, table.money tr.pd64 th.narrow-border-bottom {padding:0px 2px;}
table.money.pd64 th.narrow-border-bottom div, table.money tr.pd64 th.narrow-border-bottom div{padding:6px 2px;}
table.money.pd66 th.narrow-border-bottom, table.money tr.pd66 th.narrow-border-bottom {padding:0px 2px;}
table.money.pd66 th.narrow-border-bottom div, table.money tr.pd66 th.narrow-border-bottom div{padding:6px 4px;}
table.money.pd68 th.narrow-border-bottom, table.money tr.pd68 th.narrow-border-bottom {padding:0px 2px;}
table.money.pd68 th.narrow-border-bottom div, table.money tr.pd68 th.narrow-border-bottom div{padding:6px 6px;}
table.money.pd84 th.narrow-border-bottom, table.money tr.pd84 th.narrow-border-bottom {padding:0px 2px;}
table.money.pd84 th.narrow-border-bottom div, table.money tr.pd84 th.narrow-border-bottom div{padding:8px 2px;}

table.money td.badge {padding:4px 4px;}
table.money td.badge div {padding:4px 4px; display: inline-block; text-align: center; border-radius: 4px; color:inherit;}
table.money.pd12 td.badge, table.money tr.pd12 td.badge {padding:1px 1px;}
table.money.pd12 td.badge div, table.money tr.pd12 td.badge div{padding:0px 1px;}
table.money.pd22 td.badge, table.money tr.pd22 td.badge {padding:1px 1px;}
table.money.pd22 td.badge div, table.money tr.pd22 td.badge div{padding:1px 1px;}
table.money.pd24 td.badge, table.money tr.pd24 td.badge {padding:1px 2px;}
table.money.pd24 td.badge div, table.money tr.pd24 td.badge div{padding:1px 2px;}
table.money.pd42 td.badge, table.money tr.pd42 td.badge {padding:2px 1px;}
table.money.pd42 td.badge div, table.money tr.pd42 td.badge div{padding:2px 1px;}
table.money.pd44 td.badge, table.money tr.pd44 td.badge {padding:2px 2px;}
table.money.pd44 td.badge div, table.money tr.pd44 td.badge div{padding:2px 2px;}
table.money.pd62 td.badge, table.money tr.pd62 td.badge {padding:3px 1px;}
table.money.pd62 td.badge div, table.money tr.pd62 td.badge div{padding:3px 1px;}
table.money.pd64 td.badge, table.money tr.pd64 td.badge {padding:3px 2px;}
table.money.pd64 td.badge div, table.money tr.pd64 td.badge div{padding:3px 2px;}
table.money.pd66 td.badge, table.money tr.pd66 td.badge {padding:3px 3px;}
table.money.pd66 td.badge div, table.money tr.pd66 td.badge div{padding:3px 3px;}
table.money.pd68 td.badge, table.money tr.pd68 td.badge {padding:3px 4px;}
table.money.pd68 td.badge div, table.money tr.pd68 td.badge div{padding:3px 4px;}
table.money.pd84 td.badge, table.money tr.pd84 td.badge {padding:4px 2px;}
table.money.pd84 td.badge div, table.money tr.pd84 td.badge div{padding:4px 2px;}

/* ------ toggle bar */
.ac-my-bar-minimal-rounded .ac-sender {
  background-color: var(--website-main-color-light);
  color: var(--website-main-color);
  line-height: 24px;
  padding: 4px 8px;
  border-radius: 8px;
  /*font-weight: bold;*/
  margin-right: 8px;
  margin-bottom: 8px;
}

.ac-my-bar-minimal-rounded .ac-sender.ac-toggle-active, .ac-my-bar-minimal-rounded .ac-sender:hover {
  background-color: var(--website-main-color) !important;
  color: white !important;
}

.ac-my-bar-minimal-box .ac-sender {
  background-color: var(--website-main-color-light);
  color: var(--website-main-color);
  line-height: 15px;
  padding: 4px 8px;
  /*font-weight: bold;*/
  margin-right: 8px;
  margin-bottom: 8px;
}
.ac-my-bar-minimal-box .ac-sender.ac-toggle-active, .ac-my-bar-minimal-box .ac-sender:hover  {
  background-color: var(--website-main-color) !important;
  color: white !important;
}
.ac-my-bar-minimal-box .ac-no-sender{
	background-color: white !important;
	color: var(--website-main-color) !important;
	border-bottom: 1px solid var(--website-main-color);
}

div.ac-receiver, th.ac-receiver, td.ac-receiver, tr.ac-receiver{
  display: none;
}
th.ac-receiver.ac-toggle-active, td.ac-receiver.ac-toggle-active{
  display: table-cell;
}
tr.ac-receiver.ac-toggle-active{
  display: table-row;
}
div.ac-receiver.ac-toggle-active{
  display: block;
}

.ac-my-toggle-button {
    width: 40px;
    height: 20px;
    background-color: lightgray;
    border-radius: 10px;
    position: relative;
    cursor: pointer;
}

.ac-my-toggle-button:before {
    content: '';
    position: absolute;
    top: 1px;
    left: 1px;
    width: 18px;
    height: 18px;
    background-color: white;
    border-radius: 50%;
    transition: 0.4s;
}

.ac-my-toggle-button.toggle-on {
    background-color: var(--website-main-color);
}

.ac-my-toggle-button.toggle-on:before {
    transform: translateX(20px);
}

.ac-my-radio {
  vertical-align: text-top;
  margin-right: 4px;
  accent-color: var(--website-main-color);
}



/* Candle */
.candle-wrap {
  position: relative;
}
.line {
  display: flex;
  justify-content: space-between;
  position: relative;
}
.candle-wrap::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  border-top: 2px solid #adb5bd;
  background: black;
  width: 100%;
  transform: translateY(-50%);
}
.candle {
  width: 100%;
  height: 16px;
}



/* amazon buttons */
a#amazon-like, a.amazon-like {
  display: inline-block;
  background-color: #ffa41c; /* Colore originale di Amazon */
  border-color: #FF8F00;
  color: #000 !important; /* Colore del testo */
  padding: 8px 8px;
  border-radius: 8px;
  text-shadow: 0.3px 0 0 currentColor;
  transition: background-color 0.3s ease;
  margin-bottom: 4px;
  width: 120px;
}
a#amazon-like:hover, a.amazon-like:hover {
  background-color: #fa8900; /* Colore leggermente più scuro al passaggio del mouse */
  /*color: #fff !important;*/ /* Colore del testo */
}

/* amazon img banner con link */
.amazon-hover {
    display: inline-block;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    width: 100%;
}

.amazon-hover:hover {
  box-shadow: 0 0 8px rgba(255, 153, 0, 0.5); /* Amazon orange glow */
}


/* LAZYPORTFOLIOETF Book banner */
 .lzp-banner-light-wrapper {
    width: 100%;
    max-width: 1000px;
    min-width: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background: #f9f9f9;
  }

  .lzp-banner-main {
    width: 100%;
    height: auto;
    background: #ffffff; 
    display: flex; 
    overflow: hidden;
    /*border: 1px solid #efefef; */
    border-radius: 6px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1); 
  }

  .lzp-cover-col {
    width: 35%; 
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: #fdfdfd; 
  }

  .lzp-content-col {
    width: 65%;
    padding: 25px 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 12px; 
  }

  .lzp-book-image {
    max-height: 230px; 
    max-width: 100%;
    object-fit: contain;
    filter: drop-shadow(4px 6px 10px rgba(0,0,0,0.12));
    transition: transform 0.3s ease;
  }
  
  .lzp-banner-main:hover .lzp-book-image {
    transform: scale(1.02) rotate(-1deg);
  }

  .lzp-logo-box {
    align-self: flex-start;
    border-bottom: 2px solid #0f5e80;
    padding-bottom: 4px;
    margin-bottom: 5px;
  }
  
  .lzp-logo-img {
    height: 28px !important;
    width: auto;
  }

  
  .lzp-main-headline {
    color: #1a1a1a;
    font-size: 24px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.01em;
  }
  
  .lzp-brand-accent {
    color: #0f5e80;
  }

  .lzp-main-subtext {
    color: #555555;
    font-size: 14.5px;
    font-weight: 400;
    line-height: 1.4;
    max-width: 90%;
  }

  .lzp-cta-wrap {
    display: flex;
    gap: 15px;
    margin-top: 10px;
  }

  .lzp-btn-action {
    flex: 1;
    text-align: center;
    text-decoration: none;
    padding: 12px 20px;
    font-size: 14px;
    font-weight: 700;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease-in-out;
  }

  .lzp-btn-en {
    background-color: #ff9900;
    color: #111111;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  }
  
  .lzp-btn-en:hover {
    background-color: #e68a00;
    box-shadow: 0 3px 6px rgba(0,0,0,0.15);
    color: inherit;
    border: none;
  }

  .lzp-btn-it {
    background-color: #0f5e80;
    color: #ffffff;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  }

  .lzp-btn-it:hover {
    background-color: #0c4d69;
    box-shadow: 0 3px 6px rgba(0,0,0,0.15);
    color: #ffffff;
    border: none;
  }

  @media (max-width: 768px) {
    .lzp-main-headline {
      font-size: 20px;
    }
    .lzp-main-subtext {
      font-size: 13.5px;
      max-width: 100%;
    }
    .lzp-book-image {
     /* max-height: 190px; */
    }
  }

  @media (max-width: 580px) {
    .lzp-banner-main {
      height: 190px; 
    }
    .lzp-cover-col {
      width: 28%;
      padding: 4px;
    }
    .lzp-content-col {
      width: 72%;
      padding: 15px;
      gap: 6px;
    }
    .lzp-main-headline {
      font-size: 16px;
    }
    .lzp-main-subtext {
      display: none;
    }
    .lzp-logo-img {
      height: 22px !important; 
    }
    .lzp-cta-wrap {
      gap: 8px;
    }
    .lzp-btn-action {
      padding: 8px;
      font-size: 12px;
    }
  }

  @media (max-width: 340px) {
    .lzp-banner-main {
      height: auto; 
      flex-direction: column; 
    }
    
    .lzp-cover-col {
      width: 100%; 
      padding: 10px 10px 0 10px; 
      background: #ffffff;
    }
    
    .lzp-book-image {
      /*
      max-height: 100px;  
      */
    }
    
    .lzp-content-col {
      width: 100%;
      padding: 10px 15px 15px 15px; 
      gap: 8px; 
      align-items: center; 
      text-align: center;
    }
    
    .lzp-logo-box {
      align-self: center; 
    }
    
    .lzp-main-headline {
      font-size: 15px;
    }
    
    .lzp-cta-wrap {
      flex-direction: column;
      gap: 6px;
      width: 100%;
    }
    .lzp-btn-action {
      width: 100%;
      padding: 10px;
    }
  }


/* General container styles for the banner */
.summary-banner {
  padding: 20px 10px;
  background-color: #f8f9fa;
  max-width: 100%;
  text-align: center;
  font-family: Arial, sans-serif;
  margin-top: 1rem;
}

/* Header for the CDS banner title */
.summary-header {
  font-size: 12px;
  color: #444;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  margin-bottom: 6px;
}

/* Styling for the info section with the flag and CDS details */
.summary-info {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 6px;
}

.summary-details {
  font-size: 18px;
  color: #333;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap; /* Permette di andare in verticale su schermi piccoli */
  gap: 10px; /* Spaziatura tra gli elementi */
}

.summary-detail-item {
flex: 1;
text-align: center;
margin: 5px;
width: 400px;
}

.summary-detail-separator {
font-weight: bold;
margin: 0px;
align-self: center;
}

@media (max-width: 800px) {
.summary-details {
  flex-direction: column; /* Gli elementi diventano verticali */
  text-align: center;
}
.summary-detail-separator {
  margin: 0px;
}
}
@media (min-width: 800px) {
.summary-item-right {
  text-align: right;
}
.summary-item-left {
  text-align: left;
}
}

/* Styling for the value section with CDS amount, change, and period */
.summary-value {
  margin-bottom: 12px;
}

.summary-amount {
  /*display: block;*/
  display: flex;
  justify-content: center;
  align-items: baseline;
  font-size: 30px;
  /*line-height: 32px;*/
  margin-bottom: 8px;
}

.summary-value-unit {
  font-size: 22px;
  margin-left: 4px;
}

/* Meta section: change and period on the same line */
.summary-meta {
  font-size: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-shadow: 0.4px 0 0 currentColor;
}

.summary-change {
  padding: 0px 6px;
  border-radius: 5px;
  margin-right: 10px;
  display: flex;
  align-items: center;
}

.summary-change.v2 .fa {display: none;}
.summary-meta.pos-var .fa.fa-caret-up {display: inline-block;}
.summary-meta.zero-var .fa.fa-sort {display: inline-block;}
.summary-meta.neg-var .fa.fa-caret-down {display: inline-block;}

.summary-meta.pos-var {color: #f44336!important;}
.summary-meta.pos-var .summary-change {background-color: #ffdddd;}
.summary-meta.zero-var .summary-change {background-color: #ffffcc;}
.summary-meta.neg-var {color: #009688!important}
.summary-meta.neg-var .summary-change {background-color: #ddffdd;}

.borsa .summary-meta.neg-var {color: #f44336!important;}
.borsa .summary-meta.neg-var .summary-change {background-color: #ffdddd;}
.borsa .summary-meta.pos-var {color: #009688!important}
.borsa .summary-meta.pos-var .summary-change {background-color: #ddffdd;}

.summary-period {
}

/* Footer styling for the last update */
.summary-footer {
  font-size: 12px;
  color: #777;
}


div.table-title {
  text-align: center !important;
  font-weight: bold;
  letter-spacing: .07272727em;
  font-family: Arial, Helvetica, sans-serif !important;
  text-transform: uppercase;
  font-size: 18px !important;
}

div.table-subtitle {
  text-align: center !important;
  font-style: italic;
  font-size: 14px !important;
}


/* style loading in progress */
.ac-loading-background {
  background: linear-gradient(90deg, #e0e0e0 25%, var(--website-main-color-active) 50%, #e0e0e0 75%);
  background-size: 200% 100%;
  animation: wave 1.5s infinite linear;
  color: transparent;
}
div.ac-loading-background { min-height: 40px; }

div[data-async-base-hide] { display: none; }
div[data-async-hide] { display: none !important; }
div[data-async-show] { display: block !important; }

@keyframes wave {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.f16, .f32 {filter: drop-shadow(0 0 0.25px black);}
.f16.flag, .f32.flag {filter: brightness(1.1);}
