{% include 'header.twig' %}
<div class="top-padding"></div>
<div class="container-fluid">
  <div class="row">
    <div class="col-md-12">
      <div class="page-header-lgin">
        <div class="contpghdr">
          <span class="bdghdr threedblue">{{ site["site_name"] }}</span>
          <h2>BECOME A <span>SELLER</span></h2>
          <p>Start selling our services to your robust clients with reseller site.</p>
        </div>
        <img src="https://cdn.mypanel.link/edeed4/pniqqlc596r1hrlx.png">
      </div>
    </div>
  </div>
</div>

<div class="container-fluid">
    <div class="row">
    <div class="col-md-7">
      <div class="well">
        <div class="wellhdr">
          <div class="headrwell">
            <i class="far fa-child"></i>
            <p>
              Child Panel
            </p>
          </div>
        </div>
        
        {% if error %}
      <div class="alert alert-dismissible alert-danger">
          <button type="button" class="close" data-dismiss="alert">×</button>
        {{ errorText }}
      </div>
    {% endif %}  

     {% if data["childpanel"]["success"] == 1 %}
      <div class="alert alert-dismissible alert-success">
<p>You have successfully ordered your Child Panel.</p>
<strong> Domain: </strong> {{ data['childpanel']['link'] }} <br>
<strong> Quantity: </strong> {{ data['childpanel']['quantity'] }} <br>
<strong> Charged: </strong> {{ data['childpanel']['price'] }} <br>
<strong> Remaining balance: </strong> {{ data['childpanel']['balance'] }} <br>
</div>
{% endif %}
        
        <form action="child-panels" method="post" class="component_form_group" style="[childpanel-form_css]">
    <!-- Domain Input -->
    <div class="first">
        <div class="form-group">
            <input type="text" class="form-control" name="panel_domain" placeholder="Domain" required>
        </div>
    </div>

    <!-- Currency Selection -->
    <div class="form-group">
        <select class="form-control" name="panel_currency" required>
            {{ child_panel_currencies }}
        </select>
    </div>

    <!-- Admin Username Input -->
    <div class="form-group">
        <input type="text" class="form-control" name="admin_username" placeholder="Admin username" required>
    </div>

    <!-- Admin Password Input -->
    <div class="form-group">
        <input type="password" id="childpanel_admin_password" name="admin_password" class="form-control" placeholder="Admin password" aria-required="true" value="" autocomplete="off" required>
    </div>

    <!-- Admin Confirm Password Input -->
    <div class="form-group">
        <input type="password" id="childpanel_admin_confirm_password" class="form-control" name="admin_confirm_password" placeholder="Confirm admin password" required>
    </div>

    <!-- Panel Cost -->
    <div class="childpanelcol">
        <hr style="width: 100%; position: absolute;">
        <div class="backchildsmh">
            <small>Your Panel Cost</small>
            <h3 class="pricechildpanel">
                <small><strike>$25</strike></small>₹ {{ site['childpanel_price'] }}
            </h3>
        </div>
    </div>

    <!-- Hidden CSRF Token -->
    <input type="hidden" name="_csrf" value="">

    <!-- Submit Button -->
    <button class="btn btn-primary width-100" type="submit">Submit Order</button>

    <hr style="margin: 30px -19px 20px;">
    <small class="termschld">You can order your Child Panel monthly from here. Child Panel are non-refundable once purchased.</small>
</form>


      </div>
    </div>
    <div class="col-md-5">
      <div class="note">
        <p>
          Please update your Domain Nameservers
        </p>
      </div>

      <ul class="nsul">
                <li>
          {{ site['ns1'] }}
          <button class="copyns-button" onclick="copyToClipboard('{{ site['ns1'] }}')"><i class="ti ti-copy"></i></button>
        </li>
                <li>
         {{ site['ns2'] }}
          <button class="copyns-button" onclick="copyToClipboard('{{ site['ns2'] }}')"><i class="ti ti-copy"></i></button>
        </li>
              </ul>
      <script>
        function copyToClipboard(text) {
          const textarea = document.createElement('textarea');
          textarea.value = text;
          textarea.setAttribute('readonly', '');
          textarea.style.position = 'absolute';
          textarea.style.left = '-9999px';
          document.body.appendChild(textarea);
          textarea.select();
          document.execCommand('copy');
          document.body.removeChild(textarea);
          alert(`Copied: ${text}`); // Optional feedback to the user
        }
      </script>
      <ul class="ullistns">
        <li><i class="fas fa-circle"></i> Resell {{ site["site_name"] }} Services using your own Automated Panel.</li>
        <li><i class="fas fa-circle"></i> Establish your business with our drag-and-drop editor.</li>
        <li><i class="fas fa-circle"></i> Determine your service prices and manage your own profits.</li>
        <li><i class="fas fa-circle"></i> Start selling today by integrating multiple payment methods into your panel.</li>
        <li><i class="fas fa-circle"></i> Import all of our services to your new panel with just 1 click.</li>
      </ul>
    </div>
  </div>
  </div>

