/* ============================================================================
   ABComputer / IT inCloud — Branding overrides
   Caricato DOPO abcomputer-theme.css: aggiunge il rebrand "IT inCloud",
   l'icona Froxlor nel menu e il footer stile pec@inCloud in palette arancione.
   NON modifica abcomputer-theme.css (di competenza di un altro agente):
   riusa soltanto le sue variabili --abc-*.
   ============================================================================ */

/* ----------------------------------------------------------------------------
   1. Logo header (brand scuro): mantiene l'aspetto 3:2 della nuvola,
   niente width/height fissi che schiacciano. Altezza fissa, larghezza auto.
   ---------------------------------------------------------------------------- */
.header-brand .logo,
.header-brand a > img.logo {
  height: 60px !important;              /* +~30% rispetto ai 46px precedenti */
  max-height: 64px !important;          /* sblocca il cap max-height:50px del tema */
  width: auto;
  max-width: 210px;
  object-fit: contain;
  display: block;
}

/* Logo CENTRATO nell'header-brand: i controlli (minimize/logout/hamburger)
   vanno in assoluto ai lati, il logo resta al centro. */
.header-brand {
  position: relative;
  justify-content: center !important;
}
.header-brand > a:first-of-type { margin: 0 auto; }
.header-brand #kt_aside_toggle {
  position: absolute; left: 8px; top: 50%; transform: translateY(-50%); margin: 0;
}
.header-brand #kt_aside_mobile_toggle,
.header-brand .abc-logout-btn {
  position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
}

/* ----------------------------------------------------------------------------
   2. Icona immagine nel menu laterale (Froxlor): stessa dimensione visiva
   delle keenicon "fs-2" (~22px) e stesso allineamento verticale.
   ---------------------------------------------------------------------------- */
.aside .menu-icon .menu-img-icon {
  width: 24px;
  height: 24px;
  object-fit: contain;
  vertical-align: middle;
  display: inline-block;
  /* Froxlor mantiene i suoi colori originali (il bianco pieno era brutto) */
}

/* ----------------------------------------------------------------------------
   3. Footer "IT inCloud" — struttura ispirata al footer pec@inCloud,
   ricolorata sulla palette arancione del tema (--abc-ink / --abc-primary /
   --abc-peach).
   ---------------------------------------------------------------------------- */
.abc-footer {
  background: var(--abc-ink, #331206);
  font-family: var(--abc-font-body, 'Inter', sans-serif);
  padding: 22px 0 20px;
  margin-top: 2.5rem;
}

.abc-footer__inner {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 30px;
}

/* Riga 1: link rapidi, centrati, separati da una hairline */
.abc-footer__links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 26px;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.abc-footer__links a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13.5px;
  color: rgba(255, 255, 255, 0.72) !important;
  text-decoration: none;
  transition: color 0.2s ease;
}

.abc-footer__links a i {
  font-size: 1.05rem;
  line-height: 1;
  color: inherit;
}

.abc-footer__links a:hover {
  color: var(--abc-peach, #FBBF77) !important;
}

/* Riga 2: logo, copyright e social sulla stessa riga, centrati */
.abc-footer__bar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

.abc-footer__brand {
  display: block;
  line-height: 0;
}

.abc-footer__logo {
  height: 30px;
  width: auto;
}

.abc-footer__copy {
  font-family: var(--abc-font-detail, 'Inter', sans-serif);
  font-size: 12.5px;
  color: rgba(255, 255, 255, 0.55);
  margin: 0;
}

.abc-footer__social {
  display: inline-flex;
  gap: 10px;
}

.abc-footer__social a {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.22);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.8) !important;
  transition: border-color 0.2s ease, color 0.2s ease;
}

