/* ==========================================================================
   stile.css  Foglio di stile principale
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Fonts & external resources
   -------------------------------------------------------------------------- */

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@font-face {
  font-family: 'siap-icons';
  font-style: normal;
  font-weight: normal;
  src: url('/standard-atlante-plus/icons/fonts/siap-icons.eot?ed562d10');
  src:
    url('/standard-atlante-plus/icons/fonts/siap-icons.eot?ed562d10#iefix') format('embedded-opentype'),
    url('/standard-atlante-plus/icons/fonts/siap-icons.woff2?ed562d10') format('woff2'),
    url('/standard-atlante-plus/icons/fonts/siap-icons.woff?ed562d10') format('woff'),
    url('/standard-atlante-plus/icons/fonts/siap-icons.ttf?ed562d10') format('truetype'),
    url('/standard-atlante-plus/icons/fonts/siap-icons.svg?ed562d10#siap-icons') format('svg');
}

/* --------------------------------------------------------------------------
   2. CSS custom properties (:root)
   -------------------------------------------------------------------------- */

:root {
  --theme-primary-color: var(--primary-color);
  --theme-secondary-color: #083548;
  --theme-border-radius: 6px;
  --theme-default-padding: 4px;
  --theme-icon-main: #fff;
  --theme-default-hover: #50A2FF;
  --default-margin: .5rem;
  --theme-font: 'Poppins', system-ui;
  --primary-color: #01155d;
  --secondary-color: #2c3e91;
  --dark-blue: #021042;
  --light-blue: #1f85f8;
  --light-cyan: #9ED0FF;
  --light-blue-rgb: 31, 133, 248;
  --light-green: #D0FDD0;
  --light-gray: #f3f4f4;
  --font-title: 1rem;
  --font-lg: .9rem;
  --font-md: .8rem;
  --font-sm: 12px;
  --font-xsm: .7rem;
  --error-color: #d90000;
  --light-error-color: #F5B3B6;
  --yellow: #FFFF93;
  --light-yellow: #FFFDC8;
  --pink: #FFB8B8;
  --light-pink: #FFE4F0;
}

/* --------------------------------------------------------------------------
   3. Base / reset
   -------------------------------------------------------------------------- */

img {
  user-select: none;
  user-drag: none;
  -webkit-user-drag: none;
  -webkit-user-select: none;
}

font,
p,
label,
div,
span,
h1, h2, h3, h4, h5, h6,
a,
button,
select,
input,
textarea,
legend,
.containerLW {
  font-family: var(--theme-font), system-ui;
}

select[multiple] {
  scrollbar-width: thin;
}

legend {
  font-size: var(--font-lg);
}

html {
  height: fit-content;
}

body {
  background: #ffffff;
  height: fit-content;
}

/* --------------------------------------------------------------------------
   4. Focus & accessibility (icon links)
   -------------------------------------------------------------------------- */

a:has(.s-icon):focus,
a:has(.s-icon):focus-visible {
  outline: 0;
}

a:has(.s-icon):focus .s-icon,
a:has(.s-icon):focus-visible .s-icon {
  outline: 2px solid var(--theme-default-hover);
}

/* --------------------------------------------------------------------------
   5. Labels (obblig, visual, def, signific, valid, cliente, ecc.)
   -------------------------------------------------------------------------- */

.labelObblig,
.labelObbligNonModif,
.labelNObblig,
.labelVisual,
.labelNVisual,
.labelDef,
.labelNDef,
.labelPrimoPax {
  display: flex;
  justify-content: center;
  align-items: center;
  width: clamp(60px, 7vw, 70px);
  height: clamp(20px, 3vw, 20px);
  margin: clamp(1px, 0.2vw, 5px);
  padding: clamp(3px, 0.4vw, 8px);
  font-size: clamp(7px, 0.6vw, 12px);
  font-weight: bold;
  color: #fff;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  user-select: none;
  border-radius: var(--default-margin);
}

.labelObblig,
.labelObbligNonModif {
  background-color: #FF5050;
}

.labelObbligNonModif {
  opacity: 0.5;
}

.labelNObblig {
  background-color: #DCDCDC;
  color: #000;
}

.labelVisual {
  background-color: var(--icon-green);
}

.labelNVisual {
  background-color: #DCDCDC;
  color: #2F872F;
}

.labelDef {
  background-color: #8AEAF3;
  color: #1234b5;
}

.labelNDef {
  background-color: #DCDCDC;
  color: #1234B5;
}

.labelPrimoPax {
  background-color: #42C102;
  color: #F7FCF4;
}

.labelSignific,
.labelNSignific,
.labelSignificSempre,
.labelCliente,
.labelValid,
.labelNValid,
.labelMValid {
  display: flex;
  justify-content: center;
  align-items: center;
  width: clamp(70px, 8vw, 120px);
  height: clamp(20px, 3vw, 20px);
  margin: clamp(1px, 0.3vw, 5px);
  padding: clamp(3px, 0.5vw, 8px);
  font-size: clamp(7px, 0.6vw, 12px);
  font-weight: bold;
  text-align: center;
  cursor: pointer;
  user-select: none;
  border: 1px solid #CCC;
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.labelSignific,
.labelValid {
  background-color: var(--icon-green);
}

.labelNSignific,
.labelNValid {
  background-color: #DCDCDC;
}

.labelSignificSempre {
  background-color: #FF0D0E;
}

.labelCliente,
.labelMValid {
  background-color: #17F3FF;
}

/* --------------------------------------------------------------------------
   6. Links (ATable, ADetail, ADetailNormal, generic a)
   -------------------------------------------------------------------------- */

a.ATable,
a.ATable:visited,
a.ATableBlack,
a.ATableBlack:visited,
.FONT3BigBoldItalic,
.FONT3BoldMedium,
.FONT3Bold,
input,
select {
  color: #000000;
}

a.ADetail,
a.ADetail:visited {
  color: var(--theme-primary-color);
}

a.ADetail:hover {
  position: relative;
  color: var(--theme-default-hover);
}

a.ADetailNormal,
a.ADetailNormal:visited {
  color: var(--theme-primary-color);
}

a.ADetailNormal:hover {
  position: relative;
  color: var(--primary-color);
}

a,
a:visited,
a:hover {
  color: var(--dark-blue);
}

a.ATable:hover {
  color: var(--theme-primary-color);
}

a.ATableBlack:hover {
  position: relative;
  top: -1px;
  left: -1px;
  color: #FFFFFF;
}

.imgUnderline:hover img {
  border-bottom: 1px solid var(--theme-primary-color);
}

a:has(> i) {
  text-decoration: none;
}

/* --------------------------------------------------------------------------
   7. Layout primitivi (DIV, FIELDSET, FONT)
   -------------------------------------------------------------------------- */

.DIVBordo3pxInset {
  padding: 0 3px;
}

fieldset {
  padding: var(--default-margin);
  border: var(--theme-secondary-color) groove 1px;
  border-spacing: 1cm 1cm;
}

p {
  font-style: normal;
  margin: 0;
  color: var(--primary-color);
}

font {
  font-size: var(--font-md);
  font-style: normal;
  line-height: 16px;
  color: var(--primary-color);
}

td.radio-checked {
  background-color: var(--light-gray);
}

/* --------------------------------------------------------------------------
   8. Typography FONT* (colori, dimensioni, pesi)
   -------------------------------------------------------------------------- */

#calframe {
  background: white;
  border-radius: 11px;
  box-shadow: 0 0 31px 5px rgba(0,0,0,0.21);
}

.FONTSmall {
  color: var(--theme-primary-color);
}

.FONTItalic {
  font-size: var(--font-md);
  font-style: italic;
  color: var(--theme-primary-color);
}

.FONTBoldItalic {
  font: italic bold var(--font-md) var(--theme-font);
  color: var(--theme-primary-color);
}

