:root {
    --sena-green: #035551;
    --sena-mint: #eaf4f1;
    --ink: #173331;
}

body {
    font-family: "Prompt", "Noto Sans Thai", sans-serif;
    background: #f5f8f7;
    color: var(--ink);
}

.admin-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 260px 1fr;
}

.admin-sidebar {
    background: #062d2a;
    color: #fff;
    padding: 1.25rem;
}

.admin-brand {
    display: block;
    color: #fff;
    text-decoration: none;
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 2rem;
}

.admin-nav a {
    display: block;
    color: rgba(255,255,255,.78);
    text-decoration: none;
    padding: .75rem .9rem;
    border-radius: 8px;
    margin-bottom: .35rem;
}

.admin-nav a:hover,
.admin-nav a.active {
    color: #fff;
    background: rgba(255,255,255,.12);
}

.admin-subnav {
    display: grid;
    gap: .25rem;
    margin: -.15rem 0 .55rem .75rem;
    padding-left: .75rem;
    border-left: 1px solid rgba(255,255,255,.16);
}

.admin-subnav a {
    padding: .48rem .7rem;
    font-size: .9rem;
}

.admin-main {
    min-width: 0;
}

.admin-topbar {
    height: 72px;
    background: #fff;
    border-bottom: 1px solid #e1ebe8;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.5rem;
}

.admin-content {
    padding: 1.5rem;
}

.stat-card,
.admin-card {
    background: #fff;
    border: 1px solid #e1ebe8;
    border-radius: 8px;
    padding: 1.25rem;
    box-shadow: 0 14px 35px rgba(3,85,81,.06);
}

.stat-card strong {
    display: block;
    font-size: 2rem;
    color: var(--sena-green);
}

.btn-sena {
    background: var(--sena-green);
    border-color: var(--sena-green);
    color: #fff;
}

.btn-sena:hover {
    background: #02413e;
    border-color: #02413e;
    color: #fff;
}

.badge-active {
    background: var(--sena-mint);
    color: var(--sena-green);
}

.sortable-taxonomy-table tbody tr {
    transition: background-color .15s ease, opacity .15s ease;
}

.sortable-taxonomy-table tbody tr.is-dragging {
    background: #eaf4f1;
    opacity: .72;
}

.drag-column {
    width: 48px;
}

.drag-handle {
    width: 34px;
    height: 34px;
    border: 1px solid #d7e5e1;
    border-radius: 8px;
    background: #fff;
    color: #637a76;
    cursor: grab;
    font-weight: 700;
    letter-spacing: 1px;
    line-height: 1;
}

.drag-handle:active {
    cursor: grabbing;
}

.sortable-status {
    min-height: 1.25rem;
}

.project-logo-preview {
    display: block;
    width: 120px;
    height: 72px;
    object-fit: contain;
    border: 1px solid #d7e5e1;
    border-radius: 8px;
    background: #fff;
    padding: .55rem;
}

.map-position-preview {
    position: relative;
    cursor: crosshair;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #d7e5e1;
}

.map-position-preview img {
    display: block;
    width: 100%;
}

.map-position-preview-lg {
    max-width: 1100px;
    margin-inline: auto;
}

.admin-map-marker {
    position: absolute;
    color: var(--admin-marker-color, #32bbac);
    font-size: 46px;
    line-height: 1;
    font-variation-settings: "FILL" 1, "wght" 600, "GRAD" 0, "opsz" 48;
    text-shadow: 0 2px 0 #fff, 0 -2px 0 #fff, 2px 0 0 #fff, -2px 0 0 #fff, 0 12px 24px rgba(0,0,0,.3);
    transform: translate(-50%, -100%);
}

.map-position-fields {
    max-width: 720px;
    margin-inline: auto;
}

.login-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #035551, #071111);
}

.login-card {
    width: min(420px, calc(100% - 2rem));
    background: #fff;
    border-radius: 8px;
    padding: 2rem;
}

@media (max-width: 991.98px) {
    .admin-shell {
        grid-template-columns: 1fr;
    }

    .admin-sidebar {
        position: static;
    }
}