/*
Theme Name: Welldone Child Theme
Theme URI: https://welldone.axiomthemes.com/
Description: Welldone is a Premium WordPress theme that has built-in support for popular Page Builders, slider with swipe gestures, and is SEO- and Retina-ready. The unique system of inheritance and override options allows setting up individual parameters for different sections of your site and supported plugins.
Author: AxiomThemes
Author URI: https://axiomthemes.com/
Version: 2.12.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: bodybuilding, fitness, crossfit, gym, health, sports, workout, sports shop, online store, sports clothing, equipment, supplements, nutrition, sportswear, yoga
Text Domain: welldone
Template: welldone
*/


/* =Child-Theme customization starts here
------------------------------------------------------------ */

/* User dashboard active video access info */

.user-profile-active-grant {
    display: inline-block;
    padding: 1em;
    background-color: white;
}

.user-profile-active-grant h4 {
    margin: 0;
}

.user-profile-active-grant p {
    margin-block: 1em;
}

/* Video package site */

.hp-shop-video-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.hp-shop-video {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 3;
    margin-bottom: 0;
    background: white;
    padding-top: 0.6rem;
}

.hp-shop-video__header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding-inline: 0.6rem;
}

.hp-shop-video__title {
    margin: 0;
    font-family: var(--theme-font-h4_font-family);
    font-size: var(--theme-font-h4_font-size);
    font-weight: var(--theme-font-h4_font-weight);
    font-style: var(--theme-font-h4_font-style);
    line-height: var(--theme-font-h4_line-height);
    text-decoration: var(--theme-font-h4_text-decoration);
    text-transform: var(--theme-font-h4_text-transform);
    letter-spacing: var(--theme-font-h4_letter-spacing);
}


.hp-shop-video__equipment {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    flex-shrink: 0;
    padding: 0.35rem 0.7rem;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
}

.hp-shop-video__equipment--required {
    color: #7a4b00;
    background: #fff3cd;
}

.hp-shop-video__equipment--not-required {
    color: #337D7A;
    background: #e8f3f2;
}

.hp-shop-video__equipment-icon {
    font-size: 0.65rem;
}

.hp-shop-video__description {
    margin-top: 0;
    padding-inline: 0.6rem;
}

.hp-shop-video__description p {
    margin: 0;
}

.hp-shop-video__media {
    width: 100%;
}

/*
 * MediaElement.js adds inline width/height values.
 * Override those so the player follows the grid width
 * and maintains a 16:9 aspect ratio.
 */
.hp-shop-video__media .mejs-container {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9;
}

.hp-shop-video__media .mejs-mediaelement,
.hp-shop-video__media .mejs-mediaelement video {
    width: 100% !important;
    height: 100% !important;
}

.hp-shop-video__media .mejs-layers {
    width: 100% !important;
    height: 100% !important;
}

.hp-shop-video__empty {
    padding: 2rem 0;
}

@media (max-width: 1100px) {
    .hp-shop-video-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .hp-shop-video-list {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .hp-shop-video-list {
        grid-template-columns: 1fr;
    }

    .hp-shop-video__header {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* videos equipment filter */

.hp-shop-video-filter {
    margin-bottom: 2rem;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5em;
}

.hp-shop-video-filter__control {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 2;
}

.hp-shop-video-filter__package-change {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 2;
    place-content: end;
    align-items: stretch;
}

.hp-shop-video-filter__package-change .sc_item_button {
    grid-row: 2;
    align-self: stretch;
}

.hp-shop-video-filter__package-change .sc_button {
    height: 100%;
    margin: 0;
}

.hp-shop-video-filter__select {
    padding: 0.75rem 1rem;
    border: 1px solid #ccc;
    cursor: pointer;
}