/* Auth pages — styled to match platform palette (2026-03-19) */

/* Main card container */
.auth .card {
    background: #18181B !important;
    border: none !important;
    border-radius: 8px !important;
}

/* Auth logo — scoped to .auth pages only */

/* Position card towards top, not dead centre */
.auth .nk-block-middle {
    margin-top: 8vh !important;
    margin-bottom: 0 !important;
}

/* Headings */
.auth .nk-block-title {
    font-family: 'Figtree', sans-serif !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    color: #EDEDED !important;
}

/* Body text */
.auth .card-inner {
    font-family: 'Satoshi Variable', 'Satoshi', sans-serif !important;
}

/* Form labels */
.auth .form-label {
    font-family: 'Satoshi Variable', 'Satoshi', sans-serif !important;
    color: #C9C9C9 !important;
    font-size: 0.8125rem !important;
    letter-spacing: 0.03em !important;
    cursor: default !important;
}

/* Form inputs */
.auth .form-control {
    background: #242427 !important;
    border: 1px solid #464649 !important;
    border-radius: 8px !important;
    color: #fff !important;
    font-family: 'Satoshi Variable', 'Satoshi', sans-serif !important;
    letter-spacing: 0.03em !important;
}
.auth .form-control:focus {
    border-color: #5B8060 !important;
    box-shadow: none !important;
}
.auth .form-control::placeholder {
    color: #7E7E7E !important;
}

/* Landing page option cards */
.cx-links--card {
    background: #242427 !important;
    border: 1px solid #3C3C3C !important;
    border-radius: 8px !important;
    padding: 1.25rem 1.5rem !important;
    margin-bottom: 0 !important;
    min-height: 80px !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    width: 100% !important;
}
.cx-links--card:hover {
    border-color: #5B8060 !important;
    background: #2a2a2c !important;
    transform: translateY(-1px) !important;
}
.cx-links--card .cx-links--icon {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    background: #3C3C3C;
    border: 1px solid #464649;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.cx-links--card .cx-links--icon em {
    font-size: 1.25rem;
    color: #EDEDED;
}
.cx-links--card_title {
    font-family: 'Figtree', sans-serif !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    color: #EDEDED !important;
    margin-bottom: 0.25rem !important;
}
.cx-links--card_description {
    font-family: 'Satoshi Variable', 'Satoshi', sans-serif !important;
    font-size: 0.8125rem !important;
    color: #B5B5B5 !important;
    letter-spacing: 0.03em !important;
}

/* Overline title separator */
.auth .overline-title-sap span {
    font-family: 'Satoshi Variable', 'Satoshi', sans-serif !important;
    letter-spacing: 0.06em !important;
    color: #7E7E7E !important;
    font-size: 0.75rem !important;
}
.auth .overline-title-sap::before,
.auth .overline-title-sap::after {
    background: #3C3C3C !important;
}

