.xpd .doc-wrap { width: 100%; max-width: 1900px; margin: 0 auto; padding: 6px 28px 60px; box-sizing: border-box; font-family: 'Lexend', sans-serif; } .xpd .doc-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 16px; } .xpd .doc-title { font-size: 26px; font-weight: 700; letter-spacing: -.4px; color: var(--propia-text-h1); margin: 0 0 2px; } .xpd .doc-sub { font-size: 13.5px; color: var(--propia-text-muted); margin: 0; } .xpd .doc-head-actions { margin-left: auto; display: flex; gap: 9px; } .xpd .doc-btn-primary { display: inline-flex; align-items: center; gap: 7px; border: 0; background: var(--propia-primary, var(--propia-brand)); color: var(--propia-text-inverse); font-weight: 600; font-size: 13.5px; padding: 9px 16px; border-radius: 10px; cursor: pointer; white-space: nowrap; box-shadow: 0 6px 16px rgba(109,79,227,.25); } .xpd .doc-btn-primary:hover:not(:disabled) { background: var(--propia-brand-hover); } .xpd .doc-btn-primary:disabled { opacity: .55; cursor: default; box-shadow: none; } .xpd .doc-btn-primary.sm { padding: 6px 12px; font-size: 12.5px; box-shadow: none; } .xpd .doc-btn-primary.full { width: 100%; justify-content: center; } .xpd .doc-btn-soft { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--propia-brand-border); background: var(--propia-brand-soft); color: var(--propia-brand); font-weight: 600; font-size: 13px; padding: 9px 15px; border-radius: 10px; cursor: pointer; } .xpd .doc-btn-soft:hover:not(:disabled) { background: #E6DEFA; } .xpd .doc-btn-soft.sm { padding: 6px 11px; font-size: 12px; } .xpd .doc-btn-soft:disabled { opacity: .5; cursor: default; } .xpd .doc-btn-ghost { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--propia-border-card); background: var(--propia-bg-card); color: var(--propia-text-secondary); font-weight: 600; font-size: 13px; padding: 8px 14px; border-radius: 10px; cursor: pointer; } .xpd .doc-btn-ghost:hover:not(:disabled) { border-color: var(--propia-brand); color: var(--propia-brand); } .xpd .doc-btn-ghost.sm { padding: 6px 12px; font-size: 12.5px; } .xpd .doc-btn-ghost:disabled { opacity: .5; cursor: default; } .xpd .doc-btn-danger { border: 1px solid #F0D2D2; background: var(--propia-bg-card); color: #C0392B; font-weight: 600; font-size: 12.5px; padding: 6px 12px; border-radius: 10px; cursor: pointer; } .xpd .doc-btn-danger:hover { background: #FDF3F3; } .xpd .doc-btn-danger.sm { padding: 6px 11px; } .xpd .doc-tabs { display: flex; gap: 8px; margin-bottom: 16px; } .xpd .doc-tab { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 700; padding: 9px 16px; border-radius: 10px; border: 1px solid var(--propia-border-card); color: var(--propia-text-secondary); background: var(--propia-bg-card); cursor: pointer; } .xpd .doc-tab:hover { border-color: var(--propia-brand); } .xpd .doc-tab.on { background: var(--propia-brand); color: var(--propia-text-inverse); border-color: var(--propia-brand); } .xpd .doc-banner { border-radius: 11px; padding: 10px 14px; font-size: 12.5px; font-weight: 600; margin-bottom: 12px; } .xpd .doc-banner.ok { background: var(--propia-ok-soft); border: 1px solid #B6E2C9; color: #15703F; } .xpd .doc-banner.err { background: var(--propia-danger-soft); border: 1px solid #F5C2C2; color: #A1352E; } .xpd .doc-banner.info { background: #EAF1FB; border: 1px solid #C9DCF5; color: #2E5AA1; } .xpd .doc-loading { text-align: center; padding: 50px 0; } .xpd .doc-empty { background: var(--propia-bg-card); border: 1px dashed #D6DEE6; border-radius: 14px; padding: 40px 20px; text-align: center; color: var(--propia-text-faint); font-size: 13.5px; } .xpd .doc-empty i { display: block; font-size: 30px; margin-bottom: 10px; color: var(--propia-text-faint); } /* Expedientes grid */ .xpd .exp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; } .xpd .exp-card { text-align: left; background: var(--propia-bg-card); border: 1px solid var(--propia-border-card); border-radius: 14px; padding: 18px; box-shadow: 0 1px 2px rgba(45,62,80,.05); cursor: pointer; } .xpd .exp-card:hover { border-color: var(--propia-brand); box-shadow: 0 12px 28px rgba(109,79,227,.12); } .xpd .exp-card-top { display: flex; align-items: center; gap: 9px; margin-bottom: 11px; } .xpd .exp-serie { font-size: 10px; font-weight: 800; padding: 4px 9px; border-radius: 7px; } .xpd .exp-codigo { font-size: 11px; color: var(--propia-text-faint); font-family: ui-monospace, monospace; } .xpd .exp-nombre { font-size: 15.5px; font-weight: 800; color: var(--propia-text-h1); letter-spacing: -.3px; } .xpd .exp-subserie { font-size: 12px; color: var(--propia-text-muted); margin-top: 2px; } .xpd .exp-progress { display: flex; align-items: center; gap: 10px; margin-top: 14px; } .xpd .exp-bar { flex: 1; height: 7px; border-radius: 5px; background: var(--propia-border-divider); overflow: hidden; } .xpd .exp-bar-fill { height: 100%; border-radius: 5px; background: linear-gradient(90deg,#8366F0,var(--propia-brand)); } .xpd .exp-count { font-size: 11.5px; font-weight: 800; color: var(--propia-text-secondary); } .xpd .exp-badges { margin-top: 10px; } .xpd .exp-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 700; padding: 4px 9px; border-radius: 7px; } .xpd .exp-badge.ok { color: #1A8754; background: var(--propia-ok-soft); } .xpd .exp-badge.pend { color: #B45309; background: var(--propia-warn-soft); } /* Modales base */ .xpd .doc-ov { position: fixed; inset: 0; background: rgba(27,42,58,.55); z-index: 1200; } .xpd .doc-modal { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 1210; background: var(--propia-bg-card); border-radius: 16px; box-shadow: 0 30px 70px rgba(27,42,58,.4); display: flex; flex-direction: column; max-height: 94vh; } .xpd .doc-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--propia-border-divider); flex-shrink: 0; } .xpd .doc-modal-head h5 { font-size: 16px; font-weight: 800; color: var(--propia-text-h1); letter-spacing: -.3px; } .xpd .doc-modal-body { padding: 18px 20px; overflow-y: auto; } .xpd .doc-modal-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 20px; border-top: 1px solid var(--propia-border-divider); flex-shrink: 0; } .xpd .doc-x { width: 34px; height: 34px; border-radius: 9px; border: 1px solid var(--propia-border-card); background: var(--propia-bg-card); color: var(--propia-text-muted); display: flex; align-items: center; justify-content: center; cursor: pointer; flex-shrink: 0; font-size: 17px; } .xpd .doc-x:hover { background: var(--propia-bg-app); color: var(--propia-text-body); } .xpd .doc-lbl { display: block; font-size: 11px; color: var(--propia-text-muted); font-weight: 700; margin-bottom: 5px; } .xpd .doc-input { width: 100%; border: 1px solid var(--propia-border-card); border-radius: 9px; padding: 9px 12px; font-size: 13.5px; color: var(--propia-text-body); outline: 0; background: var(--propia-bg-card); box-sizing: border-box; } .xpd .doc-input:focus { border-color: var(--propia-brand); } .xpd .doc-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; } .xpd .doc-dropzone { display: flex; flex-direction: column; align-items: center; gap: 4px; border: 2px dashed var(--propia-brand-border); border-radius: 12px; padding: 22px; cursor: pointer; text-align: center; color: #9A86E8; background: var(--propia-brand-soft-2); } .xpd .doc-dropzone.sm { padding: 14px; } .xpd .doc-dropzone:hover { border-color: var(--propia-brand); } .xpd .doc-dropzone i { font-size: 26px; } .xpd .doc-dropzone span { font-size: 13px; font-weight: 700; color: var(--propia-text-body); } .xpd .doc-dropzone small { font-size: 10.5px; color: #9A86E8; } .xpd .doc-tagbtn { font-size: 11px; font-weight: 700; padding: 4px 11px; border-radius: 999px; border: 1px solid; background: var(--propia-bg-card); cursor: pointer; } .xpd .exp-preview { background: var(--propia-brand-soft-2); border: 1px solid #EEE9FB; border-radius: 11px; padding: 11px 13px; margin-top: 12px; } .xpd .exp-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 10px; } .xpd .exp-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 600; color: var(--propia-text-secondary); background: var(--propia-bg-card); border: 1px solid var(--propia-border-card); padding: 5px 9px; border-radius: 8px; } .xpd .exp-chip-x { border: 0; background: transparent; color: var(--propia-text-faint); cursor: pointer; display: flex; font-size: 13px; padding: 0; } .xpd .exp-chip-x:hover { color: #D7263D; } .xpd .exp-add { display: flex; gap: 7px; } /* Expediente detail (3 cols) */ .xpd .exp-modal { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 1210; background: var(--propia-bg-card); border-radius: 16px; box-shadow: 0 30px 70px rgba(27,42,58,.45); width: 96vw; height: 92vh; display: flex; flex-direction: column; overflow: hidden; } .xpd .exp-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 22px; border-bottom: 1px solid var(--propia-border-divider); flex-shrink: 0; } .xpd .exp-modal-icon { width: 44px; height: 44px; border-radius: 11px; display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; } .xpd .exp-modal-title { font-size: 18px; font-weight: 800; color: var(--propia-text-h1); letter-spacing: -.3px; } .xpd .exp-cols { flex: 1; display: grid; grid-template-columns: 320px 1fr 360px; min-height: 0; } .xpd .exp-col-left { display: flex; flex-direction: column; min-height: 0; border-right: 1px solid var(--propia-border-divider); background: var(--propia-bg-card-soft); padding: 18px 20px; overflow-y: auto; } .xpd .exp-col-center { display: flex; flex-direction: column; min-height: 0; background: #EEF1F5; } .xpd .exp-col-right { display: flex; flex-direction: column; min-height: 0; border-left: 1px solid var(--propia-border-divider); } .xpd .exp-sec-title { font-size: 11px; letter-spacing: .5px; color: var(--propia-text-faint); font-weight: 700; margin-bottom: 8px; text-transform: uppercase; } .xpd .exp-doc-name { font-size: 13px; font-weight: 700; color: var(--propia-text-body); margin-bottom: 12px; } .xpd .exp-meta-list { display: flex; flex-direction: column; gap: 1px; background: var(--propia-border-divider); border: 1px solid var(--propia-border-divider); border-radius: 10px; overflow: hidden; margin-bottom: 18px; } .xpd .exp-meta-row { background: var(--propia-bg-card); padding: 10px 13px; } .xpd .exp-meta-k { font-size: 10.5px; color: var(--propia-text-faint); font-weight: 600; } .xpd .exp-meta-v { font-size: 13px; font-weight: 600; color: var(--propia-text-body); margin-top: 1px; } .xpd .exp-viewer-bar { flex-shrink: 0; display: flex; align-items: center; gap: 10px; padding: 12px 18px; background: var(--propia-bg-card); border-bottom: 1px solid var(--propia-border-card); } .xpd .exp-viewer-body { flex: 1; overflow-y: auto; padding: 24px; display: flex; justify-content: center; } .xpd .exp-viewer-empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: var(--propia-text-faint); font-size: 12.5px; text-align: center; padding: 20px; } .xpd .exp-viewer-empty i { font-size: 26px; color: var(--propia-text-faint); } /* Visor inline real (imagen / PDF via data URI) */ .xpd .exp-viewer-img { max-width: 100%; max-height: 100%; object-fit: contain; margin: auto; border-radius: 6px; box-shadow: 0 8px 30px rgba(27,42,58,.15); background: var(--propia-bg-card); } .xpd .exp-viewer-frame { flex: 1 1 auto; width: 100%; align-self: stretch; min-height: 560px; border: 0; border-radius: 6px; background: var(--propia-bg-card); box-shadow: 0 8px 30px rgba(27,42,58,.15); } /* Visor de texto plano (txt/csv/md/log/json) */ .xpd .exp-viewer-text { width: 100%; align-self: stretch; margin: 0; background: var(--propia-bg-card); border-radius: 6px; box-shadow: 0 8px 30px rgba(27,42,58,.15); padding: 22px 26px; font-family: 'JetBrains Mono','Cascadia Code',Consolas,monospace; font-size: 12.5px; line-height: 1.55; color: var(--propia-text-body); white-space: pre-wrap; word-break: break-word; overflow-x: auto; } /* Visor de Excel / Word renderizados a HTML */ .xpd .exp-viewer-html { width: 100%; align-self: stretch; background: var(--propia-bg-card); border-radius: 6px; box-shadow: 0 8px 30px rgba(27,42,58,.15); padding: 22px 26px; overflow-x: auto; color: var(--propia-text-body); } .xpd .exp-viewer-html .prev-sheet { margin-bottom: 22px; } .xpd .exp-viewer-html .prev-sheet-name { font-size: 11px; font-weight: 800; color: var(--propia-brand); text-transform: uppercase; letter-spacing: .3px; margin-bottom: 7px; } .xpd .exp-viewer-html .prev-table { border-collapse: collapse; width: auto; max-width: 100%; font-size: 12px; margin-bottom: 6px; } .xpd .exp-viewer-html .prev-table td { border: 1px solid var(--propia-border-card); padding: 5px 9px; vertical-align: top; white-space: pre-wrap; } .xpd .exp-viewer-html .prev-table tr:first-child td { background: var(--propia-bg-app); font-weight: 700; color: var(--propia-text-h1); } .xpd .exp-viewer-html .prev-empty, .xpd .exp-viewer-html .prev-more { font-size: 11.5px; color: var(--propia-text-faint); margin: 4px 0 14px; } .xpd .exp-viewer-html .prev-doc h2 { font-size: 18px; font-weight: 800; color: var(--propia-text-h1); margin: 14px 0 8px; } .xpd .exp-viewer-html .prev-doc h3 { font-size: 14.5px; font-weight: 800; color: var(--propia-text-body); margin: 12px 0 6px; } .xpd .exp-viewer-html .prev-doc p { font-size: 13px; line-height: 1.6; margin: 0 0 8px; } .xpd .exp-ver-link { border: 0; background: transparent; color: var(--propia-brand); font-weight: 700; cursor: pointer; padding: 0; font-size: inherit; text-decoration: underline; } .xpd .exp-page { width: 100%; max-width: 520px; background: var(--propia-bg-card); border-radius: 6px; box-shadow: 0 8px 30px rgba(27,42,58,.15); padding: 44px 48px; min-height: 560px; } .xpd .exp-page-head { display: flex; align-items: center; justify-content: space-between; border-bottom: 2px solid var(--propia-text-h1); padding-bottom: 12px; margin-bottom: 22px; } .xpd .exp-page-co { font-size: 13px; font-weight: 800; color: var(--propia-text-h1); } .xpd .exp-page-ext { font-size: 9px; font-weight: 800; color: var(--propia-brand); background: var(--propia-brand-soft); padding: 3px 8px; border-radius: 5px; } .xpd .exp-page-title { font-size: 17px; font-weight: 800; color: var(--propia-text-h1); margin-bottom: 6px; } .xpd .exp-page-sub { font-size: 11px; color: var(--propia-text-faint); margin-bottom: 22px; } .xpd .exp-page-lines { display: flex; flex-direction: column; gap: 9px; } .xpd .exp-page-lines > div { height: 9px; border-radius: 3px; background: var(--propia-border-divider); } .xpd .exp-tips { flex: 1; overflow-y: auto; padding: 4px 16px; display: flex; flex-direction: column; gap: 9px; } .xpd .exp-tip { border: 1px solid var(--propia-border-card); border-radius: 12px; padding: 12px 13px; background: var(--propia-bg-card); } .xpd .exp-tip.sel { border-color: var(--propia-brand); background: var(--propia-brand-soft-2); } .xpd .exp-tip-top { display: flex; align-items: center; gap: 10px; cursor: pointer; } .xpd .exp-tip-ic { width: 34px; height: 34px; border-radius: 9px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--propia-bg-app); color: var(--propia-text-faint); } .xpd .exp-tip-ic.ok { background: var(--propia-ok-soft); color: #1A8754; } .xpd .exp-tip-name { font-size: 12.5px; font-weight: 700; color: var(--propia-text-body); } .xpd .exp-oblig { font-size: 8.5px; font-weight: 800; color: #B45309; background: var(--propia-warn-soft); padding: 2px 5px; border-radius: 4px; } .xpd .exp-tip-sub { font-size: 10.5px; color: var(--propia-text-faint); margin-top: 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .xpd .exp-tip-dup { border: 0; background: transparent; color: var(--propia-text-faint); cursor: pointer; display: flex; font-size: 13px; flex-shrink: 0; } .xpd .exp-tip-dup:hover { color: var(--propia-brand); } .xpd .exp-tip-del { border: 0; background: transparent; color: var(--propia-text-faint); cursor: pointer; display: flex; font-size: 14px; flex-shrink: 0; } .xpd .exp-tip-del:hover { color: #D7263D; } .xpd .exp-tip-acts { display: flex; gap: 6px; margin-top: 9px; } .xpd .doc-btn-soft.on { background: var(--propia-brand-soft); border-color: var(--propia-brand); color: var(--propia-brand); } /* Panel de versiones de una tipologia */ .xpd .exp-tip-vers { margin-top: 9px; border-top: 1px dashed var(--propia-border-card); padding-top: 9px; display: flex; flex-direction: column; gap: 6px; } .xpd .exp-ver-row { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 8px; background: var(--propia-bg-table-head); } .xpd .exp-ver-row.sel { background: var(--propia-brand-soft); } .xpd .exp-ver-badge { font-size: 10px; font-weight: 800; color: var(--propia-brand); background: var(--propia-brand-soft); border: 1px solid var(--propia-brand-border); border-radius: 6px; padding: 2px 6px; flex-shrink: 0; } .xpd .exp-ver-name { font-size: 11.5px; font-weight: 700; color: var(--propia-text-body); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .xpd .exp-ver-meta { font-size: 10px; color: #94A7BA; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .xpd .exp-ver-btn { border: 1px solid var(--propia-border-card); background: var(--propia-bg-card); border-radius: 6px; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; color: var(--propia-text-secondary); cursor: pointer; flex-shrink: 0; } .xpd .exp-ver-btn:hover { border-color: var(--propia-brand); color: var(--propia-brand); } /* Config (3 cols) */ .xpd .cfg-cols { flex: 1; display: grid; grid-template-columns: repeat(3, 1fr); min-height: 0; overflow: hidden; } .xpd .cfg-col { display: flex; flex-direction: column; min-height: 0; border-right: 1px solid var(--propia-border-divider); padding: 14px 14px 0; } .xpd .cfg-col:last-child { border-right: 0; } .xpd .cfg-col-title { font-size: 12px; font-weight: 800; color: var(--propia-text-h1); margin-bottom: 8px; } .xpd .cfg-list { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; max-height: 360px; } .xpd .cfg-item { display: flex; align-items: center; gap: 8px; border: 1px solid var(--propia-border-card); border-radius: 9px; padding: 8px 10px; cursor: pointer; } .xpd .cfg-item:hover { border-color: var(--propia-brand); } .xpd .cfg-item.sel { border-color: var(--propia-brand); background: var(--propia-brand-soft-2); } .xpd .cfg-item-name { font-size: 12.5px; font-weight: 700; color: var(--propia-text-body); } .xpd .cfg-item-sub { font-size: 11px; color: var(--propia-text-faint); } /* KPIs / Archivo central (compartido) */ .xpd .doc-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 16px; } @media (max-width: 1000px) { .xpd .doc-kpis { grid-template-columns: repeat(2, 1fr); } .xpd .exp-cols { grid-template-columns: 1fr; } .xpd .cfg-cols { grid-template-columns: 1fr; } .xpd .doc-meta-grid { grid-template-columns: 1fr; } } .xpd .doc-kpi { background: var(--propia-bg-card); border: 1px solid var(--propia-border-card); border-radius: 14px; padding: 16px 18px; box-shadow: 0 1px 2px rgba(45,62,80,.05); } .xpd .doc-kpi-label { font-size: 12px; font-weight: 700; color: var(--propia-text-muted); } .xpd .doc-kpi-value { font-size: 28px; font-weight: 800; letter-spacing: -1px; color: var(--propia-text-h1); margin-top: 4px; } .xpd .doc-kpi-foot { font-size: 11.5px; color: var(--propia-text-faint); margin-top: 2px; } .xpd .doc-toolbar { display: flex; gap: 9px; flex-wrap: wrap; align-items: center; margin-bottom: 12px; } .xpd .doc-search { flex: 1; min-width: 240px; display: flex; align-items: center; gap: 9px; background: var(--propia-bg-card); border: 1px solid var(--propia-border-card); border-radius: 11px; padding: 9px 14px; } .xpd .doc-search:focus-within { border-color: var(--propia-brand); } .xpd .doc-search i { color: var(--propia-text-faint); font-size: 15px; } .xpd .doc-search input { flex: 1; border: 0; outline: 0; font-size: 13.5px; color: var(--propia-text-body); background: transparent; } .xpd .doc-search-count { font-size: 11px; color: var(--propia-text-faint); font-weight: 600; white-space: nowrap; } .xpd .doc-select { border: 1px solid var(--propia-border-card); border-radius: 11px; padding: 9px 12px; font-size: 13px; color: var(--propia-text-secondary); background: var(--propia-bg-card); outline: 0; } .xpd .doc-select:focus { border-color: var(--propia-brand); } .xpd .doc-star-toggle { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--propia-border-card); border-radius: 11px; padding: 8px 13px; font-size: 12.5px; font-weight: 600; color: var(--propia-text-secondary); cursor: pointer; background: var(--propia-bg-card); } .xpd .doc-star-toggle input { display: none; } .xpd .doc-star-toggle.on { border-color: var(--propia-brand); color: var(--propia-brand); background: var(--propia-brand-soft); } .xpd .doc-cats { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 14px; } .xpd .doc-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; padding: 7px 13px; border-radius: 20px; border: 1px solid var(--propia-border-card); color: var(--propia-text-secondary); background: var(--propia-bg-card); cursor: pointer; } .xpd .doc-chip:hover { border-color: var(--propia-brand); } .xpd .doc-chip.on { background: var(--propia-brand); color: var(--propia-text-inverse); border-color: var(--propia-brand); } .xpd .doc-chip-dot { width: 8px; height: 8px; border-radius: 50%; } .xpd .doc-chip-n { font-size: 10.5px; opacity: .7; } .xpd .doc-listcard { background: var(--propia-bg-card); border: 1px solid var(--propia-border-card); border-radius: 14px; box-shadow: 0 1px 2px rgba(45,62,80,.05); overflow: hidden; } .xpd .doc-row { display: flex; align-items: center; gap: 11px; padding: 11px 16px; border-bottom: 1px solid var(--propia-border-divider); } .xpd .doc-row:last-child { border-bottom: 0; } .xpd .doc-row:hover { background: var(--propia-brand-soft-2); } .xpd .doc-row-main { flex: 1; min-width: 0; display: flex; align-items: center; gap: 12px; border: 0; background: transparent; text-align: left; cursor: pointer; padding: 0; } .xpd .doc-ficon { width: 38px; height: 38px; border-radius: 10px; background: var(--propia-brand-soft); color: var(--propia-brand); display: flex; align-items: center; justify-content: center; font-size: 17px; flex-shrink: 0; } .xpd .doc-ficon.sm { width: 30px; height: 30px; font-size: 14px; } .xpd .doc-ficon.lg { width: 44px; height: 44px; font-size: 20px; } .xpd .doc-row-body { min-width: 0; flex: 1; } .xpd .doc-row-name { font-size: 13.5px; font-weight: 700; color: var(--propia-text-body); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .xpd .doc-row-meta { font-size: 11px; color: var(--propia-text-faint); margin-top: 1px; } .xpd .doc-row-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 5px; } .xpd .doc-tag { font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; border: 1px solid; } .xpd .doc-star { font-size: 12px; margin-right: 3px; } .xpd .doc-star.copro { color: #F59E0B; } .xpd .doc-star.pers { color: var(--propia-brand); } .xpd .doc-estado { font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 999px; white-space: nowrap; flex-shrink: 0; } .xpd .doc-row-act { width: 32px; height: 32px; border-radius: 8px; border: 1px solid var(--propia-border-card); background: var(--propia-bg-card); color: var(--propia-brand); display: flex; align-items: center; justify-content: center; cursor: pointer; flex-shrink: 0; } .xpd .doc-row-act:hover { background: var(--propia-brand-soft); } .xpd .doc-pager { display: flex; align-items: center; justify-content: space-between; padding: 10px 16px; font-size: 12px; color: var(--propia-text-faint); border-top: 1px solid var(--propia-border-divider); } .xpd .doc-pager-btns { display: flex; align-items: center; gap: 8px; } .xpd .doc-meta-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--propia-border-divider); border: 1px solid var(--propia-border-divider); border-radius: 11px; overflow: hidden; margin-bottom: 14px; } .xpd .doc-meta-grid > div { background: var(--propia-bg-card); padding: 11px 13px; } .xpd .doc-meta-k { font-size: 10.5px; color: var(--propia-text-faint); font-weight: 600; margin-bottom: 3px; } .xpd .doc-meta-v { font-size: 13.5px; font-weight: 600; color: var(--propia-text-body); } .xpd .doc-newver { background: var(--propia-brand-soft-2); border: 1px solid var(--propia-border-divider); border-radius: 12px; padding: 14px; margin-bottom: 14px; } .xpd .doc-section-title { font-size: 13px; font-weight: 800; color: var(--propia-text-h1); margin: 16px 0 9px; } .xpd .doc-audit { display: flex; flex-direction: column; gap: 1px; } .xpd .doc-audit-row { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--propia-border-divider); } .xpd .doc-audit-ev { font-size: 11px; font-weight: 700; color: var(--propia-text-secondary); background: var(--propia-border-divider); padding: 2px 9px; border-radius: 6px; } .xpd .doc-audit-at { font-size: 11.5px; color: var(--propia-text-faint); } /* --- Pulido maqueta de los modales de Expedientes: frame al estandar (radio 12, acotado, 86vh) + 4o panel Chat IA --- */ .xpd .exp-modal { width:min(1480px,96vw); height:86vh; max-height:880px; border-radius:12px; } .xpd .doc-modal { border-radius:12px; } /* Detalle de expediente en 4 columnas: metadatos | visor | tipologias | chat IA (fijo). */ .xpd .exp-cols { grid-template-columns: 300px 1fr 312px 348px; } .xpd .exp-col-chat { display:flex; flex-direction:column; min-height:0; border-left:1px solid var(--propia-border-divider); background:var(--propia-bg-card); } .xpd .exp-col-chat .act-panel { flex:1; min-height:0; display:flex; flex-direction:column; border:0; } @media (max-width:1240px){ .xpd .exp-cols { grid-template-columns:1fr; } } /* --- Botones de Expedientes UNIFICADOS al estandar de la maqueta (.btn-brand/.btn-ghost/.btn-soft) --- */ .xpd .doc-btn-primary { background:var(--propia-brand); color:#fff; border:0; border-radius:9px; padding:9px 15px; font-size:13px; font-weight:700; box-shadow:var(--propia-glow-brand-sm); gap:7px; } .xpd .doc-btn-primary:hover:not(:disabled) { background:var(--propia-brand-hover); box-shadow:var(--propia-glow-brand-sm); } .xpd .doc-btn-soft { background:var(--propia-brand-soft); border:1px solid var(--propia-brand-border); color:var(--propia-brand-text-on-soft); border-radius:8px; padding:7px 11px; font-size:11.5px; font-weight:700; gap:6px; } .xpd .doc-btn-soft:hover:not(:disabled) { background:var(--propia-brand-soft); filter:brightness(.98); } .xpd .doc-btn-soft.on { background:var(--propia-brand); border-color:var(--propia-brand); color:#fff; } .xpd .doc-btn-ghost { background:var(--propia-bg-card); border:1px solid var(--propia-border-card); color:var(--propia-text-secondary); border-radius:9px; padding:8px 13px; font-size:12.5px; font-weight:600; gap:7px; } .xpd .doc-btn-ghost:hover:not(:disabled) { border-color:var(--propia-brand); color:var(--propia-brand); } .xpd .doc-btn-danger { background:var(--propia-bg-card); border:1px solid var(--propia-danger-soft); color:var(--propia-danger); border-radius:9px; padding:7px 12px; font-size:12px; font-weight:700; } .xpd .doc-btn-danger:hover { background:var(--propia-danger-soft); border-color:var(--propia-danger); color:var(--propia-danger); } .xpd .doc-btn-primary.sm, .xpd .doc-btn-soft.sm, .xpd .doc-btn-ghost.sm, .xpd .doc-btn-danger.sm { padding:5px 10px !important; font-size:11.5px; box-shadow:none; } .xpd .doc-btn-primary.full { width:100%; justify-content:center; } /* Tabs de vista (Expedientes / Archivo central) al lenguaje de pildora segmentada de la maqueta */ .xpd .doc-tabs { background:var(--propia-bg-app); border:1px solid var(--propia-border-card); border-radius:12px; padding:5px; gap:3px; display:inline-flex; } .xpd .doc-tab { border:0; background:transparent; color:var(--propia-text-secondary); border-radius:9px; padding:9px 16px; } .xpd .doc-tab:hover { background:var(--propia-bg-hover); color:var(--propia-text-body); } .xpd .doc-tab.on { background:var(--propia-bg-card); color:var(--propia-brand); box-shadow:0 1px 3px rgba(27,42,58,.12); } /* === Filtro dinamico del motor U.tabla (CALCA FiltroDinamico.razor, clases .fd-*) === Reglas "Donde campo operador valor" sobre cualquier columna, con logica Y/O y agregar/limpiar. */ .fd-wrap { position:relative; } .fd-badge { display:inline-flex; align-items:center; justify-content:center; min-width:17px; height:17px; padding:0 5px; margin-left:4px; border-radius:9px; background:var(--propia-brand); color:var(--propia-text-inverse); font-size:10.5px; font-weight:800; } .fd-bd { position:fixed; inset:0; z-index:60; } .fd-pop { position:absolute; top:44px; left:0; z-index:61; width:min(680px,92vw); background:var(--propia-bg-card); border:1px solid var(--propia-border-card); border-radius:12px; box-shadow:0 16px 40px rgba(27,42,58,.2); padding:12px; } .fd-empty { font-size:12.5px; color:var(--propia-text-muted); text-align:center; padding:14px 8px 16px; line-height:1.5; } .fd-rule { display:flex; align-items:center; gap:7px; margin-bottom:8px; } .fd-lead { flex:0 0 58px; font-size:12px; font-weight:700; color:var(--propia-text-muted); text-align:right; } select.fd-lead.fd-logic { flex:0 0 58px; text-align:left; border:1px solid var(--propia-border-card); border-radius:8px; padding:5px 6px; background:var(--propia-bg-table-head); color:var(--propia-brand); font-weight:800; cursor:pointer; outline:none; font-family:inherit; } .fd-f, .fd-op, .fd-v { font-size:12.5px; font-weight:600; color:var(--propia-text-body); border:1px solid var(--propia-border-card); border-radius:8px; padding:6px 8px; background:var(--propia-bg-card); outline:none; min-width:0; font-family:inherit; } .fd-f { flex:0 0 160px; } .fd-op { flex:0 0 142px; color:var(--propia-text-secondary); } .fd-v { flex:1 1 auto; min-width:90px; } .fd-f:focus, .fd-op:focus, .fd-v:focus, select.fd-lead.fd-logic:focus { border-color:var(--propia-brand); } .fd-del { flex:0 0 auto; width:28px; height:28px; border-radius:7px; border:1px solid var(--propia-border-card); background:var(--propia-bg-card); color:var(--propia-text-muted); display:flex; align-items:center; justify-content:center; cursor:pointer; } .fd-del:hover { background:var(--propia-danger-soft); color:var(--propia-danger); border-color:var(--propia-danger-soft); } .fd-foot { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:4px; padding-top:10px; border-top:1px solid var(--propia-border-divider); } .fd-add { display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; color:var(--propia-brand); background:var(--propia-brand-soft); border:0; border-radius:8px; padding:7px 12px; cursor:pointer; font-family:inherit; } .fd-add:hover { filter:brightness(.97); } .fd-clear { font-size:12px; font-weight:700; color:var(--propia-danger); background:transparent; border:0; border-radius:8px; padding:7px 10px; cursor:pointer; font-family:inherit; } @media (max-width:640px){ .fd-rule { flex-wrap:wrap; } .fd-f, .fd-op { flex:1 1 40%; } } /* --- Reset de colisiones del .exp-* del documentos VIEJO (reglas globales) que se filtraban dentro de .xpd --- */ .xpd .exp-add { width:auto; flex:0 1 auto; background:transparent; border:0; border-radius:0; color:inherit; font-size:inherit; cursor:default; } .xpd .exp-add .doc-input { flex:1 1 auto; width:auto; min-width:0; } .xpd .exp-preview { min-height:0; display:block; font-size:inherit; align-items:initial; justify-content:initial; } .xpd .exp-modal { margin:0; } /* === Arbol de folders dinamico (expedientes v2 · Configurar folders) — scopeado .xpd === */ .xpd .ftree-body { padding:10px 14px 12px; overflow-y:auto; max-height:min(560px,70vh); } .xpd .ftree-row { display:flex; align-items:center; gap:7px; padding:5px 8px 5px 0; border-radius:8px; } .xpd .ftree-row:hover { background:var(--propia-bg-app); } .xpd .ftree-caret { width:22px; height:22px; flex:0 0 auto; border:0; background:transparent; color:var(--propia-text-muted); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; font-size:14px; } .xpd .ftree-ic { color:var(--propia-brand); font-size:15px; flex:0 0 auto; } .xpd .ftree-name { font-size:13px; font-weight:700; color:var(--propia-text-body); flex:0 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .xpd .ftree-count { font-size:10.5px; color:var(--propia-text-faint); font-weight:600; margin-left:6px; white-space:nowrap; flex:0 0 auto; } .xpd .ftree-acts { margin-left:auto; display:flex; gap:3px; opacity:0; transition:opacity .12s; flex:0 0 auto; } .xpd .ftree-row:hover .ftree-acts, .xpd .ftree-row:focus-within .ftree-acts { opacity:1; } .xpd .ftree-act { position:relative; width:26px; height:26px; flex:0 0 auto; border:1px solid var(--propia-border-card); background:var(--propia-bg-card); color:var(--propia-text-muted); border-radius:7px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; font-size:12px; } .xpd .ftree-act:hover { border-color:var(--propia-brand); color:var(--propia-brand); } .xpd .ftree-act--del:hover { border-color:var(--propia-danger); color:var(--propia-danger); background:var(--propia-danger-soft); } .xpd .ftree-mini { position:absolute; right:1px; bottom:0; font-size:7px; } .xpd .ftree-doc { display:flex; align-items:center; gap:7px; padding:4px 8px 4px 0; border-radius:8px; } .xpd .ftree-doc:hover { background:var(--propia-bg-app); } .xpd .ftree-doc-ic { color:var(--propia-brand); font-size:13px; flex:0 0 auto; } .xpd .ftree-doc-name { font-size:12.5px; color:var(--propia-text-secondary); flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .xpd .ftree-doc .ftree-act--del { width:22px; height:22px; opacity:0; } .xpd .ftree-doc:hover .ftree-act--del { opacity:1; } .xpd .ftree-add { display:flex; align-items:center; gap:7px; padding:3px 8px 3px 0; } .xpd .ftree-inp { flex:1 1 auto; min-width:0; border:1px solid var(--propia-brand); border-radius:7px; padding:5px 9px; font-size:12.5px; outline:none; font-family:inherit; color:var(--propia-text-body); background:var(--propia-bg-card); box-shadow:0 0 0 2px rgba(109,79,227,.12); } .xpd .ftree-rootadd { display:inline-flex; align-items:center; gap:6px; margin:10px 0 2px; font-size:12.5px; font-weight:700; color:var(--propia-brand); background:var(--propia-brand-soft); border:0; border-radius:8px; padding:8px 13px; cursor:pointer; font-family:inherit; } .xpd .ftree-rootadd:hover { filter:brightness(.97); } /* === Arbol de folders v2: iconos mas visuales + metadatos (configurados con P.crearCampoNuevo) === */ .xpd .ftree-row { padding:6px 8px 6px 0; gap:9px; } .xpd .ftree-caret { font-size:16px; } .xpd .ftree-ic { display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; border-radius:9px; background:var(--propia-brand-soft); color:var(--propia-brand); font-size:16px; flex:0 0 auto; } :root:is([data-theme="dark"],[data-bs-theme="dark"]) .xpd .ftree-ic { background:var(--propia-brand-soft); color:var(--propia-brand); } .xpd .ftree-name { font-size:13.5px; } .xpd .ftree-doc { padding:5px 8px 5px 0; gap:9px; } .xpd .ftree-doc-ic { display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:7px; background:var(--propia-brand-soft); color:var(--propia-brand); font-size:14px; flex:0 0 auto; } /* Metadatos del folder */ .xpd .ftree-meta { display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding-top:3px; padding-bottom:7px; } .xpd .ftree-meta-lbl { font-size:9.5px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; color:var(--propia-text-faint); display:inline-flex; align-items:center; gap:5px; margin-right:2px; } .xpd .ftree-meta-chip { display:inline-flex; align-items:center; gap:6px; font-size:11.5px; font-weight:600; color:var(--propia-text-body); background:var(--propia-bg-card); border:1px solid var(--propia-border-card); border-radius:999px; padding:3px 5px 3px 10px; cursor:pointer; font-family:inherit; } .xpd .ftree-meta-chip:hover { border-color:var(--propia-brand); } .xpd .ftree-meta-chip > .fi { color:var(--propia-brand); font-size:12px; } .xpd .ftree-meta-x { display:inline-flex; align-items:center; justify-content:center; width:16px; height:16px; color:var(--propia-text-faint); font-size:14px; line-height:1; border-radius:5px; } .xpd .ftree-meta-x:hover { color:var(--propia-danger); background:var(--propia-danger-soft); } .xpd .ftree-meta-add { display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:700; color:var(--propia-brand); background:var(--propia-brand-soft); border:1px dashed var(--propia-brand-border); border-radius:999px; padding:3px 11px; cursor:pointer; font-family:inherit; } .xpd .ftree-meta-add:hover { border-style:solid; } /* Arbol de folders v2 en 3 columnas: fila seleccionable + arbol compacto dentro de la columna */ .xpd .cfg-list.ftree-scroll { gap:0; max-height:430px; } .xpd .ftree-row { cursor:pointer; } .xpd .ftree-row.sel { background:var(--propia-brand-soft-2); } .xpd .ftree-row.sel .ftree-name { color:var(--propia-brand); } .xpd .cfg-col > .ftree-rootadd { margin:8px 2px 2px; } .xpd .cfg-col .cfg-item { cursor:pointer; } /* Config folders v2: modal/columnas mas grandes, chips de metadatos grandes (nombre + tipo), fuente mayor */ .xpd .cfg-cols .cfg-list { max-height:540px; } .xpd .cfg-list.ftree-scroll { max-height:540px; } .xpd .cfg-col-title { font-size:13px; } .xpd .cfg-item-name { font-size:13.5px; } .xpd .cfg-item-sub { font-size:11.5px; } .xpd .ftree-name { font-size:14.5px; } .xpd .ftree-ic { width:32px; height:32px; font-size:17px; } .xpd .ftree-doc-ic { width:28px; height:28px; font-size:15px; } .xpd .ftree-meta-list { display:flex; flex-direction:column; gap:8px; margin:2px 0 12px; } .xpd .ftree-meta-chip { display:flex; align-items:center; gap:10px; width:100%; text-align:left; font-family:inherit; cursor:pointer; background:var(--propia-bg-card); border:1px solid var(--propia-border-card); border-radius:12px; padding:9px 10px 9px 11px; } .xpd .ftree-meta-chip:hover { border-color:var(--propia-brand); box-shadow:0 3px 10px rgba(109,79,227,.1); } .xpd .ftree-meta-ic { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:9px; background:var(--propia-brand-soft); color:var(--propia-brand); font-size:16px; flex:0 0 auto; } .xpd .ftree-meta-txt { display:flex; flex-direction:column; min-width:0; flex:1 1 auto; line-height:1.25; } .xpd .ftree-meta-name { font-size:13.5px; font-weight:700; color:var(--propia-text-body); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .xpd .ftree-meta-type { font-size:11px; font-weight:600; color:var(--propia-text-faint); } .xpd .ftree-meta-x { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; flex:0 0 auto; color:var(--propia-text-faint); font-size:13px; border-radius:7px; } .xpd .ftree-meta-x:hover { color:var(--propia-danger); background:var(--propia-danger-soft); } .xpd .ftree-meta-add { font-size:12px; padding:8px 13px; } /* ===== Expedientes v2 — Explorador de folders (modal de detalle casi pantalla completa) ===== Clase .fbrowse (solo v2): col1 estructura | col2 documentos | col3 visor+metadatos | col4 chat (ocultable). Overrides al final para ganar sobre .xpd .exp-cols/.exp-modal compartidos con v1. */ .xpd .exp-modal.fbrowse { width:98vw; height:95vh; max-width:none; max-height:none; border-radius:12px; } .xpd .exp-modal.fbrowse .exp-cols { grid-template-columns:260px 320px 1fr 360px; } .xpd .exp-modal.fbrowse .exp-cols.chat-hidden { grid-template-columns:260px 320px 1fr; } .xpd .exp-col-struct, .xpd .exp-col-docs { display:flex; flex-direction:column; min-height:0; border-right:1px solid var(--propia-border-divider); background:var(--propia-bg-card); } .xpd .exp-col-struct { background:var(--propia-bg-card-soft); } .xpd .exp-struct-tree { flex:1; overflow-y:auto; padding:2px 8px 12px; } .xpd .exp-struct-tree .ftree-kids { position:relative; } @media (max-width:1240px){ .xpd .exp-modal.fbrowse .exp-cols, .xpd .exp-modal.fbrowse .exp-cols.chat-hidden { grid-template-columns:1fr; } } /* Expedientes v2 — descripcion del metadato en el chip de configuracion (para busqueda con IA) */ .xpd .ftree-meta-desc { font-size:11px; line-height:1.35; color:var(--propia-text-muted); margin-top:3px; white-space:normal; } .xpd .ftree-meta-desc--empty { color:var(--propia-text-faint); font-style:italic; } /* Expedientes v2 — captura de metadatos en el visor (col 3 del explorador de folders) */ .xpd .exp-doc-wrap { width:100%; max-width:560px; margin:0 auto; display:flex; flex-direction:column; gap:18px; } .xpd .exp-cap-card { background:var(--propia-bg-card); border:1px solid var(--propia-border-card); border-radius:10px; padding:16px 18px; box-shadow:0 2px 8px rgba(27,42,58,.05); } .xpd .exp-cap { display:flex; flex-direction:column; gap:14px; } .xpd .exp-cap-fld { display:flex; flex-direction:column; gap:5px; } .xpd .exp-cap-lbl { font-size:12px; font-weight:700; color:var(--propia-text-body); display:flex; align-items:center; gap:7px; } .xpd .exp-cap-type { font-size:10px; font-weight:700; color:var(--propia-text-faint); background:var(--propia-bg-app); border:1px solid var(--propia-border-divider); border-radius:5px; padding:1px 6px; text-transform:uppercase; letter-spacing:.3px; } .xpd .exp-cap-fld .fr-in { width:100%; } .xpd .exp-cap-chk { display:inline-flex; align-items:center; gap:7px; font-size:12.5px; color:var(--propia-text-body); cursor:pointer; } .xpd .exp-cap-desc { font-size:11px; line-height:1.4; color:var(--propia-text-muted); display:flex; align-items:flex-start; gap:5px; } .xpd .exp-cap-desc i { color:var(--propia-brand); margin-top:1px; flex:0 0 auto; } /* Metadatos del folder (Configurar folders) — fichas mas limpias: tipo como pill, descripcion en 1 linea (con ✦ y tooltip al completo), acciones editar/eliminar solo en hover. Override de los .ftree-meta-* previos. */ .xpd .ftree-meta-list { gap:7px; } .xpd .ftree-meta-chip { position:relative; align-items:flex-start; gap:11px; padding:11px 12px; transition:border-color .12s, box-shadow .12s; } .xpd .ftree-meta-chip:hover { border-color:var(--propia-brand); box-shadow:0 4px 14px rgba(109,79,227,.12); } .xpd .ftree-meta-ic { margin-top:1px; } .xpd .ftree-meta-txt { gap:4px; padding-right:16px; } .xpd .ftree-meta-head { display:flex; align-items:center; gap:8px; min-width:0; } .xpd .ftree-meta-head .ftree-meta-name { flex:0 1 auto; } .xpd .ftree-meta-type { flex:0 0 auto; font-size:9.5px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; border-radius:6px; padding:2px 7px; line-height:1.5; } .xpd .ftree-meta-desc { display:flex; align-items:center; gap:5px; min-width:0; } .xpd .ftree-meta-desc > span { min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:11.5px; line-height:1.4; color:var(--propia-text-muted); } .xpd .ftree-meta-desc > i { flex:0 0 auto; color:var(--propia-brand); font-size:11px; } .xpd .ftree-meta-desc--empty > span { color:var(--propia-text-faint); } .xpd .ftree-meta-acts { position:absolute; top:8px; right:8px; display:flex; gap:2px; opacity:0; transition:opacity .12s; } .xpd .ftree-meta-chip:hover .ftree-meta-acts, .xpd .ftree-meta-chip:focus-within .ftree-meta-acts { opacity:1; } .xpd .ftree-meta-act { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:7px; color:var(--propia-text-faint); font-size:12px; background:var(--propia-bg-card); } .xpd .ftree-meta-act:hover { background:var(--propia-bg-app); color:var(--propia-text-body); } .xpd .ftree-meta-act.ftree-meta-x:hover { color:var(--propia-danger); background:var(--propia-danger-soft); } .xpd .ftree-meta-act.is-on { color:var(--propia-warn); } .xpd .ftree-meta-chip:has(.ftree-meta-act.is-on) .ftree-meta-acts { opacity:1; } /* ===== Expedientes v2 — Explorador: columnas flex redimensionables + metadatos (captura) en columna propia ===== */ .xpd .exp-modal.fbrowse .exp-cols { display:flex; overflow:hidden; } .xpd .fbrowse-flex .exp-col { display:flex; flex-direction:column; min-height:0; min-width:0; overflow:hidden; background:var(--propia-bg-card); border:0; padding:0; } .xpd .fbrowse-flex .exp-col-struct { background:var(--propia-bg-card-soft); } .xpd .fbrowse-flex .exp-col-center { flex:1 1 0; min-width:260px; background:#EEF1F5; } :root:is([data-theme="dark"],[data-bs-theme="dark"]) .xpd .fbrowse-flex .exp-col-center { background:var(--propia-bg-app); } .xpd .exp-cap-scroll { flex:1; overflow-y:auto; padding:0 4px 14px; } /* Separador con grip visible (la "seña" para redimensionar) */ .xpd .exp-split { flex:0 0 8px; align-self:stretch; position:relative; display:flex; align-items:center; justify-content:center; cursor:col-resize; background:transparent; } .xpd .exp-split::before { content:''; position:absolute; top:0; bottom:0; left:50%; transform:translateX(-50%); width:1px; background:var(--propia-border-divider); } .xpd .exp-split:hover::before, .xpd .exp-split.dragging::before { width:2px; background:var(--propia-brand); } .xpd .exp-split-grip { position:relative; z-index:1; display:flex; align-items:center; justify-content:center; width:15px; height:42px; border-radius:7px; background:var(--propia-bg-card); border:1px solid var(--propia-border-card); color:var(--propia-text-faint); font-size:11px; box-shadow:0 1px 4px rgba(27,42,58,.14); transition:background .12s,color .12s,border-color .12s; } .xpd .exp-split:hover .exp-split-grip, .xpd .exp-split.dragging .exp-split-grip { background:var(--propia-brand); border-color:var(--propia-brand); color:#fff; } /* Fichas de captura (mismo estilo que las fichas de metadatos): nombre + pill de tipo + input + descripcion ✦ */ .xpd .exp-cap { display:flex; flex-direction:column; gap:12px; } .xpd .exp-cap-fld { background:var(--propia-bg-card); border:1px solid var(--propia-border-card); border-radius:12px; padding:11px 12px; display:flex; flex-direction:column; gap:7px; transition:border-color .12s, box-shadow .12s; } .xpd .exp-cap-fld:focus-within { border-color:var(--propia-brand); box-shadow:0 3px 10px rgba(109,79,227,.1); } .xpd .exp-cap-head { display:flex; align-items:center; gap:8px; min-width:0; } .xpd .exp-cap-name { font-size:12.5px; font-weight:700; color:var(--propia-text-body); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; flex:0 1 auto; } .xpd .exp-cap-type { flex:0 0 auto; font-size:9.5px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; border-radius:6px; padding:2px 7px; line-height:1.5; } .xpd .exp-cap-fld .fr-in { width:100%; } .xpd .exp-cap-chk { display:inline-flex; align-items:center; gap:7px; font-size:12.5px; color:var(--propia-text-body); cursor:pointer; } .xpd .exp-cap-desc { display:flex; align-items:flex-start; gap:5px; } .xpd .exp-cap-desc > i { flex:0 0 auto; color:var(--propia-brand); font-size:11px; margin-top:2px; } .xpd .exp-cap-desc > span { font-size:11px; line-height:1.4; color:var(--propia-text-muted); } /* Panel angosto: apilar columnas y ocultar separadores */ @media (max-width:1180px){ .xpd .exp-modal.fbrowse .exp-cols { flex-wrap:wrap; overflow:auto; } .xpd .fbrowse-flex .exp-col { flex:1 1 100% !important; min-width:0; } .xpd .fbrowse-flex .exp-col-center { min-width:0; } .xpd .exp-split { display:none; } } /* Expedientes v2 — Documentos (col 2): acciones al hover (duplicar / versiones / archivar) + seccion de archivados. Archivar NO elimina: el documento pasa a "Archivados" y es restaurable (un documento nunca se pierde). */ .xpd .exp-tip-hacts { display:flex; align-items:center; gap:1px; flex:0 0 auto; margin-left:2px; opacity:0; transition:opacity .12s; } .xpd .exp-tip:hover .exp-tip-hacts, .xpd .exp-tip.sel .exp-tip-hacts { opacity:1; } .xpd .exp-tip-hact { display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border:0; border-radius:7px; background:transparent; color:var(--propia-text-faint); font-size:12px; cursor:pointer; } .xpd .exp-tip-hact:hover { background:var(--propia-bg-card); color:var(--propia-text-body); } .xpd .exp-tip-hact.is-arch:hover { color:var(--propia-warn); background:var(--propia-warn-soft); } .xpd .exp-tip--arch { opacity:.78; } .xpd .exp-tip--arch .exp-tip-ic { background:var(--propia-bg-app); color:var(--propia-text-faint); } .xpd .exp-tip--arch .exp-tip-name { color:var(--propia-text-muted); } .xpd .exp-arch { margin:6px 10px 2px; } .xpd .exp-arch-tog { width:100%; display:flex; align-items:center; gap:6px; border:0; background:transparent; color:var(--propia-text-muted); font-size:11.5px; font-weight:700; padding:7px 6px; border-top:1px dashed var(--propia-border-divider); cursor:pointer; } .xpd .exp-arch-tog:hover { color:var(--propia-text-body); } .xpd .exp-arch-list { display:flex; flex-direction:column; gap:7px; padding:4px 0 2px; } /* Expedientes v2 — Documentos como MINIATURAS tipo "pagina" (apariencia del visor) en cuadricula */ .xpd .exp-docs-scroll { flex:1; overflow-y:auto; background:var(--propia-bg-app); } .xpd .exp-thumbs { display:grid; grid-template-columns:repeat(auto-fill, minmax(92px, 1fr)); gap:14px 12px; padding:14px; align-content:start; } .xpd .exp-thumb { cursor:pointer; min-width:0; } .xpd .exp-thumb-paper { position:relative; aspect-ratio:3/4; background:var(--propia-bg-card); border:1px solid var(--propia-border-card); border-radius:7px; box-shadow:0 2px 7px rgba(27,42,58,.1); padding:9px 9px 0; overflow:hidden; transition:box-shadow .12s, border-color .12s, transform .08s; } .xpd .exp-thumb:hover .exp-thumb-paper { box-shadow:0 6px 16px rgba(27,42,58,.18); transform:translateY(-1px); } .xpd .exp-thumb.sel .exp-thumb-paper { border-color:var(--propia-brand); box-shadow:0 0 0 2px var(--propia-brand-soft), 0 5px 14px rgba(109,79,227,.2); } .xpd .exp-thumb-head { display:flex; justify-content:flex-end; border-bottom:1.5px solid var(--propia-text-h1); padding-bottom:5px; margin-bottom:6px; } .xpd .exp-thumb-ext { font-size:7px; font-weight:800; letter-spacing:.3px; padding:1px 4px; border-radius:3px; } .xpd .exp-thumb-title { font-size:8px; font-weight:800; line-height:1.3; color:var(--propia-text-h1); margin:0 1px 7px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } .xpd .exp-thumb-lines { display:flex; flex-direction:column; gap:3.5px; padding:0 1px; } .xpd .exp-thumb-lines > i { height:2.5px; border-radius:2px; background:var(--propia-border-divider); display:block; } .xpd .exp-thumb-vbadge { position:absolute; bottom:6px; right:6px; display:inline-flex; align-items:center; gap:3px; font-size:8px; font-weight:800; color:var(--propia-text-muted); background:var(--propia-bg-app); border:1px solid var(--propia-border-card); border-radius:5px; padding:1px 4px; } .xpd .exp-thumb-vbadge i { font-size:8px; } .xpd .exp-thumb-name { font-size:11px; font-weight:600; color:var(--propia-text-body); margin-top:7px; line-height:1.25; text-align:center; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } .xpd .exp-thumb.sel .exp-thumb-name { color:var(--propia-brand); font-weight:700; } .xpd .exp-thumb-sub { font-size:9.5px; color:var(--propia-text-faint); text-align:center; margin-top:1px; } .xpd .exp-thumb-hacts { position:absolute; top:5px; left:5px; display:flex; gap:2px; opacity:0; transition:opacity .12s; } .xpd .exp-thumb:hover .exp-thumb-hacts { opacity:1; } .xpd .exp-thumb-hact { width:22px; height:22px; border-radius:6px; display:inline-flex; align-items:center; justify-content:center; background:var(--propia-bg-card); border:1px solid var(--propia-border-card); color:var(--propia-text-muted); font-size:10px; cursor:pointer; box-shadow:0 1px 3px rgba(27,42,58,.14); } .xpd .exp-thumb-hact:hover { color:var(--propia-text-body); background:var(--propia-bg-app); } .xpd .exp-thumb-hact.is-arch:hover { color:var(--propia-warn); background:var(--propia-warn-soft); } /* Archivadas: atenuadas + etiqueta */ .xpd .exp-thumb--arch .exp-thumb-paper { opacity:.72; filter:grayscale(.3); } .xpd .exp-thumb--arch .exp-thumb-name { color:var(--propia-text-muted); } .xpd .exp-thumb-archtag { position:absolute; left:6px; bottom:6px; display:inline-flex; align-items:center; gap:3px; font-size:8px; font-weight:800; text-transform:uppercase; letter-spacing:.3px; color:var(--propia-text-faint); background:var(--propia-bg-app); border:1px solid var(--propia-border-card); border-radius:5px; padding:1px 5px; } .xpd .exp-thumbs--arch { padding-top:4px; } /* =========================================================================================== OVERRIDES DE PRODUCCION (van al final para ganar a la copia 1:1 de la maqueta de arriba). - Canon de margen lateral de la app (= Unidades): sin padding horizontal propio ni centrado. - Pill del folder en la tarjeta y color por CATEGORIA del tipo de metadato SOLO con tokens (la maqueta usa hex inline; en produccion los colores van por --propia-*). - Modo oscuro: los pocos hex de la copia (hover del boton soft, danger, fondo del visor) se redefinen con tokens para que el modulo respete el tema. =========================================================================================== */ .xpd .doc-wrap { max-width: none; margin: 0; padding: 6px 0 60px; } .xpd .doc-btn-soft:hover:not(:disabled) { background: var(--propia-brand-soft-2); } .xpd .doc-btn-danger { border-color: var(--propia-danger-soft); color: var(--propia-danger); } .xpd .doc-btn-danger:hover { background: var(--propia-danger-soft); } .xpd .doc-banner.ok { border-color: var(--propia-ok-soft); color: var(--propia-ok); } .xpd .doc-banner.err { border-color: var(--propia-danger-soft); color: var(--propia-danger); } .xpd .doc-banner.info { background: var(--propia-info-soft); border-color: var(--propia-info-border); color: var(--propia-info-strong); } .xpd .doc-empty { border-color: var(--propia-border-card-2); } .xpd .exp-preview { border-color: var(--propia-border-divider); } .xpd .exp-badge.ok { color: var(--propia-ok); } .xpd .exp-badge.pend { color: var(--propia-warn); } .xpd .exp-bar-fill { background: linear-gradient(90deg, var(--propia-brand-hover), var(--propia-brand)); } .xpd .exp-chip-x:hover { color: var(--propia-danger); } .xpd .exp-chip-x:disabled { opacity: .35; cursor: default; } .xpd .exp-chip-x:disabled:hover { color: var(--propia-text-faint); } .xpd .doc-dropzone { color: var(--propia-brand-text-2); } .xpd .doc-dropzone small { color: var(--propia-brand-text-2); } .xpd .doc-star.copro { color: var(--propia-warn); } .xpd .exp-col-center { background: var(--propia-bg-app); } /* Pill de la tarjeta de folder: violeta de marca (la maqueta coloreaba por serie; en v2 todo folder es violeta). */ .xpd .xpd-brand-pill { color: var(--propia-brand); background: var(--propia-brand-soft); display: inline-flex; align-items: center; } /* Color por CATEGORIA del tipo de metadato (Basicos / Fecha / Seleccion / Relacion / Otros). */ .xpd .ftree-meta-ic.cat-basico, .xpd .ftree-meta-type.cat-basico, .xpd .exp-cap-type.cat-basico { color: var(--propia-info-strong); background: var(--propia-info-soft); } .xpd .ftree-meta-ic.cat-fecha, .xpd .ftree-meta-type.cat-fecha, .xpd .exp-cap-type.cat-fecha { color: var(--propia-ok); background: var(--propia-ok-soft); } .xpd .ftree-meta-ic.cat-sel, .xpd .ftree-meta-type.cat-sel, .xpd .exp-cap-type.cat-sel { color: var(--propia-brand); background: var(--propia-brand-soft); } .xpd .ftree-meta-ic.cat-rel, .xpd .ftree-meta-type.cat-rel, .xpd .exp-cap-type.cat-rel { color: var(--propia-warn); background: var(--propia-warn-soft); } .xpd .ftree-meta-ic.cat-otro, .xpd .ftree-meta-type.cat-otro, .xpd .exp-cap-type.cat-otro { color: var(--propia-text-secondary); background: var(--propia-bg-app); } /* Las 3 columnas del modal son tracks 1fr: sin min-width:0 un titulo largo ensancha su columna y aplasta a las otras (el chip de metadato se salia por la derecha). Titulos largos van con elipsis. */ .xpd .cfg-col { min-width: 0; } .xpd .cfg-col-title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .xpd .cfg-col-title .doc-sub { white-space: nowrap; } .xpd .cfg-item-name, .xpd .cfg-item-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .xpd .ftree-rootadd { white-space: nowrap; } /* Las acciones del chip de metadato son dentro de un