/* NI DRIP Central Login Plugin Styles */

/* ======== CSS RESET & THEME OVERRIDE ======== */
/* Ensure our styles override any theme styling */

.ni-drip-login-wrapper,
.ni-drip-login-wrapper *,
.ni-drip-login-wrapper *:before,
.ni-drip-login-wrapper *:after {
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
    background: none !important;
    color: inherit !important;
    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    text-decoration: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    word-spacing: normal !important;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    transition: none !important;
    animation: none !important;
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    /*display: block !important;*/
    float: none !important;
    clear: none !important;
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    z-index: auto !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    text-align: left !important;
    white-space: normal !important;
    word-wrap: normal !important;
    word-break: normal !important;
}

/* Re-apply specific styles that we need */
.ni-drip-login-wrapper input,
.ni-drip-login-wrapper button,
.ni-drip-login-wrapper label,
.ni-drip-login-wrapper a {
    cursor: pointer !important;
}

.ni-drip-login-wrapper button,
.ni-drip-login-wrapper input[type="submit"] {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}

/* Animated neon border setup */
@property --gradient-angle { 
    syntax:"<angle>"; 
    initial-value:0deg; 
    inherits:false; 
}

:root {
    --green: #6afd2e !important;
    --green2: #20f844 !important;
    --red: #fd2153 !important;
    --mag: #fd23d4 !important;
    --black: #000000 !important;
    --white: #ffffff !important;
}

.ni-drip-login-wrapper {
    font-family: Inter, system-ui, Arial, sans-serif !important;
    position: relative !important;
    min-height: 100vh !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 0 !important;
    background: linear-gradient(135deg, var(--red), var(--mag) 40%, var(--green2) 100%) !important;
    background-attachment: fixed !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

.ni-drip-login-wrapper .ni-drip-page {
    min-height: 100vh !important;
    width: 100% !important;
    display: grid !important;
    place-items: center !important;
    padding: 16px !important;
    position: relative !important;
    z-index: 0 !important;
    box-sizing: border-box !important;
}

/* ======== Visible background squares (brand-colored) ======== */
.ni-drip-login-wrapper .bg-squares {
    position: fixed !important; 
    inset: 0 !important; 
    z-index: 0 !important; 
    pointer-events: none !important; 
    overflow: hidden !important;
}

.ni-drip-login-wrapper .sq {
    position: absolute !important;
    border-radius: 32px !important;
    transform: rotate(var(--rot, 18deg)) !important;
    filter: blur(var(--blur, 6px)) !important;
    opacity: var(--o, .55) !important;
    box-shadow: 0 10px 40px rgba(0,0,0,.18),
                inset 0 0 0 1px rgba(255,255,255,.08) !important;
    background: linear-gradient(135deg,
        var(--from, rgba(255,255,255,.22)),
        var(--to, rgba(255,255,255,.10))
    ) !important;
    mix-blend-mode: overlay !important;
}

/* --- Positions and brand color tones --- */
.ni-drip-login-wrapper .sq.tl {
    width: 40vmin !important; 
    height: 40vmin !important;
    left: -8vmin !important; 
    top: 6vmin !important;
    --rot: -15deg !important;
    --from: rgba(253,35,212,.4) !important; 
    --to: rgba(255,255,255,.15) !important;
}

.ni-drip-login-wrapper .sq.tr {
    width: 60vmin !important; 
    height: 60vmin !important;
    right: -16vmin !important; 
    top: -10vmin !important;
    --rot: 25deg !important;
    --from: rgba(253,33,83,.35) !important; 
    --to: rgba(253,35,212,.2) !important;
}

.ni-drip-login-wrapper .sq.midL {
    width: 32vmin !important; 
    height: 32vmin !important;
    left: 4vmin !important; 
    top: 46vh !important;
    --rot: -12deg !important;
    --from: rgba(32,248,68,.35) !important; 
    --to: rgba(255,255,255,.2) !important;
}

.ni-drip-login-wrapper .sq.bc {
    width: 44vmin !important; 
    height: 44vmin !important;
    left: 45% !important; 
    bottom: -10vmin !important;
    transform: translateX(-50%) rotate(14deg) !important;
    --from: rgba(106,253,46,.35) !important; 
    --to: rgba(255,255,255,.15) !important;
}

.ni-drip-login-wrapper .sq.br {
    width: 48vmin !important; 
    height: 48vmin !important;
    right: -10vmin !important; 
    bottom: -10vmin !important;
    --rot: 18deg !important;
    --from: rgba(253,33,83,.35) !important; 
    --to: rgba(255,255,255,.15) !important;
}

@media (max-width: 640px) {
    .sq { 
        opacity: .45; 
        filter: blur(4px); 
    }
    .sq.tr { 
        width: 70vmin; 
        height: 70vmin; 
        right: -25vmin; 
        top: -12vmin; 
    }
    .sq.tl { 
        left: -12vmin; 
        top: 4vmin; 
    }
}

/* ======== Animated neon border wrapper ======== */
.ni-drip-login-wrapper .card-border {
    position: relative !important;
    border-radius: 22px !important;
    padding: 4px !important;
    isolation: isolate !important;
    width: 100% !important;
    max-width: 420px !important;
    min-width: 320px !important;
    z-index: 1 !important;
    margin: 0 auto !important;
}

.ni-drip-login-wrapper .card-border::before,
.ni-drip-login-wrapper .card-border::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    border-radius: inherit !important;
    background: conic-gradient(
        from var(--gradient-angle),
        var(--green),
        var(--red),
        var(--mag),
        var(--green)
    ) !important;
    animation: rotate 4.5s linear infinite !important;
    z-index: -1 !important;
}

