/* ============================================================
   BXC Theme "default" — desktop.css
   ------------------------------------------------------------
   Estilos específicos del tema. El design system unificado está
   en /public/css/bxc-design-system.css. Aquí solo se definen
   overrides puntuales del tema default.
   ============================================================ */

/* Inputs heredan tipografía del design system */
input {
    font-family: inherit;
    font-size: var(--bxc-font-size-md);
    font-weight: 400;
    letter-spacing: 0;
    width: 100%;
    overflow: hidden;
    border-style: none;
}

button {
    max-height: none;
    width: initial;
}

.bxc-container-full {
    margin: 0;
}

/* Tree branches */
.bxc-module-root {
    border-style: solid;
    border-width: 1px;
    border-color: var(--bxc-color-border-soft);
    border-radius: var(--bxc-radius-md);
    padding: 0;
    overflow: hidden;
}

.bxc-module-branch {
    padding: 0;
    border-style: solid;
    border-width: 1px 1px 0.5px 1px;
    border-color: var(--bxc-color-border-soft);
    border-radius: var(--bxc-radius-sm);
    margin: var(--bxc-space-2) 0;
}

.bxc-module-body {
    /* display: none por defecto; las vistas activan display:block cuando
       quieren mostrarlo. El design system ya aporta el padding. */
    padding: var(--bxc-space-4);
}

.module-tools {
    display: flex;
    align-items: center;
    gap: var(--bxc-space-2);
    flex-wrap: wrap;
}

.task-col {
    border-style: solid;
    border-width: 0;
    border-color: transparent;
}
.bxc-frame-content {
    width: 100%;
    padding: var(--bxc-space-6);
}

/* Frame layout: menu + content side by side on desktop */
.bxc-frame { min-height: 100vh; }
.bxc-frame-content-menu {
    width: 220px;
    background: var(--bxc-color-surface);
    padding: var(--bxc-space-4) var(--bxc-space-3);
    border-right: 1px solid var(--bxc-color-border-soft);
    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);
    color: var(--bxc-color-text-soft);
    text-decoration: none;
    border-radius: var(--bxc-radius-md);
    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: flex; align-items: center; }
.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;
}
a.bxc-frame-content-menu-item { text-decoration: none; color: inherit; }

@media (max-width: 768px) {
    .bxc-frame { flex-direction: column; }
    .bxc-frame-content-menu { width: 100%; border-right: 0; border-bottom: 1px solid var(--bxc-color-border-soft); }
    .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); }
}

/* Tabs */
.bxc-tabs .tabs-nav {
    display: flex;
    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;
    margin: 0;
    padding: var(--bxc-space-3) var(--bxc-space-4);
    background: transparent;
    color: var(--bxc-color-text-muted);
    border-radius: var(--bxc-radius-sm) var(--bxc-radius-sm) 0 0;
    border-bottom: 2px solid transparent;
    cursor: pointer;
    font-weight: 600;
    font-size: var(--bxc-font-size-sm);
    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; }
.bxc-tabpanel p { padding: 0; margin: 0; }
.bxc-tabs ul { padding: 0; margin: 0; }

/* File display */
.bxc-file-icon {
    font-size: var(--bxc-font-size-sm);
}
.bxc-file-name {
    font-size: var(--bxc-font-size-sm);
    overflow: hidden;
}
.bxc-file-image {
    width: 100%;
    height: 128px;
    background-size: cover;
    background-position: center;
}

.task-info {
    height: 100vh;
    overflow-y: auto;
}
.task-info #comments { display: none; }
.commentlist {
    height: calc(100vh - 350px);
    overflow-y: auto;
}
#respond #reply-title, #respond .logged-in-as, .commentlist .reply,
.commentlist .edit-link, .comment-form-comment label {
    display: none;
}
.comment-metadata a, .comment-author a {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
    color: inherit;
}
.comment-meta { font-size: var(--bxc-font-size-sm); }

.bxc-input-label { font-size: var(--bxc-font-size-xs); }
.user-info img { width: 100%; height: auto; }
.comment-form-comment textarea { width: 100%; }

#wp-custom_comment_text-editor-container .mce-edit-area iframe {
    height: 100px !important;
}

.bxc-input-textarea-front {
    background-color: var(--bxc-color-bg-soft);
    min-height: 128px;
    padding: var(--bxc-space-3);
}

.bxc-icono-interior { font-size: 94px; }
.bxc-task-parent-title { font-size: var(--bxc-font-size-sm); }

.module-tools-item.filter select {
    font-size: var(--bxc-font-size-sm);
    border-style: solid;
    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);
    width: auto;
}

#bxc-button-new-task {
    display: inline-flex;
}