/* Sign in / Sign up button */
.auth .btn-light,
.auth .btn-dark {
    background: linear-gradient(90deg, #DA5B57 0%, #DB5297 100%) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 100px !important;
    font-family: 'Satoshi Variable', 'Satoshi', sans-serif !important;
    font-weight: 500 !important;
    letter-spacing: 0.03em !important;
}
.auth .btn-light:hover,
.auth .btn-dark:hover {
    opacity: 0.9 !important;
}

/* Social login icons */
.auth .nav .nav-item a {
    background: #282828 !important;
    border: 1px solid #3C3C3C !important;
    border-radius: 8px !important;
    padding: 0.625rem 1rem !important;
    transition: all 0.15s ease !important;
}
.auth .nav .nav-item a:hover {
    border-color: #5B8060 !important;
    background: #353535 !important;
}

/* Links */
.auth a.text-white:hover {
    color: #5B8060 !important;
}

/* Error alerts */
.auth .alert-danger {
    background: #332020 !important;
    border: 1px solid rgba(192, 98, 93, 0.3) !important;
    border-left: 4px solid #C0625D !important;
    border-radius: 8px !important;
    color: #C9C9C9 !important;
}

/* Success alerts */
.auth .alert-success {
    background: #1e2e25 !important;
    border: 1px solid rgba(91, 128, 96, 0.3) !important;
    border-left: 4px solid #5B8060 !important;
    border-radius: 8px !important;
    color: #C9C9C9 !important;
}

/* Text muted */
.auth .text-muted {
    color: #B5B5B5 !important;
}

/* Passcode toggle icon */
.auth .passcode-switch .icon {
    color: #7E7E7E !important;
}
.auth .passcode-switch:hover .icon {
    color: #EDEDED !important;
}

/* Select dropdown */
.auth select.form-control {
    background: #242427 !important;
    border: 1px solid #464649 !important;
    color: #C9C9C9 !important;
    -webkit-appearance: none !important;
}

/* Checkboxes — green border, white tick */
.auth .custom-control-pro.checked .custom-control-label,
.auth .custom-control-input:checked ~ .custom-control-label {
    border-color: #5B8060 !important;
}
.auth .custom-control-input:checked ~ .custom-control-label::before {
    border-color: #5B8060 !important;
    background-color: #000 !important;
}
.auth .custom-control-input:checked ~ .custom-control-label::after {
    color: #fff !important;
}
.auth .custom-control-label {
    cursor: pointer !important;
    font-size: 0.8125rem !important;
    color: #C9C9C9 !important;
    font-family: 'Satoshi Variable', 'Satoshi', sans-serif !important;
    letter-spacing: 0.03em !important;
}


/* Bottom link text */
.auth .form-note-s2 a {
    font-family: 'Satoshi Variable', 'Satoshi', sans-serif !important;
    letter-spacing: 0.03em !important;
}

/* ============================== */
/* MOBILE RESPONSIVE              */
/* ============================== */

/* Tablet and below (768px) */
@media (max-width: 768px) {
    .auth .nk-block-middle {
        margin-top: 2rem !important;
        padding: 0 1rem !important;
    }
    .auth .card {
        border-radius: 8px !important;
    }
    .auth .card-inner-lg {
        padding: 1.5rem !important;
    }
    .auth .nk-block-title {
        font-size: 1.25rem !important;
    }
    .cx-links--card {
        padding: 1rem 1.25rem !important;
    }
    .cx-links--icon {
        width: 40px !important;
        height: 40px !important;
    }
    .cx-links--icon em {
        font-size: 1.125rem !important;
    }
    .cx-links--card_title {
        font-size: 0.9375rem !important;
    }
    .cx-links--card_description {
        font-size: 0.75rem !important;
    }
}

/* Mobile (480px and below) */
@media (max-width: 480px) {
    .auth .nk-app-root,
    .auth .nk-main,
    .auth .nk-wrap,
    .auth .nk-content {
        background: #1A1A1A !important;
        background-image: none !important;
    }
    .auth .nk-auth-body {
        max-width: 100% !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    .auth .nk-block-middle {
        margin-top: 0 !important;
        padding: 0 !important;
    }
    .auth .card {
        border-radius: 0 !important;
        border: none !important;
        background: #1A1A1A !important;
    }
    .auth .card-inner-lg {
        padding: 1.25rem 1rem !important;
    }
    .auth .nk-block-title {
        font-size: 1.125rem !important;
    }
    /* Logo scales down */
    .auth .logo-link img {
        width: 160px !important;
    }
    /* Landing page option cards — tighter layout */
    .cx-links--card {
        padding: 0.875rem 1rem !important;
        gap: 0.75rem !important;
    }
    .cx-links--icon {
        width: 36px !important;
        height: 36px !important;
    }
    .cx-links--icon em {
        font-size: 1rem !important;
    }
    .cx-links--card_title {
        font-size: 0.875rem !important;
    }
    .cx-links--card_description {
        font-size: 0.6875rem !important;
    }
    /* Social login buttons — adjust padding for mobile centering */
    .auth .cx-social-btn {
        padding-left: 25% !important;
        font-size: 0.8125rem !important;
    }
    /* Form inputs — slightly smaller padding */
    .auth .form-control,
    .auth input[type="text"],
    .auth input[type="email"],
    .auth input[type="password"],
    .auth input[type="tel"] {
        padding: 0.5rem 0.75rem !important;
        font-size: 0.8125rem !important;
    }
    /* Buttons */
    .auth button[type="submit"],
    .auth .btn-light,
    .auth .btn-dark {
        padding: 0.625rem !important;
        font-size: 0.875rem !important;
    }
    /* Footer links — stack vertically on very small screens */
    .auth .cx-footer-links {
        flex-direction: column !important;
        align-items: center !important;
        gap: 0.5rem !important;
    }
}

/* Small mobile (360px and below) */
@media (max-width: 360px) {
    .auth .card-inner-lg {
        padding: 1rem 0.75rem !important;
    }
    .auth .logo-link img {
        width: 140px !important;
    }
    .cx-links--card_description {
        display: none !important;
    }
    .cx-links--icon {
        width: 32px !important;
        height: 32px !important;
    }
    .auth .cx-social-btn {
        padding-left: 10% !important;
    }
}
