/*==========================================
📌 미술관 정보 카드 - 세로형
==========================================*/

/* [1] 컨테이너 및 기본 요소 제어 */
.notion-callout[class*="pink"]:has(.notion-quote):has(.notion-collection-gallery) {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    width: 100% !important;
}
.notion-callout[class*="pink"]:has(.notion-quote) .notion-quote,
.notion-callout[class*="pink"]:has(.notion-quote) h1 {
    display: none !important;
}
.notion-callout[class*="pink"]:has(.notion-quote) .notion-callout__content {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* [2] 카드 배경 및 외형 초기화 */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card {
    background: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 10px !important;
}

/* [3] 그리드 레이아웃 설정(속성 2칼럼) */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content {
    display: grid !important;
    grid-template-columns: 2fr 4fr !important;
    column-gap: 0px !important;
    row-gap: 0px !important;
    width: 100% !important;
}
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property {
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
}
/* [4] 속성별 배치 및 구분선 제어 */
/* 1. 속성 3번째부터 8번째까지: 2칼럼 중 1개 칼럼만 차지하도록 설정 */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(n+4):nth-child(-n+8) {
    grid-column: span 1 !important;
    border-top: 1px solid #37352f !important;
    padding: 10px 0 !important;
    margin: 0 !important;
}
/* 2. 2칼럼 중 홀수 번째 속성(좌측)의 오른쪽 여백 제거 */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(odd):nth-child(n+4):nth-child(-n+8) {
    padding-right: 0px !important; 
}
/* 제목(1), 속성1(2), 속성2(3)을 1칼럼(전체 너비)으로 배치 */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(1),
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(2),
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(3) {
    grid-column: span 2 !important;
}

/* 속성 4부터 마지막 속성까지는 2칼럼(span 1) */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(n+4) {
    grid-column: span 1 !important;
    border-top: 1px solid #37352f !important;
    padding: 10px 0 !important;
}
/* [5] 마지막 테두리 묶기 */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-last-child(-n+2) {
    border-bottom: 1px solid #37352f !important;
}
/* [5] 덩어리 및 요소 간격 */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(1) {
    grid-column: span 2 !important;
    border-top: none !important;
    margin-bottom: 10px !important;
}
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(2) {
    margin-bottom: 100px !important;
}
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(3) {
    margin-bottom: 10px !important;
}

/* 속성3 버튼 우정렬 */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(3) {
    display: flex !important;
    justify-content: flex-end !important; /* 오른쪽 정렬 핵심 */
    align-items: center !important;
    width: 100% !important;
}
/* 추가: 여백조정*/
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(3) > div {
    margin-right: 0px !important;
}
/* [6] 타이포그래피 및 스타일 강제 - 수정본 */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property * {
    font-family: 'Roboto Flex', 'Noto Sans KR', sans-serif !important;
    font-size: inherit !important;
    color: inherit !important;
    font-weight: inherit !important;
}

/* 제목(1번) 전용 스타일: 폰트패밀리 확실히 명시 */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(1) *,
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(1) {
    font-family: 'Roboto Flex', 'Noto Sans KR', sans-serif !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    color: #37352f !important;
    line-height: 1.2 !important;
}

/* 일반 속성(2번 이후) 스타일 */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(n+2):not(:has([class*="brown"])):not(:has([class*="orange"])) *,
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card__content > .notion-property:nth-child(n+2):not(:has([class*="brown"])):not(:has([class*="orange"])) {
    font-family: 'Roboto Flex', 'Noto Sans KR', sans-serif !important;
    font-size: 12px !important;
    color: #37352f !important;
    font-weight: 500 !important;
}

/* [7] 티켓 버튼 스타일 - 최종 통합본 */

/* 버튼 컨테이너 공통: 핑크 콜아웃 내부 타겟팅 */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card [class*="bg-brown"],
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card [class*="color-orange"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 110px !important;
    height: 28px !important;
    border-radius: 20px !important;
    cursor: pointer !important;
    transition: all 0s ease !important;
    position: relative !important;
    pointer-events: auto !important;
}

/* 내부 텍스트 및 링크 강제 제어 (중복 제거 통합) */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card [class*="bg-brown"] *,
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card [class*="color-orange"] *,
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card [class*="bg-brown"] .notion-link,
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card [class*="bg-brown"] .notion-link * {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    text-decoration: none !important;
font-family: 'Roboto Flex', 'Noto Sans KR', sans-serif !important;
    color: currentColor !important; 
    -webkit-text-fill-color: currentColor !important;
    pointer-events: none !important;
}

/* 블랙 버튼 (bg-brown) 스타일 */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card [class*="bg-brown"] {
    background-color: #ffffff !important;
    border: 1px solid #37352f !important;
    color: #37352f !important;
}

.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card [class*="bg-brown"]:hover {
    background-color: #37352f !important;
    border-color: #37352f !important;
    color: #ffffff !important;
}

/* 그레이 버튼 (color-orange) 스타일 */
.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card [class*="color-orange"] {
    background-color: #f7f7f7 !important;
    border: 1px solid #b1b1b1 !important;
    color: #666666 !important;
}

.notion-callout[class*="pink"]:has(.notion-quote) .notion-collection-card [class*="color-orange"]:hover {
    background-color: #edebeb !important;
    border-color: #b1b1b1 !important;
    color: #37352f !important;
}
