/* ======================================================
   SIEVAL UI
   ====================================================== */

.bg-wh-3 {
    background-image: var(--sieval-bg-wh-3);
}
.bg-wh-4{
    background-image: var(--sieval-bg-wh-4);
}
.bg-wh-5{
    background-image: var(--sieval-bg-wh-5);
}
.bg-wh-6{
    background-image: var(--sieval-bg-wh-6);
}
.bg-wh-7{
    background-image: var(--sieval-bg-wh-7);
}
.bg-wh-8{
    background-image: var(--sieval-bg-wh-8);
}
.bg-wh-9{
    background-image: var(--sieval-bg-wh-9);
}
.sv-page-soft {
    min-height: 100%;
    background:
        radial-gradient(circle at top left, color-mix(in srgb, var(--sabila-50) 70%, transparent), transparent 34%),
        radial-gradient(circle at bottom right, color-mix(in srgb, var(--muicle-50) 72%, transparent), transparent 38%),
        var(--algodon-50);
}

.sv-panel {
    position: relative;
    border: 1px solid color-mix(in srgb, var(--jamaica-1) 65%, transparent);
    border-radius: .75rem;
    padding: 1rem;
    box-shadow:
        0 18px 45px rgba(11, 16, 42, .10),
        0 2px 8px rgba(11, 16, 42, .06);
    overflow: hidden;
}

.sv-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(90deg, var(--muicle-1), var(--sabila-1), var(--copal-1));
    height: 5px;
}

.sv-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: .75rem .75rem 1rem;
}

.sv-panel-body {
    padding: .25rem;
}

.sv-panel-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: .65rem;
    padding: 1rem .75rem .25rem;
    border-top: 1px solid color-mix(in srgb, var(--algodon-200) 76%, transparent);
    margin-top: 1rem;
}

.sv-panel-kicker,
.sv-kicker {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--sabila-700);
    margin-bottom: .25rem;
}

.sv-panel-title,
.sv-title {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--anil-1);
    line-height: 1.2;
}

.sv-panel-title small,
.sv-title small {
    display: block;
    margin-top: .35rem;
    color: var(--algodon-700);
    font-size: .82rem;
    font-weight: 500;
    line-height: 1.35;
}

.sv-panel-subtitle,
.sv-description {
    margin: .2rem 0 0;
    font-size: .85rem;
    color: var(--algodon-700);
}

.sv-panel-actions {
    display: flex;
    gap: .5rem;
    align-items: center;
}

.sv-field {
    margin-bottom: 1rem;
}

.sv-label {
    display: flex;
    align-items: center;
    gap: .35rem;
    margin-bottom: .4rem;
    color: var(--anil-1);
    font-size: .82rem;
    font-weight: 800;
}

.sv-label small {
    color: var(--algodon-700);
    font-size: .72rem;
    font-weight: 500;
}

.sv-input,
.sv-select,
.sv-panel .form-control {
    width: 100%;
    min-height: 44px;
    border: 1px solid color-mix(in srgb, var(--anil-200) 70%, transparent);
    border-radius: 14px;
    background-color: rgba(255, 255, 255, .88);
    color: var(--anil-1);
    font-family: var(--font-ui);
    font-size: .9rem;
    transition:
        border-color .16s ease,
        box-shadow .16s ease,
        background-color .16s ease;
}

.sv-input:focus,
.sv-select:focus,
.sv-panel .form-control:focus {
    border-color: var(--sabila-1);
    background-color: white;
    box-shadow:
        0 0 0 .2rem color-mix(in srgb, var(--sabila-200) 42%, transparent),
        0 8px 18px rgba(11, 16, 42, .06);
    outline: none;
}

.sv-input:disabled,
.sv-input[readonly],
.sv-panel .form-control:disabled,
.sv-panel .form-control[readonly] {
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--algodon-1) 86%, white),
            color-mix(in srgb, var(--anil-50) 70%, white)
        );
    color: var(--anil-700);
    font-weight: 800;
    opacity: 1;
}

.sv-help {
    display: block;
    margin-top: .35rem;
    color: var(--arnica-700);
    font-size: .72rem;
    font-weight: 650;
}

.sv-help-danger {
    color: var(--jamaica-700);
}

.sv-note {
    margin: .75rem 0 1rem;
    padding: .9rem 1rem;
    border: 1px solid color-mix(in srgb, var(--copal-200) 72%, transparent);
    border-radius: 16px;
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--copal-50) 68%, white),
            rgba(255, 255, 255, .88)
        );
    color: var(--anil-1);
    font-size: .78rem;
    line-height: 1.55;
}

.sv-note strong {
    color: var(--copal-700);
}

.sv-note-badge {
    display: inline-flex;
    align-items: center;
    margin-right: .35rem;
    margin-bottom: .25rem;
    padding: .22rem .5rem;
    border-radius: 999px;
    background: var(--copal-1);
    color: white;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.sv-note-badge-alt {
    background: var(--arnica-1);
}

.sv-note-list {
    margin: .5rem 0 0;
    padding-left: 1rem;
}

.sv-note-list li {
    margin-bottom: .4rem;
}

.sv-table-wrap {
    border: 1px solid color-mix(in srgb, var(--algodon-200) 80%, transparent);
    border-radius: 18px;
    background: rgba(255, 255, 255, .82);
    overflow: hidden;
}

.sv-table {
    width: 100%;
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    font-family: var(--font-ui);
}

.sv-table thead th {
    padding: .9rem .75rem;
    border: 0;
    background:
        linear-gradient(
            180deg,
            color-mix(in srgb, var(--cedron-50) 90%, white),
            color-mix(in srgb, var(--cedron-200) 34%, white)
        );
    color: var(--cedron-700);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.sv-table tbody td {
    padding: .9rem .75rem;
    vertical-align: middle;
    border-top: 1px solid color-mix(in srgb, var(--algodon-200) 72%, transparent);
    color: var(--anil-1);
    font-size: .86rem;
}

.sv-table tbody tr {
    transition:
        background-color .18s ease,
        transform .18s ease,
        box-shadow .18s ease;
}

.sv-table tbody tr:hover {
    background: color-mix(in srgb, var(--sabila-50) 54%, white);
}

.sv-table tbody tr:hover .sv-work-code {
    color: var(--muicle-1);
}

.sv-td-center {
    text-align: center;
}

.sv-td-left {
    text-align: left;
}

.sv-work {
    display: flex;
    flex-direction: column;
    gap: .18rem;
}

.sv-work-code {
    font-size: .95rem;
    font-weight: 850;
    color: var(--anil-1);
    letter-spacing: .01em;
}

.sv-work-pseudo {
    display: inline-flex;
    width: fit-content;
    padding: .14rem .45rem;
    border-radius: 999px;
    background: var(--anil-50);
    color: var(--anil-700);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.sv-work-title {
    max-width: 460px;
    color: var(--anil-1);
    font-size: .9rem;
    font-weight: 750;
    line-height: 1.35;
}

.sv-work-meta {
    margin-top: .18rem;
    color: var(--algodon-700);
    font-size: .76rem;
}

.sv-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    min-height: 28px;
    padding: .32rem .68rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.sv-badge i {
    font-size: .78rem;
}

.sv-badge-registrado {
    background: var(--cedron-50);
    border-color: var(--cedron-200);
    color: var(--cedron-700);
}

.sv-badge-completo {
    background: var(--nopal-50);
    border-color: var(--nopal-200);
    color: var(--nopal-700);
}

.sv-badge-pendiente {
    background: var(--arnica-50);
    border-color: var(--arnica-200);
    color: var(--arnica-700);
}

.sv-badge-alerta {
    background: var(--jamaica-50);
    border-color: var(--jamaica-200);
    color: var(--jamaica-700);
}

.sv-counter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 30px;
    padding: 0 .55rem;
    border-radius: 999px;
    background: var(--anil-50);
    color: var(--anil-700);
    font-size: .8rem;
    font-weight: 800;
}

.sv-actions {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
}

.sv-btn,
.sv-btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    color: white;
    font-family: var(--font-ui);
    font-weight: 800;
    cursor: pointer;
    transition:
        transform .16s ease,
        box-shadow .16s ease,
        filter .16s ease;
}

.sv-btn {
    gap: .4rem;
    min-height: 40px;
    padding: .55rem 1rem;
    border-radius: 14px;
    font-size: .86rem;
}

.sv-btn-icon {
    width: 34px;
    height: 34px;
    border-radius: 12px;
}

.sv-btn:hover,
.sv-btn-icon:hover {
    transform: translateY(-1px);
    filter: brightness(1.05);
    box-shadow: 0 8px 18px rgba(11, 16, 42, .14);
}

.sv-btn:active,
.sv-btn-icon:active {
    transform: translateY(0);
    box-shadow: none;
}

.sv-btn-primary {
    background: linear-gradient(135deg, var(--sabila-1), var(--cedron-1));
}

.sv-btn-danger {
    background: linear-gradient(135deg, var(--jamaica-1), var(--muicle-1));
}

.sv-btn-muted {
    background: var(--algodon-200);
    color: var(--anil-1);
}

.sv-btn-view {
    background: linear-gradient(135deg, var(--anil-1), var(--cedron-1));
}

.sv-btn-users {
    background: linear-gradient(135deg, var(--sabila-1), var(--sabila-700));
}

.sv-btn-upload {
    background: linear-gradient(135deg, var(--arnica-1), var(--copal-1));
}

.sv-btn-upload-doc {
    position: relative;
    overflow: hidden;
    isolation: isolate;

    background: linear-gradient(
        180deg,
        var(--malva-200),
        var(--muicle-200)
    );

    color: var(--muicle-700);
    border: 0;

    transition:
        color .45s ease,
        transform .35s ease,
        box-shadow .35s ease;
}

.sv-btn-upload-doc::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;

    background: linear-gradient(
        180deg,
        var(--muicle-200),
        var(--muicle-1) 48%,
        var(--muicle-700)
    );

    transform: translateY(105%);
    transition: transform 1.35s ease-in-out;
}

.sv-btn-upload-doc:hover {
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 12px 26px color-mix(in srgb, var(--muicle-700) 32%, transparent);
}

.sv-btn-upload-doc:hover::before {
    transform: translateY(0);
}

.sv-btn-upload-doc:active {
    transform: translateY(0);
}

.sv-btn-delete {
    background: linear-gradient(135deg, var(--jamaica-1), var(--muicle-1));
}

.sv-btn-success{
    background: linear-gradient(135deg, var(--nopal-1), var(--sabila-1));
}
.sv-btn-success:hover{
    background: linear-gradient(135deg, var(--nopal-200), var(--sabila-200));
}
.sv-btn-success:active{
    background: linear-gradient(135deg, var(--nopal-700), var(--sabila-700));
}
.sv-btn-pdf{
    background: linear-gradient(135deg, var(--muicle-1), var(--sabila-1));
}

.sv-panel .select2-container {
    width: 100% !important;
}

.sv-panel .select2-container--default .select2-selection--multiple,
.sv-panel .select2-container--default .select2-selection--single {
    min-height: 44px;
    border: 1px solid color-mix(in srgb, var(--anil-200) 70%, transparent);
    border-radius: 14px;
    background-color: rgba(255, 255, 255, .88);
}

.sv-panel .select2-container--default.select2-container--focus .select2-selection--multiple,
.sv-panel .select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--sabila-1);
    box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--sabila-200) 42%, transparent);
}

.sv-panel .select2-container--default .select2-selection--multiple .select2-selection__choice {
    border: 1px solid var(--sabila-200);
    border-radius: 999px;
    background: var(--sabila-50);
    color: var(--sabila-700);
    font-size: 1.5rem;
    font-weight: 700;

}

/* ========== SIEVAL - AUTORES TABLE STYLES ========== */

.sieAutores-td-autor {
  padding: .9rem .75rem;
}

.sieAutores-autor-cell {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  text-align: left;
}

.sieAutores-autor-id {
  font-size: .95rem;
  font-weight: 850;
  color: var(--anil-1);
}

.sieAutores-autor-email {
  font-size: .82rem;
  font-weight: 700;
  color: var(--anil-700);
  background: var(--cedron-50);
  padding: .18rem .45rem;
  border-radius: 6px;
  display: inline-block;
  width: fit-content;
}

.sieAutores-autor-fecha {
  font-size: .76rem;
  color: var(--algodon-700);
  font-style: italic;
}

.sieAutores-td-trabajo {
  padding: .9rem .75rem;
}

.sieAutores-trabajo-cell {
  display: flex;
  flex-direction: column;
  gap: .5rem;
  text-align: center;
}

.sieAutores-trabajo-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
}

.sieAutores-trabajo-codigo {
  font-size: .95rem;
  font-weight: 850;
  color: var(--anil-1);
}

.sieAutores-trabajo-modalidad {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .35rem;
}

.sieAutores-modalidad-id {
  font-size: .86rem;
  font-weight: 750;
  color: var(--anil-1);
  background: var(--cedron-50);
  padding: .18rem .4rem;
  border-radius: 6px;
}

.sieAutores-modalidad-nombre {
  font-size: .82rem;
  color: var(--algodon-700);
  font-style: italic;
}

.sieAutores-td-titulo {
  padding: .9rem .75rem;
}

.sieAutores-titulo-cell {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  text-align: center;
  max-width: 460px;
  margin: 0 auto;
}

.sieAutores-pseudonimo {
  display: inline-flex;
  width: fit-content;
  padding: .14rem .45rem;
  border-radius: 999px;
  background: var(--anil-50);
  color: var(--anil-700);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  margin: 0 auto;
}

.sieAutores-titulo {
  color: var(--anil-1);
  font-size: .9rem;
  font-weight: 750;
  line-height: 1.35;
}

.sieAutores-td-colaboradores {
  padding: .9rem .75rem;
}

.sieAutores-colaboradores-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 80px;
}

.sieAutores-colaboradores-list {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  width: 100%;
  max-width: 200px;
}

.sieAutores-colaborador-item {
  display: flex;
  flex-direction: column;
  gap: .35rem;
  padding: .4rem .35rem;
  border-radius: 6px;
  background: rgba(255, 255, 255, .5);
  font-size: .82rem;
  color: var(--anil-1);
  margin-bottom: .4rem;
}

.sieAutores-colaborador-item:last-child {
  margin-bottom: 0;
}

.sieAutores-colaborador-header {
  display: flex;
  align-items: center;
  gap: .3rem;
}

.sieAutores-colaborador-icon {
  font-size: 1.1rem;
  flex-shrink: 0;
  color: var(--sabila-1);
}

.sieAutores-colaborador-nombre {
  flex: 1;
  font-weight: 700;
  font-size: .8rem;
  text-align: left;
}

.sieAutores-colaborador-docs {
  display: flex;
  gap: .25rem;
  padding-left: 1.4rem;
}

.sieAutores-colaborador-doc-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: .85rem;
  flex-shrink: 0;
  cursor: pointer;
  transition: all .18s ease;
}

.sieAutores-colaborador-doc-item:hover {
  transform: scale(1.15);
}

.sieAutores-td-documentos {
  padding: .9rem .75rem;
}

.sieAutores-documentos-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 80px;
}

.sieAutores-documentos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));
  gap: .5rem;
  width: 100%;
  max-width: 200px;
}

.sieAutores-documento-item {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 6px;
  background: var(--nopal-50);
  border: 1px solid var(--nopal-200);
  cursor: pointer;
  transition: all .18s ease;
}

.sieAutores-documento-item:hover {
  background: var(--nopal-200);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(11, 16, 42, .08);
}

