/*
  UC Design System
  Sistema visual global para UNIDOS CRECEMOS.

  Objetivo:
  - Unificar paleta, botones, tarjetas, filtros, tablas, chips, estados vacios
    y comportamiento movil.
  - Servir como base para nuevas vistas y como capa de normalizacion para las
    vistas existentes que aun tienen estilos locales.
*/

:root{
  --uc-primary:#365A3F;
  --uc-primary-2:#47704E;
  --uc-primary-soft:#E7F4E2;
  --uc-bg:#F8FBF8;
  --uc-surface:#FFFFFF;
  --uc-surface-alt:#F8FBF8;
  --uc-text:#111811;
  --uc-muted:#536153;
  --uc-border:#D8E4D8;
  --uc-info:#24517A;
  --uc-info-soft:#EAF4FF;
  --uc-warning:#9A6700;
  --uc-warning-soft:#FFF7E0;
  --uc-danger:#C62828;
  --uc-danger-soft:#FDECEC;
  --uc-radius:14px;
  --uc-radius-sm:10px;
  --uc-shadow:0 14px 30px rgba(20,32,25,.08);
  --uc-shadow-sm:0 8px 18px rgba(20,32,25,.06);
  --uc-control-h:44px;
}

body.theme-dark{
  --uc-surface:#151D17;
  --uc-surface-alt:#1C261E;
  --uc-bg:#101611;
  --uc-text:#EEF6EE;
  --uc-muted:#B6C6B7;
  --uc-border:#314032;
  --uc-shadow:0 16px 34px rgba(0,0,0,.32);
  --uc-shadow-sm:0 8px 18px rgba(0,0,0,.26);
}

#main-content .uc-page,
#main-content .ucds-page{
  color:var(--uc-text);
}

#main-content .uc-hero,
#main-content .ucds-hero{
  background:linear-gradient(135deg,var(--uc-surface),var(--uc-surface-alt));
  border:1px solid var(--uc-border);
  border-radius:18px;
  box-shadow:var(--uc-shadow);
  padding:1rem;
  margin-bottom:1rem;
}

#main-content .uc-hero-row,
#main-content .ucds-hero-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.9rem;
  flex-wrap:wrap;
}

#main-content .uc-title,
#main-content .ucds-title{
  display:flex;
  align-items:center;
  gap:.7rem;
  margin:0;
  font-weight:950;
  color:var(--uc-text);
  letter-spacing:0;
}

#main-content .uc-title-icon,
#main-content .ucds-title-icon{
  width:44px;
  height:44px;
  border-radius:14px;
  display:grid;
  place-items:center;
  color:#fff;
  background:var(--uc-primary);
  flex:0 0 auto;
}

#main-content .uc-photo-avatar,
#main-content .uc-photo-credit{
  width:52px;
  height:52px;
  border-radius:14px;
  object-fit:cover;
  border:1px solid var(--uc-border);
  background:var(--uc-surface-alt);
  box-shadow:var(--uc-shadow-sm);
  flex:0 0 auto;
}

#main-content .uc-photo-avatar{
  border-radius:50%;
}

#main-content .uc-photo-credit{
  width:100%;
  height:140px;
  display:block;
  margin-bottom:.75rem;
}

#main-content .uc-photo-strip{
  display:flex;
  gap:.45rem;
  flex-wrap:wrap;
  margin:.65rem 0;
}

#main-content .uc-photo-tile{
  width:86px;
  border:1px solid var(--uc-border);
  border-radius:12px;
  background:var(--uc-surface-alt);
  color:var(--uc-muted);
  overflow:hidden;
  text-decoration:none;
  font-size:.72rem;
  font-weight:800;
}

#main-content .uc-photo-tile img{
  width:100%;
  height:64px;
  display:block;
  object-fit:cover;
}

#main-content .uc-photo-tile span{
  display:block;
  padding:.25rem .35rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

