/*
 * Akuratek Tenant Administration
 * A1.12G-D1
 */


.ta-hidden {

    display:none !important;
}


.ta-summary {

    display:grid;

    grid-template-columns:
        repeat(
            4,
            minmax(
                140px,
                1fr
            )
        );

    gap:12px;

    margin-bottom:18px;
}


.ta-stat {

    border:1px solid #dde6eb;

    border-radius:12px;

    background:#fff;

    padding:15px;
}


.ta-stat span {

    display:block;

    color:#647782;

    font-size:13px;

    margin-bottom:6px;
}


.ta-stat strong {

    display:block;

    font-size:24px;
}


.ta-muted {

    margin-top:4px;

    color:#71838d;

    font-size:12px;
}


.ta-status,
.ta-badge {

    display:inline-flex;

    align-items:center;

    border-radius:999px;

    padding:4px 8px;

    font-size:11px;

    font-weight:700;

    white-space:nowrap;
}


.ta-status.active {

    background:#e6f7ef;

    color:#11613e;
}


.ta-status.disabled {

    background:#eef1f3;

    color:#5a6870;
}


.ta-status.locked,
.ta-badge.warning {

    background:#fff3d8;

    color:#805c00;
}


.ta-badge {

    background:#e9f4f8;

    color:#17586c;

    margin:2px;
}


.ta-actions {

    display:flex;

    flex-wrap:wrap;

    gap:6px;
}


.ta-message {

    min-height:20px;

    margin-bottom:10px;

    color:#52636c;

    font-size:13px;
}


.ta-message.error {

    color:#a12c2c;
}


.ta-empty {

    padding:25px;

    text-align:center;

    color:#6b7c85;
}


.ta-modal {

    position:fixed;

    inset:0;

    z-index:10000;

    display:flex;

    justify-content:center;

    align-items:flex-start;

    padding:5vh 18px;

    overflow:auto;

    background:
        rgba(
            10,
            25,
            34,
            .48
        );
}


.ta-modal-card {

    width:min(
        780px,
        100%
    );

    border-radius:15px;

    background:#fff;

    box-shadow:
        0 25px 80px
        rgba(
            0,
            0,
            0,
            .25
        );

    padding:20px;
}


.ta-modal-header {

    display:flex;

    align-items:flex-start;

    justify-content:space-between;

    gap:18px;

    padding-bottom:15px;

    border-bottom:
        1px solid #e1e8ec;
}


.ta-modal-header h2 {

    margin:0 0 4px;
}


.ta-modal-header p {

    margin:0;

    color:#647681;
}


.ta-form-grid {

    display:grid;

    grid-template-columns:
        repeat(
            2,
            minmax(
                0,
                1fr
            )
        );

    gap:14px;

    margin-top:18px;
}


.ta-form-grid .full {

    grid-column:
        1 / -1;
}


.ta-form-section {

    margin-top:20px;

    padding-top:16px;

    border-top:
        1px solid #e5ecef;
}


.ta-form-section h3 {

    margin:
        0 0 10px;
}


.ta-check-grid {

    display:grid;

    grid-template-columns:
        repeat(
            2,
            minmax(
                0,
                1fr
            )
        );

    gap:8px;
}


.ta-check {

    display:flex;

    align-items:flex-start;

    gap:10px;

    padding:11px;

    border:
        1px solid #dde6eb;

    border-radius:9px;

    cursor:pointer;
}


.ta-check input {

    margin-top:3px;
}


.ta-check span {

    display:flex;

    flex-direction:column;

    gap:2px;
}


.ta-check small {

    color:#71818a;
}


.ta-modal-footer {

    display:flex;

    justify-content:flex-end;

    flex-wrap:wrap;

    gap:8px;

    margin-top:20px;

    padding-top:16px;

    border-top:
        1px solid #e5ecef;
}


.ta-security-grid {

    display:grid;

    grid-template-columns:
        repeat(
            2,
            minmax(
                0,
                1fr
            )
        );

    gap:10px;

    margin-top:20px;
}


.ta-security-grid button {

    min-height:45px;
}


.ta-danger {

    border:
        1px solid #c83d3d;

    background:#fff;

    color:#a52b2b;

    border-radius:8px;

    padding:9px 14px;

    font:inherit;

    font-weight:700;

    cursor:pointer;
}


.ta-danger:hover {

    background:#fff2f2;
}


.ta-password-box {

    display:grid;

    grid-template-columns:
        150px 1fr;

    gap:10px 14px;

    margin-top:20px;

    padding:16px;

    background:#f7fafb;

    border:
        1px solid #dce7eb;

    border-radius:10px;
}


.ta-password-box span {

    color:#657781;
}


.ta-password-box code {

    font-size:17px;

    font-weight:700;

    user-select:all;
}


.ta-warning-box {

    margin-top:15px;

    padding:12px 14px;

    border:
        1px solid #efd9a4;

    border-radius:9px;

    background:#fff9e9;

    color:#715500;
}


@media (
    max-width:760px
) {

    .ta-summary {

        grid-template-columns:
            repeat(
                2,
                minmax(
                    0,
                    1fr
                )
            );
    }


    .ta-form-grid,
    .ta-check-grid,
    .ta-security-grid {

        grid-template-columns:
            1fr;
    }


    .ta-password-box {

        grid-template-columns:
            1fr;
    }


    .ta-modal {

        padding:
            12px 8px;
    }
}