/*
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 https://www.lesli.tech
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

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


// · Layout
$lesli-font-size: 16px !default;
$lesli-header-height: 70px !default;
$lesli-footer-height: 84px !default;
$lesli-sidebar-width: 50px !default;


// · Lesli main theme definition, 
$lesli-color-primary: #193d8d !default;
$lesli-header-color: white !default;
$lesli-navbar-color: white !default;
$lesli-footer-color: white !default;
$lesli-sidebar-color: white !default;
$lesli-sidebar-hover: white !default;
$lesli-color-background: #f6f8fb !default;



// · To understand more about customization go to:
// · https://www.lesli.dev/documentation/design/20-theme



// · defaults
$lesli-logo-color: $lesli-sidebar-color;
$lesli-font-color: lesli-css-color(black) !default;


// · harcoded styles D:
$lesli-box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;


// · generic variables (aliases)
$primary: $lesli-color-primary;
$color-primary: $lesli-color-primary;
$color-header: $lesli-header-color;
$color-footer: $lesli-footer-color;
$color-sidebar: $lesli-sidebar-color;
$color-background: $lesli-color-background;


$family-primary: "OpenSans", "Ubuntu", "Helvetica Neue", "Helvetica", "Arial", sans-serif;



// · here we prioritize css variables defined dynamically in the header
// · those variable values come from the database in the account_settings table
:root {
    --lesli-color-primary: var(--lesli-theme-color-primary, #{$lesli-color-primary});
    --lesli-color-background: var(--lesli-theme-color-background, #{$lesli-color-background});
    
    --lesli-header-color: var(--lesli-theme-header-color, #{$lesli-header-color});
    --lesli-header-height: var(--lesli-theme-header-height, #{$lesli-header-height});

    --lesli-navbar-color: var(--lesli-theme-header-color, #{$lesli-navbar-color});
    
    --lesli-footer-color: var(--lesli-theme-footer-color, #{$lesli-footer-color});
    --lesli-footer-height: var(--lesli-theme-footer-height, #{$lesli-footer-height});
    
    --lesli-sidebar-color: var(--lesli-theme-sidebar-color, #{$lesli-sidebar-color});
    --lesli-sidebar-width: var(--lesli-theme-sidebar-width, #{$lesli-sidebar-width});

    --lesli-logo-color: var(--lesli-theme-logo-color, #{$lesli-logo-color});
    
    --lesli-font-size: var(--lesli-theme-font-size, #{$lesli-font-size});
    --lesli-font-color: var(--lesli-theme-font-color, #{$lesli-font-color});
}



// Mobile Up to 768px
@include lesli-css-breakpoint-mobile {
    :root {
        --lesli-sidebar-width: 50px;
    }
}


// Tablet Between 769px and 1023px
@include lesli-css-breakpoint-tablet {
    :root {
        --lesli-sidebar-width: 100px;
    }   
}


// Desktop Between 1024px and 1215px
@include lesli-css-breakpoint-desktop {
    :root {
        --lesli-sidebar-width: 200px;
    }   
}


// Widescreen Between 1216px and 1407px
@include lesli-css-breakpoint-widescreen {
    :root {
        --lesli-sidebar-width: 225px;
    }   
}


// Widescreen Between 1216px and 1407px
@include lesli-css-breakpoint-fullhd {
    :root {
        --lesli-sidebar-width: 328px;
    }   
}


//
body.layout-expanded {
    :root {
        --lesli-sidebar-width: 100px;
    }
}