/* ===================================
   Base CSS - Core Variables and Styles
   Included in all templates for consistent theming
   =================================== */

/* === Activity Type Colors === */
/* Define colors as CSS variables for better theme support */
/* All colors from Material Design palette */
:root {
    /* Activity colors - Light shades for backgrounds */
    --activity-dan-color: #80CBC4;  /* Teal 200 */
    --activity-dan-border-color: #6AA7A2;  /* Black at 17.5% opacity over Teal 200 - subtle border */
    --activity-dan-text-color: #000;  /* Black text for light backgrounds */

    --activity-mcl-color: #B39DDB;  /* Deep Purple 200 */
    --activity-mcl-border-color: #9482B5;  /* Black at 17.5% opacity over Deep Purple 200 - subtle border */
    --activity-mcl-text-color: #000;  /* Black text for light backgrounds */

    --activity-lts-color: #F8BBD0;  /* Pink 100 */
    --activity-lts-border-color: #CD9AAC;  /* Black at 17.5% opacity over Pink 100 - subtle border */
    --activity-lts-text-color: #000;  /* Black text for light backgrounds */

    --activity-sem-color: #F8BBD0;  /* Pink 100 */
    --activity-sem-border-color: #CD9AAC;  /* Black at 17.5% opacity over Pink 100 - subtle border */
    --activity-sem-text-color: #000;  /* Black text for light backgrounds */

    --activity-les-color: #AED581;  /* Light Green 300 */
    --activity-les-border-color: #90B06A;  /* Black at 17.5% opacity over Light Green 300 - subtle border */
    --activity-les-text-color: #000;  /* Black text for light backgrounds */

    --activity-fre-color: #81D4FA;  /* Light Blue 200 */
    --activity-fre-border-color: #6AAFCE;  /* Black at 17.5% opacity over Light Blue 200 - subtle border */
    --activity-fre-text-color: #000;  /* Black text for light backgrounds */

    --activity-off-color: #FFF9C4;  /* Yellow 100 */
    --activity-off-border-color: #D2CDA2;  /* Black at 17.5% opacity over Yellow 100 - subtle border */
    --activity-off-text-color: #000;  /* Black text for light backgrounds */

    --activity-wrm-color: #FFF9C4;  /* Yellow 100 - same as off-ice */
    --activity-wrm-border-color: #D2CDA2;  /* Black at 17.5% opacity over Yellow 100 - subtle border */
    --activity-wrm-text-color: #000;  /* Black text for light backgrounds */

    --activity-pat-color: #E0E0E0;  /* Grey 300 */
    --activity-pat-border-color: #B9B9B9;  /* Black at 17.5% opacity over Grey 300 - subtle border */
    --activity-pat-text-color: #000;  /* Black text for light backgrounds */

    /* Patch subtypes */
    --activity-pat-elite-color: #C5CAE9;  /* Indigo 100 - Elite patch */
    --activity-pat-elite-border-color: #A3AABE;  /* Black at 17.5% opacity over Indigo 100 - subtle border */
    --activity-pat-elite-text-color: #000;  /* Black text for light backgrounds */
    --activity-pat-private-color: #FFCC80;  /* Orange 200 - Private patch */
    --activity-pat-private-border-color: #D2A96A;  /* Black at 17.5% opacity over Orange 200 - subtle border */
    --activity-pat-private-text-color: #000;  /* Black text for light backgrounds */
    --activity-pat-flex-color: #CFD8DC;  /* Blue Grey 200 - Flex patch */
    --activity-pat-flex-border-color: #ABB2B5;  /* Black at 17.5% opacity over Blue Grey 200 - subtle border */
    --activity-pat-flex-text-color: #000;  /* Black text for light backgrounds */

    --activity-oth-color: #F5F5F5;  /* Grey 100 */
    --activity-oth-border-color: #CACACA;  /* Black at 17.5% opacity over Grey 100 - subtle border */
    --activity-oth-text-color: #000;  /* Black text for light backgrounds */

    --activity-com-color: #EF9A9A;  /* Red 200 */
    --activity-com-border-color: #C57F7F;  /* Black at 17.5% opacity over Red 200 - subtle border */
    --activity-com-text-color: #000;  /* Black text for light backgrounds */
}