.sieAutores-documento-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  color: var(--nopal-700);
}

@media (max-width: 992px) {
  .sieAutores-titulo-cell {
    max-width: 100%;
  }

  .sieAutores-colaboradores-list {
    max-width: 100%;
  }

  .sieAutores-documentos-grid {
    max-width: 100%;
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (max-width: 768px) {
  .sieAutores-trabajo-header {
    flex-direction: column;
  }

  .sieAutores-documento-item {
    width: 45px;
    height: 45px;
  }

  .sieAutores-documento-icon {
    font-size: 1.2rem;
  }
}

@media (max-width: 576px) {
  .sieAutores-autor-email {
    font-size: .75rem;
    padding: .12rem .3rem;
  }

  .sieAutores-titulo {
    font-size: .82rem;
  }

  .sieAutores-documentos-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .sieAutores-documento-item {
    width: 40px;
    height: 40px;
  }
}
.sv-panel .select2-container--default .select2-selection--multiple .select2-selection__choice:nth-child(1) {
    background: var(--sabila-200);
    border: 1px solid var(--sabila-700);
    color: white;
}
.sv-panel .select2-container--default .select2-selection--multiple .select2-selection__choice:nth-child(2) {
    background: var(--muicle-200);
    border: 1px solid var(--muicle-700);
    color: white;
}
.sv-panel .select2-container--default .select2-selection--multiple .select2-selection__choice:nth-child(3) {
    background: var(--copal-200);
    border: 1px solid var(--copal-700);
    color: white;
}
.sv-panel .select2-container--default .select2-selection--multiple .select2-selection__choice:nth-child(4) {
    background: var(--jamaica-200);
    border: 1px solid var(--jamaica-700);
    color: white;
}
.sv-panel .select2-container--default .select2-selection--multiple .select2-selection__choice:nth-child(5) {
    background: var(--nopal-200);
    border: 1px solid var(--nopal-700);
    color: white;
}
.sv-panel .select2-container--default .select2-selection--multiple .select2-selection__choice:nth-child(6) {
    background: var(--arnica-200);
    border: 1px solid var(--arnica-700);
    color: white;
}
.sv-panel .select2-container--default .select2-search--inline .select2-search__field {
    margin-top: 9px;
    font-family: var(--font-ui);
    font-size: .86rem;
}
ul.ul-palabras-clave li.palabra-clave{
  list-style: none;
  float: left;
  margin-right: 5px;
  margin-top: 5px;
  padding: 0.2em 0.5em;
  border-radius: 0.25em;
}
.pil-mot:nth-child(5n+1),
ul.ul-palabras-clave li.palabra-clave:nth-child(5n+1),
.select2-container--default .select2-selection--multiple .select2-selection__choice:nth-child(5n+1) {
  background: color-mix(in srgb, var(--sabila-1) 18%, var(--algodon-50));
}
.pil-mot:nth-child(5n+2),
ul.ul-palabras-clave li.palabra-clave:nth-child(5n+2),
.select2-container--default .select2-selection--multiple .select2-selection__choice:nth-child(5n+2) {
  background: color-mix(in srgb, var(--muicle-1) 18%, var(--algodon-50))
}
.pil-mot:nth-child(5n+3),
ul.ul-palabras-clave li.palabra-clave:nth-child(5n+3),
.select2-container--default .select2-selection--multiple .select2-selection__choice:nth-child(5n+3) {
  background: color-mix(in srgb, var(--copal-1) 18%, var(--algodon-50));
}
.pil-mot:nth-child(5n+4),
ul.ul-palabras-clave li.palabra-clave:nth-child(5n+4),
.select2-container--default .select2-selection--multiple .select2-selection__choice:nth-child(5n+4) {
  background: color-mix(in srgb, var(--jamaica-1) 18%, var(--algodon-50));
}
.pil-mot:nth-child(5n+5),
ul.ul-palabras-clave li.palabra-clave:nth-child(5n+5),
.select2-container--default .select2-selection--multiple .select2-selection__choice:nth-child(5n+5) {
  background: color-mix(in srgb, var(--nopal-1) 18%, var(--algodon-50));
}

.sv-muted {
    color: var(--algodon-700);
}

.sv-empty-date {
    color: color-mix(in srgb, var(--algodon-700) 65%, transparent);
    font-size: .78rem;
}

@media (max-width: 992px) {
    .sv-panel {
        border-radius: 18px;
        padding: .75rem;
    }

    .sv-panel-header {
        flex-direction: column;
        padding: .5rem .35rem .85rem;
    }

    .sv-panel-body {
        padding: .25rem 0;
    }

    .sv-panel-footer {
        flex-direction: column-reverse;
        align-items: stretch;
        padding: 1rem .35rem .25rem;
    }

    .sv-panel-footer .sv-btn {
        width: 100%;
    }

    .sv-panel .grid.grid-cols-12 > [class*="col-span-"] {
        grid-column: span 12 / span 12;
    }

    .sv-table thead {
        display: none;
    }

    .sv-table,
    .sv-table tbody,
    .sv-table tr,
    .sv-table td {
        display: block;
        width: 100%;
    }

    .sv-table tbody tr {
        margin: .75rem;
        border: 1px solid var(--algodon-200);
        border-radius: 16px;
        background: white;
        overflow: hidden;
        box-shadow: 0 8px 24px rgba(11, 16, 42, .07);
    }

    .sv-table tbody td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 1rem;
        border-top: 1px solid var(--algodon-200);
        text-align: right;
    }

    .sv-table tbody td:first-child {
        border-top: 0;
    }

    .sv-table tbody td::before {
        content: attr(data-label);
        flex: 0 0 42%;
        text-align: left;
        color: var(--algodon-700);
        font-size: .72rem;
        font-weight: 800;
        letter-spacing: .04em;
        text-transform: uppercase;
    }

    .sv-work-title {
        max-width: none;
        text-align: right;
    }

    .sv-actions {
        flex-wrap: wrap;
        justify-content: flex-end;
    }
}

.subtitulo {
  padding: 0.5em 0.5em;
  margin: 0 0.15em 0 0.15em;
  color: var(--anil-1);
  border-bottom: 2px solid color-mix(in srgb, var(--anil-1) 18%, var(--algodon-50)) !important;
  border-top: 2px solid color-mix(in srgb, var(--anil-1) 18%, var(--algodon-50)) !important;
  background: color-mix(in srgb, var(--algodon-50) 88%, var(--sabila-1) 12%);
}

.tipuser {
  color: var(--muicle-1);
}

/* ======================================================
   SIEVAL / Componentes controlados para detalle de trabajo
   Alertas de bases, palabras clave, tabla y switch
   ====================================================== */


/* ─────────────────────────────────────────────
   Alertas de bases
   Sustituye visualmente alert-light solo en esta UX.
   ───────────────────────────────────────────── */

.sv-bases-alert {
    display: flex;
    align-items: flex-start;
    gap: .75rem;

    padding: .85rem .95rem;
    border: 1px solid color-mix(in srgb, var(--copal-1) 24%, transparent);
    border-radius: .75rem;

    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--algodon-50) 94%, white 6%),
            color-mix(in srgb, var(--copal-1) 9%, var(--algodon-50))
        );

    color: var(--anil-1);
    font-size: .82rem;
    line-height: 1.55;

    box-shadow:
        0 4px 14px color-mix(in srgb, var(--anil-1) 7%, transparent);
}

.sv-bases-alert-info {
    border-color: color-mix(in srgb, var(--sabila-1) 24%, transparent);
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--algodon-50) 94%, white 6%),
            color-mix(in srgb, var(--sabila-1) 10%, var(--algodon-50))
        );
}

.sv-bases-alert-note {
    border-color: color-mix(in srgb, var(--muicle-1) 22%, transparent);
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--algodon-50) 94%, white 6%),
            color-mix(in srgb, var(--muicle-1) 8%, var(--algodon-50))
        );
}

.sv-bases-badge {
    flex: 0 0 auto;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 82px;
    padding: .28rem .55rem;
    border-radius: 999px;

    background: var(--copal-1);
    color: white;

    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .045em;
    text-transform: uppercase;
    line-height: 1.2;
}

.sv-bases-alert-info .sv-bases-badge {
    background: var(--sabila-1);
}

.sv-bases-alert-note .sv-bases-badge {
    background: var(--muicle-1);
}

.sv-bases-content {
    flex: 1 1 auto;
    min-width: 0;
}

.sv-bases-content p {
    margin: 0 0 .45rem;
}

.sv-bases-content p:last-child {
    margin-bottom: 0;
}

.sv-bases-list {
    margin: .35rem 0 0;
    padding-left: 1.1rem;
}

.sv-bases-list li {
    margin-bottom: .35rem;
}

.sv-bases-list li:last-child {
    margin-bottom: 0;
}

.sv-bases-list strong {
    color: var(--muicle-1);
}


/* ─────────────────────────────────────────────
   Palabras clave
   ───────────────────────────────────────────── */

.ul-palabras-clave {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem;

    padding-left: 0;
    margin-top: .15rem;
    margin-bottom: 0;

    list-style: none;
}

.palabra-clave {
    display: inline-flex;
    align-items: center;

    padding: .34rem .68rem;
    border: 1px solid color-mix(in srgb, var(--sabila-1) 28%, transparent);
    border-radius: 999px;

    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--sabila-1) 14%, var(--algodon-50)),
            color-mix(in srgb, var(--anil-1) 6%, var(--algodon-50))
        );

    color: var(--anil-1);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .035em;

    box-shadow: 0 2px 8px color-mix(in srgb, var(--anil-1) 7%, transparent);
}

.palabra-clave::before {
    margin-right: .18rem;
    color: var(--sabila-1);
    font-weight: 900;
}
.bienvenido{
    padding: 1em 1em;
    color: var(--anil-1);
}


/* ─────────────────────────────────────────────
   Tabla de documentos / colaboradores
   ───────────────────────────────────────────── */

   
.sv-table-wrap {
    border: 1px solid color-mix(in srgb, var(--anil-1) 12%, transparent);
    border-radius: .85rem;
    background: color-mix(in srgb, var(--algodon-50) 96%, white 4%);
    overflow: hidden;

    box-shadow:
        0 4px 16px color-mix(in srgb, var(--anil-1) 7%, transparent);
}

.sv-table-docs {
    width: 100%;
    margin-bottom: 0;

    border-collapse: separate;
    border-spacing: 0;

    color: var(--anil-1);
    font-size: .82rem;
}

.sv-table-docs thead th {
    padding: .72rem .65rem;

    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--anil-1) 18%, transparent);

    background:
        linear-gradient(
            180deg,
            color-mix(in srgb, var(--anil-1) 92%, var(--sabila-1) 8%),
            var(--anil-1)
        );

    color: white;
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .045em;
    text-transform: uppercase;
    vertical-align: middle;
}

.sv-table-docs thead tr:nth-child(2) th {
    background:
        linear-gradient(
            180deg,
            color-mix(in srgb, var(--sabila-1) 72%, var(--anil-1) 28%),
            color-mix(in srgb, var(--sabila-1) 62%, var(--anil-1) 38%)
        );
}

.sv-table-docs tbody td {
    padding: .72rem .65rem;
    vertical-align: middle;

    border-top: 1px solid color-mix(in srgb, var(--anil-1) 8%, transparent);

    background: rgba(255, 255, 255, .72);
    color: var(--anil-1);
}

.sv-table-docs tbody tr:nth-child(even) td {
    background: color-mix(in srgb, var(--algodon-50) 92%, var(--sabila-1) 8%);
}

.sv-table-docs tbody tr:hover td {
    background: color-mix(in srgb, var(--sabila-1) 13%, var(--algodon-50));
}


/* ─────────────────────────────────────────────
   Switch repositorio
   ───────────────────────────────────────────── */

.sv-repo-switch {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;

    margin-top: 1rem;
    margin-bottom: 1rem;
    padding: .85rem 1rem;

    border: 1px solid color-mix(in srgb, var(--sabila-1) 20%, transparent);
    border-radius: .85rem;

    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--algodon-50) 93%, white 7%),
            color-mix(in srgb, var(--sabila-1) 10%, var(--algodon-50))
        );

    box-shadow:
        0 4px 14px color-mix(in srgb, var(--anil-1) 7%, transparent);
}

.sv-repo-switch-label {
    display: flex;
    flex-direction: column;
    gap: .15rem;

    margin: 0;
    color: var(--anil-1);
    cursor: pointer;
}

.sv-repo-switch-title {
    color: var(--sabila-1);
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .065em;
    text-transform: uppercase;
}

.sv-repo-switch-text {
    color: var(--anil-1);
    font-size: .92rem;
    font-weight: 400;
    line-height: 1.3;
}

.sv-repo-switch-control {
    flex: 0 0 auto;
}

.sv-repo-switch-control input[type="checkbox"] {
    width: 44px;
    height: 24px;

    appearance: none;
    -webkit-appearance: none;

    position: relative;
    border: 1px solid color-mix(in srgb, var(--anil-1) 20%, transparent);
    border-radius: 999px;

    background: color-mix(in srgb, var(--anil-1) 18%, var(--algodon-50));
    cursor: pointer;

    transition:
        background .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}

.sv-repo-switch-control input[type="checkbox"]::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;

    width: 16px;
    height: 16px;
    border-radius: 50%;

    background: white;
    box-shadow: 0 2px 5px rgba(11, 16, 42, .25);

    transition: transform .18s ease;
}

.sv-repo-switch-control input[type="checkbox"]:checked {
    border-color: color-mix(in srgb, var(--sabila-1) 70%, transparent);
    background: var(--sabila-1);
    box-shadow: 0 0 0 .18rem color-mix(in srgb, var(--sabila-1) 18%, transparent);
}

.sv-repo-switch-control input[type="checkbox"]:checked::before {
    transform: translateX(20px);
}


/* ─────────────────────────────────────────────
   Responsive mínimo
   ───────────────────────────────────────────── */

@media (max-width: 576px) {
    .sv-bases-alert {
        flex-direction: column;
        gap: .55rem;
    }

    .sv-bases-badge {
        min-width: auto;
    }

    .sv-repo-switch {
        align-items: flex-start;
        flex-direction: column;
    }

    .sv-repo-switch-control {
        align-self: flex-end;
    }
}

/* ─────────────────────────────────────────────
   Fondos base
   ───────────────────────────────────────────── */

.bg-muicle { background-color: var(--muicle-1) !important; }
.bg-anil { background-color: var(--anil-1) !important; }
.bg-sabila { background-color: var(--sabila-1) !important; }
.bg-bugam { background-color: var(--bugam-1) !important; }
.bg-copal { background-color: var(--copal-1) !important; }
.bg-malva { background-color: var(--malva-1) !important; }

.bg-algodon { background-color: var(--algodon-1) !important; }
.bg-algodon-50 { background-color: var(--algodon-50) !important; }
.bg-algodon-200 { background-color: var(--algodon-200) !important; }
.bg-algodon-700 { background-color: var(--algodon-700) !important; }

.bg-nopal { background-color: var(--nopal-1) !important; }
.bg-jamaica { background-color: var(--jamaica-1) !important; }
.bg-cedron { background-color: var(--cedron-1) !important; }
.bg-arnica { background-color: var(--arnica-1) !important; }

.bg-menta { background-color: var(--menta-1) !important; }
.bg-lirio { background-color: var(--lirio-1) !important; }


/* ─────────────────────────────────────────────
   Fondos claros / medios / oscuros
   ───────────────────────────────────────────── */

