/*
 * LottoMate sticky public header
 * Path: /var/www/lottomate/assets/css/lottomate_sticky_header.css
 * Purpose: 스크롤 시 상단 헤더 고정
 */

:root{
    --lm-topbar-height:34px;
    --lm-gnb-height:74px;
}

/* 페이지 내 이동 시 헤더에 가리지 않도록 */
html{
    scroll-padding-top:calc(var(--lm-topbar-height) + var(--lm-gnb-height) + 12px);
}

/* 최상단 안내바 고정 */
.topbar,
.public-topbar,
.site-topbar{
    position:sticky !important;
    top:0 !important;
    z-index:10010 !important;
}

/* 메인 메뉴 고정 */
.gnb,
.public-header,
.site-header,
.header,
header.gnb{
    position:sticky !important;
    top:var(--lm-topbar-height) !important;
    z-index:10000 !important;
}

/* 고정 시 메뉴가 더 또렷하게 보이도록 */
.gnb,
.public-header,
.site-header,
.header,
header.gnb{
    backdrop-filter:saturate(1.15) blur(8px);
    -webkit-backdrop-filter:saturate(1.15) blur(8px);
}

/* 관리자 헤더에는 영향 주지 않음 */
.admin-header,
.admin-topbar,
.admin-layout .header,
.admin-layout .gnb{
    position:relative !important;
    top:auto !important;
}

/* 모바일에서 상단바가 숨겨지는 경우 메뉴를 맨 위에 고정 */
@media(max-width:880px){
    .topbar,
    .public-topbar,
    .site-topbar{
        position:sticky !important;
        top:0 !important;
        z-index:10010 !important;
    }

    .gnb,
    .public-header,
    .site-header,
    .header,
    header.gnb{
        top:var(--lm-topbar-height) !important;
    }

    .topbar:empty + .gnb,
    .public-topbar:empty + .public-header,
    .site-topbar:empty + .site-header{
        top:0 !important;
    }
}

/* 아주 작은 화면에서 topbar가 display:none 처리되어 있다면 메뉴를 최상단으로 */
@media(max-width:560px){
    .topbar[style*="display:none"] + .gnb,
    .public-topbar[style*="display:none"] + .public-header,
    .site-topbar[style*="display:none"] + .site-header{
        top:0 !important;
    }
}

