:root { --rob: #d0d4da; --besedilo: #1f2933; --ozadje: #f4f5f7; --poudarek: #1f5fa8; }
html, body { height: 100%; margin: 0; font: 14px "Segoe UI", Arial, sans-serif; color: var(--besedilo); background: var(--ozadje); }
body { display: flex; flex-direction: column; overflow: hidden; }
#vrstica { display: flex; gap: 12px; align-items: center; padding: 8px 12px; background: #fff; border-bottom: 1px solid var(--rob); flex-wrap: wrap; }
#ime { font-weight: 600; }
#stanje { flex: 1; color: #52606d; min-width: 160px; }
.gumb { padding: 6px 12px; border: 1px solid var(--poudarek); border-radius: 4px; color: var(--poudarek); background: #fff; cursor: pointer; text-decoration: none; }
.gumb:hover { background: var(--poudarek); color: #fff; }
#platno { position: relative; flex: 1; min-height: 0; }
#editor_sdk { position: absolute; inset: 0; }
#pdf { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
#listi { display: flex; gap: 2px; padding: 4px 8px 0; overflow-x: auto; background: #fff; border-top: 1px solid var(--rob); flex: none; }
#listi[hidden] { display: none; }
#listi button { padding: 5px 14px; border: 1px solid var(--rob); border-bottom: 0; border-radius: 4px 4px 0 0; background: var(--ozadje); color: var(--besedilo); font: inherit; cursor: pointer; white-space: nowrap; }
#listi button[aria-current="true"] { background: #fff; color: var(--poudarek); font-weight: 600; }
body.vlek #platno { outline: 3px dashed var(--poudarek); outline-offset: -8px; }