/* ==========================================================================
   Solar.red Mobile Bottom Bar
   Nur sichtbar auf Geräten ≤ 768px Breite
   Google Brand Colors: Blue #4285F4, Red #EA4335, Green #34A853, Yellow #FBBC05
   ========================================================================== */

/* Standardmäßig versteckt */
#srmb-mobile-bar {
    display: none;
}

/* Nur auf Mobilgeräten anzeigen */
@media screen and (max-width: 768px) {

    #srmb-mobile-bar {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 999999;
        background: #ffffff;
        box-shadow: 0 -3px 12px rgba(0, 0, 0, 0.15);
        padding: 0;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, sans-serif;
        -webkit-font-smoothing: antialiased;
    }

    /* Header-Text */
    .srmb-header {
        text-align: center;
        font-size: 13px;
        font-weight: 700;
        color: #202124;
        padding: 8px 10px 4px;
        letter-spacing: 0.02em;
        line-height: 1.2;
    }

    /* Button-Container: 4 Spalten Grid */
    .srmb-buttons {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 6px;
        padding: 4px 6px 10px;
    }

    /* Einzelner Button */
    .srmb-btn {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        padding: 10px 4px 8px;
        border-radius: 10px;
        text-decoration: none !important;
        color: #ffffff !important;
        font-size: 10.5px;
        font-weight: 600;
        line-height: 1.2;
        text-align: center;
        transition: transform 0.15s ease, box-shadow 0.15s ease;
        -webkit-tap-highlight-color: transparent;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);
    }

    .srmb-btn:hover,
    .srmb-btn:focus {
        text-decoration: none !important;
        color: #ffffff !important;
    }

    .srmb-btn:active {
        transform: scale(0.95);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
    }

    /* Google Brand Colors */
    .srmb-blue  { background: #4285F4; }
    .srmb-red   { background: #EA4335; }
    .srmb-green { background: #34A853; }
    .srmb-yellow { background: #FBBC05; color: #ffffff !important; }

    /* Icon */
    .srmb-icon {
        width: 26px;
        height: 26px;
        flex-shrink: 0;
    }

    /* Label */
    .srmb-btn span {
        display: block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
    }

    /* Body-Padding damit Inhalte nicht verdeckt werden */
    body {
        padding-bottom: 90px !important;
    }

    /* Safe-Area für iPhones mit Notch/Home-Indikator */
    @supports (padding-bottom: env(safe-area-inset-bottom)) {
        #srmb-mobile-bar {
            padding-bottom: env(safe-area-inset-bottom);
        }
        body {
            padding-bottom: calc(90px + env(safe-area-inset-bottom)) !important;
        }
    }
}