*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    body {
      font-family: 'Roboto', sans-serif;
      font-size: 14px;
      background: #f0f0f0;
      color: #333;
      display: flex;
      flex-direction: column;
      height: 100vh;
      overflow: hidden;
    }

    /* ════ HEADER ════ */
    header {
      background: #0057bb;
      color: #fff;
      display: flex;
      align-items: stretch;
      height: 58px;
      flex-shrink: 0;
      position: relative;
      z-index: 20;
      box-shadow: 0 2px 5px rgba(0,20,60,.3);
    }

    /* ── zona izquierda: logo + hamburguesa ──
       Esta zona tiene el mismo ancho que el sidebar y reacciona igual */
    .header-left {
      display: flex;
      align-items: center;
      padding: 0 10px 0 14px;
      gap: 8px;
      width: 220px;           /* mismo ancho que sidebar expandido */
      flex-shrink: 0;
      overflow: hidden;
      transition: width .22s ease;
      /* borde derecho sutil: tono azul más oscuro, NO blanco */
      background: #0057bb;
    }
    .header-left.collapsed {
      width: 56px;
    }

    .logo-caribe {
      width: 62%;
      margin-left: 8%;
      object-fit: contain;
      object-position: center;
      align-self: center;
      flex-shrink: 0;
      min-width: 0;
      transition: opacity .18s, width .22s ease, margin .22s ease;
    }
    /* logo se encoge al colapsar */
    .header-left.collapsed .logo-caribe {
      width: 28px;
      margin-left: 2%;
      opacity: 1;
    }

    .hamburger {
      background: none;
      border: none;
      color: #fff;
      cursor: pointer;
      padding: 6px;
      display: flex;
      align-items: center;
      border-radius: 3px;
      flex-shrink: 0;
      transition: background .15s;
    }
    .hamburger:hover { background: rgba(255,255,255,.15); }
    .hamburger .ion {
      font-size: 22px;
      color: #fff;
      line-height: 1;
    }


    /* ── zona derecha del header ── */
    .header-right-zone {
      display: flex;
      align-items: center;
      flex: 1;
      padding: 0 14px 0 16px;
      gap: 18px;
      background: linear-gradient(to right, #0052b1 0px, #0057bb 12px);
    }

    .portal-icon {
      align-self: center;
      object-fit: contain;
      flex-shrink: 0;
    }

    .header-actions {
      margin-left: auto;
      display: flex;
      align-items: center;
      gap: 0;
    }
    .btn-header {
      background: none;
      border: none;
      color: #fff;
      cursor: pointer;
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: 13px;
      font-family: 'Roboto', sans-serif;
      padding: 6px 10px;
      border-radius: 3px;
      transition: background .15s;
      white-space: nowrap;
    }
    .btn-header:hover { background: rgba(255,255,255,.15); }
    .btn-header img { object-fit: contain; }
    .btn-header:first-child { padding-right: 15px; }
    .btn-registrarse { padding-right: 90px; }

    /* ════ LAYOUT ════ */
    .layout {
      display: flex;
      flex: 1;
      overflow: hidden;
    }

    /* ════ SIDEBAR ════ */
    aside {
      width: 220px;
      background: #fff;
      border-right: none;
      flex-shrink: 0;
      overflow: hidden;
      min-height: 0;
      transition: width .22s ease;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      box-shadow: 2px 0 8px rgba(0,0,0,.13);
    }
    aside.collapsed { width: 56px; }
    aside.collapsed .sidebar-footer { font-size: 0; padding: 6px 0; color: transparent; }

    nav { padding-top: 0; margin-top: 0; }
    nav ul { list-style: none; border-top: 1px solid #eeeeee; margin-top: 0; padding-left: 12px; padding-top: 15px; }
    .nav-spacer {
      height: 10px;
      background: #ececec;
      flex-shrink: 0;
      margin-top: 0;
    }
    .nav-gap {
      height: 16px;
      background: #fff;
      flex-shrink: 0;
    }
    nav ul li:last-child { box-shadow: 0 6px 8px -3px rgba(0,0,0,.15); }
    nav ul li a {
      display: flex;
      align-items: center;
      gap: 0;
      height: 50px;
      padding: 0;
      text-decoration: none;
      color: #555;
      border-left: 3px solid transparent;
      white-space: nowrap;
      overflow: hidden;
      transition: background .15s, color .15s;
    }
    nav ul li a:hover { background: rgba(0,0,0,.04); color: #555; }
    nav ul li a .material-icons {
      display: inline-block;
      font-size: 16px;
      padding: 5px 0;
      width: 40px;
      text-align: center;
      color: #464646;
      flex-shrink: 0;
      transition: 0.2s ease-in;
    }
    nav ul li a:hover .material-icons { color: #464646; }
    nav ul li.active a { background: #eeeeee; color: #607d8b; border-left: 3px solid transparent; }
    nav ul li a { border-left: 3px solid transparent; }
    nav ul li.active a .material-icons {
      color: #fff;
      background: #607d8b;
      border-radius: 0;
      width: 36px;
      height: 36px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 0;
    }

    .nav-label {
      transition: opacity .15s;
      margin-left: 15px;
      font-weight: bold;
      text-transform: uppercase;
      font-size: 10px;
      line-height: 1;
    }
    aside.collapsed .nav-label { opacity: 0; }

    /* ════ SIDEBAR FOOTER ════ */
    .sidebar-footer {
      background: #eceff1;
      border-top: 1px solid #cfd8dc;
      padding: 12px 16px;
      font-size: 11px;
      color: #546e7a;
      text-align: center;
      flex-shrink: 0;
      letter-spacing: .3px;
      text-transform: uppercase;
      margin-top: auto;
    }

    /* ════ MAIN ════ */
    main {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      padding: 10px 16px 24px;
      position: relative;
    }

    /* ════ BANNER ERROR ════ */
    .api-error-banner {
      display: none;
      background: #fff3f3;
      border: 1px solid #ffcdd2;
      color: #c62828;
      font-size: 13px;
      padding: 12px 40px 12px 16px;
      border-radius: 2px;
      position: relative;
      margin-bottom: 16px;
      animation: fadeIn .2s ease;
    }
    .api-error-banner.visible { display: block; }
    .api-error-banner .close-btn {
      position: absolute;
      right: 12px;
      top: 50%;
      transform: translateY(-50%);
      background: none;
      border: none;
      cursor: pointer;
      color: #c62828;
      font-size: 18px;
      line-height: 1;
      padding: 0;
      display: flex;
      align-items: center;
    }
    @keyframes fadeIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }

    /* ════ CARD ════ */
    .card { background: #fff; border-radius: 2px; box-shadow: 0 1px 3px rgba(0,0,0,.12); }
    .card-consultar { min-height: calc(100vh - 100px); margin-bottom: 16px; }
    .card-header { padding: 13px 20px; border-bottom: 2px solid #e8c100; }
    .card-header h2 { font-size: 13.5px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: #333; }
    .card-body { padding: 20px 20px 24px; }

    .invite-text { font-size: 13.5px; color: #464646; margin-bottom: 22px; }
    .invite-text a { color: #0057bb; text-decoration: none; font-weight: 500; }
    .invite-text a:hover { text-decoration: underline; }

    .field { margin-bottom: 18px; max-width: 360px; }
    .field label { display: block; font-size: 12px; font-weight: 500; color: #555; margin-bottom: 5px; }
    .field label .req { color: #e53935; }
    .field input[type="text"] {
      width: 100%; border: none; border-bottom: 1.5px solid #9e9e9e;
      padding: 6px 0; font-size: 14px; font-family: 'Roboto', sans-serif;
      color: #333; background: transparent; outline: none; transition: border-color .2s;
    }
    .field input[type="text"]:focus { border-bottom-color: #0057bb; }
    .field.nic-valid label { color: #2598f3; }
    .field.nic-valid input { border-bottom-color: #2598f3; }
    .field.nic-error label { color: #d50000; }
    .field.nic-error input {
      border-bottom-color: #d50000;
      background: rgba(213,0,0,0.06);
    }

    .actions { display: flex; justify-content: flex-end; gap: 10px; margin: 20px 0 28px; }
    .btn-consultar, .btn-limpiar {
      width: 92px;
      height: 36px;
      font-size: 13px;
      font-family: 'Roboto', sans-serif;
      font-weight: 700;
      letter-spacing: .6px;
      text-transform: uppercase;
      cursor: pointer;
      border-radius: 4px;
      box-shadow: 0 2px 4px rgba(0,0,0,.22), 0 1px 3px rgba(0,0,0,.12);
      transition: all .15s;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }
    .btn-consultar {
      background: #ce8f03;
      color: #fff;
      border: none;
      transition: all .15s;
    }
    .btn-consultar:hover:not(:disabled) { background: #b57a02; }
    .btn-consultar:disabled {
      background: #e0e0e0;
      color: #aaa;
      box-shadow: none;
      cursor: default;
    }
    .btn-limpiar {
      background: #fff;
      color: #444;
      border: 1px solid #f5f5f5;
    }
    .btn-limpiar:hover { background: #fafafa; border-color: #e8e8e8; }

    .table-wrap { overflow-x: auto; }
    table { width: 100%; border-collapse: collapse; }
    thead tr { border-bottom: 1.5px solid #e0e0e0; }
    thead th { padding: 11px 13px; font-size: 12.5px; font-weight: 500; color: #666; text-align: center; white-space: nowrap; }
    tbody tr { border-bottom: 1px solid #eee; }
    tbody tr:hover { background: #fafafa; }
    tbody td { padding: 11px 13px; font-size: 13px; color: #555; font-weight: 400; text-align: center; }
    .empty-msg { padding: 14px 13px; font-size: 13px; font-weight: 700; color: #333; }

    .pagination {
      display: flex; align-items: center; justify-content: flex-end;
      gap: 18px; padding: 12px 0 2px; border-top: 1px solid #e0e0e0; margin-top: 4px; flex-wrap: wrap;
    }
    .pagination-group { display: flex; align-items: center; gap: 7px; font-size: 11px; color: #bbb; }
    .pagination-group select { border: 1px solid #ddd; border-radius: 2px; padding: 2px 4px; font-size: 11px; color: #bbb; background: #fff; cursor: pointer; }
    .pagination-nav { display: flex; align-items: center; gap: 4px; font-size: 11px; color: #bbb; }
    .pagination-nav button {
      background: none; border: 1px solid #ccc; border-radius: 2px;
      width: 26px; height: 26px; cursor: pointer; display: flex;
      align-items: center; justify-content: center; color: #555; transition: background .15s;
    }
    .pagination-nav button:hover:not(:disabled) { background: #e3eef8; color: #0057bb; }
    .pagination-nav button:disabled { opacity: .35; cursor: default; }
    .pagination-nav .material-icons { font-size: 16px; }

    .pagar-mes-row { display: flex; justify-content: flex-end; padding: 10px 0 4px; flex-wrap: wrap; }
    .btn-pagar-mes {
      background: #e0e0e0; color: #888; border: none;
      width: 92px; height: 36px;
      font-size: 13px; font-weight: 700;
      font-family: 'Roboto', sans-serif;
      letter-spacing: .6px; text-transform: uppercase;
      cursor: default; border-radius: 4px;
      box-shadow: 0 2px 4px rgba(0,0,0,.22), 0 1px 3px rgba(0,0,0,.12);
      display: inline-flex; align-items: center; justify-content: center;
      transition: all .15s;
    }

    /* ════ LEYENDA ════ */
    .legend-card { background: #fff; border-radius: 2px; box-shadow: 0 1px 3px rgba(0,0,0,.12); padding: 28px 32px 32px; display: block; }
    .legend-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; }
    .legend-section h3 { font-size: 20px; font-weight: 400; color: #555; margin-bottom: 20px; }
    .legend-section-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 0; }
    .legend-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
    .legend-list li { display: flex; align-items: center; gap: 10px; font-size: 13.5px; }
    .legend-list li .material-icons,
    .legend-list li .material-icons.md-36 { font-size: 30px !important; }
    .icon-gray   { color: #8296AD !important; }
    .icon-red    { color: #e53935 !important; }
    .icon-blue   { color: #1e88e5 !important; }
    .icon-orange { color: #f5a623 !important; }
    .icon-green  { color: #43a047 !important; }
    .icon-teal   { color: #00897b !important; }

    /* ════ FOOTER ════ */
    .main-footer {
      text-align: center;
      padding: 12px 0 4px;
      font-size: 12px;
      color: #aaa;
    }

    /* ════ RESPONSIVE ════ */

    /* < 1000px: ocultar Iniciar / Registrarse */
    @media (max-width: 999px) {
      .header-actions { display: none; }
    }

    /* < 767px: sidebar como drawer flotante */
    .sidebar-overlay {
      display: none; position: fixed; inset: 0;
      background: rgba(0,0,0,.35); z-index: 9;
    }
    .sidebar-overlay.active { display: block; }

    @media (max-width: 767px) {
      aside {
        position: fixed;
        top: 58px; left: 0; bottom: 0;
        width: 220px !important;
        transform: translateX(-100%);
        transition: transform .22s ease;
        z-index: 15;
        overflow-y: auto;
      }
      aside.mobile-open { transform: translateX(0); }
      /* en móvil no aplica collapsed */
      aside.collapsed { width: 220px !important; transform: translateX(-100%); }
      aside.collapsed.mobile-open { transform: translateX(0); }
      .nav-label { opacity: 1 !important; }

      /* header-left en móvil: desaparece con degradé, hamburguesa queda en right-zone */
      .header-left {
        width: 0 !important;
        padding: 0 !important;
        border-right: none !important;
        background: #0057bb !important;
        overflow: hidden;
      }

      main { padding: 8px 10px; }
      .legend-grid { grid-template-columns: 1fr; gap: 24px 0; }
      .legend-section-cols { grid-template-columns: 1fr; }
      .legend-card { padding: 20px 16px 24px; }
    }
    /* ════ LOADER ════ */
    .loader-overlay {
      display: none;
      position: absolute;
      inset: 0;
      background: rgba(0,0,0,.45);
      align-items: center;
      justify-content: center;
      z-index: 99;
    }
    .loader-overlay.active {
      display: flex;
    }
    .loader {
      width: 70px;
      height: 70px;
      border-radius: 50%;
      border: 5px solid transparent;
      border-top-color: #002d64;
      border-right-color: #002d64;
      animation: spin .7s linear infinite;
    }
    @keyframes spin { to { transform: rotate(360deg); } }

    /* ════ TABLA RESULTADOS ════ */
    tbody tr.fila-resultado { cursor: pointer; }
    tbody tr.fila-resultado:hover { background: #f5f5f5; }
    tbody tr.fila-resultado.selected { background: #e8f0fe; }

    .check-col { width: 36px; text-align: center; }
    .check-col input[type="checkbox"] {
      width: 16px; height: 16px; cursor: pointer;
      accent-color: #0057bb;
    }

    .estado-icon { display: flex; align-items: center; justify-content: center; }
    .estado-icon .material-icons { font-size: 28px; }

    /* PDF img */
    .btn-pdf-img {
      height: 24px;
      object-fit: contain;
      cursor: pointer;
      display: block;
      margin: 0 auto;
    }
    .btn-pdf-img:hover { opacity: .8; }
    .accion-col { text-align: center; display: flex; align-items: center; justify-content: center; gap: 6px; }

    /* Pagar mes activo */
    .btn-pagar-mes.active {
      background: #ce8f03;
      color: #fff;
      border: none;
      cursor: pointer;
    }
    .btn-pagar-mes.active:hover { background: #b57a02; }

    /* Valor mes */
    .valor-mes { text-align: right; font-weight: 500; }

    .estado-img {
      width: 24px;
      height: 24px;
      object-fit: contain;
      display: block;
      margin: 0 auto;
    }

    .legend-img {
      width: 24px;
      height: 24px;
      object-fit: contain;
      flex-shrink: 0;
    }

    /* ════ PANTALLA PAGAR ════ */
    .pantalla-pagar { display: none; max-width: 720px; margin: 20px auto 0; }
    .pantalla-pagar.active { display: block; }
    .pantalla-consultar { display: block; }
    .pantalla-consultar.hidden { display: none; }

    /* Transición suave */
    .pantalla-pagar { animation: fadeInPagar .3s ease; }
    @keyframes fadeInPagar { from { opacity: 0; } to { opacity: 1; } }

    /* Card único PAGAR */
    .card-pagar-single {
      background: #fff;
      border-radius: 2px;
      box-shadow: 0 1px 3px rgba(0,0,0,.12);
    }
    .card-header-pagar {
      padding: 13px 20px;
      border-bottom: 2.5px solid #e8c100;
    }
    .card-header-pagar h2 {
      font-size: 13.5px;
      font-weight: 700;
      letter-spacing: .8px;
      text-transform: uppercase;
      color: #333;
    }
    .card-body-pagar {
      padding: 24px 20px 28px;
    }
    .terminos-wrap {
      margin-top: 28px;
    }
    .terminos-titulo {
      padding: 13px 0;
      border-bottom: 2.5px solid #e8c100;
      margin-bottom: 20px;
    }
    .terminos-titulo h3 {
      font-size: 13.5px;
      font-weight: 700;
      letter-spacing: .8px;
      text-transform: uppercase;
      color: #333;
    }

    /* Nota requerido */
    .nota-requerido { text-align: right; font-size: 11px; color: #888; margin-bottom: 16px; }

    /* Grid form 3 cols */
    .form-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 24px 20px; margin-bottom: 24px; }
    .form-field label { display: block; font-size: 12px; font-weight: 500; color: #555; margin-bottom: 6px; }
    .form-field label .req { color: #e53935; }
    .form-field input[type="text"],
    .form-field input[type="email"],
    .form-field input[type="tel"],
    .form-field select {
      width: 100%;
      border: none;
      border-bottom: 1.5px solid #9e9e9e;
      padding: 6px 0;
      font-size: 14px;
      font-family: 'Roboto', sans-serif;
      color: #333;
      background: transparent;
      outline: none;
      transition: border-color .2s;
      border-radius: 0;
      -webkit-appearance: none;
      appearance: none;
    }
    .form-field select { cursor: pointer; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23666'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 4px center; padding-right: 20px; }
    .form-field input:focus, .form-field select:focus { border-bottom-color: #2598f3; }
    .form-field.field-valid label { color: #2598f3; }
    .form-field.field-valid input,
    .form-field.field-valid select { border-bottom-color: #2598f3; }
    .form-field.field-error label { color: #d50000; }
    .form-field.field-error input,
    .form-field.field-error select { border-bottom-color: #d50000; background: rgba(213,0,0,.04); }

    .email-wrap { position: relative; }

    /* Cards de pago */
    .payment-cards { display: flex; gap: 80px; justify-content: center; align-items: flex-start; margin-bottom: 28px; padding: 0 10px; }
    .pay-card-wrap { flex-shrink: 0; }
    .pay-card {
      background: #e4e2e73d;
      border-radius: 4px;
      border: 1px solid #999;
      box-shadow: 0 0 3px 1px rgba(0,0,0,.5);
      padding: 56px 8px 56px;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      width: 155px;
      box-sizing: border-box;
    }
    .pay-card.pay-card-abono {
      min-height: 300px;
    }
    .pay-card-title { font-size: 14px; font-weight: 500; color: #464646; line-height: 1.4; margin-bottom: 25px; letter-spacing: .3px; }
    .pay-card-value { font-size: 15px; color: #555; font-weight: 400; margin-bottom: 50px; }
    .btn-pagar-mes-pay {
      background: #003d8f; color: #e8e8e8; border: none;
      padding: 10px 0; font-size: 14px; font-weight: 500;
      letter-spacing: .5px; text-transform: uppercase;
      cursor: pointer; border-radius: 4px;
      font-family: "Roboto Condensed", "Arial Narrow", sans-serif;
      box-shadow: 2px 3px 5px rgba(0,0,0,.25);
      width: 82px; text-align: center;
      transition: background .15s;
    }
    .btn-pagar-mes-pay:hover { background: #002d6a; }
    .btn-pagar-total {
      background: #5AAB9C; color: #e8e8e8; border: none;
      padding: 10px 0; font-size: 14px; font-weight: 500;
      letter-spacing: .5px; text-transform: uppercase;
      cursor: pointer; border-radius: 4px;
      font-family: "Roboto Condensed", "Arial Narrow", sans-serif;
      box-shadow: 2px 3px 5px rgba(0,0,0,.25);
      width: 96px; text-align: center;
      transition: background .15s;
    }
    .btn-pagar-total:hover { background: #47897c; }
    .abono-input {
      width: 85%; border: none;
      border-bottom: 1.5px solid #bbb;
      padding: 6px 0; font-size: 15px;
      text-align: center; color: #aaa;
      background: transparent; outline: none;
      font-family: 'Roboto', sans-serif;
      font-weight: 400;
      margin-bottom: 50px;
    }
    .abono-input:focus { border-bottom-color: #2598f3; color: #333; }
    .btn-abonar {
      background: #0057bb; color: #e8e8e8; border: none;
      padding: 10px 0; font-size: 13px; font-weight: 500;
      letter-spacing: .5px; text-transform: uppercase;
      cursor: pointer; border-radius: 4px;
      font-family: "Roboto Condensed", "Arial Narrow", sans-serif;
      box-shadow: 2px 3px 5px rgba(0,0,0,.25);
      width: 80px; text-align: center;
      transition: background .15s;
    }
    .btn-abonar:hover { background: #004499; }
    .aviso-abono { font-size: 10px; color: #333; font-style: italic; text-align: center; line-height: 1.4; margin-top: 10px; }

    /* Términos */
    .terminos-check { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 20px; }
    .terminos-check input[type="checkbox"] { width: 18px; height: 18px; margin-top: 2px; flex-shrink: 0; accent-color: #0057bb; }
    .terminos-check label { font-size: 13px; color: #333; line-height: 1.5; }
    .terminos-check a { color: #0057bb; text-decoration: none; }
    .terminos-check a:hover { text-decoration: underline; }
    .btn-cancelar {
      background: #fff; color: #555; border: 1px solid #f5f5f5;
      padding: 10px 24px; font-size: 13px; font-weight: 700;
      letter-spacing: .5px; text-transform: uppercase;
      cursor: pointer; border-radius: 4px;
      box-shadow: 0 2px 4px rgba(0,0,0,.12);
      float: right;
      transition: background .15s;
    }
    .btn-cancelar:hover { background: #f5f5f5; }

    /* Banner error formulario pagar */
    .pagar-error-banner {
      display: none;
      background: #fff3f3;
      border: 1px solid #ffcdd2;
      color: #c62828;
      font-size: 13px;
      padding: 12px 40px 12px 16px;
      border-radius: 2px;
      position: relative;
      margin-bottom: 16px;
      animation: fadeIn .2s ease;
    }
    .pagar-error-banner.visible { display: block; }
    .pagar-error-banner .close-btn {
      position: absolute; right: 12px; top: 50%;
      transform: translateY(-50%);
      background: none; border: none; cursor: pointer;
      color: #c62828; font-size: 18px; line-height: 1;
      padding: 0; display: flex; align-items: center;
    }
    /* Abono input error */
    .abono-input.error { border-bottom-color: #d50000; }

    /* ════ ÍCONOS LEYENDA BASE64 ════ */
    .legend-icon-1 {
      width: 24px;
      height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGdSURBVEhL7ZW9UsJAEIB3D/UppPAtpAGx8wFIZyFoaWEeBGcslahj4wx5BwGbUPoO8BYOt+5uLoTfC2HGjm/m5nYvN7t3+3OBA0Wgm9dptEMweO40P5bGMHrtOm1Hmnd9JxXj2Wvc/G8cuXk7jXaNQ/XgtGUsPXJoEqdtZHsO5NqDl8Bp66SOWyydAmEV7CyA77dJ+jGn2EH9pgpolpNtQAxPwUICZMf6HSEEgi6MojjdlFI+B4hdNhzDIAqhwnrFPKiTYcQ3YseNjjjfgU2VIWFpdvJyvLhN1KDMGYsyU3yD1GhfB5o+0Oxjvo440ZCQzcOCLF/mtyh2IFUyiAIdiAkM33/m62CnfGJOLDvKEKcLlMuBtb9Qvz5TWZIvSR72uAgw1DWBqOokpVyIDBxD5eRe16UkxfBqUslcwVdeSeVCJEPqPjNqqMsWatoDghyC6Fllx359IKWKFHMnx3oAcah9gE8w6n26XUq5HGQQhRp/6WStLg6VtcGqcT+eF3INz15/iOxCffswprXt3fL8cDiu6ZtTzF4/nAMKwB+/y6frNpl0agAAAABJRU5ErkJggg==");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      vertical-align: middle;
      flex-shrink: 0;
    }
    .legend-icon-2 {
      width: 24px;
      height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGJSURBVEhL7ZO/SgNBEMa/vQsWNr5AElDBTiSmMRBMTgK2NqawCOSP9tHaVzCN2KhRLPUhYmwMqPgKgYCCpY2Cya4zexs1eHfepdHCHxwz396f2Z1vDv/8OsLEUXLVdZNFQ8kOrk56Rmm+F1ihj0tVhBDKrERA9NE62jDCh+VyAk7t1qjwOJvnyFUyRn3g3SJ+WA4aRoXDsutoHRaN+gEuEBWfd2Im+sOGt48v3JxaYIm6zl3eyK99tJvXRodkuBunvIp8rQenuqd1ED4nsEz0RopnNyr3BAwPAZ/q68VrkRjuhlvCuVPZ1jqI8TwQcSiVoVnraJktzSE2kUJf3sDGGvmxpNfVoKSjB8EtYnOVLKLVdD2w7BcqKGGLNBXvUesaGMgdXJ6+6vseBBdgAieETjgWPv0MJPIUZUtJHXlC8pWCZ84TxBS2prRXHtgmjjKdoh/KyiC58AArdkYuTiKRfoRtHZDhs4jP38GONWh7M0gudsmLXcqf0L3/HOdQ8A82nPEw+T9/EOAd3bR6KTdVkhcAAAAASUVORK5CYII=");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      vertical-align: middle;
      flex-shrink: 0;
    }
    .legend-icon-3 {
      width: 24px;
      height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAF6SURBVEhL7ZMxTgMxEEXHDgUdBwAuwAEQNCxBQmlBEelJoKAknAM4AAp0FFkhIVHRsAIJJRSICjgAOQbxMOO1lWy8WTuIIAqeNBmP5d1Zz/+Bf3wIkwdE9SZIsWKqYhSewv15x1SBlPfbZlXMRmNHhwdp8tSYegNXAx5RclbT66i+SnpsAgr3QwQu6YziLc3qNk+P8TdIX34ICt6pqgDiayYUxDpsLcWBfsaLFXlYxBDhx4g+Y7Kftd1FKMljU2VR2KXfj7Tw8cM3CHcR36DcaDvhYTKbWmGHI6KvLhA3vMHDReCMs+Q34HGAyhqA9wQsk9+79NRWJgTOm1MOboP+55F2C8ptQBiIxjdQcGPy9Ug8mVMO7j85D3YRN5alK1D9Kkj5rPcFvEDSqui1ddBdK9Z5In7Fpgw7xmKdw9pozfIJG9H6XoeEZBf1KGYp5tKMj6RV2lQgnYHO6IjCboB4QkLGNO8m5YR2LmldpbcukCY1Hcy35v+3AfgCdMGhmxWy+kQAAAAASUVORK5CYII=");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      vertical-align: middle;
      flex-shrink: 0;
    }
    .legend-icon-4 {
      width: 24px;
      height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAKRSURBVEhL3VZBi9NAFM4k7Yrr/gJ1FTwKnl3/gOxJD6V7UHYPIuoladLSiweR4kFkkzST08KCIO2l3RVBROhZ3L15EPwBih4EwatpmvF702kwbVpj9eQH05n3Znjvzfvem4ZpCr7vX2GG4SRxfFCv13uka3MuZzEaHTuO49Ea5+o4t5Gno7VtWVu/6lIH7TCsiiS5HUfRdrPZ/KrUS8N13XW9VNpX4v8AuhLxoMSF4GEo1HIhyF5JrTVjZWVDE6KK5dFYk4XneWeMcjkAaRWSyQk4C5MkeQCyv8tDU6Ci0dX6t4DxJwjgcqJp20LgAkLc0xir6Lr+UB3JRepgFEXHKD1fiTNA5DcwXNs0O4wxzbKsPThxma7X1JEZLLKXAef8BKUkCIK6lAtyQEhvsIhkRPsDaXmHaB9PnBQB2UsdEMlEihJnEA+H10HqUzhxSVY32qPA5IEc/BHJjUbjU61Wu2uZpux+ONuFszulcvmtPDAHhUmeBpw1QbIDws+GYXhNqTMge2kfUISYaMwABqpgtYeoz8PwR6VGlbLPiu3cTKA/jgqlKI7jNzQjJbtSoQDj1JjCNM0XY80sMq8pdfLkuZ2Gz/lNg7EOqukLIj+N+QPmi2i8LfRGXx3LgJ77wiQ7ltVFii4h6hbJgrHWMIrOzTOeAUquRzWLIWs8CMPncmMOijbaxJ4WcP4e19mRSs5vkSw3/gFkitBEFSw8ugXy7CejUS4Py8Cgn8Fg8O3q5maMl7EHou/btv1S7v4l2kHgpX1AoMRiXBhLsgomue5Pqkt9CFB55unoT19WZqrrdrvBweGhALGvaAP5f93r98WzTidT88tCRy2L1ZOrCT5XHpEC+W+tnVpLSrqe9sjy0LSfVUg7y/1cdg4AAAAASUVORK5CYII=");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      vertical-align: middle;
      flex-shrink: 0;
    }
    .legend-icon-5 {
      width: 24px;
      height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADooAAA6KAc6DB4wAAATDSURBVEhLnVZrTNtVFD/3tqUPykCeouzh5oDBNgsMHBVYKYkxcXEfFgnOxLmoH9SIZolZMpclPrJEvxjNSIyyRL+oYTHTxA8+MsrKc+M1ZLw6FOYYBCgWoaUt/P/3eu5tIe1a0PhLbu+955x77v2fZwlsAUePLV23TVMEnB0ihBQhycIZTwdCbgLhPVwl/Qpj3dWFLeOhE7GIe0FTU2FC9mNZZwnn9UBJD3Do5Rz6goHVAUWnuo0ao0VDeQnnpJgSqOacf00XAu9YrZ3+sIoNxFzQ7rJZ8OCXqHRWXVNfLt3zExiNxqcYYxb8il048NHsd1Tq9Hg8V/umjxnNRsNFPGpRGT9Vle9oD2mKA+eo/dX2MfvfYkYFFlTUjPOmQL5PVdVzuDS2jtifaxuzL7aP2s6E1UXDOVpzsM1V7bk2UnUAD9TjYSa1RMDju8H7Jk+Fd1Ho9/l82Y4h26P4QLdzqLIsrBao+BE211D2FVf4uYpcx1EkfYKmiDGfylbAv3oHGFfClA1YTCZTh63A4cbvOkN12ksdHeVGwZAXCIfi9GfFPscA6n1f0CKx5L8Fg1Nvgmvmgtx3/3EcJuYbgLGg3IexC8fnFfktlwiQEZamPy+I5OcBa6bZYBgGNaXEuu+775FmEYx1LPkH4dbUaVyxECECGduehL1Z0SZXFKWmc9I+SLl2yOcP7qcmk+EIxlLz47lNJciPUi4ws3gFf0PK9+d8DGW7f4BEfa7czy/9CgrzyfU6NBrN2aq9rfP49s5Ek/4wxbOFjMMwmubZsEwUAmv35KyhJkgyFIJWY4ac1BPwYPIxHM+AqnolPwK25eXlTMybfs4wTyghhznlnZTSirBAFMz6fDkLB4/NvAdBZR7SzJWwO7NeDr0uS/LXgQ/VmM3mAkJ5H4ZJEeXAiv0rwX7kZYREorEj7UUw6B6S6798bdA7cQJGp8+DLzghaZsgwxdQUScvl1G0FXTaB8CyoxG2p55E8yQjheFF7TB49zVY8DpDQrHQA1NkiGEpoX1Gk14UMnRMfFCqh+1pL8ChR76FPZmn0R+JmAurMD77kZzjYEo4WDiaYrp2EUbKMXHbwswNrKxOSruL4V5uwdckQFby05CeVC35KvNjEEzL9Towq1Wv1zssHCwcTTHVhvAzCpBxOSyzARE5C95rctzzfCMdjJkKwbW5sERI5j60JCUlzQkHC0dTFlC6sHLar7tqe5F5MyQTgl6bCanmUHD5guPSwd0Tx2Fx5YakmQ15UiYSWPwuOG9XZhAOT7A1pZseOeC8i2l0EbSeT5H/hvjEkGgIuVhFclKfhwRNGu4YKOoSzgRSTKWQl/2ulInAZZ1O16zhugaMzi+qClpnZEETxe5hS+Z1pvBGa95VhrHcgCOm2N1xN0pzHdzxGWjR0ffht9nZWev4Yl0dOust6g6UiQYkw7S2dmhVZfQk0ZIPsGS34Ve8joPLYxFI0GaAKWFnjHIU7cLsrRlZqMsmhH6IpnkpXneLajjBYFD0hSaMLkVcFg/Im0Obv43LTRvOv7bMop0/+rHWH0WLleKQLRPFbmPV/MXlcrVMKa+kbNUyYy4Q2KzpK5x1QwAWqZEW/++mH4mYvy2cl3JCUvDC/v/2twXgH7jMuEZLUeZsAAAAAElFTkSuQmCC");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      vertical-align: middle;
      flex-shrink: 0;
    }
    .legend-icon-6 {
      width: 24px;
      height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADqUAAA6lASpliAIAAAPMSURBVEhLtVZba5RHGH6+b9dNjJbGeEyMNy0WSqgXQRCpZ0KCRrMJXgktVoTeFPwDVfSiInrnbWk94IWggsEjZgWDoTdFBBWDqAHxEA8RbRtdd9fdb/o8s2+W7GZNEPSB3Zl53nfew8w7M1+ASbAHCH/twbK4w2YOVzmgMXCY6wKMcOLTCBgMA5xCBqngIrLFWRNR1YmM7+7CZhdiHxWa4JCiZgoRHr4HhqcBswohFtLhqiDARrYRHe6++i/+XNuPvJn5MN52oDHqxgB/jwpJ/PKsHTNMVBUKKN+NH6l/n79bmU58ZaLqyG1Ca5TEU9eNE1MZr8TtFiRcEkc5/xXbZUaXI70RC6nwhAoHFZ3RHw1mv5dBvki3Y5FRRVxZgzhT/VsZGFVCOlmhXAEFVxkU7RxjsDdkV2MvXFmPH9g04Dm2ajwGKh6oDTD0vhtrjCqD+NoY7u5K4o/xjgbvYTsrcIbZRSBvq+txh9XxW7wXR7wWwbQPsjx3sGxHWV2xQoDOab3oN7F3EHM4z+qqM+pI0Itt1geL4Sd63Rlk0RKu+JJROjTEsjhucg+Wbpu1X/DvXQw4q8IQp5brcHqcA5rA99b18PZoN5/AypDKPVS4VHmYMgW0k7+nPh3N1oGKh7isCNVyWC+ZIL1MHmtt6CF7siv7ITvLuSznTVZC3Tk80UTKh4yayV8Nl+gwM5hVpDweSE/6Ni6ByzXA+a0hJzQzlBHjy6CJuRw2OIdhjbU83NCCFxLiszl0VHPg4fBY9lURc3ldPC6yE1F7AXcjh59tqKWL0TgDBMRL7gXVEPng6cThP8To6APIbMA3XM7fbejB6HhdIRIvudETEXq7IyFDUxbNnqyADloigQs02mRUCcxISz2/JoFL0jO6HHTCrIeUST/T7jS6BE2sjeMKjX1tlPbgNTdkm1qjWNlYJL1qjmi3jXt4M+S9fJqGOtx61JjMgye5j/xiG2oT3uQjtOnAqiX1T1GCmAKRIxt7yJ7s0tHJMJ7DAHN/VajBFpN7MIKL1lUGaWawKXEW1zVWy+B6xPsK0NIBfxW7RcgeuVFvX9AB03vglmO6Jwy6u8jnJru7eBmmeQUdGn936dqXPdk1avJb2HVhiXWrIpvEd1PdwiVo4z7rezKGXBeWfoqXsXJ5yyJOnMG1dxm0cjMb59Xhzse88d8uxiCLpTWXx9LxT4LAApgITfRfKwH288AtYP2m+N70sZoe8GA8yodo4GI3szzXUT7l10pVJ2OQs7HvLjpYR+UmOp5Doy+Z7bAOGtvel2mkFvThrU2rAPA/VdmUH+pfmVAAAAAASUVORK5CYII=");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      vertical-align: middle;
      flex-shrink: 0;
    }
    .legend-icon-7 {
      width: 24px;
      height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAALDSURBVEhLrZVNSFRRFMf/754hUxP6IFtU0MKiiAwiDKKgqLAy3ISt2hQqVE6k4t6oRSFqOKNJBC0qo41ERIR9bguCahERGoJEpS1ahGnNu7f/vHfSZN6Mo/WDmXfv/557z/04517MiS4UBL854Ok3N20oNUWm0YNX5+B+ULlmx20SLRgNDbJj9BtNEhtNt7kqRfIODsX+hL/dOrufLcuovZUeuYkEtobG0USvIIFKMdLE2W5m7UrkbDux2MRMLQT1nvO+UOn1x/zbaEUqNAiZdtCKBbJcDrPU7DxX6Fmv07f+dZzGZGiQhVYYKZVqrvAE+62HxS37y15AI76pRUisK7aXS37BbTmk0ty5hHLTYwYlKVNjTJ2Bi7kl/AyjAfdCZR6cwRvP80Y88b6rMssh50M7Vmspkn9yEEvG9kihDDHSGlTKYP4OGJ481LvOuTE7YQdUzWB+DtqxzhgzwDCetLBVaMZ7bckgt4Oo/e3ASrPQPGZWFzDpDuAUXmlLJFkdmKRp4UCvGbZbVEoPvpTaQ0bKCuZJFSPuubbMxCGmpb8ccL1aCrA/bR/T8KvxzKPASRuKpUDuc+ZlbD6SiqeehZaZOOuKtTjtgFn7kj52aBVowkce3u4/Tnj3PGC5gtOo90/6d9QqE4cSX/whrc0kyOTLqNRqSAfKGIYf2OZMwsRVjaYLFelM1lrAzDNw4DByTmshTRi0k3ZneuY2bhOqRiIiZ3nxnddqBOmLi6vgXVKrSt6wX00w+9bpA46mB+XSLZ/RjQ2qzE4n1nAbRxkM21TJDVdwkB2G0wmlUnYS2ETbEU6qTpX84JKr2elTru0KtoUzp81xlTLI/Sb3Yq34kmSpiHdOn03Zfj4/47JI9rHnMYb1KuvbZsTxJOyQSX6PfgK7ePccZZLVBD0cnvL/Bp/Ifh6qDWz+CxdRkr6LtJYHwG9c3uUpmXnHlgAAAABJRU5ErkJggg==");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      vertical-align: middle;
      flex-shrink: 0;
    }
    .legend-icon-8 {
      width: 24px;
      height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADw0AAA8NAR5BTOMAAAN1SURBVEhLxZZbaFxFGMf/M3vLPSHthpQ0pRg0lJRCSx8ES6tYSiAqYkHfpIg+1KQloU1bWlJXQ6AxNcEkG98klT4WMUKDVLwjJIJWfFBE+2KCMd1tSdhumrN7zhn/Z860STa3bi/0B3PmzH/mfN9cznwzAuvRp7YihJcgVBME6qCwSesCU3yfhBA/MP8ciXd/Rizm6roVWN3RkKrn8zzTC7oM9Reb/wblTuqikJupbeXbLhZoR43BtVvREh7X9TksdxSLSVR1dALyGHt6G657HgF5CW+LP02LpfSkqlBYdJC+TtNaDZT6CInOI7mjW+qo579iFEU/Zm9fZc8v4na6DcfLkqZ2bfxvO+mwlR38EhnxGtrEjKldhDeSuPsZhlwXg06rUfMnrt6iDZv5ZcS+CRp1EUNOF9dFYcA5YpT7Z9A5rG3FnW6jmKkbyOxGIDgGJYbRLN7UWi69E4WIVF8VdqZSyZD3ZSMX/hdTu5y4E+c0HoZtP42j4Z+kFmXwfc7rTWRwXJdXomJzicxa9eHZyWjASkURCJWZmpW5dfMUbSbZrscrSgxaDfT8HPdJ38qLd5+cjKZo8wOOfK/nQ0IEX9EV1vywzh8m1vwnOqcPTp14npvtd7QVT2nxYaJt0raQz3iO6phWX9QHRvzNRy2nDlEumh9W8sG1w+ZtbYS2Xef/dXkirVkIx76A/ux+I62OC8vLJEeToFcGyHW4MT3nhopmsiVVnhOEZierpZO+wv0S01FlNbyID1xjA3WNqcFX16C9Oo25dL0bKf8iW85+CYlQaloE08l3ED37HXrnakzLXLwIP+E5+opf7URf2j9n1qK99DoS7zWpQORUpqJWucFCBOZnOLqJPQgFr2Ig+6xp6ePb3MEA/SOnzv5Ui5GCQzpfDy/8twS64Yp92bKaf52Cckh7nsmKcpTbTCufSMHrOqcPP9bF3a/53M7Q/lRe0cE7i4qKLwjbalTByAia5cumBuhOlKJkA5dF/MH4uc9fRNc+wUWrRFifqPfO3akseBFW6g2j+pRUnqPNjXCy7UYxPOJjYuG3vN7ZwWN4BAHx4QMffFIMcNuMIvH9GaNycIt5hEf5Y7qcLMa7binVTwMHjOI5+pXpH10CtrAjT/DM2U0ztJPvdSuXuxdI3u8EnqRyZ2ObCyS+pYNRJLvGc0exAPA/pH5mIRDyBogAAAAASUVORK5CYII=");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      vertical-align: middle;
      flex-shrink: 0;
    }
    .legend-icon-9 {
      width: 24px;
      height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADqUAAA6lASpliAIAAAPMSURBVEhLtVZba5RHGH6+b9dNjJbGeEyMNy0WSqgXQRCpZ0KCRrMJXgktVoTeFPwDVfSiInrnbWk94IWggsEjZgWDoTdFBBWDqAHxEA8RbRtdd9fdb/o8s2+W7GZNEPSB3Zl53nfew8w7M1+ASbAHCH/twbK4w2YOVzmgMXCY6wKMcOLTCBgMA5xCBqngIrLFWRNR1YmM7+7CZhdiHxWa4JCiZgoRHr4HhqcBswohFtLhqiDARrYRHe6++i/+XNuPvJn5MN52oDHqxgB/jwpJ/PKsHTNMVBUKKN+NH6l/n79bmU58ZaLqyG1Ca5TEU9eNE1MZr8TtFiRcEkc5/xXbZUaXI70RC6nwhAoHFZ3RHw1mv5dBvki3Y5FRRVxZgzhT/VsZGFVCOlmhXAEFVxkU7RxjsDdkV2MvXFmPH9g04Dm2ajwGKh6oDTD0vhtrjCqD+NoY7u5K4o/xjgbvYTsrcIbZRSBvq+txh9XxW7wXR7wWwbQPsjx3sGxHWV2xQoDOab3oN7F3EHM4z+qqM+pI0Itt1geL4Sd63Rlk0RKu+JJROjTEsjhucg+Wbpu1X/DvXQw4q8IQp5brcHqcA5rA99b18PZoN5/AypDKPVS4VHmYMgW0k7+nPh3N1oGKh7isCNVyWC+ZIL1MHmtt6CF7siv7ITvLuSznTVZC3Tk80UTKh4yayV8Nl+gwM5hVpDweSE/6Ni6ByzXA+a0hJzQzlBHjy6CJuRw2OIdhjbU83NCCFxLiszl0VHPg4fBY9lURc3ldPC6yE1F7AXcjh59tqKWL0TgDBMRL7gXVEPng6cThP8To6APIbMA3XM7fbejB6HhdIRIvudETEXq7IyFDUxbNnqyADloigQs02mRUCcxISz2/JoFL0jO6HHTCrIeUST/T7jS6BE2sjeMKjX1tlPbgNTdkm1qjWNlYJL1qjmi3jXt4M+S9fJqGOtx61JjMgye5j/xiG2oT3uQjtOnAqiX1T1GCmAKRIxt7yJ7s0tHJMJ7DAHN/VajBFpN7MIKL1lUGaWawKXEW1zVWy+B6xPsK0NIBfxW7RcgeuVFvX9AB03vglmO6Jwy6u8jnJru7eBmmeQUdGn936dqXPdk1avJb2HVhiXWrIpvEd1PdwiVo4z7rezKGXBeWfoqXsXJ5yyJOnMG1dxm0cjMb59Xhzse88d8uxiCLpTWXx9LxT4LAApgITfRfKwH288AtYP2m+N70sZoe8GA8yodo4GI3szzXUT7l10pVJ2OQs7HvLjpYR+UmOp5Doy+Z7bAOGtvel2mkFvThrU2rAPA/VdmUH+pfmVAAAAAASUVORK5CYII=");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      vertical-align: middle;
      flex-shrink: 0;
    }
    .legend-icon-10 {
      width: 24px;
      height: 24px;
      display: inline-block;
      background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyNC4wLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDUwIDUwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MCA1MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCgkuc3Qwe2ZpbGw6bm9uZTtzdHJva2U6I0ExQjE1MDtzdHJva2Utd2lkdGg6NDtzdHJva2UtbWl0ZXJsaW1pdDoxMDt9DQoJLnN0MXtmaWxsOiNBMUIxNTA7fQ0KCS5zdDJ7ZmlsbDojQzZDNkM2O30NCjwvc3R5bGU+DQo8Zz4NCgk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNNi41NCwxMS40MXYxMC40N2MwLDEuNTctMS4yOCwyLjg1LTIuODUsMi44NWMtMS41NywwLTIuODUtMS4yOC0yLjg1LTIuODVWMTEuNDFjMC0xLjU3LDEuMjgtMi44NSwyLjg1LTIuODUNCgkJQzUuMjYsOC41Niw2LjU0LDkuODQsNi41NCwxMS40MXogTTIuMzcsMjEuODhjMCwwLjczLDAuNTksMS4zMiwxLjMyLDEuMzJjMC43MywwLDEuMzItMC41OSwxLjMyLTEuMzJWMTEuNDENCgkJYzAtMC43My0wLjU5LTEuMzItMS4zMi0xLjMyYy0wLjczLDAtMS4zMiwwLjU5LTEuMzIsMS4zMlYyMS44OHoiLz4NCgk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNNDMuNjUsMjMuMTVjMCw1LjY5LTQuNjMsMTAuMzEtMTAuMzEsMTAuMzFjLTUuMSwwLTkuMzktMy42NS0xMC4xOS04LjY5Yy0wLjA3LTAuNDIsMC4yMi0wLjgxLDAuNjQtMC44OA0KCQljMC40Mi0wLjA3LDAuODEsMC4yMiwwLjg4LDAuNjRjMC42OCw0LjI5LDQuMzMsNy40LDguNjgsNy40YzQuODQsMCw4Ljc4LTMuOTQsOC43OC04Ljc4cy0zLjk0LTguNzgtOC43OC04Ljc4DQoJCWMtMy44MywwLTcuMDIsMi4yOS04LjMyLDUuOTdjLTAuMTQsMC40LTAuNTgsMC42MS0wLjk4LDAuNDdjLTAuNC0wLjE0LTAuNjEtMC41OC0wLjQ3LTAuOThjMS41Mi00LjMxLDUuMjYtNi45OSw5Ljc2LTYuOTkNCgkJQzM5LjAyLDEyLjg0LDQzLjY1LDE3LjQ3LDQzLjY1LDIzLjE1eiIvPg0KCTxnPg0KCQk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNMzIuNTIsMjAuOThjMCwwLjc4LTAuMiwxLjM3LTAuNTksMS43OGMtMC40LDAuNDEtMC45MywwLjYyLTEuNiwwLjYyYy0wLjY3LDAtMS4yLTAuMjEtMS42LTAuNjINCgkJCWMtMC40LTAuNDEtMC41OS0xLjAxLTAuNTktMS43OGMwLTAuNzcsMC4yLTEuMzcsMC41OS0xLjc4YzAuNC0wLjQxLDAuOTMtMC42MiwxLjYtMC42MmMwLjY3LDAsMS4yLDAuMjEsMS42LDAuNjINCgkJCUMzMi4zMywxOS42MSwzMi41MiwyMC4yMSwzMi41MiwyMC45OHogTTMxLjEyLDIwLjk4YzAtMC40Mi0wLjA3LTAuNzMtMC4yMi0wLjkyYy0wLjE1LTAuMTktMC4zNC0wLjI5LTAuNTctMC4yOQ0KCQkJYy0wLjI0LDAtMC40MywwLjEtMC41OCwwLjI5Yy0wLjE1LDAuMTktMC4yMiwwLjUtMC4yMiwwLjkyYzAsMC40MiwwLjA3LDAuNzMsMC4yMiwwLjkyYzAuMTQsMC4xOSwwLjM0LDAuMjksMC41OCwwLjI5DQoJCQljMC4yMywwLDAuNDItMC4xLDAuNTctMC4yOUMzMS4wNSwyMS43MSwzMS4xMiwyMS40LDMxLjEyLDIwLjk4eiBNMzQuOTQsMTguNzhoMS43MmwtNC44NCw4LjU4SDMwLjFMMzQuOTQsMTguNzh6IE0zOC42NCwyNS4xNQ0KCQkJYzAsMC43OC0wLjIsMS4zNy0wLjU5LDEuNzhjLTAuNCwwLjQxLTAuOTMsMC42Mi0xLjYsMC42MmMtMC42NywwLTEuMi0wLjIxLTEuNi0wLjYyYy0wLjQtMC40MS0wLjU5LTEuMDEtMC41OS0xLjc4DQoJCQljMC0wLjc3LDAuMi0xLjM3LDAuNTktMS43OGMwLjQtMC40MSwwLjkzLTAuNjIsMS42LTAuNjJjMC42NywwLDEuMiwwLjIxLDEuNiwwLjYyQzM4LjQ0LDIzLjc4LDM4LjY0LDI0LjM4LDM4LjY0LDI1LjE1eg0KCQkJIE0zNy4yNCwyNS4xNWMwLTAuNDItMC4wNy0wLjczLTAuMjItMC45MmMtMC4xNS0wLjE5LTAuMzQtMC4yOC0wLjU3LTAuMjhjLTAuMjQsMC0wLjQzLDAuMDktMC41OCwwLjI4DQoJCQljLTAuMTQsMC4xOS0wLjIyLDAuNS0wLjIyLDAuOTJjMCwwLjQyLDAuMDcsMC43MywwLjIyLDAuOTJjMC4xNCwwLjE5LDAuMzQsMC4yOSwwLjU4LDAuMjljMC4yMywwLDAuNDItMC4xLDAuNTctMC4yOQ0KCQkJQzM3LjE2LDI1Ljg4LDM3LjI0LDI1LjU3LDM3LjI0LDI1LjE1eiIvPg0KCTwvZz4NCgk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNMzMuMiwxMy42NGMwLDAuMTYtMC4wNSwwLjMzLTAuMTYsMC40N2MtMC4yNiwwLjMzLTAuNzQsMC4zOS0xLjA3LDAuMTNsLTMuOTUtMy4wOA0KCQljLTEuMS0wLjgzLTIuNDktMS4yLTMuOTEtMS4wMmwtMTMuMjcsMS42NWMtMS4zMywwLjE2LTIuNjgsMC4yNS00LjAxLDAuMjVINi41NHY5LjI0YzEuODUsMC4xMywzLjY0LDAuNzEsNS4yMiwxLjcxbDAuMywwLjE5DQoJCWMwLjc0LDAuNDcsMS42MSwwLjcyLDIuNTEsMC43MWw5LjY3LTAuMDZjMC43OSwwLDEuNDctMC41MiwxLjYyLTEuMjNjMC4xLTAuNDYsMC0wLjktMC4yOC0xLjI0Yy0wLjI3LTAuMzMtMC42OC0wLjUyLTEuMTItMC41Mg0KCQlsLTUuMiwwLjAzYy0wLjU3LDAtMS4wNS0wLjM0LTEuMjQtMC44N2MtMC4xOS0wLjU0LTAuMDItMS4xMywwLjQzLTEuNDlsNS4xNS00LjI3YzEuMDEtMC44MSwzLjE4LTAuNDcsNC40NiwwLjcNCgkJYzAuMzEsMC4yOCwwLjMzLDAuNzcsMC4wNSwxLjA4Yy0wLjI4LDAuMzEtMC43NywwLjMzLTEuMDgsMC4wNWMtMC44NS0wLjc4LTIuMi0wLjg2LTIuNDYtMC42NWwtNC43MSwzLjlsNC42LTAuMDMNCgkJYzAuOTEtMC4wMSwxLjc1LDAuMzksMi4zMSwxLjA5YzAuNTcsMC43LDAuNzgsMS42MiwwLjU5LDIuNTNjLTAuMywxLjQtMS42MSwyLjQyLTMuMTEsMi40M2wtOS42NywwLjA2DQoJCWMtMS4xOSwwLjAxLTIuMzQtMC4zMi0zLjM0LTAuOTVsLTAuMy0wLjE5Yy0xLjU1LTAuOTgtMy4zMy0xLjUtNS4xNy0xLjVjLTAuNDIsMC0wLjc3LTAuMzQtMC43Ny0wLjc3VjExLjI4DQoJCWMwLTAuNDIsMC4zNC0wLjc3LDAuNzctMC43N2gxLjA2YzEuMjcsMCwyLjU2LTAuMDgsMy44My0wLjI0bDEzLjI3LTEuNjVjMS44MS0wLjIyLDMuNiwwLjI1LDUuMDMsMS4zM2wzLjk2LDMuMDkNCgkJQzMzLjEsMTMuMTksMzMuMiwxMy40MiwzMy4yLDEzLjY0eiIvPg0KCTxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik00OS4xNiwzMS40N3Y3LjM3YzAsMS40My0xLjE3LDIuNi0yLjYsMi42SDE4LjZjLTEuNDMsMC0yLjYtMS4xNy0yLjYtMi42di03LjM3YzAtMS40MywxLjE3LTIuNiwyLjYtMi42aDQuNDkNCgkJYzAuNDIsMCwwLjc3LDAuMzQsMC43NywwLjc3YzAsMC40Mi0wLjM0LDAuNzctMC43NywwLjc3SDE4LjZjLTAuNTksMC0xLjA3LDAuNDgtMS4wNywxLjA3djcuMzdjMCwwLjU5LDAuNDgsMS4wNywxLjA3LDEuMDdoMjcuOTYNCgkJYzAuNTksMCwxLjA3LTAuNDgsMS4wNy0xLjA3di03LjM3YzAtMC41OS0wLjQ4LTEuMDctMS4wNy0xLjA3SDQzLjVjLTAuNDIsMC0wLjc3LTAuMzQtMC43Ny0wLjc3YzAtMC40MiwwLjM0LTAuNzcsMC43Ny0wLjc3aDMuMDYNCgkJQzQ3Ljk5LDI4Ljg2LDQ5LjE2LDMwLjAzLDQ5LjE2LDMxLjQ3eiIvPg0KCTxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik00NC40MywzNi43N2MwLDAuNDItMC4zNCwwLjc3LTAuNzcsMC43N0gyMy4xMmMtMC40MiwwLTAuNzctMC4zNC0wLjc3LTAuNzdTMjIuNjksMzYsMjMuMTIsMzZoMjAuNTUNCgkJQzQ0LjA5LDM2LDQ0LjQzLDM2LjM1LDQ0LjQzLDM2Ljc3eiIvPg0KPC9nPg0KPC9zdmc+DQo=");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      vertical-align: middle;
      flex-shrink: 0;
    }
    /* ════ PANTALLA PAGAR INICIAL ════ */
    .pantalla-pagar-inicial { display: none; }
    .pantalla-pagar-inicial.active { display: block; }

    .bienvenida-text {
      font-size: 14px;
      color: #333;
      margin-bottom: 28px;
      line-height: 1.6;
      padding: 0 80px 0 20px;
    }

    .pagar-cards-wrap {
      display: flex;
      gap: 60px;
      justify-content: center;
      margin-bottom: 32px;
    }

    .pagar-tipo-card {
      background: #e4e2e73d;
      border-radius: 4px;
      border: 1px solid #999;
      box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
      padding: 20px 16px 60px;
      width: 172px;
      min-height: 240px;
      cursor: pointer;
      box-sizing: border-box;
    }
    .pagar-tipo-card:hover { box-shadow: 0 0 3px 1px rgba(0,0,0,.3); }
    .pagar-tipo-card.selected { border-color: #999; }
    .pagar-tipo-card.selected .pagar-card-label { color: #2598f3; }
    .pagar-tipo-card.selected .pagar-card-input-wrap {
      display: block;
    }

    .pagar-card-title { font-size: 16px; font-weight: 500; color: #464646; margin-bottom: 0; line-height: 1.1; letter-spacing: .3px; text-align: left; }
    .pagar-card-subtitle { font-size: 16px; font-weight: 500; color: #464646; margin-bottom: 4px; line-height: 1.1; letter-spacing: .3px; text-align: left; }
    .pagar-card-label { font-size: 14px; color: #8d8d8d; margin-bottom: 28px; transition: color .15s; padding-left: 3px; text-align: left; }
    .pagar-tipo-card.selected .pagar-card-label { color: #2598f3; }
    .pagar-card-input-wrap { display: block; margin-top: 8px; }
    .pagar-card-inner { padding-left: 12px; margin-top: 16px; }
    .pagar-card-input {
      width: 75%;
      display: block;
      margin: 0 auto;
      border: none;
      border-bottom: 1.5px solid #ccc;
      background: transparent;
      text-align: center;
      padding: 6px 0;
      font-size: 14px;
      font-family: 'Roboto', sans-serif;
      color: #333;
      background: transparent;
      outline: none;
    }

    .pagar-actions {
      display: flex;
      justify-content: flex-end;
      margin-top: 74px;
      padding-right: calc(50% - 310px);
    }
    .btn-pagar-main {
      background: #002d64;
      color: #e8e8e8;
      border: none;
      padding: 12px 20px;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: .8px;
      text-transform: uppercase;
      cursor: pointer;
      border-radius: 4px;
      box-shadow: 0 2px 4px rgba(0,0,0,.2);
      transition: background .15s;
    }
    .btn-pagar-main:hover { background: #001f47; }

    /* Mensaje sin facturas — ancho total, padding 10px lateral */
    .msg-sin-facturas {
      display: none;
      background: #fff;
      border: 1px solid #ddd;
      border-radius: 6px;
      padding: 20px 10px;
      align-items: flex-start;
      gap: 16px;
      margin-top: 20px;
      width: 100%;
      box-sizing: border-box;
    }
    .msg-sin-facturas.visible { display: flex; }
    .msg-sin-facturas p { font-size: 14px; color: #333; line-height: 1.6; margin: 0; }

    /* SVG advertencia como background-image en CSS */
    .icon-advertencia {
      width: 48px;
      height: 48px;
      min-width: 48px;
      flex-shrink: 0;
      background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyNC4zLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDIwMCAyMDAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDIwMCAyMDA7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+DQoJLnN0MHtmaWxsOiNGRkZGRkY7fQ0KCS5zdDF7ZmlsbDojNDk1QTc5O30NCgkuc3Qye2ZpbGw6IzQyNTE2RDt9DQoJLnN0M3tmaWxsOiNERUJFMkQ7fQ0KCS5zdDR7ZmlsbDojQ0VBNzAyO30NCjwvc3R5bGU+DQo8Zz4NCgk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNMTkxLjUsMTQ3LjZMMTI0LDIzLjdjLTUuMS04LjUtMTQuMS0xMy42LTI0LTEzLjZzLTE4LjksNS4xLTI0LDEzLjZMOC41LDE0Ny42Yy01LjEsOC44LTUuMywxOS4zLTAuMiwyOC4yDQoJCWM1LDguOCwxNC4xLDE0LjEsMjQuMywxNC4xaDEzNC45YzEwLjIsMCwxOS4yLTUuMywyNC4zLTE0LjFDMTk2LjcsMTY3LDE5Ni42LDE1Ni41LDE5MS41LDE0Ny42eiIvPg0KCTxwYXRoIGNsYXNzPSJzdDIiIGQ9Ik0xOTEuNywxNzUuOGMtNSw4LjgtMTQuMSwxNC4xLTI0LjMsMTQuMUgxMDBWMTAuMWMxMCwwLDE4LjksNS4xLDI0LDEzLjZsNjcuNCwxMjMuOQ0KCQlDMTk2LjYsMTU2LjUsMTk2LjcsMTY3LDE5MS43LDE3NS44eiIvPg0KCTxwYXRoIGNsYXNzPSJzdDMiIGQ9Ik0xODEuOSwxNTMuM0wxMTQuNCwyOS40Yy0zLTUuMS04LjUtOC4yLTE0LjQtOC4yYy01LjksMC0xMS40LDMtMTQuNCw4LjJMMTguMSwxNTMuM0MxNSwxNTguNiwxNSwxNjUsMTgsMTcwLjINCgkJYzMsNS40LDguNSw4LjUsMTQuNSw4LjVoMTM0LjljNiwwLDExLjUtMy4xLDE0LjUtOC41QzE4NSwxNjUsMTg1LDE1OC42LDE4MS45LDE1My4zeiIvPg0KCTxwYXRoIGNsYXNzPSJzdDQiIGQ9Ik0xODIsMTcwLjJjLTMsNS40LTguNSw4LjUtMTQuNSw4LjVIMTAwVjIxLjNjNS45LDAsMTEuNCwzLDE0LjQsOC4ybDY3LjQsMTIzLjlDMTg1LDE1OC42LDE4NSwxNjUsMTgyLDE3MC4yeiINCgkJLz4NCgk8Zz4NCgkJPHBhdGggY2xhc3M9InN0MSIgZD0iTTEwMCwxNjcuNWMtNi4yLDAtMTEuMi01LTExLjItMTEuMnM1LTExLjIsMTEuMi0xMS4yYzYuMiwwLDExLjIsNSwxMS4yLDExLjJTMTA2LjIsMTY3LjUsMTAwLDE2Ny41eiIvPg0KCQk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNMTExLjIsMTIyLjhjMCw2LjItNSwxMS4yLTExLjIsMTEuMmMtNi4yLDAtMTEuMi01LTExLjItMTEuMlY2Ni45YzAtNi4yLDUtMTEuMiwxMS4yLTExLjINCgkJCWM2LjIsMCwxMS4yLDUsMTEuMiwxMS4yVjEyMi44eiIvPg0KCTwvZz4NCgk8Zz4NCgkJPHBhdGggY2xhc3M9InN0MiIgZD0iTTExMS4yLDE1Ni40YzAtNi4yLTUtMTEuMi0xMS4yLTExLjJ2MjIuNEMxMDYuMiwxNjcuNSwxMTEuMiwxNjIuNSwxMTEuMiwxNTYuNHoiLz4NCgkJPHBhdGggY2xhc3M9InN0MiIgZD0iTTExMS4yLDEyMi44VjY2LjljMC02LjItNS0xMS4yLTExLjItMTEuMlYxMzRDMTA2LjIsMTM0LDExMS4yLDEyOSwxMTEuMiwxMjIuOHoiLz4NCgk8L2c+DQo8L2c+DQo8L3N2Zz4NCg==");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
      display: inline-block;
    }

    /* Cards dinámicos centrados */
    .payment-cards-dynamic {
      display: flex;
      gap: 48px;
      justify-content: center;
      align-items: flex-start;
      margin-bottom: 28px;
      flex-wrap: wrap;
    }

    .pagar-tipo-card.selected .pagar-card-input { border-bottom-color: #2598f3; }

    /* ════ RESPONSIVE PAGAR ════ */
    @media (max-width: 767px) {
      .pagar-cards-wrap {
        flex-direction: column;
        align-items: center;
        gap: 20px;
      }
      .pagar-tipo-card {
      background: #e4e2e73d;
      border-radius: 4px;
      border: 1px solid #999;
      box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
      padding: 20px 16px 60px;
      width: 172px;
      min-height: 240px;
      cursor: pointer;
      box-sizing: border-box;
    }
      .payment-cards-dynamic {
        flex-direction: column;
        align-items: center;
        gap: 20px;
      }
      .pay-card-wrap { width: 100%; max-width: 300px; }
      .pay-card {
      background: #e4e2e73d;
      border-radius: 4px;
      border: 1px solid #999;
      box-shadow: 0 0 3px 1px rgba(0,0,0,.5);
      padding: 56px 8px 56px;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      width: 155px;
      box-sizing: border-box;
    }
      .pay-card.pay-card-abono { min-height: auto; }
    }

    /* ════ ÍCONOS ESTADO TABLA (antes en JS) ════ */
    .estado-icon-pago-parcial {
      width: 24px; height: 24px;
      display: inline-block;
      background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyNC4wLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDUwIDUwIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MCA1MDsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCgkuc3Qwe2ZpbGw6bm9uZTtzdHJva2U6I0ExQjE1MDtzdHJva2Utd2lkdGg6NDtzdHJva2UtbWl0ZXJsaW1pdDoxMDt9DQoJLnN0MXtmaWxsOiNBMUIxNTA7fQ0KCS5zdDJ7ZmlsbDojQzZDNkM2O30NCjwvc3R5bGU+DQo8Zz4NCgk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNNi41NCwxMS40MXYxMC40N2MwLDEuNTctMS4yOCwyLjg1LTIuODUsMi44NWMtMS41NywwLTIuODUtMS4yOC0yLjg1LTIuODVWMTEuNDFjMC0xLjU3LDEuMjgtMi44NSwyLjg1LTIuODUNCgkJQzUuMjYsOC41Niw2LjU0LDkuODQsNi41NCwxMS40MXogTTIuMzcsMjEuODhjMCwwLjczLDAuNTksMS4zMiwxLjMyLDEuMzJjMC43MywwLDEuMzItMC41OSwxLjMyLTEuMzJWMTEuNDENCgkJYzAtMC43My0wLjU5LTEuMzItMS4zMi0xLjMyYy0wLjczLDAtMS4zMiwwLjU5LTEuMzIsMS4zMlYyMS44OHoiLz4NCgk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNNDMuNjUsMjMuMTVjMCw1LjY5LTQuNjMsMTAuMzEtMTAuMzEsMTAuMzFjLTUuMSwwLTkuMzktMy42NS0xMC4xOS04LjY5Yy0wLjA3LTAuNDIsMC4yMi0wLjgxLDAuNjQtMC44OA0KCQljMC40Mi0wLjA3LDAuODEsMC4yMiwwLjg4LDAuNjRjMC42OCw0LjI5LDQuMzMsNy40LDguNjgsNy40YzQuODQsMCw4Ljc4LTMuOTQsOC43OC04Ljc4cy0zLjk0LTguNzgtOC43OC04Ljc4DQoJCWMtMy44MywwLTcuMDIsMi4yOS04LjMyLDUuOTdjLTAuMTQsMC40LTAuNTgsMC42MS0wLjk4LDAuNDdjLTAuNC0wLjE0LTAuNjEtMC41OC0wLjQ3LTAuOThjMS41Mi00LjMxLDUuMjYtNi45OSw5Ljc2LTYuOTkNCgkJQzM5LjAyLDEyLjg0LDQzLjY1LDE3LjQ3LDQzLjY1LDIzLjE1eiIvPg0KCTxnPg0KCQk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNMzIuNTIsMjAuOThjMCwwLjc4LTAuMiwxLjM3LTAuNTksMS43OGMtMC40LDAuNDEtMC45MywwLjYyLTEuNiwwLjYyYy0wLjY3LDAtMS4yLTAuMjEtMS42LTAuNjINCgkJCWMtMC40LTAuNDEtMC41OS0xLjAxLTAuNTktMS43OGMwLTAuNzcsMC4yLTEuMzcsMC41OS0xLjc4YzAuNC0wLjQxLDAuOTMtMC42MiwxLjYtMC42MmMwLjY3LDAsMS4yLDAuMjEsMS42LDAuNjINCgkJCUMzMi4zMywxOS42MSwzMi41MiwyMC4yMSwzMi41MiwyMC45OHogTTMxLjEyLDIwLjk4YzAtMC40Mi0wLjA3LTAuNzMtMC4yMi0wLjkyYy0wLjE1LTAuMTktMC4zNC0wLjI5LTAuNTctMC4yOQ0KCQkJYy0wLjI0LDAtMC40MywwLjEtMC41OCwwLjI5Yy0wLjE1LDAuMTktMC4yMiwwLjUtMC4yMiwwLjkyYzAsMC40MiwwLjA3LDAuNzMsMC4yMiwwLjkyYzAuMTQsMC4xOSwwLjM0LDAuMjksMC41OCwwLjI5DQoJCQljMC4yMywwLDAuNDItMC4xLDAuNTctMC4yOUMzMS4wNSwyMS43MSwzMS4xMiwyMS40LDMxLjEyLDIwLjk4eiBNMzQuOTQsMTguNzhoMS43MmwtNC44NCw4LjU4SDMwLjFMMzQuOTQsMTguNzh6IE0zOC42NCwyNS4xNQ0KCQkJYzAsMC43OC0wLjIsMS4zNy0wLjU5LDEuNzhjLTAuNCwwLjQxLTAuOTMsMC42Mi0xLjYsMC42MmMtMC42NywwLTEuMi0wLjIxLTEuNi0wLjYyYy0wLjQtMC40MS0wLjU5LTEuMDEtMC41OS0xLjc4DQoJCQljMC0wLjc3LDAuMi0xLjM3LDAuNTktMS43OGMwLjQtMC40MSwwLjkzLTAuNjIsMS42LTAuNjJjMC42NywwLDEuMiwwLjIxLDEuNiwwLjYyQzM4LjQ0LDIzLjc4LDM4LjY0LDI0LjM4LDM4LjY0LDI1LjE1eg0KCQkJIE0zNy4yNCwyNS4xNWMwLTAuNDItMC4wNy0wLjczLTAuMjItMC45MmMtMC4xNS0wLjE5LTAuMzQtMC4yOC0wLjU3LTAuMjhjLTAuMjQsMC0wLjQzLDAuMDktMC41OCwwLjI4DQoJCQljLTAuMTQsMC4xOS0wLjIyLDAuNS0wLjIyLDAuOTJjMCwwLjQyLDAuMDcsMC43MywwLjIyLDAuOTJjMC4xNCwwLjE5LDAuMzQsMC4yOSwwLjU4LDAuMjljMC4yMywwLDAuNDItMC4xLDAuNTctMC4yOQ0KCQkJQzM3LjE2LDI1Ljg4LDM3LjI0LDI1LjU3LDM3LjI0LDI1LjE1eiIvPg0KCTwvZz4NCgk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNMzMuMiwxMy42NGMwLDAuMTYtMC4wNSwwLjMzLTAuMTYsMC40N2MtMC4yNiwwLjMzLTAuNzQsMC4zOS0xLjA3LDAuMTNsLTMuOTUtMy4wOA0KCQljLTEuMS0wLjgzLTIuNDktMS4yLTMuOTEtMS4wMmwtMTMuMjcsMS42NWMtMS4zMywwLjE2LTIuNjgsMC4yNS00LjAxLDAuMjVINi41NHY5LjI0YzEuODUsMC4xMywzLjY0LDAuNzEsNS4yMiwxLjcxbDAuMywwLjE5DQoJCWMwLjc0LDAuNDcsMS42MSwwLjcyLDIuNTEsMC43MWw5LjY3LTAuMDZjMC43OSwwLDEuNDctMC41MiwxLjYyLTEuMjNjMC4xLTAuNDYsMC0wLjktMC4yOC0xLjI0Yy0wLjI3LTAuMzMtMC42OC0wLjUyLTEuMTItMC41Mg0KCQlsLTUuMiwwLjAzYy0wLjU3LDAtMS4wNS0wLjM0LTEuMjQtMC44N2MtMC4xOS0wLjU0LTAuMDItMS4xMywwLjQzLTEuNDlsNS4xNS00LjI3YzEuMDEtMC44MSwzLjE4LTAuNDcsNC40NiwwLjcNCgkJYzAuMzEsMC4yOCwwLjMzLDAuNzcsMC4wNSwxLjA4Yy0wLjI4LDAuMzEtMC43NywwLjMzLTEuMDgsMC4wNWMtMC44NS0wLjc4LTIuMi0wLjg2LTIuNDYtMC42NWwtNC43MSwzLjlsNC42LTAuMDMNCgkJYzAuOTEtMC4wMSwxLjc1LDAuMzksMi4zMSwxLjA5YzAuNTcsMC43LDAuNzgsMS42MiwwLjU5LDIuNTNjLTAuMywxLjQtMS42MSwyLjQyLTMuMTEsMi40M2wtOS42NywwLjA2DQoJCWMtMS4xOSwwLjAxLTIuMzQtMC4zMi0zLjM0LTAuOTVsLTAuMy0wLjE5Yy0xLjU1LTAuOTgtMy4zMy0xLjUtNS4xNy0xLjVjLTAuNDIsMC0wLjc3LTAuMzQtMC43Ny0wLjc3VjExLjI4DQoJCWMwLTAuNDIsMC4zNC0wLjc3LDAuNzctMC43N2gxLjA2YzEuMjcsMCwyLjU2LTAuMDgsMy44My0wLjI0bDEzLjI3LTEuNjVjMS44MS0wLjIyLDMuNiwwLjI1LDUuMDMsMS4zM2wzLjk2LDMuMDkNCgkJQzMzLjEsMTMuMTksMzMuMiwxMy40MiwzMy4yLDEzLjY0eiIvPg0KCTxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik00OS4xNiwzMS40N3Y3LjM3YzAsMS40My0xLjE3LDIuNi0yLjYsMi42SDE4LjZjLTEuNDMsMC0yLjYtMS4xNy0yLjYtMi42di03LjM3YzAtMS40MywxLjE3LTIuNiwyLjYtMi42aDQuNDkNCgkJYzAuNDIsMCwwLjc3LDAuMzQsMC43NywwLjc3YzAsMC40Mi0wLjM0LDAuNzctMC43NywwLjc3SDE4LjZjLTAuNTksMC0xLjA3LDAuNDgtMS4wNywxLjA3djcuMzdjMCwwLjU5LDAuNDgsMS4wNywxLjA3LDEuMDdoMjcuOTYNCgkJYzAuNTksMCwxLjA3LTAuNDgsMS4wNy0xLjA3di03LjM3YzAtMC41OS0wLjQ4LTEuMDctMS4wNy0xLjA3SDQzLjVjLTAuNDIsMC0wLjc3LTAuMzQtMC43Ny0wLjc3YzAtMC40MiwwLjM0LTAuNzcsMC43Ny0wLjc3aDMuMDYNCgkJQzQ3Ljk5LDI4Ljg2LDQ5LjE2LDMwLjAzLDQ5LjE2LDMxLjQ3eiIvPg0KCTxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik00NC40MywzNi43N2MwLDAuNDItMC4zNCwwLjc3LTAuNzcsMC43N0gyMy4xMmMtMC40MiwwLTAuNzctMC4zNC0wLjc3LTAuNzdTMjIuNjksMzYsMjMuMTIsMzZoMjAuNTUNCgkJQzQ0LjA5LDM2LDQ0LjQzLDM2LjM1LDQ0LjQzLDM2Ljc3eiIvPg0KPC9nPg0KPC9zdmc+DQo=");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
    }
    .estado-icon-por-pagar {
      width: 24px; height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADooAAA6KAc6DB4wAAATDSURBVEhLnVZrTNtVFD/3tqUPykCeouzh5oDBNgsMHBVYKYkxcXEfFgnOxLmoH9SIZolZMpclPrJEvxjNSIyyRL+oYTHTxA8+MsrKc+M1ZLw6FOYYBCgWoaUt/P/3eu5tIe1a0PhLbu+955x77v2fZwlsAUePLV23TVMEnB0ihBQhycIZTwdCbgLhPVwl/Qpj3dWFLeOhE7GIe0FTU2FC9mNZZwnn9UBJD3Do5Rz6goHVAUWnuo0ao0VDeQnnpJgSqOacf00XAu9YrZ3+sIoNxFzQ7rJZ8OCXqHRWXVNfLt3zExiNxqcYYxb8il048NHsd1Tq9Hg8V/umjxnNRsNFPGpRGT9Vle9oD2mKA+eo/dX2MfvfYkYFFlTUjPOmQL5PVdVzuDS2jtifaxuzL7aP2s6E1UXDOVpzsM1V7bk2UnUAD9TjYSa1RMDju8H7Jk+Fd1Ho9/l82Y4h26P4QLdzqLIsrBao+BE211D2FVf4uYpcx1EkfYKmiDGfylbAv3oHGFfClA1YTCZTh63A4cbvOkN12ksdHeVGwZAXCIfi9GfFPscA6n1f0CKx5L8Fg1Nvgmvmgtx3/3EcJuYbgLGg3IexC8fnFfktlwiQEZamPy+I5OcBa6bZYBgGNaXEuu+775FmEYx1LPkH4dbUaVyxECECGduehL1Z0SZXFKWmc9I+SLl2yOcP7qcmk+EIxlLz47lNJciPUi4ws3gFf0PK9+d8DGW7f4BEfa7czy/9CgrzyfU6NBrN2aq9rfP49s5Ek/4wxbOFjMMwmubZsEwUAmv35KyhJkgyFIJWY4ac1BPwYPIxHM+AqnolPwK25eXlTMybfs4wTyghhznlnZTSirBAFMz6fDkLB4/NvAdBZR7SzJWwO7NeDr0uS/LXgQ/VmM3mAkJ5H4ZJEeXAiv0rwX7kZYREorEj7UUw6B6S6798bdA7cQJGp8+DLzghaZsgwxdQUScvl1G0FXTaB8CyoxG2p55E8yQjheFF7TB49zVY8DpDQrHQA1NkiGEpoX1Gk14UMnRMfFCqh+1pL8ChR76FPZmn0R+JmAurMD77kZzjYEo4WDiaYrp2EUbKMXHbwswNrKxOSruL4V5uwdckQFby05CeVC35KvNjEEzL9Towq1Wv1zssHCwcTTHVhvAzCpBxOSyzARE5C95rctzzfCMdjJkKwbW5sERI5j60JCUlzQkHC0dTFlC6sHLar7tqe5F5MyQTgl6bCanmUHD5guPSwd0Tx2Fx5YakmQ15UiYSWPwuOG9XZhAOT7A1pZseOeC8i2l0EbSeT5H/hvjEkGgIuVhFclKfhwRNGu4YKOoSzgRSTKWQl/2ulInAZZ1O16zhugaMzi+qClpnZEETxe5hS+Z1pvBGa95VhrHcgCOm2N1xN0pzHdzxGWjR0ffht9nZWev4Yl0dOust6g6UiQYkw7S2dmhVZfQk0ZIPsGS34Ve8joPLYxFI0GaAKWFnjHIU7cLsrRlZqMsmhH6IpnkpXneLajjBYFD0hSaMLkVcFg/Im0Obv43LTRvOv7bMop0/+rHWH0WLleKQLRPFbmPV/MXlcrVMKa+kbNUyYy4Q2KzpK5x1QwAWqZEW/++mH4mYvy2cl3JCUvDC/v/2twXgH7jMuEZLUeZsAAAAAElFTkSuQmCC");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
    }
    .estado-icon-cupon {
      width: 24px; height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAKRSURBVEhL3VZBi9NAFM4k7Yrr/gJ1FTwKnl3/gOxJD6V7UHYPIuoladLSiweR4kFkkzST08KCIO2l3RVBROhZ3L15EPwBih4EwatpmvF702kwbVpj9eQH05n3Znjvzfvem4ZpCr7vX2GG4SRxfFCv13uka3MuZzEaHTuO49Ea5+o4t5Gno7VtWVu/6lIH7TCsiiS5HUfRdrPZ/KrUS8N13XW9VNpX4v8AuhLxoMSF4GEo1HIhyF5JrTVjZWVDE6KK5dFYk4XneWeMcjkAaRWSyQk4C5MkeQCyv8tDU6Ci0dX6t4DxJwjgcqJp20LgAkLc0xir6Lr+UB3JRepgFEXHKD1fiTNA5DcwXNs0O4wxzbKsPThxma7X1JEZLLKXAef8BKUkCIK6lAtyQEhvsIhkRPsDaXmHaB9PnBQB2UsdEMlEihJnEA+H10HqUzhxSVY32qPA5IEc/BHJjUbjU61Wu2uZpux+ONuFszulcvmtPDAHhUmeBpw1QbIDws+GYXhNqTMge2kfUISYaMwABqpgtYeoz8PwR6VGlbLPiu3cTKA/jgqlKI7jNzQjJbtSoQDj1JjCNM0XY80sMq8pdfLkuZ2Gz/lNg7EOqukLIj+N+QPmi2i8LfRGXx3LgJ77wiQ7ltVFii4h6hbJgrHWMIrOzTOeAUquRzWLIWs8CMPncmMOijbaxJ4WcP4e19mRSs5vkSw3/gFkitBEFSw8ugXy7CejUS4Py8Cgn8Fg8O3q5maMl7EHou/btv1S7v4l2kHgpX1AoMRiXBhLsgomue5Pqkt9CFB55unoT19WZqrrdrvBweGhALGvaAP5f93r98WzTidT88tCRy2L1ZOrCT5XHpEC+W+tnVpLSrqe9sjy0LSfVUg7y/1cdg4AAAAASUVORK5CYII=");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
    }
    .estado-icon-no-pagable {
      width: 24px; height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADqUAAA6lASpliAIAAAPMSURBVEhLtVZba5RHGH6+b9dNjJbGeEyMNy0WSqgXQRCpZ0KCRrMJXgktVoTeFPwDVfSiInrnbWk94IWggsEjZgWDoTdFBBWDqAHxEA8RbRtdd9fdb/o8s2+W7GZNEPSB3Zl53nfew8w7M1+ASbAHCH/twbK4w2YOVzmgMXCY6wKMcOLTCBgMA5xCBqngIrLFWRNR1YmM7+7CZhdiHxWa4JCiZgoRHr4HhqcBswohFtLhqiDARrYRHe6++i/+XNuPvJn5MN52oDHqxgB/jwpJ/PKsHTNMVBUKKN+NH6l/n79bmU58ZaLqyG1Ca5TEU9eNE1MZr8TtFiRcEkc5/xXbZUaXI70RC6nwhAoHFZ3RHw1mv5dBvki3Y5FRRVxZgzhT/VsZGFVCOlmhXAEFVxkU7RxjsDdkV2MvXFmPH9g04Dm2ajwGKh6oDTD0vhtrjCqD+NoY7u5K4o/xjgbvYTsrcIbZRSBvq+txh9XxW7wXR7wWwbQPsjx3sGxHWV2xQoDOab3oN7F3EHM4z+qqM+pI0Itt1geL4Sd63Rlk0RKu+JJROjTEsjhucg+Wbpu1X/DvXQw4q8IQp5brcHqcA5rA99b18PZoN5/AypDKPVS4VHmYMgW0k7+nPh3N1oGKh7isCNVyWC+ZIL1MHmtt6CF7siv7ITvLuSznTVZC3Tk80UTKh4yayV8Nl+gwM5hVpDweSE/6Ni6ByzXA+a0hJzQzlBHjy6CJuRw2OIdhjbU83NCCFxLiszl0VHPg4fBY9lURc3ldPC6yE1F7AXcjh59tqKWL0TgDBMRL7gXVEPng6cThP8To6APIbMA3XM7fbejB6HhdIRIvudETEXq7IyFDUxbNnqyADloigQs02mRUCcxISz2/JoFL0jO6HHTCrIeUST/T7jS6BE2sjeMKjX1tlPbgNTdkm1qjWNlYJL1qjmi3jXt4M+S9fJqGOtx61JjMgye5j/xiG2oT3uQjtOnAqiX1T1GCmAKRIxt7yJ7s0tHJMJ7DAHN/VajBFpN7MIKL1lUGaWawKXEW1zVWy+B6xPsK0NIBfxW7RcgeuVFvX9AB03vglmO6Jwy6u8jnJru7eBmmeQUdGn936dqXPdk1avJb2HVhiXWrIpvEd1PdwiVo4z7rezKGXBeWfoqXsXJ5yyJOnMG1dxm0cjMb59Xhzse88d8uxiCLpTWXx9LxT4LAApgITfRfKwH288AtYP2m+N70sZoe8GA8yodo4GI3szzXUT7l10pVJ2OQs7HvLjpYR+UmOp5Doy+Z7bAOGtvel2mkFvThrU2rAPA/VdmUH+pfmVAAAAAASUVORK5CYII=");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
    }
    .estado-icon-pagado {
      width: 24px; height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAALDSURBVEhLrZVNSFRRFMf/754hUxP6IFtU0MKiiAwiDKKgqLAy3ISt2hQqVE6k4t6oRSFqOKNJBC0qo41ERIR9bguCahERGoJEpS1ahGnNu7f/vHfSZN6Mo/WDmXfv/557z/04517MiS4UBL854Ok3N20oNUWm0YNX5+B+ULlmx20SLRgNDbJj9BtNEhtNt7kqRfIODsX+hL/dOrufLcuovZUeuYkEtobG0USvIIFKMdLE2W5m7UrkbDux2MRMLQT1nvO+UOn1x/zbaEUqNAiZdtCKBbJcDrPU7DxX6Fmv07f+dZzGZGiQhVYYKZVqrvAE+62HxS37y15AI76pRUisK7aXS37BbTmk0ty5hHLTYwYlKVNjTJ2Bi7kl/AyjAfdCZR6cwRvP80Y88b6rMssh50M7Vmspkn9yEEvG9kihDDHSGlTKYP4OGJ481LvOuTE7YQdUzWB+DtqxzhgzwDCetLBVaMZ7bckgt4Oo/e3ASrPQPGZWFzDpDuAUXmlLJFkdmKRp4UCvGbZbVEoPvpTaQ0bKCuZJFSPuubbMxCGmpb8ccL1aCrA/bR/T8KvxzKPASRuKpUDuc+ZlbD6SiqeehZaZOOuKtTjtgFn7kj52aBVowkce3u4/Tnj3PGC5gtOo90/6d9QqE4cSX/whrc0kyOTLqNRqSAfKGIYf2OZMwsRVjaYLFelM1lrAzDNw4DByTmshTRi0k3ZneuY2bhOqRiIiZ3nxnddqBOmLi6vgXVKrSt6wX00w+9bpA46mB+XSLZ/RjQ2qzE4n1nAbRxkM21TJDVdwkB2G0wmlUnYS2ETbEU6qTpX84JKr2elTru0KtoUzp81xlTLI/Sb3Yq34kmSpiHdOn03Zfj4/47JI9rHnMYb1KuvbZsTxJOyQSX6PfgK7ePccZZLVBD0cnvL/Bp/Ifh6qDWz+CxdRkr6LtJYHwG9c3uUpmXnHlgAAAABJRU5ErkJggg==");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
    }
    .estado-icon-en-proceso {
      width: 24px; height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAYAAACpSkzOAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADw0AAA8NAR5BTOMAAAN1SURBVEhLxZZbaFxFGMf/M3vLPSHthpQ0pRg0lJRCSx8ES6tYSiAqYkHfpIg+1KQloU1bWlJXQ6AxNcEkG98klT4WMUKDVLwjJIJWfFBE+2KCMd1tSdhumrN7zhn/Z860STa3bi/0B3PmzH/mfN9cznwzAuvRp7YihJcgVBME6qCwSesCU3yfhBA/MP8ciXd/Rizm6roVWN3RkKrn8zzTC7oM9Reb/wblTuqikJupbeXbLhZoR43BtVvREh7X9TksdxSLSVR1dALyGHt6G657HgF5CW+LP02LpfSkqlBYdJC+TtNaDZT6CInOI7mjW+qo579iFEU/Zm9fZc8v4na6DcfLkqZ2bfxvO+mwlR38EhnxGtrEjKldhDeSuPsZhlwXg06rUfMnrt6iDZv5ZcS+CRp1EUNOF9dFYcA5YpT7Z9A5rG3FnW6jmKkbyOxGIDgGJYbRLN7UWi69E4WIVF8VdqZSyZD3ZSMX/hdTu5y4E+c0HoZtP42j4Z+kFmXwfc7rTWRwXJdXomJzicxa9eHZyWjASkURCJWZmpW5dfMUbSbZrscrSgxaDfT8HPdJ38qLd5+cjKZo8wOOfK/nQ0IEX9EV1vywzh8m1vwnOqcPTp14npvtd7QVT2nxYaJt0raQz3iO6phWX9QHRvzNRy2nDlEumh9W8sG1w+ZtbYS2Xef/dXkirVkIx76A/ux+I62OC8vLJEeToFcGyHW4MT3nhopmsiVVnhOEZierpZO+wv0S01FlNbyID1xjA3WNqcFX16C9Oo25dL0bKf8iW85+CYlQaloE08l3ED37HXrnakzLXLwIP+E5+opf7URf2j9n1qK99DoS7zWpQORUpqJWucFCBOZnOLqJPQgFr2Ig+6xp6ePb3MEA/SOnzv5Ui5GCQzpfDy/8twS64Yp92bKaf52Cckh7nsmKcpTbTCufSMHrOqcPP9bF3a/53M7Q/lRe0cE7i4qKLwjbalTByAia5cumBuhOlKJkA5dF/MH4uc9fRNc+wUWrRFifqPfO3akseBFW6g2j+pRUnqPNjXCy7UYxPOJjYuG3vN7ZwWN4BAHx4QMffFIMcNuMIvH9GaNycIt5hEf5Y7qcLMa7binVTwMHjOI5+pXpH10CtrAjT/DM2U0ztJPvdSuXuxdI3u8EnqRyZ2ObCyS+pYNRJLvGc0exAPA/pH5mIRDyBogAAAAASUVORK5CYII=");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
    }
    .estado-icon-bloqueado {
      width: 24px; height: 24px;
      display: inline-block;
      background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADqUAAA6lASpliAIAAAPMSURBVEhLtVZba5RHGH6+b9dNjJbGeEyMNy0WSqgXQRCpZ0KCRrMJXgktVoTeFPwDVfSiInrnbWk94IWggsEjZgWDoTdFBBWDqAHxEA8RbRtdd9fdb/o8s2+W7GZNEPSB3Zl53nfew8w7M1+ASbAHCH/twbK4w2YOVzmgMXCY6wKMcOLTCBgMA5xCBqngIrLFWRNR1YmM7+7CZhdiHxWa4JCiZgoRHr4HhqcBswohFtLhqiDARrYRHe6++i/+XNuPvJn5MN52oDHqxgB/jwpJ/PKsHTNMVBUKKN+NH6l/n79bmU58ZaLqyG1Ca5TEU9eNE1MZr8TtFiRcEkc5/xXbZUaXI70RC6nwhAoHFZ3RHw1mv5dBvki3Y5FRRVxZgzhT/VsZGFVCOlmhXAEFVxkU7RxjsDdkV2MvXFmPH9g04Dm2ajwGKh6oDTD0vhtrjCqD+NoY7u5K4o/xjgbvYTsrcIbZRSBvq+txh9XxW7wXR7wWwbQPsjx3sGxHWV2xQoDOab3oN7F3EHM4z+qqM+pI0Itt1geL4Sd63Rlk0RKu+JJROjTEsjhucg+Wbpu1X/DvXQw4q8IQp5brcHqcA5rA99b18PZoN5/AypDKPVS4VHmYMgW0k7+nPh3N1oGKh7isCNVyWC+ZIL1MHmtt6CF7siv7ITvLuSznTVZC3Tk80UTKh4yayV8Nl+gwM5hVpDweSE/6Ni6ByzXA+a0hJzQzlBHjy6CJuRw2OIdhjbU83NCCFxLiszl0VHPg4fBY9lURc3ldPC6yE1F7AXcjh59tqKWL0TgDBMRL7gXVEPng6cThP8To6APIbMA3XM7fbejB6HhdIRIvudETEXq7IyFDUxbNnqyADloigQs02mRUCcxISz2/JoFL0jO6HHTCrIeUST/T7jS6BE2sjeMKjX1tlPbgNTdkm1qjWNlYJL1qjmi3jXt4M+S9fJqGOtx61JjMgye5j/xiG2oT3uQjtOnAqiX1T1GCmAKRIxt7yJ7s0tHJMJ7DAHN/VajBFpN7MIKL1lUGaWawKXEW1zVWy+B6xPsK0NIBfxW7RcgeuVFvX9AB03vglmO6Jwy6u8jnJru7eBmmeQUdGn936dqXPdk1avJb2HVhiXWrIpvEd1PdwiVo4z7rezKGXBeWfoqXsXJ5yyJOnMG1dxm0cjMb59Xhzse88d8uxiCLpTWXx9LxT4LAApgITfRfKwH288AtYP2m+N70sZoe8GA8yodo4GI3szzXUT7l10pVJ2OQs7HvLjpYR+UmOp5Doy+Z7bAOGtvel2mkFvThrU2rAPA/VdmUH+pfmVAAAAAASUVORK5CYII=");
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
    }

    /* ════ FORMULARIO MÓVIL ════ */
    @media (max-width: 767px) {
      /* Card formulario */
      .card-pagar-single { border-radius: 0; }
      .card-body-pagar { padding: 16px 14px 20px; }

      /* Grid: 1 columna */
      .form-grid {
        grid-template-columns: 1fr !important;
        gap: 16px;
      }

      /* Campos más espaciados */
      .form-field label { font-size: 13px; }
      .form-field input,
      .form-field select { font-size: 15px; padding: 8px 0; }

      /* Cards de pago: ancho completo, apilados */
      .payment-cards {
        flex-direction: column;
        align-items: center;
        gap: 20px;
        padding: 0;
      }
      .payment-cards-dynamic {
        flex-direction: column;
        align-items: center;
        gap: 20px;
      }
      .pay-card-wrap { width: 100%; max-width: 280px; padding: 0; }
      .pay-card {
        width: 100% !important;
        min-height: auto;
        padding: 28px 16px 28px;
      }
      .pay-card.pay-card-abono { min-height: auto; }
      .pay-card-title { font-size: 15px; margin-bottom: 16px; }
      .pay-card-value { font-size: 18px; margin-bottom: 28px; }
      .btn-pagar-mes-pay { width: 75%; }
      .btn-pagar-total { width: 75%; }
      .btn-abonar { width: 75%; }
      .abono-input { margin-bottom: 28px; }

      /* Términos */
      .terminos-wrap { margin-top: 20px; }
      .terminos-check label { font-size: 13px; }

      /* Botón cancelar */
      .btn-cancelar { float: right; }

      /* Nota requerido */
      .nota-requerido { font-size: 11px; }
    }