<?php
// ======================================================
// WIZARD 2 - Contacto, ciudad y clima
// Todo en un solo archivo
// ======================================================

// include 'sesion.php';
include 'concha.php';
include 'concha_extras.php';

if (session_status() === PHP_SESSION_NONE) {
    @session_start();
}

function h($v) {
    return htmlspecialchars((string)$v, ENT_QUOTES, 'UTF-8');
}

function limpiar_post($conn, $campo) {
    return isset($_POST[$campo]) ? $conn->real_escape_string(trim($_POST[$campo])) : '';
}

$guardado_ok = false;
$error = '';

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $emailsitio2    = limpiar_post($conn, 'emailsitio2');
    $contacto2      = limpiar_post($conn, 'contacto2');
    $localidad2     = limpiar_post($conn, 'localidad2');
    $provincia2     = limpiar_post($conn, 'provincia2');
    $infoclima4     = limpiar_post($conn, 'infoclima4');
    $nombre_tiempo4 = limpiar_post($conn, 'nombre_tiempo4');

    if ($emailsitio2 === '') {
        $error = 'Debes completar el email del sitio.';
    } elseif ($localidad2 === '') {
        $error = 'Debes completar la ciudad o localidad.';
    } else {
        $ok1 = $conn->query("UPDATE `$basedatos`.`configuracion` SET `emailsitio` = '$emailsitio2'");
        $ok2 = $conn->query("UPDATE `$basedatos`.`configuracion` SET `contacto` = '$contacto2'");
        $ok3 = $conn->query("UPDATE `$basedatos`.`configuracion` SET `localidad` = '$localidad2'");
        $ok4 = $conn->query("UPDATE `$basedatos`.`configuracion` SET `provincia` = '$provincia2'");
        $ok5 = $conn->query("UPDATE `$basedatos`.`configuracion` SET `infoclima` = '$infoclima4'");
        $ok6 = $conn->query("UPDATE `$basedatos`.`configuracion` SET `nombre_tiempo` = '$nombre_tiempo4'");

        if ($ok1 && $ok2 && $ok3 && $ok4 && $ok5 && $ok6) {
            $guardado_ok = true;

            $emailsitio    = $emailsitio2;
            $contacto      = $contacto2;
            $localidad     = $localidad2;
            $provincia     = $provincia2;
            $infoclima     = $infoclima4;
            $nombre_tiempo = $nombre_tiempo4;
        } else {
            $error = 'No se pudieron guardar los datos del paso 2. Revisá la tabla configuracion o la conexión.';
        }
    }
}