.ni-drip-login-wrapper .card-border::after {
    filter: blur(46px) brightness(1.9) saturate(190%) !important;
    opacity: .68 !important;
    transform: scale(1.08) !important;
}

.ni-drip-login-wrapper .card-border::before {
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important;
    mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0) !important;
    -webkit-mask-composite: xor !important; 
    mask-composite: exclude !important;
    padding: 4px !important;
}

@keyframes rotate { 
    to { 
        --gradient-angle: 360deg; 
    } 
}

/* ======== Card ======== */
.ni-drip-login-wrapper .card {
    width: 100% !important;
    border-radius: 18px !important;
    background:
        radial-gradient(1000px 800px at 100% 0%, rgba(253,35,212,.20), transparent 60%),
        radial-gradient(1000px 800px at 0% 100%, rgba(106,253,46,.20), transparent 60%),
        linear-gradient(135deg,rgba(0,0,0,.97),rgba(0,0,0,.92)) !important;
    backdrop-filter: blur(18px) !important;
    border: 1px solid rgba(255,255,255,.06) !important;
    box-shadow: 0 25px 60px rgba(0,0,0,.55) !important;
    color: #fff !important;
    padding: clamp(18px, 4vw, 26px) !important;
}

/* ======== Header ======== */
.ni-drip-login-wrapper .login-header {
    text-align: center !important;
    margin-bottom: 1.5rem !important;
}

.ni-drip-login-wrapper .logo-container {
    margin: 0 auto !important;
    width: 50% !important;
    height: 6rem !important;
    display: grid !important;
    place-items: center !important;
}

.ni-drip-login-wrapper .logo-container-small {
    margin: 0 auto !important;
    width: 4rem !important;
    height: 4rem !important;
    border-radius: 1rem !important;
    display: grid !important;
    place-items: center !important;
    background: rgba(0,0,0,0.7) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    overflow: hidden !important;
}

.ni-drip-login-wrapper .logo-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

.ni-drip-login-wrapper .login-title {
    margin-top: 0.75rem !important;
    font-size: clamp(1.5rem, 4vw, 1.875rem) !important;
    font-weight: 800 !important;
    color: #fff !important;
    text-align: center !important;
}

.ni-drip-login-wrapper .login-subtitle {
    font-size: 0.875rem !important;
    color: rgba(255,255,255,0.7) !important;
    margin-top: 0.25rem !important;
    text-align: center !important;
}

/* ======== Form ======== */
.ni-drip-login-wrapper .ni-drip-login-form {
    display: flex !important;
    flex-direction: column !important;
    gap: 1rem !important;
}

.ni-drip-login-wrapper .input-group {
    position: relative !important;
}

.ni-drip-login-wrapper .input-label {
    /*display: block !important;*/
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    color: rgba(255,255,255,0.85) !important;
    margin-bottom: 0.25rem !important;
}

