body{font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,;line-height:1.5;font-size: 20px;}
header h1.site-title a{font-size: 64px;}
header h1.site-title a:hover{color:var(--font-color);border:0;}
header h1.site-title p{font-size: 20px;margin:0;}
header h1.site-title{line-height:1.25}
header.common-header{border-bottom:0;}
footer.common-footer{border-top:1px solid var(--switcher-bg-color);font-size: 14px;}
img.homepage_img{max-width: 100%;}
article header h1 {font-size: 25px;line-height: 1.25;margin-top: .5em;margin-bottom: 30px;font-weight: bold;}
div.content strong {font-weight: 700;}
p.center{text-align:center;}
div.common-footer-bottom{display:flex;justify-content:space-between;}
div.footer_spacer{width:100%;padding-top:1em;height:1em;}
.paragraph-space{margin-top:25px;}
div.themeSwitcher{position:relative;}
a img.weblate_svg{
  display: inline;
  margin: 0 0 0 9px;
  position: relative;
  top: 4px;
}
code{
  background-color: var(--pre-bg-color);
  padding: 1px 4px;
  border-radius: 5px;
}
.theme-switcher {
    background: var(--switcher-color);
    color: var(--switcher-bg-color);
    padding:0px;
    font-size:16px;
    border:none;
    border-radius:6px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin:-12px 0 0 -12px;
}
div.miczit_bg {
    background: url("/images/home.jpg") no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: -1000;
}
div.miczit_spacer {
  height: calc(90vh - 150px);
}
.common-footer {
    padding-top: 1em;
    margin-top: 0em;
  }
.small_text{
    font-size: 0.8em;
    font-style: italic;
}

  #cookie-notice {
    text-align: center;
    position: fixed;
    bottom: 0;
    left: 0;
    padding-top: 5px;
    padding-bottom: 5px;
    width: 17%;
    background: rgb(70, 70, 70);
    color: rgba(255,255,255,0.8);
    font-size: 15px;
  }
    
    #cookie-notice a {font-weight: 600; display: inline-flex; cursor: pointer; margin-left: 0.5rem;}
    #cookie-notice-accept {color:rgb(121, 121, 121)}
    #cookie-notice-deny {color:rgb(44, 44, 44)}
    @media (max-width: 767px) {
        #cookie-notice span {display: block; padding-top: 3px; margin-bottom: 1rem;}
        #cookie-notice a {position: relative; bottom: 4px;}
        #cookie-notice {left: 0px;}
    }

    /* Thunderbird Addon Translate page*/
    .thtr-help-normal {
      border: 1px solid #000;
    }
    .thtr-box {
      display: inline-block;
      position: relative;
      top: 5px;
      min-width: 30px;
      min-height: 20px;
    }
    .thtr-help-empty {
      -webkit-box-shadow: 0 0 3px 0 red;
      box-shadow: 0 0 3px 0 red;
    }
    .thtr-help-diff {
      -webkit-box-shadow: 0 0 2px 1px orange;
      box-shadow: 0 0 2px 1px orange;
    }
    .thtr-unchanged {
      background-color: #ddd;
      color: #bbb;
    }
    .thtr-todo {
      background-color: #ccc;
      color: #000;
    }
    .thtr-done {
      background-color: #c2f0c2;
      color: #28a428;
    }
    .sup_comment{
      font-size: 0.8em;
      font-style: italic;
    }
    .perm_desc{
      font-size: 0.9em;
    }
    .translate-credits{
      font-size: 0.65em;
      font-style: italic;
      position: relative;
      top: -10px;
      margin-bottom: 0;
    }
    ul.translate-links{
      display: flex;
      flex-direction: column; /* Disposizione verticale */
      gap: 0px;               /* Spazio tra gli elementi */
      padding: 0;
      margin: 2em 0 0 3em;
    }
    img.img-full {
      width: auto;
      height: auto;
      max-width: none;
    }
    hr {
      border-top: 1px solid var(--hr-color) !important;
      height: 1px;
      margin-top: 3em;
      margin-bottom: 2em;
    }
#placeholders-control {
    display: inline-flex;
    flex-wrap: wrap;
    max-width: 100%;
    margin: 1em 0;
    padding: 3px;
    gap: 3px;
    background-color: color-mix(in srgb, var(--font-color) 8%, var(--bg-color));
    border: 1px solid var(--hr-color);
    border-radius: 8px;
}

.placeholder-ctrl {
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--font-color);
    color: color-mix(in srgb, var(--font-color) 72%, var(--bg-color));
    font: inherit;
    padding: 0.35em 0.9em;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.placeholder-ctrl:hover:not(.active) {
    color: var(--font-color);
    background-color: color-mix(in srgb, var(--font-color) 8%, transparent);
}

