/* 그린콜아웃 + 불렛 트리거 + 갤러리 */
/* PC: 3그리드 / 모바일: 스와이프 */
/* 랜딩페이지 : must visit museum */

/*==========================================
🟩 [타입 D] 녹색 콜아웃 + 글머리 기호(불렛) 트리거
랜딩-뮤지엄 3칼럼 뷰
==========================================*/

.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) {
  background-color: transparent !important;
  border: none !important;
  padding: 0 !important;
  border-radius: 0px !important;
}

.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-callout__content {
    margin-inline-start: 0px !important;
    padding-left: 0px !important;
    margin-left: 0px !important;
    
}

/* [0]불렛 트리거 숨김 */
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) [class*="bullet"] {
    display: none !important;
}

/* [1] PC 버전: 3열 격자 그리드로 아래로 펼쳐지는 구조 */
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-gallery {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important; /* PC 기준 무조건 4열 고정 */
    grid-template-rows: unset !important; /* 기존 세로 2줄 강제 제어 해제 */
    grid-auto-flow: unset !important; /* 가로 누적 흐름 해제하여 아래로 쌓이게 변경 */
    gap: 10px !important;
    background: transparent !important;
    overflow-x: visible !important; 
}

/* 상단 패딩 16px 강제 제거 */
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-gallery {
    padding-top: 0px !important;
    margin-top: 0px !important;
    
}

/* 갤러리 뷰 상단 헤더 숨김 */
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection__header-wrapper {
    display: none !important;
}


/* 크롬, 사파리, 앱 내 브라우저 스크롤바 숨김 속성은 안전하게 유지 */
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-gallery::-webkit-scrollbar {
    display: none !important;
}
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-card {
    width: 100% !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-card__content {
    background: transparent !important;
    padding: 10px 0px !important;
    display: flex !important;
    flex-direction: column !important;
        min-height: 80px !important; /* 카드 높이 증가 */

}

.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"])
.notion-collection-card{
    position:relative !important;
}

/* [2] 썸네일 6:4 고정 */
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-card__cover,
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-card__cover img {
    aspect-ratio: 6 / 4 !important;
    border-radius: 0px !important;
    object-fit: cover !important;
}
/* [3] 속성 순서별 스타일 */
/* 공통: 아이콘 숨김 */
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-card__property svg {
    display: none !important;
}


/**/

/* 공통 */
/* 모든 속성 텍스트 강제 */
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"])
.notion-collection-card__property{
    color:#37352f !important;
    font-weight:400 !important;
    font-family:'Roboto Flex','Noto Sans KR',sans-serif !important;
}


/* 제목 */
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"])
.notion-property__title{
display:flex !important;    top:auto !important;
    order:2 !important;
    /*font-size:18px !important;*/
    font-weight:700 !important;
    /*line-height:1.1 !important;*/
    
}

/* 설명 */
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-card__property:nth-child(2),
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-card__property:nth-child(2) * {
    position:static !important;
        order:1 !important;
    /*font-size:12px !important;*/
    /*line-height:1.2 !important;*/
    margin-bottom: -3px !important; /* 필요에 따라 4px, 8px 등 조절 */
}

/**/

@media (max-width: 768px) {
    .notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-gallery {
        display: grid !important;
        grid-template-columns: none !important;
        grid-template-rows: none !important;
        grid-auto-flow: column !important; /* 모바일에서만 1줄 가로 방향 정렬 트리거 */
        /* 화면당 1.5개 노출 */
        grid-auto-columns: calc((100% - 10px) / 1.1) !important; 
        gap: 8px !important;
        overflow-x: auto !important; /* 가로 스크롤 활성화 */
        scrollbar-width: none !important;
        scroll-snap-type: x mandatory !important;
    }
    .notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-card {
        width: 100% !important;
        max-width: 100% !important;
        min-width: unset !important;
        flex: none !important;
        scroll-snap-align: start !important;
    }
/* 제목 */
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"])
.notion-property__title{

    /*font-size:16px !important;*/
    font-weight:700 !important;
    /*line-height:1.1 !important;*/
}
/* 설명 */
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-card__property:nth-child(2),
.notion-callout[class*="green"]:has(.notion-collection-gallery):has([class*="bullet"]) .notion-collection-card__property:nth-child(2) * {

    /*font-size:10px !important;*/
    /*line-height:1.2 !important;*/
    margin-bottom: -7px !important; /* 필요에 따라 4px, 8px 등 조절 */
  
  
}
}