
/* =========================================================
   BUILT-IN WORD CAPTCHA — CAPTCHA-CODE VISUAL
   ========================================================= */
.captcha-code-widget{
    width:100%;
    max-width:360px;
}

.captcha-code-box{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:86px;
    padding:14px 18px;
    overflow:hidden;
    border:1px solid #b8cbe0;
    border-radius:12px;
    background:
        repeating-linear-gradient(
            135deg,
            rgba(13,79,140,.05) 0,
            rgba(13,79,140,.05) 8px,
            rgba(255,255,255,.9) 8px,
            rgba(255,255,255,.9) 16px
        ),
        linear-gradient(135deg,#f7fbff,#eaf3fb);
    box-shadow:
        inset 0 0 24px rgba(15,68,120,.08),
        0 4px 14px rgba(20,70,120,.06);
    user-select:none;
    -webkit-user-select:none;
}

.captcha-code-box::before,
.captcha-code-box::after{
    content:"";
    position:absolute;
    left:-8%;
    width:116%;
    height:2px;
    background:rgba(21,78,132,.42);
    transform-origin:center;
    pointer-events:none;
}

.captcha-code-box::before{
    top:34%;
    transform:rotate(-7deg);
}

.captcha-code-box::after{
    top:68%;
    transform:rotate(6deg);
}

.captcha-code-text{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.12em;
    font-family:"Courier New",Consolas,monospace;
    font-size:clamp(1.55rem,6vw,2rem);
    font-weight:800;
    letter-spacing:.08em;
    color:#0b3d72;
    text-shadow:
        1px 1px 0 rgba(255,255,255,.9),
        -1px -1px 0 rgba(20,60,100,.12);
}

.captcha-char{
    display:inline-block;
    min-width:.7em;
    text-align:center;
    transform-origin:center;
}

.captcha-char-1{transform:rotate(-9deg) translateY(2px) skewX(-4deg);}
.captcha-char-2{transform:rotate(7deg) translateY(-2px) scaleY(1.05);}
.captcha-char-3{transform:rotate(-4deg) translateY(1px) skewX(5deg);}
.captcha-char-4{transform:rotate(10deg) translateY(-1px) scaleX(.96);}
.captcha-char-5{transform:rotate(-7deg) translateY(2px) scaleY(.98);}
.captcha-char-6{transform:rotate(5deg) translateY(-2px) skewX(-3deg);}

.captcha-noise{
    position:absolute;
    z-index:1;
    display:block;
    border-radius:50%;
    border:2px solid rgba(18,91,155,.18);
    pointer-events:none;
}

.captcha-noise-one{
    width:56px;
    height:20px;
    top:11px;
    left:14%;
    transform:rotate(18deg);
}

.captcha-noise-two{
    width:72px;
    height:26px;
    right:8%;
    bottom:9px;
    transform:rotate(-13deg);
}

.captcha-noise-three{
    width:34px;
    height:34px;
    left:47%;
    top:24%;
    border-style:dashed;
    opacity:.7;
}

.captcha-code-widget .form-control{
    min-height:48px;
    border-radius:10px;
    font-weight:600;
    letter-spacing:.06em;
    text-transform:uppercase;
}

@media(max-width:575.98px){
    .captcha-code-widget{
        max-width:100%;
    }

    .captcha-code-box{
        min-height:78px;
    }

    .captcha-code-text{
        font-size:1.55rem;
    }
}
