/*
Theme Name: Final Push
Theme URI: https://www.finalpush.co.uk
Template: hello-elementor
Author: Zayd Dawood
Author URI: https://www.zayddwaood.com
Description: Child theme based off Hello Elementor.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 1.0.1737153288
Updated: 2025-01-17 22:34:48

*/

/* =========================================================
   SUMMARIES BREAKDOWN - MOBILE LAYOUT
   ========================================================= */

@media screen and (max-width: 640px) {

    /* Both Summary tables */
    #revision-table,
    #day-to-day-table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
    }

    /*
     * Hide the normal table headings.
     * Each cell will display its own heading instead.
     */
    #revision-table thead,
    #day-to-day-table thead {
        display: none;
    }

    /*
     * Remove normal table behaviour
     */
    #revision-table tbody,
    #day-to-day-table tbody {
        display: block;
        width: 100%;
    }

    /*
     * Each Summary becomes its own card
     */
    #revision-table tbody tr,
    #day-to-day-table tbody tr {
        display: block;
        width: 100%;
        margin-bottom: 16px;
        padding: 12px 14px;
        box-sizing: border-box;
        border: 1px solid #ddd;
        border-radius: 8px;
    }

    /*
     * Each cell becomes its own row inside the card
     */
    #revision-table tbody td,
    #day-to-day-table tbody td {
        display: grid;
        grid-template-columns: minmax(95px, 35%) minmax(0, 65%);
        width: 100%;
        padding: 7px 0;
        box-sizing: border-box;
        border: 0;
        text-align: left;
        align-items: start;
        gap: 10px;
    }

    /*
     * Separator between fields
     */
    #revision-table tbody td + td,
    #day-to-day-table tbody td + td {
        border-top: 1px solid #eee;
    }

    /*
     * Label shown before each value
     */
    #revision-table tbody td::before,
    #day-to-day-table tbody td::before {
        font-weight: 600;
        text-align: left;
		padding: 0 10px;
    }


    /* =====================================================
       REVISION TABLE LABELS
       Summary | Chapter | Rating | First Viewed | Last Interacted
       ===================================================== */

    #revision-table tbody td:nth-child(1)::before {
        content: "Summary";
    }

    #revision-table tbody td:nth-child(2)::before {
        content: "Chapter";
    }

    #revision-table tbody td:nth-child(3)::before {
        content: "Rating";
    }

    #revision-table tbody td:nth-child(4)::before {
        content: "First Viewed";
    }

    #revision-table tbody td:nth-child(5)::before {
        content: "Last Interacted";
    }


    /* =====================================================
       DAY-TO-DAY TABLE LABELS
       Summary | Chapter | Status | First Viewed | Last Interacted
       ===================================================== */

    #day-to-day-table tbody td:nth-child(1)::before {
        content: "Summary";
    }

    #day-to-day-table tbody td:nth-child(2)::before {
        content: "Chapter";
    }

    #day-to-day-table tbody td:nth-child(3)::before {
        content: "Status";
    }

    #day-to-day-table tbody td:nth-child(4)::before {
        content: "First Viewed";
    }

    #day-to-day-table tbody td:nth-child(5)::before {
        content: "Last Interacted";
    }


    /*
     * Prevent long Summary/Chapter names from
     * forcing the card wider than the screen
     */
    #revision-table tbody td a,
    #day-to-day-table tbody td a {
        min-width: 0;
        overflow-wrap: anywhere;
        word-break: normal;
    }

}