﻿.btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 0.75rem 1.5rem; font-size: 1rem; font-weight: 500;
    border-radius: var(--radius-md); cursor: pointer; transition: all 0.2s;
    border: 1px solid transparent; text-align: center;
}
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
.btn-primary { background-color: var(--riom-primary); color: var(--riom-surface); }
.btn-primary:hover:not(:disabled) { background-color: var(--riom-primary-dark); }
.btn-secondary { background-color: var(--riom-accent); color: var(--riom-surface); }
.btn-secondary:hover:not(:disabled) { filter: brightness(0.9); }
.btn-outline { background-color: transparent; border-color: var(--riom-border); color: var(--riom-text); }
.btn-outline:hover:not(:disabled) { background-color: var(--riom-background); border-color: var(--riom-text-muted); }
.btn-small { padding: 0.5rem 1rem; font-size: 0.875rem; }

.post-it {
    padding: 1rem; border-radius: var(--radius-sm); box-shadow: var(--shadow-sm);
    position: relative; border-left: 4px solid transparent;
    background: var(--postit-neutral); border-left-color: var(--postit-neutral-border);
    color: var(--postit-neutral-text);
}
.post-it[data-category="pain"] { background: var(--postit-pain); border-left-color: var(--postit-pain-border); color: var(--postit-pain-text); }
.post-it[data-category="need"] { background: var(--postit-need); border-left-color: var(--postit-need-border); color: var(--postit-need-text); }
.post-it[data-category="expectation"] { background: var(--postit-expectation); border-left-color: var(--postit-expectation-border); color: var(--postit-expectation-text); }
.post-it[data-category="like"] { background: var(--postit-like); border-left-color: var(--postit-like-border); color: var(--postit-like-text); }
.post-it[data-category="missing"] { background: var(--postit-missing); border-left-color: var(--postit-missing-border); color: var(--postit-missing-text); }
.post-it[data-category="change"] { background: var(--postit-change); border-left-color: var(--postit-change-border); color: var(--postit-change-text); }
.post-it[data-category="closing"] { background: var(--postit-neutral); border-left-color: var(--riom-primary); color: var(--riom-primary); }

.form-control {
    width: 100%; padding: 0.75rem; border: 1px solid var(--riom-border);
    border-radius: var(--radius-md); font-size: 1rem; background: var(--riom-surface); color: var(--riom-text);
}
.form-control:focus {
    outline: none; border-color: var(--riom-accent);
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25);
}
.badge {
    display: inline-block; padding: 0.25em 0.5em; font-size: 0.75rem; font-weight: 700;
    border-radius: var(--radius-sm); background: var(--riom-border); color: var(--riom-text);
}