.FONTBoldMonospace {
  font: bold var(--font-md) var(--theme-font);
  color: var(--theme-primary-color);
}

.FONTBold {
  font: bold var(--font-sm) var(--theme-font);
}

.FONTBoldBig {
  font: bold 20px var(--theme-font);
  color: var(--theme-primary-color);
}

.TD4 font, .TD4 p,
.TD4Header font, .TD4Header p,
.TD3Header font, .TD3Header p {
  color: white;
}

.TD2 font, .TD2 p {
  color: var(--primary-color);
}

.FONTBig {
  font-size: 20px;
  color: var(--theme-primary-color);
}

:not(table:has(.pagination) + table) {
    & .TD4, .TD3, .TD4Header, .TD3Header {
        & .FONTHeaderBold, .FONT2Header, .FONT2Bold, .FONT2BoldSmall, .FONT2HeaderBold, .FONT2BoldSemiBig, .FONT2BoldBig {
            color: #fff;
        }
    }
}

.TD2 {
    & :not(.TD4, .TD3, .TD4Header, .TD3Header) > .FONTHeaderBold,
    & :not(.TD4, .TD3, .TD4Header, .TD3Header) > .FONT2Header,
    & :not(.TD4, .TD3, .TD4Header, .TD3Header) > .FONT2Bold,
    & :not(.TD4, .TD3, .TD4Header, .TD3Header) > .FONT2BoldSmall,
    & :not(.TD4, .TD3, .TD4Header, .TD3Header) > .FONT2HeaderBold,
    & :not(.TD4, .TD3, .TD4Header, .TD3Header) > .FONT2BoldSemiBig,
    & :not(.TD4, .TD3, .TD4Header, .TD3Header) > .FONT2BoldBig {
        color: var(--primary-color);
    }
}

.FONTHeaderBold, .FONT2Header, .FONT2Bold, .FONT2BoldSmall, .FONT2HeaderBold, .FONT2BoldSemiBig, .FONT2BoldBig, .FONT3, .FONT3Italic, .FONT3Small, .FONT3Big, .FONT3BigBold, .FONTimporti {
    color: var(--primary-color);
    font-family: var(--theme-font), system-ui;
}

.FONTHeaderBold {
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
}

.FONT2Bold,
.FONT2BoldSmall,
.FONT2HeaderBold,
.FONT2BoldSemiBig,
.FONT2BoldBig,
.FONT3BigBold {
  font-weight: bold;
}

.FONT2Bold,
.FONT3,
.FONT3Italic,
.FONTCorsivo_LEGENDA {
  font-size: var(--font-md);
}

.FONT2BoldSmall {
  font-size: var(--font-sm);
}

.FONT2HeaderBold,
.FONT2Header,
.FONT3Big,
.FONT3BigBold {
  font-size: var(--font-md);
}

.FONT2BoldSemiBig {
  font-size: 15px;
}

.FONT2BoldBig {
  font-size: 20px;
}

.FONT3Italic {
  font-style: italic;
}

.FONT3Small {
  font-size: var(--font-sm);
}

.FONTimporti {
  font-size: 14px;
}

.FONTCorsivo_LEGENDA {
  font-style: oblique;
  color: #3366FF;
}

.FONTimportiFE {
  font: 14px var(--theme-font);
  color: #8A6642;
}

.FONTBigBoldVerde {
  font: bold 14px var(--theme-font);
  color: #33BB33;
}

.FONTBigBeigeMarrone {
  font: 14px var(--theme-font);
  color: #8A6642;
}

.FONT3BigBoldItalic {
  font: italic bold var(--font-md) var(--theme-font);
}

.FONT3BoldMedium {
  font: bold 16px var(--theme-font);
}

.FONT3Bold {
  font: bold var(--font-md) var(--theme-font);
}

.FONT4 {
  color: var(--error-color) !important;
}

.FONT4Bold,
.FONT4HeaderBold {
  font: bold var(--font-md) var(--theme-font);
  color: var(--error-color);
}

.FONT4BoldBig {
  font: bold 20px var(--theme-font);
  color: var(--error-color);
}

.FONT4BoldMedium {
  font: bold 16px var(--theme-font);
  color: var(--error-color);
}

.FONT5 {
  color: #009900;
}

.FONT5Bold,
.FONT5HeaderBold {
  font: bold var(--font-md) var(--theme-font);
  color: #009900;
}

.FONT5BoldMedium {
  font: bold 16px var(--theme-font);
  color: #009900;
}

.FONT5BoldBig {
  font: bold 20px var(--theme-font);
  color: #009900;
}

.FONT6Bold {
  font: bold var(--font-md) var(--theme-font);
  color: #FFFF80;
}

.FONT6BoldBig {
  font: bold 20px var(--theme-font);
  color: #FFFF80;
}

.FONT7Bold {
  font: bold var(--font-md) var(--theme-font);
  color: #6464c0;
}

.FONT8 {
  color: #ef08d1;
}

.FONT8Bold,
.FONT8HeaderBold {
  font: bold var(--font-md) var(--theme-font);
  color: #ef08d1;
}

.FONTCorsivo {
  font-size: var(--font-md);
  font-style: oblique;
  color: var(--theme-primary-color);
}

.FONT9Bold {
  font: bold var(--font-md) var(--theme-font);
  color: #dc6600;
}

.FONT10BoldMedium {
  font: bold 18px var(--theme-font);
  color: #1c94c4;
}

.FONT11 {
  color: #868686;
}

.FONTHeaderBoldOrange {
  font: bold var(--font-md) var(--theme-font);
  color: var(--error-color);
}

.FONTHeaderBoldWhite {
  font: bold var(--font-md) var(--theme-font);
  color: #ffffff;
}

.FONT2Bold {
  color: var(--primary-color);
}

/* --------------------------------------------------------------------------
   9. Tree (layout e stili)
   -------------------------------------------------------------------------- */

.tree {
  border-spacing: 0 5px !important;
}

.tree .s-form {
  margin-right: 4px;
}

.tree table {
  border-spacing: 4px 0 !important;
}

.tree > tbody > tr > td {
  position: relative;
}

.tree > tbody > tr:has(+ tr .s-arrow-right-s-line) > td::before {
  display: none !important;
}

.tree tr:has(.s-icon.s-form.s-arrow-right-s-line) > td::before {
  display: none;
}

.tree > tbody > tr > td::before {
  content: '';
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #f4f3f3;
  z-index: 10;
  pointer-events: none;
}

.tree .TreeLightBlue,
.tree .TreeOrange,
.tree .TreeYellow,
.tree .TreeLightRed,
.tree .TreeGreen {
  --padding-tree-cells: 6px;
  padding: 0 var(--padding-tree-cells);
  border-radius: var(--padding-tree-cells);
}

.tree > tbody > tr:has(+ tr .s-arrow-right-s-line) > td {
  border-bottom: none !important;
}

.tree tr:has(.s-icon.s-form.s-arrow-right-s-line) > td {
  background-color: #F4F3F3 !important;
  border-bottom: none;
  border-radius: 6px;
}

.tree,
.tree ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.tree ul {
  margin-left: 1em;
  position: relative;
}

.tree ul ul {
  margin-left: .5em;
}

.tree ul:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 0;
  border-left: 1px solid;
}

.tree li {
  margin: 0;
  padding: 0 0.5em;
  position: relative;
  line-height: 2em;
  color: #000;
}

.tree li:before {
  content: "";
  display: block;
  position: absolute;
  top: 1em;
  left: 0;
  width: 10px;
  height: 0;
  margin-top: -1px;
  border-top: 1px solid;
}

.tree li:last-child:before {
  top: 1em;
  bottom: 0;
  height: auto;
  background: white;
}

/* --------------------------------------------------------------------------
   10. Input read-only / disabled (non nuova-grafica-vip)
   -------------------------------------------------------------------------- */

