.e-passport-wrap{
    --pp-bg:#fff;
    --pp-fg:#1f2937;
    --pp-border:#d0d5dd;
    --pp-radius:.5rem;
    --pp-focus:0 0 0 .2rem rgba(13,110,253,.18);
    position:relative;
    display:block;
    max-width:100%;
    color:var(--pp-fg);
}

.e-passport-wrap .e-pp-btn{
    position:absolute;
    inset:0 auto 0 0;
    display:flex;
    align-items:center;
    gap:.5rem;
    padding:0 .6rem 0 .55rem;
    background:transparent;
    border:0;
    border-radius:var(--pp-radius) 0 0 var(--pp-radius);
    cursor:pointer;
    user-select:none;
    color:var(--pp-fg);
}

.e-passport-wrap .e-pp-btn::after{
    content:"";
    position:absolute;
    right:0; top:8px; bottom:8px;
    width:1px; background:var(--pp-border);
}

.e-pp-flag{ width:16px; height:15px; border-radius:2px; flex:0 0 auto; }
.e-pp-code{ font-weight:600; font-size:.95rem; letter-spacing:.02em; }
.e-pp-caret{ opacity:.7; font-size:.9rem; line-height:1; }

.e-passport-wrap .e-pp-input{
    width:100%;
    background:var(--pp-bg);
    color:var(--pp-fg);
    border:1px solid var(--pp-border);
    border-radius:var(--pp-radius);
    padding:.5rem .75rem;
    min-height:42px;
}

.e-passport-wrap:focus-within .e-pp-input{
    border-color:#86b7fe;
    box-shadow:var(--pp-focus);
}
.e-passport-wrap:focus-within .e-pp-btn::after{ background:#86b7fe66; }

.e-passport-wrap .e-pp-menu{
    position:absolute;
    left:0; top:calc(100% + 4px);
    min-width:260px;
    background:var(--pp-bg);
    border:1px solid var(--pp-border);
    border-radius:.5rem;
    box-shadow:0 12px 28px rgba(16,24,40,.18);
    z-index:1050;
    max-height:320px;
    overflow:auto;
    padding:.25rem;
}
.e-passport-wrap .e-pp-item{
    width:100%;
    display:flex;
    align-items:center;
    gap:.5rem;
    padding:.5rem .5rem;
    border:0; background:transparent;
    cursor:pointer; border-radius:.4rem;
    text-align:left; min-height:44px; color:var(--pp-fg);
}
.e-passport-wrap .e-pp-item:hover,
.e-passport-wrap .e-pp-item:focus{ background:#f2f5f9; outline:0; }

.e-passport-wrap .e-pp-input.is-invalid{
    border-color:#dc3545;
    box-shadow:0 0 0 .2rem rgba(220,53,69,.12);
}
.e-passport-wrap .e-pp-btn:disabled,
.e-passport-wrap .e-pp-input:disabled{
    background:#f3f4f6; color:#9ca3af; cursor:not-allowed; box-shadow:none;
}

@media (max-width:576px){
    .e-passport-wrap .e-pp-input{ min-height:46px; font-size:16px }
    .e-passport-wrap .e-pp-item{ min-height:48px }
}