#main-content .uc-photo-placeholder{
  width:52px;
  height:52px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  background:var(--uc-primary);
  font-weight:900;
}

#main-content .uc-subtitle,
#main-content .ucds-subtitle{
  color:var(--uc-muted);
  margin:.35rem 0 0;
  font-size:.92rem;
}

#main-content .uc-actions,
#main-content .uc-toolbar,
#main-content .ucds-actions,
#main-content .ucds-toolbar{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:.5rem;
  flex-wrap:wrap;
}

#main-content .uc-card,
#main-content .uc-table-card,
#main-content .uc-state-box,
#main-content .ucds-card,
#main-content .ucds-table-card,
#main-content .card-soft,
#main-content .hc-card,
#main-content .hc-section,
#main-content .refi-card,
#main-content .cps-card,
#main-content .rs-card,
#main-content .client-panel,
#main-content .client-new-hero,
#main-content .credit-card,
#main-content .ac-card,
#main-content .ce-card,
#main-content .edit-card,
#main-content .loan-card,
#main-content .user-card,
#main-content .imp-card,
#main-content .mig-card,
#main-content .nc-card,
#main-content .tpl-page > section,
#main-content .rf-page > section,
#main-content .users-toolbar,
#main-content .loans-page .toolbar{
  background:var(--uc-surface) !important;
  border:1px solid var(--uc-border) !important;
  border-radius:var(--uc-radius) !important;
  box-shadow:var(--uc-shadow-sm) !important;
  color:var(--uc-text) !important;
}

#main-content .uc-card,
#main-content .uc-table-card,
#main-content .uc-state-box,
#main-content .ucds-card,
#main-content .ucds-table-card{
  padding:1rem;
  margin-bottom:1rem;
}

#main-content .uc-kpi-grid,
#main-content .ucds-kpi-grid,
#main-content .ppc-kpi-grid,
#main-content .rs-kpi-grid,
#main-content .kpi-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
  gap:.75rem;
  margin:1rem 0;
}

#main-content .uc-kpi,
#main-content .ucds-kpi,
#main-content .ppc-kpi,
#main-content .kpi,
#main-content .ac-grid > *,
#main-content .ce-kpi,
#main-content .loan-kpi,
#main-content .imp-kpi,
#main-content .mig-kpi,
#main-content .nc-kpi{
  display:flex;
  align-items:center;
  gap:.75rem;
  min-height:86px;
  padding:.9rem;
  background:var(--uc-surface);
  border:1px solid var(--uc-border);
  border-radius:var(--uc-radius);
  box-shadow:var(--uc-shadow-sm);
}

#main-content .uc-kpi-icon,
#main-content .ucds-kpi-icon{
  width:44px;
  height:44px;
  border-radius:13px;
  display:grid;
  place-items:center;
  color:var(--uc-primary);
  background:var(--uc-primary-soft);
  border:1px solid rgba(54,90,63,.24);
}

#main-content .uc-kpi-label,
#main-content .ucds-kpi-label{
  color:var(--uc-muted);
  font-size:.72rem;
  text-transform:uppercase;
  font-weight:900;
  letter-spacing:0;
}

#main-content .uc-kpi-value,
#main-content .ucds-kpi-value{
  color:var(--uc-text);
  font-weight:950;
  font-size:1.22rem;
  line-height:1.1;
  margin-top:.15rem;
}

#main-content .uc-filter,
#main-content .ucds-filter,
#main-content .ppc-filter,
#main-content .filters,
#main-content .rs-filter-card,
#main-content .cron-toolbar,
#main-content .nc-sticky-filters .nc-card,
#main-content .mig-editor-panel{
  background:var(--uc-surface);
  border:1px solid var(--uc-border);
  border-radius:var(--uc-radius);
  box-shadow:var(--uc-shadow-sm);
  padding:.9rem;
  margin-bottom:1rem;
}

