<div class="container">
<div class="row">
  <div class="cs-space-20 d-md-none"></div>
  <div class="cs-space-20 d-md-none"></div>
</div>
</div>
<div class="d-none d-md-block cs-space-40"></div>
<section id="single-params">
  <div class="container">
    <div class="row">
      <div class="col-12 col-md-3">
        <div class="lateral-menu">
                    <div class="header-lateral-menu">
                        <div class="row">
                            <div class="col-4 d-flex align-items-center">
                                <img class="logo" src="https://www.secmca.org/wp-content/uploads/2019/12/activos-y-pasivos-de-las-osd@2x.png" alt="EFPA">
                            </div>
                            <div class="col-8">
                                <h4>EFPA</h4>
                            </div>
                        </div>
                    </div>
                    <div class="body-lateral-menu">
                        <?php 
                        // Obtener lista de cuadros para el menú lateral
                        $cuadros_menu = $this->api->efpa_get_cuadros();
                        if($cuadros_menu && is_array($cuadros_menu)):
                            foreach ($cuadros_menu as $cid => $cuadro_item):
                                $nombre_menu = isset($cuadro_item["nombreEsp"]) ? $cuadro_item["nombreEsp"] : "Cuadro " . ($cid + 1);
                                $codigo_menu = isset($cuadro_item["codGeneral"]) ? $cuadro_item["codGeneral"] : "";
                                $codigo_sdmx_menu = isset($cuadro_item["codigoSDMX"]) ? $cuadro_item["codigoSDMX"] : "";
                                $cuadro_param_menu = $codigo_menu ? $codigo_menu : $codigo_sdmx_menu;
                                $es_activo = (isset($cuadro) && $cuadro == $cuadro_param_menu) ? 'active' : '';
                        ?>
                        <div class="row">
                            <div class="align-items-end col-2 col-md-3 d-flex flex-column">
                                <a class="more" role="button">
                                    <p>-</p>
                                </a>
                            </div>
                            <div class="col-10 col-md-9">
                                <a href="<?php echo home_url('/efpa-parametros/'); ?>?cuadro=<?php echo urlencode($cuadro_param_menu); ?>">
                                    <h3 class="<?php echo $es_activo; ?>">
                                        <?php echo esc_html($nombre_menu); ?>
                                    </h3>
                                </a>
                            </div>
                        </div>
                        <?php 
                            endforeach;
                        endif;
                        ?>
        </div>
      </div>
        <div class="cs-space-20 d-md-none"></div>
        <div class="col-12 col-md-9" id="parameters">
          <?php 
          // Obtener nombre del cuadro
          $cuadros_list = $this->api->efpa_get_cuadros();
          $nombre_cuadro = $cuadro;
          if($cuadros_list && is_array($cuadros_list)) {
              foreach($cuadros_list as $c_item) {
                  $codigo = isset($c_item["codGeneral"]) ? $c_item["codGeneral"] : "";
                  $codigo_sdmx = isset($c_item["codigoSDMX"]) ? $c_item["codigoSDMX"] : "";
                  if($codigo == $cuadro || $codigo_sdmx == $cuadro) {
                      $nombre_cuadro = isset($c_item["nombreEsp"]) ? $c_item["nombreEsp"] : $cuadro;
                      break;
                  }
              }
          }
          ?>
          <h2><?php echo esc_html($nombre_cuadro); ?></h2>
          <div class="d-none d-md-block cs-space-10"></div>
           <p class="params-p">
                    <pre class="params-p">Datos estadísticos de finanzas públicas</pre>
                </p>
          <div class="cs-space-20 d-md-none"></div>
          <div class="d-none d-md-block cs-space-40"></div>

        <?php 
        // Verificar si hay un error en los datos
        $tiene_error = (is_array($all_data) && isset($all_data['error']) && $all_data['error'] === true);
        $tiene_datos_validos = (isset($all_data) && is_array($all_data) && !empty($all_data) && !$tiene_error);
        ?>

        <?php if($tiene_datos_validos): ?>
        
        <div class="graphic-container">
            <div class="header-graphic">
              <div class="container">
                <div class="row">
                  <div class="col-6 col-md-3 col-md-3 col-space-down">
                      <button class="btn btn-primary hBack" type="button">Volver</button>
                  </div>
                  <div class="col-6 col-md-3 col-md-3 col-space-down">
                    <div class="graphic-box">
                      <img src="<?php echo get_template_directory_uri(); ?>/src/images/131972@2x.png" alt="">
                      <h5>Exportar</h5>
                      <div class="arrow-down"></div>
                      <div class="dropdown js-hover-dropdown" id="js-downland">
                        <ul>
                          <li id="txt" ><a href="#" >Txt</a></li>
                          <li id="csv" ><a href="#">csv</a></li>
                          <li id="ex" ><a href="#">Excel</a></li>
                        </ul>
                         <span style="height: 38px;padding-left: 20px;display: flex;align-items: center;background: #f2f2f2;color: black;font-weight: bold;" id="dre">Json</span>

                      </div>
                    </div>
                  </div>
                  <div class="col-6 col-md-3 col-md-3 col-space-down">
                    <div class="graphic-box share-box-wrapper js-share-box-wrapper">
                      <div class="graphic-box-helper"></div>
                      <img src="<?php echo get_template_directory_uri(); ?>/src/images/149722@2x.png" alt="">
                      <h5>Compartir</h5>
                      <div class="arrow-down js-arrowToex"></div>
                      <div class="share-box">
                        <div class="social">
                          <?php $actual_link = "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]"; ?>
                          <a target="_blank" href="https://www.facebook.com/sharer.php?u=<?=urlencode($actual_link)?>"><img src="<?php echo get_template_directory_uri(); ?>/src/images/face-ico@2x.png" alt=""></a>
                          <a target="_blank" href="https://twitter.com/intent/tweet?url=<?=urlencode($actual_link)?>"><img src="<?php echo get_template_directory_uri(); ?>/src/images/twi-ico@2x.png" alt=""></a>
                          <a target="_blank" href="mailto:?subject=SECMCA DATOS: Resultado EFPA&amp;body=<?=urlencode($actual_link)?>"><img src="<?php echo get_template_directory_uri(); ?>/src/images/mail-ico@2x.png" alt=""></a>
                        </div>
                        <div class="share-link">
                          <p class="text-link">Compartir link</p>
                          <div class="copy">
                            <img src="<?php echo get_template_directory_uri(); ?>/src/images/link@2x.png" alt="">
                            <button onclick="copyLink()"  style="background: transparent;
                              height: 31px;width: 43px;font-size: 11px;border: none;">Copiar</button>
                          </div>
                        </div>
                        <div class="box-link">
                          <p><input type="text" value="<?php echo $actual_link; ?>" id="myInput" readonly style="background: transparent;border: none;"></p>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="col-6 col-md-3 col-md-3 col-space-down boxx">
                    <div class="graphic-box graphic-blue-box">
                      <div class="circle-wrapper">
                        <div class="circle-info">i</div>
                        <h5>Metadatos</h5>
                      </div>
                      <div class="arrow"></div>
                    </div>
                    <div class="white-box">
                      <div class="accordion md-accordion" id="accordionEx" role="tablist" aria-multiselectable="true">
                        <div class="card">
                          <div class="card-header" role="tab" id="headingOne1">
                            <a data-toggle="collapse" data-parent="#accordionEx" href="#collapseOne1" aria-expanded="true"
                              aria-controls="collapseOne1">
                              <h5 class="mb-0 d-flex justify-content-between">
                                Contacto <i class="fas fa-angle-down rotate-icon"></i>
                              </h5>
                            </a>
                          </div>
                          <div id="collapseOne1" class="collapse show contact-table" role="tabpanel" aria-labelledby="headingOne1"
                            data-parent="#accordionEx">
                            <div class="card-body fixed-card">
                              <div class="row">
                                <div class="col-12 col-md-12 col-wrapper-contact">
                                  <div class="row">
                                    <div class="col-12 col-md-6 d-flex align-items-center justify-content-center">
                                      <p>Cuadro</p>
                                    </div>
                                    <div class="col-12 col-md-6 d-flex align-items-center justify-content-center">
                                      <p><pre><?php echo esc_html($cuadro); ?></pre></p>
                                    </div>
                                  </div>
                                  <div class="row">
                                    <div class="col-12 col-md-6 d-flex align-items-center justify-content-center">
                                      <p>País(es)</p>
                                    </div>
                                    <div class="col-12 col-md-6 d-flex align-items-center justify-content-center">
                                      <p><pre><?php echo is_array($pais) ? implode(', ', $pais) : esc_html($pais); ?></pre></p>
                                    </div>
                                  </div>
                                  <div class="row">
                                    <div class="col-12 col-md-6 d-flex align-items-center justify-content-center">
                                      <p>Variable(s)</p>
                                    </div>
                                    <div class="col-12 col-md-6 d-flex align-items-center justify-content-center">
                                      <p><pre><?php echo is_array($variable) ? implode(', ', $variable) : esc_html($variable); ?></pre></p>
                                    </div>
                                  </div>
                                  <div class="row">
                                    <div class="col-12 col-md-6 d-flex align-items-center justify-content-center">
                                      <p>Frecuencia</p>
                                    </div>
                                    <div class="col-12 col-md-6 d-flex align-items-center justify-content-center">
                                      <p><pre><?php echo esc_html($frecuencia); ?></pre></p>
                                    </div>
                                  </div>
                                  <div class="row">
                                    <div class="col-12 col-md-6 d-flex align-items-center justify-content-center">
                                      <p>Período</p>
                                    </div>
                                    <div class="col-12 col-md-6 d-flex align-items-center justify-content-center">
                                      <p><pre><?php echo esc_html($fechaInicio . ' - ' . $fechaFin); ?></pre></p>
                                    </div>
                                  </div>
                                </div>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="d-none d-md-block cs-space-40"></div>
                <div class="row">
                  <div class="col-12">
                    <div class="space"></div>
                  </div>
                </div>
                <div class="d-none d-md-block cs-space-30"></div>
                <div class="row">
                  <div class="col-md-8">
                    <!-- <h3>Resultado de la consulta</h3> -->
                  </div>
                  <div class="col-md-4 d-flex align-items-center justify-content-end">
                    <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
                      <!-- <li class="nav-item js-nav-mode js-cuadro">
                        <a class="nav-link active active-mode d-flex align-items-center justify-content-center" id="pills-table-emfa-tab" data-toggle="pill" href="#pills-table-emfa" role="tab" aria-controls="pills-table-emfa" aria-selected="true"><p>Cuadro</p></a>
                      </li> -->
                    </ul>
                  </div>
                </div>
                <!-- <div class="d-none d-md-block cs-space-30"></div> -->
                <div class="row">
                  <div class="graphic w-100">
                    <div class="tab-content" id="pills-tabContent">
                      <div class="tab-pane fade show active" id="pills-table-emfa" role="tabpanel" aria-labelledby="pills-table-emfa-tab">
                        <div class="wraper-tadiv">
                            <div class="table-wrapper">
                                    <table class="emfa-table table-results search-table efpa-results-table">
                                        <?php
                                        // ========================================
                                        // ANÁLISIS DINÁMICO DE LA ESTRUCTURA DE DATOS
                                        // ========================================
                                        
                                        // Obtener nombre del cuadro
                                        $cuadros_list = $this->api->efpa_get_cuadros();
                                        $nombre_cuadro = $cuadro;
                                        if($cuadros_list && is_array($cuadros_list)) {
                                            foreach($cuadros_list as $c_item) {
                                                $codigo = isset($c_item["codGeneral"]) ? $c_item["codGeneral"] : "";
                                                $codigo_sdmx = isset($c_item["codigoSDMX"]) ? $c_item["codigoSDMX"] : "";
                                                if($codigo == $cuadro || $codigo_sdmx == $cuadro) {
                                                    $nombre_cuadro = isset($c_item["nombreEsp"]) ? $c_item["nombreEsp"] : $cuadro;
                                                    break;
                                                }
                                            }
                                        }
                                        
                                        // Detectar todos los campos disponibles en el primer registro
                                        $campos_disponibles = array();
                                        if(!empty($all_data) && isset($all_data[0])) {
                                            $campos_disponibles = array_keys($all_data[0]);
                                        }
                                        
                                        // Detectar si hay múltiples países o variables
                                        $paises_unicos = array();
                                        $variables_unicas = array();
                                        $variables_nombres = array(); // Mapeo de código -> nombre
                                        $paises_nombres = array(); // Mapeo de código país -> nombre completo
                                        
                                        foreach($all_data as $row) {
                                            if(isset($row['_pais'])) {
                                                $cod_pais = $row['_pais'];
                                                $paises_unicos[$cod_pais] = true;
                                                
                                                // Buscar el nombre completo del país (campo: paisRegion)
                                                if(!isset($paises_nombres[$cod_pais]) && isset($row['paisRegion'])) {
                                                    $paises_nombres[$cod_pais] = $row['paisRegion'];
                                                }
                                            }
                                            if(isset($row['_variable'])) {
                                                $cod_var = $row['_variable'];
                                                $variables_unicas[$cod_var] = true;
                                                
                                                // Buscar el nombre de la variable (campo: nombreVariable)
                                                if(!isset($variables_nombres[$cod_var]) && isset($row['nombreVariable'])) {
                                                    $variables_nombres[$cod_var] = $row['nombreVariable'];
                                                }
                                            }
                                        }
                                        $tiene_multiples_paises = count($paises_unicos) > 1;
                                        $tiene_multiples_variables = count($variables_unicas) > 1;
                                        
                                        // Definir campos clave para período (no se muestran como columnas)
                                        $campos_periodo = array('anno', 'mes', 'periodo', 'fecha', 'annoMes');
                                        
                                        // Definir campos de valor (números que queremos mostrar)
                                        $campos_valor_posibles = array('valor', 'valorCalculado', 'dato');
                                        
                                        // Campos a excluir de las columnas (metadatos, IDs, etc)
                                        $campos_excluir = array(
                                            'id', 'idVariable', 'idCuadro', 'idPais', 'idSector', 'idSubsector',
                                            'codGeneral', 'codigoSDMX', 'estado', 'datoFicticio', 'indDatoFicticio',
                                            'Fictisio', 'anno', 'mes', 'periodo', 'fecha', 'annoMes',
                                            '_pais', '_variable', 'variable', 'pais', 'sector', 'subsector',
                                            'descripcion', 'nombreVariable' // Excluir campos descriptivos, solo queremos valor
                                        );
                                        
                                        // Solo queremos mostrar el campo "valor" (o similar)
                                        $campo_valor = null;
                                        foreach($campos_disponibles as $campo) {
                                            if(in_array(strtolower($campo), ['valor', 'valorcalculado', 'dato'])) {
                                                $campo_valor = $campo;
                                                break;
                                            }
                                        }
                                        
                                        // Si no encontramos un campo de valor estándar, usar el primero que no esté excluido
                                        if(!$campo_valor) {
                                            foreach($campos_disponibles as $campo) {
                                                if(!in_array($campo, $campos_excluir)) {
                                                    $campo_valor = $campo;
                                                    break;
                                                }
                                            }
                                        }
                                        
                                        // Agrupar datos por período y país
                                        $datos_por_periodo = array();
                                        $periodos_orden = array();
                                        
                                        foreach($all_data as $row) {
                                            // Construir clave de período
                                            $periodo_label = '';
                                            if(isset($row['annoMes'])) {
                                                $periodo_label = $row['annoMes'];
                                            } elseif(isset($row['anno']) && isset($row['mes'])) {
                                                $periodo_label = $row['anno'] . '/' . $row['mes'];
                                            } elseif(isset($row['fecha'])) {
                                                $periodo_label = $row['fecha'];
                                            } elseif(isset($row['periodo'])) {
                                                $periodo_label = $row['periodo'];
                                            } else {
                                                $periodo_label = 'Sin período';
                                            }
                                            
                                            // Guardar orden de períodos
                                            if(!in_array($periodo_label, $periodos_orden)) {
                                                $periodos_orden[] = $periodo_label;
                                            }
                                            
                                            // Obtener país y variable de este registro
                                            $row_pais = isset($row['_pais']) ? $row['_pais'] : 'N/A';
                                            $row_variable = isset($row['_variable']) ? $row['_variable'] : 'N/A';
                                            
                                            // Inicializar estructura: periodo -> pais -> variable -> valor
                                            if(!isset($datos_por_periodo[$periodo_label])) {
                                                $datos_por_periodo[$periodo_label] = array();
                                            }
                                            if(!isset($datos_por_periodo[$periodo_label][$row_pais])) {
                                                $datos_por_periodo[$periodo_label][$row_pais] = array();
                                            }
                                            if(!isset($datos_por_periodo[$periodo_label][$row_pais][$row_variable])) {
                                                $datos_por_periodo[$periodo_label][$row_pais][$row_variable] = null;
                                            }
                                            
                                            // Guardar solo el valor
                                            if($campo_valor && isset($row[$campo_valor])) {
                                                $datos_por_periodo[$periodo_label][$row_pais][$row_variable] = $row[$campo_valor];
                                            }
                                        }
                                        
                                        // Ordenar países y variables para consistencia
                                        $paises_ordenados = array_keys($paises_unicos);
                                        sort($paises_ordenados);
                                        $variables_ordenadas = array_keys($variables_unicas);
                                        sort($variables_ordenadas);
                                        
                                        // Calcular colspan: cada variable tiene 1 columna (solo valor)
                                        $cols_por_variable = 1; // Solo mostraremos el valor
                                        $total_variables = count($variables_ordenadas);
                                        $total_paises = count($paises_ordenados);
                                        ?>
                                        <thead>
                                            <!-- Fila 1: Información general -->
                                            <tr style="text-align: left!important; border:none!important;">
                                                <th colspan="<?php echo 1 + ($total_paises * $total_variables * $cols_por_variable); ?>" style="border: none!important;text-align: left!important;padding: 0;">
                                                    <p style="font-weight: bold;">Secretaría Ejecutiva del Consejo Monetario Centroamericano</p>
                                                </th>
                                            </tr>
                                            <tr style="border: none!important;">
                                                <th colspan="<?php echo 1 + ($total_paises * $total_variables * $cols_por_variable); ?>" style="border: none!important;text-align: left!important;padding: 0;">
                                                    <p style="font-weight: bold;"><?php echo esc_html($nombre_cuadro); ?></p>
                                                </th>
                                            </tr>
                                            <tr style="border: none!important;">
                                                <th colspan="<?php echo 1 + ($total_paises * $total_variables * $cols_por_variable); ?>" style="border: none!important;text-align: left!important;padding: 0;">
                                                    <p style="font-weight: bold;">Datos presentados en millones de moneda nacional</p>
                                                </th>
                                            </tr>
                                            <tr style="border: none!important;">
                                                <th colspan="<?php echo 1 + ($total_paises * $total_variables * $cols_por_variable); ?>" style="border: none!important;text-align: left!important;padding: 0;">
                                                    <p style="font-weight: bold;">Período: <?php echo esc_html($fechaInicio . ' - ' . $fechaFin); ?></p>
                                                </th>
                                            </tr>
                                            
                                            <!-- Fila 2: Agrupación por PAÍS -->
                                            <tr class="header-paises">
                                                <th rowspan="2" style="vertical-align: middle; background: #fff; color: #333; border: 1px solid #ddd;">Período</th>
                                                <?php foreach($paises_ordenados as $pais_item): ?>
                                                    <?php 
                                                    // Usar el nombre completo del país en lugar del código
                                                    $pais_nombre = isset($paises_nombres[$pais_item]) ? $paises_nombres[$pais_item] : $pais_item;
                                                    ?>
                                                    <th colspan="<?php echo $total_variables; ?>" style="text-align: center; background: #fff; color: #333; font-weight: bold; border: 1px solid #ddd;">
                                                        <?php echo esc_html($pais_nombre); ?>
                                                    </th>
                                                <?php endforeach; ?>
                                            </tr>
                                            
                                            <!-- Fila 3: VARIABLES (nombres, no códigos) -->
                                            <tr class="header-variables">
                                                <?php foreach($paises_ordenados as $pais_item): ?>
                                                    <?php foreach($variables_ordenadas as $var_codigo): ?>
                                                        <?php 
                                                        // Usar el nombre de la variable en lugar del código
                                                        $var_nombre = isset($variables_nombres[$var_codigo]) ? $variables_nombres[$var_codigo] : $var_codigo;
                                                        ?>
                                                        <th style="text-align: center; background: #fff; color: #333; font-size: 0.9rem; border: 1px solid #ddd; padding: 8px;">
                                                            <?php echo esc_html($var_nombre); ?>
                                                        </th>
                                                    <?php endforeach; ?>
                                                <?php endforeach; ?>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <?php foreach($periodos_orden as $periodo): ?>
                                                <tr>
                                                    <td style="font-weight: bold; background: #fff; border: 1px solid #ddd;">
                                                        <?php echo esc_html($periodo); ?>
                                                    </td>
                                                    <?php foreach($paises_ordenados as $pais_item): ?>
                                                        <?php foreach($variables_ordenadas as $var_codigo): ?>
                                                            <td style="text-align: right; border: 1px solid #ddd; padding: 8px;">
                                                                <?php
                                                                $valor = null;
                                                                
                                                                // Buscar valor en la estructura: periodo -> pais -> variable
                                                                if(isset($datos_por_periodo[$periodo][$pais_item][$var_codigo])) {
                                                                    $valor = $datos_por_periodo[$periodo][$pais_item][$var_codigo];
                                                                }
                                                                
                                                                // Formatear y mostrar valor
                                                                if($valor !== null && $valor !== '') {
                                                                    if(is_numeric($valor)) {
                                                                        echo number_format($valor, 2, '.', ',');
                                                                    } else {
                                                                        echo esc_html($valor);
                                                                    }
                                                                } else {
                                                                    echo '-';
                                                                }
                                                                ?>
                                                            </td>
                                                        <?php endforeach; ?>
                                                    <?php endforeach; ?>
                                                </tr>
                                            <?php endforeach; ?>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <?php else: ?>
        
        <!-- Sin datos -->
        <div class="row mt-4">
            <div class="col-12">
                <div class="alert alert-danger">
                    <h4 class="alert-heading">⚠️ No se encontraron datos</h4>
                    <p>La API EFPA no devolvió datos para los parámetros seleccionados.</p>
                    <hr>
                    <div style="background: #fff; padding: 15px; border-radius: 4px;">
                        <p style="margin: 5px 0; font-family: monospace;"><strong>Cuadro:</strong> <?php echo isset($cuadro) ? esc_html($cuadro) : 'N/A'; ?></p>
                        <p style="margin: 5px 0; font-family: monospace;"><strong>Variable:</strong> <?php echo isset($variable) ? esc_html($variable) : 'N/A'; ?></p>
                        <p style="margin: 5px 0; font-family: monospace;"><strong>País:</strong> <?php echo isset($pais) ? esc_html($pais) : 'N/A'; ?></p>
                        <p style="margin: 5px 0; font-family: monospace;"><strong>Frecuencia:</strong> <?php echo isset($frecuencia) ? esc_html($frecuencia) : 'N/A'; ?></p>
                        <p style="margin: 5px 0; font-family: monospace;"><strong>Sector:</strong> <?php echo isset($sector) ? esc_html($sector) : 'N/A'; ?></p>
                        <p style="margin: 5px 0; font-family: monospace;"><strong>Subsector:</strong> <?php echo isset($subsector) ? esc_html($subsector) : 'N/A'; ?></p>
                        <p style="margin: 5px 0; font-family: monospace;"><strong>Período:</strong> <?php echo isset($fechaInicio) ? esc_html($fechaInicio) : 'N/A'; ?> a <?php echo isset($fechaFin) ? esc_html($fechaFin) : 'N/A'; ?></p>
                    </div>
                    <hr>
                    <p class="mb-0"><strong>URL completa:</strong></p>
                    <pre style="background: #f8f9fa; padding: 10px; border-radius: 4px; font-size: 11px; overflow-x: auto; word-wrap: break-word; white-space: pre-wrap;">http://192.168.100.137:8081/simafir_api/ws/public/efpa/obtenerDatos/<?php 
                        echo isset($cuadro) ? urlencode($cuadro) : 'N/A';
                    ?>/<?php 
                        echo isset($variable) ? urlencode($variable) : 'N/A';
                    ?>/<?php 
                        echo isset($pais) ? urlencode($pais) : 'N/A';
                    ?>/<?php 
                        echo isset($frecuencia) ? urlencode($frecuencia) : 'N/A';
                    ?>/<?php 
                        echo isset($sector) ? urlencode($sector) : 'N/A';
                    ?>/<?php 
                        echo isset($subsector) ? urlencode($subsector) : 'N/A';
                    ?>?fechaInicio=<?php 
                        echo isset($fechaInicio) ? urlencode($fechaInicio) : 'N/A';
                    ?>&fechaFin=<?php 
                        echo isset($fechaFin) ? urlencode($fechaFin) : 'N/A';
                    ?>&formato=json</pre>
                    <p class="mt-2 mb-0"><small>Puedes copiar esta URL y probarla directamente en tu navegador o Postman.</small></p>
                </div>
                <a href="<?php echo home_url('/efpa-parametros/'); ?>?cuadro=<?php echo isset($cuadro) ? urlencode($cuadro) : ''; ?>" class="btn btn-secondary">
                    <i class="fa fa-arrow-left"></i> Volver
                </a>
            </div>
        </div>

        <?php endif; ?>
            </div> <!-- Cierre col-md-9 -->
        </div> <!-- Cierre row principal -->
    </div> <!-- Cierre container -->
