/* -------------------------------------------------------------------------- */
/*                                Falcon Button                               */
/* -------------------------------------------------------------------------- */
/* prettier-ignore */
:root {
  /* Colores de estado */
  --operation-status-draft: #FFCC55;
  --operation-status-study: #FF9F40;
  --operation-status-no-answer: #FFD700;
  --operation-status-on-pause: #808080;
  --operation-status-required-doc: #FF5530;
  --operation-status-record: #FE6385;
  --operation-status-waiting-for-proposal: #9966FF;
  --operation-status-waiting-for-decision: #F7B32B;
  --operation-status-appraisal: #36A1ED;
  --operation-status-wait-fein: #4CC0C0;
  --operation-status-notary: #C9CBCF;
  --operation-status-presented: #9966FF;
  --operation-status-in-signature: #36A1ED;
  --operation-status-closed: #4D5360;
  --operation-status-canceled: #FF0000;
  --operation-status-paid: #259C07;
  --operation-status-partial-paid: #09C83C;

  /* Colores del TIPO de operación. Reutilizan las tonalidades de arriba para
     que las dos cápsulas del listado hablen el mismo idioma: el color lo da el
     comportamiento, así que «vivienda habitual» y «segunda residencia» —que se
     comportan igual— comparten color. */
  --operation-type-mortgage: var(--operation-status-appraisal);
  /* El verde del préstamo es el mismo de la cápsula «Enviado» de firmas, que
     usa el `bg-success` del tema. */
  --operation-type-loan: var(--falcon-success);
  --operation-type-self-promotion: var(--operation-status-study);
  --operation-type-mortgage-improvement: var(--operation-status-waiting-for-proposal);
  --operation-type-private-capital: var(--operation-status-on-pause);

  /* Colores de fuente por defecto */
  --pill-font-color-draft: #fff;
  --pill-font-color-study: #fff;
  --pill-font-color-no-answer: #fff;
  --pill-font-color-on-pause: #fff;
  --pill-font-color-required-doc: #fff;
  --pill-font-color-record: #fff;
  --pill-font-color-waiting-for-proposal: #fff;
  --pill-font-color-waiting-for-decision: #fff;
  --pill-font-color-appraisal: #fff;
  --pill-font-color-wait-fein: #fff;
  --pill-font-color-notary: #fff;
  --pill-font-color-presented: #fff;
  --pill-font-color-in-signature: #fff;
  --pill-font-color-closed: #fff;
  --pill-font-color-canceled: #fff;
  --pill-font-color-paid: #fff;
  --pill-font-color-partial-paid: #fff;
}

/* ================= LIGHT THEME ================= */
[data-bs-theme=light] {
  --pill-font-color-draft: #000;
  --pill-font-color-study: #000;
  --pill-font-color-no-answer: #000;
  --pill-font-color-on-pause: #000;
  --pill-font-color-required-doc: #000;
  --pill-font-color-record: #000;
  --pill-font-color-waiting-for-proposal: #000;
  --pill-font-color-waiting-for-decision: #000;
  --pill-font-color-appraisal: #000;
  --pill-font-color-wait-fein: #000;
  --pill-font-color-notary: #000;
  --pill-font-color-presented: #fff;
  --pill-font-color-in-signature: #fff;
  --pill-font-color-closed: #fff;
  --pill-font-color-canceled: #fff;
  --pill-font-color-paid: #fff;
  --pill-font-color-partial-paid: #fff;
}

/* ================= DARK THEME ================= */
[data-bs-theme=dark] {
  --pill-font-color-draft: #fff;
  --pill-font-color-study: #fff;
  --pill-font-color-no-answer: #fff;
  --pill-font-color-on-pause: #fff;
  --pill-font-color-required-doc: #fff;
  --pill-font-color-record: #fff;
  --pill-font-color-waiting-for-proposal: #fff;
  --pill-font-color-waiting-for-decision: #fff;
  --pill-font-color-appraisal: #fff;
  --pill-font-color-wait-fein: #fff;
  --pill-font-color-notary: #fff;
  --pill-font-color-presented: #fff;
  --pill-font-color-in-signature: #fff;
  --pill-font-color-closed: #fff;
  --pill-font-color-canceled: #fff;
  --pill-font-color-paid: #fff;
  --pill-font-color-partial-paid: #fff;
}

