/*
 * ═══════════════════════════════════════════════════════════════════════════
 * LE BACK-OFFICE VLOO — FEUILLE UNIQUE, ÉCRITE POUR CE PRODUIT.
 * ═══════════════════════════════════════════════════════════════════════════
 *
 * ⚠️ POURQUOI CE FICHIER EXISTE (02/09/2026, décision du fondateur).
 *
 * Le back-office héritait d'un thème acheté : 554 Ko de CSS prévus pour un
 * fond BLANC, rhabillés en sombre par 171 lignes injectées dans le gabarit,
 * elles-mêmes rattrapées par une troisième feuille de correctifs. Trois
 * couches qui se contredisent, avec des `!important` des deux côtés.
 *
 * Le coût, mesuré sur une seule journée : le nom d'un secteur invisible dans
 * un menu déroulant a demandé quatre tentatives et n'était toujours pas réglé.
 * Non pas parce que le problème était difficile, mais parce que personne — moi
 * compris — ne pouvait prédire laquelle des trois couches gagnerait.
 *
 * « Si tu l'avais construit à ta façon depuis le début, chaque modification
 * serait plus facile. » C'est exact, et c'est la règle n°1 du projet : on
 * refait, on ne rafistole pas.
 *
 * CE QU'ON A RETIRÉ : les 554 Ko du thème, le CSS injecté dans le gabarit, la
 * feuille de rustines, DataTables (aucune page ne l'utilisait), et sept
 * bibliothèques de graphiques, calendriers et calendriers-datepickers qui se
 * chargeaient sur chaque page sans jamais servir.
 *
 * CE QU'ON GARDE : les polices d'icônes (elles marchent), et les classes que
 * les pages emploient déjà — grille, cartes, tableaux, champs, boutons. Elles
 * sont réimplémentées ici, en sombre par construction. Les 13 pages n'ont donc
 * pas eu à être réécrites.
 *
 * RÈGLE POUR LA SUITE : tout se règle DANS ce fichier. Si vous vous surprenez
 * à écrire `!important` pour battre une autre feuille, c'est qu'une autre
 * feuille est revenue — retirez-la plutôt que de la combattre.
 */

/* ─────────────────────────────────────────────────── Les valeurs du thème */
:root {
    --fond:        #0f1116;   /* le fond de la page */
    --surface:     #171a21;   /* cartes, champs */
    --surface-2:   #1c2029;   /* survol, champ actif */
    --bordure:     rgba(255, 255, 255, .08);
    --bordure-net: rgba(255, 255, 255, .18);

    --texte:       #f5f7fa;   /* texte principal */
    --texte-2:     #aab3c0;   /* texte secondaire */
    --texte-3:     #6f7885;   /* mentions discrètes */

    --lime:        #bad254;   /* la marque, et l'action */
    --lime-sur:    #1a1c10;   /* texte posé SUR le lime */
    --lime-texte:  #c7de6a;   /* le lime en TEXTE sur fond sombre */

    --vert:        #3dd68c;   /* un état : en ligne, actif, payé */
    --ambre:       #e9a23b;   /* un état : à surveiller */
    --rouge:       #ef5f5f;   /* un état : en échec, destructif */

    --rayon:       12px;
    --rayon-petit: 9px;
    --ombre:       0 8px 24px rgba(0, 0, 0, .35);

    /* ⚠️ Dit au navigateur dans quel thème dessiner SES propres widgets
     * (menus déroulants ouverts, barres de défilement, sélecteurs de date).
     * Sans cette ligne il les peint en clair et le texte s'y perd. */
    color-scheme: dark;
}

/* ───────────────────────────────────────────────────────────────── Socle */
*, *::before, *::after { box-sizing: border-box; }

html, body {
    margin: 0;
    padding: 0;
    background: var(--fond);
    color: var(--texte);
    font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 14px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
}

a { color: var(--texte-2); text-decoration: none; }
a:hover { color: var(--lime-texte); }

h1, h2, h3, h4, h5, h6 { margin: 0 0 .5rem; font-weight: 600; color: var(--texte); }
h4 { font-size: 22px; letter-spacing: -.2px; }
h5 { font-size: 17px; }

hr { border: 0; border-top: 1px solid var(--bordure); margin: 1.5rem 0; }

/* ──────────────────────────────────────────────────────────── Structure */
.vloo-shell { display: flex; min-height: 100vh; }

