/* files.7000.fr — feuille de style unique, selon la charte graphique 7000 (entrée hub-7000 du 15/10, le PDF fait foi) :
   rouge, noir et blanc en principal, gris en soutien ; jamais rouge sur noir ni noir sur rouge ; sur fond rouge, blanc
   seulement ; deux polices, Open Sans (texte) et Open Sans Condensed (titres = font-stretch 75 %, graisse 800), servies
   par le site lui-même. Thème clair seulement : un fond noir interdirait le rouge des boutons.
   files.7000.fr — single stylesheet, following the 7000 brand guide (hub-7000 entry, 15/10, the PDF prevails): red,
   black and white first, grays as support; never red on black nor black on red; on red, white only; two fonts, Open
   Sans (text) and Open Sans Condensed (titles = font-stretch 75%, weight 800), self-hosted. Light theme only: a black
   background would forbid the red buttons. */
@font-face {
  font-family: "Open Sans"; font-style: normal; font-weight: 300 800; font-stretch: 75% 100%; font-display: swap;
  src: url(/polices/open-sans-latin-ext.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Open Sans"; font-style: normal; font-weight: 300 800; font-stretch: 75% 100%; font-display: swap;
  src: url(/polices/open-sans-latin.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
:root {
  --rouge: #FF0700; --blanc: #FFFFFF; --noir: #000000;
  --gris-clair: #F0F0F0; --gris-neutre: #A3A3A3; --gris-fonce: #606060;
  --vert: #005E00;
  color-scheme: light;
}
* { box-sizing: border-box; }
body { margin: 0; font: 400 15px/1.6 "Open Sans", sans-serif; background: var(--gris-clair); color: var(--noir); }
[hidden] { display: none !important; }
.condense { font-stretch: 75%; font-weight: 800; }

button, .bouton { font: inherit; font-weight: 600; padding: .4em 1em; border: 2px solid var(--noir); border-radius: 0; background: var(--blanc); color: var(--noir); cursor: pointer; display: inline-block; text-decoration: none; }
button:hover, .bouton:hover { background: var(--noir); color: var(--blanc); }
.principal { background: var(--rouge); color: var(--blanc); border-color: var(--rouge); }
.principal:hover { background: var(--blanc); color: var(--rouge); border-color: var(--rouge); }
.discret { border: none; background: none; color: var(--gris-fonce); padding: .2em .4em; font-weight: 600; }
.discret:hover { background: none; color: var(--rouge); }
.danger { color: var(--rouge); }
.erreur { color: var(--rouge); font-weight: 600; min-height: 1.2em; }

.bandeau { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 24px; background: var(--blanc); border-bottom: 4px solid var(--rouge); }
.marque { font-stretch: 75%; font-weight: 800; font-size: 26px; line-height: 1; text-transform: uppercase; color: var(--noir); text-decoration: none; letter-spacing: 0; }
.marque span { color: var(--rouge); }
.moi { display: flex; gap: 10px; align-items: center; color: var(--gris-fonce); }
main { max-width: 1120px; margin: 0 auto; padding: 24px 16px 160px; }

.connexion { display: grid; place-items: center; min-height: 60vh; }
.connexion form { width: min(380px, 100%); background: var(--blanc); padding: 28px; display: grid; gap: 14px; border-top: 4px solid var(--rouge); }
.connexion h1 { margin: 0 0 4px; font-stretch: 75%; font-weight: 800; font-size: 30px; line-height: 1; text-transform: uppercase; }
.connexion label { display: grid; gap: 4px; color: var(--gris-fonce); font-weight: 600; }
input { font: inherit; padding: .5em .6em; border: 2px solid var(--gris-neutre); border-radius: 0; background: var(--blanc); color: var(--noir); }
input:focus { outline: none; border-color: var(--noir); }

.barre { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; }
.actions { display: flex; flex-wrap: wrap; gap: 8px; }
.fil { display: flex; flex-wrap: wrap; gap: 6px; align-items: baseline; font-stretch: 75%; font-weight: 800; font-size: 22px; text-transform: uppercase; line-height: 1.1; }
.fil a { color: var(--noir); text-decoration: none; }
.fil a:hover { color: var(--rouge); }
.fil .sep { color: var(--gris-neutre); }
.aide { color: var(--gris-fonce); font-size: 13px; margin: 10px 0 14px; }

.liste { width: 100%; border-collapse: collapse; background: var(--blanc); }
.liste th { text-align: left; font-stretch: 75%; font-weight: 800; text-transform: uppercase; color: var(--gris-fonce); font-size: 13px; padding: 10px 12px; border-bottom: 2px solid var(--noir); }
.liste td { padding: 8px 12px; border-bottom: 1px solid var(--gris-clair); vertical-align: middle; }
.liste tbody tr:hover { background: var(--gris-clair); }
.liste a { color: var(--noir); text-decoration: none; word-break: break-word; }
.liste td:first-child a:hover { color: var(--rouge); }
.num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.date { color: var(--gris-fonce); white-space: nowrap; }
.icone { display: inline-block; width: 1.5em; }
.ligne-actions { text-align: right; white-space: nowrap; }
.ligne-actions .bouton { padding: .2em .7em; font-size: 13px; }
.vide { color: var(--gris-fonce); text-align: center; padding: 30px; background: var(--blanc); margin: 0; }
@media (max-width: 640px) { .date, .liste th:nth-child(3) { display: none; } .bandeau { padding: 12px 16px; } }

.envois { position: fixed; right: 16px; bottom: 16px; width: min(540px, calc(100vw - 32px)); max-height: 50vh; overflow: auto; background: var(--blanc); border-top: 4px solid var(--rouge); box-shadow: 0 8px 30px rgba(0,0,0,.2); }
.envois-tete { position: sticky; top: 0; background: var(--blanc); display: flex; gap: 8px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--gris-clair); }
.envois-tete strong { font-stretch: 75%; font-weight: 800; text-transform: uppercase; font-size: 17px; }
.envois-tete #envois-resume { color: var(--gris-fonce); flex: 1; font-size: 13px; }
.envois ul { list-style: none; margin: 0; padding: 0; }
.envois li { padding: 8px 14px; border-bottom: 1px solid var(--gris-clair); display: grid; gap: 4px; }
.envois .nom { word-break: break-all; font-size: 14px; font-weight: 600; }
.envois .etat { display: flex; justify-content: space-between; gap: 8px; color: var(--gris-fonce); font-size: 12px; }
.envois .etat.ok { color: var(--vert); }
.envois .etat.ko { color: var(--rouge); }
.barre-progres { height: 6px; background: var(--gris-clair); overflow: hidden; }
.barre-progres > div { height: 100%; width: 0; background: var(--rouge); transition: width .3s; }

.depot { position: fixed; inset: 0; background: rgba(255,255,255,.75); border: 4px dashed var(--rouge); display: grid; place-items: center; pointer-events: none; }
.depot > div { background: var(--rouge); color: var(--blanc); padding: 18px 28px; font-stretch: 75%; font-weight: 800; font-size: 24px; text-transform: uppercase; }