/* Kito Impression : aperçu des fichiers (fiche produit et envoi après commande), thème sombre de kito.ch */
.kitoimp-pv, .kitoimp-pv__dialog {
  --pv-ink: #F5F5F4; --pv-soft: #A6A6AC; --pv-faint: #707077; --pv-line: #2A2A2F; --pv-line2: #3B3B41;
  --pv-raised: #1C1C1F; --pv-ground: #0B0B0C; --pv-ok: #86BD96; --pv-warn: #E3B566;
}
.kitoimp-pv { display: grid; gap: 10px; color: var(--pv-ink); }
.kitoimp-pv[hidden] { display: none; }
.kitoimp-pv *, .kitoimp-pv *::before { box-sizing: border-box; }
.kitoimp-pv button { font: inherit; color: inherit; text-transform: none; letter-spacing: normal; }
.kitoimp-pv__top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.kitoimp-pv__title { margin: 0; flex-basis: 100%; font-size: 15px; font-weight: 800; }
.kitoimp-pv__tabs { display: inline-flex; padding: 3px; border: 1px solid var(--pv-line2); border-radius: 999px; }
.kitoimp-pv__tab { display: inline-flex; align-items: center; gap: 8px; min-height: 34px; padding: 0 14px; border: 0; border-radius: 999px; background: transparent; font-size: 13px; font-weight: 700; color: var(--pv-soft); cursor: pointer; }
.kitoimp-pv__tab[aria-pressed="true"] { background: var(--pv-raised); color: var(--pv-ink); }
.kitoimp-pv__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--pv-ok); }
.kitoimp-pv__dot.is-warn { background: var(--pv-warn); }
.kitoimp-pv__dot.is-empty { background: transparent; box-shadow: inset 0 0 0 1.5px var(--pv-faint); }
.kitoimp-pv__zoom { margin-left: auto; display: inline-flex; align-items: center; min-height: 34px; padding: 0 14px; border: 1px solid var(--pv-line2); border-radius: 999px; background: transparent; font-size: 13px; font-weight: 700; cursor: pointer; }
.kitoimp-pv__zoom:hover { border-color: var(--pv-soft); }
.kitoimp-pv__zoom:disabled { opacity: .45; cursor: default; }
.kitoimp-pv__stage { display: grid; place-items: center; min-height: 190px; padding: 14px; border-radius: 12px; background-color: #18181B; background-image: radial-gradient(rgba(255, 255, 255, .06) 1px, transparent 1px); background-size: 14px 14px; }
.kitoimp-pv__stage svg { display: block; width: 100%; height: auto; max-height: 440px; }
.kitoimp-pv__msg { margin: 0; max-width: 40ch; text-align: center; font-size: 13.5px; color: var(--pv-soft); }
.kitoimp-pv__load { width: min(260px, 70%); display: grid; gap: 10px; justify-items: center; font-size: 13px; color: var(--pv-soft); }
.kitoimp-pv__load i { display: block; width: 100%; height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--pv-line) 0%, var(--pv-soft) 50%, var(--pv-line) 100%); background-size: 200% 100%; animation: kitoimp-pv-shimmer 1s linear infinite; }
@keyframes kitoimp-pv-shimmer { to { background-position: -200% 0; } }
.kitoimp-pv__legend { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 12px; color: var(--pv-soft); }
.kitoimp-pv__lg { display: inline-flex; align-items: center; gap: 8px; }
.kitoimp-pv__lg::before { content: ""; display: inline-block; }
.kitoimp-pv__lg--trim::before { width: 18px; border-top: 2px solid var(--pv-ink); }
.kitoimp-pv__lg--safe::before { width: 18px; border-top: 2px dashed var(--pv-ok); }
.kitoimp-pv__lg--max::before { width: 18px; border-top: 2px dashed var(--pv-ink); }
.kitoimp-pv__lg--bleed::before { width: 14px; height: 10px; border-radius: 2px; background: repeating-linear-gradient(45deg, rgba(245, 245, 244, .5) 0 1.5px, rgba(11, 11, 12, .7) 1.5px 4px); }
.kitoimp-pv__lg--eye::before { width: 10px; height: 10px; border-radius: 50%; background: var(--pv-ink); box-shadow: inset 0 0 0 2px var(--pv-ground); }
.kitoimp-pv__lg--sleeve::before { width: 14px; height: 10px; border-radius: 2px; background: repeating-linear-gradient(45deg, rgba(245, 245, 244, .5) 0 1.5px, rgba(11, 11, 12, .7) 1.5px 4px); box-shadow: inset 0 0 0 1px var(--pv-soft); }
.kitoimp-pv__lg--hole::before { width: 10px; height: 10px; border-radius: 50%; background: #18181B; box-shadow: 0 0 0 1.5px var(--pv-ink); }
.kitoimp-pv__notes { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.kitoimp-pv__notes li { position: relative; margin: 0; padding-left: 24px; font-size: 13px; line-height: 1.45; max-width: 64ch; }
.kitoimp-pv__notes li::before { position: absolute; left: 0; top: 2px; width: 16px; height: 16px; border-radius: 50%; display: grid; place-items: center; font-size: 10px; font-weight: 800; line-height: 1; }
.kitoimp-pv__notes .is-warn { color: var(--pv-warn); }
.kitoimp-pv__notes .is-warn::before { content: "!"; background: var(--pv-warn); color: #0B0B0C; }
.kitoimp-pv__notes .is-info { color: var(--pv-soft); }
.kitoimp-pv__notes .is-info::before { content: "i"; background: var(--pv-line2); color: var(--pv-ink); }
.kitoimp-pv__dialog { width: min(1100px, calc(100vw - 32px)); max-width: none; max-height: calc(100dvh - 32px); padding: 18px clamp(16px, 3vw, 28px) 24px; border: 1px solid var(--pv-line2); border-radius: 20px; background: var(--pv-ground); color: var(--pv-ink); }
.kitoimp-pv__dialog::backdrop { background: rgba(0, 0, 0, .78); }
.kitoimp-pv--big .kitoimp-pv__stage svg { max-height: calc(100dvh - 260px); }
.kitoimp-late__preview { margin: 10px 0 18px; }
@media (max-width: 640px) {
  .kitoimp-pv__dialog { width: 100vw; height: 100dvh; max-height: 100dvh; border: 0; border-radius: 0; }
}
@media (prefers-reduced-motion: reduce) { .kitoimp-pv__load i { animation: none; } }
