/* Page Builder UI tweaks */
/* wwwroot/css/pagebuilder.css */

#pb .card.is-selected {
    outline: 2px solid var(--bs-primary);
}

#pb .card {
    cursor: pointer;
}

/* canvas area */
#pb #canvas {
    min-height: 320px;
    background: var(--bs-body-bg);
}

/* library buttons allow multi-line titles */
#pb #lib .btn {
    white-space: normal;
}

/* property panel spacing/labels */
#pb .pb-prop .form-label {
    margin-bottom: .25rem;
    font-weight: 500;
}

#pb .pb-prop:not(:last-child) {
    margin-bottom: .5rem;
}

/* (you had this too) keep adjacent prop spacing */
#pb .pb-prop + .pb-prop {
    margin-top: .5rem;
}

/* Page Builder chrome theme sync */

.pb-block {
    border-radius: .5rem;
    overflow: hidden;
}

/* default/light */
.pb-block-bar {
    background-color: #f8f9fa;
    color: #212529;
    border-bottom: 1px solid rgba(0,0,0,.06);
    font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
}

.pb-block-bar .btn {
    font-size: .7rem;
    line-height: 1.2;
    padding: .25rem .4rem;
    border-radius: .4rem;
}

/* dark mode */
html[data-theme="dark"] .pb-block-bar {
    background-color: #1f2937; /* a near-gray-800 vibe */
    color: #e5e7eb;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

html[data-theme="dark"] .pb-block-bar .btn.btn-outline-secondary {
    color: #e5e7eb;
    border-color: rgba(229,231,235,.3);
}

html[data-theme="dark"] .pb-block-bar .btn.btn-outline-secondary:hover {
    background-color: rgba(255,255,255,.07);
}

html[data-theme="dark"] .pb-block-bar .btn.btn-outline-danger {
    color: #f87171;
    border-color: rgba(248,113,113,.4);
}

html[data-theme="dark"] .pb-block-bar .btn.btn-outline-danger:hover {
    background-color: rgba(248,113,113,.07);
}

/* when a block is selected */
.pb-block.pb-selected {
    box-shadow: 0 0 0 2px rgba(13,110,253,.5);
}

html[data-theme="dark"] .pb-block.pb-selected {
    box-shadow: 0 0 0 2px rgba(59,130,246,.6);
}

/* Builder: isolate block body for smoother partial updates */
.pb-block-body {
    contain: content;
}