.bg-muicle-50 { background-color: var(--muicle-50) !important; }
.bg-muicle-200 { background-color: var(--muicle-200) !important; }
.bg-muicle-700 { background-color: var(--muicle-700) !important; }

.bg-anil-50 { background-color: var(--anil-50) !important; }
.bg-anil-200 { background-color: var(--anil-200) !important; }
.bg-anil-700 { background-color: var(--anil-700) !important; }

.bg-sabila-50 { background-color: var(--sabila-50) !important; }
.bg-sabila-200 { background-color: var(--sabila-200) !important; }
.bg-sabila-700 { background-color: var(--sabila-700) !important; }

.bg-bugam-50 { background-color: var(--bugam-50) !important; }
.bg-bugam-200 { background-color: var(--bugam-200) !important; }
.bg-bugam-700 { background-color: var(--bugam-700) !important; }

.bg-copal-50 { background-color: var(--copal-50) !important; }
.bg-copal-200 { background-color: var(--copal-200) !important; }
.bg-copal-700 { background-color: var(--copal-700) !important; }

.bg-malva-50 { background-color: var(--malva-50) !important; }
.bg-malva-200 { background-color: var(--malva-200) !important; }
.bg-malva-700 { background-color: var(--malva-700) !important; }

.bg-nopal-50 { background-color: var(--nopal-50) !important; }
.bg-nopal-200 { background-color: var(--nopal-200) !important; }
.bg-nopal-700 { background-color: var(--nopal-700) !important; }

.bg-jamaica-50 { background-color: var(--jamaica-50) !important; }
.bg-jamaica-200 { background-color: var(--jamaica-200) !important; }
.bg-jamaica-700 { background-color: var(--jamaica-700) !important; }

.bg-cedron-50 { background-color: var(--cedron-50) !important; }
.bg-cedron-200 { background-color: var(--cedron-200) !important; }
.bg-cedron-700 { background-color: var(--cedron-700) !important; }

.bg-arnica-50 { background-color: var(--arnica-50) !important; }
.bg-arnica-200 { background-color: var(--arnica-200) !important; }
.bg-arnica-700 { background-color: var(--arnica-700) !important; }

.bg-menta-50 { background-color: var(--menta-50) !important; }
.bg-menta-200 { background-color: var(--menta-200) !important; }
.bg-menta-700 { background-color: var(--menta-700) !important; }

.bg-lirio-50 { background-color: var(--lirio-50) !important; }
.bg-lirio-200 { background-color: var(--lirio-200) !important; }
.bg-lirio-700 { background-color: var(--lirio-700) !important; }


/* ─────────────────────────────────────────────
   Texto
   ───────────────────────────────────────────── */

.tx-muicle { color: var(--muicle-1) !important; }
.tx-anil { color: var(--anil-1) !important; }
.tx-sabila { color: var(--sabila-1) !important; }
.tx-bugam { color: var(--bugam-1) !important; }
.tx-copal { color: var(--copal-1) !important; }
.tx-malva { color: var(--malva-1) !important; }

.tx-algodon { color: var(--algodon-1) !important; }
.tx-algodon-50 { color: var(--algodon-50) !important; }
.tx-algodon-200 { color: var(--algodon-200) !important; }
.tx-algodon-700 { color: var(--algodon-700) !important; }

.tx-nopal { color: var(--nopal-1) !important; }
.tx-jamaica { color: var(--jamaica-1) !important; }
.tx-cedron { color: var(--cedron-1) !important; }
.tx-arnica { color: var(--arnica-1) !important; }

.tx-menta { color: var(--menta-1) !important; }
.tx-lirio { color: var(--lirio-1) !important; }


/* ─────────────────────────────────────────────
   Texto por intensidad
   ───────────────────────────────────────────── */

.tx-muicle-50 { color: var(--muicle-50) !important; }
.tx-muicle-200 { color: var(--muicle-200) !important; }
.tx-muicle-700 { color: var(--muicle-700) !important; }

.tx-anil-50 { color: var(--anil-50) !important; }
.tx-anil-200 { color: var(--anil-200) !important; }
.tx-anil-700 { color: var(--anil-700) !important; }

.tx-sabila-50 { color: var(--sabila-50) !important; }
.tx-sabila-200 { color: var(--sabila-200) !important; }
.tx-sabila-700 { color: var(--sabila-700) !important; }

.tx-bugam-50 { color: var(--bugam-50) !important; }
.tx-bugam-200 { color: var(--bugam-200) !important; }
.tx-bugam-700 { color: var(--bugam-700) !important; }

.tx-copal-50 { color: var(--copal-50) !important; }
.tx-copal-200 { color: var(--copal-200) !important; }
.tx-copal-700 { color: var(--copal-700) !important; }

.tx-malva-50 { color: var(--malva-50) !important; }
.tx-malva-200 { color: var(--malva-200) !important; }
.tx-malva-700 { color: var(--malva-700) !important; }

.tx-nopal-50 { color: var(--nopal-50) !important; }
.tx-nopal-200 { color: var(--nopal-200) !important; }
.tx-nopal-700 { color: var(--nopal-700) !important; }

.tx-jamaica-50 { color: var(--jamaica-50) !important; }
.tx-jamaica-200 { color: var(--jamaica-200) !important; }
.tx-jamaica-700 { color: var(--jamaica-700) !important; }

.tx-cedron-50 { color: var(--cedron-50) !important; }
.tx-cedron-200 { color: var(--cedron-200) !important; }
.tx-cedron-700 { color: var(--cedron-700) !important; }

.tx-arnica-50 { color: var(--arnica-50) !important; }
.tx-arnica-200 { color: var(--arnica-200) !important; }
.tx-arnica-700 { color: var(--arnica-700) !important; }

.tx-menta-50 { color: var(--menta-50) !important; }
.tx-menta-200 { color: var(--menta-200) !important; }
.tx-menta-700 { color: var(--menta-700) !important; }

.tx-lirio-50 { color: var(--lirio-50) !important; }
.tx-lirio-200 { color: var(--lirio-200) !important; }
.tx-lirio-700 { color: var(--lirio-700) !important; }

/* ─────────────────────────────────────────────
   Base de borde
   ───────────────────────────────────────────── */

.bd {
    border: 1px solid transparent !important;
}

.bd-0 {
    border: 0 !important;
}

.bd-soft {
    border: 1px solid color-mix(in srgb, var(--anil-200) 45%, transparent) !important;
}

.bd-muted {
    border: 1px solid color-mix(in srgb, var(--algodon-700) 18%, transparent) !important;
}

.bd-strong {
    border: 1px solid color-mix(in srgb, var(--anil-700) 65%, transparent) !important;
}


/* ─────────────────────────────────────────────
   Bordes por color
   ───────────────────────────────────────────── */

.bd-muicle { border-color: var(--muicle-1) !important; }
.bd-anil { border-color: var(--anil-1) !important; }
.bd-sabila { border-color: var(--sabila-1) !important; }
.bd-bugam { border-color: var(--bugam-1) !important; }
.bd-copal { border-color: var(--copal-1) !important; }
.bd-malva { border-color: var(--malva-1) !important; }

.bd-algodon { border-color: var(--algodon-1) !important; }
.bd-algodon-50 { border-color: var(--algodon-50) !important; }
.bd-algodon-200 { border-color: var(--algodon-200) !important; }
.bd-algodon-700 { border-color: var(--algodon-700) !important; }

.bd-nopal { border-color: var(--nopal-1) !important; }
.bd-jamaica { border-color: var(--jamaica-1) !important; }
.bd-cedron { border-color: var(--cedron-1) !important; }
.bd-arnica { border-color: var(--arnica-1) !important; }

.bd-menta { border-color: var(--menta-1) !important; }
.bd-lirio { border-color: var(--lirio-1) !important; }


/* ─────────────────────────────────────────────
   Bordes por intensidad
   ───────────────────────────────────────────── */

.bd-muicle-50 { border-color: var(--muicle-50) !important; }
.bd-muicle-200 { border-color: var(--muicle-200) !important; }
.bd-muicle-700 { border-color: var(--muicle-700) !important; }

.bd-anil-50 { border-color: var(--anil-50) !important; }
.bd-anil-200 { border-color: var(--anil-200) !important; }
.bd-anil-700 { border-color: var(--anil-700) !important; }

.bd-sabila-50 { border-color: var(--sabila-50) !important; }
.bd-sabila-200 { border-color: var(--sabila-200) !important; }
.bd-sabila-700 { border-color: var(--sabila-700) !important; }

.bd-bugam-50 { border-color: var(--bugam-50) !important; }
.bd-bugam-200 { border-color: var(--bugam-200) !important; }
.bd-bugam-700 { border-color: var(--bugam-700) !important; }

.bd-copal-50 { border-color: var(--copal-50) !important; }
.bd-copal-200 { border-color: var(--copal-200) !important; }
.bd-copal-700 { border-color: var(--copal-700) !important; }

.bd-malva-50 { border-color: var(--malva-50) !important; }
.bd-malva-200 { border-color: var(--malva-200) !important; }
.bd-malva-700 { border-color: var(--malva-700) !important; }

.bd-nopal-50 { border-color: var(--nopal-50) !important; }
.bd-nopal-200 { border-color: var(--nopal-200) !important; }
.bd-nopal-700 { border-color: var(--nopal-700) !important; }

.bd-jamaica-50 { border-color: var(--jamaica-50) !important; }
.bd-jamaica-200 { border-color: var(--jamaica-200) !important; }
.bd-jamaica-700 { border-color: var(--jamaica-700) !important; }

.bd-cedron-50 { border-color: var(--cedron-50) !important; }
.bd-cedron-200 { border-color: var(--cedron-200) !important; }
.bd-cedron-700 { border-color: var(--cedron-700) !important; }

.bd-arnica-50 { border-color: var(--arnica-50) !important; }
.bd-arnica-200 { border-color: var(--arnica-200) !important; }
.bd-arnica-700 { border-color: var(--arnica-700) !important; }

.bd-menta-50 { border-color: var(--menta-50) !important; }
.bd-menta-200 { border-color: var(--menta-200) !important; }
.bd-menta-700 { border-color: var(--menta-700) !important; }

.bd-lirio-50 { border-color: var(--lirio-50) !important; }
.bd-lirio-200 { border-color: var(--lirio-200) !important; }
.bd-lirio-700 { border-color: var(--lirio-700) !important; }


/* ─────────────────────────────────────────────
   Bordes direccionales
   Uso:
   .bdl-muicle
   .bdt-anil
   .bdr-sabila
   .bdb-copal
   ───────────────────────────────────────────── */

.bdl-muicle { border-left: 4px solid var(--muicle-1) !important; }
.bdl-anil { border-left: 4px solid var(--anil-1) !important; }
.bdl-sabila { border-left: 4px solid var(--sabila-1) !important; }
.bdl-bugam { border-left: 4px solid var(--bugam-1) !important; }
.bdl-copal { border-left: 4px solid var(--copal-1) !important; }
.bdl-malva { border-left: 4px solid var(--malva-1) !important; }
.bdl-nopal { border-left: 4px solid var(--nopal-1) !important; }
.bdl-jamaica { border-left: 4px solid var(--jamaica-1) !important; }
.bdl-cedron { border-left: 4px solid var(--cedron-1) !important; }
.bdl-arnica { border-left: 4px solid var(--arnica-1) !important; }
.bdl-menta { border-left: 4px solid var(--menta-1) !important; }
.bdl-lirio { border-left: 4px solid var(--lirio-1) !important; }

.bdt-muicle { border-top: 4px solid var(--muicle-1) !important; }
.bdt-anil { border-top: 4px solid var(--anil-1) !important; }
.bdt-sabila { border-top: 4px solid var(--sabila-1) !important; }
.bdt-bugam { border-top: 4px solid var(--bugam-1) !important; }
.bdt-copal { border-top: 4px solid var(--copal-1) !important; }
.bdt-malva { border-top: 4px solid var(--malva-1) !important; }
.bdt-nopal { border-top: 4px solid var(--nopal-1) !important; }
.bdt-jamaica { border-top: 4px solid var(--jamaica-1) !important; }
.bdt-cedron { border-top: 4px solid var(--cedron-1) !important; }
.bdt-arnica { border-top: 4px solid var(--arnica-1) !important; }
.bdt-menta { border-top: 4px solid var(--menta-1) !important; }
.bdt-lirio { border-top: 4px solid var(--lirio-1) !important; }

.bdr-muicle { border-right: 4px solid var(--muicle-1) !important; }
.bdr-anil { border-right: 4px solid var(--anil-1) !important; }
.bdr-sabila { border-right: 4px solid var(--sabila-1) !important; }
.bdr-bugam { border-right: 4px solid var(--bugam-1) !important; }
.bdr-copal { border-right: 4px solid var(--copal-1) !important; }
.bdr-malva { border-right: 4px solid var(--malva-1) !important; }
.bdr-nopal { border-right: 4px solid var(--nopal-1) !important; }
.bdr-jamaica { border-right: 4px solid var(--jamaica-1) !important; }
.bdr-cedron { border-right: 4px solid var(--cedron-1) !important; }
.bdr-arnica { border-right: 4px solid var(--arnica-1) !important; }
.bdr-menta { border-right: 4px solid var(--menta-1) !important; }
.bdr-lirio { border-right: 4px solid var(--lirio-1) !important; }

.bdb-muicle { border-bottom: 4px solid var(--muicle-1) !important; }
.bdb-anil { border-bottom: 4px solid var(--anil-1) !important; }
.bdb-sabila { border-bottom: 4px solid var(--sabila-1) !important; }
.bdb-bugam { border-bottom: 4px solid var(--bugam-1) !important; }
.bdb-copal { border-bottom: 4px solid var(--copal-1) !important; }
.bdb-malva { border-bottom: 4px solid var(--malva-1) !important; }
.bdb-nopal { border-bottom: 4px solid var(--nopal-1) !important; }
.bdb-jamaica { border-bottom: 4px solid var(--jamaica-1) !important; }
.bdb-cedron { border-bottom: 4px solid var(--cedron-1) !important; }
.bdb-arnica { border-bottom: 4px solid var(--arnica-1) !important; }
.bdb-menta { border-bottom: 4px solid var(--menta-1) !important; }
.bdb-lirio { border-bottom: 4px solid var(--lirio-1) !important; }


/* ─────────────────────────────────────────────
   Radios estándar
   ───────────────────────────────────────────── */

.rd-0 { border-radius: 0 !important; }
.rd-xs { border-radius: .25rem !important; }
.rd-sm { border-radius: .5rem !important; }
.rd-md { border-radius: .75rem !important; }
.rd-lg { border-radius: 1rem !important; }
.rd-xl { border-radius: 1.35rem !important; }
.rd-pill { border-radius: 999px !important; }


/* ─────────────────────────────────────────────
   Patrones compuestos de superficie
   ───────────────────────────────────────────── */

.sv-card {
    background: var(--algodon-50);
    border: 1px solid color-mix(in srgb, var(--anil-200) 45%, transparent);
    border-radius: 1rem;
    box-shadow:
        0 10px 26px color-mix(in srgb, var(--anil-700) 8%, transparent),
        0 1px 0 color-mix(in srgb, white 78%, transparent) inset;
}

.sv-card-muicle {
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--muicle-50) 78%, white),
            var(--algodon-50)
        );
    border: 1px solid var(--muicle-200);
    border-left: 5px solid var(--muicle-1);
    color: var(--muicle-700);
}

