@charset "utf-8";

/**
 * @project ZZAN NeonLime Board Skin
 * @author ZZAN Studio
 * @copyright (c) ZZAN Studio. All rights reserved.
 * @description Global board styles and common components for ZZAN NeonLime theme.
 */

:root {
    --zzan-radius: 16px;
}

.zzan-board-wrapper { 
    max-width: 1200px; margin: 0 auto; padding: 50px 15px 15px; 
    color: var(--zzan-text); position: static !important; z-index: 1; box-sizing: border-box; 
}

@media screen and (max-width: 768px) {
    .zzan-board-wrapper { padding: 10px 4px !important; }
}

@font-face {
    font-family: 'Montserrat';
    src: local('Montserrat SemiBold'), local('Montserrat-SemiBold');
    font-weight: 700 900;
    font-display: swap;
}

.btn-zzan-primary { 
    display: inline-block; background: var(--zzan-neon); color: #000 !important; 
    padding: 10px 28px; border-radius: 50px; font-weight: 800; font-size: 14px; 
    transition: 0.3s; border: none; cursor: pointer; text-align: center; 
    position: relative; overflow: hidden;
}
.btn-zzan-primary::after { 
    content: ''; position: absolute; top: -50%; left: -60%; width: 20%; height: 200%; 
    background: rgba(255,255,255,0.3); transform: rotate(30deg); transition: 0.5s; 
}
.btn-zzan-primary:hover::after { left: 120%; }

.btn-zzan-manage { 
    display: inline-flex; align-items: center; background: #333; color: #fff !important; 
    padding: 10px 24px; border-radius: 50px; font-weight: 800; font-size: 14px; 
    transition: 0.3s; border: none; cursor: pointer; 
}
.btn-zzan-manage:hover { background: #000; transform: translateY(-2px); box-shadow: 0 5px 15px rgba(0,0,0,0.2); }

.btn-zzan-cancel { 
    display: inline-block; background: #f4f4f4; color: #666; padding: 10px 28px; 
    border-radius: 50px; font-weight: 800; font-size: 14px; transition: 0.3s; 
    border: none; cursor: pointer; text-align: center;
}
.btn-zzan-cancel:hover { background: #eee; color: #333; }

.zzan-new-icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 18px; height: 18px; background: var(--zzan-neon); color: #000 !important;
    font-size: 10px; font-weight: 900; border-radius: 50%; margin-left: 5px;
    vertical-align: middle; line-height: 1;
    position: relative; top: 1px;
}

.comment-count, .cmt-count { 
    color: var(--zzan-neon) !important; font-weight: 800; 
    font-family: 'Montserrat', sans-serif; font-size: 0.9em; margin-left: 8px; 
}

.profile-img { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; border: 1px solid var(--zzan-border); flex-shrink: 0; }

.no-img-svg { 
    display: flex; align-items: center; justify-content: center; 
    background: var(--zzan-menu-hover-bg); color: var(--zzan-gray-text); 
    overflow: hidden;
}
.no-img-svg svg { width: 60%; height: 60%; opacity: 0.6; }

.zzan-mobile-only { display: none !important; }
.zzan-pc-only { display: flex !important; }

[data-theme='dark'] .btn-zzan-manage { background: #444; }
[data-theme='dark'] .btn-zzan-manage:hover { background: #555; }

@media screen and (max-width: 768px) {
    .zzan-pc-only { display: none !important; }
    .zzan-mobile-only { display: block !important; }
}