#main-content .uc-filter-grid,
#main-content .ucds-filter-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:.7rem;
  align-items:end;
}

#main-content .uc-search,
#main-content .ucds-search{
  position:relative;
}

#main-content .form-control,
#main-content .form-select,
#main-content input[type="text"],
#main-content input[type="search"],
#main-content input[type="date"],
#main-content input[type="number"],
#main-content input[type="email"],
#main-content input[type="tel"],
#main-content select,
#main-content textarea{
  border-color:var(--uc-border);
  color:var(--uc-text);
  background-color:var(--uc-surface);
  border-radius:var(--uc-radius-sm);
}

#main-content .form-control,
#main-content .form-select,
#main-content input[type="text"],
#main-content input[type="search"],
#main-content input[type="date"],
#main-content input[type="number"],
#main-content input[type="email"],
#main-content input[type="tel"],
#main-content select{
  min-height:var(--uc-control-h);
}

#main-content textarea.form-control,
#main-content textarea{
  min-height:88px;
}

#main-content .form-label{
  color:var(--uc-text);
  font-weight:850;
}

#main-content .form-control:focus,
#main-content .form-select:focus,
#main-content input:focus,
#main-content select:focus,
#main-content textarea:focus{
  border-color:var(--uc-primary-2);
  box-shadow:0 0 0 .2rem rgba(54,90,63,.14);
}

#main-content .uc-btn-primary,
#main-content .ucds-btn-primary,
#main-content .btn-success{
  min-height:var(--uc-control-h);
  border-radius:var(--uc-radius-sm);
  background:var(--uc-primary) !important;
  border-color:var(--uc-primary) !important;
  color:#fff !important;
  font-weight:850;
}

#main-content .uc-btn-primary:hover,
#main-content .ucds-btn-primary:hover,
#main-content .btn-success:hover{
  background:var(--uc-primary-2) !important;
  border-color:var(--uc-primary-2) !important;
}

#main-content .uc-btn-secondary,
#main-content .ucds-btn-secondary,
#main-content .btn-outline-success,
#main-content .btn-outline-secondary{
  min-height:var(--uc-control-h);
  border-radius:var(--uc-radius-sm);
  font-weight:850;
}

#main-content .btn-outline-success{
  color:var(--uc-primary) !important;
  border-color:rgba(54,90,63,.45) !important;
}

#main-content .btn-outline-success:hover{
  color:#fff !important;
  background:var(--uc-primary) !important;
  border-color:var(--uc-primary) !important;
}

#main-content .uc-btn-danger,
#main-content .ucds-btn-danger,
#main-content .btn-danger,
#main-content .btn-outline-danger{
  min-height:var(--uc-control-h);
  border-radius:var(--uc-radius-sm);
  font-weight:850;
}

#main-content .btn-danger{
  background:var(--uc-danger) !important;
  border-color:var(--uc-danger) !important;
}

#main-content .uc-table,
#main-content .ucds-table,
#main-content table.table,
#main-content .hc-table,
#main-content .cps-table,
#main-content .rs-table,
#main-content .ppc-table,
#main-content .ce-table,
#main-content .mig-table,
#main-content .ac-table{
  width:100%;
  color:var(--uc-text);
  border-color:var(--uc-border);
}

#main-content .uc-table th,
#main-content .ucds-table th,
#main-content table.table thead th,
#main-content .hc-table th,
#main-content .cps-table th,
#main-content .rs-table th,
#main-content .ppc-table th,
#main-content .ce-table th,
#main-content .mig-table th,
#main-content .ac-table th{
  background:var(--uc-surface-alt) !important;
  color:var(--uc-muted) !important;
  font-size:.74rem;
  text-transform:uppercase;
  font-weight:900;
  letter-spacing:0;
  border-color:var(--uc-border) !important;
  white-space:nowrap;
}

