﻿:root {
    --cd31-blue: #1B8BAD;
    --cd31-violet: #474491;
    --cd31-orange: #D88615;
}

* {
    font-family: Poppins, sans-serif, "Lucida Sans", "Lucida Sans Regular";
}

@font-face {
    font-family: 'Poppins';
    src: url('../../Polices/Specif/CD31/Poppins-Regular.ttf') format('truetype');
    font-style: normal;
}

body {
    background: transparent;
    height: 100%;
    flex-direction: column;
    margin-bottom: 0;
    font-weight: 400 !important;
}

@media (min-width: 1700px) {

    #pu-header {
        height: 180px !important;
    }
}

/* Large Desktop */
@media (min-width: 1200px) and (max-width: 1700px) {
    
    #pu-header {
        height: 180px !important;
    }
}

/* Desktop */
@media (min-width: 992px) and (max-width: 1200px) {
    #pu-header {
        height: 180px !important;
    }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 992px) {
    #pu-header {
        height: 150px !important;
    }

    .pu-nav ul {
        border-color: var(--cd31-blue);
    }

    .pu-nav-toggle {
        background-color: var(--cd31-blue) !important;
        color: #ffffff !important;
    }
}

/* Mobile */
@media (min-width: 300px) and (max-width: 768px) {
    #pu-header {
        height: auto !important;
    }

    .pu-nav ul {
        border-color: var(--cd31-blue);
    }

    .pu-nav-toggle {
        background-color: var(--cd31-blue) !important;
        color: #ffffff !important;
    }
}

.pu-header-container {
    display: flex;
    max-width: 600px;
    margin: auto;
    justify-content: space-around;
    height: 100%;
    align-items: center;
}

#pu-header {
    color: #fff;
    background-color: var(--cd31-blue);
    height: 150px;
}

#pu-header-title {
    color: #fff;
    font-size: 32px;
    padding-left: 1em;
}

.container .jumbotron,
.jumbotron {
    border-radius: 0;
}

.pu-nav > ul > li > a {
    color: #000000 !important;
}

.jumbotron p {
    font-weight: 400 !important;
}

/* footer anchor style*/
.container > .nav > li > a {
    color: var(--cd31-blue);
}

    .container > .nav > li > a:hover {
        color: var(--cd31-violet) !important;
    }

.return-demande-container > a {
    color: #fff !important;
}
.return-demande-container > a:hover {
    color: #fff !important;
}

/* main container style */
#pu-full-content {
    flex: 2;
}
    
    #pu-full-content.container {
        background-color: #FFF;
    }

/* footer class style */
.pu-footer {
    background-color: #e8e8e8 !important;
    border-top: none;
    color: var(--cd31-blue) !important;
}

    .pu-footer > li > a {
        color: var(--cd31-blue) !important;
    }

legend {
    color: var(--cd31-blue);
    border-color: var(--cd31-blue);
    font-family: "Calibri";
}

/* information popup style */
#popup1 > .popup {
    border: 1px solid var(--cd31-blue);
}

/* information popup checked mark */
.containerChk input:checked ~ .checkmark {
    background-color: var(--cd31-blue);
}

.pu-block {
    border: none;
}
    /* pu-block h1 & h2 style */
    .pu-block h1, .pu-block h2 {
        color: var(--cd31-blue) !important;
    }

    .pu-block .btn {
        color: var(--cd31-blue) !important;
        background-color: #fff !important;
        border-color: var(--cd31-blue) !important;
    }
        .pu-block .btn:hover {
            color: #fff !important;
            background-color: var(--cd31-violet) !important;
            border-color: var(--cd31-violet) !important;
        }

    .pu-block .btn.primary {
        color: #fff !important;
        background-color: var(--cd31-blue) !important;
        border-color: var(--cd31-blue);
    }

        .pu-block .btn.primary:hover {
            color: var(--cd31-violet) !important;
            background-color: #fff !important;
            border-color: var(--cd31-violet) !important;
        }

    .pu-block legend,
    .pu-block legend.right {
        color: var(--cd31-blue);
        border-color: var(--cd31-blue);
    }

