/* =========================================
   FILE: app.css
   PURPOSE: Site-specific custom styles for yourassuranceteam.com
   This file is the intended long-term home for ALL custom styles.
   It loads after foundation.css and mainstyle.css, so rules here
   override both. DO NOT modify foundation.css — use this file
   for all customization.
   
   MODIFICATION HISTORY:
   unknown date - File was an empty placeholder
   2026-05-12 - Added button styles (r-btnGray/Blue/Green/Purple)
                moved from inline <style> blocks in index.php
   2026-05-12 - Added table border-collapse rule
                moved from inline <style> block in index.php
   2026-05-20 - Added LIFE Support landing page card styles
   2026-05-20 - Updated CSS load order: foundation > mainstyle > app
========================================= */

/* -----------------------------------------  Shared Styles ----------------------------------------- */
    /* -----------------------------------------
       Color Reference
            #199319 - green
            #014421 - footer green
            #060398 - header blue
            #808080 - gray
            #9B59B6 - mellow purple (amethyst) — addictions
            #FF4500 - orange
            #7A5C00 - deep gold — technical writing
            #EFEFEF - page background
    ----------------------------------------- */

    /* -----------------------------------------  Page Background  ----------------------------------------- */
        body
            {
                background-color: #EFEFEF;
            }

    /* -----------------------------------------  Shared Styles for webpage buttons  ----------------------------------------- */
        /* ---------- Center the button in the bottom cell of each program box ---------- */
        .btn-cell
            {
                text-align: center;
                padding-bottom: 10px;
            }

        /* ---------- program box borders (legacy table layout) ---------- */
        .box-green  { border: 2px solid #014421 !important; border-collapse: separate !important; }
        .box-blue   { border: 2px solid #060398 !important; border-collapse: separate !important; }
        .box-purple { border: 2px solid #9B59B6 !important; border-collapse: separate !important; }

        /* ---------- set generic rules for the index buttons  ---------- */
        .r-btnGray, .r-btnBlue, .r-btnGreen, .r-btnPurple, .r-btnOrange
            {
                display: inline-block;
                width: 100px;
                text-align: center;
                padding: 10px 0;
                color: white;
                text-decoration: none;
                font-weight: bold;
            }

        /* ---------- set colors for the index buttons  ---------- */
        .r-btnGray   { background-color: #808080; }
        .r-btnBlue   { background-color: #060398; }
        .r-btnGreen  { background-color: #014421; }
        .r-btnPurple { background-color: #9B59B6; }
        .r-btnOrange { background-color: #FF4500; }

/* -----------------------------------------  LIFE Support Landing Page  ----------------------------------------- */
    /* -----------------------------------------
       Hero Section
    ----------------------------------------- */
        .life-hero
            {
                padding: 2rem 1.5rem 1.5rem;
                text-align: center;
                border-bottom: 1px solid #D0D0D0;
                margin-bottom: 1.5rem;
            }
        .life-hero-title
            {
                font-size: 32px;
                font-weight: 500;
                color: #1A1A1A;
                margin: 0 0 4px;
                letter-spacing: -0.5px;
            }
        .life-hero-sub
            {
                font-size: 16px;
                font-weight: 500;
                color: #555555;
                margin: 0;
            }

    /* -----------------------------------------
       Card Grid
    ----------------------------------------- */
        .life-cards
            {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 16px;
                padding: 0 0 1rem;
            }
        .life-card
            {
                border-radius: 8px;
                overflow: hidden;
                display: flex;
                flex-direction: column;
            }

    /* -----------------------------------------
       Card Header Bands
    ----------------------------------------- */
        .life-card-header
            {
                padding: 14px 16px 12px;
            }
        .life-card-header-green  { background: #014421; border-bottom: 1px solid #013318; }
        .life-card-header-blue   { background: #060398; border-bottom: 1px solid #040270; }
        .life-card-header-purple { background: #9B59B6; border-bottom: 1px solid #7D3F99; }
        .life-card-header-gold   { background: #7A5C00; border-bottom: 1px solid #5C4500; }

        .life-card-title
            {
                font-size: 15px;
                font-weight: bold;
                color: #ffffff;
                margin: 0 0 2px;
            }
        .life-card-subtitle
            {
                font-size: 12px;
                color: rgba(255,255,255,0.75);
                margin: 0;
            }

    /* -----------------------------------------
       Card Body
    ----------------------------------------- */
        .life-card-body
            {
                padding: 12px 16px;
                flex: 1;
                font-size: 13px;
                line-height: 1.6;
                color: #1A1A1A;
            }
        .life-card-body-green  { background: #F0F7F2; }
        .life-card-body-blue   { background: #F0F0FB; }
        .life-card-body-purple { background: #F8F2FC; }
        .life-card-body-gold   { background: #FAF6EC; }

    /* -----------------------------------------
       Card Footer / Button Area
    ----------------------------------------- */
        .life-card-footer
            {
                padding: 10px 16px 14px;
                text-align: center;
            }
        .life-card-footer-green  { background: #E0EFE6; border-top: 1px solid #A8C9B4; }
        .life-card-footer-blue   { background: #E0E0F5; border-top: 1px solid #A8A8DC; }
        .life-card-footer-purple { background: #F0E4F8; border-top: 1px solid #C9A0DC; }
        .life-card-footer-gold   { background: #F2EAD0; border-top: 1px solid #C8B06A; }

    /* -----------------------------------------
       Card Buttons
    ----------------------------------------- */
        .life-btn
            {
                display: inline-block;
                font-size: 13px;
                font-weight: bold;
                padding: 8px 20px;
                border-radius: 6px;
                text-decoration: none;
                color: white;
            }
        .life-btn-green  { background: #014421; }
        .life-btn-blue   { background: #060398; }
        .life-btn-purple { background: #9B59B6; }
        .life-btn-gold   { background: #7A5C00; }

    /* -----------------------------------------
       Card Borders
    ----------------------------------------- */
        .life-card-green  { border: 1px solid #A8C9B4; }
        .life-card-blue   { border: 1px solid #A8A8DC; }
        .life-card-purple { border: 1px solid #C9A0DC; }
        .life-card-gold   { border: 1px solid #C8B06A; }

    /* -----------------------------------------
       Tagline Footer
    ----------------------------------------- */
        .life-tagline
            {
                text-align: center;
                padding: 1.25rem 1rem;
                border-top: 1px solid #D0D0D0;
                margin-top: 0.5rem;
                font-size: 16px;
                font-weight: 500;
                font-style: italic;
                color: #333333;
            }
