@import (reference) "./colortheme-all.less";

.help_main (@color, @bg-color) {
    --LessLoader_require: LessLoader_currentFile();

    --help-bg-color-l15: lighten(@bg-color, 15%);
    --help-bg-color-spin: spin(@bg-color, 180);
    --help-bg-color-spin-d10: darken(spin(@bg-color, 180), 10%);
    --help-bg-color-spin-l10: lighten(spin(@bg-color, 180), 10%);
}
& {
    .cp-help-container {
        position: relative;
        background-color: var(--help-bg-color-l15);
        &.cp-help-hidden {
            display: none;
        }

        .cp-help-close {
            position: absolute;
            top: 5px;
            right: 5px;
        }
        .cp-help-text {
            color: contrast(var(--help-bg-color-l15), #fff, #000); //@color;
            margin: 0;
            padding: 15px;
            a {
                //color: darken(@colortheme_link-color, 30%);
                color: contrast(var(--help-bg-color-l15), var(--help-bg-color-spin-l10), var(--help-bg-color-spin-d10));
                //color: darken(spin(var(--help-bg-color-l15), 180), 10%);
            }
            h1 {
                font-size: 20px;
            }
            h2 {
                font-size: 18px;
            }
            h3 {
                font-size: 16px;
            }
            ul, ol, p { margin: 0; }
        }
    }
}