/* Explorateur de fichiers Windows 10, mode sombre (VM 110) — relevé au pixel sur
   captures/windows-10/visual-fidelity/explorer/vm/default.png. Origine : coin de la fenêtre
   sous la barre de titre (130,105 à l'écran). Teintes relevées : ruban #000000, onglet Fichier
   #224398, bandeau d'adresse #191919 (cadres #535353), volet #191919, contenu #202020,
   sélection #333333 (liserés #1d1d1d), barre d'état #333333. Glyphes Segoe MDL2 Assets,
   textes Segoe UI ; icônes : toolkits/windows/10/explorer/SOURCE-VM.txt. */
@font-face {
    font-family: "Segoe UI Win10";
    src: url("../../../../../usr/share/capsuleos/assets/fonts/windows/10/segoeui.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Segoe MDL2 Assets Win10";
    src: url("../../../../../usr/share/capsuleos/assets/fonts/windows/10/segmdl2.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
}

:root {
    --ico-quick-access: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/quick-access-16.png");
    --ico-desktop: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/desktop-16.png");
    --ico-downloads: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/downloads-16.png");
    --ico-user: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/user-16.png");
    --ico-documents: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/documents-16.png");
    --ico-pictures: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/pictures-16.png");
    --ico-this-pc: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/this-pc-16.png");
    --ico-network: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/network-16.png");
    --ico48-desktop: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/desktop-48.png");
    --ico48-downloads: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/downloads-48.png");
    --ico48-user: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/user-48.png");
    --ico48-documents: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/documents-48.png");
    --ico48-pictures: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/pictures-48.png");
}

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html,
body {
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: #202020;
}

.w10 {
    position: relative;
    width: 784px;
    height: 561px;
    font-family: "Segoe UI Win10", "Segoe UI", sans-serif;
    font-size: 12px;
    line-height: 16px;
    color: #ffffff;
    background: #202020;
    overflow: hidden;
}

.w10 button,
.w10 input {
    border: 0;
    font: inherit;
    color: inherit;
    background: transparent;
}

.w10__glyph {
    position: absolute;
    display: block;
    font-family: "Segoe MDL2 Assets Win10";
    font-size: 10px;
    line-height: 10px;
    text-align: center;
}

.w10__glyph::before {
    font-family: "Segoe MDL2 Assets Win10";
}

.w10__ico16,
.w10__ico48 {
    position: absolute;
    display: block;
    width: 16px;
    height: 16px;
    background: var(--i) 0 0 / 16px 16px no-repeat;
}

.w10__ico48 {
    width: 48px;
    height: 48px;
    background-size: 48px 48px;
}

/* --- Ruban : onglets (y0..22) --- */
.w10__ribbon {
    position: absolute;
    top: 0;
    left: 0;
    width: 784px;
    height: 23px;
    background: #000000;
}

.w10__tab {
    position: absolute;
    top: 0;
    left: var(--x);
    height: 23px;
    padding: 0 13px 2px;
    line-height: 16px;
    color: #f3f3f3;
    white-space: nowrap;
}

.w10 .w10__tab--file {
    left: 0;
    width: 56px;
    padding: 0 0 2px 11px;
    text-align: left;
    color: #ffffff;
    background: #224398;
}

.w10__ribbon-expand {
    position: absolute;
    display: block;
    top: 3px;
    left: 743px;
    width: 16px;
    height: 16px;
    background: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/chevron-down-16.png") 0 0 / 16px 16px no-repeat;
    filter: brightness(1.46);
}

.w10__help {
    top: 3px;
    left: 765px;
    background-image: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/help-16.png");
}

/* --- Bandeau de navigation (y23..65) --- */
.w10__navbar {
    position: absolute;
    top: 23px;
    left: 0;
    width: 784px;
    height: 43px;
    background: #191919;
}

.w10__travel {
    position: absolute;
    top: 16px;
    width: 12px;
    height: 12px;
    font-size: 8px;
    line-height: 12px;
    color: #8c8c8c;
}

/* Flèches du thème sombre : ExplorerFrame.dll.mun BITMAP 288 (gris) et 300 (blanc), cellules
   16 px — Précédent = Suivant en miroir, Monter = flèche blanche tournée. */
.w10 .w10__travel--img {
    top: 13px;
    width: 16px;
    height: 16px;
    background: var(--i) 0 0 / 16px 16px no-repeat;
}

.w10__travel--back {
    left: 10px;
    --i: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/nav-back-16.png");
}

.w10__travel--forward {
    left: 42px;
    --i: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/nav-forward-16.png");
}

/* Petit chevron « Emplacements récents » : glyphe E96E à 7 px, gris #8c8c8c. */
.w10 .w10__travel--recent {
    top: 17px;
    left: 69px;
    width: 7px;
    height: 7px;
    font-family: "Segoe MDL2 Assets Win10";
    font-size: 7px;
    line-height: 7px;
    text-align: left;
    color: #8c8c8c;
}

.w10__travel--recent::before {
    content: "\E96E";
}

.w10__travel--up {
    left: 85px;
    --i: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/nav-up-16.png");
}

.w10__address {
    position: absolute;
    top: 6px;
    left: 106px;
    width: 312px;
    height: 30px;
    border: 1px solid #535353;
}

.w10__address-ico {
    top: 5px;
    left: 2px;
    background-image: var(--ico-quick-access);
}

.w10__crumb-sep {
    top: 10px;
    left: var(--x);
    width: 8px;
    font-size: 8px;
    line-height: 8px;
    color: #808080;
}

.w10__crumb-sep::before {
    content: "\E76C";
}

.w10__crumb {
    position: absolute;
    top: 5px;
    left: 39px;
    white-space: nowrap;
}

.w10 .w10__address-dropdown,
.w10 .w10__refresh {
    position: absolute;
    display: block;
    top: 7px;
    left: 258px;
    width: 16px;
    height: 16px;
    background: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/chevron-down-16.png") 0 0 / 16px 16px no-repeat;
}

.w10__address-divider {
    position: absolute;
    top: 0;
    left: 280px;
    width: 1px;
    height: 28px;
    background: #151515;
}

.w10 .w10__refresh {
    left: 288px;
    background-image: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/refresh-16.png");
}

.w10__search {
    position: absolute;
    top: 6px;
    left: 430px;
    width: 342px;
    height: 30px;
    border: 1px solid #535353;
}

.w10__search-ico {
    top: 8px;
    left: 14px;
    width: 12px;
    height: 12px;
    font-size: 12px;
    line-height: 12px;
    color: #717171;
}

.w10__search-ico::before {
    content: "\E721";
}

.w10__search>input {
    position: absolute;
    top: 5px;
    left: 40px;
    width: 290px;
    height: 16px;
    outline: 0;
}

.w10__search>input::placeholder {
    color: #717171;
    opacity: 1;
}

/* --- Volet de navigation (x0..156, y66..537) --- */
.w10__navpane {
    position: absolute;
    top: 66px;
    left: 0;
    width: 156px;
    height: 472px;
    border-right: 1px solid #131313;
    background: #191919;
}

.w10__tree {
    list-style: none;
}

.w10__node {
    position: absolute;
    top: calc(var(--y) - 62px);
    left: 1px;
    width: 154px;
    height: 24px;
    white-space: nowrap;
}

.w10__node--selected {
    border-top: 1px solid #1d1d1d;
    border-bottom: 1px solid #1d1d1d;
    background: #333333;
}

.w10__node>.w10__ico16 {
    top: 5px;
    left: calc(23px + var(--l) * 8px);
}

.w10__node--selected>.w10__ico16 {
    top: 4px;
}

.w10__node-label {
    position: absolute;
    top: 4px;
    left: calc(44px + var(--l) * 8px);
}

.w10__node--selected>.w10__node-label {
    top: 3px;
}

.w10__pin {
    top: 7px;
    left: 141px;
    width: 12px;
    font-size: 12px;
    line-height: 12px;
    color: #959595;
}

.w10__pin::before,
.w10__tile-pin::before {
    content: "\E842";
}

/* --- Contenu (x157..783) --- */
.w10__content {
    position: absolute;
    top: 66px;
    left: 157px;
    width: 627px;
    height: 472px;
    background: #202020;
}

.w10__group {
    position: absolute;
    top: calc(var(--y) - 66px);
    left: 24px;
    font-size: 15px;
    font-weight: 400;
    line-height: 20px;
    white-space: nowrap;
}

.w10__group::after {
    content: "";
    position: absolute;
    top: 11px;
    left: calc(var(--line) - 181px);
    width: calc(777px - var(--line));
    height: 1px;
    background: #2b2b2b;
}

.w10__group-chevron {
    top: 6px;
    left: -16px;
    width: 12px;
    color: #5e5e5e;
}

.w10__group-chevron::before {
    content: "\E70D";
}

.w10__tile {
    position: absolute;
    top: calc(var(--y) - 66px);
    left: calc(var(--x) - 157px);
    width: 220px;
    height: 56px;
}

.w10__tile>.w10__ico48 {
    top: 0;
    left: 0;
}

.w10__tile-name,
.w10__tile-sub {
    position: absolute;
    top: -1px;
    left: 53px;
    white-space: nowrap;
}

.w10__tile-sub {
    top: 15px;
    color: #dedede;
}

.w10__tile-pin {
    top: 33px;
    left: 53px;
    width: 12px;
    font-size: 12px;
    line-height: 12px;
    color: #959595;
}

.w10__empty {
    position: absolute;
    top: 284px;
    left: 194px;
    white-space: nowrap;
}

/* --- Barre d'état (y538..560) --- */
.w10__status {
    position: absolute;
    top: 538px;
    left: 0;
    width: 784px;
    height: 23px;
    color: #f7f7f7;
    background: #333333;
}

.w10__status-text {
    position: absolute;
    top: 3px;
    left: 14px;
    white-space: nowrap;
}

.w10__status-sep {
    position: absolute;
    top: 6px;
    left: 89px;
    width: 1px;
    height: 11px;
    background: #f7f7f7;
}

.w10 .w10__view {
    top: 3px;
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: 16px 16px;
}

.w10 .w10__view--details {
    left: 739px;
    background-image: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/view-details-16.png");
}

.w10 .w10__view--tiles {
    left: 761px;
    background-image: url("../../../../../usr/share/capsuleos/assets/images/toolkits/windows/10/explorer/view-tiles-16.png");
}