/* MyPools modular site builder — Filament admin (parity with WP admin-ux.php) */
/* ---------------------------------------------------------------- */

/* ── Top-level SiteBuilder (ul.space-y-4) ── */
/* SiteBuilder edit page: builder-first, compact density */
.mypools-site-builder-edit .fi-main {
    gap: 0.75rem !important;
}

.mypools-site-builder-edit .fi-page-content {
    max-width: none !important;
}

.mypools-site-builder-builder-column,
.mypools-site-builder-builder-column > .fi-sc,
.mypools-site-builder-builder-column .fi-grid-col,
.mypools-site-builder-builder-column .fi-fo-field-wrp,
.mypools-modular-builder.fi-fo-builder,
.mypools-modular-builder > ul,
.mypools-modular-builder > ul > li.fi-fo-builder-item,
.mypools-modular-children-builder.fi-fo-builder,
.mypools-modular-children-builder .fi-fo-builder-items,
.mypools-modular-children-builder .fi-fo-builder-items > li.fi-fo-builder-item {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.mypools-site-builder-builder-column .fi-grid-col.fi-width-full,
.mypools-site-builder-builder-column .fi-grid-col[class*='fi-width-'] {
    max-width: 100% !important;
}

.mypools-site-builder-builder-column .fi-fo-field-wrp-label {
    margin-bottom: 0.35rem !important;
}

.mypools-site-builder-settings-column .fi-section {
    margin-top: 0 !important;
}

/* Marketing pages: hide header Page settings when sidebar is visible (lg+) */
.mypools-site-builder-edit:not(.mypools-site-builder-full-width-editor) .mypools-page-settings-trigger {
    display: inline-flex !important;
}

@media (min-width: 64rem) {
    .mypools-site-builder-edit:not(.mypools-site-builder-full-width-editor) .mypools-page-settings-trigger {
        display: none !important;
    }
}

/* Contractor/site: sidebar hidden — always show Page settings in header */
.mypools-site-builder-full-width-editor .mypools-page-settings-trigger {
    display: inline-flex !important;
}

.mypools-block-image-preview img,
.mypools-contractor-hero-img {
    display: block;
    max-width: 100%;
    width: auto;
    border-radius: 8px;
}

/* Curator picker inside site builder blocks */
.mypools-modular-builder .mypools-curator-picker-item,
.mypools-modular-builder .curator-media-picker > ul > li:only-child:not(:has(.curator-picker-list-preview)) {
    width: auto !important;
    max-width: 100%;
}

.mypools-modular-builder .mypools-curator-picker-item > div.checkered:not(.curator-picker-list-preview),
.mypools-modular-builder .curator-media-picker > ul > li:only-child:not(:has(.curator-picker-list-preview)) > div.checkered {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    width: fit-content !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

.mypools-modular-builder .mypools-curator-picker-item > div.checkered:not(.curator-picker-list-preview) img,
.mypools-modular-builder .curator-media-picker > ul > li:only-child:not(:has(.curator-picker-list-preview)) > div.checkered img {
    display: block !important;
    width: auto !important;
    max-width: min(100%, 28rem) !important;
    height: auto !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: left top !important;
}

.mypools-contractor-media-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: flex-end;
}

.mypools-contractor-logo-img {
    width: 72px;
    height: 72px;
    border-radius: 9999px;
    object-fit: cover;
    border: 2px solid #e2e8f0;
}

.mypools-contractor-gallery-preview {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 6px;
}

.mypools-contractor-gallery-preview img {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
    border-radius: 6px;
}

.mypools-modular-builder.fi-fo-builder > ul {
    display: grid !important;
    gap: 14px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* ── Nested Filament Builder (ul.fi-fo-builder-items) ── */
.mypools-modular-children-builder.fi-fo-builder .fi-fo-builder-items {
    display: grid !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.mypools-modular-builder > ul > li > .fi-fo-builder-item-content {
    padding: 0.75rem 1rem !important;
}

.mypools-modular-builder .fi-fo-builder-item-content .mypools-modular-children-builder.fi-fo-builder {
    margin: 6px 0 8px !important;
    margin-inline: 0 !important;
    padding: 0.5rem 0.75rem !important;
    border: 1px dashed #d7e1ea !important;
    border-radius: 12px !important;
    background: #fbfdff !important;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.mypools-modular-children-builder .fi-fo-builder-item-content {
    padding: 0.5rem 0.75rem !important;
}

/* ── Glow cards: sections + components (explicit odd/even classes from Blade) ── */
.mypools-modular-builder > ul > li.fi-fo-builder-item.mypools-landing-section-card,
.mypools-modular-children-builder .fi-fo-builder-items > li.fi-fo-builder-item.mypools-landing-section-card,
.mypools-modular-builder > ul > li.fi-fo-builder-item.mypools-landing-section-card--odd,
.mypools-modular-builder > ul > li.fi-fo-builder-item.mypools-landing-section-card--even,
.mypools-modular-children-builder .fi-fo-builder-items > li.fi-fo-builder-item.mypools-landing-section-card--odd,
.mypools-modular-children-builder .fi-fo-builder-items > li.fi-fo-builder-item.mypools-landing-section-card--even,
/* ── Contractor inline builder: glow without Blade parity classes ── */
.mypools-modular-builder > ul > li.fi-fo-builder-item {
    --mypools-builder-glow-rgb: 4, 119, 168;
    --mypools-builder-glow-border: #0477a8;
    border: 2px solid var(--mypools-builder-glow-border) !important;
    border-radius: 14px !important;
    background: #fff !important;
    animation: mypoolsBuilderGlow 2.8s ease-in-out infinite !important;
    overflow: hidden !important;
    /* Kill Filament/Tailwind ring so glow box-shadow is visible */
    --tw-ring-shadow: 0 0 #0000 !important;
    --tw-ring-offset-shadow: 0 0 #0000 !important;
    --tw-ring-color: transparent !important;
    --tw-ring-width: 0px !important;
    --tw-ring-offset-width: 0px !important;
    outline: none !important;
    box-shadow:
        0 0 0 rgba(var(--mypools-builder-glow-rgb), 0),
        0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

.mypools-modular-builder > ul > li.fi-fo-builder-item.mypools-landing-section-card--even,
.mypools-modular-children-builder .fi-fo-builder-items > li.fi-fo-builder-item.mypools-landing-section-card--even {
    --mypools-builder-glow-rgb: 190, 24, 93;
    --mypools-builder-glow-border: #be185d;
    background: #f6f8fa !important;
}

/* Contractor inline: odd/even alternation for root blocks */
.mypools-modular-builder > ul > li.fi-fo-builder-item:nth-child(odd) {
    --mypools-builder-glow-rgb: 4, 119, 168;
    --mypools-builder-glow-border: #0477a8;
    background: #fff !important;
}

.mypools-modular-builder > ul > li.fi-fo-builder-item:nth-child(even) {
    --mypools-builder-glow-rgb: 190, 24, 93;
    --mypools-builder-glow-border: #be185d;
    background: #f6f8fa !important;
}

.mypools-modular-children-builder .fi-fo-builder-items > li.fi-fo-builder-item.mypools-landing-section-card--component {
    border-radius: 10px !important;
}

/* Nested components: glow even when parity classes missing (Filament nested Builder) */
.mypools-modular-children-builder .fi-fo-builder-items > li.fi-fo-builder-item {
    --mypools-builder-glow-rgb: 0, 0, 0;
    --mypools-builder-glow-border: #000;
    border: 2px solid #000 !important;
    border-radius: 10px !important;
    background: #fff !important;
    animation: none !important;
    --tw-ring-shadow: 0 0 #0000 !important;
    --tw-ring-offset-shadow: 0 0 #0000 !important;
    overflow: hidden !important;
}

.mypools-modular-children-builder .fi-fo-builder-items > li.fi-fo-builder-item:nth-child(odd) {
    --mypools-builder-glow-rgb: 0, 0, 0;
    --mypools-builder-glow-border: #000;
    border: 2px solid #000 !important;
    background: #fff !important;
    animation: none !important;
}

.mypools-modular-children-builder .fi-fo-builder-items > li.fi-fo-builder-item:nth-child(even) {
    --mypools-builder-glow-rgb: 0, 0, 0;
    --mypools-builder-glow-border: #000;
    border: 2px solid #000 !important;
    background: #f6f8fa !important;
    animation: none !important;
}

@keyframes mypoolsBuilderGlow {
    0%,
    100% {
        box-shadow:
            0 0 0 rgba(var(--mypools-builder-glow-rgb), 0),
            0 1px 3px rgba(0, 0, 0, 0.04) !important;
    }
    50% {
        box-shadow:
            0 0 0 3px rgba(var(--mypools-builder-glow-rgb), 0.22),
            0 0 18px rgba(var(--mypools-builder-glow-rgb), 0.36) !important;
    }
}

.mypools-modular-builder .fi-fo-builder-item-header,
.mypools-modular-children-builder .fi-fo-builder-item-header {
    background: #f8fbfd !important;
    border-bottom: 1px solid #e2e8f0 !important;
    padding-top: 0.35rem !important;
    padding-bottom: 0.35rem !important;
    min-height: 2.25rem !important;
}

.mypools-modular-builder .fi-fo-builder-item-header-label,
.mypools-modular-children-builder .fi-fo-builder-item-header-label {
    font-weight: 700 !important;
    font-size: 0.8125rem !important;
}

.mypools-modular-builder > ul > li.fi-fo-builder-item.mypools-landing-section-card {
    border-width: 2px !important;
}

.mypools-modular-builder .fi-fo-builder-item-content {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

.mypools-modular-builder .fi-fo-field-wrp {
    gap: 0.35rem !important;
}

.mypools-modular-children-builder.fi-fo-builder .fi-fo-builder-items:empty::before {
    content: 'No components yet. Use Add component to build this container.';
    display: block;
    color: #6b7280;
    font-size: 12px;
    padding: 4px 0;
}

@media (prefers-reduced-motion: reduce) {
    .mypools-modular-builder > ul > li.fi-fo-builder-item.mypools-landing-section-card,
    .mypools-modular-children-builder .fi-fo-builder-items > li.fi-fo-builder-item.mypools-landing-section-card {
        animation: none !important;
    }
}