/*
    Configuration du reset css, des fonts, des déclarations de variables css (fonts, couleurs, dimensions)

    Sommaire :
    - Reset
    - Fonts
    - Colors Theme
    - Style Variables
    - Global Images Links
*/




/* ========================================================================== */
/* # Reset   */
/* ========================================================================== */
*, *::before, *::after {
    box-sizing: border-box;
  }
  * {
    margin: 0;
  }
  body {
    line-height: 1;
    -webkit-font-smoothing: antialiased;
  }
  img, picture, video, canvas, .icon {
    display: block;
    max-width: 100%;
  }
  input, button, textarea, select {
    font: inherit;
  }
  p, h1, h2, h3, h4, h5, h6,
  .h1, .h2, .h3, .h4, .h5, .h6 {
    overflow-wrap: break-word;
  }
  p {
    text-wrap: pretty;
  }
  h1, h2, h3, h4, h5, h6,
  .h1, .h2, .h3, .h4, .h5, .h6 {
    /* text-wrap: balance; */
  }
  
  ul, ol, dl, dt, dd{
      list-style: none; 
      padding: 0; 
      list-style-position: outside; 
  }
  
  html {
      font-size: 62.5%;
  }
  
  .sr_only {
      border: 0 !important;
      clip: rect(1px, 1px, 1px, 1px) !important;
      -webkit-clip-path: inset(50%) !important;
      clip-path: inset(50%) !important;
      height: 1px !important;
      overflow: hidden !important;
      padding: 0 !important;
      position: absolute !important;
      width: 1px !important;
      white-space: nowrap !important;
  }

a {
    text-decoration: none;
}
  



/* ========================================================================== */
/* # Fonts   */
/* ========================================================================== */