.sv-card-anil {
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--anil-50) 82%, white),
            var(--algodon-50)
        );
    border: 1px solid var(--anil-200);
    border-left: 5px solid var(--anil-1);
    color: var(--anil-700);
}

.sv-card-sabila {
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--sabila-50) 80%, white),
            var(--algodon-50)
        );
    border: 1px solid var(--sabila-200);
    border-left: 5px solid var(--sabila-1);
    color: var(--sabila-700);
}

.sv-card-bugam {
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--bugam-50) 78%, white),
            var(--algodon-50)
        );
    border: 1px solid var(--bugam-200);
    border-left: 5px solid var(--bugam-1);
    color: var(--bugam-700);
}

.sv-card-copal {
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--copal-50) 78%, white),
            var(--algodon-50)
        );
    border: 1px solid var(--copal-200);
    border-left: 5px solid var(--copal-1);
    color: var(--copal-700);
}

.sv-card-malva {
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--malva-50) 82%, white),
            var(--algodon-50)
        );
    border: 1px solid var(--malva-200);
    border-left: 5px solid var(--malva-1);
    color: var(--malva-700);
}


/* ─────────────────────────────────────────────
   Estados funcionales
   ───────────────────────────────────────────── */

.sv-info {
    background: var(--cedron-50);
    border: 1px solid var(--cedron-200);
    border-left: 5px solid var(--cedron-1);
    color: var(--cedron-700);
}

.sv-success {
    background: var(--nopal-50);
    border: 1px solid var(--nopal-200);
    border-left: 5px solid var(--nopal-1);
    color: var(--nopal-700);
}

.sv-warning {
    background: var(--arnica-50);
    border: 1px solid var(--arnica-200);
    border-left: 5px solid var(--arnica-1);
    color: var(--arnica-700);
}

.sv-danger {
    background: var(--jamaica-50);
    border: 1px solid var(--jamaica-200);
    border-left: 5px solid var(--jamaica-1);
    color: var(--jamaica-700);
}

.sv-doc {
    background: var(--menta-50);
    border: 1px solid var(--menta-200);
    border-left: 5px solid var(--menta-1);
    color: var(--menta-700);
}

.sv-resource {
    background: var(--lirio-50);
    border: 1px solid var(--lirio-200);
    border-left: 5px solid var(--lirio-1);
    color: var(--lirio-700);
}


/* ─────────────────────────────────────────────
   Badges / chips
   ───────────────────────────────────────────── */

.sv-chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-height: 1.65rem;
    padding: .22rem .65rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    border: 1px solid transparent;
}

.sv-chip-muicle {
    background: var(--muicle-50);
    border-color: var(--muicle-200);
    color: var(--muicle-700);
}

.sv-chip-anil {
    background: var(--anil-50);
    border-color: var(--anil-200);
    color: var(--anil-700);
}

.sv-chip-sabila {
    background: var(--sabila-50);
    border-color: var(--sabila-200);
    color: var(--sabila-700);
}

.sv-chip-bugam {
    background: var(--bugam-50);
    border-color: var(--bugam-200);
    color: var(--bugam-700);
}

.sv-chip-copal {
    background: var(--copal-50);
    border-color: var(--copal-200);
    color: var(--copal-700);
}

.sv-chip-nopal {
    background: var(--nopal-50);
    border-color: var(--nopal-200);
    color: var(--nopal-700);
}

.sv-chip-jamaica {
    background: var(--jamaica-50);
    border-color: var(--jamaica-200);
    color: var(--jamaica-700);
}

.sv-chip-cedron {
    background: var(--cedron-50);
    border-color: var(--cedron-200);
    color: var(--cedron-700);
}

.sv-chip-arnica {
    background: var(--arnica-50);
    border-color: var(--arnica-200);
    color: var(--arnica-700);
}

.sv-chip-menta {
    background: var(--menta-50);
    border-color: var(--menta-200);
    color: var(--menta-700);
}

.sv-chip-lirio {
    background: var(--lirio-50);
    border-color: var(--lirio-200);
    color: var(--lirio-700);
}


/* ─────────────────────────────────────────────
   Gradientes institucionales
   ───────────────────────────────────────────── */

.bg-sieval-main {
    background:
        radial-gradient(circle at top left, color-mix(in srgb, var(--bugam-1) 30%, transparent), transparent 36%),
        radial-gradient(circle at bottom right, color-mix(in srgb, var(--sabila-1) 32%, transparent), transparent 42%),
        linear-gradient(135deg, var(--anil-1), var(--muicle-1));
    color: var(--algodon-50);
}

.bg-sieval-soft {
    background:
        radial-gradient(circle at top left, color-mix(in srgb, var(--sabila-50) 80%, transparent), transparent 36%),
        radial-gradient(circle at bottom right, color-mix(in srgb, var(--muicle-50) 82%, transparent), transparent 42%),
        var(--algodon-50);
}

.bg-sieval-warm {
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--copal-50) 74%, white),
            color-mix(in srgb, var(--bugam-50) 64%, white),
            var(--algodon-50)
        );
}

.bg-sieval-cold {
    background:
        linear-gradient(
            135deg,
            color-mix(in srgb, var(--anil-50) 78%, white),
            color-mix(in srgb, var(--sabila-50) 70%, white),
            var(--algodon-50)
        );
}


/* ─────────────────────────────────────────────
   Sombras estándar
   ───────────────────────────────────────────── */

.sh-none {
    box-shadow: none !important;
}

.sh-soft {
    box-shadow: 0 8px 22px color-mix(in srgb, var(--anil-700) 8%, transparent) !important;
}

.sh-md {
    box-shadow: 0 14px 34px color-mix(in srgb, var(--anil-700) 12%, transparent) !important;
}

.sh-lg {
    box-shadow: 0 22px 54px color-mix(in srgb, var(--anil-700) 18%, transparent) !important;
}

.sh-muicle {
    box-shadow: 0 12px 34px color-mix(in srgb, var(--muicle-1) 20%, transparent) !important;
}

.sh-anil {
    box-shadow: 0 12px 34px color-mix(in srgb, var(--anil-1) 22%, transparent) !important;
}

.sh-sabila {
    box-shadow: 0 12px 34px color-mix(in srgb, var(--sabila-1) 18%, transparent) !important;
}

.sh-bugam {
    box-shadow: 0 12px 34px color-mix(in srgb, var(--bugam-1) 18%, transparent) !important;
}

.sh-copal {
    box-shadow: 0 12px 34px color-mix(in srgb, var(--copal-1) 18%, transparent) !important;
}

.select2-container {
  border: transparent;
}

.resumen-trabajo {
    padding: .4rem 1.5rem 1rem;
}

.resumen-trabajo-bienvenida {
    margin-bottom: .35rem;
    font-size: .9rem;
}

.resumen-trabajo-cabecera {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.resumen-trabajo-identidad {
    display: flex;
    align-items: center;
    gap: .45rem;
    font-size: 1.25rem;
}

.resumen-trabajo-acciones {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.resumen-trabajo-contenido {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
}

.resumen-trabajo-imagen {
    flex: 0 0 135px;
    width: 135px;
    height: 135px;
}

.resumen-trabajo-imagen img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.resumen-trabajo-datos {
    flex: 1;
    min-width: 0;
}

.resumen-trabajo-fila {
    display: grid;
    grid-template-columns: 135px minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
    margin-bottom: .8rem;
}

.resumen-trabajo-label {
    padding-top: .3rem;
    text-align: right;
    font-weight: 500;
}

.resumen-trabajo-valor {
    padding: .3rem 0;
    min-width: 0;
}

.resumen-trabajo-valor .ul-palabras-clave {
    margin: 0;
}

@media (max-width: 768px) {

    .resumen-trabajo-cabecera {
        align-items: flex-start;
    }

    .resumen-trabajo-contenido {
        flex-direction: column;
    }

    .resumen-trabajo-fila {
        grid-template-columns: 1fr;
        gap: .15rem;
    }

    .resumen-trabajo-label {
        text-align: left;
    }
}



/* ==========================================================
   SIEVAL · PANORAMA OPERATIVO DE TRABAJOS
   Control visual integral del módulo SeguimientoTrabajos_4
   ========================================================== */

.seg2-shell {
    --seg2-navy-950: #082c4c;
    --seg2-navy-900: #0b365c;
    --seg2-navy-800: #104c73;
    --seg2-blue-700: #126f87;
    --seg2-cyan-500: #12a4c1;

    --seg2-wine-800: #7f154d;
    --seg2-wine-700: #9b1d5a;
    --seg2-magenta-600: #b52369;
    --seg2-purple-500: #8b3fad;

    --seg2-gold-700: #a66f1d;
    --seg2-gold-600: #c18a2e;
    --seg2-gold-100: #f7eedc;

    --seg2-green-700: #397a65;
    --seg2-green-100: #e8f3ef;

    --seg2-red-700: #a14740;
    --seg2-red-100: #f8e9e7;

    --seg2-ink: #293344;
    --seg2-muted: #73808d;
    --seg2-border: #e2e7eb;
    --seg2-border-soft: #edf0f2;
    --seg2-paper: #ffffff;
    --seg2-soft: #f8fafb;
    --seg2-soft-blue: #f0f7fa;
    --seg2-soft-wine: #fbf3f7;

    width: min(100%, 1440px);
    margin: 0 auto;
    padding: 0 .75rem 2rem;
    box-sizing: border-box;
}

.seg2-shell *,
.seg2-shell *::before,
.seg2-shell *::after {
    box-sizing: border-box;
}

/* ==========================================================
   SELECTOR DE AÑO / CABECERA EXTERNA
   El selector compartido queda visualmente integrado al módulo.
   ========================================================== */

.seg2-toolbar {
    width: 100%;
    margin-bottom: .85rem;
}

.seg2-toolbar > div {
    width: 100%;
}

.seg2-toolbar .bg-gray-100 {
    min-height: 64px;
    padding: .6rem .8rem !important;
    border: 1px solid var(--seg2-border);
    border-radius: 14px !important;
    background:
        linear-gradient(100deg, rgba(8, 44, 76, .035), transparent 35%),
        #fff !important;
    box-shadow: 0 5px 18px rgba(8, 44, 76, .06);
}

.seg2-toolbar h1 {
    margin: .15rem 0 !important;
    color: var(--seg2-navy-900) !important;
    font-size: 1.15rem !important;
    font-weight: 750;
    letter-spacing: -.01em;
}

.seg2-toolbar .btn-azul-1 {
    border-color: var(--seg2-navy-800);
    background: var(--seg2-navy-800);
}

.seg2-toolbar #refresh {
    border: 1px solid var(--seg2-border);
}

/* ==========================================================
   CONTENEDOR GENERAL
   ========================================================== */

.seg2-content {
    width: 100%;
    min-width: 0;
}

.seg2-dashboard-wrap {
    width: min(100%, 1400px);
    margin: 0 auto;
    padding: .55rem;
    border: 1px solid color-mix(in srgb, var(--cedron-200) 62%, transparent);
    border-radius: 16px;
    background:
        linear-gradient(130deg, rgba(33, 79, 112, .05), rgba(255, 255, 255, .55) 52%, rgba(155, 29, 90, .05));
    box-shadow: 0 14px 34px rgba(20, 45, 65, .08);
}

.seg2-dashboard {
    display: grid;
    gap: 1rem;
    width: 100%;
    min-width: 0;
    color: var(--seg2-ink);
}

/* ==========================================================
   INTRO
   ========================================================== */

.seg2-intro {
    display: flex;
    align-items: center;
    gap: .9rem;
    padding: 1rem 1.1rem;
    border: 1px solid var(--seg2-border);
    border-radius: 14px;
    background:
        linear-gradient(115deg, rgba(8, 44, 76, .055), rgba(181, 35, 105, .035) 65%, rgba(193, 138, 46, .04)),
        #fff;
}

.seg2-intro-icon {
    display: grid;
    place-items: center;
    width: 3rem;
    height: 3rem;
    flex: 0 0 3rem;
    border-radius: 12px;
    background: var(--seg2-navy-900);
    color: #fff;
    font-size: 1.15rem;
}

.seg2-intro h2,
.seg2-section-heading h2,
.seg2-status-panel-head h2 {
    margin: .08rem 0 0;
    color: var(--seg2-navy-950);
    font-size: 1.18rem;
    font-weight: 760;
    letter-spacing: -.015em;
}

.seg2-intro p,
.seg2-section-heading p,
.seg2-status-panel-head p {
    margin: .25rem 0 0;
    color: var(--seg2-muted);
    font-size: .8rem;
    line-height: 1.4;
}

.seg2-eyebrow {
    display: block;
    color: var(--seg2-wine-700);
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .075em;
    text-transform: uppercase;
}

/* ==========================================================
   TARJETAS
   ========================================================== */

.seg2-card {
    min-width: 0;
    overflow: hidden;
    border-radius: 14px;
    background: var(--seg2-paper);
    box-shadow:
        0 1px 2px rgba(8, 44, 76, .025),
        0 7px 20px rgba(8, 44, 76, .05);
}

.seg2-card-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    color: var(--seg2-navy-900);
    font-size: .98rem;
    font-weight: 720;
}

.seg2-card-title i {
    color: var(--seg2-wine-700);
}

.seg2-divider {
    width: 100%;
    height: 1px;
    margin: .8rem 0;
    background: var(--seg2-border);
}

.seg2-label {
    margin-bottom: .55rem;
    color: var(--seg2-muted);
    font-size: .66rem;
    font-weight: 750;
    letter-spacing: .045em;
    text-transform: uppercase;
}

/* ==========================================================
   RESUMEN
   ========================================================== */

.seg2-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .9rem;
}

.seg2-summary-card {
    display: flex;
    flex-direction: column;
    padding: .8rem;
    border: 1px solid var(--seg2-border-soft);
    border-radius: 10px;
    background: #fff;
    font-weight: 620;
    text-align: center;
}

.seg2-kpi {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: .85rem;
    font-size: 1rem;
    color:#293344;
}

.seg2-kpi strong {
    color: var(--seg2-navy-900);
    font-size: clamp(3.1rem, 4.8vw, 4.8rem);
    line-height: .92;
    letter-spacing: -.045em;
}

.seg2-kpi span {
    margin-top: .6rem;
    color: var(--seg2-modal-ink);
}

.seg2-summary-mini {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
    width: 100%;
}

.seg2-summary-mini > div {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: .4rem;
    padding: .55rem .6rem;
    border: 1px solid var(--seg2-border-soft);
    border-radius: 9px;
    background: var(--seg2-soft);
    text-align: left;
}

.seg2-summary-mini i {
    color: var(--seg2-gold-600);
}

.seg2-summary-mini span {
    color: var(--seg2-muted);
    font-size: .7rem;
}

.seg2-summary-mini strong {
    color: var(--seg2-ink);
    font-size: 1.05rem;
}

.seg2-accepted {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    width: 100%;
    margin-bottom: .5rem;
}

.seg2-accepted span {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    color: var(--seg2-muted);
    font-size: .76rem;
}

.seg2-accepted i {
    color: var(--seg2-green-700);
}

.seg2-accepted strong {
    color: var(--seg2-wine-700);
    font-size: 1.2rem;
}

/* ==========================================================
   AÑOS DE REGISTRO
   ========================================================== */

.seg2-years {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .35rem;
    width: 100%;
}

.seg2-year {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .3rem .48rem;
    border: 1px solid var(--seg2-border);
    border-radius: 999px;
    background: var(--seg2-soft);
    color: var(--seg2-muted);
    font-size: .72rem;
}

