/* ====================================================================
   CODEX EXPORT DIALOG
   ==================================================================== */

.codex-export-dialog {
    display: flex;
    flex-direction: column;
    gap: var(--io-space-lg);
    padding: var(--io-space-lg);
    height: 100%;
}

.codex-export-info {
    display: flex;
    flex-direction: column;
    gap: var(--io-space-md);
}

.codex-export-entry {
    padding: var(--io-space-md);
    background: var(--io-surface-raised);
    border: 1px solid var(--io-border);
    border-radius: var(--io-radius-md);
}

.codex-export-entry-title {
    font-size: var(--io-text-lg);
    font-weight: 700;
    color: var(--io-text-primary);
    margin-bottom: 4px;
}

.codex-export-entry-meta {
    font-size: var(--io-text-xs);
    color: var(--io-text-secondary);
}

.codex-export-includes {
    display: flex;
    gap: var(--io-space-sm);
}

.codex-export-include-item {
    flex: 1;
    padding: var(--io-space-sm);
    background: var(--io-surface-raised);
    border: 1px solid var(--io-border);
    border-radius: var(--io-radius-sm);
    display: flex;
    align-items: center;
    gap: var(--io-space-sm);
    font-size: var(--io-text-xs);
}

.codex-export-include-item.active {
    border-color: var(--io-success);
    color: var(--io-success);
}

.codex-export-include-item.inactive {
    color: var(--io-text-tertiary);
}

.codex-export-formats {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--io-space-md);
}

.codex-export-format-title {
    font-size: var(--io-text-sm);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--io-text-secondary);
}

.codex-export-format-btn {
    display: flex;
    align-items: center;
    gap: var(--io-space-md);
    padding: var(--io-space-md);
    background: var(--io-surface-raised);
    border: 1px solid var(--io-border);
    border-radius: var(--io-radius-md);
    cursor: pointer;
    transition: all var(--io-transition-base);
    font-family: var(--io-font-primary);
}

.codex-export-format-btn:hover {
    border-color: var(--io-accent);
    background: var(--io-bg-accent-subtle);
    transform: translateX(4px);
}

.codex-export-format-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--io-surface-overlay);
    border-radius: var(--io-radius-md);
    font-size: var(--io-icon-lg);
    color: var(--io-accent);
}

.codex-export-format-content {
    flex: 1;
    text-align: left;
}

.codex-export-format-name {
    font-size: var(--io-text-base);
    font-weight: 700;
    color: var(--io-text-primary);
    margin-bottom: 4px;
}

.codex-export-format-desc {
    font-size: var(--io-text-xs);
    color: var(--io-text-secondary);
}