@font-face {
    font-family: 'IBM-Plex-Sans';
    src: 
        url("fonts/IBMPlexSans-Regular.ttf") format("truetype"),
        url("fonts/IBMPlexSans-Regular.woff") format("woff"),
        url("fonts/IBMPlexSans-Regular.woff2") format("woff2");
    font-weight: normal;
    font-style: normal
}
@font-face {
    font-family: 'IBM-Plex-Sans';
    src: 
        url("fonts/IBMPlexSans-Regular.ttf") format("truetype"),
        url("fonts/IBMPlexSans-Regular.woff") format("woff"),
        url("fonts/IBMPlexSans-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: 'IBM-Plex-Sans';
    src: 
        url("fonts/IBMPlexSans-Medium.ttf") format("truetype"),        
        url("fonts/IBMPlexSans-Medium.woff") format("woff"),
        url("fonts/IBMPlexSans-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal
}
@font-face {
    font-family: 'IBM-Plex-Sans';
    src: 
        url("fonts/IBMPlexSans-SemiBold.ttf") format("truetype")      
        url("fonts/IBMPlexSans-SemiBold.woff") format("woff"),
        url("fonts/IBMPlexSans-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: 'IBM-Plex-Sans-Condensed';
    src: 
        url("fonts/IBMPlexSans_Condensed-Regular.ttf") format("truetype")
        url("fonts/IBMPlexSans_Condensed-Regular.woff") format("woff"),
        url("fonts/IBMPlexSans_Condensed-Regular.woff2") format("woff2");
    font-weight: normal;
    font-style: normal
}
@font-face {
    font-family: 'IBM-Plex-Sans-Condensed';
    src: 
        url("fonts/IBMPlexSans_Condensed-Regular.ttf") format("truetype"), 
        url("fonts/IBMPlexSans_Condensed-Regular.woff") format("woff"),
        url("fonts/IBMPlexSans_Condensed-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: 'IBM-Plex-Sans-Condensed';
    src: 
        url("fonts/IBMPlexSans_Condensed-Medium.ttf") format("truetype"),    
        url("fonts/IBMPlexSans_Condensed-Medium.woff") format("woff"),
        url("fonts/IBMPlexSans_Condensed-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal
}
@font-face {
    font-family: 'IBM-Plex-Sans-Condensed';
    src: 
        url("fonts/IBMPlexSans_Condensed-SemiBold.ttf") format("truetype"),   
        url("fonts/IBMPlexSans_Condensed-SemiBold.woff") format("woff"),
        url("fonts/IBMPlexSans_Condensed-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: 'OpenSans';
    src: 
        url("fonts/IBMPlexSans_Condensed-Regular.ttf") format("truetype"),   
        url("fonts/IBMPlexSans_Condensed-Regular.woff") format("woff"),
        url("fonts/IBMPlexSans_Condensed-Regular.woff2") format("woff2");
    font-weight: normal;
    font-style: normal
}
@font-face {
    font-family: 'OpenSans';
    src: 
        url("fonts/IBMPlexSans_Condensed-Regular.ttf") format("truetype"),   
        url("fonts/IBMPlexSans_Condensed-Regular.woff") format("woff"),
        url("fonts/IBMPlexSans_Condensed-Regular.woff2") format("woff2");
    font-weight: 400;
    font-style: normal
}
@font-face {
    font-family: 'OpenSans';
    src: 
        url("fonts/IBMPlexSans_Condensed-Medium.ttf") format("truetype"),   
        url("fonts/IBMPlexSans_Condensed-Medium.woff") format("woff"),
        url("fonts/IBMPlexSans_Condensed-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal
}
@font-face {
    font-family: 'OpenSans';
    src: 
        url("fonts/IBMPlexSans_Condensed-SemiBold.ttf") format("truetype"),   
        url("fonts/IBMPlexSans_Condensed-SemiBold.woff") format("woff"),
        url("fonts/IBMPlexSans_Condensed-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-style: normal
}

/* ========================================================================== */
/* # Colors Theme   */
/* ========================================================================== */

:root {
    /* Default values*/
    --color-primary: #736BE5;
    --color-secondary: #E5264F;

    --color-paris: #736BE5;
    --color-lyon: #E5264F;

    --font-main: "IBM-Plex-Sans-Condensed", "sans-serif";

    --color-black-10: rgba(0, 0, 0, 0.1);
    --color-black-15: rgba(0, 0, 0, 0.15);
    --color-black-20: rgba(0, 0, 0, 0.2);
    --color-black-25: rgba(0, 0, 0, 0.25);
    --color-black-40: rgba(0, 0, 0, 0.4);
    --color-black-60: rgba(0, 0, 0, 0.6);
    --color-black-90: rgba(0, 0, 0, 0.9);
    
    --color-white: #fff;
    --color-white-15: rgba(255, 255, 255, 0.15);
    --color-white-20: rgba(255, 255, 255, 0.2);
    --color-white-30: rgba(255, 255, 255, 0.3);
    --color-white-40: rgba(255, 255, 255, 0.4);
    --color-white-50: rgba(255, 255, 255, 0.5);
    --color-white-60: rgba(255, 255, 255, 0.6);
    --color-white-70: rgba(255, 255, 255, 0.7);
    
    --color-grey-1: #767676;
    --color-grey-2: #C4C4C4;
    --color-grey-darker: #505050;
    
    --color-text: #181818;
    --color-text-90: rgba(24, 24, 24, 0.9);
    --color-text-fade: rgba(255, 255, 255, 0.6);
    
    --color-placeholder: rgba(24, 24, 24, 0.55);
    
    --color-icons: #000;
    --color-icons-grey: #A6A6A6;
    --color-icons-light: #fff;
    --color-icons-primary: #var(--color-primary);
    --color-icons-white: #fff;
    
    --color-background-main: #fff;
    --color-background-grey: #FAFAFA;
    --color-background-primary: var(--color-primary);
    
    --color-border: #EBEBEB;
    --color-border-light: rgba(235, 235, 235, 0.3);
    --color-border-hover: #dcdcdc;
    --color-border-fade: rgba(0, 0, 0, 0.1);
    --color-border-light-fade: rgba(255, 255, 255, 0.2);
    
    --color-form-success: #26A569;
    --color-form-error: #FF4040;
    
    --color-box-shadow-header: rgba(0, 0, 0, 0.075)
}

/* ----- Light Theme ----- */
.theme-paris {
    
    --color-primary: #736BE5;
    --color-secondary: #E5264F;
    --color-background-primary: var(--color-primary);
}

.theme-lyon {
    --color-primary: #fb004e;
    --color-secondary: #f4a300;    
    --color-background-primary: var(--color-primary);
}
html.is-dark-mode:not(.page-prehome) .theme-lyon, 
html.is-dark-mode:not(.page-prehome) .theme-paris {

    --color-secondary: #1C1C1C;
    --color-primary: #ffffff;    
    --color-background-primary: #1C1C1C;
    --color-icons-light:#1C1C1C;
    --color-icons-primary: #1C1C1C;
    
    --color-paris: #1C1C1C;
    --color-lyon: #1C1C1C;
}



/* ----- Dark Theme ----- */
html.is-dark-mode:not(.page-prehome) {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    --color-text: #ffffff;
    --color-background-main: #121212;
    --color-background-grey: #1C1C1C;
    --color-background-primary: #1C1C1C;
    --color-icons: #ffffff;
    --color-border: rgba(255, 255, 255, 0.15);
    --color-border-hover: rgba(255, 255, 255, 0.2);
    --color-border-fade: rgba(255, 255, 255, 0.1);
    --color-secondary: #1C1C1C !important;
    --color-primary: #ffffff !important;
    --color-grey-darker: #a9a9a9;
    --color-grey-1: #6f6f6f;
    --color-placeholder: rgba(255, 255, 255, 0.5);
    --color-icons-grey: #6f6f6f;
    --color-black-10: #1C1C1C;
    --color-black-15: rgba(255, 255, 255, 0.15);
    --color-black-90: rgba(255, 255, 255, 0.9);
    --color-box-shadow-header: rgba(255, 255, 255, 0.075);

    
    --color-paris: #1C1C1C;
    --color-lyon: #1C1C1C;
}

html.is-dark-mode:not(.page-prehome) .header__logoSingle {
    display: none
}

html.is-dark-mode:not(.page-prehome) .header__logoSingle--white {
    display: block
}

html.is-dark-mode:not(.page-prehome) .header__infosBtn,
html.is-dark-mode:not(.page-prehome) .tickets__cta {
    color: var(--color-background-primary) !important;
    background-color: var(--color-white) !important
}

html.is-dark-mode:not(.page-prehome) .header__infosBtn .icon,
html.is-dark-mode:not(.page-prehome) .tickets__cta .icon {
    color: var(--color-background-primary) !important
}

html.is-dark-mode:not(.page-prehome) .edition__current {
    color: var(--color-white) !important
}

html.is-dark-mode:not(.page-prehome) .edition__current .icon {
    color: var(--color-white) !important
}

html.is-dark-mode:not(.page-prehome) .nav__header .header__logoImg {
    display: none
}

html.is-dark-mode:not(.page-prehome) .nav__header .header__logoImg--white {
    display: inline-flex
}

html.is-dark-mode:not(.page-prehome).page-prehome .edition__current,
html.is-dark-mode:not(.page-prehome).page-become-partner .edition__current {
    color: var(--color-grey-1)
}

html.is-dark-mode:not(.page-prehome).page-prehome .edition__current .icon,
html.is-dark-mode:not(.page-prehome).page-become-partner .edition__current .icon {
    color: var(--color-grey-1)
}

html.is-dark-mode:not(.page-prehome) .playLayer:hover .playLayer__icon .icon,
.swiper__item:hover html.is-dark-mode:not(.page-prehome) .playLayer .playLayer__icon .icon {
    color: #000
}

html.is-dark-mode:not(.page-prehome) .articleExhibitor__logo,
html.is-dark-mode:not(.page-prehome) .exhibitors__media {
    background-color: var(--color-white);
    border-color: var(--color-white)
}

html.is-dark-mode:not(.page-prehome) .cookies {
    background-color: var(--color-background-main)
}

html.is-dark-mode:not(.page-prehome) .footer__partners {
    background-color: var(--color-white)
}

html.is-dark-mode:not(.page-prehome) .sponsors {
    background-color: var(--color-white)
}

html.is-dark-mode:not(.page-prehome) .partners__media {
    background-color: var(--color-white)
}

html.is-dark-mode:not(.page-prehome) .ad--footer {
    background-color: var(--color-white)
}

/* ========================================================================== */
/* # Style Variables   */
/* ========================================================================== */
[data-pjax-wrapper="pjax"] {
    transition: 350ms cubic-bezier(0.23, 1, 0.32, 1);
}

[data-pjax-wrapper="pjax"].is-page-fade {
    transition: all 375ms cubic-bezier(0.53, 2, 0.36, 0.85);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: all 0.35s cubic-bezier(0.23, 1, 0.32, 1)
}
