/*

Lesli

Copyright (c) 2023, Lesli Technologies, S. A.

This program 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.

This program 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 this program. If not, see http://www.gnu.org/licenses/.

Lesli · Ruby on Rails SaaS Development Framework.

Made with ♥ by LesliTech
Building a better future, one line of code at a time.

@contact  hello@lesli.tech
@website  https://www.lesli.tech
@license  GPLv3 http://www.gnu.org/licenses/gpl-3.0.en.html

// · ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~
// · 
*/


// ·
header.lesli-application-header {
    background-color: var(--lesli-header-color);
    border-bottom: 1px solid rgba(172,179,194,.3);
    height: var(--lesli-header-height);

    nav.lesli-navbar {

        .navbar-brand {
            img {
                height: var(--lesli-header-height);
            }
        }

        .navbar-item {
            padding: 0;

            // navigation icon containers
            span {
                line-height: 1;
            }

            // navigation icons
            [class^="ri-"] {
                font-size: 25px;
                padding: 0 0.6rem;
                color: lesli-css-color(black, 700);
            }

            // Notification icon & count
            .header-indicator {
                position: relative;

                // icons
                [class^="ri-"] {
                    font-size: 25px;
                    color: lesli-css-color(black, 700);
                }   

                .count {
                    top: -4px;
                    right: 6px;
                    width: 8px;
                    height: 8px;
                    border-radius: 50%;
                    background-color: lesli-css-color(berry, 300);
                    position: absolute;
                }
            }
        }

        .dropdown {
            .icon-text {
                align-items: center;
            }
        }
    }
}