<?php


include('navlist.php');

?>

<div style="margin-top: 15px" class="hp-main-layout-content">
  <div class="page-header-modern">
            <h2 class=""></h2>

    <div class="user-dropdown dropdown">
        <button class="btn btn-user" type="button" data-toggle="dropdown">
            <i class=""></i>
             <img src="images/icon/invoice360-user.png" height=30px; width=30px;>
            <span class="caret"></span>
        </button>

        <ul class="dropdown-menu user-menu" aria-labelledby="userDropdown">
            <li>
                <a class="dropdown-item" href="">
                    <i class="fa fa-user me-2"></i> <?php echo strtok($_SESSION['user_name'], ' ');?> (<?php echo $_SESSION['role']; ?>)
                </a>
            </li>

            <li>
                <a class="dropdown-item" href="Admin/payment-details.php">
                    <i class="fa fa-credit-card"></i> Billing history
                </a>
            </li>

            <li>
                <a class="dropdown-item" href="Admin/company-profile.php">
                    <i class="fa fa-cog me-2"></i> Settings
                </a>
            </li>

            <li><hr class="dropdown-divider"></li>

            <li>
                <a class="dropdown-item text-danger" href="logout.php">
                    <i class="fa fa-sign-out me-2"></i> Sign Out
                </a>
            </li>
        </ul>
        </div>
    </div> 
	
                <div class="row mb-32 gy-32">
                <div class="col-12">
   				
                
    

                    <div class="content-body">
    <div class="container-fluid">
     
   <?php

if (!isset($_GET['id'])) {
    	echo "
        <script>
            alert('Invalid Invoice');
            window.location.href = 'invoice-list.php';
        </script>
        ";
        exit;
}

$invoice = $_GET['id'];
?>


    <style>
:root {
    --primary: #2c5364;
    --primary-dark: #1f3b48;
    --bg: #f4f6f8;
    --border: #e5e7eb;
    --text: #1f2937;
    --muted: #6b7280;
}

body {
    font-family: "Segoe UI", Arial, sans-serif;
    background: var(--bg);
    margin: 0;
    padding: 0;
}

.box {
    max-width: 480px;
    margin: 90px auto;
    background: #ffffff;
    padding: 32px;
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(0,0,0,.08);
}

.box h2 {
    margin: 0 0 6px;
    font-size: 22px;
    color: var(--text);
}

.box p {
    margin: 0 0 24px;
    font-size: 14px;
    color: var(--muted);
}

.form-group {
    margin-bottom: 20px;
}

label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 6px;
}

textarea {
    width: 100%;
    min-height: 90px;
    padding: 12px 14px;
    font-size: 14px;
    border-radius: 8px;
    border: 1px solid var(--border);
    resize: vertical;
    transition: border-color .2s, box-shadow .2s;
}

textarea::placeholder {
    color: #9ca3af;
}

textarea:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(44,83,100,.15);
}

button {
    width: 100%;
    padding: 13px;
    background: var(--primary);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background .2s, transform .1s, box-shadow .1s;
}

button:hover {
    background: var(--primary-dark);
    box-shadow: 0 6px 16px rgba(0,0,0,.15);
}

button:active {
    transform: translateY(1px);
}
</style>

<div class="box">
    <h2>Share Invoice</h2>
    <p>Send this invoice securely to one or more recipients.</p>

    <form method="POST" action="endpoint/invoice-share-send.php">
        <input type="hidden" name="invoice" value="<?= htmlspecialchars($invoice) ?>">

        <div class="form-group">
            <label>Recipient Email(s)</label>
            <textarea 
                name="emails" 
                placeholder="customer@email.com, finance@email.com"
                required></textarea>
        </div>

        <button type="submit">Send Invoice</button>
    </form>
</div>

 
   
    
    
    <script src="app-assets/js/plugin/swiper-bundle.min.js"></script>
    <script src="app-assets/js/plugin/jquery.mask.min.js"></script>
    <script src="app-assets/js/plugin/autocomplete.min.js"></script>
    <script src="app-assets/js/plugin/moment.min.js"></script>

    <!-- Layouts -->
    <script src="app-assets/js/layouts/header-search.js"></script>
    <script src="app-assets/js/layouts/sider.js"></script>
    <script src="app-assets/js/components/input-number.js"></script>

    <!-- Base -->
    <script src="app-assets/js/base/index.js"></script>
    <!-- Customizer -->
    <script src="app-assets/js/customizer.js"></script>

    <!-- Charts -->
    <script src="app-assets/js/plugin/apexcharts.min.js"></script>
    <script src="app-assets/js/charts/apex-chart.js"></script>

    <!-- Cards -->
    <script src="app-assets/js/cards/card-advance.js"></script>
    <script src="app-assets/js/cards/card-analytic.js"></script>
    <script src="app-assets/js/cards/card-statistic.js"></script>

    <!-- Pages -->
    <script src="app-assets/js/pages/dashboard-ecommerce.js"></script>

    <!-- Custom -->
    <script src="assets/js/main.js"></script>  
    
    <script> $('#data-table').DataTable({
  "order": [[2, "desc"]] // 0-based index: column 2 = Issue Date
});



</script>
</body>


</html>