.TreeWhite,
.TreeWhiteBorder,
.TreeWhiteBorderGrey,
.INPUTGreenBold14,
.INPUTDescrizioniB,
.INPUTDescrizioniFile,
.INPUTDescrizioniD,
.INPUTDescrizioniDBold,
.INPUTDescrizioniBSmall2,
.INPUTDescrizioniBSmall,
.INPUTDescrizioni,
.INPUTDescrizioniSmall,
.INPUTDescrizioniGrayLight {
  outline: 0;
  background-color: transparent;
  cursor: default;
}

body:not(.nuova-grafica-vip) input:not([type="file"], [class^="opacity"], [class^="pulsante"], .TreeWhite, .TreeWhiteBorder, .TreeWhiteBorderGrey, .INPUTGreenBold14, .INPUTDescrizioniB, .INPUTDescrizioniFile, .INPUTDescrizioniD, .INPUTDescrizioniDBold, .INPUTDescrizioniBSmall2, .INPUTDescrizioniBSmall, .INPUTDescrizioni, .INPUTDescrizioniSmall, .INPUTDescrizioniGrayLight, .INPUTDescrizioniTrasparent, .INPUTDescrizioniBSmallTD3HEADER):not([style*="#FF0000"], [style*="rgb(255, 0, 0)"]):read-only,
body:not(.nuova-grafica-vip) input:not([type="file"], [class^="opacity"], [class^="pulsante"], .TreeWhite, .TreeWhiteBorder, .TreeWhiteBorderGrey, .INPUTGreenBold14, .INPUTDescrizioniB, .INPUTDescrizioniFile, .INPUTDescrizioniD, .INPUTDescrizioniDBold, .INPUTDescrizioniBSmall2, .INPUTDescrizioniBSmall, .INPUTDescrizioni, .INPUTDescrizioniSmall, .INPUTDescrizioniGrayLight, .INPUTDescrizioniTrasparent, .INPUTDescrizioniBSmallTD3HEADER):not([style*="#FF0000"], [style*="rgb(255, 0, 0)"]):disabled {
  background: #ccc !important;
  cursor: default;
}

body:not(.nuova-grafica-vip) input:not([type="file"], [class^="opacity"], [class^="pulsante"], .TreeWhite, .TreeWhiteBorder, .TreeWhiteBorderGrey, .INPUTGreenBold14, .INPUTDescrizioniB, .INPUTDescrizioniFile, .INPUTDescrizioniD, .INPUTDescrizioniDBold, .INPUTDescrizioniBSmall2, .INPUTDescrizioniBSmall, .INPUTDescrizioni, .INPUTDescrizioniSmall, .INPUTDescrizioniGrayLight, .INPUTDescrizioniTrasparent, .INPUTDescrizioniBSmallTD3HEADER):read-only:focus,
body:not(.nuova-grafica-vip) input:not([type="file"], [class^="opacity"], [class^="pulsante"], .TreeWhite, .TreeWhiteBorder, .TreeWhiteBorderGrey, .INPUTGreenBold14, .INPUTDescrizioniB, .INPUTDescrizioniFile, .INPUTDescrizioniD, .INPUTDescrizioniDBold, .INPUTDescrizioniBSmall2, .INPUTDescrizioniBSmall, .INPUTDescrizioni, .INPUTDescrizioniSmall, .INPUTDescrizioniGrayLight, .INPUTDescrizioniTrasparent, .INPUTDescrizioniBSmallTD3HEADER):disabled:focus {
  outline: 0 !important;
}

/* --------------------------------------------------------------------------
   11. INPUT* (descrizioni, file, bordi, colori)
   -------------------------------------------------------------------------- */

.INPUTGreenBold14 {
  margin: 0;
  padding: 1px 0 1px 2px;
  font: bold 14px var(--theme-font);
  color: #33BB33;
  border: 0 solid;
}

input,
.INPUT2,
.INPUTDescrizioni,
.INPUTDescrizioniTrasparent,
.INPUTDescrizioniVerde,
.INPUTDescrizioniRosa,
.INPUTDescrizioniB,
.INPUTDescrizioniGrayLight,
.INPUTDescrizioniY,
.INPUTDescrizioniFile,
.INPUTDescrizioniFileGray,
.INPUTDescrizioniDM,
.INPUTDescrizioniC,
.INPUTDescrizioniMultimedia,
select:not(.custom-input),
.ItemBodyScroll,
.FONT11,
.FONT8,
.FONT5,
.FONT4,
a.ATableBlack,
a.ATable,
a.ADetailNormal,
a.ADetail {
  font: var(--font-sm) var(--theme-font);
}

.inputDescrizioniB {
    font-size: var(--font-xsm);
}

.INPUT2 {
  border: 1px solid blue;
}

.INPUTDescrizioni,
.INPUTDescrizioniTrasparent,
.INPUTDescrizioniBold,
.INPUTDescrizioniFileGray,
.INPUTDescrizioniDM,
.INPUTDescrizioniC,
.INPUTDescrizioniSmall,
.INPUTDescrizioniBSmall {
  background-color: transparent;
}

.INPUTDescrizioniVerde {
  background-color: #bedec4;
}

.INPUTDescrizioniRosa {
  background-color: #f1e4cc;
}

.INPUTDescrizioniBold {
  font: bold var(--font-md) var(--theme-font);
}

.INPUTDescrizioniGialloBold {
  font: bold var(--font-md) var(--theme-font);
  background-color: #FFFF80;
}

.INPUTDescrizioniGrayLight {
  background-color: #eeeeee;
}

.INPUTDescrizioniY {
  background-color: var(--light-yellow);
}

.INPUTDescrizioniFile {
  margin: 0;
  padding: 1px 0 1px 2px;
  color: #ffffff;
}

.INPUTDescrizioniFileGray {
  margin: 0;
  padding: 1px 0 1px 2px;
  color: #E5EDF3;
}

.INPUTDescrizioniDM {
  border: 1px solid var(--theme-primary-color);
}

.INPUTDescrizioniD {
  font-size: var(--font-md);
}

.INPUTDescrizioniDBold {
  font: bold var(--font-md) var(--theme-font);
}

.INPUTDescrizioniSmall,
.INPUTDescrizioniBSmall,
.INPUTDescrizioniBSmallTD3HEADER,
.FONTSmall {
  font: var(--font-sm) var(--theme-font);
}

.INPUTDescrizioniBSmall2 {
  font: var(--font-xsm) var(--theme-font);
}

.INPUTDescrizioniBSmallTD3HEADER {
  background-color: var(--theme-primary-color);
}

.INPUTDescrizioniMultimedia {
  text-align: center;
  background-color: #FFFF80;
}

.INPUTDescrizioni,
.INPUTDescrizioniTrasparent,
.INPUTDescrizioniVerde,
.INPUTDescrizioniRosa,
.INPUTDescrizioniBold,
.INPUTDescrizioniGialloBold,
.INPUTDescrizioniB,
.INPUTDescrizioniGrayLight,
.INPUTDescrizioniY,
.INPUTDescrizioniFile,
.INPUTDescrizioniFileGray,
.INPUTDescrizioniC,
.INPUTDescrizioniD,
.INPUTDescrizioniDBold,
.INPUTDescrizioniSmall,
.INPUTDescrizioniBSmall,
.INPUTDescrizioniBSmall2,
.INPUTDescrizioniBSmallTD3HEADER,
.INPUTDescrizioniMultimedia {
  border: 0 solid;
}