.seg2-year strong {
    min-width: 1.3rem;
    padding: .04rem .25rem;
    border-radius: 999px;
    background: #e9edf0;
    color: var(--seg2-ink);
}

.seg2-year-current {
    border-color: rgba(155, 29, 90, .22);
    background: var(--seg2-soft-wine);
    color: var(--seg2-wine-700);
}

.seg2-year-current strong {
    background: rgba(155, 29, 90, .11);
    color: var(--seg2-wine-700);
}

/* ==========================================================
   ENCABEZADO DE SECCIÓN
   ========================================================== */

.seg2-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    padding: .15rem .1rem 0;
}

/* ==========================================================
   FASES
   ========================================================== */

.seg2-phases {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .9rem;
    align-items: stretch;
}

.seg2-phase {
    display: flex;
    flex-direction: column;
}

.seg2-phase-header {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: .65rem;
    min-height: 68px;
    padding: .78rem .85rem;
    border-bottom: 1px solid var(--seg2-border);
    background: var(--seg2-soft);
}

.seg2-phase-header > div:nth-child(2) > span {
    display: block;
    color: var(--seg2-muted);
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .085em;
}

.seg2-phase-header h3 {
    margin: .03rem 0 0;
    color: var(--seg2-navy-950);
    font-size: .95rem;
    font-weight: 740;
}

.seg2-phase-header > strong {
    min-width: 2.2rem;
    color: var(--seg2-navy-900);
    font-size: 1.55rem;
    line-height: 1;
    text-align: right;
}

.seg2-phase-icon {
    display: grid;
    place-items: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 9px;
}

.seg2-phase-register .seg2-phase-icon {
    background: var(--seg2-gold-100);
    color: var(--seg2-gold-700);
}

.seg2-phase-review .seg2-phase-icon {
    background: var(--seg2-soft-blue);
    color: var(--seg2-blue-700);
}

.seg2-phase-evaluation .seg2-phase-icon {
    background: var(--seg2-soft-wine);
    color: var(--seg2-wine-700);
}

/* ---------- Estatus internos ---------- */

.seg2-status-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
    padding: .7rem;
}

.seg2-status-box {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    column-gap: .42rem;
    row-gap: .08rem;
    min-height: 74px;
    padding: .5rem .55rem;
    border: 1px solid var(--seg2-border-soft);
    border-radius: 9px;
    background: #fff;
}

.seg2-status-box > i {
    grid-row: 1 / span 2;
    color: var(--seg2-blue-700);
    font-size: .86rem;
}

.seg2-status-box > span {
    color: var(--seg2-muted);
    font-size: .68rem;
    font-weight: 690;
}

.seg2-status-box > strong {
    grid-row: 1 / span 2;
    color: var(--seg2-navy-950);
    font-size: 1.35rem;
    line-height: 1;
}

.seg2-status-box > small {
    grid-column: 2;
    color: #9099a2;
    font-size: .58rem;
    line-height: 1.18;
}

.seg2-status-ok {
    background: #f8fbfa;
    border-color: #d9e8e2;
}

.seg2-status-ok > i {
    color: var(--seg2-green-700);
}

.seg2-status-warning {
    background: #fdfaf5;
    border-color: #eadcbf;
}

.seg2-status-warning > i {
    color: var(--seg2-gold-700);
}

.seg2-status-danger {
    background: #fdf8f7;
    border-color: #ead1cd;
}

.seg2-status-danger > i {
    color: var(--seg2-red-700);
}

.seg2-status-primary {
    background: #fcf7fa;
    border-color: #e5ccd8;
}

.seg2-status-primary > i {
    color: var(--seg2-wine-700);
}

/* ==========================================================
   MODALIDADES DENTRO DE CADA FASE
   ========================================================== */

.seg2-modality-block {
    margin: 0 .7rem .7rem;
    padding: .62rem;
    border: 1px solid var(--seg2-border-soft);
    border-radius: 10px;
    background: var(--seg2-soft);
}

.seg2-modality-title {
    display: flex;
    align-items: center;
    gap: .35rem;
    margin-bottom: .5rem;
    color: var(--seg2-muted);
    font-size: .64rem;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: .035em;
}

.seg2-modalities {
    display: grid;
    gap: .42rem;
}

.seg2-modality {
    min-width: 0;
}

.seg2-modality-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .45rem;
}

.seg2-modality-name {
    display: flex;
    align-items: center;
    gap: .38rem;
    min-width: 0;
}

.seg2-modality-icon {
    display: grid;
    place-items: center;
    width: 1.75rem;
    height: 1.75rem;
    flex: 0 0 1.75rem;
    border-radius: 8px;
    background: #eef2f4;
    font-size: .72rem;
}

.seg2-modality-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
    line-height: 1.05;
}

.seg2-modality-text strong {
    overflow: hidden;
    color: var(--seg2-ink);
    font-size: .68rem;
    font-weight: 700;
    text-overflow: ellipsis;
}

.seg2-modality-text small {
    margin-top: .11rem;
    color: var(--seg2-muted);
    font-size: .55rem;
}

.seg2-modality-value {
    color: var(--seg2-navy-950);
    font-size: .94rem;
}

.seg2-modality-bar {
    height: .32rem;
    margin: .25rem 2.25rem 0;
    overflow: hidden;
    border-radius: 999px;
    background: #e7ebee;
}

.seg2-modality-bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
}

.seg2-modality-percent {
    margin-top: .12rem;
    color: var(--seg2-muted);
    font-size: .55rem;
    text-align: right;
}

.seg2-mod-publica .seg2-modality-icon {
    background: #e4f1f5;
    color: var(--seg2-blue-700);
}

.seg2-mod-publica .seg2-modality-bar span {
    background: var(--seg2-blue-700);
}

.seg2-mod-clinica .seg2-modality-icon {
    background: var(--seg2-soft-wine);
    color: var(--seg2-wine-700);
}

.seg2-mod-clinica .seg2-modality-bar span {
    background: var(--seg2-wine-700);
}

.seg2-mod-tradicional .seg2-modality-icon {
    background: var(--seg2-gold-100);
    color: var(--seg2-gold-700);
}

.seg2-mod-tradicional .seg2-modality-bar span {
    background: var(--seg2-gold-600);
}

/* ==========================================================
   EVALUADORES DENTRO DE FASE 03
   ========================================================== */

.seg2-evaluator-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0 .7rem .7rem;
    overflow: hidden;
    border: 1px solid var(--seg2-border-soft);
    border-radius: 9px;
    background: #fff;
}

.seg2-evaluator-strip > div {
    padding: .45rem .3rem;
    text-align: center;
}

.seg2-evaluator-strip > div + div {
    border-left: 1px solid var(--seg2-border-soft);
}

.seg2-evaluator-strip span {
    display: block;
    color: var(--seg2-muted);
    font-size: .55rem;
}

.seg2-evaluator-strip strong {
    display: block;
    margin-top: .1rem;
    color: var(--seg2-navy-950);
    font-size: .82rem;
}

/* ==========================================================
   PIES Y BARRAS DE AVANCE
   ========================================================== */

.seg2-phase-footer {
    margin-top: auto;
    padding: .68rem .75rem .75rem;
    border-top: 1px solid var(--seg2-border);
}

.seg2-phase-footer > div:first-child {
    display: flex;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .32rem;
    color: var(--seg2-muted);
    font-size: .64rem;
}

.seg2-phase-footer > div:first-child strong {
    color: var(--seg2-ink);
}

.seg2-progress {
    width: 100%;
    height: .38rem;
    overflow: hidden;
    border-radius: 999px;
    background: #e8ecef;
}

.seg2-progress > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background:
        linear-gradient(90deg, var(--seg2-blue-700), var(--seg2-wine-700));
}

.seg2-phase-register .seg2-progress > span {
    background: var(--seg2-gold-600);
}

.seg2-phase-review .seg2-progress > span {
    background: var(--seg2-blue-700);
}

.seg2-phase-evaluation .seg2-progress > span {
    background: var(--seg2-wine-700);
}

.seg2-progress-text {
    display: block;
    margin-top: .3rem;
    color: var(--seg2-muted);
    font-size: .62rem;
}

/* ==========================================================
   PANEL DE DISTRIBUCIÓN ACTUAL
   ========================================================== */

.seg2-status-panel {
    padding: .9rem;
}

.seg2-status-panel-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .7rem;
}

.seg2-status-panel-head h2 {
    display: flex;
    align-items: center;
    gap: .45rem;
}

.seg2-status-panel-head h2 i {
    color: var(--seg2-wine-700);
}

.seg2-status-total {
    display: flex;
    align-items: baseline;
    gap: .45rem;
    padding: .4rem .55rem;
    border-radius: 9px;
    background: var(--seg2-soft-blue);
    white-space: nowrap;
}

.seg2-status-total span {
    color: var(--seg2-muted);
    font-size: .62rem;
    font-weight: 650;
}

.seg2-status-total strong {
    color: var(--seg2-navy-900);
    font-size: 1.2rem;
}

/* ==========================================================
   TABLA COMPACTA
   ========================================================== */

.seg2-table-wrap {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--seg2-border);
    border-radius: 10px;
    -webkit-overflow-scrolling: touch;
}

.seg2-table {
    width: 100%;
    min-width: 760px;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
    font-size: .7rem;
}

.seg2-table th {
    padding: .42rem .48rem;
    border-bottom: 1px solid var(--seg2-border);
    background: var(--seg2-navy-950);
    color: #fff;
    font-size: .62rem;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
}

.seg2-table th:first-child {
    padding-left: .65rem;
    text-align: left;
}

.seg2-table th i {
    margin-right: .2rem;
    color: #d9edf4;
}

.seg2-table td {
    padding: .36rem .48rem;
    border-bottom: 1px solid var(--seg2-border-soft);
    text-align: center;
    vertical-align: middle;
}

.seg2-table tbody tr:nth-child(even) {
    background: #fbfcfc;
}

.seg2-table tbody tr:hover {
    background: var(--seg2-soft-blue);
}

.seg2-table tbody tr:last-child td {
    border-bottom: 0;
}

.seg2-status-name {
    display: flex;
    align-items: center;
    gap: .4rem;
    min-width: 190px;
    text-align: left;
}

.seg2-status-name .badge {
    display: inline-grid;
    place-items: center;
    min-width: 1.8rem;
    height: 1.35rem;
    padding: 0 .3rem;
}

.seg2-status-name > span:last-child {
    font-size: .66rem;
    font-weight: 650;
    line-height: 1.15;
}

.seg2-cell-number {
    display: inline-grid;
    place-items: center;
    min-width: 1.55rem;
    height: 1.3rem;
    border-radius: 6px;
    background: #f0f3f5;
    color: var(--seg2-ink);
    font-weight: 650;
}

.seg2-cell-total {
    color: var(--seg2-navy-950);
    font-size: .76rem;
}

.seg2-participacion {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    column-gap: .42rem;
    min-width: 0;
}

.seg2-participacion-bar {
    position: relative;
    height: var(--seg2-table-row-height);
    overflow: hidden;
    border-radius: 7px;
    background: color-mix(in srgb, var(--seg2-border-soft) 84%, #fff);
    box-shadow: inset 0 0 0 1px rgba(20, 45, 65, .08);
}

.seg2-participacion-bar > span {
    display: block;
    height: 100%;
    min-width: 2px;
    border-radius: inherit;
    background: var(--seg2-bar-color, var(--seg2-blue-700));
}

.seg2-participacion-text {
    color: var(--seg2-muted);
    font-size: .58rem;
    line-height: 1;
    white-space: nowrap;
}

/* ==========================================================
   ERRORES
   ========================================================== */

.seg2-error {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .8rem 1rem;
    border: 1px solid #e7c5c1;
    border-radius: 10px;
    background: var(--seg2-red-100);
    color: var(--seg2-red-700);
}

/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width: 1180px) {
    .seg2-phases {
        grid-template-columns: 1fr;
    }

    .seg2-phase {
        display: grid;
        grid-template-columns: minmax(250px, .8fr) minmax(300px, 1fr);
    }

    .seg2-phase-header,
    .seg2-phase-footer {
        grid-column: 1 / -1;
    }

    .seg2-status-grid {
        align-self: stretch;
    }

    .seg2-modality-block {
        margin-top: .7rem;
        align-self: stretch;
    }

    .seg2-evaluator-strip {
        grid-column: 1 / -1;
    }
}

@media (max-width: 900px) {
    .seg2-summary {
        grid-template-columns: 1fr 1fr;
    }

    .seg2-summary-card:last-child {
        grid-column: 1 / -1;
    }

    .seg2-toolbar .bg-gray-100 {
        flex-wrap: wrap;
        gap: .45rem;
    }

    .seg2-toolbar .text-center {
        flex-basis: 100%;
        order: -1;
    }

    .seg2-toolbar .ml-4,
    .seg2-toolbar .ml-5 {
        margin-left: .5rem !important;
    }
}

@media (max-width: 720px) {
    .seg2-shell {
        padding-inline: .35rem;
    }

    .seg2-intro {
        align-items: flex-start;
        padding: .8rem;
    }

    .seg2-intro-icon {
        width: 2.45rem;
        height: 2.45rem;
        flex-basis: 2.45rem;
    }

    .seg2-intro h2,
    .seg2-section-heading h2,
    .seg2-status-panel-head h2 {
        font-size: 1rem;
    }

    .seg2-summary {
        grid-template-columns: 1fr;
    }

    .seg2-summary-card:last-child {
        grid-column: auto;
    }

    .seg2-summary-card {
        min-height: auto;
    }

    .seg2-phases {
        grid-template-columns: 1fr;
    }

    .seg2-phase {
        display: flex;
    }

    .seg2-status-grid {
        grid-template-columns: 1fr 1fr;
    }

    .seg2-status-panel-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .seg2-status-total {
        align-self: flex-start;
    }

    .seg2-toolbar .tx-end {
        margin-top: 0 !important;
    }
}

@media (max-width: 480px) {
    .seg2-shell {
        padding-inline: .2rem;
    }

    .seg2-toolbar .bg-gray-100 {
        padding: .45rem !important;
        border-radius: 10px !important;
    }

    .seg2-toolbar h1 {
        font-size: .98rem !important;
    }

    .seg2-intro {
        gap: .6rem;
    }

    .seg2-intro p {
        font-size: .72rem;
    }

    .seg2-status-grid {
        grid-template-columns: 1fr 1fr;
    }

    .seg2-evaluator-strip {
        grid-template-columns: repeat(2, 1fr);
    }

    .seg2-evaluator-strip > div:nth-child(3) {
        border-top: 1px solid var(--seg2-border-soft);
        border-left: 0;
    }

    .seg2-evaluator-strip > div:nth-child(4) {
        border-top: 1px solid var(--seg2-border-soft);
    }

    .seg2-modalities {
        gap: .55rem;
    }

    .seg2-modality-bar {
        margin-right: 0;
    }

    .seg2-status-panel {
        padding: .65rem;
    }

    .seg2-table {
        min-width: 690px;
    }
}


/* ==========================================================
   AJUSTES _4 · BARRA SECUNDARIA DE REGISTRO
   ========================================================== */

.seg2-shell {
    --seg2-modality-height: 30px;
}

.seg2-modality-bar {
    position: relative;
    height: var(--seg2-modality-height);
    margin: .25rem 0 0;
    overflow: hidden;
    border-radius: 10px;
    background: rgba(182, 210, 229, .30);
}

.seg2-modality-bar span {
    display: block;
    min-width: 2px;
    height: 100%;
    border-radius: inherit;
}

