1<style>
  2{literal}
  3.bright-lights-box {
  4    background: linear-gradient(45deg, #007bff, #00d4ff);
  5    color: white;
  6    padding: 40px;
  7    border-radius: 12px;
  8    text-align: center;
  9    box-shadow: 0 10px 30px rgba(0,123,255,0.4);
 10    margin: 20px 0;
 11    border: 3px solid #fff;
 12    animation: pulse-border 2s infinite;
 13}
 14.bright-lights-box h2, .bright-lights-box h3 { font-weight: 800; color: white; margin-bottom: 15px; }
 15.bright-lights-btn {
 16    background: #ffcc00;
 17    color: #111 !important;
 18    font-weight: bold;
 19    font-size: 1.4rem;
 20    padding: 15px 40px;
 21    border-radius: 50px;
 22    text-transform: uppercase;
 23    display: inline-block;
 24    transition: transform 0.2s;
 25    text-decoration: none;
 26}
 27.bright-lights-btn:hover { transform: scale(1.05); background: #fff; }
 28@keyframes pulse-border {
 29    0% { box-shadow: 0 0 0 0 rgba(0,123,255, 0.7); }
 30    70% { box-shadow: 0 0 0 15px rgba(0,123,255, 0); }
 31    100% { box-shadow: 0 0 0 0 rgba(0,123,255, 0); }
 32}
 33{/literal}
 34</style>
 35
 36<div class="bright-lights-box">
 37    <h3>Not a client yet?</h3>
 38    <p>View our high-performance plans and pricing here:</p>
 39    <p><small>(Redirecting to plans in <span id="countdown">5</span> seconds...)</small></p>
 40    <a href="https://theservice4u.com/all-plans" class="bright-lights-btn">Browse All Plans</a>
 41</div>
 42
 43<script>
 44{literal}
 45(function() {
 46    var seconds = 5;
 47    function countdown() {
 48        seconds--;
 49        var el = document.getElementById("countdown");
 50        if (el) el.textContent = seconds;
 51        if (seconds <= 0) {
 52            window.location = "https://theservice4u.com/all-plans";
 53        } else {
 54            setTimeout(countdown, 1000);
 55        }
 56    }
 57
 58    if (window.location.search.indexOf('gclid') > -1) {
 59        countdown();
 60    } else {
 61        setTimeout(function() {
 62            var smallTag = document.querySelector('.bright-lights-box small');
 63            if (smallTag) smallTag.style.display = 'none';
 64        }, 10);
 65    }
 66})();
 67{/literal}
 68</script>
 69<hr>
 70<div class="logincontainer{if $linkableProviders} with-social{/if}">
 71
 72    {include file="$template/includes/pageheader.tpl" title=$LANG.login desc="{$LANG.restrictedpage}"}
 73
 74    {include file="$template/includes/flashmessage.tpl"}
 75
 76    <div class="providerLinkingFeedback"></div>
 77
 78    <div class="row">
 79        <div class="col-sm-{if $linkableProviders}7{else}12{/if}">
 80
 81            <form method="post" action="{routePath('login-validate')}" class="login-form" role="form">
 82                <div class="form-group">
 83                    <label for="inputEmail">{$LANG.clientareaemail}</label>
 84                    <input type="email" name="username" class="form-control" id="inputEmail" placeholder="{$LANG.enteremail}" autofocus>
 85                </div>
 86
 87                <div class="form-group">
 88                    <label for="inputPassword">{$LANG.clientareapassword}</label>
 89                    <input type="password" name="password" class="form-control" id="inputPassword" placeholder="{$LANG.clientareapassword}" autocomplete="off" >
 90                </div>
 91
 92                <div class="checkbox">
 93                    <label>
 94                        <input type="checkbox" name="rememberme" /> {$LANG.loginrememberme}
 95                    </label>
 96                </div>
 97                {if $captcha->isEnabled()}
 98                    <div class="text-center margin-bottom">
 99                        {include file="$template/includes/captcha.tpl"}
100                    </div>
101                {/if}
102                <div align="center">
103                    <input id="login" type="submit" class="btn btn-primary{$captcha->getButtonClass($captchaForm)}" value="{$LANG.loginbutton}" /> <a href="{routePath('password-reset-begin')}" class="btn btn-default">{$LANG.forgotpw}</a>
104                </div>
105            </form>
106
107        </div>
108        <div class="col-sm-5{if !$linkableProviders} hidden{/if}">
109            {include file="$template/includes/linkedaccounts.tpl" linkContext="login" customFeedback=true}
110        </div>
111    </div>
112</div>
113