/* ============================================================
   BXC Design System v1.2
   ------------------------------------------------------------
   Tokens (variables CSS) + componentes reutilizables.
   Estos estilos viven por encima de cualquier tema; cada tema
   puede sobreescribir los tokens en su propio desktop.css.
   ============================================================ */

:root {
    /* Paleta base */
    --bxc-color-bg:           #ffffff;
    --bxc-color-bg-soft:      #f5f7fa;
    --bxc-color-bg-muted:     #eef1f5;
    --bxc-color-surface:      #ffffff;
    --bxc-color-border:       #d9dde3;
    --bxc-color-border-soft:  #e7eaef;
    --bxc-color-text:         #1f2937;
    --bxc-color-text-soft:    #4b5563;
    --bxc-color-text-muted:   #6b7280;

    --bxc-color-primary:      #2271b1;
    --bxc-color-primary-600:  #1c64a2;
    --bxc-color-primary-700:  #135e96;
    --bxc-color-primary-soft: #e8f1fa;

    --bxc-color-success:      #2a7a2a;
    --bxc-color-success-soft: #f0fff0;
    --bxc-color-warning:      #b07d00;
    --bxc-color-warning-soft: #fff8e0;
    --bxc-color-danger:       #b32d2e;
    --bxc-color-danger-soft:  #fff0f0;

    /* Tipografía */
    --bxc-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                     "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    --bxc-font-mono: "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;

    --bxc-font-size-xs:   11px;
    --bxc-font-size-sm:   12px;
    --bxc-font-size-md:   14px;
    --bxc-font-size-lg:   16px;
    --bxc-font-size-xl:   18px;
    --bxc-font-size-2xl:  22px;
    --bxc-font-size-3xl:  28px;

    --bxc-line-height:    1.5;

    /* Espaciado (escala 4px) */
    --bxc-space-1:  4px;
    --bxc-space-2:  8px;
    --bxc-space-3:  12px;
    --bxc-space-4:  16px;
    --bxc-space-5:  20px;
    --bxc-space-6:  24px;
    --bxc-space-8:  32px;

    /* Radios y sombras */
    --bxc-radius-sm: 4px;
    --bxc-radius-md: 6px;
    --bxc-radius-lg: 10px;
    --bxc-radius-pill: 999px;

    --bxc-shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);
    --bxc-shadow-md: 0 2px 6px rgba(15, 23, 42, .10);
    --bxc-shadow-lg: 0 8px 24px rgba(15, 23, 42, .14);

    --bxc-transition: 180ms ease;
}

/* ===== Reset suave (no afecta al admin de WP) ===================== */
body.bxc-dashboard-body,
body.bxc-architecture-body,
body.bxc-credentials-body,
body.bxc-profile-body,
body.bxc-single-body {
    margin: 0;
    background: var(--bxc-color-bg-soft);
    color: var(--bxc-color-text);
    font-family: var(--bxc-font-sans);
    font-size: var(--bxc-font-size-md);
    line-height: var(--bxc-line-height);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body.bxc-dashboard-body *,
body.bxc-architecture-body *,
body.bxc-credentials-body *,
body.bxc-profile-body *,
body.bxc-single-body * {
    box-sizing: border-box;
}

/* ===== Tipografía unificada ======================================= */
body.bxc-dashboard-body h1,
body.bxc-architecture-body h1,
body.bxc-credentials-body h1,
body.bxc-profile-body h1,
body.bxc-single-body h1,
.bxc-page-title {
    margin: 0;
    font-size: var(--bxc-font-size-2xl);
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--bxc-color-text);
}

.bxc-page-subtitle {
    margin: 4px 0 0 0;
    font-size: var(--bxc-font-size-sm);
    color: var(--bxc-color-text-muted);
}

body.bxc-architecture-body h2,
body.bxc-credentials-body h2,
body.bxc-profile-body h2,
body.bxc-dashboard-body h2,
body.bxc-single-body h2 {
    margin: 0;
    font-size: var(--bxc-font-size-lg);
    font-weight: 600;
    color: var(--bxc-color-text);
}

body.bxc-architecture-body h3,
body.bxc-credentials-body h3,
body.bxc-profile-body h3,
body.bxc-dashboard-body h3,
body.bxc-single-body h3 {
    margin: 0;
    font-size: var(--bxc-font-size-md);
    font-weight: 600;
    color: var(--bxc-color-text);
}