.INPUT2,
.INPUTDescrizioni,
.INPUTDescrizioniTrasparent,
.INPUTDescrizioniVerde,
.INPUTDescrizioniRosa,
.INPUTDescrizioniBold,
.INPUTDescrizioniGialloBold,
.INPUTDescrizioniB,
.INPUTDescrizioniGrayLight,
.INPUTDescrizioniY,
.INPUTDescrizioniDM,
.INPUTDescrizioniC,
.INPUTDescrizioniD,
.INPUTDescrizioniDBold,
.INPUTDescrizioniSmall,
.INPUTDescrizioniBSmall,
.INPUTDescrizioniBSmall2,
.INPUTDescrizioniBSmallTD3HEADER,
.INPUTDescrizioniMultimedia {
  margin: 0;
  padding: 1px 0 1px 2px;
  color: var(--dark-blue);
}

input {
  border-radius: 3px;
  accent-color: var(--theme-primary-color);
}

body:not(.nuova-grafica-vip) input[type=text]:not([class*='Descrizioni'], .input, .custom-input),
body:not(.nuova-grafica-vip) input[type=password]:not(.custom-input),
body:not(.nuova-grafica-vip) select:not(.custom-input),
body:not(.nuova-grafica-vip) textarea,
body:not(.nuova-grafica-vip) input[type="date"],
body:not(.nuova-grafica-vip) input[type="number"] {
  padding: 4px;
  color: var(--primary-color, #000);
  background: #f3f4f4;
  border: 0;
  border-radius: 4px;
}

body:not(.nuova-grafica-vip) input[type=text]:not([class*='Descrizioni'], .input, .custom-input):not(.search-input, .readonly),
body:not(.nuova-grafica-vip) input[type=password]:not(.custom-input):not(.search-input, .readonly),
body:not(.nuova-grafica-vip) select:not(.custom-input):not(.search-input, .readonly),
body:not(.nuova-grafica-vip) textarea:not(.search-input, .readonly),
body:not(.nuova-grafica-vip) input[type="date"]:not(.search-input, .readonly),
body:not(.nuova-grafica-vip) input[type="number"]:not(.search-input, .readonly) {
  outline: 1px solid #ccc;
}

body:not(.nuova-grafica-vip) input[type=text]:not([class*='Descrizioni'], .input, .custom-input):focus,
body:not(.nuova-grafica-vip) input[type=password]:not(.custom-input):focus,
body:not(.nuova-grafica-vip) select:not(.custom-input):focus,
body:not(.nuova-grafica-vip) textarea:focus,
body:not(.nuova-grafica-vip) input[type="date"]:focus,
body:not(.nuova-grafica-vip) input[type="number"]:focus {
  outline: 2px solid var(--theme-default-hover);
}

body:not(.nuova-grafica-vip) input[type=text]:not([class*='Descrizioni'], .input, .custom-input):not(.chosen-search-input),
body:not(.nuova-grafica-vip) input[type=password]:not(.custom-input):not(.chosen-search-input),
body:not(.nuova-grafica-vip) textarea:not(.chosen-search-input),
body:not(.nuova-grafica-vip) input[type="date"],
body:not(.nuova-grafica-vip) input[type="number"] {
  max-width: calc(100% - 8px);
}

select:not(.custom-input) {
  border-radius: 3px;
}

input[type="file"] {
  font-size: var(--font-md);
  background: white !important;
  color: var(--primary-color);
}

input[type="file"]::file-selector-button,
input[type="file"]::-webkit-file-upload-button {
  margin-right: 1rem;
  padding: 0.6rem 1.2rem;
  border: none;
  border-radius: 6px;
  background-color: var(--theme-primary-color);
  color: white;
  cursor: pointer;
  font-weight: 400;
  transition: background-color 0.2s ease-in-out, transform 0.1s ease;
}

input[type="file"]::file-selector-button:hover,
input[type="file"]::-webkit-file-upload-button:hover {
  background-color: var(--theme-default-hover);
}

input[type="file"]::file-selector-button:active,
input[type="file"]::-webkit-file-upload-button:active {
  transform: scale(0.98);
}

/* --------------------------------------------------------------------------
   12. HR
   -------------------------------------------------------------------------- */

.HR6 {
  color: #ffff93;
  border: 1px solid;
  background-color: #ffff93;
}

.HRBlue {
  color: var(--theme-primary-color);
  border: 1px solid;
  background-color: var(--theme-primary-color);
}

/* --------------------------------------------------------------------------
   13. Table base & TD2 / TD3 / TD4
   -------------------------------------------------------------------------- */

table {
  border: 0;
}

table:has(> tbody > tr > td.TD3Header, > tr > .TD3Header, :not(.menu)),
table:has(> thead > tr > td.TD4Header2) {
  border-spacing: 0;
}

table:has(> tbody > tr > td.TD3Header.home, > tr > .TD3Header.home) {
  margin: 0 var(--default-margin);
  width: calc(100% - (2 * var(--default-margin)));
}

table td:has(> font):not(:has(> :not(font, input[type="hidden"]))) {
  text-align: left;
}

form > table:not(.content, .not-styled),
#intestazione,
#parziale,
#completo,
table:has(> tbody > tr > td > .pagination) + table {
  margin-left: var(--default-margin);
  margin-right: var(--default-margin);
  width: calc(100% - (2 * var(--default-margin)));
}

#parziale,
#completo,
#intestazione,
table:has(> tbody > tr > td > .pagination) + table {
  overflow: unset !important;
  padding: var(--default-margin);
  background: var(--light-gray) !important;
}

table:has(> tbody > tr > td > .pagination) + table {
  width: calc(100% - (2 * var(--default-margin))) !important;
  padding-bottom: 0;
}

table:has(> tbody > tr > td > .pagination) + table td:not(.TD3Header) {
  background: white;
}

table:has(> tbody > tr > td > .pagination) + table td:first-of-type {
  border-radius: calc(var(--default-margin) / 2) 0 0 calc(var(--default-margin) / 2);
}

table:has(> tbody > tr > td > .pagination) + table td:last-of-type {
  border-radius: 0 calc(var(--default-margin) / 2) calc(var(--default-margin) / 2) 0;
}

table:has(> tbody > tr > td > .pagination) + table + table {
  padding: var(--default-margin);
  border-spacing: 0 .5rem;
  background: var(--light-gray);
}

table:has(> tbody > tr > td > .pagination) + table + table td {
  padding: var(--default-margin) 0;
  background: white;
}

table:has(> tbody > tr > td > .pagination) + table + table td:first-of-type {
  border-radius: calc(var(--default-margin) / 2) 0 0 calc(var(--default-margin) / 2);
}

table:has(> tbody > tr > td > .pagination) + table + table td:last-of-type {
  border-radius: 0 calc(var(--default-margin) / 2) calc(var(--default-margin) / 2) 0;
}

table td:has(> font:only-child, i),
table td.TD2:has(> font:not(.pagination), i) {
  text-align: left;
}

table:has(tr:only-child > .TD3Header.home) {
  padding: 8px;
  border-radius: 8px;
}

table:has( + #intestazione),
table:has(> tbody > tr > td > .pagination) {
  background: var(--light-gray);
  border-radius: var(--default-margin) var(--default-margin) 0 0;
}

table:has( + #intestazione) td,
table:has(> tbody > tr > td > .pagination) td {
  padding-top: var(--default-margin);
}

table:has( + #intestazione) td:first-of-type,
table:has(> tbody > tr > td > .pagination) td:first-of-type {
  border-radius: var(--default-margin) 0 0 0;
  padding-left: var(--default-margin);
}

table:has( + #intestazione) td:last-of-type,
table:has(> tbody > tr > td > .pagination) td:last-of-type {
  border-radius: 0 var(--default-margin) 0 0;
  text-align: right;
  padding-right: var(--default-margin);
}

table > tbody > tr > td:has(> .pagination:only-of-type) {
  text-align: center !important;
}

table td:has(input, select) {
  padding-bottom: 3px;
}

.TD2 {
  background: white;
}

.TD2_CLI,
.BODY_CLI {
  background: white;
}

.TDcenter {
  text-align: center !important;
}

.TD2light {
  background: #eeeeee;
}

.TD2lightRed {
  background: #FFD9C0;
}

.TD2NoBorder {
  background: var(--light-gray);
  border: 0;
}

.TD2_Az1 {
  background: #cbcbcb;
}

.TD2_Az2 {
  background: #ededed;
}

.TD2_1 {
  background: #ffffff;
}

.TD2_1_AzP {
  background: #ffff93 !important;
}

.TD2_SHOW {
  background: #A7A7A7;
}

.TD2_MainRow {
  background: #c4efff;
}

.TD2_SlaveRow {
  background: #efefef;
}

.TD3Quotazione {
  background: #e4d15a;
}

.TD3Header,
th:not(:empty, .sort-header) {
  padding: 5px;
  color: #ffffff;
  background: var(--theme-primary-color);
}

.tableDettagli th {
  background: var(--theme-primary-color) !important;
  border-radius: 0 !important;
}

#fattura-container h1 {
  color: var(--theme-primary-color) !important;
}

.tablesorter th {
  color: var(--primary-color) !important;
  background-color: white;
}

.TD4 {
  background: var(--theme-primary-color);
}

.TD4 a {
  font-size: var(--font-md);
  color: white;
}

#intestazione {
  width: calc(100% - (4 * var(--default-margin))) !important;
}

#intestazione table td:first-of-type {
  border-radius: calc(var(--default-margin) / 2) 0 0 calc(var(--default-margin) / 2);
}

#intestazione table td:last-of-type {
  border-radius: 0 calc(var(--default-margin) / 2) calc(var(--default-margin) / 2) 0;
}

#elenco {
  height: fit-content !important;
  width: calc(100% - 2px) !important;
}