/* ================= BADGE CLASSES ================= */
.bg-pill-draft {
  background-color: var(--operation-status-draft);
  color: var(--pill-font-color-draft);
}

.bg-pill-study {
  background-color: var(--operation-status-study);
  color: var(--pill-font-color-study);
}

.bg-pill-no-answer {
  background-color: var(--operation-status-no-answer);
  color: var(--pill-font-color-no-answer);
}

.bg-pill-on-pause {
  background-color: var(--operation-status-on-pause);
  color: var(--pill-font-color-on-pause);
}

.bg-pill-required-doc {
  background-color: var(--operation-status-required-doc);
  color: var(--pill-font-color-required-doc);
}

.bg-pill-record {
  background-color: var(--operation-status-record);
  color: var(--pill-font-color-record);
}

.bg-pill-waiting-for-proposal {
  background-color: var(--operation-status-waiting-for-proposal);
  color: var(--pill-font-color-waiting-for-proposal);
}

.bg-pill-waiting-for-decision {
  background-color: var(--operation-status-waiting-for-decision);
  color: var(--pill-font-color-waiting-for-decision);
}

.bg-pill-appraisal {
  background-color: var(--operation-status-appraisal);
  color: var(--pill-font-color-appraisal);
}

.bg-pill-wait-fein {
  background-color: var(--operation-status-wait-fein);
  color: var(--pill-font-color-wait-fein);
}

.bg-pill-notary {
  background-color: var(--operation-status-notary);
  color: var(--pill-font-color-notary);
}

.bg-pill-presented {
  background-color: var(--operation-status-presented);
  color: var(--pill-font-color-presented);
}

.bg-pill-in-signature {
  background-color: var(--operation-status-in-signature);
  color: var(--pill-font-color-in-signature);
}

.bg-pill-closed {
  background-color: var(--operation-status-closed);
  color: var(--pill-font-color-closed);
}

.bg-pill-canceled {
  background-color: var(--operation-status-canceled);
  color: var(--pill-font-color-canceled);
}

.bg-pill-paid {
  background-color: var(--operation-status-paid);
  color: var(--pill-font-color-paid);
}

.bg-pill-partial-paid {
  background-color: var(--operation-status-partial-paid);
  color: var(--pill-font-color-partial-paid);
}

/* Cápsulas del TIPO de operación */
.bg-pill-type-mortgage {
  background-color: var(--operation-type-mortgage);
  color: #fff;
}

.bg-pill-type-loan {
  background-color: var(--operation-type-loan);
  color: #fff;
}

.bg-pill-type-self-promotion {
  background-color: var(--operation-type-self-promotion);
  color: #fff;
}

.bg-pill-type-mortgage-improvement {
  background-color: var(--operation-type-mortgage-improvement);
  color: #fff;
}

.bg-pill-type-private-capital {
  background-color: var(--operation-type-private-capital);
  color: #fff;
}

.disabled {
    background-color: var(--falcon-gray-200);
    opacity: 1;
    cursor: pointer;
}

.calendar-activity-body-height {
    height: 27.8rem !important;
}

.canvas-operation-user {
    width: 800px !important;
    height: 300px !important;
    padding: 10px 0px;
}

.canvas-total-operation {
    width: auto !important;
    height: 450px !important;
}

.reminder-operation-user {
    height: 356px !important;
}

.no-link-style {
    color: inherit !important;
    text-decoration: none !important;
    cursor: default;
}

.no-link-style>svg {
    cursor: default;
}

.inline-block {
    display: inline-block;
}

.dz-success-mark,
.dz-error-mark {
    display: none;
}