.seg2-modality-shadowbar {
    display: flex;
    align-items: stretch;
    width: 100%;
    height: 12px;
    margin-top: .34rem;
    overflow: hidden;
    border: 1px solid rgba(182, 210, 229, .55);
    border-radius: 999px;
    background: rgba(231, 241, 248, .95);
}

.seg2-modality-shadow {
    display: block;
    height: 100%;
}

.seg2-modality-shadow-completo {
    background: rgba(63, 143, 104, .78);
}

.seg2-modality-shadow-incompleto {
    background: rgba(183, 121, 31, .78);
}

.seg2-modality-breakdown {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-top: .18rem;
    color: var(--seg2-muted);
    font-size: .56rem;
    line-height: 1.1;
}

.seg2-modality-breakdown span:first-child {
    color: #256144;
    font-weight: 650;
}

.seg2-modality-breakdown span:last-child {
    color: #7A4E12;
    font-weight: 650;
}

@media (max-width: 480px) {
    .seg2-modality-breakdown {
        flex-direction: column;
        align-items: flex-start;
        gap: .12rem;
    }

    .seg2-dashboard-wrap {
        padding: .3rem;
        border-radius: 12px;
    }

    .seg2-participacion {
        grid-template-columns: 1fr;
        row-gap: .2rem;
    }

    .seg2-participacion-text {
        text-align: left;
    }
}
.seg2-shell {
    --seg2-table-row-height: 24px;
    --seg2-doc-completo: var(--nopal-1);
    --seg2-doc-incompleto: hsl(340, 12%, 81%);
    --seg2-doc-track: var(--algodon-200);
}
.seg2-table {
    font-size: .66rem;
}

.seg2-table th {
    height: 28px;
    padding: .18rem .34rem;
    font-size: .58rem;
    line-height: 1;
}

.seg2-table td {
    height: var(--seg2-table-row-height);
    padding: .08rem .34rem;
    line-height: 1;
    vertical-align: middle;
}

.seg2-status-name {
    gap: .22rem;
    min-width: 175px;
}

.seg2-status-name .badge {
    min-width: 1.45rem;
    height: 1rem;
    padding: 0 .18rem;
    font-size: .54rem;
}
.seg2-status-badge i {
    font-size: 2.5em;
    line-height: 1;
}

.seg2-status-name > span:last-child {
    font-size: .59rem;
    line-height: 1;
}

.seg2-cell-number {
    min-width: 1.25rem;
    height: .95rem;
    padding: 0 .16rem;
    border-radius: 4px;
    font-size: .57rem;
}

.seg2-cell-total {
    font-size: .63rem;
}
.seg2-queryable {
    cursor: pointer;
    transition: transform .12s ease, box-shadow .12s ease;
}
.seg2-queryable:hover {
    box-shadow: 0 0 0 1px rgba(18, 111, 135, .32);
}
/* ==========================================================
   BARRA DOCUMENTAL
   COMPLETOS / INCOMPLETOS
   ========================================================== */

.seg2-modality-shadowbar {
    display: flex;
    width: 100%;
    height: 16px;
    margin-top: .3rem;
    overflow: hidden;
    border: 1px solid var(--cedron-200);
    border-radius: 999px;
    background: var(--seg2-doc-track);
    box-shadow:
        inset 0 1px 2px rgba(30, 40, 50, .08);
}

.seg2-modality-shadow {
    display: block;
    height: 100%;
    transition: width .2s ease;
}

/* Completo */
.seg2-modality-shadow-completo {
    background: var(--seg2-doc-completo);
}

/* Incompleto */
.seg2-modality-shadow-incompleto {
    background: var(--seg2-doc-incompleto);
}


/* ==========================================================
   LEYENDA DE LA BARRA DOCUMENTAL
   ========================================================== */

.seg2-modality-breakdown {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-top: .2rem;
    font-size: .56rem;
    line-height: 1;
}

.seg2-modality-breakdown span {
    display: inline-flex;
    align-items: center;
    gap: .28rem;
    font-weight: 650;
}

.seg2-modality-breakdown span::before {
    content: "";
    width: .48rem;
    height: .48rem;
    flex: 0 0 .48rem;
    border-radius: 999px;
}

.seg2-modality-breakdown span:first-child {
    color: var(--seg2-doc-completo);
}

.seg2-modality-breakdown span:first-child::before {
    background: var(--seg2-doc-completo);
}

.seg2-modality-breakdown span:last-child {
    color: var(--seg2-doc-incompleto);
}

.seg2-modality-breakdown span:last-child::before {
    background: var(--seg2-doc-incompleto);
}


/* ==========================================================
   SIEVAL · MODAL DETALLE DE SEGUIMIENTO
   Compatible con #seg2ModalDetalle
   ========================================================== */

#seg2ModalDetalle {
    --seg2-modal-ink: var(--seg2-ink, #293344);
    --seg2-modal-muted: var(--seg2-muted, #73808d);

    --seg2-modal-border: var(--cedron-200, #b6d2e5);
    --seg2-modal-border-soft: var(--cedron-50, #e7f1f8);

    --seg2-modal-head: var(--cedron-700, #214f70);
    --seg2-modal-head-soft: var(--cedron-50, #e7f1f8);

    --seg2-modal-paper: var(--algodon-1, #ffffff);
    --seg2-modal-soft: var(--algodon-50, #fbfcfd);

    --seg2-modal-completo: var(--nopal-700, #256144);
    --seg2-modal-incompleto: hsl(343deg 67% 34%);

    color: var(--seg2-modal-ink);
}


/* ==========================================================
   CONTENEDOR
   ========================================================== */

#seg2ModalDetalle .modal-dialog {
    width: min(94vw, 1380px);
    max-width: 1380px;
}

#seg2ModalDetalle .modal-content {
    overflow: hidden;
    border: 1px solid var(--seg2-modal-border);
    border-radius: 14px;
    background: var(--seg2-modal-paper);
    box-shadow:
        0 3px 8px rgba(20, 45, 65, .08),
        0 18px 50px rgba(20, 45, 65, .18);
}


/* ==========================================================
   CABECERA
   ========================================================== */

#seg2ModalDetalle .modal-header {
    align-items: center;
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--seg2-modal-border);
    background:
        linear-gradient(
            105deg,
            rgba(33, 79, 112, .07),
            rgba(255, 255, 255, 0) 55%
        ),
        var(--seg2-modal-paper);
}

#seg2ModalDetalle .modal-title {
    margin: 0;
    color: var(--seg2-modal-head);
    font-size: 1rem;
    font-weight: 750;
    letter-spacing: -.01em;
}

#seg2ModalDetalle #seg2-modal-subtitle {
    display: block;
    margin-top: .15rem;
    color: var(--seg2-modal-muted) !important;
    font-size: .68rem;
    font-weight: 600;
}

#seg2ModalDetalle .close {
    display: grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    margin: 0;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--seg2-modal-head);
    font-size: 1.35rem;
    line-height: 1;
    opacity: .7;
    transition:
        background .15s ease,
        border-color .15s ease,
        opacity .15s ease;
}

#seg2ModalDetalle .close:hover {
    border-color: var(--seg2-modal-border);
    background: var(--seg2-modal-head-soft);
    opacity: 1;
}


/* ==========================================================
   CUERPO
   ========================================================== */

#seg2ModalDetalle .modal-body {
    padding: .85rem 1rem;
    background: var(--seg2-modal-soft);
}

#seg2ModalDetalle .table-responsive {
    overflow: hidden;
    border: 1px solid var(--seg2-modal-border);
    border-radius: 10px;
    background: var(--seg2-modal-paper);
}


/* ==========================================================
   TABLA
   ========================================================== */

#seg2ModalDetalle .table {
    width: 100%;
    margin: 0;
    color: var(--seg2-modal-ink);
    font-size: .67rem;
}

#seg2ModalDetalle .table thead th {
    padding: .42rem .52rem;
    border: 0;
    border-right: 1px solid rgba(255, 255, 255, .08);
    background: var(--seg2-modal-head);
    color: #fff;
    font-size: .59rem;
    font-weight: 750;
    line-height: 1.05;
    letter-spacing: .035em;
    text-transform: uppercase;
    vertical-align: middle;
    white-space: nowrap;
}

#seg2ModalDetalle .table thead th:last-child {
    border-right: 0;
}

#seg2ModalDetalle .table tbody td {
    padding: .32rem .52rem;
    border-top: 1px solid var(--seg2-modal-border-soft);
    vertical-align: middle;
    line-height: 1.15;
}

#seg2ModalDetalle .table-striped tbody tr:nth-of-type(odd) {
    background: rgba(231, 241, 248, .28);
}

#seg2ModalDetalle .table-hover tbody tr:hover {
    background: rgba(231, 241, 248, .75);
}

#seg2ModalDetalle .table tbody tr:first-child td {
    border-top: 0;
}


/* ==========================================================
   COLUMNAS
   ========================================================== */

#seg2ModalDetalle .table th:nth-child(1),
#seg2ModalDetalle .table td:nth-child(1) {
    width: 220px;
    text-align: left;
}

#seg2ModalDetalle .table th:nth-child(2),
#seg2ModalDetalle .table td:nth-child(2) {
    width: 360px;
}

#seg2ModalDetalle .table th:nth-child(3),
#seg2ModalDetalle .table td:nth-child(3) {
    width: 260px;
}

#seg2ModalDetalle .table th:nth-child(4),
#seg2ModalDetalle .table td:nth-child(4) {
    width: 170px;
}

#seg2ModalDetalle .table th:nth-child(5),
#seg2ModalDetalle .table td:nth-child(5) {
    width: 150px;
}

#seg2ModalDetalle .table th:nth-child(6),
#seg2ModalDetalle .table td:nth-child(6) {
    width: 110px;
}


/* ==========================================================
   PSEUDÓNIMO / TÍTULO
   ========================================================== */

#seg2ModalDetalle .table td:nth-child(2) {
    font-weight: 620;
}

#seg2ModalDetalle .table td:nth-child(3) {
    color: var(--seg2-modal-ink);
}

#seg2ModalDetalle .table td:nth-child(4) {
    color: var(--seg2-modal-muted);
}

#seg2ModalDetalle .seg2-inst-cell {
    display: flex;
    align-items: center;
    gap: .55rem;
}

#seg2ModalDetalle .seg2-inst-img {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    object-fit: cover;
    border: 1px solid var(--seg2-modal-border);
    border-radius: 8px;
    background: var(--seg2-modal-paper);
}

#seg2ModalDetalle .seg2-inst-name {
    display: block;
    color: var(--seg2-modal-ink);
    font-weight: 650;
    line-height: 1.2;
}

#seg2ModalDetalle .seg2-folio-pseudo {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .12rem;
}

#seg2ModalDetalle .seg2-folio-pseudo > strong {
    color: var(--seg2-modal-head);
    font-size: .68rem;
    letter-spacing: .02em;
}

#seg2ModalDetalle .seg2-folio-pseudo > span {
    color: var(--seg2-modal-muted);
    font-size: .62rem;
}

#seg2ModalDetalle .seg2-work-cell {
    display: grid;
    grid-template-columns: 48px 1fr;
    align-items: center;
    gap: .5rem;
}

#seg2ModalDetalle .seg2-work-thumb,
#seg2ModalDetalle .seg2-work-thumb-fallback {
    width: 48px;
    height: 48px;
    border-radius: 8px;
}

#seg2ModalDetalle .seg2-work-thumb {
    object-fit: cover;
    border: 1px solid var(--seg2-modal-border);
    background: var(--seg2-modal-paper);
}

#seg2ModalDetalle .seg2-work-thumb-fallback {
    display: inline-grid;
    place-items: center;
    border: 1px solid #9ec3e6;
    background: linear-gradient(155deg, #d5e7f8, #b8d8f3);
    color: #1f5f99;
    font-size: 1rem;
}

#seg2ModalDetalle .seg2-work-title {
    color: var(--seg2-modal-ink);
    font-weight: 620;
    line-height: 1.25;
}


/* ==========================================================
   ESTATUS Y DOCUMENTACIÓN
   Se estilizan aun cuando vengan como texto plano.
   ========================================================== */

#seg2ModalDetalle .table td:nth-child(4),
#seg2ModalDetalle .table td:nth-child(5) {
    font-weight: 700;
}

#seg2ModalDetalle .table td:nth-child(6) {
    color: var(--seg2-modal-incompleto);
}


/* Si posteriormente agregas clases al HTML */

#seg2ModalDetalle .seg2-doc-completo {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    color: var(--seg2-modal-completo);
    font-weight: 750;
}

#seg2ModalDetalle .seg2-doc-incompleto {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    color: var(--seg2-modal-incompleto);
    font-weight: 750;
}

#seg2ModalDetalle .seg2-doc-completo::before,
#seg2ModalDetalle .seg2-doc-incompleto::before {
    content: none;
    width: 0;
    height: 0;
    flex: 0 0 0;
}

#seg2ModalDetalle .seg2-doc-completo::before {
    background: transparent;
}

#seg2ModalDetalle .seg2-doc-incompleto::before {
    background: transparent;
}

#seg2ModalDetalle .seg2-doc-completo i,
#seg2ModalDetalle .seg2-doc-incompleto i {
    font-size: .75rem;
    line-height: 1;
}


/* ==========================================================
   FOOTER
   ========================================================== */

#seg2ModalDetalle .modal-footer {
    padding: .55rem 1rem;
    border-top: 1px solid var(--seg2-modal-border);
    background: var(--seg2-modal-paper);
}

#seg2ModalDetalle .modal-footer .btn {
    min-width: 88px;
    padding: .32rem .75rem;
    border-radius: 7px;
    font-size: .68rem;
    font-weight: 650;
}

#seg2ModalDetalle .modal-footer .btn-light {
    border: 1px solid var(--seg2-modal-border);
    background: var(--seg2-modal-soft);
    color: var(--seg2-modal-head);
}

#seg2ModalDetalle .modal-footer .btn-light:hover {
    background: var(--seg2-modal-head-soft);
}


/* ==========================================================
   SCROLL
   ========================================================== */

#seg2ModalDetalle .modal-body::-webkit-scrollbar,
#seg2ModalDetalle .table-responsive::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

#seg2ModalDetalle .modal-body::-webkit-scrollbar-track,
#seg2ModalDetalle .table-responsive::-webkit-scrollbar-track {
    background: var(--seg2-modal-soft);
}

#seg2ModalDetalle .modal-body::-webkit-scrollbar-thumb,
#seg2ModalDetalle .table-responsive::-webkit-scrollbar-thumb {
    border: 2px solid var(--seg2-modal-soft);
    border-radius: 999px;
    background: var(--seg2-modal-border);
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width: 991px) {

    #seg2ModalDetalle .modal-dialog {
        width: calc(100vw - 1rem);
        margin: .5rem auto;
    }

    #seg2ModalDetalle .modal-header,
    #seg2ModalDetalle .modal-body,
    #seg2ModalDetalle .modal-footer {
        padding-left: .7rem;
        padding-right: .7rem;
    }

    #seg2ModalDetalle .table thead {
        display: none;
    }

    #seg2ModalDetalle .table,
    #seg2ModalDetalle .table tbody,
    #seg2ModalDetalle .table tr,
    #seg2ModalDetalle .table td {
        display: block;
        width: 100%;
    }

    #seg2ModalDetalle .table tbody tr {
        margin: 0 0 .65rem;
        border: 1px solid var(--seg2-modal-border);
        border-radius: 10px;
        overflow: hidden;
        background: #fff;
    }

    #seg2ModalDetalle .table tbody td {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: .65rem;
        padding: .52rem .65rem;
        border-top: 1px solid var(--seg2-modal-border-soft);
        text-align: right;
    }

    #seg2ModalDetalle .table tbody td:first-child {
        border-top: 0;
    }

    #seg2ModalDetalle .table tbody td::before {
        content: attr(data-label);
        flex: 0 0 40%;
        text-align: left;
        color: var(--seg2-modal-muted);
        font-size: .58rem;
        font-weight: 800;
        letter-spacing: .05em;
        text-transform: uppercase;
    }

    #seg2ModalDetalle .table tbody td > * {
        flex: 0 0 60%;
        max-width: 60%;
    }

    #seg2ModalDetalle .seg2-inst-cell {
        width: 60%;
        max-width: 60%;
        justify-content: flex-end;
    }

    #seg2ModalDetalle .seg2-work-cell {
        grid-template-columns: 40px 1fr;
        gap: .4rem;
    }

    #seg2ModalDetalle .seg2-work-thumb,
    #seg2ModalDetalle .seg2-work-thumb-fallback {
        width: 40px;
        height: 40px;
    }
}

