/**
 *        ::::::: ::::::::: :::::::
 *      :+:         :+:    :+:
 *     +:+         +:+    +:+:+:+
 *    +#+         +#+    +#+  +#+
 *     #######   ###      ######.nc     ct6Sided.bpmn-js
 *
 * @file        ct6Sided.bpmn-js
 * @brief       CT6 Sidebar CSS
 * @author      Miguel CANCELA DA FONSECA <miguel.cancela@icloud.com>
 * @version     3.03.00
 * @since       2022-08-15  - Modified  2025-10-13
 * @copyright   Copyright (c) 2019 - 2025 Miguel CANCELA DA FONSECA
 */

/**
 *
 * CT6 Sidebar CSS - Inspired from https://bootstrapious.com/p/bootstrap-sidebar
 *                   @author  Thank to Ondrej, creator of Bootstrapious.
 * @licence    MIT
 *
 *  This CSS is about Bootstrap 4 sidebar used on the CT6 application web site.
 *
 *  I had multiple CSS's with different parameters for Bootstrap 3 & 4 versions
 *  quite messy and very confusing. Then i decide to cleanup and separate and
 *  specialize them.
 *
 * changelog :
 *              3.03.00  Add support for Bootstrap 5.3.5 suppress sidebar shadow
 *              3.02.00  Restore menu colors for power button
 *              3.01.00  Optimisation to simplify bpmn-js's management
 *              3.00.00  Suppress sidebar classes option as we use now BS5 'offcanvas'
 *                        optionS
 */

.line
{
    width: 100%;
    height: 1px;
    margin: 40px 0;
    border-bottom: 1px dashed #ddd;
}

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */
*, ::before, ::after {
    box-sizing: border-box;
}

#sidebar /* Validé */
{
    /*
     * Allow to resize viewport when sidebar is collapsed
     */
    z-index: 999;
    font-size: 0.75em;

    min-width: 80px;
    max-width: 140px;

    float: left;
    height:100%;
    position:relative;
    overflow-y:auto;
    overflow-x:hidden;

    transition: all .1s;

    /* Use now Centaursys's color palette */
    color: var(--ct6gry) !important;
    background-color: var(--ct6gry-25);
}


/*  */
#sidebar.active
{
    /* Follow scroll page - Set to fixed disable correct usage on some devices*/
    position: sticky;
    min-width: 90px;
    max-width: 160px;
    vertical-align: middle;
}


#sidebar.active .sidebar-header p,
#sidebar.active .sidebar-header img
{
    display: none;
}

#sidebar.active .sidebar-header small
{
    display: block;
}

#sidebar.active ul li a i
{
    display: block;
    margin-right: 0;
    margin-bottom: 5px;
}

#sidebar .sidebar-header
{
    padding: 20px;
    /* Added MCF CT6 */

    border-style: hidden;
    /* Modify MCF CT6 */
    background: #dfdfdf;
}


#sidebar .sidebar-header small
{
    display: none;
}


#sidebar ul li a,
#sidebar ul li a p
{
    color: var(--ct6gry);
    display: block;
    padding: 1px;
}

/* Manage the over tile when mouse is over the menu option */
#sidebar ul li a:hover,
#sidebar ul li a:active
{
    /* Modify MCF CT6 */
    color: var(--ct6gry) !important;
    background: #afafaf;
}


ul ul a
{
    background: #dfdfdf;
    padding-left: 30px !important;
}

a.download
{
    color: var(--ct6gry) !important;
    background: #afafaf;
}

a.article,
a.article:hover
{
    color: var(--ct6gry) !important;
    background: #afafaf !important;
}


li a svg.bi
{
    color: var(--ct6gry) !important;
    margin-top: 1px;
}

li a svg.bi:hover,
li a svg.bi:focus
{
    /* fill: #dc3545; */
    fill: var(--success);
    color: var(--dark);
}

li a svg.bi-power
{
    fill: var(--success);
}

li a svg.bi-power:hover,
li a svg.bi-power:focus
{
    fill: #dc3545;
    color: var(--dark);
}


/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */

#content
{
    position: relative;

    width: 100%;
    height: auto;
    padding: 10px;
    max-width: 90vw;
    transition: all .3s;
    overflow: auto;
    margin-top: 2px; /* 57px is just the height of your navbar */

    flex-wrap: wrap;
}

#content .navbar-fixed-top
{
    position: absolute;
}

/* ---------------------------------------------------
    MEDIAQUERIES - None at the moment
----------------------------------------------------- */