/*
 * FGENIO_JOURNAL_DIRECTION_BUTTONS_V1
 *
 * Canonical chart direction colors:
 * Bullish / Buy / Long  = #22c7ff
 * Bearish / Sell / Short = #a85cff
 */

:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-idea-side],
:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-position-side] {
    border-radius: 10px !important;
    border-color: var(--vz-border-color) !important;
    background: var(--vz-secondary-bg) !important;
    color: var(--vz-secondary-color) !important;

    box-shadow: none !important;

    transition:
        color .16s ease,
        background-color .16s ease,
        border-color .16s ease,
        box-shadow .16s ease,
        transform .16s ease;
}


/* =========================
   Bullish / Buy / Long
   ========================= */

:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-idea-side="buy"]:hover,
:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-position-side="buy"]:hover,
:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-idea-side="buy"].active,
:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-position-side="buy"].active {
    color: #22c7ff !important;

    border-color:
        rgba(34, 199, 255, .52)
        !important;

    background:
        rgba(34, 199, 255, .12)
        !important;

    box-shadow:
        0 0 0 1px
        rgba(34, 199, 255, .06)
        !important;
}


/* =========================
   Bearish / Sell / Short
   ========================= */

:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-idea-side="sell"]:hover,
:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-position-side="sell"]:hover,
:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-idea-side="sell"].active,
:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-position-side="sell"].active {
    color: #a85cff !important;

    border-color:
        rgba(168, 92, 255, .52)
        !important;

    background:
        rgba(168, 92, 255, .12)
        !important;

    box-shadow:
        0 0 0 1px
        rgba(168, 92, 255, .06)
        !important;
}


/* =========================
   Selected state
   ========================= */

:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-idea-side].active,
:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-position-side].active {
    font-weight: 600;
}


/* =========================
   Hover movement
   ========================= */

:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-idea-side]:hover,
:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-position-side]:hover {
    transform: translateY(-1px);
}


/* Future hidden bidirectional control remains untouched. */

:is(#chartSnapshotModal,[data-fgenio-journal-position-workspace-host])
[data-custom-journal-position-side="bidirectional"] {
    display: none !important;
}