/* =========================
   FRONT-END TAB STYLES
========================= */

.dtb-tabs-nav {
    display: flex;
    gap: 25px;
    justify-content: center;
    border-bottom: 0px solid #444;
    margin-bottom: 20px;
}

.dtb-tab-btn {
    background: none;
    border: none;
    color: #aaa;
    cursor: pointer;
    padding: 8px 15px;
    font-weight: 600;
 border-bottom: 2px solid #fff;
}

.dtb-tab-btn.dtb-active {
    color: #D7B856;
    border-bottom: 2px solid #D7B856;
}

/* Front-end panes are hidden by JS except the active one */
.dtb-tab-pane {
    display: none;
}

/* =========================
   EDITOR STYLES
========================= */

.wp-block-custom-dynamic-tabs .dtb-tab-pane-editor {
    border: 1px dashed #555;
    padding: 12px;
    margin-top: 12px;
}

.wp-block-custom-dynamic-tabs .dtb-tab-pane-title {
    display: block;
    margin-bottom: 8px;
}

.dtb-tab-actions {
    margin: 10px 0;
    display: flex;
    gap: 10px;
}

/* Optional: slightly dim non-selected panes if you ever add preview state */
.wp-block-custom-dynamic-tabs .dtb-tab-pane-editor.is-not-active {
    opacity: 0.4;
}

/* Keep your existing styling flavour */
.dtb-title-input {
    margin: 15px 0;
    width: 300px;
    padding: 8px;
}

.dtb-tab-wrap {
    display: inline-flex;
    align-items: center;
    margin-right: 16px;
}