.admin-kpi-grid {
    display:
        grid;

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

    gap:
        14px;

    margin-bottom:
        14px;
}

.admin-kpi-card {
    min-height:
        126px;

    display:
        flex;

    align-items:
        center;

    gap:
        15px;

    padding:
        18px;

    border:
        1px solid var(--admin-border);

    border-radius:
        var(--admin-radius);

    background:
        linear-gradient(
            145deg,
            rgba(255, 176, 0, 0.025),
            transparent 42%
        ),
        var(--admin-panel);

    box-shadow:
        var(--admin-shadow);
}

.admin-kpi-icon {
    flex:
        0 0 50px;

    width:
        50px;

    height:
        50px;

    display:
        grid;

    place-items:
        center;

    border:
        1px solid rgba(255, 176, 0, 0.34);

    border-radius:
        13px;

    background:
        rgba(255, 176, 0, 0.095);

    color:
        var(--admin-gold);

    font-size:
        19px;

    font-weight:
        900;
}

.admin-kpi-content {
    min-width:
        0;

    display:
        grid;

    gap:
        4px;
}

.admin-kpi-content > span {
    color:
        #d3d7da;

    font-size:
        12px;
}

.admin-kpi-content strong {
    overflow:
        hidden;

    color:
        white;

    font-size:
        clamp(21px, 2vw, 29px);

    line-height:
        1;

    letter-spacing:
        -0.035em;

    text-overflow:
        ellipsis;
}

.admin-kpi-content small {
    margin-top:
        5px;

    color:
        var(--admin-text-soft);

    font-size:
        10px;
}

.admin-kpi-content small b {
    margin-right:
        4px;
}

.positive {
    color:
        var(--admin-green);
}

.warning {
    color:
        var(--admin-yellow);
}

.admin-dashboard-grid {
    display:
        grid;

    grid-template-columns:
        minmax(0, 1.75fr)
        minmax(270px, 0.82fr)
        minmax(265px, 0.72fr);

    gap:
        14px;

    align-items:
        start;
}

.admin-performance-card {
    min-height:
        444px;
}

.admin-status-card {
    min-height:
        444px;
}

.admin-dashboard-side {
    display:
        grid;

    gap:
        14px;
}

.admin-select {
    height:
        38px;

    padding:
        0 12px;

    border:
        1px solid var(--admin-border);

    border-radius:
        9px;

    outline:
        0;

    background:
        #191d20;

    color:
        white;

    font-size:
        11px;
}

.admin-chart-placeholder {
    position:
        relative;

    height:
        330px;

    overflow:
        hidden;

    margin:
        18px;

    border:
        1px solid var(--admin-border);

    border-radius:
        13px;

    background:
        linear-gradient(
            180deg,
            rgba(255, 176, 0, 0.025),
            transparent
        ),
        #0b0e10;
}

.admin-chart-grid-lines {
    position:
        absolute;

    inset:
        0;

    opacity:
        0.25;

    background-image:
        linear-gradient(
            to right,
            rgba(255, 255, 255, 0.12) 1px,
            transparent 1px
        ),
        linear-gradient(
            to bottom,
            rgba(255, 255, 255, 0.12) 1px,
            transparent 1px
        );

    background-size:
        72px 54px;
}

.admin-chart-message {
    position:
        absolute;

    inset:
        0;

    display:
        grid;

    place-content:
        center;

    justify-items:
        center;

    gap:
        7px;

    text-align:
        center;
}

.admin-chart-message > span {
    color:
        var(--admin-gold);

    font-size:
        37px;
}

.admin-chart-message strong {
    font-size:
        15px;
}

.admin-chart-message small {
    max-width:
        280px;

    color:
        var(--admin-text-soft);

    font-size:
        11px;

    line-height:
        1.6;
}

.admin-status-donut {
    display:
        grid;

    place-items:
        center;

    padding:
        25px 20px 18px;
}

.admin-donut-ring {
    width:
        160px;

    aspect-ratio:
        1;

    display:
        grid;

    place-items:
        center;

    border-radius:
        50%;

    background:
        #24292d;

    position:
        relative;
}

.admin-donut-ring::before {
    content:
        "";

    position:
        absolute;

    inset:
        24px;

    border-radius:
        50%;

    background:
        #101315;

    box-shadow:
        inset 0 0 0 1px var(--admin-border);
}

.admin-donut-ring > div {
    position:
        relative;

    z-index:
        1;

    display:
        grid;

    justify-items:
        center;
}

.admin-donut-ring strong {
    font-size:
        28px;

    letter-spacing:
        -0.04em;
}

.admin-donut-ring span {
    color:
        var(--admin-text-soft);

    font-size:
        10px;
}

