/* �舒仂弍仍�仆亠 亳 仂亞�舒仆亳�舒于舒仆亠 仆舒 �舒亰仄亠�舒 仆舒 从舒��亳仆从亳�亠 */
.card-img-top {
    width: 100%;               /* �舒仗�仍于舒 �亳�亳仆舒�舒 仆舒 从仂仆�亠亶仆亠�舒 */
    height: auto;              /* �亳�仂�亳仆舒�舒 �仗��仄仂 �亳�亳仆舒�舒 */
    object-fit: contain;       /* ��仂仗仂��亳仂仆舒仍仆仂 仄舒�舒弍亳�舒仆亠 弍亠亰 亳亰��亰于舒仆亠 */
    border-radius: 0.5rem 0.5rem 0 0; /* �舒仂弍仍�仆亠 �舒仄仂 仆舒 亞仂�仆亳�亠 �亞仍亳 仆舒 亳亰仂弍�舒亢亠仆亳亠�仂 */
    background-color: #0d0f11; /* 弌于亠��仍 �仂仆, 舒从仂 亳亰仂弍�舒亢亠仆亳亠�仂 仆亠 亰舒仗�仍于舒 �亠仍亳� 弍仍仂从 */
    display: block;            /* �舒 亟舒 仆�仄舒 亟仂仗�仍仆亳�亠仍仆亳 �舒亰��仂�仆亳� */
}

.card.h-100 {
    max-width: 320px;          /* �舒从�亳仄舒仍仆舒 �亳�亳仆舒 仆舒 从舒��舒�舒 */
    margin: 0 auto;            /* 丶亠仆��亳�舒仆亠 �仂�亳亰仂仆�舒仍仆仂 */
    border-radius: 0.5rem;     /* �舒仂弍仍�仆亠 仆舒 于�亳�从亳 �亞仍亳 仆舒 从舒��舒�舒 */
    overflow: hidden;          /* �舒 亟舒 �亠 亳亰�亠亢舒� 亳亰仍亳�仆亳 �舒��亳 仗�亳 亰舒仂弍仍�仆亠 */
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); /* �亠从舒 ��仆从舒 */
    height: auto;              /* �于�仂仄舒�亳�仆舒 于亳�仂�亳仆舒 �仗��仄仂 ��亟��亢舒仆亳亠�仂 */
    display: flex;
    flex-direction: column;
    background-color: #0a0c0e; /* 丐�仄亠仆, 仆仂 仆亠 仄仆仂亞仂 ��仄亠仆 �仂仆 */
}

/* 弌�亳仍亳亰舒�亳� 仆舒 仗舒亞亳仆舒�亳��舒 */
.pagination {
    display: flex;
    gap: 0.4rem;
}

.page-item .page-link {
    border-radius: 8px;
    color: #333;
    border: 1px solid #f30d0d;
    padding: 6px 12px;
    transition: all 0.3s ease;
}

.page-item.active .page-link {
    background-color: #0d6efd;
    color: rgb(14, 2, 2);
    border-color: #0d6efd;
}

.page-link:hover {
    background-color: #050c13;
    color: #0d6efd;
}

/* Flip Card Styles */
.flip-card {
    background-color: transparent;
    perspective: 1000px;
    width: 100%;
    aspect-ratio: 2 / 3;
}

.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform 0.8s;
    transform-style: preserve-3d;
}

.flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
}

.flip-card-front,
.flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    top: 0;
    left: 0;
    border-radius: 12px;
    overflow: hidden;
}

/* Front = poster image */
.flip-card-front img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Back = info */
.flip-card-back {
    background-color: rgba(30, 30, 47, 0.95); /* 仍亠从仂 仗�仂亰�舒�亠仆 ��仄亠仆 �仂仆 */
    color: #857a7a;
    padding: 1rem;
    transform: rotateY(180deg);
    overflow-y: auto;
    position: relative;
}

/* 个仂仆仂于 仗仂仍�仗�仂亰�舒�亠仆 仗仂��亠� */
.flip-card-back::before {
    content: "";
    background-image: var(--poster-url);
    background-size: cover;
    background-position: center;
    opacity: 0.1;
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 0;
}

/* ��亳�从亳 亠仍亠仄亠仆�亳 于���� 仗仂��亠�舒 */
.flip-card-back > * {
    position: relative;
    z-index: 1;
}