.vloo-sidebar {
    width: 248px;
    flex: 0 0 248px;
    background: #0c0e13;
    border-right: 1px solid var(--bordure);
    padding: 0 0 24px;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
}

.vloo-logo {
    display: block;
    padding: 22px 22px 18px;
}
.vloo-logo img { height: 30px; width: auto; }

.vloo-nav { list-style: none; margin: 0; padding: 0 12px; }
.vloo-nav li { margin-bottom: 2px; }
.vloo-nav a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 14px;
    border-radius: var(--rayon-petit);
    color: var(--texte-2);
    font-weight: 500;
    transition: background .15s, color .15s;
}
.vloo-nav a:hover { background: var(--surface); color: var(--texte); }
.vloo-nav a i { font-size: 16px; width: 18px; text-align: center; }

/* L'entrée courante : c'est ici que le lime a sa place — il désigne. */
.vloo-nav li.actif > a {
    background: var(--lime);
    color: var(--lime-sur);
    font-weight: 600;
}
.vloo-nav li.actif > a:hover { color: var(--lime-sur); }
/* Paramètres (02/09/2026) : un titre non cliquable, puis des sous-entrées en retrait. */
.vloo-nav .vloo-nav-titre { margin-top: 18px; padding: 8px 14px 4px; color: var(--texte-3);
    font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; }
.vloo-nav .vloo-nav-titre > span { display: flex; align-items: center; gap: 10px; }
.vloo-nav .vloo-nav-titre i { font-size: 14px; width: 18px; text-align: center; }
.vloo-nav .vloo-sous a { padding-left: 42px; font-size: 13px; }

.vloo-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }

.vloo-topbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 14px 28px;
    border-bottom: 1px solid var(--bordure);
    background: #0c0e13;
}

.vloo-contenu { padding: 26px 28px 60px; }

/* Le sélecteur de langue de la barre du haut. */
.vloo-langue {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 46px;
    height: 34px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid var(--bordure-net);
    color: var(--texte-2);
    font-size: 12.5px;
    font-weight: 600;
}
.vloo-langue.actif { background: var(--vert); border-color: var(--vert); color: #08210f; }

.vloo-identite {
    margin: 0 4px 0 10px;
    color: var(--texte-3);
    font-size: 12.5px;
}

.d-inline { display: inline; }

.vloo-compte {
    width: 34px; height: 34px;
    border-radius: 50%;
    background: var(--surface-2);
    display: inline-flex; align-items: center; justify-content: center;
    color: var(--texte-2);
}

/* ────────────────────────────────────────────────────── Titre de page */
.page-title { margin-bottom: 22px; }
.page-title h4 { margin: 0; }

.breadcrumb {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    background: none;
    font-size: 13px;
    color: var(--texte-3);
}
.breadcrumb-item + .breadcrumb-item::before { content: "/"; margin-right: 8px; color: var(--texte-3); }
.breadcrumb-item.active { color: var(--texte-2); }
.breadcrumb-item a, a.default-color { color: var(--texte-2); }
.breadcrumb-item a:hover, a.default-color:hover { color: var(--lime-texte); }

/* ──────────────────────────────────────────────────────────── Cartes */
.card, .card-statistics {
    background: var(--surface);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon);
    margin-bottom: 22px;
}
.card-body { padding: 20px 22px; }
.card-title { font-size: 16px; font-weight: 600; margin-bottom: 14px; }
.card-text { color: var(--texte-2); }

/* ─────────────────────────────────────────────────────────── Tableaux */
.table-responsive { width: 100%; overflow-x: auto; }

.table {
    width: 100%;
    border-collapse: collapse;
    color: var(--texte);
}
.table th {
    text-align: left;
    padding: 12px 14px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--texte-3);
    text-transform: none;
    border-bottom: 1px solid var(--bordure);
    white-space: nowrap;
}
.table td {
    padding: 14px;
    border-bottom: 1px solid var(--bordure);
    vertical-align: middle;
}
.table tbody tr:last-child td { border-bottom: 0; }
.table tbody tr:hover { background: rgba(255, 255, 255, .022); }
.table-sm td, .table-sm th { padding: 9px 12px; }