.ni-drip-login-wrapper .input {
    width: 100% !important; 
    border: none !important; 
    border-radius: 14px !important;
    padding: 12px 14px !important; 
    background: rgba(255,255,255,.08) !important; 
    color: #fff !important;
    backdrop-filter: blur(14px) !important;
    transition: .25s !important;
    box-shadow: inset 0 0 8px rgba(255,255,255,.08), 0 2px 8px rgba(0,0,0,.1) !important;
    font-size: 1rem !important;
    font-family: Inter, system-ui, Arial, sans-serif !important;
}

.ni-drip-login-wrapper .input::placeholder { 
    color: rgba(255,255,255,.6) !important; 
}

.ni-drip-login-wrapper .input:focus {
    outline: none !important;
    background: rgba(255,255,255,.18) !important;
    box-shadow: inset 0 0 12px rgba(255,255,255,.15), 0 0 0 3px rgba(106,253,46,.25) !important;
}

.ni-drip-login-wrapper .password-group {
    position: relative !important;
}

.ni-drip-login-wrapper .password-input {
    padding-right: 4rem !important;
}

.ni-drip-login-wrapper .password-toggle {
    position: absolute !important;
    right: 1rem !important;
    top: 58% !important;
    transform: translateY(-50%) !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    color: rgba(255,255,255,0.75) !important;
    cursor: pointer !important;
    user-select: none !important;
    transition: color 0.2s !important;
}

.ni-drip-login-wrapper .password-toggle:hover {
    color: rgba(255,255,255,0.9) !important;
}

/* ======== Form Options ======== */
.ni-drip-login-wrapper .form-options {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    font-size: 0.875rem !important;
    flex-wrap: wrap !important;
    gap: 0.5rem !important;
}

.ni-drip-login-wrapper .remember-me {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    cursor: pointer !important;
}

.ni-drip-login-wrapper .remember-checkbox {
    accent-color: var(--green) !important;
}

.ni-drip-login-wrapper .remember-text {
    color: rgba(255,255,255,0.85) !important;
}

.ni-drip-login-wrapper .forgot-password {
    font-weight: 600 !important;
    color: var(--green) !important;
    text-decoration: none !important;
    transition: opacity 0.2s !important;
}

.ni-drip-login-wrapper .forgot-password:hover {
    opacity: 0.9 !important;
    color: var(--green) !important;
}

/* ======== Button ======== */
.ni-drip-login-wrapper .btn-primary {
    width: 100% !important;
    margin-top: 0.75rem !important;
    background: linear-gradient(90deg, var(--red), var(--mag) 40%, var(--green2)) !important;
    color: #000 !important; 
    font-weight: 800 !important;
    border-radius: 14px !important; 
    padding: 12px 0 !important;
    box-shadow: 0 0 20px rgba(106,253,46,.25) !important;
    transition: .25s !important;
    border: none !important;
    cursor: pointer !important;
    font-size: 1rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    position: relative !important;
    font-family: Inter, system-ui, Arial, sans-serif !important;
}

.ni-drip-login-wrapper .btn-primary:hover { 
    filter: brightness(1.08) !important; 
}

.ni-drip-login-wrapper .btn-primary:disabled {
    opacity: 0.7 !important;
    cursor: not-allowed !important;
}

