@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@600&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400&display=swap");


:root {
  --Confluence-dunkelgrau:  #1d2125;
  --Confluence-schrift:     #b6c2cf;
  --Confluence-tabelle:     #454f59;

  --Consolinno-dunkelgruen: #03693A;
  --Consolinno-mittelgruen: #83BC32;
  --Consolinno-hellgruen:   #BDD786;
  --Consolinno-akzentgruen: #009878;
  --Consolinno-gruengrau:   #B8C8BA;
  --Consolinno-mittelgrau:  #4B585B;
  --Consolinno-dunkelgrau:  #343E40;
  --Consolinno-hellgrau:    #F4F6F4;

  --Consolinno-verlauf: linear-gradient(to right, #03693A, #83BC32);

  --vpt-theme-primary-color: #83BC32;
  --vpt-theme-header-background-color: #343E40;
  --vpt-theme-footer-background-color: #343E40;
  --vpt-theme-headline-font: "Poppins ExtraBold", ui-sans-serif, sans-serif;
  --vpt-theme-text-font: "Poppins", Verdana, ui-sans-serif, sans-serif;
  --vpt-theme-roundness: 2;

  --K15t-font-family-headline: "Poppins SemiBold", ui-sans-serif, sans-serif;
  --K15t-font-family-body: "Poppins", ui-sans-serif, sans-serif;
}

@media (prefers-color-scheme: dark) {
  :root {
    --vpt-theme-primary-color: #83BC32;
    --vpt-theme-header-background-color: #181818;
    --vpt-theme-header-foreground-color: var(--K15t-foreground);
    --vpt-theme-footer-background-color: #181818;
    --vpt-theme-footer-foreground-color: var(--K15t-foreground);
    --vpt-theme-headline-color: #aaaaaa;
    --vpt-theme-headline-font: "Poppins ExtraBold", ui-sans-serif, sans-serif;
    --vpt-theme-text-font: "Poppins", Verdana, ui-sans-serif, sans-serif;
    --vpt-theme-roundness: 2;

    --K15t-foreground-on-information: lightskyblue;
    --K15t-foreground-on-tip: indigo;
    --K15t-foreground-on-danger: wheat;
    --K15t-foreground-on-success: palegreen;
    --K15t-background-information: var(--Consolinno-dunkelgruen);
    --K15t-background-warning: var(--Consolinno-dunkelgrau);
    --K15t-background-tip: slateblue;
    --K15t-background-danger: maroon;
    --K15t-background-success: var(--Consolinno-dunkelgruen);

    --K15t-link: var(--Consolinno-mittelgruen);
    --K15t-link-visited: #5FA61A;

    --K15t-surface: #222222;
    --K15t-surface-raised: #333333;
    --K15t-surface-overlay: var(--Consolinno-hellgrau);
    --K15t-foreground: #aaaaaa;
    --K15t-foreground-subtle: var(--Consolinno-mittelgruen);
    --K15t-background-neutral: var(--Consolinno-dunkelgruen);
    --K15t-background-neutral-hovered: var(--Consolinno-akzentgruen);
    --K15t-background-neutral-subtle-hovered: #666666;
    --K15t-background-neutral-subtle-selected: #F4F6F4;
    --K15t-background-input: var(--K15t-surface-raised);
    --K15t-border-neutral: #222222;
    --K15t-border-neutral-strong: var(--Consolinno-mittelgrau);
    --K15t-border-neutral-strong-selected: var(--Consolinno-mittelgrau);
    --K15t-banner-background: #181818;

    --K15t-color-neutral-25: #c1c1c6;
    --K15t-color-neutral-50: #a4a4ab;
    --K15t-color-neutral-100: #888890;
    --K15t-color-neutral-200: #6b6b75;
    --K15t-color-neutral-300: #4e4e5b;
    --K15t-color-neutral-400: #313140;
    --K15t-color-neutral-500: #2a2a37;
    --K15t-color-neutral-600: #23232e;
    --K15t-color-neutral-700: #1c1c25;
    --K15t-color-neutral-800: #16161c;
    --K15t-color-neutral-900: #0f0f13;
  }
}

@media (prefers-color-scheme: light) {
  :root {
    --vpt-theme-primary-color: #83BC32;
    --vpt-theme-header-background-color: #181818;
    --vpt-theme-header-foreground-color: #83BC32;
    --vpt-theme-footer-foreground-color: #83BC32;
    --vpt-theme-headline-color: #343E40;
    --vpt-theme-banner-background-color: #F4F6F4;
    --vpt-theme-headline-font: "Poppins ExtraBold", ui-sans-serif, sans-serif;
    --vpt-theme-text-font: "Poppins", Verdana, ui-sans-serif, sans-serif;
    --vpt-theme-roundness: 2;

    --K15t-foreground-on-information: lightskyblue;
    --K15t-foreground-on-tip: indigo;
    --K15t-foreground-on-danger: #BDD786;
    --K15t-foreground-on-success: #009878;
    --K15t-background-information: #B8C8BA;
    --K15t-background-warning: #888888;
    --K15t-background-tip: #83BC32;
    --K15t-background-danger: #03693A;
    --K15t-background-success: #83BC32;

    --K15t-link: var(--Consolinno-mittelgruen);
    --K15t-link-visited: #5FA61A;

    --K15t-surface: #F4F6F4;
    --K15t-surface-raised: #E0E0E0;
    --K15t-surface-overlay: #FFFFFF;
    --K15t-foreground: #343E40;
    --K15t-foreground-subtle: #83BC32;
    --K15t-background-neutral: var(--Consolinno-mittelgruen);
    --K15t-background-neutral-hovered: #83BC32;
    --K15t-background-neutral-subtle-hovered: #666666;
    --K15t-background-neutral-subtle-selected: #343E40;
    --K15t-background-input: #E0E0E0;
    --K15t-border-neutral: #F4F6F4;
    --K15t-border-neutral-strong: #4B585B;
    --K15t-border-neutral-strong-selected: #4B585B;
    --K15t-banner-background: #F4F6F4;

    --K15t-color-neutral-25: #c1c1c6;
    --K15t-color-neutral-50: #a4a4ab;
    --K15t-color-neutral-100: #888890;
    --K15t-color-neutral-200: #6b6b75;
    --K15t-color-neutral-300: #4e4e5b;
    --K15t-color-neutral-400: #313140;
    --K15t-color-neutral-500: #2a2a37;
    --K15t-color-neutral-600: #23232e;
    --K15t-color-neutral-700: #1c1c25;
    --K15t-color-neutral-800: #16161c;
    --K15t-color-neutral-900: #0f0f13;
  }
}




/* =====================================================
   CONTENT PANELS / HINWEISBOXEN
   ===================================================== */

/* Basis */

[data-component="panel"] {
    border-radius: 12px;
    padding: 16px 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* INFO */

[data-component="panel"][data-appearance="info"] {
    border-left: 10px solid var(--Consolinno-mittelgruen);
}

/* WARNING */

[data-component="panel"][data-appearance="warning"] {
    border-left: 10px solid #FF9800;
    font-weight: 600;
}


/* =====================================================
   FAQ / NOTE
   ===================================================== */

[data-component="panel"][data-appearance="note"] {
    border-left: 8px solid var(--Consolinno-mittelgruen);
    font-weight: 600;
}


/* =====================================================
   SYSTEM THEME (Browser / Betriebssystem)
   ===================================================== */

@media (prefers-color-scheme: dark) {

    html:not(.force-light) [data-component="panel"][data-appearance="info"] {
        background: #14452D !important;
        color: #FFFFFF !important;
    }

    html:not(.force-light) [data-component="panel"][data-appearance="info"] * {
        color: #FFFFFF !important;
    }

    html:not(.force-light) [data-component="panel"][data-appearance="warning"] {
        background: #4D3210 !important;
        color: #FFE8A3 !important;
    }

    html:not(.force-light) [data-component="panel"][data-appearance="warning"] * {
        color: #FFE8A3 !important;
    }
  
    html:not(.force-light) [data-component="panel"][data-appearance="note"] {
        background: #343E40 !important;
        color: #F4F6F4 !important;
    }

    html:not(.force-light) [data-component="panel"][data-appearance="note"] * {
        color: #F4F6F4 !important;
    }

}

@media (prefers-color-scheme: light) {

    html:not(.force-dark) [data-component="panel"][data-appearance="info"] {
        background: #E8F4E3 !important;
        color: #1D2125 !important;
    }

    html:not(.force-dark) [data-component="panel"][data-appearance="info"] * {
        color: #1D2125 !important;
    }

    html:not(.force-dark) [data-component="panel"][data-appearance="warning"] {
        background: #FFF3D8 !important;
        color: #1D2125 !important;
    }

    html:not(.force-dark) [data-component="panel"][data-appearance="warning"] * {
        color: #1D2125 !important;
    }

  
    html:not(.force-dark) [data-component="panel"][data-appearance="note"] {
        background: #F4F6F4 !important;
        color: #343E40 !important;
    }

     html:not(.force-dark) [data-component="panel"][data-appearance="note"] * {
        color: #343E40 !important;
     }

}

/* =====================================================
   MANUELLER THEME-TOGGLE
   ===================================================== */

html.force-light [data-component="panel"][data-appearance="info"] {
    background: #E8F4E3 !important;
    color: #1D2125 !important;
}

html.force-light [data-component="panel"][data-appearance="info"] * {
    color: #1D2125 !important;
}

html.force-light [data-component="panel"][data-appearance="warning"] {
    background: #FFF3D8 !important;
    color: #1D2125 !important;
}

html.force-light [data-component="panel"][data-appearance="warning"] * {
    color: #1D2125 !important;
}

html.force-dark [data-component="panel"][data-appearance="info"] {
    background: #14452D !important;
    color: #FFFFFF !important;
}

html.force-dark [data-component="panel"][data-appearance="info"] * {
    color: #FFFFFF !important;
}

html.force-dark [data-component="panel"][data-appearance="warning"] {
    background: #4D3210 !important;
    color: #FFE8A3 !important;
}

html.force-dark [data-component="panel"][data-appearance="warning"] * {
    color: #FFE8A3 !important;
}


html.force-light [data-component="panel"][data-appearance="note"] {
    background: #F4F6F4 !important;
    color: #343E40 !important;
}

html.force-light [data-component="panel"][data-appearance="note"] * {
    color: #343E40 !important;
}

html.force-dark [data-component="panel"][data-appearance="note"] {
    background: #343E40 !important;
    color: #F4F6F4 !important;
}

html.force-dark [data-component="panel"][data-appearance="note"] * {
    color: #F4F6F4 !important;
}


/* =====================================================
   FAQ ICON FARBE
   ===================================================== */

[data-component="panel"][data-appearance="note"]::before {
    color: var(--Consolinno-dunkelgruen) !important;
}



/* =====================================================
   NAVIGATION V3
   ===================================================== */

/* Hover */

.tree-item-header a:hover {
    background: rgba(131,188,50,0.08);
    border-radius: 6px;
}

/* Aktive Seite */

.tree-item-header a[aria-current="page"] {
    background: transparent !important;
    border-left: 4px solid var(--Consolinno-mittelgruen) !important;
    padding-left: 12px !important;

    color: var(--Consolinno-mittelgruen) !important;
    font-weight: 700 !important;

    border-radius: 0 !important;
}

/* Geöffnete Kapitel */

.tree-action[aria-expanded="true"] + a {
    color: var(--Consolinno-mittelgruen);
    font-weight: 700;
}

/* Graue Hintergründe entfernen */

.tree-item-header,
.tree-item-header:has(.tree-action[aria-expanded="true"]) {
    background: transparent !important;
}



/* =====================================================
   DOKUMENTINHALT LINKS
   ===================================================== */

.article-page-body a {
    color: var(--Consolinno-mittelgruen);
}

.article-page-body a:visited {
    color: #5FA61A;
}

.article-page-body a:hover,
.article-page-body a:focus {
    color: var(--Consolinno-akzentgruen);
    text-decoration: underline;
}

/* =====================================================
   QR CODE DARK MODE
   ===================================================== */


html.force-dark figure[data-component="figure"] img {
    background: #ffffff;
    padding: 8px;
    border-radius: 8px;
}