/* Shared product identity: one title row; the photograph carries no status text — one status label
   follows the sample action on the third information row (see .weddingCatalogStatus). */
.weddingCatalogCardIdentity.card_code_blocks,
.pl_cardCode_block .weddingCatalogCardIdentity.pl_cardCode {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
    min-width: 0;
    height: auto;
    padding: 0;
    text-align: left;
}
.weddingCatalogCardIdentity.card_code_blocks .pl_prod_name,
.pl_cardCode_block .weddingCatalogCardIdentity .pl_pcode_text {
    float: none;
    display: block;
    flex: none;
    width: 100%;
    height: auto;
    min-height: var(--bj-catalog-title-line);
    margin: 0;
    overflow: hidden;
    white-space: nowrap;
}
.weddingCatalogCardIdentity .wedding_catalog_product_name_link {
    display: block;
    height: auto;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--bj-catalog-title-color);
    font-family: var(--bj-font-family);
    font-size: var(--bj-catalog-title-size);
    font-weight: var(--bj-catalog-title-weight);
    line-height: var(--bj-catalog-supporting-line);
    white-space: nowrap;
    word-break: keep-all;
    overflow-wrap: anywhere;
    text-decoration: none;
}
/* Every slide uses the complete portrait viewport; no label footer. */
.weddingCatalogMedia.pl_mark_wrapper_area,
:where(.product_list_gb, .product_list_pb) .card_img_wrapper.weddingCatalogMedia {
    aspect-ratio: 6 / 7;
    display: block;
    position: relative;
    background: #f1f1f1;
}
.weddingCatalogMedia > .pl_mark_wrapper,
:where(.product_list_gb, .product_list_pb) .card_img_wrapper.weddingCatalogMedia > a {
    height: 100%;
    min-height: 0;
}
:where(.product_list_gb, .product_list_pb) .weddingCatalogMedia .product_list_card_img { object-fit: contain; }
/* 위 contain 은 #f1f1f1 무대를 구운 스튜디오 사진 전제다. 배경까지 찍은 연출 사진(프리미엄 OANNA 목록의
   /product/oanna/<코드>.jpg, 4:5)은 칸을 채운다 — contain 이면 6:7 칸 좌우에 회색 띠(PC 10.7px)가 남았다(사장님 2026-09-26).
   표시(weddingCatalogMedia--photo)는 그 사진을 싣는 분기가 단다(card/doc/product/product_list_card.php). */
:where(.product_list_gb, .product_list_pb) .weddingCatalogMedia--photo .product_list_card_img { object-fit: cover; }
/* 상태(NEW·BEST·SALE 중 하나)는 사진 위가 아니라 글자 영역 셋째 줄(샘플 담기 줄)에 — 정본 COPY.COLLECTION
   «상품명·가격·배지 순서» · Caption 역할(목록 보조 13/20). 2026-09-26 사장님 «사진 왼쪽 위 SALE·BEST 가 눈에 너무 띄고
   폰은 더 복잡하다». 정보 줄 수(이름 24 · 가격 28 · 행동 40)와 이름 폭은 그대로(09-25 «넷째 줄·큰 배지» 물림).
   2026-09-27 사장님 «BEST 가 오른쪽 카드 것인지 왼쪽 카드 것인지 구분이 안 간다» — 줄 오른쪽 끝에 밀어 두면 두 칸 목록에서
   옆 카드의 「+ 샘플 담기」와 맞붙어 어느 카드 것인지 모른다. 그래서 끝으로 밀지 않고 자기 카드의 샘플 담기 바로 뒤(PC 12px,
   폰 10px)에 붙인다 — 카드 안 글자가 모두 왼쪽에서 시작하니 상태도 자기 카드 쪽에 선다.
   줄 높이를 채우고 아래 여백 8px 를 샘플 담기 단추(목록 PC 32 · 폰 40px, 아래 여백 8px)와 같게 — 두 글자가 한 높이에 선다.
   (글자 기준선 맞춤은 단추 앞 +·✓ 아이콘이 기준선을 아래로 끌어 4px 어긋났다.) 모음 화면(BEST·NEW)은 상태를 싣지 않는다. */
.weddingCatalogStatus {
    box-sizing: border-box;
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    margin: 0 0 0 12px;
    padding: 0 0 8px;
    pointer-events: none;
}
/* 폰: 상태가 있는 카드만 셋째 줄을 [샘플][상태] 두 칸으로 나눈다(이름·가격 줄은 두 칸을 다 써서 폭 그대로).
   첫 칸은 단추 폭만큼(fit-content), 상태는 그 뒤 10px — 320px 화면 카드(146px)에서도 «✓ 담김 · 신청하기»(102px)+BEST 가 한 줄. */
.pl_cardinfo_wrapper_inner:has(> .weddingCatalogStatus) {
    grid-template-columns: fit-content(100%) minmax(0, 1fr);
    grid-template-areas:
        "name name"
        "price price"
        "sample status";
}
.pl_cardinfo_wrapper_inner > .weddingCatalogStatus {
    grid-area: status;
    justify-self: start;
    align-self: stretch;
    margin-left: 10px;
}
.weddingCatalogMedia .zzim_btn {
    top: 4px;
    bottom: auto;
    right: 4px;
    width: 40px;
    height: 40px;
    background-size: 24px auto;
    transform: none;
}
.weddingCatalogStatus .wedding_catalog_badge {
    box-sizing: border-box;
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    width: auto;
    min-height: 20px;
    height: auto;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    color: var(--bj-muted);
    background: none;
    font-family: var(--bj-font-family);
    font-size: var(--bj-catalog-supporting-size);
    font-weight: var(--bj-type-control-weight);
    line-height: var(--bj-catalog-supporting-line);
    letter-spacing: 0;
    white-space: nowrap;
}

/* The invitation template entry shares the catalog media frame. */
.cardTemplateEntry[data-card-template-entry="wedding"] .cardTemplateEntry__link {
    aspect-ratio: 6 / 7;
}

.weddingCatalogMedia .weddingCatalogThumbnailGallery__progress {
    left: 50%;
    bottom: 6px;
    transform: translateX(-50%);
}