/* Backend adapter for the locked employer p3.html frontend. */
.p3-account-state-shell {
    width: min(760px, calc(100% - 32px));
    margin: 40px auto;
}

.p3-avatar-wrap {
    position: relative;
    width: 80px;
    height: 80px;
    margin: 0 auto 1rem;
}

.p3-avatar-wrap .user-avatar {
    margin: 0;
}

.p3-avatar-image {
    position: absolute;
    inset: 0;
    object-fit: cover;
}

.p3-account-meta {
    display: grid;
    gap: .35rem;
    margin-top: .8rem;
    color: rgba(245, 241, 235, .82);
    font-size: .78rem;
}

.p3-account-meta span {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
}

.logout-btn {
    width: calc(100% - 2rem);
    border: 0;
    font: inherit;
}

.p3-link-card {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.account-record-tabs .tab-button.is-active {
    background: var(--primary);
    color: #fff;
}

#recordsContainer {
    margin-top: 1.25rem;
}

#seller-application {
    position: static;
    width: 100%;
    max-width: none;
}

.p3-menu-toggle,
.p3-menu-backdrop {
    display: none;
}

@media (max-width: 768px) {
    .p3-menu-toggle {
        position: fixed;
        top: 1rem;
        right: 1rem;
        z-index: 1200;
        display: grid;
        width: 46px;
        height: 46px;
        place-items: center;
        border: 0;
        border-radius: 12px;
        background: var(--dark);
        color: #fff;
        box-shadow: var(--shadow-lg);
        font-size: 1.35rem;
    }

    .p3-menu-backdrop {
        position: fixed;
        inset: 0;
        z-index: 900;
        border: 0;
        background: rgba(0, 0, 0, .4);
    }

    body.p3-menu-open .p3-menu-backdrop {
        display: block;
    }

    .sidebar.open {
        transform: translateX(0);
    }

    .main-content {
        padding-top: 5rem;
    }

    .account-record-tabs {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}