/* MERCURIUS V6.7 */

:root {

    --ops-green:#30ffd0;
    --ops-blue:#659eff;
    --ops-purple:#b184ff;
    --ops-yellow:#ffd46b;
    --ops-red:#ff607e;

    --ops-text:#ecf8ff;
    --ops-muted:#7893aa;

    --ops-border:
        rgba(48,255,208,.15);
}


/* WORKSPACE */

#v67-workspace {

    position:fixed;

    left:270px;
    top:118px;
    right:0;
    bottom:0;

    z-index:690;

    overflow:auto;

    padding:
        clamp(
            15px,
            1.4vw,
            27px
        );

    background:

        radial-gradient(
            circle at 80% 0,
            rgba(48,255,208,.07),
            transparent 32%
        ),

        linear-gradient(
            180deg,
            rgba(3,9,17,.99),
            rgba(3,7,14,.998)
        );
}


.v67-top {

    display:flex;

    justify-content:
        space-between;

    align-items:center;

    gap:15px;

    margin-bottom:16px;
}


.v67-title {

    margin:0;

    color:var(--ops-text);

    font-size:
        clamp(
            24px,
            2.1vw,
            36px
        );
}


.v67-sub {

    margin:
        5px 0 0;

    color:
        var(--ops-muted);

    font-size:12px;
}


.v67-close {

    width:38px;
    height:38px;

    display:grid;

    place-items:center;

    border:
        1px solid
        rgba(255,255,255,.12);

    border-radius:11px;

    background:
        rgba(255,255,255,.035);

    color:white;

    cursor:pointer;
}


/* DASHBOARD STRIP */

#v67-operations-strip {

    display:grid;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(
                145px,
                1fr
            )
        );

    gap:8px;

    width:100%;

    margin-bottom:14px;
}


.v67-strip-card {

    padding:11px 12px;

    border:
        1px solid
        rgba(48,255,208,.12);

    border-radius:12px;

    background:
        linear-gradient(
            180deg,
            rgba(7,18,31,.85),
            rgba(4,11,20,.87)
        );
}


.v67-strip-card small {

    display:block;

    color:#67869d;

    font-size:8px;

    text-transform:uppercase;

    letter-spacing:.09em;
}


.v67-strip-card strong {

    display:block;

    margin-top:5px;

    color:#eaf8ff;

    font-size:17px;
}


.v67-strip-card strong.money {

    color:#30ffd0;
}


/* TOOLBAR */

.v67-toolbar {

    display:flex;

    flex-wrap:wrap;

    gap:8px;

    margin-bottom:14px;
}


.v67-btn {

    padding:
        9px 12px;

    border:
        1px solid
        rgba(48,255,208,.22);

    border-radius:10px;

    background:
        rgba(48,255,208,.06);

    color:#dffff8;

    cursor:pointer;

    font-size:11px;

    font-weight:650;
}


.v67-btn:hover {

    background:
        rgba(48,255,208,.11);
}


.v67-btn.blue {

    border-color:
        rgba(101,158,255,.25);

    background:
        rgba(101,158,255,.07);
}


.v67-btn.red {

    border-color:
        rgba(255,96,126,.25);

    background:
        rgba(255,96,126,.07);
}


/* KPIs */

.v67-kpis {

    display:grid;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(
                160px,
                1fr
            )
        );

    gap:10px;

    margin-bottom:15px;
}


.v67-kpi {

    padding:14px;

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

    border-radius:15px;

    background:
        rgba(6,16,28,.88);
}


.v67-kpi small {

    color:var(--ops-muted);

    font-size:9px;

    text-transform:uppercase;
}


.v67-kpi strong {

    display:block;

    margin-top:6px;

    color:#edf9ff;

    font-size:24px;
}


.v67-kpi strong.money {

    color:#30ffd0;
}


/* PANEL */

.v67-grid {

    display:grid;

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

    gap:12px;
}


