:root {
  --gen-purple: #15528a;
  --gen-purple2: #103f6c;
  --gen-aqua: #d51f2b;
  --gen-turquoise: #e53b45;
  --gen-fuchsia: #d51f2b;
  --gen-blue: #15528a;
  --gen-light-purple: #dce7f1;
  --gen-light-violet: #b8cee0;
  --gen-white-snow: #f3f6f9;
  --gen-background-white: #f6f8fa;
  --gen-background-pink: #f8fafc;
}

body {
  background:
    radial-gradient(circle at 12% 18%, rgba(21,82,138,.09), transparent 31rem),
    radial-gradient(circle at 88% 76%, rgba(213,31,43,.06), transparent 28rem),
    #f7f9fb;
  color: #263746;
}

.gen_header {
  height: 7.2em;
  border-bottom: 1px solid #dce3e9;
  background: rgba(255,255,255,.97);
  color: #263746;
  box-shadow: 0 .35rem 1.4rem rgba(26,54,79,.08);
}

.gen_header_inside { width: min(82%, 1120px); }
.gen_logo { flex: 1 1 auto; min-width: 0; }
.wirelessgroup-logo {
  display: block;
  width: auto;
  height: 4.8em;
  max-width: 22em;
  object-fit: contain;
  cursor: pointer;
}