body.bxc-architecture-body h4,
body.bxc-credentials-body h4,
body.bxc-profile-body h4,
body.bxc-dashboard-body h4,
body.bxc-single-body h4 {
    margin: 0;
    font-size: var(--bxc-font-size-sm);
    font-weight: 600;
    color: var(--bxc-color-text-soft);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

a { color: var(--bxc-color-primary); text-decoration: none; }
a:hover { color: var(--bxc-color-primary-700); text-decoration: underline; }

/* ===== Layout (frame + content) =================================== */
.bxc-container-full {
    margin: 0;
    padding: 0;
    background: var(--bxc-color-bg-soft);
}

.bxc-frame {
    min-height: 100vh;
    background: var(--bxc-color-bg-soft);
}

.bxc-frame-content {
    flex: 1;
    width: 100%;
    padding: var(--bxc-space-6);
    background: var(--bxc-color-bg-soft);
}

.bxc-frame-content > header.entry-header {
    padding: 0 0 var(--bxc-space-4) 0;
    margin-bottom: var(--bxc-space-5);
    border-bottom: 1px solid var(--bxc-color-border-soft);
}

/* ===== Sidebar / Menu ============================================ */
.bxc-frame-content-menu {
    width: 220px;
    background: var(--bxc-color-surface);
    border-right: 1px solid var(--bxc-color-border-soft);
    padding: var(--bxc-space-4) var(--bxc-space-3);
    flex-shrink: 0;
}

.bxc-frame-content-menu-items {
    display: flex;
    flex-direction: column;
    gap: var(--bxc-space-1);
}

.bxc-frame-content-menu-item {
    display: flex;
    align-items: center;
    gap: var(--bxc-space-3);
    padding: var(--bxc-space-3);
    border-radius: var(--bxc-radius-md);
    color: var(--bxc-color-text-soft);
    text-decoration: none;
    transition: background var(--bxc-transition), color var(--bxc-transition);
    cursor: pointer;
}

.bxc-frame-content-menu-item:hover {
    background: var(--bxc-color-bg-muted);
    color: var(--bxc-color-text);
    text-decoration: none;
}

.bxc-frame-content-menu-item.is-active {
    background: var(--bxc-color-primary-soft);
    color: var(--bxc-color-primary-700);
    font-weight: 600;
}

.bxc-frame-content-menu-item-icon { display: inline-flex; }
.bxc-frame-content-menu-item-icon .dashicons {
    font-size: 18px; width: 18px; height: 18px;
}
.bxc-frame-content-menu-item-title {
    font-size: var(--bxc-font-size-sm);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* ===== Cards / Modules =========================================== */
.bxc-module,
.bxc-module-root,
.bxc-module-branch {
    background: var(--bxc-color-surface);
    border: 1px solid var(--bxc-color-border-soft);
    border-radius: var(--bxc-radius-md);
    box-shadow: var(--bxc-shadow-sm);
    margin-bottom: var(--bxc-space-3);
    overflow: hidden;
}

.bxc-module-branch {
    border: 1px solid var(--bxc-color-border-soft);
    margin: var(--bxc-space-2) 0;
    border-radius: var(--bxc-radius-md);
}

.bxc-module-root { padding: 0; }

.bxc-module-head {
    padding: var(--bxc-space-3) var(--bxc-space-4);
    background: var(--bxc-color-bg-muted);
    border-bottom: 1px solid var(--bxc-color-border-soft);
    gap: var(--bxc-space-3);
}

.bxc-module-head .module-title h2,
.bxc-module-head .module-title h3,
.bxc-module-head .module-title h4 {
    line-height: 1.4;
}

.bxc-module-body {
    padding: var(--bxc-space-4);
    background: var(--bxc-color-surface);
}

/* ===== Botones =================================================== */
.bxc-btn,
body.bxc-dashboard-body button,
body.bxc-architecture-body button,
body.bxc-credentials-body button,
body.bxc-profile-body button,
body.bxc-single-body button,
body.bxc-dashboard-body .button,
body.bxc-architecture-body .button,
body.bxc-credentials-body .button,
body.bxc-profile-body .button,
body.bxc-single-body .button {
    display: inline-flex;
    align-items: center;
    gap: var(--bxc-space-1);
    padding: 6px 12px;
    background: var(--bxc-color-surface);
    color: var(--bxc-color-text-soft);
    border: 1px solid var(--bxc-color-border);
    border-radius: var(--bxc-radius-sm);
    font-size: var(--bxc-font-size-sm);
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
    height: auto;
    min-height: 30px;
    transition: background var(--bxc-transition), border-color var(--bxc-transition),
                color var(--bxc-transition);
}

body.bxc-dashboard-body button:hover,
body.bxc-architecture-body button:hover,
body.bxc-credentials-body button:hover,
body.bxc-profile-body button:hover,
body.bxc-single-body button:hover {
    background: var(--bxc-color-bg-muted);
    color: var(--bxc-color-text);
    border-color: var(--bxc-color-border);
}

body.bxc-dashboard-body button .dashicons,
body.bxc-architecture-body button .dashicons,
body.bxc-credentials-body button .dashicons,
body.bxc-profile-body button .dashicons,
body.bxc-single-body button .dashicons {
    font-size: 14px; width: 14px; height: 14px;
}

.bxc-btn-primary,
.button-primary {
    background: var(--bxc-color-primary) !important;
    color: #fff !important;
    border-color: var(--bxc-color-primary) !important;
}
.bxc-btn-primary:hover,
.button-primary:hover {
    background: var(--bxc-color-primary-700) !important;
    border-color: var(--bxc-color-primary-700) !important;
    color: #fff !important;
}

.bxc-btn-danger {
    background: var(--bxc-color-danger) !important;
    color: #fff !important;
    border-color: var(--bxc-color-danger) !important;
}

.bxc-btn-ghost {
    background: transparent !important;
    border-color: transparent !important;
    color: var(--bxc-color-text-soft) !important;
}
.bxc-btn-ghost:hover {
    background: var(--bxc-color-bg-muted) !important;
}

.bxc-btn-icon {
    padding: 4px 6px;
    min-height: 26px;
}

/* ===== Inputs / Forms ============================================ */
body.bxc-dashboard-body input[type="text"],
body.bxc-architecture-body input[type="text"],
body.bxc-credentials-body input[type="text"],
body.bxc-profile-body input[type="text"],
body.bxc-single-body input[type="text"],
body.bxc-dashboard-body input[type="email"],
body.bxc-architecture-body input[type="email"],
body.bxc-credentials-body input[type="email"],
body.bxc-profile-body input[type="email"],
body.bxc-single-body input[type="email"],
body.bxc-dashboard-body input[type="tel"],
body.bxc-architecture-body input[type="tel"],
body.bxc-credentials-body input[type="tel"],
body.bxc-profile-body input[type="tel"],
body.bxc-single-body input[type="tel"],
body.bxc-dashboard-body input[type="date"],
body.bxc-architecture-body input[type="date"],
body.bxc-credentials-body input[type="date"],
body.bxc-profile-body input[type="date"],
body.bxc-single-body input[type="date"],
body.bxc-dashboard-body input[type="number"],
body.bxc-architecture-body input[type="number"],
body.bxc-credentials-body input[type="number"],
body.bxc-profile-body input[type="number"],
body.bxc-single-body input[type="number"],
body.bxc-dashboard-body input[type="search"],
body.bxc-architecture-body input[type="search"],
body.bxc-credentials-body input[type="search"],
body.bxc-profile-body input[type="search"],
body.bxc-single-body input[type="search"],
body.bxc-dashboard-body textarea,
body.bxc-architecture-body textarea,
body.bxc-credentials-body textarea,
body.bxc-profile-body textarea,
body.bxc-single-body textarea,
body.bxc-dashboard-body select,
body.bxc-architecture-body select,
body.bxc-credentials-body select,
body.bxc-profile-body select,
body.bxc-single-body select {
    width: 100%;
    padding: 8px 10px;
    background: var(--bxc-color-surface);
    border: 1px solid var(--bxc-color-border);
    border-radius: var(--bxc-radius-sm);
    font-size: var(--bxc-font-size-md);
    color: var(--bxc-color-text);
    font-family: inherit;
    transition: border-color var(--bxc-transition), box-shadow var(--bxc-transition);
}

body.bxc-dashboard-body input:focus,
body.bxc-architecture-body input:focus,
body.bxc-credentials-body input:focus,
body.bxc-profile-body input:focus,
body.bxc-single-body input:focus,
body.bxc-dashboard-body textarea:focus,
body.bxc-architecture-body textarea:focus,
body.bxc-credentials-body textarea:focus,
body.bxc-profile-body textarea:focus,
body.bxc-single-body textarea:focus,
body.bxc-dashboard-body select:focus,
body.bxc-architecture-body select:focus,
body.bxc-credentials-body select:focus,
body.bxc-profile-body select:focus,
body.bxc-single-body select:focus {
    outline: none;
    border-color: var(--bxc-color-primary);
    box-shadow: 0 0 0 3px var(--bxc-color-primary-soft);
}

.bxc-input-label label {
    display: block;
    font-size: var(--bxc-font-size-xs);
    font-weight: 700;
    color: var(--bxc-color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 4px;
}

.bxc-input-field { font-size: var(--bxc-font-size-md); color: var(--bxc-color-text); }

.bxc-input-textarea-front {
    background: var(--bxc-color-bg-soft);
    border-radius: var(--bxc-radius-sm);
    padding: var(--bxc-space-3);
    min-height: 80px;
    white-space: pre-wrap;
    color: var(--bxc-color-text-soft);
}

/* ===== Tablas ==================================================== */
.bxc-table,
.bxc-container .bxc-row-head,
.bxc-container .task-row,
.bxc-container .bxc-row {
    font-size: var(--bxc-font-size-md);
}

.bxc-row-head {
    background: var(--bxc-color-bg-muted);
    border-bottom: 2px solid var(--bxc-color-border-soft);
    font-weight: 600;
    color: var(--bxc-color-text-soft);
    font-size: var(--bxc-font-size-sm);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.bxc-row,
.task-row {
    padding: var(--bxc-space-2) 0;
    border-bottom: 1px solid var(--bxc-color-border-soft);
    background: var(--bxc-color-surface);
    transition: background var(--bxc-transition);
}

.bxc-row:hover,
.task-row:hover {
    background: var(--bxc-color-bg-soft);
}

.task-col {
    padding: var(--bxc-space-2) var(--bxc-space-3);
    word-break: break-word;
    font-size: var(--bxc-font-size-md);
}

/* ===== Badges / Pills ============================================ */
.bxc-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: var(--bxc-radius-pill);
    font-size: var(--bxc-font-size-xs);
    font-weight: 700;
    background: var(--bxc-color-bg-muted);
    color: var(--bxc-color-text-soft);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.bxc-badge-primary   { background: var(--bxc-color-primary-soft);  color: var(--bxc-color-primary-700); }
.bxc-badge-success   { background: var(--bxc-color-success-soft);  color: var(--bxc-color-success); }
.bxc-badge-warning   { background: var(--bxc-color-warning-soft);  color: var(--bxc-color-warning); }
.bxc-badge-danger    { background: var(--bxc-color-danger-soft);   color: var(--bxc-color-danger); }

/* ===== Tabs ====================================================== */
.bxc-tabs .tabs-nav {
    display: flex;
    gap: var(--bxc-space-1);
    padding: 0;
    margin: 0 0 var(--bxc-space-4) 0;
    border-bottom: 1px solid var(--bxc-color-border-soft);
}

.bxc-tabs .tabs-nav li {
    list-style: none;
    padding: var(--bxc-space-3) var(--bxc-space-4);
    margin: 0;
    background: transparent;
    color: var(--bxc-color-text-muted);
    font-weight: 600;
    font-size: var(--bxc-font-size-sm);
    border-radius: var(--bxc-radius-sm) var(--bxc-radius-sm) 0 0;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: color var(--bxc-transition), border-color var(--bxc-transition);
}

.bxc-tabs .tabs-nav li:hover { color: var(--bxc-color-text); }

.bxc-tabs .tabs-nav li.active {
    background: transparent;
    color: var(--bxc-color-primary-700);
    border-bottom-color: var(--bxc-color-primary);
}

.bxc-tabpanel { display: none; }
.bxc-tabpanel.active { display: block; }

/* ===== Module tools (header actions) ============================= */
.module-tools {
    display: flex;
    align-items: center;
    gap: var(--bxc-space-2);
    flex-wrap: wrap;
}

.module-tools-item.filter select {
    font-size: var(--bxc-font-size-sm);
    border: 1px solid var(--bxc-color-border);
    border-radius: var(--bxc-radius-sm);
    padding: 4px 8px;
    margin-right: var(--bxc-space-2);
    background: var(--bxc-color-surface);
}

.module-tools-item.filter label {
    font-size: var(--bxc-font-size-xs);
    color: var(--bxc-color-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-right: 4px;
}

/* ===== Modal (sin doble scroll) ================================== */
.modal-board {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(2px);
    display: none;
    z-index: 99999;
}

.modal-board.is-open { display: flex; align-items: stretch; justify-content: stretch; }

.modal-board-content {
    position: relative;
    margin: auto;
    width: 92vw;
    height: 92vh;
    background: var(--bxc-color-surface);
    border-radius: var(--bxc-radius-lg);
    overflow: hidden;
    box-shadow: var(--bxc-shadow-lg);
    display: flex;
    flex-direction: column;
}

.modal-board-close {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 100000;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid var(--bxc-color-border);
    border-radius: var(--bxc-radius-pill);
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 18px;
    color: var(--bxc-color-text);
    transition: background var(--bxc-transition);
}

.modal-board-close:hover { background: var(--bxc-color-bg-muted); }

.modal-board-content iframe {
    width: 100%;
    flex: 1 1 auto;
    border: 0;
    background: #fff;
    /* El iframe maneja SU propio scroll; el contenedor NO debe tener overflow */
    overflow: hidden;
}

/* ===== Toast / Inline feedback =================================== */
.bxc-toast {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 100001;
    padding: var(--bxc-space-3) var(--bxc-space-4);
    border-radius: var(--bxc-radius-md);
    background: var(--bxc-color-text);
    color: #fff;
    font-size: var(--bxc-font-size-sm);
    font-weight: 600;
    box-shadow: var(--bxc-shadow-lg);
    transform: translateY(20px);
    opacity: 0;
    transition: transform var(--bxc-transition), opacity var(--bxc-transition);
    pointer-events: none;
}

.bxc-toast.is-visible { transform: translateY(0); opacity: 1; }
.bxc-toast.is-success { background: var(--bxc-color-success); }
.bxc-toast.is-error   { background: var(--bxc-color-danger); }
.bxc-toast.is-info    { background: var(--bxc-color-primary); }

.bxc-inline-feedback {
    padding: var(--bxc-space-2) var(--bxc-space-3);
    border-radius: var(--bxc-radius-sm);
    font-size: var(--bxc-font-size-sm);
    margin-top: var(--bxc-space-2);
    display: inline-flex;
    align-items: center;
    gap: var(--bxc-space-2);
}
.bxc-inline-feedback.is-loading { background: var(--bxc-color-primary-soft); color: var(--bxc-color-primary-700); }
.bxc-inline-feedback.is-success { background: var(--bxc-color-success-soft); color: var(--bxc-color-success); }
.bxc-inline-feedback.is-error   { background: var(--bxc-color-danger-soft); color: var(--bxc-color-danger); }

.bxc-spinner {
    width: 14px;
    height: 14px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    display: inline-block;
    animation: bxc-spin 0.7s linear infinite;
}

@keyframes bxc-spin { to { transform: rotate(360deg); } }

/* ===== Search / Filter bar ======================================= */
.bxc-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: var(--bxc-space-2);
    align-items: center;
    padding: var(--bxc-space-3) var(--bxc-space-4);
    background: var(--bxc-color-surface);
    border: 1px solid var(--bxc-color-border-soft);
    border-radius: var(--bxc-radius-md);
    margin-bottom: var(--bxc-space-4);
}

.bxc-toolbar .bxc-search {
    position: relative;
    flex: 1 1 240px;
    min-width: 200px;
}

.bxc-toolbar .bxc-search .dashicons {
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
    color: var(--bxc-color-text-muted);
    font-size: 16px;
    width: 16px; height: 16px;
}

.bxc-toolbar .bxc-search input {
    padding-left: 32px !important;
}

.bxc-toolbar select {
    width: auto;
    min-width: 160px;
}

/* ===== Stat pills (resumen por agencia) ========================= */
.bxc-stats {
    display: inline-flex;
    align-items: center;
    gap: var(--bxc-space-2);
    flex-wrap: wrap;
}

.bxc-stat {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    background: var(--bxc-color-bg-muted);
    color: var(--bxc-color-text-soft);
    border-radius: var(--bxc-radius-pill);
    font-size: var(--bxc-font-size-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.bxc-stat .dashicons {
    font-size: 13px;
    width: 13px;
    height: 13px;
}

.bxc-stat strong { color: var(--bxc-color-text); font-weight: 700; }

/* ===== Empty state =============================================== */
.bxc-empty-state {
    text-align: center;
    padding: var(--bxc-space-8) var(--bxc-space-4);
    color: var(--bxc-color-text-muted);
}

.bxc-empty-state .dashicons {
    font-size: 48px;
    width: 48px;
    height: 48px;
    color: var(--bxc-color-border);
    margin-bottom: var(--bxc-space-3);
}

.bxc-empty-state h3 {
    margin: 0 0 var(--bxc-space-2) 0;
    color: var(--bxc-color-text-soft);
    text-transform: none;
    letter-spacing: 0;
}

.bxc-empty-state p {
    margin: 0;
    font-size: var(--bxc-font-size-sm);
}

/* ===== Password field (show/hide) =============================== */
.bxc-password-field {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: var(--bxc-space-1);
}

.bxc-password-field .bxc-password-value {
    font-family: var(--bxc-font-mono);
    font-size: var(--bxc-font-size-sm);
    background: var(--bxc-color-bg-soft);
    padding: 4px 8px;
    border-radius: var(--bxc-radius-sm);
    min-width: 80px;
    cursor: pointer;
    transition: background var(--bxc-transition);
}

.bxc-password-field .bxc-password-value:hover {
    background: var(--bxc-color-primary-soft);
}

.bxc-password-field .bxc-password-toggle {
    padding: 4px 6px;
    min-height: auto;
    background: transparent;
    border: 1px solid var(--bxc-color-border);
}

/* ===== Profile photo ============================================ */
.bxc-profile-photo {
    width: 128px;
    height: 128px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--bxc-color-surface);
    box-shadow: var(--bxc-shadow-md);
    background: var(--bxc-color-bg-muted);
}

.bxc-profile-photo-actions {
    display: flex;
    gap: var(--bxc-space-2);
    margin-top: var(--bxc-space-3);
}

/* ===== Kanban column archived "view all" ======================== */
.bxc-archived-more {
    text-align: center;
    padding: var(--bxc-space-3);
    margin-top: var(--bxc-space-2);
    background: var(--bxc-color-bg-soft);
    border-radius: var(--bxc-radius-sm);
    font-size: var(--bxc-font-size-sm);
}

/* ===== Parent selector (rediseñado) ============================= */
.bxc-parent-selector {
    background: var(--bxc-color-bg-soft);
    border: 1px solid var(--bxc-color-border-soft);
    border-radius: var(--bxc-radius-md);
    padding: var(--bxc-space-3);
}

.bxc-parent-selector select {
    width: 100%;
    margin-bottom: var(--bxc-space-2);
}

.bxc-parent-selector .bxc-parent-breadcrumb {
    font-size: var(--bxc-font-size-xs);
    color: var(--bxc-color-text-muted);
    margin-top: var(--bxc-space-2);
}

.bxc-parent-selector .bxc-parent-breadcrumb .dashicons {
    font-size: 11px;
    width: 11px; height: 11px;
    vertical-align: middle;
}

/* ===== Tabs (mobile) ============================================ */
@media (max-width: 768px) {
    .bxc-frame { flex-direction: column; }
    .bxc-frame-content-menu { width: 100%; }
    .bxc-frame-content-menu-items { flex-direction: row; flex-wrap: wrap; }
    .bxc-frame-content-menu-item-title { display: none; }
    .bxc-frame-content-menu-item { padding: var(--bxc-space-2); }
    .bxc-frame-content { padding: var(--bxc-space-3); }
}

/* ===== Hide wpadminbar in front-end BXC pages =================== */
body.bxc-dashboard-body #wpadminbar,
body.bxc-architecture-body #wpadminbar,
body.bxc-credentials-body #wpadminbar,
body.bxc-profile-body #wpadminbar,
body.bxc-single-body #wpadminbar { display: none !important; }