/* JernejLetica.com passport photo maker */
.passport-photo{
    --pp-blue:#0f78a3;
    --pp-blue-dark:#095f82;
    --pp-blue-bright:#28b2e3;
    --pp-blue-soft:#eaf8fd;
    --pp-navy:#1f1932;
    --pp-text:#17211d;
    --pp-muted:#61706a;
    --pp-line:#e3e1ec;
    --pp-soft:#f5f9fd;
    width:var(--shell);
    margin-inline:auto;
    padding-top:12px;
    color:var(--pp-text);
}
.passport-photo *{box-sizing:border-box}
.passport-photo [hidden]{display:none!important}
.passport-photo button,
.passport-photo input,
.passport-photo select{font:inherit}

.passport-photo__trust{
    display:flex;
    flex-wrap:wrap;
    gap:9px 20px;
    margin-bottom:14px;
    color:var(--pp-muted);
    font-size:13px;
    font-weight:800;
}
.passport-photo__trust span::before{content:"✓";margin-right:6px;color:var(--pp-blue-bright)}

.passport-photo__setup{margin-bottom:14px}
.passport-photo__field{display:grid;gap:6px;min-width:0}
.passport-photo__field .tool-label{margin:0;color:var(--pp-navy);font-size:14px;font-weight:800}
.passport-photo__result>.tool-label{margin:0;color:var(--pp-navy);font-size:16px;font-weight:800}
.passport-photo__field select{
    width:100%;
    min-height:44px;
    padding:8px 12px;
    border:1px solid var(--pp-line);
    border-radius:9px;
    background:#fff;
    color:var(--pp-navy);
    font-weight:700;
}
.passport-photo__spec{margin:8px 0 0;color:var(--pp-muted);font-size:13px;line-height:1.5}

.passport-photo__drop{
    display:block;
    width:100%;
    padding:26px 18px;
    border:1px dashed #b9d9e7;
    border-radius:14px;
    background:#fafdfe;
    text-align:center;
    cursor:pointer;
}
.passport-photo__drop:hover,
.passport-photo__drop.is-dragover{border-color:var(--pp-blue-bright);background:var(--pp-blue-soft)}
.passport-photo__drop strong{display:block;margin-bottom:7px;font-size:18px}
.passport-photo__drop small{color:var(--pp-muted)}
.passport-photo__file{
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    clip-path:inset(50%);
    white-space:nowrap;
}
.passport-photo__message{
    margin-top:12px;
    padding:11px 13px;
    border-radius:8px;
    font-size:14px;
    overflow-wrap:anywhere;
}
.passport-photo__message--error{background:#fff0f1;color:#8a2e3e}

.passport-photo__workspace{
    display:grid;
    grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
    overflow:hidden;
    border:1px solid var(--pp-line);
    border-radius:20px;
    background:#fff;
    box-shadow:0 22px 55px rgba(31,25,50,.08);
}
.passport-photo__stage-card{min-width:0;padding:24px;border-right:1px solid var(--pp-line)}
.passport-photo__stage{
    display:block;
    width:auto;
    height:380px;
    max-width:100%;
    margin:0 auto;
    border:1px solid var(--pp-line);
    touch-action:none;
    cursor:grab;
}
.passport-photo__stage:active{cursor:grabbing}
.passport-photo__stage:focus-visible{outline:3px solid rgba(40,178,227,.45);outline-offset:2px}
.passport-photo__meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;min-width:0;margin-top:10px}
.passport-photo__meta strong{overflow:hidden;color:var(--pp-navy);font-size:14px;text-overflow:ellipsis;white-space:nowrap}
.passport-photo__meta span{color:var(--pp-muted);font-size:12px}
.passport-photo__change{
    min-height:44px;
    padding:0;
    border:0;
    background:transparent;
    color:var(--pp-blue);
    font-size:12px;
    font-weight:900;
    cursor:pointer;
}
.passport-photo__zoom{display:flex;justify-content:center;gap:8px;margin-top:8px}
.passport-photo__zoom button{
    min-width:52px;
    min-height:44px;
    padding:0 14px;
    border:1px solid var(--pp-line);
    border-radius:9px;
    background:#fff;
    color:var(--pp-blue-dark);
    font-size:20px;
    font-weight:850;
    cursor:pointer;
}
.passport-photo__zoom [data-reset]{font-size:14px}
.passport-photo__legend{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px;margin:10px 0 0;color:var(--pp-muted);font-size:12px}
.passport-photo__key::before{content:"";display:inline-block;width:16px;height:3px;margin-right:6px;vertical-align:middle}
.passport-photo__key--crown::before{background:#14824a}
.passport-photo__key--eyes::before{background:#1976d2}
.passport-photo__key--chin::before{background:#c62828}
.passport-photo__hint{margin:8px 0 0;color:#8a5a00;font-size:13px;line-height:1.45}
.passport-photo__hint:empty{display:none}

.passport-photo__controls{min-width:0;padding:24px 28px 28px;background:linear-gradient(180deg,#f8fbfe 0%,#f4f8fc 100%)}
.passport-photo__controls>.tool-label{
    margin:0 0 10px;
    color:var(--pp-navy);
    font-family:Georgia,"Times New Roman",serif;
    font-size:23px;
    line-height:1.1;
}
.passport-photo__help,
.passport-photo__background{margin:0 0 14px;font-size:14px;line-height:1.55}
.passport-photo__background{color:var(--pp-muted);font-size:13px}
.passport-photo__options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.passport-photo__primary,
.passport-photo__download{
    display:block;
    width:100%;
    min-height:48px;
    padding:10px 16px;
    border:0;
    border-radius:10px;
    background:var(--pp-blue);
    color:#fff;
    font-weight:850;
    cursor:pointer;
}
.passport-photo__primary:hover,
.passport-photo__download:hover{background:var(--pp-blue-dark)}
.passport-photo__result{margin-top:18px}
.passport-photo__outputs{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:end;margin:8px 0 12px}
.passport-photo__outputs figure{margin:0;min-width:0}
.passport-photo__outputs img{display:block;max-width:100%;max-height:200px;border:1px solid var(--pp-line)}
.passport-photo__outputs figcaption{margin-top:6px;color:var(--pp-muted);font-size:12px;line-height:1.4}
.passport-photo__download{margin-top:8px}
.passport-photo__download--secondary{border:1px solid var(--pp-blue);background:#fff;color:var(--pp-blue-dark)}
.passport-photo__download--secondary:hover{background:var(--pp-blue-soft)}
.passport-photo__sheet-note{margin:10px 0 0;color:var(--pp-muted);font-size:13px;line-height:1.5}

@media (max-width:760px){
    .passport-photo__workspace{grid-template-columns:1fr;border-radius:14px}
    .passport-photo__stage-card{padding:12px;border-right:0;border-bottom:1px solid var(--pp-line)}
    .passport-photo__controls{padding:14px}
    .passport-photo__drop{padding:18px 14px}
    .passport-photo__drop strong{font-size:16px}
}