/**
 * ビーズアクセサリー個数計算ツール - 専用スタイル
 * （共通スタイルは handmade-common.css を参照）
 */

/* ========================================
   サイズプリセットボタン
   ======================================== */
.size-presets {
	margin-top: 14px;
	padding: 12px 14px;
	background: var(--color-bg);
	border-radius: var(--radius);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.size-presets-label {
	font-size: 12px;
	color: var(--color-text-secondary);
	flex-shrink: 0;
}

.size-presets-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.size-preset-btn {
	padding: 6px 12px;
	font-size: 12px;
	font-family: inherit;
	color: #b87333;
	background: var(--color-white);
	border: 1px solid #b87333;
	border-radius: 16px;
	cursor: pointer;
	transition: all 0.2s ease;
	white-space: nowrap;
}

.size-preset-btn:hover {
	color: var(--color-white);
	background: #b87333;
}

.size-preset-btn .preset-label {
	font-size: 10px;
	margin-right: 4px;
	opacity: 0.85;
}

/* ========================================
   レスポンシブ
   ======================================== */
@media (max-width: 600px) {
	.size-presets {
		flex-direction: column;
		align-items: flex-start;
	}
}