/* heyde.schule - Modular CSS: 10_buttons.css */

/* --- Buttons & interaktive Icons Vereinheitlichung (Glass-Style) --- */
.button, .button-xs, .button-fullwidth, button, input[type="submit"], .page-link, .action-icon {
    font-family: var(--font);
    border-radius: var(--action-icon-radius);
    transition: all 0.3s ease;
    cursor: pointer;
    text-transform: uppercase;
    font-weight: 700;
    border: 1px solid var(--glass-border);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--petrol-light);
    color: #ffffff !important; /* Weißer Text auf Petrol */
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    padding: 8px 16px;
    font-size: 0.9rem;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
}

.button-xs, .action-icon {
    padding: 4px 8px !important;
    font-size: 1.2rem !important;
    min-width: 32px;
    height: 32px;
    background: var(--petrol-light) !important; /* Explizit Petrol auch für Icons */
}

.button:hover, .button-xs:hover, .button-fullwidth:hover, button:hover, .page-link:hover, .action-icon:hover {
    background: var(--petrol-dark) !important;
    border-color: var(--accent-1) !important;
    color: var(--petrol-accent) !important; /* Orangene Schrift */
    transform: translateY(-1px);
}

/* Fokus- und Auswahl-Zustand (wenn selektiert, aber nicht gehovert) */
.button:focus, .button-xs:focus, .button-fullwidth:focus, button:focus, 
.action-icon:focus, .button:active, button:active {
    background: var(--petrol-light); /* Hintergrund bleibt wie beim Standard */
    color: #ffffff !important;
    text-shadow: 0 0 8px var(--accent-1), 0 0 12px var(--accent-1); /* Orangener Glow hinter der Schrift */
    outline: none;
    border-color: var(--glass-border);
}

/* Spezialfall: focus-visible (Tastatur-Navigation) bekommt zusätzlich einen dezenten Rahmen */
.button:focus-visible, button:focus-visible {
    box-shadow: 0 0 0 3px rgba(199, 96, 45, 0.3);
}

.note-btn {
    background-color: var(--petrol-light) !important;
}