.placeholder-ctrl.active {
    background-color: var(--bg-color);
    color: var(--font-color);
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

.placeholder-ctrl:focus-visible {
    outline: 2px solid var(--font-color);
    outline-offset: 2px;
}

table.guides {
    border-collapse: collapse;
    width: 100%;
    margin: 10px 0;
}
table.guides th, table.guides td {
    border: 1px solid #ccc;
    padding: 8px 12px;
    text-align: left;
}
table.guides th {
    font-weight: bold;
}
pre.tutorial {
    margin: 8px 0 12px 0;
    padding: 10px;
    border-radius: 9px;
}
h2.tutorial {
    margin-top: 1.6em;
}
div.img_center{
  width: 100%;
  text-align: center;
}
.lang-switcher {
    margin-bottom: 1em;
    font-size: 0.9em;
}
.lang-switcher a {
    margin-right: 0.75em;
    color: var(--link-color);
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.lang-switcher a:hover {
    border-bottom-color: var(--link-color);
}
.lang-switcher a.current {
    font-weight: bold;
    color: var(--font-color);
    cursor: default;
    pointer-events: none;
}
details {
    border: 1px solid var(--hr-color);
    border-radius: 8px;
    margin: 0.8em 0;
    padding: 0 1em;
}
details > summary {
    cursor: pointer;
    font-weight: 600;
    padding: 0.6em 0.2em;
    margin: 0 -0.2em;
    border-radius: 6px;
}
details > summary:hover {
    background-color: color-mix(in srgb, var(--font-color) 8%, transparent);
}
details[open] > summary {
    border-bottom: 1px solid var(--hr-color);
    border-radius: 6px 6px 0 0;
    margin-bottom: 0.8em;
}
details > summary:focus-visible {
    outline: 2px solid var(--font-color);
    outline-offset: 2px;
}
details > *:last-child {
    margin-bottom: 1em;
}
.admon {
    background-color: color-mix(in srgb, var(--font-color) 6%, var(--bg-color));
    border-left: 4px solid var(--hr-color);
    border-radius: 0 8px 8px 0;
    padding: 0.8em 1.2em;
    margin: 1.2em 0;
}
.admon h3 {
    margin-top: 0.2em;
}
.admon > *:last-child {
    margin-bottom: 0.2em;
}
.admon.warn {
    border-left-color: color-mix(in srgb, #e8a317 70%, var(--font-color));
    background-color: color-mix(in srgb, #e8a317 10%, var(--bg-color));
}
.admon.wip {
    border-left-color: color-mix(in srgb, #e8620c 75%, var(--font-color));
    background-color: color-mix(in srgb, #e8620c 14%, var(--bg-color));
}
.policy-key-filter {
    display: flex;
    align-items: center;
    gap: 0.8em;
    margin: 0.6em 0 1.2em 0;
}
#policy-key-search {
    flex: 1 1 auto;
    max-width: 22em;
    font: inherit;
    font-size: 0.9em;
    color: var(--font-color);
    background-color: var(--bg-color);
    border: 1px solid var(--hr-color);
    border-radius: 6px;
    padding: 0.4em 0.7em;
}
#policy-key-search:focus-visible {
    outline: 2px solid var(--font-color);
    outline-offset: 1px;
}
table.policy-keys td:first-child {
    word-break: break-word;
}
/* Sticky section nav (enterprise configuration guide) */
html {
    scroll-behavior: smooth;
}
/* The wrapper is sticky, draws the bar and is the containing block of the submenus, so
   they are not clipped by the horizontal scrolling of the bar itself. The scrolling nav
   must not carry backdrop-filter/filter/transform: any of them would make it the
   containing block instead and clip the submenus. */
#section-nav-wrap {
    position: sticky;
    top: 0;
    z-index: 20;
    margin: 1.5em 0 2em 0;
    background-color: color-mix(in srgb, var(--bg-color) 92%, var(--font-color));
    border: 1px solid var(--hr-color);
    border-radius: 10px;
    backdrop-filter: blur(8px);
}
#section-nav {
    display: flex;
    gap: 2px;
    padding: 6px;
    overflow-x: auto;
    scrollbar-width: none;
    border-radius: 10px;
    font-size: 0.8em;
}
/* Centered entries. Auto margins instead of justify-content: center, which would push
   the first entries out of reach on the left when the bar scrolls on narrow screens. */
#section-nav > :first-child {
    margin-left: auto;
}
#section-nav > :last-child {
    margin-right: auto;
}
#section-nav::-webkit-scrollbar {
    display: none;
}
#section-nav a {
    flex: 0 0 auto;
    padding: 0.45em 0.85em;
    border-radius: 7px;
    border-bottom: 0;
    white-space: nowrap;
    text-decoration: none;
    color: color-mix(in srgb, var(--font-color) 68%, var(--bg-color));
    transition: background-color 0.15s ease, color 0.15s ease;
}
#section-nav a:hover {
    color: var(--font-color);
    background-color: color-mix(in srgb, var(--font-color) 9%, transparent);
    border-bottom: 0;
}
#section-nav a.current {
    color: var(--font-color);
    background-color: var(--bg-color);
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.22);
}
/* A parent entry that opens a submenu of its sub-sections on hover or focus. */
#section-nav .nav-group {
    display: flex;
    flex: 0 0 auto;
}
#section-nav .nav-sub {
    display: none;
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    flex-direction: column;
    gap: 2px;
    min-width: 11em;
    padding: 6px;
    background-color: color-mix(in srgb, var(--bg-color) 92%, var(--font-color));
    border: 1px solid var(--hr-color);
    border-radius: 10px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
}
#section-nav .nav-group.open .nav-sub,
#section-nav .nav-group:focus-within .nav-sub {
    display: flex;
}
#section-nav .nav-sub a.current {
    box-shadow: none;
}
/* Headings must clear the sticky bar when jumped to. */
#section-nav-wrap ~ h2[id],
#section-nav-wrap ~ h3[id] {
    scroll-margin-top: 4em;
}
@media (max-width: 480px) {
    #section-nav-wrap {
        margin-left: -1em;
        margin-right: -1em;
        border-radius: 0;
    }
    #section-nav {
        font-size: 0.75em;
        border-radius: 0;
    }
}
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}