#elenco > table {
  margin: 0 .5em;
  padding: .5em;
  width: calc(100% - 1em);
  background: var(--light-gray) !important;
  border-spacing: 0 .5em;
  border-radius: 0 0 var(--default-margin) var(--default-margin);
}

#elenco > table tr td {
  background: white;
}

#elenco > table tr td:first-of-type {
  padding-left: var(--default-margin);
  border-radius: calc(var(--default-margin) / 2) 0 0 calc(var(--default-margin) / 2);
}

#elenco > table tr td:last-of-type {
  border-radius: 0 calc(var(--default-margin) / 2) calc(var(--default-margin) / 2) 0;
}

#tbParziale {
  border-spacing: 0 calc(var(--default-margin) * 2);
}

#tbParziale thead {
  border-spacing: 0;
}

#tbParziale thead .FONT2HeaderBold {
  color: var(--primary-color);
}

#tbParziale thead .TD4 > .FONT2HeaderBold {
  color: white;
}

#tbParziale td {
  padding-left: var(--default-margin);
}

#tbParziale tr:first-of-type td:first-of-type {
  border-top-left-radius: var(--default-margin);
}

#tbParziale tr:first-of-type td:last-of-type {
  border-top-right-radius: var(--default-margin);
}

#tbParziale tr:last-of-type td:first-of-type {
  border-bottom-left-radius: var(--default-margin);
}

#tbParziale tr:last-of-type td:last-of-type {
  border-bottom-right-radius: var(--default-margin);
}

#tbParziale div:has(> .riquadro) {
  background: white;
  border-radius: var(--default-margin);
}

#tbParziale .riquadro td:not(.TD7) {
  background: transparent;
}

#divUlterioriSchede {
  --tr-border-radius: calc(var(--default-margin) + 3px);
  right: 2%;
  z-index: 999;
  width: fit-content;
  padding: 0;
  user-select: none;
  background-color: #fff;
  border-radius: var(--default-margin);
  box-shadow: rgba(0, 0, 0, 0.02) 0 1px 3px 0, rgba(27, 31, 35, 0.15) 0 0 0 1px;
}

#divUlterioriSchede tr:first-of-type a {
  border-radius: var(--tr-border-radius) var(--tr-border-radius) 0 0;
}

#divUlterioriSchede tr:last-of-type a {
  border-radius: 0 0 var(--tr-border-radius) var(--tr-border-radius);
}

#divUlterioriSchede td {
  padding: 0;
}

#divUlterioriSchede a {
  display: block;
  width: calc(100% - (var(--default-margin) * 2));
  padding: var(--default-margin);
  text-decoration: none;
  cursor: pointer;
  transition-duration: .1s;
}

#divUlterioriSchede a:hover {
  background: var(--theme-default-hover);
}

#divUlterioriSchede a:hover > font, #divUlterioriSchede a:hover > p {
  color: white;
  transition-duration: .1s;
}

#parziale,
#completo {
  padding-bottom: 0;
  margin-bottom: var(--default-margin);
  width: calc((100% - (4 * var(--default-margin))) - 2px) !important;
  border: 0 !important;
  border-radius: 0 0 var(--default-margin) var(--default-margin);
}

#parziale table :not(thead),
#completo table :not(thead) {
  border-spacing: 0 var(--default-margin);
}

#parziale table thead,
#completo table thead {
  border-spacing: 0;
  border-collapse: collapse;
}

#parziale > table > tbody > tr > td,
#parziale > table > tr > td,
#completo > table > tbody > tr > td,
#completo > table > tr > td {
  background: white;
}

#parziale:not(:has(#tbParziale)) > table,
#completo:not(:has(#tbParziale)) > table {
  background: var(--light-gray);
  border-spacing: 0 var(--default-margin);
}

#parziale:not(:has(#tbParziale)) > table td,
#completo:not(:has(#tbParziale)) > table td {
  padding: var(--default-margin) 0;
}

#parziale tr td:first-of-type,
#completo tr td:first-of-type {
  border-radius: var(--default-margin) 0 0 var(--default-margin);
}

#parziale tr td:last-of-type,
#completo tr td:last-of-type {
  border-radius: 0 var(--default-margin) var(--default-margin) 0;
}

#completo,
#parziale {
  height: fit-content !important;
}

/* --------------------------------------------------------------------------
   14. Gestione menu laterale
   -------------------------------------------------------------------------- */

table:has(td.menu) {
  border-spacing: var(--default-margin) !important;
}

table:has(td.menu) .TD2:empty {
  background: white;
}

table:has(td.menu) .FONT2Bold.liv0 {
  display: none;
}

table:has(td.menu) .TD4Header.menu,
table:has(td.menu) .TD4_1Header.menu,
table:has(td.menu) .TD4_2Header.menu,
table:has(td.menu) .TD4_3Header.menu,
table:has(td.menu) .TD4_4Header.menu,
table:has(td.menu) .TD4_5Header.menu {
  border-radius: var(--default-margin);
  transition-duration: .1s;
}

table:has(td.menu) .TD4Header.menu a,
table:has(td.menu) .TD4_1Header.menu a,
table:has(td.menu) .TD4_2Header.menu a,
table:has(td.menu) .TD4_3Header.menu a,
table:has(td.menu) .TD4_4Header.menu a,
table:has(td.menu) .TD4_5Header.menu a {
  width: calc(100% - (var(--default-margin) * 2));
  font-weight: 400;
  color: var(--primary-color);
  user-select: none;
  transition-duration: .1s;
}

table:has(td.menu) .TD4Header.menu:hover,
table:has(td.menu) .TD4_1Header.menu:hover,
table:has(td.menu) .TD4_2Header.menu:hover,
table:has(td.menu) .TD4_3Header.menu:hover,
table:has(td.menu) .TD4_4Header.menu:hover,
table:has(td.menu) .TD4_5Header.menu:hover {
  background: var(--light-blue);
}

table:has(td.menu) .TD4Header.menu:hover a,
table:has(td.menu) .TD4_1Header.menu:hover a,
table:has(td.menu) .TD4_2Header.menu:hover a,
table:has(td.menu) .TD4_3Header.menu:hover a,
table:has(td.menu) .TD4_4Header.menu:hover a,
table:has(td.menu) .TD4_5Header.menu:hover a {
  color: white;
}

