/**
*
* CONTENTS
*
* SETTINGS
* Variables couleur CSS
*
* TOOLS
* box-sixing
* HTML, BODY config
* font-face
* Custom scrollbar pour FF, Edge, Chrome & Safari
* Icones et svg
* Skew transform
* form & erreur gestion
*
* PAGES
* COMPONENTS
* Sidebar fixe
* Navbar header fixe
* switch menu header
*
**/

/**--- font-face ---**/
@font-face {
    font-family: 'ClanOT-Medium', sans-serif;
    src: url("/assets/font/ClanOT-Medium.ttf") format("trueType"),
        url('/assets/font/ClanOT-Medium.woff') format('woff');
}
/* poppins-regular - latin */
@font-face {
    font-family: 'Poppins', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/assets/font/poppins-v15-latin/poppins-v15-latin-regular.eot'); /* IE9 Compat Modes */
    src: local('Poppins'),
         url('/assets/font/poppins-v15-latin/poppins-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('/assets/font/poppins-v15-latin/poppins-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('/assets/font/poppins-v15-latin/poppins-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('/assets/font/poppins-v15-latin/poppins-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('/assets/font/poppins-v15-latin/poppins-v15-latin-regular.svg#Poppins') format('svg'); /* Legacy iOS */
  }
  
@font-face {
    font-family: 'FF Clan';
    src: local('FF Clan Medium'),
        url('/assets/font/ClanOT-Medium/ClanOT-Medium.woff') format('woff'),
        url('/assets/font/ClanOT-Medium/ClanOT-Medium.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: ClanOT;
    font-style: normal;
    font-weight: 600;
    src: local("ClanOT-NarrowMedium"), url("/assets/font/ClanOT-NarrowMedium.woff") format("woff");
}

html {
    background: transparent!important;
}
.font-poppins {
    font-family: 'Poppins', sans-serif;
}
.font-ff-clan {
    font-family: 'FF Clan'!important;
}

body {
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
    font-family: 'Roboto', sans-serif;
    -webkit-font-smoothing: none;
    -webkit-font-smoothing: subpixel-antialiased;
    -webkit-font-smoothing: antialiased;
}
._md-nav-bar-list ._md-nav-button {
    font-family: ClanOT;
    text-transform: Capitalize;
    font-weight: 300;
}

/** Main **/
.main {
    padding-left: 291px;   /*276 + 15 de gutter bootstrap largeur du sidebar fixe uniquement pour les tailles au dessus de la tablette */
    /*transition: all .5s;
    padding-left: 276px;*/
    margin-top: 82px;  
    /*height: calc(100vh - 82px);*/
    min-height: 100%;
    background: transparent;
}

@media (max-width: 991px) {
    .main {
    margin-top: 65px;
    }
    #pagerId {
        padding-top: 1rem;
    }
}
@media (max-width: 991.98px) {
    .main {
        padding-left: 15px;  /* reset le padding-left pour tablette portrait et moins */
    }
}

/**--- Skew transform ---**/
.skew-transform--top-to-bottom {
    transform: translateZ(0) skew(360deg, 6deg);
}
/* corrige l'effet skew pour les enfants */
.skew-transform--top-to-bottom > *,
.skew-transform--top-to-bottom > a {
    transform: translateZ(0) skew(360deg, -6deg);
}

.skew-transform--bottom-to-top {
    transform: translateZ(0) skew(360deg, -6deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
/* corrige l'effet skew pour les enfants */
.skew-transform--bottom-to-top > *,
.skew-transform--bottom-to-top > a,
.skew-transform--bottom-to-top > hr {
    transform: translateZ(0) skew(360deg, 6deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

/*------------------------------*\
    #PAGE INDEX
/*------------------------------*/
/*------------------------------*\
    #COMPONENTS
/*------------------------------*/

.navbar .form-control {
    padding      : .75rem 1rem;
    border-width : 0;
    border-radius: 0;
}

/* pour pallier la position sticky du parent qui a un z-index supérieur, ce n'est pas normal car il n'y a pas de style en contre ordre :/ */
.md-standard-list-container.md-autocomplete-suggestions-container, .md-virtual-repeat-container.md-autocomplete-suggestions-container {
    z-index: 1000!important;
}

/* Visualisation d'une annonce ======================================================== */
.disabled {
    /* Make the disabled links grayish*/
    color: var(--another-gray) !important;
    /* And disable the pointer events */
}

.btn--freelance.disabled {
    /* Make the disabled links grayish*/
    color: var(--another-gray) !important;
    /* And disable the pointer events */
    cursor: not-allowed;
    position: relative;
}
.btn--freelance.disabled:hover::after {
    position: absolute;
    top: 200%;
    left: -25%;
    height: 100%;
    width: 150%;
    display: flex;
    align-items: center;
    color: #000;
    background-color: var(--white);
    padding: 10px;
    font-size: calc(var(--basePX) + 2px);
    content: "Le CV du freelance sera disponible dès qu'il vous répondra"
}

/* Formulaire ajout/modification annonce ======================================================== */
.fieldset {
    position: relative;  
}