{* Pantalla de ajustes con diseño moderno y motivador *}
<div class="porto-admin-card">
  <div class="wb-hero">
    <div class="wb-hero-left">
      <div>
        <h2 class="wb-hero-title">{l s='Ajustes de WhatsBoost' mod='whatsboost'}</h2>
        <p class="wb-hero-subtitle">{l s='Configura y verifica tu licencia para empezar a enviar mensajes.' mod='whatsboost'}</p>
      </div>
    </div>
    <div class="wb-hero-right">
      {if isset($settings.license_key) && $settings.license_key|strlen}
        <span class="wb-badge wb-badge--ok">{l s='Licencia verificada' mod='whatsboost'}</span>
      {else}
        <span class="wb-badge wb-badge--warn">{l s='Licencia pendiente' mod='whatsboost'}</span>
      {/if}
    </div>
  </div>

  <div class="wb-grid">
    <div class="wb-card">
      <h3 class="wb-card-title">{l s='Configuración de la licencia' mod='whatsboost'}</h3>
      <p class="wb-subtle">{l s='Pega tu clave y guárdala para activar el plugin.' mod='whatsboost'}</p>

      <form action="{$admin_base|escape:'htmlall':'UTF-8'}" method="post" class="wb-license-form">
        <div class="wb-field">
          <label class="wb-label" for="wb_license_key">{l s='Clave de licencia' mod='whatsboost'}</label>
          <input class="wb-input" id="wb_license_key" name="WHATSBOOST_LICENSE_KEY" type="text" value="{$settings.license_key|escape:'htmlall':'UTF-8'}" placeholder="{l s='Pega aquí tu clave de WhatsBoost.' mod='whatsboost'}" />
          <p class="wb-help">{l s='Si aún no tienes clave, consíguela en tu panel de WhatsBoost.' mod='whatsboost'}</p>
        </div>

        <div class="wb-actions">
          <button type="submit" name="submitWhatsboost" value="1" class="wb-btn wb-btn-primary">{l s='Verificar y guardar' mod='whatsboost'}</button>
          <a href="{$admin_base|escape:'htmlall':'UTF-8'}&wbv=docs" class="wb-btn wb-btn-secondary">{l s='Ver documentación' mod='whatsboost'}</a>
        </div>
      </form>

      <div class="wb-alert wb-alert--info" role="status">
        {l s='Tras verificar la clave, recuperaremos automáticamente el ID de cuenta si está disponible.' mod='whatsboost'}
      </div>
    </div>


</div>