table:has(td.menu) .TD4Header.menu:hover i,
table:has(td.menu) .TD4_1Header.menu:hover i,
table:has(td.menu) .TD4_2Header.menu:hover i,
table:has(td.menu) .TD4_3Header.menu:hover i,
table:has(td.menu) .TD4_4Header.menu:hover i,
table:has(td.menu) .TD4_5Header.menu:hover i {
  color: #fff;
}

table:has(td.menu) .TD4Header.menu {
  background: var(--light-gray);
}

table:has(td.menu) .TD4_1Header.menu {
  background: #c1deff;
}

table:has(td.menu) .TD4_1Header.menu a {
  padding-left: calc(var(--default-margin) * 4);
  width: calc(100% - (var(--default-margin) * 4));
}

table:has(td.menu) .TD4_2Header.menu,
table:has(td.menu) .TD4_3Header.menu,
table:has(td.menu) .TD4_4Header.menu,
table:has(td.menu) .TD4_5Header.menu {
  background: #e3f0ff;
}

table:has(td.menu) .TD4_2Header.menu a {
  padding-left: calc(var(--default-margin) * 8);
  width: calc(100% - (var(--default-margin) * 8));
}

table:has(td.menu) .TD4_3Header.menu a {
  padding-left: calc(var(--default-margin) * 9);
  width: calc(100% - (var(--default-margin) * 9));
}

table:has(td.menu) .TD4_4Header.menu a {
  padding-left: calc(var(--default-margin) * 10);
  width: calc(100% - (var(--default-margin) * 10));
}

table:has(td.menu) .TD4_5Header.menu a {
  padding-left: calc(var(--default-margin) * 11);
  width: calc(100% - (var(--default-margin) * 11));
}

table:has(td.menu) .TD3Header {
  background: var(--light-gray);
  transition-duration: .1s;
}

table:has(td.menu) .TD3Header font, table:has(td.menu) .TD3Header p  {
  color: var(--primary-color);
  transition-duration: .1s;
}

table:not(:has(.TD4Header2, .TDStato)):has(> tr:only-child > .TD3Header, > tbody > tr:only-child > .TD3Header) {
  margin: var(--default-margin);
  padding: 3px;
  max-width: calc(100% - (var(--default-margin) * 2));
  background: var(--theme-primary-color);
  border-radius: var(--default-margin);
}

table:not(:has(.TD4Header2, .TDStato)):has(> tr:only-child > .TD3Header, > tbody > tr:only-child > .TD3Header):not(:has(font, select)) {
  width: fit-content;
  margin-left: auto;
}

table:not(:has(.TD4Header2, .TDStato)):has(> tr:only-child > .TD3Header, > tbody > tr:only-child > .TD3Header) td:empty {
  display: none;
}

textarea {
  font-size: var(--font-md);
}

.TD3Header select {
  font-size: var(--font-md);
  font-weight: 500;
  color: #fff;
  background: transparent;
  border: none;
}

.TD3Header select option {
  color: var(--dark-blue);
}

tr:has(> td.TD3Header:first-of-type[style*='display: none']) td.TD3Header:nth-of-type(2) {
  border-top-left-radius: var(--default-margin);
  border-bottom-left-radius: var(--default-margin);
}

tr:not(:has(td.TD3Header ~ td.TD3Header)) td.TD3Header:not([style*='display: none']) {
  border-radius: .5em;
}

tr td.TD3Header {
  padding: var(--default-margin);
}

tr td.TD3Header:only-child {
  border-radius: var(--default-margin) !important;
}

tr td.TD3Header:not([style*='display: none']):first-of-type {
  border-top-left-radius: var(--default-margin);
  border-bottom-left-radius: var(--default-margin);
}

tr td.TD3Header:not([style*='display: none']):last-of-type {
  border-top-right-radius: var(--default-margin);
  border-bottom-right-radius: var(--default-margin);
}

.calendar-bottom,
.calendar-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.calendar-bottom {
  border-radius: 0 0 var(--theme-border-radius) var(--theme-border-radius);
  margin-top: var(--default-margin);
}

.calendar-top {
  border-radius: var(--theme-border-radius) var(--theme-border-radius) 0 0;
  margin-bottom: var(--default-margin);
}

.calendar-top .center-buttons {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
}

#calframe table {
  margin-right: 0;
  margin-left: 0;
  width: 100%;
  border: 0 !important;
}

#calframe table:has(.TD3Header) {
  margin: auto;
}

#calframe table:has(.TD4Header2) {
  padding: 0;
}

#calframe td {
  border: 0;
}

#calframe td.TD3Header {
  padding: calc(var(--default-margin) / 2);
}

#calframe td.TD4Header2 {
  text-align: center;
}

#calframe td.TD2 {
  border-radius: 3px;
  transition-duration: .1s;
}

#calframe td.TD2 a.disabled {
  cursor: default;
}

#calframe td.TD2 a.disabled > p {
  color: #bdbdbd !important;
  text-decoration: none;
}

#calframe td.TD2 a {
  display: flex;
  width: 26px;
  text-align: center;
  height: 26px;
  align-items: center;
  justify-content: center;
  transition-duration: .1s;
  border-radius: var(--theme-border-radius);
  justify-self: center;
  text-decoration: none;
}

#calframe td.TD2 a:not(.disabled):hover, #calframe td.TD2 a:not(.disabled):focus {
  background: #00000010;
  outline: none;
}

#calframe td.TD2:hover font, #calframe td.TD2:hover p {
  color: var(--theme-primary-color) !important;
  transition-duration: .1s;
}

#calframe td .TD3Header:has(> .s-main, > .FONTHeaderBold:has(.s-main)) {
  padding-top: 0;
  padding-bottom: 0;
}

tr td.TD4Header {
  border: 0;
  background: var(--theme-primary-color);
}

tr td.TD4Header:only-of-type {
  border-radius: var(--default-margin);
}

tr td.TD4Header:not([style*="display: none"]):first-of-type {
  border-top-left-radius: var(--default-margin);
  border-bottom-left-radius: var(--default-margin);
}

tr td.TD4Header:not([style*="display: none"]):last-of-type {
  border-top-right-radius: var(--default-margin);
  border-bottom-right-radius: var(--default-margin);
}

tr td.TD4Header:not(.menu) {
  padding: var(--default-margin);
}

.TD4Header a,
.TD4Header a:visited,
.TD4_1Header a,
.TD4_2Header a,
.TD4_2Header a:visited,
.TD4_3Header a,
.TD4_3Header a:visited,
.TD4_4Header a,
.TD4_4Header a:visited,
.TD4_5Header a,
.TD4_5Header a:visited {
  font-size: var(--font-sm);
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  text-decoration: none;
}

.menu_selected a,
.menu_selected a:visited {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
}

.TD4Header:not(.menu) {
  padding: var(--default-margin);
}

.TD4Header img,
.TD4_1Header img,
.TD4_2Header img,
.TD4_3Header img,
.TD4_4Header img,
.TD4_5Header img {
  margin-right: 10px;
}

.TD4Header.menu:hover,
.TD4_1Header.menu:hover,
.TD4_2Header.menu:hover,
.TD4_3Header.menu:hover,
.TD4_4Header.menu:hover,
.TD4_5Header.menu:hover {
  background: var(--theme-default-hover);
  transition-duration: .1s;
}

.TD3Header.menu a,
.TD4Header.menu a,
.TD4_1Header.menu a,
.TD4_2Header.menu a,
.TD4_3Header.menu a,
.TD4_4Header.menu a,
.TD4_5Header.menu a {
  padding: var(--default-margin);
}

.TD4Header2 {
  color: var(--primary-color);
  background: white;
  border: 0;
}

