/*_______________Profile__________*/
.member-panel {
    max-width: 720px;
    margin: clamp(16px, 4vw, 32px) auto;
    padding: clamp(16px, 3vw, 28px);
    background: #fff;
    border: 1px solid #e6e8ec;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(16, 24, 40, .08);
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 16px 24px;
    align-items: start;
}




    .member-panel.register-container {
        display: flex;
        justify-content: center;
    }

    .member-panel.card {
        display: grid;
        gap: 16px;
        min-width: min(100%, 640px);
    }


    .member-panel h3 {
        margin: 0 0 .5rem 0;
        font-size: clamp(20px, 2.8vw, 24px);
        font-weight: 800;
        color: #1f2a37;
        grid-column: 1;
    }

    .member-panel dl {
        display: grid;
        grid-template-columns: 160px 1fr;
        gap: 10px 16px;
        align-items: start;
        margin: 0;
        grid-column: 1;
    }

    .member-panel dt {
        font-weight: 700;
        color: #3f4b59;
    }

    .member-panel dd {
        margin: 0;
        color: #111827;
        word-break: break-word;
    }


    .member-panel dl > dt:nth-of-type(n+2),
    .member-panel dl > dd:nth-of-type(n+2) {
        border-top: 1px dashed #e5e7eb;
        padding-top: 10px;
    }

    .member-panel .avatar {
        grid-column: 2;
        grid-row: 1 / span 3;
        width: 120px;
        height: 120px;
        border-radius: 12px;
        object-fit: cover;
        border: 1px solid #e6e8ec;
        margin-bottom: 0;
    }

    .member-panel #logoutBtn {
        grid-column: 1;
        justify-self: start;
        padding: .65rem 1rem;
        border-radius: 8px;
        border: 1px solid #e5e7eb;
        background: #f6f7f9;
        color: #1f2a37;
        font-weight: 700;
        cursor: pointer;
        transition: background .15s ease, transform .04s ease, box-shadow .15s ease;
    }

        .member-panel #logoutBtn:hover {
            background: #eef0f3;
        }

        .member-panel #logoutBtn:active {
            transform: translateY(1px);
        }

    .member-panel .btn {
        padding: .65rem 1rem;
        border-radius: 8px;
        border: 1px solid #e5e7eb;
        background: #f6f7f9;
        color: #1f2a37;
        font-weight: 700;
        cursor: pointer;
        margin:10px;
    }

        .member-panel .btn:hover {
            background: #eef0f3;
        }

@media (max-width: 640px) {
    .member-panel {
        grid-template-columns: 1fr;
    }

        .member-panel .avatar {
            grid-column: 1;
            grid-row: auto;
            justify-self: end;
            margin-top: 8px;
            width: 96px;
            height: 96px;
            border-radius: 12px;
        }
}


.member-panel.register-container {
    display: flex;
    justify-content: center;
}

.member-panel.card {
    display: grid;
}


.form-group {
    width: 100%;
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column;
}

    .form-group label {
        font-weight: bold;
        margin-bottom: 0.3rem;
    }

    .form-group input {
        height: 2.2rem;
        padding-left: 0.5rem;
        border: 1px solid lightgray;
        border-radius: 0.4rem;
    }

        .form-group input:focus {
            outline: none;
            border: 1px solid gray;
        }


.auth__form{
    display:flex;
    flex-direction:column;
}

    .auth__form .btn:hover {
        background-color: var(--btn-primary-bg-color);
        color: var(--btn-secondary-hover-text-color);
    }
.login-container {
    display: flex;
    justify-content: center;
}

.card-Login {
    min-width: 400px;
    background-color: var(--card-background-color);
    border: 1px solid var(--card-border-color);
    color: var(--card-text-color);
    margin: 2rem;
    padding: 1.2rem 1.5rem;
    border-radius: 16px;
    max-width: 500px;
    box-shadow: var(--box-shadow);
}
.receipt-actions{
    text-align:center;
}
.receipt-info{
   text-align:center;
}

/*ta bort den när du tabort 2Auth member*/
#form0518f33ce23e421ead1b8160c54c2613 {
    text-align: center;
}