/* Editor-specific styles for Events Posts Block */

.wp-block-bricks-child-events-posts {
    padding: 0;
}

/* Editor Container */
.editor-styles-wrapper .events-posts-block {
    font-family:
        -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans,
        Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

/* Ensure proper spacing in editor */
.editor-styles-wrapper .events-posts-container {
    padding: 40px 20px;
}

/* Header styling in editor */
.editor-styles-wrapper .events-posts-header {
    margin-bottom: 30px;
}

/* Text Alignment in Editor */
.editor-styles-wrapper .text--left {
    text-align: left;
}

.editor-styles-wrapper .text--center {
    text-align: center;
}

.editor-styles-wrapper .text--right {
    text-align: right;
}

.editor-styles-wrapper .text--center .events-posts-subheading {
    margin-left: auto;
    margin-right: auto;
}

.editor-styles-wrapper .events-posts-tagline {
    font-size: 14px;
    color: #666;
    margin-bottom: 8px;
}

.editor-styles-wrapper .events-posts-heading {
    font-size: 32px;
    margin-bottom: 16px;
}

.editor-styles-wrapper .events-posts-subheading {
    font-size: 16px;
    color: #555;
}

/* Categories preview */
.editor-styles-wrapper .events-categories {
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-bottom: 1px solid #e0e0e0;
}

.editor-styles-wrapper .category-btn {
    background: none;
    border: 1px solid var(--action);
    color: var(--action);
    padding: 0.5rem var(--space-s);
    font-size: 14px;
    cursor: default;
}

.editor-styles-wrapper .category-btn.active {
    background: var(--action);
    color: var(--white);
    border-color: var(--action);
}

/* Event items preview */
.editor-styles-wrapper .events-list {
    gap: 20px;
}

.editor-styles-wrapper .event-item {
    margin: 0;
    background: #fff;
    border-bottom: 1px solid #e0e0e0;
}

.editor-styles-wrapper .event-item:last-child {
    border-bottom: none;
}

/* Image preview in editor */
.editor-styles-wrapper .event-item-image {
    background: #f0f0f0;
    min-height: 160px;
    border-radius: 8px;
}

.editor-styles-wrapper .event-item-placeholder {
    background: #e5e5e5;
    border: 2px dashed #999;
    color: #666;
    font-size: 14px;
}

/* Content spacing */
.editor-styles-wrapper .event-item-content {
    gap: 12px;
}

.editor-styles-wrapper .event-header {
    gap: 12px;
}

.editor-styles-wrapper .event-title {
    font-size: 24px;
}

.editor-styles-wrapper .event-sold-out {
    background: #f0f0f0;
    padding: 4px 12px;
    font-size: 12px;
}

.editor-styles-wrapper .event-meta {
    font-size: 14px;
    color: #666;
}

.editor-styles-wrapper .event-description {
    font-size: 16px;
    line-height: 1.5;
}

/* Button preview */
.editor-styles-wrapper .event-button {
    background: #fff;
    border: 2px solid #000;
    color: #000;
    padding: 12px 24px;
    font-size: 14px;
    cursor: default;
    text-decoration: none;
}

.editor-styles-wrapper .event-button:hover {
    background: #000;
    color: #fff;
}

/* Block selected state */
.block-editor-block-list__layout
    .wp-block-bricks-child-events-posts.is-selected
    .events-posts-container {
    border-color: var(--wp-admin-theme-color);
    border-style: solid;
}

/* Responsive preview in editor */
@media (max-width: 768px) {
    .editor-styles-wrapper .event-item-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .editor-styles-wrapper .events-categories {
        flex-wrap: wrap;
        gap: 8px;
    }

    .editor-styles-wrapper .event-button {
        width: 100%;
        text-align: center;
    }
}

/* Add link to categories after the selectedCategory field */
[data-block-name="dgs/events-posts"]
    [data-field="selectedCategory"]
    .components-base-control__field::after,
.blockstudio-field-selectedCategory .components-base-control__field::after {
    display: block;
    content: "View categories at: /wp-admin/edit-tags.php?taxonomy=event-categories&post_type=event";
    font-size: var(--text-xs);
    color: var(--neutral-medium);
    padding-top: 0.5rem;
}