<section style="padding: 50px 0;">
  <div class="container-fluid">
    <div class="row">
      <div class="col-md-12">
        <div class="secheading">
          <h2>
            {{ site["site_name"] }} <span>Free Child Panel</span> Theme.
          </h2>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-md-4">
        <div class="cardfcp">
          <div class="fcpcont">
            <h3>
              User-Friendly
            </h3>
            <p>
              Our SMM Panel Child Panel Free Theme boasts an intuitive and user-friendly design. Navigate effortlessly through the features, making social media management simpler and more efficient for everyone, regardless of technical expertise.
            </p>
          </div>
          <img src="https://cdn.mypanel.link/edeed4/ycsx2excbwyx5rr8.png">
        </div>
      </div>
      <div class="col-md-4">
        <div class="cardfcp">
          <div class="fcpcont">
            <h3>
              Free of Cost
            </h3>
            <p>
              Enjoy all the benefits of our top-tier theme without any charges. This free theme offers premium features and customization options, providing excellent value for your social media management needs without breaking the bank.
            </p>
          </div>
          <img src="https://cdn.mypanel.link/edeed4/j0xl9ij5a267nzwc.png">
        </div>
      </div>
      <div class="col-md-4">
        <div class="cardfcp">
          <div class="fcpcont">
            <h3>
              Mobile Responsive
            </h3>
            <p>
              Ensure a seamless experience across all devices. The theme is fully mobile responsive, providing optimal functionality and aesthetics whether your users are on a desktop, tablet, or smartphone.
            </p>
          </div>
          <img src="https://cdn.mypanel.link/edeed4/arza73jbbezo7si0.png">
        </div>
      </div>
    </div>
  </div>
</section>

<section style="padding: 50px 0;">
  <div class="container-fluid">
    <div class="row">
      <div class="col-md-12">
        <div class="secheading">
          <h2>
            {{ site["site_name"] }} <span>Custom Child Panel</span> Theme.
          </h2>
        </div>
      </div>
    </div>
    <div class="row">
      <div class="col-md-4">
        <div class="cardfcp">
          <div class="fcpcont">
            <h3>
              Unique Brand Identity
            </h3>
            <p>
              Develop a custom theme that perfectly aligns with your brand’s identity. Tailor every aspect, from colors and fonts to icons and layouts, to create a distinctive and cohesive look that sets you apart from the competition.
            </p>
          </div>
          <img src="https://cdn.mypanel.link/edeed4/b4pbb07itte3mi7w.png">
        </div>
      </div>
      <div class="col-md-4">
        <div class="cardfcp">
          <div class="fcpcont">
            <h3>
              Advanced Functionality
            </h3>
            <p>
              Incorporate advanced features and functionality tailored to your specific needs. Whether it's custom widgets, specialized plugins, or unique interactive elements, a custom theme can provide the exact tools your business requires.
            </p>
          </div>
          <img src="https://cdn.mypanel.link/edeed4/ttoluooxyxjpb888.png">
        </div>
      </div>
      <div class="col-md-4">
        <div class="cardfcp">
          <div class="fcpcont">
            <h3>
              Enhanced User Experience
            </h3>
            <p>
              Focus on user-centric design to improve the overall experience. A custom theme allows you to optimize the interface and navigation, making it easier for users to find what they need and engage with your content.
            </p>
          </div>
          <img src="https://cdn.mypanel.link/edeed4/ot5u7cfx58fe77pj.png">
        </div>
      </div>
    </div>
  </div>
</section>

<footer>
      <div class="container-fluid">
        <div class="row">
          <div class="col-sm-6">
            <a class="footer-brand" href="/"> <img style="max-width:205px;" src="{{ site['logo'] }}" alt="{{ site["site_name"] }}" title="{{ site["site_name"] }}"> </a>
          </div>
          <div class="col-sm-6">
            <p class="footerp">
              © 2021-2024, {{ site["site_name"] }}, Inc. or its affiliates
            </p>
          </div>
        </div>
      </div>
    </footer>
{% include 'footer.twig' %}