</section>
<div class="d-none d-md-block cs-space-40"></div>

<?php if($tiene_datos_validos): ?>
<?php $json_string = json_encode($all_data); ?>
<script type="text/javascript">
jQuery(document).ready(function($) {
    // Función para copiar link (compatible con OSD)
    window.copyLink = function() {
        var copyText = document.getElementById("myInput");
        copyText.select();
        copyText.setSelectionRange(0, 99999);
        document.execCommand("copy");
        alert("Link copiado: " + copyText.value);
    }
    
    // También mantener la función para EFPA por compatibilidad
    window.copyEfpaLink = function() {
        copyLink();
    }
    
    // Exportar tabla
    function exportTableToFormat(format) {
        var table = document.querySelector('.efpa-results-table');
        if (!table) return;
        
        var data = [];
        var headers = [];
        
        // Obtener headers
        var headerRows = table.querySelectorAll('thead tr.header-variables th');
        headerRows.forEach(function(th) {
            headers.push(th.textContent.trim());
        });
        data.push(headers);
        
        // Obtener datos
        var rows = table.querySelectorAll('tbody tr');
        rows.forEach(function(tr) {
            var row = [];
            tr.querySelectorAll('td').forEach(function(td) {
                row.push(td.textContent.trim());
            });
            data.push(row);
        });
        
        if (format === 'csv') {
            var csv = data.map(function(row) {
                return row.join(',');
            }).join('\n');
            downloadFile(csv, 'efpa_datos.csv', 'text/csv');
        } else if (format === 'txt') {
            var txt = data.map(function(row) {
                return row.join('\t');
            }).join('\n');
            downloadFile(txt, 'efpa_datos.txt', 'text/plain');
        } else if (format === 'excel') {
            var html = table.outerHTML;
            downloadFile(html, 'efpa_datos.xls', 'application/vnd.ms-excel');
        }
    }
    
    function downloadFile(content, fileName, mimeType) {
        var blob = new Blob([content], { type: mimeType });
        var url = window.URL.createObjectURL(blob);
        var a = document.createElement('a');
        a.href = url;
        a.download = fileName;
        document.body.appendChild(a);
        a.click();
        document.body.removeChild(a);
        window.URL.revokeObjectURL(url);
    }
    
    // Función para exportar JSON (estilo OSD)
    function downloadJSON(data, filename) {
        const jsonString = JSON.stringify(data);
        const downloadLink = document.createElement("a");
        downloadLink.setAttribute("href", "data:text/json;charset=utf-8," + encodeURIComponent(jsonString));
        downloadLink.setAttribute("download", filename);
        document.body.appendChild(downloadLink);
        downloadLink.click();
        document.body.removeChild(downloadLink);
    }
    
    var objeto_js = JSON.parse('<?php echo $json_string; ?>');
    
    // Botón volver
    $('.hBack').on('click', function() {
        window.location.href = '<?php echo home_url('/efpa-parametros/'); ?>?cuadro=<?php echo urlencode($cuadro); ?>';
    });
    
    // Event listeners para exportar
    $('#txt').on('click', function(e) {
        e.preventDefault();
        exportTableToFormat('txt');
    });
    
    $('#csv').on('click', function(e) {
        e.preventDefault();
        exportTableToFormat('csv');
    });
    
    $('#ex').on('click', function(e) {
        e.preventDefault();
        exportTableToFormat('excel');
    });
    
    $('#dre').on('click', function(e) {
        e.preventDefault();
        console.log("Exportando JSON");
        downloadJSON(objeto_js, "efpa_data.json");
    });
});
</script>
<?php endif; ?>