.logoAreaClienti,
.greeting,
.paginaaperta,
.paginaaperta a { color: #33495c; }

/* Mantiene "Benvenuto" e il nome cliente sulla stessa linea di base. */
.logoAreaClienti,
.greeting {
  display: inline-flex !important;
  align-items: center;
  vertical-align: middle;
  line-height: 1.35;
}

#burger > a { color: #15528a; }
#burger > a .fa-bars { font-size: 2.25em; }
.izeno-customer-voice {
  display: inline-flex;
  flex: 0 0 auto;
  min-height: 3.2rem;
  margin: 0 1rem 0 auto;
  padding: .4rem .75rem .4rem .45rem;
  align-items: center;
  gap: .55rem;
  border: 1px solid #83bea0;
  border-radius: 999px;
  background: #edf8f1;
  color: #18673c;
  font: inherit;
  text-align: left;
  opacity: 1;
  cursor: not-allowed;
  box-shadow: 0 .25rem .8rem rgba(24,103,60,.1);
}
.izeno-customer-mark {
  display: grid;
  flex: 0 0 2.25rem;
  width: 2.25rem;
  height: 2.25rem;
  place-items: center;
  border-radius: 50%;
  background: #157347;
  color: #fff;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: -.08em;
}
.izeno-customer-copy { display: grid; gap: .05rem; line-height: 1.1; }
.izeno-customer-copy strong { font-size: .88rem; white-space: nowrap; }
.izeno-customer-copy small { color: #557565; font-size: .64rem; font-weight: 600; }
.izeno-menu-voice {
  display: flex;
  min-height: 3.65rem;
  padding: .55rem 3.5rem .55rem .85rem;
  align-items: center;
  gap: .75rem;
  border-bottom: 1px solid #cce3d4;
  border-radius: .65rem .65rem 0 0;
  background: #edf8f1;
  color: #18673c;
  cursor: not-allowed;
}
.izeno-menu-voice > span:last-child { display: grid; gap: .12rem; }
.izeno-menu-voice strong { font-size: .95rem; }
.izeno-menu-voice small { color: #557565; font-size: .68rem; font-weight: 600; }
.dropdown { border-top: .22rem solid #d51f2b; }
.dropdown i { color: #15528a; }
#home-menuBtn,
.logoutAreaClienti { align-items: center; gap: .8em; }
#home-menuBtn i,
.logoutAreaClienti i { width: 1.35em; font-size: 2.2em; text-align: center; }

/* Menu dell'area autenticata */
.dropdown {
  position: fixed;
  inset: 50% auto auto 50%;
  width: min(920px, calc(100vw - 3rem));
  height: min(620px, calc(100vh - 3rem));
  min-height: 0;
  margin: 0;
  padding: 1.7rem 2rem 1.45rem;
  overflow: hidden;
  transform: translate(-50%, -50%);
  column-count: initial !important;
  border: 1px solid #d9e2e9;
  border-top: .28rem solid #d51f2b;
  border-radius: 1.1rem;
  background: #fff;
  color: #264258;
  box-shadow: 0 1.5rem 4rem rgba(22,48,70,.24);
}
.dropdown:not(.hide) {
  display: grid;
  grid-template-rows: auto auto minmax(0,1fr) auto;
  gap: .75rem;
}
.dropdown.hide { display: none; }
.dropdown > li {
  width: 100%;
  min-height: 0;
  margin: 0;
}
#li-speciale {
  position: absolute;
  z-index: 3;
  top: .85rem;
  right: .85rem;
  width: auto;
  height: auto;
  min-height: 0;
}
#li-speciale .fa-times {
  position: static;
  display: grid;
  width: 2.55rem;
  height: 2.55rem;
  place-items: center;
  border-radius: 50%;
  background: #edf3f7;
  color: #15528a;
  font-size: 1.2rem;
}
#li-speciale .fa-times:hover { background: #feecef; color: #d51f2b; }
#home-menuBtn,
.logoutAreaClienti {
  justify-content: flex-start;
  width: 100%;
  height: auto;
  min-height: 3.65rem;
  padding: .55rem 3.5rem .55rem .85rem;
  border: 0;
  border-bottom: 1px solid #dce5eb;
  color: #15528a;
}
.logoutAreaClienti {
  border-top: 1px solid #dce5eb;
  border-bottom: 0;
}
.dropdown .all-elements {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  align-content: start;
  gap: .55rem .75rem;
  width: 100% !important;
  min-height: 0 !important;
  padding: .15rem .2rem;
  overflow-y: auto;
}
.all-elements .menuSelector {
  width: 100%;
  min-width: 0;
  margin: 0;
  font-size: .82rem;
}
.all-elements .menuSelector .single-element {
  display: flex;
  width: 100%;
  height: 4.35rem !important;
  min-height: 4.35rem;
  padding: .5rem .75rem;
  align-items: center;
  justify-content: flex-start;
  border: 1px solid #dce5eb;
  border-radius: .7rem;
  background: #fff;
  color: #174f82;
  box-shadow: none !important;
  white-space: normal;
}
.all-elements .menuSelector .single-element:hover {
  border-color: #9db8cd;
  background: #f5f9fc;
}
.all-elements .single-element .img-container {
  display: flex;
  flex: 0 0 3.5rem;
  width: 3.5rem;
  height: 100%;
  align-items: center;
  justify-content: center;
}
.all-elements .single-element .para-container {
  display: flex;
  flex: 1;
  width: auto;
  height: 100%;
  min-width: 0;
  align-items: center;
}
.all-elements .single-element img {
  width: auto;
  max-width: 2.45rem;
  height: 2.45rem;
  margin: 0 .65rem 0 0;
  object-fit: contain;
  filter: hue-rotate(53deg) saturate(.72);
}
.all-elements .single-element p { margin: 0; line-height: 1.25; }

.login_block {
  width: min(58%, 720px);
  min-height: 23em;
  padding: 2.4em 2em;
  border: 1px solid #e0e7ed;
  border-top: .35em solid #15528a;
  background: rgba(255,255,255,.96);
  box-shadow: 0 1.1em 3.2em rgba(26,54,79,.13);
}

.login_testoup {
  margin-bottom: 1.5em;
  color: #53687a;
  font-size: 1.2em;
  letter-spacing: -.01em;
}
.login_testoup b { color: #15528a; }

.portainput,
.portapass {
  border-color: #b9c8d5;
  background-image: none;
  background-color: #fff;
  box-shadow: 0 .2em .7em rgba(26,54,79,.05);
}
.portainput::before,
.portapass::before {
  position: absolute;
  z-index: 2;
  left: 1.05em;
  top: 50%;
  transform: translateY(-50%);
  color: #15528a;
  font-family: "Font Awesome 5 Free";
  font-size: 1.25em;
  font-weight: 900;
  pointer-events: none;
}
.portainput::before { content: "\f007"; }
.portapass::before { content: "\f023"; }
.portainput:focus-within,
.portapass:focus-within {
  border-color: #15528a;
  box-shadow: 0 0 0 .22em rgba(21,82,138,.12);
}

.login_block_ok,
.pulsanteavanti,
.pulsantemodifica {
  background: linear-gradient(100deg, #15528a, #0e3d68);
  color: #fff;
  box-shadow: 0 .45em 1.1em rgba(21,82,138,.18);
}
.login_block_ok:hover,
.pulsanteavanti:hover,
.pulsantemodifica:hover {
  background: #d51f2b;
  color: #fff;
}

.azionipacchetto .pulsantemodifica,
.azionipacchetto .pulsantemodifica.disattiva {
  background-color: #15528a !important;
  background-image: linear-gradient(100deg, #15528a, #0e3d68);
  color: #fff;
}
.azionipacchetto .pulsantemodifica:hover,
.azionipacchetto .pulsantemodifica.disattiva:hover {
  background-color: #d51f2b !important;
  background-image: none;
  color: #fff;
}
.pacchettotitolo { background-color: #15528a; color: #d51f2b; }
.pacchettocosto { color: #15528a; }
.pacchettocosto i { color: #d51f2b; }

.lostpassword,
.paginaaperta a,
.footer a { color: #15528a; }
.lostpassword:hover,
.paginaaperta a:hover,
.footer a:hover { color: #d51f2b; }

.ricordami,
.ricordamisel {
  flex: 0 0 auto;
  width: auto;
  min-height: 1.55em;
  padding-left: 3.8em;
  background-image: none !important;
}
.ricordami-pw-box { gap: 2.1em; }
.lostpassword {
  flex: 0 0 auto;
  width: auto;
  margin-left: .8em;
  white-space: nowrap;
}
.ricordami::before,
.ricordami::after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  transition: .2s ease;
}
.ricordami::before {
  width: 3em;
  height: 1.55em;
  border: 1px solid #9dafbd;
  border-radius: 999px;
  background: #dce4ea;
}
.ricordami::after {
  left: .2em;
  width: 1.15em;
  height: 1.15em;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 .1em .3em rgba(26,54,79,.25);
}
.ricordamisel::before { border-color: #15528a; background: #15528a; }
.ricordamisel::after { transform: translate(1.42em,-50%); }

.paginaPrincipaleR1 .intab,
.single-element,
.dettaglioTech {
  border-color: #d7e0e8;
  background-color: #fff;
  box-shadow: 0 .55em 1.6em rgba(26,54,79,.08);
}
.paginaPrincipaleR1 .intab:hover,
.single-element:hover { border-color: #15528a; }
.paginaPrincipaleR1 .intab img { filter: hue-rotate(53deg) saturate(.72); }

.centropagina,
.nomeOfferta,
.tabselector,
h1,
h2 { color: #15528a; }

.genvoice-page-logo {
  display: block;
  width: 7.5rem;
  height: 7.5rem;
  margin: 0 auto .45rem;
  border-radius: 1.15rem;
  object-fit: contain;
}

.ticket { border-color: #15528a; }
.ticket h1 {
  position: relative;
  padding-left: 2.25em;
  background-image: none;
}
.ticket h1::before {
  content: "?";
  position: absolute;
  left: 0;
  top: 50%;
  display: grid;
  width: 1.35em;
  height: 1.35em;
  place-items: center;
  transform: translateY(-50%);
  border-radius: .32em .32em .32em 0;
  background: #d51f2b;
  color: #fff;
  font-size: .72em;
  font-weight: 800;
}
.ticket h1 b { color: #d51f2b; }
.ticket h1.support-brand {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .75rem 1.1rem;
  min-height: 0;
  padding-left: 0;
  background: none;
}
.ticket h1.support-brand::before { display: none; }
.support-brand > span { color: #15528a; }
.support-brand > img {
  display: block;
  width: min(15rem, 52%);
  height: auto;
}
.support-brand > a,
.contract-brand > a,
.documents-brand > a,
.customer-data-brand > a {
  display: inline-flex;
  flex: 0 1 12rem;
  width: min(12rem, 42vw);
  align-items: center;
}
.support-brand > a img,
.contract-brand > a img,
.documents-brand > a img,
.customer-data-brand > a img {
  display: block;
  width: 100%;
  height: auto;
}
.tipoticket {
  border: 1px solid #d8e2e9;
  background: #fff;
  color: #15528a;
}
.tipoticket:hover {
  border-color: #d51f2b;
  background: #fff5f6;
  color: #b71925;
}
.tipoticket.tipoticketsel {
  border-color: #15528a;
  background: #15528a;
  color: #fff;
}
.tipoticket.tipoticketsel:hover {
  border-color: #d51f2b;
  background: #d51f2b;
  color: #fff;
}
#noteticket:focus {
  outline: 2px solid rgba(21,82,138,.2);
  box-shadow: 0 0 0 .2em rgba(21,82,138,.08);
}

/* Fatture */
.tabfatture h1,
.tabvoltura h1,
.tabdocumenti h1,
.tabshop h1 {
  position: relative;
  padding-left: 2em;
  background-image: none;
}
.tabfatture h1::before,
.tabvoltura h1::before,
.tabdocumenti h1::before,
.tabshop h1::before {
  position: absolute;
  left: 0;
  color: #d51f2b;
  font-weight: 800;
}
.tabfatture h1::before { content: "▤"; }
.tabvoltura h1::before { content: "▥"; }
.tabdocumenti h1::before { content: "▱"; }
.tabshop h1::before { content: "▢"; }
.tabvoltura h1.contract-brand {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .75rem 1.1rem;
  padding-left: 0;
}
.tabvoltura h1.contract-brand::before { display: none; }
.contract-brand > span { color: #15528a; }
.contract-brand > img {
  display: block;
  width: min(15rem, 52%);
  height: auto;
}
.customer-data-brand {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .75rem 1.1rem;
}
.customer-data-brand > span { color: #15528a; }
.customer-data-brand > img {
  display: block;
  width: min(15rem, 52%);
  height: auto;
}
.tabdocumenti h1.documents-brand {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .75rem 1.1rem;
  padding-left: 0;
}
.tabdocumenti h1.documents-brand::before { display: none; }
.documents-brand > span { color: #15528a; }
.documents-brand > img {
  display: block;
  width: min(15rem, 52%);
  height: auto;
}
.documents-empty {
  color: #15528a;
  font-weight: 700;
}
.fatture th { color: #60788c; }
.fatture tr:nth-child(even) { background-color: #eef4f8; }
.azioneweb { background-color: #d51f2b; }
.sceglianno { border: 1px solid #d8e2e9; background: #fff; }
.sceglianno i { background-color: #15528a; }

/* Contratto */
.modifiche { border: 1px solid #d8e2e9; background: #fff; }
.modifiche h2 { color: #d51f2b; }
.pulsantevr {
  background-color: #15528a;
  background-image: linear-gradient(100deg, #15528a, #0e3d68);
}
.pulsantevr:hover { background: #d51f2b; }

/* Documenti */
.singolodocumento a {
  position: relative;
  border: 1px solid #d8e2e9;
  background-color: #fff;
  background-image: none;
  color: #15528a;
}
.singolodocumento a::after {
  content: "→";
  position: absolute;
  right: 1.2em;
  color: #d51f2b;
  font-size: 1.45em;
}
.singolodocumento a:hover {
  border-color: #d51f2b;
  background-color: #d51f2b;
  background-image: none;
  color: #fff;
}
.singolodocumento a:hover::after { color: #fff; }

/* Gen Shop */
.tabshop h1.shop-brand {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .75rem 1.1rem;
  min-height: 0;
  margin-bottom: 1rem;
  padding-left: 0;
  background: none;
}
.tabshop h1.shop-brand::before { display: none; }
.shop-brand > span { color: #15528a; }
.shop-brand img {
  display: block;
  width: min(15rem, 52%);
  height: auto;
}
.shop-brand > a {
  display: inline-flex;
  flex: 0 1 15rem;
  width: min(15rem, 52vw);
  align-items: center;
}
.shop-brand > a img {
  display: block;
  width: 100%;
  height: auto;
}
.shop-unavailable {
  color: #15528a;
  font-weight: 700;
}
.carrello1 {
  border-color: #15528a;
  background-color: #15528a;
}
.carrello2 { border-color: #15528a; }
.carrello3 { border-color: #15528a; }
.carrello3 div { background-color: #15528a; }
.carrello3 div:hover { background-color: #d51f2b; }
.catselected {
  border-bottom-color: #d51f2b;
  color: #15528a;
}
.categoriaprodotto:hover { color: #d51f2b; }
.prodottoShop { border: 1px solid #d8e2e9; background: #fff; }
.titoloprodotto { position: relative; background-color: #15528a; background-image: none; }
.titoloprodotto::after {
  content: "i";
  position: absolute;
  right: .8em;
  width: 1.25em;
  height: 1.25em;
  border: 1px solid #fff;
  border-radius: 50%;
  color: #fff;
  font-weight: 800;
  line-height: 1.15em;
}
.costoprodotto { border-bottom-color: #d51f2b; }

.codicesconto { background: linear-gradient(100deg, #15528a, #0e3d68); }
.footer {
  height: 7em;
  min-height: 7em;
  border-top: 1px solid #dce3e9;
  background: rgba(255,255,255,.88);
}
.footer .central-container { width: min(82%, 1120px); }
.footer .central-container .footer-container {
  align-items: center;
  color: #53687a;
  text-align: center;
}
.call-us { color: #d51f2b; }

@media (max-width: 652px) {
  .gen_header { height: 7.2em; }
  .gen_header_inside {
    width: 94%;
    flex-wrap: nowrap;
    gap: .28rem;
  }
  .gen_logo {
    display: flex;
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
  }
  .wirelessgroup-logo {
    flex: 0 1 10rem;
    width: min(10rem, 34vw);
    height: auto;
    max-height: 3.8em;
  }
  .gen_logo table {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
  }
  .logoAreaClienti,
  .greeting,
  .paginaaperta {
    width: auto;
    margin-left: .35rem;
    padding-left: 0;
  }
  #greet {
    display: inline;
    overflow-wrap: anywhere;
  }
  #burger {
    flex: 0 0 2.8rem;
    width: 2.8rem;
    min-width: 2.8rem;
  }
  #burger > a { justify-content: center; }
  .izeno-customer-voice {
    width: 3.25rem;
    min-width: 3.25rem;
    min-height: 3.55rem;
    margin: 0 .48rem 0 0;
    padding: .18rem .12rem;
    flex-direction: column;
    justify-content: center;
    gap: .08rem;
    border-radius: .75rem;
    text-align: center;
    box-shadow: none;
  }
  .izeno-customer-mark {
    flex-basis: 1.65rem;
    width: 1.65rem;
    height: 1.65rem;
    font-size: .72rem;
  }
  .izeno-customer-copy strong {
    display: block;
    font-size: .51rem;
    line-height: 1.02;
    white-space: normal;
  }
  .izeno-customer-copy small { display: none; }
  .izeno-menu-voice { min-height: 3.35rem; padding: .45rem 3.2rem .45rem .55rem; }
  .paginaPrincipale { padding-top: 7.8em; }
  .login_block { width: 88%; padding: 1.8em 1em; }
  .portainput, .portapass, .login_block_ok { width: 88%; }
  .ricordami-pw-box { gap: .65em; }
  .ricordami, .lostpassword { width: auto; }
  .lostpassword { margin-left: 0; }
  .footer { height: 8.5em; min-height: 8.5em; }
  .footer .central-container { width: 88%; }
  .dropdown {
    width: calc(100vw - 1rem);
    height: min(720px, calc(100vh - 1rem));
    padding: 1rem .8rem .8rem;
    border-radius: .8rem;
  }
  .dropdown:not(.hide) { gap: .45rem; }
  #li-speciale { top: .55rem; right: .55rem; }
  #home-menuBtn, .logoutAreaClienti {
    min-height: 3.35rem;
    padding: .45rem 3.2rem .45rem .55rem;
  }
  .dropdown .all-elements {
    grid-template-columns: 1fr;
    gap: .4rem;
    padding: .1rem;
  }
  .all-elements .menuSelector .single-element {
    height: 3.8rem !important;
    min-height: 3.8rem;
  }
}

/* Popup e conferme: palette istituzionale Wireless Group. */
#a_popup.popup {
  border-color: #19588d !important;
  color: #19588d;
}
#a_popup .anti1 { color: #d51f2b; }
#a_popup .anti4 {
  background-color: #19588d;
  box-shadow: 0 0 5px 1px rgba(25, 88, 141, .35);
}
#a_popup #okbutton {
  background-color: #19588d;
  color: #fff;
  transition: background-color .2s ease, color .2s ease;
}
#a_popup #okbutton:hover,
#a_popup #okbutton:focus-visible {
  background-color: #d51f2b;
  color: #fff;
}
#a_popup #nobutton {
  border: 1px solid #b9cad9;
  background-color: #eef3f7;
  color: #19588d;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
#a_popup #nobutton:hover,
#a_popup #nobutton:focus-visible {
  border-color: #d51f2b;
  background-color: #d51f2b;
  color: #fff;
}

/* La stessa identità visiva vale per ogni popup, anche quelli storici. */
.popup {
  max-width: calc(100vw - 2rem);
  box-sizing: border-box;
  border-color: #19588d !important;
  color: #19588d;
}
.popup div.divButton:not(#nobutton) {
  background-color: #19588d;
  color: #fff;
}
.popup div.divButton:not(#nobutton):hover,
.popup div.divButton:not(#nobutton):focus-visible {
  background-color: #d51f2b;
  color: #fff;
}

/* Supporto: nessun debordo su tablet, telefoni o finestre strette. */
.ticket,
.ticket * { box-sizing: border-box; }
.ticket {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}
#noteticket,
.tipoticket { max-width: 100%; }

@media (max-width: 1024px) {
  .centropagina {
    width: calc(100% - 2rem);
    max-width: 56rem;
    margin-right: auto;
    margin-left: auto;
  }
  .ticket { padding: clamp(.75rem, 3vw, 1rem); }
}

@media (max-width: 652px) {
  .popup {
    width: calc(100vw - 1rem) !important;
    max-width: calc(100vw - 1rem);
    height: auto;
    max-height: calc(100vh - 1rem);
    min-height: 0;
    padding: 1.25rem .8rem;
    border-radius: 1.25rem;
  }
  .popup table { table-layout: fixed; }
  .centropagina { width: calc(100% - 1rem); }
  .ticket h1 {
    padding-left: 1.65em;
    overflow-wrap: anywhere;
  }
}