/* ────────────────────────────────────────────────────────────── Champs */
/*
 * ⚠️ `appearance: none` SUR LES MENUS DÉROULANTS — ne pas le retirer.
 *
 * Un `<select>` laissé en rendu natif est dessiné par le système, qui peint
 * son texte avec SA couleur et ignore `color`. Sur fond sombre, le nom choisi
 * devient invisible — et le défaut ne se voit que sur certains navigateurs,
 * ce qui le rend très difficile à diagnostiquer. En reprenant le dessin, le
 * texte redevient du texte ordinaire.
 */
.form-group { margin-bottom: 16px; }
.form-row { display: flex; flex-wrap: wrap; gap: 0 16px; }

label {
    display: inline-block;
    margin-bottom: 6px;
    color: var(--texte-2);
    font-size: 13px;
    font-weight: 500;
}

.form-control, .custom-select, input[type="text"], input[type="email"],
input[type="password"], input[type="number"], input[type="date"],
input[type="search"], textarea, select {
    display: block;
    width: 100%;
    padding: 10px 14px;
    background: var(--surface-2);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon-petit);
    color: var(--texte);
    font-family: inherit;
    font-size: 14px;
    line-height: 1.4;
}

select, .custom-select, select.form-control {
    -webkit-appearance: none;
    appearance: none;
    min-width: 150px;
    padding-right: 36px;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23aab3c0' d='M1.4 0 6 4.6 10.6 0 12 1.4 6 7.4 0 1.4z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 13px center;
    cursor: pointer;
}

/* La liste déployée est peinte par le système : elle n'hérite pas du champ. */
select option { background: var(--surface); color: var(--texte); }

.form-control:focus, select:focus, textarea:focus, input:focus {
    outline: none;
    background: var(--surface-2);
    border-color: var(--lime);
    box-shadow: 0 0 0 3px rgba(186, 210, 84, .16);
}

.form-control::placeholder, textarea::placeholder { color: var(--texte-3); }
.form-control-sm { padding: 7px 12px; font-size: 13px; }
select.form-control-sm { padding-right: 34px; }
.form-text { font-size: 12.5px; color: var(--texte-3); margin-top: 5px; }

textarea.form-control { min-height: 110px; resize: vertical; }

.input-group { display: flex; align-items: stretch; }
.input-group > .form-control { border-radius: var(--rayon-petit) 0 0 var(--rayon-petit); }
.input-group-append { display: flex; }
.input-group-text {
    display: inline-flex; align-items: center;
    padding: 0 14px;
    background: var(--surface);
    border: 1px solid var(--bordure);
    border-left: 0;
    border-radius: 0 var(--rayon-petit) var(--rayon-petit) 0;
    color: var(--texte-2);
}

input[type="checkbox"], input[type="radio"] {
    width: auto; display: inline-block;
    accent-color: var(--lime);
}

/* ───────────────────────────────────────────────────────────── Boutons */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 18px;
    border: 1px solid transparent;
    border-radius: 999px;
    background: var(--surface-2);
    color: var(--texte);
    font-family: inherit;
    font-size: 13.5px;
    font-weight: 600;
    cursor: pointer;
    transition: filter .15s, background .15s, border-color .15s;
}
.btn:hover { filter: brightness(1.12); color: var(--texte); }
.btn:focus { outline: none; box-shadow: 0 0 0 3px rgba(186, 210, 84, .2); }
.btn-sm { padding: 7px 14px; font-size: 12.5px; }