/* Automatic border for badges with activity border classes */
.badge[class*="-border"] {
    border: 1px solid;
}

/* === Activity Type Utility Classes === */
/* Grouped by activity type for easier maintenance */
/* When adding a new activity type, add all three utility classes in one block */

/* Dance (DAN) */
.activity-dan-bg { background-color: var(--activity-dan-color) !important; }
.activity-dan-border { border-color: var(--activity-dan-border-color) !important; }
.activity-dan-text { color: var(--activity-dan-text-color) !important; }

/* Master Class (MCL) */
.activity-mcl-bg { background-color: var(--activity-mcl-color) !important; }
.activity-mcl-border { border-color: var(--activity-mcl-border-color) !important; }
.activity-mcl-text { color: var(--activity-mcl-text-color) !important; }

/* Learn to Skate (LTS) */
.activity-lts-bg { background-color: var(--activity-lts-color) !important; }
.activity-lts-border { border-color: var(--activity-lts-border-color) !important; }
.activity-lts-text { color: var(--activity-lts-text-color) !important; }

/* Seminar (SEM) */
.activity-sem-bg { background-color: var(--activity-sem-color) !important; }
.activity-sem-border { border-color: var(--activity-sem-border-color) !important; }
.activity-sem-text { color: var(--activity-sem-text-color) !important; }

/* Lesson (LES) */
.activity-les-bg { background-color: var(--activity-les-color) !important; }
.activity-les-border { border-color: var(--activity-les-border-color) !important; }
.activity-les-text { color: var(--activity-les-text-color) !important; }

/* Free Ice (FRE) */
.activity-fre-bg { background-color: var(--activity-fre-color) !important; }
.activity-fre-border { border-color: var(--activity-fre-border-color) !important; }
.activity-fre-text { color: var(--activity-fre-text-color) !important; }

/* Off-ice (OFF) */
.activity-off-bg { background-color: var(--activity-off-color) !important; }
.activity-off-border { border-color: var(--activity-off-border-color) !important; }
.activity-off-text { color: var(--activity-off-text-color) !important; }

/* Warm-up (WRM) */
.activity-wrm-bg { background-color: var(--activity-wrm-color) !important; }
.activity-wrm-border { border-color: var(--activity-wrm-border-color) !important; }
.activity-wrm-text { color: var(--activity-wrm-text-color) !important; }

/* Patch (PAT) */
.activity-pat-bg { background-color: var(--activity-pat-color) !important; }
.activity-pat-border { border-color: var(--activity-pat-border-color) !important; }
.activity-pat-text { color: var(--activity-pat-text-color) !important; }

/* Patch - Elite subtype */
.activity-pat-elite-bg { background-color: var(--activity-pat-elite-color) !important; }
.activity-pat-elite-border { border-color: var(--activity-pat-elite-border-color) !important; }
.activity-pat-elite-text { color: var(--activity-pat-elite-text-color) !important; }

/* Patch - Private subtype */
.activity-pat-private-bg { background-color: var(--activity-pat-private-color) !important; }
.activity-pat-private-border { border-color: var(--activity-pat-private-border-color) !important; }
.activity-pat-private-text { color: var(--activity-pat-private-text-color) !important; }

/* Patch - Flex subtype */
.activity-pat-flex-bg { background-color: var(--activity-pat-flex-color) !important; }
.activity-pat-flex-border { border-color: var(--activity-pat-flex-border-color) !important; }
.activity-pat-flex-text { color: var(--activity-pat-flex-text-color) !important; }

/* Other (OTH) */
.activity-oth-bg { background-color: var(--activity-oth-color) !important; }
.activity-oth-border { border-color: var(--activity-oth-border-color) !important; }
.activity-oth-text { color: var(--activity-oth-text-color) !important; }

/* Competition (COM) */
.activity-com-bg { background-color: var(--activity-com-color) !important; }
.activity-com-border { border-color: var(--activity-com-border-color) !important; }
.activity-com-text { color: var(--activity-com-text-color) !important; }