.center-data-on-graph-1 {
    -webkit-transform: translate(190%, -50%) !important;
    -ms-transform: translate(190%, -50%) !important;
    transform: translate(190%, -50%) !important;
}

.center-data-on-graph-3 {
    -webkit-transform: translate(150%, -50%) !important;
    -ms-transform: translate(150%, -50%) !important;
    transform: translate(150%, -50%) !important;
}

.center-data-on-graph-4 {
    -webkit-transform: translate(240%, -50%) !important;
    -ms-transform: translate(240%, -50%) !important;
    transform: translate(240%, -50%) !important;
}

/* Estilos para el contenedor de Dropzone */
#add-document-file-dropzone {
    border: 2px dashed #ccc;
    /* Borde punteado */
    border-radius: 10px;
    /* Bordes redondeados */
    padding: 5px;
    /* Espaciado interno */
    text-align: center;
    /* Centrar contenido */
    background-color: #f9f9f9;
    /* Fondo claro */
}

/* Estilos para el ícono */
#add-document-file-dropzone .dz-message i {
    color: #6c757d;
    /* Color del ícono */
}

/* Estilos para el texto */
#add-document-file-dropzone .dz-message span {
    font-size: 16px;
    /* Tamaño del texto */
    color: #6c757d;
    /* Color del texto */
}

/* Estilos cuando se arrastra un archivo sobre Dropzone */
#add-document-file-dropzone.dz-drag-hover {
    border-color: #0d6efd;
    /* Cambiar color del borde al arrastrar */
    background-color: #e9f5ff;
    /* Cambiar color de fondo al arrastrar */
}

/* Botón "Editar" en icono de los paneles de la ficha de operación. Neutro en
   reposo; al apuntarlo solo se oscurecen trazo y borde, sin meter color en la
   cabecera de la tarjeta. Las variables --edit-* permiten reajustar tamaño y
   paleta sin tocar las reglas. */
.op-edit-btn {
    --edit-size: 31px;
    --edit-radius: 6px;
    --edit-border: #dee2e9;
    --edit-border-hover: #c9ceda;
    --edit-icon: #78828f;
    --edit-icon-hover: #0f172a;
    width: var(--edit-size);
    height: var(--edit-size);
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--edit-border);
    border-radius: var(--edit-radius);
    background: #fff;
    color: var(--edit-icon);
    cursor: pointer;
    transition: color .15s, border-color .15s;
}

.op-edit-btn svg {
    width: 15px;
    height: 15px;
    display: block;
}

.op-edit-btn:hover {
    color: var(--edit-icon-hover);
    border-color: var(--edit-border-hover);
}

.op-edit-btn:focus-visible {
    outline: 2px solid var(--edit-icon-hover);
    outline-offset: 2px;
}

.op-edit-btn:active {
    background: #f7f8fa;
}

