/**
 * Bingkai foto mempelai & cover — variasi per template (couple-frame-*)
 */

#couple .couple-profile-card .couple-avatar {
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}

#couple .couple-profile-card .couple-avatar__img,
#couple .couple-profile-card .couple-avatar img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}

/* Tailwind rounded-full tidak boleh menimpa bingkai unik */
#couple .couple-avatar.rounded-full,
#couple .couple-avatar__img.rounded-full {
    border-radius: inherit !important;
}

/* Round — default bulat */
#cover.couple-frame-round .cover-photo-wrap:not(.ornate-photo-frame),
#couple.couple-frame-round .couple-avatar {
    border-radius: 999px;
    padding: 5px;
    background: radial-gradient(circle at 35% 28%, rgba(255, 255, 255, 0.95), rgba(var(--accent-rgb), 0.22) 42%, rgba(var(--primary-rgb), 0.18));
    box-shadow: 0 18px 42px rgba(var(--primary-rgb), 0.2), 0 0 0 3px rgba(255, 255, 255, 0.65);
}

#couple.couple-frame-round .couple-avatar img,
#cover.couple-frame-round .cover-photo-wrap:not(.ornate-photo-frame) .cover-photo {
    border-radius: 999px;
}

/* Arch — lengkung klasik */
#cover.couple-frame-arch .cover-photo-wrap:not(.ornate-photo-frame),
#couple.couple-frame-arch .couple-avatar {
    border-radius: 50% 50% 12% 12% / 58% 58% 10% 10%;
    padding: 8px;
    background: linear-gradient(165deg, rgba(255, 255, 255, 0.92), rgba(var(--accent-rgb), 0.2));
    box-shadow: 0 20px 48px rgba(var(--primary-rgb), 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.75);
}

#couple.couple-frame-arch .couple-avatar img,
#cover.couple-frame-arch .cover-photo-wrap:not(.ornate-photo-frame) .cover-photo {
    border-radius: 50% 50% 8% 8% / 55% 55% 8% 8%;
}

/* Petal — kelopak */
#cover.couple-frame-petal .cover-photo-wrap:not(.ornate-photo-frame),
#couple.couple-frame-petal .couple-avatar {
    border-radius: 58% 58% 42% 42% / 48% 48% 52% 52%;
    padding: 7px;
    background: linear-gradient(145deg, rgba(var(--accent-rgb), 0.35), rgba(var(--primary-rgb), 0.15));
    box-shadow: 0 16px 40px rgba(var(--primary-rgb), 0.18), 0 0 0 2px rgba(255, 255, 255, 0.55);
}

#couple.couple-frame-petal .couple-avatar img,
#cover.couple-frame-petal .cover-photo-wrap:not(.ornate-photo-frame) .cover-photo {
    border-radius: 54% 54% 40% 40% / 46% 46% 50% 50%;
}

/* Diamond — berlian (cover lurus, mempelai boleh miring halus) */
#cover.couple-frame-diamond .cover-photo-wrap:not(.ornate-photo-frame) {
    border-radius: 1.15rem;
    padding: 10px;
    transform: none;
    background: linear-gradient(135deg, rgba(var(--accent-rgb), 0.45), rgba(var(--primary-rgb), 0.25));
    box-shadow: 0 20px 50px rgba(var(--primary-rgb), 0.24);
}

#cover.couple-frame-diamond .cover-photo-wrap:not(.ornate-photo-frame) .cover-photo {
    transform: none;
    border-radius: 0.75rem;
}

#couple.couple-frame-diamond .couple-avatar {
    border-radius: 1.15rem;
    padding: 10px;
    transform: rotate(45deg);
    background: linear-gradient(135deg, rgba(var(--accent-rgb), 0.45), rgba(var(--primary-rgb), 0.25));
    box-shadow: 0 20px 50px rgba(var(--primary-rgb), 0.24);
}

#couple.couple-frame-diamond .couple-avatar img {
    transform: rotate(-45deg) scale(1.12);
    border-radius: 0.65rem;
}

