<?php

$user = $_SESSION['user'];
?>


<nav class="navbar navbar-expand-lg navbar-light bg-transparent shadow-sm mb-3">
  <div class="container">

    <button class="navbar-toggler" type="button"
      data-bs-toggle="collapse"
      data-bs-target="#navbarMenu">
      <span class="navbar-toggler-icon"></span>
    </button>

    <div class="collapse navbar-collapse" id="navbarMenu">

      <ul class="navbar-nav me-auto">

        <li class="nav-item">
          <a class="nav-link active" href="<?= url('HOME') ?>">
            <i class="bi bi-house-door me-1"></i> Home
          </a>
        </li>

        <li class="nav-item">
          <a class="nav-link" href="<?= url('INCIDENT') ?>">
            <i class="bi bi-plus-circle me-1"></i>
            Incident
          </a>
        </li>

        <li class="nav-item">
          <a class="nav-link" href="<?= url('REQUEST') ?>">
            <i class="bi bi-ticket-perforated me-1"></i> Request
          </a>
        </li>

        <li class="nav-item">
          <a class="nav-link" href="<?= url('MY_ACTIVITY') ?>">
            <i class="bi bi-journal-text me-1"></i> My Activity
          </a>
        </li>

      </ul>


    </div>

  </div>
</nav>

<div class="card border-0 shadow-sm mb-4 bg-bsi text-white">
  <div class="card-body p-5 d-flex justify-content-between align-items-center">

    <div>
      <h2 class="fw-bold">Assalamu'alaikum, <?= $user['nama'] ?> 👋</h2>

      <p class="mb-4 opacity-75">
        Laporkan kendala perangkat, aplikasi, jaringan, maupun
        akses sistem perbankan dengan mudah.
      </p>

      <a href="<?= url('REQUEST_TIKET') ?>" class="btn bg-bsi-yellow">
        <i class="bi bi-plus-circle"></i>
        Buat Tiket
      </a>
    </div>

    <div>
      <i class="bi bi-headset display-1 opacity-50"></i>
    </div>

  </div>
</div>


<div class="row g-4 mb-4">

  <div class="col-md-6">
    <div class="card border-0 shadow-sm h-100 quick-action">
      <div class="card-body p-4">

        <div class="d-flex align-items-center mb-3">
          <div class="rounded-circle bg-danger-subtle text-white fw-semibold d-flex align-items-center justify-content-center p-3 me-3"
            style="width:54px;height:54px;">
            <i class="bi bi-exclamation-triangle-fill text-danger fs-3"></i>
          </div>

          <div>
            <h5 class="fw-bold mb-1">Request Insiden</h5>
            <small class="text-muted">
              Laporkan gangguan atau masalah pada layanan IT.
            </small>
          </div>
        </div>

        <p class="text-muted mb-4">
          Digunakan ketika terjadi kendala yang menghambat pekerjaan,
          seperti aplikasi tidak dapat diakses, komputer bermasalah,
          printer error, jaringan terputus, atau email tidak berfungsi.
        </p>

        <a href="<?= url('INCIDENT') ?>"
          class="btn bg-bsi text-white">
          <i class="bi bi-plus-circle me-1"></i>
          Buat Laporan Insiden
        </a>

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

  <div class="col-md-6">
    <div class="card border-0 shadow-sm h-100 quick-action">
      <div class="card-body p-4">

        <div class="d-flex align-items-center mb-3">
          <div class="rounded-circle bg-warning-subtle text-white fw-semibold d-flex align-items-center justify-content-center p-3 me-3"
            style="width:54px;height:54px;">
            <i class="bi bi-folder2-open text-warning fs-3"></i>
          </div>

          <div>
            <h5 class="fw-bold mb-1">Request Layanan IT</h5>
            <small class="text-muted">
              Ajukan permintaan layanan atau kebutuhan operasional.
            </small>
          </div>
        </div>

        <p class="text-muted mb-4">
          Digunakan untuk permintaan layanan seperti penyediaan data,
          rekening koran, pembuatan akun, reset password, akses aplikasi,
          atau kebutuhan administrasi IT lainnya.
        </p>

        <a href="<?= url('REQUEST') ?>"
          class="btn bg-bsi-yellow">
          <i class="bi bi-send me-1"></i>
          Ajukan Layanan IT
        </a>

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

</div>