.TD4Header2_NoTop {
  border: #ffffff solid 1px;
  border-top: var(--theme-secondary-color) solid 1px;
  background: var(--theme-secondary-color);
}

.TD4Header2Ord {
  border: #ffffff solid 1px;
  background: #31b9f1;
}

.TD6 {
  background: var(--light-yellow) !important;
}

.TD6F {
  color: #ffff93;
  background: #E5EDF3;
}

.TD7 {
  background: var(--light-error-color);
}

.TD7NoBorder {
  background: var(--light-green);
  border: 0;
}

.TD8 {
  background: #FFFF80;
}

.TD9 {
  background: none;
}

.TD10 {
  background: var(--light-pink);
}

.TD11 {
  background: #34eaea;
}

.TD12 {
  background: #94ff94;
}

.TDPAS {
  background: var(--light-error-color) !important;
}

.TDANA {
  background: var(--light-yellow) !important;
}

.TDStato {
  background: #ffffff;
}

.TD_greyBorderOrange {
  border: var(--theme-primary-color) solid 1px;
  background: #E5EDF3;
}

.TD_vip_prodotto {
  border: var(--theme-secondary-color) solid 1px;
  background: #E5EDF3;
}

.TD_vip_prodotto_dialog {
  background: #eeeeee;
}

.TD_vip_preventivo {
  border: var(--theme-secondary-color) solid 1px;
  background: #ffffff;
}

.TD_vip_selected {
  align-items: center;
  gap: var(--default-margin);
  border: var(--theme-secondary-color) solid 1px;
  background: #C8F29B;
  transition-duration: .1s;
}

.TD_vip_selected:hover {
  background: #BEDEC4;
}

.bgOrange {
  border: 1px;
  background: #f6a828;
}

.bgGreen {
  border: 1px;
  background: var(--light-green);
}

.bgGreenNoBorder {
  border: 0;
  background: var(--light-green);
}

.bgRed {
  border: 1px;
  background: var(--error-color);
}

.bgRedNoBorder {
  border: 0;
  background: var(--error-color);
}

.bgPinkNoBorder {
  border: 0;
  background: #ffb8b8;
}

.bgPink {
  border: 1px;
  background: #ffb8b8;
}

.bgYellow {
  border: 1px;
  background: var(--light-yellow);
}

ul {
  margin: 0;
  padding: 0 2em;
}

.TreeAlternateRow {
  background-color: #E5EDF3;
}

.TreeOrange {
  text-align: right !important;
  background-color: #FFE3C8;
}

.TreeGreen {
  text-align: right !important;
  background-color: #E6FFF4;
}

.TreeWhiteBorder {
  border: var(--theme-secondary-color) solid 1px;
}

.TreeWhiteBorderGrey,
.TreeYellowBorderGrey,
.TreeLightGreenBorderGrey,
.TreeVeryLightGreenBorderGrey,
.TreeLightRedBorderGrey,
.TreeLightBlueBorderGrey {
  border: #dcdcdc solid 1px;
}

.TreeYellow {
  text-align: right !important;
  background-color: var(--light-yellow);
}

.TreeYellowBorder {
  border: var(--theme-secondary-color) solid 1px;
  background-color: #FFFDC8;
}

.TreeYellowBorderGrey {
  background-color: #FFFDC8 !important;
}

.TreeLightGreen {
  background-color: #b6d3be;
}

.TreeLightGreenBorder {
  border: var(--theme-secondary-color) solid 1px;
  background-color: #b6d3be;
}

.TreeLightGreenBorderGrey {
  background-color: #b6d3be;
}

.TreeVeryLightGreenBorderGrey {
  background-color: var(--light-green) !important;
}

.TreeLightRed {
  text-align: right !important;
  background-color: var(--light-error-color);
}

.TreeGray {
  text-align: right !important;
  background-color: #cbcbcb;
}

.TreeLightPink {
  background-color: #ffe9e9;
}

.TreeOrangeBorder {
  border: var(--theme-secondary-color) solid 1px;
  background-color: #FFE3C8;
}

.TreeGreenBorder {
  border: var(--theme-secondary-color) solid 1px;
  background-color: #E6FFF4;
}

.TreeLightRedBorder {
  border: var(--theme-secondary-color) solid 1px;
  background-color: var(--light-error-color);
}

.TreeLightRedBorderGrey {
  background-color: var(--light-error-color);
}

.TreeLightBlue {
  text-align: right !important;
  background-color: #E3F1FF;
}

.TreeLightBlueBorder {
  border: var(--theme-secondary-color) solid 1px;
  background-color: #E3F1FF;
}

.TreeLightBlueBorderGrey {
  background-color: #E3F1FF !important;
}

.TreeVeryLightBlue {
  background-color: #e2eeff;
}

.TreeVeryLightBlueBorder {
  border: var(--theme-secondary-color) solid 1px;
  background-color: #e2eeff;
}

.TreeLightFucsia {
  background-color: #eeddff;
}

.TreeCyan {
  background-color: #aacacb;
}

.TreePink {
  background-color: #ffcdcd;
}

.BackScroll {
  background: #ffffcc;
}

.ItemBodyScroll {
  padding: 5px;
}

/* --------------------------------------------------------------------------
   16. Bottoni, submit, messaggi
   -------------------------------------------------------------------------- */

.submit {
  padding: 2px;
  font: bold var(--font-md) var(--theme-font);
  color: #FFFFFF;
  background-color: var(--theme-primary-color);
}

.messagge_info {
  font: italic 12px Verdana, Helvetica, sans-serif;
  color: #02B0DB;
}

.messagge_warning {
  color: var(--error-color);
}

.messagge_error {
  font: 12px Verdana, Helvetica, sans-serif;
  color: var(--error-color);
}

.font_check {
  font: 10px var(--theme-font);
  color: var(--theme-primary-color);
}

.text-disabled {
  background: #E6E6E6;
}

.no-border {
  border: none;
}

.number {
  text-align: right !important;
}

.TDmostraDati {
  font: 12px var(--theme-font);
  background: var(--light-yellow);
}

.TDmostraDatiBottomRight {
  font: 12px var(--theme-font);
  border-bottom: 1px solid var(--theme-secondary-color);
  border-right: 1px solid var(--theme-secondary-color);
  background: var(--light-yellow);
}

.TDmostraDatiBottom {
  font: 12px var(--theme-font);
  border-bottom: 1px solid var(--theme-secondary-color);
  background: var(--light-yellow);
}

.invisible_msg {
  display: block;
  padding: 3px 18px;
  font-family: Tahoma, system-ui;
  font-size: 12px;
  font-weight: normal;
  text-align: center;
  visibility: hidden;
}

.warning_msg,
.error_msg,
.info_msg,
.confirm_msg {
  display: block;
  margin: 5px 10px;
  padding: 16px 52px;
  font-size: 13px;
  font-weight: normal;
  color: #212121;
  text-align: left;
  border-radius: 16px;
  box-shadow: 0 4px 8px 0 #1D1D1D1A;
  backdrop-filter: blur(100px);
}