.seg2-eva-queryable {
    cursor: pointer;
    transition: box-shadow .14s ease, transform .14s ease;
}

.seg2-eva-queryable:hover {
    box-shadow: 0 0 0 1px rgba(18, 111, 135, .24);
}

#seg2ModalDetalle .seg2-modality-chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .16rem .42rem;
    border: 0;
    border-radius: 999px;
    font-weight: 700;
    line-height: 1;
}

#seg2ModalDetalle .seg2-modality-chip i {
    font-size: .62rem;
}

#seg2ModalDetalle .seg2-modality-chip.seg2-mod-publica {
    background: #e4f1f5;
    color: var(--seg2-blue-700);
}

#seg2ModalDetalle .seg2-modality-chip.seg2-mod-clinica {
    background: var(--seg2-soft-wine);
    color: var(--seg2-wine-700);
}

#seg2ModalDetalle .seg2-modality-chip.seg2-mod-tradicional {
    background: var(--seg2-gold-100);
    color: var(--seg2-gold-700);
}

#seg2ModalDetalle .seg2-modality-chip.seg2-mod-desconocida {
    background: #f1f4f6;
    color: var(--seg2-muted);
}

#seg2ModalEvaluadores .modal-dialog {
    width: min(1120px, calc(100vw - 1rem));
    margin: .8rem auto;
}

#seg2ModalEvaluadores .modal-content {
    border: 1px solid var(--seg2-modal-border);
    border-radius: 10px;
    background: var(--seg2-modal-paper);
}

#seg2ModalEvaluadores .modal-header,
#seg2ModalEvaluadores .modal-footer {
    border-color: var(--seg2-modal-border);
    background: var(--seg2-modal-paper);
}

#seg2ModalEvaluadores .modal-body {
    padding: .9rem;
    background: var(--seg2-modal-soft);
}

.seg2-eva-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: .75rem;
}

.seg2-eva-card {
    display: grid;
    grid-template-columns: 64px 1fr;
    align-items: center;
    gap: .6rem;
    padding: .62rem;
    border: 1px solid var(--seg2-modal-border);
    border-radius: 10px;
    background: #fff;
}

.seg2-eva-avatar {
    width: 64px;
    height: 64px;
    object-fit: cover;
    border-radius: 10px;
    border: 1px solid var(--seg2-modal-border);
    background: var(--seg2-modal-paper);
}

.seg2-eva-info h6 {
    margin: 0 0 .34rem;
    color: var(--seg2-modal-head);
    font-size: .72rem;
    font-weight: 760;
    line-height: 1.2;
}

.seg2-eva-inst {
    display: flex;
    align-items: center;
    gap: .45rem;
}

.seg2-eva-inst-img {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    object-fit: cover;
    border-radius: 6px;
    border: 1px solid var(--seg2-modal-border);
    background: var(--seg2-modal-paper);
}

.seg2-eva-inst span {
    color: var(--seg2-modal-muted);
    font-size: .64rem;
    line-height: 1.2;
}

.seg2-participacion {
    display: grid;
    grid-template-columns: minmax(90px, 1fr) auto;
    align-items: center;
    gap: .42rem;
    width: 100%;
    min-width: 0;
}

.seg2-participacion-bar {
    position: relative;
    width: 100%;
    height: 18px;

    overflow: hidden;

    border: 1px solid var(--cedron-1);
    border-radius: 4px;

    background: var(--cedron-50);

    box-shadow:
        inset 0 1px 2px rgba(20, 45, 65, .07);
}


/*
 * IMPORTANTE:
 * absoluto para evitar cualquier desplazamiento vertical
 * provocado por estilos heredados sobre span.
 */
.seg2-participacion-bar > span {
    position: absolute;

    top: 0;
    bottom: 0;
    left: 0;

    display: block;

    height: auto;
    min-width: 2px;

    margin: 0;
    padding: 0;

    border: 0;
    border-radius: 4px;

    background: var(
        --seg2-bar-color,
        var(--cedron-700)
    );

    line-height: 0;
}


/* Porcentaje */

.seg2-participacion-text {
    min-width: 3.1rem;

    margin: 0;

    color: var(--seg2-muted);
    font-size: .65rem;
    font-weight: 750;
    line-height: 1;

    text-align: right;
    white-space: nowrap;
}


/* ==========================================================
   SIEVAL · REVISIÓN DOCUMENTAL DE TRABAJOS
    ========================================================== */