.ni-drip-login-wrapper .btn-spinner svg {
    animation: spin 1s linear infinite !important;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* ======== Footer ======== */
.ni-drip-login-wrapper .login-footer {
    margin-top: 1.5rem !important;
    text-align: center !important;
    font-size: 0.875rem !important;
    color: rgba(255,255,255,0.8) !important;
    display: inline-block !important;
    white-space: nowrap !important;
}

.ni-drip-login-wrapper .signup-link {
    font-weight: 600 !important;
    color: var(--green) !important;
    text-decoration: none !important;
    transition: opacity 0.2s !important;
}

.ni-drip-login-wrapper .signup-link:hover {
    opacity: 0.9 !important;
    color: var(--green) !important;
}

/* ======== Messages ======== */
.ni-drip-login-wrapper .login-messages {
    margin-bottom: 1rem !important;
    border-radius: 8px !important;
    padding: 0.75rem !important;
    font-size: 0.875rem !important;
}

.ni-drip-login-wrapper .login-messages.success {
    background-color: rgba(34, 197, 94, 0.1) !important;
    border: 1px solid rgba(34, 197, 94, 0.2) !important;
    color: #22c55e !important;
}

.ni-drip-login-wrapper .login-messages.error {
    background-color: rgba(239, 68, 68, 0.1) !important;
    border: 1px solid rgba(239, 68, 68, 0.2) !important;
    color: #ef4444 !important;
}

.ni-drip-login-wrapper .message-content {
    font-weight: 500 !important;
}

/* ======== Already logged in ======== */
.ni-drip-login-wrapper .ni-drip-already-logged-in {
    text-align: center !important;
    padding: 2rem !important;
    background: rgba(0,0,0,0.1) !important;
    border-radius: 12px !important;
    color: #333 !important;
}

.ni-drip-login-wrapper .ni-drip-already-logged-in p {
    margin: 0 !important;
    font-size: 1rem !important;
}

.ni-drip-login-wrapper .ni-drip-already-logged-in a {
    color: var(--green) !important;
    text-decoration: none !important;
    font-weight: 600 !important;
}

.ni-drip-login-wrapper .ni-drip-already-logged-in a:hover {
    text-decoration: underline !important;
    color: var(--green) !important;
}

/* ======== Responsive ======== */
@media (max-width: 480px) {
    .ni-drip-login-wrapper .form-options {
        flex-direction: column !important;
        align-items: stretch !important;
        text-align: center !important;
    }
    
    .ni-drip-login-wrapper .forgot-password {
        margin-top: 0.5rem !important;
    }
    
    .ni-drip-login-wrapper .ni-drip-page {
        padding: 12px !important;
    }
    
    .ni-drip-login-wrapper .card-border {
        min-width: 280px !important;
    }
}

/* ======== Full width integration ======== */
body.ni-drip-full-width {
    margin: 0 !important;
    padding: 0 !important;
}

.ni-drip-full-width .ni-drip-login-wrapper {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 9999 !important;
}

/* Override theme styles that might interfere */
.ni-drip-login-wrapper * {
    box-sizing: border-box !important;
}

.ni-drip-login-wrapper .card {
    isolation: isolate !important;
}

/* ======== Additional overrides for common theme conflicts ======== */
.ni-drip-login-wrapper h1,
.ni-drip-login-wrapper h2,
.ni-drip-login-wrapper h3,
.ni-drip-login-wrapper h4,
.ni-drip-login-wrapper h5,
.ni-drip-login-wrapper h6 {
    margin: 0 !important;
    padding: 0 !important;
    font-family: Inter, system-ui, Arial, sans-serif !important;
    line-height: 1.2 !important;
}

.ni-drip-login-wrapper p {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.4 !important;
}

.ni-drip-login-wrapper form {
    margin: 0 !important;
    padding: 0 !important;
}

.ni-drip-login-wrapper input,
.ni-drip-login-wrapper button {
    font-family: Inter, system-ui, Arial, sans-serif !important;
    line-height: normal !important;
}

.ni-drip-login-wrapper a {
    text-decoration: none !important;
}

.ni-drip-login-wrapper a:visited {
    color: inherit !important;
}

/* Prevent theme button styles from interfering */
.ni-drip-login-wrapper button.btn-primary {
    background: linear-gradient(90deg, var(--red), var(--mag) 40%, var(--green2)) !important;
    color: #000 !important;
    border: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    font-style: normal !important;
}

/* Prevent theme input styles from interfering */
.ni-drip-login-wrapper input.input {
    background: rgba(255,255,255,.08) !important;
    color: #fff !important;
    border: none !important;
    box-shadow: inset 0 0 8px rgba(255,255,255,.08), 0 2px 8px rgba(0,0,0,.1) !important;
}

.ni-drip-login-wrapper input.input:focus {
    background: rgba(255,255,255,.18) !important;
    box-shadow: inset 0 0 12px rgba(255,255,255,.15), 0 0 0 3px rgba(106,253,46,.25) !important;
    border: none !important;
}

/* ======== SIGNUP PAGE STYLES ======== */

/* Signup wrapper - full screen layout */
.ni-drip-signup-wrapper {
    font-family: Inter, system-ui, Arial, sans-serif !important;
    position: relative !important;
    min-height: 100vh !important;
    width: 100vw !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #000 !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

/* Main shell container */
.ni-drip-signup-wrapper .signup-shell {
    width: 100% !important;
    min-height: 100vh !important;
}

/* Two-column row layout */
.ni-drip-signup-wrapper .signup-row {
    width: 100% !important;
    display: flex !important;
    min-height: 100vh !important;
}

/* Left side (60% width) */
.ni-drip-signup-wrapper .signup-left {
    width: 60% !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Right side (40% width) */
.ni-drip-signup-wrapper .signup-right {
    width: 40% !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    background:
        radial-gradient(1000px 800px at 100% 0%, rgba(253,35,212,.22), transparent 60%),
        radial-gradient(1000px 800px at 0% 100%, rgba(106,253,46,.22), transparent 60%),
        linear-gradient(135deg, rgba(0,0,0,1) 0%, rgba(0,0,0,.92) 35%, rgba(0,0,0,.88) 70%, rgba(0,0,0,1) 100%) !important;
}

/* Responsive: stack on tablets/phones */
@media (max-width: 1024px) {
    .ni-drip-signup-wrapper .signup-row {
        flex-direction: column !important;
    }
    .ni-drip-signup-wrapper .signup-left,
    .ni-drip-signup-wrapper .signup-right {
        width: 100% !important;
    }
}

/* Left background image */
.ni-drip-signup-wrapper .signup-bg-img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    filter: saturate(110%) contrast(104%) !important;
}

/* Left overlay */
.ni-drip-signup-wrapper .signup-left::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(135deg,
        rgba(253,33,83,.55),
        rgba(253,35,212,.52) 40%,
        rgba(106,253,46,.55) 100%) !important;
}

/* Vertical animated divider */
.ni-drip-signup-wrapper .signup-divider {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    right: 0 !important;
    width: 10px !important;
    z-index: 2 !important;
    background: linear-gradient(180deg, var(--green), var(--mag) 55%, var(--red)) !important;
    background-size: 100% 200% !important;
    animation: slideY 3s linear infinite !important;
}

.ni-drip-signup-wrapper .signup-divider::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    transform: translateX(3px) scaleX(2) !important;
    filter: blur(18px) brightness(1.35) saturate(130%) !important;
    background: inherit !important;
    background-size: 100% 200% !important;
    animation: slideY 3s linear infinite !important;
    opacity: .78 !important;
    pointer-events: none !important;
}

