/*
  Webfont guide (/manual/en/guides/webfont/)
*/
/* vollkorn-600 - latin */
@font-face {
    font-family: 'Vollkorn';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('src-webfont/vollkorn-v12-latin-600.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('src-webfont/vollkorn-v12-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('src-webfont/vollkorn-v12-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
    url('src-webfont/vollkorn-v12-latin-600.woff') format('woff'), /* Modern Browsers */
    url('src-webfont/vollkorn-v12-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
    url('src-webfont/vollkorn-v12-latin-600.svg#Vollkorn') format('svg'); /* Legacy iOS */
}
/* vollkorn-700italic - latin */
@font-face {
    font-family: 'Vollkorn';
    font-style: italic;
    font-weight: 700;
    font-display: swap;
    src: url('src-webfont/vollkorn-v12-latin-700italic.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('src-webfont/vollkorn-v12-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('src-webfont/vollkorn-v12-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('src-webfont/vollkorn-v12-latin-700italic.woff') format('woff'), /* Modern Browsers */
    url('src-webfont/vollkorn-v12-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('src-webfont/vollkorn-v12-latin-700italic.svg#Vollkorn') format('svg'); /* Legacy iOS */
}

.fontDemoLyric {
    font-family: 'Vollkorn', serif;
    background-color: #F0B37E;
    border-radius: 8px;
    color: #ffffff;
    font-style: italic;
    font-weight: 700;
    font-size: 40px;
    line-height: 30px;
    padding: 20px 20px;
    margin: 10px 0 10px 0;
}

.fontDemoAuthor {
    font-family: 'Vollkorn', serif;
    color: #666666;
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    padding: 0;
    margin: 0;
}

/*
  User-module guide (/manual/en/layout/module-management/user-modules/)
*/
.user-module .formbody .invisible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.user-module .formbody {
    background: #f2f2f2;
    border: 1px solid #ddd;
    padding: 20px;
    min-width: 250px;
    width: 80%;
}

.user-module .formbody label {
    margin-bottom: 0.125rem;
}

.user-module .formbody .checkbox_container {
    border: none;
    margin: 0 0 20px 0;
    padding: 0;
}

.user-module .formbody .password-reset {
    margin-top: 15px;
}

.user-module .formbody .checkbox_container label {
    display: inline;
}

.user-module .formbody .error {
    color: #ff0000;
}

.user-module .formbody .submit {
    background: #f47c00;
    color: #fff;
    padding: 5px 10px;
}

html[data-theme=dark] .user-module .formbody {
    background: var(--MENU-SEARCH-BG-color);
    border: 1px solid var(--BLOCK-QUOTE-BORDER-color);
}

html[data-theme=dark] .user-module input {
    background: var(--MENU-SEARCH-BG-color);
    border: 1px solid var(--BLOCK-QUOTE-BORDER-color);
}

/*
  Converter tools (/manual/en/system/settings/)
*/
.env-converter {
    display: inline-block;
    background: var(--MAIN-BODY-background);
    padding: 1rem 1rem 0.25rem;
    border: 1px solid var(--CODE-BORDER-color);
    border-radius: 6px;
}

.env-converter .env-widget {
    position: relative;
    background: inherit;
}

.env-converter .env-widget input,
.env-converter .env-widget label {
    font-size: 1rem;
    box-sizing: border-box;
}

.env-converter .env-widget input {
    padding: 0 0.75rem;
    background: none;
    border-radius: 6px;
    inline-size: 600px;
    height: 2.5rem;
    outline: none;
    resize: none;
    z-index: 1;
}

.env-converter .env-widget input + label {
    position: absolute;
    inset: -0.5rem auto auto 0.75rem;
    padding: 0 0.25rem;
    font-weight: 300;
    max-inline-size: calc(600px - 1.5rem);
    block-size: 3.5rem;
    line-height: 3.5rem;
    opacity: 0.8;
    transition: all 0.2s;
    white-space: nowrap;
    user-select: none;
    pointer-events: none;
}

.env-converter .env-widget.separator {
    border-bottom: 1px solid var(--CODE-BORDER-color);
    margin-bottom: 0.85rem;
}

.env-converter .env-widget > :is(:focus + label, [placeholder]:not(:placeholder-shown) + label, label.placeholder-active) {
    background: inherit;
    block-size: 1rem;
    line-height: 1rem;
    font-size: 0.75rem;
    opacity: 1;
}

/*
  Issue workflow (/dev/internals/issue-workflow/)
*/
span[class^="issue-label-"] {
    padding: 0 3px 2px;
    border-radius: 3px;
}

.issue-label-bug {
    background-color: #bd2c00;
    color: #fff;
}

.issue-label-feature {
    background-color: #3364b7;
    color: #fff;
}

.issue-label-discuss {
    background-color: #86c60d;
}

.issue-label-help {
    background-color: #c4dcfc;
}

.issue-label-status {
    background-color: #fbca04;
}

html[data-theme=dark] .issue-label-bug {
    border: 1px solid rgba(255, 131, 96, 0.3);
    background: rgba(189, 44, 0, 0.18);
    color: rgb(255, 131, 96);
}

html[data-theme=dark] .issue-label-feature {
    border: 1px solid rgba(126, 161, 219, 0.3);
    background: rgba(51, 100, 183, 0.18);
    color: rgb(126, 161, 219);
}

html[data-theme=dark] .issue-label-discuss {
    border: 1px solid rgba(135, 196, 14, 0.3);
    background: rgba(134, 198, 13, 0.18);
    color: rgb(135, 196, 14);
}

html[data-theme=dark] .issue-label-help {
    border: 1px solid rgba(192, 218, 252, 0.3);
    background: rgba(196, 220, 252, 0.18);
    color: rgb(192, 218, 252);
}

html[data-theme=dark] .issue-label-status {
    border: 1px solid rgba(250, 201, 5, 0.3);
    background: rgba(251, 202, 4, 0.18);
    color: rgb(250, 201, 5);
}
