/*
 * Estilos propios del panel.
 *
 * Se cargan después de Bootstrap para poder ajustarlo, y sustituyen a los
 * bloques <style> que estaban incrustados dentro de base.html.twig.
 */

body {
    background-color: #b6cfdb;
    padding-top: 70px;
}

@media screen and (max-width: 768px) {
    body {
        padding-top: 15px;
    }
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Botonera del menú principal
   -------------------------------------------------------------------------- */

#menu_buttons a.awesome {
    display: inline-block;
    margin: 4px;
    padding: 8px 14px;
    border-radius: 4px;
    color: #fff;
    font-size: 13px;
    white-space: nowrap;
}

#menu_buttons a.awesome:hover {
    text-decoration: none;
    filter: brightness(1.1);
}

.awesome.red     { background-color: #b23b3b; }
.awesome.yellow  { background-color: #c9a227; }
.awesome.blue    { background-color: #3b6fb2; }
.awesome.magenta { background-color: #96468c; }
.awesome.green   { background-color: #3d711e; }

/* --------------------------------------------------------------------------
   Barra de navegación
   -------------------------------------------------------------------------- */

.navbar-primary .navbar {
    background: rgb(189, 226, 236);
    border-bottom: 2px solid rgb(151, 189, 199);
}

.navbar-primary .navbar .navbar-brand {
    color: #fff;
}

/* --------------------------------------------------------------------------
   Submenús desplegables
   -------------------------------------------------------------------------- */

.dropdown-submenu {
    position: relative;
}

.dropdown-submenu > .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover > .dropdown-menu {
    display: block;
}