/* Page-specific styles for poker-tables */

.page-owned-section {
    padding-block: var(--space-3xl);
}

.page-owned-section .container {
    width: 100%;
    max-width: var(--container-primary);
    margin-inline: auto;
    padding-inline: var(--container-padding-mobile);
}

@media (min-width: 768px) {
    .page-owned-section .container {
        padding-inline: var(--container-padding-desktop);
    }
}

/* The Poker Table section */
.poker-table-section {
    background-color: var(--color-limestone);
    color: var(--color-charcoal);
}

.poker-table-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-xl);
    align-items: start;
}

.poker-table-text {
    min-width: 0;
    max-width: 720px;
    text-align: left;
}

.poker-table-text h2,
.poker-table-text h3,
.poker-table-text p,
.poker-table-text ul {
    margin-block-end: var(--space-md);
}

.poker-table-text ul {
    list-style: disc;
    padding-inline-start: var(--space-md);
}

.poker-table-text li {
    margin-block-end: var(--space-xs);
}

.poker-table-media {
    min-width: 0;
    width: 100%;
}

.poker-table-media img {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: var(--radius-none);
}

@media (min-width: 768px) {
    .poker-table-grid {
        grid-template-columns: repeat(12, minmax(0, 1fr));
        gap: var(--space-lg);
    }

    .poker-table-text {
        grid-column: 1 / 7;
        grid-row: 1;
    }

    .poker-table-media {
        grid-column: 7 / 13;
        grid-row: 1;
    }
}

/* Cards on the Felt section */
.cards-felt-section {
    background-color: var(--color-felt-green);
    color: var(--color-warm-ivory);
}

.cards-felt-section h2,
.cards-felt-section h3,
.cards-felt-section .overline {
    color: var(--color-warm-ivory);
}

.cards-felt-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-xl);
    align-items: start;
}

.cards-felt-text {
    min-width: 0;
    max-width: 720px;
    text-align: left;
}

.cards-felt-text h2,
.cards-felt-text h3,
.cards-felt-text p,
.cards-felt-text ul {
    margin-block-end: var(--space-md);
}

.cards-felt-text ul {
    list-style: disc;
    padding-inline-start: var(--space-md);
}

.cards-felt-text li {
    margin-block-end: var(--space-xs);
}

.cards-felt-media {
    min-width: 0;
    width: 100%;
}

.cards-felt-media img {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    border-radius: var(--radius-none);
}

@media (min-width: 768px) {
    .cards-felt-grid {
        grid-template-columns: repeat(12, minmax(0, 1fr));
        gap: var(--space-lg);
    }

    .cards-felt-text {
        grid-column: 1 / 7;
        grid-row: 1;
    }

    .cards-felt-media {
        grid-column: 7 / 13;
        grid-row: 1;
    }
}

/* Around the Poker Table section */
.around-table-section {
    background-color: var(--color-sand-shadow);
    color: var(--color-charcoal);
}

.around-table-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-xl);
    align-items: start;
}

.around-table-text {
    min-width: 0;
    max-width: 720px;
    text-align: left;
}

.around-table-text h2,
.around-table-text h3,
.around-table-text p,
.around-table-text ul {
    margin-block-end: var(--space-md);
}

.around-table-text ul {
    list-style: disc;
    padding-inline-start: var(--space-md);
}

.around-table-text li {
    margin-block-end: var(--space-xs);
}

.around-table-media {
    min-width: 0;
    width: 100%;
}

.around-table-media img {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: var(--radius-none);
}

@media (min-width: 768px) {
    .around-table-grid {
        grid-template-columns: repeat(12, minmax(0, 1fr));
        gap: var(--space-lg);
    }

    .around-table-text {
        grid-column: 1 / 7;
        grid-row: 1;
    }

    .around-table-media {
        grid-column: 7 / 13;
        grid-row: 1;
    }
}

/* Poker Player Perspective section */
.player-perspective-section {
    background-color: var(--color-felt-green);
    color: var(--color-warm-ivory);
}

.player-perspective-section h2,
.player-perspective-section .overline {
    color: var(--color-warm-ivory);
}

.player-perspective-section blockquote {
    border-inline-start-color: var(--color-red-earth);
    color: var(--color-warm-ivory);
    margin-block-end: 0;
    padding-inline-start: var(--space-md);
}

.player-perspective-section blockquote p {
    color: var(--color-warm-ivory);
    font-size: var(--text-body-large);
    line-height: var(--leading-body-large);
    margin-block-end: 0;
}

.player-perspective-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-xl);
    align-items: start;
}

.player-perspective-text {
    min-width: 0;
    max-width: 720px;
    text-align: left;
}

.player-perspective-text h2 {
    margin-block-end: var(--space-md);
}

.player-perspective-media {
    min-width: 0;
    width: 100%;
}

.player-perspective-media img {
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 4;
    object-fit: cover;
    border-radius: var(--radius-none);
}

@media (min-width: 768px) {
    .player-perspective-grid {
        grid-template-columns: repeat(12, minmax(0, 1fr));
        gap: var(--space-lg);
    }

    .player-perspective-text {
        grid-column: 1 / 7;
        grid-row: 1;
    }

    .player-perspective-media {
        grid-column: 8 / 13;
        grid-row: 1;
        margin-block-start: var(--space-2xl);
    }
}

/* Poker Tables in the Room section */
.tables-room-section {
    background-color: var(--color-limestone);
    color: var(--color-charcoal);
}

.tables-room-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-xl);
    align-items: start;
}

.tables-room-text {
    min-width: 0;
    max-width: 720px;
    text-align: left;
}

.tables-room-text h2,
.tables-room-text h3,
.tables-room-text p,
.tables-room-text ul {
    margin-block-end: var(--space-md);
}

.tables-room-text ul {
    list-style: disc;
    padding-inline-start: var(--space-md);
}

.tables-room-text li {
    margin-block-end: var(--space-xs);
}

.tables-room-media {
    min-width: 0;
    width: 100%;
}

.tables-room-media img {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: var(--radius-none);
}

@media (min-width: 768px) {
    .tables-room-grid {
        grid-template-columns: repeat(12, minmax(0, 1fr));
        gap: var(--space-lg);
    }

    .tables-room-text {
        grid-column: 1 / 7;
        grid-row: 1;
    }

    .tables-room-media {
        grid-column: 7 / 13;
        grid-row: 1;
    }
}

/* Responsive adjustments for mobile */
@media (max-width: 767px) {
    .page-owned-section {
        padding-block: var(--space-2xl);
    }

    .poker-table-grid,
    .cards-felt-grid,
    .around-table-grid,
    .player-perspective-grid,
    .tables-room-grid {
        gap: var(--space-lg);
    }

    .poker-table-text,
    .cards-felt-text,
    .around-table-text,
    .player-perspective-text,
    .tables-room-text {
        max-width: 100%;
    }

    .poker-table-media img,
    .cards-felt-media img,
    .around-table-media img,
    .player-perspective-media img,
    .tables-room-media img {
        aspect-ratio: 4 / 3;
    }

    .cards-felt-media img {
        aspect-ratio: 1 / 1;
    }

    .player-perspective-media img {
        aspect-ratio: 1 / 1;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .poker-table-grid,
    .cards-felt-grid,
    .around-table-grid,
    .player-perspective-grid,
    .tables-room-grid {
        gap: var(--space-md);
    }

    .poker-table-text,
    .cards-felt-text,
    .around-table-text,
    .player-perspective-text,
    .tables-room-text {
        max-width: 100%;
    }
}