.abc-footer__social a:hover {
  border-color: var(--abc-primary, #EA580C);
  color: var(--abc-peach, #FBBF77) !important;
}

@media (max-width: 767.98px) {
  /* Spazio in fondo perché l'icona del consenso privacy, fissa in basso a
     destra, non copra l'ultima riga. */
  .abc-footer {
    padding: 20px 0 76px;
  }
  .abc-footer__inner {
    padding: 0 20px;
  }
  .abc-footer__bar {
    gap: 10px;
  }
  .abc-footer__links {
    gap: 6px 18px;
  }
}

/* ----------------------------------------------------------------------------
   4. Pulsante LOGOUT nell'header-brand (accanto al logo) + tooltip
   ---------------------------------------------------------------------------- */
.header-brand .abc-logout-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 10px;
  color: #FFFFFF;                       /* bianco: non si fonde col gradient */
  background: rgba(255, 255, 255, 0.10);
  transition: background-color 0.2s ease, color 0.2s ease;
  text-decoration: none;
}
.header-brand .abc-logout-btn i,
.header-brand .abc-logout-btn i:before { color: #FFFFFF !important; }
.header-brand .abc-logout-btn:hover { background: rgba(248, 40, 90, 0.92); color: #fff; }
.header-brand .abc-logout-btn i,
.header-brand .abc-logout-btn i:before { font-size: 20px; color: inherit; }
@media (max-width: 991.98px) {
  .header-brand .abc-logout-btn { display: none; } /* in mobile è nel drawer profilo */
}

/* ----------------------------------------------------------------------------
   5. Blocco PROFILO nel drawer (solo mobile): sostituisce la ricerca veloce
   ---------------------------------------------------------------------------- */
.aside .abc-aside-profile { padding: 16px 14px; border-bottom: 1px solid rgba(255, 255, 255, 0.10); }
.aside .abc-aside-profile .abc-ap-name { color: #fff; font-weight: 700; font-size: 14px; line-height: 1.2; }
.aside .abc-aside-profile .abc-ap-role { color: var(--abc-peach, #FBBF77); font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; }
.aside .abc-aside-profile .symbol > img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.15); }
.aside .abc-aside-profile .abc-ap-actions { gap: 18px !important; }
.aside .abc-aside-profile .abc-ap-actions a {
  color: #FFFFFF !important; font-size: 13px; font-weight: 600; text-decoration: none;
  display: inline-flex; align-items: center; gap: 8px;
}
/* icone (keenicon) più grandi, testo normale */
.aside .abc-aside-profile .abc-ap-actions a i,
.aside .abc-aside-profile .abc-ap-actions a i:before { color: #FFFFFF !important; font-size: 30px !important; line-height: 1; }
.aside .abc-aside-profile .abc-ap-actions a i path { fill: #FFFFFF !important; }
.aside .abc-aside-profile .abc-ap-actions a:hover { color: #FFD9B8 !important; }
.aside .abc-aside-profile .abc-ap-actions a:hover i,
.aside .abc-aside-profile .abc-ap-actions a:hover i:before { color: #FFD9B8 !important; }

/* ----------------------------------------------------------------------------
   6. Tasto SCROLL-TO-TOP — in basso a destra, SOPRA il pulsante cookie
   (cookie: bottom-0 end-0 m-5 ≈ 3rem + 48px). Mai sovrapposto.
   ---------------------------------------------------------------------------- */
#abcScrollTop {
  position: fixed; right: 3rem; bottom: 7rem;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--abc-gradient, linear-gradient(120deg, #EA580C, #F59E0B));
  color: #fff; border: none; z-index: 9998;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 8px 22px rgba(245, 158, 11, 0.4);
  opacity: 0; visibility: hidden; transform: translateY(10px);
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
  cursor: pointer;
}
#abcScrollTop.abc-show { opacity: 1; visibility: visible; transform: translateY(0); }
#abcScrollTop:hover { filter: brightness(1.06); box-shadow: 0 12px 28px rgba(245, 158, 11, 0.55); }
#abcScrollTop i, #abcScrollTop i:before { font-size: 20px; color: #fff; }
@media (max-width: 575.98px) { #abcScrollTop { right: 1.25rem; bottom: 6.5rem; } }

/* ----------------------------------------------------------------------------
   7. Footer: riga status servizi/API (rimpiazza i vecchi link rapidi)
   ---------------------------------------------------------------------------- */
.abc-footer__status {
  display: flex; flex-wrap: wrap; justify-content: center; align-items: center;
  gap: 8px 18px; margin-bottom: 12px; padding-bottom: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1); min-height: 6px;
}
.abc-footer__status:empty { border-bottom: none; margin: 0; padding: 0; min-height: 0; }
.abc-footer__copy a { color: var(--abc-peach, #FBBF77); text-decoration: none; }
.abc-footer__copy a:hover { text-decoration: underline; }

/* ----------------------------------------------------------------------------
   8. Logo mobile: un po' d'aria sopra/sotto (non attaccato ai margini)
   ---------------------------------------------------------------------------- */
@media (max-width: 991.98px) {
  .header-brand { padding-top: 12px !important; padding-bottom: 12px !important; min-height: 84px; }
  .header-brand > a:first-of-type { margin-top: 8px; margin-bottom: 8px; }
}

/* ----------------------------------------------------------------------------
   9. Main content a PIENA LARGHEZZA (F18): su schermi grandi niente margini
   laterali sprecati — il contenuto parte vicino all'aside e arriva a destra.
   ---------------------------------------------------------------------------- */
.header .container-xxl,
.toolbar .container-xxl,
.wrapper .container-xxl,
#kt_content .container-xxl,
.content .container-xxl,
.app-container.container-xxl,
.container-xxl { max-width: none !important; }
@media (min-width: 1200px) {
  .wrapper .container-xxl,
  #kt_content .container-xxl,
  .content .container-xxl { padding-left: 22px; padding-right: 30px; }
}