.v67-panel {

    grid-column:span 6;

    min-width:0;

    padding:14px;

    border:
        1px solid
        rgba(101,158,255,.13);

    border-radius:15px;

    background:
        rgba(6,15,27,.89);
}


.v67-panel.full {

    grid-column:1/-1;
}


.v67-panel h3 {

    margin:
        0 0 12px;

    color:#e9f7ff;

    font-size:14px;
}


/* FORM */

.v67-form {

    display:grid;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(
                160px,
                1fr
            )
        );

    gap:8px;
}


.v67-field {

    display:grid;

    gap:5px;
}


.v67-field label {

    color:#718da4;

    font-size:9px;

    text-transform:uppercase;
}


.v67-input,
.v67-select,
.v67-textarea {

    width:100%;

    min-height:38px;

    padding:
        9px 10px;

    color:#edf7ff;

    border:
        1px solid
        rgba(129,160,185,.19);

    border-radius:10px;

    background:#040c16;

    outline:none;
}


.v67-textarea {

    min-height:72px;

    resize:vertical;
}


/* TABLE */

.v67-table-wrap {

    overflow:auto;

    border:
        1px solid
        rgba(255,255,255,.055);

    border-radius:13px;
}


.v67-table {

    width:100%;

    min-width:950px;

    border-collapse:collapse;

    font-size:11px;
}


.v67-table th {

    position:sticky;

    top:0;

    z-index:1;

    padding:10px;

    color:#718ca3;

    background:#07111d;

    text-align:left;

    font-size:8px;

    text-transform:uppercase;

    letter-spacing:.07em;
}


.v67-table td {

    padding:10px;

    color:#cfe0ec;

    border-top:
        1px solid
        rgba(255,255,255,.05);

    vertical-align:top;
}


.v67-status {

    display:inline-flex;

    padding:4px 6px;

    border:
        1px solid
        rgba(101,158,255,.18);

    border-radius:8px;

    font-size:8px;
}


.v67-status.approved,
.v67-status.paid,
.v67-status.delivered,
.v67-status.completed {

    color:#30ffd0;
}


.v67-status.rejected,
.v67-status.cancelled,
.v67-status.problem {

    color:#ff607e;
}


.v67-status.pending,
.v67-status.sent,
.v67-status.awaiting_payment {

    color:#ffd46b;
}


/* QUOTE ITEMS */

.v67-items {

    grid-column:1/-1;

    display:grid;

    gap:7px;
}


.v67-item {

    display:grid;

    grid-template-columns:
        minmax(240px,3fr)
        90px
        130px
        130px
        40px;

    gap:7px;
}


/* CRM */

.v67-crm-list {

    display:grid;

    grid-template-columns:
        repeat(
            auto-fit,
            minmax(
                220px,
                1fr
            )
        );

    gap:8px;
}


.v67-contact {

    padding:12px;

    border:
        1px solid
        rgba(48,255,208,.12);

    border-radius:12px;

    background:
        rgba(7,18,30,.8);

    cursor:pointer;
}


.v67-contact:hover {

    border-color:
        rgba(48,255,208,.32);
}


.v67-contact strong {

    color:#edf9ff;
}


.v67-contact small {

    display:block;

    margin-top:4px;

    color:#7893aa;
}


/* LANGUAGE */

.v67-language {

    display:flex;

    align-items:center;

    justify-content:center;

    gap:6px;

    width:
        calc(100% - 16px);

    margin:
        8px;

    padding:
        8px;

    border:
        1px solid
        rgba(48,255,208,.16);

    border-radius:10px;

    color:#b9fff0;

    background:
        rgba(48,255,208,.045);

    cursor:pointer;

    font-size:10px;

    font-weight:750;

    letter-spacing:.08em;
}


@media(max-width:900px) {

    #v67-workspace {

        left:0 !important;
        top:0 !important;

        z-index:99999;
    }


    .v67-panel {

        grid-column:1/-1;
    }


    .v67-item {

        grid-template-columns:1fr;
    }
}