.warning_msg:before,
.error_msg:before,
.info_msg:before,
.confirm_msg:before {
  position: absolute;
  left: 16px;
  top: 16px;
  margin: 0;
  width: 1em;
  padding: 3px;
  font-size: 13pt;
  font-family: "siap-icons";
  font-style: normal;
  font-weight: normal;
  line-height: 1em;
  color: white;
  speak: never;
  text-align: center;
  text-decoration: inherit;
  font-variant: normal;
  text-transform: none;
  border-radius: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.error_msg {
  border: 2px solid #96212314;
  background: var(--light-error-color);
}

.error_msg:before {
  content: '\e873';
  background: #D11018;
}

.warning_msg {
  border: 2px solid #9E5E0014;
  background: #FFF1C8;
}

.warning_msg:before {
  content: '\e80a';
  background: #CC860A;
}

.info_msg {
  border: 2px solid #23498714;
  background: #E3F1FF;
}

.info_msg:before {
  content: '\e8cd';
  background: #1991EB;
}

.confirm_msg {
  border: 2px solid #016B4214;
  background: #E6FFF4;
}

.confirm_msg:before {
  content: '\e850';
  background: #00CD85;
}

.nobr {
  white-space: nowrap;
}

/* --------------------------------------------------------------------------
   17. UI (noTitleBar, tabs, modal, dropdown)
   -------------------------------------------------------------------------- */

.noTitleBar .ui-dialog-titlebar {
  display: none;
}

.noTitleBar .ui-dialog-content {
  padding: 0;
}

.ui-widget-content .ui-tabs-nav {
  user-select: none;
}

.ui-widget-content .ui-tabs-nav > .ui-state-default > a {
  margin: 0 5px 5px 0;
  font-size: .7em;
  font-weight: 500;
  color: var(--theme-primary-color);
  background: #f2f2f2;
  border: 0;
  border-radius: var(--default-margin);
  transition-duration: .1s;
}

.ui-widget-content .ui-tabs-nav > .ui-state-default > a:hover {
  color: white;
  background: var(--theme-default-hover) !important;
  border-radius: var(--default-margin) !important;
}

.ui-widget-content .ui-tabs-nav > .ui-tabs-selected a,
.ui-widget-content .ui-tabs-nav > .ui-state-active a {
  color: white !important;
  border: unset;
  background: var(--theme-primary-color) !important;
  border-radius: var(--default-margin) !important;
}

.ui-widget-content .TD2 {
  background: white;
}

.modal {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  padding: 10px;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 99999999;
}

.modal-content {
  margin: 0;
  padding: 0;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
}

.hide {
  display: none !important;
}

.tableIntesazione {
  width: 100%;
  padding: 1px;
  border-spacing: 2px;
}

.dropdown {
  position: relative;
}

.dropdown > .dropdown-content {
  position: absolute;
  right: 0;
  z-index: 1;
  display: none;
  min-width: 200px;
  padding: 0;
  opacity: 0;
  background: #f9f9f9;
  border-radius: var(--default-margin);
  box-shadow: 0 8px 16px rgba(0, 0, 0, .2);
  transition: opacity 120ms ease;
}

.dropdown > .dropdown-content.is-mounted {
  display: block;
}

.dropdown > .dropdown-content.is-mounted.dropdown--show {
  opacity: 1;
}

.dropdown > .dropdown-content > .dropdown-item:first-of-type {
  border-top-left-radius: var(--default-margin);
  border-top-right-radius: var(--default-margin);
}

.dropdown > .dropdown-content > .dropdown-item:last-of-type {
  padding-bottom: .75em;
  border-bottom: 0;
  border-bottom-left-radius: var(--default-margin);
  border-bottom-right-radius: var(--default-margin);
}

.dropdown > .dropdown-content > .dropdown-item {
  position: relative;
  display: block;
  padding: 1em;
  font-size: var(--font-sm);
  color: black;
  text-align: left;
  text-decoration: none;
  user-select: none;
  transition-duration: .1s;
}

.dropdown > .dropdown-content > .dropdown-item:not(:last-of-type)::before {
  position: absolute;
  bottom: 0;
  width: calc(100% - 2em);
  height: 1px;
  content: "";
  background: #ccc;
}

.dropdown > .dropdown-content > .dropdown-item:not(.dropdown-item--disabled) {
  cursor: pointer;
}

.dropdown > .dropdown-content > .dropdown-item:not(.dropdown-item--disabled):hover {
  color: var(--theme-primary-color);
  transition-duration: .1s;
}

.dropdown > .dropdown-content > .dropdown-item.dropdown-item--disabled {
  color: #ccc;
  cursor: default;
}

/* --------------------------------------------------------------------------
   18. Layout Welcome (containerLW, buttonLW, ecc.)
   -------------------------------------------------------------------------- */

.containerLW {
  display: flex;
  flex-direction: column;
  height: 80vh;
  margin: 0 .5em 0 1em;
  padding: 0 1em;
  font-size: 16px;
}

.headLW {
  margin: 1em 0 0;
}

.headLW h3 {
  font-size: 1em;
  color: #141522;
  text-align: left;
}

.buttonsContainerLW {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
}

.buttonsContainerLW a {
  display: flex;
  text-decoration: none;
}

.buttonCenterLW .buttonTextLW {
  font-size: 0.7em;
  color: #141522;
}

.buttonCenterLW .buttonTitleLW {
  font-size: 1.0em;
  font-weight: 600;
  color: #141522;
}

.buttonLW .buttonTitleLW {
  font-size: 1.0em !important;
  font-weight: normal !important;
  color: #141522;
  text-align: center;
}

.buttonContainerLW,
.buttonContainerUtilityLW {
  width: 19.5em;
  margin: 1em 0.5em;
  border: 1px solid rgba(0, 158, 224, 0.5);
  border-radius: 10px;
  box-shadow: 5px 5px 10px rgba(0, 158, 224, 0.05);
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}

.buttonContainerLW,
.buttonContainerLW a {
  height: 5em;
  font-size: 16px;
  font-weight: normal;
}

.buttonContainerUtilityLW a {
  height: 3em;
}

.buttonLW {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  font-size: 1.0em;
  font-weight: normal;
}

.buttonLeftLW {
  display: flex;
  flex: 1;
  align-items: center;
  justify-content: center;
}

.buttonLeftLW img {
  width: 2.5em;
  height: 2.5em;
}

.buttonLeftLW svg {
  fill: #009ee0;
}

.buttonCenterLW {
  display: flex;
  flex: 3;
  flex-direction: column;
  justify-content: center;
}

.buttonTitleContainerLW {
  margin-bottom: .3em;
}

/* --------------------------------------------------------------------------
   19. Custom elements
   -------------------------------------------------------------------------- */

s-skeleton {
  margin: 0;
  background-color: #e6e6e6;
  background-image: linear-gradient(90deg, #e6e6e6, #f1f1f1, #e6e6e6);
  background-size: 200px 100%;
  background-repeat: no-repeat;
  display: inline-block;
  padding: 0;
  animation: skeleton-animation 1.5s ease-in-out infinite;
}

@keyframes skeleton-animation {
  0% {
    background-position: -200px 0;
  }
  100% {
    background-position: calc(200px + 100%) 0;
  }
}

/* --------------------------------------------------------------------------
   20. Utility & responsive
   -------------------------------------------------------------------------- */

:not(td).hideOnTablet {
  display: block;
}

td.hideOnTablet {
  display: table-cell;
}

.showOnTablet {
  display: none;
}

@media screen and (max-width: 242px) {
  .hideOnTablet {
    display: none !important;
  }

  :not(td).showOnTablet {
    display: block;
  }

  td.showOnTablet {
    display: table-cell;
  }
}

.importo {
  text-align: right !important;
  padding-right: var(--default-margin) !important;
}

.border-select {
  border: 1px solid var(--light-blue) !important;
}

.light-yellow {
  background-color: var(--light-yellow) !important;
}

.light-green {
  background-color: var(--light-green) !important;
}

.button-primary {
  display: block;
  margin: .5em 0;
  padding: .5em;
  font-size: var(--font-md);
  font-weight: 400;
  font-family: var(--theme-font);
  color: white;
  text-decoration: none;
  cursor: pointer;
  user-select: none;
  border: none;
  border-radius: var(--default-margin);
  background-color: var(--primary-color);
  transition-duration: .1s;
}

.button-primary:hover {
  background-color: var(--theme-default-hover);
}

.center {
  text-align: center !important;
}

.left {
  text-align: left !important;
}

.right {
  text-align: right !important;
}