@keyframes slideY {
    0% { background-position: 0% 0% !important; }
    100% { background-position: 0% 100% !important; }
}

@media (max-width: 1024px) {
    .ni-drip-signup-wrapper .signup-divider {
        display: none !important;
    }
}

/* Form area */
.ni-drip-signup-wrapper .signup-form-area {
    width: min(640px, 92vw) !important;
    margin: 0 auto !important;
    padding: clamp(24px, 6vw, 56px) !important;
    color: #fff !important;
}

/* Header */
.ni-drip-signup-wrapper .signup-header {
    text-align: center !important;
    margin-bottom: 24px !important;
}

.ni-drip-signup-wrapper .signup-logo-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 8px !important;
}

.ni-drip-signup-wrapper .signup-logo-img {
    width: 100% !important;
    max-width: 300px !important;
    height: auto !important;
    object-fit: contain !important;
}

.ni-drip-signup-wrapper .signup-headline {
    text-align: center !important;
    font-weight: 800 !important;
    font-size: clamp(26px, 3.2vw, 36px) !important;
    margin: 0 !important;
    color: #fff !important;
}

/* Form fields */
.ni-drip-signup-wrapper .signup-form {
    display: flex !important;
    flex-direction: column !important;
}

.ni-drip-signup-wrapper .signup-field {
    margin-bottom: 14px !important;
    position: relative !important;
}

.ni-drip-signup-wrapper .signup-label {
    color: #c7cbd1 !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    display: block !important;
    margin-bottom: 4px !important;
}

.ni-drip-signup-wrapper .signup-input {
    width: 100% !important;
    border: 1px solid var(--green) !important;
    border-radius: 14px !important;
    padding: 12px 14px !important;
    background: rgba(255,255,255,.08) !important;
    color: #fff !important;
    backdrop-filter: blur(14px) !important;
    box-shadow: inset 0 0 8px rgba(255,255,255,.08), 0 2px 8px rgba(0,0,0,.1) !important;
    transition: .25s !important;
    font-family: Inter, system-ui, Arial, sans-serif !important;
    font-size: 16px !important;
    box-sizing: border-box !important;
}

.ni-drip-signup-wrapper .signup-input::placeholder {
    color: rgba(255,255,255,.62) !important;
}

