:root { --sb-w: 240px; }
html, body { height: 100%; }
body { background: #f4f6f9; }
#app-root { min-height: 100vh; }
.sidebar { width: var(--sb-w); min-height: 100vh; position: sticky; top: 0; }
.sidebar .nav-link { color: #cdd3da; border-radius: .5rem; }
.sidebar .nav-link:hover { background: rgba(255,255,255,.08); color: #fff; }
.sidebar .nav-link.active { background: #0dcaf0; color: #04222b; font-weight: 600; }
main#view { max-width: 1200px; }
.card { border: none; box-shadow: 0 1px 3px rgba(0,0,0,.08); border-radius: .75rem; }
.table thead th { font-size: .75rem; text-transform: uppercase; letter-spacing: .03em; color: #6c757d; }
.page-title { font-weight: 700; }
.stat-card { border-left: 4px solid #0dcaf0; }
@media (max-width: 768px) { .sidebar { position: static; width: 100%; min-height: auto; } #app-root { flex-direction: column; } }

/* ===== Editor template etichetta ===== */
.canvas-wrap { overflow: auto; background: #e9ecef; padding: 16px; border-radius: .5rem; }
.lbl-canvas { position: relative; background: #fff; box-shadow: 0 0 0 1px #adb5bd, 0 2px 8px rgba(0,0,0,.12); margin: 0 auto; background-image: linear-gradient(#f3f5f7 1px, transparent 1px), linear-gradient(90deg, #f3f5f7 1px, transparent 1px); background-size: 17.5px 17.5px; }
.lbl-field { position: absolute; cursor: move; line-height: 1.05; color: #111; user-select: none; padding: 0; }
.lbl-field.txt { border: 1px dashed transparent; }
.lbl-field.sel { outline: 2px solid #0d6efd; outline-offset: 1px; z-index: 5; }
.lbl-field.bc { display: flex; align-items: center; justify-content: center; border: 1px solid #6c757d; background: repeating-linear-gradient(90deg,#000 0 2px,#fff 2px 4px); }
.lbl-field.bc span { background: rgba(255,255,255,.85); font-size: 10px; padding: 0 3px; color: #000; }
.lbl-field.line { border-top: 2px solid #000; height: 0; }
.lbl-field.box { border: 1px solid #000; }