html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
    background-color: #0d1117;
    color: #f0f3f6;
}

/* =========================
   CABECERA
   ========================= */

.navbar {
    background-color: #161b22 !important;
    border-color: #30363d !important;
}

    .navbar-brand,
    .navbar .nav-link,
    .navbar span {
        color: #f0f3f6 !important;
    }

        .navbar .nav-link:hover {
            color: #58a6ff !important;
        }

    .navbar .text-danger {
        color: #ff7b72 !important;
    }

/* =========================
   TEXTOS
   ========================= */

h1,
h2,
h3,
h4,
h5,
h6,
strong,
label {
    color: #f0f3f6;
}

p {
    color: #b7c0ca;
}

/* =========================
   FORMULARIOS
   ========================= */

.form-control,
.form-select {
    background-color: #161b22;
    color: #f0f3f6;
    border: 1px solid #30363d;
}

    .form-control:focus,
    .form-select:focus {
        background-color: #161b22;
        color: #ffffff;
        border-color: #258cfb;
        box-shadow: 0 0 0 0.1rem #0d1117, 0 0 0 0.25rem rgba(37, 140, 251, 0.30);
    }

    .form-control::placeholder {
        color: #8b949e;
    }

    /* Opciones del desplegable */
    .form-select option {
        background-color: #161b22;
        color: #ffffff;
    }

/* =========================
   TARJETAS DE OPORTUNIDAD
   ========================= */

.border.rounded {
    background-color: #161b22;
    border-color: #30363d !important;
}

/* =========================
   BADGES CUOTA / MERCADO
   ========================= */

.badge.bg-dark {
    background-color: #05080c !important;
    border: 1px solid #3a414a;
    color: #ffffff !important;
}

/* =========================
   BOTONES
   ========================= */

.btn-primary {
    background-color: #1677ff;
    border-color: #1677ff;
}

    .btn-primary:hover {
        background-color: #1268df;
        border-color: #1268df;
    }

.btn-success {
    background-color: #14945f;
    border-color: #14945f;
}

    .btn-success:hover {
        background-color: #107a4e;
        border-color: #107a4e;
    }

.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 0.1rem #0d1117, 0 0 0 0.25rem #258cfb;
}

/* =========================
   OPORTUNIDAD DESBLOQUEADA
   ========================= */

.alert-success {
    background-color: #102b22;
    border-color: #1d684d;
    color: #d4f8e8;
}

    .alert-success strong {
        color: #7ee2b8;
    }

/* =========================
   MENSAJES
   ========================= */

.alert-warning {
    background-color: #332b13;
    border-color: #725c17;
    color: #ffe69c;
}

.alert-danger {
    background-color: #35171a;
    border-color: #842029;
    color: #ffb3b8;
}

/* =========================
   FOOTER
   ========================= */

.footer {
    background-color: #0d1117;
    border-color: #30363d !important;
    color: #8b949e !important;
}

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

a {
    color: #58a6ff;
}

    a:hover {
        color: #79c0ff;
    }