/* -------------------------------------------------------------------------- */
/*                                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 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);
}

.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;
}

#task-legend {
    display: block;
    position: relative;
    margin-right: 5px;
    width: 80px;
    height: 20px;
}

#task-legend::before {
    position: absolute;
    background: #B3E3EF;
    top: 5px;
    border-radius: 5px;
    left: -20px;
    width: 15px;
    height: 15px;
    content: "";
}

#reminder-legend {
    display: block;
    margin-right: -79px;
    position: relative;
    width: 20%;
    height: 20px;
}

#reminder-legend::before {
    position: absolute;
    background: #d9f8eb;
    top: 5px;
    border-radius: 5px;
    left: -20px;
    width: 15px;
    height: 15px;
    content: "";
}

/* 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;
}

/* 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; }
