/* 모달 창 */

.modal{
    position:fixed;
    inset:0;

    display:flex;
    justify-content:center;
    align-items:center;

    background: rgba(0,0,0,.25);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);

    z-index:10000;
}

.modal.hidden{
    display: none !important;
}

.modal-box{

    position: relative;

    width:min(420px,90vw);
    min-width:320px;

    background:#fff;

    padding:2rem;

    border-radius:12px;

    display:flex;
    flex-direction:column;
    gap:1rem;

    box-shadow:
        0 10px 40px rgba(0,0,0,.25);
}

.modal-close{

    position:absolute;
    top:0.8rem;
    right:0.8rem;

    border:none;
    background:none;

    font-size:1.5rem;
    line-height:1;

    cursor:pointer;

    color:#666;

}

.modal-close:hover{

    color:#000;

}

.modal-box input{

    padding:.6rem .8rem;
    font-size:1rem;

}

.modal-box button{

    padding:.7rem;
    cursor:pointer;

}

/* auth modal */

.auth-switch{

    margin-top:1rem;

    margin-bottom:.3rem;

    text-align:center;

    font-size:.9rem;

    color:#666;

}

.auth-switch-link{

    display:block;

    text-align:center;

    font-weight:bold;

    text-decoration:none;

}

.auth-switch-link:hover{

    text-decoration:underline;

}

.auth-link{

    color:#ffffff;

    text-decoration:none;

    font-size:.9rem;

}

.auth-link:hover{

    text-decoration:underline;

}

.auth-user{

    color:#ffffff;

    font-size:.9rem;

    font-weight:500;

    white-space:nowrap;

}