.ni-drip-signup-wrapper .signup-input:focus {
    outline: none !important;
    background: rgba(255,255,255,.18) !important;
    box-shadow: inset 0 0 12px rgba(255,255,255,.15), 0 0 0 3px rgba(106,253,46,.25) !important;
}

/* Password fields */
.ni-drip-signup-wrapper .signup-password-group .signup-input {
    padding-right: 60px !important;
}

.ni-drip-signup-wrapper .signup-password-toggle {
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    color: rgba(255,255,255,.75) !important;
    cursor: pointer !important;
    user-select: none !important;
    margin-top: 8px !important;
}

.ni-drip-signup-wrapper .signup-password-toggle:hover {
    color: rgba(255,255,255,.9) !important;
}

/* Terms checkbox */
.ni-drip-signup-wrapper .signup-terms {
    margin: 16px 0 !important;
}

.ni-drip-signup-wrapper .signup-terms-label {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    font-size: 14px !important;
    cursor: pointer !important;
}

.ni-drip-signup-wrapper .signup-terms-checkbox {
    accent-color: var(--green) !important;
    width: 16px !important;
    height: 16px !important;
}

.ni-drip-signup-wrapper .signup-terms-text {
    color: #d1d5db !important;
}

.ni-drip-signup-wrapper .signup-terms-link {
    color: var(--green) !important;
    text-decoration: underline !important;
    text-decoration-style: dotted !important;
}

.ni-drip-signup-wrapper .signup-terms-link:hover {
    opacity: 0.9 !important;
    color: var(--green) !important;
}

/* Actions row */
.ni-drip-signup-wrapper .signup-actions {
    margin-top: 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 24px !important;
}

/* Signup button */
.ni-drip-signup-wrapper .signup-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: clamp(200px, 42%, 320px) !important;
    padding: 12px 18px !important;
    border-radius: 999px !important;
    font-weight: 800 !important;
    letter-spacing: .3px !important;
    background: linear-gradient(90deg, var(--red), var(--mag) 55%, var(--green2)) !important;
    color: #000 !important;
    box-shadow: 0 10px 28px rgba(106,253,46,.20) !important;
    transition: .25s !important;
    border: none !important;
    cursor: pointer !important;
    font-family: Inter, system-ui, Arial, sans-serif !important;
    font-size: 16px !important;
    gap: 8px !important;
}

.ni-drip-signup-wrapper .signup-btn:hover {
    filter: brightness(1.08) !important;
}

.ni-drip-signup-wrapper .signup-btn:disabled {
    opacity: 0.7 !important;
    cursor: not-allowed !important;
}

.ni-drip-signup-wrapper .signup-btn-spinner svg {
    animation: spin 1s linear infinite !important;
}

/* Sign in link */
.ni-drip-signup-wrapper .signup-signin-link {
    color: #e5e7eb !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: opacity 0.2s !important;
}

.ni-drip-signup-wrapper .signup-signin-link:hover {
    opacity: 0.9 !important;
    color: #e5e7eb !important;
}

/* Messages */
.ni-drip-signup-wrapper .signup-messages {
    margin-bottom: 16px !important;
    border-radius: 8px !important;
    padding: 12px !important;
    font-size: 14px !important;
}

.ni-drip-signup-wrapper .signup-messages.success {
    background-color: rgba(34, 197, 94, 0.1) !important;
    border: 1px solid rgba(34, 197, 94, 0.2) !important;
    color: #22c55e !important;
}

.ni-drip-signup-wrapper .signup-messages.error {
    background-color: rgba(239, 68, 68, 0.1) !important;
    border: 1px solid rgba(239, 68, 68, 0.2) !important;
    color: #ef4444 !important;
}

.ni-drip-signup-wrapper .message-content {
    font-weight: 500 !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .ni-drip-signup-wrapper .signup-actions {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 16px !important;
    }
    
    .ni-drip-signup-wrapper .signup-btn {
        width: 100% !important;
    }
    
    .ni-drip-signup-wrapper .signup-signin-link {
        text-align: center !important;
    }
    
    .ni-drip-signup-wrapper .signup-form-area {
        padding: clamp(16px, 4vw, 32px) !important;
    }
}

/* Full width integration for signup */
body.ni-drip-full-width .ni-drip-signup-wrapper {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 9999 !important;
}