:root {
    --oqrc-blue-dark: #003C6D;
    --oqrc-blue-mid: #016282;
    --oqrc-blue-light: #6EC1E4;
    --oqrc-yellow: #F1C40F;
    --oqrc-gray-dark: #54595F;
    --oqrc-gray-mid: #7A7A7A;
    --oqrc-radius-pill: 999px;
    --oqrc-shadow-soft: 0 4px 16px rgba(0, 60, 109, 0.12);
}

.oqrc-ui-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 2px solid transparent;
    border-radius: var(--oqrc-radius-pill);
    font-family: inherit;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.oqrc-ui-btn:focus-visible {
    outline: 2px solid var(--oqrc-blue-mid);
    outline-offset: 2px;
}

.oqrc-ui-btn:hover:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: var(--oqrc-shadow-soft);
}

.oqrc-ui-btn:disabled,
.oqrc-ui-btn[aria-disabled="true"] {
    cursor: not-allowed;
    opacity: 0.6;
    box-shadow: none;
    transform: none;
}

.oqrc-ui-btn--sm {
    padding: 8px 16px;
    font-size: 13px;
}

.oqrc-ui-btn--md {
    padding: 11px 22px;
    font-size: 14px;
}

.oqrc-ui-btn--lg {
    padding: 14px 30px;
    font-size: 15px;
}

.oqrc-ui-btn--primary {
    background: var(--oqrc-yellow);
    border-color: var(--oqrc-yellow);
    color: #2b5f7f;
}

.oqrc-ui-btn--primary:hover:not(:disabled) {
    background: #e0b30d;
    border-color: #e0b30d;
    color: #fff;
}

.oqrc-ui-btn--secondary {
    background: #fff;
    border-color: var(--oqrc-blue-mid);
    color: var(--oqrc-blue-mid);
}

.oqrc-ui-btn--secondary:hover:not(:disabled) {
    background: #eef9fc;
}

.oqrc-ui-btn--ghost {
    background: transparent;
    border-color: transparent;
    color: var(--oqrc-blue-mid);
}

.oqrc-ui-btn--danger {
    background: #fbe9eb;
    border-color: #DC3545;
    color: #9f1d29;
}

.oqrc-ui-btn__label {
    line-height: 1.1;
}
