//
// This file is part of Moodle - http://moodle.org/
//
// Moodle is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// Moodle is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
//
//
// Adaptable Menu Style sheet
//
// @package    theme_adaptable
// @copyright  2015-2016 Jeremy Hopkins (Coventry University)
// @copyright  2015-2019 Fernando Acedo (3-bits.com)
// @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
//

// Navwrap.
#adaptable-page-header-wrapper #main-navbar {
    background-color: [[setting:menubkcolor]];
    border-bottom: 3px solid [[setting:menubordercolor]];
    clear: both;
    z-index: 100;

    .navbar .navbar-nav > {
        li:first-child > a.dropdown-toggle {
            margin-left: -[[setting:menufontpadding]];
        }

        li:last-child > a.dropdown-toggle {
            margin-right: -[[setting:menufontpadding]];
        }
    }
}

// Remove caret from navbar menus and change margin.
#adaptable-page-header-wrapper {
    .above-header,
    #main-navbar {
        .dropdown-toggle::after {
            [[setting:navbardisplaymenuarrow]]
            margin-left: 0.25rem;
            margin-right: 0;
        }
        .icon-no-margin.dropdown-toggle::after {
            margin-left: 0;
        }
    }
}

// New main navbar styling */
#adaptable-page-header-wrapper #main-navbar {
    .navbar-nav {
        margin-left: -[[setting:menufontpadding]];

        > li > a.nav-link,
        > li > div.nav-link,
        .context-header-settings-menu .action-menu-trigger a.dropdown-toggle,
        .context-header-settings-menu .action-menu-trigger a.dropdown-toggle:hover,
        .region-main-settings-menu .action-menu-trigger a.dropdown-toggle,
        .region-main-settings-menu .action-menu-trigger a.dropdown-toggle:hover {
            background-color: transparent;
            color: [[setting:menufontcolor]];
            font-size: [[setting:menufontsize]];
            font-weight: 400;
            line-height: 42px;
            padding: 0 [[setting:menufontpadding]];
            text-decoration: none;
            text-shadow: none;
            text-transform: none;
            -moz-transition: all [[setting:navbardropdowntransitiontime]];
            -ms-transition: all [[setting:navbardropdowntransitiontime]];
            -o-transition: all [[setting:navbardropdowntransitiontime]];
            -webkit-transition: all [[setting:navbardropdowntransitiontime]];
            transition: all [[setting:navbardropdowntransitiontime]];
        }
    }

    ul.navbar-nav > li > a.nav-link:hover,
    li div.nav-link:hover,
    li #editingbutton input[type="submit"]:hover {
        background-color: [[setting:menubkhovercolor]];
        color: [[setting:menufonthovercolor]];
    }
}

#header1 {
    background-color: [[setting:headertoprowbkcolour]];
    border-bottom: 1px solid [[setting:headertoprowdividingline]];
}

#adaptable-page-header-wrapper {
    #header1 {
        .nav-link > .fa,
        .nav-link > .fas,
        .navbar-nav > li > a,
        .navbar-nav > li .usermenu .dropdown-toggle,
        .navbar .popover-region i,
        .navbar .popover-region-toggle i {
            color: [[setting:headertoprowtextcolour]];
        }
    }
    #header2 {
        .nav-link > .fa,
        .nav-link > .fas,
        .navbar-nav > li > a,
        .navbar-nav > li .usermenu .dropdown-toggle,
        .navbar .popover-region i,
        .navbar .popover-region-toggle i {
            color: [[setting:headermainrowtextcolour]];
        }
    }
}

.overlay-content li > a:hover {
    color: var(--ad-linkhover-colour);
}

// Add dropdown menu items styles for each theme color (mantainning default hover colour for contrast).
@each $color, $value in $theme-colors {
    #adaptable-page-header-wrapper .dropdown-item.text-#{$color} {
        color: $value;
        &:hover {
            color: [[setting:navbardropdowntexthovercolor]] !important; /* stylelint-disable-line declaration-no-important */
        }
    }
}

#adaptable-page-header-wrapper {
    .navbar li.dropdown.open > .dropdown-toggle,
    .navbar li.dropdown.active > .dropdown-toggle,
    .navbar li.dropdown.open.active > .dropdown-toggle {
        font-size: [[setting:menufontsize]];
    }

    .navbar .dropdown-menu {
        border-radius: [[setting:navbardropdownborderradius]];
        font-size: [[setting:menufontsize]];
        -webkit-transition: all [[setting:navbardropdowntransitiontime]];
        -moz-transition: all [[setting:navbardropdowntransitiontime]];
        -ms-transition: all [[setting:navbardropdowntransitiontime]];
        -o-transition: all [[setting:navbardropdowntransitiontime]];
        transition: all [[setting:navbardropdowntransitiontime]];
    }

    .nav .dropdown-menu li a {
        background-color: none;
        color: var(--ad-link-colour);
    }

    .dropdown-menu a,
    .dropdown-menu a:visited,
    .dropdown-menu li a,
    .dropdown-menu li a:visited,
    .dropdown-menu > .active,
    .dropdown-menu > .active > a:visited,
    .dropdown-submenu > a,
    .dropdown-submenu > a:visited {
        color: [[setting:navbardropdowntextcolor]];
    }

    .dropdown-menu a:hover,
    .dropdown-menu a:focus,
    .dropdown-menu li a:hover,
    .dropdown-menu li a:focus,
    .dropdown-menu > .active > a:hover,
    .dropdown-menu > .active > a:focus,
    .dropdown-submenu > a:hover,
    .dropdown-submenu > a:focus,
    .dropdown-item:hover,
    .dropdown-item:focus,
    .dropdown-item:focus-within,
    .dropdown-item:active,
    .dropdown-item.active,
    .dropdown-submenu:hover > a,
    .dropdown-submenu:focus > a {
        background-color: [[setting:navbardropdownhovercolor]];
        color: [[setting:navbardropdowntexthovercolor]];
    }

    .dropdown-item:focus-within a {
        color: [[setting:navbardropdowntexthovercolor]];
    }

    .dropdown-submenu>.dropdown-menu {
        border-radius: [[setting:navbardropdownborderradius]];
    }

    #main-navbar .navbar-nav > .nav-item .dropdown-menu .dropdown-toggle:after {
        border-color: transparent;
        border-left-color: var(--ad-link-colour);
        border-style: solid;
        border-width: 5px 0 5px 5px;
        display: block;
        content: " ";
        float: right;
        height: 0;
        margin-top: 9px;
        width: 0;
    }
}