.pu-arrets-titre {
    color: #fff;
    background-color: var(--cd31-blue);
    border: 1px solid var(--cd31-blue);
}

.pu-arrets-items .table-bordered,
.pu-arrets-items .table-bordered > thead > tr > th,
.pu-arrets-items .table-bordered > tbody > tr > td {
    border-color: var(--cd31-blue);
}

.pu-arrets-item-selected {
    background-color: var(--cd31-blue);
}

.pu-arrets-item-iti-color {
    border: 1px solid var(--cd31-blue);
}

.pu-disconnect {
    background-color: var(--cd31-blue);
    border-color: var(--cd31-blue);
}

#pu-disconnect-link {
    color: #fff !important;
    text-decoration: none;
}

#pu-account {
    background-color: #fff;
    border: 1px solid var(--cd31-blue);
}

.pu-account-header {
    background-color: var(--cd31-blue);
    border-bottom: 1px solid var(--cd31-blue);
    color: #fff;
}

.pu-etat {
    color: var(--cd31-blue);
}

.pu-suivi-etat-demande {
    color: var(--cd31-blue);
}

a {
    color: var(--cd31-blue) !important;
}

    a:hover, a:focus {
        color: var(--cd31-blue) !important;
    }

.gfi-required {
    color: var(--cd31-blue);
}

.pu-account-header a:hover {
    color: #F1F2F3;
}


.horaire-item-header-correspondances-info {
    color: var(--cd31-blue);
}
.content-segment-code-ligne {
    color: var(--cd31-orange);
}
.horaire-item-header-daysofservice {
    color: var(--cd31-orange);
}
.segment-drawing-depart-icon {
    border-color: var(--cd31-orange);
    color: var(--cd31-orange);
}

.segment-drawing-line {
    background: var(--cd31-orange);
}

.segment-drawing-arrivee-icon {
    border-color: var(--cd31-orange);
    color: var(--cd31-orange);
}

.horaire-item-selected {
    border-color: var(--cd31-blue);
}

/* V2 styles */
.cards-header, .header-account-card {
    background: var(--cd31-blue);
}

/* Action buttons (top-right) */
div.account-buttons > ul > li > a {
    color: #fff !important;
}

/* action new demande button (top-right) */
a.add-demande {
    color: #fff !important;
}

    a.add-demande > i {
        color: #fff !important;
    }

/* new Demande link color's container */
#cards-container > ul > li > a {
    color: #fff !important;
}

/* cards container color's h1 & h2 */
#cards-container > h1, h2 {
    color: var(--cd31-blue);
}

.sidebar {
    background-color: var(--cd31-blue);
}
    .sidebar > ul > li > a {
        color: #fff !important;
    }
    .sidebar > ul > li > a:hover {
        background-color: var(--cd31-violet);
        color: #fff !important;
    }

.selected-sidebar-button {
    background: var(--cd31-violet);
    color: #fff !important;
}

#notificationTitle {
    background-color: #EBEBEB;
    color: var(--cd31-violet);
}

#notificationContainer::before {
    border-color: transparent transparent #EBEBEB;
}

#notificationsBody li:hover {
    background: var(--cd31-violet);
}

/* dropdown menu for new demande style */
.dropdown-demande-element {
    background-color: var(--cd31-blue);
    color: #fff !important;
}
    /* dropdown menu element hover style */
    .dropdown-demande-element:hover {
        background-color: var(--cd31-violet);
        color: #fff !important;
    }
    
/* main title for the page */
.title {
    font-size: 17px;
    font-weight: 400;
    color: var(--cd31-blue);
    padding-bottom: 10px;
}

.notificationDefault {
    background: var(--cd31-blue);
    color: #FFF;
    font-size: 14px;
}

.pu-piece-comp-regroup {
    background: var(--cd31-blue) !important;
}

.section-header .section-title {
    color: var(--cd31-blue);
    font-weight: 300;
}

.account-button.info-button {
    color: white !important;
}

.account-button.toggle-button {
    color: white !important;
}

.account-button.disconnect-button {
    color: white !important;
}

button#togglePassword {
    border-color: #ccc !important;
}