.rtra-shell {
    --rtra-ink: var(--algodon-700, #26313b);
    --rtra-muted: #687581;

    --rtra-border: var(--cedron-200, #b6d2e5);
    --rtra-border-soft: var(--cedron-50, #e7f1f8);

    --rtra-head: var(--cedron-700, #214f70);
    --rtra-paper: var(--algodon-1, #ffffff);
    --rtra-soft: var(--algodon-50, #fbfcfd);

    --rtra-ok: var(--nopal-700, #256144);
    --rtra-ok-soft: hsl(151deg 34% 90%);

    --rtra-fail: hsl(343deg 67% 34%);
    --rtra-fail-soft: hsl(343deg 45% 92%);

    --rtra-ppt: hsl(18deg 61% 40%);
    --rtra-ppt-soft: hsl(18deg 55% 92%);

    --rtra-cell-min: 132px;
    --rtra-work-top: 102px;
    --rtra-mod-height: 30px;

    width: min(calc(100% - 28px), 1540px);
    margin: 0 auto;
    padding: 14px 0 30px;

    color: var(--rtra-ink);
    box-sizing: border-box;
}

.rtra-shell *,
.rtra-shell *::before,
.rtra-shell *::after {
    box-sizing: border-box;
}

.rtra-toolbar {
    margin-bottom: 10px;
}

.rtra-content,
.rtra-panel {
    width: 100%;
    min-width: 0;
}

.rtra-panel {
    overflow: hidden;
    border: 1px solid var(--rtra-border);
    border-radius: 12px;
    background: var(--rtra-paper);
}


/* ==========================================================
   CABECERA
   ========================================================== */

.rtra-cabecera {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    padding: 14px 16px 12px;

    border-bottom: 1px solid var(--rtra-border);

    background:
        linear-gradient(
            100deg,
            rgba(33, 79, 112, .055),
            transparent 44%
        ),
        var(--rtra-paper);
}

.rtra-cabecera h2 {
    margin: 0;

    color: var(--rtra-head);

    font-size: 1.15rem;
    font-weight: 750;
}

.rtra-cabecera p {
    margin: 2px 0 0;

    color: var(--rtra-muted);

    font-size: .68rem;
}

.rtra-resumen {
    display: flex;
    gap: 7px;
}

.rtra-resumen > span {
    display: grid;

    min-width: 72px;

    padding: 5px 8px;

    border: 1px solid var(--rtra-border-soft);
    border-radius: 7px;

    text-align: center;
}

.rtra-resumen small {
    color: var(--rtra-muted);

    font-size: .55rem;
    text-transform: uppercase;
}

.rtra-resumen strong {
    font-size: .9rem;
}

.rtra-resumen-completo strong {
    color: var(--rtra-ok);
}

.rtra-resumen-incompleto strong {
    color: var(--rtra-fail);
}


/* ==========================================================
   TABLA
   ========================================================== */

.rtra-tabla-wrap {
    width: 100%;

    overflow-x: auto;

    -webkit-overflow-scrolling: touch;
}

.rtra-tabla {
    width: 100%;
    min-width: 1120px;

    table-layout: fixed;
    border-collapse: collapse;

    background: var(--rtra-paper);

    font-size: .66rem;
}

/*
 * El alto 1px permite que height:100% de las celdas internas
 * tome correctamente el alto final calculado para todo el renglón.
 */
.rtra-tabla tr {
    height: 1px;
}

.rtra-tabla th {
    height: 30px;

    padding: 3px 5px;

    border-right: 1px solid rgba(255, 255, 255, .16);

    background: var(--rtra-head);
    color: #fff;

    font-size: .59rem;
    font-weight: 750;
    letter-spacing: .03em;
    text-align: center;
    text-transform: uppercase;
}

.rtra-tabla th:nth-child(1) {
    width: 20%;
}

.rtra-tabla th:nth-child(2) {
    width: 18%;
}

.rtra-tabla th:nth-child(3) {
    width: 22%;
}

.rtra-tabla th:nth-child(4) {
    width: 23%;
}

.rtra-tabla th:nth-child(5) {
    width: 17%;
}

.rtra-tabla td {
    height: 100%;
    padding: 0;
    font-size: 0;
    border-right: 1px solid var(--rtra-border);
    border-bottom: 1px solid var(--rtra-border);
    vertical-align: top;
}

.rtra-tabla th:last-child,
.rtra-tabla td:last-child {
    border-right: 0;
}

.rtra-cell {
    width: 100%;
    height: 100%;
    min-height: var(--rtra-cell-min);

    margin: 0;
    padding: 0;
}


/* ==========================================================
   AUTOR
   ========================================================== */

.rtra-autor {
    display: flex;
    flex-direction: column;
    padding: 0px 8px;
    background: #f0f0f099;
    border-bottom:1px solid #909090;
}

.rtra-autor-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    padding-top:4px;
}

.rtra-id {
    color: var(--rtra-muted);
    font-size: .59rem;
    font-weight: 700;
}

.rtra-correo {
    padding-top: 14px;
    color: #111;
    font-size: .82rem;
    line-height: 1.1;
    overflow-wrap: anywhere;
}

.rtra-autor-nombre {
    margin-top: 3px;
    color: var(--rtra-muted);
    font-size: .58rem;
}

.rtra-telefono {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 5px;
    color: var(--rtra-head);
    font-size: .58rem;
    font-weight: 650;
}

.rtra-fecha {
    margin-top: auto;
    padding-bottom: 5px;
    color: var(--rtra-muted);
    font-size: .54rem;
    font-style: italic;
    text-align: right;
}

.rtra-btn-recordatorio {
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    flex: 0 0 26px;
    padding: 0;
    border: 1px solid var(--rtra-border);
    border-radius: 6px;
    background: #fff;
    color: var(--rtra-head);
    cursor: pointer;
}

.rtra-btn-recordatorio:hover {
    background: var(--rtra-border-soft);
}


/* ==========================================================
   TRABAJO
   ========================================================== */

.rtra-trabajo {
    display: flex;
    flex-direction: column;
    min-height: var(--rtra-cell-min);
    border-bottom: 1px solid var(--rtra-border);
}

.rtra-trabajo-main {
    display: flex;
    align-items: center;
    gap: 8px;
    height: var(--rtra-work-top);
    min-height: var(--rtra-work-top);

    padding: 7px;

    overflow: hidden;
}

.rtra-foto {
    display: grid;
    place-items: center;

    width: 62px;
    height: 62px;
    flex: 0 0 62px;

    overflow: hidden;

    border: 1px solid var(--rtra-border);
    border-radius: 6px;

    background: var(--rtra-border-soft);
}

.rtra-foto img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.rtra-trabajo-datos {
    min-width: 0;
}

.rtra-folio {
    display: block;

    color: #1c2228;

    font-size: .88rem;
    line-height: 1.05;
}

.rtra-institucion {
    display: flex;
    align-items: center;
    gap: 5px;

    min-width: 0;

    margin-top: 7px;
}

.rtra-institucion-img {
    display: grid;
    place-items: center;

    width: 28px;
    height: 28px;
    flex: 0 0 28px;
}

.rtra-institucion-img img {
    max-width: 100%;
    max-height: 100%;

    object-fit: contain;
}

.rtra-institucion small {
    overflow: hidden;

    color: var(--rtra-muted);

    font-size: .55rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rtra-modalidad {
    display: flex;
    align-items: center;
    gap: 5px;

    height: var(--rtra-mod-height);
    min-height: var(--rtra-mod-height);

    margin-top: auto;
    padding: 4px 7px;

    border-top: 1px solid var(--rtra-border);

    font-size: .57rem;
    font-weight: 700;
    text-transform: uppercase;
}

.rtra-mod-publica {
    background: var(--sabila-50, #e8f4ef);
    color: var(--sabila-700, #397a65);
}

.rtra-mod-clinica {
    background: var(--bugam-50, #faeef4);
    color: var(--bugam-700, #8a2858);
}

.rtra-mod-tradicional {
    background: var(--copal-50, #faf4e7);
    color: var(--copal-700, #8a6523);
}

.rtra-mod-default {
    background: var(--rtra-soft);
    color: var(--rtra-head);
}


/* ==========================================================
   TÍTULO / ESTATUS
   ========================================================== */

.rtra-titulo {
    display: flex;
    flex-direction: column;

    min-height: var(--rtra-cell-min);

    padding: 6px 7px 0;
}

.rtra-titulo > strong {
    padding: 3px 5px;
    background: rgba(180, 35, 75, .02);
    color: #434167;
    font-size: 0.9rem;
}

.rtra-titulo > span {
    padding: 7px 5px;

    color: #111;

    font-size: .65rem;
    font-weight: 600;
    line-height: 1.18;
    text-transform: uppercase;
}

.rtra-estatus {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    height: var(--rtra-mod-height);
    margin: auto -7px 0;
    padding: 4px 7px;
    border-top: 1px solid rgba(0, 0, 0, .06);

    font-size: .55rem;
    font-weight: 750;
    text-transform: uppercase;
}


/* ==========================================================
   COLABORADORES
   ========================================================== */

.rtra-colaboradores {
    min-height: var(--rtra-cell-min);

    overflow: hidden;
}

.rtra-colaborador {
    display: grid;
    grid-template-rows: 31px 35px;
    width: 100%;
    border-bottom: 2px solid var(--rtra-border);
}
.rtra-colaborador:nth-child(odd) {
    background: #91919322;
}

.rtra-colaborador:nth-child(even) {
    background: rgba(231, 241, 248, .42);
}


/* ---------- Cabecera del colaborador ---------- */

.rtra-colaborador-head {
    display: flex;
    align-items: center;

    gap: 3px;

    width: 100%;
    min-width: 0;

    padding: 3px 4px;

    overflow: hidden;

    border-bottom: 1px solid var(--rtra-border-soft);
}

.rtra-colaborador-icono {
    display: grid;
    place-items: center;

    width: 19px;
    height: 19px;
    flex: 0 0 19px;

    margin: 0;

    border-radius: 4px;

    font-size: .66rem;
}

.rtra-colaborador-datos {
    display: block;

    flex: 1 1 auto;

    min-width: 0;
    max-width: calc(100% - 22px);

    margin: 0;
    padding: 0;

    overflow: hidden;
}

.rtra-colaborador-datos strong,
.rtra-colaborador-datos small {
    display: block;

    width: 100%;
    max-width: 100%;

    margin: 0;
    padding: 0;

    overflow: hidden;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.rtra-colaborador-datos strong {
    font-size: .54rem;
    line-height: 1.05;
}

.rtra-colaborador-datos small {
    margin-top: 1px;

    color: var(--rtra-muted);

    font-size: .46rem;
    line-height: 1;
}

.rtra-icono-cola-1 .rtra-colaborador-icono {
    background: var(--cedron-50, #e7f1f8);
    color: var(--cedron-700, #214f70);
}

.rtra-icono-cola-2 .rtra-colaborador-icono {
    background: var(--sabila-50, #e8f4ef);
    color: var(--sabila-700, #397a65);
}

.rtra-icono-cola-3 .rtra-colaborador-icono {
    background: var(--copal-50, #faf4e7);
    color: var(--copal-700, #8a6523);
}


/* ---------- Documentos del colaborador ---------- */

.rtra-colaborador-documentos {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));

    width: 100%;
    min-width: 0;
    min-height: 35px;

    padding: 0;
}

.rtra-colaborador-documentos > * {
    min-width: 0;

    border-right: 1px solid var(--rtra-border);
}

.rtra-colaborador-documentos > *:last-child {
    border-right: 0;
}

.rtra-curp {
    display: grid;
    place-items: center;

    width: 100%;
    height: 100%;
    min-width: 0;

    border-radius: 0;

    font-size: .8rem;
}

.rtra-curp-ok {
    background: var(--rtra-ok-soft);
    color: var(--rtra-ok);
}

.rtra-curp-falta {
    background: var(--rtra-fail-soft);
    color: var(--rtra-fail);
}

.rtra-sin-colaboradores {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;

    width: 100%;
    height: 100%;
    min-height: var(--rtra-cell-min);

    background: var(--rtra-fail-soft);
    color: var(--rtra-fail);

    font-weight: 700;
}


/* ==========================================================
   DOCUMENTOS DEL TRABAJO
   ========================================================== */

.rtra-documentos-trabajo {
    display: flex;
    flex-direction: column;

    min-height: var(--rtra-cell-min);

    padding: 0;
}

.rtra-documentos-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));

    flex: 1 1 auto;

    width: 100%;
    min-width: 0;
    min-height: 104px;

    padding: 0;
    gap: 0;
}


/* [Resumen, Extenso, Presentación] */

.rtra-documentos-grid > :nth-child(1),
.rtra-documentos-grid > :nth-child(2),
.rtra-documentos-grid > :nth-child(3) {
    grid-column: span 4;
}


/* [Aceptación, Solicitud, Bioética, Protesta] */

.rtra-documentos-grid > :nth-child(n+4):nth-child(-n+7) {
    grid-column: span 3;
}


/* ---------- Documento ---------- */

.rtra-doc {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    gap: 3px;

    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 50px;

    padding: 4px 2px;

    overflow: hidden;

    border: 0;
    border-right: 1px solid var(--rtra-border);
    border-bottom: 1px solid var(--rtra-border);
    border-radius: 0;

    text-decoration: none !important;

    cursor: default;
}

.rtra-doc i {
    font-size: 1rem;
}

.rtra-doc small {
    display: block;

    width: 100%;
    min-width: 0;

    overflow: hidden;

    font-size: .42rem;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

a.rtra-doc {
    cursor: pointer;
}

.rtra-doc-disponible,
.rtra-doc-pdf {
    background: var(--rtra-ok-soft);
    color: var(--rtra-ok);
}

a.rtra-doc-disponible:hover {
    background: hsl(151deg 36% 84%);
    color: var(--rtra-ok);
}

.rtra-doc-pptx {
    background: var(--rtra-ppt-soft);
    color: var(--rtra-ppt);
}

a.rtra-doc-pptx:hover {
    background: hsl(18deg 55% 86%);
    color: var(--rtra-ppt);
}

.rtra-doc-falta {
    background: var(--rtra-fail-soft);
    color: var(--rtra-fail);
}

.rtra-doc-opcional {
    background: #f2eeee;
    color: #af969b;
}


/* ---------- Documentos dentro del colaborador ---------- */

.rtra-colaborador-documentos .rtra-doc {
    min-width: 0;
    min-height: 35px;

    border-bottom: 0;
}

.rtra-colaborador-documentos .rtra-doc small {
    display: none;
}


/* ---------- Estado documental ---------- */

.rtra-documentacion-estado {
    display: grid;
    place-items: center;

    min-height: 28px;

    margin: 0;

    border-top: 1px solid var(--rtra-border);

    font-size: .53rem;
    font-weight: 750;
    text-transform: uppercase;
}

.rtra-documentacion-completa .rtra-documentacion-estado {
    background: var(--rtra-ok-soft);
    color: var(--rtra-ok);
}

.rtra-documentacion-incompleta .rtra-documentacion-estado {
    background: var(--rtra-fail-soft);
    color: var(--rtra-fail);
}


/* ==========================================================
   VACÍO / ERROR
   ========================================================== */

.rtra-vacio,
.rtra-error {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;

    min-height: 90px;

    padding: 16px;

    color: var(--rtra-muted);
}

.rtra-error {
    margin: 10px 0;

    border: 1px solid rgba(180, 35, 75, .18);
    border-radius: 9px;

    background: rgba(180, 35, 75, .04);
    color: var(--rtra-fail);
}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width: 850px) {

    .rtra-shell {
        width: calc(100% - 14px);

        padding-top: 7px;
    }

    .rtra-cabecera {
        align-items: flex-start;
        flex-direction: column;
    }

    .rtra-resumen {
        width: 100%;
    }

    .rtra-resumen > span {
        flex: 1;
    }

    .rtra-tabla {
        display: block;

        min-width: 0;
    }

    .rtra-tabla thead {
        display: none;
    }

    .rtra-tabla tbody,
    .rtra-tabla tr,
    .rtra-tabla td {
        display: block;

        width: 100%;
    }

    /*
     * En móvil deja de aplicarse el truco de tabla con height:100%.
     */
    .rtra-tabla tr {
        height: auto;
    }

    .rtra-tabla tbody {
        padding: 7px;

        background: var(--rtra-soft);
    }

    .rtra-tabla tr {
        overflow: hidden;

        margin-bottom: 10px;

        border: 1px solid var(--rtra-border);
        border-radius: 10px;

        background: var(--rtra-paper);
    }

    .rtra-tabla td {
        position: relative;

        height: auto;
        min-height: 0;

        padding-left: 78px;

        border-right: 0;
        border-bottom: 1px solid var(--rtra-border-soft);
    }

    .rtra-tabla td:last-child {
        border-bottom: 0;
    }

    .rtra-tabla td::before {
        content: attr(data-label);

        position: absolute;
        inset: 0 auto 0 0;

        display: flex;
        align-items: center;

        width: 70px;

        padding: 4px 5px;

        border-right: 1px solid var(--rtra-border-soft);

        background: var(--cedron-50, #e7f1f8);
        color: var(--rtra-head);

        font-size: .52rem;
        font-weight: 750;
        text-transform: uppercase;
    }

    .rtra-cell {
        height: auto;
        min-height: 0;
    }

    .rtra-autor,
    .rtra-titulo {
        min-height: 100px;
    }

    .rtra-trabajo-main {
        height: 90px;
        min-height: 90px;
    }

    .rtra-colaboradores {
        min-height: 0;
    }

    .rtra-sin-colaboradores {
        min-height: 90px;
    }
}


@media (max-width: 480px) {

    .rtra-tabla td {
        padding-left: 64px;
    }

    .rtra-tabla td::before {
        width: 58px;

        justify-content: center;

        font-size: .47rem;
        text-align: center;
    }

    .rtra-colaborador {
        grid-template-rows: 34px 38px;
    }

    .rtra-colaborador-head {
        gap: 2px;

        padding: 3px;
    }

    .rtra-colaborador-icono {
        width: 18px;
        height: 18px;
        flex-basis: 18px;

        font-size: .62rem;
    }

    .rtra-colaborador-datos {
        max-width: calc(100% - 20px);
    }

    .rtra-colaborador-documentos {
        min-height: 38px;
    }

    .rtra-doc small {
        font-size: .38rem;
    }
}


/* =========================================================
   BITÁCORA DEL DÍA
   ========================================================= */

.bitdia {
    width: 100%;
    color: #293743;
}


/* =========================================================
   BARRA SUPERIOR
   ========================================================= */

.bitdia-barra {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 14px;
    padding: 12px 16px;
    background: #fff;
    border: 1px solid #dfe6ec;
    border-radius: 10px;
}

.bitdia-navegacion {
    display: flex;
    align-items: center;
    gap: 12px;
}

.bitdia-nav {
    width: 36px;
    height: 36px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    background: #f7f9fb;
    border: 1px solid #d7e0e7;
    border-radius: 7px;
    color: #234f73;
    cursor: pointer;
}

.bitdia-nav:hover:not(:disabled) {
    background: #eaf2f8;
    border-color: #b8cad8;
}

.bitdia-nav:disabled {
    opacity: .3;
    cursor: default;
}

.bitdia-fecha {
    min-width: 155px;
    text-align: center;
}

.bitdia-fecha small {
    display: block;
    margin-bottom: 2px;
    color: #8794a0;
    font-size: .63rem;
    font-weight: 700;
    letter-spacing: .08em;
}

.bitdia-fecha strong {
    color: #294b68;
    font-size: .92rem;
}

.bitdia-contador {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    background: #f4f7f9;
    border-radius: 7px;
    color: #70808d;
    font-size: .7rem;
}

.bitdia-contador i,
.bitdia-contador strong {
    color: #315e81;
}


/* =========================================================
   ENCABEZADO TIPO TABLA
   ========================================================= */

.bitdia-encabezado {
    display: grid;
    grid-template-columns: 175px minmax(300px, 1fr) minmax(310px, .85fr);
    padding: 7px 14px;
    color: #82909c;
    font-size: .63rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.bitdia-registros {
    background: #fff;
    border: 1px solid #dfe5ea;
    border-radius: 10px;
    overflow: hidden;
}


/* =========================================================
   FILA
   ========================================================= */

.bitdia-fila {
    position: relative;
    display: grid;
    grid-template-columns: 175px minmax(300px, 1fr) minmax(310px, .85fr);
    min-height: 102px;
    border-bottom: 1px solid #edf0f3;
}

.bitdia-fila:last-child {
    border-bottom: 0;
}

.bitdia-fila:hover {
    background: #fbfcfd;
}

.bitdia-col-fecha {
    display: flex;
    align-items: flex-start;
    padding: 17px 14px;
    border-right: 1px solid #edf0f3;
}

.bitdia-col-fecha strong {
    color: #677785;
    font-family: Consolas, monospace;
    font-size: .68rem;
    font-weight: 500;
}


/* =========================================================
   ACTIVIDAD
   ========================================================= */

.bitdia-col-actividad {
    min-width: 0;
    display: flex;
    align-items: flex-start;
    gap: 13px;
    padding: 15px 18px;
}

.bitdia-evento-icono {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 9px;
    font-size: 1.05rem;
}

.bitdia-icono-documento {
    color: #315e81;
    background: #edf4f9;
}

.bitdia-icono-trabajo {
    color: #38715f;
    background: #eef7f4;
}

.bitdia-icono-acceso {
    color: #765a82;
    background: #f5eff7;
}

.bitdia-evento {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.bitdia-tipo {
    margin-bottom: 2px;
    color: #8c98a2;
    font-size: .62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.bitdia-evento-titulo {
    max-width: 100%;
    color: #324b60;
    font-size: .84rem;
    line-height: 1.3;
}

.bitdia-descripcion {
    max-width: 100%;
    margin-top: 5px;
    color: #71808c;
    font-size: .69rem;
    line-height: 1.35;
}


/* =========================================================
   ARCHIVO
   ========================================================= */

.bitdia-archivo {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 8px;
}

.bitdia-extension {
    display: inline-block;
    padding: 2px 7px;
    background: #f1f4f6;
    border: 1px solid #dce3e8;
    border-radius: 5px;
    color: #61717e;
    font-size: .58rem;
    font-weight: 700;
}

.bitdia-descarga {
    color: #35698f;
    font-size: .66rem;
    font-weight: 600;
    text-decoration: none;
}

.bitdia-descarga:hover {
    color: #234c69;
    text-decoration: none;
}


/* =========================================================
   INFORMACIÓN DEL TRABAJO
   ========================================================= */

.bitdia-col-info {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 15px;
    background: #fafbfc;
    border-left: 1px solid #edf0f3;
}

.bitdia-trabajo-img {
    width: 64px;
    height: 64px;
    flex: 0 0 64px;
    display: block;
    object-fit: cover;
    border-radius: 8px;
    background: #edf1f4;
}

.bitdia-sin-foto {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #91a0ac;
    font-size: 1.3rem;
}

.bitdia-trabajo-datos {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.bitdia-trabajo-datos > strong {
    overflow: hidden;
    color: #344f64;
    font-size: .78rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bitdia-trabajo-datos > span {
    color: #677986;
    font-size: .67rem;
}

.bitdia-trabajo-datos > small {
    overflow: hidden;
    color: #87949e;
    font-size: .63rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =========================================================
   INSTITUCIÓN
   ========================================================= */

.bitdia-institucion {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 3px;
}

.bitdia-institucion img {
    width: 25px;
    height: 25px;
    flex: 0 0 25px;
    padding: 2px;
    object-fit: contain;
    background: #fff;
    border: 1px solid #e0e6ea;
    border-radius: 5px;
}

.bitdia-institucion span {
    overflow: hidden;
    color: #657581;
    font-size: .62rem;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* =========================================================
   ACCESO
   ========================================================= */

.bitdia-info-acceso {
    background: #fcfafc;
}

.bitdia-avatar-acceso {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #f0ebf2;
    border-radius: 50%;
    color: #765a82;
    font-size: 1rem;
}


/* =========================================================
   IDENTIFICACIÓN VISUAL POR EVENTO
   ========================================================= */

.bitdia-documento {
    border-left: 3px solid #5684a5;
}

.bitdia-trabajo {
    border-left: 3px solid #5d8c7d;
}

.bitdia-acceso {
    border-left: 3px solid #896d93;
}


/* =========================================================
   SIN MOVIMIENTOS
   ========================================================= */

.bitdia-vacio {
    min-height: 190px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 9px;
    color: #8996a0;
}

.bitdia-vacio i {
    font-size: 2rem;
    color: #a9b4bc;
}

.bitdia-vacio strong {
    color: #6b7984;
    font-size: .8rem;
}


/* =========================================================
   RESPONSIVO
   ========================================================= */

@media (max-width: 1050px) {

    .bitdia-encabezado {
        display: none;
    }

    .bitdia-fila {
        grid-template-columns: 150px 1fr;
    }

    .bitdia-col-info {
        grid-column: 2;
        border-top: 1px solid #edf0f3;
        border-left: 0;
    }
}

@media (max-width: 700px) {

    .bitdia-barra {
        flex-direction: column;
    }

    .bitdia-fila {
        display: block;
    }

    .bitdia-col-fecha {
        padding: 8px 14px;
        background: #f5f7f9;
        border-right: 0;
        border-bottom: 1px solid #edf0f3;
    }

    .bitdia-col-actividad,
    .bitdia-col-info {
        padding: 13px 14px;
    }
}