.admin-status-list {
    display:
        grid;

    gap:
        13px;

    padding:
        0 22px 22px;
}

.admin-status-list > div {
    display:
        grid;

    grid-template-columns:
        10px 1fr auto;

    align-items:
        center;

    gap:
        9px;

    color:
        var(--admin-text-soft);

    font-size:
        11px;
}

.admin-status-list strong {
    color:
        white;
}

.status-dot {
    width:
        8px;

    height:
        8px;

    border-radius:
        50%;
}

.status-dot.delivered {
    background:
        var(--admin-green);
}

.status-dot.preparing {
    background:
        var(--admin-yellow);
}

.status-dot.delivery {
    background:
        var(--admin-orange);
}

.status-dot.waiting {
    background:
        #6a7279;
}

.admin-quick-actions {
    display:
        grid;

    grid-template-columns:
        1fr 1fr;

    gap:
        9px;

    padding:
        16px;
}

.admin-quick-actions button {
    min-height:
        84px;

    display:
        grid;

    place-content:
        center;

    justify-items:
        center;

    gap:
        8px;

    border:
        1px solid rgba(255, 176, 0, 0.23);

    border-radius:
        11px;

    background:
        linear-gradient(
            145deg,
            rgba(255, 176, 0, 0.09),
            rgba(255, 255, 255, 0.015)
        );

    color:
        #e7eaec;

    font-size:
        10px;

    font-weight:
        650;
}

.admin-quick-actions button:hover {
    border-color:
        rgba(255, 176, 0, 0.48);

    background:
        rgba(255, 176, 0, 0.1);
}

.admin-quick-actions button span {
    color:
        var(--admin-gold);

    font-size:
        20px;
}

.admin-alert-count {
    min-width:
        25px;

    height:
        25px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        99px;

    background:
        var(--admin-red);

    font-size:
        10px;

    font-weight:
        900;
}

.admin-alert-list {
    display:
        grid;
}

.admin-alert-list article {
    display:
        grid;

    grid-template-columns:
        34px 1fr;

    gap:
        11px;

    align-items:
        center;

    padding:
        13px 16px;

    border-top:
        1px solid var(--admin-border);
}

.admin-alert-list article:first-child {
    border-top:
        0;
}

.admin-alert-icon {
    width:
        30px;

    height:
        30px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        50%;

    font-size:
        12px;

    font-weight:
        900;
}

.admin-alert-icon.danger {
    background:
        rgba(255, 77, 85, 0.15);

    color:
        #ff676e;
}

.admin-alert-icon.warning {
    background:
        rgba(255, 189, 46, 0.14);

    color:
        var(--admin-yellow);
}

.admin-alert-icon.info {
    background:
        rgba(49, 136, 255, 0.14);

    color:
        #54a0ff;
}

.admin-alert-list strong {
    display:
        block;

    margin-bottom:
        3px;

    font-size:
        11px;
}

.admin-alert-list p {
    margin:
        0;

    color:
        var(--admin-text-soft);

    font-size:
        9px;

    line-height:
        1.45;
}

.admin-orders-card {
    margin-top:
        14px;
}

.admin-text-button {
    border:
        0;

    background:
        transparent;

    color:
        var(--admin-gold);

    font-size:
        11px;

    font-weight:
        700;
}

.admin-table-wrapper {
    overflow-x:
        auto;

    padding:
        0 18px 18px;
}

.admin-table {
    width:
        100%;

    border-collapse:
        collapse;

    font-size:
        11px;
}

.admin-table th {
    padding:
        13px 12px;

    border-bottom:
        1px solid var(--admin-border);

    color:
        #8e969c;

    text-align:
        left;

    font-size:
        9px;

    letter-spacing:
        0.08em;

    text-transform:
        uppercase;
}

.admin-table td {
    padding:
        13px 12px;

    border-bottom:
        1px solid rgba(255, 255, 255, 0.055);

    color:
        #d9dde0;
}

.admin-table tbody tr:hover td {
    background:
        rgba(255, 255, 255, 0.018);
}

.admin-table-empty td {
    padding:
        35px 15px;
}

.admin-table-empty div {
    display:
        grid;

    justify-items:
        center;

    gap:
        6px;

    color:
        var(--admin-text-soft);
}

.admin-table-empty span {
    color:
        var(--admin-gold);

    font-size:
        26px;
}

.admin-table-empty strong {
    color:
        white;

    font-size:
        12px;
}

.admin-table-empty small {
    font-size:
        10px;
}

.admin-account-card {
    margin-top:
        14px;
}

