/* Glass na svim površinama; fokus je neutralan i vidljiv pri korišćenju tastature. */
dialog, dialog.jl-dialog {
  color: var(--ink, #eef6f5); background: color-mix(in srgb, var(--panel, var(--surface, #121b1e)) 78%, transparent);
  border: 1px solid color-mix(in srgb, var(--ink, #fff) 18%, transparent); border-radius: 22px;
  -webkit-backdrop-filter: blur(28px) saturate(1.35); backdrop-filter: blur(28px) saturate(1.35);
  box-shadow: 0 28px 90px #0008, inset 0 1px 0 #ffffff0d;
  padding: 28px; max-height: 88dvh; overflow: auto;
}
dialog::backdrop { background: #000b; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }
dialog :focus { outline: none; }
dialog :focus-visible { outline: 2px solid var(--ink, #fff); outline-offset: 4px; }
.jl-dialog { width: min(460px, calc(100vw - 32px)); font: 14px/1.6 var(--sans, system-ui); }
.jl-dialog h2 { font: 500 28px var(--serif, Georgia); margin: 0 0 12px; }
.jl-dialog p { color: var(--ink-soft, #a3b6b4); white-space: pre-line; margin: 0 0 20px; }
.jl-input { box-sizing: border-box; width: 100%; border: 1px solid var(--line-strong, #36494f); border-radius: 12px; padding: 12px; background: var(--bg, #070b0c); color: var(--ink, #fff); font: inherit; }
.jl-color { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; color: var(--ink-soft, #a3b6b4); }
.jl-color input { width: 42px; height: 42px; padding: 3px; border: 1px solid var(--line-strong, #36494f); border-radius: 50%; background: var(--bg, #070b0c); cursor: pointer; }
.jl-color input::-webkit-color-swatch-wrapper { padding: 0; }
.jl-color input::-webkit-color-swatch { border: 0; border-radius: 50%; }
.jl-color input::-moz-color-swatch { border: 0; border-radius: 50%; }
.jl-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 24px; }
.jl-button { padding: 10px 17px; border: 1px solid var(--line-strong, #36494f); border-radius: 12px; background: transparent; color: var(--ink, #fff); font: 600 13px var(--sans, system-ui); cursor: pointer; }
.jl-button.primary { background: var(--accent, #35d0c4); color: var(--accent-ink, #032220); border-color: transparent; }
.jl-dragover { outline: 2px solid var(--accent, #35d0c4); outline-offset: -3px; background: color-mix(in srgb, var(--accent, #35d0c4) 14%, var(--surface, #121b1e)) !important; }
.jl-uploading { position: relative; pointer-events: none; min-height: 60px; }
.jl-upload-progress { position: absolute; inset: 0; z-index: 3; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 10px; background: color-mix(in srgb, var(--bg, #070b0c) 76%, transparent); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); color: var(--ink, #fff); border-radius: inherit; font: 600 12px var(--sans, system-ui); text-align: center; }
.jl-spinner { display: inline-block; width: 23px; height: 23px; flex: none; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: jl-spin .75s linear infinite; }
.jl-loading { display: flex; align-items: center; gap: 13px; padding: 18px 0; color: var(--ink-soft, #a3b6b4); }
.jl-popover-shade { position: fixed; inset: 0; z-index: 2147481999; background: #0009; -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.jl-count { display: none; position: fixed; inset: auto; margin: 0; z-index: 2147482500; padding: 2px 8px; border: 1px solid var(--line-strong, #36494f); border-radius: 8px; background: var(--surface, #121b1e); color: var(--ink-soft, #a3b6b4); font: 600 11px/1.5 var(--sans, system-ui); font-variant-numeric: tabular-nums; pointer-events: none; }
.jl-count.full { color: var(--accent, #35d0c4); border-color: var(--accent, #35d0c4); }
.lightbox { -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.tryon-btn { border-style: dashed; min-height: 100px; width: min(100%, 420px); }
.tryon-btn small { display: block; font-size: 11px; font-weight: 400; margin-top: 5px; }
@keyframes jl-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .jl-spinner { animation-duration: 2s; } }
