/*
 Theme Name:   Maranatha Child
 Theme URI:    https://churchthemes.com/
 Description: Child theme for Maranatha 
 Author:       Chris Abate
 Template:     maranatha
 Version:      1.0.32
*/

.maranatha-home-section-content h1{
    font-size: 4.6em;
    
}


/* Base table */
#maranatha-sermon-loop {
    display: table;
    width: 100%;
    table-layout: auto;
    border-collapse: collapse;
    margin-top: 2rem;
    white-space: normal;
}

/* Headers */
#maranatha-sermon-loop th {
    text-align: left;
    font-weight: 600;
    padding: 0.75rem;
    border-bottom: 2px solid rgba(0,0,0,0.1);
}

/* Cells */
#maranatha-sermon-loop td {
    padding: 0.25rem;
    border-bottom: 1px solid rgba(0,0,0,0.08);
    vertical-align: middle;
}

/* Hover */
#maranatha-sermon-loop tbody tr:hover {
    background: rgba(0,0,0,0.03);
}
/* Id */
#maranatha-sermon-loop td.sermon-id,
#maranatha-sermon-loop th.sermon-id {
    width: 50px;
    text-align: center;
}
/* Date */
#maranatha-sermon-loop th.sermon-date,
#maranatha-sermon-loop td.sermon-date {
    width: 110px;
    white-space: nowrap;
}

/* Title gets priority */
#maranatha-sermon-loop th.sermon-title,
#maranatha-sermon-loop td.sermon-title {
    width: 40%;
}

/* Scripture second priority */
#maranatha-sermon-loop th.sermon-scripture,
#maranatha-sermon-loop td.sermon-scripture {
    width: 20%;
}

/* Icon columns */
#maranatha-sermon-loop th.sermon-audio,
#maranatha-sermon-loop td.sermon-audio,
#maranatha-sermon-loop th.sermon-text,
#maranatha-sermon-loop td.sermon-text,
#maranatha-sermon-loop th.sermon-notes,
#maranatha-sermon-loop td.sermon-notes,
#maranatha-sermon-loop th.sermon-questions,
#maranatha-sermon-loop td.sermon-questions 
{
    width: 48px;
    min-width: 48px;
    max-width: 48px;
    text-align: center;
}

#maranatha-sermon-loop th.sermon-notes,
#maranatha-sermon-loop td.sermon-notes,
#maranatha-sermon-loop th.sermon-questions,
#maranatha-sermon-loop td.sermon-questions{
    align-items: center;
}

/* Icon alignment */
#maranatha-sermon-loop td.sermon-audio a,
#maranatha-sermon-loop td.sermon-text a,
#maranatha-sermon-loop td.sermon-questions a,
#maranatha-sermon-loop td.sermon-notes a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
}

#maranatha-sermon-loop td a svg {
    width: 16px;
    height: 16px;
    display: block;
       flex-shrink: 0;  
}

#maranatha-sermon-loop th.sermon-questions {
    text-align: center;
}

#maranatha-sermon-loop th.sermon-questions svg {
    display: inline-block;
    vertical-align: middle;
}
@media (max-width: 600px) {

    /* Hide table header */
    #maranatha-sermon-loop thead {
        display: none;
    }

    /* Each row becomes a card */
    #maranatha-sermon-loop tbody tr {
        display: block;
        margin-bottom: 1.5rem;
        padding: 1rem;
        border: 1px solid rgba(0,0,0,0.08);
        border-radius: 8px;
        background: #fff;
        text-align: center; /* Center content for ID + Title */
    }

    /* Reset cells */
    #maranatha-sermon-loop td {
        display: block;
        width: 100% !important;
        max-width: 100% !important;
        border: none!important;
        border-width: 0 !important;
        padding: 0.35rem 0;
    }

    /* Hide empty cells */
    #maranatha-sermon-loop td:empty {
        display: none;
    }

    /* ---------------------------
       Top Row: ID + Title
       --------------------------- */
    #maranatha-sermon-loop td.sermon-id,
    #maranatha-sermon-loop td.sermon-title {
        display: inline-block;
        vertical-align: middle;
        line-height: 1.2; /* keeps ID and Title aligned */
    }

    #maranatha-sermon-loop td.sermon-id {
        font-weight: 500;
        margin-right: 0.5rem;
    }

    #maranatha-sermon-loop td.sermon-title {
        font-weight: 600;
        font-size: 1.05rem;
    }

    /* Bottom border under top row */
    #maranatha-sermon-loop td.sermon-title::after {
        content: "";
        display: block;
        border-bottom: 1px solid rgba(0,0,0,0.08);
        margin-top: 0.75rem;
    }

    /* Remove link underlines */
    #maranatha-sermon-loop td.sermon-title a,
    #maranatha-sermon-loop td.sermon-id a,
    #maranatha-sermon-loop td.sermon-date a {
        text-decoration: none;
    }

    /* ---------------------------
       Scripture row
       --------------------------- */
    #maranatha-sermon-loop td.sermon-scripture::before {
        content: "Scripture: ";
        font-weight: 600;
        opacity: 0.8;
    }

    /* ---------------------------
       Action row: Listen / Read / Notes / Questions
       --------------------------- */
    #maranatha-sermon-loop td.sermon-audio,
    #maranatha-sermon-loop td.sermon-text,
    #maranatha-sermon-loop td.sermon-notes,
    #maranatha-sermon-loop td.sermon-questions {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
        width: auto !important;
        padding-right: 1rem;
        font-size: 0.9rem;
        justify-content: center; /* center horizontally */
    }

    /* Only show labels if td is not empty */
    #maranatha-sermon-loop td.sermon-audio:not(:empty)::before {
        content: "Listen:";
        font-weight: 500;
    }

    #maranatha-sermon-loop td.sermon-text:not(:empty)::before {
        content: "Read:";
        font-weight: 500;
    }

    #maranatha-sermon-loop td.sermon-notes:not(:empty)::before {
        content: "Notes:";
        font-weight: 500;
    }

    /* Questions: use icon if not empty */
    #maranatha-sermon-loop td.sermon-questions:not(:empty)::before {
        content: ":";
        display: inline-block;
        width: 18px;
        height: 18px;
        margin-right: 0.25rem;
        background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'><circle cx='12' cy='12' r='10' fill='none' stroke='currentColor' stroke-width='2'/><path d='M9.5 9a2.5 2.5 0 1 1 4.2 1.8c-.9.8-1.7 1.3-1.7 2.7' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round'/><circle cx='12' cy='17' r='1.2' fill='currentColor'/></svg>");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
    }

    /* ---------------------------
       Date row
       --------------------------- */
    #maranatha-sermon-loop td.sermon-date {
        margin-top: 0.75rem;
        font-size: 0.85rem;
        opacity: 0.7;
    }

    #maranatha-sermon-loop td.sermon-date::before {
        content: "Date: ";
        font-weight: 600;
        opacity: 0.8;
    }

}