.admin-security-badge {
    padding:
        8px 11px;

    border:
        1px solid rgba(22, 209, 121, 0.2);

    border-radius:
        99px;

    background:
        rgba(22, 209, 121, 0.06);

    color:
        #5be7a4;

    font-size:
        9px;

    font-weight:
        800;
}

.admin-security-layout {
    display:
        grid;

    grid-template-columns:
        minmax(230px, 0.65fr)
        minmax(320px, 1fr);

    gap:
        34px;

    padding:
        24px;
}

.admin-security-description {
    padding-right:
        24px;

    border-right:
        1px solid var(--admin-border);
}

.admin-security-icon {
    width:
        50px;

    height:
        50px;

    display:
        grid;

    place-items:
        center;

    margin-bottom:
        17px;

    border:
        1px solid rgba(255, 176, 0, 0.24);

    border-radius:
        13px;

    background:
        rgba(255, 176, 0, 0.07);

    font-size:
        20px;
}

.admin-security-description h3 {
    margin:
        0 0 8px;

    font-size:
        16px;
}

.admin-security-description p {
    margin:
        0;

    color:
        var(--admin-text-soft);

    font-size:
        11px;

    line-height:
        1.65;
}

.admin-security-form {
    display:
        grid;

    grid-template-columns:
        1fr 1fr;

    gap:
        15px;
}

.admin-security-form .admin-form-status,
.admin-security-form .admin-primary-button {
    grid-column:
        1 / -1;
}

.admin-placeholder-card {
    min-height:
        530px;

    display:
        grid;

    place-content:
        center;

    justify-items:
        center;

    padding:
        40px;

    text-align:
        center;
}

.admin-placeholder-icon {
    width:
        70px;

    height:
        70px;

    display:
        grid;

    place-items:
        center;

    margin-bottom:
        19px;

    border:
        1px solid rgba(255, 176, 0, 0.27);

    border-radius:
        19px;

    background:
        rgba(255, 176, 0, 0.055);

    color:
        var(--admin-gold);

    font-size:
        31px;
}

.admin-placeholder-card h2 {
    margin:
        7px 0;

    font-size:
        25px;
}

.admin-placeholder-card p {
    max-width:
        430px;

    margin:
        0;

    color:
        var(--admin-text-soft);

    font-size:
        12px;

    line-height:
        1.7;
}

@media (max-width: 1280px) {
    .admin-dashboard-grid {
        grid-template-columns:
            minmax(0, 1.5fr)
            minmax(250px, 0.8fr);
    }

    .admin-dashboard-side {
        grid-column:
            1 / -1;

        grid-template-columns:
            1fr 1fr;
    }
}

@media (max-width: 1020px) {
    .admin-kpi-grid {
        grid-template-columns:
            1fr 1fr;
    }

    .admin-dashboard-grid {
        grid-template-columns:
            1fr;
    }

    .admin-dashboard-side {
        grid-column:
            auto;
    }

    .admin-security-layout {
        grid-template-columns:
            1fr;
    }

    .admin-security-description {
        padding-right:
            0;

        padding-bottom:
            22px;

        border-right:
            0;

        border-bottom:
            1px solid var(--admin-border);
    }
}

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

    .admin-dashboard-side {
        grid-template-columns:
            1fr;
    }

    .admin-security-form {
        grid-template-columns:
            1fr;
    }

    .admin-security-form .admin-form-status,
    .admin-security-form .admin-primary-button {
        grid-column:
            auto;
    }

    .admin-card-header {
        align-items:
            flex-start;

        padding:
            18px;

        flex-direction:
            column;
    }
}


/* ==========================================================
   DASHBOARD REAL - ETAPA 5D
   ========================================================== */

.admin-chart-loading {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    z-index: 2;
    color: var(--admin-text-soft);
    font-size: 11px;
    letter-spacing: 0.02em;
}

.admin-chart-content {
    position: absolute;
    inset: 18px 18px 14px;
    z-index: 2;
}

.admin-chart-svg {
    width: 100%;
    height: 100%;
    overflow: visible;
}

.admin-chart-line {
    fill: none;
    stroke: var(--admin-gold);
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
    filter:
        drop-shadow(
            0 4px 7px
            rgba(255, 176, 0, 0.18)
        );
}

.admin-chart-area {
    fill:
        rgba(255, 176, 0, 0.08);
}

.admin-chart-dot {
    fill: #111416;
    stroke: var(--admin-gold);
    stroke-width: 3;
}

.admin-chart-axis-label {
    fill: #848c92;
    font-size: 10px;
}

.admin-chart-value {
    fill: #d9dde0;
    font-size: 10px;
    font-weight: 700;
}

.admin-chart-empty {
    height: 100%;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 7px;
    color: var(--admin-text-soft);
    text-align: center;
}