[data-bs-theme="dark"] .op-edit-btn {
    --edit-border: var(--falcon-border-color, #2b303a);
    --edit-border-hover: #4a5568;
    --edit-icon-hover: var(--falcon-body-color, #e6e8ec);
    background: transparent;
}

[data-bs-theme="dark"] .op-edit-btn:active {
    background: rgba(255, 255, 255, .05);
}

/* Los tres puntos que acompañan al botón de editar. Falcon les da un hover casi
   imperceptible (#748194 -> #5e6e82), así que la pareja no se leía como una
   sola barra de acciones. */
.op-more-btn {
    border-radius: 6px;
    color: #78828f;
    transition: color .15s, background-color .15s;
}

.op-more-btn:hover,
.op-more-btn:focus-visible {
    color: #0f172a;
    background: #f2f4f7;
}

[data-bs-theme="dark"] .op-more-btn:hover,
[data-bs-theme="dark"] .op-more-btn:focus-visible {
    color: var(--falcon-body-color, #e6e8ec);
    background: rgba(255, 255, 255, .06);
}

.custom-margin {
    margin-left: 96%;
}

.operation-public-profile-link {
    color: #6c757d !important;
    cursor: pointer !important;
}

.logo {
    object-fit: cover;
    max-width: 180px;
}

.dataTables-custom-controls {
    display: inline-block;
    top: 57px;
    position: relative;
}

@media (min-width: 412px) {
    .icon-circle {
        width: 6rem;
        height: 6rem;
        margin: 0 auto;
        margin-bottom: 1rem;
    }

    .custom-padding {
        padding: 1rem !important;
    }

    .graphs {
        margin-top: -1.8rem !important;
    }
}

@media (min-width: 650px) {
    .icon-circle {
        width: 4rem;
        height: 4rem;
        border-radius: 50%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        border-width: 2px;
        border-style: solid;
        margin: 0 auto;
        margin-bottom: 1rem;
    }

    .custom-padding {
        padding: 0px !important;
    }

    .graphs {
        margin-top: -3rem !important;
    }
}

.btn-status-bar {
    border-radius: 0 0 0 0;
    width: 180px;
    position: relative;
    font-size: 0.85rem;
    font-weight: 200;
    padding: 2px 2px 2px 2px;
    margin: 0 0 0 0;
}

.btn-confirm {
    border-radius: 20px 20px 20px 20px;
    width: 180px;
    font-size: 0.85rem;
    font-weight: 200;
    padding: 2px 20px 2px 20px;
    margin: 0 0px 0 0px;
}

.status-btn-container > :first-child .status-btn,
.status-btn-container > :first-child.status-btn {
  border-radius: 20px 0 0 20px;
}

.status-btn-container > :last-child .status-btn,
.status-btn-container > :last-child.status-btn {
  border-radius: 0 20px 20px 0;
}

.status-btn-drowdown-4 {
    border-radius: 0 0 0 0;
    width: 180px;
    position: relative;
    font-size: 0.85rem;
    font-weight: 200;
    padding: 2px 20px 2px 20px;
}

.dropdown-menu-4 {
    width: 180px;
    display: inline-block;
    margin: 0 0 0 0;
}

.status-btn-drowdown-6 {
    border-radius: 0 20px 20px 0;
    width: 180px;
    position: relative;
    font-size: 0.85rem;
    font-weight: 200;
    padding: 2px 20px 2px 20px;
}

.indent-1 {
    padding-left: 20px !important;
}

.indent-2 {
    padding-left: 40px !important;
}

.section-title {
    font-weight: 500;
}

.number-cell {
    text-align: right;
    font-weight: 400;
}

.colored-cell {
    background: green !important;
    color: white !important;
}

.header-title {
    font-size: 0.9rem !important;
    padding: 4px !important;
    vertical-align: top;
}

/* cadastral */

.section-title {
    background-color: #0d6efd;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.85rem;
    padding: .6rem 1rem;
    border-radius: .25rem .25rem 0 0;
}

.data-label {
    font-weight: 600;
    color: #555;
}

.data-value {
    color: #000;
}


.icon-link {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: rgba(15, 23, 42, 0.05);
    color: #0f172a;
    text-decoration: none;
    transition: background .18s ease, transform .12s ease;
    font-size: 1rem;
}

.icon-link:hover,
.icon-link:focus {
    background: rgba(59, 130, 246, 0.12);
    color: #1e3a8a;
    transform: translateY(-2px);
    outline: none;
}

.icon-link i {
    font-size: 1.05rem;
}

@media (max-width: 576px) {
    .data-label {
        font-size: 0.9rem;
    }

    .icon-link {
        width: 30px;
        height: 30px;
    }
}

.spinner-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
}

.select2-selection__choice .select2-selection--multiple .select2-selection__choice__remove {
    margin-right: 0.70rem;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    margin-right: 0.70rem;
    color: #d9534f;
}

.select2-selection__choice__display {
    padding-left: 7px !important;
}

.select2-selection__choice__remove {
    border: none !important;
}

.dropdown-menu-custom {
    width: 210px !important;
}

.bg-teal {
    background: #2c7be5;
}

.panel-default {
    color: #6b6c7e;
}

.rpc-concursal-web div.bottom-purple {
    border-bottom: 2px solid #744ced;
    margin: 1rem 0;
}

.card-custom-height {
    height: 21rem !important;
}

.card-custom-calendar-height {
    height: 19.3rem !important;
}

.table-responsive-operation {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-top: -30px !important;
}

.card-header a.no-link-style {
    position: relative;
    z-index: 1;
}

html {
    scroll-behavior: smooth;
}

.back-to-top {
    position: fixed;
    bottom: 40px;
    right: 40px;
    width: 40px;
    height: 40px;
    background: linear-gradient(to right, #335dff 50%, #123ce4 50%) no-repeat scroll right bottom / 210% 100% #edcb9a !important;
    color: white;
    border: none;
    border-radius: 50%;
    display: none;
    opacity: 0;
    transition: all 0.3s;
    z-index: 999;
    overflow: hidden; /* necesario para el efecto */
    position: fixed;
}

.back-to-top::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%; /* empieza fuera de la izquierda */
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.10); /* color más oscuro */
    transition: left 0.3s ease;   /* animación suave */
    border-radius: 50%;
}

.back-to-top:hover::before {
    left: 0; /* se desplaza cubriendo el botón */
}

.back-to-top.show {
    display: block;
    opacity: 1;
}

.dataTables_wrapper,
.dataTables_wrapper .dataTable {
    font-family: 'Poppins' !important;
}

.iti {
  width: 100%;
}

.iti input {
  width: 100%;
  box-sizing: border-box;
}

.main-image{
  background-image: url('../img/background.png');
  background-size: cover;       /* Ajusta la imagen para cubrir todo el contenedor */
  background-position: center;  /* Centra la imagen */
  background-repeat: no-repeat; /* Evita que se repita */
}

canvas {
  display: block;
  max-width: 100%;
  max-height: 100%;
}

/* Boton impuesto - mayor especificidad */
.btn.btn-outline-secondary-tax {
    --falcon-btn-color: #2c7be5;
    --falcon-btn-border-color: #2c7be5;
    --falcon-btn-hover-color: #fff;
    --falcon-btn-hover-bg: #2c7be5;
    --falcon-btn-hover-border-color: #2c7be5;
    --falcon-btn-focus-shadow-rgb: 44, 123, 229;
    --falcon-btn-active-color: #fff;
    --falcon-btn-active-bg: #2c7be5;
    --falcon-btn-active-border-color: #2c7be5;
    --falcon-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --falcon-btn-disabled-color: #2c7be5;
    --falcon-btn-disabled-bg: transparent;
    --falcon-btn-disabled-border-color: #2c7be5;
    --falcon-gradient: none;
    color: #2c7be5;
    border-color: #2c7be5;
    background-color: transparent;
}
.btn.btn-outline-secondary-tax:hover,
.btn.btn-outline-secondary-tax:focus,
.btn.btn-outline-secondary-tax:active {
    color: #fff;
    background-color: #2c7be5;
    border-color: #2c7be5;
}

/* ===== PDF "Informe de Propuestas": color de acento =====
   Este valor lo lee ProposalController al generar el PDF (dompdf no soporta
   variables CSS, así que el controlador extrae el color de este archivo).
   Para cambiar el azul del PDF, modificar solo el valor de esta variable. */
:root {
    --pdf-proposals-accent: #1e40af;
}

/* Menu "Ecosistema Inmolender" (icono 9 puntos): anclado a su icono, sin desbordar la ventana */
.nav-item-ecosystem {
    position: relative;
}

.navbar .nav-item-ecosystem .dropdown-menu {
    left: auto !important;
    right: -0.5rem !important;
}

.navbar .nav-item-ecosystem .dropdown-menu.dropdown-caret:after {
    left: auto !important;
    right: 0.75rem !important;
}

/* Columna Fuente del listado de documentos (Manual / Cliente / Clave PIN) */
.bg-pill-source-manual {
  background-color: #7c3aed;
  color: #ffffff;
}
.bg-pill-source-client {
  background-color: #00d27a;
  color: #ffffff;
}
.bg-pill-source-clave-pin {
  background-color: #36a1ed;
  color: #ffffff;
}

/* Columna Estado del listado de citas. Cada una toma el color EXACTO de una
   cápsula que ya existe en otro apartado, por su variable y no por su hex, para
   que no se separen si un día se retoca la paleta:
     confirmada  verde   #00D27A  el de «Préstamo» (tipo de operación)
     realizada   azul    #36A1ED  el de «Vivienda habitual» (tipo de operación)
     no acudió   naranja #FF9F40  el de «Autopromotor» (tipo de operación)
     cancelada   rojo    #E63757  el de «ANULADO» (firmas)
   Letra blanca a pelo, igual que las `.bg-pill-type-*` de las que salen: el
   bloque `[data-bs-theme=light]` que pondría letra negra NUNCA se aplica,
   porque `config.js` solo escribe ese atributo en oscuro y en automático.
   Los nombres van aparte porque una cita no es ni una operación ni una firma. */
.bg-pill-appointment-confirmed {
  background-color: var(--falcon-success);
  color: #fff;
}
.bg-pill-appointment-done {
  background-color: var(--operation-status-appraisal);
  color: #fff;
}
.bg-pill-appointment-no-show {
  background-color: var(--operation-status-study);
  color: #fff;
}
.bg-pill-appointment-canceled {
  background-color: var(--falcon-danger);
  color: #fff;
}

/* Iconos del navbar (lupa, campana, tema, apps, avatar) más juntos: -25% y
   luego otro -15% (8px -> 6px -> ~5px). Las utilidades de espaciado de
   Bootstrap llevan !important, de ahí estos. */
.navbar-nav-icons > .nav-item.ps-2 {
    padding-left: 0.32rem !important; /* 8px -> ~5px */
}
.navbar-nav-icons .nav-link.pe-1 {
    padding-right: 0.16rem !important; /* 4px -> ~2.5px */
}
.navbar-nav-icons > .nav-item > .nav-link.ps-2,
.navbar-nav-icons > .nav-item > div > .nav-link.ps-2 {
    padding-left: 0.32rem !important; /* 8px -> ~5px */
}

/* Botones estilo kanban en las secciones Rendimientos/Préstamos del interviniente
   (misma familia que .kbm-btn: radio 6px, 7x14, 0.8rem/500, transición suave). */
.itv-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 14px;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.2s ease;
    white-space: nowrap;
    line-height: 1.2;
}
.itv-btn:focus { outline: none; }
.itv-btn-primary { background: #2c7be5; color: #fff; }
.itv-btn-primary:hover { background: #1e63c4; color: #fff; }
.itv-btn-ghost { background: transparent; color: var(--falcon-gray-600, #748194); border-color: var(--falcon-border-color, #e3e6ed); }
.itv-btn-ghost:hover { background: var(--falcon-gray-200, #edf2f9); color: var(--falcon-gray-1100, #344050); }
.itv-btn-outline { background: transparent; color: #2c7be5; border-color: var(--falcon-border-color, #e3e6ed); }
.itv-btn-outline:hover { background: #2c7be5; color: #fff; border-color: #2c7be5; }
.itv-btn-success { background: #00d27a; color: #fff; }
.itv-btn-success:hover { background: #00b368; color: #fff; }

/* Barra de Guardar/Cancelar de los paneles de la ficha de operación. El
   .modal-footer que los envuelve no trae relleno aquí, así que quedaban pegados
   al borde de la tarjeta; y se piden un punto más grandes que los del panel de
   comentarios (misma familia, +7 %). */
.op-edit-actions {
    padding-right: 12px;
}

.op-edit-actions .itv-btn {
    padding: 7.5px 15px;
    font-size: 0.856rem;
}

/* Banda "Rendimiento neto mensual" bajo la lista de rendimientos */
.itv-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    background: var(--falcon-gray-100, #f9fafd);
    border: 1px solid var(--falcon-border-color, #e3e6ed);
    border-radius: 6px;
    padding: 9px 14px;
}
.itv-total-label { display: flex; align-items: center; gap: 7px; font-size: 12.5px; color: var(--falcon-gray-600, #748194); }
.itv-total-hint { font-size: 11.5px; color: var(--falcon-gray-500, #9da9bb); }
.itv-total-value { font-size: 15px; font-weight: 500; color: #2c7be5; }

/* Modal "Registrar Pago": columna del histórico con métricas (opción B) y
   pagos como nubes tipo bocadillo. */
.pmt-side { background: var(--falcon-gray-100, #f9fafd); border-radius: 8px; padding: 14px 16px; height: 100%; }
.pmt-sec-title { font-size: 11px; font-weight: 500; letter-spacing: .05em; text-transform: uppercase; color: var(--falcon-gray-600, #748194); margin-bottom: 10px; }
.pmt-metrics { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin-bottom: 6px; }
.pmt-metric { border-radius: 8px; padding: 8px 10px; text-align: center; }
.pmt-metric-label { font-size: 10px; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; }
.pmt-metric-value { font-size: 14px; font-weight: 500; white-space: nowrap; }
.pmt-metric-paid { background: #e7faf3; }
.pmt-metric-paid .pmt-metric-label, .pmt-metric-paid .pmt-metric-value { color: #0a7a4b; }
.pmt-metric-pending { background: #fdf3e0; }
.pmt-metric-pending .pmt-metric-label, .pmt-metric-pending .pmt-metric-value { color: #a3720c; }
.pmt-metric-total { background: #eef1f6; }
.pmt-metric-total .pmt-metric-label { color: #5e6e82; }
.pmt-metric-total .pmt-metric-value { color: #344050; }
.pmt-progress { height: 6px; background: #edf2f9; border-radius: 3px; overflow: hidden; margin-bottom: 12px; }
.pmt-progress-fill { height: 100%; background: #00d27a; transition: width .3s ease; }
.pmt-clouds { max-height: 300px; overflow-y: auto; }
.pmt-cloud { background: #fff; border: 1px solid #e3e6ed; border-radius: 14px 14px 14px 4px; padding: 10px 14px; margin-bottom: 10px; }
.pmt-cloud-top { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.pmt-cloud-amount { font-size: 15px; font-weight: 500; color: #344050; }
.pmt-cloud-date { font-size: 11.5px; color: #9da9bb; white-space: nowrap; }
.pmt-cloud-meta { display: flex; align-items: center; gap: 6px; margin-top: 4px; flex-wrap: wrap; }
.pmt-cloud-method { font-size: 10.5px; font-weight: 500; background: #e6f0fc; color: #1e63c4; border-radius: 10px; padding: 2px 8px; white-space: nowrap; }
.pmt-cloud-desc { font-size: 12px; color: #748194; }
.pmt-empty { text-align: center; font-size: 12px; color: #9da9bb; padding: 18px 0; }
.pmt-count { text-align: center; font-size: 11.5px; color: #9da9bb; padding-top: 2px; }

/* Quién registró el pago, a la derecha del meta de la nube */
.pmt-cloud-user { font-size: 11px; color: #9da9bb; margin-left: auto; white-space: nowrap; }
.pmt-cloud-user .fas { font-size: 10px; }

/* Editar / eliminar el pago desde su propia nube */
.pmt-cloud-actions { display: inline-flex; gap: 8px; margin-left: 8px; }
.pmt-cloud-action { background: none; border: 0; padding: 0; line-height: 1; font-size: 11.5px; color: #9da9bb; cursor: pointer; }
.pmt-cloud-action:hover { color: #2c7be5; }
.pmt-cloud-action-danger:hover { color: #e63757; }
.pmt-cloud-editing { border-color: #2c7be5; box-shadow: 0 0 0 1px #2c7be5; }