/* * FGENIO_JOURNAL_IDEA_INLINE_STAGE_SNAPSHOT_V1 * * Canonical Idea Stage Cover floats inside the original * Trading IDEA text so prose naturally wraps around it * and continues below once it exceeds the image height. */ :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-body-text { display: flow-root; } /* * FGENIO_JOURNAL_IDEA_FLOAT_TEXT_FLOW_FIX_V2 * * Blade source indentation/newlines must never create visual * lines around the floated snapshot. Preserve user-entered * newlines only inside the actual Idea copy. */ :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-body-copy { white-space: pre-line; line-height: inherit; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-inline-snapshot { float: right; width: min(38%, 132px); aspect-ratio: 16 / 9; object-fit: cover; object-position: center; margin: 0 0 8px 12px; border-radius: 8px; border: 1px solid var(--vz-border-color); background: var(--vz-body-bg); } /* FGENIO_JOURNAL_TRADING_IDEA_HEADER_COMPACT_V4 */ /* * FGENIO_JOURNAL_TRADING_IDEA_BODY_GAP_V3 * * Bootstrap Accordion still reserves vertical space between * the button line-box and body. Collapse that gap only for * the canonical original Trading IDEA event. */ :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] /* FGENIO_JOURNAL_IDEA_BODY_OFFSET_SOFTEN_V1 */ .journal-trading-idea-original-body { margin-top: 0; } /* * FGENIO_JOURNAL_IDEA_SNAPSHOT_LIGHTBOX_V1 */ :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] /* * FGENIO_JOURNAL_TRADING_IDEA_V4_ROLLBACK_SNAPSHOT_GAP_V1 * * Restore canonical Accordion header geometry. * Tighten only snapshot-to-title visual distance. */ .journal-idea-inline-snapshot-trigger { display: block; width: min(38%, 132px); padding: 0; border: 0; background: transparent; cursor: zoom-in; line-height: 0; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-inline-snapshot-trigger.is-ltr { float: right; margin: -14px 0 8px 12px; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-inline-snapshot-trigger.is-rtl { float: left; margin: -14px 12px 8px 0; } /* * FGENIO_JOURNAL_IDEA_SNAPSHOT_TOP_ALIGN_V1 * * Keep the original accordion geometry untouched. * Only lift the snapshot and remove top margins from * the first real content node so RTL/LTR text starts * from the top edge beside the image. */ :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-trading-idea-original-body .journal-idea-body-text { margin-top: 0; padding-top: 0; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-trading-idea-original-body .journal-idea-body-text > :first-child { margin-top: 0 !important; padding-top: 0 !important; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-trading-idea-original-body .journal-idea-body-text p:first-child, :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-trading-idea-original-body .journal-idea-body-text div:first-child, :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-trading-idea-original-body .journal-idea-body-text h1:first-child, :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-trading-idea-original-body .journal-idea-body-text h2:first-child, :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-trading-idea-original-body .journal-idea-body-text h3:first-child, :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-trading-idea-original-body .journal-idea-body-text h4:first-child, :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-trading-idea-original-body .journal-idea-body-text h5:first-child, :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-trading-idea-original-body .journal-idea-body-text h6:first-child, :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-trading-idea-original-body .journal-idea-body-text ul:first-child, :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-trading-idea-original-body .journal-idea-body-text ol:first-child, :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-trading-idea-original-body .journal-idea-body-text blockquote:first-child { margin-top: 0 !important; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-inline-snapshot-trigger .journal-idea-inline-snapshot { float: none !important; width: 100%; height: auto; margin: 0 !important; display: block; transition: transform .18s ease, opacity .18s ease; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-inline-snapshot-trigger:hover .journal-idea-inline-snapshot { transform: scale(1.02); opacity: .94; } .journal-idea-snapshot-modal .modal-content { background: rgba(0, 0, 0, .96); border: 0; } .journal-idea-snapshot-modal .modal-body { min-height: 100vh; padding: 56px 24px 24px; display: flex; align-items: center; justify-content: center; } .journal-idea-snapshot-modal-image { display: block; width: auto; height: auto; max-width: 100%; max-height: calc(100vh - 80px); object-fit: contain; margin: auto; } .journal-idea-snapshot-modal-close { position: absolute; top: 14px; right: 16px; z-index: 3; width: 40px; height: 40px; } /* * FGENIO_JOURNAL_IDEA_SNAPSHOT_DIRECTIONAL_FLOAT_V1 */ :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-inline-snapshot.is-ltr { float: right; margin: 0 0 8px 12px; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-inline-snapshot.is-rtl { float: left; margin: 0 12px 8px 0; } /* * FGENIO_JOURNAL_IDEA_ACCORDION_ACTIVE_STAGE_COLOR_V1 * * IDEA Timeline: * open = active Velzon stage tone * closed = muted / inactive */ :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-toggle { /* * FGENIO_JOURNAL_IDEA_ACCORDION_HEADER_GEOMETRY_V5 * * Every timeline event header owns identical geometry. * No Event-specific Bootstrap vertical padding. */ min-height: 52px; padding-top: 10px !important; padding-bottom: 10px !important; display: flex; align-items: center; line-height: 1.2; color: var(--vz-secondary-color); opacity: .72; transition: color .18s ease, opacity .18s ease; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-row { min-height: 32px; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-title { display: flex; align-items: center; min-height: 28px; line-height: 1.2; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-row > small { display: flex; align-items: center; min-height: 28px; line-height: 1.2; margin: 0; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-icon { width: 28px !important; height: 28px !important; min-width: 28px; min-height: 28px; line-height: 1; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-toggle::after { align-self: center; flex-shrink: 0; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-toggle .journal-idea-event-title { color: var(--vz-secondary-color); transition: color .18s ease; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-toggle .journal-idea-event-icon { background: rgba(var(--vz-secondary-rgb), .10); color: var(--vz-secondary-color); transition: background-color .18s ease, color .18s ease, box-shadow .18s ease; } /* * Open event = same active visual family as the * Trading Idea stage badge. */ /* * FGENIO_JOURNAL_IDEA_ACCORDION_MATCH_STAGE_BADGE_V1 * * Trading Idea badge uses: * bg-secondary-subtle text-secondary * * Open Accordion event must use the same Velzon * secondary visual family. */ :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-toggle:not(.collapsed) { color: var(--vz-secondary); opacity: 1; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-toggle:not(.collapsed) .journal-idea-event-title { color: var(--vz-secondary); } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-toggle:not(.collapsed) .journal-idea-event-icon { background: rgba(var(--vz-secondary-rgb), .16); color: var(--vz-secondary); box-shadow: 0 0 0 1px rgba(var(--vz-secondary-rgb), .20); } /* * FGENIO_JOURNAL_IDEA_ACCORDION_CHEVRON_COLOR_V1 * * Closed: * brighter muted gray. * * Open: * exact same secondary stage tone used by * the active title / Trading Idea visual family. * * Use mask instead of Bootstrap background-image * so the chevron can inherit an exact CSS color. */ :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-toggle::after { background-image: none !important; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: 16px 16px; mask-size: 16px 16px; background-color: var(--vz-secondary-color); opacity: .88; transition: transform .2s ease, background-color .18s ease, opacity .18s ease; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-toggle:not(.collapsed)::after { background-color: var(--vz-secondary); opacity: 1; } /* * FGENIO_JOURNAL_IDEA_COMPACT_HORIZONTAL_PADDING_V1 * * Reduce only left/right spacing in Idea right column. */ :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-single-desktop-content-scroll { padding-left: 14px; padding-right: 14px; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-single-desktop-footer { padding-left: 14px; padding-right: 14px; } /* * FGENIO_JOURNAL_OWNER_AI_RIGHT_COLUMN_GEOMETRY_V1 * * The shared AI shell uses position:absolute; inset:0. * Therefore the Journal right rail must be the containing block. */ .journal-single-desktop-content[data-fgenio-ai-journal-host] { position: relative; overflow: hidden; min-width: 0; min-height: 0; isolation: isolate; } .journal-single-desktop-content[data-fgenio-ai-journal-host] > .fgenio-ai-journal-chat-layer { position: absolute; inset: 0; width: 100%; height: 100%; max-width: 100%; max-height: 100%; z-index: 90; margin: 0; } /* * FGENIO_JOURNAL_STAGE_GEN_OVERLAY_STYLE_V1 */ .journal-single-desktop-content[data-fgenio-ai-journal-host] { position: relative; overflow: hidden; min-width: 0; min-height: 0; } .journal-stage-gen-layer { position: absolute; inset: 0; z-index: 94; display: none; flex-direction: column; width: 100%; height: 100%; min-width: 0; min-height: 0; background: var(--vz-body-bg); color: var(--vz-body-color); } .journal-stage-gen-layer.is-open { display: flex; } .journal-stage-gen-header { flex: 0 0 auto; min-height: 68px; padding: 12px 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--vz-border-color); background: var(--vz-body-bg); } .journal-stage-gen-icon { width: 38px; height: 38px; flex: 0 0 38px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 18px; background: var(--vz-secondary-bg); } .journal-stage-gen-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; padding: 16px 14px 20px; } .journal-stage-gen-footer { flex: 0 0 auto; padding: 12px 14px; display: flex; align-items: flex-end; gap: 12px; border-top: 1px solid var(--vz-border-color); background: var(--vz-body-bg); } .journal-stage-gen-footer .fgenio-journal-footer-title-wrap { min-width: 160px; } .journal-stage-gen-footer .fgenio-journal-ai-action { flex: 0 0 auto; } @media (max-width: 1199.98px) { .journal-stage-gen-footer { flex-wrap: wrap; } .journal-stage-gen-footer .fgenio-journal-footer-title-wrap { width: 100%; flex-basis: 100%; } } /* * FGENIO_JOURNAL_LOAD_POINT_HEADER_LAYOUT_V5 * * Accordion trigger and Timeline actions are siblings. * Load Point must never participate in accordion toggle. */ :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-header-shell { display: flex; align-items: center; width: 100%; gap: .65rem; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-header-shell > .journal-idea-event-toggle { flex: 1 1 auto; width: auto; min-width: 0; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-meta-actions { position: relative; z-index: 3; min-height: 32px; padding-right: .25rem; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-timeline-load-point { cursor: pointer; white-space: nowrap; line-height: 1.2; padding: .35rem .55rem; font-size: .70rem; font-weight: 600; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-timeline-load-point:hover, :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-timeline-load-point:focus { filter: brightness(.96); } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-timeline-load-point:focus-visible { outline: 0; box-shadow: 0 0 0 .15rem rgba(var(--vz-primary-rgb), .14); } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-time { display: inline-flex; align-items: center; min-height: 28px; margin: 0; white-space: nowrap; /* Keep the exact previous Timeline date/time scale. * This element is now outside accordion-button and must * not inherit the larger accordion-header / h2 font size. */ font-size: .78rem; font-weight: 400; line-height: 1.2; appearance: none; -webkit-appearance: none; border: 0; padding: 0; background: transparent; cursor: pointer; user-select: none; transition: color .15s ease, opacity .15s ease; } /* FGENIO_JOURNAL_RELATIVE_TIME_BUTTON_STYLE_V8 */ :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-time:hover { color: var(--vz-body-color) !important; } :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-time:focus, :is(.journal-single-desktop,.journal-social-view)[data-stage="idea"] .journal-idea-event-time:focus-visible { outline: 0; box-shadow: none; } /* * FGENIO_JOURNAL_TIMELINE_HIDE_CHEVRON_ALL_STAGES_V1 * * Keep accordion behavior, remove only the open/close indicator * across Idea, Setup, Live and Closed Journal stages. */ :is(.journal-single-desktop,.journal-social-view):is( [data-stage="idea"], [data-stage="planned"], [data-stage="executed"], [data-stage="closed"] ) .journal-idea-event-toggle::after { display: none !important; content: none !important; } /* * FGENIO_SOCIAL_JOURNAL_VIEW_SHELL_V1 */ .journal-social-view .journal-idea-fixed-header { margin-bottom: 16px !important; } .journal-social-view .journal-social-stage-media { margin-top: 0; margin-bottom: 16px; } .journal-social-view .journal-single-desktop-footer { padding-top: 10px; margin-top: 14px; } .journal-social-view .journal-idea-timeline { overflow: visible !important; } .journal-social-view .journal-idea-event-meta-actions { padding-right: 0; }