.admin-chart-empty strong {
    color: white;
    font-size: 13px;
}

.admin-status-loading {
    color: var(--admin-text-soft);
    font-size: 11px;
}

.admin-status-list .status-dot.real-status {
    background: var(--status-color, var(--admin-gold));
}

.admin-order-status {
    display: inline-flex;
    align-items: center;
    min-height: 23px;
    padding: 4px 9px;
    border: 1px solid rgba(255, 176, 0, 0.22);
    border-radius: 999px;
    background: rgba(255, 176, 0, 0.07);
    color: #f2c15b;
    font-size: 9px;
    font-weight: 700;
}

.admin-order-type {
    text-transform: capitalize;
}

.admin-order-number {
    color: white;
    font-weight: 700;
}

.admin-order-client {
    display: grid;
    gap: 2px;
}

.admin-order-client small {
    color: var(--admin-text-soft);
    font-size: 9px;
}

.admin-alert-empty {
    opacity: 0.9;
}

.admin-dashboard-error {
    padding: 15px 18px;
    border: 1px solid rgba(255, 91, 91, 0.23);
    border-radius: 10px;
    background: rgba(255, 91, 91, 0.055);
    color: #ff9999;
    font-size: 11px;
}

.admin-data-comparison {
    color: var(--admin-text-soft);
}

.admin-data-comparison.positive {
    color: var(--admin-green);
}

.admin-data-comparison.negative {
    color: #ff8e8e;
}

.admin-data-comparison.neutral {
    color: var(--admin-text-soft);
}

@media (max-width: 700px) {
    .admin-chart-content {
        inset: 15px 10px 10px;
    }

    .admin-chart-value {
        display: none;
    }
}


/* ==========================================================
   DASHBOARD - REFINAMENTO PREMIUM ETAPA 5E
   ========================================================== */

.admin-status-context {
    max-width: 250px;
    margin-top: 5px;
    color: var(--admin-text-soft);
    font-size: 10px;
    line-height: 1.45;
}

.admin-delivery-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;

    margin: 0 20px 22px;
    padding-top: 18px;

    border-top:
        1px solid var(--admin-border);
}

.admin-delivery-split > div {
    min-width: 0;

    padding: 13px 14px;

    border:
        1px solid rgba(255, 176, 0, 0.12);

    border-radius: 11px;

    background:
        linear-gradient(
            145deg,
            rgba(255, 176, 0, 0.05),
            rgba(255, 255, 255, 0.012)
        );
}

.admin-delivery-split span {
    display: block;

    margin-bottom: 5px;

    color: var(--admin-text-soft);

    font-size: 9px;

    font-weight: 700;

    letter-spacing: 0.07em;

    text-transform: uppercase;
}

.admin-delivery-split strong {
    display: block;

    color: white;

    font-size: 19px;

    line-height: 1.1;
}

.admin-delivery-split small {
    display: block;

    margin-top: 4px;

    color: var(--admin-gold);

    font-size: 9px;
}

.admin-quick-actions button {
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        background 160ms ease,
        box-shadow 160ms ease;
}

.admin-quick-actions button:hover {
    transform:
        translateY(-2px);

    border-color:
        rgba(255, 176, 0, 0.42);

    background:
        rgba(255, 176, 0, 0.065);

    box-shadow:
        0 12px 28px
        rgba(0, 0, 0, 0.18);
}

.admin-top-real-alert[hidden] {
    display: none !important;
}

.admin-chart-placeholder {
    transition:
        border-color 180ms ease,
        box-shadow 180ms ease;
}

.admin-chart-placeholder:hover {
    border-color:
        rgba(255, 176, 0, 0.20);

    box-shadow:
        inset 0 0 0 1px
        rgba(255, 176, 0, 0.025);
}

.admin-order-type {
    display: inline-flex;

    align-items: center;

    min-height: 22px;

    padding:
        3px 8px;

    border:
        1px solid rgba(255, 255, 255, 0.07);

    border-radius:
        999px;

    background:
        rgba(255, 255, 255, 0.025);

    color:
        #d9dde0;

    font-size:
        9px;
}

.admin-order-type[data-type="delivery"] {
    border-color:
        rgba(255, 176, 0, 0.20);

    background:
        rgba(255, 176, 0, 0.055);

    color:
        #f2c15b;
}

.admin-order-type[data-type="retirada"] {
    border-color:
        rgba(96, 184, 255, 0.18);

    background:
        rgba(96, 184, 255, 0.05);

    color:
        #9ad1ff;
}

@media (max-width: 700px) {
    .admin-delivery-split {
        grid-template-columns: 1fr;
    }
}