<!doctype html>
<html lang="ko"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title th:text="${siteInfo.adminTitle + ' | ' + (pageTitle != null ? pageTitle : '관리자')}">국제오토텍 관리자</title>
    <link rel="stylesheet" th:href="@{/resources/kr/iotdoor/boot/admin/css/admin-template.css}">
    <link rel="stylesheet" th:href="@{/resources/kr/iotdoor/boot/admin/css/admin-custom.css}">
    <th:block layout:fragment="pageStyles"></th:block>
</head>
<body class="bg-gray-50">
<div class="iotdoor-admin-shell">
    <aside class="iotdoor-admin-sidebar border-r border-gray-200 bg-white">
        <div class="border-b border-gray-200 px-5 py-8">
            <a class="block" th:href="@{/mfuc/index.do}">
                <div class="text-[11px] font-semibold uppercase tracking-[0.32em] text-brand-500">IOTDOOR</div>
                <div class="mt-2 text-xl font-semibold text-gray-900" th:text="${siteInfo.adminTitle}">국제오토텍 관리자</div>
                <p class="mt-2 text-sm text-gray-500">외부 관리자 템플릿 스타일을 적용한 운영 콘솔입니다.</p>
            </a>
        </div>

        <div class="px-5 py-6">
            <nav class="mb-6">
                <h2 class="mb-4 text-xs uppercase leading-[20px] text-gray-400">Admin Menu</h2>
                <ul class="flex flex-col gap-4">
                    <li>
                        <a class="menu-item group"
                           th:classappend="${adminMenu == 'dashboard'} ? ' menu-item-active' : ' menu-item-inactive'"
                           th:href="@{/mfuc/index.do}">
                            <span class="menu-item-icon-size"
                                  th:classappend="${adminMenu == 'dashboard'} ? ' menu-item-icon-active' : ' menu-item-icon-inactive'">
                                <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path d="M3 13.2C3 11.33 3 10.394 3.402 9.658c.352-.645.91-1.17 1.589-1.495C5.765 7.8 6.65 7.8 8.421 7.8h7.158c1.771 0 2.656 0 3.43.363.678.325 1.236.85 1.588 1.495.403.736.403 1.671.403 3.542v2.4c0 1.68 0 2.52-.327 3.162a3 3 0 0 1-1.311 1.311C18.72 20.4 17.88 20.4 16.2 20.4H7.8c-1.68 0-2.52 0-3.162-.327a3 3 0 0 1-1.311-1.311C3 18.12 3 17.28 3 15.6v-2.4Z" stroke="currentColor" stroke-width="1.5"/>
                                    <path d="M7.2 7.8V6.6a4.8 4.8 0 1 1 9.6 0v1.2" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
                                </svg>
                            </span>
                            <span class="menu-item-text">Dashboard</span>
                        </a>
                    </li>
                    <li>
                        <a class="menu-item group"
                           th:classappend="${adminMenu == 'user'} ? ' menu-item-active' : ' menu-item-inactive'"
                           th:href="@{/mfuc/user/list.do}">
                            <span class="menu-item-icon-size"
                                  th:classappend="${adminMenu == 'user'} ? ' menu-item-icon-active' : ' menu-item-icon-inactive'">
                                <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path d="M12 12a4.2 4.2 0 1 0 0-8.4 4.2 4.2 0 0 0 0 8.4ZM4.8 20.4a7.2 7.2 0 0 1 14.4 0" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
                                </svg>
                            </span>
                            <span class="menu-item-text">사용자 관리</span>
                        </a>
                    </li>
                    <li>
                        <a class="menu-item group"
                           th:classappend="${adminMenu == 'portfolio'} ? ' menu-item-active' : ' menu-item-inactive'"
                           th:href="@{/mfuc/portfolio/list.do}">
                            <span class="menu-item-icon-size"
                                  th:classappend="${adminMenu == 'portfolio'} ? ' menu-item-icon-active' : ' menu-item-icon-inactive'">
                                <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path d="M4.8 5.4h14.4A1.8 1.8 0 0 1 21 7.2v9.6a1.8 1.8 0 0 1-1.8 1.8H4.8A1.8 1.8 0 0 1 3 16.8V7.2a1.8 1.8 0 0 1 1.8-1.8Z" stroke="currentColor" stroke-width="1.5"/>
                                    <path d="m7.2 14.4 2.7-2.7 2.1 2.1 3.6-3.6 1.8 1.8" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
                                    <circle cx="8.1" cy="9" r="1.2" fill="currentColor"/>
                                </svg>
                            </span>
                            <span class="menu-item-text">포트폴리오 관리</span>
                        </a>
                    </li>
                    <li>
                        <a class="menu-item group"
                           th:classappend="${adminMenu == 'contact'} ? ' menu-item-active' : ' menu-item-inactive'"
                           th:href="@{/mfuc/contact/list.do}">
                            <span class="menu-item-icon-size"
                                  th:classappend="${adminMenu == 'contact'} ? ' menu-item-icon-active' : ' menu-item-icon-inactive'">
                                <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path d="M4.8 6h14.4A1.8 1.8 0 0 1 21 7.8v8.4a1.8 1.8 0 0 1-1.8 1.8H4.8A1.8 1.8 0 0 1 3 16.2V7.8A1.8 1.8 0 0 1 4.8 6Z" stroke="currentColor" stroke-width="1.5"/>
                                    <path d="m5.4 8.1 5.532 4.147a1.8 1.8 0 0 0 2.136 0L18.6 8.1" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/>
                                </svg>
                            </span>
                            <span class="menu-item-text">문의내역 관리</span>
                        </a>
                    </li>
                </ul>
            </nav>
        </div>
    </aside>

    <div class="iotdoor-admin-main">
        <header class="sticky top-0 z-999 bg-white/95 border-b border-gray-200 backdrop-blur-sm">
            <div class="flex flex-col gap-4 px-4 py-4 md:flex-row md:items-center md:justify-between md:px-6">
                <div>
                    <p class="text-sm text-gray-500">운영 중인 관리자</p>
                    <h1 class="text-xl font-semibold text-gray-900" th:text="${pageTitle != null ? pageTitle : '관리자'}">관리자</h1>
                    <p class="mt-1 text-sm text-gray-500" th:text="${pageDescription != null ? pageDescription : ''}"></p>
                </div>
                <div class="flex flex-wrap items-center gap-3">
                    <a class="inline-flex items-center gap-2 rounded-lg border border-gray-200 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50"
                       th:href="@{/}">
                        공개 사이트
                    </a>
                    <div class="inline-flex items-center gap-3 rounded-full bg-gray-100 px-4 py-2 text-sm text-gray-600">
                        <span class="inline-flex size-8 items-center justify-center rounded-full bg-brand-500 text-xs font-semibold text-white"
                              th:text="${currentAdminName != null and !#strings.isEmpty(currentAdminName) ? #strings.substring(currentAdminName, 0, 1) : 'A'}">관</span>
                        <span th:text="${currentAdminName}">관리자</span>
                    </div>
                    <form method="post" th:action="@{/comn/user/login/logout.do}">
                        <input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}">
                        <button class="inline-flex items-center gap-2 rounded-lg bg-brand-500 px-4 py-2 text-sm font-medium text-white hover:bg-brand-600"
                                type="submit">
                            로그아웃
                        </button>
                    </form>
                </div>
            </div>
        </header>

        <main class="mx-auto max-w-(--breakpoint-2xl) p-4 md:p-6">
            <div layout:fragment="content"></div>
        </main>
    </div>
</div>

<script th:src="@{/resources/kr/iotdoor/boot/admin/js/iotdoor.js}"></script>
<th:block layout:fragment="pageScripts"></th:block>
</body>
</html>
