/* bewertung-widget — base styles
 * All selectors are scoped to .bw-root and prefixed with bw- to avoid collisions.
 * Variables (--bw-*) are injected per instance via an inline <style> tag.
 */

.bw-root {
    /* Defaults gemäß Corporate Design (siehe styleguide.md) — pro Instanz via Theme-Override anpassbar */
    --bw-color-primary:    #c61932;
    --bw-color-text:       #303030;
    --bw-color-muted:      #5f5f5f;
    --bw-color-background: #ffffff;
    --bw-color-star:       #c61932;
    --bw-radius:           2px;
    --bw-font-family:      inherit;
    --bw-gap:              16px;
    --bw-cols-desktop:     3;
    --bw-cols-tablet:      2;
    --bw-cols-mobile:      1;

    box-sizing: border-box;
    color: var(--bw-color-text);
    font-family: var(--bw-font-family);
    line-height: 1.55;
    text-align: left;
    direction: ltr;
}
.bw-root *,
.bw-root *::before,
.bw-root *::after { box-sizing: border-box; }
.bw-root :focus-visible { outline: 2px solid var(--bw-color-primary); outline-offset: 2px; border-radius: 4px; }

.bw-sr-heading {
    position: absolute !important;
    width: 1px; height: 1px; overflow: hidden;
    clip: rect(1px,1px,1px,1px); white-space: nowrap;
}

.bw-header {
    display: flex;
    align-items: center;
    gap: .85rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}
.bw-header__logo { flex: 0 0 auto; }
.bw-header__main { flex: 1 1 auto; min-width: 200px; }
.bw-header__title {
    font-size: 1.05rem;
    margin: 0;
    color: var(--bw-color-text);
    font-weight: 600;
}
.bw-header__meta {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    font-size: .9rem;
    color: var(--bw-color-muted);
}
.bw-header__rating { color: var(--bw-color-text); font-weight: 700; }
.bw-header__cta {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    padding: 0 1.25rem;
    height: 42px;
    border-radius: var(--bw-radius);
    background: var(--bw-color-primary);
    color: #fff;
    font-weight: 500;
    text-decoration: none;
    font-size: .95rem;
    line-height: 1;
}
.bw-header__cta:hover, .bw-header__cta:focus-visible { text-decoration: underline; color: #fff; }

.bw-stars { display: inline-flex; gap: 1px; vertical-align: -.15em; }
.bw-star { width: 16px; height: 16px; fill: #d2d4d8; flex-shrink: 0; }
.bw-star--full { fill: var(--bw-color-star); }
.bw-star--half .bw-star__bg { fill: #d2d4d8; }
.bw-star--half path:not(.bw-star__bg) { fill: var(--bw-color-star); }

.bw-card {
    background: var(--bw-color-background);
    color: var(--bw-color-text);
    padding: 1rem 1.1rem;
    /* Cards sind nicht-interaktiv → 0px gemäß Styleguide. --bw-radius bleibt für „Weiterlesen"-Buttons o.ä. */
    border-radius: 0;
    border: 1px solid #e5e7eb;
    box-shadow: 0 1px 2px rgba(0,0,0,.04);
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: .55rem;
    overflow: hidden;
    position: relative;
}
.bw-shadow-none .bw-card { box-shadow: none; }
.bw-shadow-hard .bw-card { box-shadow: 0 6px 18px rgba(0,0,0,.08); }
.bw-accent-top    .bw-card::before { content:""; position:absolute; left:0; right:0; top:0; height:3px; background: var(--bw-color-primary); }
.bw-accent-left   .bw-card::before { content:""; position:absolute; top:0; bottom:0; left:0; width:3px; background: var(--bw-color-primary); }

.bw-card__head { display: flex; gap: .75rem; align-items: center; }
.bw-card__avatar { flex: 0 0 auto; }
.bw-card__avatar svg, .bw-card__avatar img { display: block; border-radius: 50%; }
.bw-card__meta { flex: 1 1 auto; display: flex; flex-direction: column; min-width: 0; }
.bw-card__name {
    font-size: .95rem;
    font-weight: 600;
    color: var(--bw-color-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bw-card__name a { color: inherit; text-decoration: none; }
.bw-card__name a:hover { text-decoration: underline; }
.bw-card__date { font-size: .8rem; color: var(--bw-color-muted); }
.bw-card__text { font-size: .92rem; }
.bw-card__text p { margin: 0; }
.bw-card__more {
    appearance: none;
    background: none;
    border: 0;
    color: var(--bw-color-primary);
    font: inherit;
    font-weight: 600;
    padding: .25rem 0;
    cursor: pointer;
    min-height: 44px;
    text-align: left;
}
.bw-card__more:hover, .bw-card__more:focus-visible { text-decoration: underline; }
.bw-card__lang { color: var(--bw-color-muted); margin-top: .15rem; }

.bw-empty { color: var(--bw-color-muted); padding: 2rem; text-align: center; }

.bw-avatar { display: block; }

.bw-animate-fade .bw-card { animation: bw-fade .4s ease both; }
.bw-animate-slide .bw-card { animation: bw-slide .4s ease both; }
@keyframes bw-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes bw-slide { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

@media (prefers-reduced-motion: reduce) {
    .bw-root *, .bw-root *::before, .bw-root *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

@media print {
    .bw-header__cta, .bw-card__more { display: none; }
    .bw-card { box-shadow: none; border: 1px solid #ccc; }
}