#main-content .uc-table td,
#main-content .ucds-table td,
#main-content table.table td,
#main-content .hc-table td,
#main-content .cps-table td,
#main-content .rs-table td,
#main-content .ppc-table td,
#main-content .ce-table td,
#main-content .mig-table td,
#main-content .ac-table td{
  border-color:var(--uc-border) !important;
  color:var(--uc-text);
  vertical-align:middle;
}

#main-content .uc-chip,
#main-content .ucds-chip,
#main-content .pill,
#main-content .rs-pill{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  border-radius:999px;
  padding:.28rem .6rem;
  font-size:.74rem;
  line-height:1;
  font-weight:900;
  white-space:nowrap;
  border:1px solid var(--uc-border);
  background:var(--uc-surface-alt);
  color:var(--uc-text);
}

#main-content .uc-chip-success,
#main-content .uc-chip-correcto,
#main-content .uc-chip-activo,
#main-content .uc-chip-pagado,
#main-content .uc-chip-completo,
#main-content .pill.ok,
#main-content .rs-pill.ok{
  color:var(--uc-primary);
  background:var(--uc-primary-soft);
  border-color:rgba(54,90,63,.30);
}

#main-content .uc-chip-warning,
#main-content .uc-chip-advertencia,
#main-content .uc-chip-pendiente,
#main-content .uc-chip-vencido,
#main-content .uc-chip-faltantes,
#main-content .pill.warn,
#main-content .rs-pill.warn{
  color:var(--uc-warning);
  background:var(--uc-warning-soft);
  border-color:rgba(154,103,0,.28);
}

#main-content .uc-chip-danger,
#main-content .uc-chip-error,
#main-content .uc-chip-anulado,
#main-content .pill.bad,
#main-content .pill.danger{
  color:var(--uc-danger);
  background:var(--uc-danger-soft);
  border-color:rgba(198,40,40,.30);
}

#main-content .uc-chip-info,
#main-content .uc-chip-refinanciado,
#main-content .uc-chip-azul{
  color:var(--uc-info);
  background:var(--uc-info-soft);
  border-color:rgba(36,81,122,.24);
}

#main-content .uc-empty,
#main-content .ucds-empty,
#main-content .empty,
#main-content .cron-empty,
#main-content .ce-empty,
#main-content .edit-empty,
#main-content .loan-empty,
#main-content .user-empty{
  padding:1rem;
  text-align:center;
  color:var(--uc-muted);
  background:var(--uc-surface-alt);
  border:1px dashed var(--uc-border);
  border-radius:var(--uc-radius);
}

#main-content .uc-mobile-card,
#main-content .ucds-mobile-card{
  background:var(--uc-surface);
  border:1px solid var(--uc-border);
  border-radius:var(--uc-radius);
  box-shadow:var(--uc-shadow-sm);
  padding:.9rem;
}

#main-content .uc-state-box{
  display:flex;
  align-items:flex-start;
  gap:.7rem;
}

#main-content .uc-state-box.success{
  background:var(--uc-primary-soft);
  border-color:rgba(54,90,63,.30);
}

#main-content .uc-state-box.warning{
  background:var(--uc-warning-soft);
  border-color:rgba(154,103,0,.28);
}

#main-content .uc-state-box.danger{
  background:var(--uc-danger-soft);
  border-color:rgba(198,40,40,.30);
}

#main-content .uc-state-box.info{
  background:var(--uc-info-soft);
  border-color:rgba(36,81,122,.24);
}

/* Adaptadores de vistas legacy: permiten que las pantallas existentes hereden
   la misma estructura visual sin duplicar reglas por JSP. */
#main-content .uc-page h1,
#main-content .uc-page h2,
#main-content .uc-page h3,
#main-content .uc-page h4,
#main-content .uc-page h5{
  color:var(--uc-text);
  letter-spacing:0;
}

#main-content .uc-page .text-muted,
#main-content .uc-page .hint,
#main-content .uc-page .ce-note,
#main-content .uc-page .ce-mini-label{
  color:var(--uc-muted) !important;
}