<style>
/* Estilos del menú lateral tipo EMFA */
.lateral-menu {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    margin-bottom: 20px;
}

.header-lateral-menu {
    padding: 20px;
    border-bottom: 2px solid #007bff;
}

.header-lateral-menu h4 {
    margin: 0;
    color: #007bff;
    font-weight: 600;
}

.body-lateral-menu {
    padding: 10px;
}

.body-lateral-menu h3 {
    font-size: 0.85rem;
    margin: 5px 0;
    padding: 5px 8px;
    border-radius: 4px;
    transition: background-color 0.2s;
    line-height: 1.3;
}

.body-lateral-menu h3:hover {
    background-color: #f8f9fa;
}

.body-lateral-menu a {
    color: #495057;
    text-decoration: none;
}

.body-lateral-menu a:hover h3 {
    color: #007bff;
}

/* Estilos de botones de acción tipo EMFA */
.graphic-container {
    width: 100%;
}

.header-graphic {
    margin-bottom: 30px;
}

.col-space-down {
    margin-bottom: 15px;
}

.hBack {
    width: 100%;
    padding: 10px 20px;
    font-size: 14px;
    border-radius: 4px;
}

.graphic-box {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 15px;
    text-align: center;
    cursor: pointer;
    position: relative;
    transition: all 0.3s;
}