$tour = isset($_GET['tour']) ? (int)$_GET['tour'] : 1;
?>
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="utf-8">
    <meta name="description" content="Wizard inicial del portal">
    <meta name="author" content="<?php echo h($nombresitio); ?>">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title><?php echo h($nombresitio); ?> - Wizard Paso 2</title>

    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">

    <style type="text/css">
        *{
            border-radius: 0 !important;
            box-sizing: border-box;
        }

        body{
            background: #eef2f7;
            font-family: Arial, Helvetica, sans-serif;
            color: #22303c;
        }

        .wizard-wrap{
            max-width: 980px;
            margin: 30px auto;
        }

        .wizard-card{
            background: #fff;
            border: 1px solid #dce4ec;
            box-shadow: 0 12px 35px rgba(0,0,0,0.06);
        }

        .wizard-head{
            background: linear-gradient(135deg, #0066FF 0%, #0a4fc7 100%);
            color: #fff;
            padding: 32px;
        }

        .wizard-head h1{
            font-size: 32px;
            margin: 0 0 10px 0;
            font-weight: bold;
        }

        .wizard-head p{
            margin: 0;
            font-size: 16px;
            line-height: 1.6;
        }

        .wizard-progress{
            background: #f7f9fc;
            border-top: 1px solid rgba(255,255,255,0.10);
            border-bottom: 1px solid #e2e8ef;
            padding: 16px 32px;
            font-size: 15px;
        }

        .wizard-progress strong{
            color: #0066FF;
        }

        .wizard-body{
            padding: 32px;
        }

        .bloque-info{
            background: #f8fbff;
            border-left: 4px solid #0066FF;
            padding: 18px;
            margin-bottom: 28px;
            line-height: 1.6;
        }

        .bloque-actual{
            background: #fbfcfe;
            border: 1px solid #e3e9f0;
            padding: 20px;
            margin-bottom: 28px;
        }

        .bloque-actual h3{
            margin: 0 0 15px 0;
            font-size: 20px;
            color: #1d2b39;
            font-weight: bold;
        }

        .actual-item{
            margin-bottom: 14px;
            padding-bottom: 14px;
            border-bottom: 1px solid #edf2f7;
        }

        .actual-item:last-child{
            margin-bottom: 0;
            padding-bottom: 0;
            border-bottom: 0;
        }

        .actual-label{
            font-size: 13px;
            color: #6b7b8b;
            text-transform: uppercase;
            font-weight: bold;
            margin-bottom: 4px;
        }

        .actual-value{
            font-size: 16px;
            color: #22303c;
            word-break: break-word;
        }

        .seccion-titulo{
            font-size: 24px;
            font-weight: bold;
            margin-bottom: 20px;
            color: #1d2b39;
        }

        .form-group label{
            font-weight: bold;
            margin-bottom: 8px;
            color: #22303c;
        }

        .form-control{
            min-height: 46px;
            border: 1px solid #cfd8e2;
            box-shadow: none !important;
        }

        textarea.form-control{
            min-height: 120px;
            resize: vertical;
        }

        .ayuda{
            display: block;
            margin-top: 6px;
            color: #6c7c8d;
            font-size: 13px;
        }

        .wizard-footer{
            border-top: 1px solid #e4ebf2;
            padding: 22px 32px;
            background: #fafcff;
        }

        .btn-wizard{
            background: #0066FF;
            border: 1px solid #0066FF;
            color: #fff;
            padding: 12px 24px;
            font-weight: bold;
        }

        .btn-wizard:hover{
            background: #0055d4;
            border-color: #0055d4;
            color: #fff;
        }

        .btn-light2{
            background: #fff;
            border: 1px solid #ccd6e0;
            color: #334455;
            padding: 12px 24px;
            font-weight: bold;
            text-decoration: none;
            display: inline-block;
        }

        .btn-light2:hover{
            text-decoration: none;
            color: #22303c;
            background: #f7f9fc;
        }

        .alert{
            border-radius: 0 !important;
        }

        @media (max-width: 767px){
            .wizard-head,
            .wizard-progress,
            .wizard-body,
            .wizard-footer{
                padding: 20px;
            }

            .wizard-head h1{
                font-size: 25px;
            }

            .seccion-titulo{
                font-size: 21px;
            }
        }
    </style>
</head>
<body>

<?php
if ($estiloweb == 9 || $estiloweb == 85 || $estiloweb == 86) {
    include 'menu_estilo9.php';
} else {
    if ($tour != 1) {
        echo '<div class="container" style="background-color:#F1F2ED;">';
        include 'menu.php';
        echo '</div>';
    }
}
?>

<div class="wizard-wrap">
    <div class="wizard-card">

        <div class="wizard-head">
            <h1>Asistente inicial del portal</h1>
            <p>
                En este paso configurás los datos de contacto básicos del sitio, la ciudad del portal
                y la información relacionada al clima para que todo quede correctamente presentado desde el inicio.
            </p>
        </div>

        <div class="wizard-progress">
            <strong>Paso 2 de 8:</strong> Datos de contacto, ciudad y clima
        </div>

        <div class="wizard-body">

            <?php if ($guardado_ok) { ?>
                <div class="alert alert-success">
                    Los datos del paso 2 se guardaron correctamente.
                </div>
            <?php } ?>

            <?php if ($error != '') { ?>
                <div class="alert alert-danger">
                    <?php echo h($error); ?>
                </div>
            <?php } ?>

            <div class="bloque-info">
                Este paso define cómo se presenta tu portal hacia afuera. Acá cargás el email principal,
                la información de contacto visible, la ciudad o localidad del medio y los datos que usará
                el bloque de clima si tu diseño lo muestra.
            </div>

            <div class="bloque-actual">
                <h3>Valores actuales del sitio</h3>

                <div class="actual-item">
                    <div class="actual-label">Email actual</div>
                    <div class="actual-value">
                        <?php echo $emailsitio != '' ? h($emailsitio) : 'No definido todavía'; ?>
                    </div>
                </div>

                <div class="actual-item">
                    <div class="actual-label">Contacto actual</div>
                    <div class="actual-value">
                        <?php echo $contacto != '' ? nl2br(h($contacto)) : 'No definido todavía'; ?>
                    </div>
                </div>

                <div class="actual-item">
                    <div class="actual-label">Ciudad / localidad actual</div>
                    <div class="actual-value">
                        <?php echo $localidad != '' ? h($localidad) : 'No definida todavía'; ?>
                    </div>
                </div>

                <div class="actual-item">
                    <div class="actual-label">Provincia actual</div>
                    <div class="actual-value">
                        <?php echo $provincia != '' ? h($provincia) : 'No definida todavía'; ?>
                    </div>
                </div>

                <div class="actual-item">
                    <div class="actual-label">URL de clima actual</div>
                    <div class="actual-value">
                        <?php echo $infoclima != '' ? h($infoclima) : 'No definida todavía'; ?>
                    </div>
                </div>

                <div class="actual-item">
                    <div class="actual-label">Nombre visible del clima</div>
                    <div class="actual-value">
                        <?php echo $nombre_tiempo != '' ? h($nombre_tiempo) : 'No definido todavía'; ?>
                    </div>
                </div>
            </div>

            <div class="seccion-titulo">Editar paso 2</div>

            <form method="post" action="wizard.2.php?tour=1">

                <div class="form-group">
                    <label for="emailsitio2">Email principal del sitio</label>
                    <input
                        class="form-control"
                        name="emailsitio2"
                        type="text"
                        id="emailsitio2"
                        value="<?php echo h($emailsitio); ?>"
                        required
                    />
                    <span class="ayuda">
                        Ejemplo: contacto@tusitio.com.ar
                    </span>
                </div>

                <div class="form-group">
                    <label for="contacto2">Texto de contacto</label>
                    <textarea
                        class="form-control"
                        name="contacto2"
                        id="contacto2"
                    ><?php echo h($contacto); ?></textarea>
                    <span class="ayuda">
                        Podés poner dirección, teléfonos, horarios, descripción del medio o forma de contacto.
                    </span>
                </div>

                <div class="form-group">
                    <label for="localidad2">Ciudad o localidad</label>
                    <input
                        class="form-control"
                        name="localidad2"
                        type="text"
                        id="localidad2"
                        value="<?php echo h($localidad); ?>"
                        required
                    />
                    <span class="ayuda">
                        Ejemplo: Las Rosas, Rosario, Córdoba, Buenos Aires.
                    </span>
                </div>

                <div class="form-group">
                    <label for="provincia2">Provincia</label>
                    <input
                        class="form-control"
                        name="provincia2"
                        type="text"
                        id="provincia2"
                        value="<?php echo h($provincia); ?>"
                    />
                    <span class="ayuda">
                        Ejemplo: Santa Fe, Córdoba, Buenos Aires.
                    </span>
                </div>

                <div class="form-group">
                    <label for="infoclima4">URL del clima</label>
                    <input
                        class="form-control"
                        name="infoclima4"
                        type="text"
                        id="infoclima4"
                        value="<?php echo h($infoclima); ?>"
                    />
                    <span class="ayuda">
                        Si tu sitio usa InfoClima u otra URL para mostrar el clima, colocala completa acá.
                    </span>
                </div>

                <div class="form-group mb-0">
                    <label for="nombre_tiempo4">Nombre visible del clima</label>
                    <input
                        class="form-control"
                        name="nombre_tiempo4"
                        type="text"
                        id="nombre_tiempo4"
                        value="<?php echo h($nombre_tiempo); ?>"
                    />
                    <span class="ayuda">
                        Ejemplo: Las Rosas, Rosario, Córdoba Capital.
                    </span>
                </div>

                <div class="wizard-footer mt-4">
                    <div class="d-flex justify-content-between align-items-center flex-wrap">
                        <div>
                            <a href="wizard.1.php" class="btn-light2">Volver al paso 1</a>
                            <a href="index.php" class="btn-light2 ml-2">Salir del wizard</a>
                        </div>

                        <div>
                            <button type="submit" class="btn btn-wizard">Guardar paso 2</button>
                            <a href="wizard.3.php" class="btn btn-wizard ml-2">Ir al paso 3</a>
                        </div>
                    </div>
                </div>

            </form>

        </div>
    </div>
</div>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
</body>
</html>