#main-content .ac-page,
#main-content .client-new-page,
#main-content .edit-hub,
#main-content .edit-page,
#main-content .loan-edit,
#main-content .user-edit,
#main-content .imp-page,
#main-content .mig-page,
#main-content .nc-page,
#main-content .tpl-page,
#main-content .rf-page{
  color:var(--uc-text);
}

#main-content .client-new-hero,
#main-content .ac-hero,
#main-content .ce-title-wrap,
#main-content .edit-head,
#main-content .edit-top,
#main-content .loan-top,
#main-content .user-top,
#main-content .imp-hero,
#main-content .mig-hero,
#main-content .nc-hero,
#main-content .rf-page > header{
  background:linear-gradient(135deg,var(--uc-surface),var(--uc-surface-alt)) !important;
  border:1px solid var(--uc-border) !important;
  border-radius:18px !important;
  box-shadow:var(--uc-shadow) !important;
  padding:1rem !important;
  margin-bottom:1rem !important;
}

#main-content .edit-search,
#main-content .loan-search,
#main-content .user-search,
#main-content .search-wrap,
#main-content .cron-srch{
  border:1px solid var(--uc-border);
  border-radius:var(--uc-radius-sm);
  background:var(--uc-surface);
}

#main-content .badge-soft,
#main-content .ce-badge,
#main-content .late-chip,
#main-content .chip{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  min-height:28px;
  border-radius:999px !important;
  border:1px solid var(--uc-border) !important;
  background:var(--uc-surface-alt) !important;
  color:var(--uc-muted) !important;
  font-weight:800;
}

#main-content .ce-badge-info,
#main-content .badge.bg-info,
#main-content .badge-info{
  background:var(--uc-info-soft) !important;
  color:var(--uc-info) !important;
  border-color:rgba(36,81,122,.24) !important;
}

#main-content .badge.bg-success,
#main-content .badge-success,
#main-content .ce-kpi.success{
  background:var(--uc-primary-soft) !important;
  color:var(--uc-primary) !important;
  border-color:rgba(54,90,63,.30) !important;
}

#main-content .badge.bg-warning,
#main-content .badge-warning,
#main-content .ce-kpi.warn{
  background:var(--uc-warning-soft) !important;
  color:var(--uc-warning) !important;
  border-color:rgba(154,103,0,.28) !important;
}

#main-content .badge.bg-danger,
#main-content .badge-danger{
  background:var(--uc-danger-soft) !important;
  color:var(--uc-danger) !important;
  border-color:rgba(198,40,40,.30) !important;
}

#main-content .modal-content{
  border:1px solid var(--uc-border);
  border-radius:var(--uc-radius);
  box-shadow:var(--uc-shadow);
}

#main-content .modal-header{
  background:var(--uc-primary) !important;
  color:#fff !important;
  border-bottom:0;
}

#main-content .modal-header .btn-close{
  filter:invert(1) grayscale(1) brightness(2);
}

/* UC visual polish 2026: cards, chips, buttons and operational tables. */
#main-content .uc-card,
#main-content .ucds-card,
#main-content .card-soft,
#main-content .rs-card,
#main-content .cliente-card,
#main-content .loan-card,
#main-content .client-card,
#main-content .monitor-card{
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

#main-content .uc-card:hover,
#main-content .ucds-card:hover,
#main-content .card-soft:hover,
#main-content .rs-card:hover,
#main-content .cliente-card:hover,
#main-content .loan-card:hover,
#main-content .client-card:hover{
  border-color:rgba(54,90,63,.22) !important;
  box-shadow:0 14px 34px rgba(20,32,25,.09) !important;
}

#main-content .uc-entity-card{
  display:grid;
  gap:.65rem;
  border:1px solid var(--uc-border);
  border-radius:var(--uc-radius);
  background:linear-gradient(135deg,var(--uc-surface),var(--uc-surface-alt));
  box-shadow:var(--uc-shadow-sm);
  padding:1rem;
}

