/* 
 * BFH Frontend Resets & Utilities (frontend.css)
 * Ensures consistency across the Elementor frontend.
 */

.bfh-element {
    /* Scoped reset for all BFH widgets */
    font-family: var(--bfh-font-sans);
    color: var(--bfh-text-primary);
    box-sizing: border-box;
    line-height: 1.5;
}

.bfh-element *,
.bfh-element *::before,
.bfh-element *::after {
    box-sizing: inherit;
}

/* Typography Resets */
.bfh-element h1, 
.bfh-element h2, 
.bfh-element h3, 
.bfh-element h4, 
.bfh-element h5, 
.bfh-element h6 {
    margin: 0;
    font-weight: var(--bfh-font-weight-semibold);
    color: var(--bfh-text-primary);
}

.bfh-element p {
    margin: 0 0 var(--bfh-space-4) 0;
    color: var(--bfh-text-secondary);
}

.bfh-element a {
    color: var(--bfh-color-primary);
    text-decoration: none;
    transition: color var(--bfh-anim-fast);
}

.bfh-element a:hover {
    color: var(--bfh-color-primary-hover);
}

/* Focus States (Accessibility) */
.bfh-element :focus-visible {
    outline: 2px solid var(--bfh-color-primary);
    outline-offset: 2px;
}

/* Utilities */
.bfh-flex { display: flex; }
.bfh-flex-col { display: flex; flex-direction: column; }
.bfh-items-center { align-items: center; }
.bfh-justify-between { justify-content: space-between; }
.bfh-justify-center { justify-content: center; }
.bfh-gap-2 { gap: var(--bfh-space-2); }
.bfh-gap-4 { gap: var(--bfh-space-4); }

.bfh-text-center { text-align: center; }
.bfh-text-sm { font-size: var(--bfh-text-sm); }
.bfh-text-muted { color: var(--bfh-text-muted); }

/* Screen Reader Only.
   Two names are supported because the widgets and the page templates were
   written against different vocabularies; both must keep working. */
.bfh-sr-only,
.bfh-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}