/* Texto geral */
.general-text-title {
    font-family: Tahoma, "Trebuchet MS", sans-serif;
    font-size: 18pt;
    text-transform: uppercase;
    color: #3b4395;
    font-weight: bold;
}

.general-text-subtitle-1 {
    font-family: Tahoma, "Trebuchet MS", sans-serif;
    text-transform: uppercase;
    font-weight: bold;
}

.general-text-subtitle-2 {
    font-family: Tahoma, "Trebuchet MS", sans-serif;
    text-transform: capitalize;
    font-weight: bold;
}

.general-text-text {
    font-family: Tahoma, "Trebuchet MS", sans-serif;
    font-size: 14pt;
}

/* Bullets */
.bullets-hierarchy {
    list-style-type: disc;

    & ul {
        list-style-type: none;

        & li::before {
            content: '>';
            margin-right: 8px;
        }
    }
}


/* Estilo para caixa */
.text-box {
    border: none;
    background-color: #ededed;
    padding: 16px;
    width: auto;
    text-align: justify;
    font-family: Tahoma, "Trebuchet MS", sans-serif;
    font-size: 14px;
    color: #000000;
    width: 60%;
    margin-left: 25px;
}

.text-box-title {
    margin: 0;
    font-family: Tahoma, "Trebuchet MS", sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    color: #575756;
    background-color: #ffffff;
    display: block;
    position: relative;
    padding-left: 53px;

    &::before {
        content: '';
        display: inline-block;
        background-size: contain;
        width: 48px;
        height: 48px;
        margin-right: 8px;
        vertical-align: middle;
        position: absolute;
        top: -6px;
        left: 0;
        background-repeat: no-repeat;
    }
}

.text-box-title-alternative::before {
    background-image: url('https://cms-cdn.redballoon.nextpage.com.br/icone_box_alternative_f682a13aa6.png');
}

.text-box-title-extending::before {
    background-image: url('https://cms-cdn.redballoon.nextpage.com.br/icone_box_extending_b7de4dc850.png');
}

.text-box-title-extraactivity::before {
    background-image: url('https://cms-cdn.redballoon.nextpage.com.br/icone_box_extraactivity_4430bba0a0.png');
}

.text-box-title-futheryourself::before {
    background-image: url('https://cms-cdn.redballoon.nextpage.com.br/icone_box_furtheryourself_8a45ff764d.png');
}

.text-box-title-important::before {
    background-image: url('https://cms-cdn.redballoon.nextpage.com.br/icone_box_important_33a6dfd4e6.png');
}

.text-box-title-key::before {
    background-image: url('https://cms-cdn.redballoon.nextpage.com.br/icone_box_key_ed0cccb1eb.png');
}

.text-box-title-script::before {
    background-image: url('https://cms-cdn.redballoon.nextpage.com.br/icone_box_script_a3cb0b4485.png');
}

.text-box-title-storytime::before {
    background-image: url('https://cms-cdn.redballoon.nextpage.com.br/icone_box_storytime_c4e8651993.png');
}

.text-box-title-tip::before {
    background-image: url('https://cms-cdn.redballoon.nextpage.com.br/icone_box_tip_1e9dcbb8c9.png');
}

.text-box-title-videoscript::before {
    background-image: url('	https://cms-cdn.redballoon.nextpage.com.br/icone_box_videoscript_d2810ac0a4.png');
}

@media screen and (max-width: 768px) {
    .text-box {
        width: calc(100% - 25px);
        padding: 10px;
    }
}

/* Plugin styles */
:root {
    --ck-style-panel-columns: 2;
}

.ck.ck-dropdown.ck-style-dropdown {
    & .ck.ck-reset.ck-dropdown__panel {
        width: 700px;

        & .ck-style__selectedcount {
            color: var(--ck-color-base-active);
            padding: 4px var(--ck-spacing-large);
        }

        & .ck-style__row {
            display: grid;
            grid-template-columns: .6fr .2fr .2fr;
            gap: 5px;
            align-items: center;

            & .ck-style-button-checkall,
            .ck-style-button-uncheckall {
                border: 2px solid var(--ck-color-base-border);
                background: var(--ck-color-base-background);
                height: 30px;
                cursor: pointer;

                &:hover {
                    background: #939393;
                }
            }
        }

        & .ck.ck-labeled-field-view.ck-style-input-search {
            & input {
                width: 100%
            }
        }

        & .ck.ck-style-panel {
            max-height: 470px;
            overflow-y: auto;
            padding: var(--ck-spacing-large);

            & .ck.ck-style-panel__style-group>.ck-label {
                font-size: 24px;
                text-decoration: underline;
                width: 100%;
            }

            & .ck.ck-style-panel__style-group:not(:first-child)>.ck-label {
                border-top: 2px dashed rgb(255, 0, 0);
            }

            & .ck-style-grid {
                display: grid;
                grid-template-columns: repeat(2, 1fr) !important;
                justify-content: start;
                column-gap: var(--ck-spacing-large);
                row-gap: var(--ck-spacing-large);

                & .ck-style-grid__button {
                    display: flex;
                    justify-content: space-between;
                    flex-direction: column;
                    width: 100%;
                    height: 110px;
                    font-size: 11px;
                    flex-direction: column;
                    justify-content: space-between;
                    padding: 0;

                    &:hover:not(.ck-disabled):not(.ck-on) {
                        border-color: #b3b3b3;
                    }

                    &:not(:focus) {
                        border: 1px solid var(--ck-color-base-border);
                    }

                    &.ck-on {
                        border-color: var(--ck-color-base-active);

                        & span.ck.ck-button__label {
                            box-shadow: 0 -1px 0 var(--ck-color-base-active);
                        }
                    }

                    &:not(.ck-on) {
                        & span.ck.ck-button__label {
                            background: #f0f0f0;
                        }

                        &:hover {
                            & span.ck.ck-button__label {
                                background: #ebebeb;
                            }
                        }
                    }

                    & .ck-style-grid__button__preview {
                        align-content: center;
                        align-items: center;
                        display: flex;
                        flex-basis: 100%;
                        flex-grow: 1;
                        justify-content: flex-start;
                        background: var(--ck-color-base-background);
                        border: 2px solid var(--ck-color-base-background);
                        opacity: 1;
                        overflow: hidden;
                        padding: var(--ck-spacing-medium);
                        width: 100%;

                        &:hover,
                        &:active {
                            opacity: 1;
                        }
                    }

                    & span.ck.ck-button__label {
                        white-space: normal;
                        /* word-wrap: break-all; */
                        height: 30px;
                        flex-shrink: 0;
                        line-height: 22px;
                        overflow: hidden;
                        padding: 0 var(--ck-spacing-medium);
                        text-overflow: ellipsis;
                        width: 100%;
                        color: #32324D;

                    }
                }
            }
        }
    }


}