@import url('https://fonts.googleapis.com/css2?family=Bai+Jamjuree:wght@400;500;600;700&display=swap');

:root {
    --color-body: #939393;
    --color-heading: #ffffff;
    --color-base: #333333;
    --color-base2: #222222;
    --color-brand: #0ca940;
    --color-brand2: #0dce4d;
    --sidbar-width: 240px;
    --font-base: "Bai Jamjuree";

    /*Paleta de Colores
    Opción 1: b6cbce eef3db 153B44 071C21 deff58 C6DE41;
    Opción 2: b6cbce eef3db 153B44 071C21 fdff00 cacc00;
    Opción 3: adadad ffffff 2a0d63 100028 00bfe7 006980;
    */

}

/* CONTACT */
.form-control {
    background-color: var(--color-base2);
    border-color: var(--color-base);
    color: var(--color-body);
}

.form-control:focus {
    background-color: var(--color-base2);
    border-color: var(--color-brand);
    box-shadow: none;
    color: var(--color-body);
}

.form-control::placeholder {
    color: var(--color-body);
}

input.form-control {
    height: 44px;
}


.label-white { color: #fff; font-weight: bold}


/* BTN */
.btn {
    padding: 12px 28px;
    font-weight: 700;
}

.btn-brand {
    background-color: var(--color-brand);
    border-color: var(--color-brand);
    color: var(--color-base);
}

.btn-text { color: #fff; }
.btn-text:hover { color: #fff; }

.btn-text3 { color: #fff; }
.btn-text3:hover { color: #fff; }

.btn-brand:hover,
.btn-brand:focus {
    background-color: var(--color-brand2);
    color: #fff;
    border-color: var(--color-brand2);
}

.btn-brand2 {
    background-color: var(--color-base);
    border-color: var(--color-heading);
    color: var(--color-heading);
}

.btn-brand2:hover,
.btn-brand2:focus {
    background-color: var(--color-base2);
    color: #fff;
    border-color: var(--color-heading);
}

#resultadoLink {
    padding: 10px;
    border-radius: 5px;
}

#predefinedTextPreview {
    padding: 10px;
    border-radius: 5px;
    background-color: var(--color-base2);
}