#main-content .uc-entity-head{
  display:flex;
  gap:.7rem;
  align-items:flex-start;
  justify-content:space-between;
}

#main-content .uc-entity-title{
  margin:0;
  color:var(--uc-text);
  font-weight:950;
  line-height:1.12;
  overflow-wrap:anywhere;
}

#main-content .uc-entity-sub{
  color:var(--uc-muted);
  font-size:.84rem;
  font-weight:700;
  line-height:1.25;
}

#main-content .uc-status,
#main-content .uc-status-ok,
#main-content .uc-status-warning,
#main-content .uc-status-danger,
#main-content .uc-status-info,
#main-content .uc-status-neutral{
  display:inline-flex;
  align-items:center;
  gap:.32rem;
  min-height:28px;
  border-radius:999px;
  border:1px solid var(--uc-border);
  padding:.25rem .56rem;
  font-size:.75rem;
  line-height:1;
  font-weight:900;
  white-space:nowrap;
}

#main-content .uc-status-ok{background:var(--uc-primary-soft);color:var(--uc-primary);border-color:rgba(54,90,63,.28);}
#main-content .uc-status-warning{background:var(--uc-warning-soft);color:var(--uc-warning);border-color:rgba(154,103,0,.28);}
#main-content .uc-status-danger{background:var(--uc-danger-soft);color:var(--uc-danger);border-color:rgba(198,40,40,.28);}
#main-content .uc-status-info{background:var(--uc-info-soft);color:var(--uc-info);border-color:rgba(36,81,122,.24);}
#main-content .uc-status-neutral{background:var(--uc-surface-alt);color:var(--uc-muted);}

#main-content .btn,
#main-content button,
#main-content .uc-btn-primary,
#main-content .uc-btn-secondary{
  letter-spacing:0 !important;
}

#main-content .btn-success,
#main-content .uc-btn-primary{
  box-shadow:0 8px 18px rgba(54,90,63,.14);
}

#main-content .btn-outline-success,
#main-content .btn-outline-secondary,
#main-content .uc-btn-secondary{
  background:var(--uc-surface);
}

#main-content .table-responsive.uc-sticky-table,
#main-content .table-responsive:has(table.uc-sticky-table){
  max-height:min(72dvh, 720px);
  overflow:auto;
}

#main-content table.uc-sticky-table thead th{
  position:sticky;
  top:0;
  z-index:6;
  background:var(--uc-surface-alt) !important;
  box-shadow:0 1px 0 var(--uc-border);
}

#main-content .uc-formula{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.4rem;
  color:var(--uc-muted);
  font-size:.82rem;
  font-weight:800;
}

#main-content .uc-formula strong{
  color:var(--uc-text);
  font-weight:950;
}

@media (max-width: 780px){
  #main-content .uc-hero,
  #main-content .ucds-hero{
    padding:.9rem;
    border-radius:14px;
  }

  #main-content .uc-title,
  #main-content .ucds-title{
    font-size:1.05rem;
  }

  #main-content .uc-actions,
  #main-content .uc-toolbar,
  #main-content .ucds-actions,
  #main-content .ucds-toolbar{
    width:100%;
    justify-content:stretch;
  }

  #main-content .uc-actions .btn,
  #main-content .uc-toolbar .btn,
  #main-content .ucds-actions .btn,
  #main-content .ucds-toolbar .btn,
  #main-content .btn{
    min-height:44px;
  }

  #main-content .uc-filter-grid,
  #main-content .ucds-filter-grid{
    grid-template-columns:1fr;
  }

  #main-content .uc-kpi-grid,
  #main-content .ucds-kpi-grid{
    grid-template-columns:1fr;
  }

  #main-content .table-responsive{
    border:1px solid var(--uc-border);
    border-radius:var(--uc-radius);
  }
}