.graphic-box:hover {
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.graphic-box img {
    width: 30px;
    height: 30px;
    margin-bottom: 5px;
}

.graphic-box h5 {
    margin: 5px 0;
    font-size: 14px;
    font-weight: 600;
}

.graphic-box .arrow-down {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #333;
    margin: 5px auto;
}

.graphic-box .dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #ddd;
    border-top: none;
    z-index: 1000;
}

.graphic-box:hover .dropdown {
    display: block;
}

.graphic-box .dropdown ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.graphic-box .dropdown ul li {
    padding: 10px 20px;
    border-bottom: 1px solid #eee;
    cursor: pointer;
}

.graphic-box .dropdown ul li:hover {
    background: #f8f9fa;
}

.graphic-box .dropdown ul li a {
    text-decoration: none;
    color: #333;
    display: block;
}

/* Estilos de compartir */
.share-box-wrapper {
    position: relative;
}

.share-box {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #ddd;
    padding: 20px;
    z-index: 1000;
    border-radius: 4px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.share-box-wrapper:hover .share-box {
    display: block;
}

.share-box .social {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-bottom: 15px;
}

.share-box .social a img {
    width: 32px;
    height: 32px;
}

.share-box .share-link {
    text-align: center;
    margin-bottom: 10px;
}

.share-box .copy {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 10px;
}

.share-box .copy img {
    width: 20px;
    height: 20px;
}

.share-box .box-link input {
    width: 100%;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 12px;
}

/* Estilos de metadatos */
.graphic-blue-box {
    background: #0056b3;
    color: white;
    position: relative;
}

.graphic-blue-box .circle-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.graphic-blue-box .circle-info {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    border: 2px solid white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}

.graphic-blue-box .arrow {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid white;
    margin: 5px auto;
}

.white-box {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #ddd;
    padding: 0;
    z-index: 1000;
    border-radius: 4px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    max-height: 400px;
    overflow-y: auto;
}

.boxx:hover .white-box {
    display: block;
}

.white-box .card {
    border: none;
    border-bottom: 1px solid #eee;
}

.white-box .card-header {
    background: #f8f9fa;
    padding: 10px 15px;
}

.white-box .card-header a {
    text-decoration: none;
    color: #333;
}

.white-box .card-body {
    font-size: 12px;
}

.white-box .row {
    margin: 0;
    padding: 5px 0;
    border-bottom: 1px solid #f0f0f0;
}

/* Estilos de tabla EFPA - Estilo Excel */
.efpa-results-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    background: white;
    font-family: Arial, sans-serif;
}

