/* Amnesia module UI helpers */

.fi-amnesia-row-pending {
    background: rgba(180, 83, 9, 0.055);
    background: color-mix(in srgb, var(--warning-500), transparent 96%);
    box-shadow: inset 3px 0 0 rgba(180, 83, 9, 0.28);
    box-shadow: inset 3px 0 0 color-mix(in srgb, var(--warning-500), transparent 35%);
}

.fi-amnesia-row-pending > td,
tr.fi-amnesia-row-pending td {
    background: rgba(180, 83, 9, 0.055);
    background: color-mix(in srgb, var(--warning-500), transparent 96%);
}

.fi-amnesia-row-pending:hover {
    background: rgba(180, 83, 9, 0.095);
    background: color-mix(in srgb, var(--warning-500), transparent 88%);
}

.fi-amnesia-row-pending:hover > td,
tr.fi-amnesia-row-pending:hover td {
    background: rgba(180, 83, 9, 0.095);
    background: color-mix(in srgb, var(--warning-500), transparent 88%);
}

.tippy-box:has(.fi-amnesia-image-preview-tip) {
    background: transparent;
    box-shadow: none;
}

.tippy-box:has(.fi-amnesia-image-preview-tip) .tippy-content {
    padding: 0;
}

.fi-amnesia-json-block {
    position: relative;
    border: 1px solid color-mix(in srgb, var(--gray-400), transparent 80%);
    border-radius: 0;
    background: #1f2937;
    padding: 0;
}

.fi-amnesia-json-pre {
    margin: 0;
    max-height: 28rem;
    overflow: auto;
    white-space: pre;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 0.8125rem;
    line-height: 1.35;
    padding: 0.75rem 0.875rem;
    color: #e5e7eb;
}

.fi-amnesia-half-section {
    max-width: calc(50% - 0.5rem);
}

@media (max-width: 1024px) {
    .fi-amnesia-half-section {
        max-width: 100%;
    }
}

.fi-amnesia-code-max-h-300 .cm-editor,
.fi-amnesia-code-max-h-300 .cm-scroller {
    max-height: 300px;
}

.fi-amnesia-code-max-h-300 .cm-scroller {
    overflow: auto;
}

.fi-amnesia-top-buyers-list {
    margin-top: 1rem;
    font-size: 0.8125rem;
    line-height: 1.25rem;
}

.fi-amnesia-top-buyers-row {
    padding: 0.4rem 0;
    border-bottom: 1px solid var(--gray-200);
}

.dark .fi-amnesia-top-buyers-row {
    border-bottom-color: rgba(63, 63, 70, 0.55);
}

.fi-amnesia-top-buyers-link {
    font-size: inherit;
    line-height: inherit;
}

/* Events Promos: tighter spacing around thumbnail images in table cells. */
.fi-resource-promos .fi-ta-image:not(.fi-inline) {
    padding-inline: calc(var(--spacing) * 1) !important;
    padding-block: calc(var(--spacing) * 1) !important;
}

/* Keep field hint icon next to its label for selected Amnesia fields. */
.fi-amnesia-inline-help .fi-fo-field-wrp-label-wrp,
.fi-amnesia-inline-help .fi-fo-field-wrp-header {
    justify-content: flex-start !important;
    gap: 0.35rem;
}

.fi-amnesia-inline-help .fi-fo-field-wrp-hint {
    margin-inline-start: 0 !important;
}

.fi-amnesia-inline-help .fi-sc.fi-align-end,
.fi-amnesia-inline-help .fi-sc.fi-align-right {
    justify-content: flex-start !important;
}

/* Global: keep field hint icons next to labels (not right-aligned). */
.fi-fo-field-wrp-label-wrp.fi-sc.fi-align-end,
.fi-fo-field-wrp-label-wrp.fi-sc.fi-align-right,
.fi-fo-field-wrp-header.fi-sc.fi-align-end,
.fi-fo-field-wrp-header.fi-sc.fi-align-right {
    justify-content: flex-start !important;
    gap: 0.35rem;
}

.fi-fo-field-wrp-label-wrp .fi-fo-field-wrp-hint,
.fi-fo-field-wrp-header .fi-fo-field-wrp-hint {
    margin-inline-start: 0 !important;
}

/* Hint "?" icon color: neutral in light, accent in dark. */
.fi-sc-icon.fi-color {
    color: var(--gray-400) !important;
}

.dark .fi-sc-icon.fi-color {
    color: var(--primary-500) !important;
}

/* Save actions: keep sober style in light, but primary in dark. */
.dark .fi-amnesia-save-action {
    background-color: var(--primary-500) !important;
    border-color: var(--primary-500) !important;
    color: var(--gray-950) !important;
}

.dark .fi-amnesia-save-action:hover {
    background-color: var(--primary-400) !important;
    border-color: var(--primary-400) !important;
}

/* Create actions (drink/ticket): sober in light, primary in dark. */
.dark .fi-amnesia-create-action {
    background-color: var(--primary-500) !important;
    border-color: var(--primary-500) !important;
    color: var(--gray-950) !important;
}

.dark .fi-amnesia-create-action:hover {
    background-color: var(--primary-400) !important;
    border-color: var(--primary-400) !important;
}