#couple.couple-frame-diamond .premium-couple-card:hover .couple-avatar {
    transform: rotate(45deg) scale(1.03);
}

/* Hex — segi enam */
#cover.couple-frame-hex .cover-photo-wrap:not(.ornate-photo-frame),
#couple.couple-frame-hex .couple-avatar {
    clip-path: polygon(50% 0%, 95% 25%, 95% 75%, 50% 100%, 5% 75%, 5% 25%);
    padding: 6px;
    background: linear-gradient(180deg, rgba(var(--accent-rgb), 0.4), rgba(var(--secondary-rgb), 0.25));
    box-shadow: 0 18px 44px rgba(var(--primary-rgb), 0.2);
}

#couple.couple-frame-hex .couple-avatar img,
#cover.couple-frame-hex .cover-photo-wrap:not(.ornate-photo-frame) .cover-photo {
    clip-path: polygon(50% 0%, 95% 25%, 95% 75%, 50% 100%, 5% 75%, 5% 25%);
    border-radius: 0;
}

/* Ornate — emas klasik */
#cover.couple-frame-ornate .cover-photo-wrap,
#couple.couple-frame-ornate .couple-avatar {
    position: relative;
    padding: 11px;
    border-radius: 1.1rem;
    background: linear-gradient(145deg, #f3e2c0, #c9a96e 42%, #f8edd4);
    box-shadow: 0 22px 56px rgba(61, 43, 31, 0.2), inset 0 0 0 2px rgba(255, 255, 255, 0.55);
}

#couple.couple-frame-ornate .couple-avatar::before,
#couple.couple-frame-ornate .couple-avatar::after,
#cover.couple-frame-ornate .cover-photo-wrap::before,
#cover.couple-frame-ornate .cover-photo-wrap::after {
    content: '';
    position: absolute;
    width: 22px;
    height: 22px;
    border: 2px solid rgba(139, 105, 20, 0.45);
    pointer-events: none;
    z-index: 2;
}

#couple.couple-frame-ornate .couple-avatar::before,
#cover.couple-frame-ornate .cover-photo-wrap::before {
    top: 6px;
    left: 6px;
    border-right: 0;
    border-bottom: 0;
    border-radius: 6px 0 0 0;
}

#couple.couple-frame-ornate .couple-avatar::after,
#cover.couple-frame-ornate .cover-photo-wrap::after {
    bottom: 6px;
    right: 6px;
    border-left: 0;
    border-top: 0;
    border-radius: 0 0 6px 0;
}

#couple.couple-frame-ornate .couple-avatar img,
#cover.couple-frame-ornate .cover-photo-wrap .cover-photo {
    border-radius: 0.75rem;
    border: 2px solid rgba(255, 255, 255, 0.85);
}

/* Laurel — daun sudut */
#cover.couple-frame-laurel .cover-photo-wrap:not(.ornate-photo-frame),
#couple.couple-frame-laurel .couple-avatar {
    border-radius: 999px;
    padding: 8px;
    background: radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.9), rgba(var(--primary-rgb), 0.12));
    box-shadow: 0 0 0 3px rgba(var(--accent-rgb), 0.35), 0 18px 40px rgba(var(--primary-rgb), 0.16);
}

#couple.couple-frame-laurel .couple-avatar::before,
#cover.couple-frame-laurel .cover-photo-wrap:not(.ornate-photo-frame)::before {
    content: '❧';
    position: absolute;
    top: -4px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 1.1rem;
    color: rgba(var(--accent-rgb), 0.85);
    line-height: 1;
    z-index: 3;
    pointer-events: none;
}

#couple.couple-frame-laurel .couple-avatar img,
#cover.couple-frame-laurel .cover-photo-wrap:not(.ornate-photo-frame) .cover-photo {
    border-radius: 999px;
}

#couple.couple-frame-diamond .premium-couple-card {
    overflow: visible;
}

@media (max-width: 639px) {
    #couple.couple-frame-diamond .couple-avatar {
        width: 9.25rem !important;
        height: 9.25rem !important;
        margin-inline: auto;
    }
}