.efpa-results-table thead th {
    background: #fff;
    color: #333;
    padding: 10px;
    text-align: center;
    font-weight: 600;
    border: 1px solid #ddd;
}

/* Estilos para encabezados jerárquicos - Estilo Excel simple */
.efpa-results-table .header-paises th {
    background: #fff !important;
    color: #333 !important;
    font-weight: bold;
    font-size: 13px;
    padding: 10px 8px;
    border: 1px solid #ddd !important;
    text-transform: uppercase;
}

.efpa-results-table .header-variables th {
    background: #fff !important;
    color: #333 !important;
    font-weight: 600;
    font-size: 12px;
    padding: 8px 6px;
    border: 1px solid #ddd !important;
}

.efpa-results-table tbody td {
    padding: 8px 10px;
    border: 1px solid #ddd;
    font-size: 12px;
    background: #fff;
}

.efpa-results-table tbody tr:hover {
    background: #f8f9fa;
}

.efpa-results-table tbody td:first-child {
    background: #fff;
    font-weight: bold;
    position: sticky;
    left: 0;
    z-index: 1;
    border-right: 1px solid #ddd;
}

.table-wrapper {
    overflow-x: auto;
    margin-top: 20px;
    border: 1px solid #ddd;
}

.wraper-tadiv {
    padding: 20px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

@media (max-width: 768px) {
    .lateral-menu {
        margin-bottom: 30px;
    }
    
    .col-space-down {
        margin-bottom: 10px;
    }
    
    .graphic-box {
        padding: 10px;
    }
    
    .efpa-results-table {
        font-size: 11px;
    }
}
</style>