.btn-primary { background: var(--lime); color: var(--lime-sur); }
.btn-primary:hover { color: var(--lime-sur); }
.btn-secondary { background: var(--surface-2); color: var(--texte); border-color: var(--bordure); }
.btn-danger { background: var(--rouge); color: #2a0b0b; }
.btn-success { background: var(--vert); color: #08210f; }

.btn-outline-primary { background: transparent; border-color: var(--lime); color: var(--lime-texte); }
.btn-outline-primary:hover { background: rgba(186, 210, 84, .12); color: var(--lime-texte); }
.btn-outline-secondary { background: transparent; border-color: var(--bordure-net); color: var(--texte-2); }
.btn-outline-secondary:hover { background: var(--surface-2); color: var(--texte); }
.btn-outline-danger { background: transparent; border-color: rgba(239, 95, 95, .5); color: var(--rouge); }
.btn-outline-danger:hover { background: rgba(239, 95, 95, .12); color: var(--rouge); }
.btn-outline-success { background: transparent; border-color: rgba(61, 214, 140, .5); color: var(--vert); }
.btn-outline-success:hover { background: rgba(61, 214, 140, .12); color: var(--vert); }

/* ────────────────────────────────────────────────── Badges et alertes */
.badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 600;
    background: var(--surface-2);
    color: var(--texte-2);
}
.badge-success { background: rgba(61, 214, 140, .16); color: var(--vert); }
.badge-warning { background: rgba(233, 162, 59, .16); color: var(--ambre); }
.badge-danger  { background: rgba(239, 95, 95, .16); color: var(--rouge); }
.badge-info    { background: rgba(186, 210, 84, .14); color: var(--lime-texte); }
.badge-secondary { background: var(--surface-2); color: var(--texte-3); }

.alert {
    padding: 13px 16px;
    border: 1px solid var(--bordure);
    border-radius: var(--rayon-petit);
    margin-bottom: 18px;
    background: var(--surface);
    color: var(--texte);
}
.alert-success { border-color: rgba(61, 214, 140, .35); background: rgba(61, 214, 140, .10); }
.alert-warning { border-color: rgba(233, 162, 59, .35); background: rgba(233, 162, 59, .10); }
.alert-danger  { border-color: rgba(239, 95, 95, .35); background: rgba(239, 95, 95, .10); }

/* ─────────────────────────────────────────────────────────── Modales */
.modal { display: none; position: fixed; inset: 0; z-index: 1050; overflow-y: auto; }
.modal.show, .modal.in { display: block; background: rgba(0, 0, 0, .6); }
.modal-dialog { max-width: 620px; margin: 6vh auto; }
.modal-content {
    background: var(--surface);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon);
    box-shadow: var(--ombre);
}
.modal-header, .modal-footer {
    padding: 16px 20px;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.modal-header { border-bottom: 1px solid var(--bordure); }
.modal-footer { border-top: 1px solid var(--bordure); }
.modal-title { font-size: 17px; font-weight: 600; margin: 0; }
.modal-body { padding: 20px; }
.close { background: none; border: 0; color: var(--texte-2); font-size: 24px; cursor: pointer; }

/* ─────────────────────────────────────────── Menus « ⋮ » des dossiers */
.dropdown { position: relative; }
.dropdown-menu {
    display: none;
    position: absolute;
    right: 0;
    top: calc(100% + 6px);
    z-index: 20;
    min-width: 180px;
    padding: 6px;
    background: var(--surface);
    border: 1px solid var(--bordure);
    border-radius: var(--rayon-petit);
    box-shadow: var(--ombre);
}
.dropdown-menu.show { display: block; }
.dropdown-item {
    display: flex; align-items: center; gap: 9px;
    padding: 9px 12px;
    border-radius: 7px;
    color: var(--texte-2);
    font-size: 13.5px;
    white-space: nowrap;
}
.dropdown-item:hover { background: var(--surface-2); color: var(--texte); }
.dropdown-divider { height: 1px; background: var(--bordure); margin: 6px 0; }
.dropdown-header { padding: 8px 12px; color: var(--texte-3); font-size: 12.5px; }

/* ───────────────────────────────────────────────────────────── Grille */
/*
 * ⚠️ 02/09/2026 — UNE GRILLE RÉPOND À LA LARGEUR D'ÉCRAN, OU N'EST PAS.
 *
 * Première version : chaque classe déclarée une fois, hors de tout @media,
 * et surtout avec une spécificité inférieure à celle de la règle de base
 * `.row > [class*="col-"]` (deux sélecteurs) : `.col-md-6` (un seul) ne
 * gagnait JAMAIS. Toutes les colonnes faisaient 100 % — les pages à deux
 * colonnes s'empilaient en une seule (retour du fondateur : « tout est sur
 * la même ligne alors qu'avant il y avait des pages avec 2 colonnes »).
 * Et `col-xl-7`, `col-xl-5`, `col-xl-2` n'existaient pas du tout.
 *
 * Ici : mobile d'abord (tout en pleine largeur), puis chaque taille
 * s'applique à partir de son seuil — ceux que les pages supposent
 * (sm 576, md 768, lg 992, xl 1200). Les règles de colonne portent le même
 * préfixe `.row >` que la règle de base : même spécificité, et elles viennent
 * après, donc elles gagnent — mais seulement quand l'écran atteint le seuil.
 */
.row { display: flex; flex-wrap: wrap; margin: 0 -11px; }
.row > [class*="col-"] { padding: 0 11px; width: 100%; }

/* Sans préfixe : la même proportion à toute largeur. */
    .row > .col-1 { width: 8.3333%; }
    .row > .col-2 { width: 16.6667%; }
    .row > .col-3 { width: 25.0000%; }
    .row > .col-4 { width: 33.3333%; }
    .row > .col-5 { width: 41.6667%; }
    .row > .col-6 { width: 50.0000%; }
    .row > .col-7 { width: 58.3333%; }
    .row > .col-8 { width: 66.6667%; }
    .row > .col-9 { width: 75.0000%; }
    .row > .col-10 { width: 83.3333%; }
    .row > .col-11 { width: 91.6667%; }
    .row > .col-12 { width: 100.0000%; }

@media (min-width: 576px) {
    .row > .col-sm-1 { width: 8.3333%; }
    .row > .col-sm-2 { width: 16.6667%; }
    .row > .col-sm-3 { width: 25.0000%; }
    .row > .col-sm-4 { width: 33.3333%; }
    .row > .col-sm-5 { width: 41.6667%; }
    .row > .col-sm-6 { width: 50.0000%; }
    .row > .col-sm-7 { width: 58.3333%; }
    .row > .col-sm-8 { width: 66.6667%; }
    .row > .col-sm-9 { width: 75.0000%; }
    .row > .col-sm-10 { width: 83.3333%; }
    .row > .col-sm-11 { width: 91.6667%; }
    .row > .col-sm-12 { width: 100.0000%; }
}
@media (min-width: 768px) {
    .row > .col-md-1 { width: 8.3333%; }
    .row > .col-md-2 { width: 16.6667%; }
    .row > .col-md-3 { width: 25.0000%; }
    .row > .col-md-4 { width: 33.3333%; }
    .row > .col-md-5 { width: 41.6667%; }
    .row > .col-md-6 { width: 50.0000%; }
    .row > .col-md-7 { width: 58.3333%; }
    .row > .col-md-8 { width: 66.6667%; }
    .row > .col-md-9 { width: 75.0000%; }
    .row > .col-md-10 { width: 83.3333%; }
    .row > .col-md-11 { width: 91.6667%; }
    .row > .col-md-12 { width: 100.0000%; }
}
@media (min-width: 992px) {
    .row > .col-lg-1 { width: 8.3333%; }
    .row > .col-lg-2 { width: 16.6667%; }
    .row > .col-lg-3 { width: 25.0000%; }
    .row > .col-lg-4 { width: 33.3333%; }
    .row > .col-lg-5 { width: 41.6667%; }
    .row > .col-lg-6 { width: 50.0000%; }
    .row > .col-lg-7 { width: 58.3333%; }
    .row > .col-lg-8 { width: 66.6667%; }
    .row > .col-lg-9 { width: 75.0000%; }
    .row > .col-lg-10 { width: 83.3333%; }
    .row > .col-lg-11 { width: 91.6667%; }
    .row > .col-lg-12 { width: 100.0000%; }
}
@media (min-width: 1200px) {
    .row > .col-xl-1 { width: 8.3333%; }
    .row > .col-xl-2 { width: 16.6667%; }
    .row > .col-xl-3 { width: 25.0000%; }
    .row > .col-xl-4 { width: 33.3333%; }
    .row > .col-xl-5 { width: 41.6667%; }
    .row > .col-xl-6 { width: 50.0000%; }
    .row > .col-xl-7 { width: 58.3333%; }
    .row > .col-xl-8 { width: 66.6667%; }
    .row > .col-xl-9 { width: 75.0000%; }
    .row > .col-xl-10 { width: 83.3333%; }
    .row > .col-xl-11 { width: 91.6667%; }
    .row > .col-xl-12 { width: 100.0000%; }
}

/* ─────────────────────────────────────────────────────── Utilitaires */
.d-flex { display: flex; }
.d-none { display: none; }
.d-block { display: block; }
.align-items-center { align-items: center; }
.justify-content-between { justify-content: space-between; }
.h-100 { height: 100%; }
.w-100 { width: 100%; }
.clearfix::after { content: ""; display: table; clear: both; }
.float-left { float: left; }
.float-right, .float-sm-right { float: right; }
.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.small, small { font-size: 12.5px; }
.border-top { border-top: 1px solid var(--bordure); }

.text-muted { color: var(--texte-3) !important; }
.text-dark { color: var(--texte) !important; }
.text-white-50 { color: var(--texte-2) !important; }
.text-success { color: var(--vert) !important; }
.text-danger  { color: var(--rouge) !important; }
.text-warning { color: var(--ambre) !important; }
.text-primary { color: var(--lime-texte) !important; }

.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: .25rem !important; }
.mb-2 { margin-bottom: .5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-10 { margin-bottom: 10px !important; }
.mb-20 { margin-bottom: 20px !important; }
.mb-30 { margin-bottom: 22px !important; }
.mt-2 { margin-top: .5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mr-1 { margin-right: .25rem !important; }
.my-3 { margin-top: 1rem !important; margin-bottom: 1rem !important; }
.p-3 { padding: 1rem !important; }
.p-5 { padding: 2rem !important; }
.pt-0 { padding-top: 0 !important; }
.pr-0 { padding-right: 0 !important; }
.pt-3 { padding-top: 1rem !important; }
.xs-mt-10 { margin-top: 10px; }

/* Barres de défilement, pour qu'elles ne trahissent pas le thème. */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--fond); }
::-webkit-scrollbar-thumb { background: #262b35; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #333a47; }

/* ──────────────────────────────────────── Responsive : petits écrans */
@media (max-width: 860px) {
    .vloo-sidebar { display: none; }
    .vloo-contenu { padding: 18px 16px 50px; }
}
@font-face {
  font-family: 'themify';
  src: url("../fonts/themify.eot?-fvbane");
  src: url("../fonts/themify.eot?#iefix-fvbane") format("embedded-opentype"), url("../fonts/themify.woff?-fvbane") format("woff"), url("../fonts/themify.ttf?-fvbane") format("truetype"), url("../fonts/themify.svg?-fvbane#themify") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'FontAwesome';
  src: url("../fonts/fontawesome-webfont.eot?v=4.7.0");
  src: url("../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0") format("embedded-opentype"), url("../fonts/fontawesome-webfont.woff2?v=4.7.0") format("woff2"), url("../fonts/fontawesome-webfont.woff?v=4.7.0") format("woff"), url("../fonts/fontawesome-webfont.ttf?v=4.7.0") format("truetype"), url("../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal; }

.fa-bookmark:before{content: "\f02e";}
.fa-folder:before{content: "\f07b";}
.ti-user:before{content: "\e602";}
.ti-pencil-alt:before{content: "\e61d";}
.ti-list:before{content: "\e694";}
.ti-files:before{content: "\e6a3";}
.fa-window-maximize:before{content: "\f2d0";}
.fa-ellipsis-v:before{content: "\f142";}
.fa-check:before{content: "\f00c";}
.ti-trash:before{content: "\e605";}
.ti-tag:before{content: "\e608";}
.ti-layout-grid2:before{content: "\e709";}
.ti-home:before{content: "\e69b";}
.ti-gallery:before{content: "\e71e";}
.ti-credit-card:before{content: "\e721";}
.ti-settings:before{content: "\e60f";}
.ti-arrow-up:before{content: "\e627";}
.ti-arrow-down:before{content: "\e62a";}
.fa-windows:before{content: "\f17a";}
.fa-window-minimize:before{content: "\f2d1";}
.fa-users:before{content: "\f0c0";}
.fa-upload:before{content: "\f093";}
.fa-trash:before{content: "\f1f8";}
.fa-television:before{content: "\f26c";}
.fa-picture-o:before{content: "\f03e";}
.fa-mobile:before{content: "\f10b";}
.fa-file-image-o:before{content: "\f1c5";}
.fa-cutlery:before{content: "\f0f5";}
.fa-cloud-upload:before{content: "\f0ee";}
.fa-check-square-o:before{content: "\f046";}
.fa-arrows-v:before{content: "\f07d";}
.fa-arrows-h:before{content: "\f07e";}

/* Les deux familles d'icônes, reprises telles quelles du thème d'origine :
 * elles fonctionnent, et les redessiner n'apporterait rien. Seules les 31
 * icônes réellement employées sont déclarées — les 500 autres partaient
 * autrefois dans les 554 Ko. */
[class^="ti-"], [class*=" ti-"] {
    font-family: 'themify';
    speak: none; font-style: normal; font-weight: normal;
    font-variant: normal; text-transform: none; line-height: 1;
    -webkit-font-smoothing: antialiased;
}
.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}